autoforma 1.0.2 → 1.0.4

package/src/components/fields/ArrayField.tsx

@@ -1,59 +0,0 @@
-import React, { Fragment } from 'react';
-import { Button, Text } from '@mantine/core';
-import { BaseFieldProps, FieldSchema } from '@/types/field';
-import FieldRender from '../FieldRender';
-
-
-interface ArrayFieldProps extends BaseFieldProps<Record<string, any>[]> {
-  fields: FieldSchema[];
-  options: {
-    addElement: (val: Record<string, any>) => void;
-    replaceElement: (index: number, val: Record<string, any>) => void;
-    removeElement: (index: number) => void;
-  };
-  error?: Record<string, React.ReactNode>;
-}
-
-const ArrayField: React.FC<ArrayFieldProps> = (props) => {
-  const { fields, options, value, error = {}, name: parentName, readOnly } = props;
-
-  const content = value.map((row, rowIndex) => {
-    const onChange = (name: string, value: any) => {
-      row[name] = value;
-      options.replaceElement(rowIndex, row);
-    };
-    return fields.map((field, index) => {
-      return (
-        <Fragment key={index}>
-          <FieldRender
-            field={field}
-            formValues={row}
-            onChange={onChange}
-            value={row[field.name]}
-            error={field.name in (error[rowIndex] ?? {}) ? error[rowIndex][field.name] : undefined}
-            readOnly={readOnly}
-          />
-          {!readOnly && <Button onClick={() => options.removeElement(rowIndex)}>Remove</Button>}
-        </Fragment>
-      );
-    });
-  });
-
-  return (
-    <>
-      {typeof error === 'string' && (
-        <Text c="red" fz="sm" fw={500}>
-          {error}
-        </Text>
-      )}
-      {content}
-      {!readOnly && (
-        <Button display="block" onClick={() => options.addElement({})}>
-          Add
-        </Button>
-      )}
-    </>
-  );
-};
-
-export default ArrayField;

package/src/components/fields/CheckField.tsx

@@ -1,23 +0,0 @@
-import React from 'react';
-import { Checkbox } from '@mantine/core';
-import { BaseFieldProps } from '@/types/field';
-
-interface CheckFieldProps extends BaseFieldProps<boolean> {
-  label: string;
-}
-
-const CheckField: React.FC<CheckFieldProps> = (props) => {
-  const { name, onChange, value, readOnly, label } = props;
-
-  return (
-    <Checkbox
-      name={name}
-      checked={value}
-      readOnly={readOnly}
-      onChange={(e) => onChange(name, e.target.checked)}
-      label={label}
-    />
-  );
-};
-
-export default CheckField;

package/src/components/fields/DateField.tsx

@@ -1,26 +0,0 @@
-import dayjs from 'dayjs';
-import customParseFormat from 'dayjs/plugin/customParseFormat';
-import React from 'react';
-import { DateInput } from '@mantine/dates';
-import { BaseFieldProps } from '@/types/field';
-
-dayjs.extend(customParseFormat);
-
-interface DateFieldProps extends BaseFieldProps<Date> {}
-
-const DateField: React.FC<DateFieldProps> = (props) => {
-  const { name, onChange, value, readOnly } = props;
-
-  return (
-    <DateInput
-      name={name}
-      onChange={(value) => onChange(name, value)}
-      value={value}
-      readOnly={readOnly}
-      valueFormat="YYYY-MM-DD"
-      clearable
-    />
-  );
-};
-
-export default DateField;

package/src/components/fields/DateTimeField.tsx

@@ -1,26 +0,0 @@
-import dayjs from 'dayjs';
-import customParseFormat from 'dayjs/plugin/customParseFormat';
-import React from 'react';
-import { DateTimePicker } from '@mantine/dates';
-import { BaseFieldProps } from '@/types/field';
-
-dayjs.extend(customParseFormat);
-
-interface DateTimeFieldProps extends BaseFieldProps<Date> {}
-
-const DateTimeField: React.FC<DateTimeFieldProps> = (props) => {
-  const { name, onChange, value, readOnly } = props;
-
-  return (
-    <DateTimePicker
-      name={name}
-      onChange={(value) => onChange(name, value)}
-      value={value}
-      readOnly={readOnly}
-      valueFormat="YYYY-MM-DD HH:mm:ss"
-      clearable
-    />
-  );
-};
-
-export default DateTimeField;

package/src/components/fields/NumberField.tsx

@@ -1,20 +0,0 @@
-import React from 'react';
-import { NumberInput } from '@mantine/core';
-import { BaseFieldProps } from '@/types/field';
-
-interface NumberFieldProps extends BaseFieldProps<number> {}
-
-const NumberField: React.FC<NumberFieldProps> = (props) => {
-  const { name, onChange, value, readOnly } = props;
-
-  return (
-    <NumberInput
-      name={name}
-      onChange={(value) => onChange(name, value as number)}
-      value={value}
-      readOnly={readOnly}
-    />
-  );
-};
-
-export default NumberField;

package/src/components/fields/ObjectField.tsx

@@ -1,41 +0,0 @@
-import React from 'react';
-import { BaseFieldProps, FieldSchema } from '@/types/field';
-import FieldRender from '../FieldRender';
-
-
-interface ObjectFieldProps extends BaseFieldProps<Record<string, any>> {
-  fields: FieldSchema[];
-  formValues: Record<string, any>;
-  error?: Record<string, React.ReactNode>;
-}
-
-const ObjectField: React.FC<ObjectFieldProps> = (props) => {
-  const {
-    fields,
-    name: parentName,
-    onChange: onParentChange,
-    value,
-    formValues,
-    error = {},
-    readOnly,
-  } = props;
-
-  const onChange = (name: string, value: any) => {
-    onParentChange(`${parentName}.${name}`, value);
-  };
-
-  const content = fields.map((field, index) => (
-    <FieldRender
-      key={index}
-      field={field}
-      formValues={formValues}
-      onChange={onChange}
-      value={value[field.name]}
-      error={error[field.name]}
-      readOnly={readOnly}
-    />
-  ));
-  return content;
-};
-
-export default ObjectField;

package/src/components/fields/SelectField.tsx

@@ -1,23 +0,0 @@
-import React from 'react';
-import { Select } from '@mantine/core';
-import { BaseFieldProps } from '@/types/field';
-
-interface SelectFieldProps extends BaseFieldProps<string> {
-  data: { label: string; value: string }[];
-}
-
-const SelectField: React.FC<SelectFieldProps> = (props) => {
-  const { data, name, onChange, value, readOnly } = props;
-  return (
-    <Select
-      name={name}
-      data={data}
-      value={value}
-      onChange={(value) => onChange(name, value)}
-      readOnly={readOnly}
-      clearable
-    />
-  );
-};
-
-export default SelectField;

package/src/components/fields/TextAreaField.tsx

@@ -1,25 +0,0 @@
-import React from 'react';
-import { Textarea } from '@mantine/core';
-import { BaseFieldProps } from '@/types/field';
-
-interface TextAreaFieldProps extends BaseFieldProps<string> {}
-
-const TextAreaField: React.FC<TextAreaFieldProps> = (props) => {
-  const { name, onChange, value, readOnly } = props;
-
-  return (
-    <Textarea
-      name={name}
-      onChange={(e) => onChange(name, e.target.value)}
-      value={value}
-      readOnly={readOnly}
-      styles={{
-        input: {
-            height: 200
-        }
-      }}
-    />
-  );
-};
-
-export default TextAreaField;

package/src/components/fields/TextField.tsx

@@ -1,20 +0,0 @@
-import React from 'react';
-import { TextInput } from '@mantine/core';
-import { BaseFieldProps } from '@/types/field';
-
-interface TextFieldProps extends BaseFieldProps<string> {}
-
-const TextField: React.FC<TextFieldProps> = (props) => {
-  const { name, onChange, value, readOnly } = props;
-
-  return (
-    <TextInput
-      name={name}
-      onChange={(value) => onChange(name, value.target.value)}
-      value={value}
-      readOnly={readOnly}
-    />
-  );
-};
-
-export default TextField;

package/src/components/fields/TimeField.tsx

@@ -1,32 +0,0 @@
-import React, { useRef } from 'react';
-import { ActionIcon } from '@mantine/core';
-import { TimeInput } from '@mantine/dates';
-import { BaseFieldProps } from '@/types/field';
-
-interface TimeFieldProps extends BaseFieldProps<string> {}
-
-const TimeField: React.FC<TimeFieldProps> = (props) => {
-  const { name, onChange, value, readOnly } = props;
-  
-  const ref = useRef<HTMLInputElement>(null);
-
-  const pickerControl = (
-    <ActionIcon variant="subtle" color="gray" onClick={() => ref.current?.showPicker()}>
-      &#x1F55B;
-    </ActionIcon>
-  );
-
-  return (
-    <TimeInput
-      name={name}
-      onChange={(e) => onChange(name, e.target.value)}
-      value={value}
-      readOnly={readOnly}
-      ref={ref}
-      rightSection={pickerControl}
-      withSeconds
-    />
-  );
-};
-
-export default TimeField;

package/src/types/custom-render.ts

@@ -1,22 +0,0 @@
-// types/custom-render.ts
-import { ArrayFieldOptions, FieldSchema } from './field';
-
-export type FieldRenderCustomRender = (
-  field: FieldSchema,
-  value: any,
-  error: React.ReactNode | Record<string, React.ReactNode>,
-  onChange: (name: string, value: any) => void,
-  formValues: Record<string, any>,
-  options?: ArrayFieldOptions,
-  readOnly?: true
-) => React.ReactNode;
-
-export interface CustomFieldRender {
-  field: FieldSchema;
-  value: any;
-  error: React.ReactNode | Record<string, React.ReactNode>;
-  onChange: (name: string, value: any) => void;
-  formValues: Record<string, any>;
-  options?: ArrayFieldOptions;
-  readOnly?: true;
-}

package/src/types/field.ts

@@ -1,32 +0,0 @@
-export type FieldType = 'text' | 'number' | 'object' | 'array' | 'check' | 'select' | 'textarea' | 'date' | 'datetime' | 'time';
-
-export interface FieldSchema {
-  name: string;
-  type: FieldType;
-  label: string;
-  description?: string;
-  placeholder?: string;
-  extra?: Record<string, any>;
-  disabled?: (values: Record<string, any>) => boolean | boolean;
-  visible?: (values: Record<string, any>) => boolean | boolean;
-  initialValue?: any;
-  required?: true;
-  readOnly?: true;
-  // for object type only
-  fields?: FieldSchema[];
-  // for select type only
-  data?: { label: string; value: string }[];
-}
-
-export interface BaseFieldProps<T> {
-  name: string;
-  value: T;
-  onChange: (name: string, value: T | null) => void;
-  readOnly?: true;
-}
-
-export type ArrayFieldOptions = {
-  addElement: (value: Record<string, any>) => void;
-  replaceElement: (index: number, val: Record<string, any>) => void;
-  removeElement: (index: number) => void;
-};

package/src/types/form.ts

@@ -1,8 +0,0 @@
-import { FieldSchema } from './field';
-
-export interface FormSchema {
-  fields: FieldSchema[];
-  onSubmit?: (values: Record<string, any>) => void;
-  formData?: Record<string, any>;
-  initialValues?: Record<string, any>;
-}