@rnaga/wp-next-ui 1.1.8 → 1.1.10
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/Accordions.d.ts +2 -1
- package/Accordions.d.ts.map +1 -1
- package/Accordions.js +2 -1
- package/DraggableBox.d.ts +2 -0
- package/DraggableBox.d.ts.map +1 -1
- package/DraggableBox.js +4 -3
- package/SortableList.d.ts +1 -0
- package/SortableList.d.ts.map +1 -1
- package/SortableList.js +2 -2
- package/package.json +1 -1
package/Accordions.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { JSX } from "react";
|
|
2
|
-
import { Accordion, AccordionSummary as MuiAccodionSummary, SxProps } from "@mui/material";
|
|
2
|
+
import { Accordion, AccordionDetails, AccordionSummary as MuiAccodionSummary, SxProps } from "@mui/material";
|
|
3
3
|
import { Typography } from "./Typography";
|
|
4
4
|
export declare const Accordions: (props: {
|
|
5
5
|
items: {
|
|
@@ -13,6 +13,7 @@ export declare const Accordions: (props: {
|
|
|
13
13
|
slotProps?: {
|
|
14
14
|
summary?: Parameters<typeof MuiAccodionSummary>[0];
|
|
15
15
|
title?: Parameters<typeof Typography>[0];
|
|
16
|
+
details?: Parameters<typeof AccordionDetails>[0];
|
|
16
17
|
};
|
|
17
18
|
size?: "small" | "medium";
|
|
18
19
|
} & Omit<Parameters<typeof Accordion>[0], "sx" | "defaultExpanded" | "children">) => import("react/jsx-runtime").JSX.Element[];
|
package/Accordions.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Accordions.d.ts","sourceRoot":"","sources":["../src/Accordions.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAM,GAAG,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EACL,SAAS,
|
|
1
|
+
{"version":3,"file":"Accordions.d.ts","sourceRoot":"","sources":["../src/Accordions.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAM,GAAG,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EACL,SAAS,EACT,gBAAgB,EAChB,gBAAgB,IAAI,kBAAkB,EACtC,OAAO,EACR,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAG1C,eAAO,MAAM,UAAU,GACrB,OAAO;IACL,KAAK,EAAE;QACL,KAAK,EAAE,MAAM,CAAC;QACd,OAAO,EAAE,GAAG,CAAC,OAAO,CAAC;KACtB,EAAE,CAAC;IACJ,eAAe,CAAC,EAAE,MAAM,EAAE,CAAC;IAE3B,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,EAAE,CAAC,EAAE,OAAO,CAAC;IACb,SAAS,CAAC,EAAE;QACV,OAAO,CAAC,EAAE,UAAU,CAAC,OAAO,kBAAkB,CAAC,CAAC,CAAC,CAAC,CAAC;QACnD,KAAK,CAAC,EAAE,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC;QACzC,OAAO,CAAC,EAAE,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC,CAAC,CAAC,CAAC;KAClD,CAAC;IACF,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;CAC3B,GAAG,IAAI,CACN,UAAU,CAAC,OAAO,SAAS,CAAC,CAAC,CAAC,CAAC,EAC/B,IAAI,GAAG,iBAAiB,GAAG,UAAU,CACtC,8CA8EF,CAAC"}
|
package/Accordions.js
CHANGED
|
@@ -10,6 +10,7 @@ export const Accordions = (props) => {
|
|
|
10
10
|
const { wpTheme } = useWPTheme();
|
|
11
11
|
const { sx: summarySx, ...summarySlotProps } = slotProps?.summary || {};
|
|
12
12
|
const { sx: titleSx, ...titleSlotProps } = slotProps?.title || {};
|
|
13
|
+
const { sx: detailsSx, ...detailsSlotProps } = slotProps?.details || {};
|
|
13
14
|
return items.map((item, index) => {
|
|
14
15
|
return (_jsxs(Accordion, { expanded: allowSingleExpanded ? expdanded === index : undefined, ...(!allowSingleExpanded && {
|
|
15
16
|
defaultExpanded: defaultExpanded
|
|
@@ -34,6 +35,6 @@ export const Accordions = (props) => {
|
|
|
34
35
|
lineHeight: "20px",
|
|
35
36
|
my: 1,
|
|
36
37
|
...titleSx,
|
|
37
|
-
}, ...titleSlotProps, children: item.title }) }), _jsx(AccordionDetails, { children: item.content })] }, index));
|
|
38
|
+
}, ...titleSlotProps, children: item.title }) }), _jsx(AccordionDetails, { sx: { ...detailsSx }, ...detailsSlotProps, children: item.content })] }, index));
|
|
38
39
|
});
|
|
39
40
|
};
|
package/DraggableBox.d.ts
CHANGED
|
@@ -9,6 +9,7 @@
|
|
|
9
9
|
* - title: Optional title to display in the header.
|
|
10
10
|
* - size: Sets the Typography size ("small" | "medium").
|
|
11
11
|
* - targetRef: Reference to an element whose relative position determines the box's initial placement.
|
|
12
|
+
* - portalTarget: Optional element to attach the Portal to (default: document.body).
|
|
12
13
|
* - sx: Style overrides for the outer Box wrapping the content.
|
|
13
14
|
* - slotSxProps: Style overrides for the header, title, and border (width, color).
|
|
14
15
|
*/
|
|
@@ -34,6 +35,7 @@ export declare const DraggableBox: (props: {
|
|
|
34
35
|
title?: string;
|
|
35
36
|
size?: "small" | "medium";
|
|
36
37
|
targetRef?: RefObject<HTMLElement | null>;
|
|
38
|
+
portalTarget?: HTMLElement | null;
|
|
37
39
|
ref?: RefObject<HTMLElement | null>;
|
|
38
40
|
sx?: SxProps;
|
|
39
41
|
slotSxProps?: SlotSxProps;
|
package/DraggableBox.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DraggableBox.d.ts","sourceRoot":"","sources":["../src/DraggableBox.tsx"],"names":[],"mappings":"AAAA
|
|
1
|
+
{"version":3,"file":"DraggableBox.d.ts","sourceRoot":"","sources":["../src/DraggableBox.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AACH,OAAO,KAAK,EAAE,EACZ,SAAS,EAKV,MAAM,OAAO,CAAC;AACf,OAAO,EAAmB,OAAO,EAAE,MAAM,eAAe,CAAC;AAOzD,KAAK,WAAW,GAAG;IACjB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,MAAM,CAAC,EAAE;QACP,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,KAAK,CAAC,EAAE,MAAM,CAAC;KAChB,CAAC;CACH,CAAC;AAEF,eAAO,MAAM,YAAY,GAAI,OAAO;IAClC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,YAAY,CAAC;IACtB,MAAM,CAAC,EAAE;QACP,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,GAAG,CAAC,EAAE,MAAM,CAAC;KACd,CAAC;IACF,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;IAC1B,SAAS,CAAC,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAC1C,YAAY,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IAClC,GAAG,CAAC,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IACpC,EAAE,CAAC,EAAE,OAAO,CAAC;IACb,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAC;IAC9B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,KAAK,KAAK,IAAI,CAAC;CACnE,4CA6cA,CAAC"}
|
package/DraggableBox.js
CHANGED
|
@@ -10,6 +10,7 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
|
|
|
10
10
|
* - title: Optional title to display in the header.
|
|
11
11
|
* - size: Sets the Typography size ("small" | "medium").
|
|
12
12
|
* - targetRef: Reference to an element whose relative position determines the box's initial placement.
|
|
13
|
+
* - portalTarget: Optional element to attach the Portal to (default: document.body).
|
|
13
14
|
* - sx: Style overrides for the outer Box wrapping the content.
|
|
14
15
|
* - slotSxProps: Style overrides for the header, title, and border (width, color).
|
|
15
16
|
*/
|
|
@@ -21,7 +22,7 @@ import { Background } from "./Background";
|
|
|
21
22
|
import { Portal } from "./portal";
|
|
22
23
|
export const DraggableBox = (props) => {
|
|
23
24
|
// Destructure props
|
|
24
|
-
const { children, targetRef, ref: selfRef, title, size, onClose, open, sx, slotSxProps, offset: initialOffset = {}, zIndexLayer = 0, placement = "left", resizable = false, onResize, } = props;
|
|
25
|
+
const { children, targetRef, portalTarget, ref: selfRef, title, size, onClose, open, sx, slotSxProps, offset: initialOffset = {}, zIndexLayer = 0, placement = "left", resizable = false, onResize, } = props;
|
|
25
26
|
// Provide default offset values for the box
|
|
26
27
|
const { left = 0, top = 0 } = initialOffset;
|
|
27
28
|
// Reference to the draggable box DOM element
|
|
@@ -238,7 +239,7 @@ export const DraggableBox = (props) => {
|
|
|
238
239
|
// If the box is not open, render nothing
|
|
239
240
|
if (!open)
|
|
240
241
|
return null;
|
|
241
|
-
return (
|
|
242
|
+
return (_jsx(_Fragment, { children: _jsxs(Portal, { target: portalTarget, children: [_jsx(Background, { zIndex: 999 + zIndexLayer, onClose: onClose }), _jsxs(Box
|
|
242
243
|
// Attach our callback ref
|
|
243
244
|
, {
|
|
244
245
|
// Attach our callback ref
|
|
@@ -337,5 +338,5 @@ export const DraggableBox = (props) => {
|
|
|
337
338
|
bgcolor: "primary.main",
|
|
338
339
|
opacity: 0.3,
|
|
339
340
|
},
|
|
340
|
-
}, onMouseDown: (e) => handleResizeMouseDown(e, "top"), onWheel: (e) => handleResizeWheel(e, "top") })] }))] }) })
|
|
341
|
+
}, onMouseDown: (e) => handleResizeMouseDown(e, "top"), onWheel: (e) => handleResizeWheel(e, "top") })] }))] })] }) }));
|
|
341
342
|
};
|
package/SortableList.d.ts
CHANGED
|
@@ -23,6 +23,7 @@ export declare const SortableList: <T extends any = string>(props: {
|
|
|
23
23
|
*/
|
|
24
24
|
dropZoneId?: string;
|
|
25
25
|
renderItem?: (item: SortableListItemType<T>) => JSX.Element;
|
|
26
|
+
getItemSx?: (item: SortableListItemType<T>) => SxProps;
|
|
26
27
|
onDelete?: (index: number) => void;
|
|
27
28
|
onEdit?: (index: number) => void;
|
|
28
29
|
onChange?: (items: SortableListItemType<T>[], fromIndex: number, toIndex: number) => void;
|
package/SortableList.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SortableList.d.ts","sourceRoot":"","sources":["../src/SortableList.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AACxC,OAAO,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAE1C,OAAO,EAEL,GAAG,EAOJ,MAAM,OAAO,CAAC;AAIf,MAAM,MAAM,oBAAoB,CAAC,CAAC,GAAG,MAAM,IAAI,YAAY,CAAC,CAAC,CAAC,CAAC;AAE/D,KAAK,WAAW,GAAG,UAAU,GAAG,YAAY,GAAG,MAAM,GAAG,gBAAgB,CAAC;AAczE,MAAM,MAAM,iBAAiB,GAAG,UAAU,CAAC,OAAO,YAAY,CAAC,CAAC,CAAC,CAAC,CAAC;AAEnE,eAAO,MAAM,YAAY,GAAI,CAAC,SAAS,GAAG,GAAG,MAAM,EAAE,OAAO;IAC1D,IAAI,EAAE;QAAE,KAAK,EAAE,CAAC,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;IACpC,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;IAC1B,EAAE,CAAC,EAAE,OAAO,CAAC;IACb,WAAW,CAAC,EAAE;QACZ,KAAK,CAAC,EAAE,OAAO,CAAC;KACjB,CAAC;IACF,WAAW,EAAE,WAAW,CAAC;IACzB;;;;;OAKG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,oBAAoB,CAAC,CAAC,CAAC,KAAK,GAAG,CAAC,OAAO,CAAC;IAC5D,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,QAAQ,CAAC,EAAE,CACT,KAAK,EAAE,oBAAoB,CAAC,CAAC,CAAC,EAAE,EAChC,SAAS,EAAE,MAAM,EACjB,OAAO,EAAE,MAAM,KACZ,IAAI,CAAC;IACV,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,oBAAoB,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;IACjD,cAAc,CAAC,EAAE,CAAC,IAAI,EAAE,oBAAoB,CAAC,CAAC,CAAC,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3E,iBAAiB,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/C,iBAAiB,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/C,MAAM,CAAC,EAAE;QAAE,IAAI,CAAC,EAAE,MAAM,CAAC;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;CAC/C,
|
|
1
|
+
{"version":3,"file":"SortableList.d.ts","sourceRoot":"","sources":["../src/SortableList.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AACxC,OAAO,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAE1C,OAAO,EAEL,GAAG,EAOJ,MAAM,OAAO,CAAC;AAIf,MAAM,MAAM,oBAAoB,CAAC,CAAC,GAAG,MAAM,IAAI,YAAY,CAAC,CAAC,CAAC,CAAC;AAE/D,KAAK,WAAW,GAAG,UAAU,GAAG,YAAY,GAAG,MAAM,GAAG,gBAAgB,CAAC;AAczE,MAAM,MAAM,iBAAiB,GAAG,UAAU,CAAC,OAAO,YAAY,CAAC,CAAC,CAAC,CAAC,CAAC;AAEnE,eAAO,MAAM,YAAY,GAAI,CAAC,SAAS,GAAG,GAAG,MAAM,EAAE,OAAO;IAC1D,IAAI,EAAE;QAAE,KAAK,EAAE,CAAC,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;IACpC,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;IAC1B,EAAE,CAAC,EAAE,OAAO,CAAC;IACb,WAAW,CAAC,EAAE;QACZ,KAAK,CAAC,EAAE,OAAO,CAAC;KACjB,CAAC;IACF,WAAW,EAAE,WAAW,CAAC;IACzB;;;;;OAKG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,oBAAoB,CAAC,CAAC,CAAC,KAAK,GAAG,CAAC,OAAO,CAAC;IAC5D,SAAS,CAAC,EAAE,CAAC,IAAI,EAAE,oBAAoB,CAAC,CAAC,CAAC,KAAK,OAAO,CAAC;IACvD,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,QAAQ,CAAC,EAAE,CACT,KAAK,EAAE,oBAAoB,CAAC,CAAC,CAAC,EAAE,EAChC,SAAS,EAAE,MAAM,EACjB,OAAO,EAAE,MAAM,KACZ,IAAI,CAAC;IACV,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,oBAAoB,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;IACjD,cAAc,CAAC,EAAE,CAAC,IAAI,EAAE,oBAAoB,CAAC,CAAC,CAAC,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3E,iBAAiB,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/C,iBAAiB,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/C,MAAM,CAAC,EAAE;QAAE,IAAI,CAAC,EAAE,MAAM,CAAC;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;CAC/C,4CA2UA,CAAC"}
|
package/SortableList.js
CHANGED
|
@@ -5,7 +5,7 @@ import { Box } from "@mui/material";
|
|
|
5
5
|
import { ListBase } from "./ListBase";
|
|
6
6
|
const SortableContext = createContext({});
|
|
7
7
|
export const SortableList = (props) => {
|
|
8
|
-
const { size = "small", displayType = "vertical", renderItem, onDelete, onChange, onEdit, onDrop, onDropToTarget, onDropTargetEnter, onDropTargetLeave, cursor, dropZoneId, } = props;
|
|
8
|
+
const { size = "small", displayType = "vertical", renderItem, getItemSx, onDelete, onChange, onEdit, onDrop, onDropToTarget, onDropTargetEnter, onDropTargetLeave, cursor, dropZoneId, } = props;
|
|
9
9
|
// Stable unique ID for this list instance (used to tag items)
|
|
10
10
|
const generatedId = useId();
|
|
11
11
|
const listId = dropZoneId ?? generatedId;
|
|
@@ -224,7 +224,7 @@ export const SortableList = (props) => {
|
|
|
224
224
|
refPos,
|
|
225
225
|
targetRef,
|
|
226
226
|
displayType,
|
|
227
|
-
}, children: _jsx(Box, { "data-sortable-drop-zone-id": listId, children: _jsx(ListBase, { items: items, size: size, sx: { ...sx, ...props.sx }, displayType: displayType, renderItem: (item) => renderItem ? renderItem(item) : _jsx(_Fragment, { children: item.label }), onDelete: onDelete, onEdit: onEdit, onMouseDown: handleItemMouseDown, getItemDataAttributes: (item) => ({
|
|
227
|
+
}, children: _jsx(Box, { "data-sortable-drop-zone-id": listId, children: _jsx(ListBase, { items: items, size: size, sx: { ...sx, ...props.sx }, displayType: displayType, renderItem: (item) => renderItem ? renderItem(item) : _jsx(_Fragment, { children: item.label }), onDelete: onDelete, onEdit: onEdit, onMouseDown: handleItemMouseDown, getItemSx: getItemSx, getItemDataAttributes: (item) => ({
|
|
228
228
|
"data-sortable-item-index": item.index,
|
|
229
229
|
"data-sortable-list-id": listId,
|
|
230
230
|
}), slotSxProps: {
|