@fewangsit/wangsvue-fats 1.0.0-alpha.0

package/components/button/Button.vue.d.ts

@@ -0,0 +1,189 @@
+import { TooltipOptions } from 'primevue/tooltip';
+import { ButtonHTMLAttributes, VNode } from 'vue';
+
+import { WangsIcons } from '../icon/Icon.vue.d';
+import {
+  ClassComponent,
+  GlobalComponentConstructor,
+  HintedString,
+} from '../ts-helpers';
+
+/**
+ * Defines valid properties in Button component.
+ */
+export interface ButtonProps extends /* @vue-ignore */ ButtonHTMLAttributes {
+  /**
+   * Inline style of the button.
+   */
+  style?: any;
+  /**
+   * Style class of the button.
+   */
+  class?: any;
+  /**
+   * Text of the button.
+   */
+  label?: string | undefined;
+  /**
+   * Name of the icon.
+   */
+  icon?: WangsIcons | undefined;
+  /**
+   * Position of the icon.
+   * @defaultValue left
+   */
+  iconPos?: 'left' | 'right' | 'top' | 'bottom' | undefined;
+  /**
+   * Style class of the icon.
+   */
+  iconClass?: string | undefined;
+  /**
+   * Tooltip/information to show on button hover.
+   */
+  tooltip?: string | TooltipOptions;
+  /**
+   * Set the position of tooltip.
+   * @default bottom
+   */
+  tooltipPos?: 'top' | 'right' | 'bottom' | 'left';
+  /**
+   * Value of the badge.
+   */
+  badge?: string | undefined;
+  /**
+   * Style class of the badge.
+   */
+  badgeClass?: string | undefined;
+  /**
+   * Severity type of the badge.
+   */
+  badgeSeverity?:
+    | HintedString<
+        'secondary' | 'info' | 'success' | 'warning' | 'danger' | 'contrast'
+      >
+    | null
+    | undefined;
+  /**
+   * Whether the button is in loading state.
+   * @defaultValue false
+   */
+  loading?: boolean | undefined;
+  /**
+   * Icon to display in loading state.
+   */
+  loadingIcon?: string | undefined;
+  /**
+   *  Add a link style to the button.
+   * @defaultValue false
+   */
+  link?: boolean | 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;
+}
+
+/**
+ * Defines current options in Button component.
+ */
+export interface ButtonContext {
+  /**
+   * Current disabled state of the element as a boolean.
+   * @defaultValue false
+   */
+  disabled: boolean;
+}
+
+/**
+ * Defines valid slots in Button component.
+ */
+export interface ButtonSlots {
+  /**
+   * Custom content such as icons, images and text can be placed inside the button via the default slot. Note that when slot is used, label, icon and badge properties are not included.
+   */
+  default(): VNode[];
+  /**
+   * Custom icon template.
+   * @param {Object} scope - icon slot's params.
+   */
+  icon(scope: {
+    /**
+     * Style class of the icon.
+     */
+    class: string;
+  }): VNode[];
+  /**
+   * Custom loading icon template.
+   * @param {Object} scope - loading icon slot's params.
+   */
+  loadingicon(scope: {
+    /**
+     * Style class of the loading icon.
+     */
+    class: string;
+  }): VNode[];
+}
+
+/**
+ * **WangsVue - Button**
+ *
+ * _Button is an extension to standard button element with icons and theming._
+ *
+ * [Live Demo](https://fewangsit.github.io/wangsvue/table)
+ * --- ---
+ * ![WangsVue](https://www.wangs.id/wp-content/uploads/2023/12/cropped-Logo_Wangsid-removebg-preview-192x192.png)
+ *
+ * @group Component
+ */
+declare class Button extends ClassComponent<
+  ButtonProps,
+  ButtonSlots,
+  Record<string, unknown>
+> {}
+
+declare module '@vue/runtime-core' {
+  interface GlobalComponents {
+    Button: GlobalComponentConstructor<Button>;
+  }
+}
+
+export default Button;

package/components/buttonImportExcel/ButtonImportExcel.vue.d.ts

@@ -0,0 +1,35 @@
+import { TableColumn } from '../datatable/DataTable.vue.d';
+import { DialogFormProps } from '../dialogform/DialogForm.vue.d';
+import { ClassComponent } from '../ts-helpers';
+
+export interface ButtonImportExcelProps {
+  tableName: string;
+  dialog?: Omit<DialogFormProps, 'visible'>;
+  fileUpload?: {
+    /**
+     * @default 'File Upload'
+     */
+    label: string;
+    placeholder: string;
+  };
+
+  /**
+   * In case field from excel is different from datatable columns
+   * Also to determine field type for field that has datatype other than string
+   *
+   * @description - Array of string should be in order based on column order in data table
+   */
+  columnFields?: { field: string; fieldType?: TableColumn['fieldType'] }[];
+}
+
+export type ButtonImportExcelEmits = {
+  importedJson: [value: unknown[]];
+};
+
+declare class ButtonImportExcel extends ClassComponent<
+  ButtonImportExcelProps,
+  ButtonImportExcelEmits,
+  unknown
+> {}
+
+export default ButtonImportExcel;

package/components/buttonaddbyscan/ButtonAddByScan.vue.d.ts

@@ -0,0 +1,40 @@
+import { Asset } from '@tagsamurai/fats-api-services/src/types/oldAssetService.type';
+
+import { QueryParams } from '../../components/datatable/DataTable.vue.d';
+import { ClassComponent } from '../../components/ts-helpers.d';
+
+export type AssetWithOptionalTAG = Omit<Asset, 'qr' | 'rfid'> & {
+  qr?: string | boolean;
+  rfid?: string | boolean;
+};
+
+export type ScanPayload = {
+  type: 'RFID' | 'QR';
+  code: string;
+  device: string; // Serial Number
+  asset?: AssetWithOptionalTAG;
+};
+
+export type ButtonAddByScanEmits = {
+  'update:modelValue': [assets: AssetWithOptionalTAG[]];
+  'scan': [payload: ScanPayload];
+};
+
+export interface ButtonAddByScanProps {
+  /**
+   * Defines asset data that already in the table.
+   *
+   */
+  modelValue: AssetWithOptionalTAG[];
+  reportedDisposalAssets?: boolean;
+  noDisposalAssets?: boolean;
+  queryParams?: QueryParams;
+}
+
+declare class ButtonAddByScan extends ClassComponent<
+  ButtonAddByScanProps,
+  unknown,
+  ButtonAddByScanEmits
+> {}
+
+export default ButtonAddByScan;

package/components/buttonbulkaction/ButtonBulkAction.vue.d.ts

@@ -0,0 +1,105 @@
+import { DefineComponent } from 'vue';
+
+import { MenuItem } from '../menuitem';
+
+export interface ButtonBulkActionLocaleConfig {
+  /**
+   * @example `{length} data selected`
+   */
+  currentSelectionMessage?: string;
+
+  /**
+   * @description Label for when all records have been selected.
+   * @example 'Select all ({totalRecords} data)' - totalRecords - The total number of records available to select.
+   */
+  allRecordSelected?: string;
+
+  /**
+   * @description Label for the "Select All" option in a bulk action button.
+   * @example `Select all ({totalRecords} items)` - totalRecords - The total number of records available to select.
+   */
+  selectAllRecords?: string;
+}
+
+export interface ButtonBulkActionProps {
+  /**
+   * Disable the button.
+   */
+  disabled?: boolean;
+  /**
+   * An array of data objects to be included in an action.
+   * Use as 'v-model:selectedData' to automatically reset on Cancel or Apply.
+   */
+  selectedData: Record<string, any>[];
+  /**
+   * The total selectable data. This is optional when working with dynamic data table,
+   * just define tableName, the component will handle the rest for you
+   *
+   */
+  totalRecords?: number;
+  options: MenuItem[];
+  /**
+   * Multiple bulk action mounted at the same time will cause unexpected behavior.
+   *
+   * You need to set the appropriate id the same with the table-name where the bulkaction used for.
+   */
+  tableName?: string;
+  /**
+   * Specify the select manue type. Default to overlay-panel
+   *
+   * @default overlay-panel
+   * @default dropdown - for wangsvue-acts
+   *
+   * @options dropdown overlay-panel
+   */
+  selectMenuType?: 'dropdown' | 'overlay-panel';
+  /**
+   * Specify the name/label for selected data.
+   *
+   * @example 'Asset(s)' will be displayed as '3 Asset(s) Selected'
+   * @default 'Data' for all packages
+   */
+  naming?: string;
+}
+
+export interface ButtonBulkActionSlots {
+  /**
+   * Use additional slot like input field.
+   * The button Apply will be shown if the selected option use additional slot.
+   *
+   * @slotprops selectedOption the current selected option/action. you can do conditional based on this slotprops.
+   */
+  addition(selectedOption: MenuItem): () => any;
+}
+
+export type ButtonBulkActionEmits = {
+  /**
+   * Emits when Apply button is clicked.
+   *
+   * By default, 'command' on MenuItem will be executed.
+   * With this event, You can do additional actions.
+   */
+  'apply': [];
+  /**
+   * Emits when Cancel or Apply button is clicked.
+   */
+  'update:selectedData': [datas: Record<string, unknown>[]];
+};
+
+/**
+ * **WangsVue - ButtonBulkAction**
+ *
+ * _ButtonBulkAction is a component for handling bulk action for multiple data at once._
+ *
+ * --- ---
+ * ![WangsVue](https://www.wangs.id/wp-content/uploads/2023/12/cropped-Logo_Wangsid-removebg-preview-192x192.png)
+ *
+ * @group buttons
+ */
+declare const ButtonBulkAction: DefineComponent<
+  ButtonBulkActionProps,
+  ButtonBulkActionSlots,
+  ButtonBulkActionEmits
+>;
+
+export default ButtonBulkAction;

package/components/buttoncopy/ButtonCopy.vue.d.ts

@@ -0,0 +1,26 @@
+import { DefineComponent } from 'vue';
+
+export interface ButtonCopyProps {
+  /**
+   * Text to be copied.
+   */
+  text: string;
+}
+
+/**
+ * **WangsVue - ButtonCopy**
+ *
+ * _ButtonCopy is a component for copying text to the clipboard._
+ *
+ * --- ---
+ * ![WangsVue](https://www.wangs.id/wp-content/uploads/2023/12/cropped-Logo_Wangsid-removebg-preview-192x192.png)
+ *
+ * @group buttons
+ */
+declare const ButtonCopy: DefineComponent<
+  ButtonCopyProps,
+  Record<string, unknown>,
+  Record<string, unknown>
+>;
+
+export default ButtonCopy;

package/components/buttondownload/ButtonDownload.vue.d.ts

@@ -0,0 +1,80 @@
+import { DataTableProps } from '../datatable/DataTable.vue.d';
+import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers.d';
+
+export interface ButtonDownloadLocaleConfig {
+  /**
+   * Message to display on loading ovevrlay while downloading
+   */
+  downloadingMessage: string;
+
+  /**
+   * Text when booleanValue is true
+   */
+  trueText: string;
+
+  /**
+   * Text when booleanValue is false
+   */
+  falseText: string;
+}
+
+export interface ButtonDownloadProps {
+  fileName: string;
+  /**
+   * Text of the button.
+   */
+  label?: string;
+  /**
+   * Specify which table to be exported.
+   * When it is not specified, the default name of data table will be used.
+   *
+   * @default 'datatable'
+   */
+  tableName?: string;
+  /**
+   * If you want to download multiple table in 1 excel
+   */
+  multiTableNames?: string[];
+  /**
+   * Texts below table in downloaded excel
+   */
+  additionalTextBelowTable?: (string | string[])[];
+  /**
+   * If this props exist, download data from provided configs instead syncing with data tables
+   */
+  dataConfigs?: Pick<
+    DataTableProps,
+    'columns' | 'fetchFunction' | 'data' | 'tableTitle'
+  >[];
+  /**
+   * Specify the error message download excel when tableConfigs is in use
+   *
+   * @example 'Error, failed to download {fileName}' - fileName will be replaced
+   */
+  excelToastErrorMessage?: string;
+}
+
+/**
+ * **WangsVue - ButtonDownload**
+ *
+ * _Trigger DataTable Export Excel_
+ *
+ * [Live Demo](https://fewangsit.github.io/wangsvue/button)
+ * --- ---
+ * ![WangsVue](https://www.wangs.id/wp-content/uploads/2023/12/cropped-Logo_Wangsid-removebg-preview-192x192.png)
+ *
+ * @group Component
+ */
+declare class ButtonDownload extends ClassComponent<
+  ButtonDownloadProps,
+  Record<string, unknown>,
+  Record<string, unknown>
+> {}
+
+declare module '@vue/runtime-core' {
+  interface GlobalComponents {
+    ButtonDownload: GlobalComponentConstructor<ButtonDownload>;
+  }
+}
+
+export default ButtonDownload;

package/components/buttonfilter/ButtonFilter.vue.d.ts

@@ -0,0 +1,12 @@
+import { DefineComponent } from 'vue';
+
+export interface ButtonFilterProps {
+  /**
+   * Integrate with datatable with table name
+   */
+  tableName?: string;
+}
+
+declare const ButtonFilter: DefineComponent<ButtonFilterProps>;
+
+export default ButtonFilter;