@fewangsit/wangsvue-fats 1.0.0-alpha.20 → 1.0.0-alpha.22

package/components/image/Image.vue.d.ts

@@ -1,403 +0,0 @@
-/* eslint-disable @typescript-eslint/no-explicit-any */
-/**
- *
- * Displays an image with preview.
- *
- * [Live Demo](https://www.WangsVue.org/image/)
- *
- * @module image
- *
- */
-import { TransitionProps, VNode } from 'vue';
-import { ComponentHooks } from '../basecomponent';
-import { PassThroughOptions } from '../passthrough';
-import {
-  ClassComponent,
-  GlobalComponentConstructor,
-  PassThrough,
-} from '../ts-helpers';
-
-export declare type ImagePassThroughOptionType =
-  | ImagePassThroughAttributes
-  | ((
-      options: ImagePassThroughMethodOptions,
-    ) => ImagePassThroughAttributes | string)
-  | string
-  | null
-  | undefined;
-
-export declare type ImagePassThroughTransitionType =
-  | TransitionProps
-  | ((options: ImagePassThroughMethodOptions) => TransitionProps)
-  | undefined;
-
-/**
- * Custom passthrough(pt) option method.
- */
-export interface ImagePassThroughMethodOptions {
-  /**
-   * Defines instance.
-   */
-  instance: any;
-  /**
-   *ˆ
-   * Defines valid properties.
-   */
-  props: ImageProps;
-  /**
-   * Defines current inline state.
-   */
-  state: ImageState;
-  /**
-   * Defines valid attributes.
-   */
-  attrs: any;
-  /**
-   * Defines parent options.
-   */
-  parent: any;
-  /**
-   * Defines passthrough(pt) options in global config.
-   */
-  global: object | undefined;
-}
-
-/**
- * Custom passthrough(pt) options.
- * @see {@link ImageProps.pt}
- */
-export interface ImagePassThroughOptions {
-  /**
-   * Used to pass attributes to the root's DOM element.
-   */
-  root?: ImagePassThroughOptionType;
-  /**
-   * Used to pass attributes to the image's DOM element.
-   */
-  image?: ImagePassThroughOptionType;
-  /**
-   * Used to pass attributes to the button's DOM element.
-   */
-  button?: ImagePassThroughOptionType;
-  /**
-   * Used to pass attributes to the icon's DOM element.
-   */
-  icon?: ImagePassThroughOptionType;
-  /**
-   * Used to pass attributes to the mask's DOM element.
-   */
-  mask?: ImagePassThroughOptionType;
-  /**
-   * Used to pass attributes to the toolbar's DOM element.
-   */
-  toolbar?: ImagePassThroughOptionType;
-  /**
-   * Used to pass attributes to the rotate right button's DOM element.
-   */
-  rotateRightButton?: ImagePassThroughOptionType;
-  /**
-   * Used to pass attributes to the rotate right icon's DOM element.
-   */
-  rotateRightIcon?: ImagePassThroughOptionType;
-  /**
-   * Used to pass attributes to the rotate left button's DOM element.
-   */
-  rotateLeftButton?: ImagePassThroughOptionType;
-  /**
-   * Used to pass attributes to the rotate left icon's DOM element.
-   */
-  rotateLeftIcon?: ImagePassThroughOptionType;
-  /**
-   * Used to pass attributes to the zoom out button's DOM element.
-   */
-  zoomOutButton?: ImagePassThroughOptionType;
-  /**
-   * Used to pass attributes to the zoom out icon's DOM element.
-   */
-  zoomOutIcon?: ImagePassThroughOptionType;
-  /**
-   * Used to pass attributes to the zoom in button's DOM element.
-   */
-  zoomInButton?: ImagePassThroughOptionType;
-  /**
-   * Used to pass attributes to the zoom in icon's DOM element.
-   */
-  zoomInIcon?: ImagePassThroughOptionType;
-  /**
-   * Used to pass attributes to the close button's DOM element.
-   */
-  closeButton?: ImagePassThroughOptionType;
-  /**
-   * Used to pass attributes to the close icon's DOM element.
-   */
-  closeIcon?: ImagePassThroughOptionType;
-  /**
-   * Used to pass attributes to the preview container's DOM element.
-   */
-  previewContainer?: ImagePassThroughOptionType;
-  /**
-   * Used to pass attributes to the preview's DOM element.
-   */
-  preview?: ImagePassThroughOptionType;
-  /**
-   * Used to manage all lifecycle hooks.
-   * @see {@link BaseComponent.ComponentHooks}
-   */
-  hooks?: ComponentHooks;
-  /**
-   * Used to control Vue Transition API.
-   */
-  transition?: ImagePassThroughTransitionType;
-}
-
-/**
- * Custom passthrough attributes for each DOM elements
- */
-export interface ImagePassThroughAttributes {
-  [key: string]: any;
-}
-
-/**
- * Defines current inline state in Image component.
- */
-export interface ImageState {
-  /**
-   * Mask visible state as a boolean.
-   * @defaultValue false
-   */
-  maskVisible: boolean;
-  /**
-   * Preview visible state as a boolean.
-   * @defaultValue false
-   */
-  previewVisible: boolean;
-  /**
-   * Rotate state as a number.
-   * @defaultValue 0
-   */
-  rotate: number;
-  /**
-   * Scale state as a boolean.
-   * @defaultValue 1
-   */
-  scale: number;
-}
-
-export type ImageGallery = {
-  src?: ImageProps['src'];
-};
-
-/**
- * Defines valid properties in Image component.
- */
-export interface ImageProps {
-  /**
-   * The thumbnail image.
-   */
-  src?: string | Blob;
-  /**
-   * The thumbnail image width.
-   *
-   * small: 30
-   * medium: 80
-   * big: 125
-   *
-   * @default to 'big' or {@link width} - When the props.width specified, the size will use this value
-   */
-  size?: 'small' | 'medium' | 'big';
-
-  /**
-   * Set custom size in pixels (without 'px')
-   * @example 30
-   */
-  width?: number;
-  /**
-   * Specify the rounded level.
-   *
-   * If true, the image will be full rounded.
-   *
-   * @default 'false'
-   */
-  rounded?: boolean;
-  /**
-   * Inline style of the image element.
-   */
-  imageStyle?: any;
-  /**
-   * Style class of the image element.
-   */
-  imageClass?: any;
-  /**
-   * Show preview as galeria. Display multiple image with thumbnail.
-   */
-  galleries?: ImageGallery[];
-  /**
-   * Custom indicator icon.
-   * @deprecated since v3.27.0. Use 'indicator' slot.
-   */
-  indicatorIcon?: string;
-  /**
-   * Disable the zoom-in button
-   * @defaultValue false
-   */
-  zoomInDisabled?: boolean | undefined;
-  /**
-   * Disable the zoom-out button
-   * @defaultValue false
-   */
-  zoomOutDisabled?: boolean | undefined;
-  /**
-   * Used to pass attributes to DOM elements inside the component.
-   * @type {ImagePassThroughOptions}
-   */
-  pt?: PassThrough<ImagePassThroughOptions>;
-  /**
-   * Used to configure passthrough(pt) options of the component.
-   * @type {PassThroughOptions}
-   */
-  ptOptions?: PassThroughOptions;
-  /**
-   * When enabled, it removes component related styles in the core.
-   * @defaultValue false
-   */
-  unstyled?: boolean;
-
-  /**
-   * Get image url for specifics project from its server.
-   * @returns The full URL of the image from the server.
-   * @param path - the Image path from API Response JSON
-   * @param width - the image width in pixels
-   * @param height - the image height in pixels
-   */
-  getImageURL?: (
-    path?: string | null,
-    width?: number,
-    height?: number,
-  ) => string | undefined;
-
-  /**
-   * The placeholder to be shown when the image failed to load, or the src is not provided.
-   * It should be preserved by project configuration.
-   */
-  placeholder?: string | undefined;
-}
-
-/**
- * Defines valid slots in Image slots.
- */
-export interface ImageSlots {
-  /**
-   * Custom indicator template.
-   */
-  indicator(): VNode[];
-  /**
-   * Custom indicator icon template.
-   */
-  indicatoricon(): VNode[];
-  /**
-   * Custom refresh template.
-   */
-  refresh(): VNode[];
-  /**
-   * Custom undo template.
-   */
-  undo(): VNode[];
-  /**
-   * Custom zoomout template.
-   */
-  zoomout(): VNode[];
-  /**
-   * Custom zoomin template.
-   */
-  zoomin(): VNode[];
-  /**
-   * Custom close template.
-   */
-  close(): VNode[];
-  /**
-   * Custom image template.
-   * @param {Object} scope - image slot's params.
-   */
-  image(scope: {
-    /**
-     * Style class of the image element.
-     */
-    class: any;
-    /**
-     * Style of the image element.
-     */
-    style: any;
-    /**
-     * Image error function.
-     * @deprecated since v3.39.0. Use 'errorCallback' property instead.
-     */
-    onError: () => void;
-    /**
-     * Preview click function.
-     */
-    errorCallback: () => void;
-  }): VNode[];
-  /**
-   * Custom preview template.
-   * @param {Object} scope - preview slot's params.
-   */
-  preview(scope: {
-    /**
-     * Style class of the preview image element.
-     */
-    class: any;
-    /**
-     * Style of the preview image element.
-     */
-    style: any;
-    /**
-     * Preview click function.
-     * @deprecated since v3.39.0. Use 'previewCallback' property instead.
-     */
-    onClick: () => void;
-    /**
-     * Preview click function.
-     */
-    previewCallback: () => void;
-  }): VNode[];
-}
-
-/**
- * **WangsVue - Image**
- *
- * _Displays an image with preview._
- *
- * --- ---
- * ![WangsVue](https://www.wangs.id/wp-content/uploads/2023/12/cropped-Logo_Wangsid-removebg-preview-192x192.png)
- *
- * @group Component
- *
- */
-declare class Image extends ClassComponent<ImageProps, ImageSlots, unknown> {
-  /**
-   * Triggered when the preview overlay is shown.
-   *
-   * @memberof Image
-   */
-  show(): void;
-  /**
-   * Triggered when the preview overlay is hidden.
-   *
-   * @memberof Image
-   */
-  hide(): void;
-  /**
-   * Triggered when an error occurs while loading an image file.
-   *
-   * @memberof Image
-   */
-  error(): void;
-}
-
-declare module '@vue/runtime-core' {
-  interface GlobalComponents {
-    Image: GlobalComponentConstructor<Image>;
-  }
-}
-
-export default Image;

package/components/imagecompressor/BackgroundImageCropper.vue.d.ts

@@ -1,36 +0,0 @@
-declare function __VLS_template(): {
-    default?(_: {}): any;
-};
-declare const __VLS_component: import('vue').DefineComponent<__VLS_TypePropsToOption<{
-    touchMove?: unknown;
-    mouseMove?: unknown;
-    touchResize?: unknown;
-    wheelResize?: unknown;
-}>, {}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
-    move: (e: any) => void;
-    resize: (e: any) => void;
-}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_TypePropsToOption<{
-    touchMove?: unknown;
-    mouseMove?: unknown;
-    touchResize?: unknown;
-    wheelResize?: unknown;
-}>>> & {
-    onResize?: (e: any) => any;
-    onMove?: (e: any) => any;
-}, {}, {}>;
-declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
-export default _default;
-type __VLS_WithTemplateSlots<T, S> = T & {
-    new (): {
-        $slots: S;
-    };
-};
-type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
-type __VLS_TypePropsToOption<T> = {
-    [K in keyof T]-?: {} extends Pick<T, K> ? {
-        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
-    } : {
-        type: import('vue').PropType<T[K]>;
-        required: true;
-    };
-};

package/components/imagecompressor/ImageCompressor.vue.d.ts

@@ -1,229 +0,0 @@
-import { CustomValidation } from '../form/Form.vue.d';
-import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
-
-export interface ImageCompressorLocaleConfig {
-  cropDialogHeader: string;
-  /**
-   * @example 'Gunakan Ctrl + Scroll untuk perbesar atau perkecil gambar'
-   */
-  cropperCtrlScrollInfo: string;
-  /**
-   * @example 'Gunakan dua jari untuk untuk perbesar atau perkecil gambar'
-   */
-  cropperTwoFingerInfo: string;
-
-  /**
-   * @example 'Maks. 1 MB'
-   */
-  maxSizeRequirement: string;
-
-  /**
-   * @example 'Hanya mendukung format gambar'
-   */
-  imageTypeRequirement: string;
-
-  cancelCropLabel: string;
-  changeImageLabel: string;
-  applyCropLabel: string;
-}
-
-export type Image = {
-  src: string | null;
-  type: string | null;
-};
-
-export type ImageCompressorPayload = {
-  canvas: HTMLCanvasElement | undefined;
-  compressed: {
-    blob: string | Blob;
-    base64: string;
-    fileName: string;
-    file: File;
-    size: string;
-    type: 'image/webp' | 'image/jpeg' | 'image/jpg';
-  };
-  message?: string;
-};
-
-export interface ImageCompressorProps {
-  /**
-   * Specify the user initial name for the Image Placeholder
-   *
-   * max-length: 3
-   */
-  initialName?: string;
-  /**
-   * Specify the input type, wether single ro multiple image input.
-   *
-   * @default false - single input.
-   */
-  multiple?: boolean;
-  /**
-   * The default image index 0 / 1
-   */
-  defaultImage?: number;
-  /**
-   * Disable the image input.
-   *
-   * @todo add disabled state.
-   */
-  disabled?: boolean;
-  /**
-   * Display a compressed Blob image or a string objectURL of a Blob when mounted.
-   */
-  compressedBlob?: string | Blob | (string | Blob)[];
-  /**
-   * Display an image with the URL instead.
-   */
-  imagePreviewUrl?: string | string[];
-  /**
-   * Specify the size image input and preview size.
-   *
-   * - small: 30px
-   * - medium: 80px
-   * - big: 125*125 px
-   *
-   * @todo Add small size. Currently only support big size.
-   * @default 'big'
-   */
-  imagePreviewSize?: 'small' | 'medium' | 'big';
-  /**
-   * Specify the rounded level.
-   *
-   * If true, the image will be full rounded.
-   *
-   * @default 'false'
-   */
-  rounded?: boolean;
-  /**
-   * Specify whether the image able to be deleted or not (in case image only able to added and edited)
-   *
-   * @default true
-   */
-  useDeleteButton?: boolean;
-  /**
-   * Specify whether the image input will be used as field within Form validation.
-   *
-   */
-  useValidator?: boolean;
-  /**
-   * Specify if the field is required or not.
-   */
-  mandatory?: boolean;
-  /**
-   * Set the invalid state and display the custom validator message.
-   */
-  invalid?: boolean;
-  /**
-   * Set custom validation message.
-   */
-  validatorMessage?: string | CustomValidation;
-  /**
-   * The field label.
-   *
-   * @default undefined - if props.useValidator not presents.
-   * @default 'Photo' - if props.useValidator presents.
-   */
-  label?: string;
-  /**
-   * Specify the field name to make the input available on form validation payload.
-   *
-   * @default 'imageInput'
-   */
-  fieldName?: string;
-  /**
-   * Display field information as tooltip.
-   */
-  fieldInfo?: string;
-  /**
-   * Show the image requirement info section.
-   *
-   * @default true
-   */
-  showInfo?: boolean;
-  /**
-   * Change the requirements of the photo
-   *
-   * @default undefined - will use maxSizeRequirement, imageTypeRequirement from LocaleConfig
-   */
-  customRequirements?: string[];
-  /**
-   * Show dialog confirmation before delete the image.
-   */
-  confirmOnDelete?: boolean;
-  /**
-   * On clicking delete button, emit the delete function instead of deleting the image.
-   * Useful when showing custom dialog confirmation.
-   */
-  emitDeleteFn?: boolean;
-  /**
-   * Show the validation message section.
-   *
-   * @default true
-   */
-  showValidatorMessage?: boolean;
-  /**
-   * Specify the file type for the uploaded image result.
-   *
-   * @default 'webp'
-   */
-  fileType?: 'webp' | 'jpeg' | 'jpg';
-}
-
-export interface ImageCompressorSlots {
-  [key: string]: unknown;
-}
-
-export type ImageCompressorEmits = {
-  /**
-   * On apply the image cropper.
-   */
-  'apply': [value: ImageCompressorPayload];
-  /**
-   * On apply image from props.
-   */
-  'applyProp': [];
-  'update:defaultImage': [index?: number];
-  /**
-   * On delete button clicked.
-   *
-   * When confirmOnDelete / emitDelete is true, this emit will be emitted with a delete function.
-   * You need to call the function inside your own delete funcition to clear the image.
-   *
-   * @param deleteFn - the function delete
-   * @param index - the index of image to be deleted
-   */
-  'delete': [deleteFn?: (index?: number) => void, index?: number];
-};
-
-/**
- * **WangsVue - ImageCompressor**
- *
- * _Handle image input and compression._
- *
- * --- ---
- * ![WangsVue](https://www.wangs.id/wp-content/uploads/2023/12/cropped-Logo_Wangsid-removebg-preview-192x192.png)
- *
- * @group Component
- *
- */
-declare class ImageCompressor extends ClassComponent<
-  ImageCompressorProps,
-  ImageCompressorSlots,
-  ImageCompressorEmits
-> {
-  /**
-   * Exposed function to assign image from props.
-   *
-   * @param isDelete
-   */
-  assignPreviewImagesFromProp(isDelete?: boolean): Promise<void>;
-}
-
-declare module '@vue/runtime-core' {
-  interface GlobalComponents {
-    ImageCompressor: GlobalComponentConstructor<ImageCompressor>;
-  }
-}
-
-export default ImageCompressor;

package/components/imagecompressor/ImageInputInfo.vue.d.ts

@@ -1,32 +0,0 @@
-declare function __VLS_template(): {
-    default?(_: {}): any;
-};
-declare const __VLS_component: import('vue').DefineComponent<__VLS_TypePropsToOption<{
-    customRequirements?: string[];
-    showInfo: boolean;
-    showAddButton?: boolean;
-}>, {}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
-    addPhoto: () => void;
-}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_TypePropsToOption<{
-    customRequirements?: string[];
-    showInfo: boolean;
-    showAddButton?: boolean;
-}>>> & {
-    onAddPhoto?: () => any;
-}, {}, {}>;
-declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
-export default _default;
-type __VLS_WithTemplateSlots<T, S> = T & {
-    new (): {
-        $slots: S;
-    };
-};
-type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
-type __VLS_TypePropsToOption<T> = {
-    [K in keyof T]-?: {} extends Pick<T, K> ? {
-        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
-    } : {
-        type: import('vue').PropType<T[K]>;
-        required: true;
-    };
-};