ding-react-admin 2.0.0 → 2.0.5

package/src/crud/fields/FileField.tsx

@@ -1,123 +1,123 @@
-import { DeleteOutlined, PaperClipOutlined, UploadOutlined } from "@ant-design/icons";
-import { Button, Space, Typography } from "antd";
-import { useRef } from "react";
-import type { BaseSourceProps, FieldRules } from "../types";
-import { FieldWrapper } from "./FieldWrapper";
-import {
-  getUploadFileName,
-  hasUploadValue,
-  type UploadFieldValue,
-} from "./uploadFieldUtils";
-
-export type FileFieldProps = BaseSourceProps & {
-  name?: string;
-  required?: boolean;
-  rules?: FieldRules;
-  hideLabel?: boolean;
-  /** Allow clearing an existing or newly selected file. */
-  clearable?: boolean;
-  accept?: string;
-};
-
-function FileFieldInput({
-  value,
-  onChange,
-  disabled,
-  clearable,
-  accept,
-}: {
-  value: UploadFieldValue;
-  onChange: (value: UploadFieldValue) => void;
-  disabled?: boolean;
-  clearable?: boolean;
-  accept?: string;
-}) {
-  const inputRef = useRef<HTMLInputElement>(null);
-  const fileName = getUploadFileName(value);
-  const existingUrl = typeof value === "string" && value.length > 0 ? value : undefined;
-  const showClear = clearable && hasUploadValue(value);
-
-  return (
-    <Space direction="vertical" size="middle" style={{ width: "100%" }}>
-      {fileName ? (
-        <Space>
-          <PaperClipOutlined />
-          {existingUrl ? (
-            <Typography.Link href={existingUrl} target="_blank" rel="noopener noreferrer">
-              {fileName}
-            </Typography.Link>
-          ) : (
-            <Typography.Text>{fileName}</Typography.Text>
-          )}
-        </Space>
-      ) : null}
-      <Space wrap>
-        <Button
-          icon={<UploadOutlined />}
-          disabled={disabled}
-          onClick={() => inputRef.current?.click()}
-        >
-          Choose file
-        </Button>
-        {showClear ? (
-          <Button
-            icon={<DeleteOutlined />}
-            disabled={disabled}
-            onClick={() => {
-              onChange(null);
-              if (inputRef.current) inputRef.current.value = "";
-            }}
-          >
-            Clear
-          </Button>
-        ) : null}
-      </Space>
-      <input
-        ref={inputRef}
-        type="file"
-        accept={accept}
-        disabled={disabled}
-        tabIndex={-1}
-        aria-hidden
-        style={{ display: "none" }}
-        onChange={(e) => {
-          const file = e.target.files?.[0];
-          onChange(file ?? null);
-          e.target.value = "";
-        }}
-      />
-    </Space>
-  );
-}
-
-export function FileField({
-  source,
-  name,
-  label,
-  required,
-  rules,
-  hideLabel,
-  clearable,
-  accept,
-}: FileFieldProps) {
-  return (
-    <FieldWrapper
-      source={source}
-      name={name}
-      label={label}
-      required={required}
-      rules={rules}
-      hideLabel={hideLabel}
-    >
-      {({ value, onChange, disabled }) => (
-        <FileFieldInput
-          value={value as UploadFieldValue}
-          onChange={onChange}
-          disabled={disabled}
-          clearable={clearable}
-          accept={accept}
-        />
-      )}
-    </FieldWrapper>
-  );
-}
+import { DeleteOutlined, PaperClipOutlined, UploadOutlined } from "@ant-design/icons";
+import { Button, Space, Typography } from "antd";
+import { useRef } from "react";
+import type { BaseSourceProps, FieldRules } from "../types";
+import { FieldWrapper } from "./FieldWrapper";
+import {
+  getUploadFileName,
+  hasUploadValue,
+  type UploadFieldValue,
+} from "./uploadFieldUtils";
+
+export type FileFieldProps = BaseSourceProps & {
+  name?: string;
+  required?: boolean;
+  rules?: FieldRules;
+  hideLabel?: boolean;
+  /** Allow clearing an existing or newly selected file. */
+  clearable?: boolean;
+  accept?: string;
+};
+
+function FileFieldInput({
+  value,
+  onChange,
+  disabled,
+  clearable,
+  accept,
+}: {
+  value: UploadFieldValue;
+  onChange: (value: UploadFieldValue) => void;
+  disabled?: boolean;
+  clearable?: boolean;
+  accept?: string;
+}) {
+  const inputRef = useRef<HTMLInputElement>(null);
+  const fileName = getUploadFileName(value);
+  const existingUrl = typeof value === "string" && value.length > 0 ? value : undefined;
+  const showClear = clearable && hasUploadValue(value);
+
+  return (
+    <Space direction="vertical" size="middle" style={{ width: "100%" }}>
+      {fileName ? (
+        <Space>
+          <PaperClipOutlined />
+          {existingUrl ? (
+            <Typography.Link href={existingUrl} target="_blank" rel="noopener noreferrer">
+              {fileName}
+            </Typography.Link>
+          ) : (
+            <Typography.Text>{fileName}</Typography.Text>
+          )}
+        </Space>
+      ) : null}
+      <Space wrap>
+        <Button
+          icon={<UploadOutlined />}
+          disabled={disabled}
+          onClick={() => inputRef.current?.click()}
+        >
+          Choose file
+        </Button>
+        {showClear ? (
+          <Button
+            icon={<DeleteOutlined />}
+            disabled={disabled}
+            onClick={() => {
+              onChange(null);
+              if (inputRef.current) inputRef.current.value = "";
+            }}
+          >
+            Clear
+          </Button>
+        ) : null}
+      </Space>
+      <input
+        ref={inputRef}
+        type="file"
+        accept={accept}
+        disabled={disabled}
+        tabIndex={-1}
+        aria-hidden
+        style={{ display: "none" }}
+        onChange={(e) => {
+          const file = e.target.files?.[0];
+          onChange(file ?? null);
+          e.target.value = "";
+        }}
+      />
+    </Space>
+  );
+}
+
+export function FileField({
+  source,
+  name,
+  label,
+  required,
+  rules,
+  hideLabel,
+  clearable,
+  accept,
+}: FileFieldProps) {
+  return (
+    <FieldWrapper
+      source={source}
+      name={name}
+      label={label}
+      required={required}
+      rules={rules}
+      hideLabel={hideLabel}
+    >
+      {({ value, onChange, disabled }) => (
+        <FileFieldInput
+          value={value as UploadFieldValue}
+          onChange={onChange}
+          disabled={disabled}
+          clearable={clearable}
+          accept={accept}
+        />
+      )}
+    </FieldWrapper>
+  );
+}

package/src/crud/fields/ImageField.tsx

@@ -1,120 +1,120 @@
-import { DeleteOutlined, UploadOutlined } from "@ant-design/icons";
-import { Button, Image, Space } from "antd";
-import { useRef } from "react";
-import type { BaseSourceProps, FieldRules } from "../types";
-import { FieldWrapper } from "./FieldWrapper";
-import { hasUploadValue, type UploadFieldValue } from "./uploadFieldUtils";
-import { useUploadPreviewUrl } from "./useUploadPreviewUrl";
-
-export type ImageFieldProps = BaseSourceProps & {
-  name?: string;
-  required?: boolean;
-  rules?: FieldRules;
-  hideLabel?: boolean;
-  /** Allow clearing an existing or newly selected image. */
-  clearable?: boolean;
-  accept?: string;
-  /** Max preview width in pixels. */
-  previewWidth?: number;
-};
-
-function ImageFieldInput({
-  value,
-  onChange,
-  disabled,
-  clearable,
-  accept = "image/*",
-  previewWidth = 200,
-}: {
-  value: UploadFieldValue;
-  onChange: (value: UploadFieldValue) => void;
-  disabled?: boolean;
-  clearable?: boolean;
-  accept?: string;
-  previewWidth?: number;
-}) {
-  const inputRef = useRef<HTMLInputElement>(null);
-  const previewUrl = useUploadPreviewUrl(value);
-  const showClear = clearable && hasUploadValue(value);
-
-  return (
-    <Space direction="vertical" size="middle" style={{ width: "100%" }}>
-      {previewUrl ? (
-        <Image
-          src={previewUrl}
-          alt=""
-          style={{ maxWidth: previewWidth, maxHeight: previewWidth, objectFit: "contain" }}
-        />
-      ) : null}
-      <Space wrap>
-        <Button
-          icon={<UploadOutlined />}
-          disabled={disabled}
-          onClick={() => inputRef.current?.click()}
-        >
-          Choose image
-        </Button>
-        {showClear ? (
-          <Button
-            icon={<DeleteOutlined />}
-            disabled={disabled}
-            onClick={() => {
-              onChange(null);
-              if (inputRef.current) inputRef.current.value = "";
-            }}
-          >
-            Clear
-          </Button>
-        ) : null}
-      </Space>
-      <input
-        ref={inputRef}
-        type="file"
-        accept={accept}
-        disabled={disabled}
-        tabIndex={-1}
-        aria-hidden
-        style={{ display: "none" }}
-        onChange={(e) => {
-          const file = e.target.files?.[0];
-          onChange(file ?? null);
-          e.target.value = "";
-        }}
-      />
-    </Space>
-  );
-}
-
-export function ImageField({
-  source,
-  name,
-  label,
-  required,
-  rules,
-  hideLabel,
-  clearable,
-  accept,
-  previewWidth,
-}: ImageFieldProps) {
-  return (
-    <FieldWrapper
-      source={source}
-      name={name}
-      label={label}
-      required={required}
-      rules={rules}
-      hideLabel={hideLabel}
-    >
-      {({ value, onChange, disabled }) => (
-        <ImageFieldInput
-          value={value as UploadFieldValue}
-          onChange={onChange}
-          disabled={disabled}
-          clearable={clearable}
-          accept={accept}
-          previewWidth={previewWidth}
-        />
-      )}
-    </FieldWrapper>
-  );
-}
+import { DeleteOutlined, UploadOutlined } from "@ant-design/icons";
+import { Button, Image, Space } from "antd";
+import { useRef } from "react";
+import type { BaseSourceProps, FieldRules } from "../types";
+import { FieldWrapper } from "./FieldWrapper";
+import { hasUploadValue, type UploadFieldValue } from "./uploadFieldUtils";
+import { useUploadPreviewUrl } from "./useUploadPreviewUrl";
+
+export type ImageFieldProps = BaseSourceProps & {
+  name?: string;
+  required?: boolean;
+  rules?: FieldRules;
+  hideLabel?: boolean;
+  /** Allow clearing an existing or newly selected image. */
+  clearable?: boolean;
+  accept?: string;
+  /** Max preview width in pixels. */
+  previewWidth?: number;
+};
+
+function ImageFieldInput({
+  value,
+  onChange,
+  disabled,
+  clearable,
+  accept = "image/*",
+  previewWidth = 200,
+}: {
+  value: UploadFieldValue;
+  onChange: (value: UploadFieldValue) => void;
+  disabled?: boolean;
+  clearable?: boolean;
+  accept?: string;
+  previewWidth?: number;
+}) {
+  const inputRef = useRef<HTMLInputElement>(null);
+  const previewUrl = useUploadPreviewUrl(value);
+  const showClear = clearable && hasUploadValue(value);
+
+  return (
+    <Space direction="vertical" size="middle" style={{ width: "100%" }}>
+      {previewUrl ? (
+        <Image
+          src={previewUrl}
+          alt=""
+          style={{ maxWidth: previewWidth, maxHeight: previewWidth, objectFit: "contain" }}
+        />
+      ) : null}
+      <Space wrap>
+        <Button
+          icon={<UploadOutlined />}
+          disabled={disabled}
+          onClick={() => inputRef.current?.click()}
+        >
+          Choose image
+        </Button>
+        {showClear ? (
+          <Button
+            icon={<DeleteOutlined />}
+            disabled={disabled}
+            onClick={() => {
+              onChange(null);
+              if (inputRef.current) inputRef.current.value = "";
+            }}
+          >
+            Clear
+          </Button>
+        ) : null}
+      </Space>
+      <input
+        ref={inputRef}
+        type="file"
+        accept={accept}
+        disabled={disabled}
+        tabIndex={-1}
+        aria-hidden
+        style={{ display: "none" }}
+        onChange={(e) => {
+          const file = e.target.files?.[0];
+          onChange(file ?? null);
+          e.target.value = "";
+        }}
+      />
+    </Space>
+  );
+}
+
+export function ImageField({
+  source,
+  name,
+  label,
+  required,
+  rules,
+  hideLabel,
+  clearable,
+  accept,
+  previewWidth,
+}: ImageFieldProps) {
+  return (
+    <FieldWrapper
+      source={source}
+      name={name}
+      label={label}
+      required={required}
+      rules={rules}
+      hideLabel={hideLabel}
+    >
+      {({ value, onChange, disabled }) => (
+        <ImageFieldInput
+          value={value as UploadFieldValue}
+          onChange={onChange}
+          disabled={disabled}
+          clearable={clearable}
+          accept={accept}
+          previewWidth={previewWidth}
+        />
+      )}
+    </FieldWrapper>
+  );
+}

package/src/crud/fields/NumberField.tsx

@@ -1,52 +1,52 @@
-import { InputNumber } from "antd";
-import type { CSSProperties } from "react";
-import type { BaseSourceProps, FieldRules } from "../types";
-import { FieldWrapper } from "./FieldWrapper";
-
-export type NumberFieldProps = BaseSourceProps & {
-  name?: string;
-  required?: boolean;
-  rules?: FieldRules;
-  min?: number;
-  max?: number;
-  step?: number;
-  inputStyle?: CSSProperties;
-  hideLabel?: boolean;
-};
-
-export function NumberField({
-  source,
-  name,
-  label,
-  required,
-  rules,
-  min,
-  max,
-  step,
-  inputStyle,
-  hideLabel,
-}: NumberFieldProps) {
-  return (
-    <FieldWrapper
-      source={source}
-      name={name}
-      label={label}
-      required={required}
-      rules={rules}
-      hideLabel={hideLabel}
-    >
-      {({ value, onChange, onBlur, disabled }) => (
-        <InputNumber
-          value={value as number | undefined}
-          onChange={(v) => onChange(v)}
-          onBlur={onBlur}
-          min={min}
-          max={max}
-          step={step}
-          disabled={disabled}
-          style={{ width: "100%", ...inputStyle }}
-        />
-      )}
-    </FieldWrapper>
-  );
-}
+import { InputNumber } from "antd";
+import type { CSSProperties } from "react";
+import type { BaseSourceProps, FieldRules } from "../types";
+import { FieldWrapper } from "./FieldWrapper";
+
+export type NumberFieldProps = BaseSourceProps & {
+  name?: string;
+  required?: boolean;
+  rules?: FieldRules;
+  min?: number;
+  max?: number;
+  step?: number;
+  inputStyle?: CSSProperties;
+  hideLabel?: boolean;
+};
+
+export function NumberField({
+  source,
+  name,
+  label,
+  required,
+  rules,
+  min,
+  max,
+  step,
+  inputStyle,
+  hideLabel,
+}: NumberFieldProps) {
+  return (
+    <FieldWrapper
+      source={source}
+      name={name}
+      label={label}
+      required={required}
+      rules={rules}
+      hideLabel={hideLabel}
+    >
+      {({ value, onChange, onBlur, disabled }) => (
+        <InputNumber
+          value={value as number | undefined}
+          onChange={(v) => onChange(v)}
+          onBlur={onBlur}
+          min={min}
+          max={max}
+          step={step}
+          disabled={disabled}
+          style={{ width: "100%", ...inputStyle }}
+        />
+      )}
+    </FieldWrapper>
+  );
+}