// src/app/piying/page/component/extension/option-list/example/optionConvert/content.ts
import * as v from 'valibot';
import { actions } from '@piying/view-angular-core';
import { safeDefine } from '@@piying-define';
export default v.pipe(
  v.tuple([
    v.pipe(
      v.string(),
      safeDefine.setComponent('option-list', (actions) => {
        return [
          actions.inputs.patch({
            options: [
              { id: 1, name: '选项 1' },
              { id: 2, name: '选项 2' },
            ],
            optionConvert: {
              label: (item: any) => item.name,
              value: (item: any) => item.id,
            },
          }),
        ];
      }),
    ),
  ]),
  actions.wrappers.patch(['div']),
  actions.class.top('flex gap-4'),
);

// src/app/piying/page/component/extension/option-list/example/optionTemplate/content.ts
import * as v from 'valibot';
import { actions } from '@piying/view-angular-core';
import { safeDefine } from '@@piying-define';
export default v.pipe(
  v.tuple([
    v.pipe(
      v.string(),
      safeDefine.setComponent('option-list', (actions) => {
        return [
          actions.inputs.patch({
            options: [
              { id: 1, name: '选项 1' },
              { id: 2, name: '选项 2' },
            ],
            optionTemplate: { content: (item: any) => `📌 ${item.name}` },
          }),
        ];
      }),
    ),
  ]),
  actions.wrappers.patch(['div']),
  actions.class.top('flex gap-4'),
);

// src/app/piying/page/component/extension/option-list/example/options/content.ts
import * as v from 'valibot';
import { actions } from '@piying/view-angular-core';
import { safeDefine } from '@@piying-define';
export default v.pipe(
  v.tuple([
    v.pipe(
      v.string(),
      safeDefine.setComponent('option-list', (actions) => {
        return [
          actions.inputs.patch({
            options: ['option-1', 'option-2', 'option-3'],
          }),
        ];
      }),
      actions.hooks.merge({
        allFieldsResolved: (field) => {
          setTimeout(() => {
            field.form.control!.updateValue('option-1');
          }, 0);
        },
      }),
    ),
  ]),
  actions.wrappers.patch(['div']),
  actions.class.top('flex gap-4'),
);

// src/app/piying/page/component/extension/option-list/example/select-multi/content.ts
import * as v from 'valibot';
import { actions } from '@piying/view-angular-core';
import { safeDefine } from '@@piying-define';
export default v.pipe(
  v.tuple([
    v.pipe(
      v.string(),
      safeDefine.setComponent('option-list', (actions) => {
        return [
          actions.inputs.patch({
            multiple: true,
            options: [
              {
                value: { value: 'option-1' },
                label: 'option-1',
              },
              {
                value: { value: 'option-2' },
                label: 'option-2',
              },
              {
                value: { value: 'option-3' },
                label: 'option-3',
              },
            ],
          }),
        ];
      }),
      actions.hooks.merge({
        allFieldsResolved: (field) => {
          setTimeout(() => {
            field.form.control!.updateValue([{ value: 'option-1' }, { value: 'option-2' }]);
          }, 0);
        },
      }),
    ),
  ]),
  actions.wrappers.patch(['div']),
  actions.class.top('flex gap-4'),
);