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

package/components/datatable/MultiRow.vue.d.ts

@@ -0,0 +1,36 @@
+import { MultiRowAttribute } from './DataTable.vue.d';
+declare const _default: import('vue').DefineComponent<
+    __VLS_TypePropsToOption<{
+        attributes: MultiRowAttribute[];
+    }>,
+    {},
+    unknown,
+    {},
+    {},
+    import('vue').ComponentOptionsMixin,
+    import('vue').ComponentOptionsMixin,
+    {},
+    string,
+    import('vue').PublicProps,
+    Readonly<
+        import('vue').ExtractPropTypes<
+            __VLS_TypePropsToOption<{
+                attributes: MultiRowAttribute[];
+            }>
+        >
+    >,
+    {},
+    {}
+>;
+export default _default;
+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/datatable/helpers/adjustMenuPosition.helper.d.ts

@@ -0,0 +1 @@
+export default function (event: Event): void;

package/components/datatable/helpers/filter.helper.d.ts

@@ -0,0 +1,38 @@
+export declare const FilterMatchMode: {
+    CONTAINS: string;
+    EQUALS: string;
+    IN: string;
+    LESS_THAN: string;
+    LESS_THAN_OR_EQUAL_TO: string;
+    GREATER_THAN: string;
+    GREATER_THAN_OR_EQUAL_TO: string;
+    DATE_BETWEEN: string;
+    DATE_BEFORE: string;
+    DATE_AFTER: string;
+};
+type FilterFunction = (
+    value: any,
+    filter: any,
+    filterLocale?: string,
+) => boolean;
+declare class FilterService {
+    private readonly filters;
+    constructor();
+    filter(
+        value: any[],
+        fields: string[],
+        filterValue: any,
+        filterMatchMode: string,
+        filterLocale?: string,
+    ): any[];
+    register(rule: string, fn: FilterFunction): void;
+    private contains;
+    private dateBetween;
+    private in;
+    private lt;
+    private lte;
+    private gt;
+    private gte;
+}
+declare const _default: FilterService;
+export default _default;

package/components/datatable/helpers/index.d.ts

@@ -0,0 +1,6 @@
+import { default as adjustMenuPositionHelper } from './adjustMenuPosition.helper';
+declare const isArrayIncluded: (
+    smallArray: string[],
+    largeArray: string[],
+) => boolean;
+export { isArrayIncluded, adjustMenuPositionHelper };

package/components/datatable/helpers/readConfig.helper.d.ts

@@ -0,0 +1,5 @@
+import { TableColumn } from '../DataTable.vue.d';
+export default function readConfig(
+    tableId: string,
+    defaultColumns: TableColumn[],
+): Promise<TableColumn[]>;

package/components/datatable/store/dataTable.store.d.ts

@@ -0,0 +1,25 @@
+export interface DataTableStore {
+    /**
+     * Get the config object from the store.
+     */
+    config: DataTableConfig;
+    /**
+     * Update config for specific Table.
+     *
+     * @param id The table ID
+     * @param columnsConfig The columns configuration
+     */
+    setConfig: (
+        id: string,
+        columnsConfig: DataTableColumnConfig[],
+    ) => Promise<void>;
+}
+export type DataTableConfig = Record<string, DataTableColumnConfig[]>;
+export interface DataTableColumnConfig {
+    field: string;
+    width: number | string;
+    fixed: boolean;
+    visible: boolean;
+}
+declare const useDataTableStore: () => Promise<DataTableStore>;
+export default useDataTableStore;

package/components/dialog/Dialog.vue.d.ts

@@ -0,0 +1,464 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+/**
+ *
+ * Dialog is a container to display content in an overlay window.
+ *
+ * [Live Demo](https://www.WangsVue.org/dialog)
+ *
+ * @module dialog
+ *
+ */
+import { HTMLAttributes, TransitionProps, VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent';
+import { PassThroughOptions } from '../passthrough';
+import {
+    ClassComponent,
+    GlobalComponentConstructor,
+    PassThrough,
+} from '../ts-helpers';
+
+export declare type DialogPassThroughOptionType<T = any> =
+    | DialogPassThroughAttributes
+    | ((
+          options: DialogPassThroughMethodOptions<T>,
+      ) => DialogPassThroughAttributes | string)
+    | string
+    | null
+    | undefined;
+
+export declare type DialogPassThroughTransitionType<T = any> =
+    | TransitionProps
+    | ((options: DialogPassThroughMethodOptions<T>) => TransitionProps)
+    | undefined;
+
+/**
+ * Custom passthrough(pt) option method.
+ */
+export interface DialogPassThroughMethodOptions<T> {
+    /**
+     * Defines instance.
+     */
+    instance: any;
+    /**
+     * Defines valid properties.
+     */
+    props: DialogProps;
+    /**
+     * Defines current inline state.
+     */
+    state: DialogState;
+    /**
+     * Defines parent instance.
+     */
+    parent: T;
+    /**
+     * Defines passthrough(pt) options in global config.
+     */
+    global: object | undefined;
+}
+
+/**
+ * Custom passthrough(pt) options.
+ * @see {@link DialogProps.pt}
+ */
+export interface DialogPassThroughOptions<T = any> {
+    /**
+     * Used to pass attributes to the root's DOM element.
+     */
+    root?: DialogPassThroughOptionType<T>;
+    /**
+     * Used to pass attributes to the header's DOM element.
+     */
+    header?: DialogPassThroughOptionType<T>;
+    /**
+     * Used to pass attributes to the header title's DOM element.
+     */
+    title?: DialogPassThroughOptionType<T>;
+    /**
+     * Used to pass attributes to the header icons' DOM element.
+     */
+    icons?: DialogPassThroughOptionType<T>;
+    /**
+     * Used to pass attributes to the maximizable button's DOM element.
+     */
+    maximizableButton?: DialogPassThroughOptionType<T>;
+    /**
+     * Used to pass attributes to the maximizable icon's DOM element.
+     */
+    maximizableIcon?: DialogPassThroughOptionType<T>;
+    /**
+     * Used to pass attributes to the close button's component.
+     */
+    closeButton?: DialogPassThroughOptionType<T>;
+    /**
+     * Used to pass attributes to the close button icon's component.
+     */
+    closeButtonIcon?: DialogPassThroughOptionType<T>;
+    /**
+     * Used to pass attributes to the content's DOM element.
+     */
+    content?: DialogPassThroughOptionType<T>;
+    /**
+     * Used to pass attributes to the footer's DOM element.
+     */
+    footer?: DialogPassThroughOptionType<T>;
+    /**
+     * Used to pass attributes to the mask's DOM element.
+     */
+    mask?: DialogPassThroughOptionType<T>;
+    /**
+     * Used to manage all lifecycle hooks.
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
+    /**
+     * Used to control Vue Transition API.
+     */
+    transition?: DialogPassThroughTransitionType<T>;
+}
+
+/**
+ * Custom passthrough attributes for each DOM elements
+ */
+export interface DialogPassThroughAttributes {
+    [key: string]: any;
+}
+
+/**
+ * Defines current inline state in Dialog component.
+ */
+export interface DialogState {
+    /**
+     * Current visible state of the container as a boolean.
+     * @defaultValue false
+     */
+    containerVisible: boolean;
+    /**
+     * Current maximized state as a boolean.
+     * @defaultValue false
+     */
+    maximized: boolean;
+}
+
+/**
+ * Custom breakpoint metadata.
+ */
+export interface DialogBreakpoints {
+    /**
+     * Breakpoint for responsive mode.
+     *
+     * Example:
+     *
+     * <Dialog :breakpoints="{'960px': '75vw', '640px': '100vw'}" ... />
+     *
+     * Result:
+     *
+     * @media screen and (max-width: ${breakpoint[key]}) {
+     *      .p-dialog[attributeSelector] {
+     *          width: ${breakpoint[value]} !important;
+     *      }
+     * }
+     */
+    [key: string]: string;
+}
+
+/**
+ * Defines valid properties in Dialog component.
+ */
+export interface DialogProps {
+    /**
+     * Title content of the dialog.
+     */
+    header?: string | undefined;
+    /**
+     * Footer content of the dialog.
+     */
+    footer?: string | undefined;
+    /**
+     * Specifies the visibility of the dialog.
+     * @defaultValue false
+     */
+    visible?: boolean | undefined;
+    /**
+     * Defines if background should be blocked when dialog is displayed.
+     * @defaultValue true
+     */
+    modal?: boolean | undefined;
+    /**
+     * Style of the content section.
+     */
+    contentStyle?: any;
+    /**
+     * Used to pass all properties of the HTMLDivElement to the overlay panel inside the component.
+     */
+    contentProps?: HTMLAttributes | undefined;
+    /**
+     * When enabled dialog is displayed in RTL direction.
+     * @defaultValue false
+     */
+    rtl?: boolean | undefined;
+    /**
+     * Adds a close icon to the header to hide the dialog.
+     * @defaultValue true
+     */
+    closable?: boolean | undefined;
+    /**
+     * Specifies if clicking the modal background should hide the dialog.
+     * @defaultValue false
+     */
+    dismissableMask?: boolean | undefined;
+    /**
+     * Specifies if pressing escape key should hide the dialog.
+     * @defaultValue true
+     */
+    closeOnEscape?: boolean | undefined;
+    /**
+     * Whether to show the header or not.
+     * @defaultValue true
+     */
+    showHeader?: boolean | undefined;
+    /**
+     * Whether background scroll should be blocked when dialog is visible.
+     * @defaultValue false
+     */
+    blockScroll?: boolean | undefined;
+    /**
+     * Base zIndex value to use in layering.
+     * @defaultValue 0
+     */
+    baseZIndex?: number | undefined;
+    /**
+     * Whether to automatically manage layering.
+     * @defaultValue true
+     */
+    autoZIndex?: boolean | undefined;
+    /**
+     * Position of the dialog.
+     * @defaultValue center
+     */
+    position?:
+        | 'center'
+        | 'top'
+        | 'bottom'
+        | 'left'
+        | 'right'
+        | 'topleft'
+        | 'topright'
+        | 'bottomleft'
+        | 'bottomright'
+        | undefined;
+    /**
+     * Whether the dialog can be displayed full screen.
+     * @defaultValue false
+     */
+    maximizable?: boolean | undefined;
+    /**
+     * Object literal to define widths per screen size.
+     */
+    breakpoints?: DialogBreakpoints;
+    /**
+     * Enables dragging to change the position using header.
+     * @defaultValue true
+     */
+    draggable?: boolean | undefined;
+    /**
+     * Keeps dialog in the viewport when dragging.
+     * @defaultValue true
+     */
+    keepInViewPort?: boolean | undefined;
+    /**
+     * Minimum value for the left coordinate of dialog in dragging.
+     * @defaultValue 0.
+     */
+    minX?: number | undefined;
+    /**
+     * Minimum value for the top coordinate of dialog in dragging.
+     * @defaultValue 0
+     */
+    minY?: number | undefined;
+    /**
+     * A valid query selector or an HTMLElement to specify where the dialog gets attached.
+     * @defaultValue body
+     */
+    appendTo?: 'body' | 'self' | string | undefined | HTMLElement;
+    /**
+     * Style of the dynamic dialog.
+     */
+    style?: any;
+    /**
+     * Icon to display in the dialog close button.
+     * @deprecated since v3.27.0. Use 'closeicon' slot.
+     */
+    closeIcon?: string | undefined;
+    /**
+     * Icon to display in the dialog maximize button when dialog is not maximized.
+     * @deprecated since v3.27.0. Use 'maximizeicon' slot.
+     */
+    maximizeIcon?: string | undefined;
+    /**
+     * Icon to display in the dialog maximize button when dialog is minimized.
+     * @deprecated since v3.27.0. Use 'minimizeicon' slot.
+     */
+    minimizeIcon?: string | undefined;
+    /**
+     * Used to pass attributes to DOM elements inside the component.
+     * @type {DialogPassThroughOptions}
+     */
+    pt?: PassThrough<DialogPassThroughOptions>;
+    /**
+     * 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;
+    /**
+     * A string or string array class to append to the root section.
+     */
+    class?: string | string[];
+    /**
+     * A string or string array class to append to the dialog header section.
+     */
+    headerClass?: string | string[] | object[];
+    /**
+     * A string or string array class to append to the dialog content section.
+     */
+    contentClass?: string | string[];
+    /**
+     * A string or string array class to append to the dialog footer section.
+     */
+    footerClass?: string | string[];
+}
+
+/**
+ * Defines valid slots in Dialog component.
+ */
+export interface DialogSlots {
+    /**
+     * Default content slot.
+     */
+    default(): VNode[];
+    /**
+     * Custom header template.
+     */
+    header(): VNode[];
+    /**
+     * Custom footer template.
+     */
+    footer(): VNode[];
+    /**
+     * Custom close icon template.
+     * @param {Object} scope - close icon slot's params.
+     */
+    closeicon(scope: {
+        /**
+         * Style class of the close icon
+         */
+        class: any;
+    }): VNode[];
+    /**
+     * Custom maximize icon template of dialog.
+     * @param {Object} scope - maximize icon slot's params.
+     */
+    maximizeicon(scope: {
+        /**
+         * Maximized state as a boolean
+         */
+        maximized: boolean;
+        /**
+         * Style class of the maximize icon
+         */
+        class: any;
+    }): VNode[];
+    /**
+     * Custom container slot.
+     * @param {Object} scope - container slot's params.
+     */
+    container(scope: {
+        /**
+         * Close dialog function.
+         * @deprecated since v3.39.0. Use 'closeCallback' property instead.
+         */
+        onClose: () => void;
+        /**
+         * Maximize/minimize dialog function.
+         * @param {Event} event - Browser event
+         * @deprecated since v3.39.0. Use 'maximizeCallback' property instead.
+         */
+        onMaximize: (event: Event) => void;
+        /**
+         * Close dialog function.
+         */
+        closeCallback: () => void;
+        /**
+         * Maximize/minimize dialog function.
+         * @param {Event} event - Browser event
+         */
+        maximizeCallback: (event: Event) => void;
+    }): VNode[];
+}
+
+/**
+ * Defines valid emits in Dialog component.
+ */
+export type DialogEmits = {
+    /**
+     * Emitted when the visible changes.
+     * @param {boolean} value - New value.
+     */
+    'update:visible': [value: boolean];
+    /**
+     * Callback to invoke when dialog is hidden.
+     */
+    'hide': [];
+    /**
+     * Callback to invoke after dialog is hidden.
+     */
+    'afterHide': [];
+    /**
+     * Callback to invoke when dialog is shown.
+     */
+    'show': [];
+    /**
+     * Fired when a dialog gets maximized.
+     * @param {event} event - Browser event.
+     */
+    'maximize': [event: Event];
+    /**
+     * Fired when a dialog gets unmaximized.
+     * @param {event} event - Browser event.
+     */
+    'unmaximize': [event: Event];
+    /**
+     * Fired when a dialog drag completes.
+     * @param {event} event - Browser event.
+     */
+    'dragend': [event: Event];
+};
+
+/**
+ * **WangsVue - Dialog**
+ *
+ * _Dialog is a container to display content in an overlay window._
+ *
+ * --- ---
+ * ![WangsVue](https://www.wangs.id/wp-content/uploads/2023/12/cropped-Logo_Wangsid-removebg-preview-192x192.png)
+ *
+ * @group Component
+ */
+declare class Dialog extends ClassComponent<
+    DialogProps,
+    DialogSlots,
+    DialogEmits
+> {}
+
+declare module '@vue/runtime-core' {
+    interface GlobalComponents {
+        Dialog: GlobalComponentConstructor<Dialog>;
+    }
+}
+
+export default Dialog;