@starasia/admin 1.2.5 → 1.2.6

package/dist/components/AdvanceFilterBar/AdvanceFilterBar.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+import { AdvanceFilterBarProps } from './types';
+
+export declare const AdvanceFilterBar: ({ searchKey, statusKey, searchPlaceholder, searchHighlightPlaceholder, extendedFilter, showSearchFilter, showStatusFilter, filterKey, pageKey, customWidthSearch, handleOnReset, filterConfigs, buttonToggleProps, position, titleSearchLabel, withTitleLabels }: AdvanceFilterBarProps) => React.JSX.Element;

package/dist/components/AdvanceFilterBar/FilterDrawer.d.ts

@@ -0,0 +1,61 @@
+import { default as React } from 'react';
+import { IDateProps } from '@starasia/date';
+import { IDropdown } from '@starasia/dropdown';
+
+interface RadioFilterConfig {
+    type: 'radio';
+    title: string;
+    name: string;
+    radioList: {
+        id: number;
+        label: string;
+        value: string;
+        icon?: React.ReactNode;
+    }[];
+    show?: boolean;
+}
+interface DropdownFilterConfig {
+    type: 'dropdown';
+    title: string;
+    name: string;
+    dropdownLists?: IDropdown['dropdownLists'];
+    isLoading?: boolean;
+    onSearch?: (v: string) => void;
+    search?: string;
+    searchable?: boolean;
+    onClickContainer?: () => void;
+    show?: boolean;
+}
+interface DropdownMultipleFilterConfig {
+    type: 'dropdown-multiple';
+    title: string;
+    name: string;
+    dropdownLists?: {
+        label: string;
+        value: string;
+    }[];
+    isLoading?: boolean;
+    onClickContainer?: () => void;
+    show?: boolean;
+}
+interface DateRangeFilterConfig {
+    type: 'date-range';
+    title: string;
+    name: string;
+}
+interface DateFilterConfig {
+    type: 'date';
+    title: string;
+    name: string;
+    filter: IDateProps['filter'];
+}
+export type FilterConfig = RadioFilterConfig | DropdownFilterConfig | DropdownMultipleFilterConfig | DateRangeFilterConfig | DateFilterConfig;
+interface FilterDrawerProps {
+    isOpen?: boolean;
+    onClose: () => void;
+    filterKey?: string;
+    pageKey?: string;
+    filters?: FilterConfig[];
+}
+export declare const FilterDrawer: ({ isOpen, onClose, filterKey, pageKey, filters }: FilterDrawerProps) => React.JSX.Element;
+export {};

package/dist/components/AdvanceFilterBar/index.d.ts

@@ -0,0 +1,5 @@
+export { AdvanceFilterBar } from './AdvanceFilterBar';
+export { FilterDrawer } from './FilterDrawer';
+export type { FilterConfig } from './FilterDrawer';
+export type { AdvanceFilterBarProps, TableFilterBarProps, ChangeHandler, ExtendedFilter, GetValuesFilterProps } from './types';
+export { handleChangeFilter, getValueSearch, getValuesFilter, getValueDropdownMultipleFilter, getValueRadioFilter, getDateRangeFilterValue, getDateFilterValue, isFilterActive, resolveDropdownValueToString, resolveRadioValueToString, resolveDateRangeValueToString, resolveDateValueToString } from './utils';

package/dist/components/AdvanceFilterBar/types.d.ts

@@ -0,0 +1,53 @@
+import { SetURLSearchParams } from 'react-router';
+import { FilterConfig } from './FilterDrawer';
+import { IconName } from '@starasia/icon';
+
+export interface TableFilterBarProps {
+    titleSearchLabel?: string;
+    searchKey?: string;
+    statusKey?: string;
+    searchPlaceholder?: string;
+    searchHighlightPlaceholder?: string;
+    withSearchParam?: boolean;
+    extendedFilter?: ExtendedFilter[];
+    showStatusFilter?: boolean;
+    showSearchFilter?: boolean;
+    filterKey?: string;
+    pageKey?: string;
+    handleOnReset?: () => void;
+    customWidthSearch?: string;
+    withTitleLabels?: boolean;
+    position?: 'left' | 'right';
+}
+export interface AdvanceFilterBarProps extends Omit<TableFilterBarProps, 'withSearchParam'> {
+    filterConfigs?: FilterConfig[];
+    buttonToggleProps?: {
+        isShowLabel?: boolean;
+        icon?: IconName;
+    };
+}
+type InputType = 'search' | 'dropdown' | 'date-range' | 'advanced-date-range' | 'radio' | 'dropdown-multiple' | 'date';
+export type ChangeHandler = (params: {
+    value: any;
+    name?: string;
+    type?: InputType;
+    withSearchParam?: boolean;
+    setSearchParams: SetURLSearchParams;
+    searchQueries: Record<string, string>;
+    dropdownSearchKey?: string;
+    filterKey?: string;
+    pageKey?: string;
+}) => void;
+export type ExtendedFilter = {
+    minWidth?: string;
+    title: string;
+    content: React.ReactNode;
+    onClickContainer?: () => void;
+};
+export type GetValuesFilterProps = {
+    searchParams: URLSearchParams;
+    filterKey?: string;
+    name: string;
+    get: 'value' | 'label';
+};
+export {};

package/dist/components/AdvanceFilterBar/utils.d.ts

@@ -0,0 +1,31 @@
+import { IDateRange } from '@starasia/date';
+import { IDropdown } from '@starasia/dropdown';
+import { ChangeHandler, GetValuesFilterProps } from './types';
+
+export declare const resolveDropdownValueToString: (value: IDropdown["defaultValue"]) => string;
+export declare const resolveRadioValueToString: (value: {
+    id: number;
+    label: string;
+    value: string;
+}) => string;
+export declare const resolveDateRangeValueToString: (value: IDateRange) => string;
+export declare const resolveDateValueToString: (value: Date) => string;
+export declare const handleChangeFilter: ChangeHandler;
+export declare const getValuesFilter: ({ name, filterKey, searchParams, get }: GetValuesFilterProps) => any;
+export declare const getValueDropdownMultipleFilter: ({ name, filterKey, searchParams, get }: Omit<GetValuesFilterProps, "get"> & {
+    get: "value" | "label" | "array";
+}) => any;
+export declare const getValueRadioFilter: ({ name, filterKey, searchParams, get }: Omit<GetValuesFilterProps, "get"> & {
+    get: "value" | "label" | "id";
+}) => any;
+export declare const getValueSearch: (name: string, searchParams: URLSearchParams, filterKey?: string) => any;
+export declare const getDateRangeFilterValue: ({ name, filterKey, searchParams }: GetValuesFilterProps) => {
+    start: string;
+    end: string;
+};
+export declare const getDateFilterValue: ({ name, filterKey, searchParams }: GetValuesFilterProps) => Date | undefined;
+export declare const isFilterActive: (searchParams: URLSearchParams, { filterKey, perPageKey, pageKey }: {
+    filterKey?: string;
+    perPageKey?: string;
+    pageKey?: string;
+}) => boolean;

package/dist/components/AppLayout/index.d.ts

@@ -16,6 +16,10 @@ interface AppLayoutProps {
      * Dapat berupa: Organization Menu, User Switcher, Custom Component, atau kombinasinya
      */
     sidebarHeaderContent?: ReactNode;
+    /**
+     * Show/hide module switcher control in header (and its modal)
+     */
+    showModuleSwitcher?: boolean;
 }
 /**
  * AppLayout - Main application layout component based on workspace pattern
@@ -30,5 +34,5 @@ interface AppLayoutProps {
  * - Loading overlay support
  * - Embed mode for iframes
  */
-export declare function AppLayout({ children, headerRight, profile, isLoadingProfile, onLogout, isLoggingOut, loadingComponent, sidebarHeaderContent, }: AppLayoutProps): React.JSX.Element;
+export declare function AppLayout({ children, headerRight, profile, isLoadingProfile, onLogout, isLoggingOut, loadingComponent, sidebarHeaderContent, showModuleSwitcher, }: AppLayoutProps): React.JSX.Element;
 export {};

package/dist/components/TableSection/components/ColumnFilterDropdown.d.ts

@@ -0,0 +1,9 @@
+import { default as React } from 'react';
+import { ColumnFilter } from '../types';
+
+interface Props {
+    filter: ColumnFilter;
+    columnTitle: string;
+}
+export declare const ColumnFilterDropdown: ({ filter, columnTitle }: Props) => React.JSX.Element;
+export {};

package/dist/components/TableSection/components/DataTable.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+import { BaseRecord, DataTableProps } from '../types';
+
+export declare const DataTable: <T extends BaseRecord>({ columns, records, handleDetail, handleUpdate, handleDelete, isLoading, visibleHandleDelete, visibleHandleUpdate, visibleHandleDetail, showHeadBorder, scrollParentRef, frozenCount, onFrozenCountChange, customActions, actionsOrder, customEmptyState }: DataTableProps<T>) => React.JSX.Element;

package/dist/components/TableSection/components/Footer.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+import { TableFooterProps } from '../types';
+
+export declare const TableFooter: ({ pagination, pageKey, perPageKey, defaultPerPage, showPagination, totalData }: TableFooterProps) => React.JSX.Element;

package/dist/components/TableSection/components/Header.d.ts

@@ -0,0 +1,19 @@
+import { default as React, ReactNode } from 'react';
+import { AdvanceFilterBarProps } from '../../AdvanceFilterBar/types';
+import { ButtonProps } from '@starasia/button';
+import { IconName } from '@starasia/icon';
+
+interface ActionProps {
+    title?: string | ReactNode;
+    icon?: IconName;
+    buttonProps?: ButtonProps;
+    onClick?: () => void;
+}
+export type TableHeaderProps = {
+    action?: ActionProps[] | React.ReactNode;
+    advanceFilter?: AdvanceFilterBarProps;
+    show?: boolean;
+    showFilter?: boolean;
+};
+export declare const TableHeader: ({ action, advanceFilter, showFilter }: TableHeaderProps) => React.JSX.Element;
+export {};

package/dist/components/TableSection/components/TableSection.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+import { BaseRecord, TableSectionProps } from '../types';
+
+export declare const TableSection: <T extends BaseRecord>({ wrapperProps, dataTableProps, headerProps, footerProps }: TableSectionProps<T>) => React.JSX.Element;

package/dist/components/TableSection/components/Wrapper.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+import { WrapperProps } from '../types';
+
+export declare const TableWrapper: ({ children, borderRadius }: WrapperProps) => React.JSX.Element;

package/dist/components/TableSection/index.d.ts

@@ -0,0 +1,7 @@
+export { TableSection } from './components/TableSection';
+export { TableWrapper } from './components/Wrapper';
+export { TableHeader } from './components/Header';
+export { TableFooter } from './components/Footer';
+export { DataTable } from './components/DataTable';
+export { ColumnFilterDropdown } from './components/ColumnFilterDropdown';
+export type { TableSectionProps, BaseRecord, Column, ColumnFilter, DataTableProps, WrapperProps, TableHeaderProps, TableFooterProps } from './types';

package/dist/components/TableSection/types.d.ts

@@ -0,0 +1,99 @@
+import { BoxProps } from '@starasia/box';
+import { ButtonProps } from '@starasia/button';
+import { IconName } from '@starasia/icon';
+import { AdvanceFilterBarProps } from '../AdvanceFilterBar';
+import { ReactNode } from 'react';
+
+export interface BaseRecord {
+    id: number | string;
+}
+export interface Pagination {
+    currentPage: number;
+    perPage: number;
+    totalPage: number;
+    totalData: number;
+    totalCurrentPage: number;
+    rangeStart?: number;
+    rangeEnd?: number;
+}
+type Accessor<T> = keyof T | ((record: T) => React.ReactNode) | string;
+export interface ColumnFilter {
+    options: {
+        label: string;
+        value: string;
+    }[];
+    selectedValues: string[];
+    onFilterChange: (values: string[]) => void;
+    isLoadingOptions?: boolean;
+    position?: 'left' | 'right';
+    hideSearch?: boolean;
+    onOpen?: () => void;
+}
+export interface Column<T> {
+    accessor?: Accessor<T>;
+    title: string;
+    textAlign?: 'text-left' | 'text-center' | 'text-right';
+    render?: (record: T, colIndex: number, records: T[]) => React.ReactNode;
+    bgColor?: (record: T, colIndex: number, records: T[]) => string;
+    showBorderLeft?: boolean;
+    showBorderRight?: boolean;
+    width?: string;
+    filter?: ColumnFilter;
+}
+export interface DataTableProps<T extends BaseRecord> {
+    columns: Column<T>[];
+    records?: T[];
+    handleDetail?: (id: number | string, item: T) => void;
+    handleUpdate?: (item: T) => void;
+    handleDelete?: (id: number | string, record: T) => void;
+    visibleHandleDelete?: (item: T) => boolean;
+    visibleHandleUpdate?: (item: T) => boolean;
+    visibleHandleDetail?: (item: T) => boolean;
+    pagination?: Pagination;
+    showHeadBorder?: boolean;
+    perPageKey?: string;
+    pageKey?: string;
+    isLoading?: boolean;
+    scrollParentRef?: React.RefObject<HTMLDivElement>;
+    defaultPerPage?: number;
+    showPagination?: boolean;
+    customEmptyState?: React.ReactNode;
+    enableFreezeColumns?: boolean;
+    defaultFrozenCount?: number;
+    frozenCount?: number;
+    onFrozenCountChange?: (count: number) => void;
+    customActions?: (record: T) => React.ReactNode;
+    actionsOrder?: Array<'detail' | 'update' | 'delete' | 'custom'>;
+}
+export type WrapperProps = {
+    children: React.ReactNode;
+    borderRadius?: BoxProps['borderRadius'];
+};
+interface ActionProps {
+    title?: string | ReactNode;
+    icon?: IconName;
+    buttonProps?: ButtonProps;
+    onClick?: () => void;
+}
+export type TableHeaderProps = {
+    action?: ActionProps[] | React.ReactNode;
+    advanceFilter?: AdvanceFilterBarProps;
+    show?: boolean;
+    showFilter?: boolean;
+};
+export type TableFooterProps = {
+    pageKey?: string;
+    perPageKey?: string;
+    pagination?: Pagination;
+    defaultPerPage?: number;
+    showPagination?: boolean;
+    showFooter?: boolean;
+    totalData?: number;
+};
+export type TableSectionProps<T extends BaseRecord> = {
+    headerProps?: TableHeaderProps;
+    wrapperProps?: Omit<WrapperProps, 'children'>;
+    dataTableProps?: DataTableProps<T>;
+    footerProps?: Pick<TableFooterProps, 'showFooter' | 'totalData'>;
+};
+export {};

package/dist/components/index.d.ts

@@ -10,6 +10,8 @@ export * from './RightDrawer';
 export * from './Section';
 export * from './ActionMenu';
 export * from './AdvanceFilter';
+export * from './AdvanceFilterBar';
+export * from './TableSection';
 export * from './EachUtils';
 export * from './DecisionWrapper';
 export * from './SwitchApps';