@m4l/components 9.1.4 → 9.1.5
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/components/CommonActions/components/ActionsContainer/slots/ActionsContainerSlots.d.ts +1 -1
- package/components/ControlIncrement/slots/ControltrolIncrementSlots.d.ts +1 -1
- package/components/DragResizeWindow/DragResizeWindow.d.ts +9 -5
- package/components/DragResizeWindow/DragResizeWindow.js +6 -5
- package/components/DragResizeWindow/DragResizeWindow.styles.d.ts +4 -0
- package/components/DragResizeWindow/DragResizeWindow.styles.js +20 -3
- package/components/DragResizeWindow/classes/index.js +2 -2
- package/components/DragResizeWindow/constants.d.ts +1 -1
- package/components/DragResizeWindow/constants.js +2 -2
- package/components/DragResizeWindow/helpers/index.d.ts +14 -1
- package/components/DragResizeWindow/helpers/index.js +0 -2
- package/components/DragResizeWindow/hooks/useDimensionEffects.d.ts +4 -0
- package/components/DragResizeWindow/hooks/useDimensionEffects.js +128 -50
- package/components/DragResizeWindow/hooks/useDragOptions.d.ts +3 -3
- package/components/DragResizeWindow/hooks/useResizeOptions.d.ts +20 -1
- package/components/DragResizeWindow/hooks/useResizeOptions.js +1 -1
- package/components/DragResizeWindow/slots/DragResizeWindowSlots.js +3 -3
- package/components/DragResizeWindow/tests/DragResizeWindow.test.d.ts +1 -0
- package/components/DragResizeWindow/types.d.ts +84 -12
- package/components/DragResizeWindow/utils.d.ts +12 -1
- package/components/DynamicFilter/slots/dynamicFilterSlots.d.ts +1 -1
- package/components/DynamicSort/slots/DynamicSortSlots.d.ts +1 -1
- package/components/Label/slots/LabelSlots.d.ts +1 -1
- package/components/extended/React-Resizable/Resizable/Resizable.d.ts +4 -0
- package/components/extended/React-Resizable/Resizable/Resizable.js +13 -1
- package/components/extended/React-Resizable/Resizable/constants.d.ts +1 -0
- package/components/extended/React-Resizable/Resizable/constants.js +3 -1
- package/components/extended/React-Resizable/ResizableBox/ResizableBox.d.ts +6 -2
- package/components/extended/React-Resizable/ResizableBox/ResizableBox.js +14 -2
- package/components/extended/React-Resizable/ResizableBox/ResizeableBox.styles.d.ts +1 -1
- package/components/extended/React-Resizable/ResizableBox/ResizeableBox.styles.js +7 -3
- package/components/extended/React-Resizable/ResizableBox/tests/ResizableBox.integration.test.d.ts +1 -0
- package/components/extended/React-Resizable/ResizableBox/tests/ResizableBox.test.d.ts +1 -0
- package/components/extended/React-Resizable/ResizableBox/types.d.ts +35 -4
- package/components/extended/React-Resizable/helpers.d.ts +151 -34
- package/components/extended/React-Resizable/helpers.js +106 -85
- package/components/extended/React-Resizable/hooks/useResizable.d.ts +16 -0
- package/components/extended/React-Resizable/hooks/useResizable.js +24 -0
- package/components/hook-form/RHFTextField/slots/RHFTextFieldSlots.d.ts +1 -1
- package/components/modal/ModalDialog/index.d.ts +4 -0
- package/components/modal/ModalDialog/index.js +2 -2
- package/components/mui_extended/Badge/slots/BadgeSlots.d.ts +1 -1
- package/components/mui_extended/IconButton/slots/IconButtonSlots.d.ts +2 -2
- package/components/mui_extended/MenuItem/slots/MenuItemSlots.d.ts +1 -1
- package/components/mui_extended/Select/slots/SelectSlots.d.ts +1 -1
- package/components/mui_extended/Skeleton/Slots/skeletonSlots.d.ts +1 -1
- package/components/mui_extended/Tab/Slots/TabSlots.d.ts +1 -1
- package/components/mui_extended/TextField/slots/TextFieldSlots.d.ts +2 -2
- package/components/mui_extended/Typography/slots/typographySlots.d.ts +1 -1
- package/components/popups/components/PopupsProvider/contexts/PopupsContext/types.d.ts +63 -2
- package/components/popups/components/PopupsViewer/slots/popupsViewerSlots.d.ts +1 -1
- package/contexts/ModalContext/index.d.ts +4 -0
- package/contexts/ModalContext/types.d.ts +1 -1
- package/package.json +1 -1
- package/storybook/components/DragResizeWindow/stories/DragResizeWindow.stories.d.ts +7 -0
- package/storybook/components/DragResizeWindow/stories/subcomponents/ContentExample.d.ts +8 -0
- package/{components → storybook/components}/DragResizeWindow/stories/subcomponents/WithExtendedContainer.d.ts +4 -0
- package/{components → storybook/components}/DragResizeWindow/stories/types.d.ts +1 -1
- package/storybook/components/extended/react-resizable/ResizableBox/resizableBox.stories.d.ts +13 -0
- package/components/DragResizeWindow/stories/basic.stories.d.ts +0 -13
- package/components/DragResizeWindow/stories/dictionary.d.ts +0 -0
- package/components/DragResizeWindow/stories/subcomponents/ContentExample.d.ts +0 -4
- package/components/extended/React-Resizable/Resizable/stories/basic.stories.d.ts +0 -9
- package/components/extended/React-Resizable/ResizableBox/stories/basic.stories.d.ts +0 -9
- /package/{components → storybook/components}/DragResizeWindow/stories/constants.d.ts +0 -0
|
@@ -4,13 +4,28 @@ import { ContainerSize } from '../../utils/types';
|
|
|
4
4
|
import { Theme } from '@mui/material/styles';
|
|
5
5
|
import { OverridesStyleRules } from '@mui/material/styles/overrides';
|
|
6
6
|
import { DragResizeWindowSlots } from './slots/slots';
|
|
7
|
-
import {
|
|
7
|
+
import { COMPONENT_KEY_COMPONENT } from './constants';
|
|
8
8
|
import { ResizeCallbackData, ResizeHandle } from '../extended/React-Resizable';
|
|
9
|
+
/**
|
|
10
|
+
* Tipo que define la corrección de la posición
|
|
11
|
+
* - nCorrection: Cantidad de corrección
|
|
12
|
+
* - x: Coordenada x
|
|
13
|
+
* - y: Coordenada y
|
|
14
|
+
* @createdAt 2024-11-08 12:13:10 - automatic
|
|
15
|
+
*/
|
|
9
16
|
export type CorrectionPosition = {
|
|
10
17
|
nCorrection: number;
|
|
11
18
|
x: number;
|
|
12
19
|
y: number;
|
|
13
20
|
};
|
|
21
|
+
/**
|
|
22
|
+
* Tipo que representa la posición de la ventana (o cualquier otro elemento arrastrable/redimensionable).
|
|
23
|
+
* - left: Coordenada x
|
|
24
|
+
* - top: Coordenada y
|
|
25
|
+
* - width: Ancho
|
|
26
|
+
* - height: Alto
|
|
27
|
+
* @createdAt 2024-11-08 12:13:10 - automatic
|
|
28
|
+
*/
|
|
14
29
|
export type Position = {
|
|
15
30
|
left: number;
|
|
16
31
|
top: number;
|
|
@@ -20,6 +35,7 @@ export type Position = {
|
|
|
20
35
|
export interface CurrentState extends Position {
|
|
21
36
|
/**
|
|
22
37
|
* "dragging" indica la posición actual cuando se está moviendo el ventana
|
|
38
|
+
* @createdAt 2024-11-07 08:06:15 - automatic
|
|
23
39
|
*/
|
|
24
40
|
dragging?: {
|
|
25
41
|
top: number;
|
|
@@ -27,6 +43,7 @@ export interface CurrentState extends Position {
|
|
|
27
43
|
};
|
|
28
44
|
/**
|
|
29
45
|
* "resizing" indica el tamaño actual cuando se está redimensionando el ventana
|
|
46
|
+
* @createdAt 2024-11-07 08:06:15 - automatic
|
|
30
47
|
*/
|
|
31
48
|
resizing?: {
|
|
32
49
|
width: number;
|
|
@@ -34,43 +51,84 @@ export interface CurrentState extends Position {
|
|
|
34
51
|
handle: ResizeHandle;
|
|
35
52
|
};
|
|
36
53
|
/**
|
|
37
|
-
*
|
|
54
|
+
* Posición inicial antes de comenzar el dragging o resizing
|
|
55
|
+
* @createdAt 2024-11-07 08:06:15 - automatic
|
|
38
56
|
*/
|
|
39
|
-
|
|
57
|
+
initialPosition?: Position;
|
|
40
58
|
/**
|
|
41
59
|
* "shrinkLeftAt" Indica en que valor estaba el left antes de compactar padre en un resize
|
|
60
|
+
* @createdAt 2024-11-07 08:06:15 - automatic
|
|
42
61
|
*/
|
|
43
62
|
shrinkLeftAt?: number;
|
|
44
63
|
/**
|
|
45
64
|
* "shrinkTopAt" Indica en que valor estaba el top antes de compactar padre en un resize
|
|
65
|
+
* @createdAt 2024-11-07 08:06:15 - automatic
|
|
46
66
|
*/
|
|
47
67
|
shrinkTopAt?: number;
|
|
48
68
|
/**
|
|
49
69
|
* "overflowWidthAt" Indica en que valor estaba el width antes de compactar padre en un resize
|
|
70
|
+
* @createdAt 2024-11-07 08:06:15 - automatic
|
|
50
71
|
*/
|
|
51
72
|
overflowWidthAt?: number;
|
|
52
73
|
/**
|
|
53
|
-
* "
|
|
74
|
+
* "overflowHeightAt" Indica en que valor estaba el Height antes de compactar padre en un resize
|
|
75
|
+
* @createdAt 2024-11-07 08:06:15 - automatic
|
|
54
76
|
*/
|
|
55
77
|
overflowHeightAt?: number;
|
|
56
78
|
}
|
|
79
|
+
/**
|
|
80
|
+
* Representa una posición parcial, solo incluye las propiedades left y top.
|
|
81
|
+
* - left: Coordenada x
|
|
82
|
+
* - top: Coordenada y
|
|
83
|
+
* @createdAt 2024-11-08 12:13:10 - automatic
|
|
84
|
+
*/
|
|
57
85
|
export type PartialPosition = {
|
|
58
86
|
left: number;
|
|
59
87
|
top: number;
|
|
60
88
|
};
|
|
89
|
+
/**
|
|
90
|
+
* Tipo que define los límites de movimiento de la ventana arrastrable.
|
|
91
|
+
* @createdAt 2024-11-08 12:13:10 - automatic
|
|
92
|
+
*/
|
|
61
93
|
export type DraggableWindowBounds = {
|
|
62
94
|
left?: number;
|
|
63
95
|
right?: number;
|
|
64
96
|
top?: number;
|
|
65
97
|
bottom?: number;
|
|
66
98
|
};
|
|
99
|
+
/**
|
|
100
|
+
* Tipo de callback para el evento de redimensionamiento.
|
|
101
|
+
* @author cesar - automatic
|
|
102
|
+
* @createdAt 2024-11-08 12:13:10 - automatic
|
|
103
|
+
* @updatedAt 2024-11-13 10:42:04 - automatic
|
|
104
|
+
* @updatedUser cesar - automatic
|
|
105
|
+
*/
|
|
67
106
|
export type ResizeCallback = ((e: React.SyntheticEvent, data: ResizeCallbackData) => any) | undefined;
|
|
107
|
+
/**
|
|
108
|
+
* Tipo para el componente o la función que define el handle para redimensionar la ventana.
|
|
109
|
+
* @author cesar - automatic
|
|
110
|
+
* @createdAt 2024-11-08 12:13:10 - automatic
|
|
111
|
+
* @updatedAt 2024-11-13 10:42:04 - automatic
|
|
112
|
+
* @updatedUser cesar - automatic
|
|
113
|
+
*/
|
|
68
114
|
export type ResizeHandleComponente = React.ReactNode | ((resizeHandle: ResizeHandle, ref: React.RefObject<any>) => React.ReactNode) | undefined;
|
|
115
|
+
/**
|
|
116
|
+
* Parámetros relacionados con el tamaño del contenedor, usado en la posición y redimensionamiento.
|
|
117
|
+
*/
|
|
69
118
|
export type PositionParams = ContainerSize;
|
|
119
|
+
/**
|
|
120
|
+
* Acción que se realiza en el contenedor (igual, encogiéndose o expandiéndose).
|
|
121
|
+
*/
|
|
70
122
|
export type ContainerAction = 'equals' | 'shrinking' | 'expanding';
|
|
123
|
+
/**
|
|
124
|
+
* Referencia para el componente DragResizeWindow.
|
|
125
|
+
*/
|
|
71
126
|
export type DraggableWindowRefProps = {
|
|
72
127
|
current: HTMLDivElement | null;
|
|
73
128
|
};
|
|
129
|
+
/**
|
|
130
|
+
* Tipo que representa las posiciones predeterminadas (vertical y horizontal) de la ventana.
|
|
131
|
+
*/
|
|
74
132
|
export interface DefaultPosition {
|
|
75
133
|
vertical: {
|
|
76
134
|
top: number;
|
|
@@ -93,7 +151,10 @@ export interface DefaultPosition {
|
|
|
93
151
|
width: number;
|
|
94
152
|
};
|
|
95
153
|
}
|
|
96
|
-
|
|
154
|
+
/**
|
|
155
|
+
* Propiedades del componente DragResizeWindow, que incluye tanto los controles de arrastre como de redimensionamiento.
|
|
156
|
+
*/
|
|
157
|
+
export interface DragResizeWindowProps extends Partial<Omit<DraggableCoreProps, 'onStart' | 'onDrag' | 'onStop' | 'disabled' | 'handle' | 'cancel'>> {
|
|
97
158
|
children: ReactNode;
|
|
98
159
|
/**
|
|
99
160
|
* "className" permite identificar si es placeHolder y estilar
|
|
@@ -117,7 +178,7 @@ export interface DraggableWindowProps extends Partial<Omit<DraggableCoreProps, '
|
|
|
117
178
|
minWindowHeight?: number;
|
|
118
179
|
/**
|
|
119
180
|
* defaultPosition permite definir la posición inicial de la ventana
|
|
120
|
-
* TODO: Debe
|
|
181
|
+
* TODO: Debe también recibir anchorEl y anchorPosition y calcular la posición en base a este
|
|
121
182
|
*/
|
|
122
183
|
defaultPosition?: DefaultPosition;
|
|
123
184
|
/**
|
|
@@ -126,7 +187,7 @@ export interface DraggableWindowProps extends Partial<Omit<DraggableCoreProps, '
|
|
|
126
187
|
bounds?: DraggableWindowBounds;
|
|
127
188
|
/**
|
|
128
189
|
*
|
|
129
|
-
* we should set scale coefficient to avoid render
|
|
190
|
+
* we should set scale coefficient to avoid render artifacts while dragging.
|
|
130
191
|
*/
|
|
131
192
|
transformScale?: number | undefined;
|
|
132
193
|
/**
|
|
@@ -138,7 +199,7 @@ export interface DraggableWindowProps extends Partial<Omit<DraggableCoreProps, '
|
|
|
138
199
|
*/
|
|
139
200
|
containerSize?: ContainerSize | undefined;
|
|
140
201
|
/**
|
|
141
|
-
* "draggable" permite definir si la ventana es "
|
|
202
|
+
* "draggable" permite definir si la ventana es "draggable" o no. Por defecto es "true
|
|
142
203
|
*/
|
|
143
204
|
draggable?: boolean;
|
|
144
205
|
/**
|
|
@@ -166,7 +227,7 @@ export interface DraggableWindowProps extends Partial<Omit<DraggableCoreProps, '
|
|
|
166
227
|
/**
|
|
167
228
|
* "resizable" permite definir si la ventana es "resizable" o no. Por defecto es "true
|
|
168
229
|
*/
|
|
169
|
-
|
|
230
|
+
resizable?: boolean;
|
|
170
231
|
/**
|
|
171
232
|
* "resizeHandles" permite definir de donde se va a poder redimensionar la ventana
|
|
172
233
|
*/
|
|
@@ -192,15 +253,23 @@ export interface DraggableWindowProps extends Partial<Omit<DraggableCoreProps, '
|
|
|
192
253
|
*/
|
|
193
254
|
hidden?: boolean;
|
|
194
255
|
}
|
|
195
|
-
|
|
256
|
+
/**
|
|
257
|
+
* Referencia del estado del componente DragResizeWindow.
|
|
258
|
+
*/
|
|
259
|
+
export interface StateRef extends Pick<DragResizeWindowProps, 'bounds'>, CurrentState {
|
|
196
260
|
data?: DraggableData;
|
|
197
261
|
/**
|
|
198
262
|
* containerSize: Tamaño del contenedor padre la ultima vez que se actualizó
|
|
199
263
|
*/
|
|
200
264
|
containerSize?: ContainerSize | undefined;
|
|
201
265
|
}
|
|
266
|
+
/**
|
|
267
|
+
* Tipos para los slots del componente DragResizeWindow.
|
|
268
|
+
*/
|
|
202
269
|
export type DragResizeWindowSlotsType = keyof typeof DragResizeWindowSlots;
|
|
203
|
-
|
|
270
|
+
/**
|
|
271
|
+
* Propiedades del estado propietario del componente DragResizeWindow.
|
|
272
|
+
*/
|
|
204
273
|
export type DragResizeWindowOwnerState = {
|
|
205
274
|
/**
|
|
206
275
|
* "isMobile" cuando el navegador está corriendo en dispositivo móvil
|
|
@@ -211,4 +280,7 @@ export type DragResizeWindowOwnerState = {
|
|
|
211
280
|
*/
|
|
212
281
|
hidden?: boolean;
|
|
213
282
|
};
|
|
214
|
-
|
|
283
|
+
/**
|
|
284
|
+
* Tipo de reglas de estilo para el componente DragResizeWindow.
|
|
285
|
+
*/
|
|
286
|
+
export type DragResizeWindowStyles = Partial<OverridesStyleRules<DragResizeWindowSlotsType, typeof COMPONENT_KEY_COMPONENT, Theme> | undefined> | undefined;
|
|
@@ -1,5 +1,16 @@
|
|
|
1
1
|
import { Position } from './types';
|
|
2
2
|
/**
|
|
3
|
-
*
|
|
3
|
+
* Generates a style object with transform properties to position an element.
|
|
4
|
+
*
|
|
5
|
+
* This function returns a style object that positions an element absolutely at the
|
|
6
|
+
* specified `top` and `left` coordinates, and sets its `width` and `height`.
|
|
7
|
+
* It uses the `translate` transform to apply the positioning for smooth rendering
|
|
8
|
+
* across browsers.
|
|
9
|
+
* @param {Position} position - An object containing `top`, `left`, `width`, and `height` properties.
|
|
10
|
+
* @returns {Record<string, any>} A style object with applied transform, dimension, and positioning properties.
|
|
11
|
+
* @author cesar - automatic
|
|
12
|
+
* @createdAt 2024-11-08 12:13:10 - automatic
|
|
13
|
+
* @updatedAt 2024-11-13 10:42:04 - automatic
|
|
14
|
+
* @updatedUser cesar - automatic
|
|
4
15
|
*/
|
|
5
16
|
export declare function setTransform({ top, left, width, height }: Position): Record<string, any>;
|
|
@@ -57,7 +57,7 @@ export declare const PopoverMenuStyled: import('@emotion/styled').StyledComponen
|
|
|
57
57
|
}, {}, {}>;
|
|
58
58
|
export declare const PopoverMenuItemStyled: import('@emotion/styled').StyledComponent<Pick<import('@mui/material').MenuItemOwnProps & Omit<import('@mui/material').ButtonBaseOwnProps, "classes"> & import('@mui/material/OverridableComponent').CommonProps & Omit<Omit<import('react').DetailedHTMLProps<import('react').LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & {
|
|
59
59
|
ref?: ((instance: HTMLLIElement | null) => void | import('react').DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import('react').DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import('react').RefObject<HTMLLIElement> | null | undefined;
|
|
60
|
-
}, "children" | "action" | "divider" | "style" | "dense" | "disabled" | "sx" | "classes" | "autoFocus" | "className" | "tabIndex" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "selected" | "disableGutters">, "children" | "value" | "ref" | "title" | "id" | "action" | "divider" | "hidden" | "color" | "content" | "style" | "dense" | "disabled" | "translate" | "sx" | "classes" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoFocus" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "lang" | "nonce" | "slot" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "
|
|
60
|
+
}, "children" | "action" | "divider" | "style" | "dense" | "disabled" | "sx" | "classes" | "autoFocus" | "className" | "tabIndex" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "selected" | "disableGutters">, "children" | "value" | "ref" | "title" | "id" | "action" | "divider" | "hidden" | "color" | "content" | "style" | "dense" | "disabled" | "translate" | "sx" | "classes" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoCapitalize" | "autoFocus" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "enterKeyHint" | "lang" | "nonce" | "slot" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "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-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "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" | "onResize" | "onResizeCapture" | "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" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "key" | "selected" | "disableGutters"> & import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Partial<import('../types').DynamicFilterOwnerState> & Record<string, unknown> & {
|
|
61
61
|
ownerState: Partial<import('../types').DynamicFilterOwnerState> & Record<string, unknown>;
|
|
62
62
|
}, {}, {}>;
|
|
63
63
|
export declare const PopoverMenuItemIconStyled: import('@emotion/styled').StyledComponent<Pick<import('../../Icon').IconProps, keyof import('../../Icon').IconProps> & import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Partial<import('../types').DynamicFilterOwnerState> & Record<string, unknown> & {
|
|
@@ -54,7 +54,7 @@ export declare const PopoverMenuStyled: import('@emotion/styled').StyledComponen
|
|
|
54
54
|
}, {}, {}>;
|
|
55
55
|
export declare const PopoverMenuItemStyled: import('@emotion/styled').StyledComponent<Pick<import('@mui/material').MenuItemOwnProps & Omit<import('@mui/material').ButtonBaseOwnProps, "classes"> & import('@mui/material/OverridableComponent').CommonProps & Omit<Omit<import('react').DetailedHTMLProps<import('react').LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & {
|
|
56
56
|
ref?: ((instance: HTMLLIElement | null) => void | import('react').DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import('react').DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import('react').RefObject<HTMLLIElement> | null | undefined;
|
|
57
|
-
}, "children" | "action" | "divider" | "style" | "dense" | "disabled" | "sx" | "classes" | "autoFocus" | "className" | "tabIndex" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "selected" | "disableGutters">, "children" | "value" | "ref" | "title" | "id" | "action" | "divider" | "hidden" | "color" | "content" | "style" | "dense" | "disabled" | "translate" | "sx" | "classes" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoFocus" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "lang" | "nonce" | "slot" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "
|
|
57
|
+
}, "children" | "action" | "divider" | "style" | "dense" | "disabled" | "sx" | "classes" | "autoFocus" | "className" | "tabIndex" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "selected" | "disableGutters">, "children" | "value" | "ref" | "title" | "id" | "action" | "divider" | "hidden" | "color" | "content" | "style" | "dense" | "disabled" | "translate" | "sx" | "classes" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoCapitalize" | "autoFocus" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "enterKeyHint" | "lang" | "nonce" | "slot" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "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-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "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" | "onResize" | "onResizeCapture" | "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" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "key" | "selected" | "disableGutters"> & import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Partial<import('../types').DynamicSortOwnerState> & Record<string, unknown> & {
|
|
58
58
|
ownerState: Partial<import('../types').DynamicSortOwnerState> & Record<string, unknown>;
|
|
59
59
|
}, {}, {}>;
|
|
60
60
|
export declare const PopoverMenuItemIconStyled: import('@emotion/styled').StyledComponent<Pick<import('../../Icon').IconProps, keyof import('../../Icon').IconProps> & import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Partial<import('../types').DynamicSortOwnerState> & Record<string, unknown> & {
|
|
@@ -12,6 +12,6 @@ export declare const IconHelperMessageStyled: import('@emotion/styled').StyledCo
|
|
|
12
12
|
}, {}, {}>;
|
|
13
13
|
export declare const SkeletonStyled: import('@emotion/styled').StyledComponent<Pick<import('@mui/material').SkeletonOwnProps & import('@mui/material/OverridableComponent').CommonProps & Omit<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
|
|
14
14
|
ref?: ((instance: HTMLSpanElement | null) => void | import('react').DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import('react').DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import('react').RefObject<HTMLSpanElement> | null | undefined;
|
|
15
|
-
}, "children" | "style" | "variant" | "width" | "height" | "animation" | "sx" | "classes" | "className">, "children" | "ref" | "title" | "id" | "hidden" | "color" | "content" | "style" | "variant" | "width" | "height" | "translate" | "animation" | "sx" | "classes" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoFocus" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "lang" | "nonce" | "slot" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "
|
|
15
|
+
}, "children" | "style" | "variant" | "width" | "height" | "animation" | "sx" | "classes" | "className">, "children" | "ref" | "title" | "id" | "hidden" | "color" | "content" | "style" | "variant" | "width" | "height" | "translate" | "animation" | "sx" | "classes" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoCapitalize" | "autoFocus" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "enterKeyHint" | "lang" | "nonce" | "slot" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "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-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "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" | "onResize" | "onResizeCapture" | "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" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "key"> & import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Partial<import('../types').LabelOwnerState> & Record<string, unknown> & {
|
|
16
16
|
ownerState: Partial<import('../types').LabelOwnerState> & Record<string, unknown>;
|
|
17
17
|
}, {}, {}>;
|
|
@@ -6,5 +6,9 @@ import { ResizableProps } from 'react-resizable';
|
|
|
6
6
|
* Resizable es un componente controlado, por lo que se debe pasar el width y height y darle manejo
|
|
7
7
|
* a los handlers de onResizeStart, onResize y onResizeStop. Estos handlers son implementados en el componente
|
|
8
8
|
* DragResizeWindow
|
|
9
|
+
* @author cesar - automatic
|
|
10
|
+
* @createdAt 2024-11-05 13:00:52 - automatic
|
|
11
|
+
* @updatedAt 2024-11-06 10:50:22 - automatic
|
|
12
|
+
* @updatedUser cesar - automatic
|
|
9
13
|
*/
|
|
10
14
|
export declare const Resizable: (props: ResizableProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,7 +1,19 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
2
|
import { R as RootStyled } from "./slots/ResizableSlots.js";
|
|
3
|
+
import { u as useResizable } from "../hooks/useResizable.js";
|
|
4
|
+
import { R as RESIZING_CLASS_NAME } from "./constants.js";
|
|
3
5
|
const Resizable = (props) => {
|
|
4
|
-
|
|
6
|
+
const { onResizeStart, onResizeStop, ...other } = props;
|
|
7
|
+
const { isResizing, localHandleResizeStart, localHandleResizeStop } = useResizable(onResizeStart, onResizeStop);
|
|
8
|
+
return /* @__PURE__ */ jsx(
|
|
9
|
+
RootStyled,
|
|
10
|
+
{
|
|
11
|
+
...other,
|
|
12
|
+
onResizeStart: localHandleResizeStart,
|
|
13
|
+
onResizeStop: localHandleResizeStop,
|
|
14
|
+
className: isResizing ? RESIZING_CLASS_NAME : ""
|
|
15
|
+
}
|
|
16
|
+
);
|
|
5
17
|
};
|
|
6
18
|
export {
|
|
7
19
|
Resizable as R
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { ResizableProps } from './types';
|
|
2
2
|
/**
|
|
3
3
|
* Redefinicon de react-resizable/ResizableBox incluyendo los estilos en el slot.
|
|
4
4
|
*
|
|
@@ -8,5 +8,9 @@ import { ResizeableProps } from './types';
|
|
|
8
8
|
* del componente lanzan el onResize cuando cambia el tamaño, para que se re-inserten como props.
|
|
9
9
|
*
|
|
10
10
|
* Este componente no tiene implementado la correción del resize a la izquierda o hacia arriba. Usar DragResizeWindow.
|
|
11
|
+
* @author cesar - automatic
|
|
12
|
+
* @createdAt 2024-11-01 12:04:19 - automatic
|
|
13
|
+
* @updatedAt 2024-11-12 13:32:58 - automatic
|
|
14
|
+
* @updatedUser cesar - automatic
|
|
11
15
|
*/
|
|
12
|
-
export declare function ResizableBox(props:
|
|
16
|
+
export declare function ResizableBox(props: ResizableProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,24 +1,36 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
2
|
import { R as RootStyled } from "./slots/ResizableBoxSlots.js";
|
|
3
|
+
import { u as useResizable } from "../hooks/useResizable.js";
|
|
4
|
+
import { R as RESIZING_CLASS_NAME } from "../Resizable/constants.js";
|
|
3
5
|
function ResizableBox(props) {
|
|
4
6
|
const {
|
|
5
7
|
children,
|
|
6
8
|
width = 600,
|
|
7
9
|
height = 400,
|
|
8
|
-
|
|
10
|
+
maxHeight,
|
|
9
11
|
onResize,
|
|
12
|
+
onResizeStart,
|
|
13
|
+
onResizeStop,
|
|
10
14
|
maxWidth,
|
|
11
15
|
resizeHandles = ["se", "nw"],
|
|
16
|
+
disabled = false,
|
|
12
17
|
...other
|
|
13
18
|
} = props;
|
|
19
|
+
const { isResizing, localHandleResizeStart, localHandleResizeStop } = useResizable(onResizeStart, onResizeStop);
|
|
14
20
|
return /* @__PURE__ */ jsx(
|
|
15
21
|
RootStyled,
|
|
16
22
|
{
|
|
23
|
+
role: "region",
|
|
24
|
+
"aria-label": "Resizable Box",
|
|
17
25
|
width,
|
|
18
26
|
height,
|
|
19
27
|
onResize,
|
|
20
|
-
maxConstraints:
|
|
28
|
+
maxConstraints: maxHeight && maxWidth ? [maxWidth, maxHeight] : void 0,
|
|
21
29
|
resizeHandles,
|
|
30
|
+
ownerState: { disabled },
|
|
31
|
+
onResizeStart: localHandleResizeStart,
|
|
32
|
+
onResizeStop: localHandleResizeStop,
|
|
33
|
+
className: isResizing ? RESIZING_CLASS_NAME : "",
|
|
22
34
|
...other,
|
|
23
35
|
children
|
|
24
36
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { ResizableBoxStyles } from '
|
|
1
|
+
import { ResizableBoxStyles } from '../ResizableBox/types';
|
|
2
2
|
export declare const resizableBoxStyles: ResizableBoxStyles;
|
|
@@ -1,10 +1,14 @@
|
|
|
1
1
|
import { g as getReactResizableStyles } from "../helpers.js";
|
|
2
2
|
const resizableBoxStyles = {
|
|
3
3
|
/**
|
|
4
|
-
*
|
|
4
|
+
* Styles for the ResizableBox component.
|
|
5
|
+
* @author cesar - automatic
|
|
6
|
+
* @createdAt 2024-11-01 12:04:19 - automatic
|
|
7
|
+
* @updatedAt 2024-11-01 12:04:20 - automatic
|
|
8
|
+
* @updatedUser cesar - automatic
|
|
5
9
|
*/
|
|
6
|
-
root: ({ theme }) => ({
|
|
7
|
-
...getReactResizableStyles(theme),
|
|
10
|
+
root: ({ theme, ownerState }) => ({
|
|
11
|
+
...getReactResizableStyles(theme, ownerState || {}),
|
|
8
12
|
position: "absolute"
|
|
9
13
|
})
|
|
10
14
|
};
|
package/components/extended/React-Resizable/ResizableBox/tests/ResizableBox.integration.test.d.ts
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -3,13 +3,44 @@ import { ResizableBoxSlots } from './slots/slots';
|
|
|
3
3
|
import { OverridesStyleRules } from '@mui/material/styles/overrides';
|
|
4
4
|
import { Theme } from '@mui/material/styles';
|
|
5
5
|
import { COMPONET_KEY_COMPONENT } from './constants';
|
|
6
|
-
|
|
6
|
+
/**
|
|
7
|
+
* Internal props for the ResizableBox component.
|
|
8
|
+
* [maxWidth] - Maximum width allowed for the component.
|
|
9
|
+
* [maxHeight] - Maximum height allowed for the component.
|
|
10
|
+
* [onResize] - Callback function called
|
|
11
|
+
* when the component is resized, providing the event and resize data.
|
|
12
|
+
* @author cesar - automatic
|
|
13
|
+
* @createdAt 2024-11-01 16:20:26 - automatic
|
|
14
|
+
* @updatedAt 2024-11-05 10:30:25 - automatic
|
|
15
|
+
* @updatedUser cesar - automatic
|
|
16
|
+
*/
|
|
17
|
+
type InternalResizableProps = {
|
|
7
18
|
maxWidth?: number;
|
|
8
|
-
|
|
19
|
+
maxHeight?: number;
|
|
9
20
|
onResize?: (e: React.SyntheticEvent, data: ResizeCallbackData) => void;
|
|
10
21
|
};
|
|
11
|
-
|
|
22
|
+
/**
|
|
23
|
+
* Public props for the ResizableBox component, extending the props from
|
|
24
|
+
* 'react-resizable' and adding internal properties.
|
|
25
|
+
* [maxWidth] - Maximum width allowed for the component.
|
|
26
|
+
* [maxHeight] - Maximum height allowed for the component.
|
|
27
|
+
* [onResize] - Callback function called
|
|
28
|
+
* when the component is resized, providing the event and resize data.
|
|
29
|
+
* - Additional properties from ResizableBox in 'react-resizable'.
|
|
30
|
+
* - Owner state that includes properties specific to the component.
|
|
31
|
+
*/
|
|
32
|
+
export type ResizableProps = InternalResizableProps & Partial<ResizableBoxProps> & ResizableOwnerState;
|
|
33
|
+
/**
|
|
34
|
+
* Available slots types in the ResizableBox component.
|
|
35
|
+
* - Keys of the slots defined in ResizableBoxSlots.
|
|
36
|
+
*/
|
|
12
37
|
export type ResizableBoxSlotsType = keyof typeof ResizableBoxSlots;
|
|
13
|
-
|
|
38
|
+
/**
|
|
39
|
+
* Owner state of the ResizableBox component.
|
|
40
|
+
* [disabled] - Indicates whether the component is disabled.
|
|
41
|
+
*/
|
|
42
|
+
export type ResizableOwnerState = {
|
|
43
|
+
disabled?: boolean;
|
|
44
|
+
};
|
|
14
45
|
export type ResizableBoxStyles = Partial<OverridesStyleRules<ResizableBoxSlotsType, typeof COMPONET_KEY_COMPONENT, Theme> | undefined> | undefined;
|
|
15
46
|
export {};
|