// src/app/piying/page/component/field-group/drawer/example/contentClass/content.ts
import * as v from 'valibot';
import { actions, NFCSchema, setComponent } from '@piying/view-angular-core';
import { safeDefine } from '@@piying-define';
export default v.pipe(
v.tuple([
v.pipe(
v.object({
content: v.object({
_btn: v.pipe(
NFCSchema,
setComponent('button'),
v.title('l1-title'),
safeDefine.setComponent('button', (actions) => {
return [
actions.attributes.patch({
for: 'exp-0',
}),
];
}),
),
}),
side: v.pipe(
v.object({
l1: v.pipe(v.string(), v.title('l1-title')),
l2: v.pipe(v.boolean(), v.title('l2-title')),
}),
actions.wrappers.patch(['div']),
actions.class.top('bg-base-100'),
),
}),
safeDefine.setComponent('drawer', (actions) => {
return [
actions.inputs.patch({
contentClass: 'bg-primary/10',
name: 'exp-0',
}),
];
}),
),
]),
actions.wrappers.patch(['div']),
actions.class.top('flex gap-4 will-change-transform'),
);
// src/app/piying/page/component/field-group/drawer/example/mode/content.ts
import * as v from 'valibot';
import { actions, NFCSchema, setComponent } from '@piying/view-angular-core';
import { safeDefine } from '@@piying-define';
export default v.pipe(
v.tuple([
v.pipe(
v.object({
content: v.object({
_btn: v.pipe(
NFCSchema,
setComponent('button'),
v.title('l1-title'),
safeDefine.setComponent('button', (actions) => {
return [
actions.attributes.patch({
for: 'exp-1',
}),
];
}),
),
}),
side: v.pipe(
v.object({
l1: v.pipe(v.string(), v.title('l1-title')),
l2: v.pipe(v.boolean(), v.title('l2-title')),
}),
actions.wrappers.patch(['div']),
actions.class.top('bg-base-100'),
),
}),
safeDefine.setComponent('drawer', (actions) => {
return [
actions.inputs.patch({
mode: 'side',
name: 'exp-1',
}),
];
}),
),
]),
actions.wrappers.patch(['div']),
actions.class.top('flex gap-4 will-change-transform'),
);
// src/app/piying/page/component/field-group/drawer/example/overlayClass/content.ts
import * as v from 'valibot';
import { actions, NFCSchema, setComponent } from '@piying/view-angular-core';
import { safeDefine } from '@@piying-define';
export default v.pipe(
v.tuple([
v.pipe(
v.object({
content: v.object({
_btn: v.pipe(
NFCSchema,
setComponent('button'),
v.title('l1-title'),
safeDefine.setComponent('button', (actions) => {
return [
actions.attributes.patch({
for: 'exp-2',
}),
];
}),
),
}),
side: v.pipe(
v.object({
l1: v.pipe(v.string(), v.title('l1-title')),
l2: v.pipe(v.boolean(), v.title('l2-title')),
}),
actions.wrappers.patch(['div']),
actions.class.top('bg-base-100'),
),
}),
safeDefine.setComponent('drawer', (actions) => {
return [
actions.inputs.patch({
overlayClass: 'bg-black/50',
name: 'exp-2',
}),
];
}),
),
]),
actions.wrappers.patch(['div']),
actions.class.top('flex gap-4 will-change-transform'),
);
// src/app/piying/page/component/field-group/drawer/example/position/content.ts
import * as v from 'valibot';
import { actions, NFCSchema, setComponent } from '@piying/view-angular-core';
import { safeDefine } from '@@piying-define';
export default v.pipe(
v.tuple([
v.pipe(
v.object({
content: v.object({
_btn: v.pipe(
NFCSchema,
setComponent('button'),
v.title('l1-title'),
safeDefine.setComponent('button', (actions) => {
return [
actions.attributes.patch({
for: 'exp-3',
}),
];
}),
),
}),
side: v.pipe(
v.object({
l1: v.pipe(v.string(), v.title('l1-title')),
l2: v.pipe(v.boolean(), v.title('l2-title')),
}),
actions.wrappers.patch(['div']),
actions.class.top('bg-base-100'),
),
}),
safeDefine.setComponent('drawer', (actions) => {
return [
actions.inputs.patch({
position: 'end',
name: 'exp-3',
}),
];
}),
),
]),
actions.wrappers.patch(['div']),
actions.class.top('flex gap-4 will-change-transform'),
);
// src/app/piying/page/component/field-group/drawer/example/sideClass/content.ts
import * as v from 'valibot';
import { actions, NFCSchema, setComponent } from '@piying/view-angular-core';
import { safeDefine } from '@@piying-define';
export default v.pipe(
v.tuple([
v.pipe(
v.object({
content: v.object({
_btn: v.pipe(
NFCSchema,
setComponent('button'),
v.title('l1-title'),
safeDefine.setComponent('button', (actions) => {
return [
actions.attributes.patch({
for: 'exp-5',
}),
];
}),
),
}),
side: v.pipe(
v.object({
l1: v.pipe(v.string(), v.title('l1-title')),
l2: v.pipe(v.boolean(), v.title('l2-title')),
}),
actions.wrappers.patch(['div']),
actions.class.top('bg-base-100'),
),
}),
safeDefine.setComponent('drawer', (actions) => {
return [
actions.inputs.patch({
sideClass: 'bg-base-200',
name: 'exp-5',
}),
];
}),
),
]),
actions.wrappers.patch(['div']),
actions.class.top('flex gap-4 will-change-transform'),
);