@edifice.io/react 2.2.3-develop-b2school.20250422103019 → 2.2.3-develop-b2school.20250423112933
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/dist/components/List/List.d.ts +7 -1
- package/dist/components/List/List.js +8 -5
- package/dist/components/Toolbar/Toolbar.d.ts +4 -0
- package/dist/components/Toolbar/Toolbar.js +8 -3
- package/dist/hooks/useWorkspaceFolders/useWorkspaceFoldersTree.js +1 -1
- package/dist/modules/modals/ConfirmModal/ConfirmModal.js +1 -1
- package/dist/modules/multimedia/WorkspaceFolders/WorkspaceFolders.js +1 -3
- package/package.json +6 -6
|
@@ -25,7 +25,13 @@ export type ListProps<T> = {
|
|
|
25
25
|
* Custom class name
|
|
26
26
|
*/
|
|
27
27
|
className?: string;
|
|
28
|
+
/**
|
|
29
|
+
* Toolbar options
|
|
30
|
+
*/
|
|
31
|
+
toolbarOptions?: {
|
|
32
|
+
shouldHideLabelsOnMobile?: boolean;
|
|
33
|
+
};
|
|
28
34
|
};
|
|
29
35
|
export declare const List: <T extends {
|
|
30
36
|
_id: string;
|
|
31
|
-
}>({ items, isCheckable, data, renderNode, onSelectedItems, className, }: ListProps<T>) => import("react/jsx-runtime").JSX.Element;
|
|
37
|
+
}>({ items, isCheckable, data, renderNode, onSelectedItems, className, toolbarOptions, }: ListProps<T>) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { jsxs, Fragment, jsx } from "react/jsx-runtime";
|
|
2
|
-
import { useMediaQuery } from "@uidotdev/usehooks";
|
|
3
2
|
import clsx from "clsx";
|
|
4
3
|
import { useEffect, Fragment as Fragment$1 } from "react";
|
|
5
4
|
import { useCheckable } from "../../hooks/useCheckable/useCheckable.js";
|
|
5
|
+
import useBreakpoint from "../../hooks/useBreakpoint/useBreakpoint.js";
|
|
6
6
|
import Checkbox from "../Checkbox/Checkbox.js";
|
|
7
7
|
import { Toolbar } from "../Toolbar/Toolbar.js";
|
|
8
8
|
const List = ({
|
|
@@ -11,7 +11,8 @@ const List = ({
|
|
|
11
11
|
data,
|
|
12
12
|
renderNode,
|
|
13
13
|
onSelectedItems,
|
|
14
|
-
className
|
|
14
|
+
className,
|
|
15
|
+
toolbarOptions
|
|
15
16
|
}) => {
|
|
16
17
|
const {
|
|
17
18
|
selectedItems,
|
|
@@ -19,7 +20,9 @@ const List = ({
|
|
|
19
20
|
isIndeterminate,
|
|
20
21
|
handleOnSelectAllItems,
|
|
21
22
|
handleOnSelectItem
|
|
22
|
-
} = useCheckable(data),
|
|
23
|
+
} = useCheckable(data), {
|
|
24
|
+
lg
|
|
25
|
+
} = useBreakpoint();
|
|
23
26
|
return useEffect(() => {
|
|
24
27
|
selectedItems && (onSelectedItems == null || onSelectedItems(selectedItems));
|
|
25
28
|
}, [onSelectedItems, selectedItems]), /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
@@ -33,8 +36,8 @@ const List = ({
|
|
|
33
36
|
")"
|
|
34
37
|
] })
|
|
35
38
|
] }),
|
|
36
|
-
items && /* @__PURE__ */ jsx(Toolbar, { items, isBlock: !0, align: "left", variant: "no-shadow", className: clsx("gap-4 py-4", {
|
|
37
|
-
"px-0 ms-auto": !
|
|
39
|
+
items && /* @__PURE__ */ jsx(Toolbar, { items, shouldHideLabelsOnMobile: toolbarOptions == null ? void 0 : toolbarOptions.shouldHideLabelsOnMobile, isBlock: !0, align: "left", variant: "no-shadow", className: clsx("gap-4 py-4", {
|
|
40
|
+
"px-0 ms-auto": !lg
|
|
38
41
|
}) })
|
|
39
42
|
] }) }),
|
|
40
43
|
/* @__PURE__ */ jsx("div", { className: "border-top" })
|
|
@@ -71,6 +71,10 @@ export interface ToolbarProps extends React.ComponentPropsWithRef<'div'> {
|
|
|
71
71
|
* Accept optional children
|
|
72
72
|
*/
|
|
73
73
|
children?: ReactNode;
|
|
74
|
+
/**
|
|
75
|
+
* Hide labels on mobile
|
|
76
|
+
*/
|
|
77
|
+
shouldHideLabelsOnMobile?: boolean;
|
|
74
78
|
}
|
|
75
79
|
export declare const Toolbar: import('react').ForwardRefExoticComponent<Omit<ToolbarProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
|
|
76
80
|
export default Toolbar;
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
2
|
import { forwardRef, useState, useRef, useEffect, createElement } from "react";
|
|
3
3
|
import clsx from "clsx";
|
|
4
|
+
import useBreakpoint from "../../hooks/useBreakpoint/useBreakpoint.js";
|
|
4
5
|
import { mergeRefs } from "../../utilities/refs/ref.js";
|
|
5
6
|
import Tooltip from "../Tooltip/Tooltip.js";
|
|
6
7
|
import Button from "../Button/Button.js";
|
|
@@ -12,9 +13,12 @@ const Toolbar = /* @__PURE__ */ forwardRef(({
|
|
|
12
13
|
align = "space",
|
|
13
14
|
isBlock = !1,
|
|
14
15
|
ariaControls,
|
|
15
|
-
className
|
|
16
|
+
className,
|
|
17
|
+
shouldHideLabelsOnMobile = !1
|
|
16
18
|
}, ref) => {
|
|
17
|
-
const [firstFocusableItemIndex, setFirstFocusableItemIndex] = useState(0), [a11yNavigationItems, setA11yNavigationItems] = useState([]), [firstA11yNavigationItem, setFirstA11yNavigationItem] = useState(), [lastA11yNavigationItem, setA11yNavigationLastItem] = useState(), divToolbarRef = useRef(),
|
|
19
|
+
const [firstFocusableItemIndex, setFirstFocusableItemIndex] = useState(0), [a11yNavigationItems, setA11yNavigationItems] = useState([]), [firstA11yNavigationItem, setFirstA11yNavigationItem] = useState(), [lastA11yNavigationItem, setA11yNavigationLastItem] = useState(), divToolbarRef = useRef(), {
|
|
20
|
+
lg
|
|
21
|
+
} = useBreakpoint(), classes = clsx("toolbar z-1000 bg-white", className, {
|
|
18
22
|
default: variant === "default",
|
|
19
23
|
"no-shadow": variant === "no-shadow",
|
|
20
24
|
"d-flex": isBlock,
|
|
@@ -57,11 +61,12 @@ const Toolbar = /* @__PURE__ */ forwardRef(({
|
|
|
57
61
|
};
|
|
58
62
|
return /* @__PURE__ */ jsx("div", { ref: mergeRefs(ref, divToolbarRef), className: classes, role: "toolbar", "aria-label": "Text Formatting", "aria-controls": ariaControls, onFocus: handleFocus, onBlur: handleBlur, children: items.map((item, index) => {
|
|
59
63
|
if (item.visibility === "hide") return null;
|
|
64
|
+
const hideLabel = shouldHideLabelsOnMobile && !lg;
|
|
60
65
|
switch (item.type) {
|
|
61
66
|
case "divider":
|
|
62
67
|
return /* @__PURE__ */ jsx("div", { className: "toolbar-divider" }, item.name ?? index);
|
|
63
68
|
case "button":
|
|
64
|
-
return /* @__PURE__ */ jsx(Tooltip, { message: renderTooltipMessage(item), placement: renderTooltipPosition(item), children: /* @__PURE__ */ createElement(Button, { ...item.props, key: item.name ?? index, color: item.props.color
|
|
69
|
+
return /* @__PURE__ */ jsx(Tooltip, { message: hideLabel ? renderTooltipMessage(item) : void 0, placement: renderTooltipPosition(item), children: /* @__PURE__ */ createElement(Button, { ...item.props, children: !hideLabel && item.props.children, "aria-label": item.name, key: item.name ?? index, color: item.props.color || "tertiary", variant: "ghost", tabIndex: index === firstFocusableItemIndex ? 0 : -1, onKeyDown: handleKeyDown }) }, item.name ?? index);
|
|
65
70
|
case "icon":
|
|
66
71
|
return /* @__PURE__ */ jsx(Tooltip, { message: renderTooltipMessage(item), placement: renderTooltipPosition(item), children: /* @__PURE__ */ createElement(IconButton, { ...item.props, key: item.name ?? index, color: item.props.color ? item.props.color : "tertiary", variant: item.props.variant ? item.props.variant : "ghost", tabIndex: index === firstFocusableItemIndex ? 0 : -1, onKeyDown: handleKeyDown }) }, item.name ?? index);
|
|
67
72
|
case "dropdown":
|
|
@@ -27,7 +27,7 @@ const buildTree = (workspaceData, userTreeLabel, sharedTreeLabel) => {
|
|
|
27
27
|
}), workspaceData.forEach((item) => {
|
|
28
28
|
var _a;
|
|
29
29
|
const nodeItem = nodes.get(item._id);
|
|
30
|
-
item.eParent && nodes.has(item.eParent) ? (_a = nodes.get(item.eParent)) == null || _a.children.push(nodeItem) : item.isShared
|
|
30
|
+
item.eParent && nodes.has(item.eParent) ? (_a = nodes.get(item.eParent)) == null || _a.children.push(nodeItem) : item.isShared ? sharedTree.push(nodeItem) : userTree.push(nodeItem);
|
|
31
31
|
}), [{
|
|
32
32
|
id: WORKSPACE_USER_FOLDER_ID,
|
|
33
33
|
name: userTreeLabel,
|
|
@@ -23,7 +23,7 @@ function ConfirmModal({
|
|
|
23
23
|
"yes/no": t("no"),
|
|
24
24
|
"ok/cancel": t("cancel")
|
|
25
25
|
};
|
|
26
|
-
return
|
|
26
|
+
return /* @__PURE__ */ jsxs(Modal, { isOpen, onModalClose: onCancel, id, size, children: [
|
|
27
27
|
/* @__PURE__ */ jsx(Modal.Header, { onModalClose: onCancel, children: header }),
|
|
28
28
|
/* @__PURE__ */ jsx(Modal.Body, { children: body }),
|
|
29
29
|
/* @__PURE__ */ jsxs(Modal.Footer, { children: [
|
|
@@ -31,9 +31,7 @@ function WorkspaceFolders({
|
|
|
31
31
|
setSelectedFolderId(newSelectedFolderId);
|
|
32
32
|
const canCopyFileInto = folderId === WORKSPACE_USER_FOLDER_ID || canCopyFileIntoFolder(folderId) && folderId !== WORKSPACE_SHARED_FOLDER_ID;
|
|
33
33
|
setCanCreateFolderIntoSelectedFolder(canCopyFileInto), onFolderSelected(newSelectedFolderId, canCopyFileInto);
|
|
34
|
-
}
|
|
35
|
-
console.log("canCreateFolderIntoSelectedFolder:", canCreateFolderIntoSelectedFolder);
|
|
36
|
-
const handleNewFolderClick = () => {
|
|
34
|
+
}, handleNewFolderClick = () => {
|
|
37
35
|
setShowNewFolderForm(!0);
|
|
38
36
|
};
|
|
39
37
|
return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs("div", { className: "d-flex flex-column gap-12", children: [
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@edifice.io/react",
|
|
3
|
-
"version": "2.2.3-develop-b2school.
|
|
3
|
+
"version": "2.2.3-develop-b2school.20250423112933",
|
|
4
4
|
"description": "Edifice React Library",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"react",
|
|
@@ -118,9 +118,9 @@
|
|
|
118
118
|
"react-slugify": "^3.0.3",
|
|
119
119
|
"swiper": "^10.1.0",
|
|
120
120
|
"ua-parser-js": "^1.0.36",
|
|
121
|
-
"@edifice.io/bootstrap": "2.2.3-develop-b2school.
|
|
122
|
-
"@edifice.io/
|
|
123
|
-
"@edifice.io/
|
|
121
|
+
"@edifice.io/bootstrap": "2.2.3-develop-b2school.20250423112933",
|
|
122
|
+
"@edifice.io/utilities": "2.2.3-develop-b2school.20250423112933",
|
|
123
|
+
"@edifice.io/tiptap-extensions": "2.2.3-develop-b2school.20250423112933"
|
|
124
124
|
},
|
|
125
125
|
"devDependencies": {
|
|
126
126
|
"@babel/plugin-transform-react-pure-annotations": "^7.23.3",
|
|
@@ -151,8 +151,8 @@
|
|
|
151
151
|
"vite": "^5.4.11",
|
|
152
152
|
"vite-plugin-dts": "^4.1.0",
|
|
153
153
|
"vite-tsconfig-paths": "^5.0.1",
|
|
154
|
-
"@edifice.io/client": "2.2.3-develop-b2school.
|
|
155
|
-
"@edifice.io/config": "2.2.3-develop-b2school.
|
|
154
|
+
"@edifice.io/client": "2.2.3-develop-b2school.20250423112933",
|
|
155
|
+
"@edifice.io/config": "2.2.3-develop-b2school.20250423112933"
|
|
156
156
|
},
|
|
157
157
|
"peerDependencies": {
|
|
158
158
|
"@react-spring/web": "^9.7.5",
|