persagy-vant 0.0.29 → 0.0.30

package/lib/uploader/Uploader.tsx

@@ -1,370 +0,0 @@
-import {
-  ref,
-  reactive,
-  defineComponent,
-  onBeforeUnmount,
-  type PropType,
-  type ExtractPropTypes,
-} from 'vue';
-
-// Utils
-import {
-  pick,
-  extend,
-  toArray,
-  isPromise,
-  truthProp,
-  Interceptor,
-  getSizeStyle,
-  makeArrayProp,
-  makeStringProp,
-  makeNumericProp,
-  type Numeric,
-  type ComponentInstance,
-} from '../utils';
-import {
-  bem,
-  name,
-  isOversize,
-  filterFiles,
-  isImageFile,
-  readFileContent,
-} from './utils';
-
-// Composables
-import { useCustomFieldValue } from '@vant/use';
-import { useExpose } from '../composables/use-expose';
-
-// Components
-import { Icon } from '../icon';
-import { ImagePreview, type ImagePreviewOptions } from '../image-preview';
-import UploaderPreviewItem from './UploaderPreviewItem';
-
-// Types
-import type { ImageFit } from '../image';
-import type {
-  UploaderExpose,
-  UploaderMaxSize,
-  UploaderAfterRead,
-  UploaderBeforeRead,
-  UploaderResultType,
-  UploaderFileListItem,
-} from './types';
-
-const uploaderProps = {
-  name: makeNumericProp(''),
-  accept: makeStringProp('image/*'),
-  capture: String,
-  multiple: Boolean,
-  disabled: Boolean,
-  readonly: Boolean,
-  lazyLoad: Boolean,
-  maxCount: makeNumericProp(Infinity),
-  imageFit: makeStringProp<ImageFit>('cover'),
-  resultType: makeStringProp<UploaderResultType>('dataUrl'),
-  uploadIcon: makeStringProp('photograph'),
-  uploadText: String,
-  deletable: truthProp,
-  afterRead: Function as PropType<UploaderAfterRead>,
-  showUpload: truthProp,
-  modelValue: makeArrayProp<UploaderFileListItem>(),
-  beforeRead: Function as PropType<UploaderBeforeRead>,
-  beforeDelete: Function as PropType<Interceptor>,
-  previewSize: [Number, String, Array] as PropType<
-    Numeric | [Numeric, Numeric]
-  >,
-  previewImage: truthProp,
-  previewOptions: Object as PropType<Partial<ImagePreviewOptions>>,
-  previewFullImage: truthProp,
-  maxSize: {
-    type: [Number, String, Function] as PropType<UploaderMaxSize>,
-    default: Infinity,
-  },
-};
-
-export type UploaderProps = ExtractPropTypes<typeof uploaderProps>;
-
-export default defineComponent({
-  name,
-
-  props: uploaderProps,
-
-  emits: [
-    'delete',
-    'oversize',
-    'click-upload',
-    'close-preview',
-    'click-preview',
-    'update:modelValue',
-  ],
-
-  setup(props, { emit, slots }) {
-    const inputRef = ref();
-    const urls: string[] = [];
-
-    const getDetail = (index = props.modelValue.length) => ({
-      name: props.name,
-      index,
-    });
-
-    const resetInput = () => {
-      if (inputRef.value) {
-        inputRef.value.value = '';
-      }
-    };
-
-    const onAfterRead = (
-      items: UploaderFileListItem | UploaderFileListItem[]
-    ) => {
-      resetInput();
-
-      if (isOversize(items, props.maxSize)) {
-        if (Array.isArray(items)) {
-          const result = filterFiles(items, props.maxSize);
-          items = result.valid;
-          emit('oversize', result.invalid, getDetail());
-
-          if (!items.length) {
-            return;
-          }
-        } else {
-          emit('oversize', items, getDetail());
-          return;
-        }
-      }
-      items = reactive(items);
-      emit('update:modelValue', [...props.modelValue, ...toArray(items)]);
-
-      if (props.afterRead) {
-        props.afterRead(items, getDetail());
-      }
-    };
-
-    const readFile = (files: File | File[]) => {
-      const { maxCount, modelValue, resultType } = props;
-
-      if (Array.isArray(files)) {
-        const remainCount = +maxCount - modelValue.length;
-
-        if (files.length > remainCount) {
-          files = files.slice(0, remainCount);
-        }
-
-        Promise.all(
-          files.map((file) => readFileContent(file, resultType))
-        ).then((contents) => {
-          const fileList = (files as File[]).map((file, index) => {
-            const result: UploaderFileListItem = {
-              file,
-              status: '',
-              message: '',
-            };
-
-            if (contents[index]) {
-              result.content = contents[index] as string;
-            }
-
-            return result;
-          });
-
-          onAfterRead(fileList);
-        });
-      } else {
-        readFileContent(files, resultType).then((content) => {
-          const result: UploaderFileListItem = {
-            file: files as File,
-            status: '',
-            message: '',
-          };
-
-          if (content) {
-            result.content = content;
-          }
-
-          onAfterRead(result);
-        });
-      }
-    };
-
-    const onChange = (event: Event) => {
-      const { files } = event.target as HTMLInputElement;
-
-      if (props.disabled || !files || !files.length) {
-        return;
-      }
-
-      const file =
-        files.length === 1 ? files[0] : ([].slice.call(files) as File[]);
-
-      if (props.beforeRead) {
-        const response = props.beforeRead(file, getDetail());
-
-        if (!response) {
-          resetInput();
-          return;
-        }
-
-        if (isPromise(response)) {
-          response
-            .then((data) => {
-              if (data) {
-                readFile(data);
-              } else {
-                readFile(file);
-              }
-            })
-            .catch(resetInput);
-          return;
-        }
-      }
-
-      readFile(file);
-    };
-
-    let imagePreview: ComponentInstance | undefined;
-
-    const onClosePreview = () => emit('close-preview');
-
-    const previewImage = (item: UploaderFileListItem) => {
-      if (props.previewFullImage) {
-        const imageFiles = props.modelValue.filter(isImageFile);
-        const images = imageFiles
-          .map((item) => {
-            if (item.file && !item.url && item.status !== 'failed') {
-              item.url = URL.createObjectURL(item.file);
-              urls.push(item.url);
-            }
-            return item.url;
-          })
-          .filter(Boolean) as string[];
-
-        imagePreview = ImagePreview(
-          extend(
-            {
-              images,
-              startPosition: imageFiles.indexOf(item),
-              onClose: onClosePreview,
-            },
-            props.previewOptions
-          )
-        );
-      }
-    };
-
-    const closeImagePreview = () => {
-      if (imagePreview) {
-        imagePreview.close();
-      }
-    };
-
-    const deleteFile = (item: UploaderFileListItem, index: number) => {
-      const fileList = props.modelValue.slice(0);
-      fileList.splice(index, 1);
-
-      emit('update:modelValue', fileList);
-      emit('delete', item, getDetail(index));
-    };
-
-    const renderPreviewItem = (item: UploaderFileListItem, index: number) => {
-      const needPickData = [
-        'imageFit',
-        'deletable',
-        'previewSize',
-        'beforeDelete',
-      ] as const;
-
-      const previewData = extend(
-        pick(props, needPickData),
-        pick(item, needPickData, true)
-      );
-
-      return (
-        <UploaderPreviewItem
-          v-slots={pick(slots, ['preview-cover', 'preview-delete'])}
-          item={item}
-          index={index}
-          onClick={() => emit('click-preview', item, getDetail(index))}
-          onDelete={() => deleteFile(item, index)}
-          onPreview={() => previewImage(item)}
-          {...pick(props, ['name', 'lazyLoad'])}
-          {...previewData}
-        />
-      );
-    };
-
-    const renderPreviewList = () => {
-      if (props.previewImage) {
-        return props.modelValue.map(renderPreviewItem);
-      }
-    };
-
-    const onClickUpload = (event: MouseEvent) => emit('click-upload', event);
-
-    const renderUpload = () => {
-      if (props.modelValue.length >= props.maxCount || !props.showUpload) {
-        return;
-      }
-
-      const Input = props.readonly ? null : (
-        <input
-          ref={inputRef}
-          type="file"
-          class={bem('input')}
-          accept={props.accept}
-          capture={props.capture as unknown as boolean}
-          multiple={props.multiple}
-          disabled={props.disabled}
-          onChange={onChange}
-        />
-      );
-
-      if (slots.default) {
-        return (
-          <div class={bem('input-wrapper')} onClick={onClickUpload}>
-            {slots.default()}
-            {Input}
-          </div>
-        );
-      }
-
-      return (
-        <div
-          class={bem('upload', { readonly: props.readonly })}
-          style={getSizeStyle(props.previewSize)}
-          onClick={onClickUpload}
-        >
-          <Icon name={props.uploadIcon} class={bem('upload-icon')} />
-          {props.uploadText && (
-            <span class={bem('upload-text')}>{props.uploadText}</span>
-          )}
-          {Input}
-        </div>
-      );
-    };
-
-    const chooseFile = () => {
-      if (inputRef.value && !props.disabled) {
-        inputRef.value.click();
-      }
-    };
-
-    onBeforeUnmount(() => {
-      urls.forEach((url) => URL.revokeObjectURL(url));
-    });
-
-    useExpose<UploaderExpose>({
-      chooseFile,
-      closeImagePreview,
-    });
-    useCustomFieldValue(() => props.modelValue);
-
-    return () => (
-      <div class={bem()}>
-        <div class={bem('wrapper', { disabled: props.disabled })}>
-          {renderPreviewList()}
-          {renderUpload()}
-        </div>
-      </div>
-    );
-  },
-});

package/lib/uploader/UploaderPreviewItem.tsx

@@ -1,143 +0,0 @@
-import { defineComponent, type PropType } from 'vue';
-
-// Utils
-import { t, bem, isImageFile } from './utils';
-import {
-  isDef,
-  extend,
-  numericProp,
-  getSizeStyle,
-  callInterceptor,
-  makeRequiredProp,
-  type Numeric,
-  type Interceptor,
-} from '../utils';
-
-// Components
-import { Icon } from '../icon';
-import { Image, ImageFit } from '../image';
-import { Loading } from '../loading';
-
-// Types
-import type { UploaderFileListItem } from './types';
-
-export default defineComponent({
-  props: {
-    name: numericProp,
-    item: makeRequiredProp<PropType<UploaderFileListItem>>(Object),
-    index: Number,
-    imageFit: String as PropType<ImageFit>,
-    lazyLoad: Boolean,
-    deletable: Boolean,
-    previewSize: [Number, String, Array] as PropType<
-      Numeric | [Numeric, Numeric]
-    >,
-    beforeDelete: Function as PropType<Interceptor>,
-  },
-
-  emits: ['delete', 'preview'],
-
-  setup(props, { emit, slots }) {
-    const renderMask = () => {
-      const { status, message } = props.item;
-
-      if (status === 'uploading' || status === 'failed') {
-        const MaskIcon =
-          status === 'failed' ? (
-            <Icon name="close" class={bem('mask-icon')} />
-          ) : (
-            <Loading class={bem('loading')} />
-          );
-
-        const showMessage = isDef(message) && message !== '';
-
-        return (
-          <div class={bem('mask')}>
-            {MaskIcon}
-            {showMessage && <div class={bem('mask-message')}>{message}</div>}
-          </div>
-        );
-      }
-    };
-
-    const onDelete = (event: MouseEvent) => {
-      const { name, item, index, beforeDelete } = props;
-      event.stopPropagation();
-      callInterceptor(beforeDelete, {
-        args: [item, { name, index }],
-        done: () => emit('delete'),
-      });
-    };
-
-    const onPreview = () => emit('preview');
-
-    const renderDeleteIcon = () => {
-      if (props.deletable && props.item.status !== 'uploading') {
-        const slot = slots['preview-delete'];
-        return (
-          <div
-            role="button"
-            class={bem('preview-delete', { shadow: !slot })}
-            tabindex={0}
-            aria-label={t('delete')}
-            onClick={onDelete}
-          >
-            {slot ? (
-              slot()
-            ) : (
-              <Icon name="cross" class={bem('preview-delete-icon')} />
-            )}
-          </div>
-        );
-      }
-    };
-
-    const renderCover = () => {
-      if (slots['preview-cover']) {
-        const { index, item } = props;
-        return (
-          <div class={bem('preview-cover')}>
-            {slots['preview-cover'](extend({ index }, item))}
-          </div>
-        );
-      }
-    };
-
-    const renderPreview = () => {
-      const { item, lazyLoad, imageFit, previewSize } = props;
-
-      if (isImageFile(item)) {
-        return (
-          <Image
-            v-slots={{ default: renderCover }}
-            fit={imageFit}
-            src={item.content || item.url}
-            class={bem('preview-image')}
-            width={Array.isArray(previewSize) ? previewSize[0] : previewSize}
-            height={Array.isArray(previewSize) ? previewSize[1] : previewSize}
-            lazyLoad={lazyLoad}
-            onClick={onPreview}
-          />
-        );
-      }
-
-      return (
-        <div class={bem('file')} style={getSizeStyle(props.previewSize)}>
-          <Icon class={bem('file-icon')} name="description" />
-          <div class={[bem('file-name'), 'van-ellipsis']}>
-            {item.file ? item.file.name : item.url}
-          </div>
-          {renderCover()}
-        </div>
-      );
-    };
-
-    return () => (
-      <div class={bem('preview')}>
-        {renderPreview()}
-        {renderMask()}
-        {renderDeleteIcon()}
-      </div>
-    );
-  },
-});

package/lib/uploader/index.ts

@@ -1,17 +0,0 @@
-import { withInstall } from '../utils';
-import _Uploader, { UploaderProps } from './Uploader';
-
-export const Uploader = withInstall(_Uploader);
-export default Uploader;
-export type { UploaderProps };
-export type {
-  UploaderInstance,
-  UploaderResultType,
-  UploaderFileListItem,
-} from './types';
-
-declare module 'vue' {
-  export interface GlobalComponents {
-    VanUploader: typeof Uploader;
-  }
-}

package/lib/uploader/types.ts

@@ -1,47 +0,0 @@
-import type { ComponentPublicInstance } from 'vue';
-import type { ImageFit } from '../image';
-import type { Numeric, Interceptor } from '../utils';
-import type { UploaderProps } from './Uploader';
-
-export type UploaderResultType = 'dataUrl' | 'text' | 'file';
-
-export type UploaderFileListItem = {
-  url?: string;
-  file?: File;
-  content?: string;
-  isImage?: boolean;
-  status?: '' | 'uploading' | 'done' | 'failed';
-  message?: string;
-  imageFit?: ImageFit;
-  deletable?: boolean;
-  previewSize?: Numeric;
-  beforeDelete?: Interceptor;
-};
-
-export type UploaderMaxSize = Numeric | ((file: File) => boolean);
-
-export type UploaderBeforeRead = (
-  file: File | File[],
-  detail: {
-    name: Numeric;
-    index: number;
-  }
-) => boolean | undefined | Promise<File | File[] | undefined>;
-
-export type UploaderAfterRead = (
-  items: UploaderFileListItem | UploaderFileListItem[],
-  detail: {
-    name: Numeric;
-    index: number;
-  }
-) => void;
-
-export type UploaderExpose = {
-  chooseFile: () => void;
-  closeImagePreview: () => void;
-};
-
-export type UploaderInstance = ComponentPublicInstance<
-  UploaderProps,
-  UploaderExpose
->;

package/lib/uploader/utils.ts

@@ -1,90 +0,0 @@
-import { toArray, createNamespace, isFunction } from '../utils';
-import type {
-  UploaderMaxSize,
-  UploaderResultType,
-  UploaderFileListItem,
-} from './types';
-
-const [name, bem, t] = createNamespace('uploader');
-
-export { name, bem, t };
-
-export function readFileContent(file: File, resultType: UploaderResultType) {
-  return new Promise<string | void>((resolve) => {
-    if (resultType === 'file') {
-      resolve();
-      return;
-    }
-
-    const reader = new FileReader();
-
-    reader.onload = (event) => {
-      resolve((event.target as FileReader).result as string);
-    };
-
-    if (resultType === 'dataUrl') {
-      reader.readAsDataURL(file);
-    } else if (resultType === 'text') {
-      reader.readAsText(file);
-    }
-  });
-}
-
-export function isOversize(
-  items: UploaderFileListItem | UploaderFileListItem[],
-  maxSize: UploaderMaxSize
-): boolean {
-  return toArray(items).some((item) => {
-    if (item.file) {
-      if (isFunction(maxSize)) {
-        return maxSize(item.file);
-      }
-      return item.file.size > maxSize;
-    }
-    return false;
-  });
-}
-
-export function filterFiles(
-  items: UploaderFileListItem[],
-  maxSize: UploaderMaxSize
-) {
-  const valid: UploaderFileListItem[] = [];
-  const invalid: UploaderFileListItem[] = [];
-
-  items.forEach((item) => {
-    if (isOversize(item, maxSize)) {
-      invalid.push(item);
-    } else {
-      valid.push(item);
-    }
-  });
-
-  return { valid, invalid };
-}
-
-const IMAGE_REGEXP = /\.(jpeg|jpg|gif|png|svg|webp|jfif|bmp|dpg)/i;
-
-export const isImageUrl = (url: string): boolean => IMAGE_REGEXP.test(url);
-
-export function isImageFile(item: UploaderFileListItem): boolean {
-  // some special urls cannot be recognized
-  // user can add `isImage` flag to mark it as an image url
-  if (item.isImage) {
-    return true;
-  }
-
-  if (item.file && item.file.type) {
-    return item.file.type.indexOf('image') === 0;
-  }
-
-  if (item.url) {
-    return isImageUrl(item.url);
-  }
-
-  if (typeof item.content === 'string') {
-    return item.content.indexOf('data:image') === 0;
-  }
-
-  return false;
-}

package/lib/utils/basic.ts

@@ -1,42 +0,0 @@
-import { isObject } from './validate';
-import type { ComponentPublicInstance } from 'vue';
-
-export function noop() {}
-
-export const extend = Object.assign;
-
-export const inBrowser = typeof window !== 'undefined';
-
-export type Numeric = number | string;
-
-// eslint-disable-next-line
-export type ComponentInstance = ComponentPublicInstance<{}, any>;
-
-export function get(object: any, path: string): any {
-  const keys = path.split('.');
-  let result = object;
-
-  keys.forEach((key) => {
-    result = isObject(result) ? result[key] ?? '' : '';
-  });
-
-  return result;
-}
-
-export type Writeable<T> = { -readonly [P in keyof T]: T[P] };
-
-export function pick<T, U extends keyof T>(
-  obj: T,
-  keys: ReadonlyArray<U>,
-  ignoreUndefined?: boolean
-) {
-  return keys.reduce((ret, key) => {
-    if (!ignoreUndefined || obj[key] !== undefined) {
-      ret[key] = obj[key];
-    }
-    return ret;
-  }, {} as Writeable<Pick<T, U>>);
-}
-
-export const toArray = <T>(item: T | T[]): T[] =>
-  Array.isArray(item) ? item : [item];