ranui 0.1.9 → 0.1.10-alpha-24

package/dist/components/input/index.d.ts

@@ -1,4 +1,9 @@
-export declare class Input extends HTMLElement {
+import '@/components/icon/index';
+declare const Input_base: {
+    new (): HTMLElement;
+    prototype: HTMLElement;
+};
+export declare class Input extends Input_base {
     static get observedAttributes(): string[];
     _input: HTMLDivElement;
     _label: HTMLLabelElement | undefined;
@@ -6,168 +11,188 @@ export declare class Input extends HTMLElement {
     _icon: HTMLElement | undefined;
     constructor();
     /**
-     * @description: 获取input的值
+     * @description: 获取 input 的值
      * @return {String}
      */
-    get value(): string | null;
+    get value(): string;
     /**
-     * @description: 设置input的值
+     * @description: 设置 input 的值
      * @param {String} value
      */
     set value(value: string);
     /**
-     * @description: 获取input的占位字符
+     * @description: 获取 input 的占位字符
      * @return {String}
      */
-    get placeholder(): string | null;
+    get placeholder(): string;
     /**
-     * @description: 设置input的占位字符
+     * @description: 设置 input 的占位字符
      * @param {String} value
      */
     set placeholder(value: string);
     /**
-     * @description: input是否为必选
+     * @description: input 是否为必选
      * @return {String}
      */
-    get required(): string | null;
+    get required(): string;
     /**
-     * @description: 设置input是否为必选，除非设置成false，否则都是必填
+     * @description: 设置 input 是否为必选，除非设置成 false，否则都是必填
      * @param {*} value
      */
     set required(value: string);
     /**
-     * @description: 获取input上disabled属性
+     * @description: 获取 input 上 disabled 属性
      * @return {String | null}
      */
-    get disabled(): boolean;
+    get disabled(): string;
     /**
-     * @description: 设置input的disabled属性
+     * @description: 设置 input 的 disabled 属性
      * @param {String} value
      */
     set disabled(value: string);
     /**
-     * @description: 获取类似于Metiral Design的输入体验。
+     * @description: 获取类似于 Metiral Design 的输入体验。
      */
     get label(): string;
     /**
-     * @description: 设置类似于Metiral Design的输入体验。
+     * @description: 设置类似于 Metiral Design 的输入体验。
      */
     set label(value: string);
     /**
-     * @description: 获取input框的状态
+     * @description: 获取 input 框的状态
      */
     get status(): string;
     /**
-     * @description: 设置input框的状态
+     * @description: 设置 input 框的状态
      */
     set status(value: string);
     /**
-     * @description: 与form组件联动时，收集的属性名
+     * @description: 与 form 组件联动时，收集的属性名
      * @return {String}
      */
     get name(): string;
     /**
-     * @description: 设置name属性
+     * @description: 设置 name 属性
      * @param {string} value
      */
     set name(value: string);
     /**
-     * @description: 当input类型为number类型时，可以获取min属性
+     * @description: 当 input 类型为 number 类型时，可以获取 min 属性
      * @return {String}
      */
     get min(): string;
     /**
-     * @description: 当input类型为number类型时，设置min属性
+     * @description: 当 input 类型为 number 类型时，设置 min 属性
      * @param {string} value
      */
     set min(value: string);
     /**
-     * @description: 当input类型为number类型时，可以获取max属性
+     * @description: 当 input 类型为 number 类型时，可以获取 max 属性
      * @return {String}
      */
     get max(): string;
     /**
-     * @description: 当input类型为number类型时，设置max属性
+     * @description: 当 input 类型为 number 类型时，设置 max 属性
      * @param {string} value
      */
     set max(value: string);
     /**
-     * @description: 当input类型为number类型时，可以获取step属性
+     * @description: 当 input 类型为 number 类型时，可以获取 step 属性
      * @return {String}
      */
     get step(): string;
     /**
-     * @description: 当input类型为number类型时，设置step属性
+     * @description: 当 input 类型为 number 类型时，设置 step 属性
      * @param {string} value
      */
     set step(value: string);
     /**
-     * @description: 获取一个icon
+     * @description: 获取一个 icon
      * @return {String}
      */
-    get icon(): string | null;
+    get icon(): string;
     /**
-     * @description: 设置icon来表示标识
+     * @description: 设置 icon 来表示标识
      * @param {string|null} value
      */
     set icon(value: string);
     /**
-     * @description: 获取input的类型
+     * @description: 获取前面的 icon
+     * @return {String}
+     */
+    get prefix(): string;
+    /**
+     * @description: 设置前面的 icon 来表示标识
+     * @param {string|null} value
+     */
+    set prefix(value: string);
+    /**
+     * @description: 获取后面的 icon
+     * @return {String}
+     */
+    get suffix(): string;
+    /**
+     * @description: 设置后面的 icon 来表示标识
+     * @param {string|null} value
+     */
+    set suffix(value: string);
+    /**
+     * @description: 获取 input 的类型
      * @return {string|null}
      */
-    get type(): string | null;
+    get type(): string;
     /**
-     * @description: 设置input的类型
+     * @description: 设置 input 的类型
      * @param {string|null} value
      */
     set type(value: string);
     /**
-     * @description: 原生的input方法
+     * @description: 原生的 input 方法
      * @param {Event} event
      */
     customInput: (event: Event) => void;
     /**
-     * @description: 增加change方法，同时兼容大小写的情况
+     * @description: 增加 change 方法，同时兼容大小写的情况
      */
     customChange: () => void;
     /**
-     * @description: 监听placeholder属性函数
+     * @description: 监听 placeholder 属性函数
      * @param {string} name
      * @param {string} value
      */
     listenPlaceholder: (name: string, value: string) => void;
     /**
-     * @description: 监听label属性函数
+     * @description: 监听 label 属性函数
      * @param {string} name
      * @param {string} value
      */
     listenLabel: (name: string, value: string) => void;
     /**
-     * @description: 监听type属性
+     * @description: 监听 type 属性
      * @param {string} name
      * @param {string} value
      */
     listenType: (name: string, value: string) => void;
     /**
-     * @description: 监听status属性
+     * @description: 监听 status 属性
      * @param {string} name
      * @param {string} value
      */
     listenStatus: (name: string, value: string) => void;
     /**
-     * @description: 监听disabled属性
+     * @description: 监听 disabled 属性
      * @param {string} name
      * @param {string} value
      */
     listenDisabled: (name: string, value: string) => void;
     /**
-     * @description:  监听icon属性
+     * @description:  监听 icon 属性
      * @param {string} name
      * @param {string} value
      */
     listenIcon: (name: string, value: string, oldValue: string) => void;
     /**
-     * @description: 处理icon属性的问题
+     * @description: 处理 icon 属性的问题
      */
     dealIcon: () => void;
     /**
@@ -181,5 +206,5 @@ export declare class Input extends HTMLElement {
     disconnectCallback(): void;
     attributeChangedCallback(name: string, oldValue: string, newValue: string): void;
 }
-declare const _default: import('../../utils/index').CustomErrorType;
+declare const _default: import("@/utils/index").CustomErrorType;
 export default _default;

package/dist/components/loading/index.d.ts

@@ -0,0 +1,76 @@
+export declare enum ICON_NAME_AMP {
+    DOUBLE_BOUNCE = "double-bounce",
+    ROTATE = "rotate",
+    STRETCH = "stretch",
+    CUBE = "cube",
+    DOT = "dot",
+    TRIPLE_BOUNCE = "triple-bounce",
+    SCALE_OUT = "scale-out",
+    CIRCLE = "circle",
+    CIRCLE_LINE = "circle-line",
+    SQUARE = "square",
+    PULSE = "pulse",
+    SOLAR = "solar",
+    CUBE_FOLD = "cube-fold",
+    CIRCLE_FOLD = "circle-fold",
+    CUBE_GRID = "cube-grid",
+    CIRCLE_TURN = "circle-turn",
+    CIRCLE_ROTATE = "circle-rotate",
+    CIRCLE_SPIN = "circle-spin",
+    DOT_BAR = "dot-bar",
+    DOT_CIRCLE = "dot-circle",
+    LINE = "line",
+    DOT_PULSE = "dot-pulse",
+    LINE_SCALE = "line-scale",
+    TEXT = "text",
+    CUBE_DIM = "cube-dim",
+    DOT_LINE = "dot-line",
+    ARC = "arc",
+    DROP = "drop",
+    PACMAN = "pacman"
+}
+declare const Loading_base: {
+    new (): HTMLElement;
+    prototype: HTMLElement;
+};
+export declare class Loading extends Loading_base {
+    contain: HTMLDivElement;
+    static get observedAttributes(): string[];
+    constructor();
+    get name(): ICON_NAME_AMP;
+    set name(value: string);
+    rotateLoading: () => void;
+    stretchLoading: () => void;
+    doubleBounceLoading: () => void;
+    cubeLoading: () => void;
+    dotLoading: () => void;
+    tripleBounceLoading: () => void;
+    scaleOutLoading: () => void;
+    circleLoading: () => void;
+    circleLineLoading: () => void;
+    squareLoading: () => void;
+    pulseLoading: () => void;
+    solarLoading: () => void;
+    cubeFoldLoading: () => void;
+    circleFoldLoading: () => void;
+    cubeGridLoading: () => void;
+    circleTurnLoading: () => void;
+    circleRotateLoading: () => void;
+    circleSpinLoading: () => void;
+    dotBarLoading: () => void;
+    dotCircleLoading: () => void;
+    lineLoading: () => void;
+    dotPulseLoading: () => void;
+    lineScaleLoading: () => void;
+    textLoading: () => void;
+    cubeDimLoading: () => void;
+    dotLineLoading: () => void;
+    arcLoading: () => void;
+    dropLoading: () => void;
+    pacmanLoading: () => void;
+    createLoading: () => void;
+    connectedCallback(): void;
+    attributeChangedCallback(k: string, o: string, n: string): void;
+}
+declare const _default: import("@/utils/index").CustomErrorType;
+export default _default;

package/dist/components/math/index.d.ts

@@ -0,0 +1,16 @@
+declare const Math_base: {
+    new (): HTMLElement;
+    prototype: HTMLElement;
+};
+export declare class Math extends Math_base {
+    contain: HTMLElement;
+    static get observedAttributes(): string[];
+    constructor();
+    get latex(): string;
+    set latex(value: string);
+    render(): void;
+    connectedCallback(): void;
+    attributeChangedCallback(k: string, o: string, n: string): void;
+}
+declare const _default: Promise<import("@/utils/index").CustomErrorType>;
+export default _default;

package/dist/components/message/index.d.ts

@@ -1,14 +1,17 @@
+import '@/components/icon';
 declare const message: {
     info: (options: Ran.Prompt | string | undefined | null) => void;
     success: (options: Ran.Prompt | string | undefined | null) => void;
     error: (options: Ran.Prompt | string | undefined | null) => void;
     warning: (options: Ran.Prompt | string | undefined | null) => void;
     toast: (options: Ran.Prompt | string | undefined | null) => void;
-} | {
-    info?: undefined;
-    success?: undefined;
-    error?: undefined;
-    warning?: undefined;
-    toast?: undefined;
-};
+} | null;
+declare global {
+    interface Window {
+        message: Ran.Message;
+        ranui: {
+            message?: Ran.Message;
+        };
+    }
+}
 export default message;

package/dist/components/player/index.d.ts

@@ -1,6 +1,24 @@
-/// <reference types="node" />
-import { SyncHook } from 'ranuts';
-import type { Progress } from '../progress';
+import { SyncHook } from 'ranuts/utils';
+import '@/assets/js/hls.js';
+import type { Progress } from '@/components/progress';
+import '@/components/select';
+import './index.less';
+type Callback = (...args: unknown[]) => unknown;
+type EventName = string | symbol;
+type EventItem = {
+    name?: string | symbol;
+    callback: Callback;
+    initialCallback?: Callback;
+};
+export declare class SHook {
+    private _events;
+    constructor();
+    tap: (eventName: EventName, eventItem: EventItem | Callback) => void;
+    call: (eventName: EventName, ...args: Array<unknown>) => void;
+    callSync: (eventName: EventName, ...args: Array<unknown>) => Promise<void>;
+    once: (eventName: EventName, eventItem: EventItem | Callback) => void;
+    off: (eventName: EventName, eventItem: EventItem | Callback) => void;
+}
 export interface HlsPlayer {
     startLoad(): () => void;
     off: (s: string, f: Function) => void;
@@ -31,7 +49,24 @@ export interface Context {
     levelMap: Map<string, string>;
     clarity: string;
 }
-export declare class RanPlayer extends HTMLElement {
+interface Hls {
+    Events: {
+        MANIFEST_LOADED: 'hlsManifestLoaded';
+        ERROR: 'error';
+    };
+    isSupported: () => boolean;
+}
+type HLS = Hls & (new () => HlsPlayer);
+declare global {
+    interface Window {
+        Hls: HLS;
+    }
+}
+declare const RanPlayer_base: {
+    new (): HTMLElement;
+    prototype: HTMLElement;
+};
+export declare class RanPlayer extends RanPlayer_base {
     ctx: Context;
     _player: HTMLDivElement;
     _container: HTMLDivElement;
@@ -70,12 +105,14 @@ export declare class RanPlayer extends HTMLElement {
     _hls?: HlsPlayer;
     static get observedAttributes(): string[];
     /**
-     * @description: 初始化view和video的全局上下文
+     * @description: 初始化 view 和 video 的全局上下文
      * @return {*}
      */
     constructor();
     get src(): string;
     set src(value: string);
+    get debug(): string;
+    set debug(value: string);
     get volume(): string;
     set volume(value: string);
     get currentTime(): string;
@@ -94,6 +131,7 @@ export declare class RanPlayer extends HTMLElement {
      * @return {*}
      */
     updatePlayer: () => void;
+    hlsError: (event: unknown, data: unknown) => void;
     change: (name: string, value: unknown) => void;
     onCanplay: (e: Event) => void;
     onCanplaythrough: (e: Event) => void;
@@ -135,7 +173,7 @@ export declare class RanPlayer extends HTMLElement {
      * @param {MouseEvent} e
      * @return {*}
      */
-    progressDotMouseDown: (e: MouseEvent) => void;
+    progressDotMouseDown: () => void;
     /**
      * @description: 进度条鼠标移动事件
      * @param {MouseEvent} e
@@ -180,13 +218,13 @@ export declare class RanPlayer extends HTMLElement {
      */
     SpaceKeyDown: (e: KeyboardEvent) => void;
     /**
-     * @description: 点击player-btn，触发的事件
+     * @description: 点击 player-btn，触发的事件
      * @param {*} void
      * @return {*}
      */
     dispatchClickPlayerBtnAction: (e: Event) => void;
     changeVolumeProgress: (e: Event) => void;
-    customRequestFullscreen: (options?: FullscreenOptions) => Promise<void>;
+    customRequestFullscreen: () => Promise<void>;
     customExitFullscreen: () => Promise<void>;
     openFullScreen: () => void;
     changeSpeed: (e: Event) => void;
@@ -207,7 +245,6 @@ export declare class RanPlayer extends HTMLElement {
     pause: () => void;
     connectedCallback(): void;
     disconnectCallback(): void;
-    attributeChangedCallback(k: string, o: string, n: string): void;
 }
 declare const _default: typeof RanPlayer | undefined;
 export default _default;

package/dist/components/popover/content/index.d.ts

@@ -0,0 +1,16 @@
+declare const Content_base: {
+    new (): HTMLElement;
+    prototype: HTMLElement;
+};
+export declare class Content extends Content_base {
+    observer: MutationObserver;
+    _shadowDom: ShadowRoot;
+    _slot: HTMLElement;
+    constructor();
+    callback: (mutations: MutationRecord[]) => void;
+    onChange: (mutation: MutationRecord) => void;
+    connectedCallback(): void;
+    disconnectCallback(): void;
+}
+declare const _default: import("@/utils/index").CustomErrorType;
+export default _default;

package/dist/components/popover/index.d.ts

@@ -0,0 +1,91 @@
+import '@/components/popover/content';
+import '@/components/dropdown';
+export type PlacementDirection = Record<string, Record<string, string>>;
+export declare enum PLACEMENT_TYPE {
+    TOP = "top",
+    BOTTOM = "bottom",
+    LEFT = "left",
+    RIGHT = "right"
+}
+declare const Popover_base: {
+    new (): HTMLElement;
+    prototype: HTMLElement;
+};
+export declare class Popover extends Popover_base {
+    _slot: HTMLSlotElement;
+    popoverBlock: HTMLDivElement;
+    popoverContent?: HTMLElement;
+    popoverInner?: HTMLDivElement;
+    popoverInnerBlock?: HTMLDivElement;
+    _shadowDom: ShadowRoot;
+    dropDownInTimeId?: NodeJS.Timeout;
+    dropDownOutTimeId?: NodeJS.Timeout;
+    removeTimeId?: NodeJS.Timeout;
+    static get observedAttributes(): string[];
+    readonly closePopover: () => void;
+    constructor();
+    get placement(): string;
+    set placement(value: string);
+    get arrow(): string;
+    set arrow(value: string);
+    get trigger(): string;
+    set trigger(value: string);
+    get getPopupContainerId(): string;
+    set getPopupContainerId(value: string);
+    stopPropagation: (e: Event) => void;
+    /**
+     * @description: 创建下拉框
+     * @param {HTMLCollection} content
+     * @return {*}
+     */
+    createContent: (content: HTMLCollection) => void;
+    /**
+     * @description: 观察内容变化
+     * @param {Event} e
+     * @return {*}
+     */
+    watchContent: (e: Event) => void;
+    /**
+     * @description: 焦点移除的情况，需要移除下拉框
+     * @return {*}
+     */
+    blur: any;
+    /**
+     * @description: 移除下拉框
+     * @return {*}
+     */
+    removeDropDownTimeId: any;
+    /**
+     * @description: 添加 dropdown
+     * @return {*}
+     */
+    setDropdownDisplayBlock: any;
+    /**
+     * @description: 移除 select dropdown
+     * @return {*}
+     */
+    setDropdownDisplayNone: any;
+    /**
+     * @description: 设置 popover 位置
+     * @param {*} void
+     * @return {*}
+     */
+    placementPosition: () => void;
+    /**
+     * @description: 鼠标移入
+     * @param {Event} e
+     * @return {*}
+     */
+    hoverPopover: (e: Event) => void;
+    clickContent: (e: Event) => void;
+    clickPopover: (e: Event) => void;
+    clickRemovePopover: (e: Event) => void;
+    popoverTrigger: () => void;
+    hoverRemovePopover: (e: Event) => void;
+    changePlacement: any;
+    connectedCallback(): void;
+    disconnectCallback(): void;
+    attributeChangedCallback(n: string, o: string, v: string): void;
+}
+declare const _default: import("@/utils/index").CustomErrorType;
+export default _default;

package/dist/components/preview/constant.d.ts

@@ -0,0 +1,5 @@
+export declare const PPTX = "application/vnd.openxmlformats-officedocument.presentationml.presentation";
+export declare const PDF = "application/pdf";
+export declare const DOCX = "application/vnd.openxmlformats-officedocument.wordprocessingml.document";
+export declare const XLSX = "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet";
+export declare const XLS = "application/vnd.ms-excel";

package/dist/components/preview/index.d.ts

@@ -1,6 +1,3 @@
-export interface BaseReturn {
-    success: boolean;
-    message?: string;
-}
+import '@/components/icon';
 declare const _default: Promise<void>;
 export default _default;

package/dist/components/preview/pdf.d.ts

@@ -1 +1,51 @@
-export declare const renderPdf: (file: File, dom?: HTMLElement) => Promise<void>;
+import type { BaseReturn, RenderOptions } from '@/components/preview/types';
+export interface Viewport {
+    width: number;
+    height: number;
+    viewBox: Array<number>;
+}
+export interface RenderContext {
+    canvasContext: CanvasRenderingContext2D | null;
+    transform: Array<number>;
+    viewport: Viewport;
+}
+export interface PDFPageProxy {
+    pageNumber: number;
+    getViewport: ({ scale }: {
+        scale: number;
+    }) => Viewport;
+    render: (options: RenderContext) => void;
+}
+export interface PDFDocumentProxy {
+    numPages: number;
+    getPage: (x: number) => Promise<PDFPageProxy>;
+}
+declare global {
+    interface Window {
+        pdfjsLib: {
+            GlobalWorkerOptions: {
+                workerSrc: string;
+            };
+            getDocument: (x: string | ArrayBuffer) => {
+                promise: Promise<PDFDocumentProxy>;
+            };
+        };
+    }
+}
+export declare class PdfPreview {
+    private pdfDoc;
+    pageNumber: number;
+    total: number;
+    dom: HTMLElement;
+    pdf: string | ArrayBuffer;
+    onError: ((msg: BaseReturn) => void) | undefined;
+    onLoad: ((msg: BaseReturn) => void) | undefined;
+    constructor(pdf: string | ArrayBuffer, options: RenderOptions);
+    private getPdfPage;
+    pdfPreview: () => Promise<BaseReturn>;
+    showTotalPage: () => Promise<void>;
+    changePage: (num: number) => number;
+    prevPage: () => Promise<number>;
+    nextPage: () => Promise<number>;
+}
+export declare const renderPdf: (file: File, options: RenderOptions) => Promise<void>;

package/dist/components/preview/types.d.ts

@@ -0,0 +1,11 @@
+export interface BaseReturn<T = unknown> {
+    success: boolean;
+    data?: T;
+    message?: string;
+}
+export interface RenderOptions {
+    dom?: HTMLElement;
+    onError?: (msg?: BaseReturn) => void;
+    onLoad?: (msg?: BaseReturn) => void;
+    iframe?: HTMLIFrameElement;
+}