@m4l/components 9.1.86 → 9.1.88
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/@types/types.d.ts +9 -0
- package/components/MenuActions/MenuActions.d.ts +1 -1
- package/components/MenuActions/MenuActions.js +18 -2
- package/components/MenuActions/MenuActions.styles.js +17 -4
- package/components/MenuActions/slots/MenuActionsEnum.d.ts +3 -1
- package/components/MenuActions/slots/MenuActionsEnum.js +2 -0
- package/components/MenuActions/slots/MenuActionsSlots.d.ts +6 -0
- package/components/MenuActions/slots/MenuActionsSlots.js +10 -0
- package/components/MenuActions/types.d.ts +11 -3
- package/components/mui_extended/Divider/Divider.d.ts +14 -0
- package/components/mui_extended/Divider/Divider.styles.d.ts +2 -0
- package/components/mui_extended/Divider/constants.d.ts +1 -0
- package/components/mui_extended/Divider/slots/DividerEnum.d.ts +4 -0
- package/components/mui_extended/Divider/slots/DividerSlots.d.ts +8 -0
- package/components/mui_extended/Divider/slots/index.d.ts +2 -0
- package/components/mui_extended/Divider/types.d.ts +46 -0
- package/package.json +1 -1
package/@types/types.d.ts
CHANGED
|
@@ -143,6 +143,7 @@ import { LinearProgressIndeterminateOwnerState, LinearProgressIndeterminateType
|
|
|
143
143
|
import { MenuDividerOwnerState, MenuDividerSlotsType } from '../components/mui_extended/MenuDivider/types';
|
|
144
144
|
import { RHFSelectSlotsType, RHFSelectOwnerState } from '../components/hook-form/RHFSelect/types';
|
|
145
145
|
import { RHFCheckBoxOwnerState, RHFCheckBoxSlotsType } from '../components/hook-form/RHFCheckbox/types';
|
|
146
|
+
import { DividerOwnerState, DividerSlotsType } from '../components/mui_extended/Divider/types';
|
|
146
147
|
|
|
147
148
|
declare module '@mui/material/styles' {
|
|
148
149
|
// Define the slots in the theme
|
|
@@ -202,6 +203,7 @@ declare module '@mui/material/styles' {
|
|
|
202
203
|
M4LLinearProgressIndeterminate: LinearProgressIndeterminateType;
|
|
203
204
|
M4LMenuDivider: MenuDividerSlotsType;
|
|
204
205
|
M4LRHFSelect: RHFSelectSlotsType;
|
|
206
|
+
M4LDivider: DividerSlotsType;
|
|
205
207
|
}
|
|
206
208
|
|
|
207
209
|
interface ComponentsPropsList {
|
|
@@ -261,6 +263,8 @@ declare module '@mui/material/styles' {
|
|
|
261
263
|
M4LLinearProgressIndeterminate: Partial<LinearProgressIndeterminateOwnerState>;
|
|
262
264
|
M4LMenuDivider: Partial<MenuDividerOwnerState>;
|
|
263
265
|
M4LRHFSelect: Partial<RHFSelectOwnerState>;
|
|
266
|
+
M4LDivider: Partial<DividerOwnerState>;
|
|
267
|
+
|
|
264
268
|
}
|
|
265
269
|
|
|
266
270
|
interface Components {
|
|
@@ -540,5 +544,10 @@ declare module '@mui/material/styles' {
|
|
|
540
544
|
styleOverrides?: ComponentsOverrides<Theme>['M4LRHFSelect'];
|
|
541
545
|
variants?: ComponentsVariants['M4LRHFSelect'];
|
|
542
546
|
};
|
|
547
|
+
M4LDivider?: {
|
|
548
|
+
defaultProps?: ComponentsPropsList['M4LDivider'];
|
|
549
|
+
styleOverrides?: ComponentsOverrides<Theme>['M4LDivider'];
|
|
550
|
+
variants?: ComponentsVariants['M4LDivider'];
|
|
551
|
+
};
|
|
543
552
|
}
|
|
544
553
|
}
|
|
@@ -7,7 +7,7 @@ import { MenuActionsProps } from './types';
|
|
|
7
7
|
* y estilos configurables.
|
|
8
8
|
* @author cesar - automatic
|
|
9
9
|
* @createdAt 2024-12-17 15:41:39 - automatic
|
|
10
|
-
* @updatedAt 2025-01-
|
|
10
|
+
* @updatedAt 2025-01-27 09:46:55 - automatic
|
|
11
11
|
* @updatedUser cesar - automatic
|
|
12
12
|
*/
|
|
13
13
|
export declare function MenuActions(props: MenuActionsProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { jsxs, jsx } from "react/jsx-runtime";
|
|
1
|
+
import { jsxs, jsx, Fragment } from "react/jsx-runtime";
|
|
2
2
|
import React, { useState, useMemo } from "react";
|
|
3
3
|
import { useEnvironment, useModuleDictionary } from "@m4l/core";
|
|
4
4
|
import { u as useComponentSize } from "../../hooks/useComponentSize/useComponentSize.js";
|
|
@@ -7,7 +7,7 @@ import { M as MenuItem } from "../mui_extended/MenuItem/MenuItem.js";
|
|
|
7
7
|
import { I as ICON_PATH, a as ICONS, M as MENU_ACTIONS_ } from "./constants.js";
|
|
8
8
|
import { g as getMenuActionsDictionary, D as DICTIONARY } from "./dictionary.js";
|
|
9
9
|
import { M as MenuDivider } from "../mui_extended/MenuDivider/MenuDivider.js";
|
|
10
|
-
import { R as RootStyled, I as IconButtonStyled, M as MenuListStyled, a as MenuLoaderStyled } from "./slots/MenuActionsSlots.js";
|
|
10
|
+
import { R as RootStyled, I as IconButtonStyled, M as MenuListStyled, a as MenuLoaderStyled, H as HeaderMenuActionsStyled, F as FooterMenuActionsStyled } from "./slots/MenuActionsSlots.js";
|
|
11
11
|
import { C as CircularProgress } from "../mui_extended/CircularProgress/CircularProgress.js";
|
|
12
12
|
function MenuActions(props) {
|
|
13
13
|
const {
|
|
@@ -28,6 +28,8 @@ function MenuActions(props) {
|
|
|
28
28
|
paperProps = {},
|
|
29
29
|
color = "primary",
|
|
30
30
|
actionKey,
|
|
31
|
+
header,
|
|
32
|
+
footer,
|
|
31
33
|
...other
|
|
32
34
|
} = props;
|
|
33
35
|
const { currentSize } = useComponentSize(size);
|
|
@@ -69,7 +71,17 @@ function MenuActions(props) {
|
|
|
69
71
|
if (!finalActions.length) {
|
|
70
72
|
return /* @__PURE__ */ jsx(MenuItem, { disabled: true, role: "menu-no-actions", label: getLabel(getMenuActionsDictionary(DICTIONARY.no_actions_label)) });
|
|
71
73
|
}
|
|
74
|
+
const renderHeader = () => {
|
|
75
|
+
return /* @__PURE__ */ jsx(HeaderMenuActionsStyled, { ownerState: {}, children: header });
|
|
76
|
+
};
|
|
77
|
+
const renderFooter = () => {
|
|
78
|
+
return /* @__PURE__ */ jsx(FooterMenuActionsStyled, { ownerState: {}, children: footer });
|
|
79
|
+
};
|
|
72
80
|
return /* @__PURE__ */ jsxs(MenuListStyled, { ownerState: { ownerState }, children: [
|
|
81
|
+
header && /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
82
|
+
renderHeader(),
|
|
83
|
+
/* @__PURE__ */ jsx(MenuDivider, { variant: "solid", size })
|
|
84
|
+
] }),
|
|
73
85
|
finalActions.map((menuAction, index) => {
|
|
74
86
|
const key = actionKey ?? index;
|
|
75
87
|
switch (menuAction.type) {
|
|
@@ -94,6 +106,10 @@ function MenuActions(props) {
|
|
|
94
106
|
return null;
|
|
95
107
|
}
|
|
96
108
|
}),
|
|
109
|
+
footer && /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
110
|
+
/* @__PURE__ */ jsx(MenuDivider, { variant: "solid", size }),
|
|
111
|
+
renderFooter()
|
|
112
|
+
] }),
|
|
97
113
|
endListElement && endListElement
|
|
98
114
|
] });
|
|
99
115
|
};
|
|
@@ -3,7 +3,7 @@ const menuActionsStyles = {
|
|
|
3
3
|
* Estilos para el contenedor raíz del menú.
|
|
4
4
|
* @author Andrés Quintero - automatic
|
|
5
5
|
* @createdAt 2024-12-27 08:27:30 - automatic
|
|
6
|
-
* @updatedAt 2025-01-
|
|
6
|
+
* @updatedAt 2025-01-26 23:53:57 - automatic
|
|
7
7
|
* @updatedUser cesar - automatic
|
|
8
8
|
*/
|
|
9
9
|
root: () => ({
|
|
@@ -13,7 +13,7 @@ const menuActionsStyles = {
|
|
|
13
13
|
* Estilos para el MenuList
|
|
14
14
|
* @author Andrés Quintero - automatic
|
|
15
15
|
* @createdAt 2024-12-27 08:27:30 - automatic
|
|
16
|
-
* @updatedAt 2025-01-
|
|
16
|
+
* @updatedAt 2025-01-26 23:53:57 - automatic
|
|
17
17
|
* @updatedUser cesar - automatic
|
|
18
18
|
*/
|
|
19
19
|
menuList: ({ theme }) => ({
|
|
@@ -31,7 +31,7 @@ const menuActionsStyles = {
|
|
|
31
31
|
* Estilos para el MenuLoader
|
|
32
32
|
* @author cesar - automatic
|
|
33
33
|
* @createdAt 2025-01-20 15:47:07 - automatic
|
|
34
|
-
* @updatedAt 2025-01-
|
|
34
|
+
* @updatedAt 2025-01-26 23:53:57 - automatic
|
|
35
35
|
* @updatedUser cesar - automatic
|
|
36
36
|
*/
|
|
37
37
|
menuLoader: () => ({
|
|
@@ -42,7 +42,7 @@ const menuActionsStyles = {
|
|
|
42
42
|
* Estilos para el IconButton
|
|
43
43
|
* @author cesar - automatic
|
|
44
44
|
* @createdAt 2025-01-20 16:37:00 - automatic
|
|
45
|
-
* @updatedAt 2025-01-
|
|
45
|
+
* @updatedAt 2025-01-26 23:53:57 - automatic
|
|
46
46
|
* @updatedUser cesar - automatic
|
|
47
47
|
*/
|
|
48
48
|
iconButton: ({ theme, ownerState }) => ({
|
|
@@ -57,6 +57,19 @@ const menuActionsStyles = {
|
|
|
57
57
|
'& [class*="M4LIcon-icon"]': {
|
|
58
58
|
backgroundColor: ownerState.selected ? theme.vars.palette[ownerState.paletteColor ?? "default"].selected : void 0
|
|
59
59
|
}
|
|
60
|
+
}),
|
|
61
|
+
/**
|
|
62
|
+
* Estilos para el HeaderMenuActions
|
|
63
|
+
* @author cesar - automatic
|
|
64
|
+
* @createdAt 2025-01-26 23:53:56 - automatic
|
|
65
|
+
* @updatedAt 2025-01-26 23:53:57 - automatic
|
|
66
|
+
* @updatedUser cesar - automatic
|
|
67
|
+
*/
|
|
68
|
+
headerMenuActions: () => ({
|
|
69
|
+
width: "100%"
|
|
70
|
+
}),
|
|
71
|
+
footerMenuActions: () => ({
|
|
72
|
+
width: "100%"
|
|
60
73
|
})
|
|
61
74
|
};
|
|
62
75
|
export {
|
|
@@ -3,6 +3,8 @@ var MenuActionsSlots = /* @__PURE__ */ ((MenuActionsSlots2) => {
|
|
|
3
3
|
MenuActionsSlots2["menuList"] = "menuList";
|
|
4
4
|
MenuActionsSlots2["menuLoader"] = "menuLoader";
|
|
5
5
|
MenuActionsSlots2["iconButton"] = "iconButton";
|
|
6
|
+
MenuActionsSlots2["headerMenuActions"] = "headerMenuActions";
|
|
7
|
+
MenuActionsSlots2["footerMenuActions"] = "footerMenuActions";
|
|
6
8
|
return MenuActionsSlots2;
|
|
7
9
|
})(MenuActionsSlots || {});
|
|
8
10
|
export {
|
|
@@ -24,3 +24,9 @@ export declare const MenuLoaderStyled: import('@emotion/styled').StyledComponent
|
|
|
24
24
|
export declare const IconButtonStyled: import('@emotion/styled').StyledComponent<Pick<Omit<import('../../mui_extended/IconButton/types').IconButtonProps, "ref"> & import('react').RefAttributes<HTMLButtonElement>, "children" | "value" | "title" | "component" | "size" | "name" | "id" | "type" | "selected" | "action" | "hidden" | "content" | "style" | "icon" | "tooltip" | "disabled" | "variant" | "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" | "placement" | "form" | "src" | "rotationAngle" | "tooltipContent" | "instaceDataTestId" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple" | "edge" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "componentPaletteColor" | "badgeContent" | "dictionaryTooltipId" | keyof import('react').RefAttributes<HTMLButtonElement>> & import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Partial<import('../types').MenuActionsOwnerState> & Record<string, unknown> & {
|
|
25
25
|
ownerState: Partial<import('../types').MenuActionsOwnerState> & Record<string, unknown>;
|
|
26
26
|
}, {}, {}>;
|
|
27
|
+
export declare const HeaderMenuActionsStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Partial<import('../types').MenuActionsOwnerState> & Record<string, unknown> & {
|
|
28
|
+
ownerState: Partial<import('../types').MenuActionsOwnerState> & Record<string, unknown>;
|
|
29
|
+
}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
|
|
30
|
+
export declare const FooterMenuActionsStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Partial<import('../types').MenuActionsOwnerState> & Record<string, unknown> & {
|
|
31
|
+
ownerState: Partial<import('../types').MenuActionsOwnerState> & Record<string, unknown>;
|
|
32
|
+
}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
|
|
@@ -20,7 +20,17 @@ const IconButtonStyled = styled(IconButton, {
|
|
|
20
20
|
name: MENU_ACTIONS_KEY_COMPONENT,
|
|
21
21
|
slot: MenuActionsSlots.iconButton
|
|
22
22
|
})(menuActionsStyles?.iconButton);
|
|
23
|
+
const HeaderMenuActionsStyled = styled("div", {
|
|
24
|
+
name: MENU_ACTIONS_KEY_COMPONENT,
|
|
25
|
+
slot: MenuActionsSlots.headerMenuActions
|
|
26
|
+
})(menuActionsStyles?.headerMenuActions);
|
|
27
|
+
const FooterMenuActionsStyled = styled("div", {
|
|
28
|
+
name: MENU_ACTIONS_KEY_COMPONENT,
|
|
29
|
+
slot: MenuActionsSlots.footerMenuActions
|
|
30
|
+
})(menuActionsStyles?.footerMenuActions);
|
|
23
31
|
export {
|
|
32
|
+
FooterMenuActionsStyled as F,
|
|
33
|
+
HeaderMenuActionsStyled as H,
|
|
24
34
|
IconButtonStyled as I,
|
|
25
35
|
MenuListStyled as M,
|
|
26
36
|
RootStyled as R,
|
|
@@ -13,7 +13,7 @@ import { MENU_ACTIONS_KEY_COMPONENT } from './constants';
|
|
|
13
13
|
* onClick - Función a ejecutar al hacer clic en la acción.
|
|
14
14
|
* @author Andrés Quintero - automatic
|
|
15
15
|
* @createdAt 2024-12-27 08:27:30 - automatic
|
|
16
|
-
* @updatedAt 2025-01-
|
|
16
|
+
* @updatedAt 2025-01-26 23:53:57 - automatic
|
|
17
17
|
* @updatedUser cesar - automatic
|
|
18
18
|
*/
|
|
19
19
|
export interface ComponentActionProps {
|
|
@@ -96,7 +96,7 @@ export interface MenuActionsProps extends Omit<PopoverProps, 'open' | 'anchorEl'
|
|
|
96
96
|
* Acciones del menú, puede ser un array o una función que genere acciones.
|
|
97
97
|
* @author Andrés Quintero - automatic
|
|
98
98
|
* @createdAt 2024-12-27 08:27:30 - automatic
|
|
99
|
-
* @updatedAt 2025-01-
|
|
99
|
+
* @updatedAt 2025-01-26 23:53:57 - automatic
|
|
100
100
|
* @updatedUser cesar - automatic
|
|
101
101
|
*/
|
|
102
102
|
menuActions: MenuAction[] | ((row: any) => MenuAction[]);
|
|
@@ -159,7 +159,7 @@ export interface MenuActionsProps extends Omit<PopoverProps, 'open' | 'anchorEl'
|
|
|
159
159
|
* Función externa para cerrar el menú.
|
|
160
160
|
* @author Andrés Quintero - automatic
|
|
161
161
|
* @createdAt 2024-12-27 08:27:30 - automatic
|
|
162
|
-
* @updatedAt 2025-01-
|
|
162
|
+
* @updatedAt 2025-01-26 23:53:57 - automatic
|
|
163
163
|
* @updatedUser cesar - automatic
|
|
164
164
|
*/
|
|
165
165
|
externalClose?: (element: null | HTMLDivElement) => void;
|
|
@@ -191,6 +191,14 @@ export interface MenuActionsProps extends Omit<PopoverProps, 'open' | 'anchorEl'
|
|
|
191
191
|
* Define la clave de la acción.
|
|
192
192
|
*/
|
|
193
193
|
actionKey?: string;
|
|
194
|
+
/**
|
|
195
|
+
* agrega un header al menú
|
|
196
|
+
*/
|
|
197
|
+
header?: ReactNode;
|
|
198
|
+
/**
|
|
199
|
+
* agrega un footer al menú
|
|
200
|
+
*/
|
|
201
|
+
footer?: ReactNode;
|
|
194
202
|
}
|
|
195
203
|
/**
|
|
196
204
|
* Estado del propietario para `MenuActions`.
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { DividerProps } from './types';
|
|
2
|
+
/**
|
|
3
|
+
* Componente Divider que extiende las props de MUIDividerProps.
|
|
4
|
+
*
|
|
5
|
+
* Este componente se utiliza para crear un divisor visual entre elementos.
|
|
6
|
+
* Puede ser horizontal o vertical y puede tener diferentes variantes de estilo.
|
|
7
|
+
* @param props - Las propiedades del componente Divider.
|
|
8
|
+
* @returns El componente Divider.
|
|
9
|
+
* @example
|
|
10
|
+
* ```tsx
|
|
11
|
+
* <Divider orientation="horizontal" customVariant="solid" />
|
|
12
|
+
* ```
|
|
13
|
+
*/
|
|
14
|
+
export declare const Divider: (props: DividerProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const DIVIDER_KEY_COMPONENT = "M4LDivider";
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
export declare const DividerRootStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Partial<import('../types').DividerOwnerState> & Record<string, unknown> & {
|
|
2
|
+
ownerState: Partial<import('../types').DividerOwnerState> & Record<string, unknown>;
|
|
3
|
+
}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
|
|
4
|
+
export declare const DividerStyled: import('@emotion/styled').StyledComponent<Pick<import('@mui/material').DividerOwnProps & import('@mui/material/OverridableComponent').CommonProps & Omit<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLHRElement>, HTMLHRElement>, "ref"> & {
|
|
5
|
+
ref?: ((instance: HTMLHRElement | 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<HTMLHRElement> | null | undefined;
|
|
6
|
+
}, "children" | "light" | "style" | "absolute" | "variant" | "textAlign" | "sx" | "classes" | "className" | "orientation" | "flexItem">, "children" | "ref" | "title" | "id" | "light" | "hidden" | "color" | "content" | "style" | "absolute" | "variant" | "textAlign" | "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" | "key" | "orientation" | "flexItem"> & import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Partial<import('../types').DividerOwnerState> & Record<string, unknown> & {
|
|
7
|
+
ownerState: Partial<import('../types').DividerOwnerState> & Record<string, unknown>;
|
|
8
|
+
}, {}, {}>;
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
import { DividerProps as MUIDividerProps, Theme } from '@mui/material';
|
|
2
|
+
import { OverridesStyleRules } from '@mui/material/styles/overrides';
|
|
3
|
+
import { DividerSlots } from './slots/DividerEnum';
|
|
4
|
+
import { DIVIDER_KEY_COMPONENT } from './constants';
|
|
5
|
+
import { Sizes } from '@m4l/styles';
|
|
6
|
+
/**
|
|
7
|
+
* Propiedades del componente `MenuDivider`.
|
|
8
|
+
*/
|
|
9
|
+
export interface DividerProps extends MUIDividerProps {
|
|
10
|
+
/**
|
|
11
|
+
* Identificador de prueba para el `Divider`.
|
|
12
|
+
*/
|
|
13
|
+
dataTestId?: string;
|
|
14
|
+
/**
|
|
15
|
+
* Clase CSS adicional para el `Divider`.
|
|
16
|
+
*/
|
|
17
|
+
className?: string;
|
|
18
|
+
/**
|
|
19
|
+
* Define el estilo del divisor.
|
|
20
|
+
* - `solid`: Una línea sólida.
|
|
21
|
+
* - `dash`: Una línea con guiones.
|
|
22
|
+
*/
|
|
23
|
+
customVariant?: 'solid' | 'dash';
|
|
24
|
+
/**
|
|
25
|
+
* Define la orientación del `Divider`.
|
|
26
|
+
* - `'horizontal'`: Una línea horizontal.
|
|
27
|
+
* - `'vertical'`: Una línea vertical.
|
|
28
|
+
*/
|
|
29
|
+
orientation?: 'horizontal' | 'vertical';
|
|
30
|
+
/**
|
|
31
|
+
* Tamaño del `Divider`.
|
|
32
|
+
*/
|
|
33
|
+
size?: Extract<Sizes, 'small' | 'medium'>;
|
|
34
|
+
}
|
|
35
|
+
/**
|
|
36
|
+
* Estado del propietario del `Divider` utilizado para definir propiedades internas de estilo y comportamiento.
|
|
37
|
+
*/
|
|
38
|
+
export type DividerOwnerState = Pick<DividerProps, 'orientation' | 'customVariant' | 'size'>;
|
|
39
|
+
/**
|
|
40
|
+
* Define los tipos de Slots disponibles para el `Divider`.
|
|
41
|
+
*/
|
|
42
|
+
export type DividerSlotsType = keyof typeof DividerSlots;
|
|
43
|
+
/**
|
|
44
|
+
* Estilos aplicables al `Divider` utilizando temas y slots personalizados.
|
|
45
|
+
*/
|
|
46
|
+
export type DividerStyles = OverridesStyleRules<DividerSlotsType, typeof DIVIDER_KEY_COMPONENT, Theme>;
|