onekijs-ui 0.16.0 → 0.16.2

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 declare const _default: {
     <T = any, I extends import("./typings").ListItem<T> = import("./typings").ListItem<T>>(props: import("./typings").ListProps<T, I, import("./typings").ListState<T, I>, import("./typings").ListCollection<T, I, import("./typings").ListState<T, I>>>): JSX.Element;
     displayName: string;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ArrayListProps, ListItem } from '../typings';
 declare const ArrayListComponent: <T = any, I extends ListItem<T> = ListItem<T>>(props: ArrayListProps<T, I>) => JSX.Element;
 export default ArrayListComponent;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { CollectionListProps, ListItem } from '../typings';
 declare const CollectionListComponent: <T = any, I extends ListItem<T> = ListItem<T>>({ className, controller, height, ItemComponent, ItemLoadingComponent, ItemContentComponent, NotFoundComponent, itemHeight, preload, keyboardNavigable, increment, multiSelect, onItemActivate, onItemHighlight, onItemSelect, onItemDeactivate, onItemUnhighlight, onItemUnselect, paddingEnd, paddingStart, virtual, style, }: CollectionListProps<T, I, import("../typings").ListState<T, I>, import("../typings").ListCollection<T, I, import("../typings").ListState<T, I>>>) => JSX.Element;
 export default CollectionListComponent;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ListBodyProps, ListItem } from '../typings';
 declare const ListBodyComponent: <T = any, I extends ListItem<T> = ListItem<T>>({ bodyRef, className, height, items, ItemComponent, ItemLoadingComponent, ItemContentComponent, NotFoundComponent, keyboardNavigable, ListComponent, multiSelect, onItemActivate, onItemDeactivate, onItemSelect, onItemUnselect, onItemHighlight, onItemUnhighlight, parentRef, scrollToIndex, service, state, style, totalSize, virtualItems, VirtualListComponent, LoadingComponent, }: ListBodyProps<T, I, import("../typings").ListState<T, I>, import("../typings").ListCollection<T, I, import("../typings").ListState<T, I>>>) => JSX.Element | null;
 export default ListBodyComponent;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ListItem, ListProps } from '../typings';
 declare const _default: {
     <T = any, I extends ListItem<T> = ListItem<T>>(props: ListProps<T, I, import("../typings").ListState<T, I>, import("../typings").ListCollection<T, I, import("../typings").ListState<T, I>>>): JSX.Element;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ListItem, VirtualListProps } from '../typings';
 declare const VirtualListComponent: <T = any, I extends ListItem<T> = ListItem<T>>({ items, ItemComponent, ItemLoadingComponent, ItemContentComponent, onItemClick, onItemMouseEnter, onItemMouseLeave, virtualItems, }: VirtualListProps<T, I>) => JSX.Element;
 export default VirtualListComponent;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 declare const _default: {
     <T = any, I extends import("./typings").ListItem<T> = import("./typings").ListItem<T>>(props: import("./typings").ListProps<T, I, import("./typings").ListState<T, I>, import("./typings").ListCollection<T, I, import("./typings").ListState<T, I>>>): JSX.Element;
     displayName: string;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { FormSelectProps, SelectItem } from './typings';
 declare const _default: {
     <T = any, I extends SelectItem<T> = SelectItem<T>>(props: FormSelectProps<T, I>): JSX.Element;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ArraySelectProps, SelectItem } from '../typings';
 declare const ArraySelectComponent: <T = any, I extends SelectItem<T> = SelectItem<T>>(props: ArraySelectProps<T, I>) => JSX.Element;
 export default ArraySelectComponent;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ArrayTreeSelectProps, TreeSelectItem } from '../typings';
 declare const ArrayTreeSelectComponent: <T = any, I extends TreeSelectItem<T> = TreeSelectItem<T>>(props: ArrayTreeSelectProps<T, I>) => JSX.Element;
 export default ArrayTreeSelectComponent;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ControllerSelectProps, SelectController, SelectItem, SelectState } from '../typings';
 declare const ControlledSelectComponent: <T = any, I extends SelectItem<T> = SelectItem<T>, S extends SelectState<T, I> = SelectState<T, I>, C extends SelectController<T, I, S> = SelectController<T, I, S>>({ attachDropdownToBody, className, placeholder, controller, InputComponent, IconComponent, OptionContentComponent, OptionComponent, OptionLoadingComponent, MultiOptionsComponent, NotFoundComponent, autoFocus, value, onChange, onBlur: forwardBlur, onFocus: forwardFocus, height, multiple, status, size, nullable, minChars, openOnFocus, searchable, dropdownWidthModifier, preload, increment, animationMs, disabled, defaultValue, required, sameWidth, overscan, clickable, ListComponent, autoCompleteSearch, }: ControllerSelectProps<T, I, S, C>) => JSX.Element;
 export default ControlledSelectComponent;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { SelectController, SelectItem, SelectProps, SelectState } from '../typings';
 declare const _default: {
     <T = any, I extends SelectItem<T> = SelectItem<T>, S extends SelectState<T, I> = SelectState<T, I>, C extends SelectController<T, I, S> = SelectController<T, I, S>>(props: SelectProps<T, I, S, C>): JSX.Element;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ListItemProps } from '../../list/typings';
 import { SelectItem } from '../typings';
 export declare const SelectOptionContent: <T, I extends SelectItem<T> = SelectItem<T>>({ item }: ListItemProps<T, I>) => JSX.Element;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { SelectItem, SelectTokenProps } from '../typings';
 declare const _default: {
     <T, I extends SelectItem<T> = SelectItem<T>>({ token, onRemove, index, }: SelectTokenProps<T, I>): JSX.Element;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { SelectItem, SelectTokensProps } from '../typings';
 declare const _default: {
     <T, I extends SelectItem<T> = SelectItem<T>>({ tokens, onRemove, }: SelectTokensProps<T, I>): JSX.Element | null;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { TreeSelectController, TreeSelectItem, TreeSelectProps, TreeSelectState } from '../typings';
 declare const _default: {
     <T = any, I extends TreeSelectItem<T> = TreeSelectItem<T>, S extends TreeSelectState<T, I> = TreeSelectState<T, I>, C extends TreeSelectController<T, I, S> = TreeSelectController<T, I, S>>(props: TreeSelectProps<T, I, S, C>): JSX.Element;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ListItemProps } from '../../list/typings';
 import { TreeSelectItem } from '../typings';
 export declare const TreeSelectOptionContent: <T, I extends TreeSelectItem<T> = TreeSelectItem<T>>(props: ListItemProps<T, I>) => JSX.Element;

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

@@ -5,6 +5,7 @@ import { DropdownWidthModifier } from '../dropdown/typings';
 import { FieldLayoutProps } from '../field/typings';
 import { CollectionListProps, ListConfig, ListItem, ListItemAdaptee, ListItemHandler, ListItemProps, ListNotFoundProps, ListState, UseListOptions } from '../list/typings';
 import { TreeController, TreeItem, TreeProps, TreeState } from '../tree/typings';
+import SelectService from './SelectService';
 export declare type ArraySelectProps<T = any, I extends SelectItem<T> = SelectItem<T>> = SelectConfig<T, I> & {
     adapter?: SelectItemAdapter<T>;
     dataSource: T[] | [T, string][] | string;
@@ -75,7 +76,7 @@ export declare type SelectProps<T = any, I extends SelectItem<T> = SelectItem<T>
     dataSource?: T[] | [T, string][] | string;
     fetchOnce?: boolean;
 };
-export declare type SelectBroker<T, I extends SelectItem<T> = SelectItem<T>, S extends SelectState<T, I> = SelectState<T, I>, C extends SelectController<T, I, S> = SelectController<T, I, S>> = CollectionBroker<T, I, S, C> & {
+export declare type SelectBroker<T = any, I extends SelectItem<T> = SelectItem<T>, S extends SelectState<T, I> = SelectState<T, I>, C extends SelectController<T, I, S> = SelectController<T, I, S>> = CollectionBroker<T, I, S, C> & {
     setDefaultValue: (defaultValue: T | T[] | null | undefined, subscriberId?: string) => void;
 };
 export declare type SelectConfig<T = any, I extends SelectItem<T> = SelectItem<T>> = Omit<ListConfig<T, I>, 'ItemComponent'> & {
@@ -135,3 +136,4 @@ export declare type TreeSelectItem<T = any> = SelectItem<T> & TreeItem<T>;
 export declare type TreeSelectProps<T = any, I extends TreeSelectItem<T> = TreeSelectItem<T>, S extends TreeSelectState<T, I> = TreeSelectState<T, I>, C extends TreeSelectController<T, I, S> = TreeSelectController<T, I, S>> = SelectProps<T, I, S, C> & TreeProps<T, I, S, C>;
 export declare type TreeSelectState<T = any, I extends TreeSelectItem<T> = TreeSelectItem<T>> = SelectState<T, I> & TreeState<T, I>;
 export declare type UseSelectOptions<T, I extends SelectItem<T> = SelectItem<T>> = UseListOptions<T, I>;
+export declare type UseSelectController<T = any, I extends SelectItem<T> = SelectItem<T>> = (dataSource: T[] | [T, string][] | string | undefined, options?: UseSelectOptions<T, I>) => CollectionProxy<T, I, SelectState<T, I>, SelectService<T, I, SelectState<T, I>>>;

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

@@ -5,8 +5,9 @@ import { CheckboxProps } from '../checkbox/typings';
 import { FieldLayoutProps } from '../field/typings';
 import { InputProps } from '../input/typings';
 import { ListItemProps, ListItems, ListNotFoundProps, ListState, UseListOptions } from '../list/typings';
-import { SelectBroker, SelectItem, SelectProps } from '../select/typings';
+import { FormSelectProps, SelectBroker, SelectItem, SelectProps } from '../select/typings';
 import { TextareaProps } from '../textarea/typings';
+import TableService from './TableService';
 export declare type ArrayTableProps<T = any, I extends TableItem<T> = TableItem<T>> = TableConfig<T, I> & {
     adapter?: TableItemAdapter<T>;
     columns?: TableColumn<T, I>[];
@@ -233,6 +234,8 @@ export declare type InputColumnOptions<T = any, I extends TableItem<T> = TableIt
 };
 export declare type SelectColumnOptions<T = any, S = any, TI extends TableItem<T> = TableItem<T>, SI extends SelectItem<S> = SelectItem<S>> = Omit<TableColumnSpec<T, TI>, 'CellComponent' | 'id'> & Omit<SelectProps<S, SI>, 'className' | 'onFocus' | 'onChange' | 'onBlur' | 'items'> & Omit<FormFieldProps, 'name'> & UseCollectionOptions<S, SI> & {
     CellComponent?: SelectCell<T, S, TI, SI>;
+} & {
+    Component?: React.FC<FormSelectProps<S, SI>>;
 };
 export declare type TableColumnOptions<T = any, I extends TableItem<T> = TableItem<T>> = Omit<TableColumnSpec<T, I>, 'id'>;
 export declare type TextareaColumnOptions<T = any, I extends TableItem<T> = TableItem<T>> = Omit<TableColumnSpec<T, I>, 'CellComponent' | 'id'> & Omit<FormFieldProps, 'name'> & Omit<TextareaProps, 'className' | 'onFocus' | 'onChange' | 'onBlur'> & {
@@ -243,3 +246,4 @@ export declare type UseTableOptions<T = any, I extends TableItem<T> = TableItem<
     adapter?: TableItemAdapter<T>;
     selected?: T[];
 };
+export declare type UseTableController<T = any> = (dataSource: T[] | string | undefined, initialColumns: TableColumn<T, TableItem<T>>[] | undefined, options: UseTableOptions<T, TableItem<T>>) => CollectionProxy<T, TableItem<T>, TableState<T, TableItem<T>>, TableService<T, TableItem<T>, TableState<T, TableItem<T>>>>;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ArrayTreeProps, TreeItem } from '../typings';
 declare const ArrayTreeComponent: <T = any, I extends TreeItem<T> = TreeItem<T>>(props: ArrayTreeProps<T, I>) => JSX.Element;
 export default ArrayTreeComponent;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ControllerTreeProps, TreeItem } from '../typings';
 declare const ControllerTreeComponent: {
     <T = any, I extends TreeItem<T> = TreeItem<T>>({ controller, className, onActivate, onSelect, height, virtual, gap, TreeIconComponent, TreeItemComponent, TreeItemContentComponent, treeItemClassName, TreeTogglerComponent, paddingLeft, paddingRight, animate, keyboardNavigable, listRef, }: ControllerTreeProps<T, I, import("../typings").TreeState<T, I>, import("../typings").TreeController<T, I, import("../typings").TreeState<T, I>>>): JSX.Element;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ControllerTreeProps, TreeItem } from '../typings';
 declare const TreeBodyComponent: {
     <T = any, I extends TreeItem<T> = TreeItem<T>>({ className, controller, }: ControllerTreeProps<T, I, import("../typings").TreeState<T, I>, import("../typings").TreeController<T, I, import("../typings").TreeState<T, I>>>): JSX.Element;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { TreeItem, TreeProps } from '../typings';
 declare const _default: {
     <T = any, I extends TreeItem<T> = TreeItem<T>>(props: TreeProps<T, I, import("../typings").TreeState<T, I>, import("../typings").TreeController<T, I, import("../typings").TreeState<T, I>>>): JSX.Element;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ListItemProps } from '../../list/typings';
 import { TreeItem, TreeItemProps, TreeItemToggleProps } from '../typings';
 export declare const TreeItemToggler: <T = any, I extends TreeItem<T> = TreeItem<T>>({ item, onExpand, onCollapse, index, }: TreeItemToggleProps<T, I>) => JSX.Element | null;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { TreeItem, TreeListProps } from '../typings';
 declare const TreeListComponent: <T = any, I extends TreeItem<T> = TreeItem<T>>({ items, onItemClick, onItemMouseEnter, onItemMouseLeave, }: TreeListProps<T, I>) => JSX.Element;
 export default TreeListComponent;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ControllerTreeProps, TreeItem } from '../typings';
 declare const VirtualTreeBodyComponent: {
     <T = any, I extends TreeItem<T> = TreeItem<T>>({ className, controller, height, }: ControllerTreeProps<T, I, import("../typings").TreeState<T, I>, import("../typings").TreeController<T, I, import("../typings").TreeState<T, I>>>): JSX.Element;

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

@@ -1,4 +1,3 @@
-/// <reference types="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>) => JSX.Element;
 export default VirtualTreeListComponent;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 declare const _default: {
     <T = any, I extends import("./typings").TreeItem<T> = import("./typings").TreeItem<T>>(props: import("./typings").TreeProps<T, I, import("./typings").TreeState<T, I>, import("./typings").TreeController<T, I, import("./typings").TreeState<T, I>>>): JSX.Element;
     displayName: string;

package/dist/index.d.ts

@@ -104,7 +104,7 @@ export { default as TreeSelectComponent } from './components/select/components/T
 export { default as useSelectController } from './components/select/hooks/useSelectController';
 export { useSelectService } from './components/select/hooks/useSelectService';
 export { default as useTreeSelectController } from './components/select/hooks/useTreeSelectController';
-export { ArraySelectProps, ArrayTreeSelectProps, ControllerSelectProps, ControllerTreeSelectProps, FormSelectProps, SelectItemAdapter as SelectAdapter, SelectBroker, SelectConfig, SelectController, SelectGroup, SelectIconProps, SelectInputProps, SelectItem, SelectItemAdaptee, SelectListComponentProps, SelectNotFoundProps, SelectOptionHandler, SelectOptionProps, SelectOptionSelectionHandler, SelectProps, SelectState, SelectTokenProps, SelectTokensProps, TreeSelectController, TreeSelectItem, TreeSelectProps, TreeSelectState, UseSelectOptions, } from './components/select/typings';
+export { ArraySelectProps, ArrayTreeSelectProps, ControllerSelectProps, ControllerTreeSelectProps, FormSelectProps, SelectItemAdapter, SelectBroker, SelectConfig, SelectController, SelectGroup, SelectIconProps, SelectInputProps, SelectItem, SelectItemAdaptee, SelectListComponentProps, SelectNotFoundProps, SelectOptionHandler, SelectOptionProps, SelectOptionSelectionHandler, SelectProps, SelectState, SelectTokenProps, SelectTokensProps, TreeSelectController, TreeSelectItem, TreeSelectProps, TreeSelectState, UseSelectOptions, UseSelectController, } from './components/select/typings';
 export { findSelectItem, findSelectItemIndex, shouldCheckSelect } from './components/select/util';
 export { default as Tabs } from './components/tab';
 export { default as Tab } from './components/tab/components/Tab';
@@ -141,7 +141,7 @@ export { default as useSelectColumn } from './components/table/hooks/useSelectCo
 export { default as useTableController } from './components/table/hooks/useTableController';
 export { default as useTextColumn } from './components/table/hooks/useTextColumn';
 export { default as useTextareaColumn } from './components/table/hooks/useTextareaColumn';
-export { ArrayTableProps, Cell, CheckboxColumn, CheckboxColumnOptions, ControllerTableProps, EnumColumnOptions, FormTableContext, FormTableProps, InputColumn, InputColumnOptions, LinkColumnOptions, SelectCell, SelectColumn, SelectColumnOptions, TableBodyCellProps, TableBodyProps, TableBodyRowProps, TableColumn, TableColumnComputedWidth, TableColumnOptions, TableColumnSpec, TableColumnWidth, TableColumnsState, TableConfig, TableController, TableExpandedProps, TableFilterOperator, TableFilterOperatorProps, TableFooterCellProps, TableFooterProps, TableHeaderCellProps, TableHeaderProps, TableItem, TableItemAdaptee, TableItemAdapter, TableItems, TableNotFoundProps, TableProps, TableRowHandler, TableSortProps, TableState, TextareaColumn, TextareaColumnOptions, UseTableOptions, } from './components/table/typings';
+export { ArrayTableProps, Cell, CheckboxColumn, CheckboxColumnOptions, ControllerTableProps, EnumColumnOptions, FormTableContext, FormTableProps, InputColumn, InputColumnOptions, LinkColumnOptions, SelectCell, SelectColumn, SelectColumnOptions, TableBodyCellProps, TableBodyProps, TableBodyRowProps, TableColumn, TableColumnComputedWidth, TableColumnOptions, TableColumnSpec, TableColumnWidth, TableColumnsState, TableConfig, TableController, TableExpandedProps, TableFilterOperator, TableFilterOperatorProps, TableFooterCellProps, TableFooterProps, TableHeaderCellProps, TableHeaderProps, TableItem, TableItemAdaptee, TableItemAdapter, TableItems, TableNotFoundProps, TableProps, TableRowHandler, TableSortProps, TableState, TextareaColumn, TextareaColumnOptions, UseTableOptions, UseTableController, } from './components/table/typings';
 export { default as Tag } from './components/tag';
 export { default as TagComponent } from './components/tag/components/TagComponent';
 export { tagStyle } from './components/tag/style';

package/dist/index.js

@@ -4202,7 +4202,11 @@ function useVirtual({
     measurements: [],
   });
 
-  const { outerSize, scrollOffset, scrollToFn: defaultScrollToFn } = useScroll({
+  const {
+    outerSize,
+    scrollOffset,
+    scrollToFn: defaultScrollToFn,
+  } = useScroll({
     windowRef,
     parentRef,
     horizontal,
@@ -6116,6 +6120,15 @@ const SelectOptionComponent = (props) => {
         }
         return classNames.join(' ');
     }, [item, clickable, hoverable]);
+    const fixClickRef = React.useRef({
+        mouseDown: '',
+        clicked: false,
+    });
+    const onItemClick = React.useCallback((item, index) => {
+        if (!fixClickRef.current.clicked) {
+            clickable && onClick && item && onClick(item, index);
+        }
+    }, [clickable, onClick]);
     if (onekijsFramework.isItemLoading(item)) {
         return React__default["default"].createElement(OptionLoadingComponent, null);
     }
@@ -6123,9 +6136,9 @@ const SelectOptionComponent = (props) => {
         return null;
     return (React__default["default"].createElement(React__default["default"].Fragment, null,
         displayGroup && React__default["default"].createElement(OptionGroupComponent, { ...props }),
-        React__default["default"].createElement("div", { className: classNames, onMouseEnter: () => hoverable && onMouseEnter && item && onMouseEnter(item, index), onMouseLeave: () => hoverable && onMouseLeave && item && onMouseLeave(item, index), onClick: () => clickable && onClick && item && onClick(item, index) },
-            service.config?.multiple && (React__default["default"].createElement(Checkbox, { value: item?.selected ? true : false, onChange: () => clickable && onClick && item && onClick(item, index), color: "currentColor", className: "o-select-option-multiple-checkbox" })),
-            React__default["default"].createElement(OptionContentComponent, { ...props }))));
+        React__default["default"].createElement("div", { className: classNames, onClick: () => onItemClick(item, index), onMouseEnter: () => hoverable && onMouseEnter && item && onMouseEnter(item, index), onMouseLeave: () => hoverable && onMouseLeave && item && onMouseLeave(item, index) },
+            service.config?.multiple && (React__default["default"].createElement(Checkbox, { value: item?.selected ? true : false, onChange: () => onItemClick(item, index), color: "currentColor", className: "o-select-option-multiple-checkbox" })),
+            React__default["default"].createElement(OptionContentComponent, { ...props, onClick: () => onItemClick(item, index) }))));
 };
 SelectOptionComponent.displayName = 'SelectOptionComponent';
 var SelectOptionComponent$1 = React__default["default"].memo(SelectOptionComponent);
@@ -6149,41 +6162,80 @@ const ControlledSelectComponent = ({ attachDropdownToBody = false, className = '
     const [focus, setFocus] = React.useState(false);
     const stateRef = React.useRef({});
     const service = controller.asService();
-    service.config = {
-        attachDropdownToBody,
-        className,
-        placeholder,
-        InputComponent,
-        IconComponent,
-        OptionContentComponent,
-        OptionComponent,
-        OptionLoadingComponent,
-        MultiOptionsComponent,
-        NotFoundComponent,
-        autoFocus,
-        value,
-        onChange,
-        onBlur: forwardBlur,
-        onFocus: forwardFocus,
-        height,
-        multiple,
-        status,
-        size,
-        nullable,
-        minChars,
-        openOnFocus,
-        searchable,
-        clickable,
-        dropdownWidthModifier,
-        preload,
-        increment,
-        animationMs,
-        disabled,
-        defaultValue,
-        sameWidth,
-        overscan,
-        autoCompleteSearch,
-    };
+    if (!service.config) {
+        service.config = {
+            attachDropdownToBody,
+            className,
+            placeholder,
+            InputComponent,
+            IconComponent,
+            OptionContentComponent,
+            OptionComponent,
+            OptionLoadingComponent,
+            MultiOptionsComponent,
+            NotFoundComponent,
+            autoFocus,
+            value,
+            onChange,
+            onBlur: forwardBlur,
+            onFocus: forwardFocus,
+            height,
+            multiple,
+            status,
+            size,
+            nullable,
+            minChars,
+            openOnFocus,
+            searchable,
+            clickable,
+            dropdownWidthModifier,
+            preload,
+            increment,
+            animationMs,
+            disabled,
+            defaultValue,
+            sameWidth,
+            overscan,
+            autoCompleteSearch,
+        };
+    }
+    else {
+        service.config = {
+            attachDropdownToBody,
+            className,
+            placeholder,
+            InputComponent: service.config.InputComponent,
+            IconComponent: service.config.IconComponent,
+            OptionContentComponent: service.config.OptionContentComponent,
+            OptionComponent: service.config.OptionComponent,
+            OptionLoadingComponent: service.config.OptionLoadingComponent,
+            MultiOptionsComponent: service.config.MultiOptionsComponent,
+            NotFoundComponent: service.config.NotFoundComponent,
+            autoFocus,
+            value,
+            onChange,
+            onBlur: forwardBlur,
+            onFocus: forwardFocus,
+            height,
+            multiple,
+            status,
+            size,
+            nullable,
+            minChars,
+            openOnFocus,
+            searchable,
+            clickable,
+            dropdownWidthModifier,
+            preload,
+            increment,
+            animationMs,
+            disabled,
+            defaultValue,
+            sameWidth,
+            overscan,
+            autoCompleteSearch,
+        };
+    }
     const id = React.useId();
     const loading = onekijsFramework.isCollectionLoading(controller);
     const fetching = onekijsFramework.isCollectionFetching(controller);
@@ -9869,13 +9921,14 @@ const SelectCellComponent = (options, broker) => {
         // if the id is empty, it's a single table column and the value is the row itself
         const name = column.id ? `${tableName}.${rowIndex}.${column.id}` : `${tableName}.${rowIndex}`;
         const className = typeof options.className === 'function' ? options.className(item, column, rowIndex) : options.className;
+        const Component = options.Component ?? FormSelect$1;
         React.useEffect(() => {
             broker.addSubscriber(name, service);
             return () => {
                 broker.removeSubscriber(name);
             };
         }, [name, service]);
-        return (React__default["default"].createElement(FormSelect$1, { size: "small", layout: "table", ...options, name: name, className: addClassname('o-table-select', className), controller: controller }));
+        return (React__default["default"].createElement(Component, { size: "small", layout: "table", ...options, name: name, className: addClassname('o-table-select', className), controller: controller }));
     };
     SelectCellComponent.displayName = 'SelectCellComponent';
     return SelectCellComponent;
@@ -10485,6 +10538,7 @@ const wizardStyle = ({ layout = 'vertical', theme, inModal }) => {
     .o-wizard-content {
       ${flexGrow(1)}
       ${padding('lg')}
+      ${paddingBottom(0)}
       ${paddingRight('3xl')}
     }