@m4l/components 9.1.86 → 9.1.87
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/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
|
}
|
|
@@ -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>;
|