@arbor-education/design-system.components 0.6.0 → 0.8.0

package/dist/components/progress/Progress.stories.d.ts

@@ -27,15 +27,61 @@ declare const meta: {
         value?: number | null | undefined | undefined;
         max?: number | undefined;
         getValueLabel?: ((value: number, max: number) => string) | undefined;
-        color?: string | undefined | undefined;
-        role?: import("react").AriaRole | undefined;
         className?: string | undefined | undefined;
-        prefix?: string | undefined | undefined;
+        defaultChecked?: boolean | undefined | undefined;
+        defaultValue?: string | number | readonly string[] | undefined;
+        suppressContentEditableWarning?: boolean | undefined | undefined;
         suppressHydrationWarning?: boolean | undefined | undefined;
+        accessKey?: string | undefined | undefined;
+        autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined | (string & {}) | undefined;
+        autoFocus?: boolean | undefined | undefined;
+        contentEditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only" | undefined;
+        contextMenu?: string | undefined | undefined;
+        dir?: string | undefined | undefined;
+        draggable?: (boolean | "true" | "false") | undefined;
+        enterKeyHint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
+        hidden?: boolean | undefined | undefined;
         id?: string | undefined | undefined;
         lang?: string | undefined | undefined;
+        nonce?: string | undefined | undefined;
+        slot?: string | undefined | undefined;
+        spellCheck?: (boolean | "true" | "false") | undefined;
         style?: import("react").CSSProperties | undefined;
         tabIndex?: number | undefined | undefined;
+        title?: string | undefined | undefined;
+        translate?: "yes" | "no" | undefined | undefined;
+        radioGroup?: string | undefined | undefined;
+        role?: import("react").AriaRole | undefined;
+        about?: string | undefined | undefined;
+        content?: string | undefined | undefined;
+        datatype?: string | undefined | undefined;
+        inlist?: any;
+        prefix?: string | undefined | undefined;
+        property?: string | undefined | undefined;
+        rel?: string | undefined | undefined;
+        resource?: string | undefined | undefined;
+        rev?: string | undefined | undefined;
+        typeof?: string | undefined | undefined;
+        vocab?: string | undefined | undefined;
+        autoCorrect?: string | undefined | undefined;
+        autoSave?: string | undefined | undefined;
+        color?: string | undefined | undefined;
+        itemProp?: string | undefined | undefined;
+        itemScope?: boolean | undefined | undefined;
+        itemType?: string | undefined | undefined;
+        itemID?: string | undefined | undefined;
+        itemRef?: string | undefined | undefined;
+        results?: number | undefined | undefined;
+        security?: string | undefined | undefined;
+        unselectable?: "on" | "off" | undefined | undefined;
+        popover?: "" | "auto" | "manual" | undefined | undefined;
+        popoverTargetAction?: "toggle" | "show" | "hide" | undefined | undefined;
+        popoverTarget?: string | undefined | undefined;
+        inert?: boolean | undefined | undefined;
+        inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined | undefined;
+        is?: string | undefined | undefined;
+        exportparts?: string | undefined | undefined;
+        part?: string | undefined | undefined;
         "aria-activedescendant"?: string | undefined | undefined;
         "aria-atomic"?: (boolean | "true" | "false") | undefined;
         "aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined | undefined;
@@ -262,52 +308,6 @@ declare const meta: {
         onTransitionStart?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
         onTransitionStartCapture?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
         key?: import("react").Key | null | undefined;
-        defaultChecked?: boolean | undefined | undefined;
-        defaultValue?: string | number | readonly string[] | undefined;
-        suppressContentEditableWarning?: boolean | undefined | undefined;
-        accessKey?: string | undefined | undefined;
-        autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined | (string & {}) | undefined;
-        autoFocus?: boolean | undefined | undefined;
-        contentEditable?: "inherit" | (boolean | "true" | "false") | "plaintext-only" | undefined;
-        contextMenu?: string | undefined | undefined;
-        dir?: string | undefined | undefined;
-        draggable?: (boolean | "true" | "false") | undefined;
-        enterKeyHint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
-        hidden?: boolean | undefined | undefined;
-        nonce?: string | undefined | undefined;
-        slot?: string | undefined | undefined;
-        spellCheck?: (boolean | "true" | "false") | undefined;
-        title?: string | undefined | undefined;
-        translate?: "yes" | "no" | undefined | undefined;
-        radioGroup?: string | undefined | undefined;
-        about?: string | undefined | undefined;
-        content?: string | undefined | undefined;
-        datatype?: string | undefined | undefined;
-        inlist?: any;
-        property?: string | undefined | undefined;
-        rel?: string | undefined | undefined;
-        resource?: string | undefined | undefined;
-        rev?: string | undefined | undefined;
-        typeof?: string | undefined | undefined;
-        vocab?: string | undefined | undefined;
-        autoCorrect?: string | undefined | undefined;
-        autoSave?: string | undefined | undefined;
-        itemProp?: string | undefined | undefined;
-        itemScope?: boolean | undefined | undefined;
-        itemType?: string | undefined | undefined;
-        itemID?: string | undefined | undefined;
-        itemRef?: string | undefined | undefined;
-        results?: number | undefined | undefined;
-        security?: string | undefined | undefined;
-        unselectable?: "on" | "off" | undefined | undefined;
-        popover?: "" | "auto" | "manual" | undefined | undefined;
-        popoverTargetAction?: "toggle" | "show" | "hide" | undefined | undefined;
-        popoverTarget?: string | undefined | undefined;
-        inert?: boolean | undefined | undefined;
-        inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined | undefined;
-        is?: string | undefined | undefined;
-        exportparts?: string | undefined | undefined;
-        part?: string | undefined | undefined;
         asChild?: boolean | undefined;
         indicatorClassName?: string | undefined;
     }>) => import("react/jsx-runtime").JSX.Element)[];

package/dist/components/row/Row.d.ts

@@ -0,0 +1,10 @@
+import type { MouseEventHandler } from 'react';
+export type RowProps = {
+    className?: string;
+    label?: string;
+    value?: string;
+    note?: string;
+    onClick?: MouseEventHandler<HTMLDivElement>;
+};
+export declare const Row: (props: RowProps) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=Row.d.ts.map

package/dist/components/row/Row.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Row.d.ts","sourceRoot":"","sources":["../../../src/components/row/Row.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAc,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAG3D,MAAM,MAAM,QAAQ,GAAG;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,iBAAiB,CAAC,cAAc,CAAC,CAAC;CAC7C,CAAC;AAEF,eAAO,MAAM,GAAG,GAAI,OAAO,QAAQ,4CAwClC,CAAC"}

package/dist/components/row/Row.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import classNames from 'classnames';
+import { Icon } from '../icon/Icon';
+import { ENTER_KEY, SPACE_KEY } from '../../utils/keyboardConstants';
+export const Row = (props) => {
+    const { className, label, value, note, onClick, } = props;
+    const isClickable = !!onClick;
+    return (_jsxs("div", { className: classNames('ds-row', {
+            'ds-row--clickable': isClickable,
+        }, className), onClick: onClick, onKeyDown: (e) => {
+            if (isClickable && [ENTER_KEY, SPACE_KEY].includes(e.key)) {
+                e.preventDefault();
+                onClick(e);
+            }
+        }, tabIndex: isClickable ? 0 : -1, children: [_jsx("span", { className: "ds-row__label", children: label }), _jsx("span", { className: "ds-row__value", children: value }), _jsx("span", { className: "ds-row__note", children: note }), isClickable && (_jsxs(_Fragment, { children: [_jsx(Icon, { name: "chevron-right", className: "ds-row__icon-click", size: 16 }), _jsx(Icon, { name: "arrow-right", className: "ds-row__icon-click", size: 16 })] }))] }));
+};
+//# sourceMappingURL=Row.js.map

package/dist/components/row/Row.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Row.js","sourceRoot":"","sources":["../../../src/components/row/Row.tsx"],"names":[],"mappings":";AAAA,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAE5C,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAU/D,MAAM,CAAC,MAAM,GAAG,GAAG,CAAC,KAAe,EAAE,EAAE;IACrC,MAAM,EACJ,SAAS,EACT,KAAK,EACL,KAAK,EACL,IAAI,EACJ,OAAO,GACR,GAAG,KAAK,CAAC;IAEV,MAAM,WAAW,GAAG,CAAC,CAAC,OAAO,CAAC;IAE9B,OAAO,CACL,eACE,SAAS,EAAE,UAAU,CACnB,QAAQ,EACR;YACE,mBAAmB,EAAE,WAAW;SACjC,EACD,SAAS,CACV,EACD,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,CAAC,CAAC,EAAE,EAAE;YACf,IAAI,WAAW,IAAI,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC;gBAC1D,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,OAAO,CAAC,CAA0C,CAAC,CAAC;YACtD,CAAC;QACH,CAAC,EACD,QAAQ,EAAE,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,aAE9B,eAAM,SAAS,EAAC,eAAe,YAAE,KAAK,GAAQ,EAC9C,eAAM,SAAS,EAAC,eAAe,YAAE,KAAK,GAAQ,EAC9C,eAAM,SAAS,EAAC,cAAc,YAAE,IAAI,GAAQ,EAC3C,WAAW,IAAI,CACd,8BACE,KAAC,IAAI,IAAC,IAAI,EAAC,eAAe,EAAC,SAAS,EAAC,oBAAoB,EAAC,IAAI,EAAE,EAAE,GAAI,EACtE,KAAC,IAAI,IAAC,IAAI,EAAC,aAAa,EAAC,SAAS,EAAC,oBAAoB,EAAC,IAAI,EAAE,EAAE,GAAI,IACnE,CACJ,IACG,CACP,CAAC;AACJ,CAAC,CAAC"}

package/dist/components/row/Row.stories.d.ts

@@ -0,0 +1,15 @@
+import type { Meta, StoryObj } from '@storybook/react-vite';
+import { Row } from './Row';
+declare const meta: Meta<typeof Row>;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;
+export declare const LabelOnly: Story;
+export declare const LabelAndValue: Story;
+export declare const WithNote: Story;
+export declare const Clickable: Story;
+export declare const ClickableWithNote: Story;
+export declare const WithCustomClassName: Story;
+export declare const LongContent: Story;
+export declare const MultipleRows: Story;
+export default meta;
+//# sourceMappingURL=Row.stories.d.ts.map

package/dist/components/row/Row.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Row.stories.d.ts","sourceRoot":"","sources":["../../../src/components/row/Row.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAE5B,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,GAAG,CAG1B,CAAC;AAEF,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAIvB,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAK3B,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAMtB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAMvB,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,KAO/B,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAE,KAMjC,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAMzB,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAU1B,CAAC;AAEF,eAAe,IAAI,CAAC"}

package/dist/components/row/Row.stories.js

@@ -0,0 +1,65 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Row } from './Row';
+const meta = {
+    title: 'Components/Row',
+    component: Row,
+};
+export const Default = {
+    args: {
+        label: 'Label Text',
+        value: 'Value',
+        note: 'Note',
+    },
+};
+export const LabelOnly = {
+    args: {
+        label: 'Full Name',
+    },
+};
+export const LabelAndValue = {
+    args: {
+        label: 'Email Address',
+        value: 'jacob.black@forks.edu',
+    },
+};
+export const WithNote = {
+    args: {
+        label: 'Date of Birth',
+        value: '13/01/1990',
+        note: 'Age 36',
+    },
+};
+export const Clickable = {
+    args: {
+        label: 'View Profile',
+        value: 'Jacob Black',
+        onClick: () => { console.log('click!'); },
+    },
+};
+export const ClickableWithNote = {
+    args: {
+        label: 'Attendance Record',
+        value: '96%',
+        note: 'Last updated today',
+        onClick: () => { console.log('click!'); },
+    },
+};
+export const WithCustomClassName = {
+    args: {
+        label: 'Custom Styled',
+        value: 'With extra class',
+        className: 'custom-row-class',
+    },
+};
+export const LongContent = {
+    args: {
+        label: 'A very long label that might wrap depending on the container width',
+        value: 'A very long value that contains lots of information and might also need to wrap',
+        note: 'This is a longer note with additional context',
+    },
+};
+export const MultipleRows = {
+    render: () => (_jsxs("div", { style: { display: 'flex', flexDirection: 'column', gap: '4px' }, children: [_jsx(Row, { label: "First Name", value: "Jacob" }), _jsx(Row, { label: "Last Name", value: "Black" }), _jsx(Row, { label: "Year Group", value: "Year 10", note: "2024/2025" }), _jsx(Row, { label: "Form Group", value: "10A" }), _jsx(Row, { label: "Attendance", value: "96%", note: "Above target", onClick: () => { console.log('click!'); } })] })),
+};
+export default meta;
+//# sourceMappingURL=Row.stories.js.map

package/dist/components/row/Row.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Row.stories.js","sourceRoot":"","sources":["../../../src/components/row/Row.stories.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAE5B,MAAM,IAAI,GAAqB;IAC7B,KAAK,EAAE,gBAAgB;IACvB,SAAS,EAAE,GAAG;CACf,CAAC;AAIF,MAAM,CAAC,MAAM,OAAO,GAAU;IAC5B,IAAI,EAAE;QACJ,KAAK,EAAE,YAAY;QACnB,KAAK,EAAE,OAAO;QACd,IAAI,EAAE,MAAM;KACb;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAU;IAC9B,IAAI,EAAE;QACJ,KAAK,EAAE,WAAW;KACnB;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAU;IAClC,IAAI,EAAE;QACJ,KAAK,EAAE,eAAe;QACtB,KAAK,EAAE,uBAAuB;KAC/B;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAU;IAC7B,IAAI,EAAE;QACJ,KAAK,EAAE,eAAe;QACtB,KAAK,EAAE,YAAY;QACnB,IAAI,EAAE,QAAQ;KACf;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAU;IAC9B,IAAI,EAAE;QACJ,KAAK,EAAE,cAAc;QACrB,KAAK,EAAE,aAAa;QACpB,OAAO,EAAE,GAAG,EAAE,GAAG,OAAO,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;KAC1C;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAU;IACtC,IAAI,EAAE;QACJ,KAAK,EAAE,mBAAmB;QAC1B,KAAK,EAAE,KAAK;QACZ,IAAI,EAAE,oBAAoB;QAC1B,OAAO,EAAE,GAAG,EAAE,GAAG,OAAO,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;KAC1C;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,mBAAmB,GAAU;IACxC,IAAI,EAAE;QACJ,KAAK,EAAE,eAAe;QACtB,KAAK,EAAE,kBAAkB;QACzB,SAAS,EAAE,kBAAkB;KAC9B;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,WAAW,GAAU;IAChC,IAAI,EAAE;QACJ,KAAK,EAAE,oEAAoE;QAC3E,KAAK,EAAE,iFAAiF;QACxF,IAAI,EAAE,+CAA+C;KACtD;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAU;IACjC,MAAM,EAAE,GAAG,EAAE,CAAC,CACZ,eAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,QAAQ,EAAE,GAAG,EAAE,KAAK,EAAE,aAClE,KAAC,GAAG,IAAC,KAAK,EAAC,YAAY,EAAC,KAAK,EAAC,OAAO,GAAG,EACxC,KAAC,GAAG,IAAC,KAAK,EAAC,WAAW,EAAC,KAAK,EAAC,OAAO,GAAG,EACvC,KAAC,GAAG,IAAC,KAAK,EAAC,YAAY,EAAC,KAAK,EAAC,SAAS,EAAC,IAAI,EAAC,WAAW,GAAG,EAC3D,KAAC,GAAG,IAAC,KAAK,EAAC,YAAY,EAAC,KAAK,EAAC,KAAK,GAAG,EACtC,KAAC,GAAG,IAAC,KAAK,EAAC,YAAY,EAAC,KAAK,EAAC,KAAK,EAAC,IAAI,EAAC,cAAc,EAAC,OAAO,EAAE,GAAG,EAAE,GAAG,OAAO,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,GAAI,IACjG,CACP;CACF,CAAC;AAEF,eAAe,IAAI,CAAC"}

package/dist/components/row/Row.test.d.ts

@@ -0,0 +1,2 @@
+import '@testing-library/jest-dom/vitest';
+//# sourceMappingURL=Row.test.d.ts.map

package/dist/components/row/Row.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Row.test.d.ts","sourceRoot":"","sources":["../../../src/components/row/Row.test.tsx"],"names":[],"mappings":"AAGA,OAAO,kCAAkC,CAAC"}

package/dist/components/row/Row.test.js

@@ -0,0 +1,62 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { expect, test, describe, vi } from 'vitest';
+import { render, screen, fireEvent } from '@testing-library/react';
+import { Row } from './Row';
+import '@testing-library/jest-dom/vitest';
+describe('Row component', () => {
+    test('renders with label, value, and note', () => {
+        render(_jsx(Row, { label: "Full Name", value: "Jacob Black", note: "Team Jacob forever" }));
+        expect(screen.getByText('Full Name')).toBeInTheDocument();
+        expect(screen.getByText('Jacob Black')).toBeInTheDocument();
+        expect(screen.getByText('Team Jacob forever')).toBeInTheDocument();
+    });
+    test('renders with only a label', () => {
+        render(_jsx(Row, { label: "Just a label" }));
+        expect(screen.getByText('Just a label')).toBeInTheDocument();
+    });
+    test('renders with only a value', () => {
+        render(_jsx(Row, { value: "Just a value" }));
+        expect(screen.getByText('Just a value')).toBeInTheDocument();
+    });
+    test('renders with only a note', () => {
+        render(_jsx(Row, { note: "Just a note" }));
+        expect(screen.getByText('Just a note')).toBeInTheDocument();
+    });
+    test('renders empty row without crashing', () => {
+        const { container } = render(_jsx(Row, {}));
+        expect(container.querySelector('.ds-row')).toBeInTheDocument();
+    });
+    test('applies custom className', () => {
+        const { container } = render(_jsx(Row, { className: "custom-row" }));
+        const row = container.querySelector('.ds-row');
+        expect(row).toHaveClass('ds-row', 'custom-row');
+    });
+    describe('click behaviour', () => {
+        test('calls onClick handler when clicked', () => {
+            const handleClick = vi.fn();
+            const { container } = render(_jsx(Row, { label: "Clickable", onClick: handleClick }));
+            const row = container.querySelector('.ds-row');
+            fireEvent.click(row);
+            expect(handleClick).toHaveBeenCalledTimes(1);
+        });
+        test('renders chevron icons when onClick is provided', () => {
+            const { container } = render(_jsx(Row, { label: "Clickable", onClick: vi.fn() }));
+            const icon = container.querySelector('.ds-row__icon-click');
+            expect(icon).toBeInTheDocument();
+        });
+        test('does not render chevron icons when onClick is not provided', () => {
+            const { container } = render(_jsx(Row, { label: "Not clickable" }));
+            const icon = container.querySelector('.ds-row__icon-click');
+            expect(icon).not.toBeInTheDocument();
+        });
+        test('passes click event to handler', () => {
+            const handleClick = vi.fn();
+            const { container } = render(_jsx(Row, { onClick: handleClick }));
+            const row = container.querySelector('.ds-row');
+            fireEvent.click(row);
+            expect(handleClick).toHaveBeenCalledTimes(1);
+            expect(handleClick.mock.calls[0]?.[0]).toBeDefined();
+        });
+    });
+});
+//# sourceMappingURL=Row.test.js.map

package/dist/components/row/Row.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Row.test.js","sourceRoot":"","sources":["../../../src/components/row/Row.test.tsx"],"names":[],"mappings":"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"}

package/dist/components/section/Section.stories.d.ts

@@ -14,5 +14,32 @@ export declare const NestedSections: {
         children: import("react/jsx-runtime").JSX.Element[];
     };
 };
+export declare const WithRows: {
+    args: {
+        title: string;
+        children: import("react/jsx-runtime").JSX.Element[];
+    };
+};
+export declare const WithClickableRows: {
+    args: {
+        title: string;
+        buttonText: string;
+        children: import("react/jsx-runtime").JSX.Element[];
+    };
+};
+export declare const CollapsibleWithRows: {
+    args: {
+        title: string;
+        collapsible: boolean;
+        children: import("react/jsx-runtime").JSX.Element[];
+    };
+};
+export declare const NestedSectionsWithRows: {
+    args: {
+        title: string;
+        collapsible: boolean;
+        children: import("react/jsx-runtime").JSX.Element[];
+    };
+};
 export default meta;
 //# sourceMappingURL=Section.stories.d.ts.map

package/dist/components/section/Section.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Section.stories.d.ts","sourceRoot":"","sources":["../../../src/components/section/Section.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAClD,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAEpC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,OAAO,CAM9B,CAAC;AAEF,eAAO,MAAM,OAAO;;;;;CAKnB,CAAC;AAEF,eAAO,MAAM,cAAc;;;;;;CAa1B,CAAC;AAEF,eAAe,IAAI,CAAC"}
+{"version":3,"file":"Section.stories.d.ts","sourceRoot":"","sources":["../../../src/components/section/Section.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAClD,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAGpC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,OAAO,CAM9B,CAAC;AAEF,eAAO,MAAM,OAAO;;;;;CAKnB,CAAC;AAEF,eAAO,MAAM,cAAc;;;;;;CAa1B,CAAC;AAEF,eAAO,MAAM,QAAQ;;;;;CAUpB,CAAC;AAEF,eAAO,MAAM,iBAAiB;;;;;;CAU7B,CAAC;AAEF,eAAO,MAAM,mBAAmB;;;;;;CAU/B,CAAC;AAEF,eAAO,MAAM,sBAAsB;;;;;;CAiBlC,CAAC;AAEF,eAAe,IAAI,CAAC"}

package/dist/components/section/Section.stories.js

@@ -1,5 +1,6 @@
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Section } from './Section';
+import { Row } from '../row/Row';
 const meta = {
     title: 'Components/Section',
     component: Section,
@@ -23,5 +24,48 @@ export const NestedSections = {
         ],
     },
 };
+export const WithRows = {
+    args: {
+        title: 'Student Details',
+        children: [
+            _jsx(Row, { label: "First Name", value: "Jacob" }, 1),
+            _jsx(Row, { label: "Last Name", value: "Black" }, 2),
+            _jsx(Row, { label: "Year Group", value: "Year 10", note: "2024/2025" }, 3),
+            _jsx(Row, { label: "Form Group", value: "10A" }, 4),
+        ],
+    },
+};
+export const WithClickableRows = {
+    args: {
+        title: 'Quick Links',
+        buttonText: 'Edit',
+        children: [
+            _jsx(Row, { label: "Attendance", value: "96%", note: "Above target", onClick: () => { console.log('click!'); } }, 1),
+            _jsx(Row, { label: "Behaviour", value: "3 positive points", onClick: () => { console.log('click!'); } }, 2),
+            _jsx(Row, { label: "Assessment", value: "On track", note: "Last updated 2 days ago", onClick: () => { console.log('click!'); } }, 3),
+        ],
+    },
+};
+export const CollapsibleWithRows = {
+    args: {
+        title: 'Contact Information',
+        collapsible: true,
+        children: [
+            _jsx(Row, { label: "Email", value: "jacob.black@forks.edu" }, 1),
+            _jsx(Row, { label: "Phone", value: "01onal 555 0123" }, 2),
+            _jsx(Row, { label: "Address", value: "La Push, Washington", note: "Primary" }, 3),
+        ],
+    },
+};
+export const NestedSectionsWithRows = {
+    args: {
+        title: 'Student Profile',
+        collapsible: true,
+        children: [
+            _jsxs(Section, { title: "Personal Details", collapsible: true, children: [_jsx(Row, { label: "First Name", value: "Jacob" }), _jsx(Row, { label: "Last Name", value: "Black" }), _jsx(Row, { label: "Date of Birth", value: "14/01/1990", note: "Age 36" })] }, 1),
+            _jsxs(Section, { title: "Academic", collapsible: true, children: [_jsx(Row, { label: "Year Group", value: "Year 10", note: "2024/2025" }), _jsx(Row, { label: "Form Group", value: "10A" }), _jsx(Row, { label: "Attendance", value: "96%", note: "Above target", onClick: () => { console.log('click!'); } })] }, 2),
+        ],
+    },
+};
 export default meta;
 //# sourceMappingURL=Section.stories.js.map

package/dist/components/section/Section.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"Section.stories.js","sourceRoot":"","sources":["../../../src/components/section/Section.stories.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAEpC,MAAM,IAAI,GAAyB;IACjC,KAAK,EAAE,oBAAoB;IAC3B,SAAS,EAAE,OAAO;IAClB,OAAO,EAAE;QACP,WAAW,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE;KAC/B;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG;IACrB,IAAI,EAAE;QACJ,KAAK,EAAE,YAAY;QACnB,QAAQ,EAAE,CAAC,mbAAQ,CAAC,CAA6Z,CAAC;KACnb;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG;IAC5B,IAAI,EAAE;QACJ,KAAK,EAAE,gBAAgB;QACvB,WAAW,EAAE,IAAI;QACjB,QAAQ,EAAE;YACR,KAAC,OAAO,IAAS,KAAK,EAAC,eAAe,EAAC,WAAW,kBAChD,kbAA8Z,IADlZ,CAAC,CAEL;YACV,KAAC,OAAO,IAAS,KAAK,EAAC,eAAe,EAAC,WAAW,kBAChD,kbAA8Z,IADlZ,CAAC,CAEL;SACX;KACF;CACF,CAAC;AAEF,eAAe,IAAI,CAAC"}
+{"version":3,"file":"Section.stories.js","sourceRoot":"","sources":["../../../src/components/section/Section.stories.tsx"],"names":[],"mappings":"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"}

package/dist/components/singleUser/SingleUser.d.ts

@@ -0,0 +1,15 @@
+import { type AvatarProps, type AvatarSize } from '../avatar/Avatar';
+import React from 'react';
+export type SingleUserProps = {
+    label: string;
+    className?: string;
+    avatarClassName?: string;
+    size?: AvatarSize;
+} & Omit<AvatarProps, 'className' | 'alt' | 'size'>;
+export declare const SingleUser: React.ForwardRefExoticComponent<{
+    label: string;
+    className?: string;
+    avatarClassName?: string;
+    size?: AvatarSize;
+} & Omit<AvatarProps, "size" | "alt" | "className"> & React.RefAttributes<HTMLSpanElement>>;
+//# sourceMappingURL=SingleUser.d.ts.map

package/dist/components/singleUser/SingleUser.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SingleUser.d.ts","sourceRoot":"","sources":["../../../src/components/singleUser/SingleUser.tsx"],"names":[],"mappings":"AACA,OAAO,EAAU,KAAK,WAAW,EAAE,KAAK,UAAU,EAAE,MAAM,0BAA0B,CAAC;AACrF,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,MAAM,eAAe,GAAG;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,IAAI,CAAC,EAAE,UAAU,CAAC;CACnB,GAAG,IAAI,CAAC,WAAW,EAAE,WAAW,GAAG,KAAK,GAAG,MAAM,CAAC,CAAC;AAEpD,eAAO,MAAM,UAAU;WANd,MAAM;gBACD,MAAM;sBACA,MAAM;WACjB,UAAU;2FAkClB,CAAC"}

package/dist/components/singleUser/SingleUser.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import classNames from 'classnames';
+import { Avatar } from '../avatar/Avatar';
+import React from 'react';
+export const SingleUser = React.forwardRef(({ label, className, avatarClassName, size = 'small', ...avatarProps }, ref) => {
+    return (_jsxs("span", { ref: ref, className: classNames('ds-single-user', className), children: [_jsx(Avatar, { ...avatarProps, size: size, "aria-hidden": "true", alt: "", className: avatarClassName }), _jsx("span", { className: "ds-single-user__label", children: label })] }));
+});
+SingleUser.displayName = 'SingleUser';
+//# sourceMappingURL=SingleUser.js.map

package/dist/components/singleUser/SingleUser.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SingleUser.js","sourceRoot":"","sources":["../../../src/components/singleUser/SingleUser.tsx"],"names":[],"mappings":";AAAA,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,MAAM,EAAqC,MAAM,0BAA0B,CAAC;AACrF,OAAO,KAAK,MAAM,OAAO,CAAC;AAS1B,MAAM,CAAC,MAAM,UAAU,GAAG,KAAK,CAAC,UAAU,CACxC,CACE,EACE,KAAK,EACL,SAAS,EACT,eAAe,EACf,IAAI,GAAG,OAAO,EACd,GAAG,WAAW,EACf,EACD,GAAG,EACH,EAAE;IACF,OAAO,CACL,gBACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,UAAU,CAAC,gBAAgB,EAAE,SAAS,CAAC,aAGlD,KAAC,MAAM,OACD,WAAW,EACf,IAAI,EAAE,IAAI,iBACE,MAAM,EAClB,GAAG,EAAC,EAAE,EACN,SAAS,EAAE,eAAe,GAC1B,EAEF,eAAM,SAAS,EAAC,uBAAuB,YACpC,KAAK,GACD,IACF,CACR,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,UAAU,CAAC,WAAW,GAAG,YAAY,CAAC"}

package/dist/components/singleUser/SingleUser.stories.d.ts

@@ -0,0 +1,11 @@
+import type { Meta, StoryObj } from '@storybook/react-vite';
+import { SingleUser } from './SingleUser';
+declare const meta: Meta<typeof SingleUser>;
+export default meta;
+type Story = StoryObj<typeof SingleUser>;
+export declare const WithImage: Story;
+export declare const WithInitials: Story;
+export declare const Placeholder: Story;
+export declare const MediumAvatar: Story;
+export declare const LongLabel: Story;
+//# sourceMappingURL=SingleUser.stories.d.ts.map

package/dist/components/singleUser/SingleUser.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SingleUser.stories.d.ts","sourceRoot":"","sources":["../../../src/components/singleUser/SingleUser.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,UAAU,CAIjC,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,UAAU,CAAC,CAAC;AAiBzC,eAAO,MAAM,SAAS,EAAE,KAKsD,CAAC;AAE/E,eAAO,MAAM,YAAY,EAAE,KAK0B,CAAC;AAEtD,eAAO,MAAM,WAAW,EAAE,KAIgE,CAAC;AAE3F,eAAO,MAAM,YAAY,EAAE,KAOsD,CAAC;AAElF,eAAO,MAAM,SAAS,EAAE,KAKuE,CAAC"}

package/dist/components/singleUser/SingleUser.stories.js

@@ -0,0 +1,52 @@
+import { SingleUser } from './SingleUser';
+const meta = {
+    title: 'Components/SingleUser',
+    component: SingleUser,
+    tags: ['autodocs'],
+};
+export default meta;
+const withDescription = (story, description) => ({
+    ...story,
+    parameters: {
+        ...story.parameters,
+        docs: {
+            ...story.parameters?.docs,
+            description: {
+                story: description,
+            },
+        },
+    },
+});
+const sampleSrc = 'https://i.pravatar.cc/150?img=12';
+export const WithImage = withDescription({
+    args: {
+        label: 'Jordan Matthews',
+        src: sampleSrc,
+    },
+}, 'Displays `SingleUser` with an avatar image and the default small layout.');
+export const WithInitials = withDescription({
+    args: {
+        label: 'Riley Chen',
+        initials: 'RC',
+    },
+}, 'Uses initials when no image source is provided.');
+export const Placeholder = withDescription({
+    args: {
+        label: 'Invited user',
+    },
+}, 'Shows the placeholder avatar treatment when neither image nor initials are supplied.');
+export const MediumAvatar = withDescription({
+    name: 'Size override (medium)',
+    args: {
+        label: 'Taylor Brooks',
+        initials: 'TB',
+        size: 'medium',
+    },
+}, 'Demonstrates overriding the default avatar size within the SingleUser pill.');
+export const LongLabel = withDescription({
+    args: {
+        label: 'Dr. Alexandrina Constantinopolous-Worthington',
+        initials: 'AC',
+    },
+}, 'Exercises the component with a longer label so text wrapping and spacing can be reviewed.');
+//# sourceMappingURL=SingleUser.stories.js.map

package/dist/components/singleUser/SingleUser.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SingleUser.stories.js","sourceRoot":"","sources":["../../../src/components/singleUser/SingleUser.stories.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,MAAM,IAAI,GAA4B;IACpC,KAAK,EAAE,uBAAuB;IAC9B,SAAS,EAAE,UAAU;IACrB,IAAI,EAAE,CAAC,UAAU,CAAC;CACnB,CAAC;AAEF,eAAe,IAAI,CAAC;AAIpB,MAAM,eAAe,GAAG,CAAC,KAAY,EAAE,WAAmB,EAAS,EAAE,CAAC,CAAC;IACrE,GAAG,KAAK;IACR,UAAU,EAAE;QACV,GAAG,KAAK,CAAC,UAAU;QACnB,IAAI,EAAE;YACJ,GAAG,KAAK,CAAC,UAAU,EAAE,IAAI;YACzB,WAAW,EAAE;gBACX,KAAK,EAAE,WAAW;aACnB;SACF;KACF;CACF,CAAC,CAAC;AAEH,MAAM,SAAS,GAAG,kCAAkC,CAAC;AAErD,MAAM,CAAC,MAAM,SAAS,GAAU,eAAe,CAAC;IAC9C,IAAI,EAAE;QACJ,KAAK,EAAE,iBAAiB;QACxB,GAAG,EAAE,SAAS;KACf;CACF,EAAE,0EAA0E,CAAC,CAAC;AAE/E,MAAM,CAAC,MAAM,YAAY,GAAU,eAAe,CAAC;IACjD,IAAI,EAAE;QACJ,KAAK,EAAE,YAAY;QACnB,QAAQ,EAAE,IAAI;KACf;CACF,EAAE,iDAAiD,CAAC,CAAC;AAEtD,MAAM,CAAC,MAAM,WAAW,GAAU,eAAe,CAAC;IAChD,IAAI,EAAE;QACJ,KAAK,EAAE,cAAc;KACtB;CACF,EAAE,sFAAsF,CAAC,CAAC;AAE3F,MAAM,CAAC,MAAM,YAAY,GAAU,eAAe,CAAC;IACjD,IAAI,EAAE,wBAAwB;IAC9B,IAAI,EAAE;QACJ,KAAK,EAAE,eAAe;QACtB,QAAQ,EAAE,IAAI;QACd,IAAI,EAAE,QAAQ;KACf;CACF,EAAE,6EAA6E,CAAC,CAAC;AAElF,MAAM,CAAC,MAAM,SAAS,GAAU,eAAe,CAAC;IAC9C,IAAI,EAAE;QACJ,KAAK,EAAE,+CAA+C;QACtD,QAAQ,EAAE,IAAI;KACf;CACF,EAAE,2FAA2F,CAAC,CAAC"}

package/dist/components/singleUser/SingleUser.test.d.ts

@@ -0,0 +1,2 @@
+import '@testing-library/jest-dom/vitest';
+//# sourceMappingURL=SingleUser.test.d.ts.map

package/dist/components/singleUser/SingleUser.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SingleUser.test.d.ts","sourceRoot":"","sources":["../../../src/components/singleUser/SingleUser.test.tsx"],"names":[],"mappings":"AAAA,OAAO,kCAAkC,CAAC"}

package/dist/components/singleUser/SingleUser.test.js

@@ -0,0 +1,30 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import '@testing-library/jest-dom/vitest';
+import { render, screen } from '@testing-library/react';
+import { describe, expect, test } from 'vitest';
+import { SingleUser } from './SingleUser';
+describe('SingleUser', () => {
+    test('renders label text', () => {
+        render(_jsx(SingleUser, { label: "Jamie Smith", initials: "JS" }));
+        expect(screen.getByText('Jamie Smith')).toBeInTheDocument();
+    });
+    test('hides Avatar from screen readers', () => {
+        const { container } = render(_jsx(SingleUser, { label: "Pat Lee", initials: "PL" }));
+        const avatar = container.querySelector('.ds-avatar');
+        expect(avatar).toHaveAttribute('aria-hidden', 'true');
+    });
+    test('defaults Avatar to small size', () => {
+        const { container } = render(_jsx(SingleUser, { label: "Sam", initials: "S" }));
+        expect(container.querySelector('.ds-avatar--small')).toBeInTheDocument();
+    });
+    test('allows size override', () => {
+        const { container } = render(_jsx(SingleUser, { label: "Sam", initials: "S", size: "medium" }));
+        expect(container.querySelector('.ds-avatar--medium')).toBeInTheDocument();
+    });
+    test('applies className to root and avatarClassName to Avatar', () => {
+        const { container } = render(_jsx(SingleUser, { label: "User", initials: "U", className: "my-chip", avatarClassName: "my-avatar" }));
+        expect(container.querySelector('.ds-single-user.my-chip')).toBeInTheDocument();
+        expect(container.querySelector('.ds-avatar.my-avatar')).toBeInTheDocument();
+    });
+});
+//# sourceMappingURL=SingleUser.test.js.map

package/dist/components/singleUser/SingleUser.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SingleUser.test.js","sourceRoot":"","sources":["../../../src/components/singleUser/SingleUser.test.tsx"],"names":[],"mappings":";AAAA,OAAO,kCAAkC,CAAC;AAC1C,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AACxD,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAChD,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,QAAQ,CAAC,YAAY,EAAE,GAAG,EAAE;IAC1B,IAAI,CAAC,oBAAoB,EAAE,GAAG,EAAE;QAC9B,MAAM,CACJ,KAAC,UAAU,IACT,KAAK,EAAC,aAAa,EACnB,QAAQ,EAAC,IAAI,GACb,CACH,CAAC;QACF,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,aAAa,CAAC,CAAC,CAAC,iBAAiB,EAAE,CAAC;IAC9D,CAAC,CAAC,CAAC;IAEH,IAAI,CAAC,kCAAkC,EAAE,GAAG,EAAE;QAC5C,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAC1B,KAAC,UAAU,IACT,KAAK,EAAC,SAAS,EACf,QAAQ,EAAC,IAAI,GACb,CACH,CAAC;QACF,MAAM,MAAM,GAAG,SAAS,CAAC,aAAa,CAAC,YAAY,CAAC,CAAC;QACrD,MAAM,CAAC,MAAM,CAAC,CAAC,eAAe,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC;IACxD,CAAC,CAAC,CAAC;IAEH,IAAI,CAAC,+BAA+B,EAAE,GAAG,EAAE;QACzC,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAC1B,KAAC,UAAU,IACT,KAAK,EAAC,KAAK,EACX,QAAQ,EAAC,GAAG,GACZ,CACH,CAAC;QACF,MAAM,CAAC,SAAS,CAAC,aAAa,CAAC,mBAAmB,CAAC,CAAC,CAAC,iBAAiB,EAAE,CAAC;IAC3E,CAAC,CAAC,CAAC;IAEH,IAAI,CAAC,sBAAsB,EAAE,GAAG,EAAE;QAChC,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAC1B,KAAC,UAAU,IACT,KAAK,EAAC,KAAK,EACX,QAAQ,EAAC,GAAG,EACZ,IAAI,EAAC,QAAQ,GACb,CACH,CAAC;QACF,MAAM,CAAC,SAAS,CAAC,aAAa,CAAC,oBAAoB,CAAC,CAAC,CAAC,iBAAiB,EAAE,CAAC;IAC5E,CAAC,CAAC,CAAC;IAEH,IAAI,CAAC,yDAAyD,EAAE,GAAG,EAAE;QACnE,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAC1B,KAAC,UAAU,IACT,KAAK,EAAC,MAAM,EACZ,QAAQ,EAAC,GAAG,EACZ,SAAS,EAAC,SAAS,EACnB,eAAe,EAAC,WAAW,GAC3B,CACH,CAAC;QACF,MAAM,CAAC,SAAS,CAAC,aAAa,CAAC,yBAAyB,CAAC,CAAC,CAAC,iBAAiB,EAAE,CAAC;QAC/E,MAAM,CAAC,SAAS,CAAC,aAAa,CAAC,sBAAsB,CAAC,CAAC,CAAC,iBAAiB,EAAE,CAAC;IAC9E,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}

package/dist/components/table/cellRenderers/SelectDropdownCellRenderer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SelectDropdownCellRenderer.d.ts","sourceRoot":"","sources":["../../../../src/components/table/cellRenderers/SelectDropdownCellRenderer.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,eAAe,CAAC;AAC7D,OAAO,EAEL,KAAK,wBAAwB,EAC9B,MAAM,2DAA2D,CAAC;AAGnE,KAAK,+BAA+B,GAAG,uBAAuB,GAC1D,wBAAwB,CAAC;AAE7B,eAAO,MAAM,0BAA0B,GACrC,OAAO,+BAA+B,4CAiEvC,CAAC"}
+{"version":3,"file":"SelectDropdownCellRenderer.d.ts","sourceRoot":"","sources":["../../../../src/components/table/cellRenderers/SelectDropdownCellRenderer.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,eAAe,CAAC;AAC7D,OAAO,EAEL,KAAK,wBAAwB,EAC9B,MAAM,2DAA2D,CAAC;AAGnE,KAAK,+BAA+B,GAAG,uBAAuB,GAC1D,wBAAwB,CAAC;AAS7B,eAAO,MAAM,0BAA0B,GACrC,OAAO,+BAA+B,4CA0EvC,CAAC"}

package/dist/components/table/cellRenderers/SelectDropdownCellRenderer.js

@@ -4,6 +4,11 @@ import { SelectDropdown, } from '../../formField/inputs/selectDropdown/SelectDro
 import { useComponentDidMount } from '../../../utils/hooks/useComponentDidMount';
 export const SelectDropdownCellRenderer = (props) => {
     const { value, placeholder = 'Select', node, column, api, options = [], disabled, hasError, id, 'aria-describedBy': ariaDescribedBy, 'aria-invalid': ariaInvalid, alwaysShowPlaceholder = false, } = props;
+    const rawOptions = options;
+    const normalisedOptions = rawOptions.map(option => ({
+        ...option,
+        value: String(option.value),
+    }));
     const valueStr = value != null && value !== '' ? String(value) : '';
     const initialSelectedValues = valueStr ? [valueStr] : [];
     const [isOpen, setIsOpen] = useState(false);
@@ -21,9 +26,10 @@ export const SelectDropdownCellRenderer = (props) => {
             api.removeEventListener('cellKeyDown', handleCellKeyDown);
         };
     });
-    return (_jsx("div", { className: "ds-table__select-dropdown", children: _jsx(SelectDropdown, { disabled: disabled, hasError: hasError, id: id, "aria-describedBy": ariaDescribedBy, "aria-invalid": ariaInvalid, alwaysShowPlaceholder: alwaysShowPlaceholder, options: options, placeholder: placeholder, initialSelectedValues: initialSelectedValues, open: isOpen, onOpenChange: setIsOpen, multiple: false, onSelectionChange: (newValue) => {
-                if (column) {
-                    node.setDataValue(column, newValue[0]);
+    return (_jsx("div", { className: "ds-table__select-dropdown", children: _jsx(SelectDropdown, { disabled: disabled, hasError: hasError, id: id, "aria-describedBy": ariaDescribedBy, "aria-invalid": ariaInvalid, alwaysShowPlaceholder: alwaysShowPlaceholder, options: normalisedOptions, placeholder: placeholder, initialSelectedValues: initialSelectedValues, open: isOpen, onOpenChange: setIsOpen, multiple: false, onSelectionChange: (newValue) => {
+                if (column && newValue[0] != null) {
+                    const selectedOption = rawOptions.find(option => String(option.value) === newValue[0]);
+                    node.setDataValue(column, selectedOption?.value ?? newValue[0]);
                 }
             } }) }));
 };