@worknice/whiteboard 0.52.0 → 0.53.0

package/dist/presentation/RichList/RichListDisplayModal.js

@@ -0,0 +1,198 @@
+"use client";
+import * as __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__ from "react/jsx-runtime";
+import * as __WEBPACK_EXTERNAL_MODULE_react__ from "react";
+import * as __WEBPACK_EXTERNAL_MODULE__controls_Button_js_2f50b64a__ from "../../controls/Button.js";
+import * as __WEBPACK_EXTERNAL_MODULE__controls_FilterModal_js_c5dcd344__ from "../../controls/FilterModal.js";
+import * as __WEBPACK_EXTERNAL_MODULE__controls_FilterModal_module_js_3b5407aa__ from "../../controls/FilterModal.module.js";
+import * as __WEBPACK_EXTERNAL_MODULE__fields_BooleanField_js_6389bc93__ from "../../fields/BooleanField.js";
+import * as __WEBPACK_EXTERNAL_MODULE__fields_SimpleRadioSetField_js_bf559bf6__ from "../../fields/SimpleRadioSetField.js";
+import * as __WEBPACK_EXTERNAL_MODULE__forms_FormButtonSet_js_786d786e__ from "../../forms/FormButtonSet.js";
+import * as __WEBPACK_EXTERNAL_MODULE__forms_useForm_js_e95dafc7__ from "../../forms/useForm.js";
+import * as __WEBPACK_EXTERNAL_MODULE__inputs_SelectInput_js_a37c3c04__ from "../../inputs/SelectInput.js";
+import * as __WEBPACK_EXTERNAL_MODULE__Card_js_2e00482a__ from "../Card.js";
+import * as __WEBPACK_EXTERNAL_MODULE__HStack_js_5c2eb952__ from "../HStack.js";
+import * as __WEBPACK_EXTERNAL_MODULE__Icon_js_e5f9af80__ from "../Icon.js";
+import * as __WEBPACK_EXTERNAL_MODULE__Modal_js_91697624__ from "../Modal.js";
+import * as __WEBPACK_EXTERNAL_MODULE__PlainText_js_6d36b5d5__ from "../PlainText.js";
+import * as __WEBPACK_EXTERNAL_MODULE__VStack_js_6ebc0134__ from "../VStack.js";
+const NO_SORT_ID = "__richListNoSort__";
+function getDisplayFormActiveExpanderCount(hasSortForm, sorting, displayColumnRows) {
+    let n = 0;
+    if (hasSortForm && void 0 !== sorting[0]) n += 1;
+    if (displayColumnRows.some((c)=>c.visible !== c.defaultVisible)) n += 1;
+    return n;
+}
+const RichListDisplayModal = ({ onClose, sortableColumns, currentSorting, onApplySorting, displayColumns, onApplyColumnVisibility, defaultSorting, defaultColumnVisibility })=>{
+    const sortOptions = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>[
+            {
+                id: NO_SORT_ID,
+                label: "Default order"
+            },
+            ...sortableColumns
+        ], [
+        sortableColumns
+    ]);
+    const firstSort = currentSorting[0];
+    const initialSortColumnId = firstSort?.id ?? NO_SORT_ID;
+    const initialSortDesc = firstSort?.desc ?? false;
+    const initialVisibility = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>Object.fromEntries(displayColumns.map((c)=>[
+                c.id,
+                c.visible
+            ])), [
+        displayColumns
+    ]);
+    const { data, setData, status, submit } = (0, __WEBPACK_EXTERNAL_MODULE__forms_useForm_js_e95dafc7__["default"])({
+        initialValues: {
+            sortColumnId: initialSortColumnId,
+            sortDesc: initialSortDesc,
+            visibility: initialVisibility
+        },
+        onSubmit: async (values)=>{
+            const nextSort = values.sortColumnId && values.sortColumnId !== NO_SORT_ID ? [
+                {
+                    id: values.sortColumnId,
+                    desc: values.sortDesc
+                }
+            ] : [];
+            onApplySorting(nextSort);
+            onApplyColumnVisibility(values.visibility);
+        }
+    });
+    const sortColumnOption = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>sortOptions.find((o)=>o.id === data.sortColumnId) ?? sortOptions[0], [
+        data.sortColumnId,
+        sortOptions
+    ]);
+    const isSortActive = data.sortColumnId !== NO_SORT_ID;
+    const hasSortSection = sortableColumns.length > 0;
+    const hasDisplaySection = displayColumns.length > 0;
+    const handleReset = (0, __WEBPACK_EXTERNAL_MODULE_react__.useCallback)(()=>{
+        setData(()=>({
+                sortColumnId: defaultSorting[0]?.id ?? NO_SORT_ID,
+                sortDesc: defaultSorting[0]?.desc ?? false,
+                visibility: {
+                    ...defaultColumnVisibility
+                }
+            }));
+    }, [
+        defaultColumnVisibility,
+        defaultSorting,
+        setData
+    ]);
+    return /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__Modal_js_91697624__["default"], {
+        onClose: onClose,
+        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__Card_js_2e00482a__["default"], {
+            header: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__PlainText_js_6d36b5d5__["default"], {
+                font: "h6",
+                tagName: "h6",
+                children: "Display"
+            }),
+            footer: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsxs)(__WEBPACK_EXTERNAL_MODULE__HStack_js_5c2eb952__["default"], {
+                justify: "space-between",
+                children: [
+                    /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__controls_Button_js_2f50b64a__["default"], {
+                        type: "secondary",
+                        onClick: handleReset,
+                        icon: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__Icon_js_e5f9af80__["default"], {
+                            symbol: "Restore"
+                        }),
+                        disabled: !hasSortSection && !hasDisplaySection,
+                        children: "Reset"
+                    }),
+                    /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__forms_FormButtonSet_js_786d786e__["default"], {
+                        formStatus: status,
+                        primary: {
+                            action: async ()=>{
+                                submit();
+                                onClose();
+                            },
+                            label: "Apply"
+                        },
+                        secondary: {
+                            action: onClose,
+                            label: "Cancel",
+                            type: "ghost"
+                        }
+                    })
+                ]
+            }),
+            children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsxs)("div", {
+                className: __WEBPACK_EXTERNAL_MODULE__controls_FilterModal_module_js_3b5407aa__["default"].filterExpandersContainer,
+                children: [
+                    hasSortSection ? /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__controls_FilterModal_js_c5dcd344__.FilterExpander, {
+                        label: "Sort",
+                        highlight: isSortActive,
+                        defaultOpen: !hasDisplaySection || isSortActive,
+                        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsxs)(__WEBPACK_EXTERNAL_MODULE__VStack_js_6ebc0134__["default"], {
+                            spacing: "n2",
+                            justifyItems: "start",
+                            children: [
+                                /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__inputs_SelectInput_js_a37c3c04__["default"], {
+                                    id: "richListDisplaySortColumn",
+                                    options: sortOptions,
+                                    optionToId: (o)=>o.id,
+                                    optionToLabel: (o)=>o.label,
+                                    value: sortColumnOption,
+                                    onChange: (option)=>{
+                                        setData((prev)=>({
+                                                ...prev,
+                                                sortColumnId: option.id
+                                            }));
+                                    }
+                                }),
+                                /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__fields_SimpleRadioSetField_js_bf559bf6__["default"], {
+                                    id: "richListDisplaySortDirection",
+                                    label: "Direction",
+                                    options: [
+                                        {
+                                            id: "asc",
+                                            label: "Ascending"
+                                        },
+                                        {
+                                            id: "desc",
+                                            label: "Descending"
+                                        }
+                                    ],
+                                    value: data.sortDesc ? "desc" : "asc",
+                                    onChange: (id)=>{
+                                        setData((prev)=>({
+                                                ...prev,
+                                                sortDesc: "desc" === id
+                                            }));
+                                    },
+                                    disabled: !isSortActive
+                                })
+                            ]
+                        })
+                    }) : null,
+                    hasDisplaySection ? /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__controls_FilterModal_js_c5dcd344__.FilterExpander, {
+                        label: "Visible columns",
+                        highlight: displayColumns.some((c)=>data.visibility[c.id] !== c.defaultVisible),
+                        defaultOpen: hasDisplaySection && !hasSortSection,
+                        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
+                            className: __WEBPACK_EXTERNAL_MODULE__controls_FilterModal_module_js_3b5407aa__["default"].filterOptions,
+                            children: displayColumns.map((col)=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
+                                    className: __WEBPACK_EXTERNAL_MODULE__controls_FilterModal_module_js_3b5407aa__["default"].filterBooleanFieldWrapper,
+                                    children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__fields_BooleanField_js_6389bc93__["default"], {
+                                        id: `richListDisplayCol-${col.id}`,
+                                        label: col.label,
+                                        value: data.visibility[col.id] ?? col.visible,
+                                        onChange: (checked)=>{
+                                            setData((prev)=>({
+                                                    ...prev,
+                                                    visibility: {
+                                                        ...prev.visibility,
+                                                        [col.id]: checked
+                                                    }
+                                                }));
+                                        }
+                                    })
+                                }, col.id))
+                        })
+                    }) : null
+                ]
+            })
+        })
+    });
+};
+const RichListDisplayModal_rslib_entry_ = RichListDisplayModal;
+export { RichListDisplayModal_rslib_entry_ as default, getDisplayFormActiveExpanderCount };

package/dist/presentation/RichList/RichListRow.d.ts

@@ -0,0 +1,39 @@
+import { type Row, type Table } from "@tanstack/react-table";
+import { type CSSProperties, type MutableRefObject } from "react";
+import { type NormalizedSlot, type NormalizedTextField } from "./types";
+import { type RichListRowAction } from "./types";
+type Props<Type> = {
+    row: Row<Type>;
+    table: Table<Type>;
+    /** When the list has bulk actions, rows can be selected via the checkbox lane. */
+    enableRowSelection: boolean;
+    href: ((row: Type) => string) | undefined;
+    normalizedLeadingSlots: Array<NormalizedSlot<Type>>;
+    normalizedPrimary: NormalizedTextField<Type>;
+    normalizedSecondary: NormalizedTextField<Type> | null;
+    /**
+     * From `mainSlot.size`: max width (px) of the main-slot grid column (`--richlist-primary-track`).
+     */
+    mainSlotMaxWidthPx: number | undefined;
+    normalizedContentSlots: Array<NormalizedSlot<Type>>;
+    normalizedTrailingSlots: Array<NormalizedSlot<Type>>;
+    /**
+     * List width is at/under `RichList`’s `compactBreakpoint` — `compactSize` applies to
+     * leading/trailing (and not-yet-hidden content slot) widths when set.
+     */
+    isCompactContentSlots: boolean;
+    /**
+     * If `true`, the list row uses the “compact” main layout: middle **content** slot
+     * columns are hidden. Set when at compact and no content column renders at compact
+     * (none has `layoutVisibility` `"always"` or `"whenCompact"`).
+     */
+    rowMainHidesContentSlotColumns: boolean;
+    /** Flex `justify-content` for `.contentSlots`. */
+    contentSlotsJustifyContent: NonNullable<CSSProperties["justifyContent"]>;
+    actionsForRow: Array<RichListRowAction<Type>>;
+    maxAlwaysVisibleActions: number;
+    anyRowHasOverflowAction: boolean;
+    lastSelectedRowRef: MutableRefObject<Row<Type> | undefined>;
+};
+declare const RichListRow: <Type>({ row, table, enableRowSelection, href, normalizedLeadingSlots, normalizedPrimary, normalizedSecondary, mainSlotMaxWidthPx, normalizedContentSlots, normalizedTrailingSlots, isCompactContentSlots, rowMainHidesContentSlotColumns, contentSlotsJustifyContent, actionsForRow, maxAlwaysVisibleActions, anyRowHasOverflowAction, lastSelectedRowRef, }: Props<Type>) => import("react/jsx-runtime").JSX.Element;
+export default RichListRow;

package/dist/presentation/RichList/RichListRow.js

@@ -0,0 +1,278 @@
+"use client";
+import * as __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__ from "react/jsx-runtime";
+import * as __WEBPACK_EXTERNAL_MODULE_clsx__ from "clsx";
+import * as __WEBPACK_EXTERNAL_MODULE__controls_Button_js_2f50b64a__ from "../../controls/Button.js";
+import * as __WEBPACK_EXTERNAL_MODULE__controls_MenuButton_js_fa7c5c89__ from "../../controls/MenuButton.js";
+import * as __WEBPACK_EXTERNAL_MODULE__inputs_CheckboxInput_js_0c849015__ from "../../inputs/CheckboxInput.js";
+import * as __WEBPACK_EXTERNAL_MODULE__utils_useNextContext_js_c6ca8eb1__ from "../../utils/useNextContext.js";
+import * as __WEBPACK_EXTERNAL_MODULE__Icon_js_e5f9af80__ from "../Icon.js";
+import * as __WEBPACK_EXTERNAL_MODULE__helpers_js_87289b43__ from "./helpers.js";
+import * as __WEBPACK_EXTERNAL_MODULE__RichListRow_module_js_3bb1d324__ from "./RichListRow.module.js";
+function contentSlotAlignClass(align) {
+    switch(align){
+        case "end":
+            return __WEBPACK_EXTERNAL_MODULE__RichListRow_module_js_3bb1d324__["default"].contentSlotEnd;
+        case "center":
+            return __WEBPACK_EXTERNAL_MODULE__RichListRow_module_js_3bb1d324__["default"].contentSlotCenter;
+        default:
+            return __WEBPACK_EXTERNAL_MODULE__RichListRow_module_js_3bb1d324__["default"].contentSlotStart;
+    }
+}
+const RichListRow = ({ row, table, enableRowSelection, href, normalizedLeadingSlots, normalizedPrimary, normalizedSecondary, mainSlotMaxWidthPx, normalizedContentSlots, normalizedTrailingSlots, isCompactContentSlots, rowMainHidesContentSlotColumns, contentSlotsJustifyContent, actionsForRow, maxAlwaysVisibleActions, anyRowHasOverflowAction, lastSelectedRowRef })=>{
+    const { Link } = (0, __WEBPACK_EXTERNAL_MODULE__utils_useNextContext_js_c6ca8eb1__["default"])();
+    const rowOriginal = row.original;
+    const hrefValue = href ? href(rowOriginal) : void 0;
+    const alwaysVisibleActions = actionsForRow.filter((action)=>action.alwaysVisible);
+    const overflowActions = actionsForRow.filter((action)=>!action.alwaysVisible);
+    const alwaysVisiblePlaceholderCount = Math.max(0, maxAlwaysVisibleActions - alwaysVisibleActions.length);
+    const isSlotVisible = (slot)=>(table.getColumn(slot.id)?.getIsVisible() ?? true) && (0, __WEBPACK_EXTERNAL_MODULE__helpers_js_87289b43__.isVisibleAtBreakpoint)(slot.layoutVisibility, isCompactContentSlots);
+    const visibleContentSlots = normalizedContentSlots.filter(isSlotVisible);
+    const visibleLeadingSlots = normalizedLeadingSlots.filter(isSlotVisible);
+    const visibleTrailingSlots = normalizedTrailingSlots.filter(isSlotVisible);
+    const showPrimary = (0, __WEBPACK_EXTERNAL_MODULE__helpers_js_87289b43__.isVisibleAtBreakpoint)(normalizedPrimary.layoutVisibility, isCompactContentSlots);
+    const showSecondary = null !== normalizedSecondary && (0, __WEBPACK_EXTERNAL_MODULE__helpers_js_87289b43__.isVisibleAtBreakpoint)(normalizedSecondary.layoutVisibility, isCompactContentSlots);
+    const isLinkable = Boolean(hrefValue);
+    const bulkClickToSelect = enableRowSelection && !isLinkable && row.getCanSelect();
+    const isClickable = isLinkable || bulkClickToSelect;
+    const applyShiftSelection = ()=>{
+        if (!lastSelectedRowRef.current) return false;
+        const visibleRows = table.getRowModel().rows;
+        const visibleIndex = visibleRows.findIndex((r)=>r.id === row.id);
+        const lastIndex = visibleRows.findIndex((r)=>r.id === lastSelectedRowRef.current?.id);
+        if (-1 === visibleIndex || -1 === lastIndex) return false;
+        const startIndex = Math.min(lastIndex, visibleIndex);
+        const endIndex = Math.max(lastIndex, visibleIndex);
+        const target = !row.getIsSelected();
+        const rowsToSelect = visibleRows.slice(startIndex, endIndex + 1).filter((r)=>r.getCanSelect());
+        rowsToSelect.forEach((r)=>r.toggleSelected(target));
+        lastSelectedRowRef.current = row;
+        return true;
+    };
+    const handleClickableZoneClick = (event)=>{
+        if (!bulkClickToSelect) return;
+        if (event.shiftKey && applyShiftSelection()) return;
+        lastSelectedRowRef.current = row;
+        row.toggleSelected(!row.getIsSelected());
+    };
+    const contentSlotStyle = (slot)=>{
+        const isFixed = "fixed" === slot.columnWidthMode;
+        if (void 0 === slot.size) {
+            if (isFixed) return {
+                flex: "0 0 auto",
+                flexShrink: 0,
+                maxWidth: "100%",
+                minWidth: "min-content"
+            };
+            return {
+                flex: "1 2 0%",
+                minWidth: 0,
+                maxWidth: "100%"
+            };
+        }
+        const cap = isCompactContentSlots && void 0 !== slot.compactSize ? (0, __WEBPACK_EXTERNAL_MODULE__helpers_js_87289b43__.formatSlotSize)(slot.compactSize) : (0, __WEBPACK_EXTERNAL_MODULE__helpers_js_87289b43__.formatSlotSize)(slot.size);
+        if (isFixed) return {
+            boxSizing: "border-box",
+            flex: `0 0 ${cap}`,
+            flexShrink: 0,
+            maxWidth: cap,
+            minWidth: cap,
+            width: cap
+        };
+        return {
+            flex: `0 2 ${cap}`,
+            maxWidth: cap,
+            minWidth: 0
+        };
+    };
+    const trailingLaneStyle = (slot)=>{
+        if (void 0 === slot.size) return;
+        const cap = isCompactContentSlots && void 0 !== slot.compactSize ? (0, __WEBPACK_EXTERNAL_MODULE__helpers_js_87289b43__.formatSlotSize)(slot.compactSize) : (0, __WEBPACK_EXTERNAL_MODULE__helpers_js_87289b43__.formatSlotSize)(slot.size);
+        return {
+            boxSizing: "border-box",
+            flex: `0 0 ${cap}`,
+            maxWidth: cap,
+            minWidth: 0,
+            width: cap
+        };
+    };
+    const leadingLaneStyle = (slot)=>void 0 !== slot.size ? {
+            flex: `0 0 ${(0, __WEBPACK_EXTERNAL_MODULE__helpers_js_87289b43__.formatSlotSize)(slot.size)}`
+        } : void 0;
+    const rowMainStyle = void 0 !== mainSlotMaxWidthPx ? {
+        ["--richlist-primary-track"]: `${mainSlotMaxWidthPx}px`
+    } : void 0;
+    const rowOverlay = hrefValue ? /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(Link, {
+        className: __WEBPACK_EXTERNAL_MODULE__RichListRow_module_js_3bb1d324__["default"].rowLink,
+        href: hrefValue,
+        "aria-label": void 0
+    }) : null;
+    const bulkCheckboxId = `richlist-bulk-${row.id}`;
+    const handleCheckboxPaddingClick = (event)=>{
+        if (event.target !== event.currentTarget) return;
+        event.stopPropagation();
+        if (event.shiftKey) {
+            applyShiftSelection();
+            return;
+        }
+        lastSelectedRowRef.current = row;
+        row.toggleSelected(!row.getIsSelected());
+    };
+    const checkboxInput = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__inputs_CheckboxInput_js_0c849015__["default"], {
+        disabled: !row.getCanSelect(),
+        id: bulkCheckboxId,
+        value: row.getIsSelected(),
+        onClick: (event)=>{
+            if (event.shiftKey) applyShiftSelection();
+            lastSelectedRowRef.current = row;
+        },
+        onChange: (value)=>row.toggleSelected(value)
+    });
+    return /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("li", {
+        className: __WEBPACK_EXTERNAL_MODULE__RichListRow_module_js_3bb1d324__["default"].listItem,
+        "data-selected": row.getIsSelected() ? "" : void 0,
+        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsxs)("div", {
+            className: (0, __WEBPACK_EXTERNAL_MODULE_clsx__["default"])(__WEBPACK_EXTERNAL_MODULE__RichListRow_module_js_3bb1d324__["default"].row, isCompactContentSlots && __WEBPACK_EXTERNAL_MODULE__RichListRow_module_js_3bb1d324__["default"].rowListAtCompactBreakpoint),
+            children: [
+                enableRowSelection && row.getCanSelect() ? /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
+                    className: (0, __WEBPACK_EXTERNAL_MODULE_clsx__["default"])(__WEBPACK_EXTERNAL_MODULE__RichListRow_module_js_3bb1d324__["default"].checkboxLane, __WEBPACK_EXTERNAL_MODULE__RichListRow_module_js_3bb1d324__["default"].checkboxLaneFullTarget, row.getIsSelected() && __WEBPACK_EXTERNAL_MODULE__RichListRow_module_js_3bb1d324__["default"].checkboxLaneActive),
+                    onClick: (event)=>{
+                        event.stopPropagation();
+                        handleCheckboxPaddingClick(event);
+                    },
+                    children: checkboxInput
+                }) : null,
+                /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsxs)("div", {
+                    className: (0, __WEBPACK_EXTERNAL_MODULE_clsx__["default"])(__WEBPACK_EXTERNAL_MODULE__RichListRow_module_js_3bb1d324__["default"].clickableZone, isClickable && __WEBPACK_EXTERNAL_MODULE__RichListRow_module_js_3bb1d324__["default"].clickableZoneActive),
+                    onClick: bulkClickToSelect ? handleClickableZoneClick : void 0,
+                    children: [
+                        rowOverlay,
+                        visibleLeadingSlots.map((slot)=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
+                                className: __WEBPACK_EXTERNAL_MODULE__RichListRow_module_js_3bb1d324__["default"].leadingLane,
+                                style: leadingLaneStyle(slot),
+                                children: slot.render(rowOriginal)
+                            }, slot.id)),
+                        /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsxs)("div", {
+                            className: (0, __WEBPACK_EXTERNAL_MODULE_clsx__["default"])(__WEBPACK_EXTERNAL_MODULE__RichListRow_module_js_3bb1d324__["default"].rowMain, rowMainHidesContentSlotColumns && __WEBPACK_EXTERNAL_MODULE__RichListRow_module_js_3bb1d324__["default"].rowMainCompact),
+                            style: rowMainStyle,
+                            children: [
+                                /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsxs)("div", {
+                                    className: __WEBPACK_EXTERNAL_MODULE__RichListRow_module_js_3bb1d324__["default"].mainSlot,
+                                    children: [
+                                        showPrimary ? /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsxs)("span", {
+                                            className: __WEBPACK_EXTERNAL_MODULE__RichListRow_module_js_3bb1d324__["default"].primaryLine,
+                                            children: [
+                                                normalizedPrimary.prefixOnWide ? /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("span", {
+                                                    className: (0, __WEBPACK_EXTERNAL_MODULE_clsx__["default"])(__WEBPACK_EXTERNAL_MODULE__RichListRow_module_js_3bb1d324__["default"].mainSlotAdornment, __WEBPACK_EXTERNAL_MODULE__RichListRow_module_js_3bb1d324__["default"].textFieldAdornment),
+                                                    children: normalizedPrimary.prefixOnWide(rowOriginal)
+                                                }) : null,
+                                                /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("span", {
+                                                    className: __WEBPACK_EXTERNAL_MODULE__RichListRow_module_js_3bb1d324__["default"].primaryText,
+                                                    children: normalizedPrimary.render(rowOriginal)
+                                                }),
+                                                normalizedPrimary.suffixOnWide ? /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("span", {
+                                                    className: (0, __WEBPACK_EXTERNAL_MODULE_clsx__["default"])(__WEBPACK_EXTERNAL_MODULE__RichListRow_module_js_3bb1d324__["default"].mainSlotAdornment, __WEBPACK_EXTERNAL_MODULE__RichListRow_module_js_3bb1d324__["default"].textFieldAdornment),
+                                                    children: normalizedPrimary.suffixOnWide(rowOriginal)
+                                                }) : null
+                                            ]
+                                        }) : null,
+                                        showSecondary && normalizedSecondary ? /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsxs)("span", {
+                                            className: __WEBPACK_EXTERNAL_MODULE__RichListRow_module_js_3bb1d324__["default"].secondaryLine,
+                                            children: [
+                                                normalizedSecondary.prefixOnWide ? /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("span", {
+                                                    className: (0, __WEBPACK_EXTERNAL_MODULE_clsx__["default"])(__WEBPACK_EXTERNAL_MODULE__RichListRow_module_js_3bb1d324__["default"].mainSlotAdornment, __WEBPACK_EXTERNAL_MODULE__RichListRow_module_js_3bb1d324__["default"].textFieldAdornment),
+                                                    children: normalizedSecondary.prefixOnWide(rowOriginal)
+                                                }) : null,
+                                                /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("span", {
+                                                    className: __WEBPACK_EXTERNAL_MODULE__RichListRow_module_js_3bb1d324__["default"].secondaryText,
+                                                    children: normalizedSecondary.render(rowOriginal)
+                                                }),
+                                                normalizedSecondary.suffixOnWide ? /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("span", {
+                                                    className: (0, __WEBPACK_EXTERNAL_MODULE_clsx__["default"])(__WEBPACK_EXTERNAL_MODULE__RichListRow_module_js_3bb1d324__["default"].mainSlotAdornment, __WEBPACK_EXTERNAL_MODULE__RichListRow_module_js_3bb1d324__["default"].textFieldAdornment),
+                                                    children: normalizedSecondary.suffixOnWide(rowOriginal)
+                                                }) : null
+                                            ]
+                                        }) : null
+                                    ]
+                                }),
+                                visibleContentSlots.length > 0 ? /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
+                                    className: __WEBPACK_EXTERNAL_MODULE__RichListRow_module_js_3bb1d324__["default"].contentSlots,
+                                    style: {
+                                        justifyContent: contentSlotsJustifyContent
+                                    },
+                                    children: visibleContentSlots.map((slot)=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
+                                            className: (0, __WEBPACK_EXTERNAL_MODULE_clsx__["default"])(__WEBPACK_EXTERNAL_MODULE__RichListRow_module_js_3bb1d324__["default"].slotCell, __WEBPACK_EXTERNAL_MODULE__RichListRow_module_js_3bb1d324__["default"].contentSlot, contentSlotAlignClass(slot.align), "fixed" === slot.columnWidthMode && __WEBPACK_EXTERNAL_MODULE__RichListRow_module_js_3bb1d324__["default"].contentSlotFixed),
+                                            style: contentSlotStyle(slot),
+                                            children: slot.render(rowOriginal)
+                                        }, slot.id))
+                                }) : null
+                            ]
+                        }),
+                        visibleTrailingSlots.map((slot)=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
+                                className: (0, __WEBPACK_EXTERNAL_MODULE_clsx__["default"])(__WEBPACK_EXTERNAL_MODULE__RichListRow_module_js_3bb1d324__["default"].slotCell, __WEBPACK_EXTERNAL_MODULE__RichListRow_module_js_3bb1d324__["default"].trailingLane, contentSlotAlignClass(slot.align)),
+                                style: trailingLaneStyle(slot),
+                                children: slot.render(rowOriginal)
+                            }, slot.id))
+                    ]
+                }),
+                maxAlwaysVisibleActions > 0 ? /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsxs)("div", {
+                    className: __WEBPACK_EXTERNAL_MODULE__RichListRow_module_js_3bb1d324__["default"].actionsLane,
+                    onClick: (event)=>event.stopPropagation(),
+                    children: [
+                        alwaysVisibleActions.map((action)=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__controls_Button_js_2f50b64a__["default"], {
+                                id: action.id,
+                                type: "ghost",
+                                size: "small",
+                                icon: action.icon,
+                                tooltip: action.label,
+                                onClick: ()=>action.onClick(rowOriginal)
+                            }, action.id)),
+                        Array.from({
+                            length: alwaysVisiblePlaceholderCount
+                        }).map((_, index)=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
+                                "aria-hidden": true,
+                                className: __WEBPACK_EXTERNAL_MODULE__RichListRow_module_js_3bb1d324__["default"].actionPlaceholder,
+                                children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__controls_Button_js_2f50b64a__["default"], {
+                                    type: "ghost",
+                                    size: "small",
+                                    icon: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__Icon_js_e5f9af80__["default"], {
+                                        symbol: "Overflow"
+                                    })
+                                })
+                            }, `placeholder-${index}`))
+                    ]
+                }) : null,
+                anyRowHasOverflowAction ? /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
+                    className: __WEBPACK_EXTERNAL_MODULE__RichListRow_module_js_3bb1d324__["default"].overflowLane,
+                    onClick: (event)=>event.stopPropagation(),
+                    children: overflowActions.length > 0 ? /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__controls_MenuButton_js_fa7c5c89__["default"], {
+                        type: "ghost",
+                        size: "small",
+                        ariaLabel: "More actions",
+                        options: overflowActions.map((action)=>({
+                                id: action.id,
+                                label: action.label,
+                                icon: action.icon,
+                                type: "onClick",
+                                onClick: ()=>action.onClick(rowOriginal)
+                            })),
+                        icon: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__Icon_js_e5f9af80__["default"], {
+                            symbol: "Overflow"
+                        })
+                    }) : /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
+                        "aria-hidden": true,
+                        className: __WEBPACK_EXTERNAL_MODULE__RichListRow_module_js_3bb1d324__["default"].actionPlaceholder,
+                        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__controls_Button_js_2f50b64a__["default"], {
+                            type: "ghost",
+                            size: "small",
+                            icon: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__Icon_js_e5f9af80__["default"], {
+                                symbol: "Overflow"
+                            })
+                        })
+                    })
+                }) : null
+            ]
+        })
+    }, row.id);
+};
+const RichListRow_rslib_entry_ = RichListRow;
+export { RichListRow_rslib_entry_ as default };

package/dist/presentation/RichList/RichListRow.module.js

@@ -0,0 +1,34 @@
+import "./RichListRow_module.css";
+const RichListRow_module_rslib_entry_ = {
+    listItem: "listItem-HfVE7t",
+    row: "row-qNQike",
+    clickableZone: "clickableZone-KG4Ygg",
+    clickableZoneActive: "clickableZoneActive-OtaDew",
+    leadingLane: "leadingLane-oEnTWq",
+    rowMain: "rowMain-ekCI8x",
+    trailingLane: "trailingLane-J4qLz8",
+    contentSlot: "contentSlot-xgewfJ",
+    rowLink: "rowLink-vHZ0y7",
+    checkboxLane: "checkboxLane-SxFtCI",
+    actionsLane: "actionsLane-JQxqtO",
+    overflowLane: "overflowLane-euPsqR",
+    checkboxLaneFullTarget: "checkboxLaneFullTarget-J22CW6",
+    checkboxLaneActive: "checkboxLaneActive-SAAKUd",
+    slotCell: "slotCell-nFtJJc",
+    rowMainCompact: "rowMainCompact-FP1jUy",
+    mainSlot: "mainSlot-G9ZgMV",
+    contentSlots: "contentSlots-_4Kf6I",
+    contentSlotFixed: "contentSlotFixed-Saogio",
+    contentSlotStart: "contentSlotStart-klEUrD",
+    contentSlotEnd: "contentSlotEnd-k2QSDN",
+    contentSlotCenter: "contentSlotCenter-elj5Nr",
+    primaryLine: "primaryLine-Sedy1b",
+    secondaryLine: "secondaryLine-iySU25",
+    primaryText: "primaryText-vd9ry0",
+    secondaryText: "secondaryText-DmPdJ2",
+    mainSlotAdornment: "mainSlotAdornment-IQslEw",
+    actionPlaceholder: "actionPlaceholder-yugzJR",
+    rowListAtCompactBreakpoint: "rowListAtCompactBreakpoint-g6EL_A",
+    textFieldAdornment: "textFieldAdornment-LP2CuE"
+};
+export { RichListRow_module_rslib_entry_ as default };