onekijs-ui 1.0.2 → 1.0.4

package/dist/components/list/typings.d.ts

@@ -77,7 +77,7 @@ export type ListConfig<T = any, I extends ListItem<T> = ListItem<T>> = {
     onItemUnselect?: ListItemHandler<T, I>;
     paddingEnd?: number;
     paddingStart?: number;
-    parentRef?: React.RefObject<HTMLDivElement>;
+    parentRef?: React.RefObject<HTMLDivElement | null>;
     overscan?: number;
     preload?: number;
     style?: React.CSSProperties;

package/dist/components/select/SelectService.d.ts

@@ -5,17 +5,17 @@ declare class SelectService<T = any, I extends SelectItem<T> = SelectItem<T>, S
     protected lastCheckQuery: Query | undefined;
     get defaultValue(): T | T[] | null | undefined;
     get defaultValueLoading(): boolean | undefined;
-    check(): Generator<void | import("redux-saga/effects").AllEffect<import("redux-saga/effects").CallEffect<Generator<I[] | Generator<void | import("redux-saga/effects").ForkEffect<Generator<void | import("redux-saga/effects").CallEffect<true>, void, unknown>> | import("redux-saga/effects").CancelEffect | CollectionFetcherResult<T> | Promise<CollectionFetcherResult<T> | undefined>, CollectionFetcherResult<T>, (import("redux-saga").Task<any> | null) & (CollectionFetcherResult<T> & (CollectionFetcherResult<T> | undefined))>, I | undefined, I[] & CollectionFetcherResult<T>>>> | import("redux-saga/effects").AllEffect<Generator<I[] | Generator<void | import("redux-saga/effects").ForkEffect<Generator<void | import("redux-saga/effects").CallEffect<true>, void, unknown>> | import("redux-saga/effects").CancelEffect | CollectionFetcherResult<T> | Promise<CollectionFetcherResult<T> | undefined>, CollectionFetcherResult<T>, (import("redux-saga").Task<any> | null) & (CollectionFetcherResult<T> & (CollectionFetcherResult<T> | undefined))>, I | undefined, I[] & CollectionFetcherResult<T>>> | import("redux-saga/effects").CallEffect<void>, void, (I | undefined)[]>;
+    check(): Generator<void | import("redux-saga/effects").AllEffect<import("redux-saga/effects").CallEffect<Generator<I[] | Generator<void | import("redux-saga/effects").CancelEffect | CollectionFetcherResult<T> | import("redux-saga/effects").ForkEffect<Generator<void | import("redux-saga/effects").CallEffect<true>, void, unknown>> | Promise<CollectionFetcherResult<T> | undefined>, CollectionFetcherResult<T>, (import("redux-saga").Task<any> | null) & (CollectionFetcherResult<T> & (CollectionFetcherResult<T> | undefined))>, I | undefined, I[] & CollectionFetcherResult<T>>>> | import("redux-saga/effects").AllEffect<Generator<I[] | Generator<void | import("redux-saga/effects").CancelEffect | CollectionFetcherResult<T> | import("redux-saga/effects").ForkEffect<Generator<void | import("redux-saga/effects").CallEffect<true>, void, unknown>> | Promise<CollectionFetcherResult<T> | undefined>, CollectionFetcherResult<T>, (import("redux-saga").Task<any> | null) & (CollectionFetcherResult<T> & (CollectionFetcherResult<T> | undefined))>, I | undefined, I[] & CollectionFetcherResult<T>>> | import("redux-saga/effects").CallEffect<void>, void, (I | undefined)[]>;
     get status(): CollectionStatus;
     setData(data: T[], query?: Query): void;
-    setDefaultValue(value: T | T[] | null | undefined): Generator<void | Generator<void | import("redux-saga/effects").AllEffect<import("redux-saga/effects").CallEffect<Generator<I[] | Generator<void | import("redux-saga/effects").ForkEffect<Generator<void | import("redux-saga/effects").CallEffect<true>, void, unknown>> | import("redux-saga/effects").CancelEffect | CollectionFetcherResult<T> | Promise<CollectionFetcherResult<T> | undefined>, CollectionFetcherResult<T>, (import("redux-saga").Task<any> | null) & (CollectionFetcherResult<T> & (CollectionFetcherResult<T> | undefined))>, I | undefined, I[] & CollectionFetcherResult<T>>>> | import("redux-saga/effects").AllEffect<Generator<I[] | Generator<void | import("redux-saga/effects").ForkEffect<Generator<void | import("redux-saga/effects").CallEffect<true>, void, unknown>> | import("redux-saga/effects").CancelEffect | CollectionFetcherResult<T> | Promise<CollectionFetcherResult<T> | undefined>, CollectionFetcherResult<T>, (import("redux-saga").Task<any> | null) & (CollectionFetcherResult<T> & (CollectionFetcherResult<T> | undefined))>, I | undefined, I[] & CollectionFetcherResult<T>>> | import("redux-saga/effects").CallEffect<void>, void, (I | undefined)[]>, void, unknown>;
+    setDefaultValue(value: T | T[] | null | undefined): Generator<void | Generator<void | import("redux-saga/effects").AllEffect<import("redux-saga/effects").CallEffect<Generator<I[] | Generator<void | import("redux-saga/effects").CancelEffect | CollectionFetcherResult<T> | import("redux-saga/effects").ForkEffect<Generator<void | import("redux-saga/effects").CallEffect<true>, void, unknown>> | Promise<CollectionFetcherResult<T> | undefined>, CollectionFetcherResult<T>, (import("redux-saga").Task<any> | null) & (CollectionFetcherResult<T> & (CollectionFetcherResult<T> | undefined))>, I | undefined, I[] & CollectionFetcherResult<T>>>> | import("redux-saga/effects").AllEffect<Generator<I[] | Generator<void | import("redux-saga/effects").CancelEffect | CollectionFetcherResult<T> | import("redux-saga/effects").ForkEffect<Generator<void | import("redux-saga/effects").CallEffect<true>, void, unknown>> | Promise<CollectionFetcherResult<T> | undefined>, CollectionFetcherResult<T>, (import("redux-saga").Task<any> | null) & (CollectionFetcherResult<T> & (CollectionFetcherResult<T> | undefined))>, I | undefined, I[] & CollectionFetcherResult<T>>> | import("redux-saga/effects").CallEffect<void>, void, (I | undefined)[]>, void, unknown>;
     setDefaultValueLoading(loading: boolean): void;
     setInputValue(value: string | null): Generator<void | T | Promise<T | null> | null, void, T>;
     setItemWidth(_item: I, value: number): void;
     setValue(value: null | T | T[]): void;
     setUrl(url: string, query?: Query): void;
     _buildItem(data: T | null | undefined, adaptee: unknown, context?: AnonymousObject): I;
-    _filterItem(item: I | undefined, query: Query, valid: boolean): Generator<I[] | Generator<void | import("redux-saga/effects").ForkEffect<Generator<void | import("redux-saga/effects").CallEffect<true>, void, unknown>> | import("redux-saga/effects").CancelEffect | CollectionFetcherResult<T> | Promise<CollectionFetcherResult<T> | undefined>, CollectionFetcherResult<T>, (import("redux-saga").Task<any> | null) & (CollectionFetcherResult<T> & (CollectionFetcherResult<T> | undefined))>, I | undefined, I[] & CollectionFetcherResult<T>>;
+    _filterItem(item: I | undefined, query: Query, valid: boolean): Generator<I[] | Generator<void | import("redux-saga/effects").CancelEffect | CollectionFetcherResult<T> | import("redux-saga/effects").ForkEffect<Generator<void | import("redux-saga/effects").CallEffect<true>, void, unknown>> | Promise<CollectionFetcherResult<T> | undefined>, CollectionFetcherResult<T>, (import("redux-saga").Task<any> | null) & (CollectionFetcherResult<T> & (CollectionFetcherResult<T> | undefined))>, I | undefined, I[] & CollectionFetcherResult<T>>;
     _compareItem(a: I | undefined, b: I | undefined): boolean;
     _doSearch(search: Primitive | undefined): boolean;
     _setDefaultValue(value: T | T[] | null | undefined): void;

package/dist/components/tree/components/VirtualTreeListComponent.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import { TreeItem, VirtualTreeListProps } from '../typings';
-declare const VirtualTreeListComponent: <T = any, I extends TreeItem<T> = TreeItem<T>>({ items, onItemClick, onItemMouseEnter, onItemMouseLeave, virtualItems, }: VirtualTreeListProps<T, I>) => React.JSX.Element;
+declare const VirtualTreeListComponent: <T extends any = any, I extends TreeItem<T> = TreeItem<T>>({ items, onItemClick, onItemMouseEnter, onItemMouseLeave, virtualItems, }: VirtualTreeListProps<T, I>) => React.JSX.Element;
 export default VirtualTreeListComponent;

package/dist/components/wizard/WizardModal.d.ts

@@ -1,4 +1,4 @@
-declare const WizardModal: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("../..").ModalProps & Omit<import("../..").TabsProps, "Component" | "TitleComponent" | "controller"> & {
+declare const WizardModal: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("../..").ModalProps & Omit<import("../..").TabsProps, "controller" | "TitleComponent" | "Component"> & {
     cancelLabel?: import("react").ReactNode;
     controller?: import("./WizardService").WizardService;
     Component?: import("onekijs-framework").FCC<Omit<import("./typings").WizardProps, "Component">>;
@@ -19,7 +19,7 @@ declare const WizardModal: import("styled-components/dist/types").IStyledCompone
     hasSummaryStep?: boolean;
 } & {
     children?: import("react").ReactNode | undefined;
-}, never> & Partial<Pick<import("../..").ModalProps & Omit<import("../..").TabsProps, "Component" | "TitleComponent" | "controller"> & {
+}, never> & Partial<Pick<import("../..").ModalProps & Omit<import("../..").TabsProps, "controller" | "TitleComponent" | "Component"> & {
     cancelLabel?: import("react").ReactNode;
     controller?: import("./WizardService").WizardService;
     Component?: import("onekijs-framework").FCC<Omit<import("./typings").WizardProps, "Component">>;

package/dist/components/wizard/index.d.ts

@@ -1,4 +1,4 @@
-declare const Wizard: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("../..").TabsProps, "Component" | "TitleComponent" | "controller"> & {
+declare const Wizard: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("../..").TabsProps, "controller" | "TitleComponent" | "Component"> & {
     cancelLabel?: import("react").ReactNode;
     controller?: import("./WizardService").WizardService;
     Component?: import("onekijs-framework").FCC<Omit<import("./typings").WizardProps, "Component">>;
@@ -19,7 +19,7 @@ declare const Wizard: import("styled-components/dist/types").IStyledComponentBas
     hasSummaryStep?: boolean;
 } & {
     children?: import("react").ReactNode | undefined;
-}, never> & Partial<Pick<Omit<import("../..").TabsProps, "Component" | "TitleComponent" | "controller"> & {
+}, never> & Partial<Pick<Omit<import("../..").TabsProps, "controller" | "TitleComponent" | "Component"> & {
     cancelLabel?: import("react").ReactNode;
     controller?: import("./WizardService").WizardService;
     Component?: import("onekijs-framework").FCC<Omit<import("./typings").WizardProps, "Component">>;

package/dist/index.js

@@ -1705,7 +1705,7 @@ const TooltipComponent = (props) => {
     const [show, setShow] = React.useState(true);
     const [open, setOpen] = React.useState(false);
     const arrowRef = React.useRef(null);
-    const { context, floatingStyles, middlewareData, refs } = react.useFloating({
+    const { context, floatingStyles, middlewareData, placement: resolvedPlacement, refs } = react.useFloating({
         open,
         onOpenChange: setOpen,
         placement,
@@ -1737,7 +1737,7 @@ const TooltipComponent = (props) => {
             document.removeEventListener('tooltipVisible', listener);
         };
     }, [uid]);
-    const element = (jsxRuntimeExports.jsxs("div", { ref: refs.setFloating, style: floatingStyles, ...getFloatingProps({ className: 'o-tooltip-container' }), children: [jsxRuntimeExports.jsx("div", { ref: arrowRef, className: "o-tooltip-arrow", style: { left: middlewareData.arrow?.x, top: middlewareData.arrow?.y } }), content] }));
+    const element = (jsxRuntimeExports.jsxs("div", { ref: refs.setFloating, style: floatingStyles, "data-popper-placement": resolvedPlacement, ...getFloatingProps({ className: 'o-tooltip-container' }), children: [jsxRuntimeExports.jsx("div", { ref: arrowRef, className: "o-tooltip-arrow", style: { left: middlewareData.arrow?.x, top: middlewareData.arrow?.y } }), content] }));
     if (attachToBody) {
         return (jsxRuntimeExports.jsxs("div", { ref: refs.setReference, ...getReferenceProps(), children: [children, show && open && content && ReactDOM.createPortal(jsxRuntimeExports.jsx("div", { className: classNames, children: element }), document.body)] }));
     }
@@ -5183,7 +5183,10 @@ const useElementScroll = ({ parentRef, horizontal, useObserver, initialRect }) =
     const [scrollOffset, setScrollOffset] = React.useState(0);
     const [element, setElement] = React.useState(parentRef.current);
     useIsomorphicLayoutEffect(() => {
-        setElement(parentRef.current);
+        const currentElement = parentRef.current;
+        if (currentElement !== element) {
+            setElement(currentElement);
+        }
     });
     useIsomorphicLayoutEffect(() => {
         if (!element) {
@@ -5220,7 +5223,10 @@ const useWindowRect = (windowRef, initialRect = { width: 0, height: 0 }) => {
     const [rect, setRect] = React.useState(initialRect);
     const [element, setElement] = React.useState(windowRef.current);
     useIsomorphicLayoutEffect(() => {
-        setElement(windowRef.current);
+        const currentElement = windowRef.current;
+        if (currentElement !== element) {
+            setElement(currentElement);
+        }
     });
     useIsomorphicLayoutEffect(() => {
         if (!element) {
@@ -5248,7 +5254,10 @@ const useWindowScroll = ({ windowRef, parentRef, horizontal, useWindowObserver,
     const rectKey = horizontal ? 'left' : 'top';
     const scrollKey = horizontal ? 'scrollX' : 'scrollY';
     useIsomorphicLayoutEffect(() => {
-        setElement(windowRef.current);
+        const currentElement = windowRef.current;
+        if (currentElement !== element) {
+            setElement(currentElement);
+        }
     });
     useIsomorphicLayoutEffect(() => {
         if (!element) {
@@ -5508,17 +5517,13 @@ const useListView = ({ controller, height, itemHeight = defaultItemHeight, overs
             return itemHeight(index) || defaultItemHeight;
         }
         return itemHeight;
-    }, 
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [itemHeight]);
+    }, [itemHeight]);
     // Trick for force recalcutate position without losing measurementCache
     // In the react-virtual code, the position are recalculate if the forceExtractor function change
     const forceKeyExtractor = React.useCallback((index) => {
         const fn = keyExtractor || defaultKeyExtractor;
         return fn(index);
-    }, 
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [keyExtractor, force]);
+    }, [keyExtractor, force]);
     const state = controller.state;
     const { totalSize, virtualItems, scrollToIndex, scrollToOffset } = useVirtual({
         size: state.total ? state.total : state.items?.length || 0,
@@ -5686,6 +5691,7 @@ const StandardListComponent = ({ items, ItemComponent = ListItemComponent$1, Ite
         }) }));
 };
 
+// eslint-disable-next-line @typescript-eslint/no-unnecessary-type-constraint
 const VirtualItemWrapper = ({ virtualItem, listItem, ItemComponent = ListItemComponent$1, ItemContentComponent = ListItemContent, ItemLoadingComponent = LoadingItem$1, onItemClick, onItemMouseEnter, onItemMouseLeave, }) => {
     const { index, measureRef, start } = virtualItem;
     const ref = React.useRef(null);
@@ -5724,6 +5730,7 @@ const VirtualItemWrapper = ({ virtualItem, listItem, ItemComponent = ListItemCom
             transform: `translateY(${start}px)`,
         }, children: jsxRuntimeExports.jsxs("div", { ref: ref, children: [listItem?.loadingStatus === onekijsFramework.LoadingStatus.Loading && jsxRuntimeExports.jsx(ItemLoadingComponent, {}), listItem?.loadingStatus !== onekijsFramework.LoadingStatus.Loading && listItem && listItem.data !== undefined && (jsxRuntimeExports.jsx(ItemComponent, { index: index, item: listItem, data: listItem.data, onClick: onItemClick, onMouseEnter: onItemMouseEnter, onMouseLeave: onItemMouseLeave, ItemContentComponent: ItemContentComponent }, `item-${listItem.uid || index}`))] }) }));
 };
+// eslint-disable-next-line @typescript-eslint/no-unnecessary-type-constraint
 const VirtualListComponent = ({ items, ItemComponent = ListItemComponent$1, ItemLoadingComponent = LoadingItem$1, ItemContentComponent = ListItemContent, onItemClick, onItemMouseEnter, onItemMouseLeave, virtualItems, }) => {
     return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: virtualItems.map((virtualItem) => {
             const listItem = items[virtualItem.index];
@@ -5745,6 +5752,7 @@ const findItemIndex = (items, uid) => {
         return i.uid === uid;
     });
 };
+// eslint-disable-next-line @typescript-eslint/no-unnecessary-type-constraint
 const ListBodyComponent = ({ autoRefresh, bodyRef, className, follow, height, items, ItemComponent = ListItemComponent$1, ItemLoadingComponent = LoadingItem$1, ItemContentComponent = ListItemContent, NotFoundComponent, keyboardNavigable, ListComponent = StandardListComponent, multiSelect, onItemActivate, onItemDeactivate, onItemSelect, onItemUnselect, onItemHighlight, onItemUnhighlight, parentRef, scrollToIndex, service, state, style, tail, totalSize, virtualItems, VirtualListComponent: VirtualListComponent$1 = VirtualListComponent, LoadingComponent = ListLoadingComponent$1, }) => {
     const scrollAlignRef = React.useRef('center');
     const lastActiveItemUid = React.useRef(undefined);
@@ -9122,12 +9130,15 @@ const TreeBodyComponent = ({ className, controller, NotFoundComponent, }) => {
 TreeBodyComponent.displayName = 'TreeBody';
 
 const timeout$1 = 500;
+// eslint-disable-next-line @typescript-eslint/no-unnecessary-type-constraint
 const VirtualTreeListItemComponent = ({ itemClassName, ItemComponent, virtualItem, onClick, onMouseEnter, onMouseLeave, }) => {
     const { index, measureRef, children, item } = virtualItem;
     const className = typeof itemClassName !== 'function' ? itemClassName : item ? itemClassName(item) : undefined;
     const service = useTreeService();
     const { animate } = useTreeConfig();
     const childrenRef = React.useRef(null);
+    const ref = React.useRef(null);
+    const previousHeightRef = React.useRef(undefined);
     const expand = (item, index) => {
         if (animate) {
             service.expanding(item, index);
@@ -9163,11 +9174,35 @@ const VirtualTreeListItemComponent = ({ itemClassName, ItemComponent, virtualIte
         }
     };
     const expanded = !!(item && isTreeItemExpanded(item, service));
-    return (jsxRuntimeExports.jsxs("div", { children: [jsxRuntimeExports.jsxs("div", { className: "o-virtual-item", ref: measureRef, children: [(!item || !item.data) && jsxRuntimeExports.jsx(LoadingItem$1, {}), item && item.data && (jsxRuntimeExports.jsx(DefaultTreeItemContext.Provider, { value: {
-                            onExpand: expand,
-                            onCollapse: collapse,
-                            className,
-                        }, children: jsxRuntimeExports.jsx(ItemComponent, { index: index, item: item, data: item.data, onClick: onClick, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave }, `item-${item?.uid || index}`) }))] }, `virtual-item-${item?.uid || index}`), jsxRuntimeExports.jsx(reactTransitionGroup.CSSTransition, { in: expanded, nodeRef: childrenRef, classNames: "o-tree-item-children", timeout: timeout$1, mountOnEnter: true, appear: false, unmountOnExit: true, onExiting: () => {
+    const measure = React.useCallback((el) => {
+        if (el?.offsetHeight !== previousHeightRef.current && el?.offsetHeight) {
+            previousHeightRef.current = el.offsetHeight;
+            measureRef(el);
+        }
+    }, [measureRef]);
+    const measureThrottle = onekijsFramework.useThrottle(measure, 50);
+    const resizeObserver = React.useMemo(() => {
+        return new ResizeObserver(() => {
+            measureThrottle(ref.current);
+        });
+    }, [measureThrottle]);
+    React.useEffect(() => {
+        const el = ref.current;
+        if (el) {
+            previousHeightRef.current = el.offsetHeight;
+            resizeObserver.observe(el);
+        }
+        return () => {
+            if (el) {
+                resizeObserver.unobserve(el);
+            }
+        };
+    }, [resizeObserver]);
+    return (jsxRuntimeExports.jsxs("div", { children: [jsxRuntimeExports.jsx("div", { className: "o-virtual-item", ref: measureRef, children: jsxRuntimeExports.jsxs("div", { ref: ref, children: [(!item || !item.data) && jsxRuntimeExports.jsx(LoadingItem$1, {}), item && item.data && (jsxRuntimeExports.jsx(DefaultTreeItemContext.Provider, { value: {
+                                onExpand: expand,
+                                onCollapse: collapse,
+                                className,
+                            }, children: jsxRuntimeExports.jsx(ItemComponent, { index: index, item: item, data: item.data, onClick: onClick, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave }, `item-${item?.uid || index}`) }))] }) }, `virtual-item-${item?.uid || index}`), jsxRuntimeExports.jsx(reactTransitionGroup.CSSTransition, { in: expanded, nodeRef: childrenRef, classNames: "o-tree-item-children", timeout: timeout$1, mountOnEnter: true, appear: false, unmountOnExit: true, onExiting: () => {
                     if (childrenRef.current)
                         onExiting(childrenRef.current);
                 }, onEntering: () => {
@@ -9177,6 +9212,7 @@ const VirtualTreeListItemComponent = ({ itemClassName, ItemComponent, virtualIte
                             return (jsxRuntimeExports.jsx(VirtualTreeListItemComponent, { virtualItem: child, ItemComponent: ItemComponent, onClick: onClick, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave }, `virtual-item-${child.item?.uid || child.index}`));
                         }) }) }) })] }));
 };
+// eslint-disable-next-line @typescript-eslint/no-unnecessary-type-constraint
 const VirtualTreeListComponent = ({ items, onItemClick, onItemMouseEnter, onItemMouseLeave, virtualItems, }) => {
     const logger = onekijsFramework.useLogger();
     logger.debug('virtualItems', virtualItems);
@@ -11045,7 +11081,7 @@ const DefaultDeleteRowComponent = ({ rowIndex }) => {
     };
     const metadata = onekijsFramework.useFormMetadata(tableName);
     let disabled = false;
-    if (metadata.readOnly || (metadata.editable === false && form.config.reconfigure)) {
+    if (metadata.disabled || metadata.readOnly || (metadata.editable === false && form.config.reconfigure)) {
         disabled = true;
     }
     return (jsxRuntimeExports.jsx("div", { className: `o-form-table-remove${disabled ? ' o-form-table-remove-disabled' : ''}`, onClick: removeRow, children: jsxRuntimeExports.jsx(RemoveIcon$1, { width: "14px", height: "14px" }) }));