@pisell/materials 1.0.498 → 1.0.500

package/lib/components/dataSourceComponents/fields/Upload/ReadPretty.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
 import { UploadProps } from './type';
 import './ReadPretty.less';
-declare const UploadReadPretty: (props: UploadProps) => React.JSX.Element | null;
+declare const UploadReadPretty: (props: UploadProps) => React.JSX.Element[] | null;
 export default UploadReadPretty;

package/lib/components/dataSourceComponents/fields/Upload/ReadPretty.js

@@ -34,17 +34,37 @@ __export(ReadPretty_exports, {
 module.exports = __toCommonJS(ReadPretty_exports);
 var import_react = __toESM(require("react"));
 var import_antd = require("antd");
+var import_utils = require("@pisell/utils");
+var import_useTranslationOriginal = __toESM(require("../../../../hooks/useTranslationOriginal"));
 var import_fallback = __toESM(require("./fallback.png"));
 var import_ReadPretty = require("./ReadPretty.less");
 var UploadReadPretty = (props) => {
-  if (!props.value) {
+  const { value, enableMultilingual } = props;
+  const translationOriginal = (0, import_useTranslationOriginal.default)();
+  const normalizedValue = (0, import_react.useMemo)(() => {
+    if (!value)
+      return [];
+    let processedValue = (0, import_utils.isArr)(value) ? value : [value];
+    processedValue = processedValue.map((item) => {
+      if (!item) {
+        return null;
+      }
+      if ((0, import_utils.isString)(item)) {
+        return item;
+      }
+      return translationOriginal(item);
+    });
+    return processedValue.filter((item) => !!item);
+  }, [value, enableMultilingual, translationOriginal]);
+  if (!normalizedValue.length) {
     return null;
   }
-  return /* @__PURE__ */ import_react.default.createElement(
+  return normalizedValue.map((item, index) => /* @__PURE__ */ import_react.default.createElement(
     import_antd.Image,
     {
+      key: `${String(item)}-${index}`,
       className: "pisell-upload-read-pretty",
-      src: props == null ? void 0 : props.value,
+      src: String(item),
       width: 100,
       height: 100,
       fallback: import_fallback.default,
@@ -52,6 +72,6 @@ var UploadReadPretty = (props) => {
         maskClassName: "pisell-upload-read-pretty-mask"
       }
     }
-  );
+  ));
 };
 var ReadPretty_default = UploadReadPretty;

package/lib/components/dataSourceComponents/fields/Upload/constants.d.ts

@@ -0,0 +1,9 @@
+export declare const SUPPORTED_LANGUAGES: readonly ["original", "en", "zh-CN", "zh-HK"];
+export declare const DEFAULT_MAX_COUNT = 9;
+export declare const DEFAULT_UID = "-1";
+export declare const MEDIA_TYPES: {
+    readonly VIDEO: "video/";
+    readonly AUDIO: "audio/";
+};
+export declare const IMAGE_QUALITY = 0.8;
+export declare const IMAGE_TYPE = "image/jpeg";

package/lib/components/dataSourceComponents/fields/Upload/constants.js

@@ -0,0 +1,47 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/dataSourceComponents/fields/Upload/constants.ts
+var constants_exports = {};
+__export(constants_exports, {
+  DEFAULT_MAX_COUNT: () => DEFAULT_MAX_COUNT,
+  DEFAULT_UID: () => DEFAULT_UID,
+  IMAGE_QUALITY: () => IMAGE_QUALITY,
+  IMAGE_TYPE: () => IMAGE_TYPE,
+  MEDIA_TYPES: () => MEDIA_TYPES,
+  SUPPORTED_LANGUAGES: () => SUPPORTED_LANGUAGES
+});
+module.exports = __toCommonJS(constants_exports);
+var SUPPORTED_LANGUAGES = ["original", "en", "zh-CN", "zh-HK"];
+var DEFAULT_MAX_COUNT = 9;
+var DEFAULT_UID = "-1";
+var MEDIA_TYPES = {
+  VIDEO: "video/",
+  AUDIO: "audio/"
+};
+var IMAGE_QUALITY = 0.8;
+var IMAGE_TYPE = "image/jpeg";
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  DEFAULT_MAX_COUNT,
+  DEFAULT_UID,
+  IMAGE_QUALITY,
+  IMAGE_TYPE,
+  MEDIA_TYPES,
+  SUPPORTED_LANGUAGES
+});

package/lib/components/dataSourceComponents/fields/Upload/index.less

@@ -1,3 +1,6 @@
+.pisell-lowcode-upload {
+  position: relative;
+}
 .pisell-upload-button {
   border: 0;
   background: none;
@@ -7,6 +10,18 @@
     margin-top: 8px;
   }
 
+  .pisell-upload-globe-icon {
+    position: absolute;
+    right: 6px;
+    bottom: 6px;
+    cursor: pointer;
+    color: #98A2B3;
+    font-size: 20px;
+    &:hover {
+      transition: color 0.3s;
+      color: var(--theme-color);
+    }
+  }
   // &[disabled] {
   //   opacity: 0.4;
   // }
@@ -19,4 +34,45 @@
       }
     }
   }
+}
+
+.pisell-upload-multilingual-container {
+  padding: 24px 0;
+
+  .pisell-upload-multilingual-item {
+    margin-bottom: 24px;
+    &-title {
+      font-size: 14px;
+      font-weight: 500;
+      color: #344054;
+      margin-bottom: 8px;
+    }
+
+    &-content {
+      .ant-upload-wrapper {
+        .ant-upload-list {
+          .ant-upload-list-item-container {
+            width: 100px;
+            height: 100px;
+          }
+        }
+        .ant-upload.ant-upload-select {
+          width: 100px;
+          height: 100px;
+        }
+      }
+    }
+  }
+}
+
+.pisell-upload-multilingual-icon {
+  color: #fff;
+  font-size: 16px;
+}
+
+.pisell-lowcode-image-preview-wrap {
+  z-index: 1201 !important;
+}
+.pisell-lowcode-image-preview-mask {
+  z-index: 1201 !important;
 }

package/lib/components/dataSourceComponents/fields/Upload/type.d.ts

@@ -1,5 +1,5 @@
 import { UploadFile as AntdUploadFile } from 'antd/es/upload/interface';
-import { PisellUploadProps } from '../../../pisellUpload';
+import type { UploadValue, UploadChangeHandler } from './types';
 export interface UploadFile extends AntdUploadFile {
     metadata?: {
         width?: number;
@@ -8,19 +8,20 @@ export interface UploadFile extends AntdUploadFile {
         bitrate?: number;
     };
 }
-export interface UploadProps extends PisellUploadProps {
-    renderMode?: 'read' | 'edit';
-    value?: string | string[];
-    allowMediaLibrary?: boolean;
-    allowLocalUpload?: boolean;
-    allowPreview?: boolean;
-    maxSize: number;
+export interface UploadProps {
+    renderMode?: string;
+    maxSize?: number;
     minCount?: number;
     maxCount?: number;
+    multiple?: boolean;
+    presetType?: string[];
+    customType?: string[];
     enablePresetType?: boolean;
-    presetType?: (number | string)[];
     enableCustomType?: boolean;
-    customType?: string[];
-    multiple: boolean;
+    allowPreview?: boolean;
+    value?: UploadValue;
     typeMaxSizeMap?: Record<string, number>;
+    enableMultilingual?: boolean;
+    onChange?: UploadChangeHandler;
+    disabled?: boolean;
 }

package/lib/components/dataSourceComponents/fields/Upload/types.d.ts

@@ -0,0 +1,48 @@
+import type { UploadFile } from 'antd/es/upload/interface';
+import { SUPPORTED_LANGUAGES } from './constants';
+export declare type Language = typeof SUPPORTED_LANGUAGES[number];
+export interface MediaMetadata {
+    width?: number;
+    height?: number;
+    duration?: number;
+    bitrate?: number;
+    cover?: File;
+}
+export interface FileCountValidation {
+    multiple: boolean;
+    minCount: number;
+    maxCount: number;
+    valueLength: number;
+}
+export interface ValidationResult {
+    success: boolean;
+    message?: string;
+}
+export interface MultilingualFile extends UploadFile {
+    multilingual?: SingleMultilingualValue;
+    multilingualFileList?: Record<Language, UploadFile[]>;
+    response?: {
+        status: boolean;
+        data: {
+            url: string;
+        };
+    };
+}
+export interface FileListOptions {
+    enableMultilingual: boolean;
+    multiple: boolean;
+}
+export declare type SingleUploadValue = string;
+export declare type MultipleUploadValue = string[];
+export declare type SingleMultilingualValue = Record<Language, string>;
+export declare type MultipleMultilingualValue = SingleMultilingualValue[];
+export declare type UploadValue = SingleUploadValue | MultipleUploadValue | SingleMultilingualValue | MultipleMultilingualValue;
+export interface MultilingualUploadResponse {
+    status: boolean;
+    data: {
+        url: string;
+    };
+}
+export declare type UploadChangeHandler = (value: UploadValue) => void;
+export declare type NonNullMultilingualValue = NonNullable<SingleMultilingualValue>;
+export declare type NonNullMultilingualArray = NonNullMultilingualValue[];

package/lib/components/dataSourceComponents/fields/Upload/types.js

@@ -0,0 +1,17 @@
+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/components/dataSourceComponents/fields/Upload/types.ts
+var types_exports = {};
+module.exports = __toCommonJS(types_exports);

package/lib/components/dataSourceComponents/fields/Upload/utils.d.ts

@@ -1,16 +1,16 @@
+import { RcFile, UploadFile } from 'antd/es/upload/interface';
+import type { MediaMetadata, FileCountValidation, ValidationResult, MultilingualFile, FileListOptions, UploadValue, SingleMultilingualValue } from './types';
+export declare const generateUid: () => string;
 export declare const getSuffix: (name: string) => string;
 export declare const getPointSuffix: (name: string) => string;
 export declare const getFileType: (name: string) => string;
-export declare const getPresetTypes: (presetTypes?: string[]) => string[];
-export declare const checkFileCount: ({ multiple, minCount, maxCount, valueLength, }: {
-    multiple: boolean;
-    minCount: number;
-    maxCount: number;
-    valueLength: number;
-}) => {
-    success: boolean;
-    message: any;
-} | {
-    success: boolean;
-    message?: undefined;
-};
+export declare const getFileName: (url: string) => string;
+export declare const checkFileCount: ({ multiple, minCount, maxCount, valueLength, }: FileCountValidation) => ValidationResult;
+export declare const getMediaMetadata: (file: RcFile) => Promise<MediaMetadata | null>;
+export declare const genFileListByString: (value: string) => UploadFile[];
+export declare const createMultilingualData: (value: string) => SingleMultilingualValue;
+export declare const createMultilingualFileList: (value: string) => Record<string, UploadFile<any>[]>;
+export declare const getDefaultFileList: (value: UploadValue | undefined, options: FileListOptions) => MultilingualFile[];
+export declare const getFileMetadataParams: (file: RcFile & {
+    metadata?: MediaMetadata;
+}) => Record<string, any>;