Options
All
  • Public
  • Public/Protected
  • All
Menu

@bestdoctor/ke-beta

Index

Enumerations

Classes

Interfaces

Type Aliases

Variables

Functions

Type Aliases

Accessor<T>: T | Function | undefined

Type Parameters

  • T

ArrayData<T>: FieldData<T>[]

Type Parameters

  • T = unknown

ArrayValidator: ((value: unknown) => Promise<ValidationResult[]>)

Type declaration

BaseConfig: Record<string, any>
ConfigConsumerOptionsOrKey<Config>: ConfigConsumerOptions<Config> | string

Type Parameters

DetailFieldDescription: { blockingValidators?: WidgetValueValidator[]; dataSource?: GenericAccessor; dataTarget?: GenericAccessor; description?: GenericAccessor; displayValue?: GenericAccessor; helpText?: string; href?: GenericAccessor; layout: LayoutData; name: string; notBlockingValidators?: WidgetValueValidator[]; required?: Accessor<boolean>; showWidget?: Accessor<boolean>; targetPayload?: GenericAccessor; widget: FunctionComponent<any> | Function; widgetAnalytics?: GenericAccessor }

Type declaration

FetchFn<ResourceData>: ((resourceKey: string, config?: RequestConfig, pageParams?: any) => Promise<ResourceData>)

Type Parameters

  • ResourceData = unknown

Type declaration

    • (resourceKey: string, config?: RequestConfig, pageParams?: any): Promise<ResourceData>
    • Parameters

      • resourceKey: string
      • Optional config: RequestConfig
      • Optional pageParams: any

      Returns Promise<ResourceData>

FieldKey: string | number
FieldProps<T, P>: BaseFieldProps<T, P> & Omit<P, keyof BaseFieldProps<T, P> | keyof ControlProps<T>> & { isRequired?: boolean; label?: ReactElement }

Type Parameters

  • T

  • P

GenericAccessor: string | Function | JSX.Element | undefined
HttpClient: AxiosInstance
HttpResponse<T>: AxiosResponse<T>

Type Parameters

  • T = any

InputWidgetProps: WidgetProps & { debounce?: number; height?: number; inputProps?: StyleProps; isDisabled?: Accessor<boolean>; isTextarea?: boolean; textareaResize?: TextareaProps["resize"] }
LayoutComponent<Children, Props>: ((props: LayoutProps<Children, Props>) => JSX.Element)

Type Parameters

  • Children

  • Props = {}

Type declaration

    • Parameters

      Returns JSX.Element

LayoutProps<Children, Props>: Props & { children: Children }

Type Parameters

  • Children

  • Props = {}

ListFieldDescription: { Cell?: Function; Header: string; accessor?: any }

Type declaration

  • Optional Cell?: Function
  • Header: string
  • Optional accessor?: any
ListFilterDescription: { Filter: FunctionComponent<any>; label: string; name: Accessor<string> }

Type declaration

  • Filter: FunctionComponent<any>
  • label: string
  • name: Accessor<string>
ListFilterTemplateDescription: { filters: Function; label: string; name: string; style?: { colorScheme?: string; variant?: "outline" | "ghost" | "unstyled" | "link" | "solid" } }

Type declaration

  • filters: Function
  • label: string
  • name: string
  • Optional style?: { colorScheme?: string; variant?: "outline" | "ghost" | "unstyled" | "link" | "solid" }
    • Optional colorScheme?: string
    • Optional variant?: "outline" | "ghost" | "unstyled" | "link" | "solid"
MergeConfigs<ConfigType>: ((a: Partial<ConfigType>, b: Partial<ConfigType>) => ConfigType)

Type Parameters

Type declaration

    • (a: Partial<ConfigType>, b: Partial<ConfigType>): ConfigType
    • Parameters

      • a: Partial<ConfigType>
      • b: Partial<ConfigType>

      Returns ConfigType

NextStep<Action, StepData>: ((nextKey: Action, data: StepData, submit?: ((data: unknown) => void)) => void)

Type Parameters

  • Action

  • StepData

Type declaration

    • (nextKey: Action, data: StepData, submit?: ((data: unknown) => void)): void
    • Parameters

      • nextKey: Action
      • data: StepData
      • Optional submit: ((data: unknown) => void)
          • (data: unknown): void
          • Parameters

            • data: unknown

            Returns void

      Returns void

OnDetailObjectLoadedProps: { context: object; mainDetailObject: Model; provider: Provider; setInitialValue: Function }

Type declaration

  • context: object
  • mainDetailObject: Model
  • provider: Provider
  • setInitialValue: Function
OnProgress: ((event: { loaded: number; total?: number }) => void)

Type declaration

    • (event: { loaded: number; total?: number }): void
    • Parameters

      • event: { loaded: number; total?: number }
        • loaded: number
        • Optional total?: number

      Returns void

OrderedTableProps<T>: TableProps<T> & { orderedColumnNames: (string | number)[]; ordering?: Record<string | number, OrderDirection>; onOrderChange: any }

Type Parameters

  • T

PropsWithDefaultLayout<P, R>: P & Partial<AddLayoutProps<R>>

Type Parameters

  • P

  • R

PropsWithLayout<P, R>: P & AddLayoutProps<R>

Type Parameters

  • P

  • R

ProviderOptions: { onError?: ErrorHandler; requestConfig?: AxiosRequestConfig }

Type declaration

  • Optional onError?: ErrorHandler
  • Optional requestConfig?: AxiosRequestConfig
RecordData<K>: Record<K, FieldData>

Type Parameters

RecordValidator: ((value: unknown) => Promise<Record<string, ValidationResult>>)

Type declaration

ResourceOptionsOrKey<T>: T | string

Type Parameters

  • T extends KeyConfig

ResourceProviderOptions: Partial<ResourceProviderConfig>
SelectObject: { text: string; value: string }

Type declaration

  • text: string
  • value: string
SlotElements<K>: { [ P in K]?: JSX.Element | string }

Type Parameters

  • K extends string

TPathRules: {}

Type declaration

  • [key: string]: TPathRule
TableWithHidableColumnsProps<T>: TableProps<T> & { visibleColumnsPersistName: string }

Type Parameters

  • T

UseTestIdProps: TestIdGenerationProps
Validator: ((value: unknown) => Promise<ValidationResult>)

Type declaration

ValidatorFunction: ((changeValue: object | string, provider: Provider, detailObject: DetailObject, context?: Record<string, unknown>) => Promise<string>)

Type declaration

    • (changeValue: object | string, provider: Provider, detailObject: DetailObject, context?: Record<string, unknown>): Promise<string>
    • Parameters

      • changeValue: object | string
      • provider: Provider
      • detailObject: DetailObject
      • Optional context: Record<string, unknown>

      Returns Promise<string>

WidgetPayload: { payload: object; url: string }

Type declaration

  • payload: object
  • url: string
WidgetProps: { activeWizardRef?: MutableRefObject<WizardControl | null>; allowAllDefinedValues?: Accessor<boolean>; analytics?: BaseAnalytic; blockingValidators?: ValidatorFunction[]; cacheTime?: Accessor<number>; className?: string; containerErrorsStore?: Store<ErrorElement[]>; containerProps?: BoxProps; containerStore: Store<object>; copyValue?: GenericAccessor; dataSource: GenericAccessor; dataTarget: GenericAccessor; description?: string | JSX.Element; displayValue?: GenericAccessor; helpText?: string; labelContainerProps?: BoxProps; mainDetailObject: DetailObject; name: string; notBlockingValidators?: ValidatorFunction[]; notifier: BaseNotifier; provider: Provider; required?: Accessor<boolean>; resource: string; setInitialValue: Function; setMainDetailObject: Function; style?: CSSProperties; submitChange: Function; targetPayload: Function; useClipboard?: boolean; viewType: string; widgetAnalytics?: Function | boolean; widgetClassName?: string } & Omit<TestIdGenerationProps, "name">
WizardFieldDescription: WizardFieldElement[]
WizardPayload: {}

Type declaration

  • [key: string]: any
WizardProps: { ViewType: string; activeWizardRef: MutableRefObject<WizardControl | null>; allowToggle?: Accessor<boolean>; analytics?: BaseAnalytic; isExpanded?: Accessor<boolean>; mainDetailObject: DetailObject; notifier: BaseNotifier; provider: Provider; refreshMainDetailObject: Function; resourceName: string; setMainDetailObject: Function; style?: object; user: object; wizard: BaseWizard }

Type declaration

  • ViewType: string
  • activeWizardRef: MutableRefObject<WizardControl | null>
  • Optional allowToggle?: Accessor<boolean>
  • Optional analytics?: BaseAnalytic
  • Optional isExpanded?: Accessor<boolean>
  • mainDetailObject: DetailObject
  • notifier: BaseNotifier
  • provider: Provider
  • refreshMainDetailObject: Function
  • resourceName: string
  • setMainDetailObject: Function
  • Optional style?: object
  • user: object
  • wizard: BaseWizard
WizardState: Promise<string>
WizardStepButtonDescription: { isDisabled?: boolean; label: string | undefined; name: string; needErrorClean?: boolean; needValidation?: boolean; onHandlingLabel?: string; style: Style; handler: any }

Type declaration

  • Optional isDisabled?: boolean
  • label: string | undefined
  • name: string
  • Optional needErrorClean?: boolean
  • Optional needValidation?: boolean
  • Optional onHandlingLabel?: string
  • style: Style
  • handler:function
    • handler(props: any): Promise<string>

Variables

AdminResource: FC<AdminResourceProps> = ...
AdminResourceCompatible: FC<AdminResourceCompatibleProps> = ...
AnalyticsProvider: Provider<AnalyticsHandler> = analyticsContext.Provider
BaseSelectWidget: ForwardRefExoticComponent<BaseSelectWidgetProps & RefAttributes<HTMLSelectElement>> = ...
CheckBox: ForwardRefExoticComponent<ControlProps<boolean> & { helpText?: string } & Omit<CheckboxProps, "onChange" | "value"> & RefAttributes<HTMLInputElement>> = ...
ChipInput: ForwardRefExoticComponent<ControlProps<string[]> & { chipClassName?: string; errorText?: string; inputClassName?: string; placeholder?: string; submitKeys?: string[]; validator?: any } & RefAttributes<HTMLInputElement>> = ...
DateInput: ForwardRefExoticComponent<DateInputProps & RefAttributes<HTMLInputElement>> = ...
DateTimeInput: ForwardRefExoticComponent<DateTimeInputProps & RefAttributes<HTMLInputElement>> = ...
EmailChipInput: ForwardRefExoticComponent<EmailChipInputProps & RefAttributes<HTMLInputElement>> = ...
FiltersIntegrator: Integrator<FC<RootProps>, { Filters: PolymorphComponent<{ filters: unknown; onChange: ((filters: unknown) => void) }>; Predefined: PolymorphComponent<{ onChange: ((filters: unknown) => void); value: unknown }> }> = ...
Input: ForwardRefExoticComponent<Pick<AdapterProps<"input">, "aria-label" | "aria-labelledby" | "autoFocus" | "className" | "id" | "name" | "onBlur" | "onChange" | "onFocus" | "onKeyDown" | "placeholder" | "tabIndex" | "value" | "defaultValue" | "prefix" | "resource" | "style" | "required" | "height" | "form" | "slot" | "title" | "pattern" | "key" | "autoComplete" | "disabled" | "maxLength" | "minLength" | "readOnly" | "defaultChecked" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "lang" | "spellCheck" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "property" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "css" | "width" | "size" | "accept" | "alt" | "capture" | "checked" | "crossOrigin" | "enterKeyHint" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "list" | "max" | "min" | "multiple" | "src" | "step" | "type"> & RefAttributes<HTMLInputElement>> = ...
InputWidget: ForwardRefExoticComponent<{ activeWizardRef?: MutableRefObject<null | WizardControl>; allowAllDefinedValues?: Accessor<boolean>; analytics?: BaseAnalytic; blockingValidators?: ValidatorFunction[]; cacheTime?: Accessor<number>; className?: string; containerErrorsStore?: Store<ErrorElement[]>; containerProps?: BoxProps; containerStore: Store<object>; copyValue?: GenericAccessor; dataSource: GenericAccessor; dataTarget: GenericAccessor; description?: string | Element; displayValue?: GenericAccessor; helpText?: string; labelContainerProps?: BoxProps; mainDetailObject: DetailObject; name: string; notBlockingValidators?: ValidatorFunction[]; notifier: BaseNotifier; provider: Provider; required?: Accessor<boolean>; resource: string; setInitialValue: Function; setMainDetailObject: Function; style?: CSSProperties; submitChange: Function; targetPayload: Function; useClipboard?: boolean; viewType: string; widgetAnalytics?: boolean | Function; widgetClassName?: string } & Omit<TestIdGenerationProps, "name"> & { debounce?: number; height?: number; inputProps?: StyleProps; isDisabled?: Accessor<boolean>; isTextarea?: boolean; textareaResize?: ResponsiveValue<Resize> } & RefAttributes<HTMLInputElement>> = ...
ListIntegrator: Integrator<FC<ContextsData<{ data: Context<Readonly<DataContext>>; params: Context<readonly [Params, ((p: Params) => void)]>; status: Context<Readonly<StatusContext>> }>>, { Data: PolymorphComponent<{ isLoading?: boolean; isNotLoaded?: boolean; items: unknown[] }>; Filters: PolymorphComponent<{ filters: unknown; isLoading?: boolean; onChange: any }>; Order: PolymorphComponent<{ isLoading?: boolean; order: unknown; onChange: any }>; Pagination: PolymorphComponent<{ currentPage: number; isLoading?: boolean; totalPages: number; onChange: any }> }> = ...

Компонент-интегратор для управления списком записей получаемых с сервера в стандартной связке:

  • элементы
  • фильтры
  • сортировка
  • пагинация
  • текущий статус получения данных

В корневой элемент передаются параметры запроса и данные полученные по этому запросу

LoggerProvider: Provider<LoggingHandler> = loggerContext.Provider
NotificationsProvider: Provider<NotificationsHandler> = notificationsContext.Provider
OrderedTable: ComponentType<{ as?: ElementType<any>; theme?: Theme } & ClassAttributes<HTMLTableElement> & TableHTMLAttributes<HTMLTableElement> & SortingProps & { children?: undefined; columns: readonly ColumnConfig<unknown, { as?: ElementType<any>; theme?: Theme } & ClassAttributes<HTMLTableHeaderCellElement> & ThHTMLAttributes<HTMLTableHeaderCellElement> & { children?: ReactNode }, { as?: ElementType<any>; theme?: Theme } & ClassAttributes<HTMLTableDataCellElement> & TdHTMLAttributes<HTMLTableDataCellElement> & { children?: ReactNode }, unknown, unknown>[]; data: readonly unknown[]; dataRow?: DataRowDesc<{ as?: ElementType<any>; theme?: Theme } & ClassAttributes<HTMLTableRowElement> & HTMLAttributes<HTMLTableRowElement> & { children?: ReactNode }, unknown, unknown>; headerRow?: HeaderRowDesc<{ as?: ElementType<any>; theme?: Theme } & ClassAttributes<HTMLTableRowElement> & HTMLAttributes<HTMLTableRowElement> & { children?: ReactNode }, unknown>; getKey?: any }> = ...
PhoneChipInput: ForwardRefExoticComponent<PhoneChipInputProps & RefAttributes<HTMLInputElement>> = ...
RegexInputWidget: ForwardRefExoticComponent<{ activeWizardRef?: MutableRefObject<null | WizardControl>; allowAllDefinedValues?: Accessor<boolean>; analytics?: BaseAnalytic; blockingValidators?: ValidatorFunction[]; cacheTime?: Accessor<number>; className?: string; containerErrorsStore?: Store<ErrorElement[]>; containerProps?: BoxProps; containerStore: Store<object>; copyValue?: GenericAccessor; dataSource: GenericAccessor; dataTarget: GenericAccessor; description?: string | Element; displayValue?: GenericAccessor; helpText?: string; labelContainerProps?: BoxProps; mainDetailObject: DetailObject; name: string; notBlockingValidators?: ValidatorFunction[]; notifier: BaseNotifier; provider: Provider; required?: Accessor<boolean>; resource: string; setInitialValue: Function; setMainDetailObject: Function; style?: CSSProperties; submitChange: Function; targetPayload: Function; useClipboard?: boolean; viewType: string; widgetAnalytics?: boolean | Function; widgetClassName?: string } & Omit<TestIdGenerationProps, "name"> & { debounce?: number; height?: number; isDisabled?: Accessor<boolean>; regexp: RegExp } & RefAttributes<HTMLInputElement>> = ...
RenderList: React.FC<{ admin: BaseAdmin; analytics?: BaseAnalytic; provider: Provider; resourceName: string; user: any }> = ...

Async load models and render them as paginated table. Change page title.

param resourceName

using for analytics

param admin

meta-information fo rendered models

param provider

used for requests to backend

param user

used for filter query

param analytics

for send analytics event

Resource: FC<ResourceProps> = ...
ResourceComposer: FC<ResourceComposerProps> = ...
ResourceConfigContext: Context<null | ResourceDefaultConfig<unknown, unknown>> = ...
SaveEventProvider: React.FC = ...
SelectListIntegrator: Integrator<FC<ContextsData<{ data: Context<Readonly<DataContext>>; params: Context<readonly [Params, ((p: Params) => void)]>; selected: Context<readonly [unknown[], ((selected: unknown[]) => void)]>; status: Context<Readonly<StatusContext>> }>>, { Data: PolymorphComponent<{ isLoading?: boolean; isNotLoaded?: boolean; items: unknown[]; selected?: unknown[]; onSelectedChange?: any }>; Filters: PolymorphComponent<{ filters: unknown; isLoading?: boolean; onChange: any }>; Order: PolymorphComponent<{ isLoading?: boolean; order: unknown; onChange: any }>; Pagination: PolymorphComponent<{ currentPage: number; isLoading?: boolean; totalPages: number; onChange: any }>; Selected: PolymorphComponent<{ isLoading?: boolean; selected: unknown[]; total?: number; onSelectedChange?: any }> }> = ...

Компонент-интегратор для управления списком записей получаемых с сервера в стандартной связке:

  • элементы
  • фильтры
  • сортировка
  • пагинация
  • текущий статус получения данных

С дополнительной возможностью выбора подмассива записей и организации пакетных операций над ними. Технически, с помощь данного интегратора можно реализовать компонент с функциональностью Select

В корневой элемент передаются параметры запроса и данные полученные по этому запросу, а также текущие выбранные записи Важно отметить: на этом этапе не производится никаких проверок, что выбранные элементы являются подмассивом к основным.

SelectListPattern: Integrator<(<T>(p: SelectListPatternProps<T>) => ReactElement<any, string | JSXElementConstructor<any>>), { Data: PolymorphComponent<{ isLoading?: boolean; isNotLoaded?: boolean; items: unknown[]; selected?: unknown[]; onSelectedChange?: any }>; Filters: PolymorphComponent<{ filters: unknown; isLoading?: boolean; onChange: any }>; Order: PolymorphComponent<{ isLoading?: boolean; order: unknown; onChange: any }>; Pagination: PolymorphComponent<{ currentPage: number; isLoading?: boolean; totalPages: number; onChange: any }>; Selected: PolymorphComponent<{ isLoading?: boolean; selected: unknown[]; total?: number; onSelectedChange?: any }> }> = ...

Паттерн для вывода списка с поддержкой фильтрации/пагинации и выбором элементов из списка.

С помощью данного паттерна можно реализовать, multi-select

SelectTable: ComponentType<{ as?: ElementType<any>; theme?: Theme } & ClassAttributes<HTMLTableElement> & TableHTMLAttributes<HTMLTableElement> & SortingProps & SelectProps<unknown> & { children?: undefined; columns: readonly ColumnConfig<unknown, { as?: ElementType<any>; theme?: Theme } & ClassAttributes<HTMLTableHeaderCellElement> & ThHTMLAttributes<HTMLTableHeaderCellElement> & { children?: ReactNode }, { as?: ElementType<any>; theme?: Theme } & ClassAttributes<HTMLTableDataCellElement> & TdHTMLAttributes<HTMLTableDataCellElement> & { children?: ReactNode }, unknown, unknown>[]; data: readonly unknown[]; dataRow?: DataRowDesc<{ as?: ElementType<any>; theme?: Theme } & ClassAttributes<HTMLTableRowElement> & HTMLAttributes<HTMLTableRowElement> & { children?: ReactNode }, unknown, unknown>; headerRow?: HeaderRowDesc<{ as?: ElementType<any>; theme?: Theme } & ClassAttributes<HTMLTableRowElement> & HTMLAttributes<HTMLTableRowElement> & { children?: ReactNode }, unknown>; getKey?: any }> = ...
SelectWidget: ForwardRefExoticComponent<SelectWidgetProps & RefAttributes<HTMLSelectElement>> = ...
StyleDateTime: StyledComponent<{ as?: ElementType<any>; theme?: Theme }, DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}> = ...
Switch: ForwardRefExoticComponent<ControlProps<boolean> & { helpText?: string } & Omit<SwitchProps, "onChange" | "value"> & RefAttributes<HTMLInputElement>> = ...
TestIdProvider: React.FC<TestIdProviderProps> = ...
TextEditor: ForwardRefExoticComponent<TextEditorProps & RefAttributes<HTMLDivElement>> = ...
Textarea: ForwardRefExoticComponent<Pick<AdapterProps<"textarea">, "aria-label" | "aria-labelledby" | "autoFocus" | "className" | "id" | "name" | "onBlur" | "onChange" | "onFocus" | "onKeyDown" | "placeholder" | "tabIndex" | "value" | "defaultValue" | "prefix" | "resource" | "style" | "required" | "form" | "slot" | "title" | "key" | "autoComplete" | "cols" | "dirName" | "disabled" | "maxLength" | "minLength" | "readOnly" | "rows" | "wrap" | "defaultChecked" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "lang" | "spellCheck" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "property" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "css"> & RefAttributes<HTMLTextAreaElement>> = ...
ValidationWrapper: React.FC<ValidationWrapperProps> = ...

Wrapper component to adding validation checks. Can be used only for children with handleChange prop.

param children

standard react children

param blockingValidators

fail in this validators will be shown as error

param notBlockingValidators

fail in this validators will be shown as info

param provider

provider for backend request, will be passed as second param to validators

param detailObject

addition object, will be passed as third param to validators

param context

current context

WidgetWrapper: React.FC<WidgetWrapperProps> = ...

Standard styled container for other widgets

param style

container css styles

param helpText

inner widget(s) label

param children

standard react children

param copyValue

returns of this callback will be copy to clipboard (when use)

param useClipboard

show "copy-to-clipboard" handler

param notifier

object for send notification text on "copy-to-clipboard" event

param name

name data-attribute

param description

description

clearErrors: Event<void> = ...
defaultTheme: { blur: { 2xl: string; 3xl: string; base: string; lg: string; md: string; none: number; sm: string; xl: string }; borders: { 1px: string; 2px: string; 4px: string; 8px: string; none: number }; breakpoints: Breakpoints<{ 2xl: string; lg: string; md: string; sm: string; xl: string }>; colors: { black: string; blackAlpha: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }; blue: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }; current: string; cyan: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }; facebook: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }; gray: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }; green: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }; linkedin: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }; messenger: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }; orange: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }; pink: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }; purple: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }; red: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }; teal: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }; telegram: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }; transparent: string; twitter: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }; whatsapp: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }; white: string; whiteAlpha: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }; yellow: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string } }; components: __module; config: ThemeConfig; direction: "ltr"; fontSizes: { 2xl: string; 3xl: string; 4xl: string; 5xl: string; 6xl: string; 7xl: string; 8xl: string; 9xl: string; lg: string; md: string; sm: string; xl: string; xs: string }; fontWeights: { black: number; bold: number; extrabold: number; hairline: number; light: number; medium: number; normal: number; semibold: number; thin: number }; fonts: { body: string; heading: string; mono: string }; letterSpacings: { normal: string; tight: string; tighter: string; wide: string; wider: string; widest: string }; lineHeights: { 10: string; 3: string; 4: string; 5: string; 6: string; 7: string; 8: string; 9: string; base: number; none: number; normal: string; short: number; shorter: number; tall: number; taller: string }; radii: { 2xl: string; 3xl: string; base: string; full: string; lg: string; md: string; none: string; sm: string; xl: string }; shadows: { 2xl: string; base: string; dark-lg: string; inner: string; lg: string; md: string; none: string; outline: string; sm: string; xl: string; xs: string }; sizes: { 0.5: string; 1: string; 1.5: string; 10: string; 12: string; 14: string; 16: string; 2: string; 2.5: string; 20: string; 24: string; 28: string; 2xl: string; 2xs: string; 3: string; 3.5: string; 32: string; 36: string; 3xl: string; 3xs: string; 4: string; 40: string; 44: string; 48: string; 4xl: string; 5: string; 52: string; 56: string; 5xl: string; 6: string; 60: string; 64: string; 6xl: string; 7: string; 72: string; 7xl: string; 8: string; 80: string; 8xl: string; 9: string; 96: string; container: { lg: string; md: string; sm: string; xl: string }; full: string; lg: string; max: string; md: string; min: string; px: string; sm: string; xl: string; xs: string }; space: { 0.5: string; 1: string; 1.5: string; 10: string; 12: string; 14: string; 16: string; 2: string; 2.5: string; 20: string; 24: string; 28: string; 3: string; 3.5: string; 32: string; 36: string; 4: string; 40: string; 44: string; 48: string; 5: string; 52: string; 56: string; 6: string; 60: string; 64: string; 7: string; 72: string; 8: string; 80: string; 9: string; 96: string; px: string }; styles: Styles; transition: { duration: { fast: string; faster: string; normal: string; slow: string; slower: string; ultra-fast: string; ultra-slow: string }; easing: { ease-in: string; ease-in-out: string; ease-out: string }; property: { background: string; colors: string; common: string; dimensions: string; position: string } }; zIndices: { auto: string; banner: number; base: number; docked: number; dropdown: number; hide: number; modal: number; overlay: number; popover: number; skipLink: number; sticky: number; toast: number; tooltip: number } } = ...

Type declaration

  • blur: { 2xl: string; 3xl: string; base: string; lg: string; md: string; none: number; sm: string; xl: string }
    • 2xl: string
    • 3xl: string
    • base: string
    • lg: string
    • md: string
    • none: number
    • sm: string
    • xl: string
  • borders: { 1px: string; 2px: string; 4px: string; 8px: string; none: number }
    • 1px: string
    • 2px: string
    • 4px: string
    • 8px: string
    • none: number
  • breakpoints: Breakpoints<{ 2xl: string; lg: string; md: string; sm: string; xl: string }>
  • colors: { black: string; blackAlpha: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }; blue: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }; current: string; cyan: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }; facebook: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }; gray: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }; green: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }; linkedin: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }; messenger: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }; orange: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }; pink: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }; purple: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }; red: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }; teal: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }; telegram: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }; transparent: string; twitter: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }; whatsapp: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }; white: string; whiteAlpha: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }; yellow: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string } }
    • black: string
    • blackAlpha: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }
      • 100: string
      • 200: string
      • 300: string
      • 400: string
      • 50: string
      • 500: string
      • 600: string
      • 700: string
      • 800: string
      • 900: string
    • blue: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }
      • 100: string
      • 200: string
      • 300: string
      • 400: string
      • 50: string
      • 500: string
      • 600: string
      • 700: string
      • 800: string
      • 900: string
    • current: string
    • cyan: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }
      • 100: string
      • 200: string
      • 300: string
      • 400: string
      • 50: string
      • 500: string
      • 600: string
      • 700: string
      • 800: string
      • 900: string
    • facebook: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }
      • 100: string
      • 200: string
      • 300: string
      • 400: string
      • 50: string
      • 500: string
      • 600: string
      • 700: string
      • 800: string
      • 900: string
    • gray: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }
      • 100: string
      • 200: string
      • 300: string
      • 400: string
      • 50: string
      • 500: string
      • 600: string
      • 700: string
      • 800: string
      • 900: string
    • green: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }
      • 100: string
      • 200: string
      • 300: string
      • 400: string
      • 50: string
      • 500: string
      • 600: string
      • 700: string
      • 800: string
      • 900: string
    • linkedin: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }
      • 100: string
      • 200: string
      • 300: string
      • 400: string
      • 50: string
      • 500: string
      • 600: string
      • 700: string
      • 800: string
      • 900: string
    • messenger: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }
      • 100: string
      • 200: string
      • 300: string
      • 400: string
      • 50: string
      • 500: string
      • 600: string
      • 700: string
      • 800: string
      • 900: string
    • orange: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }
      • 100: string
      • 200: string
      • 300: string
      • 400: string
      • 50: string
      • 500: string
      • 600: string
      • 700: string
      • 800: string
      • 900: string
    • pink: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }
      • 100: string
      • 200: string
      • 300: string
      • 400: string
      • 50: string
      • 500: string
      • 600: string
      • 700: string
      • 800: string
      • 900: string
    • purple: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }
      • 100: string
      • 200: string
      • 300: string
      • 400: string
      • 50: string
      • 500: string
      • 600: string
      • 700: string
      • 800: string
      • 900: string
    • red: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }
      • 100: string
      • 200: string
      • 300: string
      • 400: string
      • 50: string
      • 500: string
      • 600: string
      • 700: string
      • 800: string
      • 900: string
    • teal: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }
      • 100: string
      • 200: string
      • 300: string
      • 400: string
      • 50: string
      • 500: string
      • 600: string
      • 700: string
      • 800: string
      • 900: string
    • telegram: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }
      • 100: string
      • 200: string
      • 300: string
      • 400: string
      • 50: string
      • 500: string
      • 600: string
      • 700: string
      • 800: string
      • 900: string
    • transparent: string
    • twitter: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }
      • 100: string
      • 200: string
      • 300: string
      • 400: string
      • 50: string
      • 500: string
      • 600: string
      • 700: string
      • 800: string
      • 900: string
    • whatsapp: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }
      • 100: string
      • 200: string
      • 300: string
      • 400: string
      • 50: string
      • 500: string
      • 600: string
      • 700: string
      • 800: string
      • 900: string
    • white: string
    • whiteAlpha: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }
      • 100: string
      • 200: string
      • 300: string
      • 400: string
      • 50: string
      • 500: string
      • 600: string
      • 700: string
      • 800: string
      • 900: string
    • yellow: { 100: string; 200: string; 300: string; 400: string; 50: string; 500: string; 600: string; 700: string; 800: string; 900: string }
      • 100: string
      • 200: string
      • 300: string
      • 400: string
      • 50: string
      • 500: string
      • 600: string
      • 700: string
      • 800: string
      • 900: string
  • components: __module
  • config: ThemeConfig
  • direction: "ltr"
  • fontSizes: { 2xl: string; 3xl: string; 4xl: string; 5xl: string; 6xl: string; 7xl: string; 8xl: string; 9xl: string; lg: string; md: string; sm: string; xl: string; xs: string }
    • 2xl: string
    • 3xl: string
    • 4xl: string
    • 5xl: string
    • 6xl: string
    • 7xl: string
    • 8xl: string
    • 9xl: string
    • lg: string
    • md: string
    • sm: string
    • xl: string
    • xs: string
  • fontWeights: { black: number; bold: number; extrabold: number; hairline: number; light: number; medium: number; normal: number; semibold: number; thin: number }
    • black: number
    • bold: number
    • extrabold: number
    • hairline: number
    • light: number
    • medium: number
    • normal: number
    • semibold: number
    • thin: number
  • fonts: { body: string; heading: string; mono: string }
    • body: string
    • heading: string
    • mono: string
  • letterSpacings: { normal: string; tight: string; tighter: string; wide: string; wider: string; widest: string }
    • normal: string
    • tight: string
    • tighter: string
    • wide: string
    • wider: string
    • widest: string
  • lineHeights: { 10: string; 3: string; 4: string; 5: string; 6: string; 7: string; 8: string; 9: string; base: number; none: number; normal: string; short: number; shorter: number; tall: number; taller: string }
    • 10: string
    • 3: string
    • 4: string
    • 5: string
    • 6: string
    • 7: string
    • 8: string
    • 9: string
    • base: number
    • none: number
    • normal: string
    • short: number
    • shorter: number
    • tall: number
    • taller: string
  • radii: { 2xl: string; 3xl: string; base: string; full: string; lg: string; md: string; none: string; sm: string; xl: string }
    • 2xl: string
    • 3xl: string
    • base: string
    • full: string
    • lg: string
    • md: string
    • none: string
    • sm: string
    • xl: string
  • shadows: { 2xl: string; base: string; dark-lg: string; inner: string; lg: string; md: string; none: string; outline: string; sm: string; xl: string; xs: string }
    • 2xl: string
    • base: string
    • dark-lg: string
    • inner: string
    • lg: string
    • md: string
    • none: string
    • outline: string
    • sm: string
    • xl: string
    • xs: string
  • sizes: { 0.5: string; 1: string; 1.5: string; 10: string; 12: string; 14: string; 16: string; 2: string; 2.5: string; 20: string; 24: string; 28: string; 2xl: string; 2xs: string; 3: string; 3.5: string; 32: string; 36: string; 3xl: string; 3xs: string; 4: string; 40: string; 44: string; 48: string; 4xl: string; 5: string; 52: string; 56: string; 5xl: string; 6: string; 60: string; 64: string; 6xl: string; 7: string; 72: string; 7xl: string; 8: string; 80: string; 8xl: string; 9: string; 96: string; container: { lg: string; md: string; sm: string; xl: string }; full: string; lg: string; max: string; md: string; min: string; px: string; sm: string; xl: string; xs: string }
    • 0.5: string
    • 1: string
    • 1.5: string
    • 10: string
    • 12: string
    • 14: string
    • 16: string
    • 2: string
    • 2.5: string
    • 20: string
    • 24: string
    • 28: string
    • 2xl: string
    • 2xs: string
    • 3: string
    • 3.5: string
    • 32: string
    • 36: string
    • 3xl: string
    • 3xs: string
    • 4: string
    • 40: string
    • 44: string
    • 48: string
    • 4xl: string
    • 5: string
    • 52: string
    • 56: string
    • 5xl: string
    • 6: string
    • 60: string
    • 64: string
    • 6xl: string
    • 7: string
    • 72: string
    • 7xl: string
    • 8: string
    • 80: string
    • 8xl: string
    • 9: string
    • 96: string
    • container: { lg: string; md: string; sm: string; xl: string }
      • lg: string
      • md: string
      • sm: string
      • xl: string
    • full: string
    • lg: string
    • max: string
    • md: string
    • min: string
    • px: string
    • sm: string
    • xl: string
    • xs: string
  • space: { 0.5: string; 1: string; 1.5: string; 10: string; 12: string; 14: string; 16: string; 2: string; 2.5: string; 20: string; 24: string; 28: string; 3: string; 3.5: string; 32: string; 36: string; 4: string; 40: string; 44: string; 48: string; 5: string; 52: string; 56: string; 6: string; 60: string; 64: string; 7: string; 72: string; 8: string; 80: string; 9: string; 96: string; px: string }
    • 0.5: string
    • 1: string
    • 1.5: string
    • 10: string
    • 12: string
    • 14: string
    • 16: string
    • 2: string
    • 2.5: string
    • 20: string
    • 24: string
    • 28: string
    • 3: string
    • 3.5: string
    • 32: string
    • 36: string
    • 4: string
    • 40: string
    • 44: string
    • 48: string
    • 5: string
    • 52: string
    • 56: string
    • 6: string
    • 60: string
    • 64: string
    • 7: string
    • 72: string
    • 8: string
    • 80: string
    • 9: string
    • 96: string
    • px: string
  • styles: Styles
  • transition: { duration: { fast: string; faster: string; normal: string; slow: string; slower: string; ultra-fast: string; ultra-slow: string }; easing: { ease-in: string; ease-in-out: string; ease-out: string }; property: { background: string; colors: string; common: string; dimensions: string; position: string } }
    • duration: { fast: string; faster: string; normal: string; slow: string; slower: string; ultra-fast: string; ultra-slow: string }
      • fast: string
      • faster: string
      • normal: string
      • slow: string
      • slower: string
      • ultra-fast: string
      • ultra-slow: string
    • easing: { ease-in: string; ease-in-out: string; ease-out: string }
      • ease-in: string
      • ease-in-out: string
      • ease-out: string
    • property: { background: string; colors: string; common: string; dimensions: string; position: string }
      • background: string
      • colors: string
      • common: string
      • dimensions: string
      • position: string
  • zIndices: { auto: string; banner: number; base: number; docked: number; dropdown: number; hide: number; modal: number; overlay: number; popover: number; skipLink: number; sticky: number; toast: number; tooltip: number }
    • auto: string
    • banner: number
    • base: number
    • docked: number
    • dropdown: number
    • hide: number
    • modal: number
    • overlay: number
    • popover: number
    • skipLink: number
    • sticky: number
    • toast: number
    • tooltip: number
localStorageProvider: LocalStorage = ...
locationSearchProvider: LocationSearch = ...
pushError: Event<{ errorText: string; widgetName?: string }> = ...

Functions

  • Arr<T>(__namedParameters: ArrProps<T>): JSX.Element
  • AsyncDualSelectWidget(props: DualSelectWidgetProps): Element
  • Render data as text block with props.style and props.helpText Async load "data" from props.dataSource and then get content via props.displayValue if exists else get "data"[props.name].

    Parameters

    Returns Element

  • AsyncSelectWidget(__namedParameters: AsyncSelectWidgetProps): Element
  • AvatarWidget(props: AvatarWidgetProps): Element
  • BaseFilter(__namedParameters: FilterProps): Element
  • BooleanFilter(params: BooleanFilterProps): Element
  • Button(props: ButtonProps): Element
  • ButtonGroup<T>(__namedParameters: ButtonGroupProps<T>): JSX.Element
  • CheckBoxGroup<T>(props: ControlProps<T[]> & { defaultValue?: string[]; getKey: any; getLabel: any; getValue: any } & { ref?: ForwardedRef<HTMLDivElement> }): Element
  • CheckboxWidget(props: { activeWizardRef?: MutableRefObject<null | WizardControl>; allowAllDefinedValues?: Accessor<boolean>; analytics?: BaseAnalytic; blockingValidators?: ValidatorFunction[]; cacheTime?: Accessor<number>; className?: string; containerErrorsStore?: Store<ErrorElement[]>; containerProps?: BoxProps; containerStore: Store<object>; copyValue?: GenericAccessor; dataSource: GenericAccessor; dataTarget: GenericAccessor; description?: string | Element; displayValue?: GenericAccessor; helpText?: string; labelContainerProps?: BoxProps; mainDetailObject: DetailObject; name: string; notBlockingValidators?: ValidatorFunction[]; notifier: BaseNotifier; provider: Provider; required?: Accessor<boolean>; resource: string; setInitialValue: Function; setMainDetailObject: Function; style?: CSSProperties; submitChange: Function; targetPayload: Function; useClipboard?: boolean; viewType: string; widgetAnalytics?: boolean | Function; widgetClassName?: string } & Omit<TestIdGenerationProps, "name"> & { isDisabled?: Accessor<boolean>; isReadOnly?: Accessor<boolean> }): Element
  • Render input-checkbox for using in forms Load "value" from props.dataSource and then get content via props.displayValue if exists else get 'data'[props.name].

    Parameters

    • props: { activeWizardRef?: MutableRefObject<null | WizardControl>; allowAllDefinedValues?: Accessor<boolean>; analytics?: BaseAnalytic; blockingValidators?: ValidatorFunction[]; cacheTime?: Accessor<number>; className?: string; containerErrorsStore?: Store<ErrorElement[]>; containerProps?: BoxProps; containerStore: Store<object>; copyValue?: GenericAccessor; dataSource: GenericAccessor; dataTarget: GenericAccessor; description?: string | Element; displayValue?: GenericAccessor; helpText?: string; labelContainerProps?: BoxProps; mainDetailObject: DetailObject; name: string; notBlockingValidators?: ValidatorFunction[]; notifier: BaseNotifier; provider: Provider; required?: Accessor<boolean>; resource: string; setInitialValue: Function; setMainDetailObject: Function; style?: CSSProperties; submitChange: Function; targetPayload: Function; useClipboard?: boolean; viewType: string; widgetAnalytics?: boolean | Function; widgetClassName?: string } & Omit<TestIdGenerationProps, "name"> & { isDisabled?: Accessor<boolean>; isReadOnly?: Accessor<boolean> }

      widget props

    Returns Element

  • ColumnsHider<T>(__namedParameters: ColumnHiderProps<T>): JSX.Element
  • ConfigProvider<GlobalConfig>(__namedParameters: ConfigProviderProps<GlobalConfig>): ReactElement<any, string | JSXElementConstructor<any>>
  • ContainerWidget(props: any): Element
  • DateFilter(params: DateTimeFilterProps): Element
  • DateTimeFilter(params: DateTimeFilterProps): Element
  • DateTimeRangeListWidget(props: DateTimeRangeWidgetProps): Element
  • Render list of datetime range widgets. Suppose to use for schedule modify.

    Waits for data type: [string, string][] , where string - ISO Date

    props.oneDayInterval: boolean - restrict date range to one day length

    Parameters

    • props: DateTimeRangeWidgetProps

      widget props

    Returns Element

  • DateTimeRangeWidget(props: DateTimeRangeWidgetProps): Element
  • Render date-range picker Waits for data type: [string, string], where string - ISO Date

    props.oneDayInterval: boolean - restrict date range to one day length

    Parameters

    • props: DateTimeRangeWidgetProps

      widget props

    Returns Element

  • DateTimeWidget(props: DateTimeWidgetProps): Element
  • DateWidget(props: DateWidgetProps): Element
  • DebounceInput(props: ControlProps<string> & { debounceTimeout?: number; element?: FC<unknown> } & { ref?: ForwardedRef<HTMLInputElement> }): Element
  • EmailChipInputWidget(props: EmailChipInputWidgetProps): Element
  • EmptyFilter(props: { children: SlotElements<string> }): Element
  • FieldsBuilder(props: PropsWithDefaultLayout<BaseFieldsBuilderProps, [key: string | number, element: Element][]>): Element
  • FilesList(__namedParameters: FilesListProps): ReactElement<FilesListProps>
  • FilesUpload(__namedParameters: FilesUploadProps): ReactElement<FilesUploadProps>
  • ForeignKeySelectWidget(props: ForeignKeySelectWidgetProps): Element
  • Render select-input with async loaded options from backend onChange - can return full loaded model for option, not just key

    Based on AsyncSelectWidget, so have common props.

    props.optionLabel - got loaded model and return label for option props.optionValue - got loaded model and return label for value props.targetPayload - got selected model and return widget payload props.styles - react-select styles props.optionLabelMenu - got loaded model and return menu label for option props.optionLabelValue - got loaded model and return value label for option

    Parameters

    • props: ForeignKeySelectWidgetProps

      widget props

    Returns Element

  • Form<K, T>(__namedParameters: PropsWithChildren<FormProps<K, T>>): JSX.Element
  • Full(props: { children: SlotElements<"Label" | "Control" | "Errors"> }): Element
  • Group(__namedParameters: GroupProps): JSX.Element
  • HiddenAdditionalFilter(props: { children: SlotElements<"main" | "buttons" | "additional"> }): Element
  • HiddenAdditionalFilterWithResults(props: { children: SlotElements<"main" | "results" | "buttons" | "additional"> }): Element
  • Label(__namedParameters: LabelProps): Element
  • LinkWidget(props: LinkWidgetProps): Element
  • ListData<DataProps>(__namedParameters: ListDataProps<DataProps>): JSX.Element
  • Полиморфный компонент для подключения вывода данных к ListView

    remarks

    Требования к компоненту вывода данных - {@link RequiredDataProps}

    Type Parameters

    • DataProps extends RequiredDataProps

    Parameters

    • __namedParameters: ListDataProps<DataProps>

    Returns JSX.Element

  • ListFilters<FiltersProps>(__namedParameters: ListFiltersProps<FiltersProps>): JSX.Element
  • ListHorizontal(props: { children: Item[] }): Element
  • ListOrder<OrderProps>(__namedParameters: ListOrderProps<OrderProps>): JSX.Element
  • Полиморфный компонент для подключения отдельного компонента сортировки к ListView

    remarks

    Требования к компоненту сортировки - {@link RequiredOrderProps}

    Type Parameters

    • OrderProps extends RequiredOrderProps

    Parameters

    • __namedParameters: ListOrderProps<OrderProps>

    Returns JSX.Element

  • ListOrderedData<OrderedDataProps>(__namedParameters: ListOrderedDataProps<OrderedDataProps>): JSX.Element
  • Полиморфный компонент для подключения вывода данных к ListView c поддержкой сортировки

    remarks

    Требования к компоненту вывода данных - {@link RequiredOrderedDataProps}

    Type Parameters

    • OrderedDataProps extends RequiredOrderedDataProps

    Parameters

    • __namedParameters: ListOrderedDataProps<OrderedDataProps>

    Returns JSX.Element

  • ListPagination<PaginationProps>(__namedParameters: ListPaginationProps<PaginationProps>): JSX.Element
  • Полиморфный компонент для подключения пагинации к ListView

    remarks

    Требования к компоненту пагинации - {@link RequiredPaginationProps}

    Type Parameters

    • PaginationProps extends RequiredPaginationProps

    Parameters

    • __namedParameters: ListPaginationProps<PaginationProps>

    Returns JSX.Element

  • ListRaw(__namedParameters: ListRawProps): JSX.Element
  • Компонент для кастомизации стандартного функционала ListView. Используя render-props в children с пробросом всего состояния ListView в качестве параметров, позволяет реализовывать любую непредусмотренную логику.

    Parameters

    • __namedParameters: ListRawProps

    Returns JSX.Element

  • ListVertical(props: { children: Item[] }): Element
  • ListView(__namedParameters: PropsWithChildren<ListViewProps>): JSX.Element
  • Корневой компонент для отображения списков/таблиц/etc. различных сущностей. Через него задаётся контекст, которым пользуются остальные компоненты пакета

    Parameters

    • __namedParameters: PropsWithChildren<ListViewProps>

    Returns JSX.Element

  • MaskFilter(params: FilterProps & Props): Element
  • MessagesBlock(__namedParameters: { iconType?: MessageType; messageProps?: BoxProps; messageTextProps?: TextProps; messageType: MessageType; messages: undefined | (string | Element)[] }): Element
  • Parameters

    • __namedParameters: { iconType?: MessageType; messageProps?: BoxProps; messageTextProps?: TextProps; messageType: MessageType; messages: undefined | (string | Element)[] }
      • Optional iconType?: MessageType
      • Optional messageProps?: BoxProps
      • Optional messageTextProps?: TextProps
      • messageType: MessageType
      • messages: undefined | (string | Element)[]

    Returns Element

  • MultiSelectFilter(params: ResourceFilterProps): Element
  • MultiSelectWidget(props: MultiSelectWidgetProps): Element
  • Order(__namedParameters: OrderProps): ReactElement<OrderProps>
  • PageList(props: { children: SlotElements<"data" | "filters" | "pagination"> }): Element
  • Макет основного содержимого для страниц-списков с поддержкой фильтрации и пагинации

    Parameters

    • props: { children: SlotElements<"data" | "filters" | "pagination"> }

    Returns Element

  • PageM1xA4(props: { children: SlotElements<"T1" | "T2" | "M" | "B1" | "B2"> }): Element
  • PhoneChipInputWidget(props: PhoneChipInputWidgetProps): Element
  • RadioButtonWidget(props: RadioButtonWidgetProps): Element
  • RadioGroup<T>(props: ControlProps<undefined | T> & { items: T[]; getKey: any; getLabel: any; getValue: any } & { ref?: ForwardedRef<HTMLDivElement> }): Element
  • ReadOnlyWidget(props: ReadOnlyWidgetProps): Element
  • RenderDetail(props: RenderDetailProps): Element
  • ResourceProvider(__namedParameters: ResourceConfigProviderProps): ReactElement<any, string | JSXElementConstructor<any>>
  • RowWidget(props: RowWidgetProps): Element
  • Select<OptionType, IsMulti>(__namedParameters: SelectProps<OptionType, IsMulti, GroupTypeBase<OptionType>>): Element
  • SelectFilter(params: ResourceFilterProps): Element
  • SideBarElementCompatible(__namedParameters: SideBarElementProps): JSX.Element
  • StatefullAsyncSelect<OptionType>(__namedParameters: StatefullAsyncSelecProps<OptionType, number, false>): ReactElement<any, string | JSXElementConstructor<any>>
  • StyledTable<T>(props: TableProps<T>): ReactElement<any, string | JSXElementConstructor<any>>
  • Render input-switch for using in forms Load "value" from props.dataSource and then get content via props.displayValue if exists else get 'data'[props.name].

    Parameters

    Returns Element

  • Table(__namedParameters: TableProps): Element
  • TextEditorWidget(props: TextEditorProps): Element
  • TextValidationWidget(props: { activeWizardRef?: MutableRefObject<null | WizardControl>; allowAllDefinedValues?: Accessor<boolean>; analytics?: BaseAnalytic; blockingValidators?: ValidatorFunction[]; cacheTime?: Accessor<number>; className?: string; containerErrorsStore?: Store<ErrorElement[]>; containerProps?: BoxProps; containerStore: Store<object>; copyValue?: GenericAccessor; dataSource: GenericAccessor; dataTarget: GenericAccessor; description?: string | Element; displayValue?: GenericAccessor; helpText?: string; labelContainerProps?: BoxProps; mainDetailObject: DetailObject; name: string; notBlockingValidators?: ValidatorFunction[]; notifier: BaseNotifier; provider: Provider; required?: Accessor<boolean>; resource: string; setInitialValue: Function; setMainDetailObject: Function; style?: CSSProperties; submitChange: Function; targetPayload: Function; useClipboard?: boolean; viewType: string; widgetAnalytics?: boolean | Function; widgetClassName?: string } & Omit<TestIdGenerationProps, "name"> & { validateValue?: any }): Element
  • ThemeProvider(__namedParameters: ThemeProviderProps): Element
  • ToClipboard(__namedParameters: ToClipboardProps): Element
  • UpdatedFilters<K>(__namedParameters: FiltersProps<K, any>): ReactElement<FiltersProps<K, any>>
  • UpdatedWizard<Key, Action, StepData>(props: WizardProps<Key, Action, StepData>): Element
  • Type Parameters

    • Key extends string

    • Action extends string

    • StepData extends object

    Parameters

    • props: WizardProps<Key, Action, StepData>

    Returns Element

  • WhereFilters<FiltersProps>(__namedParameters: WhereFiltersProps<FiltersProps>): JSX.Element
  • Полиморфный компонент-обёртка для компонентов с контролами фильтров

    Type Parameters

    • FiltersProps extends RequiredFiltersProps

    Parameters

    • __namedParameters: WhereFiltersProps<FiltersProps>

    Returns JSX.Element

  • WherePanel<K>(__namedParameters: WhereProviderProps<K>): JSX.Element
  • WherePredefined<FiltersProps>(__namedParameters: WherePredefinedProps<FiltersProps>): JSX.Element
  • Полиморфный компонент-обёртка для компонентов выбора набора предустановленных фильтров

    Type Parameters

    • FiltersProps extends RequiredPredefinedProps

    Parameters

    • __namedParameters: WherePredefinedProps<FiltersProps>

    Returns JSX.Element

  • WithError(props: { children: SlotElements<"Control" | "Errors"> }): Element
  • combine(validatorsWithLevel: { level: number; validator: Validator }[]): LeveledValidator
  • convertZod(schema: ZodType): Validator
  • convertZodRecord(schema: ZodType, level: number): RecordValidator
  • entitiesList<Entity, ExtFilters, ErrorType>(filtersComponent: FiltersComponent<Omit<ExtFilters, "page" | "ordering">>, listComponent: ListComponent<Entity>, paginationComponent: PaginationComponent, options: null | EntitiesListConfig<ExtFilters, ErrorType>, __namedParameters: EntitiesListProps<Entity, ExtFilters>): { filters: ReactElement; list: ReactElement; pagination: ReactElement }
  • Type Parameters

    • Entity

    • ExtFilters extends { ordering?: string; page?: number; per_page?: number }

    • ErrorType = Error

    Parameters

    • filtersComponent: FiltersComponent<Omit<ExtFilters, "page" | "ordering">>
    • listComponent: ListComponent<Entity>
    • paginationComponent: PaginationComponent
    • options: null | EntitiesListConfig<ExtFilters, ErrorType>
    • __namedParameters: EntitiesListProps<Entity, ExtFilters>

    Returns { filters: ReactElement; list: ReactElement; pagination: ReactElement }

    • filters: ReactElement
    • list: ReactElement
    • pagination: ReactElement
  • entitiesPage<Entity, Filters>(entitiesListFeature: EntitiesListFeature<Entity, Partial<Filters>>, defaultFilters: Partial<Filters>, __namedParameters: EntitiesPageProps<Entity, Partial<Filters>>): { filters: ReactElement; list: ReactElement; pagination: ReactElement }
  • Type Parameters

    • Entity

    • Filters

    Parameters

    • entitiesListFeature: EntitiesListFeature<Entity, Partial<Filters>>
    • defaultFilters: Partial<Filters>
    • __namedParameters: EntitiesPageProps<Entity, Partial<Filters>>

    Returns { filters: ReactElement; list: ReactElement; pagination: ReactElement }

    • filters: ReactElement
    • list: ReactElement
    • pagination: ReactElement
  • getAccessor(handler: any, data?: DetailObject, context?: {}): any
  • getAccessorWithDefault(handler: any, data: DetailObject, context?: {}, defaultValue?: any): any
  • getPayload(value: any, name: string, targetPayload: GenericAccessor): null | string | {}
  • getWidgetContent(name: string, detailObject: DetailObject, handler: GenericAccessor, context?: {}, allowDefinedValues?: boolean): any
  • handleUserAction(actionHandlerArguments: ActionHandlerArguments): void
  • hasPermission(permissions: string[], requiredPerm: string): boolean
  • isEqual(a: any, b: any): boolean
  • makeByGetSet<T>(get: (() => readonly T[]), set: ((val: T[]) => void), calcPK: ((val: T) => string | number)): CRUDProvider<T>
  • Type Parameters

    • T

    Parameters

    • get: (() => readonly T[])
        • (): readonly T[]
        • Returns readonly T[]

    • set: ((val: T[]) => void)
        • (val: T[]): void
        • Parameters

          • val: T[]

          Returns void

    • calcPK: ((val: T) => string | number)
        • (val: T): string | number
        • Parameters

          • val: T

          Returns string | number

    Returns CRUDProvider<T>

  • makeDefault<Props, Predefined>(source: ComponentType<Props>, predefined: Predefined): FC<Props & Predefined>
  • Создаёт компонент-обёртку с частично или полностью определёнными props исходного компонента в качестве значений по-умолчанию

    remarks

    Помогает быстро создавать компоненты, совместимые с каким-либо API.

    example

    Определяем foo, но не трогаем bar

    // ComponentProps<SourceComponent> = { foo: unknown, bar: unknown }
    const NewComponent = makePartial(SourceComponent, { foo: 'test' })
    // Рендер <NewComponent bar={12} />
    // эквивалентен <SourceComponent foo="test" bar={12} />
    // но можно и <NewComponent bar={12} foo="other test" />
    // эквивалентен <SourceComponent foo="other test" bar={12} />

    Type Parameters

    • Props extends {}

    • Predefined extends Partial<Props>

    Parameters

    • source: ComponentType<Props>

      исходный компонент

    • predefined: Predefined

      словарь с зафиксированными props

    Returns FC<Props & Predefined>

  • makeEntitiesSource<Entity, Filters>(provider: Pick<Provider, "getPage">, url: string): EntitiesSource<Entity, Filters>
  • makeFiltersConsumer<K, ConsumerProps>(keys: K[], proxy?: ((data: ContextsData<Pick<{ filters: Context<FiltersContext> }, K>>) => ConsumerProps)): PolymorphComponent<ConsumerProps>
  • Type Parameters

    • K extends "filters"

    • ConsumerProps = ContextsData<Pick<{ filters: Context<FiltersContext> }, K>>

    Parameters

    • keys: K[]
    • Optional proxy: ((data: ContextsData<Pick<{ filters: Context<FiltersContext> }, K>>) => ConsumerProps)
        • (data: ContextsData<Pick<{ filters: Context<FiltersContext> }, K>>): ConsumerProps
        • Parameters

          • data: ContextsData<Pick<{ filters: Context<FiltersContext> }, K>>

          Returns ConsumerProps

    Returns PolymorphComponent<ConsumerProps>

  • makeList(Container: ComponentType<{}>, Item: ComponentType<{}>): LayoutComponent<Item[]>
  • makeListConsumer<K, ConsumerProps>(keys: K[], proxy?: ((data: ContextsData<Pick<{ data: Context<Readonly<DataContext>>; params: Context<readonly [Params, ((p: Params) => void)]>; status: Context<Readonly<StatusContext>> }, K>>) => ConsumerProps)): PolymorphComponent<ConsumerProps>
  • Фабричная функция для создания кастомных компонентов потребителей для интегратора ListIntegrator

    Type Parameters

    • K extends "data" | "params" | "status"

    • ConsumerProps = ContextsData<Pick<{ data: Context<Readonly<DataContext>>; params: Context<readonly [Params, ((p: Params) => void)]>; status: Context<Readonly<StatusContext>> }, K>>

    Parameters

    • keys: K[]
    • Optional proxy: ((data: ContextsData<Pick<{ data: Context<Readonly<DataContext>>; params: Context<readonly [Params, ((p: Params) => void)]>; status: Context<Readonly<StatusContext>> }, K>>) => ConsumerProps)
        • (data: ContextsData<Pick<{ data: Context<Readonly<DataContext>>; params: Context<readonly [Params, ((p: Params) => void)]>; status: Context<Readonly<StatusContext>> }, K>>): ConsumerProps
        • Parameters

          • data: ContextsData<Pick<{ data: Context<Readonly<DataContext>>; params: Context<readonly [Params, ((p: Params) => void)]>; status: Context<Readonly<StatusContext>> }, K>>

          Returns ConsumerProps

    Returns PolymorphComponent<ConsumerProps>

  • makeOrderedTable(table: TableComponent): OrderedTableComponent
  • makePartial<Props, Predefined>(source: ComponentType<Props>, predefined: Predefined): FC<Omit<Props, keyof Predefined>>
  • Создаёт компонент-обёртку с частично или полностью определёнными props исходного компонента

    remarks

    Помогает быстро создавать компоненты, совместимые с каким-либо API.

    example

    Определяем foo, но не трогаем bar

    // ComponentProps<SourceComponent> = { foo: unknown, bar: unknown }
    const NewComponent = makePartial(SourceComponent, { foo: 'test' })
    // Рендер <NewComponent bar={12} />
    // эквивалентен <SourceComponent foo="test" bar={12} />

    Type Parameters

    • Props extends {}

    • Predefined extends Partial<Props>

    Parameters

    • source: ComponentType<Props>

      исходный компонент

    • predefined: Predefined

      словарь с зафиксированными props

    Returns FC<Omit<Props, keyof Predefined>>

  • makePropsKeyProxy<SP, SK, TK>(source: FC<SP>, map: ReadonlyMap<SK, TK>): FC<Omit<SP, SK> & Record<TK, SP[SK]>>
  • Создаёт компонент-обёртку, переименовывая часть или все props перед передачей в исходный

    remarks

    Помогает быстро создавать компоненты, совместимые с каким-либо API. Если дополнительно требуется преобразовывать и значение props, то можно совмещать с makePropsValueProxy.

    example

    Простое переименование ключа foo в bar

    // ComponentProps<SourceComponent> = { foo: unknown }
    const NewComponent = makePropsKeyProxy(SourceComponent, new Map([
    ['foo', 'bar']
    ]))
    // ComponentProps<NewComponent> = { bar: unknown }

    Type Parameters

    • SP extends {}

    • SK extends string | number | symbol

    • TK extends string

    Parameters

    • source: FC<SP>

      исходный компонент

    • map: ReadonlyMap<SK, TK>

      карта переименований вида (исходный ключ, новый ключ)

    Returns FC<Omit<SP, SK> & Record<TK, SP[SK]>>

  • makePropsValueProxy<SP, SK, TV>(source: FC<SP>, map: ReadonlyMap<SK, ((val: unknown) => TV)>): FC<Omit<SP, SK> & Record<SK, TV>>
  • Создаёт компонент-обёртку, преобразующий часть или все значения props перед передачей в исходный

    remarks

    Помогает быстро создавать компоненты, совместимые с каким-либо API. Если дополнительно требуется преобразовывать и имена props, то можно совмещать с makePropsKeyProxy.

    example

    Пытаемся привести тип значения к строчному

    const AnyTypeComponent = makePropsValueProxy(SourceComponent, new Map([
    ['foo', (val: unknown) => JSON.stringify(val)]
    ]))
    // Рендер <AnyTypeComponent foo={12} />
    // эквивалентен <SourceComponent foo={JSON.stringify(12)} />

    Type Parameters

    • SP extends {}

    • SK extends string | number | symbol

    • TV

    Parameters

    • source: FC<SP>

      исходный компонент

    • map: ReadonlyMap<SK, ((val: unknown) => TV)>

      карта преобразований вида (ключ, функция-конвертер)

    Returns FC<Omit<SP, SK> & Record<SK, TV>>

  • makeProxied<SourceChildren, TargetChildren>(layout: LayoutComponent<SourceChildren, {}>, mapping: ((targetChildren: TargetChildren) => SourceChildren)): LayoutComponent<TargetChildren>
  • makeSelectListConsumer<K, ConsumerProps>(keys: K[], proxy?: ((data: ContextsData<Pick<{ data: Context<Readonly<DataContext>>; params: Context<readonly [Params, ((p: Params) => void)]>; selected: Context<readonly [unknown[], ((selected: unknown[]) => void)]>; status: Context<Readonly<StatusContext>> }, K>>) => ConsumerProps)): PolymorphComponent<ConsumerProps>
  • Type Parameters

    • K extends "data" | "params" | "status" | "selected"

    • ConsumerProps = ContextsData<Pick<{ data: Context<Readonly<DataContext>>; params: Context<readonly [Params, ((p: Params) => void)]>; selected: Context<readonly [unknown[], ((selected: unknown[]) => void)]>; status: Context<Readonly<StatusContext>> }, K>>

    Parameters

    • keys: K[]
    • Optional proxy: ((data: ContextsData<Pick<{ data: Context<Readonly<DataContext>>; params: Context<readonly [Params, ((p: Params) => void)]>; selected: Context<readonly [unknown[], ((selected: unknown[]) => void)]>; status: Context<Readonly<StatusContext>> }, K>>) => ConsumerProps)
        • (data: ContextsData<Pick<{ data: Context<Readonly<DataContext>>; params: Context<readonly [Params, ((p: Params) => void)]>; selected: Context<readonly [unknown[], ((selected: unknown[]) => void)]>; status: Context<Readonly<StatusContext>> }, K>>): ConsumerProps
        • Parameters

          • data: ContextsData<Pick<{ data: Context<Readonly<DataContext>>; params: Context<readonly [Params, ((p: Params) => void)]>; selected: Context<readonly [unknown[], ((selected: unknown[]) => void)]>; status: Context<Readonly<StatusContext>> }, K>>

          Returns ConsumerProps

    Returns PolymorphComponent<ConsumerProps>

  • Функция для создания слотовых компонентов-макетов

    remarks

    Слотовый макет предоставляет несколько различных точек (слотов) для вывода переданных ему в children prop подкомпонентов.

    remarks

    Нет сложности в описание макетов, как обычных react-компонентов, но использование этой функции гарантирует единообразный API для них

    Type Parameters

    • K extends string

    • Props = {}

    Parameters

    • mapping: ((elements: SlotElements<K>, props?: Props) => Element)

      функция, строящая итоговый элемент

        • Parameters

          Returns Element

    Returns LayoutComponent<SlotElements<K>, Props>

  • makeTableWithHidableColumns(table: TableComponent): TableWithHidableColumnsComponent
  • makeUpdateWithNotification(provider: Provider, url: string, payload: object, setObject: Function, notifier: BaseNotifier): Promise<any>
  • partial<T, U, R>(func: ((...args: [...T[], ...U[]]) => R), ...headArgs: T): ((...tailArgs: U) => R)
  • Создаёт функцию, вызывающую func c аргументами headArgs, перед переданным.

    see

    https://ru.wikipedia.org/wiki/Частичное_применение

    Type Parameters

    • T extends readonly any[]

    • U extends readonly any[]

    • R

    Parameters

    • func: ((...args: [...T[], ...U[]]) => R)

      исходная функция

        • (...args: [...T[], ...U[]]): R
        • Parameters

          • Rest ...args: [...T[], ...U[]]

          Returns R

    • Rest ...headArgs: T

      аргументы, с которыми будет вызываться func в в дополнение к переданным

    Returns ((...tailArgs: U) => R)

      • (...tailArgs: U): R
      • Parameters

        • Rest ...tailArgs: U

        Returns R

  • pushAnalytics(params: WidgetAnalyticsParams): void
  • recordCombine<K>(recordValidators: Record<K, LeveledValidator>): RecordValidator
  • registerLocale(localeName: string, localeData: Locale): void
  • Parameters

    • localeName: string
    • localeData: Locale

    Returns void

  • setDefaultLocale(localeName: string): void
  • Parameters

    • localeName: string

    Returns void

  • useAccess(user: User, resource: string, action: AccessActionType): AccessPayload
  • useAnalytics(): AnalyticsHandler
  • useApiState<T, Config>(initial: T, apiConfig: Config): [state: T, api: Api<T, Config>]
  • useArray(...tailArgs: Arr): RootProviderDesc
  • useArrayValidation(...tailArgs: [value: unknown[], validator?: ArrayValidator]): UseArrayValidationResult
  • useChangeEffect(callback: EffectCallback, deps?: DependencyList): void
  • useCombine(validatorsWithLevel: { level: number; validator: Validator }[]): LeveledValidator
  • useConfigResolver<T>(config: string | T): T
  • useDistinctCallback<Cb, T>(cb: undefined | Cb, equal?: ((prev: T, cur: T) => boolean), initial?: T): Cb
  • Type Parameters

    • Cb extends ((v: any) => void)

    • T extends any

    Parameters

    • cb: undefined | Cb
    • Optional equal: ((prev: T, cur: T) => boolean)
        • (prev: T, cur: T): boolean
        • Parameters

          • prev: T
          • cur: T

          Returns boolean

    • Optional initial: T

    Returns Cb

  • useFactoryPropState<T>(factory: (() => T), dependencies: readonly unknown[]): [T, ((val: T) => void)]
  • useFieldValidation(...tailArgs: [key: ErrorsKey, value: unknown, validator?: Validator]): UseFieldValidationResult
  • useForm(...tailArgs: Arr): UseFormResult
  • useGlobalConfig<GlobalConfig>(): ConfigProviderValue<GlobalConfig>
  • useIsMounted(): RefObject<boolean>
  • useListData(): DataContext
  • useListFilters(...tailArgs: Arr): Updatable<FiltersValue>
  • useMutateResource<ResourceData, SourceData, TError, TContext>(userConfigOrKey: ResourceOptionsOrKey<MutateResourceOptions<ResourceData, SourceData, TError, TContext>>, requestOptions?: MutationOptions<ResourceData, SourceData, TError, TContext>): MutationResult<ResourceData, SourceData, TError, TContext>
  • useNotifications(): NotificationsHandler
  • usePartialState<T>(initial: T): [T, ((val: Partial<T>) => void)]
  • usePreEffect(callback: EffectCallback, deps?: DependencyList): boolean
  • usePropState<T>(initial: T): [T, ((val: T | ((prev: T) => T)) => void)]
  • useRecord(...tailArgs: Arr): RootProviderDesc
  • useRecordValidation(...tailArgs: Arr): UseRecordValidationResult
  • useSaveEvent(): UseSaveEventApiResult
  • useStoreApiState<T, Api>(store$: Store<T>, apiConfig: Api): [T, StoreApi<T, Api>]
  • useToastNotifications(): NotificationsHandler
  • useWidgetInitialization(initializationArguments: InitializationArguments, options?: UseWidgetInitializationOptions): InitializedWidgetAttributes
  • useZod(schema: ZodType): Validator

Generated using TypeDoc