@fewangsit/wangsvue 1.5.199-alpha.4 → 1.5.199-alpha.5

package/components/calendar/Calendar.vue.d.ts

@@ -1,379 +1,41 @@
-import { TransitionProps } from 'vue';
 import { CustomValidation } from '../form/Form.vue.d';
 import { ClassComponent } from '../ts-helpers';
 
-export interface CalendarLocaleConfig {
-  defaultPlaceholder: string;
-
-  /**
-   * Error message displayed when no selection has been made.
-   *
-   * This message can include placeholders:
-   * - `{label}`: Replaced with the value of `props.label`.
-   * - `{formattedLabel}`: Replaced with the value of `props.label` formatted with an appropriate article (a/an).
-   *
-   * @example
-   * // If `props.label` is 'Date', the error message will be:
-   * '{label} must be picked' - 'Date must be picked'
-   *
-   * @example
-   * // If `props.label` is 'Audit Date', the error message will be:
-   * 'You must pick {formattedLabel}' - 'You must pick an Audit date'
-   */
-  emptyInvalidText?: string;
-
-  /**
-   * The cancel button when props.showTime or showButton
-   *
-   * @default 'Cancel'
-   */
-  cancelFooterButtonLabel?: string;
-
-  /**
-   * The apply button when props.showTime or showButton
-   *
-   * @default 'Apply'
-   */
-  applyFooterButtonLabel?: string;
-}
-
-export type CalendarPresetOptionMethodType = (
-  options: Partial<CalendarPresetMethodOptions>,
-) => CalendarPresetAttributes;
-
-/**
- * Defines the possible transition types for Calendar.
- */
-export type CalendarPresetTransitionType =
-  | {
-      transition?: TransitionProps;
-    }
-  | ((options: CalendarPresetMethodOptions) => TransitionProps)
-  | undefined;
-
-/**
- * Options passed to methods for pass-through properties.
- */
-export interface CalendarPresetMethodOptions {
-  instance: any;
-  props: CalendarProps;
-  state: CalendarState;
-  context: Partial<CalendarContext>;
-  attrs: any;
-  parent: any;
-  global: object | undefined;
-}
-
-/**
- * Attributes for Calendar pass-through customization.
- */
-export interface CalendarPresetAttributes {
-  class?: any;
-  style?: any;
-  [key: string]: any;
-}
-
-/**
- * Defines the structure for Calendar pass-through class options.
- * Used in preset.
- */
-export interface CalendarPresetOptions {
-  root?: CalendarPresetOptionMethodType;
-  input?: CalendarPresetOptionMethodType;
-  inputicon?: CalendarPresetAttributes;
-  dropdownbutton?: {
-    root?: CalendarPresetAttributes;
-  };
-  panel?: CalendarPresetOptionMethodType;
-  datepickerMask?: CalendarPresetAttributes;
-  header?: CalendarPresetOptionMethodType;
-  previousbutton?: CalendarPresetOptionMethodType;
-  title?: CalendarPresetOptionMethodType;
-  monthTitle?: CalendarPresetAttributes;
-  yearTitle?: CalendarPresetOptionMethodType;
-  nextbutton?: CalendarPresetOptionMethodType;
-  table?: CalendarPresetAttributes;
-  tableheadercell?: CalendarPresetAttributes;
-  tablebodyrow?: CalendarPresetAttributes;
-  weekheader?: CalendarPresetAttributes;
-  weeknumber?: CalendarPresetAttributes;
-  weekday?: CalendarPresetAttributes;
-  day?: CalendarPresetAttributes;
-  weeklabelcontainer?: CalendarPresetOptionMethodType;
-  daylabel?: CalendarPresetOptionMethodType;
-  monthpicker?: CalendarPresetAttributes;
-  month?: CalendarPresetOptionMethodType;
-  yearpicker?: CalendarPresetAttributes;
-  year?: CalendarPresetOptionMethodType;
-  timepicker?: CalendarPresetAttributes;
-  separatorcontainer?: CalendarPresetAttributes;
-  separator?: CalendarPresetAttributes;
-  hourpicker?: CalendarPresetAttributes;
-  timepickerlabel?: CalendarPresetAttributes;
-  minutepicker?: CalendarPresetAttributes;
-  secondPicker?: CalendarPresetAttributes;
-  incrementbutton?: CalendarPresetAttributes;
-  incrementicon?: CalendarPresetAttributes;
-  decrementbutton?: CalendarPresetAttributes;
-  decrementicon?: CalendarPresetAttributes;
-  container?: CalendarPresetAttributes;
-  groupcontainer?: CalendarPresetAttributes;
-  group?: CalendarPresetAttributes;
-  buttonbar?: CalendarPresetAttributes;
-  todaybutton?: {
-    root?: CalendarPresetAttributes;
-  };
-  clearbutton?: {
-    root?: CalendarPresetAttributes;
-  };
-  transition?: {
-    enterFromClass?: string;
-    enterActiveClass?: string;
-    leaveActiveClass?: string;
-    leaveToClass?: string;
-  };
-}
-
-/**
- * Represents the current state of the Calendar component.
- */
-export interface CalendarState {
-  currentView: CalendarProps['view'];
-}
-
-/**
- * Defines current month options.
- */
-export interface CalendarMonthOptions {
-  /**
-   * Month index.
-   */
-  value: number;
-
-  /**
-   * Selectable state of the month.
-   */
-  selectable: boolean;
-}
-
-/**
- * Defines current year options.
- */
-export interface CalendarYearOptions {
-  /**
-   * Year value.
-   */
-  value: number;
-
-  /**
-   * Selectable state of the year.
-   */
-  selectable: boolean;
-}
-
-export interface CalendarDate {
-  /**
-   * Current date.
-   */
-  day: number;
-
-  /**
-   * Current month state.
-   */
-  month: number;
-
-  /**
-   * Current year state.
-   */
-  year: number;
-
-  /**
-   * Current today state of the calendar's day.
-   */
-  today: boolean;
-
-  /**
-   * Selectable state of the day.
-   */
-  selectable: boolean;
-
-  /**
-   * Wether the day is on other month than currently shown
-   */
-  otherMonth: boolean;
-}
-
-/**
- * Provides contextual information for the Calendar component.
- */
-export interface CalendarContext {
-  /**
-   * Current date.
-   */
-  date: CalendarDate;
-
-  /**
-   * Current today state of the calendar's day.
-   * @defaultValue false
-   */
-  today: boolean;
-
-  /**
-   * Current other month state of the calendar's day.
-   */
-  otherMonth: boolean;
-
-  /**
-   * Current selected state of the calendar's day or month or year.
-   * @defaultValue false
-   */
-  selected: boolean;
-
-  /**
-   * Current date is the first selected on range selection
-   */
-  firstSelected: boolean;
-
-  /**
-   * Current date is the last selected on range selection
-   */
-  lastSelected: boolean;
-
-  /**
-   * Current disabled state of the calendar's day or month or year.
-   * @defaultValue false
-   */
-  disabled: boolean;
-
-  /**
-   * Current month state.
-   */
-  month: CalendarMonthOptions;
-
-  /**
-   * Current month index state.
-   */
-  monthIndex: number;
-
-  /**
-   * Current year state.
-   */
-  year: CalendarYearOptions;
-}
-
 /**
  * Calendar component props
  */
 export interface CalendarProps {
   /**
-   * Bound value of the component.
-   * Supports single or multiple date selection.
-   *
-   * Used with `v-model`.
-   * @defaultValue null
+   * Calendar modelValue is date timestamp: 1706423635731
    */
-  modelValue?: Date | Date[] | null;
-
+  modelValue?: number | number[];
   /**
-   * Initial date value for pre-filling forms.
-   * Typically used for editing existing records.
-   *
-   * Accepts epoch timestamps in milliseconds.
-   *
-   * It will only watch for changes once.
+   * To display the initial date value, used in edit form, taht sometime need to display the already inputed date.
    */
   dateValue?: number | number[];
-
-  /**
-   * Epoch time in milliseconds representing the selected date(s).
-   *
-   * Can be used with `v-model:epochTimeMillis` or attaching listener 'onUpdate:epochTimeMillis',
-   * but the calendar wont update its state when this prop value changed from parent.
-   *
-   * If you need to achieve two way data binding, use v-model instead. {@link modelValue}
-   */
-  epochTimeMillis?: number | number[];
-
-  /**
-   * Defines the format in which the field value is handled.
-   * - `'date'` returns a `Date` object.
-   * - `'millis'` returns an epoch timestamp in milliseconds.
-   *
-   * @default millis
-   */
-  valueFormat?: 'date' | 'millis';
-
   /**
    * Display label on top of Date Input.
    */
   label?: string;
-
-  /**
-   * The input placeholder
-   * @default - The value on locale config {@link CalendarLocaleConfig.defaultPlaceholder}
-   */
   placeholder?: string;
   disabled?: boolean;
-
-  /**
-   * Make the calendar states readonly.
-   * If true, calendar will not allow user interaction with it. But user can view currently selected date and time.
-   *
-   * @default false
-   */
-  readonly?: boolean;
-
-  /**
-   * Identifier of the underlying input element.
-   */
-  inputId?: string | undefined;
-
-  /**
-   * Identifier of the wrapper element.
-   */
-  id?: string | undefined;
-
   /**
    * Whether single date or date range model value.
    *
    * @default 'single'
-   * @deprecated use selectionMode
    */
   mode?: 'range' | 'single';
-
-  /**
-   * Whether single date or date range model value.
-   *
-   * @default 'single'
-   */
-  selectionMode?: 'range' | 'single';
-
-  /**
-   * Whether to hide the overlay on date selection when showTime is enabled.
-   * @defaultValue false
-   */
-  hideOnDateTimeSelect?: boolean | undefined;
-
-  /**
-   * Whether to hide the overlay on date selection is completed when selectionMode is range.
-   * @defaultValue true - when showButtons and showTime false
-   * @defaultValue false - when showButtons and showTime true
-   */
-  hideOnRangeSelection?: boolean | undefined;
-
   /**
    * Type of view to display.
    * @defaultValue date
    */
   view?: 'date' | 'month' | 'year' | undefined;
-
   /**
    * Wheter show year picker or not
    *
    * @default true
    */
   showYear?: boolean;
-
   /**
    * Show button Apply and cancel on footer.
    *
@@ -382,166 +44,74 @@ export interface CalendarProps {
    * @default false;
    */
   showButtons?: boolean;
-
   /**
    * Enable Validator using vee-validate. Combine with TSForm that handle form validation.
    */
   useValidator?: boolean;
-
   /**
    * When used as field in From Validation using TSForm,
    * specify the unique field name, match with your needs for API request.
    */
   fieldName?: string;
-
-  /**
-   * Show information to user about the field.
-   */
-  fieldInfo?: string;
-
   /**
    * Whether this field should be filled or not.
    */
   mandatory?: boolean;
-
   /**
    * Show the text (opsional)
    *
    * @default true if mandatory true
    */
   showOptionalText?: boolean;
-
   /**
    * Sets the invalid state.
    */
   invalid?: boolean;
-
   /**
    * Set the custom validator message.
    * By default each field has preserved with its validator message, you don't need to worrying about the message.
    */
-  validatorMessage?: string | CustomValidation<'empty'>;
-
+  validatorMessage?: string;
   /**
    * Set custom validation message for certain condition
-   *
-   * @deprecated - use validatorMessage {@link validatorMessage}
    */
   customValidation?: CustomValidation;
-
-  /**
-   * Format of the date. Defaults to PrimeVue Locale configuration.
-   */
-  dateFormat?: string | undefined;
-
-  /**
-   * Specifies hour format.
-   * @defaultValue 24
-   */
-  hourFormat?: '12' | '24' | undefined;
-
   /**
    * Defines the calendar to use hour picker.
    */
   showTime?: boolean;
-
-  /**
-   * Separator of time selector.
-   * @defaultValue :
-   */
-  timeSeparator?: string | undefined;
-
-  /**
-   * Hours to change per step.
-   * @defaultValue 1
-   */
-  stepHour?: number | undefined;
-
-  /**
-   * Minutes to change per step.
-   * @defaultValue 1
-   */
-  stepMinute?: number | undefined;
-
   /**
    * Formats the hour picker to 12 hour format.
    * @default true
-   *
-   * @deprecated use {@link hourFormat}
    */
   useTimeFormat?: boolean;
-
   /**
    * The minimum selectable date.
    */
   minDate?: Date | undefined;
-
   /**
    * The maximum selectable date.
    */
   maxDate?: Date | undefined;
-
   /**
    * The maximum selectable year.
    *
    * The full year: 2020
-   * @todo Support number, currently only support 'current'
    */
   maxYear?: 'current' | number | undefined;
-
   /**
    * The maximum selectable months.
    *
    * Number 0-11
-   *
-   * @todo Support number, currently only support 'current'
    */
   maxMonth?: 'current' | number | undefined;
 }
 
-/**
- * Custom Calendar month change event.
- * @see {@link CalendarEmits.monthChange}
- */
-export interface CalendarMonthChangeEvent {
-  /**
-   * New month.
-   */
-  month: number;
-
-  /**
-   * New year.
-   */
-  year: number;
-}
-
-/**
- * Custom Calendar year change event.
- * @see {@link CalendarEmits.yearChange}
- */
-export interface CalendarYearChangeEvent {
-  /**
-   * New month.
-   */
-  month: number;
-
-  /**
-   * New year.
-   */
-  year: number;
-}
-
 /**
  * Calendar component emits
  */
 export type CalendarEmits = {
-  'update:modelValue': [
-    date: Date | Array<Date> | Array<Date | null> | undefined | null,
-  ];
-  'update:epochTimeMillis': [millis?: number | number[]];
-  'monthChange': [event: CalendarMonthChangeEvent];
-  'yearChange': [event: CalendarYearChangeEvent];
-  'dateSelect': [date: Date | Date[]];
+  'update:modelValue': [date?: number | number[]];
 };
 
 /**

package/components/checkbox/Checkbox.vue.d.ts

@@ -11,6 +11,7 @@ import { PassThroughOptions } from '../passthrough';
 import {
   ClassComponent,
   GlobalComponentConstructor,
+  Nullable,
   PassThrough,
 } from '../ts-helpers';
 
@@ -99,6 +100,11 @@ export interface CheckboxState {
   [key: string]: any;
 }
 
+export type CheckboxModelValue =
+  | Nullable<boolean>
+  | Record<string, any>
+  | Record<string, any>[];
+
 /**
  * Defines valid properties in Checkbox component.
  */
@@ -109,10 +115,8 @@ export interface CheckboxProps {
   value?: any;
   /**
    * Value binding of the checkbox.
-   *
-   * The value is vary depends on the {@link trueValue}, {@link falseValue}, {@link binary}
    */
-  modelValue?: any;
+  modelValue?: CheckboxModelValue;
   /**
    * The checkbox label.
    */
@@ -285,7 +289,7 @@ export type CheckboxEmits = {
    * Emitted when the value changes.
    * @param {*} value - New value.
    */
-  'update:modelValue': [value: any];
+  'update:modelValue': [value: CheckboxModelValue];
   /**
    * Callback to invoke on value change.
    * @param {Event} event - Browser event.

package/components/editor/CodeSnippetAdapter.vue.d.ts

@@ -31,18 +31,6 @@ declare const _default: import('vue').DefineComponent<{
         type: import('vue').PropType<import('@tiptap/vue-3').NodeViewProps["deleteNode"]>;
         required: true;
     };
-    view: {
-        type: import('vue').PropType<import('@tiptap/vue-3').NodeViewProps["view"]>;
-        required: true;
-    };
-    innerDecorations: {
-        type: import('vue').PropType<import('@tiptap/vue-3').NodeViewProps["innerDecorations"]>;
-        required: true;
-    };
-    HTMLAttributes: {
-        type: import('vue').PropType<import('@tiptap/vue-3').NodeViewProps["HTMLAttributes"]>;
-        required: true;
-    };
 }, {}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
     editor: {
         type: import('vue').PropType<import('@tiptap/vue-3').NodeViewProps["editor"]>;
@@ -76,17 +64,5 @@ declare const _default: import('vue').DefineComponent<{
         type: import('vue').PropType<import('@tiptap/vue-3').NodeViewProps["deleteNode"]>;
         required: true;
     };
-    view: {
-        type: import('vue').PropType<import('@tiptap/vue-3').NodeViewProps["view"]>;
-        required: true;
-    };
-    innerDecorations: {
-        type: import('vue').PropType<import('@tiptap/vue-3').NodeViewProps["innerDecorations"]>;
-        required: true;
-    };
-    HTMLAttributes: {
-        type: import('vue').PropType<import('@tiptap/vue-3').NodeViewProps["HTMLAttributes"]>;
-        required: true;
-    };
 }>>, {}, {}>;
 export default _default;

package/components/editor/MentionSection.vue.d.ts

@@ -31,18 +31,6 @@ declare const _default: import('vue').DefineComponent<{
         type: import('vue').PropType<import('@tiptap/vue-3').NodeViewProps["deleteNode"]>;
         required: true;
     };
-    view: {
-        type: import('vue').PropType<import('@tiptap/vue-3').NodeViewProps["view"]>;
-        required: true;
-    };
-    innerDecorations: {
-        type: import('vue').PropType<import('@tiptap/vue-3').NodeViewProps["innerDecorations"]>;
-        required: true;
-    };
-    HTMLAttributes: {
-        type: import('vue').PropType<import('@tiptap/vue-3').NodeViewProps["HTMLAttributes"]>;
-        required: true;
-    };
 }, {}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
     editor: {
         type: import('vue').PropType<import('@tiptap/vue-3').NodeViewProps["editor"]>;
@@ -76,17 +64,5 @@ declare const _default: import('vue').DefineComponent<{
         type: import('vue').PropType<import('@tiptap/vue-3').NodeViewProps["deleteNode"]>;
         required: true;
     };
-    view: {
-        type: import('vue').PropType<import('@tiptap/vue-3').NodeViewProps["view"]>;
-        required: true;
-    };
-    innerDecorations: {
-        type: import('vue').PropType<import('@tiptap/vue-3').NodeViewProps["innerDecorations"]>;
-        required: true;
-    };
-    HTMLAttributes: {
-        type: import('vue').PropType<import('@tiptap/vue-3').NodeViewProps["HTMLAttributes"]>;
-        required: true;
-    };
 }>>, {}, {}>;
 export default _default;

package/components/overlaypanel/OverlayPanel.vue.d.ts

@@ -16,9 +16,14 @@ import {
   PassThrough,
 } from '../ts-helpers';
 
-export declare type OverlayPanelPassThrougMethodType = (
-  options: OverlayPanelPassThroughMethodOptions,
-) => OverlayPanelPassThroughAttributes;
+export declare type OverlayPanelPassThroughOptionType =
+  | OverlayPanelPassThroughAttributes
+  | ((
+      options: OverlayPanelPassThroughMethodOptions,
+    ) => OverlayPanelPassThroughAttributes | string)
+  | string
+  | null
+  | undefined;
 
 export declare type OverlayPanelPassThroughTransitionType =
   | TransitionProps
@@ -63,19 +68,19 @@ export interface OverlayPanelPassThroughOptions {
   /**
    * Used to pass attributes to the root's DOM element.
    */
-  root?: OverlayPanelPassThroughAttributes;
+  root?: OverlayPanelPassThroughOptionType;
   /**
    * Used to pass attributes to the content's DOM element.
    */
-  content?: OverlayPanelPassThroughAttributes;
+  content?: OverlayPanelPassThroughOptionType;
   /**
    * Used to pass attributes to the close button's DOM element.
    */
-  closeButton?: OverlayPanelPassThroughAttributes;
+  closeButton?: OverlayPanelPassThroughOptionType;
   /**
    * Used to pass attributes to the close icon's DOM element.
    */
-  closeIcon?: OverlayPanelPassThroughAttributes;
+  closeIcon?: OverlayPanelPassThroughOptionType;
   /**
    * Used to manage all lifecycle hooks.
    * @see {@link BaseComponent.ComponentHooks}
@@ -91,8 +96,6 @@ export interface OverlayPanelPassThroughOptions {
  * Custom passthrough attributes for each DOM elements
  */
 export interface OverlayPanelPassThroughAttributes {
-  class: any;
-  style?: any;
   [key: string]: any;
 }