UNPKG

@rkosafo/cai.components

Version:

This package is under development and not ready for public use.

955 lines (954 loc) 30 kB
import type { HTMLAnchorAttributes, HTMLAttributes, HTMLButtonAttributes, HTMLDialogAttributes, HTMLInputAttributes, HTMLLabelAttributes, HTMLTextareaAttributes, SVGAttributes } from 'svelte/elements'; import type { Middleware, Placement, Strategy } from '@floating-ui/dom'; import type { Component, Snippet } from 'svelte'; import type { BlurParams, FadeParams, FlyParams, ScaleParams, SlideParams, TransitionConfig } from 'svelte/transition'; import type { AlertVariants } from '../ui/alert/theme.js'; import type { AvatarVariants } from '../ui/avatar/theme.js'; import type { ButtonVariants, GradientButtonVariantes } from '../ui/buttons/theme.js'; import type { ClassValue } from 'clsx'; import type { DropdownItemVariants } from '../ui/dropdown/theme.js'; import type { FooterCopyrightVariants, FooterLinkVariants } from '../ui/footer/theme.js'; import type { IndicatorVariants } from '../ui/indicator/theme.js'; import type { ModalVariants } from '../ui/modal/theme.js'; import type { CloseButtonVariants } from '../utils/closeButton/theme.js'; import type { InputVariants } from '../forms/input/theme.js'; import type { LabelVariants } from '../forms/label/theme.js'; import type { ToolbarButtonVariants, ToolbarGroupVariants, ToolbarVariants } from '../ui/toolbar/theme.js'; import type { DatepickerVariants } from '../forms/datepicker/theme.js'; import type { Day } from 'date-fns'; import type { DrawerVariants } from '../ui/drawer/theme.js'; import type { TextareaVariants } from '../forms/textarea/theme.js'; import type { RadioVariants } from '../forms/radio/theme.js'; import type { CheckboxVariants } from '../forms/checkbox/theme.js'; import type { AccordionItemVariants, AccordionVariants } from '../ui/accordion/theme.js'; import type { TabsVaraints } from '../ui/tab/theme.js'; import type { ACTION_BUTTON_KINDS } from '../ui/buttons/ActionButton.svelte'; import type { TooltipVariants } from '../ui/tooltip/theme.js'; import type { ButtonToggleVariants } from '../forms/button-toggle/theme.js'; import type { SpeedDialButtonVariants, SpeedDialVariants } from '../ui/speedDial/theme.js'; export interface TFSidebarProps { homeUrl: string; logoUrl: string; appShortName: string; appName: string; hideSidebar?: boolean; menuItems: IMenuItem[]; logo?: Snippet; isActiveFunction?: (val: IMenuItem) => boolean; } export interface IMenuItem { title: string; icon?: string; path?: string; items?: IMenuItem[] | null; description?: string; iconBg?: string; iconColor?: string; iconSize?: number; } export type ParamsType = FadeParams | BlurParams | FlyParams | SlideParams | ScaleParams | undefined; export type TransitionFunc = (node: HTMLElement, params: ParamsType) => TransitionConfig; export interface TriggeredToggleEvent extends ToggleEvent { trigger: HTMLElement; } export interface PopperProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onbeforetoggle' | 'ontoggle'> { triggeredBy?: string; triggerDelay?: number; trigger?: 'hover' | 'click'; placement?: Placement; arrow?: boolean; arrowClass?: string; offset?: number; yOnly?: boolean; strategy?: Strategy; reference?: string; middlewares?: Middleware[]; children: Snippet; onbeforetoggle?: (ev: TriggeredToggleEvent) => void; ontoggle?: (ev: TriggeredToggleEvent) => void; transition?: TransitionFunc; transitionParams?: ParamsType; isOpen?: boolean; } export interface LinkType { name: string; href?: string; rel?: string; active?: boolean; [propName: string]: any; } export type AnchorButtonAttributes = ({ href: string; } & HTMLAnchorAttributes) | ({ href?: undefined; } & HTMLButtonAttributes); export type AnchorDivAttributes = ({ href: string; } & HTMLAnchorAttributes) | ({ href?: undefined; } & HTMLAttributes<HTMLDivElement>); export type AnchorButtonDivAttributes = ({ href: string; } & HTMLAnchorAttributes) | ({ href?: undefined; onclick: Function; } & HTMLButtonAttributes) | ({ href?: undefined; onclick?: undefined; } & HTMLAttributes<HTMLDivElement>); export declare const xs = "xs"; export declare const sm = "sm"; export declare const md = "md"; export declare const lg = "lg"; export declare const xl = "xl"; export declare type SizeType = typeof xs | typeof sm | typeof md | typeof lg | typeof xl; export type HTMLButtonOrAnchorAttributes = Omit<HTMLButtonAttributes & HTMLAnchorAttributes, 'color'>; export interface AlertProps extends Omit<AlertVariants, 'icon'>, Omit<HTMLAttributes<HTMLDivElement>, 'color'> { children: Snippet; icon?: Snippet; alertStatus?: boolean; closeIcon?: Component; transition?: TransitionFunc; params?: ParamsType; onclick?: () => void; } export interface AvatarProps extends AvatarVariants, HTMLAttributes<HTMLDivElement> { children?: Snippet; indicator?: Snippet; href?: HTMLAnchorAttributes['href']; target?: HTMLAnchorAttributes['target']; src?: string; dot?: object; alt?: string; onclick?: () => void; } export type ButtonProps = ButtonVariants & AnchorButtonAttributes & { tag?: string; disabled?: boolean; outline?: boolean; shadow?: boolean; loading?: boolean; leadingIcon?: Snippet; trailingIcon?: Snippet; ripple?: boolean; }; export interface GradientButtonProps extends GradientButtonVariantes, HTMLButtonOrAnchorAttributes { tag?: string; disabled?: boolean; href?: string; btnClass?: ClassValue; leadingIcon?: Snippet; trailingIcon?: Snippet; } export interface DropdownProps extends PopperProps { simple?: boolean; activeUrl?: string; isOpen?: boolean; } export interface DropdownDividerProps extends HTMLAttributes<HTMLDivElement> { } export interface DropdownGroupProps extends HTMLAttributes<HTMLUListElement> { children: Snippet; } export interface DropdownHeaderProps extends HTMLAttributes<HTMLDivElement> { children: Snippet; } export type DropdownItemAnchorButtonAttributes = HTMLAnchorAttributes & Omit<HTMLButtonAttributes, keyof HTMLAnchorAttributes | 'type'>; export type DropdownItemProps = DropdownItemVariants & AnchorButtonDivAttributes & { children: Snippet; aClass?: ClassValue; activeClass?: ClassValue; liClass?: ClassValue; }; export type FooterType = 'default' | 'sticky' | 'sitemap' | 'socialmedia' | 'logo' | undefined; export interface FooterProps extends HTMLAttributes<HTMLElement> { children: Snippet; footerType?: FooterType; } export interface FooterBrandProps extends HTMLAnchorAttributes { children?: Snippet; aClass?: ClassValue; spanClass?: ClassValue; imgClass?: ClassValue; href?: string; src?: string; alt?: string; name?: string; } export interface FooterCopyrightProps extends FooterCopyrightVariants, HTMLAnchorAttributes { spanClass?: ClassValue; aClass?: ClassValue; href?: string; by?: string; copyrightMessage?: string; year?: number; bySpanClass?: ClassValue; } export interface FooterIconProps extends HTMLAnchorAttributes { children: Snippet; href?: string; ariaLabel?: string; } export interface FooterLinkProps extends FooterLinkVariants, HTMLAnchorAttributes { children: Snippet; liClass?: ClassValue; aClass?: ClassValue; href?: string; } export interface FooterLinkGroupProps extends HTMLAttributes<HTMLUListElement> { children: Snippet; } export interface IndicatorProps extends HTMLAttributes<HTMLDivElement> { children?: Snippet; color?: IndicatorVariants['color']; cornerStyle?: IndicatorVariants['cornerStyle']; size?: IndicatorVariants['size']; border?: boolean; placement?: IndicatorVariants['placement']; offset?: boolean; } export interface ModalProps extends ModalVariants, HTMLDialogAttributes { onaction?: ({ action, data }: { action: string; data: FormData; }) => any; modal?: boolean; form?: boolean; autoclose?: boolean; outsideclose?: boolean; dismissable?: boolean; permanent?: boolean; focustrap?: boolean; transition?: TransitionFunc; params?: ParamsType; header?: Snippet; footer?: Snippet; headerClass?: ClassValue; bodyClass?: ClassValue; footerClass?: ClassValue; closeBtnClass?: ClassValue; fullscreen?: boolean; } export interface NotificationItem { id?: string | number; icon?: string; isRead?: boolean; time?: string; content?: string; sender?: string; } export interface NotificationListProps<T extends NotificationItem> { open?: boolean; onClearNotifications?: () => void; header?: Snippet; busy?: boolean; data?: T[]; onclick?: (item: T) => void; footer?: Snippet; read?: () => Promise<T[]> | T[]; } export interface PageLoaderProps { size?: number; iconColor?: string; } export type InputValue = string | number | string[] | undefined; export interface InputProps<T extends InputValue = string> extends InputVariants, Omit<HTMLInputAttributes, 'size' | 'children' | 'value'> { children?: Snippet<[ { class: string; } & Omit<InputProps<T>, 'children' | 'left' | 'right' | 'size'> ]>; left?: Snippet; right?: Snippet; size?: InputVariants['size']; value?: T; elementRef?: HTMLInputElement; color?: InputVariants['color']; leftClass?: ClassValue; rightClass?: ClassValue; divClass?: ClassValue; wrapperClass?: ClassValue; clearable?: boolean; clearableSvgClass?: ClassValue; clearableColor?: CloseButtonVariants['color']; clearableClass?: ClassValue; clearableOnClick?: () => void; data?: string[]; maxSuggestions?: number; onSelect?: (item: string) => void; comboClass?: ClassValue; comboItemClass?: ClassValue; oninput?: (event: Event) => void; onfocus?: (event: FocusEvent) => void; onblur?: (event: FocusEvent) => void; onkeydown?: (event: KeyboardEvent) => void; } export interface LabelProps extends HTMLLabelAttributes { children: Snippet; color?: LabelVariants['color']; show?: boolean; } export interface ToolbarProps extends ToolbarVariants, Omit<HTMLAttributes<HTMLDivElement>, 'color'> { end?: Snippet; } export interface ToolbarGroupProps extends ToolbarGroupVariants, HTMLAttributes<HTMLDivElement> { } export type ToolbarButtonProps = ToolbarButtonVariants & AnchorButtonAttributes & { name?: string; }; export type DateOrRange = Date | { from?: Date; to?: Date; }; export interface DatepickerProps extends DatepickerVariants, Omit<HTMLAttributes<HTMLDivElement>, 'onselect'> { value?: Date; defaultDate?: Date | null; range?: boolean; rangeFrom?: Date; rangeTo?: Date; availableFrom?: Date | null; availableTo?: Date | null; locale?: string; firstDayOfWeek?: Day; dateFormat?: Intl.DateTimeFormatOptions; placeholder?: string; disabled?: boolean; required?: boolean; color?: ButtonProps['color']; inline?: boolean; autohide?: boolean; showActionButtons?: boolean; title?: string; onselect?: (x: DateOrRange) => void; onclear?: () => void; onapply?: (x: DateOrRange) => void; inputmode?: HTMLInputAttributes['inputmode']; monthColor?: ButtonProps['color']; btnClass?: ClassValue; inputClass?: ClassValue; monthBtnSelected?: ClassValue; monthBtn?: ClassValue; translationLocale?: string; elementRef?: HTMLInputElement; name?: string | undefined | null; placement?: 'top-start' | 'top' | 'top-end' | 'bottom-start' | 'bottom' | 'bottom-end' | 'left-start' | 'left' | 'left-end' | 'right-start' | 'right' | 'right-end'; } export interface DrawerProps extends DrawerVariants, HTMLAttributes<HTMLDivElement> { hidden: boolean; closeDrawer?: () => void; activateClickOutside?: boolean; backdrop?: boolean; backdropClass?: ClassValue; transitionParams?: ParamsType; transitionType?: TransitionFunc; bodyScrolling?: boolean; onaction?: ({ action, data }: { action: string; data: FormData; }) => any; form?: boolean; dismissable?: boolean; closeBtnClass?: ClassValue; headerClass?: ClassValue; bodyClass?: ClassValue; footerClass?: ClassValue; header?: Snippet; footer?: Snippet; permanent?: boolean; autoclose?: boolean; size?: 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl'; } export interface TextareaProps extends TextareaVariants, HTMLTextareaAttributes { header?: Snippet; footer?: Snippet; addon?: Snippet; value?: string; elementRef?: HTMLTextAreaElement; wrapped?: boolean; divClass?: ClassValue; innerClass?: ClassValue; headerClass?: ClassValue; footerClass?: ClassValue; addonClass?: ClassValue; clearable?: boolean; clearableSvgClass?: ClassValue; clearableColor?: CloseButtonVariants['color']; clearableClass?: ClassValue; clearableOnClick?: () => void; textareaClass?: ClassValue; } export interface SelectProps { hasError?: boolean; hasSuccess?: boolean; minHeight?: number; placeholder?: string; valueAsObject?: boolean; creatable?: boolean; multiple?: boolean; searchable?: boolean; labelAsValue?: boolean; disabled?: boolean; clearable?: boolean; name?: string; inputId?: string; required?: boolean; options?: Array<any> | object; valueField?: string | null; labelField?: string | null; groupLabelField?: string; groupItemsField?: string; disabledField?: string; renderer?: ((item: object, selectionSection?: boolean, inputValue?: string) => string) | string; disableHighlight?: boolean; highlightFirstItem?: boolean; selectOnTab?: boolean | 'select-navigate'; resetOnBlur?: boolean; resetOnSelect?: boolean; closeAfterSelect?: string | boolean; deselectMode?: 'native' | 'toggle' | 'none'; dndzone?: Function; strictMode?: boolean; max?: number; collapseSelection?: 'blur' | 'always' | null; keepSelectionInList?: boolean | 'auto'; creatablePrefix?: string; allowEditing?: boolean; keepCreated?: boolean; delimiter?: string; createFilter?: (inputValue: string) => boolean; createHandler?: (prop: { inputValue: string; valueField: string; labelField: string; prefix: string; }) => Promise<object> | object; fetch?: string | null; fetchProps?: object | Function; fetchMode?: 'auto' | 'init'; fetchCallback?: Function; fetchResetOnBlur?: boolean; fetchDebounceTime?: number; minQuery?: number; lazyDropdown?: boolean; virtualList?: boolean; vlItemSize?: number; i18n?: object; value?: any[] | string | number | object | null; readSelection?: object | object[] | null; parentValue?: string | number | null | undefined; emitValues?: boolean; onChange?: Function; onFocus?: Function; onBlur?: Function; onCreateOption?: Function; onCreateFail?: Function; onEnterKey?: Function; onFetch?: Function; onFetchError?: Function; onInvalidValue?: Function; prepend?: Snippet | undefined; selection?: Snippet<[selectedOptions: object[], bindItem: Function]>; clearIcon?: Snippet<[selectedOptions: object[], input_value: string]>; toggleIcon?: Snippet<[dropdownShow: boolean]>; append?: Snippet | undefined; listHeader?: Snippet | undefined; option?: Snippet<[option: object, inputValue: string]>; positionResolver?: Function; anchor_element?: string | null; controlClass?: string | null; dropdownClass?: string | null; optionClass?: string | null; loading?: boolean; } export interface RadioProps<T> extends RadioVariants, Omit<HTMLInputAttributes, 'color'> { group?: T; value?: T; inputClass?: ClassValue; labelClass?: ClassValue; } export interface RadioButtonProps<T> extends Omit<HTMLInputAttributes, 'size'> { group?: T; value?: T; inline?: boolean; pill?: boolean; outline?: boolean; size?: ButtonProps['size']; color?: ButtonProps['color']; shadow?: boolean; checkedClass?: ClassValue; } export interface CheckboxItem { value: string | number; label?: string; checked?: boolean | null; [key: string]: any; } export interface CheckboxProps extends CheckboxVariants, Omit<HTMLInputAttributes, 'children' | 'color' | 'disabled'> { children?: Snippet<[{ value?: string | number; checked: boolean; } | CheckboxItem]>; custom?: boolean; inline?: boolean; tinted?: boolean; rounded?: boolean; group?: (string | number)[]; choices?: CheckboxItem[]; indeterminate?: boolean; divClass?: ClassValue; labelProps?: Record<string, any>; } export interface CheckboxButtonProps extends Omit<HTMLInputAttributes, 'size'> { group?: (string | number)[]; value?: string | number; checked?: boolean; inline?: boolean; pill?: boolean; outline?: boolean; size?: ButtonProps['size']; color?: ButtonProps['color']; shadow?: boolean; } export interface IFormChangeProp<T> { values: T; isValid: boolean; form: any; } export interface IFormSubmitProp<T> { values: T; context: any; } export interface FormProps { transform?: (values: any) => any; initialValues?: Record<string, any>; validators?: any; onChange?: (values: IFormChangeProp<any>) => any; onSubmit?: (values: IFormSubmitProp<any>) => any; contextKey?: any; class?: ClassValue; children: Snippet<[ initialValues?: Record<string, any>, isValid?: boolean, values?: Record<string, any> ]>; schema?: any; } export interface IFormProps { label?: string; contextKey?: symbol | null; name: string; } export interface FormInputProps extends Omit<InputProps, 'name'>, IFormProps { } export interface FormDatepickerProps extends Omit<DatepickerProps, 'name'>, IFormProps { } export interface FormSelectProps extends Omit<SelectProps, 'name'>, IFormProps { } export interface FormTextareaProps extends Omit<TextareaProps, 'name'>, IFormProps { } export interface FormRadioProps<T> extends Omit<RadioProps<T>, 'name'>, IFormProps { } export interface FormClEditorProps extends Omit<InputProps, 'name'>, IFormProps { height?: string; } export interface FormCheckboxProps extends Omit<CheckboxProps, 'name'>, IFormProps { onChange?: (val: any) => void; } export interface TableColumn { header: string; id?: string; plugins?: any; accessor?: string | string[] | ((row: any) => unknown); cell?: (ctx: { value: unknown; row: any; }) => unknown; renderComponent?: Component<any>; renderProps?: (ctx: { value: unknown; row: any; column: TableColumn; }) => Record<string, unknown>; } export interface TableActionList { name: string; icon?: string; otherClasses?: string; visible?: (row: any) => boolean; onClick?: (row: any) => void; } export interface TableSortInfo { id: string; order: 'asc' | 'desc'; } export type TableColor = 'green' | 'orange' | 'white' | 'purple' | 'sky' | 'blue' | 'red' | 'pink'; export type HeaderTextColor = 'black' | 'white' | 'gray'; export interface TableProps { data?: any[]; headerColor?: TableColor; height?: number; bgWhite?: boolean; headerTextColor?: HeaderTextColor; tableColumns: TableColumn[]; showActions?: boolean; showCheckBox?: boolean; showViewDetails?: boolean; showEdit?: boolean; showMiniWidth?: boolean; rowClickable?: boolean; hideWhiteSpace?: boolean; hiddenColumns?: string[]; sortedColumns?: TableSortInfo[]; initialSortKeys?: TableSortInfo[]; allColumns?: any; actionLists?: TableActionList[]; showIndex?: boolean; selectedRows?: any[]; selectAllChecked?: boolean; showDelete?: boolean; handleCheckbox?: (val: any[]) => void; onView?: (val: any) => void; onRowClicked?: (val: any) => void; onEdit?: (val: any) => void; onDelete?: (val: any) => void; onActionClicked?: ({ name, row }: { name: string; row: any; }) => void; tableBottomContent?: Snippet; showTableBottomPadding?: boolean; } export interface PaginateProps { currentPage: number; hasNextPage: boolean; hasPreviousPage: boolean; onNextPage: () => void; onPreviousPage: () => void; refresh?: (() => void) | null; totalPages: number; hideLabel?: boolean; textSmall?: boolean; hiddenColumns?: string[]; tableColumns?: any[]; recordCount?: number; pageSize?: number; } export interface PageInfo { hasNextPage: boolean; hasPreviousPage: boolean; } export interface PaginatedResult<T> { success: boolean; message: string; data: { pageInfo: PageInfo; totalCount: number; items: T[]; }; } export interface CrudResult<T> { success: boolean; message: string; data?: T; } export interface TableFilter<T = Record<string, unknown>> { search?: string; startDate?: Date | string | null; endDate?: Date | string | null; dateRange?: string; filter?: Partial<T>; order?: Array<{ field: keyof T; direction: 'asc' | 'desc'; }>; actions?: Record<string, string>; pageSize?: number; currentPage?: number; } export interface DatatableProps<T = any> extends TableProps { read?: (skip?: number, take?: number, filter?: TableFilter<T>) => Promise<PaginatedResult<T>> | PaginatedResult<T> | null; createEntry?: (entry: T) => Promise<CrudResult<T>> | CrudResult<T> | null; updateEntry?: (entry: Partial<T> & { id: string | number; }) => Promise<CrudResult<T>> | CrudResult<T> | null; deleteEntry?: (id: string | number) => Promise<CrudResult<T>> | CrudResult<T> | null; onAfterAction?: (params: { type: 'create' | 'update' | 'delete' | 'custom'; values?: Partial<T>; data?: T; }) => void; onAddNew?: () => void; persitFiltersToUrl?: boolean; fillSpace?: boolean; showTopActionsBackground?: boolean; hideSearchBox?: boolean; addButtonLabel?: string; showAdd?: boolean; searchPlaceholder?: string; addNewHeading?: string; newRecord?: Record<string, any>; query?: string; busy?: boolean; showFilterDateRange?: boolean; loadingBodySize?: number; loadingHeaderSize?: number; updateHeading?: string; customFilterValues?: Record<string, any>; modalSize?: 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl'; allowLoadAfterCreate?: boolean; allowDispatchAfterAction?: boolean; take?: number; editor?: Snippet<[DatatableEditorFormProps]>; customFilter?: Snippet<[TableFilter]>; modalFooter?: Snippet; showModalButtons?: boolean; customAddAction?: Snippet; } export interface DatatableEditorFormProps { recordId?: number | string | null; data?: Record<string, any> | null; onChange: IFormChangeProp<any>; onDone?: Function; readonly: boolean; } export interface AlertDialogProps { open: boolean; message?: string; icon?: string; disableYes?: boolean; busy?: boolean; iconColor?: string; confirmText?: string; buttonType?: 'submit' | 'button' | 'reset'; dismissable?: boolean; onCancel: () => void; onYes: () => void; } export interface AccordionCtxType { flush?: boolean; activeClass?: string | null; inactiveClass?: string | null; transitionType?: TransitionFunc | 'none'; } export interface AccordionProps extends AccordionVariants, Omit<HTMLAttributes<HTMLDivElement>, 'color'> { children: Snippet; multiple?: boolean; activeClass?: string; inactiveClass?: string; transitionType?: TransitionFunc | 'none'; } export interface AccordionItemProps extends AccordionItemVariants, HTMLAttributes<HTMLDivElement> { children: Snippet; header?: Snippet; arrowup?: Snippet; arrowdown?: Snippet; activeClass?: string; inactiveClass?: string; transitionType?: TransitionFunc | 'none'; transitionParams?: ParamsType; headerClass?: string; contentClass?: string; } export interface FilterBuilderColumnConfig { name: string; label: string; type: 'string' | 'number' | 'date' | 'boolean'; } export interface FilterBuilderItem { id: string; column: string; operator: string; value: string | number | boolean | null; logicalOperator?: 'AND' | 'OR'; label?: string; } export interface FilterBuilderExport { sqlBuild: string; jsonBuild: any[]; } export interface FilterBuilderProps { columns?: FilterBuilderColumnConfig[]; filters?: FilterBuilderItem[]; onRunQuery?: (val: FilterBuilderExport) => void; } export interface ITab { id: number | string; title: string; children: Component<TabChildrenProps> | Component; icon?: string; isClosable?: boolean; props?: Record<string, any>; state?: Record<string, any>; } export interface RemoveTabEvent { tabId: string | number; tabData?: any; refresh?: boolean; } export interface TabChildrenProps extends ITab { onTabChange?: (tabId: number | string) => void; onTabAdd?: (val: any) => void; onRemoveTab?: (val: RemoveTabEvent) => void; } export interface TabProps { tabs: ITab[]; activeTab: number | string; tabClass?: ClassValue; tabActiveClass?: ClassValue; tabInactiveClass?: ClassValue; tabContentClass?: ClassValue; tabContentActiveClass?: ClassValue; tabContentInactiveClass?: ClassValue; tabColor?: ClassValue; onTabChange?: (tabId: number | string) => void; onTabAdd?: (val: any) => void; onRemoveTab?: (val: RemoveTabEvent) => void; tabStyle?: TabsVaraints['tabStyle']; divider?: boolean; hideTabs?: boolean; } export interface BoxProps extends svelteHTML.HTMLAttributes<HTMLDivElement> { children: any; otherClasses?: string; bgWhite?: boolean; rounded?: boolean; padding?: boolean; shadow?: boolean; } export interface IBreadcrumb { title: string; component?: any; props?: any; path?: string; } export interface BreadcrumbProps { options: IBreadcrumb[]; activeBreadCrumb: string; onclik?: (val: IBreadcrumbClick) => void; activeClass?: 'pink' | 'blue' | 'red' | 'indigo' | 'purple' | 'black' | 'amber' | 'orange'; } export interface IBreadcrumbClick { title: string; path?: string; index: number; } export interface IButtonConfig { kind: string; label: string; subLabel: string; } export type IActionButtonKind = keyof typeof ACTION_BUTTON_KINDS; export interface ActionButtonProps { icon?: string; iconBgColor?: string; iconSize?: number; iconColor?: string; label?: string; subLabel?: string; showBg?: boolean | null; showArrow?: boolean; showIconHover?: boolean; moreHeight?: boolean; href?: string | null; kind?: IActionButtonKind; moreShadow?: boolean; onclick?: () => void; } export interface IComponentDescriptor { type: string; title?: string; collapsible?: boolean; collapsed?: boolean; closable?: boolean; props?: unknown; id?: string; } export interface IDocumentCanvasClose { id: string; data: any; } export interface IDocumentRendererProps { descriptor: IComponentDescriptor; showTitle?: boolean; contextKey?: object; toggleCollapse: (id: string) => void; close: (val: IDocumentCanvasClose) => void; } export interface IDocumentCanvasProps { children: IComponentDescriptor[]; showBackground?: boolean; contextKey?: object; close: (val: IDocumentCanvasClose) => void; toggleCollapse: (id: string) => void; } export interface FormFileUploadProps { title: string; subTitle?: string; url?: string; name: string; allowMultiple?: boolean; acceptedFileTypes?: string[]; files?: any[]; label: string; required?: boolean; showError?: boolean; imageOnly?: boolean; contextKey?: any; onChange?: (val: any) => void; } export type CheckIconProps = SVGAttributes<SVGSVGElement>; export type ButtonToggleProps = ButtonToggleVariants & HTMLButtonAttributes & { value: string; selected?: boolean; children: Snippet; iconSlot?: Snippet; color?: ButtonToggleVariants['color']; iconClass?: ClassValue; contentClass?: ClassValue; txtClass?: ClassValue; }; export interface TooltipProps extends TooltipVariants, PopperProps { } export interface SpeedCtxType { pill: boolean; tooltip: Placement | 'none'; textOutside: boolean; } type BaseSpeedDialTriggerProps = { children?: any; name?: string; pill?: boolean; icon?: Snippet; class?: string; [key: string]: any; }; export type RegularSpeedDialTriggerProps = BaseSpeedDialTriggerProps & { gradient?: false; color?: ButtonVariants['color']; }; export type GradientSpeedDialTriggerProps = BaseSpeedDialTriggerProps & { gradient: true; color?: GradientButtonColor; }; export type SpeedDialTriggerProps = RegularSpeedDialTriggerProps | GradientSpeedDialTriggerProps; export type SpeedDialProps = PopperProps & SpeedDialVariants & { children: Snippet; button?: Snippet; popperClass?: ClassValue; placement?: Placement; tooltip?: Placement | 'none'; trigger?: PopperProps['trigger']; textOutside?: boolean; pill?: boolean; ontoggle?: PopperProps['ontoggle']; onbeforetoggle?: PopperProps['onbeforetoggle']; isOpen?: boolean; }; export type SpeedDialButtonProps = ButtonProps & SpeedDialButtonVariants & { name?: string; tooltip?: Placement | 'none'; pill?: boolean; textOutside?: boolean; textClass?: ClassValue; }; export {};