@fewangsit/wangsvue-fats 1.0.0-alpha.0

package/components/buttonselecttree/ButtonSelectTree.vue.d.ts

@@ -0,0 +1,201 @@
+import { Slot } from 'vue';
+
+import { TreeNode } from '../basetree/BaseTree.vue.d';
+import { QueryParams, ShortFetchResponse } from '../datatable/DataTable.vue.d';
+import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
+
+export type KeysModelValue = number[] | undefined;
+export type NodeModelValue =
+  | number
+  | TreeNode
+  | string
+  | (number | TreeNode | string)[];
+
+export interface ButtonSelectTreeProps {
+  /**
+   * Below are props that commonly used
+   * @example - [type, value as modelvalue, fieldDataKey, selectionMode, useValidator, mandatory, fieldName, validatorMessage, label, dialogHeader]
+   */
+
+  /**
+   * The tree type.
+   */
+  type: 'group' | 'category';
+  /**
+   * The model value.
+   * If you deal with form validation of edit action,
+   * you need to bind the initital value :value="yourValue"
+   * Please take a note that you should pass value that match your `props.fieldDataKey`
+   */
+  value?: NodeModelValue;
+  /**
+   * If selection mode is single mode and you're on edit form, this props should be used
+   */
+  selectedNode?: TreeNode;
+  /**
+   * To determine which field key that will be used as value
+   */
+  fieldDataKey?: string;
+  /**
+   * The selection Mode.
+   *
+   * @default 'checkbox';
+   */
+  selectionMode?: 'single' | 'checkbox';
+  /**
+   * Wether the input should be validated with vee-validator or not.
+   * If you use this component within form input, you need to set this props as true.
+   */
+  useValidator?: boolean;
+  /**
+   * This prop is required if you use this component in a form input.
+   * Specify the unique field name, match with your needs for API request.
+   *
+   * @default 'selectTree'
+   */
+  fieldName?: string;
+  /**
+   * Make this field as mandatory on form input.
+   */
+  mandatory?: boolean;
+  /**
+   * Set custom validator message.
+   * Will be show if invalid="true"
+   */
+  validatorMessage?: string;
+  /**
+   * Set custom header Dialog Select Tree
+   */
+  dialogHeader?: string;
+  /**
+   * The button label.
+   *
+   * @default 'Select ${props.type}'
+   */
+  label?: string;
+
+  fetchTree?: (
+    type: 'group' | 'category',
+    params?: QueryParams,
+  ) => Promise<ShortFetchResponse<TreeNode> | undefined>;
+  params?: QueryParams;
+  /**
+   * Specify wether the all tree node should be auto checked once it rendered.
+   * @default false
+   */
+  autoSelectAll?: boolean;
+  /**
+   * A list of node keys that should be disabled along with their children.
+   */
+  disableKeys?: number[];
+  /**
+   * A list of node keys that should be disabled, affecting only the specified nodes and not their children.
+   */
+  exactDisableKeys?: number[];
+  /**
+   * Disable the Select button
+   */
+  disabled?: boolean;
+  exactDisableKey?: number;
+  /**
+   * Disable node 'All' selection
+   */
+  disableNodeAll?: boolean;
+  /**
+   * Old behavior is preventing select if there is no node selected.
+   *
+   * This props comes to make options, wether the selection can be empty or not.
+   * @default true
+   */
+  allowEmptySelection?: boolean;
+  /**
+   * The field label
+   */
+  fieldLabel?: string;
+  /**
+   * The information to be shown to user by hovering info icon.
+   */
+  fieldInfo?: string;
+  /**
+   * Invalid state.
+   */
+  invalid?: boolean;
+  /**
+   * Defines width of button for 'Select Group' / 'Select Category' in px.
+   * Deprecated, use props `width` instead
+   *
+   * @deprecated
+   */
+  btnWidth?: number;
+  /**
+   * Defines width of button for 'Select Group' / 'Select Category' in px.
+   */
+  width?: number;
+  /**
+   * Defines the tree is readonly and disabled.
+   */
+  readonly?: boolean;
+  /**
+   * Defines the group tree to showing disposable groups.
+   */
+  showDisposableGroups?: boolean;
+  /**
+   * Defines the tree to be flattened and shows disposable only
+   */
+  flattenDisposableNode?: boolean;
+  /**
+   * Defines the group tree to disable excluded keys
+   */
+  excludedKeys?: number[];
+  /**
+   * Define wether single selection can be edited or readonly
+   * @default true
+   */
+  singleEditable?: boolean;
+  /**
+   * Define wether single selection can be reset with close button
+   * @default false
+   */
+  singleResetable?: boolean;
+  /**
+   * Show all selected node on button render
+   *
+   * @default false
+   */
+  fetchTreeOnButtonRender?: boolean;
+}
+
+export type ButtonSelectTreeEmits = {
+  'update:value': [keys: NodeModelValue, isAllSelected?: boolean];
+  'dialogShown': [];
+  'dialogHidden': [];
+  'reset': [];
+};
+
+export interface ButtonSelectTreeSlots {
+  treenode: Slot<{ node: TreeNode }>;
+}
+
+/**
+ * **TSVue v2 - ButtonSelectTree**
+ *
+ * _ButtonSelectTree handles select tree dialog and field validaion._
+ *
+ * --- ---
+ * ![TSVue](https://ik.imagekit.io/kurniadev/TS-HEAD-BLACK.png)
+ *
+ * @group Component
+ */
+declare class ButtonSelectTree extends ClassComponent<
+  ButtonSelectTreeProps,
+  ButtonSelectTreeSlots,
+  ButtonSelectTreeEmits
+> {}
+
+declare module '@vue/runtime-core' {
+  interface GlobalComponents {
+    ButtonSelectTree: GlobalComponentConstructor<ButtonSelectTree>;
+  }
+}
+
+export default ButtonSelectTree;

package/components/buttonsplit/ButtonSplit.vue.d.ts

@@ -0,0 +1,352 @@
+/**
+ *
+ * ButtonSplit groups a set of commands in an overlay with a default command.
+ *
+ * [Live Demo](https://www.primevue.org/splitbutton/)
+ *
+ * @module splitbutton
+ *
+ */
+import { ButtonPassThroughOptions } from 'primevue/button';
+import {
+  TieredMenuPassThroughOptions,
+  TieredMenuRouterBindProps,
+} from 'primevue/tieredmenu';
+import { ButtonHTMLAttributes, VNode } from 'vue';
+
+import { ComponentHooks } from '../basecomponent';
+import { MenuItem } from '../menuitem';
+import { PassThroughOptions } from '../passthrough';
+import {
+  ClassComponent,
+  GlobalComponentConstructor,
+  HintedString,
+  PassThrough,
+} from '../ts-helpers';
+
+import { WangsIcons } from '../icon/Icon.vue';
+
+export declare type ButtonSplitPassThroughOptionType =
+  | ButtonSplitPassThroughAttributes
+  | ((
+      options: ButtonSplitPassThroughMethodOptions,
+    ) => ButtonSplitPassThroughAttributes | string)
+  | string
+  | null
+  | undefined;
+
+/**
+ * Custom passthrough(pt) option method.
+ */
+export interface ButtonSplitPassThroughMethodOptions {
+  /**
+   * Defines instance.
+   */
+  instance: any;
+  /**
+   * Defines valid properties.
+   */
+  props: ButtonSplitProps;
+  /**
+   * Defines current inline state.
+   */
+  state: ButtonSplitState;
+  /**
+   * Defines valid attributes.
+   */
+  attrs: any;
+  /**
+   * Defines parent options.
+   */
+  parent: any;
+  /**
+   * Defines passthrough(pt) options in global config.
+   */
+  global: object | undefined;
+}
+
+/**
+ * Custom shared passthrough(pt) option method.
+ */
+export interface ButtonSplitSharedPassThroughMethodOptions {
+  /**
+   * Defines valid properties.
+   */
+  props: ButtonSplitProps;
+  /**
+   * Defines current inline state.
+   */
+  state: ButtonSplitState;
+}
+
+/**
+ * Custom passthrough(pt) options.
+ * @see {@link ButtonSplitProps.pt}
+ */
+export interface ButtonSplitPassThroughOptions {
+  /**
+   * Used to pass attributes to the root's DOM element.
+   */
+  root?: ButtonSplitPassThroughOptionType;
+  /**
+   * Used to pass attributes to the button's DOM element.
+   */
+  button?: ButtonSplitPassThroughOptionType;
+  /**
+   * Used to pass attributes to the Button component.
+   * @see {@link ButtonPassThroughOptions}
+   */
+  menuButton?: ButtonPassThroughOptions<ButtonSplitSharedPassThroughMethodOptions>;
+  /**
+   * Used to pass attributes to the TieredMenu component.
+   * @see {@link TieredMenuPassThroughOptions}
+   */
+  menu?: TieredMenuPassThroughOptions<ButtonSplitSharedPassThroughMethodOptions>;
+  /**
+   * Used to manage all lifecycle hooks.
+   * @see {@link BaseComponent.ComponentHooks}
+   */
+  hooks?: ComponentHooks;
+}
+
+/**
+ * Custom passthrough attributes for each DOM elements
+ */
+export interface ButtonSplitPassThroughAttributes {
+  [key: string]: any;
+}
+
+/**
+ * Defines current inline state in ButtonSplit component.
+ */
+export interface ButtonSplitState {
+  /**
+   * Current blocked state as a boolean.
+   * @defaultValue false
+   */
+  isBlocked: boolean;
+}
+
+/**
+ * Defines valid properties in ButtonSplit component.
+ */
+export interface ButtonSplitProps {
+  /**
+   * Text of the button.
+   */
+  label?: string | undefined;
+  /**
+   * Name of the icon of main button.
+   */
+  icon?: WangsIcons | undefined;
+  /**
+   * MenuModel instance to define the overlay items.
+   */
+  model?: MenuItem[] | undefined;
+  /**
+   * Whether to automatically manage layering.
+   * @defaultValue true
+   */
+  autoZIndex?: boolean | undefined;
+  /**
+   * Base zIndex value to use in layering.
+   * @defaultValue 0
+   */
+  baseZIndex?: number | undefined;
+  /**
+   * A valid query selector or an HTMLElement to specify where the overlay gets attached.
+   * Special keywords are 'body' for document body and 'self' for the element itself.
+   * @defaultValue body
+   */
+  appendTo?: HintedString<'body' | 'self'> | undefined | HTMLElement;
+  /**
+   * When present, it specifies that the element should be disabled.
+   * @defaultValue false
+   */
+  disabled?: boolean | undefined;
+  /**
+   * Style class of the component.
+   */
+  class?: any | undefined;
+  /**
+   * Inline style of the component.
+   */
+  style?: any | undefined;
+  /**
+   * Used to pass all properties of the HTMLButtonElement to the default button.
+   */
+  buttonProps?: ButtonHTMLAttributes | undefined;
+  /**
+   * Used to pass all properties of the HTMLButtonElement to the menu button.
+   */
+  menuButtonProps?: ButtonHTMLAttributes | undefined;
+  /**
+   * Name of the menu button icon.
+   */
+  menuButtonIcon?: WangsIcons | undefined;
+  /**
+   * Defines the style of the button.
+   */
+  severity?:
+    | HintedString<
+        | 'secondary'
+        | 'success'
+        | 'info'
+        | 'warning'
+        | 'help'
+        | 'danger'
+        | 'contrast'
+      >
+    | undefined;
+  /**
+   * Add a shadow to indicate elevation.
+   * @defaultValue false
+   */
+  raised?: boolean | undefined;
+  /**
+   * Add a circular border radius to the button.
+   * @defaultValue false
+   */
+  rounded?: boolean | undefined;
+  /**
+   * Add a textual class to the button without a background initially.
+   * @defaultValue false
+   */
+  text?: boolean | undefined;
+  /**
+   * Add a border class without a background initially.
+   * @defaultValue false
+   */
+  outlined?: boolean | undefined;
+  /**
+   * Defines the size of the button.
+   */
+  size?: 'small' | 'large' | undefined;
+  /**
+   * Add a plain textual class to the button without a background initially.
+   * @defaultValue false
+   */
+  plain?: boolean | undefined;
+  /**
+   * Used to pass attributes to DOM elements inside the component.
+   * @type {ButtonSplitPassThroughOptions}
+   */
+  pt?: PassThrough<ButtonSplitPassThroughOptions>;
+  /**
+   * 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;
+}
+
+/**
+ * Defines valid slots in ButtonSplit component.
+ */
+export interface ButtonSplitSlots {
+  /**
+   * Button part of the content can easily be customized with the default slot instead of using the built-in modes.
+   */
+  default(): VNode[];
+  /**
+   * Command button part of the content can easily be customized with the button content slot.
+   */
+  buttoncontent(): VNode[];
+  /**
+   * Custom button icon template.
+   * @param {Object} scope - icon slot's params.
+   */
+  icon(scope: {
+    /**
+     * Style class of the icon.
+     */
+    class: string;
+  }): VNode[];
+  /**
+   * Custom menu button icon template.
+   * @param {Object} scope - menubuttonicon slot's params.
+   */
+  menubuttonicon(scope: {
+    /**
+     * Style class of the icon.
+     */
+    class: string;
+  }): VNode[];
+  /**
+   * Custom menu item icon template.
+   * @param {Object} scope - menuitemicon slot's params.
+   */
+  menuitemicon(scope: {
+    /**
+     * Menuitem instance
+     */
+    item: MenuItem;
+    /**
+     * Style class of the item icon element.
+     */
+    class: any;
+  }): VNode[];
+  /**
+   * Custom content for each menu item.
+   * @param {Object} scope - item slot's params.
+   */
+  item(scope: {
+    /**
+     * Menuitem instance
+     */
+    item: MenuItem;
+    /**
+     * Label property of the menuitem
+     */
+    label: string | ((...args: any) => string) | undefined;
+    /**
+     * Binding properties of the menuitem
+     */
+    props: TieredMenuRouterBindProps;
+    /**
+     * Whether or not there is a submenu
+     */
+    hasSubmenu: boolean;
+  }): VNode[];
+}
+
+/**
+ * Defines valid emits in ButtonSplit component.
+ */
+export interface ButtonSplitEmits {
+  /**
+   * Callback to invoke when main button is clicked.
+   * @param {Event} event - Browser event.
+   */
+  click(event: Event): void;
+}
+
+/**
+ * **PrimeVue - ButtonSplit**
+ *
+ * _ButtonSplit groups a set of commands in an overlay with a default command._
+ *
+ * [Live Demo](https://www.primevue.org/splitbutton/)
+ * --- ---
+ * ![PrimeVue](https://primefaces.org/cdn/primevue/images/logo-100.png)
+ *
+ * @group Component
+ *
+ */
+declare class ButtonSplit extends ClassComponent<
+  ButtonSplitProps,
+  ButtonSplitSlots,
+  ButtonSplitEmits
+> {}
+
+declare module 'vue' {
+  export interface GlobalComponents {
+    ButtonSplit: GlobalComponentConstructor<ButtonSplit>;
+  }
+}
+
+export default ButtonSplit;

package/components/buttonsync/ButtonSync.vue.d.ts

@@ -0,0 +1,22 @@
+import { ClassComponent } from '../ts-helpers';
+
+export interface ButtonSyncProps {
+  /**
+   * Defines no scan buttons in hardware sync dialog footer.
+   */
+  withoutScanBtn?: boolean;
+}
+
+declare class ButtonSync extends ClassComponent<
+  ButtonSyncProps,
+  unknown,
+  unknown
+> {}
+
+declare module 'vue' {
+  export interface GlobalComponents {
+    ButtonSync: typeof ButtonSync;
+  }
+}
+
+export default ButtonSync;

package/components/buttontoggle/ButtonToggle.vue.d.ts

@@ -0,0 +1,19 @@
+import { DefineComponent } from 'vue';
+
+import {
+  ToggleSwitchEmits,
+  ToggleSwitchProps,
+} from '../toggleswitch/ToggleSwitch.vue.d';
+
+export type ButtonToggleProps = ToggleSwitchProps & {};
+export type ButtonToggleEmits = ToggleSwitchEmits & {};
+
+/**
+ * @deprecated Use ToggleSwitch component instead.
+ */
+declare const ButtonToggle: DefineComponent<
+  ButtonToggleProps,
+  ButtonToggleEmits
+>;
+
+export default ButtonToggle;

package/components/buttonviewlog/ButtonViewLog.vue.d.ts

@@ -0,0 +1,17 @@
+import { ClassComponent } from '../../components/ts-helpers.d';
+
+export interface ButtonViewLogProps {
+  showLog?: boolean;
+}
+
+export type ButtonViewLogEmits = {
+  'update:showLog': [state: boolean];
+};
+
+declare class ButtonViewLog extends ClassComponent<
+  ButtonViewLogProps,
+  unknown,
+  ButtonViewLogEmits
+> {}
+
+export default ButtonViewLog;