@akinon/ai-modal-table 1.0.2 → 1.0.4

package/dist/cjs/ai-table/components/__tests__/content.test.js

@@ -18,6 +18,7 @@ const user_event_1 = require("@testing-library/user-event");
 const antd_1 = require("antd");
 const react_2 = require("react");
 const vitest_1 = require("vitest");
+const constants_1 = require("../../constants");
 const content_1 = require("../content");
 vitest_1.vi.mock('@akinon/icons', () => ({
     Icon: (_a) => {
@@ -31,6 +32,12 @@ vitest_1.vi.mock('@akinon/ui-input', () => ({
         return (react_2.default.createElement("input", Object.assign({ onChange: onChange, value: value, className: className, "data-testid": "edit-input" }, props)));
     }
 }));
+vitest_1.vi.mock('@akinon/ui-select', () => ({
+    Select: (_a) => {
+        var { value, onChange, rootClassName, options } = _a, props = __rest(_a, ["value", "onChange", "rootClassName", "options"]);
+        return (react_2.default.createElement("select", Object.assign({ "data-testid": "edit-select", value: value !== null && value !== void 0 ? value : '', onChange: e => onChange === null || onChange === void 0 ? void 0 : onChange(e.target.value), className: rootClassName }, props), options === null || options === void 0 ? void 0 : options.map((opt) => (react_2.default.createElement("option", { key: opt.value, value: String(opt.value) }, opt.label)))));
+    }
+}));
 vitest_1.vi.mock('@akinon/ui-layout', () => ({
     Flex: (_a) => {
         var { children } = _a, props = __rest(_a, ["children"]);
@@ -1351,5 +1358,44 @@ vitest_1.vi.mock('../../i18n', () => ({
             const inputs = react_1.screen.queryAllByTestId('edit-input');
             (0, vitest_1.expect)(inputs.length).toBeGreaterThan(0);
         });
+        (0, vitest_1.it)('should render Select for editable column when editDataIndexes has SELECT config', async () => {
+            const user = user_event_1.default.setup();
+            const onEdit = vitest_1.vi.fn();
+            renderComponent({
+                data: [
+                    {
+                        pk: 1,
+                        name: 'Item 1',
+                        status: 'active',
+                        mappings: []
+                    }
+                ],
+                columns: [
+                    { title: 'Name', dataIndex: 'name' },
+                    { title: 'Status', dataIndex: 'status' }
+                ],
+                mapperConfig: undefined,
+                onEdit,
+                editDataIndexes: [
+                    'name',
+                    {
+                        key: 'status',
+                        type: constants_1.EDIT_FIELD_TYPES.SELECT,
+                        attributes: {
+                            options: [
+                                { label: 'Active', value: 'active' },
+                                { label: 'Inactive', value: 'inactive' }
+                            ]
+                        }
+                    }
+                ]
+            });
+            const editButton = react_1.screen.getByTestId('edit-button-1');
+            await user.click(editButton);
+            const inputs = react_1.screen.queryAllByTestId('edit-input');
+            const selects = react_1.screen.queryAllByTestId('edit-select');
+            (0, vitest_1.expect)(inputs.length).toBeGreaterThan(0);
+            (0, vitest_1.expect)(selects.length).toBeGreaterThan(0);
+        });
     });
 });

package/dist/cjs/ai-table/components/__tests__/content.test.tsx

@@ -7,6 +7,7 @@ import { ConfigProvider } from 'antd';
 import React from 'react';
 import { beforeEach, describe, expect, it, vi } from 'vitest';
 
+import { EDIT_FIELD_TYPES } from '../../constants';
 import { TableContent } from '../content';
 
 vi.mock('@akinon/icons', () => ({
@@ -35,6 +36,24 @@ vi.mock('@akinon/ui-input', () => ({
   )
 }));
 
+vi.mock('@akinon/ui-select', () => ({
+  Select: ({ value, onChange, rootClassName, options, ...props }: any) => (
+    <select
+      data-testid="edit-select"
+      value={value ?? ''}
+      onChange={e => onChange?.(e.target.value)}
+      className={rootClassName}
+      {...props}
+    >
+      {options?.map((opt: { label: string; value: string | number }) => (
+        <option key={opt.value} value={String(opt.value)}>
+          {opt.label}
+        </option>
+      ))}
+    </select>
+  )
+}));
+
 vi.mock('@akinon/ui-layout', () => ({
   Flex: ({ children, ...props }: any) => (
     <div data-testid="flex" {...props}>
@@ -1639,5 +1658,48 @@ describe('TableContent', () => {
       const inputs = screen.queryAllByTestId('edit-input');
       expect(inputs.length).toBeGreaterThan(0);
     });
+
+    it('should render Select for editable column when editDataIndexes has SELECT config', async () => {
+      const user = userEvent.setup();
+      const onEdit = vi.fn();
+
+      renderComponent({
+        data: [
+          {
+            pk: 1,
+            name: 'Item 1',
+            status: 'active',
+            mappings: []
+          }
+        ],
+        columns: [
+          { title: 'Name', dataIndex: 'name' },
+          { title: 'Status', dataIndex: 'status' }
+        ],
+        mapperConfig: undefined,
+        onEdit,
+        editDataIndexes: [
+          'name',
+          {
+            key: 'status',
+            type: EDIT_FIELD_TYPES.SELECT,
+            attributes: {
+              options: [
+                { label: 'Active', value: 'active' },
+                { label: 'Inactive', value: 'inactive' }
+              ]
+            }
+          }
+        ]
+      });
+
+      const editButton = screen.getByTestId('edit-button-1');
+      await user.click(editButton);
+
+      const inputs = screen.queryAllByTestId('edit-input');
+      const selects = screen.queryAllByTestId('edit-select');
+      expect(inputs.length).toBeGreaterThan(0);
+      expect(selects.length).toBeGreaterThan(0);
+    });
   });
 });

package/dist/cjs/ai-table/components/content.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"content.d.ts","sourceRoot":"","sources":["../../../../src/ai-table/components/content.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAA8B,cAAc,EAAE,MAAM,aAAa,CAAC;AAQ9E,UAAU,iBACR,SAAQ,IAAI,CAAC,cAAc,EAAE,sBAAsB,GAAG,SAAS,GAAG,QAAQ,CAAC;IAC3E,iBAAiB,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IACpD,YAAY,EAAE,KAAK,CAAC,MAAM,GAAG,MAAM,CAAC,CAAC;IACrC,cAAc,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IACjD,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC7B;AAED,eAAO,MAAM,YAAY,GAAI,iKAa1B,iBAAiB,sBA2hBnB,CAAC"}
+{"version":3,"file":"content.d.ts","sourceRoot":"","sources":["../../../../src/ai-table/components/content.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAA8B,cAAc,EAAE,MAAM,aAAa,CAAC;AAY9E,UAAU,iBACR,SAAQ,IAAI,CAAC,cAAc,EAAE,sBAAsB,GAAG,SAAS,GAAG,QAAQ,CAAC;IAC3E,iBAAiB,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IACpD,YAAY,EAAE,KAAK,CAAC,MAAM,GAAG,MAAM,CAAC,CAAC;IACrC,cAAc,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IACjD,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC7B;AAED,eAAO,MAAM,YAAY,GAAI,iKAa1B,iBAAiB,sBAuhBnB,CAAC"}

package/dist/cjs/ai-table/components/content.js

@@ -3,7 +3,6 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.TableContent = void 0;
 const icons_1 = require("@akinon/icons");
-const ui_input_1 = require("@akinon/ui-input");
 const ui_layout_1 = require("@akinon/ui-layout");
 const ui_theme_1 = require("@akinon/ui-theme");
 const cssinjs_1 = require("@ant-design/cssinjs");
@@ -13,6 +12,7 @@ const lodash_es_1 = require("lodash-es");
 const React = require("react");
 const constants_1 = require("../constants");
 const i18n_1 = require("../i18n");
+const render_edit_fields_1 = require("../utils/render-edit-fields");
 const mapper_1 = require("./mapper");
 const row_actions_1 = require("./row-actions");
 const { t } = i18n_1.i18n;
@@ -150,16 +150,20 @@ const TableContent = ({ columns, customActionButtons, data, editDataIndexes, exp
     const renderCellValue = ({ column, row, rowId }) => {
         const dataIndex = (0, lodash_es_1.get)(column, 'dataIndex', '');
         const value = (0, lodash_es_1.get)(row, dataIndex, '');
-        if (hasEdit &&
-            checkIsEditing(rowId) &&
-            editDataIndexes.includes(dataIndex)) {
-            const handleOnChangeValue = (e) => {
-                const currentValue = e.target.value;
-                onEdit(rowId, {
-                    [dataIndex]: currentValue
+        if (hasEdit && checkIsEditing(rowId)) {
+            const config = (0, render_edit_fields_1.getEditFieldConfig)(editDataIndexes, dataIndex);
+            if (config) {
+                const handleOnChangeValue = (changedValue) => {
+                    onEdit(rowId, {
+                        [dataIndex]: changedValue
+                    });
+                };
+                return (0, render_edit_fields_1.renderEditField)({
+                    config,
+                    value,
+                    onChange: handleOnChangeValue
                 });
-            };
-            return (React.createElement(ui_input_1.Input, { className: "w-44 h-9", onChange: handleOnChangeValue, value: value }));
+            }
         }
         if (hasMapper && isMapperColumn(dataIndex)) {
             return renderMapper({

package/dist/cjs/ai-table/components/mapper.js

@@ -13,7 +13,7 @@ const TableMapper = ({ values, handleAddItem, handleRemoveItem, handleItemChange
                 index,
                 handleItemChange
             }),
-            React.createElement(ui_layout_1.Flex, { gap: 10 },
+            React.createElement(ui_layout_1.Flex, { gap: 10, className: "w-16" },
                 React.createElement(icons_1.Icon, { icon: "plus", size: 20, color: "var(--color-green-500)", className: "cursor-pointer", onClick: handleAddItem }),
                 React.createElement(icons_1.Icon, { icon: "minus", size: 20, color: "var(--color-red-425)", className: "cursor-pointer", onClick: handleRemoveItem(index) }))));
     })));

package/dist/cjs/ai-table/constants/index.d.ts

@@ -14,4 +14,8 @@ export declare const MAPPER_ITEM_TYPES: {
     readonly SELECT: "select";
     readonly TEXT: "text";
 };
+export declare const EDIT_FIELD_TYPES: {
+    readonly INPUT: "input";
+    readonly SELECT: "select";
+};
 //# sourceMappingURL=index.d.ts.map

package/dist/cjs/ai-table/constants/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ai-table/constants/index.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,YAAY;;CAExB,CAAC;AAEF,eAAO,MAAM,cAAc,MAAM,CAAC;AAElC,eAAO,MAAM,iBAAiB,KAAK,CAAC;AACpC,eAAO,MAAM,oBAAoB,IAAI,CAAC;AAEtC,eAAO,MAAM,iBAAiB;;;GAG3B,CAAC;AAEJ,eAAO,MAAM,eAAe,OAAO,CAAC;AAEpC,eAAO,MAAM,wBAAwB,MAAO,CAAC;AAE7C,eAAO,MAAM,iBAAiB;;;CAGpB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ai-table/constants/index.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,YAAY;;CAExB,CAAC;AAEF,eAAO,MAAM,cAAc,MAAM,CAAC;AAElC,eAAO,MAAM,iBAAiB,KAAK,CAAC;AACpC,eAAO,MAAM,oBAAoB,IAAI,CAAC;AAEtC,eAAO,MAAM,iBAAiB;;;GAG3B,CAAC;AAEJ,eAAO,MAAM,eAAe,OAAO,CAAC;AAEpC,eAAO,MAAM,wBAAwB,MAAO,CAAC;AAE7C,eAAO,MAAM,iBAAiB;;;CAGpB,CAAC;AAEX,eAAO,MAAM,gBAAgB;;;CAGnB,CAAC"}

package/dist/cjs/ai-table/constants/index.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.MAPPER_ITEM_TYPES = exports.IS_EDITING_INITIAL_VALUE = exports.DEFAULT_ROW_KEY = exports.PAGE_SIZE_OPTIONS = exports.DEFAULT_CURRENT_PAGE = exports.DEFAULT_PAGE_SIZE = exports.DEBOUNCE_DELAY = exports.FILTER_TYPES = void 0;
+exports.EDIT_FIELD_TYPES = exports.MAPPER_ITEM_TYPES = exports.IS_EDITING_INITIAL_VALUE = exports.DEFAULT_ROW_KEY = exports.PAGE_SIZE_OPTIONS = exports.DEFAULT_CURRENT_PAGE = exports.DEFAULT_PAGE_SIZE = exports.DEBOUNCE_DELAY = exports.FILTER_TYPES = void 0;
 exports.FILTER_TYPES = {
     INPUT: 'text'
 };
@@ -17,3 +17,7 @@ exports.MAPPER_ITEM_TYPES = {
     SELECT: 'select',
     TEXT: 'text'
 };
+exports.EDIT_FIELD_TYPES = {
+    INPUT: 'input',
+    SELECT: 'select'
+};

package/dist/cjs/ai-table/utils/render-edit-fields/__tests__/index.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=index.test.d.ts.map

package/dist/cjs/ai-table/utils/render-edit-fields/__tests__/index.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.test.d.ts","sourceRoot":"","sources":["../../../../../../src/ai-table/utils/render-edit-fields/__tests__/index.test.tsx"],"names":[],"mappings":""}

package/dist/cjs/ai-table/utils/render-edit-fields/__tests__/index.test.js

@@ -0,0 +1,220 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+/* eslint-disable @typescript-eslint/no-explicit-any */
+const react_1 = require("@testing-library/react");
+const user_event_1 = require("@testing-library/user-event");
+const React = require("react");
+const vitest_1 = require("vitest");
+const constants_1 = require("../../../constants");
+const index_1 = require("../index");
+vitest_1.vi.mock('@akinon/ui-input', () => ({
+    Input: (_a) => {
+        var { value, onChange, className } = _a, props = __rest(_a, ["value", "onChange", "className"]);
+        return (React.createElement("input", Object.assign({ "data-testid": "edit-input", value: value, onChange: onChange, className: className }, props)));
+    }
+}));
+vitest_1.vi.mock('@akinon/ui-select', () => ({
+    Select: (_a) => {
+        var { value, onChange, rootClassName, options } = _a, props = __rest(_a, ["value", "onChange", "rootClassName", "options"]);
+        const handleChange = (e) => {
+            onChange === null || onChange === void 0 ? void 0 : onChange(e.target.value);
+        };
+        return (React.createElement("select", Object.assign({ "data-testid": "edit-select", value: value !== null && value !== void 0 ? value : '', onChange: handleChange, className: rootClassName }, props), options === null || options === void 0 ? void 0 : options.map((opt) => (React.createElement("option", { key: opt.value, value: String(opt.value) }, opt.label)))));
+    }
+}));
+(0, vitest_1.describe)('getEditFieldConfig', () => {
+    (0, vitest_1.it)('returns config with INPUT type when dataIndex matches string in editDataIndexes', () => {
+        const editDataIndexes = ['name', 'value'];
+        (0, vitest_1.expect)((0, index_1.getEditFieldConfig)(editDataIndexes, 'name')).toEqual({
+            key: 'name',
+            type: constants_1.EDIT_FIELD_TYPES.INPUT
+        });
+        (0, vitest_1.expect)((0, index_1.getEditFieldConfig)(editDataIndexes, 'value')).toEqual({
+            key: 'value',
+            type: constants_1.EDIT_FIELD_TYPES.INPUT
+        });
+    });
+    (0, vitest_1.it)('returns undefined when dataIndex does not match any string', () => {
+        const editDataIndexes = ['name', 'value'];
+        (0, vitest_1.expect)((0, index_1.getEditFieldConfig)(editDataIndexes, 'other')).toBeUndefined();
+        (0, vitest_1.expect)((0, index_1.getEditFieldConfig)(editDataIndexes, '')).toBeUndefined();
+    });
+    (0, vitest_1.it)('returns config object when dataIndex matches object key (INPUT)', () => {
+        const editDataIndexes = [
+            { key: 'name', type: constants_1.EDIT_FIELD_TYPES.INPUT },
+            {
+                key: 'value',
+                type: constants_1.EDIT_FIELD_TYPES.INPUT,
+                attributes: { placeholder: 'Value' }
+            }
+        ];
+        (0, vitest_1.expect)((0, index_1.getEditFieldConfig)(editDataIndexes, 'name')).toEqual({
+            key: 'name',
+            type: constants_1.EDIT_FIELD_TYPES.INPUT
+        });
+        (0, vitest_1.expect)((0, index_1.getEditFieldConfig)(editDataIndexes, 'value')).toEqual({
+            key: 'value',
+            type: constants_1.EDIT_FIELD_TYPES.INPUT,
+            attributes: { placeholder: 'Value' }
+        });
+    });
+    (0, vitest_1.it)('returns config object when dataIndex matches object key (SELECT)', () => {
+        const selectConfig = {
+            key: 'status',
+            type: constants_1.EDIT_FIELD_TYPES.SELECT,
+            attributes: {
+                options: [
+                    { label: 'Active', value: 'active' },
+                    { label: 'Inactive', value: 'inactive' }
+                ]
+            }
+        };
+        const editDataIndexes = [selectConfig];
+        (0, vitest_1.expect)((0, index_1.getEditFieldConfig)(editDataIndexes, 'status')).toEqual(selectConfig);
+    });
+    (0, vitest_1.it)('returns undefined for empty editDataIndexes', () => {
+        (0, vitest_1.expect)((0, index_1.getEditFieldConfig)([], 'name')).toBeUndefined();
+    });
+    (0, vitest_1.it)('returns first match when multiple entries could match', () => {
+        const editDataIndexes = [
+            'name',
+            { key: 'name', type: constants_1.EDIT_FIELD_TYPES.INPUT }
+        ];
+        (0, vitest_1.expect)((0, index_1.getEditFieldConfig)(editDataIndexes, 'name')).toEqual({
+            key: 'name',
+            type: constants_1.EDIT_FIELD_TYPES.INPUT
+        });
+    });
+});
+(0, vitest_1.describe)('renderEditField', () => {
+    (0, vitest_1.it)('renders Input for INPUT config', () => {
+        const onChange = vitest_1.vi.fn();
+        (0, react_1.render)(React.createElement(React.Fragment, null, (0, index_1.renderEditField)({
+            config: { key: 'name', type: constants_1.EDIT_FIELD_TYPES.INPUT },
+            value: 'test',
+            onChange
+        })));
+        const input = react_1.screen.getByTestId('edit-input');
+        (0, vitest_1.expect)(input).toBeInTheDocument();
+        (0, vitest_1.expect)(input).toHaveValue('test');
+    });
+    (0, vitest_1.it)('calls onChange with input value when Input changes', () => {
+        const onChange = vitest_1.vi.fn();
+        (0, react_1.render)(React.createElement(React.Fragment, null, (0, index_1.renderEditField)({
+            config: { key: 'name', type: constants_1.EDIT_FIELD_TYPES.INPUT },
+            value: '',
+            onChange
+        })));
+        const input = react_1.screen.getByTestId('edit-input');
+        react_1.fireEvent.change(input, { target: { value: 'new value' } });
+        (0, vitest_1.expect)(onChange).toHaveBeenCalledWith('new value');
+    });
+    (0, vitest_1.it)('passes attributes to Input (className, etc.)', () => {
+        (0, react_1.render)(React.createElement(React.Fragment, null, (0, index_1.renderEditField)({
+            config: {
+                key: 'name',
+                type: constants_1.EDIT_FIELD_TYPES.INPUT,
+                attributes: { className: 'custom-class', placeholder: 'Name' }
+            },
+            value: '',
+            onChange: vitest_1.vi.fn()
+        })));
+        const input = react_1.screen.getByTestId('edit-input');
+        (0, vitest_1.expect)(input).toHaveClass('custom-class');
+        (0, vitest_1.expect)(input).toHaveAttribute('placeholder', 'Name');
+    });
+    (0, vitest_1.it)('calls attributes.onChange and then onChange when both provided', async () => {
+        const user = user_event_1.default.setup();
+        const onAttributeChange = vitest_1.vi.fn();
+        const onChange = vitest_1.vi.fn();
+        (0, react_1.render)(React.createElement(React.Fragment, null, (0, index_1.renderEditField)({
+            config: {
+                key: 'name',
+                type: constants_1.EDIT_FIELD_TYPES.INPUT,
+                attributes: { onChange: onAttributeChange }
+            },
+            value: '',
+            onChange
+        })));
+        const input = react_1.screen.getByTestId('edit-input');
+        await user.type(input, 'x');
+        (0, vitest_1.expect)(onAttributeChange).toHaveBeenCalled();
+        (0, vitest_1.expect)(onChange).toHaveBeenCalled();
+    });
+    (0, vitest_1.it)('renders Select for SELECT config', () => {
+        const onChange = vitest_1.vi.fn();
+        const options = [
+            { label: 'Active', value: 'active' },
+            { label: 'Inactive', value: 'inactive' }
+        ];
+        (0, react_1.render)(React.createElement(React.Fragment, null, (0, index_1.renderEditField)({
+            config: {
+                key: 'status',
+                type: constants_1.EDIT_FIELD_TYPES.SELECT,
+                attributes: { options }
+            },
+            value: 'active',
+            onChange
+        })));
+        const select = react_1.screen.getByTestId('edit-select');
+        (0, vitest_1.expect)(select).toBeInTheDocument();
+        (0, vitest_1.expect)(select).toHaveValue('active');
+    });
+    (0, vitest_1.it)('calls onChange when Select value changes', async () => {
+        const user = user_event_1.default.setup();
+        const onChange = vitest_1.vi.fn();
+        const options = [
+            { label: 'Active', value: 'active' },
+            { label: 'Inactive', value: 'inactive' }
+        ];
+        (0, react_1.render)(React.createElement(React.Fragment, null, (0, index_1.renderEditField)({
+            config: {
+                key: 'status',
+                type: constants_1.EDIT_FIELD_TYPES.SELECT,
+                attributes: { options }
+            },
+            value: 'active',
+            onChange
+        })));
+        const select = react_1.screen.getByTestId('edit-select');
+        await user.selectOptions(select, 'inactive');
+        (0, vitest_1.expect)(onChange).toHaveBeenCalledWith('inactive');
+    });
+    (0, vitest_1.it)('passes rootClassName to Select', () => {
+        const options = [{ label: 'A', value: 'a' }];
+        (0, react_1.render)(React.createElement(React.Fragment, null, (0, index_1.renderEditField)({
+            config: {
+                key: 'status',
+                type: constants_1.EDIT_FIELD_TYPES.SELECT,
+                attributes: { options, rootClassName: 'select-root' }
+            },
+            value: '',
+            onChange: vitest_1.vi.fn()
+        })));
+        const select = react_1.screen.getByTestId('edit-select');
+        (0, vitest_1.expect)(select).toHaveClass('select-root');
+    });
+    (0, vitest_1.it)('defaults to Input for unknown config type', () => {
+        (0, react_1.render)(React.createElement(React.Fragment, null, (0, index_1.renderEditField)({
+            config: {
+                key: 'name',
+                type: 'unknown'
+            },
+            value: 'fallback',
+            onChange: vitest_1.vi.fn()
+        })));
+        (0, vitest_1.expect)(react_1.screen.getByTestId('edit-input')).toBeInTheDocument();
+        (0, vitest_1.expect)(react_1.screen.getByTestId('edit-input')).toHaveValue('fallback');
+    });
+});