@majoo-ui/react 1.58.0 → 1.58.2-0.rc-1

package/components/card/Card.d.ts

@@ -15,10 +15,20 @@ interface CardProps {
     icon?: JSX.Element;
     showBottomLine?: boolean;
     children?: React.ReactNode;
+    /**
+     * Only show in mobile view.
+     */
+    mobileOnly?: boolean;
+    /**
+     * Only show in desktop view.
+     */
+    desktopOnly?: boolean;
 }
 export declare const CardComponent: import("@stitches/react/types/styled-component").StyledComponent<"div", {
     shadow?: boolean | "true" | undefined;
     isTemplateFormat?: boolean | "true" | undefined;
+    mobileOnly?: boolean | "true" | undefined;
+    desktopOnly?: boolean | "true" | undefined;
 }, {
     sm: "(min-width: 359px)";
     md: "(min-width: 767px)";
@@ -310,7 +320,7 @@ export declare const StyledTitle: import("@stitches/react/types/styled-component
     };
 }>>;
 export declare const Card: {
-    ({ className, children, color, shadow, radius, padding, title, width, textColor, icon, showBottomLine, label, description, ...props }: CardProps): JSX.Element;
+    ({ className, children, color, shadow, radius, padding, title, width, textColor, icon, showBottomLine, label, description, mobileOnly, desktopOnly, ...props }: CardProps): JSX.Element;
     defaultProps: {
         className: string;
         color: string;

package/components/datePicker/InputDatePicker.d.ts

@@ -137,6 +137,14 @@ export interface InputDatePickerProps {
      * Wrapping DatePicker with FloatingPortal.
      */
     portalled?: boolean;
+    /**
+     * Only show in mobile view.
+     */
+    mobileOnly?: boolean;
+    /**
+     * Only show in desktop view.
+     */
+    desktopOnly?: boolean;
 }
-export declare function InputDatePicker({ type, showRangeControl, rangePickerType, placeholder, size, disabled, onChange, onDateSelected, defaultValue: defaultDateValue, value: dateValue, defaultDate, date, advanceView, placement, css, showTimePicker, timePickerProps, minDate, maxDate, readOnly, isInvalid, allowReset, portalled, onClose, }: InputDatePickerProps): JSX.Element;
+export declare function InputDatePicker({ type, showRangeControl, rangePickerType, placeholder, size, disabled, onChange, onDateSelected, defaultValue: defaultDateValue, value: dateValue, defaultDate, date, advanceView, placement, css, showTimePicker, timePickerProps, minDate, maxDate, readOnly, isInvalid, allowReset, portalled, onClose, mobileOnly, desktopOnly, }: InputDatePickerProps): JSX.Element;
 export {};

package/components/datePicker/InputDateRangePicker.d.ts

@@ -7,6 +7,8 @@ interface ContainertRangePickerProps {
     isInvalid?: boolean;
     children: JSX.Element;
     onRangeChange(type: string): void;
+    mobileOnly?: boolean;
+    desktopOnly?: boolean;
 }
 interface InputRangePickerProps {
     value: string;
@@ -16,6 +18,8 @@ interface InputRangePickerProps {
     readOnly?: boolean;
     isInvalid?: boolean;
     onClick(): void;
+    mobileOnly?: boolean;
+    desktopOnly?: boolean;
 }
 export declare function ContainerDateRangePicker(props: ContainertRangePickerProps): JSX.Element;
 export declare function InputDateRangePicker(props: InputRangePickerProps): JSX.Element;

package/components/editableTable/EditableMobile.d.ts

@@ -17,6 +17,7 @@ interface EditableMobileProps<Data extends object> {
     onExpand?: (expanded: boolean) => void;
     hiddenColumns?: string[];
     customEmptyDataProps?: EmptyDataProps;
+    virtualized?: boolean;
 }
 export default function EditableTableMobile(props: EditableMobileProps<any>): JSX.Element;
 export {};

package/components/editableTable/EditableTable.d.ts

@@ -9,6 +9,7 @@ interface CustomRows {
     showInMobile?: boolean;
 }
 interface EditableTableProps<Data extends object> {
+    css?: CSS;
     /**
      * Columns of table.
      */
@@ -79,6 +80,10 @@ interface EditableTableProps<Data extends object> {
      * Array of hidden column id
      */
     hiddenColumns?: string[];
+    /**
+     * Activate table row virtualizer support
+     */
+    virtualized?: boolean;
 }
 interface RemoveProps {
     position?: 'leftBottom' | 'rightBottom' | 'leftTop' | 'rightTop';

package/components/editableTable/faker.d.ts

@@ -0,0 +1,16 @@
+declare type ProductType = {
+    name: string;
+    variants: ('Small' | 'Medium' | 'Large')[];
+};
+export interface IProduct {
+    id: number;
+    produk: ProductType;
+    terima_stok: boolean;
+    jumlah: number;
+    satuan: 'cup' | 'pcs';
+    harga_beli: number;
+    total: number;
+    note: string;
+}
+export declare const makeData: (len: number) => IProduct[];
+export {};

package/components/form/components/InputResourceList/InputResourceList.d.ts

@@ -7,12 +7,13 @@ export interface IResource {
     description?: string;
     icon?: () => JSX.Element;
 }
-interface IInputResourceListProps {
+export interface IInputResourceListProps {
     data: IResource[];
     disabled: boolean;
     onItemCheck(checkedItem: IResource): void;
     onItemUncheck(checkedItem: IResource): void;
     searchPlaceholder?: string;
+    counterFooter?: boolean;
     counterFooterText?: string;
     isLoading: boolean;
     enabledItems?: string[];
@@ -24,9 +25,13 @@ interface IInputResourceListProps {
     }): void;
     onQueryChange?(query: string): void;
     css?: Stitches.CSS;
+    wrapperCss?: Stitches.CSS;
     defaultSort?: 'asc' | 'desc';
     title?: string;
     hideSelectAll?: boolean;
+    renderSelectAll?: JSX.Element;
+    customHeader?: JSX.Element;
+    expandable?: boolean;
 }
-declare function InputResourceList({ data: dataProp, disabled, onItemCheck, onItemUncheck, searchPlaceholder, counterFooterText, isLoading, enabledItems, emptyDataMessage, value, fetchData, onQueryChange, css, defaultSort, title, hideSelectAll, }: IInputResourceListProps): JSX.Element;
+declare function InputResourceList({ data: dataProp, disabled, onItemCheck, onItemUncheck, searchPlaceholder, counterFooter, counterFooterText, isLoading, enabledItems, emptyDataMessage, value, fetchData, onQueryChange, css, wrapperCss, defaultSort, title, hideSelectAll, customHeader, }: IInputResourceListProps): JSX.Element;
 export default InputResourceList;

package/components/form/components/InputResourceList/ResourceList.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { IInputResourceListProps } from './InputResourceList';
+declare const ResourceList: ({ expandable, ...props }: IInputResourceListProps) => JSX.Element;
+export default ResourceList;

package/components/form/components/InputSelect/InputSelect.d.ts

@@ -1,7 +1,10 @@
 import * as React from 'react';
 import { ControllerStateAndHelpers, DownshiftProps } from 'downshift';
 import { CSS } from '../../../../config/stitches.config';
-export declare const SelectContainer: import("@stitches/react/types/styled-component").StyledComponent<"div", {}, {
+export declare const SelectContainer: import("@stitches/react/types/styled-component").StyledComponent<"div", {
+    mobileOnly?: boolean | "true" | undefined;
+    desktopOnly?: boolean | "true" | undefined;
+}, {
     sm: "(min-width: 359px)";
     md: "(min-width: 767px)";
     lg: "(min-width: 1023px)";
@@ -813,6 +816,14 @@ interface InputSelectProps extends Omit<DownshiftProps<Option>, 'initialSelected
      * Custom empty data message
      */
     emptyDataMessage?: string;
+    /**
+     * Only show in mobile view.
+     */
+    mobileOnly?: boolean;
+    /**
+     * Only show in desktop view.
+     */
+    desktopOnly?: boolean;
 }
 export declare const InputSelect: React.ForwardRefExoticComponent<InputSelectProps & React.RefAttributes<HTMLInputElement>>;
 export default InputSelect;

package/components/form/components/InputSelectCheck/OptionGroupItem.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+export default function OptionGroupItem({ item, children }: {
+    item: any;
+    children: any;
+}): JSX.Element;

package/components/form/components/index.d.ts

@@ -18,7 +18,7 @@ export * from './InputSelect';
 export { default as InputSelectCheck } from './InputSelectCheck/InputSelectCheck';
 export { default as InputSelectTag } from './InputSelectTag/InputSelectTag';
 export { default as InputCreatable } from './InputCreatable/InputCreatable';
-export { default as InputResourceList } from './InputResourceList/InputResourceList';
+export { default as InputResourceList } from './InputResourceList/ResourceList';
 export * from './InputCombobox';
 export * from './InputOTP';
 export * from './InputCounter';

package/components/mapPicker/types/index.d.ts

@@ -84,4 +84,8 @@ export interface InputMapPickerProps {
      * Change event handler.
      */
     onChange: (MapObject: any) => void;
+    /**
+     * on Marker click event handle
+     */
+    onMarkerClick: () => void;
 }

package/components/progressIndicator/ProgressIndicator.d.ts

@@ -1,13 +1,17 @@
 import React from 'react';
 interface ProgressListData {
     progress: number;
-    title: string | (() => HTMLElement | React.ReactElement | JSX.Element);
+    title?: string | (() => HTMLElement | React.ReactElement | JSX.Element);
     icon?: React.ReactElement | undefined;
+    render?: () => JSX.Element | JSX.Element;
 }
 interface ProgressIndicatorProps {
+    direction?: 'horizontal' | 'vertical';
     progress: number;
     progressError?: number;
     progressList: ProgressListData[];
+    width?: number;
+    gap?: number;
 }
 export default function ProgressIndicator(props: ProgressIndicatorProps): JSX.Element;
 export {};

package/components/table/MobileTable.d.ts

@@ -4,7 +4,15 @@ import { EmptyDataProps, RowGroup, Decoration } from './Table';
 import { TableInstance } from 'react-table';
 interface CustomRowsStyle {
     predicate: boolean;
-    css: CSS;
+    css?: CSS;
+    hideRowMenuColumn?: boolean;
+}
+interface IRowVirtualizer {
+    virtualItems: {
+        start: number;
+        end: number;
+    }[];
+    totalSize: number;
 }
 interface MobileTableProps {
     instance: TableInstance<object>;
@@ -24,6 +32,7 @@ interface MobileTableProps {
     additionalExceptionIds: string[];
     hideHeader?: boolean;
     decoration?: Decoration;
+    rowVirtualizer: IRowVirtualizer;
 }
 declare const MobileTable: React.ForwardRefExoticComponent<MobileTableProps & React.RefAttributes<HTMLDivElement>>;
 export default MobileTable;

package/components/table/Table.d.ts

@@ -1106,7 +1106,8 @@ export interface RowGroup {
 }
 interface CustomRowsStyle {
     predicate: boolean;
-    css: CSS;
+    css?: CSS;
+    hideRowMenuColumn?: boolean;
 }
 export interface ColumnInstanceProps<D extends object> extends ColumnInstance<D> {
     options?: [];
@@ -1275,8 +1276,21 @@ export interface TableProps {
      * Additional id which is not clickable and has no context menu
      */
     additionalExceptionIds?: string[];
+    /**
+     * Callback fired when the expanded rows are updated.
+     */
+    onExpand?: (expanded: object) => void;
+    /**
+     * Additional id table for unique identifier each table
+     */
+    id?: string | null;
+    /**
+     * Option for customise column to show in table <br />
+     * can be filled with boolean value or 'string' value
+     */
+    customizableColumn?: boolean | string;
 }
-export declare function Table({ columns, data: rawData, keyId, pageIndex: controlledPageIndex, totalPage, totalData, fetchData, hideDataInfo, rowsPerPageOptions, emptyDataMessage, customEmptyDataProps: emptyDataProps, isLoading, css, headerCss, hideHeader, onSelectedChange, isInfiniteScroll, hasMoreItems, rowLimit, cellAlign, selectedIds, rowGroup, decoration, hiddenColumns, columnOrder, customRowsStyle, isMobileLayout, showDuplicatedData, onRowClick, hidePagination, searchQuery, additionalExceptionIds, }: TableProps): JSX.Element;
+export declare function Table({ columns, data: rawData, keyId, pageIndex: controlledPageIndex, totalPage, totalData, fetchData, hideDataInfo, rowsPerPageOptions, emptyDataMessage, customEmptyDataProps: emptyDataProps, isLoading, css, headerCss, hideHeader, onSelectedChange, isInfiniteScroll, hasMoreItems, rowLimit, cellAlign, selectedIds, rowGroup, decoration, hiddenColumns, columnOrder, customRowsStyle, isMobileLayout, showDuplicatedData, onRowClick, hidePagination, searchQuery, additionalExceptionIds, onExpand, id, customizableColumn, }: TableProps): JSX.Element;
 export interface TableColumnProps {
     /**
      * Required if accessor is a function<br/>