@sunggang/ui-lib 0.1.80 → 0.1.82

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sunggang/ui-lib",
-  "version": "0.1.80",
+  "version": "0.1.82",
   "dependencies": {
     "@iconify/react": "^4.1.1",
     "@mdx-js/react": "^3.0.1",

package/src/Type/index.d.ts

@@ -1,11 +1,20 @@
-/// <reference types="react" />
 export interface ColumnDef {
-    id: string;
-    header: React.ReactNode;
-    cell: React.ReactNode;
+    accessorKey: string;
+    header: ((props: {
+        column: any;
+    }) => JSX.Element) | string;
+    cell: (props: {
+        row: any;
+    }) => JSX.Element;
+    id?: string;
     enableSorting?: boolean | undefined;
     enableHiding?: boolean | undefined;
-    accessorKey?: string | undefined;
+}
+interface PaginationConfigType {
+    page: number;
+    limit: number;
+    total: number;
+    onPageChange: (e: any) => void;
 }
 export interface DataTableProps {
     data: any[];
@@ -17,5 +26,7 @@ export interface DataTableProps {
         name: string;
     };
     mappingColumn: any;
-    paginationConfig: any;
+    paginationConfig?: PaginationConfigType;
+    SearchSelectCP?: any;
 }
+export {};

package/src/components/ui/button.d.ts

@@ -6,6 +6,7 @@ declare const buttonVariants: (props?: ({
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
 export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
     asChild?: boolean;
+    isLoading?: boolean;
 }
 declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
 export { Button, buttonVariants };

package/src/components/ui/input.d.ts

@@ -1,5 +1,4 @@
 import * as React from "react";
-export interface InputProps extends React.InputHTMLAttributes<HTMLInputElement> {
-}
+export type InputProps = React.InputHTMLAttributes<HTMLInputElement>;
 declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLInputElement>>;
 export { Input };

package/src/index.d.ts

@@ -9,6 +9,7 @@ export * from './lib/Switch';
 export * from './components/ui/dateRangePicker';
 export * from './components/ui/reactDateRange';
 export * from './lib/DataTable';
+export * from './lib/DataTable/BaseTable';
 export * from './lib/Function';
 export * from './lib/BigCalender';
 export * from './lib/BigCalender/dnd';

package/src/lib/DataTable/BaseTable.d.ts

@@ -0,0 +1,8 @@
+export declare const BaseTable: ({ data, mappingColumn, columns, searchData, paginationConfig, SearchSelectCP, }: {
+    data: any;
+    mappingColumn: any;
+    columns: any;
+    searchData: any;
+    paginationConfig: any;
+    SearchSelectCP: any;
+}) => import("react/jsx-runtime").JSX.Element;

package/src/lib/Dropdown/Checkbox.d.ts

@@ -0,0 +1,7 @@
+declare const Checkbox: ({ children, checked, onChange, id }: {
+    children: any;
+    checked: any;
+    onChange: any;
+    id: any;
+}) => import("react/jsx-runtime").JSX.Element;
+export default Checkbox;

package/src/lib/Dropdown/DisabledItem.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+interface DisabledItemProps {
+    children: JSX.Element | string;
+}
+declare const DisabledItem: React.FC<DisabledItemProps>;
+export default DisabledItem;

package/src/lib/Dropdown/GroupItem.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { GroupOption } from './type';
+interface GroupItemProps {
+    item: GroupOption;
+    primaryColor: string;
+}
+declare const GroupItem: React.FC<GroupItemProps>;
+export default GroupItem;

package/src/lib/Dropdown/Icons.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+interface Props {
+    className?: string;
+}
+export declare const CloseIcon: React.FC<Props>;
+export declare const ChevronIcon: React.FC<Props>;
+export declare const SearchIcon: React.FC<Props>;
+export {};

package/src/lib/Dropdown/Item.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { Option } from './type';
+interface ItemProps {
+    item: Option;
+    primaryColor: string;
+}
+declare const Item: React.FC<ItemProps>;
+export default Item;

package/src/lib/Dropdown/Options.d.ts

@@ -0,0 +1,12 @@
+import React from "react";
+import { Option, Options as ListOption } from "./type";
+interface OptionsProps {
+    list: ListOption;
+    noOptionsMessage: string;
+    text: string;
+    isMultiple: boolean;
+    value: Option | Option[] | null;
+    primaryColor: string;
+}
+declare const Options: React.FC<OptionsProps>;
+export default Options;

package/src/lib/Dropdown/SearchInput.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+interface SearchInputProps {
+    placeholder?: string;
+    value: string;
+    onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
+    name?: string;
+}
+declare const SearchInput: React.ForwardRefExoticComponent<SearchInputProps & React.RefAttributes<HTMLInputElement>>;
+export default SearchInput;

package/src/lib/Dropdown/SelectContainer.d.ts

@@ -0,0 +1,4 @@
+declare const SelectContainer: ({ children }: {
+    children: any;
+}) => import("react/jsx-runtime").JSX.Element;
+export default SelectContainer;

package/src/lib/Dropdown/SelectProvider.d.ts

@@ -0,0 +1,23 @@
+import React from "react";
+import { ClassNames, GroupOption, Option } from "./type";
+interface Store {
+    value: Option | Option[] | null;
+    handleValueChange: (selected: Option) => void;
+    formatGroupLabel: ((data: GroupOption) => JSX.Element) | null;
+    formatOptionLabel: ((data: Option) => JSX.Element) | null;
+    classNames?: ClassNames;
+}
+interface Props {
+    value: Option | Option[] | null;
+    handleValueChange: (selected: Option) => void;
+    children: JSX.Element;
+    otherData: {
+        formatGroupLabel: ((data: GroupOption) => JSX.Element) | null;
+        formatOptionLabel: ((data: Option) => JSX.Element) | null;
+        classNames?: ClassNames;
+    };
+}
+export declare const SelectContext: React.Context<Store>;
+export declare const useSelectContext: () => Store;
+declare const SelectProvider: React.FC<Props>;
+export default SelectProvider;

package/src/lib/Dropdown/Spinner.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+interface Props {
+    primaryColor?: string;
+}
+declare const Spinner: React.FC<Props>;
+export default Spinner;

package/src/lib/Dropdown/TailwindColors.d.ts

@@ -0,0 +1,4 @@
+declare const TailwindColors: ({ changeColor }: {
+    changeColor: any;
+}) => import("react/jsx-runtime").JSX.Element;
+export default TailwindColors;

package/src/lib/Dropdown/constants.d.ts

@@ -0,0 +1,118 @@
+export declare const COLORS: string[];
+export declare const DEFAULT_THEME = "blue";
+export declare const THEME_DATA: {
+    bg: {
+        blue: string;
+        orange: string;
+        yellow: string;
+        red: string;
+        purple: string;
+        amber: string;
+        lime: string;
+        green: string;
+        emerald: string;
+        teal: string;
+        cyan: string;
+        sky: string;
+        indigo: string;
+        violet: string;
+        fuchsia: string;
+        pink: string;
+        rose: string;
+    };
+    bgHover: {
+        blue: string;
+        orange: string;
+        yellow: string;
+        red: string;
+        purple: string;
+        amber: string;
+        lime: string;
+        green: string;
+        emerald: string;
+        teal: string;
+        cyan: string;
+        sky: string;
+        indigo: string;
+        violet: string;
+        fuchsia: string;
+        pink: string;
+        rose: string;
+    };
+    ring: {
+        blue: string;
+        orange: string;
+        yellow: string;
+        red: string;
+        purple: string;
+        amber: string;
+        lime: string;
+        green: string;
+        emerald: string;
+        teal: string;
+        cyan: string;
+        sky: string;
+        indigo: string;
+        violet: string;
+        fuchsia: string;
+        pink: string;
+        rose: string;
+    };
+    borderFocus: {
+        blue: string;
+        orange: string;
+        yellow: string;
+        red: string;
+        purple: string;
+        amber: string;
+        lime: string;
+        green: string;
+        emerald: string;
+        teal: string;
+        cyan: string;
+        sky: string;
+        indigo: string;
+        violet: string;
+        fuchsia: string;
+        pink: string;
+        rose: string;
+    };
+    text: {
+        blue: string;
+        orange: string;
+        yellow: string;
+        red: string;
+        purple: string;
+        amber: string;
+        lime: string;
+        green: string;
+        emerald: string;
+        teal: string;
+        cyan: string;
+        sky: string;
+        indigo: string;
+        violet: string;
+        fuchsia: string;
+        pink: string;
+        rose: string;
+    };
+    textHover: {
+        blue: string;
+        orange: string;
+        yellow: string;
+        red: string;
+        purple: string;
+        amber: string;
+        lime: string;
+        green: string;
+        emerald: string;
+        teal: string;
+        cyan: string;
+        sky: string;
+        indigo: string;
+        violet: string;
+        fuchsia: string;
+        pink: string;
+        rose: string;
+    };
+};

package/src/lib/Dropdown/demoList.d.ts

@@ -0,0 +1,16 @@
+export declare const demoOptions: ({
+    label: string;
+    options: {
+        value: string;
+        label: string;
+        disabled: boolean;
+    }[];
+    value?: undefined;
+    disabled?: undefined;
+} | {
+    value: string;
+    label: string;
+    disabled: boolean;
+    options?: undefined;
+})[];
+export declare const SELECT_OPTIONS: string[];

package/src/lib/Dropdown/index.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { SelectProps } from './type';
+declare const DropDown: React.FC<SelectProps>;
+export default DropDown;

package/src/lib/Dropdown/type.d.ts

@@ -0,0 +1,59 @@
+import React from "react";
+export interface Option {
+    value: string;
+    label: string;
+    disabled?: boolean;
+    isSelected?: boolean;
+}
+export interface GroupOption {
+    label: string;
+    options: Option[];
+}
+export type Options = Array<Option | GroupOption>;
+export interface ClassNames {
+    menuButton?: (value?: {
+        isDisabled?: boolean;
+    }) => string;
+    menu?: string;
+    tagItem?: (value?: {
+        item?: Option;
+        isDisabled?: boolean;
+    }) => string;
+    tagItemText?: string;
+    tagItemIconContainer?: string;
+    tagItemIcon?: string;
+    list?: string;
+    listGroupLabel?: string;
+    listItem?: (value?: {
+        isSelected?: boolean;
+    }) => string;
+    listDisabledItem?: string;
+    ChevronIcon?: (value?: {
+        open?: boolean;
+    }) => string;
+    searchContainer?: string;
+    searchBox?: string;
+    searchIcon?: string;
+    closeIcon?: string;
+}
+export type SelectValue = Option | Option[] | null;
+export interface SelectProps {
+    options: Options;
+    value: SelectValue;
+    onChange: (value: SelectValue) => void;
+    onSearchInputChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
+    placeholder?: string;
+    isMultiple?: boolean;
+    isClearable?: boolean;
+    isSearchable?: boolean;
+    isDisabled?: boolean;
+    isGroupOption?: boolean;
+    loading?: boolean;
+    menuIsOpen?: boolean;
+    searchInputPlaceholder?: string;
+    noOptionsMessage?: string;
+    primaryColor: string;
+    formatGroupLabel?: ((data: GroupOption) => JSX.Element) | null;
+    formatOptionLabel?: ((data: Option) => JSX.Element) | null;
+    classNames?: ClassNames;
+}

package/src/utils/hooks/useOnClickOutside.d.ts

@@ -0,0 +1,2 @@
+import React from "react";
+export default function useOnClickOutside(ref: React.RefObject<HTMLDivElement>, handler: (e?: MouseEvent | TouchEvent) => void): void;