@zjlab-fe/data-hub-ui 0.21.7 → 0.23.0

package/es/components/permission-editor/permissionEditor/index.module.scss.js

@@ -0,0 +1,22 @@
+var style = document.createElement('style');
+style.textContent = `.index-module__tagReadonly___07aUd {
+  color: rgba(0, 0, 0, 0.88) !important;
+}
+
+.index-module__unEditable___d0ZQT .ant-tag-checkable-checked {
+  background-color: #1775fe !important;
+}
+
+.index-module__unEditable___d0ZQT .ant-tag-checkable {
+  cursor: default !important;
+}
+
+.index-module__unEditable___d0ZQT .ant-tag-checkable:not(.ant-tag-checkable-checked):hover {
+  background-color: transparent !important;
+  color: rgba(0, 0, 0, 0.88) !important;
+}`;
+document.head.appendChild(style);
+
+var tagReadonly = "index-module__tagReadonly___07aUd";var unEditable = "index-module__unEditable___d0ZQT";
+
+export { tagReadonly, unEditable };

package/es/components/permission-editor/permissionViewPopover/index.js

@@ -0,0 +1,9 @@
+import { jsx } from 'react/jsx-runtime';
+import { Popover } from 'antd';
+import PermissionEditor from '../permissionEditor/index.js';
+
+const PermissionViewPopover = ({ initialPermissions = [], children, title = '用户权限', width = 400, }) => {
+    return (jsx(Popover, { content: jsx(PermissionEditor, { initialPermissions: initialPermissions, editable: false }), title: title, overlayStyle: { width }, children: children }));
+};
+
+export { PermissionViewPopover as default };

package/es/components/popover-select/index.js

@@ -0,0 +1,42 @@
+import { __rest } from 'tslib';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { useState, useEffect } from 'react';
+import { popup, desc } from './index.module.scss.js';
+import { Select } from 'antd';
+
+// 递归辅助函数：递归查找第一个有效的desc
+const findFirstDesc = (options) => {
+    if (!options || options.length === 0)
+        return '';
+    for (const option of options) {
+        // 如果是分组选项，递归查找子选项
+        if (option.options && option.options.length > 0) {
+            const subDesc = findFirstDesc(option.options);
+            if (subDesc)
+                return subDesc;
+        }
+        // 如果是叶子节点且有desc，直接返回
+        else if (option.desc) {
+            return option.desc;
+        }
+    }
+    return '';
+};
+function PopoverSelect(_a) {
+    var { id, options, style: propsStyle, inline = false, wrapperStyle = {}, wrapperClassName = '', popupClassName = '' } = _a, rest = __rest(_a, ["id", "options", "style", "inline", "wrapperStyle", "wrapperClassName", "popupClassName"]);
+    const [activeDesc, setActiveDesc] = useState('');
+    const renderOption = (option) => {
+        const { label, desc } = option.data;
+        const handleMouseEnter = () => {
+            setActiveDesc(desc);
+        };
+        return (jsx("div", { style: { cursor: 'pointer', width: '100%' }, onMouseEnter: handleMouseEnter, children: label }));
+    };
+    useEffect(() => {
+        const firstDesc = findFirstDesc(options);
+        setActiveDesc(firstDesc);
+    }, [options]);
+    return (jsx("div", { id: id, className: `${wrapperClassName}`, style: Object.assign({ display: inline ? 'inline-block' : 'block' }, wrapperStyle), children: jsx(Select, Object.assign({ style: Object.assign({ width: 200 }, propsStyle), options: options, popupClassName: `${popup} ${popupClassName}`, optionRender: renderOption, dropdownRender: (menu) => (jsxs("div", { style: { position: 'relative' }, children: [jsx("div", { children: menu }), jsx("div", { style: { left: typeof (propsStyle === null || propsStyle === void 0 ? void 0 : propsStyle.width) === 'number' ? propsStyle.width - 2 : 198 }, className: desc, children: activeDesc })] })) }, rest)) }));
+}
+
+export { PopoverSelect as default };

package/es/components/popover-select/index.module.scss.js

@@ -0,0 +1,22 @@
+var style = document.createElement('style');
+style.textContent = `.index-module__popup___wWHPr {
+  height: 264px;
+  overflow: visible;
+}
+
+.index-module__desc___YCkWm {
+  position: absolute;
+  top: -4px;
+  z-index: 6000;
+  color: #666;
+  background-color: #e0e0e0;
+  width: 200px;
+  height: 256px;
+  padding: 4px;
+  border-radius: 4px;
+}`;
+document.head.appendChild(style);
+
+var popup = "index-module__popup___wWHPr";var desc = "index-module__desc___YCkWm";
+
+export { desc, popup };

package/es/components/radio-card/index.js

@@ -0,0 +1,23 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { Radio } from 'antd';
+import classNames from 'classnames';
+
+const RadioCard = ({ options, value, onChange, className, style }) => {
+    const handleChange = (e) => {
+        if (onChange) {
+            onChange(e.target.value);
+        }
+    };
+    const isContentOption = (option) => {
+        return 'content' in option && option.content !== undefined && option.content !== null;
+    };
+    return (jsx("div", { className: classNames('data-hub-ui-radio-card-container', className), style: style, children: jsx(Radio.Group, { onChange: handleChange, value: value, className: "data-hub-ui-radio-card-group", children: options.map((option) => {
+                // 先检查是否是 content 选项
+                if (isContentOption(option)) {
+                    return (jsx(Radio, { value: option.value, className: "data-hub-ui-radio-card-item", children: option.content }, option.value));
+                }
+                return (jsxs(Radio, { value: option.value, className: "data-hub-ui-radio-card-item", children: [jsx("b", { children: option.title }), option.desc && jsx("span", { className: "data-hub-ui-radio-card-description", children: option.desc })] }, option.value));
+            }) }) }));
+};
+
+export { RadioCard as default };

package/es/components/radio-card/index.scss.js

@@ -0,0 +1,58 @@
+var style = document.createElement('style');
+style.textContent = `.data-hub-ui-radio-card-container {
+  display: flex;
+  gap: 20px;
+}
+.data-hub-ui-radio-card-container .data-hub-ui-radio-card-item {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  flex-direction: row-reverse;
+  flex-wrap: wrap;
+  padding: 10px;
+  width: 360px;
+  min-height: 120px;
+  border: 1px solid #d9d9d9;
+  border-radius: 8px;
+  cursor: pointer;
+  /* transition: all 0.3s; */
+}
+.data-hub-ui-radio-card-container .data-hub-ui-radio-card-item .ant-radio {
+  margin-left: auto;
+  /* position: relative;
+  top: 18px */
+}
+.data-hub-ui-radio-card-container .data-hub-ui-radio-card-item:hover {
+  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
+  background-color: #f5f5f5;
+}
+.data-hub-ui-radio-card-container .data-hub-ui-radio-card-item.ant-radio-wrapper-checked {
+  border-color: #1890ff;
+  border-width: 2px;
+}
+.data-hub-ui-radio-card-container .data-hub-ui-radio-card-item.ant-radio-wrapper-checked .ant-radio-checked {
+  border-color: #1890ff;
+  border-width: 2px;
+  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
+  background-color: #e6f7ff;
+  outline: none;
+}
+.data-hub-ui-radio-card-container .data-hub-ui-radio-card-item .ant-radio-label {
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+}
+.data-hub-ui-radio-card-container .data-hub-ui-radio-card-description {
+  margin-top: 14px;
+  font-size: 12px;
+  color: #666;
+  flex: 1;
+}
+.data-hub-ui-radio-card-group {
+  display: flex;
+}
+.data-hub-ui-radio-card-container .ant-radio-group {
+  display: flex;
+  flex-wrap: wrap;
+}`;
+document.head.appendChild(style);

package/es/components/section-heading/classNames.js

@@ -0,0 +1,22 @@
+/**
+ * Get alignment class based on align prop
+ */
+function getAlignClass(align) {
+    return align === 'center'
+        ? 'dhu-text-center dhu-mx-auto'
+        : align === 'right'
+            ? 'dhu-text-right dhu-ml-auto'
+            : undefined;
+}
+/**
+ * Get title size classes based on size
+ */
+function getTitleSizeClasses(size) {
+    if (size === 'sm')
+        return 'dhu-text-[32px] dhu-leading-[44px]';
+    if (size === 'md')
+        return 'dhu-text-[36px] dhu-leading-[50px]';
+    return 'dhu-text-[40px] dhu-leading-[56px]';
+}
+
+export { getAlignClass, getTitleSizeClasses };

package/es/components/section-heading/components.js

@@ -0,0 +1,27 @@
+import { __rest } from 'tslib';
+import { jsx } from 'react/jsx-runtime';
+import React from 'react';
+import { Slot } from '@radix-ui/react-slot';
+import { cn } from '../../lib/utils.js';
+import { useSectionHeadingContext } from './context.js';
+import { getTitleSizeClasses } from './classNames.js';
+
+const Kicker = React.forwardRef(function Kicker(_a, ref) {
+    var { asChild, className } = _a, props = __rest(_a, ["asChild", "className"]);
+    const Comp = asChild ? Slot : 'div';
+    return (jsx(Comp, Object.assign({ ref: ref, className: cn('dhu-font-ali-55 dhu-text-lg dhu-leading-6 dhu-font-normal dhu-text-blue-5', className) }, props)));
+});
+const Title = React.forwardRef(function Title(_a, ref) {
+    var { asChild, className } = _a, props = __rest(_a, ["asChild", "className"]);
+    const Comp = asChild ? Slot : 'h2';
+    const { size } = useSectionHeadingContext();
+    const titleSizeClasses = getTitleSizeClasses(size);
+    return (jsx(Comp, Object.assign({ ref: ref, className: cn('dhu-m-0 dhu-font-ali-85 dhu-font-bold dhu-text-gray-10', titleSizeClasses, className) }, props)));
+});
+const Description = React.forwardRef(function Description(_a, ref) {
+    var { asChild, className } = _a, props = __rest(_a, ["asChild", "className"]);
+    const Comp = asChild ? Slot : 'div';
+    return (jsx(Comp, Object.assign({ ref: ref, className: cn('dhu-font-ali-55 dhu-text-lg dhu-leading-6 dhu-font-normal dhu-text-gray-500', className) }, props)));
+});
+
+export { Description, Kicker, Title };

package/es/components/section-heading/context.js

@@ -0,0 +1,13 @@
+import React from 'react';
+
+const SectionHeadingContext = React.createContext(null);
+// Hook to consume SectionHeading context
+function useSectionHeadingContext() {
+    const context = React.useContext(SectionHeadingContext);
+    if (!context) {
+        throw new Error('SectionHeading components must be used within SectionHeading.Root');
+    }
+    return context;
+}
+
+export { SectionHeadingContext, useSectionHeadingContext };