@edifice.io/react 2.2.5-develop-b2school.20250515164909 → 2.2.5-develop-pedago.20250527155038

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.
Files changed (89) hide show
  1. package/dist/components/Button/Button.d.ts +1 -1
  2. package/dist/components/Button/Button.js +1 -1
  3. package/dist/components/Button/IconButton.js +1 -1
  4. package/dist/components/Combobox/Combobox.d.ts +5 -56
  5. package/dist/components/Combobox/Combobox.js +7 -16
  6. package/dist/components/Combobox/ComboboxTrigger.d.ts +2 -31
  7. package/dist/components/Combobox/ComboboxTrigger.js +8 -31
  8. package/dist/components/Dropdown/Dropdown.d.ts +2 -10
  9. package/dist/components/Dropdown/Dropdown.js +3 -5
  10. package/dist/components/Dropdown/DropdownItem.d.ts +1 -5
  11. package/dist/components/Dropdown/DropdownItem.js +1 -4
  12. package/dist/components/Dropdown/DropdownTrigger.js +1 -5
  13. package/dist/components/List/List.d.ts +1 -15
  14. package/dist/components/List/List.js +12 -15
  15. package/dist/components/SearchBar/SearchBar.d.ts +1 -1
  16. package/dist/components/SearchBar/SearchBar.js +1 -3
  17. package/dist/components/Table/components/Table.d.ts +2 -0
  18. package/dist/components/Table/components/Table.js +8 -2
  19. package/dist/components/Tabs/components/Tabs.d.ts +1 -1
  20. package/dist/components/Tabs/components/TabsItem.d.ts +5 -1
  21. package/dist/components/Tabs/components/TabsItem.js +6 -1
  22. package/dist/components/Toolbar/Toolbar.d.ts +0 -4
  23. package/dist/components/Toolbar/Toolbar.js +3 -8
  24. package/dist/components/Tree/components/Tree.js +2 -1
  25. package/dist/components/Tree/hooks/useTree.d.ts +1 -0
  26. package/dist/components/Tree/hooks/useTree.js +25 -2
  27. package/dist/components/Tree/types/index.d.ts +4 -0
  28. package/dist/editor.js +24 -28
  29. package/dist/hooks/index.d.ts +0 -1
  30. package/dist/hooks/useCheckable/useCheckable.js +3 -10
  31. package/dist/hooks/useConversation/useConversation.d.ts +1 -1
  32. package/dist/hooks/useConversation/useConversation.js +17 -13
  33. package/dist/hooks/useDate/useDate.d.ts +0 -1
  34. package/dist/hooks/useDate/useDate.js +27 -33
  35. package/dist/hooks/useDropdown/useDropdown.d.ts +1 -2
  36. package/dist/hooks/useDropdown/useDropdown.js +3 -5
  37. package/dist/hooks/useHttpErrorToast/useHttpErrorToast.js +3 -12
  38. package/dist/icons.js +212 -232
  39. package/dist/index.d.ts +0 -1
  40. package/dist/index.js +20 -50
  41. package/dist/modals.js +14 -16
  42. package/dist/modules/editor/components/Editor/Editor.d.ts +1 -8
  43. package/dist/modules/editor/components/Editor/Editor.js +3 -7
  44. package/dist/modules/editor/components/NodeView/index.d.ts +1 -2
  45. package/dist/modules/editor/components/Renderer/index.d.ts +1 -2
  46. package/dist/modules/editor/hooks/useTipTapEditor.d.ts +2 -6
  47. package/dist/modules/editor/hooks/useTipTapEditor.js +2 -2
  48. package/dist/modules/icons/components/index.d.ts +0 -10
  49. package/dist/modules/modals/index.d.ts +0 -1
  50. package/dist/modules/multimedia/Linker/InternalLinker/InternalLinker.js +6 -5
  51. package/dist/modules/multimedia/index.d.ts +0 -1
  52. package/dist/multimedia.js +1 -3
  53. package/package.json +6 -6
  54. package/dist/hooks/useWorkspaceFolders/index.d.ts +0 -3
  55. package/dist/hooks/useWorkspaceFolders/useWorkspaceFolders.js +0 -54
  56. package/dist/hooks/useWorkspaceFolders/useWorkspaceFoldersTree.d.ts +0 -13
  57. package/dist/hooks/useWorkspaceFolders/useWorkspaceFoldersTree.js +0 -51
  58. package/dist/modules/editor/components/NodeView/ConversationHistoryNodeView.d.ts +0 -2
  59. package/dist/modules/editor/components/NodeView/ConversationHistoryNodeView.js +0 -10
  60. package/dist/modules/editor/components/Renderer/ConversationHistoryRenderer.d.ts +0 -8
  61. package/dist/modules/editor/components/Renderer/ConversationHistoryRenderer.js +0 -28
  62. package/dist/modules/icons/components/IconFolderAdd.d.ts +0 -7
  63. package/dist/modules/icons/components/IconFolderAdd.js +0 -13
  64. package/dist/modules/icons/components/IconFolderDelete.d.ts +0 -7
  65. package/dist/modules/icons/components/IconFolderDelete.js +0 -12
  66. package/dist/modules/icons/components/IconGlobe2.d.ts +0 -7
  67. package/dist/modules/icons/components/IconGlobe2.js +0 -16
  68. package/dist/modules/icons/components/IconGroupAvatar.d.ts +0 -7
  69. package/dist/modules/icons/components/IconGroupAvatar.js +0 -12
  70. package/dist/modules/icons/components/IconMailRecall.d.ts +0 -7
  71. package/dist/modules/icons/components/IconMailRecall.js +0 -13
  72. package/dist/modules/icons/components/IconQuestionMark.d.ts +0 -7
  73. package/dist/modules/icons/components/IconQuestionMark.js +0 -13
  74. package/dist/modules/icons/components/IconReadMail.d.ts +0 -7
  75. package/dist/modules/icons/components/IconReadMail.js +0 -16
  76. package/dist/modules/icons/components/IconSignature.d.ts +0 -7
  77. package/dist/modules/icons/components/IconSignature.js +0 -13
  78. package/dist/modules/icons/components/IconUndoAll.d.ts +0 -7
  79. package/dist/modules/icons/components/IconUndoAll.js +0 -14
  80. package/dist/modules/icons/components/IconUnreadMail.d.ts +0 -7
  81. package/dist/modules/icons/components/IconUnreadMail.js +0 -16
  82. package/dist/modules/modals/ConfirmModal/ConfirmModal.d.ts +0 -47
  83. package/dist/modules/modals/ConfirmModal/ConfirmModal.js +0 -37
  84. package/dist/modules/modals/ConfirmModal/index.d.ts +0 -1
  85. package/dist/modules/multimedia/WorkspaceFolders/WorkspaceFolders.d.ts +0 -8
  86. package/dist/modules/multimedia/WorkspaceFolders/WorkspaceFolders.js +0 -55
  87. package/dist/modules/multimedia/WorkspaceFolders/components/NewFolderForm.d.ts +0 -16
  88. package/dist/modules/multimedia/WorkspaceFolders/components/NewFolderForm.js +0 -39
  89. package/dist/modules/multimedia/WorkspaceFolders/index.d.ts +0 -1
@@ -25,7 +25,7 @@ export interface ButtonProps extends React.ComponentPropsWithRef<'button'> {
25
25
  /**
26
26
  * Does it has a text ?
27
27
  */
28
- children?: ReactNode;
28
+ children: ReactNode;
29
29
  /**
30
30
  * Display Icon Component to the left
31
31
  */
@@ -19,7 +19,7 @@ const Button = /* @__PURE__ */ forwardRef(({
19
19
  const classes = clsx("btn", {
20
20
  [`btn-filled btn-${color}`]: variant === "filled",
21
21
  [`btn-${variant}-${color}`]: variant === "outline" || variant === "ghost",
22
- "btn-icon btn-sm": !children,
22
+ "btn-icon": !children,
23
23
  "btn-loading": isLoading,
24
24
  "btn-lg": size === "lg",
25
25
  "btn-sm": size === "sm"
@@ -11,7 +11,7 @@ const IconButton = /* @__PURE__ */ forwardRef(({
11
11
  ...restProps,
12
12
  className: clsx("btn-icon btn-sm", className)
13
13
  };
14
- return /* @__PURE__ */ jsx(Button, { ref, ...buttonProps, leftIcon: icon });
14
+ return /* @__PURE__ */ jsx(Button, { ref, ...buttonProps, children: icon });
15
15
  });
16
16
  export {
17
17
  IconButton as default
@@ -1,21 +1,13 @@
1
- import { ChangeEvent, KeyboardEvent, ReactNode } from 'react';
1
+ import { ChangeEvent } from 'react';
2
2
  export interface ComboboxProps extends React.InputHTMLAttributes<HTMLInputElement> {
3
+ onSearchResultsChange: (model: (string | number)[]) => void;
3
4
  onSearchInputChange: (event: ChangeEvent<HTMLInputElement>) => void;
4
5
  options: OptionListItemType[];
5
6
  value: string;
6
7
  isLoading: boolean;
7
8
  noResult: boolean;
8
- onSearchResultsChange?: (model: (string | number)[]) => void;
9
- onSearchInputKeyUp?: (event: KeyboardEvent<HTMLInputElement>) => void;
10
9
  searchMinLength?: number;
11
10
  placeholder?: string;
12
- variant?: 'outline' | 'ghost';
13
- renderInputGroup?: ReactNode;
14
- renderList?: (items: OptionListItemType[]) => ReactNode;
15
- renderListItem?: (item: OptionListItemType) => ReactNode;
16
- renderSelectedItems?: ReactNode;
17
- renderNoResult?: ReactNode;
18
- hasDefault?: boolean;
19
11
  }
20
12
  export interface OptionListItemType {
21
13
  /**
@@ -25,58 +17,15 @@ export interface OptionListItemType {
25
17
  /**
26
18
  * Label
27
19
  */
28
- label?: string;
20
+ label: string;
29
21
  /**
30
22
  * Add an icon
31
23
  */
32
24
  icon?: any;
33
- /**
34
- * Display Separator or not
35
- */
36
- withSeparator?: boolean;
37
- /**
38
- * Disable option
39
- */
40
- disabled?: boolean;
41
25
  }
42
- /**
43
- * A component that combines an input field with a dropdown list of selectable options.
44
- *
45
- * @component
46
- * @example
47
- * ```tsx
48
- * <Combobox
49
- * onSearchResultsChange={(values) => console.log(values)}
50
- * onSearchInputChange={(e) => console.log(e.target.value)}
51
- * options={[{ value: '1', label: 'Option 1' }]}
52
- * value=""
53
- * isLoading={false}
54
- * noResult={false}
55
- * />
56
- * ```
57
- *
58
- * @param props - The component props
59
- * @param props.onSearchResultsChange - Callback fired when the selected values change
60
- * @param props.onSearchInputChange - Callback fired when the search input value changes
61
- * @param props.options - Array of options to display in the dropdown
62
- * @param props.value - Current value of the search input
63
- * @param props.isLoading - Whether the component is in a loading state
64
- * @param props.noResult - Whether to show a "no results" message
65
- * @param props.searchMinLength - Minimum number of characters required to trigger search
66
- * @param props.placeholder - Placeholder text for the input field
67
- * @param props.variant - Visual variant of the input ('outline' or 'ghost')
68
- * @param props.renderInputGroup - Custom render function for the input group
69
- * @param props.renderList - Custom render function for the dropdown list
70
- * @param props.renderListItem - Custom render function for each option item
71
- * @param props.renderSelectedItems - Custom render function for selected items
72
- * @param props.renderNoResult - Custom render function for no results message
73
- * @param props.hasDefault - Whether to show default options
74
- *
75
- * @extends {React.InputHTMLAttributes<HTMLInputElement>}
76
- */
77
26
  declare const Combobox: {
78
- ({ onSearchResultsChange, onSearchInputChange, onSearchInputKeyUp, options, value, isLoading, noResult, searchMinLength, placeholder, variant, renderInputGroup, renderList, renderListItem, renderSelectedItems, renderNoResult, }: ComboboxProps): import("react/jsx-runtime").JSX.Element;
79
- Trigger: ({ placeholder, value, searchMinLength, handleSearchInputChange, handleSearchInputKeyUp, renderInputGroup, variant, renderSelectedItems, hasDefault, }: import('./ComboboxTrigger').ComboboxTriggerProps) => import("react/jsx-runtime").JSX.Element;
27
+ ({ onSearchResultsChange, onSearchInputChange, options, value, isLoading, noResult, searchMinLength, placeholder, }: ComboboxProps): import("react/jsx-runtime").JSX.Element;
28
+ Trigger: ({ placeholder, value, searchMinLength, handleSearchInputChange, }: import('./ComboboxTrigger').ComboboxTriggerProps) => import("react/jsx-runtime").JSX.Element;
80
29
  displayName: string;
81
30
  };
82
31
  export default Combobox;
@@ -7,39 +7,30 @@ import Loading from "../Loading/Loading.js";
7
7
  const Combobox = ({
8
8
  onSearchResultsChange,
9
9
  onSearchInputChange,
10
- onSearchInputKeyUp,
11
10
  options,
12
11
  value,
13
12
  isLoading,
14
13
  noResult,
15
14
  searchMinLength,
16
- placeholder,
17
- variant = "outline",
18
- renderInputGroup,
19
- renderList,
20
- renderListItem,
21
- renderSelectedItems,
22
- renderNoResult
15
+ placeholder
23
16
  }) => {
24
17
  const {
25
18
  t
26
19
  } = useTranslation(), [localValue, setLocalValue] = useState([]);
27
20
  useEffect(() => {
28
- onSearchResultsChange == null || onSearchResultsChange(localValue);
21
+ onSearchResultsChange(localValue);
29
22
  }, [localValue]);
30
23
  const handleOptionClick = (value2) => {
31
24
  setLocalValue([value2]);
32
25
  }, renderContent = () => isLoading ? /* @__PURE__ */ jsxs("div", { className: "d-flex align-items-center p-4", children: [
33
26
  /* @__PURE__ */ jsx(Loading, { isLoading }),
34
27
  /* @__PURE__ */ jsx("span", { className: "ps-4", children: t("explorer.search.pending") })
35
- ] }) : noResult ? renderNoResult || /* @__PURE__ */ jsx("div", { className: "p-4", children: t("portal.no.result") }) : renderList ? renderList(options) : options.map((option, index) => /* @__PURE__ */ jsxs(Fragment, { children: [
36
- /* @__PURE__ */ jsx(Dropdown.Item, { type: "select", icon: option.icon, onClick: () => handleOptionClick(option.value), disabled: option.disabled, children: renderListItem ? renderListItem(option) : option.label }),
37
- (option.withSeparator || option.withSeparator === void 0) && index < options.length - 1 && /* @__PURE__ */ jsx(Dropdown.Separator, {})
28
+ ] }) : noResult ? /* @__PURE__ */ jsx("div", { className: "p-4", children: t("portal.no.result") }) : options.map((option, index) => /* @__PURE__ */ jsxs(Fragment, { children: [
29
+ /* @__PURE__ */ jsx(Dropdown.Item, { type: "select", icon: option.icon, onClick: () => handleOptionClick(option.value), children: option.label }),
30
+ index < options.length - 1 && /* @__PURE__ */ jsx(Dropdown.Separator, {})
38
31
  ] }, index));
39
- return /* @__PURE__ */ jsxs(Dropdown, { block: !0, focusOnVisible: !1, openOnSpace: !1, children: [
40
- /* @__PURE__ */ jsx(Combobox.Trigger, { placeholder, searchMinLength, handleSearchInputChange: onSearchInputChange, handleSearchInputKeyUp: (event) => {
41
- onSearchInputKeyUp == null || onSearchInputKeyUp(event);
42
- }, value, variant, renderInputGroup, renderSelectedItems, hasDefault: !!options.length }),
32
+ return /* @__PURE__ */ jsxs(Dropdown, { block: !0, children: [
33
+ /* @__PURE__ */ jsx(Combobox.Trigger, { placeholder, searchMinLength, handleSearchInputChange: onSearchInputChange, value }),
43
34
  /* @__PURE__ */ jsx(Dropdown.Menu, { children: renderContent() })
44
35
  ] });
45
36
  };
@@ -1,38 +1,9 @@
1
- import { ChangeEvent, KeyboardEvent, ReactNode } from 'react';
1
+ import { ChangeEvent } from 'react';
2
2
  export interface ComboboxTriggerProps extends React.ComponentPropsWithRef<'button'> {
3
3
  handleSearchInputChange: (event: ChangeEvent<HTMLInputElement>) => void;
4
- handleSearchInputKeyUp: (event: KeyboardEvent<HTMLInputElement>) => void;
5
4
  value: string;
6
5
  searchMinLength?: number;
7
6
  placeholder?: string;
8
- renderInputGroup?: React.ReactNode;
9
- variant?: 'outline' | 'ghost';
10
- renderSelectedItems?: ReactNode;
11
- hasDefault: boolean;
12
7
  }
13
- /**
14
- * A trigger component for the Combobox that handles user input and displays selected items.
15
- *
16
- * @component
17
- * @example
18
- * ```tsx
19
- * <ComboboxTrigger
20
- * value={searchValue}
21
- * handleSearchInputChange={(e) => setSearchValue(e.target.value)}
22
- * placeholder="Search..."
23
- * />
24
- * ```
25
- *
26
- * @param {object} props - Component props
27
- * @param {string} [props.placeholder] - Placeholder text for the search input
28
- * @param {string} [props.value=''] - Current value of the search input
29
- * @param {number} [props.searchMinLength=3] - Minimum number of characters required before showing dropdown
30
- * @param {(event: ChangeEvent<HTMLInputElement>) => void} props.handleSearchInputChange - Handler for input change events
31
- * @param {ReactNode} [props.renderInputGroup] - Optional content to render in the input group (e.g., icons)
32
- * @param {'outline' | 'ghost'} [props.variant='outline'] - Visual variant of the input
33
- * @param {ReactNode} [props.renderSelectedItems] - Optional content to render selected items
34
- *
35
- * @returns {JSX.Element} A form control containing an input field with optional input group and selected items
36
- */
37
- declare const ComboboxTrigger: ({ placeholder, value, searchMinLength, handleSearchInputChange, handleSearchInputKeyUp, renderInputGroup, variant, renderSelectedItems, hasDefault, }: ComboboxTriggerProps) => import("react/jsx-runtime").JSX.Element;
8
+ declare const ComboboxTrigger: ({ placeholder, value, searchMinLength, handleSearchInputChange, }: ComboboxTriggerProps) => import("react/jsx-runtime").JSX.Element;
38
9
  export default ComboboxTrigger;
@@ -1,6 +1,5 @@
1
- import { jsxs, jsx } from "react/jsx-runtime";
1
+ import { jsx } from "react/jsx-runtime";
2
2
  import { useEffect } from "react";
3
- import clsx from "clsx";
4
3
  import { useDropdownContext } from "../Dropdown/DropdownContext.js";
5
4
  import Input from "../Input/Input.js";
6
5
  import FormControl from "../Form/FormControl.js";
@@ -8,45 +7,23 @@ const ComboboxTrigger = ({
8
7
  placeholder,
9
8
  value = "",
10
9
  searchMinLength = 3,
11
- handleSearchInputChange,
12
- handleSearchInputKeyUp,
13
- renderInputGroup,
14
- variant = "outline",
15
- renderSelectedItems,
16
- hasDefault
10
+ handleSearchInputChange
17
11
  }) => {
18
12
  const {
19
13
  triggerProps,
20
14
  itemProps,
21
15
  setVisible
22
- } = useDropdownContext(), containerProps = {
16
+ } = useDropdownContext(), inputProps = {
23
17
  ...triggerProps,
24
- className: clsx("d-flex combobox-trigger", renderInputGroup ? "input-group flex-nowrap align-items-start" : "flex-wrap align-items-center", triggerProps.className),
25
- onClick: (event) => {
26
- event.stopPropagation();
27
- }
28
- }, inputProps = {
29
18
  role: "combobox",
30
- onChange: (event) => {
31
- handleSearchInputChange(event), setVisible(event.target.value.length >= searchMinLength);
19
+ onClick: () => {
20
+ value.length >= searchMinLength && setVisible(!0);
32
21
  },
33
- onClick: (event) => {
34
- const input = event.target;
35
- setVisible(input.value.length >= searchMinLength || hasDefault), input.focus();
36
- },
37
- onKeyUp: (event) => {
38
- handleSearchInputKeyUp == null || handleSearchInputKeyUp(event);
39
- }
40
- }, classNameVariant = variant === "ghost" ? " border-0" : "", classNameInput = clsx(classNameVariant, renderSelectedItems ? "flex-fill w-auto " : "");
22
+ onChange: handleSearchInputChange
23
+ };
41
24
  return useEffect(() => {
42
25
  setVisible(value.length >= searchMinLength);
43
- }, [value, searchMinLength]), /* @__PURE__ */ jsxs(FormControl, { id: "search", ...containerProps, children: [
44
- !!renderInputGroup && /* @__PURE__ */ jsx("label", { className: "input-group-text pe-0" + classNameVariant, htmlFor: triggerProps.id, children: renderInputGroup }),
45
- /* @__PURE__ */ jsxs("div", { className: "d-flex align-items-center flex-wrap flex-fill", children: [
46
- renderSelectedItems,
47
- /* @__PURE__ */ jsx(Input, { ...inputProps, className: classNameInput, noValidationIcon: !0, placeholder, size: "md", type: "search", onKeyDown: itemProps.onMenuItemKeyDown })
48
- ] })
49
- ] });
26
+ }, [setVisible, value, searchMinLength]), /* @__PURE__ */ jsx(FormControl, { className: "d-flex align-items-center", id: "search", children: /* @__PURE__ */ jsx(Input, { ...inputProps, className: "max-w-512", noValidationIcon: !0, placeholder, size: "md", type: "search", onKeyDown: itemProps.onMenuItemKeyDown }) });
50
27
  };
51
28
  export {
52
29
  ComboboxTrigger as default
@@ -32,14 +32,6 @@ export interface DropdownProps {
32
32
  * Whether the trigger is hovered or not.
33
33
  */
34
34
  isTriggerHovered?: boolean;
35
- /**
36
- * Whether to focus the first element when the dropdown is opened.
37
- */
38
- focusOnVisible?: boolean;
39
- /**
40
- * Whether to open the dropdown on space key press.
41
- */
42
- openOnSpace?: boolean;
43
35
  }
44
36
  export type DropdownMenuOptions = {
45
37
  /**
@@ -65,13 +57,13 @@ export type DropdownMenuOptions = {
65
57
  type: 'divider';
66
58
  };
67
59
  declare const Dropdown: {
68
- ({ children, block, overflow, noWrap, placement, extraTriggerKeyDownHandler, onToggle, isTriggerHovered, focusOnVisible, openOnSpace, }: DropdownProps): import("react/jsx-runtime").JSX.Element;
60
+ ({ children, block, overflow, noWrap, placement, extraTriggerKeyDownHandler, onToggle, isTriggerHovered, }: DropdownProps): import("react/jsx-runtime").JSX.Element;
69
61
  displayName: string;
70
62
  } & {
71
63
  Trigger: import('react').ForwardRefExoticComponent<Omit<import('./DropdownTrigger').DropdownTriggerProps, "ref"> & import('react').RefAttributes<HTMLButtonElement>>;
72
64
  Menu: import('react').ForwardRefExoticComponent<Omit<import('./DropdownMenu').DropdownMenuProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
73
65
  Item: {
74
- ({ type, icon, onClick, children, className, minWidth, disabled, ...restProps }: import('./DropdownItem').DropdownItemProps): import("react/jsx-runtime").JSX.Element;
66
+ ({ type, icon, onClick, children, className, minWidth, ...restProps }: import('./DropdownItem').DropdownItemProps): import("react/jsx-runtime").JSX.Element;
75
67
  displayName: string;
76
68
  };
77
69
  Separator: {
@@ -1,7 +1,6 @@
1
1
  import { jsx } from "react/jsx-runtime";
2
2
  import { useMemo, useEffect } from "react";
3
3
  import clsx from "clsx";
4
- import useDropdown from "../../hooks/useDropdown/useDropdown.js";
5
4
  import DropdownCheckboxItem from "./DropdownCheckboxItem.js";
6
5
  import { DropdownContext } from "./DropdownContext.js";
7
6
  import DropdownItem from "./DropdownItem.js";
@@ -10,6 +9,7 @@ import DropdownMenuGroup from "./DropdownMenuGroup.js";
10
9
  import DropdownRadioItem from "./DropdownRadioItem.js";
11
10
  import DropdownSeparator from "./DropdownSeparator.js";
12
11
  import DropdownTrigger from "./DropdownTrigger.js";
12
+ import useDropdown from "../../hooks/useDropdown/useDropdown.js";
13
13
  import useClickOutside from "../../hooks/useClickOutside/useClickOutside.js";
14
14
  const Root = ({
15
15
  children,
@@ -19,9 +19,7 @@ const Root = ({
19
19
  placement = "bottom-start",
20
20
  extraTriggerKeyDownHandler,
21
21
  onToggle,
22
- isTriggerHovered = !1,
23
- focusOnVisible = !0,
24
- openOnSpace = !0
22
+ isTriggerHovered = !1
25
23
  }) => {
26
24
  const {
27
25
  visible,
@@ -31,7 +29,7 @@ const Root = ({
31
29
  itemProps,
32
30
  itemRefs,
33
31
  setVisible
34
- } = useDropdown(placement, extraTriggerKeyDownHandler, isTriggerHovered, focusOnVisible, openOnSpace), ref = useClickOutside(() => {
32
+ } = useDropdown(placement, extraTriggerKeyDownHandler, isTriggerHovered), ref = useClickOutside(() => {
35
33
  setVisible(!1);
36
34
  }), value = useMemo(() => ({
37
35
  visible,
@@ -25,13 +25,9 @@ export interface DropdownItemProps {
25
25
  * Set minimum width in pixels
26
26
  */
27
27
  minWidth?: number;
28
- /**
29
- * Disabled status
30
- */
31
- disabled?: boolean;
32
28
  }
33
29
  declare const DropdownItem: {
34
- ({ type, icon, onClick, children, className, minWidth, disabled, ...restProps }: DropdownItemProps): import("react/jsx-runtime").JSX.Element;
30
+ ({ type, icon, onClick, children, className, minWidth, ...restProps }: DropdownItemProps): import("react/jsx-runtime").JSX.Element;
35
31
  displayName: string;
36
32
  };
37
33
  export default DropdownItem;
@@ -9,7 +9,6 @@ const DropdownItem = ({
9
9
  children,
10
10
  className,
11
11
  minWidth,
12
- disabled,
13
12
  ...restProps
14
13
  }) => {
15
14
  const {
@@ -21,11 +20,9 @@ const DropdownItem = ({
21
20
  onMenuItemMouseEnter,
22
21
  onMenuItemClick
23
22
  } = itemProps, handleOnClick = (event) => {
24
- disabled || (onClick == null || onClick(event), type === "action" && (onMenuItemClick(), event.stopPropagation()));
23
+ onClick == null || onClick(event), type === "action" && (onMenuItemClick(), event.stopPropagation());
25
24
  }, id = useId(), dropdownItem = clsx("dropdown-item", {
26
25
  focus: isFocused === id
27
- }, {
28
- "text-gray-600": disabled
29
26
  }, className), style = {
30
27
  ...minWidth && {
31
28
  minWidth: `${minWidth}px`
@@ -3,7 +3,6 @@ import { forwardRef } from "react";
3
3
  import clsx from "clsx";
4
4
  import SvgIconRafterUp from "../../modules/icons/components/IconRafterUp.js";
5
5
  import { useDropdownContext } from "./DropdownContext.js";
6
- import Badge from "../Badge/Badge.js";
7
6
  const DropdownTrigger = /* @__PURE__ */ forwardRef(({
8
7
  label,
9
8
  icon,
@@ -47,10 +46,7 @@ const DropdownTrigger = /* @__PURE__ */ forwardRef(({
47
46
  return /* @__PURE__ */ jsxs("button", { ref: forwardRef2, type: "button", disabled, ...mergedProps, children: [
48
47
  icon,
49
48
  label,
50
- badgeContent ? /* @__PURE__ */ jsx(Badge, { variant: {
51
- level: "info",
52
- type: "notification"
53
- }, children: badgeContent }) : !hideCarret && /* @__PURE__ */ jsx(SvgIconRafterUp, { width: 16, height: 16, className: "dropdown-toggle-caret" })
49
+ badgeContent ? /* @__PURE__ */ jsx("span", { className: "badge text-bg-secondary rounded-pill", children: badgeContent }) : !hideCarret && /* @__PURE__ */ jsx(SvgIconRafterUp, { width: 16, height: 16, className: "dropdown-toggle-caret" })
54
50
  ] });
55
51
  });
56
52
  export {
@@ -5,10 +5,6 @@ export type ListProps<T> = {
5
5
  * Toolbar data items
6
6
  */
7
7
  items?: ToolbarItem[];
8
- /**
9
- * Checkable list
10
- */
11
- isCheckable?: boolean;
12
8
  /**
13
9
  * Generic data
14
10
  */
@@ -21,17 +17,7 @@ export type ListProps<T> = {
21
17
  * Callback to get selected ids
22
18
  */
23
19
  onSelectedItems?: (selectedIds: string[]) => void;
24
- /**
25
- * Custom class name
26
- */
27
- className?: string;
28
- /**
29
- * Toolbar options
30
- */
31
- toolbarOptions?: {
32
- shouldHideLabelsOnMobile?: boolean;
33
- };
34
20
  };
35
21
  export declare const List: <T extends {
36
22
  _id: string;
37
- }>({ items, isCheckable, data, renderNode, onSelectedItems, className, toolbarOptions, }: ListProps<T>) => import("react/jsx-runtime").JSX.Element;
23
+ }>({ items, data, renderNode, onSelectedItems, }: ListProps<T>) => import("react/jsx-runtime").JSX.Element;
@@ -1,18 +1,15 @@
1
1
  import { jsxs, Fragment, jsx } from "react/jsx-runtime";
2
+ import { useMediaQuery } from "@uidotdev/usehooks";
2
3
  import clsx from "clsx";
3
4
  import { useEffect, Fragment as Fragment$1 } from "react";
4
5
  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 = ({
9
9
  items,
10
- isCheckable = !1,
11
10
  data,
12
11
  renderNode,
13
- onSelectedItems,
14
- className,
15
- toolbarOptions
12
+ onSelectedItems
16
13
  }) => {
17
14
  const {
18
15
  selectedItems,
@@ -20,15 +17,15 @@ const List = ({
20
17
  isIndeterminate,
21
18
  handleOnSelectAllItems,
22
19
  handleOnSelectItem
23
- } = useCheckable(data), {
24
- lg
25
- } = useBreakpoint();
20
+ } = useCheckable(data), isDesktopDevice = useMediaQuery("only screen and (min-width: 1024px)");
26
21
  return useEffect(() => {
27
22
  selectedItems && (onSelectedItems == null || onSelectedItems(selectedItems));
28
23
  }, [onSelectedItems, selectedItems]), /* @__PURE__ */ jsxs(Fragment, { children: [
29
- (items || isCheckable) && /* @__PURE__ */ jsxs(Fragment, { children: [
30
- /* @__PURE__ */ jsx("div", { className: clsx("list-header d-flex align-items-center gap-8 px-12", className), children: /* @__PURE__ */ jsxs(Fragment, { children: [
31
- /* @__PURE__ */ jsxs("div", { className: "d-flex align-items-center gap-8 py-12", children: [
24
+ items && /* @__PURE__ */ jsxs(Fragment, { children: [
25
+ /* @__PURE__ */ jsx("div", { className: clsx("d-flex align-items-center gap-8", {
26
+ "px-12": items
27
+ }), children: /* @__PURE__ */ jsxs(Fragment, { children: [
28
+ /* @__PURE__ */ jsxs("div", { className: "d-flex align-items-center gap-8", children: [
32
29
  /* @__PURE__ */ jsx(Checkbox, { checked: allItemsSelected, indeterminate: isIndeterminate, onChange: () => handleOnSelectAllItems(allItemsSelected) }),
33
30
  /* @__PURE__ */ jsxs("span", { children: [
34
31
  "(",
@@ -36,15 +33,15 @@ const List = ({
36
33
  ")"
37
34
  ] })
38
35
  ] }),
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
36
+ /* @__PURE__ */ jsx(Toolbar, { items, isBlock: !0, align: "left", variant: "no-shadow", className: clsx("gap-4 py-4", {
37
+ "px-0 ms-auto": !isDesktopDevice
41
38
  }) })
42
39
  ] }) }),
43
40
  /* @__PURE__ */ jsx("div", { className: "border-top" })
44
41
  ] }),
45
42
  /* @__PURE__ */ jsx("div", { className: "mt-8", children: data == null ? void 0 : data.map((node) => {
46
- const checked = selectedItems.includes(node._id);
47
- return /* @__PURE__ */ jsx(Fragment$1, { children: renderNode(node, /* @__PURE__ */ jsx(Checkbox, { checked, onChange: () => handleOnSelectItem(node._id), onClick: (event) => event.stopPropagation() }), checked) }, node._id);
43
+ const checkbox = /* @__PURE__ */ jsx(Checkbox, { checked: selectedItems.includes(node._id), onChange: () => handleOnSelectItem(node._id) }), checked = selectedItems.includes(node._id);
44
+ return /* @__PURE__ */ jsx(Fragment$1, { children: renderNode(node, checkbox, checked) }, node._id);
48
45
  }) })
49
46
  ] });
50
47
  };
@@ -1,6 +1,6 @@
1
1
  import { ChangeEvent } from 'react';
2
2
  import { Size } from '../../types';
3
- export interface BaseProps extends Omit<React.ComponentPropsWithoutRef<'input'>, 'size'> {
3
+ export interface BaseProps {
4
4
  /**
5
5
  * String or Template literal with React i18next namespace
6
6
  */
@@ -24,12 +24,10 @@ const SearchBar = ({
24
24
  "ps-48": isVariant
25
25
  }), handleClick = () => {
26
26
  onClick == null || onClick();
27
- }, handleKeyDown = (e) => {
28
- e.key === "Enter" && (e.preventDefault(), handleClick());
29
27
  };
30
28
  return /* @__PURE__ */ jsxs(FormControl, { id: "search-bar", className: searchbar, children: [
31
29
  isVariant && /* @__PURE__ */ jsx("div", { className: "position-absolute z-1 top-50 start-0 translate-middle-y border-0 ps-12 bg-transparent", children: /* @__PURE__ */ jsx(SvgIconSearch, {}) }),
32
- /* @__PURE__ */ jsx(FormControl.Input, { type: "search", placeholder: t(placeholder), size, noValidationIcon: !0, className: input, onChange, disabled, onKeyDown: handleKeyDown, ...restProps }),
30
+ /* @__PURE__ */ jsx(FormControl.Input, { type: "search", placeholder: t(placeholder), size, noValidationIcon: !0, className: input, onChange, disabled, ...restProps }),
33
31
  !isVariant && /* @__PURE__ */ jsx(SearchButton, { type: "submit", "aria-label": t("search"), icon: /* @__PURE__ */ jsx(SvgIconSearch, {}), className: "border-start-0", onClick: handleClick })
34
32
  ] });
35
33
  };
@@ -2,9 +2,11 @@ import { ReactNode } from 'react';
2
2
  export type TableRef = HTMLTableElement;
3
3
  export interface TableProps {
4
4
  children?: Array<React.ReactElement<HTMLTableSectionElement>> | any;
5
+ maxHeight?: string;
5
6
  }
6
7
  declare const Table: import('react').ForwardRefExoticComponent<{
7
8
  children: ReactNode;
9
+ maxHeight?: string;
8
10
  } & import('react').RefAttributes<HTMLTableElement>> & {
9
11
  Thead: {
10
12
  (props: React.HTMLAttributes<HTMLTableSectionElement>): import("react/jsx-runtime").JSX.Element;
@@ -6,8 +6,14 @@ import { TableTh } from "./TableTh.js";
6
6
  import { TableThead } from "./TableThead.js";
7
7
  import { TableTr } from "./TableTr.js";
8
8
  const Root = /* @__PURE__ */ forwardRef(({
9
- children
10
- }, ref) => /* @__PURE__ */ jsx("div", { className: "table-responsive", children: /* @__PURE__ */ jsx("table", { ref, className: "table align-middle mb-0", children }) })), Table = /* @__PURE__ */ Object.assign(Root, {
9
+ children,
10
+ maxHeight
11
+ }, ref) => /* @__PURE__ */ jsx("div", { className: "table-responsive", style: maxHeight ? {
12
+ maxHeight,
13
+ overflowY: "auto"
14
+ } : {}, children: /* @__PURE__ */ jsx("table", { ref, className: "table align-middle mb-0", style: {
15
+ overflow: maxHeight ? "visible" : "hidden"
16
+ }, children }) })), Table = /* @__PURE__ */ Object.assign(Root, {
11
17
  Thead: TableThead,
12
18
  Th: TableTh,
13
19
  Tbody: TableTbody,
@@ -24,7 +24,7 @@ export interface TabsProps {
24
24
  export declare const Tabs: {
25
25
  ({ defaultId, items, onChange, children }: TabsProps): import("react/jsx-runtime").JSX.Element;
26
26
  Item: {
27
- ({ icon, label, id, order, }: TabsItemProps & {
27
+ ({ icon, badge, label, id, order, }: TabsItemProps & {
28
28
  order: number;
29
29
  }): import("react/jsx-runtime").JSX.Element;
30
30
  displayName: string;
@@ -8,6 +8,10 @@ export interface TabsItemProps {
8
8
  * Item icon
9
9
  */
10
10
  icon: ReactNode;
11
+ /**
12
+ * Item badge
13
+ */
14
+ badge?: ReactNode;
11
15
  /**
12
16
  * Item label
13
17
  */
@@ -18,7 +22,7 @@ export interface TabsItemProps {
18
22
  content: ReactNode;
19
23
  }
20
24
  declare const TabsItem: {
21
- ({ icon, label, id, order, }: TabsItemProps & {
25
+ ({ icon, badge, label, id, order, }: TabsItemProps & {
22
26
  order: number;
23
27
  }): import("react/jsx-runtime").JSX.Element;
24
28
  displayName: string;
@@ -4,6 +4,7 @@ import { useTranslation } from "react-i18next";
4
4
  import { useTabsContext } from "../context/TabsContext.js";
5
5
  const TabsItem = ({
6
6
  icon,
7
+ badge,
7
8
  label,
8
9
  id,
9
10
  order
@@ -18,7 +19,11 @@ const TabsItem = ({
18
19
  } = useTranslation(), classes = clsx("nav-link d-inline-flex gap-8 border-0", activeTab === id ? "selected" : "");
19
20
  return /* @__PURE__ */ jsx("li", { className: "nav-item flex-shrink-0", role: "presentation", children: /* @__PURE__ */ jsxs("button", { ref: (el) => tabsRef.current[order] = el, type: "button", id: `tab-${id}`, className: classes, onClick: () => setSelectedTab(id), onKeyDown: (event) => onKeyDown(event), role: "tab", "aria-controls": `tabpanel-${id}`, "aria-selected": activeTab === id, tabIndex: activeTab === id ? 0 : -1, children: [
20
21
  icon,
21
- /* @__PURE__ */ jsx("small", { children: t(label) })
22
+ /* @__PURE__ */ jsxs("small", { children: [
23
+ t(label),
24
+ " ",
25
+ badge
26
+ ] })
22
27
  ] }) });
23
28
  };
24
29
  export {
@@ -71,10 +71,6 @@ 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;
78
74
  }
79
75
  export declare const Toolbar: import('react').ForwardRefExoticComponent<Omit<ToolbarProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
80
76
  export default Toolbar;
@@ -1,7 +1,6 @@
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";
5
4
  import { mergeRefs } from "../../utilities/refs/ref.js";
6
5
  import Tooltip from "../Tooltip/Tooltip.js";
7
6
  import Button from "../Button/Button.js";
@@ -13,12 +12,9 @@ const Toolbar = /* @__PURE__ */ forwardRef(({
13
12
  align = "space",
14
13
  isBlock = !1,
15
14
  ariaControls,
16
- className,
17
- shouldHideLabelsOnMobile = !1
15
+ className
18
16
  }, ref) => {
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, {
17
+ const [firstFocusableItemIndex, setFirstFocusableItemIndex] = useState(0), [a11yNavigationItems, setA11yNavigationItems] = useState([]), [firstA11yNavigationItem, setFirstA11yNavigationItem] = useState(), [lastA11yNavigationItem, setA11yNavigationLastItem] = useState(), divToolbarRef = useRef(), classes = clsx("toolbar z-1000 bg-white", className, {
22
18
  default: variant === "default",
23
19
  "no-shadow": variant === "no-shadow",
24
20
  "d-flex": isBlock,
@@ -61,12 +57,11 @@ const Toolbar = /* @__PURE__ */ forwardRef(({
61
57
  };
62
58
  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) => {
63
59
  if (item.visibility === "hide") return null;
64
- const hideLabel = shouldHideLabelsOnMobile && !lg;
65
60
  switch (item.type) {
66
61
  case "divider":
67
62
  return /* @__PURE__ */ jsx("div", { className: "toolbar-divider" }, item.name ?? index);
68
63
  case "button":
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);
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 ? item.props.color : "tertiary", variant: "ghost", tabIndex: index === firstFocusableItemIndex ? 0 : -1, onKeyDown: handleKeyDown }) }, item.name ?? index);
70
65
  case "icon":
71
66
  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);
72
67
  case "dropdown":