@jzwd/vnd-design 0.0.0-stage → 0.2.0

package/dist/mobile/FcUpload/style.css

@@ -0,0 +1,233 @@
+/* FcUpload 移动端样式：前缀 bcm-fc-upload */
+
+.bcm-fc-upload {
+  position: relative;
+  font-size: 14px;
+  color: rgba(0, 0, 0, 0.88);
+}
+
+.bcm-fc-upload-input {
+  display: none;
+}
+
+/* ---- 图片宫格形态 ---- */
+.bcm-fc-upload-grid {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  gap: 8px;
+}
+
+.bcm-fc-upload-tile {
+  position: relative;
+  aspect-ratio: 1 / 1;
+  border-radius: 8px;
+  overflow: hidden;
+  background: #fafafa;
+}
+
+.bcm-fc-upload-tile-img {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+  display: block;
+}
+
+.bcm-fc-upload-tile-ph {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 24px;
+  color: rgba(0, 0, 0, 0.45);
+}
+
+.bcm-fc-upload-tile-add {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  gap: 4px;
+  border: 1px dashed #d9d9d9;
+  background: #fafafa;
+  color: rgba(0, 0, 0, 0.65);
+  transition:
+    border-color 0.2s,
+    color 0.2s;
+}
+
+.bcm-fc-upload-tile-add:active {
+  border-color: #1677ff;
+  color: #1677ff;
+}
+
+.bcm-fc-upload-tile-add .antd-mobile-icon {
+  font-size: 22px;
+}
+
+.bcm-fc-upload-tile-mask {
+  position: absolute;
+  inset: 0;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  gap: 4px;
+  padding: 0 6px;
+  background: rgba(0, 0, 0, 0.5);
+  color: #fff;
+  font-size: 12px;
+}
+
+.bcm-fc-upload-tile-mask-error {
+  background: rgba(255, 77, 79, 0.75);
+  font-size: 16px;
+}
+
+.bcm-fc-upload-tile-mask-error span {
+  font-size: 11px;
+}
+
+.bcm-fc-upload-tile-del {
+  position: absolute;
+  top: 2px;
+  right: 2px;
+  width: 20px;
+  height: 20px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 50%;
+  background: rgba(0, 0, 0, 0.45);
+  color: #fff;
+  font-size: 12px;
+}
+
+/* ---- 文件列表形态 ---- */
+.bcm-fc-upload-rows {
+  display: flex;
+  flex-direction: column;
+}
+
+.bcm-fc-upload-row {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  padding: 10px 0;
+  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
+}
+
+.bcm-fc-upload-row-thumb {
+  flex: none;
+  width: 44px;
+  height: 44px;
+  border-radius: 6px;
+  overflow: hidden;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: #fafafa;
+  color: rgba(0, 0, 0, 0.45);
+  font-size: 20px;
+}
+
+.bcm-fc-upload-row-thumb img {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+  display: block;
+}
+
+.bcm-fc-upload-row-main {
+  flex: 1;
+  min-width: 0;
+}
+
+.bcm-fc-upload-row-name {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  font-size: 14px;
+}
+
+.bcm-fc-upload-row-sub {
+  margin-top: 2px;
+  font-size: 12px;
+  color: rgba(0, 0, 0, 0.45);
+}
+
+.bcm-fc-upload-row-sub.is-error {
+  color: #ff4d4f;
+}
+
+.bcm-fc-upload-row-progress {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  margin-top: 4px;
+}
+
+.bcm-fc-upload-row-progress .adm-progress {
+  flex: 1;
+}
+
+.bcm-fc-upload-row-progress span {
+  flex: none;
+  font-size: 12px;
+  color: rgba(0, 0, 0, 0.45);
+}
+
+.bcm-fc-upload-row-actions {
+  flex: none;
+  display: flex;
+  gap: 14px;
+  font-size: 18px;
+  color: rgba(0, 0, 0, 0.65);
+}
+
+.bcm-fc-upload-row-actions span:active {
+  color: #1677ff;
+}
+
+.bcm-fc-upload-addbtn {
+  margin-top: 12px;
+  height: 40px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 6px;
+  border: 1px dashed #d9d9d9;
+  border-radius: 8px;
+  background: #fafafa;
+  color: rgba(0, 0, 0, 0.65);
+  transition:
+    border-color 0.2s,
+    color 0.2s;
+}
+
+.bcm-fc-upload-addbtn:active {
+  border-color: #1677ff;
+  color: #1677ff;
+}
+
+/* ---- 引用确认弹窗 ---- */
+.bcm-fc-upload-refs {
+  text-align: left;
+}
+
+.bcm-fc-upload-refs-tip {
+  margin-bottom: 8px;
+  font-size: 13px;
+  color: rgba(0, 0, 0, 0.65);
+}
+
+.bcm-fc-upload-refs-list {
+  margin: 0 0 12px;
+  padding-left: 18px;
+  font-size: 13px;
+  color: rgba(0, 0, 0, 0.88);
+}
+
+.bcm-fc-upload-refs-list li {
+  margin-bottom: 4px;
+}

package/dist/mobile/index.d.ts

@@ -0,0 +1,13 @@
+/**
+ * 移动端入口（@jzwd/vnd-design/mobile）
+ * 基于 antd-mobile 的 H5 组件，与 PC 端共用同一套接口契约与上传编排
+ */
+export { default as FcUpload, FcUpload as FcUploadMobile } from './FcUpload';
+export type { FcMobileUploadFile, FcUploadMobileProps } from './FcUpload';
+export { default as FcImage, FcImage as FcImageMobile } from './FcImage';
+export type { FcImageMobileProps } from './FcImage';
+export { FC_DEFAULT_BASE_URL } from '../file-center/context';
+export type { FcComponentConfigProps } from '../file-center/context';
+export { uploadFile } from '../file-center/upload';
+export type { FcUploadOptions } from '../file-center/upload';
+export type { FcFileInfo, FcFileReference, FcUploadProgress, FcBizInfo } from '../file-center/types';

package/dist/mobile/index.js

@@ -0,0 +1,9 @@
+/**
+ * 移动端入口（@jzwd/vnd-design/mobile）
+ * 基于 antd-mobile 的 H5 组件，与 PC 端共用同一套接口契约与上传编排
+ */
+export { default as FcUpload, FcUpload as FcUploadMobile } from "./FcUpload";
+export { default as FcImage, FcImage as FcImageMobile } from "./FcImage";
+/* 文件中心配置直接通过组件 props 传入（appKey 必填，baseUrl 有内置默认值） */
+export { FC_DEFAULT_BASE_URL } from "../file-center/context";
+export { uploadFile } from "../file-center/upload";

package/package.json

@@ -1,6 +1,72 @@
 {
   "name": "@jzwd/vnd-design",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
-}
+  "version": "0.2.0",
+  "description": "Vnd design（简称 Vnd）组件库：继承 antd 全部组件，并提供公司自有业务组件（首个模块：文件中心 FileCenter）",
+  "license": "MIT",
+  "type": "module",
+  "keywords": ["vnd", "vnd-design", "react", "antd", "components", "upload", "file-center"],
+  "publishConfig": {
+    "access": "public"
+  },
+  "module": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    },
+    "./mobile": {
+      "types": "./dist/mobile/index.d.ts",
+      "import": "./dist/mobile/index.js"
+    },
+    "./dist/*": "./dist/*",
+    "./package.json": "./package.json"
+  },
+  "files": ["dist"],
+  "scripts": {
+    "build": "father build",
+    "dev": "father dev",
+    "typecheck": "tsc --noEmit",
+    "mock": "node mock/server.mjs",
+    "playground": "vite --config vite.playground.config.ts",
+    "docs": "dumi dev",
+    "docs:build": "dumi build",
+    "prepublishOnly": "father build"
+  },
+  "dependencies": {
+    "spark-md5": "^3.0.2"
+  },
+  "peerDependencies": {
+    "@ant-design/icons": ">=5.0.0",
+    "antd": ">=5.0.0",
+    "antd-mobile": ">=5.0.0",
+    "antd-mobile-icons": ">=0.3.0",
+    "dayjs": ">=1.11.0",
+    "react": ">=17.0.0",
+    "react-dom": ">=17.0.0"
+  },
+  "peerDependenciesMeta": {
+    "antd-mobile": {
+      "optional": true
+    },
+    "antd-mobile-icons": {
+      "optional": true
+    }
+  },
+  "devDependencies": {
+    "@ant-design/icons": "^5.5.1",
+    "@types/react": "^18.3.12",
+    "@types/react-dom": "^18.3.1",
+    "@vitejs/plugin-react": "^4.3.4",
+    "antd": "^5.22.0",
+    "antd-mobile": "^5.43.0",
+    "antd-mobile-icons": "^0.3.0",
+    "busboy": "^1.6.0",
+    "dayjs": "^1.11.13",
+    "father": "^4.5.1",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
+    "typescript": "^5.6.3",
+    "vite": "^5.4.11"
+  }
+}