@apia/components 0.3.5 → 1.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/cleanDist.json +1 -1
- package/dist/index.d.ts +364 -42
- package/dist/index.js +2960 -1266
- package/dist/index.js.map +1 -1
- package/package.json +8 -9
package/cleanDist.json
CHANGED
package/dist/index.d.ts
CHANGED
|
@@ -1,9 +1,15 @@
|
|
|
1
1
|
import { ThemeUIStyleObject, IconButtonProps, ButtonProps, ThemeUICSSObject, InputProps, BoxProps } from '@apia/theme';
|
|
2
|
-
import { TModify, TId, TApiaFilter, TApiaFilterValue, IOnFocusConfiguration, TFocusRetriever, EventEmitter } from '@apia/util';
|
|
2
|
+
import { TModify, TId, TApiaFilter, TApiaFilterValue, IOnFocusConfiguration, TFocusRetriever, EventEmitter, PropsStore } from '@apia/util';
|
|
3
3
|
import * as React$1 from 'react';
|
|
4
|
-
import React__default, { ChangeEventHandler, MouseEvent, KeyboardEvent, ReactNode, FC, Ref, FunctionComponent, ForwardedRef, ComponentType, RefObject } from 'react';
|
|
4
|
+
import React__default, { ChangeEventHandler, MouseEvent as MouseEvent$1, KeyboardEvent, ReactNode, FC, Ref, FunctionComponent, ForwardedRef, ComponentType, RefObject } from 'react';
|
|
5
5
|
import { TIconType, TIconName } from '@apia/icons';
|
|
6
6
|
import { Args } from 'react-cool-portal';
|
|
7
|
+
import * as _apia_notifications from '@apia/notifications';
|
|
8
|
+
import { TNotificationId, INotification, TDispatchedNotification, TNotificationSelector } from '@apia/notifications';
|
|
9
|
+
export { INotification, TDispatchedNotification } from '@apia/notifications';
|
|
10
|
+
import * as _apia_components from '@apia/components';
|
|
11
|
+
import { MenuItemProps, ControlledMenuProps } from '@szhsin/react-menu';
|
|
12
|
+
export { ControlledMenuProps, MenuItemProps } from '@szhsin/react-menu';
|
|
7
13
|
|
|
8
14
|
type TModalSize = 'editGrid' | 'sm' | 'md' | 'md-fixed' | 'lg' | 'lg-fixed' | 'xl' | 'xl-fixed' | 'xxl' | 'xxxl' | 'xxxl-fixed' | 'flex' | 'cal' | 'finder';
|
|
9
15
|
type TApiaButtonType = 'primary' | 'primary-sm' | 'secondary' | 'light-secondary' | 'secondary-sm' | 'danger' | 'danger-sm' | 'outline' | 'outline-sm' | 'warning' | 'warning-sm' | 'link';
|
|
@@ -207,7 +213,7 @@ declare global {
|
|
|
207
213
|
AMOUNT_DECIMAL_ZEROS: string;
|
|
208
214
|
CHAR_DECIMAL_SEPARATOR: string;
|
|
209
215
|
CHAR_THOUS_SEPARATOR: string;
|
|
210
|
-
ADD_THOUSAND_SEPARATOR:
|
|
216
|
+
ADD_THOUSAND_SEPARATOR: boolean;
|
|
211
217
|
}
|
|
212
218
|
}
|
|
213
219
|
declare function parseNumberInputValueToNumber(value: string): number;
|
|
@@ -281,7 +287,7 @@ interface IAccordionItemButton {
|
|
|
281
287
|
* presiona espacio sobre el botón del acordeón.
|
|
282
288
|
*/
|
|
283
289
|
onChange?: (checked: boolean) => unknown;
|
|
284
|
-
onClick?: (ev: MouseEvent) => unknown;
|
|
290
|
+
onClick?: (ev: MouseEvent$1) => unknown;
|
|
285
291
|
onUserPressEnter?: (ev: KeyboardEvent) => unknown;
|
|
286
292
|
rightButtons?: ReactNode;
|
|
287
293
|
rightIcons?: TIconName[] | TIconName;
|
|
@@ -381,6 +387,7 @@ interface IApiaFilter {
|
|
|
381
387
|
declare const ApiaFilter: React$1.MemoExoticComponent<React$1.ForwardRefExoticComponent<IApiaFilter & React$1.RefAttributes<HTMLInputElement | HTMLSelectElement>>>;
|
|
382
388
|
|
|
383
389
|
interface ICollapsiblePanel {
|
|
390
|
+
'aria-hidden'?: boolean;
|
|
384
391
|
children: React.ReactNode;
|
|
385
392
|
className?: string;
|
|
386
393
|
closedIcon?: TIconType | TIconName;
|
|
@@ -394,6 +401,7 @@ interface ICollapsiblePanel {
|
|
|
394
401
|
onOpen?: (ev?: React.MouseEvent) => void | Promise<boolean>;
|
|
395
402
|
openIcon?: TIconType | TIconName;
|
|
396
403
|
label: React.ReactNode;
|
|
404
|
+
rememberCollapsedState?: boolean;
|
|
397
405
|
titleButtons?: React.ReactNode;
|
|
398
406
|
}
|
|
399
407
|
|
|
@@ -490,8 +498,8 @@ type TListbox = {
|
|
|
490
498
|
* su aspecto
|
|
491
499
|
*/
|
|
492
500
|
unstyled?: boolean;
|
|
493
|
-
onClickNode?: (ev: MouseEvent<HTMLElement>) => unknown;
|
|
494
|
-
onDoubleClickNode?: (ev: MouseEvent<HTMLElement>) => unknown;
|
|
501
|
+
onClickNode?: (ev: MouseEvent$1<HTMLElement>) => unknown;
|
|
502
|
+
onDoubleClickNode?: (ev: MouseEvent$1<HTMLElement>) => unknown;
|
|
495
503
|
/**
|
|
496
504
|
* Este evento es lanzado cuando el usuario estando en foco en la lista
|
|
497
505
|
* presiona:
|
|
@@ -519,7 +527,7 @@ type TOnSelectionChange = {
|
|
|
519
527
|
focusedElement: HTMLElement;
|
|
520
528
|
selectedElements: HTMLElement[];
|
|
521
529
|
};
|
|
522
|
-
type TOnClickNode = MouseEvent;
|
|
530
|
+
type TOnClickNode = MouseEvent$1;
|
|
523
531
|
|
|
524
532
|
declare const Listbox: React$1.MemoExoticComponent<((props: TListbox) => React$1.JSX.Element) & {
|
|
525
533
|
displayName: string;
|
|
@@ -967,11 +975,11 @@ type TIconsList<P = Record<string, unknown>> = {
|
|
|
967
975
|
/**
|
|
968
976
|
* Este callback es llamado cuando se hace click en un ícono
|
|
969
977
|
*/
|
|
970
|
-
onIconClick?: (ev: MouseEvent<HTMLElement>, icon: TIcon<P>) => unknown;
|
|
978
|
+
onIconClick?: (ev: MouseEvent$1<HTMLElement>, icon: TIcon<P>) => unknown;
|
|
971
979
|
/**
|
|
972
980
|
* Este callback es llamado cuando se hace doble click en un ícono
|
|
973
981
|
*/
|
|
974
|
-
onIconDoubleClick?: (ev: MouseEvent<HTMLElement>, icon: TIcon<P>) => unknown;
|
|
982
|
+
onIconDoubleClick?: (ev: MouseEvent$1<HTMLElement>, icon: TIcon<P>) => unknown;
|
|
975
983
|
/**
|
|
976
984
|
* Este método se usa para obtener detalles de un ícono. Es llamado cuando se
|
|
977
985
|
* hace foco o cuando se posiciona el mouse en un ícono. Si no está declarado
|
|
@@ -1018,8 +1026,29 @@ declare const IconsList: {
|
|
|
1018
1026
|
displayName: string;
|
|
1019
1027
|
};
|
|
1020
1028
|
|
|
1029
|
+
/**
|
|
1030
|
+
* Permite importar un componente en forma dinámica con ruta relativa a
|
|
1031
|
+
* /customComponents
|
|
1032
|
+
*/
|
|
1021
1033
|
declare function importComponent<T = unknown>(path: string): React$1.LazyExoticComponent<ComponentType<T>>;
|
|
1022
1034
|
|
|
1035
|
+
type TClickListener = () => unknown;
|
|
1036
|
+
type TItemState = Pick<TToolDefinition, 'disabled' | 'toggled'>;
|
|
1037
|
+
declare class ToolbarController extends EventEmitter<{
|
|
1038
|
+
pressEnter: string;
|
|
1039
|
+
updateItemState: string;
|
|
1040
|
+
}> {
|
|
1041
|
+
eventListeners: Record<string, TClickListener[]>;
|
|
1042
|
+
itemsState: Record<string, TItemState>;
|
|
1043
|
+
hooks: {
|
|
1044
|
+
useItemState: (id: string, initialState: TItemState) => TItemState;
|
|
1045
|
+
};
|
|
1046
|
+
setItemState: (id: string, newState: Partial<TItemState>) => void;
|
|
1047
|
+
Context: ({ children }: {
|
|
1048
|
+
children: ReactNode;
|
|
1049
|
+
}) => React$1.JSX.Element;
|
|
1050
|
+
}
|
|
1051
|
+
|
|
1023
1052
|
type TToolEventState = {
|
|
1024
1053
|
isToggled: boolean;
|
|
1025
1054
|
};
|
|
@@ -1027,7 +1056,7 @@ type TSeparator = {
|
|
|
1027
1056
|
separator: true;
|
|
1028
1057
|
};
|
|
1029
1058
|
type TToolDefinition = {
|
|
1030
|
-
action: (props: TToolEventState) => unknown;
|
|
1059
|
+
action: (props: TToolEventState, controller: ToolbarController) => unknown;
|
|
1031
1060
|
/**
|
|
1032
1061
|
* Si se pasa allowToggle y no se pasa toggled ( ni en true ni en false ),
|
|
1033
1062
|
* entonces el estado de toggle será controlado internamente en el toolbar
|
|
@@ -1051,23 +1080,6 @@ type TToolDefinition = {
|
|
|
1051
1080
|
};
|
|
1052
1081
|
type TTool = TToolDefinition | TSeparator;
|
|
1053
1082
|
|
|
1054
|
-
type TClickListener = () => unknown;
|
|
1055
|
-
type TItemState = Pick<TToolDefinition, 'disabled' | 'toggled'>;
|
|
1056
|
-
declare class ToolbarController extends EventEmitter<{
|
|
1057
|
-
pressEnter: string;
|
|
1058
|
-
updateItemState: string;
|
|
1059
|
-
}> {
|
|
1060
|
-
eventListeners: Record<string, TClickListener[]>;
|
|
1061
|
-
itemsState: Record<string, TItemState>;
|
|
1062
|
-
hooks: {
|
|
1063
|
-
useItemState: (id: string, initialState: TItemState) => TItemState;
|
|
1064
|
-
};
|
|
1065
|
-
setItemState: (id: string, newState: Partial<TItemState>) => void;
|
|
1066
|
-
Context: ({ children }: {
|
|
1067
|
-
children: ReactNode;
|
|
1068
|
-
}) => React$1.JSX.Element;
|
|
1069
|
-
}
|
|
1070
|
-
|
|
1071
1083
|
declare const ToolbarItem: (props: TTool) => React$1.JSX.Element;
|
|
1072
1084
|
|
|
1073
1085
|
declare const Toolbar: ((props: {
|
|
@@ -1081,6 +1093,250 @@ declare const Toolbar: ((props: {
|
|
|
1081
1093
|
displayName: string;
|
|
1082
1094
|
};
|
|
1083
1095
|
|
|
1096
|
+
declare const TabsList: ({ arrowsBehavior, }: {
|
|
1097
|
+
arrowsBehavior?: "open" | "focus" | undefined;
|
|
1098
|
+
}) => React__default.JSX.Element;
|
|
1099
|
+
|
|
1100
|
+
declare class TabsController<AdditionalPropsType extends Record<string, unknown> = Record<string, unknown>, TabType extends TTab<AdditionalPropsType> = TTab<AdditionalPropsType>> {
|
|
1101
|
+
#private;
|
|
1102
|
+
private props;
|
|
1103
|
+
propsStore: PropsStore<TTab<AdditionalPropsType>>;
|
|
1104
|
+
stateKey: string;
|
|
1105
|
+
get stateStore(): PropsStore<TTabsListState>;
|
|
1106
|
+
get activeTabs(): TId[];
|
|
1107
|
+
get tabsList(): TId[];
|
|
1108
|
+
constructor(name: string, props: TTabs<AdditionalPropsType>, initialTabs?: TabType[]);
|
|
1109
|
+
/**
|
|
1110
|
+
* Obviamente agrega un tab al listado de tabs
|
|
1111
|
+
*/
|
|
1112
|
+
append(tab: Omit<TabType, 'tabAdditionalProps'> & Partial<Pick<TabType, 'tabAdditionalProps'>>): void;
|
|
1113
|
+
closeAll(closeFixedTabsAsWell?: boolean, force?: boolean): Promise<void>;
|
|
1114
|
+
closeToRight(targetId: TId): Promise<void>;
|
|
1115
|
+
closeToLeft(targetId: TId): Promise<void>;
|
|
1116
|
+
closeOthers(targetId: TId): Promise<void>;
|
|
1117
|
+
closeTab(tabId: TId, force?: boolean): Promise<boolean>;
|
|
1118
|
+
focusNextTab(): TId | null;
|
|
1119
|
+
focusPreviousTab(): TId | null;
|
|
1120
|
+
focusTab(tabId: TId): void;
|
|
1121
|
+
getTabById(tabId: TId): TTab<AdditionalPropsType>;
|
|
1122
|
+
getTabElement(tabId: TId): Element | null;
|
|
1123
|
+
handleKeyDown(ev: React__default.KeyboardEvent): void;
|
|
1124
|
+
openNextTab(): TId | null;
|
|
1125
|
+
openPreviousTab(): TId | null;
|
|
1126
|
+
get state(): TTabsListState;
|
|
1127
|
+
/**
|
|
1128
|
+
* Se utiliza para hacer que el tab aparezca visible en el listado
|
|
1129
|
+
*
|
|
1130
|
+
* @param justThis Normalmente las tabs se abren de a una, pero si este parámetro se pasa en false, es posible abrir más de una a la vez.
|
|
1131
|
+
*/
|
|
1132
|
+
openTab(tabId: TId, justThis?: boolean): void;
|
|
1133
|
+
}
|
|
1134
|
+
|
|
1135
|
+
type TTab<AdditionalPropsType extends Record<string, unknown> = Record<string, unknown>> = {
|
|
1136
|
+
addEvent?: (ev: 'onFocusTab', cb: (ev: {
|
|
1137
|
+
stop: () => void;
|
|
1138
|
+
}) => unknown) => unknown;
|
|
1139
|
+
content: React__default.FunctionComponent<{
|
|
1140
|
+
tab: TTab<AdditionalPropsType>;
|
|
1141
|
+
}>;
|
|
1142
|
+
icon?: TIconName | TIconType;
|
|
1143
|
+
/**
|
|
1144
|
+
* El id es importante ya que se utiliza por temas de accesibilidad. Es
|
|
1145
|
+
* importante asegurarse de que sea único.
|
|
1146
|
+
*/
|
|
1147
|
+
id: TId;
|
|
1148
|
+
isClosable?: boolean;
|
|
1149
|
+
isDisabled?: boolean;
|
|
1150
|
+
/**
|
|
1151
|
+
* Los tabs que estén marcados como fixed aparecerán al inicio del listado.
|
|
1152
|
+
*/
|
|
1153
|
+
isFixed?: boolean;
|
|
1154
|
+
isFocused?: boolean;
|
|
1155
|
+
/**
|
|
1156
|
+
* Si se marca como iconTab, se oculta el label y solamente se muestra el
|
|
1157
|
+
* ícono.
|
|
1158
|
+
*/
|
|
1159
|
+
isIconTab?: boolean;
|
|
1160
|
+
isLoading?: boolean;
|
|
1161
|
+
isOpen?: boolean;
|
|
1162
|
+
/**
|
|
1163
|
+
* Cuando se cierra un tab que tiene un método onBeforeClose, el mismo será
|
|
1164
|
+
* llamado y deberá devolver un boolean o un string. Si devuelve true, se
|
|
1165
|
+
* cierra. Si devuelve false, se muestra un cartel de confirmación genérico y
|
|
1166
|
+
* si se devuelve un string, se muestra un cartel de confirmación con el
|
|
1167
|
+
* string devuelto. En caso de que el usuario confirme el cuadro de diálogo,
|
|
1168
|
+
* el tab será cerrado de todas formas. Es decir, no hay forma de evitar que
|
|
1169
|
+
* el tab sea cerrado si el usuario decide continuar con la acción. Para
|
|
1170
|
+
* evitar que un tab sea cerrado, debe pasarse isClosable=false
|
|
1171
|
+
*/
|
|
1172
|
+
onBeforeClose?: () => boolean | string | Promise<boolean | string>;
|
|
1173
|
+
/**
|
|
1174
|
+
* Este callback será llamado cada vez que el tab sea abierto
|
|
1175
|
+
*/
|
|
1176
|
+
onFocus?: (ev: TTab<AdditionalPropsType>) => unknown;
|
|
1177
|
+
/**
|
|
1178
|
+
* Es el texto que se va a mostrar en el tab
|
|
1179
|
+
*/
|
|
1180
|
+
label: string;
|
|
1181
|
+
labelRenderer?: TTabRenderer;
|
|
1182
|
+
/**
|
|
1183
|
+
* Se pueden pasar propiedades adicionales que serán recibidas en cada
|
|
1184
|
+
* evento, de forma de poder compartir piezas de información útiles en las
|
|
1185
|
+
* distintas partes de la aplicación.
|
|
1186
|
+
*/
|
|
1187
|
+
tabAdditionalProps: AdditionalPropsType;
|
|
1188
|
+
tabId: TId;
|
|
1189
|
+
title?: string;
|
|
1190
|
+
};
|
|
1191
|
+
type TTabs<AdditionalPropsType extends Record<string, unknown> = Record<string, unknown>> = {
|
|
1192
|
+
getHandler?: (handler: TabsController<AdditionalPropsType>) => unknown;
|
|
1193
|
+
/**
|
|
1194
|
+
* Este id se utiliza para asignar un prefijo a los ids de los distintos
|
|
1195
|
+
* grupos de tabs, de forma que aún habiendo dos tabs con mismo id en
|
|
1196
|
+
* distintos grupos, el id generado sea distinto.
|
|
1197
|
+
*/
|
|
1198
|
+
id: TId;
|
|
1199
|
+
/**
|
|
1200
|
+
* Permite abrir varias tabs al mismo tiempo
|
|
1201
|
+
*/
|
|
1202
|
+
isMultiple?: boolean;
|
|
1203
|
+
/**
|
|
1204
|
+
* Este evento es llamado cada vez que un tab fue cerrado. En caso de que el
|
|
1205
|
+
* callback onRequestClose haya sido provisto, el orden de llamado es:
|
|
1206
|
+
* onRequestClose === true ? onCloseTab : doNothing
|
|
1207
|
+
*/
|
|
1208
|
+
onCloseTab?: (tab: TTab<AdditionalPropsType>) => unknown;
|
|
1209
|
+
/**
|
|
1210
|
+
* Este evento es llamado cada vez que un tab es abierto por acción del
|
|
1211
|
+
* usuario, es decir, cuando se hace click en su label y éste es mostrado.
|
|
1212
|
+
*/
|
|
1213
|
+
onOpenTab?: (tab: TTab<AdditionalPropsType>) => unknown;
|
|
1214
|
+
/**
|
|
1215
|
+
* Este callback es llamado cada vez que se hace click en el botón cerrar. Se
|
|
1216
|
+
* utiliza para permitir o denegar el cierre del tab, por lo que debe
|
|
1217
|
+
* retornar un boolean o una promesa de booleano. Es útil por ejemplo para
|
|
1218
|
+
* abrir un cuadro de diálogo de confirmación antes de continuar.
|
|
1219
|
+
*/
|
|
1220
|
+
onRequestClose?: (tab: TTab<AdditionalPropsType>) => boolean | Promise<boolean>;
|
|
1221
|
+
orientation?: 'horizontal' | 'vertical';
|
|
1222
|
+
/**
|
|
1223
|
+
* Esta prop solo será tomada en cuenta al montar. Para agregar tabs luego,
|
|
1224
|
+
* es necesario hacer uso de getHandler.
|
|
1225
|
+
*/
|
|
1226
|
+
initialTabs?: TTab<AdditionalPropsType>[];
|
|
1227
|
+
};
|
|
1228
|
+
type TTabRenderer<AdditionalPropsType extends Record<string, unknown> = Record<string, unknown>> = (props: {
|
|
1229
|
+
tab: TTab<AdditionalPropsType>;
|
|
1230
|
+
}) => React__default.ReactElement;
|
|
1231
|
+
type TTabsListState = {
|
|
1232
|
+
focusedTab: TId | null;
|
|
1233
|
+
openTabs: TId[];
|
|
1234
|
+
tabs: TId[];
|
|
1235
|
+
timestamp: number;
|
|
1236
|
+
};
|
|
1237
|
+
|
|
1238
|
+
declare const DefaultTabsLabelRenderer: TTabRenderer;
|
|
1239
|
+
|
|
1240
|
+
declare const TabsContent: (props: Omit<BoxProps, 'children'>) => React__default.JSX.Element;
|
|
1241
|
+
|
|
1242
|
+
declare const Tabs: <AdditionalPropsType extends Record<string, unknown> = Record<string, unknown>>({ id, onCloseTab, onOpenTab, onRequestClose, className, orientation, getHandler, initialTabs, isMultiple, onKeyDown, ...props }: TTabs<AdditionalPropsType> & Omit<BoxProps, "id" | "role" | "as">, ref: React__default.ForwardedRef<HTMLDivElement>) => React__default.JSX.Element;
|
|
1243
|
+
|
|
1244
|
+
type TOpenModal = Pick<TModal, 'NavBar' | 'Portal' | 'children' | 'className' | 'hideCloseButton' | 'initialFocusGetter' | 'initialFocusConfiguration' | 'maxWidth' | 'noHeader' | 'onExited' | 'shouldCloseOnEsc' | 'shouldCloseOnOverlayClick' | 'size' | 'stretch' | 'title' | 'variant'> & {
|
|
1245
|
+
id?: string;
|
|
1246
|
+
};
|
|
1247
|
+
|
|
1248
|
+
declare class ApiaUtilModalHandler {
|
|
1249
|
+
private id;
|
|
1250
|
+
private modals;
|
|
1251
|
+
constructor(id: string, modals: ApiaUtilModals);
|
|
1252
|
+
close(): void;
|
|
1253
|
+
}
|
|
1254
|
+
declare class ApiaUtilModals extends EventEmitter<{
|
|
1255
|
+
close: string;
|
|
1256
|
+
closeAll: boolean;
|
|
1257
|
+
open: TOpenModal;
|
|
1258
|
+
}> {
|
|
1259
|
+
#private;
|
|
1260
|
+
constructor();
|
|
1261
|
+
open(props: TOpenModal): ApiaUtilModalHandler;
|
|
1262
|
+
Component: () => React$1.JSX.Element;
|
|
1263
|
+
}
|
|
1264
|
+
|
|
1265
|
+
declare class ApiaUtilNotifications {
|
|
1266
|
+
close: (id: TNotificationId | INotification) => void;
|
|
1267
|
+
closeAll: () => void;
|
|
1268
|
+
notify: (notification: TDispatchedNotification) => void;
|
|
1269
|
+
useSelector: (selector: TNotificationSelector<any>) => INotification<_apia_notifications.TNotificationType>[];
|
|
1270
|
+
Component: () => React$1.JSX.Element;
|
|
1271
|
+
}
|
|
1272
|
+
|
|
1273
|
+
declare global {
|
|
1274
|
+
interface Window {
|
|
1275
|
+
TAB_ID: string;
|
|
1276
|
+
}
|
|
1277
|
+
interface HTMLIFrameElement {
|
|
1278
|
+
tabId: TId;
|
|
1279
|
+
}
|
|
1280
|
+
}
|
|
1281
|
+
declare class ApiaUtilCurrentTab {
|
|
1282
|
+
/**
|
|
1283
|
+
* Este método se usa para establecer un callback que será llamado al momento
|
|
1284
|
+
* de cerrar la pestaña. Este callback podrá devolver false indicando que hay
|
|
1285
|
+
* cambios no guardados, en cuyo caso el sistema alertará al usuario acerca de
|
|
1286
|
+
* ello con un cartel de confirmación.
|
|
1287
|
+
*/
|
|
1288
|
+
canClose(cb: () => boolean): void;
|
|
1289
|
+
changeTitle(newTitle: string): void;
|
|
1290
|
+
/**
|
|
1291
|
+
* El parámetro force sirve para las situaciones en las que el tab podría
|
|
1292
|
+
* preguntar si se desean perder los cambios. En caso de que se pase en true,
|
|
1293
|
+
* no se preguntará nada y se cerrará la pestaña.
|
|
1294
|
+
*/
|
|
1295
|
+
close(force?: boolean): void;
|
|
1296
|
+
getId(): TId;
|
|
1297
|
+
getProps(): _apia_components.TTab<Record<string, unknown>>;
|
|
1298
|
+
udpate(props: Partial<Partial<TTab>>): void;
|
|
1299
|
+
}
|
|
1300
|
+
|
|
1301
|
+
declare class ApiaUtilTabsController {
|
|
1302
|
+
currentTab: ApiaUtilCurrentTab;
|
|
1303
|
+
closeTab(tabId: string, force?: boolean): void;
|
|
1304
|
+
getHandler(): _apia_components.TabsController<Record<string, unknown>, _apia_components.TTab<Record<string, unknown>>>;
|
|
1305
|
+
/**
|
|
1306
|
+
* openApiaTab y openTab son sinónimos.
|
|
1307
|
+
*/
|
|
1308
|
+
openTab(title: string, url: string): void;
|
|
1309
|
+
}
|
|
1310
|
+
|
|
1311
|
+
type TApiaUtilConfirm = Pick<IConfirm, 'additionalButtons' | 'additionalButtonsOnRight' | 'cancelButtonText' | 'children' | 'className' | 'confirmButtonText' | 'confirmButtonVariant' | 'contentRef' | 'hideCancelButton' | 'hideConfirmButton' | 'title' | 'variant'>;
|
|
1312
|
+
type TApiaUtilInnerConfirm = TApiaUtilConfirm & {
|
|
1313
|
+
id: string;
|
|
1314
|
+
} & Pick<IConfirm, 'onCancel' | 'onConfirm'>;
|
|
1315
|
+
type TAlert = {
|
|
1316
|
+
children: ReactNode;
|
|
1317
|
+
title: string;
|
|
1318
|
+
};
|
|
1319
|
+
type TApiaUtilInnerAlert = TAlert & {
|
|
1320
|
+
onClose: () => unknown;
|
|
1321
|
+
id: string;
|
|
1322
|
+
};
|
|
1323
|
+
declare class ApiaUtilDialogs extends EventEmitter<{
|
|
1324
|
+
alert: TApiaUtilInnerAlert;
|
|
1325
|
+
confirm: TApiaUtilInnerConfirm;
|
|
1326
|
+
}> {
|
|
1327
|
+
#private;
|
|
1328
|
+
alert(props: TAlert): Promise<void>;
|
|
1329
|
+
confirm(props: TApiaUtilConfirm): Promise<boolean>;
|
|
1330
|
+
Component: () => React$1.JSX.Element;
|
|
1331
|
+
}
|
|
1332
|
+
|
|
1333
|
+
declare class ApiaUtilParsers {
|
|
1334
|
+
addThousSeparator(nStr: string | number): string;
|
|
1335
|
+
apiaNumber(pValue: number): number | string;
|
|
1336
|
+
jsNumber(value: string): number | string;
|
|
1337
|
+
parseBool(val: string): boolean;
|
|
1338
|
+
}
|
|
1339
|
+
|
|
1084
1340
|
type TAttachToElement = (() => HTMLElement) | RefObject<HTMLElement>;
|
|
1085
1341
|
type TPreferredOrientationX = 'left' | 'right';
|
|
1086
1342
|
type TPreferredOrientationY = 'top' | 'bottom';
|
|
@@ -1108,12 +1364,12 @@ type TTooltip = {
|
|
|
1108
1364
|
* Indica si el tooltip se cierra al desplazar el puntero del mouse fuera del
|
|
1109
1365
|
* tooltip. Valor por defecto: true.
|
|
1110
1366
|
*/
|
|
1111
|
-
closeOnMouseLeaveTooltip?: boolean;
|
|
1367
|
+
closeOnMouseLeaveTooltip?: boolean | ((ev: MouseEvent) => boolean);
|
|
1112
1368
|
/**
|
|
1113
1369
|
* Indica si el tooltip se cierra al desplazar el puntero del mouse fuera del
|
|
1114
1370
|
* elemento al que el tooltip está anclado. Valor por defecto: true.
|
|
1115
1371
|
*/
|
|
1116
|
-
closeOnMouseLeaveAttachedElement?: boolean;
|
|
1372
|
+
closeOnMouseLeaveAttachedElement?: boolean | ((ev: MouseEvent) => boolean);
|
|
1117
1373
|
/**
|
|
1118
1374
|
* Indica si el tooltip se cierra al hacerle click. Valor por defecto: false.
|
|
1119
1375
|
*/
|
|
@@ -1122,12 +1378,16 @@ type TTooltip = {
|
|
|
1122
1378
|
* Indica si el tooltip se cierra al hacer click fuera de él. Valor por
|
|
1123
1379
|
* defecto: true.
|
|
1124
1380
|
*/
|
|
1125
|
-
closeOnClickOut?: boolean;
|
|
1381
|
+
closeOnClickOut?: boolean | ((ev: MouseEvent) => boolean);
|
|
1126
1382
|
/**
|
|
1127
1383
|
* Indica si el tooltip se cierra al hacer scroll en un elemento externo al
|
|
1128
1384
|
* tooltip. Valor por defecto: true.
|
|
1129
1385
|
*/
|
|
1130
1386
|
closeOnScrollOut?: boolean;
|
|
1387
|
+
/**
|
|
1388
|
+
* Por defecto está en true. Cierra los demás tooltips al abrirse
|
|
1389
|
+
*/
|
|
1390
|
+
closeOthers?: boolean;
|
|
1131
1391
|
/**
|
|
1132
1392
|
* Permite determinar sobre qué elemento se abre el tooltip
|
|
1133
1393
|
*/
|
|
@@ -1143,6 +1403,7 @@ type TTooltip = {
|
|
|
1143
1403
|
* parámetros preferredOrientationX y preferredOrientationY.
|
|
1144
1404
|
*/
|
|
1145
1405
|
attachToElementAnchorPoint?: TAttachToElementAnchorPoint;
|
|
1406
|
+
attachToMousePosition?: boolean;
|
|
1146
1407
|
/**
|
|
1147
1408
|
* Permite indicar que el tooltip se abrirá en un punto específico. En caso
|
|
1148
1409
|
* de no indicar anchorPoint ni attachToElement se abrirá en {0,0}
|
|
@@ -1189,18 +1450,79 @@ type TTooltip = {
|
|
|
1189
1450
|
variant?: string;
|
|
1190
1451
|
};
|
|
1191
1452
|
|
|
1192
|
-
|
|
1193
|
-
|
|
1194
|
-
|
|
1453
|
+
declare class ApiaUtilTooltip {
|
|
1454
|
+
props: TTooltip;
|
|
1455
|
+
id: string;
|
|
1456
|
+
constructor(props: TTooltip);
|
|
1457
|
+
close(): void;
|
|
1458
|
+
}
|
|
1459
|
+
|
|
1460
|
+
declare class AutomaticTooltip {
|
|
1461
|
+
#private;
|
|
1462
|
+
ref: (el: HTMLElement | null) => void;
|
|
1463
|
+
constructor(tooltip?: Partial<TTooltip> | null);
|
|
1464
|
+
update: (tooltip: Partial<TTooltip>) => void;
|
|
1465
|
+
}
|
|
1466
|
+
|
|
1467
|
+
declare class ApiaUtilTooltips extends EventEmitter<{
|
|
1468
|
+
changedList: ApiaUtilTooltip[];
|
|
1469
|
+
}> {
|
|
1470
|
+
#private;
|
|
1471
|
+
tooltips: ApiaUtilTooltip[];
|
|
1472
|
+
constructor();
|
|
1473
|
+
/**
|
|
1474
|
+
* Permite crear un tooltip que se abrirá automáticamente al estar parado
|
|
1475
|
+
* sobre un elemento durante 300ms
|
|
1476
|
+
*/
|
|
1477
|
+
useHover: (tooltip?: Partial<TTooltip>) => AutomaticTooltip;
|
|
1478
|
+
close: (id: string) => void;
|
|
1479
|
+
closeAll: () => void;
|
|
1480
|
+
open: (tooltip: TTooltip) => ApiaUtilTooltip;
|
|
1481
|
+
Component: () => React$1.JSX.Element;
|
|
1482
|
+
}
|
|
1483
|
+
|
|
1484
|
+
type TSubmenu = {
|
|
1485
|
+
label: string;
|
|
1486
|
+
items: TMenuItems;
|
|
1195
1487
|
};
|
|
1196
|
-
|
|
1197
|
-
|
|
1198
|
-
|
|
1199
|
-
|
|
1200
|
-
|
|
1201
|
-
toggle:
|
|
1202
|
-
}
|
|
1488
|
+
type TMenuItem = (MenuItemProps & {
|
|
1489
|
+
key: string;
|
|
1490
|
+
}) | 'separator' | TSubmenu;
|
|
1491
|
+
type TMenuItems = TMenuItem[];
|
|
1492
|
+
declare class ApiaUtilMenu extends EventEmitter<{
|
|
1493
|
+
toggle: boolean;
|
|
1494
|
+
}> {
|
|
1495
|
+
#private;
|
|
1496
|
+
open: ({ menuProps, items, }: {
|
|
1497
|
+
menuProps: ControlledMenuProps;
|
|
1498
|
+
items: TMenuItems;
|
|
1499
|
+
}) => void;
|
|
1500
|
+
Component: () => React$1.JSX.Element;
|
|
1501
|
+
}
|
|
1203
1502
|
|
|
1204
|
-
declare
|
|
1503
|
+
declare class ApiaUtilMouse extends EventEmitter<{
|
|
1504
|
+
updatePosition: {
|
|
1505
|
+
x: number;
|
|
1506
|
+
y: number;
|
|
1507
|
+
};
|
|
1508
|
+
}> {
|
|
1509
|
+
x: number;
|
|
1510
|
+
y: number;
|
|
1511
|
+
constructor();
|
|
1512
|
+
}
|
|
1513
|
+
|
|
1514
|
+
declare class ApiaUtil {
|
|
1515
|
+
#private;
|
|
1516
|
+
constructor();
|
|
1517
|
+
dialogs: ApiaUtilDialogs;
|
|
1518
|
+
menu: ApiaUtilMenu;
|
|
1519
|
+
modals: ApiaUtilModals;
|
|
1520
|
+
mouse: ApiaUtilMouse;
|
|
1521
|
+
notifications: ApiaUtilNotifications;
|
|
1522
|
+
parsers: ApiaUtilParsers;
|
|
1523
|
+
tabs: ApiaUtilTabsController;
|
|
1524
|
+
tooltips: ApiaUtilTooltips;
|
|
1525
|
+
Component: () => React$1.JSX.Element;
|
|
1526
|
+
}
|
|
1205
1527
|
|
|
1206
|
-
export { Accordion, AccordionContext, AccordionItem, AccordionItemButton, AccordionItemContent, AccordionItemContext, AlertModal, ApiaFilter, AutoEllipsis, BaseButton, CalendarModal, Captcha, Checkbox, CollapsiblePanel, Confirm, ConfirmModal, DateInput, DefaultAccordionItemButton, DefaultIconRenderer, DialogButtonBar, FieldErrorMessage, FieldLabel, IAccordionItemButton, IAccordionItemProps, IAccordionProps, IAlert, IApiaFilter, ICalendarModal, IConfirm, IDialogButtonBar, IDialogHeader, IField, IFieldErrorMessage, IIconInput, IOverlay, IRequiredMark, IResponsiveComponent, ISimpleButton, IconButton, IconInput, IconsList, LinearLoader, Listbox, ListboxItem, LoaderSpinner, Modal, NumberInput, Overlay, ProgressBar, RequiredMark, ScreenLock, SimpleButton, TAccordionHandler, TAccordionItemButton, TApiaButtonType, TApiaIconButton, TCheckbox, TDateProps, TFieldLabel, TIcon, TIconButton, TIconRenderer, TIconSize, TIconsList, TListbox, TModal, TModalSize, TNumberInput, TNumberInputChangeEvent, TOnClickNode, TOnConfirmSelection, TOnSelectionChange,
|
|
1528
|
+
export { Accordion, AccordionContext, AccordionItem, AccordionItemButton, AccordionItemContent, AccordionItemContext, AlertModal, ApiaFilter, ApiaUtil, ApiaUtilModalHandler, ApiaUtilTooltip, AutoEllipsis, BaseButton, CalendarModal, Captcha, Checkbox, CollapsiblePanel, Confirm, ConfirmModal, DateInput, DefaultAccordionItemButton, DefaultIconRenderer, DefaultTabsLabelRenderer, DialogButtonBar, FieldErrorMessage, FieldLabel, IAccordionItemButton, IAccordionItemProps, IAccordionProps, IAlert, IApiaFilter, ICalendarModal, IConfirm, IDialogButtonBar, IDialogHeader, IField, IFieldErrorMessage, IIconInput, IOverlay, IRequiredMark, IResponsiveComponent, ISimpleButton, IconButton, IconInput, IconsList, LinearLoader, Listbox, ListboxItem, LoaderSpinner, Modal, NumberInput, Overlay, ProgressBar, RequiredMark, ScreenLock, SimpleButton, TAccordionHandler, TAccordionItemButton, TApiaButtonType, TApiaIconButton, TCheckbox, TDateProps, TFieldLabel, TIcon, TIconButton, TIconRenderer, TIconSize, TIconsList, TListbox, TMenuItem, TModal, TModalSize, TNumberInput, TNumberInputChangeEvent, TOnClickNode, TOnConfirmSelection, TOnSelectionChange, TOpenModal, TSubmenu, TTab, TTabRenderer, TTool, TToolDefinition, TUseModalConfiguration, Tabs, TabsContent, TabsController, TabsList, Toolbar, ToolbarController, ToolbarItem, WaiTypeAhead, getFieldErrorStyles, getFieldTouchedStyles, importComponent, makeResponsiveComponent, parseNumberInputValueToNumber, parseNumberValueToNumberInput, useAccordionContext, useModal, useModalContext, useOtherTagButton };
|