namirasoft-site-react 1.4.164 → 1.4.166

package/src/NSBoxBuilder.tsx

@@ -0,0 +1,829 @@
+import { AnySchema, ArraySchema, BaseNumberSchema, BasePrecisionSchema, BaseTypeBuilder, BaseTypeSchema, BaseVariableSchema, BigIntSchema, BoolSchema, ColorSchema, DateSchema, DateTimeSchema, DecimalSchema, DoubleSchema, DurationSchema, EmailSchema, EntitySchema, EnumSchema, FilePathSchema, FloatSchema, FontSchema, IntegerSchema, IPV4RangeSchema, IPV4Schema, IPV6RangeSchema, IPV6Schema, MediumIntSchema, MoneySchema, ObjectSchema, PhoneSchema, RealSchema, SmallIntSchema, StringSchema, TimeSchema, TimeZoneSchema, TinyIntSchema, URLSchema, VariableType, VersionSchema } from "namirasoft-schema";
+import { NSBoxBoolean, NSBoxCombo, NSBoxDate, NSBoxDateTime, NSBoxDouble, NSBoxDuration, NSBoxDynamic, NSBoxDynamicProps, NSBoxEmail, NSBoxEntity, NSBoxInteger, NSBoxIPV4, NSBoxIPV6, NSBoxMoney, NSBoxPhone, NSBoxString, NSBoxTime, NSMenuButtonMenuProps, NSPanel, NSRepeater, NSTitle, safeMenuMenuItem } from "./main";
+import { NSBoxTimeZone } from "./components/NSBoxTimeZone";
+import { NSBoxVersion } from "./components/NSBoxVersion";
+import { NSBoxIPV4Range } from "./components/NSBoxIPV4Range";
+import { NSBoxIPV6Range } from "./components/NSBoxIPV6Range";
+import { NSBoxColor } from "./components/NSBoxColor";
+import { NSBoxFont } from "./components/NSBoxFont";
+import { NSBoxFilePath } from "./components/NSBoxFilePath";
+import { NSBoxURL } from "./components/NSBoxURL";
+import { NamingConvention, ObjectService } from "namirasoft-core";
+import { INSBox } from "./components/INSBox";
+import { createRef } from "react";
+
+export class NSBoxBuilder extends BaseTypeBuilder<React.JSX.Element | null>
+{
+    private box: NSBoxDynamic;
+    private props: NSBoxDynamicProps;
+    private box_ref: React.RefObject<INSBox>;
+    private key: string;
+    private title: string;
+    private placeholder: string;
+    private menu: NSMenuButtonMenuProps;
+    private builders: { builder: NSBoxBuilder, ref: React.RefObject<INSBox> }[] = [];
+
+    constructor(box: NSBoxDynamic, props: NSBoxDynamicProps, box_ref: React.RefObject<INSBox>, key: string, onDelete?: () => void)
+    {
+        super(props.variable.type);
+        this.box = box;
+        this.props = props;
+        this.box_ref = box_ref;
+        this.key = key;
+        this.toInteger = this.toInteger.bind(this);
+        this.toPrecision = this.toPrecision.bind(this);
+        this.ifOjbect = this.ifOjbect.bind(this);
+
+        this.title = this.props.title;
+        if (!this.title)
+            this.title = NamingConvention.auto.convert(this.props.variable.name, NamingConvention.Pascal_Case_Space);
+        this.placeholder = props.variable.type.example ?? "";
+        this.menu = safeMenuMenuItem(this.props, () => { });
+        this.menu.builtin.delete = { enabled: true, onDelete };
+        this.builders = this.ifOjbect((_, fields) =>
+        {
+            return fields.map((f) =>
+            {
+                let title = NamingConvention.auto.convert(f.name, NamingConvention.Pascal_Case_Space);
+                let props = {
+                    ...this.props,
+                    title,
+                    onChanged: (box: NSBoxDynamic, callback?: () => void) =>
+                    {
+                        this.props.onChanged?.(box, callback);
+                    },
+                    variable: f,
+                    multiple: false
+                };
+                let ref = createRef<INSBox>();
+                return { builder: new NSBoxBuilder(this.box, props, ref, "NSBoxBuilder_Object_" + f.name), ref };
+            });
+        }) ?? [];
+    }
+    private ifOjbect<T>(handler: (schema: ObjectSchema, fields: BaseVariableSchema[]) => T): T | null
+    {
+        if (this.props.variable.type.type === VariableType.Object)
+        {
+            let schema = this.props.variable.type as ObjectSchema;
+
+            if (this.props.multiple === true)
+                return null;
+            if (schema.external)
+                return null;
+            if (!schema.fields)
+                return null
+            if (schema.fields.length === 0)
+                return null
+            if (schema.fields)
+                return handler(schema, schema.fields);
+        }
+        return null;
+    }
+    getValue(checkError: boolean = true): string
+    {
+        let obj = this.box_ref.current?.getValue(checkError);
+
+        let res = this.ifOjbect((_, fields) =>
+        {
+            let ans: { [name: string]: any } = {};
+            fields.forEach((f, index) =>
+            {
+                debugger;
+                let obj = this.builders[index].builder.getValue(checkError);
+                ans[f.name] = obj;
+            });
+            return ans;
+        });
+        if (res != null)
+            obj = res;
+
+        return JSON.stringify(obj);
+    }
+    setValue(value: string | null, callback?: () => void): void
+    {
+        let obj: any | null = null;
+        if (value)
+            obj = JSON.parse(value);
+
+        if (!this.ifOjbect((_, fields) =>
+        {
+            fields.forEach((f, index) =>
+            {
+                let value = obj?.[f.name];
+                this.builders[index].builder.setValue(value);
+            });
+            return true;
+        }))
+            this.box_ref.current?.setValue(obj, callback);
+    }
+    protected override _toBool(schema: BoolSchema)
+    {
+        if (this.props.multiple === true)
+            return null;
+
+        return (
+            <NSBoxBoolean
+                ref={this.box_ref as React.RefObject<any>}
+                key={this.key}
+                {...this.props}
+
+                required={schema.required}
+                valids={schema.valids}
+                invalids={schema.invalids}
+                // regex={schema.regex}
+
+                title={this.title}
+                placeholder={this.placeholder}
+                defaultValue={new ObjectService(this.props.variable.defaultValue).getNullBoolean() ?? undefined}
+                onChanged={(_, callback) => this.props.onChanged?.(this.box, callback)}
+                onClicked={(_) => { this.props.onClicked?.(this.box); }}
+                menu={this.menu}
+            />
+        );
+    }
+    private toInteger(schema: BaseNumberSchema): React.JSX.Element | null
+    {
+        if (this.props.multiple === true)
+            return null;
+
+        return (
+            <NSBoxInteger
+                ref={this.box_ref as React.RefObject<any>}
+                key={this.key}
+                {...this.props}
+
+                required={schema.required}
+                valids={schema.valids}
+                invalids={schema.invalids}
+                // regex={schema.regex ? { name: variable.name, regex: schema.regex } : undefined}
+
+                title={this.title}
+                placeholder={this.placeholder}
+                defaultValue={new ObjectService(this.props.variable.defaultValue).getNullInt() ?? undefined}
+                onChanged={(_, callback) => { this.props.onChanged?.(this.box, callback); }}
+                onClicked={(_) => { this.props.onClicked?.(this.box); }}
+                menu={this.menu}
+
+                min={schema.min ?? undefined}
+                max={schema.min ?? undefined}
+            />
+        );
+    }
+    protected override _toTinyInt(schema: TinyIntSchema)
+    {
+        return this.toInteger(schema);
+    }
+    protected override _toSmallInt(schema: SmallIntSchema)
+    {
+        return this.toInteger(schema);
+    }
+    protected override _toMediumInt(schema: MediumIntSchema)
+    {
+        return this.toInteger(schema);
+    }
+    protected override _toInteger(schema: IntegerSchema)
+    {
+        return this.toInteger(schema);
+    }
+    protected override _toBigInt(schema: BigIntSchema)
+    {
+        return this.toInteger(schema);
+    }
+    private toPrecision(schema: BasePrecisionSchema): React.JSX.Element | null
+    {
+        if (this.props.multiple === true)
+            return null;
+
+        return (
+            <NSBoxDouble
+                ref={this.box_ref as React.RefObject<any>}
+                key={this.key}
+                {...this.props}
+
+                required={schema.required}
+                valids={schema.valids}
+                invalids={schema.invalids}
+                // regex={schema.regex ? { name: variable.name, regex: schema.regex } : undefined}
+
+                title={this.title}
+                placeholder={this.placeholder}
+                defaultValue={new ObjectService(this.props.variable.defaultValue).getNullFloat() ?? undefined}
+                onChanged={(_, callback) => { this.props.onChanged?.(this.box, callback); }}
+                onClicked={(_) => { this.props.onClicked?.(this.box); }}
+                menu={this.menu}
+
+                min={schema.min ?? undefined}
+                max={schema.min ?? undefined}
+                precision={schema.precision ?? undefined}
+            />
+        );
+    }
+    protected override _toFloat(schema: FloatSchema)
+    {
+        return this.toPrecision(schema);
+    }
+    protected override _toDouble(schema: DoubleSchema)
+    {
+        return this.toPrecision(schema);
+    }
+    protected override _toDecimal(schema: DecimalSchema)
+    {
+        return this.toPrecision(schema);
+    }
+    protected override _toReal(schema: RealSchema)
+    {
+        return this.toPrecision(schema);
+    }
+    protected override _toMoney(schema: MoneySchema)
+    {
+        if (this.props.multiple === true)
+            return null;
+
+        return (
+            <NSBoxMoney
+                ref={this.box_ref as React.RefObject<any>}
+                key={this.key}
+                {...this.props}
+
+                required={schema.required}
+                valids={schema.valids}
+                invalids={schema.invalids}
+                // regex={schema.regex ? { name: variable.name, regex: schema.regex } : undefined}
+
+                title={this.title}
+                placeholder={this.placeholder}
+                defaultValue={new ObjectService(this.props.variable.defaultValue).getNullFloat() ?? undefined}
+                onChanged={(_, callback) => { this.props.onChanged?.(this.box, callback); }}
+                onClicked={(_) => { this.props.onClicked?.(this.box); }}
+                menu={this.menu}
+
+                min={schema.min ?? undefined}
+                max={schema.min ?? undefined}
+                precision={schema.precision ?? undefined}
+            />
+        );
+    }
+    protected override _toString(schema: StringSchema)
+    {
+        if (this.props.multiple === true)
+            return null;
+
+        return (
+            <NSBoxString
+                ref={this.box_ref as React.RefObject<any>}
+                key={this.key}
+                {...this.props}
+
+                required={schema.required || !schema.allowEmpty}
+                valids={schema.valids}
+                invalids={schema.invalids}
+                regex={schema.regex ? { name: this.props.variable.name, regex: schema.regex } : undefined}
+
+                title={this.title}
+                placeholder={this.placeholder}
+                defaultValue={new ObjectService(this.props.variable.defaultValue).getNullString() ?? undefined}
+                onChanged={(_, callback) => { this.props.onChanged?.(this.box, callback); }}
+                onClicked={(_) => { this.props.onClicked?.(this.box); }}
+                menu={this.menu}
+
+                min_length={schema.min_length ?? undefined}
+                max_length={schema.min_length ?? undefined}
+            />
+        );
+    }
+    protected override _toDate(schema: DateSchema)
+    {
+        if (this.props.multiple === true)
+            return null;
+
+        return (
+            <NSBoxDate
+                ref={this.box_ref as React.RefObject<any>}
+                key={this.key}
+                {...this.props}
+
+                required={schema.required}
+                valids={schema.valids}
+                invalids={schema.invalids}
+                // regex={schema.regex ? { name: variable.name, regex: schema.regex } : undefined}
+
+                title={this.title}
+                placeholder={this.placeholder}
+                defaultValue={new ObjectService(this.props.variable.defaultValue).getNullString() ?? undefined}
+                onChanged={(_, callback) => { this.props.onChanged?.(this.box, callback); }}
+                onClicked={(_) => { this.props.onClicked?.(this.box); }}
+                menu={this.menu}
+            />
+        );
+    }
+    protected override _toTime(schema: TimeSchema)
+    {
+        if (this.props.multiple === true)
+            return null;
+
+        return (
+            <NSBoxTime
+                ref={this.box_ref as React.RefObject<any>}
+                key={this.key}
+                {...this.props}
+
+                required={schema.required}
+                valids={schema.valids}
+                invalids={schema.invalids}
+                // regex={schema.regex ? { name: variable.name, regex: schema.regex } : undefined}
+
+                title={this.title}
+                placeholder={this.placeholder}
+                defaultValue={new ObjectService(this.props.variable.defaultValue).getNullString() ?? undefined}
+                onChanged={(_, callback) => { this.props.onChanged?.(this.box, callback); }}
+                onClicked={(_) => { this.props.onClicked?.(this.box); }}
+                menu={this.menu}
+            />
+        );
+    }
+    protected override _toDateTime(schema: DateTimeSchema)
+    {
+        if (this.props.multiple === true)
+            return null;
+
+        return (
+            <NSBoxDateTime
+                ref={this.box_ref as React.RefObject<any>}
+                key={this.key}
+                {...this.props}
+
+                required={schema.required}
+                valids={schema.valids}
+                invalids={schema.invalids}
+                // regex={schema.regex ? { name: variable.name, regex: schema.regex } : undefined}
+
+                title={this.title}
+                placeholder={this.placeholder}
+                defaultValue={new ObjectService(this.props.variable.defaultValue).getNullDate() ?? undefined}
+                onChanged={(_, callback) => { this.props.onChanged?.(this.box, callback); }}
+                onClicked={(_) => { this.props.onClicked?.(this.box); }}
+                menu={this.menu}
+            />
+        );
+    }
+    protected override _toTimeZone(schema: TimeZoneSchema)
+    {
+        if (this.props.multiple === true)
+            return null;
+
+        return (
+            <NSBoxTimeZone
+                ref={this.box_ref as React.RefObject<any>}
+                key={this.key}
+                {...this.props}
+
+                required={schema.required}
+                valids={schema.valids}
+                invalids={schema.invalids}
+                // regex={schema.regex ? { name: variable.name, regex: schema.regex } : undefined}
+
+                title={this.title}
+                placeholder={this.placeholder}
+                defaultValue={new ObjectService(this.props.variable.defaultValue).getNullString() ?? undefined}
+                onChanged={(_, callback) => { this.props.onChanged?.(this.box, callback); }}
+                onClicked={(_) => { this.props.onClicked?.(this.box); }}
+                menu={this.menu}
+            />
+        );
+    }
+    protected override _toDuration(schema: DurationSchema)
+    {
+        if (this.props.multiple === true)
+            return null;
+
+        return (
+            <NSBoxDuration
+                ref={this.box_ref as React.RefObject<any>}
+                key={this.key}
+                {...this.props}
+
+                required={schema.required}
+                valids={schema.valids}
+                invalids={schema.invalids}
+                // regex={schema.regex ? { name: variable.name, regex: schema.regex } : undefined}
+
+                title={this.title}
+                placeholder={this.placeholder}
+                defaultValue={new ObjectService(this.props.variable.defaultValue).getNullString() ?? undefined}
+                onChanged={(_, callback) => { this.props.onChanged?.(this.box, callback); }}
+                onClicked={(_) => { this.props.onClicked?.(this.box); }}
+                menu={this.menu}
+            />
+        );
+    }
+    protected override _toEmail(schema: EmailSchema)
+    {
+        if (this.props.multiple === true)
+            return null;
+
+        return (
+            <NSBoxEmail
+                ref={this.box_ref as React.RefObject<any>}
+                key={this.key}
+                {...this.props}
+
+                required={schema.required}
+                valids={schema.valids}
+                invalids={schema.invalids}
+                // regex={schema.regex ? { name: variable.name, regex: schema.regex } : undefined}
+
+                title={this.title}
+                placeholder={this.placeholder}
+                defaultValue={new ObjectService(this.props.variable.defaultValue).getNullString() ?? undefined}
+                onChanged={(_, callback) => { this.props.onChanged?.(this.box, callback); }}
+                onClicked={(_) => { this.props.onClicked?.(this.box); }}
+                menu={this.menu}
+            />
+        );
+    }
+    protected override _toPhone(schema: PhoneSchema)
+    {
+        if (this.props.multiple === true)
+            return null;
+
+        return (
+            <NSBoxPhone
+                ref={this.box_ref as React.RefObject<any>}
+                key={this.key}
+                {...this.props}
+
+                required={schema.required}
+                valids={schema.valids}
+                invalids={schema.invalids}
+                // regex={schema.regex ? { name: variable.name, regex: schema.regex } : undefined}
+
+                title={this.title}
+                placeholder={this.placeholder}
+                defaultValue={new ObjectService(this.props.variable.defaultValue).getNullString() ?? undefined}
+                onChanged={(_, callback) => { this.props.onChanged?.(this.box, callback); }}
+                onClicked={(_) => { this.props.onClicked?.(this.box); }}
+                menu={this.menu}
+            />
+        );
+    }
+    protected override _toVersion(schema: VersionSchema)
+    {
+        if (this.props.multiple === true)
+            return null;
+        return (
+            <NSBoxVersion
+                ref={this.box_ref as React.RefObject<any>}
+                key={this.key}
+                {...this.props}
+
+                required={schema.required}
+                valids={schema.valids}
+                invalids={schema.invalids}
+                // regex={schema.regex ? { name: variable.name, regex: schema.regex } : undefined}
+
+                title={this.title}
+                placeholder={this.placeholder}
+                defaultValue={new ObjectService(this.props.variable.defaultValue).getNullString() ?? undefined}
+                onChanged={(_, callback) => { this.props.onChanged?.(this.box, callback); }}
+                onClicked={(_) => { this.props.onClicked?.(this.box); }}
+                menu={this.menu}
+            />
+        );
+    }
+    protected override _toIPV4(schema: IPV4Schema)
+    {
+        if (this.props.multiple === true)
+            return null;
+        return (
+            <NSBoxIPV4
+                ref={this.box_ref as React.RefObject<any>}
+                key={this.key}
+                {...this.props}
+
+                required={schema.required}
+                valids={schema.valids}
+                invalids={schema.invalids}
+                // regex={schema.regex ? { name: variable.name, regex: schema.regex } : undefined}
+
+                title={this.title}
+                placeholder={this.placeholder}
+                defaultValue={new ObjectService(this.props.variable.defaultValue).getNullString() ?? undefined}
+                onChanged={(_, callback) => { this.props.onChanged?.(this.box, callback); }}
+                onClicked={(_) => { this.props.onClicked?.(this.box); }}
+                menu={this.menu}
+            />
+        );
+    }
+    protected override _toIPV6(schema: IPV6Schema)
+    {
+        if (this.props.multiple === true)
+            return null;
+        return (
+            <NSBoxIPV6
+                ref={this.box_ref as React.RefObject<any>}
+                key={this.key}
+                {...this.props}
+
+                required={schema.required}
+                valids={schema.valids}
+                invalids={schema.invalids}
+                // regex={schema.regex ? { name: variable.name, regex: schema.regex } : undefined}
+
+                title={this.title}
+                placeholder={this.placeholder}
+                defaultValue={new ObjectService(this.props.variable.defaultValue).getNullString() ?? undefined}
+                onChanged={(_, callback) => { this.props.onChanged?.(this.box, callback); }}
+                onClicked={(_) => { this.props.onClicked?.(this.box); }}
+                menu={this.menu}
+            />
+        );
+    }
+    protected override _toIPV4Range(schema: IPV4RangeSchema)
+    {
+        if (this.props.multiple === true)
+            return null;
+        return (
+            <NSBoxIPV4Range
+                ref={this.box_ref as React.RefObject<any>}
+                key={this.key}
+                {...this.props}
+
+                required={schema.required}
+                valids={schema.valids}
+                invalids={schema.invalids}
+                // regex={schema.regex ? { name: variable.name, regex: schema.regex } : undefined}
+
+                title={this.title}
+                placeholder={this.placeholder}
+                defaultValue={new ObjectService(this.props.variable.defaultValue).getNullString() ?? undefined}
+                onChanged={(_, callback) => { this.props.onChanged?.(this.box, callback); }}
+                onClicked={(_) => { this.props.onClicked?.(this.box); }}
+                menu={this.menu}
+            />
+        );
+    }
+    protected override _toIPV6Range(schema: IPV6RangeSchema)
+    {
+        if (this.props.multiple === true)
+            return null;
+        return (
+            <NSBoxIPV6Range
+                ref={this.box_ref as React.RefObject<any>}
+                key={this.key}
+                {...this.props}
+
+                required={schema.required}
+                valids={schema.valids}
+                invalids={schema.invalids}
+                // regex={schema.regex ? { name: variable.name, regex: schema.regex } : undefined}
+
+                title={this.title}
+                placeholder={this.placeholder}
+                defaultValue={new ObjectService(this.props.variable.defaultValue).getNullString() ?? undefined}
+                onChanged={(_, callback) => { this.props.onChanged?.(this.box, callback); }}
+                onClicked={(_) => { this.props.onClicked?.(this.box); }}
+                menu={this.menu}
+            />
+        );
+    }
+    protected override _toColor(schema: ColorSchema)
+    {
+        if (this.props.multiple === true)
+            return null;
+        return (
+            <NSBoxColor
+                ref={this.box_ref as React.RefObject<any>}
+                key={this.key}
+                {...this.props}
+
+                required={schema.required}
+                valids={schema.valids}
+                invalids={schema.invalids}
+                // regex={schema.regex ? { name: variable.name, regex: schema.regex } : undefined}
+
+                title={this.title}
+                placeholder={this.placeholder}
+                defaultValue={new ObjectService(this.props.variable.defaultValue).getNullString() ?? undefined}
+                onChanged={(_, callback) => { this.props.onChanged?.(this.box, callback); }}
+                onClicked={(_) => { this.props.onClicked?.(this.box); }}
+                menu={this.menu}
+            />
+        );
+    }
+    protected override _toFont(schema: FontSchema)
+    {
+        if (this.props.multiple === true)
+            return null;
+        return (
+            <NSBoxFont
+                ref={this.box_ref as React.RefObject<any>}
+                key={this.key}
+                {...this.props}
+
+                required={schema.required}
+                valids={schema.valids}
+                invalids={schema.invalids}
+                // regex={schema.regex ? { name: variable.name, regex: schema.regex } : undefined}
+
+                title={this.title}
+                placeholder={this.placeholder}
+                defaultValue={new ObjectService(this.props.variable.defaultValue).getNullString() ?? undefined}
+                onChanged={(_, callback) => { this.props.onChanged?.(this.box, callback); }}
+                onClicked={(_) => { this.props.onClicked?.(this.box); }}
+                menu={this.menu}
+            />
+        );
+    }
+    protected override _toFilePath(schema: FilePathSchema)
+    {
+        if (this.props.multiple === true)
+            return null;
+        return (
+            <NSBoxFilePath
+                ref={this.box_ref as React.RefObject<any>}
+                key={this.key}
+                {...this.props}
+
+                required={schema.required}
+                valids={schema.valids}
+                invalids={schema.invalids}
+                // regex={schema.regex ? { name: variable.name, regex: schema.regex } : undefined}
+
+                title={this.title}
+                placeholder={this.placeholder}
+                defaultValue={new ObjectService(this.props.variable.defaultValue).getNullString() ?? undefined}
+                onChanged={(_, callback) => { this.props.onChanged?.(this.box, callback); }}
+                onClicked={(_) => { this.props.onClicked?.(this.box); }}
+                menu={this.menu}
+            />
+        );
+    }
+    protected override _toURL(schema: URLSchema)
+    {
+        if (this.props.multiple === true)
+            return null;
+        return (
+            <NSBoxURL
+                ref={this.box_ref as React.RefObject<any>}
+                key={this.key}
+                {...this.props}
+
+                required={schema.required}
+                valids={schema.valids}
+                invalids={schema.invalids}
+                // regex={schema.regex ? { name: variable.name, regex: schema.regex } : undefined}
+
+                title={this.title}
+                placeholder={this.placeholder}
+                defaultValue={new ObjectService(this.props.variable.defaultValue).getNullString() ?? undefined}
+                onChanged={(_, callback) => { this.props.onChanged?.(this.box, callback); }}
+                onClicked={(_) => { this.props.onClicked?.(this.box); }}
+                menu={this.menu}
+            />
+        );
+    }
+    protected override _toEnum(schema: EnumSchema)
+    {
+        return (
+            <NSBoxCombo
+                ref={this.box_ref as React.RefObject<any>}
+                key={this.key}
+                {...this.props}
+
+                required={schema.required}
+                valids={schema.valids}
+                invalids={schema.invalids}
+                // regex={schema.regex ? { name: variable.name, regex: schema.regex } : undefined}
+
+                title={this.title}
+                placeholder={this.placeholder}
+                defaultValue={new ObjectService(this.props.variable.defaultValue).getNullString() ?? undefined}
+                onChanged={(_, callback) => { this.props.onChanged?.(this.box, callback); }}
+                onClicked={(_) => { this.props.onClicked?.(this.box); }}
+                menu={this.menu}
+
+                multiple={this.props.multiple ?? false}
+                getOptions={() =>
+                {
+                    let valids = schema.valids;
+                    valids = valids.filter((v) => !schema.invalids.includes(v));
+                    return valids.map((v) => ({ title: v, value: v }));
+                }}
+            />
+        );
+    }
+    protected override _toEntity(schema: EntitySchema)
+    {
+        return (
+            <NSBoxEntity<any>
+                ref={this.box_ref as React.RefObject<any>}
+                key={this.key}
+                {...this.props}
+
+                required={schema.required}
+                valids={schema.valids}
+                invalids={schema.invalids}
+                // regex={schema.regex ? { name: variable.name, regex: schema.regex } : undefined}
+
+                title={this.title}
+                placeholder={this.placeholder}
+                defaultValue={new ObjectService(this.props.variable.defaultValue).getNullString() ?? undefined}
+                onChanged={(_, callback) => { this.props.onChanged?.(this.box, callback); }}
+                onClicked={(_) => { this.props.onClicked?.(this.box); }}
+                menu={this.menu}
+
+                multiple={this.props.multiple ?? false}
+
+                getItems={async () =>
+                {
+                    // let product = Globe.namirasoft.getByProductID(schema.product);
+                    // product.meta.tables[schema.table];
+                    // product.server.List;
+                    // todo
+                    return { count: 0, rows: [] };
+                }}
+                getValue={(item) => item.id}
+                getTitle={(item) => item.name}
+            />
+        );
+    }
+    protected override _toArray(schema: ArraySchema, callback: (schema: BaseTypeSchema) => void)
+    {
+        if (this.props.multiple === true)
+            return null;
+        if (schema.items.length === 0)
+            return null;
+        if (schema.items.length > 1)
+            return null;
+
+        return (
+            <NSPanel>
+                <NSTitle title={this.title} />
+                <NSRepeater<INSBox, string>
+                    ref={this.box_ref as React.RefObject<any>}
+                    key={this.key}
+                    createItem={(gIndex: number, lIndex: number, ref: React.RefObject<INSBox>, onChange: () => void, onDelete: undefined | ((index: number) => void), _: boolean, style) =>
+                    {
+                        let title = "Item " + (lIndex + 1)
+                        let props = {
+                            ...this.props,
+                            title,
+                            onChanged: (box: NSBoxDynamic, callback?: () => void) =>
+                            {
+                                this.props.onChanged?.(box, callback);
+                                onChange();
+                            },
+                            style: { ...this.props.style, ...style },
+                            variable: new BaseVariableSchema(title, schema.items[0]),
+                            multiple: false
+                        };
+                        let builder = new NSBoxBuilder(this.box, props, ref, "NSBoxBuilder_NSRepeater_Item_" + (gIndex + 1),
+                            onDelete ? () => { onDelete(gIndex) } : undefined
+                        );
+                        return builder.runSynch(callback);
+                    }}
+                    updateItem={function (item: INSBox, _: number, value: string | null): void
+                    {
+                        if (value)
+                            item.setValue(value);
+                    }}
+                    getValue={function (item: INSBox, checkError: boolean): string
+                    {
+                        return item.getValue(checkError)
+                    }}
+                    isEmpty={function (item: INSBox, value: string): boolean
+                    {
+                        return item.isEmpty(value)
+                    }}
+                    min={schema.min ?? undefined}
+                    max={schema.max ?? undefined}
+                />
+            </NSPanel>
+        );
+    }
+    protected override _toObject(schema: ObjectSchema, callback: (schema: BaseTypeSchema) => void)
+    {
+        let children: React.JSX.Element[] | null = this.ifOjbect((_, fields) =>
+        {
+            return fields.map((_, index) =>
+            {
+                return this.builders[index].builder.runSynch(callback);
+            }).filter(x => x).map(x => x as React.JSX.Element);
+        });
+        if (!children)
+            return null;
+        return (
+            <NSPanel>
+                <NSTitle title={this.title + ((schema.name && schema.name !== this.title) ? ` (${schema.name})` : "")} />
+                {
+                    children
+                }
+            </NSPanel>
+        );
+    }
+    protected override _toAny(_: AnySchema)
+    {
+        return null;
+
+    }
+}