chore(uniforms-patternfly): Port @kie-tools/uniforms-patternfly

packages/uniforms-patternfly/src/AutoField.tsx

@@ -0,0 +1,56 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *  http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import { createAutoField } from "uniforms";
+import invariant from "invariant";
+import BoolField from "./BoolField";
+import DateField from "./DateField";
+import ListField from "./ListField";
+import NestField from "./NestField";
+import NumField from "./NumField";
+import RadioField from "./RadioField";
+import SelectField from "./SelectField";
+import TextField from "./TextField";
+
+export type AutoFieldProps = Parameters<typeof AutoField>[0];
+
+const AutoField = createAutoField((props) => {
+  if (props.allowedValues) {
+    return props.checkboxes && props.fieldType !== Array ? RadioField : SelectField;
+  }
+
+  switch (props.fieldType) {
+    case Array:
+      return ListField;
+    case Boolean:
+      return BoolField;
+    case Date:
+      return DateField;
+    case Number:
+      return NumField;
+    case Object:
+      return NestField;
+    case String:
+      return TextField;
+  }
+
+  return invariant(false, "Unsupported field type: %s", props.fieldType);
+});
+
+export default AutoField;

packages/uniforms-patternfly/src/AutoFields.tsx

@@ -0,0 +1,43 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *  http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import { ComponentType, createElement } from "react";
+import { useForm } from "uniforms";
+import AutoField from "./AutoField";
+
+export type AutoFieldsProps = {
+  autoField?: ComponentType<{ name: string }>;
+  element?: ComponentType | string;
+  fields?: string[];
+  omitFields?: string[];
+};
+
+function AutoFields({ autoField = AutoField, element = "div", fields, omitFields = [], ...props }: AutoFieldsProps) {
+  const { schema } = useForm();
+
+  return createElement(
+    element!,
+    props,
+    (fields ?? schema.getSubfields())
+      .filter((field) => !omitFields!.includes(field))
+      .map((field) => createElement(autoField!, { key: field, name: field }))
+  );
+}
+
+export default AutoFields;

packages/uniforms-patternfly/src/AutoForm.tsx

@@ -0,0 +1,31 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *  http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import { AutoForm } from "uniforms";
+import ValidatedQuickForm from "./ValidatedQuickForm";
+
+function Auto(parent: any): any {
+  class _ extends AutoForm.Auto(parent) {
+    static Auto = Auto;
+  }
+
+  return _;
+}
+
+export default Auto(ValidatedQuickForm);

packages/uniforms-patternfly/src/BaseForm.tsx

@@ -0,0 +1,42 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *  http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import * as React from "react";
+import { Form } from "@patternfly/react-core/dist/js/components/Form";
+import { BaseForm, context } from "uniforms";
+
+function Patternfly(parent: any): any {
+  class _ extends parent {
+    static Patternfly = Patternfly;
+
+    static displayName = `Patternfly${parent.displayName}`;
+
+    render() {
+      return (
+        <context.Provider value={this.getContext()}>
+          <Form data-testid="base-form" {...this.getNativeFormProps()} />
+        </context.Provider>
+      );
+    }
+  }
+
+  return _;
+}
+
+export default Patternfly(BaseForm);

packages/uniforms-patternfly/src/BoolField.tsx

@@ -0,0 +1,59 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *  http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import * as React from "react";
+import { Checkbox, CheckboxProps } from "@patternfly/react-core/dist/js/components/Checkbox";
+import { Switch, SwitchProps } from "@patternfly/react-core/dist/js/components/Switch";
+import { connectField, FieldProps } from "uniforms";
+import wrapField from "./wrapField";
+
+enum ComponentType {
+  checkbox = "checkbox",
+  switch = "switch",
+}
+
+export type BoolFieldProps = FieldProps<
+  boolean,
+  CheckboxProps & SwitchProps,
+  {
+    appearance?: ComponentType;
+    inputRef?: React.RefObject<Switch | Checkbox> & React.RefObject<HTMLInputElement>;
+  }
+>;
+
+function BoolField({ appearance, disabled, id, inputRef, label, name, onChange, value, ...props }: BoolFieldProps) {
+  const Component = appearance === ComponentType.switch ? Switch : Checkbox;
+  return wrapField(
+    { id, ...props },
+    <Component
+      data-testid={"bool-field"}
+      isChecked={value ?? false}
+      isDisabled={disabled}
+      id={id}
+      name={name}
+      onChange={() => disabled || onChange(!value)}
+      ref={inputRef}
+      label={label}
+    />
+  );
+}
+
+BoolField.defaultProps = { appearance: ComponentType.checkbox };
+
+export default connectField(BoolField);

packages/uniforms-patternfly/src/DateField.tsx

@@ -0,0 +1,130 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *  http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import * as React from "react";
+import { useMemo } from "react";
+import { connectField, FieldProps } from "uniforms";
+import { TextInput, TextInputProps } from "@patternfly/react-core/dist/js/components/TextInput";
+import wrapField from "./wrapField";
+
+export type DateFieldProps = FieldProps<
+  Date,
+  TextInputProps,
+  {
+    inputRef?: React.RefObject<HTMLInputElement>;
+    labelProps?: object;
+    max?: Date;
+    min?: Date;
+    type?: "date" | "datetime-local";
+  }
+>;
+
+type DateFieldType = "date" | "datetime-local";
+
+const DateConstructor = (typeof global === "object" ? global : window).Date;
+
+const dateFormat = (value?: Date | string, type: DateFieldType = "datetime-local") => {
+  if (typeof value === "string") {
+    return value?.slice(0, type === "datetime-local" ? -8 : -14);
+  }
+  return value?.toISOString().slice(0, type === "datetime-local" ? -8 : -14);
+};
+
+const dateParse = (value: string, onChange: DateFieldProps["onChange"]) => {
+  const valueAsNumber = DateConstructor.parse(value);
+  if (isNaN(valueAsNumber)) {
+    // Checking if year is too big
+    const splitedValue = value.split("-");
+    if (splitedValue.length > 1) {
+      // A year can't be bigger than 9999;
+      splitedValue[0] = parseInt(splitedValue[0]) > 9999 ? "9999" : splitedValue[0];
+      onChange(new DateConstructor(`${splitedValue.join("-")}Z`));
+      return;
+    }
+    onChange(undefined);
+  } else {
+    const date = new DateConstructor(`${value}Z`);
+    if (date.getFullYear() < 10000) {
+      onChange(date);
+    } else {
+      onChange(date);
+    }
+  }
+};
+
+function DateField({ onChange, ...props }: DateFieldProps) {
+  const isInvalid = useMemo(() => {
+    if (!props.value) {
+      return false;
+    }
+
+    if (props.min) {
+      const minDate = new Date(props.min);
+      if (minDate.toString() === "Invalid Date") {
+        return false;
+      } else if (props.value < minDate) {
+        return `Should be after ${minDate.toISOString()}`;
+      }
+    }
+    if (props.max) {
+      const maxDate = new Date(props.max);
+      if (maxDate.toString() === "Invalid Date") {
+        return false;
+      } else if (props.value > maxDate) {
+        return `Should be before ${maxDate.toISOString()}`;
+      }
+    }
+
+    return false;
+  }, [props.value, props.min, props.max]);
+
+  return wrapField(
+    props as any,
+    <>
+      <TextInput
+        id={props.id}
+        aria-label={"uniforms date field"}
+        data-testid={"date-field"}
+        isDisabled={props.disabled}
+        name={props.name}
+        placeholder={props.placeholder}
+        ref={props.inputRef}
+        type="datetime-local"
+        onChange={(value) => {
+          props.disabled || dateParse(value, onChange);
+        }}
+        value={dateFormat(props.value, props.type) ?? ""}
+      />
+      {isInvalid && (
+        <div
+          id={`${props.id}-invalid-date-time`}
+          style={{
+            fontSize: "0.875rem",
+            color: "#c9190b",
+            marginTop: "0.25rem",
+          }}
+        >
+          {isInvalid}
+        </div>
+      )}
+    </>
+  );
+}
+
+export default connectField(DateField);