bj-web-components 0.1.7

package/dist/web.d.ts

@@ -0,0 +1,434 @@
+import { CSSProperties } from 'react';
+import { ForwardRefExoticComponent } from 'react';
+import { InputHTMLAttributes } from 'react';
+import { JSX } from 'react/jsx-runtime';
+import { ReactNode } from 'react';
+import { RefAttributes } from 'react';
+
+declare interface BaseTooltipProps {
+    placement?: TooltipPlacement;
+    className?: string;
+    style?: CSSProperties;
+    /** 自定义弹层挂载容器，默认 document.body */
+    getPopupContainer?: () => HTMLElement;
+}
+
+export declare function BuCategoryDropdown({ data, value, onChange, placeholder, disabled, maxVisible, className, style, getPopupContainer, }: BuCategoryDropdownProps): JSX.Element;
+
+export declare interface BuCategoryDropdownProps {
+    /** 分类树数据 */
+    data: CategoryItem[];
+    /** 当前选中路径，数组索引对应层级 */
+    value?: string[];
+    /** 选中回调，返回新路径和对应的节点数组 */
+    onChange?: (value: string[], path: CategoryItem[]) => void;
+    /** 触发按钮占位文字 */
+    placeholder?: string;
+    /** 是否禁用整个组件 */
+    disabled?: boolean;
+    /** 每列最多显示几项，超出后出现滚动条，默认 6 */
+    maxVisible?: number;
+    className?: string;
+    style?: CSSProperties;
+    /** 自定义下拉面板挂载容器，返回目标 DOM 元素。默认挂载到 document.body */
+    getPopupContainer?: () => HTMLElement;
+}
+
+export declare const BuEmptyInputBox: ForwardRefExoticComponent<BuEmptyInputBoxProps & RefAttributes<HTMLInputElement>>;
+
+export declare type BuEmptyInputBoxLang = 'zh' | 'en';
+
+export declare type BuEmptyInputBoxMode = 'single' | 'bilingual';
+
+export declare interface BuEmptyInputBoxProps {
+    /** 单语 / 双语模式 */
+    mode?: BuEmptyInputBoxMode;
+    /** 双语模式下当前激活的语言 */
+    activeLang?: BuEmptyInputBoxLang;
+    onLangChange?: (lang: BuEmptyInputBoxLang) => void;
+    /** 受控值，与 antd Form 兼容 */
+    value?: string;
+    onChange?: (value: string) => void;
+    placeholder?: string;
+    maxLength?: number;
+    /** 错误状态 */
+    error?: boolean;
+    disabled?: boolean;
+    /** 点击删除按钮回调（传入时显示删除按钮） */
+    onDelete?: () => void;
+    /** Override display labels for i18n support */
+    labels?: {
+        zh?: string;
+        en?: string;
+    };
+    id?: string;
+    className?: string;
+    style?: CSSProperties;
+}
+
+export declare const BuInput: ForwardRefExoticComponent<BuInputProps & RefAttributes<HTMLInputElement | HTMLTextAreaElement>>;
+
+export declare type BuInputLang = 'zh' | 'en';
+
+export declare type BuInputMode = 'single' | 'bilingual';
+
+export declare interface BuInputProps {
+    /** 输入框类型：input（单行）| textarea（多行） */
+    type?: BuInputType;
+    /** 单语 / 双语模式 */
+    mode?: BuInputMode;
+    /** 双语模式下当前激活的语言 */
+    activeLang?: BuInputLang;
+    onLangChange?: (lang: BuInputLang) => void;
+    /** 受控值，与 antd Form 兼容 */
+    value?: string;
+    onChange?: (value: string) => void;
+    /** 标签文字 */
+    label?: string;
+    /** 是否必填（label 前显示红色 *） */
+    required?: boolean;
+    placeholder?: string;
+    /** 最大字符数，配合 showCount 使用 */
+    maxLength?: number;
+    /** 是否显示字符计数，双语模式下始终显示 */
+    showCount?: boolean;
+    /** 错误状态：无值时 placeholder 变红；有值时显示 errorMessage */
+    error?: boolean;
+    /** 错误提示文字（有输入值 + error=true 时显示在输入框下方） */
+    errorMessage?: string;
+    disabled?: boolean;
+    /** 数字步进器最小值（type='number' 时生效） */
+    min?: number;
+    /** 数字步进器最大值（type='number' 时生效） */
+    max?: number;
+    /** 数字步进器步长（type='number' 时生效） */
+    step?: number;
+    /** 输入框左侧 icon，如拖拽把手 */
+    leftIcon?: ReactNode;
+    /** 输入框右侧 icon，如删除按钮 */
+    rightIcon?: ReactNode;
+    /** 自定义语言切换按钮，替换内置的中文/EN 按钮，双语模式下生效 */
+    langToggle?: ReactNode;
+    /** 正在翻译中状态，显示 loading 指示器 */
+    translating?: boolean;
+    /** 翻译完成状态，显示对勾 */
+    translated?: boolean;
+    onBlur?: () => void;
+    /** Override display labels for i18n support */
+    labels?: {
+        zh?: string;
+        en?: string;
+    };
+    id?: string;
+    className?: string;
+    style?: CSSProperties;
+}
+
+export declare type BuInputType = 'input' | 'textarea' | 'number';
+
+export declare function BuModal({ open, title, mode, children, okText, cancelText, onOk, onCancel, onClose, activeLang, onLangChange, labels, hint, confirmLoading, width, className, style, }: BuModalProps): JSX.Element | null;
+
+export declare interface BuModalProps {
+    /** 是否显示弹窗 */
+    open?: boolean;
+    /** 弹窗标题 */
+    title?: string;
+    /** 弹窗模式：standard 双按钮 | bilingual 双语双按钮 | single 单按钮居中 */
+    mode?: ModalMode;
+    /** 弹窗内容 */
+    children?: ReactNode;
+    /** 确认按钮文字 */
+    okText?: string;
+    /** 取消按钮文字（standard / bilingual 模式生效） */
+    cancelText?: string;
+    /** 确认回调 */
+    onOk?: () => void;
+    /** 取消回调 */
+    onCancel?: () => void;
+    /** 关闭回调（点击 × 或遮罩） */
+    onClose?: () => void;
+    /** bilingual 模式下当前激活语言 */
+    activeLang?: ModalLang;
+    /** bilingual 模式下语言切换回调 */
+    onLangChange?: (lang: ModalLang) => void;
+    /** 按钮上方的提示文字，12px #999 */
+    hint?: string;
+    /** Override display labels for i18n support */
+    labels?: {
+        zh?: string;
+        en?: string;
+    };
+    /** 确认按钮加载中状态 */
+    confirmLoading?: boolean;
+    /** 弹窗宽度，默认 480px，作用于内层白框 */
+    width?: number | string;
+    /** 自定义类名，挂在最外层遮罩上（整个 modal） */
+    className?: string;
+    /** 自定义样式，作用于内层白框 */
+    style?: CSSProperties;
+}
+
+export declare function BuProductField({ options, value, onChange, placeholder, emptyText, onManageField, multiple, showSearch, showSort, addButtonText, onAdd, labels, className, style, getPopupContainer, }: BuProductFieldProps): JSX.Element;
+
+export declare interface BuProductFieldProps {
+    /** 可选项列表 */
+    options?: ProductFieldOption[];
+    /** 当前选中值（受控） */
+    value?: string[];
+    /** 选中变化回调 */
+    onChange?: (values: string[]) => void;
+    /** 触发器占位文字 */
+    placeholder?: string;
+    /** 无数据主文案 */
+    emptyText?: string;
+    /** 点击"管理字段"的回调 */
+    onManageField?: () => void;
+    /** 单选模式（默认多选） */
+    multiple?: boolean;
+    /** 是否显示搜索框（默认 true） */
+    showSearch?: boolean;
+    /** 是否显示排序按钮（默认 true） */
+    showSort?: boolean;
+    /** 底部新增区域内容（字符串或 React 元素），不传则不显示 */
+    addButtonText?: ReactNode;
+    /** 点击新增按钮的回调 */
+    onAdd?: () => void;
+    /** Override display labels for i18n support */
+    labels?: {
+        searchPlaceholder?: string;
+        sortDefault?: string;
+        sortAsc?: string;
+        sortDesc?: string;
+        noMatchText?: string;
+        manageFieldPre?: string;
+        manageFieldLink?: string;
+        manageFieldPost?: string;
+    };
+    className?: string;
+    style?: CSSProperties;
+    /** 自定义下拉面板挂载容器，返回目标 DOM 元素。默认挂载到 document.body */
+    getPopupContainer?: () => HTMLElement;
+}
+
+export declare const BuSwitch: {
+    ({ checked: controlledChecked, defaultChecked, onChange, disabled, loading, checkedChildren, unCheckedChildren, theme, activeColor, inactiveColor, className, style, }: BuSwitchProps): JSX.Element;
+    displayName: string;
+};
+
+export declare interface BuSwitchProps {
+    /** 是否选中（受控） */
+    checked?: boolean;
+    /** 初始是否选中（非受控） */
+    defaultChecked?: boolean;
+    /** 变化回调 */
+    onChange?: (checked: boolean) => void;
+    /** 是否禁用 */
+    disabled?: boolean;
+    /** 加载中 */
+    loading?: boolean;
+    /** 选中时的内容（显示在开关内部右侧） */
+    checkedChildren?: ReactNode;
+    /** 未选中时的内容（显示在开关内部左侧） */
+    unCheckedChildren?: ReactNode;
+    /** 颜色主题：light=黑灰系, dark=品牌红系 */
+    theme?: BuSwitchTheme;
+    /** 自定义选中颜色，覆盖 theme 默认色 */
+    activeColor?: string;
+    /** 自定义未选中颜色，覆盖 theme 默认色 */
+    inactiveColor?: string;
+    /** 自定义类名 */
+    className?: string;
+    /** 自定义样式 */
+    style?: CSSProperties;
+}
+
+/** 开关颜色主题 */
+export declare type BuSwitchTheme = 'light' | 'dark';
+
+export declare interface CategoryItem {
+    /** 唯一标识 */
+    value: string;
+    /** 显示文字 */
+    label: string;
+    /** 是否禁用（分类未创建好时不可选） */
+    disabled?: boolean;
+    /** 子分类 */
+    children?: CategoryItem[];
+}
+
+export declare function ConfirmTooltip({ placement, title, okText, cancelText, onOk, onCancel, className, style, }: ConfirmTooltipProps): JSX.Element;
+
+export declare interface ConfirmTooltipProps extends BaseTooltipProps {
+    title?: string;
+    okText?: string;
+    cancelText?: string;
+    onOk?: () => void;
+    onCancel?: () => void;
+}
+
+export declare function ContentTooltip({ placement, content, variant, className, style, }: ContentTooltipProps): JSX.Element;
+
+export declare interface ContentTooltipProps extends BaseTooltipProps {
+    content?: string;
+    variant?: TooltipVariant;
+}
+
+export declare function FileCard(props: FileCardProps): JSX.Element;
+
+export declare interface FileCardProps {
+    /** 文件名 */
+    fileName: string;
+    /** 文件类型 */
+    fileType: FileType;
+    /** 文件 URL（image 类型可展示缩略图） */
+    fileUrl?: string;
+    /** 自定义类名 */
+    className?: string;
+    /** 自定义样式 */
+    style?: CSSProperties;
+    /** 删除回调 */
+    onDelete?: () => void;
+    /** 修改文件名提交回调 */
+    onRename?: (newName: string) => void | Promise<void>;
+    /** 预览点击回调 */
+    onPreview?: () => void;
+}
+
+export declare type FileType = 'pdf' | 'image' | 'doc' | 'docx' | 'xls' | 'xlsx' | 'ppt' | 'pptx' | 'zip' | 'rar' | 'txt' | 'other';
+
+export declare type ModalLang = 'zh' | 'en';
+
+export declare type ModalMode = 'standard' | 'bilingual' | 'single';
+
+export declare const Pagination: (props: PaginationProps) => JSX.Element | null;
+
+export declare type PaginationAlign = 'start' | 'center' | 'end';
+
+export declare interface PaginationProps {
+    /** 国际化方法，默认返回原参数 */
+    t?: (text: string) => string;
+    current?: number;
+    defaultCurrent?: number;
+    pageSize?: number;
+    defaultPageSize?: number;
+    total?: number;
+    onChange?: (page: number, pageSize: number) => void;
+    onShowSizeChange?: (current: number, size: number) => void;
+    showSizeChanger?: boolean;
+    showQuickJumper?: boolean | {
+        goButton?: ReactNode;
+    };
+    pageSizeOptions?: number[];
+    disabled?: boolean;
+    hideOnSinglePage?: boolean;
+    showTotal?: boolean | ((total: number, range: [number, number]) => ReactNode);
+    size?: PaginationSize;
+    align?: PaginationAlign;
+    simple?: boolean;
+    /** 下拉弹框弹出位置，最高优先级。默认自动检测：底部空间不足时翻转到顶部 */
+    popupPlacement?: PopupPlacement;
+    className?: string;
+    style?: CSSProperties;
+}
+
+export declare type PaginationSize = 'small' | 'medium' | 'large';
+
+declare type PopupPlacement = 'bottom' | 'top';
+
+export declare interface ProductFieldOption {
+    /** 选项唯一标识 */
+    value: string;
+    /** 选项显示内容，支持字符串或 React 元素 */
+    label: ReactNode;
+    /** 搜索匹配文本，label 为 ReactNode 时必须提供，否则该选项不参与搜索过滤 */
+    searchText?: string;
+}
+
+export declare function ProgressTooltip({ placement, title, progress, className, style, }: ProgressTooltipProps): JSX.Element;
+
+export declare interface ProgressTooltipProps extends BaseTooltipProps {
+    title?: string;
+    progress?: number;
+}
+
+export declare function SkuInputCard({ id, name, onNameChange, mode, activeLang, onLangChange, showBody, error, onDelete, onPreviewImage, onDeleteImage, onUpload, onAssociate, images, labels, inputEvents, className, style, options, optionFilterProp, onSelect, onSearch, open: controlledOpen, onDropdownVisibleChange, }: SkuInputCardProps): JSX.Element;
+
+export declare interface SkuInputCardProps {
+    /** Drag handle id, for external DnD libraries */
+    id?: string;
+    /** Product name value */
+    name?: string;
+    onNameChange?: (value: string) => void;
+    /** single: no language toggle; bilingual: show 中文/EN toggle */
+    mode?: SkuInputMode;
+    /** Active language when mode is bilingual */
+    activeLang?: SkuInputLang;
+    onLangChange?: (lang: SkuInputLang) => void;
+    /** Show/hide the body content area */
+    showBody?: boolean;
+    /** Error state — red border + tinted input */
+    error?: boolean;
+    onDelete?: () => void;
+    /** Called when user clicks the preview button on an uploaded image */
+    onPreviewImage?: (url: string) => void;
+    /** Called when user clicks the delete button on an uploaded image */
+    onDeleteImage?: (url: string) => void;
+    /**
+     * Parent-provided upload handler. Receives the selected File and should
+     * return a URL string (or Promise<string>) to display the image.
+     * If not provided the component manages uploads internally.
+     */
+    onUpload?: (file: File) => string | Promise<string>;
+    /** Called when user clicks "关联图片". Parent is responsible for providing the image URL. */
+    onAssociate?: () => void;
+    /** Externally managed image list (URLs). Controls displayed images when provided. */
+    images?: string[];
+    /** Override display labels for i18n support */
+    labels?: {
+        namePlaceholder?: string;
+        uploadLocal?: string;
+        associateImage?: string;
+        searchPlaceholder?: string;
+        notFoundContent?: string;
+    };
+    /** Input event handlers applied to the name input element */
+    inputEvents?: Omit<InputHTMLAttributes<HTMLInputElement>, 'value' | 'onChange' | 'style' | 'className'>;
+    className?: string;
+    style?: CSSProperties;
+    /** Options for the search dropdown. When provided the input shows a dropdown on focus/type. */
+    options?: SkuInputOption[];
+    /** Custom filter: receives the option and the current input value; return true to show. */
+    optionFilterProp?: (option: SkuInputOption, inputValue: string) => boolean;
+    /** Called when user selects an option from the dropdown. */
+    onSelect?: (value: string, option: SkuInputOption) => void;
+    /** Called when input value changes while dropdown is active (for remote search). */
+    onSearch?: (value: string) => void;
+    /** Whether the dropdown is visible (controlled mode). */
+    open?: boolean;
+    /** Callback when dropdown visibility changes. */
+    onDropdownVisibleChange?: (visible: boolean) => void;
+}
+
+export declare type SkuInputLang = 'zh' | 'en';
+
+export declare type SkuInputMode = 'single' | 'bilingual';
+
+export declare interface SkuInputOption {
+    value: string;
+    label: ReactNode;
+    disabled?: boolean;
+}
+
+export declare type TooltipPlacement = 'auto' | 'top' | 'topLeft' | 'topRight' | 'bottom' | 'bottomLeft' | 'bottomRight' | 'left' | 'leftTop' | 'leftBottom' | 'right' | 'rightTop' | 'rightBottom';
+
+export declare type TooltipVariant = 'default' | 'light' | 'bordered' | 'tinted';
+
+export declare const TooltipWrapper: ForwardRefExoticComponent<TooltipWrapperProps & RefAttributes<HTMLDivElement>>;
+
+export declare interface TooltipWrapperProps {
+    children: React.ReactNode;
+    style?: CSSProperties;
+    className?: string;
+}
+
+export { }

package/dist/web.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("./Switch-4R9E-bDk.js");exports.BuCategoryDropdown=o.BuCategoryDropdown;exports.BuEmptyInputBox=o.BuEmptyInputBox;exports.BuInput=o.BuInput;exports.BuModal=o.BuModal;exports.BuProductField=o.BuProductField;exports.BuSwitch=o.BuSwitch;exports.ConfirmTooltip=o.ConfirmTooltip;exports.ContentTooltip=o.ContentTooltip;exports.FileCard=o.FileCard;exports.Pagination=o.Pagination;exports.ProgressTooltip=o.ProgressTooltip;exports.SkuInputCard=o.SkuInputCard;exports.TooltipWrapper=o.TooltipWrapper;

package/dist/web.mjs

@@ -0,0 +1,16 @@
+import { B as s, a as t, b as p, c as r, d as u, e as i, C as n, f as e, F as B, P as d, g as l, S as C, T } from "./Switch-D6dAcrxq.mjs";
+export {
+  s as BuCategoryDropdown,
+  t as BuEmptyInputBox,
+  p as BuInput,
+  r as BuModal,
+  u as BuProductField,
+  i as BuSwitch,
+  n as ConfirmTooltip,
+  e as ContentTooltip,
+  B as FileCard,
+  d as Pagination,
+  l as ProgressTooltip,
+  C as SkuInputCard,
+  T as TooltipWrapper
+};

package/dist/window.svg

@@ -0,0 +1 @@
+<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path fill-rule="evenodd" clip-rule="evenodd" d="M1.5 2.5h13v10a1 1 0 0 1-1 1h-11a1 1 0 0 1-1-1zM0 1h16v11.5a2.5 2.5 0 0 1-2.5 2.5h-11A2.5 2.5 0 0 1 0 12.5zm3.75 4.5a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5M7 4.75a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0m1.75.75a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5" fill="#666"/></svg>

package/package.json

@@ -0,0 +1,90 @@
+{
+  "name": "bj-web-components",
+  "version": "0.1.7",
+  "description": "Enterprise UI component library for Web, Mobile, and Mini-app platforms",
+  "keywords": [
+    "react",
+    "ui",
+    "component",
+    "design-system",
+    "web",
+    "mobile",
+    "miniapp"
+  ],
+  "author": "hkm-hfrl",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": ""
+  },
+  "private": false,
+  "main": "./dist/index.js",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.js"
+    },
+    "./react": {
+      "types": "./dist/react.d.ts",
+      "import": "./dist/react.mjs",
+      "require": "./dist/react.js"
+    },
+    "./web": {
+      "types": "./dist/web.d.ts",
+      "import": "./dist/web.mjs",
+      "require": "./dist/web.js"
+    },
+    "./mobile": {
+      "types": "./dist/mobile.d.ts",
+      "import": "./dist/mobile.mjs",
+      "require": "./dist/mobile.js"
+    },
+    "./miniapp": {
+      "types": "./dist/miniapp.d.ts",
+      "import": "./dist/miniapp.mjs",
+      "require": "./dist/miniapp.js"
+    },
+    "./shared": {
+      "types": "./dist/shared.d.ts",
+      "import": "./dist/shared.mjs",
+      "require": "./dist/shared.js"
+    },
+    "./style": "./dist/style.css"
+  },
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "preview": "vite preview",
+    "lint": "eslint",
+    "build:lib": "vite build --mode lib",
+    "build:lib:watch": "vite build --mode lib --watch"
+  },
+  "peerDependencies": {
+    "react": ">=17.0.0",
+    "react-dom": ">=17.0.0"
+  },
+  "devDependencies": {
+    "@tailwindcss/postcss": "^4",
+    "@types/node": "^20",
+    "@types/react": "^19",
+    "@types/react-dom": "^19",
+    "@vitejs/plugin-react": "^4.3.4",
+    "antd": "^6.3.3",
+    "eslint": "^9",
+    "less": "^4.6.4",
+    "lucide-react": "^0.577.0",
+    "react": "19.2.3",
+    "react-dom": "19.2.3",
+    "react-router-dom": "^6.30.3",
+    "tailwindcss": "^4",
+    "typescript": "^5",
+    "vite": "^6.0.7",
+    "vite-plugin-dts": "^4.3.0"
+  }
+}