@worknice/whiteboard 0.52.0 → 0.53.0

package/dist/presentation/RichList/stories/Positions.js

@@ -0,0 +1,519 @@
+"use client";
+import * as __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__ from "react/jsx-runtime";
+import * as __WEBPACK_EXTERNAL_MODULE__utils_useNextContext_js_b4604910__ from "../../../utils/useNextContext.js";
+import * as __WEBPACK_EXTERNAL_MODULE__HStack_js_d2f77bae__ from "../../HStack.js";
+import * as __WEBPACK_EXTERNAL_MODULE__Icon_js_b85e52f7__ from "../../Icon.js";
+import * as __WEBPACK_EXTERNAL_MODULE__PersonAvatar_js_0117b3ba__ from "../../PersonAvatar.js";
+import * as __WEBPACK_EXTERNAL_MODULE__PlainText_js_acfb96d1__ from "../../PlainText.js";
+import * as __WEBPACK_EXTERNAL_MODULE__RichList_js_64f3f04c__ from "../RichList.js";
+import * as __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__ from "./shared.js";
+const MissingAvatar = ()=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
+        style: {
+            background: "var(--color-grey-t10)",
+            border: "1px solid var(--color-grey-t08)",
+            borderRadius: "50%",
+            height: 48,
+            padding: "10px 15px",
+            marginRight: "var(--size-n4)",
+            width: 48
+        },
+        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__Icon_js_b85e52f7__["default"], {
+            symbol: "Profile",
+            size: "large",
+            tone: "muted"
+        })
+    });
+const positions = [
+    {
+        id: "pos-1",
+        title: "CEO",
+        positionCode: "P00001",
+        directReports: 4,
+        department: "Executive",
+        assignee: {
+            name: "Janice Martin",
+            imageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(1)
+        },
+        manager: null
+    },
+    {
+        id: "pos-2",
+        title: "CFO",
+        positionCode: "P00002",
+        directReports: 2,
+        department: "Finance",
+        assignee: {
+            name: "Daisy Smith",
+            imageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(2)
+        },
+        manager: {
+            name: "Janice Martin",
+            imageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(1)
+        }
+    },
+    {
+        id: "pos-3",
+        title: "CMO",
+        positionCode: "P00003",
+        directReports: 3,
+        department: "Marketing",
+        assignee: {
+            name: "Candice Berry",
+            imageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(3)
+        },
+        manager: {
+            name: "Janice Martin",
+            imageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(1)
+        }
+    },
+    {
+        id: "pos-4",
+        title: "COO",
+        positionCode: "P00004",
+        directReports: 5,
+        department: "Operations",
+        assignee: {
+            name: "Andy Samson",
+            imageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(4)
+        },
+        manager: {
+            name: "Janice Martin",
+            imageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(1)
+        }
+    },
+    {
+        id: "pos-5",
+        title: "VP of Engineering",
+        positionCode: "P00005",
+        directReports: 6,
+        department: "Engineering",
+        assignee: "vacant",
+        manager: {
+            name: "Janice Martin",
+            imageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(1)
+        }
+    },
+    {
+        id: "pos-6",
+        title: "Head of Product",
+        positionCode: "P00012",
+        directReports: 4,
+        department: "Product",
+        assignee: {
+            name: "Fiona Gallagher",
+            imageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(5)
+        },
+        manager: {
+            name: "Janice Martin",
+            imageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(1)
+        }
+    },
+    {
+        id: "pos-7",
+        title: "Head of Design",
+        positionCode: "P00020",
+        directReports: 2,
+        department: "Design",
+        assignee: {
+            name: "Jasmine Kaur",
+            imageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(6)
+        },
+        manager: {
+            name: "Janice Martin",
+            imageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(1)
+        }
+    },
+    {
+        id: "pos-8",
+        title: "HR Business Partner",
+        positionCode: "P00045",
+        directReports: 1,
+        department: "People & Culture",
+        assignee: {
+            name: "Hannah Abbott",
+            imageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(7)
+        },
+        manager: {
+            name: "Daisy Smith",
+            imageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(2)
+        }
+    },
+    {
+        id: "pos-9",
+        title: "Group Financial Controller",
+        positionCode: "P00070",
+        directReports: 3,
+        department: "Finance",
+        assignee: {
+            name: "Badai Khan",
+            imageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(9)
+        },
+        manager: {
+            name: "Daisy Smith",
+            imageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(2)
+        }
+    },
+    {
+        id: "pos-10",
+        title: "Accounts Assistant",
+        positionCode: "P00088",
+        directReports: 0,
+        department: "Finance",
+        assignee: {
+            name: "Henry Jones",
+            imageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(8)
+        },
+        manager: {
+            name: "Badai Khan",
+            imageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(9)
+        }
+    },
+    {
+        id: "pos-11",
+        title: "Payroll Lead",
+        positionCode: "P00079",
+        directReports: 2,
+        department: "Finance",
+        assignee: {
+            name: "Priya Nair",
+            imageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(10)
+        },
+        manager: {
+            name: "Daisy Smith",
+            imageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(2)
+        }
+    },
+    {
+        id: "pos-12",
+        title: "Site Operations Lead",
+        positionCode: "P00102",
+        directReports: 8,
+        department: "Operations",
+        assignee: {
+            name: "Ian MacLeod",
+            imageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(11)
+        },
+        manager: {
+            name: "Andy Samson",
+            imageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(4)
+        }
+    },
+    {
+        id: "pos-13",
+        title: "Regional Sales Director",
+        positionCode: "P00120",
+        directReports: 0,
+        department: "Sales",
+        assignee: "vacant",
+        manager: {
+            name: "Candice Berry",
+            imageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(3)
+        }
+    },
+    {
+        id: "pos-14",
+        title: "IT Service Manager",
+        positionCode: "P00056",
+        directReports: 4,
+        department: "Technology",
+        assignee: {
+            name: "Evan Baker",
+            imageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(12)
+        },
+        manager: "vacant"
+    },
+    {
+        id: "pos-15",
+        title: "Cracker Baker",
+        positionCode: "P00201",
+        directReports: 0,
+        department: "Production",
+        assignee: "vacant",
+        manager: "vacant"
+    },
+    {
+        id: "pos-16",
+        title: "Cracker Crafter",
+        positionCode: "P00202",
+        directReports: 0,
+        department: "Production",
+        assignee: {
+            name: "Janet Siddens",
+            imageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(13)
+        },
+        manager: "vacant"
+    },
+    {
+        id: "pos-17",
+        title: "Cracker Macker",
+        positionCode: "P00203",
+        directReports: 0,
+        department: "Production",
+        assignee: {
+            name: "Rowe Innes",
+            imageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(14)
+        },
+        manager: {
+            name: "Lena Voss",
+            imageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(15)
+        }
+    },
+    {
+        id: "pos-18",
+        title: "Cracker Maker",
+        positionCode: "P00204",
+        directReports: 1,
+        department: "Production",
+        assignee: {
+            name: "Greg Evans",
+            imageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(16)
+        },
+        manager: {
+            name: "Marcus Dale",
+            imageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(17)
+        }
+    }
+];
+const uniqueDepartments = positions.map((r)=>r.department).filter((d, i, arr)=>arr.indexOf(d) === i).sort((a, b)=>a.localeCompare(b));
+const uniqueManagerFilterNames = (()=>{
+    const seen = new Set();
+    for (const r of positions)if (r.manager && "vacant" !== r.manager) seen.add(r.manager.name);
+    return [
+        ...seen
+    ].sort((a, b)=>a.localeCompare(b));
+})();
+const slotLinkStyle = {
+    alignItems: "center",
+    color: "inherit",
+    display: "inline-flex",
+    gap: "var(--size-n2)",
+    minWidth: 0,
+    position: "relative",
+    textDecoration: "none",
+    zIndex: 2
+};
+const PositionsList = ({ compactBreakpoint, contentAlignment, enableSorting, rowHeight })=>{
+    const { Link } = (0, __WEBPACK_EXTERNAL_MODULE__utils_useNextContext_js_b4604910__["default"])();
+    const renderAssignee = (r)=>{
+        if ("vacant" === r.assignee) return /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(Link, {
+            href: `#assignee-${r.id}`,
+            onClick: (e)=>e.stopPropagation(),
+            style: slotLinkStyle,
+            children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsxs)(__WEBPACK_EXTERNAL_MODULE__HStack_js_d2f77bae__["default"], {
+                align: "center",
+                spacing: "n2",
+                tagName: "div",
+                children: [
+                    /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(MissingAvatar, {}),
+                    /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__PlainText_js_acfb96d1__["default"], {
+                        font: "small",
+                        tone: "muted",
+                        children: "Vacant"
+                    })
+                ]
+            })
+        });
+        return /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(Link, {
+            href: `#assignee-${r.id}`,
+            onClick: (e)=>e.stopPropagation(),
+            style: slotLinkStyle,
+            children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsxs)(__WEBPACK_EXTERNAL_MODULE__HStack_js_d2f77bae__["default"], {
+                align: "center",
+                spacing: "n2",
+                tagName: "div",
+                children: [
+                    /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__PersonAvatar_js_0117b3ba__["default"], {
+                        id: `${r.id}-assign`,
+                        name: r.assignee.name,
+                        imageUrl: r.assignee.imageUrl,
+                        size: "small",
+                        hue: "200"
+                    }),
+                    /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__PlainText_js_acfb96d1__["default"], {
+                        font: "small",
+                        children: r.assignee.name
+                    })
+                ]
+            })
+        });
+    };
+    const renderManager = (r)=>{
+        if (null === r.manager) return "—";
+        if ("vacant" === r.manager) return /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(Link, {
+            href: `#manager-${r.id}`,
+            onClick: (e)=>e.stopPropagation(),
+            style: slotLinkStyle,
+            children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(MissingAvatar, {})
+        });
+        return /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(Link, {
+            href: `#manager-${r.id}`,
+            onClick: (e)=>e.stopPropagation(),
+            style: {
+                ...slotLinkStyle,
+                zIndex: 2
+            },
+            children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__PersonAvatar_js_0117b3ba__["default"], {
+                id: `${r.id}-mgr`,
+                name: r.manager.name,
+                imageUrl: r.manager.imageUrl,
+                size: "small",
+                hue: "200"
+            })
+        });
+    };
+    const titleField = {
+        label: "Position",
+        value: (r)=>`${r.title} ${r.department}`,
+        globalFiltering: true,
+        render: (r)=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__PlainText_js_acfb96d1__["default"], {
+                font: "regular-bold",
+                children: r.title
+            })
+    };
+    const subtitleField = {
+        label: "Code / function / reports",
+        value: (r)=>`${r.positionCode} ${r.department} ${r.directReports} direct reports`,
+        globalFiltering: true,
+        filter: {
+            isMulti: true,
+            label: "Department / function",
+            options: uniqueDepartments.map((d)=>({
+                    id: d,
+                    label: d,
+                    predicate: (r)=>r.department === d
+                }))
+        },
+        render: (r)=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsxs)(__WEBPACK_EXTERNAL_MODULE__HStack_js_d2f77bae__["default"], {
+                align: "center",
+                spacing: "n2",
+                tagName: "div",
+                children: [
+                    /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsxs)(__WEBPACK_EXTERNAL_MODULE__PlainText_js_acfb96d1__["default"], {
+                        font: "small",
+                        tone: "muted",
+                        children: [
+                            "# ",
+                            r.positionCode
+                        ]
+                    }),
+                    /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__PlainText_js_acfb96d1__["default"], {
+                        font: "small",
+                        tone: "muted",
+                        children: "|"
+                    }),
+                    /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__PlainText_js_acfb96d1__["default"], {
+                        font: "small",
+                        tone: "muted",
+                        children: r.department
+                    }),
+                    /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__PlainText_js_acfb96d1__["default"], {
+                        font: "small",
+                        tone: "muted",
+                        children: "|"
+                    }),
+                    /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsxs)(__WEBPACK_EXTERNAL_MODULE__HStack_js_d2f77bae__["default"], {
+                        align: "center",
+                        spacing: "n1",
+                        tagName: "div",
+                        children: [
+                            /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__Icon_js_b85e52f7__["default"], {
+                                symbol: "People",
+                                size: "small",
+                                tone: "muted"
+                            }),
+                            /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsxs)(__WEBPACK_EXTERNAL_MODULE__PlainText_js_acfb96d1__["default"], {
+                                font: "small",
+                                tone: "muted",
+                                children: [
+                                    r.directReports,
+                                    " ",
+                                    1 === r.directReports ? "direct report" : "direct reports"
+                                ]
+                            })
+                        ]
+                    })
+                ]
+            })
+    };
+    const assignedSlot = {
+        id: "assigned",
+        label: "Assigned",
+        value: (r)=>"vacant" === r.assignee ? "Vacant" : r.assignee.name,
+        render: (r)=>renderAssignee(r),
+        align: "start",
+        size: 200,
+        columnWidthMode: "fixed",
+        compactSize: 160,
+        globalFiltering: true,
+        filter: {
+            isMulti: true,
+            label: "Position filled",
+            options: [
+                {
+                    id: "assign-filled",
+                    label: "Filled",
+                    predicate: (r)=>"vacant" !== r.assignee
+                },
+                {
+                    id: "assign-vacant",
+                    label: "Vacant",
+                    predicate: (r)=>"vacant" === r.assignee
+                }
+            ]
+        }
+    };
+    const managerSlot = {
+        id: "reportsTo",
+        label: "Reports to",
+        value: (r)=>{
+            if (null === r.manager) return "";
+            if ("vacant" === r.manager) return "Vacant";
+            return r.manager.name;
+        },
+        globalFiltering: true,
+        render: (r)=>renderManager(r),
+        align: "center",
+        size: 60,
+        filter: {
+            isMulti: true,
+            label: "Reports to",
+            options: [
+                {
+                    id: "manager-top",
+                    label: "Top of org (no manager)",
+                    predicate: (r)=>null === r.manager
+                },
+                {
+                    id: "manager-vacant",
+                    label: "Vacant manager role",
+                    predicate: (r)=>"vacant" === r.manager
+                },
+                ...uniqueManagerFilterNames.map((name)=>({
+                        id: `manager-${name}`,
+                        label: name,
+                        predicate: (r)=>null !== r.manager && "vacant" !== r.manager && r.manager.name === name
+                    }))
+            ]
+        }
+    };
+    return /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__RichList_js_64f3f04c__["default"], {
+        data: positions,
+        compactBreakpoint: compactBreakpoint,
+        contentAlignment: contentAlignment,
+        enableSorting: enableSorting,
+        fillContainerHeight: true,
+        getRowId: (r)=>r.id,
+        rowHeight: rowHeight,
+        mainSlot: {
+            size: 330,
+            primary: titleField,
+            secondary: subtitleField
+        },
+        contentSlots: [
+            assignedSlot
+        ],
+        trailingSlot: managerSlot
+    });
+};
+const Positions_rslib_entry_ = PositionsList;
+export { Positions_rslib_entry_ as default };

package/dist/presentation/RichList/stories/SavedQuestions.d.ts

@@ -0,0 +1,13 @@
+import type { ComponentProps } from "react";
+import Badge from "../../Badge";
+import { type CommonProps } from "./shared";
+type BadgeColor = NonNullable<ComponentProps<typeof Badge>["color"]>;
+export type SavedQuestionsRow = {
+    id: string;
+    title: string;
+    responseCount: number;
+    questionTypeLabel: string;
+    questionTypeColor: BadgeColor;
+};
+declare const SavedQuestionsList: ({ compactBreakpoint, contentAlignment, rowHeight }: CommonProps) => import("react/jsx-runtime").JSX.Element;
+export default SavedQuestionsList;

package/dist/presentation/RichList/stories/SavedQuestions.js

@@ -0,0 +1,152 @@
+import * as __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__ from "react/jsx-runtime";
+import * as __WEBPACK_EXTERNAL_MODULE__Badge_js_56d6dba9__ from "../../Badge.js";
+import * as __WEBPACK_EXTERNAL_MODULE__HStack_js_d2f77bae__ from "../../HStack.js";
+import * as __WEBPACK_EXTERNAL_MODULE__Icon_js_b85e52f7__ from "../../Icon.js";
+import * as __WEBPACK_EXTERNAL_MODULE__PlainText_js_acfb96d1__ from "../../PlainText.js";
+import * as __WEBPACK_EXTERNAL_MODULE__RichList_js_64f3f04c__ from "../RichList.js";
+const questions = [
+    {
+        id: "sq1",
+        title: "Communication",
+        responseCount: 4,
+        questionTypeLabel: "Likert scale",
+        questionTypeColor: "blue"
+    },
+    {
+        id: "sq2",
+        title: "Customer centricity",
+        responseCount: 4,
+        questionTypeLabel: "Multiple choice",
+        questionTypeColor: "purple"
+    },
+    {
+        id: "sq3",
+        title: "Development planning",
+        responseCount: 4,
+        questionTypeLabel: "Text",
+        questionTypeColor: "green"
+    },
+    {
+        id: "sq4",
+        title: "Goals for the next period",
+        responseCount: 4,
+        questionTypeLabel: "Text",
+        questionTypeColor: "green"
+    },
+    {
+        id: "sq5",
+        title: "Leadership",
+        responseCount: 4,
+        questionTypeLabel: "Likert scale",
+        questionTypeColor: "blue"
+    },
+    {
+        id: "sq6",
+        title: "Operational excellence",
+        responseCount: 4,
+        questionTypeLabel: "Multiple choice",
+        questionTypeColor: "purple"
+    },
+    {
+        id: "sq7",
+        title: "Problem solving",
+        responseCount: 4,
+        questionTypeLabel: "Likert scale",
+        questionTypeColor: "blue"
+    },
+    {
+        id: "sq8",
+        title: "Suggested areas of improvement",
+        responseCount: 4,
+        questionTypeLabel: "Text",
+        questionTypeColor: "green"
+    },
+    {
+        id: "sq9",
+        title: "Teamwork",
+        responseCount: 4,
+        questionTypeLabel: "Multiple choice",
+        questionTypeColor: "purple"
+    },
+    {
+        id: "sq10",
+        title: "Additional Comments",
+        responseCount: 3,
+        questionTypeLabel: "Text",
+        questionTypeColor: "green"
+    },
+    {
+        id: "sq11",
+        title: "Any other feedback on your on-boarding experience?",
+        responseCount: 3,
+        questionTypeLabel: "Text",
+        questionTypeColor: "green"
+    },
+    {
+        id: "sq12",
+        title: "I had the resources necessary to quickly get up to speed",
+        responseCount: 3,
+        questionTypeLabel: "Likert scale",
+        questionTypeColor: "blue"
+    }
+];
+function responsesLabel(n) {
+    return 1 === n ? "1 response" : `${n} responses`;
+}
+const rowActions = ()=>[
+        {
+            id: "more",
+            label: "Question actions",
+            icon: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__Icon_js_b85e52f7__["default"], {
+                symbol: "Edit"
+            }),
+            alwaysVisible: false,
+            onClick: ()=>void 0
+        }
+    ];
+const SavedQuestionsList = ({ compactBreakpoint, contentAlignment, rowHeight })=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__RichList_js_64f3f04c__["default"], {
+        compactBreakpoint: compactBreakpoint,
+        contentAlignment: contentAlignment,
+        data: questions,
+        enableSorting: false,
+        fillContainerHeight: true,
+        getRowId: (r)=>r.id,
+        rowActions: rowActions,
+        rowHeight: rowHeight,
+        mainSlot: {
+            primary: (r)=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__PlainText_js_acfb96d1__["default"], {
+                    font: "regular-bold",
+                    children: r.title
+                }),
+            secondary: (r)=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsxs)(__WEBPACK_EXTERNAL_MODULE__HStack_js_d2f77bae__["default"], {
+                    spacing: "n2",
+                    align: "center",
+                    tagName: "div",
+                    children: [
+                        /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__Icon_js_b85e52f7__["default"], {
+                            symbol: "Comment",
+                            size: "small",
+                            tone: "muted"
+                        }),
+                        /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__PlainText_js_acfb96d1__["default"], {
+                            font: "small",
+                            tone: "muted",
+                            children: responsesLabel(r.responseCount)
+                        })
+                    ]
+                })
+        },
+        trailingSlot: (r)=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
+                style: {
+                    display: "flex",
+                    justifyContent: "flex-end"
+                },
+                children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__Badge_js_56d6dba9__["default"], {
+                    id: `${r.id}-qtype`,
+                    color: r.questionTypeColor,
+                    children: r.questionTypeLabel
+                })
+            })
+    });
+const SavedQuestions_rslib_entry_ = SavedQuestionsList;
+export { SavedQuestions_rslib_entry_ as default };

package/dist/presentation/RichList/stories/Tables.d.ts

@@ -0,0 +1,9 @@
+import { type CommonProps } from "./shared";
+export type TablesRow = {
+    id: string;
+    title: string;
+    description: string;
+    columnCount: number;
+};
+declare const TablesList: ({ compactBreakpoint, contentAlignment, enableSorting, rowHeight, }: CommonProps) => import("react/jsx-runtime").JSX.Element;
+export default TablesList;