@qoretechnologies/reqraft 0.10.62 → 0.10.63-pr.142.g0b675cd

package/src/components/form/fields/auto/AutoFormField.stories.tsx

@@ -1,825 +0,0 @@
-// Stories for the ported AutoFormField (FIELD_STACK_REPORT batch).
-// Two groups:
-// 1. The reqraft behavioral stories from the original field-migration batch
-//    (Empty…ViaFormEngine) — kept, adapted to the IDE's 4-arg
-//    `onChange(name, value, type, canBeNull)` API.
-// 2. Ported from qorus-ide `src/stories/Fields/Auto.stories.tsx` — offline
-//    (templates fixture instead of `useTemplates`, no `InterfacesProvider`).
-//    The saved-values stories (`StringWithSuggestedValues`,
-//    `StringWithSuggestedAndSavedValues`) and the bare `Connection` story
-//    (InterfaceSelector) are not ported — IDE-only seams.
-import { StoryObj } from '@storybook/react-vite';
-import { expect, fn, userEvent, waitFor, within } from 'storybook/test';
-import jsyaml from 'js-yaml';
-import { useEffect, useState } from 'react';
-
-import { StoryMeta } from '../../../../types';
-import { buildTemplates } from '../../../../helpers/templates';
-import { FormEngine } from '../../engine/FormEngine';
-import templates from '../template/__fixtures__/templates.json';
-import { AutoFormField } from './AutoFormField';
-
-const meta = {
-  component: AutoFormField,
-  title: 'Components/Form/Auto',
-  args: {
-    onChange: fn(),
-    'aria-label': 'Auto field value',
-  },
-  render(args) {
-    const [value, setValue] = useState<any>(args.value);
-    return (
-      <AutoFormField
-        {...args}
-        value={value}
-        onChange={(name, value, type, canBeNull) => {
-          args.onChange?.(name, value, type, canBeNull);
-          setValue(value);
-        }}
-      />
-    );
-  },
-} as StoryMeta<typeof AutoFormField>;
-
-export default meta;
-type Story = StoryObj<typeof meta>;
-
-const sleep = (ms: number) => new Promise((resolve) => setTimeout(resolve, ms));
-
-/** Wait for some text to appear in the document. */
-const waitForText = async (text: string | RegExp) => {
-  const body = within(document.body);
-  await waitFor(() => expect(body.queryAllByText(text)[0]).toBeTruthy(), { timeout: 10000 });
-};
-
-/** The readable names of the types an untyped field's picker offers. */
-const IMMEDIATE_TYPE_NAMES = [
-  'True/False',
-  'Date',
-  'Text',
-  'Binary',
-  'Decimal',
-  'List',
-  'Key/Value {}',
-  'Integer',
-  'RGB Color',
-];
-
-/**
- * Opens the type picker and returns the open list. Asserts the closed trigger
- * reads `label` (the chosen type's readable name) when one is given, and that
- * it carries no item count: a count on a fixed list of types is noise.
- */
-const openTypePicker = async (canvasElement: HTMLElement, label?: string) => {
-  const trigger = await waitFor(
-    () => {
-      const button = canvasElement.querySelector(
-        '.auto-field-group [aria-haspopup]'
-      ) as HTMLElement | null;
-      expect(button).toBeTruthy();
-      return button!;
-    },
-    { timeout: 10000 }
-  );
-  if (label) {
-    await waitFor(() => expect(trigger.textContent).toContain(label), { timeout: 10000 });
-  }
-  await expect(trigger.querySelector('.reqore-button-badge')).toBeNull();
-  await userEvent.click(trigger);
-  return waitFor(
-    () => {
-      const el = document.querySelector('.reqore-popover-content') as HTMLElement | null;
-      expect(el).toBeTruthy();
-      return el!;
-    },
-    { timeout: 10000 }
-  );
-};
-
-/**
- * Closes the open type picker the way an author does — a click outside the
- * list (reqore's popover closes on an outside click; Escape could discard an
- * edit) — and waits until the list is gone.
- */
-const closeTypePicker = async (popover: HTMLElement) => {
-  await userEvent.click(document.body);
-  await waitFor(
-    () => {
-      expect(popover.isConnected).toBe(false);
-      expect(document.querySelector('.reqore-popover-content')).toBeNull();
-    },
-    { timeout: 10000 }
-  );
-};
-
-/**
- * Nothing (an open list) covers the control: it is on top at its centre and
- * across its width — a full-width editor's centre is clear of a narrow list
- * anchored at its left, so the centre alone would not show it.
- */
-const expectUncovered = async (control: HTMLElement) => {
-  const box = control.getBoundingClientRect();
-  for (const fraction of [0.1, 0.3, 0.5, 0.7, 0.9]) {
-    const hit = document.elementFromPoint(
-      box.left + box.width * fraction,
-      box.top + box.height / 2
-    );
-    await expect(hit !== null && (hit === control || control.contains(hit))).toBe(true);
-  }
-};
-
-const expectOffered = async (popover: HTMLElement, labels: string[]) => {
-  await waitFor(
-    () => {
-      for (const label of labels) {
-        expect(within(popover).getAllByText(label, { exact: true }).length).toBeGreaterThan(0);
-      }
-    },
-    { timeout: 10000 }
-  );
-  await expect(within(popover).queryByText(/^soft/)).not.toBeInTheDocument();
-};
-
-// --- reqraft behavioral stories (kept from the field-migration batch) -------
-
-/** Untyped, no value — the field opens on an editor to type into, never on a type question. */
-export const Empty: Story = {
-  args: {},
-  parameters: {
-    docs: {
-      description: {
-        story:
-          'Renders AutoFormField with no value or defaultType. The field opens on a text editor to type into; it does not show a type picker or ask for a data type.',
-      },
-    },
-  },
-  async play({ canvasElement }) {
-    const canvas = within(canvasElement);
-    // The type resolves in a mount effect — assert asynchronously.
-    await waitFor(() => expect(canvasElement.querySelector('textarea')).toBeInTheDocument(), {
-      timeout: 5000,
-    });
-    await expect(canvas.queryByText('Please select data type')).not.toBeInTheDocument();
-    await expect(canvasElement.querySelector('input[type="number"]')).not.toBeInTheDocument();
-  },
-};
-
-/** A pre-existing numeric value resolves the type without any user action. */
-export const InferredInteger: Story = {
-  args: {
-    value: 42,
-  },
-  parameters: {
-    docs: {
-      description: {
-        story:
-          'Renders AutoFormField with a pre-existing numeric value of 42 — the type is inferred as int and the numeric input is shown without prompting for a type.',
-      },
-    },
-  },
-  async play({ canvasElement }) {
-    const canvas = within(canvasElement);
-    // Resolved → a concrete field renders (post mount effect) and no prompt.
-    await waitFor(() => expect(canvasElement.querySelector('input')).toBeInTheDocument(), {
-      timeout: 5000,
-    });
-    await expect(canvas.queryByText('Please select data type')).not.toBeInTheDocument();
-  },
-};
-
-/** A pre-existing string value resolves to the text field. */
-export const InferredText: Story = {
-  args: {
-    value: 'hello world',
-  },
-  parameters: {
-    docs: {
-      description: {
-        story:
-          'Renders AutoFormField with a pre-existing string value — the type is inferred as string and the text field is shown holding "hello world".',
-      },
-    },
-  },
-  async play({ canvasElement }) {
-    const canvas = within(canvasElement);
-    await expect(await canvas.findByDisplayValue('hello world')).toBeInTheDocument();
-  },
-};
-
-/** A concrete `defaultType` renders that field directly — no picker. */
-export const ConcreteString: Story = {
-  args: {
-    defaultType: 'string',
-  },
-  parameters: {
-    docs: {
-      description: {
-        story:
-          'Renders AutoFormField with a concrete defaultType of string — the text field is shown directly, no type picker. Typing "abc" fires onChange with the value and inferred type.',
-      },
-    },
-  },
-  async play({ canvasElement, args }) {
-    const canvas = within(canvasElement);
-    // string renders the IDE's LongString field — a textarea. The verbatim
-    // dispatcher also spreads `rest` onto its wrapper control group, so the
-    // aria-label lands twice — narrow to the textarea.
-    const input = await waitFor(
-      () => canvas.getByLabelText('Auto field value', { selector: 'textarea' }),
-      { timeout: 5000 }
-    );
-    await userEvent.type(input, 'abc');
-    await waitFor(
-      () => expect(args.onChange).toHaveBeenLastCalledWith(undefined, 'abc', 'string', false),
-      { timeout: 5000 }
-    );
-  },
-};
-
-/** `canBeNull` adds a toggle that sets / clears the null sentinel. */
-export const Nullable: Story = {
-  args: {
-    defaultType: 'string',
-    value: 'some text',
-    canBeNull: true,
-  },
-  parameters: {
-    docs: {
-      description: {
-        story:
-          'Renders AutoFormField with canBeNull enabled. Clicking "Set as null" clears the value to null, hides the field editor and flips the toggle to "Unset null".',
-      },
-    },
-  },
-  async play({ canvasElement, args }) {
-    const canvas = within(canvasElement);
-
-    // Field visible, toggle reads "Set as null".
-    await expect(await canvas.findByDisplayValue('some text')).toBeInTheDocument();
-    const toggle = canvas.getByText('Set as null');
-
-    await userEvent.click(toggle);
-
-    // Value cleared to null, toggle flips, the field shows the null sentinel.
-    await waitFor(() =>
-      expect(args.onChange).toHaveBeenLastCalledWith(undefined, null, 'string', true)
-    );
-    await expect(canvas.getByText('Unset null')).toBeInTheDocument();
-    await expect(canvas.queryByDisplayValue('some text')).not.toBeInTheDocument();
-  },
-};
-
-/** A field declaring several allowed types still picks between them. */
-export const AllowedTypesSubset: Story = {
-  args: {
-    allowedTypes: [
-      { name: 'int', display_name: 'Integer' },
-      { name: 'string', display_name: 'Text' },
-    ],
-  },
-  parameters: {
-    docs: {
-      description: {
-        story:
-          'Renders AutoFormField with allowedTypes restricted to Integer and Text. The type picker offers exactly those 2 types, with no item count, and the field can be typed into meanwhile without being asked for a data type.',
-      },
-    },
-  },
-  async play({ canvasElement }) {
-    await expect(within(canvasElement).queryByText('Please select data type')).not.toBeInTheDocument();
-    const popover = await openTypePicker(canvasElement);
-    await expectOffered(popover, ['Integer', 'Text']);
-    await expect(within(popover).queryByText('Decimal')).not.toBeInTheDocument();
-  },
-};
-
-/** The picker offers no `soft*` type: a typed-in literal has nothing to convert. */
-export const NoSoftTypes: Story = {
-  args: {
-    /* The picker belongs to a value with a type: an untyped field that is
-       empty is typed into, and one holding text has resolved to `string`. */
-    defaultType: 'auto',
-    value: 'some text',
-  },
-  parameters: {
-    docs: {
-      description: {
-        story:
-          'Renders an untyped AutoFormField holding a text value. The type picker, chosen as Text, offers the 9 base types by readable name (True/False, Date, Text, Binary, Decimal, List, Key/Value {}, Integer, RGB Color) and no soft type, and shows no item count.',
-      },
-    },
-  },
-  async play({ canvasElement }) {
-    await expect(within(canvasElement).queryByText('Please select data type')).not.toBeInTheDocument();
-    const popover = await openTypePicker(canvasElement, 'Text');
-    await expectOffered(popover, IMMEDIATE_TYPE_NAMES);
-  },
-};
-
-/**
- * The whole point of the migration: a `FormEngine` schema with a field typed
- * `auto` renders the untyped editor for free, via FormEngine → TemplateField → auto.
- */
-export const ViaFormEngine: Story = {
-  parameters: {
-    docs: {
-      description: {
-        story:
-          'Renders a FormEngine schema whose single option is typed as auto. The engine flows through TemplateField to the untyped editor without any extra wiring: an editor to type into, with no data-type question.',
-      },
-    },
-  },
-  render: () => {
-    const [val, setVal] = useState<any>({});
-    return (
-      <FormEngine
-        name='autoFieldDemo'
-        options={{
-          myAutoField: {
-            type: 'auto',
-            ui_type: 'auto',
-            display_name: 'My Auto Field',
-            preselected: true,
-          },
-        }}
-        value={val}
-        onChange={(_n, v) => setVal(v)}
-      />
-    );
-  },
-  async play({ canvasElement }) {
-    const canvas = within(canvasElement);
-    // Generous timeout: findByText defaults to 1s, which flakes under CI load
-    // while the engine boots the auto field (the rest of the suite waits ~10s).
-    await expect(
-      await canvas.findByText('My Auto Field', undefined, { timeout: 10000 })
-    ).toBeInTheDocument();
-    // The untyped field opens on an editor inside the engine-driven form, and
-    // never asks for a data type.
-    await waitFor(() => expect(canvasElement.querySelector('textarea')).toBeInTheDocument(), {
-      timeout: 10000,
-    });
-    await expect(canvas.queryByText('Please select data type')).not.toBeInTheDocument();
-  },
-};
-
-/**
- * The ⋮ on that same field holds one group — "Set Custom Value" and the data
- * types under it — and opens it, rather than asking for a click to reach the
- * only thing on offer.
- */
-export const ViaFormEngineMenuOpensItsOnlyGroup: Story = {
-  parameters: {
-    docs: {
-      description: {
-        story:
-          'The untyped field\'s ⋮ holds nothing but the "Set Custom Value" section, so that section is already open: the data types are one click from the menu, not two. Where a menu holds more than one group the sections stay shut, because there the click is the choice.',
-      },
-    },
-  },
-  render: () => {
-    const [val, setVal] = useState<any>({});
-    return (
-      <FormEngine
-        name='autoFieldMenuDemo'
-        options={{
-          myAutoField: {
-            type: 'auto',
-            ui_type: 'auto',
-            display_name: 'My Auto Field',
-            preselected: true,
-          },
-        }}
-        value={val}
-        onChange={(_n, v) => setVal(v)}
-      />
-    );
-  },
-  async play({ canvasElement }) {
-    const canvas = within(canvasElement);
-    await expect(
-      await canvas.findByText('My Auto Field', undefined, { timeout: 10000 })
-    ).toBeInTheDocument();
-
-    const menu = await waitFor(
-      () => {
-        const el = canvasElement.querySelector('.template-more');
-        expect(el).toBeTruthy();
-        return el as HTMLElement;
-      },
-      { timeout: 10000 }
-    );
-    await userEvent.click(menu);
-
-    // The section still names its rows...
-    await waitFor(
-      () => expect(document.body.textContent).toContain('Set Custom Value'),
-      { timeout: 10000 }
-    );
-    // ...and the rows are there to click, with no header click in between.
-    await waitFor(() => expect(document.body.textContent).toContain('Ordered key-value pair'), {
-      timeout: 10000,
-    });
-  },
-};
-
-// --- ported IDE stories (qorus-ide stories/Fields/Auto.stories.tsx) ---------
-
-export const StringWithAllowedValues: Story = {
-  args: {
-    allowSaving: true,
-    defaultType: 'string',
-    allowed_values: [
-      {
-        display_name: 'test',
-        value: { type: 'string', value: 'test' },
-        short_desc: 'This is a test',
-      },
-      {
-        display_name: 'test 2',
-        value: { type: 'string', value: 'test 2' },
-        intent: 'info',
-      },
-    ],
-  },
-  parameters: {
-    docs: {
-      description: {
-        story:
-          'Renders AutoFormField for a string with two allowed values — the operator picks from the constrained list rather than typing freely.',
-      },
-    },
-  },
-};
-
-export const RichText: Story = {
-  args: {
-    defaultType: 'richtext',
-    value: 'something',
-    allowTemplates: true,
-    templates: buildTemplates(templates as any),
-  },
-  parameters: {
-    docs: {
-      description: {
-        story:
-          'Renders AutoFormField in richtext mode with templates enabled. Typing appends to the existing value inside the contenteditable editor.',
-      },
-    },
-  },
-  play: async ({ canvasElement }) => {
-    await waitFor(() => canvasElement.querySelector('div[contenteditable]'), {
-      timeout: 15000,
-    });
-    await sleep(4500);
-    await userEvent.click(canvasElement.querySelector('div[contenteditable]'));
-    await sleep(1000);
-    await userEvent.click(canvasElement.querySelector('div[contenteditable]'));
-    await userEvent.keyboard(' test');
-
-    await expect(canvasElement.querySelector('div[contenteditable]').textContent).toBe(
-      'something test'
-    );
-  },
-};
-
-export const ConnectionWithAllowedValues: Story = {
-  args: {
-    defaultType: 'connection',
-    forceDropdown: false,
-    allowed_values: [
-      {
-        display_name: 'test',
-        value: { type: 'connection', value: 'test' },
-        short_desc: 'This is a test',
-      },
-      {
-        display_name: 'test 2',
-        value: { type: 'connection', value: 'test 2' },
-        intent: 'info',
-        desc: 'This is a test 2',
-      },
-    ],
-  },
-  parameters: {
-    docs: {
-      description: {
-        story:
-          'Renders AutoFormField for a connection with two allowed values — clicking "Please select" opens the item picker modal titled "Select from items".',
-      },
-    },
-  },
-  play: async () => {
-    // connection is a no-compact type → the allowed values render as the
-    // select with the item collection (the IDE asserts the same modal title).
-    const body = within(document.body);
-    await userEvent.click(await body.findByText('Please select'));
-    await waitForText('Select from items');
-  },
-};
-
-export const Hash: Story = {
-  args: {
-    value: jsyaml.dump({ key: 'value' }),
-  },
-  parameters: {
-    docs: {
-      description: {
-        story:
-          'Renders AutoFormField with a YAML-serialized hash value — the type is inferred as hash and the object editor is shown holding the parsed data.',
-      },
-    },
-  },
-};
-
-export const File: Story = {
-  args: {
-    defaultType: 'file',
-    value: {
-      name: 'test.txt',
-      content: 'This is a test',
-      size: 1234,
-    },
-  },
-  parameters: {
-    docs: {
-      description: {
-        story:
-          'Renders AutoFormField in file mode holding a text-file value — the file field shows the file name in place of the drop zone.',
-      },
-    },
-  },
-};
-
-/**
- * A connection's `connect_timeout` / `timeout` option, as the server emits it:
- * `type: 'timeout'` holding an integer count of milliseconds.
- */
-export const Timeout: Story = {
-  args: {
-    defaultType: 'timeout',
-    defaultInternalType: 'timeout',
-    type: 'timeout',
-    value: 45000,
-  },
-  parameters: {
-    docs: {
-      description: {
-        story:
-          "Renders a connection's Connect Timeout option, which the server types as `timeout` and fills with 45000 milliseconds. The unit-aware timeout field shows it as 45 with the seconds unit selected.",
-      },
-    },
-  },
-  async play({ canvasElement }) {
-    const canvas = within(canvasElement);
-
-    const input = await canvas.findByDisplayValue('45');
-    await expect(input).toBeInTheDocument();
-    await expect(input).toHaveAttribute('inputmode', 'numeric');
-    await expect(canvas.getByText('seconds')).toBeInTheDocument();
-    await expect(canvas.queryByText('Unknown type!')).not.toBeInTheDocument();
-  },
-};
-
-export const AutoDoesNotChangeTypeBackToAuto: Story = {
-  args: {
-    defaultType: 'auto',
-    value: 'test',
-  },
-  parameters: {
-    docs: {
-      description: {
-        story:
-          'Renders AutoFormField in auto mode with a string value — the inferred type is shown as Text and the picker still offers every base type so the operator can switch away from auto without the field snapping back.',
-      },
-    },
-  },
-  async play({ canvasElement }) {
-    const popover = await openTypePicker(canvasElement, 'Text');
-    await expectOffered(popover, IMMEDIATE_TYPE_NAMES);
-    // End on what the story is about: the text value, still in its editor.
-    await closeTypePicker(popover);
-    const editor = await within(canvasElement).findByDisplayValue('test');
-    await expectUncovered(editor);
-  },
-};
-
-/** A soft type in a caller's allowed types is offered once, as its base type. */
-export const AllowedSoftTypesOfferedAsTheirBase: Story = {
-  args: {
-    allowedTypes: [{ name: 'softint' }, { name: 'int' }, { name: 'softstring' }],
-  },
-  parameters: {
-    docs: {
-      description: {
-        story:
-          'Renders AutoFormField whose allowedTypes are softint, int and softstring. The type picker offers Integer once and Text, with no soft type and no item count.',
-      },
-    },
-  },
-  async play({ canvasElement }) {
-    const popover = await openTypePicker(canvasElement);
-    await expectOffered(popover, ['Integer', 'Text']);
-    await expect(within(popover).getAllByText('Integer', { exact: true })).toHaveLength(1);
-  },
-};
-
-/** A value saved with a soft type is edited with its base type's editor. */
-export const SavedSoftTypeEditsAsItsBase: Story = {
-  args: {
-    defaultType: 'auto',
-    defaultInternalType: 'softint',
-    value: 5,
-  },
-  parameters: {
-    docs: {
-      description: {
-        story:
-          'Renders an untyped AutoFormField holding 5, saved with the soft type softint. It is edited with the integer editor and the type picker reads Integer, instead of drawing "Unknown type!".',
-      },
-    },
-  },
-  async play({ canvasElement }) {
-    const canvas = within(canvasElement);
-    await expect(await canvas.findByDisplayValue('5')).toBeInTheDocument();
-    await expect(canvas.queryByText('Unknown type!')).not.toBeInTheDocument();
-    const popover = await openTypePicker(canvasElement, 'Integer');
-    await expectOffered(popover, IMMEDIATE_TYPE_NAMES);
-    // End on what the story is about: the integer editor, holding 5.
-    await closeTypePicker(popover);
-    const input = await canvas.findByDisplayValue('5');
-    await expect(input.tagName).toBe('INPUT');
-    await expectUncovered(input);
-  },
-};
-
-export const ListWithAllowedValues: Story = {
-  args: {
-    defaultType: 'list',
-    allowed_values: [
-      {
-        display_name: 'Test 1',
-        value: { type: 'list', value: [{ type: 'string', value: 'test 1' }] },
-        short_desc: 'This is a test',
-      },
-      {
-        display_name: 'And test 2',
-        value: { type: 'list', value: [{ type: 'string', value: 'test 2' }] },
-        intent: 'info',
-      },
-    ],
-  },
-  parameters: {
-    docs: {
-      description: {
-        story:
-          'Renders AutoFormField in list mode restricted to two allowed list values — the operator picks one of the pre-defined lists rather than composing their own.',
-      },
-    },
-  },
-};
-
-export const StringWithCreatableAllowedValues: Story = {
-  args: {
-    defaultType: 'string',
-    value: '$.create.status',
-    allowed_values_creatable: true,
-    allowed_values: [
-      {
-        display_name: 'status from create',
-        short_desc: '$.create.status (int)',
-        value: { type: 'string', value: '$.create.status' },
-      },
-      {
-        display_name: 'body from create',
-        short_desc: '$.create.body (auto)',
-        value: { type: 'string', value: '$.create.body' },
-      },
-    ],
-  },
-  parameters: {
-    docs: {
-      description: {
-        story:
-          'Renders AutoFormField for a creatable string field: ONE control holds the value as a chip and offers the candidates, rather than a text box with a suggestion picker beside it. The chip reads as the label the producer gave the value, and a value the list cannot enumerate is still typeable.',
-      },
-    },
-  },
-};
-
-export const StringWithCreatableAllowedValuesOutsideTheList: Story = {
-  args: {
-    defaultType: 'string',
-    value: '$.create.body.items[0].sku',
-    allowed_values_creatable: true,
-    allowed_values: [
-      {
-        display_name: 'status from create',
-        short_desc: '$.create.status (int)',
-        value: { type: 'string', value: '$.create.status' },
-      },
-      {
-        display_name: 'body from create',
-        short_desc: '$.create.body (auto)',
-        value: { type: 'string', value: '$.create.body' },
-      },
-    ],
-  },
-  parameters: {
-    docs: {
-      description: {
-        story:
-          'The ordinary state of a creatable field once the value goes deeper than the candidates reach — `body` is `auto`, so nothing under it can be enumerated. The chip is drawn from the value itself.',
-      },
-    },
-  },
-};
-
-export const ListWithCreatableAllowedValues: Story = {
-  args: {
-    defaultType: 'list',
-    value: [{ type: 'string', value: 'test 1' }],
-    allowed_values_creatable: true,
-    allowed_values: [
-      {
-        display_name: 'Test 1',
-        value: { type: 'list', value: [{ type: 'string', value: 'test 1' }] },
-        short_desc: 'This is a test',
-      },
-      {
-        display_name: 'And test 2',
-        value: { type: 'list', value: [{ type: 'string', value: 'test 2' }] },
-        intent: 'info',
-      },
-    ],
-  },
-  parameters: {
-    docs: {
-      description: {
-        story:
-          'Renders AutoFormField in list mode with two allowed values but with allowed_values_creatable enabled — the operator can pick a canned list or compose a custom one.',
-      },
-    },
-  },
-};
-
-export const ListWithElementType: Story = {
-  args: {
-    defaultType: 'list',
-    element_type: 'int',
-  },
-  parameters: {
-    docs: {
-      description: {
-        story:
-          'Renders AutoFormField in list mode with an int element type — new items are added as integers rather than requiring the operator to pick a per-item type.',
-      },
-    },
-  },
-};
-
-/**
- * A named `arg_schema` whose fetch fails.
- *
- * The field asks the server for `dataprovider/arg_schemas/<name>`. When that
- * request rejected — a malformed instance URL, an aborted request, a transport
- * error — the rejection escaped the effect's async IIFE unhandled, `setError`
- * never ran, and `finalArgSchema` stayed undefined. The loading branch then
- * returned on every subsequent render and the error branch below it was
- * unreachable, so the field showed "Loading field data..." for the life of the
- * form: a request that failed instantly and one that is merely slow looked
- * exactly the same, forever.
- *
- * The transport is stubbed rather than left to the dev server, so the story
- * exercises that path and only that path.
- */
-export const NamedArgSchemaFetchFails: Story = {
-  args: {
-    name: 'rules',
-    type: 'list',
-    element_type: 'hash',
-    arg_schema: 'a-schema-that-does-not-resolve' as any,
-  },
-  parameters: {
-    docs: {
-      description: {
-        story:
-          'The named arg schema could not be fetched, so the field says so instead of showing an endless "Loading field data..." spinner with the error it had already received never rendered.',
-      },
-    },
-  },
-  decorators: [
-    (Story) => {
-      const real = window.fetch;
-      window.fetch = (() =>
-        Promise.reject(new Error('Failed to fetch the field schema'))) as typeof window.fetch;
-      useEffect(() => () => {
-        window.fetch = real;
-      }, []);
-      return <Story />;
-    },
-  ],
-  play: async () => {
-    await waitForText(/Failed to fetch the field schema|could not be loaded/);
-  },
-};