@ceed/cds 1.11.1 → 1.12.1-next.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -29,5 +29,10 @@ declare const Uploader: React.MemoExoticComponent<(props: {
29
29
  */
30
30
  maxFileTotalSize: number;
31
31
  uploaded?: UserUpload[] | undefined;
32
+ /**
33
+ * 모든 안내 메세지/에러 메세지보다 해당 메세지가 우선적으로 보여진다.
34
+ * 기본 안내 메세지 및 에러 메세지를 사용하려면 해당 필드를 비워야 한다.
35
+ */
36
+ helperText?: string | undefined;
32
37
  }) => React.JSX.Element>;
33
38
  export { Uploader };
package/dist/index.cjs CHANGED
@@ -5860,7 +5860,19 @@ var getFileSize = (n) => {
5860
5860
  };
5861
5861
  var Preview = (props) => {
5862
5862
  const { files, uploaded, onDelete } = props;
5863
- return /* @__PURE__ */ import_react48.default.createElement(PreviewRoot, { gap: 1 }, [...uploaded, ...files].map((file) => /* @__PURE__ */ import_react48.default.createElement(UploadCard, { key: file.name, size: "sm", color: "neutral" }, /* @__PURE__ */ import_react48.default.createElement(Stack_default, { direction: "row", alignItems: "center", gap: 2 }, /* @__PURE__ */ import_react48.default.createElement(UploadFileIcon, null), /* @__PURE__ */ import_react48.default.createElement(Stack_default, { flex: "1" }, /* @__PURE__ */ import_react48.default.createElement(Typography_default, { level: "body-sm", textColor: "common.black" }, file.name), !!file.size && /* @__PURE__ */ import_react48.default.createElement(Typography_default, { level: "body-xs", fontWeight: "300", lineHeight: "1.33", textColor: "text.tertiary" }, getFileSize(file.size))), /* @__PURE__ */ import_react48.default.createElement(IconButton_default, { onClick: () => onDelete?.(file) }, /* @__PURE__ */ import_react48.default.createElement(ClearIcon2, null))))));
5863
+ return /* @__PURE__ */ import_react48.default.createElement(PreviewRoot, { gap: 1 }, [...uploaded, ...files].map((file) => /* @__PURE__ */ import_react48.default.createElement(UploadCard, { key: file.name, size: "sm", color: "neutral" }, /* @__PURE__ */ import_react48.default.createElement(Stack_default, { direction: "row", alignItems: "center", gap: 2 }, /* @__PURE__ */ import_react48.default.createElement(UploadFileIcon, null), /* @__PURE__ */ import_react48.default.createElement(Stack_default, { flex: "1", sx: { minWidth: 0 } }, /* @__PURE__ */ import_react48.default.createElement(
5864
+ Typography_default,
5865
+ {
5866
+ level: "body-sm",
5867
+ textColor: "common.black",
5868
+ sx: {
5869
+ overflow: "hidden",
5870
+ textOverflow: "ellipsis",
5871
+ whiteSpace: "nowrap"
5872
+ }
5873
+ },
5874
+ file.name
5875
+ ), !!file.size && /* @__PURE__ */ import_react48.default.createElement(Typography_default, { level: "body-xs", fontWeight: "300", lineHeight: "1.33", textColor: "text.tertiary" }, getFileSize(file.size))), /* @__PURE__ */ import_react48.default.createElement(IconButton_default, { onClick: () => onDelete?.(file) }, /* @__PURE__ */ import_react48.default.createElement(ClearIcon2, null))))));
5864
5876
  };
5865
5877
  var UploaderRoot = (0, import_joy59.styled)(Stack_default, {
5866
5878
  name: "Uploader",
@@ -5916,7 +5928,9 @@ var Uploader = import_react48.default.memo(
5916
5928
  onChange,
5917
5929
  label,
5918
5930
  disabled,
5919
- onDelete
5931
+ onDelete,
5932
+ error: errorProp,
5933
+ helperText: helperTextProp
5920
5934
  } = props;
5921
5935
  const dropZoneRef = (0, import_react48.useRef)(null);
5922
5936
  const inputRef = (0, import_react48.useRef)(null);
@@ -5935,6 +5949,9 @@ var Uploader = import_react48.default.memo(
5935
5949
  [accepts]
5936
5950
  );
5937
5951
  const helperText = (0, import_react48.useMemo)(() => {
5952
+ if (helperTextProp) {
5953
+ return helperTextProp;
5954
+ }
5938
5955
  const [allAcceptedTypes, acceptedTypes] = [
5939
5956
  accepts.filter((accept2) => ["image/*", "video/*", "audio/*"].includes(accept2)).map((accept2) => {
5940
5957
  const [type] = accept2.split("/");
@@ -5960,8 +5977,8 @@ var Uploader = import_react48.default.memo(
5960
5977
  helperTexts.push(`Up to ${maxCount} ${maxCount === 1 ? "file" : "files"}`);
5961
5978
  }
5962
5979
  return helperTexts.join(", ");
5963
- }, [accepts, maxFileTotalSize, maxCount]);
5964
- const error = (0, import_react48.useMemo)(() => !!errorText || props.error, [props.error, errorText]);
5980
+ }, [accepts, maxFileTotalSize, maxCount, helperTextProp]);
5981
+ const error = (0, import_react48.useMemo)(() => !!errorText || errorProp, [errorProp, errorText]);
5965
5982
  const showDropZone = (0, import_react48.useMemo)(
5966
5983
  () => !maxCount || maxCount && [...uploaded, ...files].length !== maxCount,
5967
5984
  [files, maxCount, uploaded]
package/dist/index.js CHANGED
@@ -5838,7 +5838,19 @@ var getFileSize = (n) => {
5838
5838
  };
5839
5839
  var Preview = (props) => {
5840
5840
  const { files, uploaded, onDelete } = props;
5841
- return /* @__PURE__ */ React45.createElement(PreviewRoot, { gap: 1 }, [...uploaded, ...files].map((file) => /* @__PURE__ */ React45.createElement(UploadCard, { key: file.name, size: "sm", color: "neutral" }, /* @__PURE__ */ React45.createElement(Stack_default, { direction: "row", alignItems: "center", gap: 2 }, /* @__PURE__ */ React45.createElement(UploadFileIcon, null), /* @__PURE__ */ React45.createElement(Stack_default, { flex: "1" }, /* @__PURE__ */ React45.createElement(Typography_default, { level: "body-sm", textColor: "common.black" }, file.name), !!file.size && /* @__PURE__ */ React45.createElement(Typography_default, { level: "body-xs", fontWeight: "300", lineHeight: "1.33", textColor: "text.tertiary" }, getFileSize(file.size))), /* @__PURE__ */ React45.createElement(IconButton_default, { onClick: () => onDelete?.(file) }, /* @__PURE__ */ React45.createElement(ClearIcon2, null))))));
5841
+ return /* @__PURE__ */ React45.createElement(PreviewRoot, { gap: 1 }, [...uploaded, ...files].map((file) => /* @__PURE__ */ React45.createElement(UploadCard, { key: file.name, size: "sm", color: "neutral" }, /* @__PURE__ */ React45.createElement(Stack_default, { direction: "row", alignItems: "center", gap: 2 }, /* @__PURE__ */ React45.createElement(UploadFileIcon, null), /* @__PURE__ */ React45.createElement(Stack_default, { flex: "1", sx: { minWidth: 0 } }, /* @__PURE__ */ React45.createElement(
5842
+ Typography_default,
5843
+ {
5844
+ level: "body-sm",
5845
+ textColor: "common.black",
5846
+ sx: {
5847
+ overflow: "hidden",
5848
+ textOverflow: "ellipsis",
5849
+ whiteSpace: "nowrap"
5850
+ }
5851
+ },
5852
+ file.name
5853
+ ), !!file.size && /* @__PURE__ */ React45.createElement(Typography_default, { level: "body-xs", fontWeight: "300", lineHeight: "1.33", textColor: "text.tertiary" }, getFileSize(file.size))), /* @__PURE__ */ React45.createElement(IconButton_default, { onClick: () => onDelete?.(file) }, /* @__PURE__ */ React45.createElement(ClearIcon2, null))))));
5842
5854
  };
5843
5855
  var UploaderRoot = styled29(Stack_default, {
5844
5856
  name: "Uploader",
@@ -5894,7 +5906,9 @@ var Uploader = React45.memo(
5894
5906
  onChange,
5895
5907
  label,
5896
5908
  disabled,
5897
- onDelete
5909
+ onDelete,
5910
+ error: errorProp,
5911
+ helperText: helperTextProp
5898
5912
  } = props;
5899
5913
  const dropZoneRef = useRef10(null);
5900
5914
  const inputRef = useRef10(null);
@@ -5913,6 +5927,9 @@ var Uploader = React45.memo(
5913
5927
  [accepts]
5914
5928
  );
5915
5929
  const helperText = useMemo14(() => {
5930
+ if (helperTextProp) {
5931
+ return helperTextProp;
5932
+ }
5916
5933
  const [allAcceptedTypes, acceptedTypes] = [
5917
5934
  accepts.filter((accept2) => ["image/*", "video/*", "audio/*"].includes(accept2)).map((accept2) => {
5918
5935
  const [type] = accept2.split("/");
@@ -5938,8 +5955,8 @@ var Uploader = React45.memo(
5938
5955
  helperTexts.push(`Up to ${maxCount} ${maxCount === 1 ? "file" : "files"}`);
5939
5956
  }
5940
5957
  return helperTexts.join(", ");
5941
- }, [accepts, maxFileTotalSize, maxCount]);
5942
- const error = useMemo14(() => !!errorText || props.error, [props.error, errorText]);
5958
+ }, [accepts, maxFileTotalSize, maxCount, helperTextProp]);
5959
+ const error = useMemo14(() => !!errorText || errorProp, [errorProp, errorText]);
5943
5960
  const showDropZone = useMemo14(
5944
5961
  () => !maxCount || maxCount && [...uploaded, ...files].length !== maxCount,
5945
5962
  [files, maxCount, uploaded]