// src/app/piying/page/component/non-field-control/status/example/all-props/content.ts
import * as v from 'valibot';
import { actions, NFCSchema } from '@piying/view-angular-core';
import { safeDefine } from '@@piying-define';
export default v.pipe(
v.tuple([
v.pipe(
NFCSchema,
safeDefine.setComponent('status', (actions) => {
return [
actions.inputs.patch({
content: 'Complete Status',
color: 'success',
size: 'lg',
animatePing: true,
}),
];
}),
),
]),
actions.wrappers.patch(['div']),
actions.class.top('flex gap-4'),
);
// src/app/piying/page/component/non-field-control/status/example/animate/content.ts
import * as v from 'valibot';
import { actions, NFCSchema } from '@piying/view-angular-core';
import { safeDefine } from '@@piying-define';
export default v.pipe(
v.tuple([
v.pipe(
NFCSchema,
safeDefine.setComponent('status', (actions) => {
return [actions.inputs.patch({ content: 'Ping', animatePing: true })];
}),
),
v.pipe(
NFCSchema,
safeDefine.setComponent('status', (actions) => {
return [actions.inputs.patch({ content: 'Bounce', animateBounce: true })];
}),
),
]),
actions.wrappers.patch(['div']),
actions.class.top('flex gap-4'),
);
// src/app/piying/page/component/non-field-control/status/example/base/content.ts
import * as v from 'valibot';
import { actions, NFCSchema } from '@piying/view-angular-core';
import { safeDefine } from '@@piying-define';
export default v.pipe(
v.tuple([
v.pipe(
NFCSchema,
safeDefine.setComponent('status', (actions) => {
return [actions.inputs.patch({ content: 'Online' })];
}),
),
]),
actions.wrappers.patch(['div']),
actions.class.top('flex gap-4'),
);
// src/app/piying/page/component/non-field-control/status/example/color/content.ts
import * as v from 'valibot';
import { actions, NFCSchema } from '@piying/view-angular-core';
import { safeDefine } from '@@piying-define';
export default v.pipe(
v.tuple([
v.pipe(
NFCSchema,
safeDefine.setComponent('status', (actions) => {
return [actions.inputs.patch({ content: 'Primary', color: 'primary' })];
}),
),
v.pipe(
NFCSchema,
safeDefine.setComponent('status', (actions) => {
return [actions.inputs.patch({ content: 'Secondary', color: 'secondary' })];
}),
),
v.pipe(
NFCSchema,
safeDefine.setComponent('status', (actions) => {
return [actions.inputs.patch({ content: 'Success', color: 'success' })];
}),
),
v.pipe(
NFCSchema,
safeDefine.setComponent('status', (actions) => {
return [actions.inputs.patch({ content: 'Error', color: 'error' })];
}),
),
]),
actions.wrappers.patch(['div']),
actions.class.top('flex gap-4 flex-wrap'),
);
// src/app/piying/page/component/non-field-control/status/example/size/content.ts
import * as v from 'valibot';
import { actions, NFCSchema } from '@piying/view-angular-core';
import { safeDefine } from '@@piying-define';
export default v.pipe(
v.tuple([
v.pipe(
NFCSchema,
safeDefine.setComponent('status', (actions) => {
return [actions.inputs.patch({ content: 'XS', size: 'xs' })];
}),
),
v.pipe(
NFCSchema,
safeDefine.setComponent('status', (actions) => {
return [actions.inputs.patch({ content: 'SM', size: 'sm' })];
}),
),
v.pipe(
NFCSchema,
safeDefine.setComponent('status', (actions) => {
return [actions.inputs.patch({ content: 'MD', size: 'md' })];
}),
),
v.pipe(
NFCSchema,
safeDefine.setComponent('status', (actions) => {
return [actions.inputs.patch({ content: 'LG', size: 'lg' })];
}),
),
]),
actions.wrappers.patch(['div']),
actions.class.top('flex gap-4 flex-wrap'),
);