@xsolla/xui-image-uploader 0.149.0 → 0.150.0

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.
package/web/index.js CHANGED
@@ -352,6 +352,8 @@ var ImageUploader = (0, import_react3.forwardRef)(
352
352
  const fileInputRef = (0, import_react3.useRef)(null);
353
353
  const isControlled = value !== void 0;
354
354
  const [internalPreview, setInternalPreview] = (0, import_react3.useState)(null);
355
+ const [isAutoUploading, setIsAutoUploading] = (0, import_react3.useState)(false);
356
+ const [autoError, setAutoError] = (0, import_react3.useState)(null);
355
357
  const [isHover, setIsHover] = (0, import_react3.useState)(false);
356
358
  const [isFocus, setIsFocus] = (0, import_react3.useState)(false);
357
359
  const [isPreviewHover, setIsPreviewHover] = (0, import_react3.useState)(false);
@@ -377,10 +379,11 @@ var ImageUploader = (0, import_react3.forwardRef)(
377
379
  const alertBorder = theme.colors.control.alert.border;
378
380
  const alertText = theme.colors.content.alert.primary;
379
381
  const scrim = theme.colors.layer.scrim;
380
- const hasError = !!errorMessage;
382
+ const resolvedError = errorMessage || autoError;
383
+ const hasError = !!resolvedError;
381
384
  let state;
382
385
  if (disabled) state = "disable";
383
- else if (loading) state = "uploading";
386
+ else if (loading || isAutoUploading) state = "uploading";
384
387
  else if (hasError) state = "error";
385
388
  else if (preview)
386
389
  state = isPreviewHover || isHoverless ? "uploadedHover" : "uploaded";
@@ -388,25 +391,42 @@ var ImageUploader = (0, import_react3.forwardRef)(
388
391
  else if (isHover) state = "hover";
389
392
  else state = "default";
390
393
  const emitFile = (img) => {
394
+ setAutoError(null);
391
395
  if (!isControlled) setInternalPreview(img.uri);
392
- onUpload?.(img);
393
396
  onChange?.({
394
397
  filename: img.name,
395
398
  url: img.uri
396
399
  });
400
+ const result = onUpload?.(img);
401
+ if (result && typeof result.then === "function") {
402
+ setIsAutoUploading(true);
403
+ Promise.resolve(result).then((uploaded) => {
404
+ let next = null;
405
+ if (typeof uploaded === "string") {
406
+ next = { url: uploaded };
407
+ } else if (uploaded && typeof uploaded === "object" && "url" in uploaded) {
408
+ next = uploaded;
409
+ }
410
+ if (next) {
411
+ if (!isControlled) setInternalPreview(next.url ?? null);
412
+ onChange?.(next);
413
+ }
414
+ }).catch((err) => {
415
+ setAutoError(err?.message || "Upload failed");
416
+ if (!isControlled) setInternalPreview(null);
417
+ onChange?.(null, err);
418
+ }).finally(() => setIsAutoUploading(false));
419
+ }
397
420
  };
398
421
  const handleWebFile = (file) => {
399
- if (!file.type.startsWith("image/")) return;
400
422
  const reader = new FileReader();
401
423
  reader.onload = (e) => {
402
424
  const uri = e.target?.result;
403
- emitFile({
404
- name: file.name,
405
- size: file.size,
406
- uri,
407
- mimeType: file.type,
408
- file
409
- });
425
+ const enriched = file;
426
+ enriched.uri = uri;
427
+ enriched.mimeType = file.type;
428
+ enriched.file = enriched;
429
+ emitFile(enriched);
410
430
  };
411
431
  reader.readAsDataURL(file);
412
432
  };
@@ -450,6 +470,7 @@ var ImageUploader = (0, import_react3.forwardRef)(
450
470
  };
451
471
  const removeImage = (e) => {
452
472
  e?.stopPropagation?.();
473
+ setAutoError(null);
453
474
  if (!isControlled) setInternalPreview(null);
454
475
  setIsPreviewHover(false);
455
476
  onDelete?.();
@@ -493,6 +514,7 @@ var ImageUploader = (0, import_react3.forwardRef)(
493
514
  break;
494
515
  }
495
516
  const rootGap = state === "error" ? sizeStyles.errorGap : 0;
517
+ const placeholderContent = state === "uploading" ? uploadingPlaceholder : placeholder;
496
518
  const renderInner = () => {
497
519
  if (state === "uploaded" || state === "uploadedHover") {
498
520
  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
@@ -553,7 +575,7 @@ var ImageUploader = (0, import_react3.forwardRef)(
553
575
  ...isWeb && { "aria-hidden": "true" }
554
576
  }
555
577
  ) : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Box, { ...isWeb && { "aria-hidden": "true" }, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_xui_icons_base.Image, { size: sizeStyles.iconSize, color: iconColor }) }),
556
- placeholder && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
578
+ placeholderContent && (typeof placeholderContent === "string" ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
557
579
  Text,
558
580
  {
559
581
  "data-testid": "image-uploader__placeholder",
@@ -569,9 +591,9 @@ var ImageUploader = (0, import_react3.forwardRef)(
569
591
  textOverflow: "ellipsis",
570
592
  whiteSpace: "nowrap"
571
593
  } : void 0,
572
- children: state === "uploading" ? uploadingPlaceholder : placeholder
594
+ children: placeholderContent
573
595
  }
574
- ),
596
+ ) : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Box, { "data-testid": "image-uploader__placeholder", children: placeholderContent })),
575
597
  description && wideView && state !== "uploading" && state !== "error" && (typeof description === "string" ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
576
598
  Text,
577
599
  {
@@ -629,9 +651,9 @@ var ImageUploader = (0, import_react3.forwardRef)(
629
651
  outline: "none",
630
652
  transition: "background-color 0.15s ease, border-color 0.15s ease"
631
653
  } : {};
632
- const buttonAriaLabel = preview ? `Remove image${value?.filename ? `: ${value.filename}` : ""}` : state === "uploading" ? uploadingPlaceholder : placeholder;
654
+ const buttonAriaLabel = preview ? `Remove image${value?.filename ? `: ${value.filename}` : ""}` : state === "uploading" ? typeof uploadingPlaceholder === "string" ? uploadingPlaceholder : "Uploading" : typeof placeholder === "string" ? placeholder : "Upload";
633
655
  const describedBy = [
634
- state === "error" && errorMessage ? errorId : null,
656
+ state === "error" && resolvedError ? errorId : null,
635
657
  description && wideView && state !== "uploading" && state !== "error" ? descriptionId : null
636
658
  ].filter(Boolean).join(" ") || void 0;
637
659
  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
@@ -642,7 +664,6 @@ var ImageUploader = (0, import_react3.forwardRef)(
642
664
  gap: rootGap,
643
665
  alignItems: "flex-start",
644
666
  width: wideView ? "100%" : void 0,
645
- maxWidth: wideView ? sizeStyles.wideWidth : void 0,
646
667
  children: [
647
668
  isWeb && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
648
669
  "input",
@@ -674,7 +695,6 @@ var ImageUploader = (0, import_react3.forwardRef)(
674
695
  ...webOnlyHandlers,
675
696
  position: "relative",
676
697
  width: wideView ? "100%" : sizeStyles.box,
677
- maxWidth: wideView ? sizeStyles.wideWidth : void 0,
678
698
  height: sizeStyles.box,
679
699
  flexDirection: "column",
680
700
  alignItems: "center",
@@ -691,7 +711,7 @@ var ImageUploader = (0, import_react3.forwardRef)(
691
711
  children: renderInner()
692
712
  }
693
713
  ),
694
- state === "error" && errorMessage && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
714
+ state === "error" && resolvedError && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
695
715
  Text,
696
716
  {
697
717
  "data-testid": "image-uploader__error",
@@ -699,7 +719,7 @@ var ImageUploader = (0, import_react3.forwardRef)(
699
719
  fontSize: sizeStyles.errorFontSize,
700
720
  lineHeight: sizeStyles.errorLineHeight,
701
721
  ...isWeb && { id: errorId, role: "alert" },
702
- children: errorMessage
722
+ children: resolvedError
703
723
  }
704
724
  )
705
725
  ]
package/web/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/index.tsx","../../src/ImageUploader.tsx","../../../../foundation/primitives-web/src/Box.tsx","../../../../foundation/primitives-web/src/filterDOMProps.ts","../../../../../node_modules/@emotion/memoize/dist/memoize.esm.js","../../../../../node_modules/@emotion/is-prop-valid/dist/is-prop-valid.esm.js","../../../../foundation/primitives-web/src/Text.tsx","../../../../foundation/primitives-web/src/index.tsx"],"sourcesContent":["export * from \"./ImageUploader\";\n","import React, { useRef, useState, useEffect, forwardRef } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, isWeb } from \"@xsolla/xui-primitives\";\nimport {\n useId,\n useResolvedTheme,\n type ThemeOverrideProps,\n} from \"@xsolla/xui-core\";\nimport { Image, TrashCan } from \"@xsolla/xui-icons-base\";\nimport { Spinner } from \"@xsolla/xui-spinner\";\n\nexport type ImageUploaderSize = \"xl\" | \"lg\" | \"md\" | \"sm\" | \"xs\";\n\n/** Controlled value shape. */\nexport interface ImageUploaderValue {\n filename: string;\n url?: string;\n}\n\n/**\n * Normalized file shape produced by the platform picker / drag-drop pipeline.\n * - `uri` is a data-URL on web and a file URI on native.\n * - On web, the original `File` is passed through for consumers that need it\n * (e.g. to upload via FormData / fetch).\n */\nexport type ImageUploaderFile = {\n name: string;\n size: number;\n uri: string;\n mimeType?: string;\n /** The original DOM File (web only) */\n file?: File;\n};\n\nexport interface ImageUploaderProps extends ThemeOverrideProps {\n /** Size of the uploader. Figma default is `xl`. */\n size?: ImageUploaderSize;\n /** Placeholder text shown under the icon (e.g. \"Upload\" or filename in error). */\n placeholder?: string;\n /** Placeholder text shown while the file is uploading. */\n uploadingPlaceholder?: string;\n /** Description below the placeholder. Only rendered when `wideView` is true. Accepts a string or a custom React node. */\n description?: React.ReactNode;\n /** Error message — when provided, component renders in the error state. */\n errorMessage?: string;\n /** Wide view (horizontal layout). When true, box uses `wideWidth` from sizing. */\n wideView?: boolean;\n /** Disabled state. */\n disabled?: boolean;\n /** Controlled loading state (shows spinner + \"Uploading\" label). */\n loading?: boolean;\n\n /** Controlled value. When provided, the component reflects this value. */\n value?: ImageUploaderValue | null;\n\n /**\n * Fires when the user picks (or drops) a file. Use this to perform the\n * actual upload — the component itself does no I/O.\n */\n onUpload?: (file: ImageUploaderFile) => void;\n /**\n * Fires when the displayed value changes — on file pick (with a local\n * data-URL preview) and on remove (`null`).\n */\n onChange?: (value: ImageUploaderValue | null) => void;\n /** Fires when the user removes the image (trash click / clear). */\n onDelete?: () => void;\n\n /** Accepted file types (web only — ignored on native). */\n accept?: string;\n /**\n * Native file picker hook. Required on native (no DOM `<input type=\"file\">`).\n * On web, omit this and the component falls back to a hidden file input.\n */\n openPicker?: () => Promise<ImageUploaderFile | null>;\n}\n\ntype InternalState =\n | \"default\"\n | \"hover\"\n | \"focus\"\n | \"uploading\"\n | \"uploaded\"\n | \"uploadedHover\"\n | \"error\"\n | \"disable\";\n\nexport const ImageUploader = forwardRef<HTMLInputElement, ImageUploaderProps>(\n (\n {\n size = \"xl\",\n placeholder = \"Upload\",\n uploadingPlaceholder = \"Uploading\",\n description,\n errorMessage,\n wideView = false,\n accept = \"image/*\",\n openPicker,\n value,\n onUpload,\n onChange,\n onDelete,\n disabled = false,\n loading = false,\n themeMode,\n themeProductContext,\n },\n ref\n ) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const fileInputRef = useRef<HTMLInputElement>(null);\n const isControlled = value !== undefined;\n const [internalPreview, setInternalPreview] = useState<string | null>(null);\n const [isHover, setIsHover] = useState(false);\n const [isFocus, setIsFocus] = useState(false);\n const [isPreviewHover, setIsPreviewHover] = useState(false);\n // Touch / native devices have no hover, so the trash overlay would never\n // appear. Detect once on mount and force `uploadedHover` for those cases.\n const [isHoverless] = useState(\n () =>\n !isWeb ||\n (typeof window !== \"undefined\" &&\n !!window.matchMedia?.(\"(hover: none)\").matches)\n );\n\n const reactId = useId();\n const baseId = `image-uploader-${reactId.replace(/[^a-zA-Z0-9-]/g, \"\")}`;\n const descriptionId = `${baseId}-description`;\n const errorId = `${baseId}-error`;\n\n const preview = isControlled ? (value?.url ?? null) : internalPreview;\n\n useEffect(() => {\n if (!isControlled && value === null) setInternalPreview(null);\n }, [isControlled, value]);\n\n React.useImperativeHandle(\n ref,\n () => fileInputRef.current as HTMLInputElement,\n []\n );\n\n const sizeStyles = theme.sizing.imageUploader(size);\n const inputColors = theme.colors.control.input;\n const focusColors = theme.colors.control.focus;\n const alertBorder = theme.colors.control.alert.border;\n const alertText = theme.colors.content.alert.primary;\n const scrim = theme.colors.layer.scrim;\n\n const hasError = !!errorMessage;\n\n let state: InternalState;\n if (disabled) state = \"disable\";\n else if (loading) state = \"uploading\";\n else if (hasError) state = \"error\";\n else if (preview)\n state = isPreviewHover || isHoverless ? \"uploadedHover\" : \"uploaded\";\n else if (isFocus) state = \"focus\";\n else if (isHover) state = \"hover\";\n else state = \"default\";\n\n const emitFile = (img: ImageUploaderFile) => {\n if (!isControlled) setInternalPreview(img.uri);\n onUpload?.(img);\n onChange?.({\n filename: img.name,\n url: img.uri,\n });\n };\n\n const handleWebFile = (file: File) => {\n if (!file.type.startsWith(\"image/\")) return;\n const reader = new FileReader();\n reader.onload = (e) => {\n const uri = e.target?.result as string;\n emitFile({\n name: file.name,\n size: file.size,\n uri,\n mimeType: file.type,\n file,\n });\n };\n reader.readAsDataURL(file);\n };\n\n const handleClick = async () => {\n if (disabled || loading) return;\n if (preview) {\n removeImage();\n return;\n }\n if (openPicker) {\n const picked = await openPicker();\n if (picked) emitFile(picked);\n return;\n }\n if (isWeb) {\n fileInputRef.current?.click();\n }\n };\n\n const handleFileChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const file = e.target.files?.[0];\n e.target.value = \"\";\n if (file) handleWebFile(file);\n };\n\n const handleDragOver = (e: React.DragEvent) => {\n e.preventDefault();\n e.stopPropagation();\n if (!disabled && !loading && !preview) setIsHover(true);\n };\n\n const handleDragLeave = (e: React.DragEvent) => {\n e.preventDefault();\n e.stopPropagation();\n setIsHover(false);\n };\n\n const handleDrop = (e: React.DragEvent) => {\n e.preventDefault();\n e.stopPropagation();\n setIsHover(false);\n if (disabled || loading || preview) return;\n const file = e.dataTransfer.files?.[0];\n if (file) handleWebFile(file);\n };\n\n const removeImage = (e?: { stopPropagation?: () => void }) => {\n e?.stopPropagation?.();\n if (!isControlled) setInternalPreview(null);\n setIsPreviewHover(false);\n onDelete?.();\n onChange?.(null);\n if (isWeb && fileInputRef.current) fileInputRef.current.value = \"\";\n };\n\n let backgroundColor: string = inputColors.bg;\n let borderColor: string = inputColors.border;\n let borderStyle: \"dashed\" | \"solid\" = \"dashed\";\n let labelColor: string = inputColors.text;\n let descriptionColor: string = inputColors.placeholder;\n let iconColor: string = inputColors.text;\n\n switch (state) {\n case \"hover\":\n backgroundColor = inputColors.bgHover;\n borderColor = inputColors.borderHover;\n break;\n case \"focus\":\n case \"uploading\":\n backgroundColor = focusColors.bg;\n borderColor = focusColors.border;\n break;\n case \"uploaded\":\n case \"uploadedHover\":\n backgroundColor = \"transparent\";\n borderColor = \"transparent\";\n break;\n case \"error\":\n backgroundColor = inputColors.bg;\n borderColor = alertBorder;\n borderStyle = \"solid\";\n labelColor = alertText;\n iconColor = alertText;\n break;\n case \"disable\":\n backgroundColor = inputColors.bgDisable;\n borderColor = inputColors.borderDisable;\n labelColor = inputColors.textDisable;\n descriptionColor = inputColors.textDisable;\n iconColor = inputColors.textDisable;\n break;\n }\n\n const rootGap = state === \"error\" ? sizeStyles.errorGap : 0;\n\n const renderInner = () => {\n if (state === \"uploaded\" || state === \"uploadedHover\") {\n return (\n <>\n <Box\n as=\"img\"\n src={preview || undefined}\n alt={value?.filename ?? \"Uploaded image\"}\n position=\"absolute\"\n top={0}\n left={0}\n right={0}\n bottom={0}\n borderRadius={sizeStyles.radius}\n resizeMode=\"cover\"\n {...(isWeb && { width: \"100%\", height: \"100%\" })}\n style={isWeb ? { objectFit: \"cover\" } : undefined}\n />\n {state === \"uploadedHover\" && !disabled && (\n <>\n <Box\n position=\"absolute\"\n top={0}\n left={0}\n right={0}\n bottom={0}\n backgroundColor={scrim}\n borderRadius={sizeStyles.radius}\n {...(isWeb && { \"aria-hidden\": \"true\" })}\n />\n <Box\n position=\"relative\"\n width={sizeStyles.iconSize}\n height={sizeStyles.iconSize}\n alignItems=\"center\"\n justifyContent=\"center\"\n zIndex={1}\n pointerEvents=\"none\"\n {...(isWeb && { \"aria-hidden\": \"true\" })}\n >\n <TrashCan size={sizeStyles.iconSize} color=\"#ffffff\" />\n </Box>\n </>\n )}\n </>\n );\n }\n\n return (\n <>\n {state === \"uploading\" ? (\n <Spinner\n size={size}\n color={theme.colors.content.brand.primary}\n {...(isWeb && { \"aria-hidden\": \"true\" })}\n />\n ) : (\n <Box {...(isWeb && { \"aria-hidden\": \"true\" })}>\n <Image size={sizeStyles.iconSize} color={iconColor} />\n </Box>\n )}\n\n {placeholder && (\n <Text\n data-testid=\"image-uploader__placeholder\"\n color={labelColor}\n fontSize={sizeStyles.labelFontSize}\n lineHeight={sizeStyles.labelLineHeight}\n fontWeight=\"500\"\n textAlign=\"center\"\n numberOfLines={1}\n style={\n isWeb\n ? {\n maxWidth: \"100%\",\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n whiteSpace: \"nowrap\",\n }\n : undefined\n }\n >\n {state === \"uploading\" ? uploadingPlaceholder : placeholder}\n </Text>\n )}\n\n {description &&\n wideView &&\n state !== \"uploading\" &&\n state !== \"error\" &&\n (typeof description === \"string\" ? (\n <Text\n data-testid=\"image-uploader__description\"\n color={descriptionColor}\n fontSize={sizeStyles.descriptionFontSize}\n lineHeight={sizeStyles.descriptionLineHeight}\n textAlign=\"center\"\n numberOfLines={1}\n style={\n isWeb\n ? {\n maxWidth: \"100%\",\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n whiteSpace: \"nowrap\",\n }\n : undefined\n }\n {...(isWeb && { id: descriptionId })}\n >\n {description}\n </Text>\n ) : (\n <Box\n data-testid=\"image-uploader__description\"\n {...(isWeb && { id: descriptionId })}\n >\n {description}\n </Box>\n ))}\n </>\n );\n };\n\n // Web-only DOM event handlers — stripped on native.\n const webOnlyHandlers = isWeb\n ? {\n onMouseEnter: () => {\n if (disabled || loading) return;\n if (preview) setIsPreviewHover(true);\n else setIsHover(true);\n },\n onMouseLeave: () => {\n if (preview) setIsPreviewHover(false);\n else setIsHover(false);\n },\n onFocus: (e: React.FocusEvent<HTMLElement>) => {\n if (disabled || loading || preview) return;\n // Only show the focus visual state for keyboard focus, not for\n // pointer focus (e.g. after the native file picker is cancelled).\n if (\n typeof e.target?.matches === \"function\" &&\n !e.target.matches(\":focus-visible\")\n ) {\n return;\n }\n setIsFocus(true);\n },\n onBlur: () => setIsFocus(false),\n onDragOver: handleDragOver,\n onDragLeave: handleDragLeave,\n onDrop: handleDrop,\n }\n : {};\n\n // Web-only CSS props — dropped on native to avoid style warnings.\n const webOnlyStyle = isWeb\n ? {\n boxSizing: \"border-box\" as const,\n display: \"flex\" as const,\n cursor: (disabled || loading\n ? \"not-allowed\"\n : \"pointer\") as React.CSSProperties[\"cursor\"],\n outline: \"none\",\n transition: \"background-color 0.15s ease, border-color 0.15s ease\",\n }\n : {};\n\n const buttonAriaLabel = preview\n ? `Remove image${value?.filename ? `: ${value.filename}` : \"\"}`\n : state === \"uploading\"\n ? uploadingPlaceholder\n : placeholder;\n\n const describedBy =\n [\n state === \"error\" && errorMessage ? errorId : null,\n description && wideView && state !== \"uploading\" && state !== \"error\"\n ? descriptionId\n : null,\n ]\n .filter(Boolean)\n .join(\" \") || undefined;\n\n return (\n <Box\n data-testid=\"image-uploader\"\n flexDirection=\"column\"\n gap={rootGap}\n alignItems=\"flex-start\"\n width={wideView ? \"100%\" : undefined}\n maxWidth={wideView ? sizeStyles.wideWidth : undefined}\n >\n {isWeb && (\n <input\n type=\"file\"\n ref={fileInputRef}\n accept={accept}\n onChange={handleFileChange}\n style={{ display: \"none\" }}\n disabled={disabled}\n tabIndex={-1}\n aria-hidden=\"true\"\n data-testid=\"image-uploader__input\"\n />\n )}\n\n <Box\n as={isWeb ? \"button\" : \"div\"}\n disabled={disabled || loading}\n data-testid=\"image-uploader__button\"\n onPress={handleClick}\n {...(isWeb && {\n \"aria-label\": buttonAriaLabel,\n \"aria-busy\": loading || undefined,\n \"aria-invalid\": state === \"error\" || undefined,\n \"aria-describedby\": describedBy,\n })}\n {...webOnlyHandlers}\n position=\"relative\"\n width={wideView ? \"100%\" : sizeStyles.box}\n maxWidth={wideView ? sizeStyles.wideWidth : undefined}\n height={sizeStyles.box}\n flexDirection=\"column\"\n alignItems=\"center\"\n justifyContent=\"center\"\n gap={sizeStyles.gap}\n padding={state === \"uploaded\" ? 0 : sizeStyles.padding}\n borderWidth={sizeStyles.borderWidth}\n borderStyle={borderStyle}\n borderColor={borderColor}\n borderRadius={sizeStyles.radius}\n backgroundColor={backgroundColor}\n overflow=\"hidden\"\n style={webOnlyStyle}\n >\n {renderInner()}\n </Box>\n\n {state === \"error\" && errorMessage && (\n <Text\n data-testid=\"image-uploader__error\"\n color={alertText}\n fontSize={sizeStyles.errorFontSize}\n lineHeight={sizeStyles.errorLineHeight}\n {...(isWeb && { id: errorId, role: \"alert\" })}\n >\n {errorMessage}\n </Text>\n )}\n </Box>\n );\n }\n);\n\nImageUploader.displayName = \"ImageUploader\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport type { BoxProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredDiv = createFilteredElement(\"div\");\n\nconst StyledBox = styled(FilteredDiv)<BoxProps>`\n display: flex;\n box-sizing: border-box;\n background-color: ${(props) => props.backgroundColor || \"transparent\"};\n border-color: ${(props) => props.borderColor || \"transparent\"};\n border-width: ${(props) =>\n typeof props.borderWidth === \"number\"\n ? `${props.borderWidth}px`\n : props.borderWidth || 0};\n\n ${(props) =>\n props.borderBottomWidth !== undefined &&\n `\n border-bottom-width: ${typeof props.borderBottomWidth === \"number\" ? `${props.borderBottomWidth}px` : props.borderBottomWidth};\n border-bottom-color: ${props.borderBottomColor || props.borderColor || \"transparent\"};\n border-bottom-style: solid;\n `}\n ${(props) =>\n props.borderTopWidth !== undefined &&\n `\n border-top-width: ${typeof props.borderTopWidth === \"number\" ? `${props.borderTopWidth}px` : props.borderTopWidth};\n border-top-color: ${props.borderTopColor || props.borderColor || \"transparent\"};\n border-top-style: solid;\n `}\n ${(props) =>\n props.borderLeftWidth !== undefined &&\n `\n border-left-width: ${typeof props.borderLeftWidth === \"number\" ? `${props.borderLeftWidth}px` : props.borderLeftWidth};\n border-left-color: ${props.borderLeftColor || props.borderColor || \"transparent\"};\n border-left-style: solid;\n `}\n ${(props) =>\n props.borderRightWidth !== undefined &&\n `\n border-right-width: ${typeof props.borderRightWidth === \"number\" ? `${props.borderRightWidth}px` : props.borderRightWidth};\n border-right-color: ${props.borderRightColor || props.borderColor || \"transparent\"};\n border-right-style: solid;\n `}\n\n border-style: ${(props) =>\n props.borderStyle ||\n (props.borderWidth ||\n props.borderBottomWidth ||\n props.borderTopWidth ||\n props.borderLeftWidth ||\n props.borderRightWidth\n ? \"solid\"\n : \"none\")};\n border-radius: ${(props) =>\n typeof props.borderRadius === \"number\"\n ? `${props.borderRadius}px`\n : props.borderRadius || 0};\n height: ${(props) =>\n typeof props.height === \"number\"\n ? `${props.height}px`\n : props.height || \"auto\"};\n width: ${(props) =>\n typeof props.width === \"number\"\n ? `${props.width}px`\n : props.width || \"auto\"};\n min-width: ${(props) =>\n typeof props.minWidth === \"number\"\n ? `${props.minWidth}px`\n : props.minWidth || \"auto\"};\n min-height: ${(props) =>\n typeof props.minHeight === \"number\"\n ? `${props.minHeight}px`\n : props.minHeight || \"auto\"};\n max-width: ${(props) =>\n typeof props.maxWidth === \"number\"\n ? `${props.maxWidth}px`\n : props.maxWidth || \"none\"};\n max-height: ${(props) =>\n typeof props.maxHeight === \"number\"\n ? `${props.maxHeight}px`\n : props.maxHeight || \"none\"};\n\n padding: ${(props) =>\n typeof props.padding === \"number\"\n ? `${props.padding}px`\n : props.padding || 0};\n ${(props) =>\n props.paddingHorizontal &&\n `\n padding-left: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n padding-right: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n `}\n ${(props) =>\n props.paddingVertical &&\n `\n padding-top: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n padding-bottom: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n `}\n ${(props) =>\n props.paddingTop !== undefined &&\n `padding-top: ${typeof props.paddingTop === \"number\" ? `${props.paddingTop}px` : props.paddingTop};`}\n ${(props) =>\n props.paddingBottom !== undefined &&\n `padding-bottom: ${typeof props.paddingBottom === \"number\" ? `${props.paddingBottom}px` : props.paddingBottom};`}\n ${(props) =>\n props.paddingLeft !== undefined &&\n `padding-left: ${typeof props.paddingLeft === \"number\" ? `${props.paddingLeft}px` : props.paddingLeft};`}\n ${(props) =>\n props.paddingRight !== undefined &&\n `padding-right: ${typeof props.paddingRight === \"number\" ? `${props.paddingRight}px` : props.paddingRight};`}\n\n margin: ${(props) =>\n typeof props.margin === \"number\" ? `${props.margin}px` : props.margin || 0};\n ${(props) =>\n props.marginTop !== undefined &&\n `margin-top: ${typeof props.marginTop === \"number\" ? `${props.marginTop}px` : props.marginTop};`}\n ${(props) =>\n props.marginBottom !== undefined &&\n `margin-bottom: ${typeof props.marginBottom === \"number\" ? `${props.marginBottom}px` : props.marginBottom};`}\n ${(props) =>\n props.marginLeft !== undefined &&\n `margin-left: ${typeof props.marginLeft === \"number\" ? `${props.marginLeft}px` : props.marginLeft};`}\n ${(props) =>\n props.marginRight !== undefined &&\n `margin-right: ${typeof props.marginRight === \"number\" ? `${props.marginRight}px` : props.marginRight};`}\n\n flex-direction: ${(props) => props.flexDirection || \"column\"};\n flex-wrap: ${(props) => props.flexWrap || \"nowrap\"};\n align-items: ${(props) => props.alignItems || \"stretch\"};\n justify-content: ${(props) => props.justifyContent || \"flex-start\"};\n cursor: ${(props) =>\n props.cursor\n ? props.cursor\n : props.onClick || props.onPress\n ? \"pointer\"\n : \"inherit\"};\n position: ${(props) => props.position || \"static\"};\n top: ${(props) =>\n typeof props.top === \"number\" ? `${props.top}px` : props.top};\n bottom: ${(props) =>\n typeof props.bottom === \"number\" ? `${props.bottom}px` : props.bottom};\n left: ${(props) =>\n typeof props.left === \"number\" ? `${props.left}px` : props.left};\n right: ${(props) =>\n typeof props.right === \"number\" ? `${props.right}px` : props.right};\n flex: ${(props) => props.flex};\n flex-shrink: ${(props) => props.flexShrink ?? 1};\n gap: ${(props) =>\n typeof props.gap === \"number\" ? `${props.gap}px` : props.gap || 0};\n align-self: ${(props) => props.alignSelf || \"auto\"};\n overflow: ${(props) => props.overflow || \"visible\"};\n overflow-x: ${(props) => props.overflowX || \"visible\"};\n overflow-y: ${(props) => props.overflowY || \"visible\"};\n z-index: ${(props) => props.zIndex};\n opacity: ${(props) => (props.disabled ? 0.5 : 1)};\n pointer-events: ${(props) => (props.disabled ? \"none\" : \"auto\")};\n\n &:hover {\n ${(props) =>\n props.hoverStyle?.backgroundColor &&\n `background-color: ${props.hoverStyle.backgroundColor};`}\n ${(props) =>\n props.hoverStyle?.borderColor &&\n `border-color: ${props.hoverStyle.borderColor};`}\n }\n\n &:active {\n ${(props) =>\n props.pressStyle?.backgroundColor &&\n `background-color: ${props.pressStyle.backgroundColor};`}\n }\n`;\n\nexport const Box = React.forwardRef<\n HTMLDivElement | HTMLButtonElement,\n BoxProps\n>(\n (\n {\n children,\n onPress,\n onKeyDown,\n onKeyUp,\n role,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-current\": ariaCurrent,\n \"aria-disabled\": ariaDisabled,\n \"aria-live\": ariaLive,\n \"aria-busy\": ariaBusy,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-expanded\": ariaExpanded,\n \"aria-haspopup\": ariaHasPopup,\n \"aria-pressed\": ariaPressed,\n \"aria-controls\": ariaControls,\n tabIndex,\n as,\n src,\n alt,\n onError,\n onLoad,\n type,\n disabled,\n id,\n testID,\n \"data-testid\": dataTestId,\n ...props\n },\n ref\n ) => {\n // Handle as=\"img\" for rendering images with proper border-radius\n if (as === \"img\" && src) {\n return (\n <img\n src={src}\n alt={alt || \"\"}\n onError={onError}\n onLoad={onLoad}\n style={{\n display: \"block\",\n objectFit: \"cover\",\n width:\n typeof props.width === \"number\"\n ? `${props.width}px`\n : props.width,\n height:\n typeof props.height === \"number\"\n ? `${props.height}px`\n : props.height,\n borderRadius:\n typeof props.borderRadius === \"number\"\n ? `${props.borderRadius}px`\n : props.borderRadius,\n position: props.position,\n top: typeof props.top === \"number\" ? `${props.top}px` : props.top,\n left:\n typeof props.left === \"number\" ? `${props.left}px` : props.left,\n right:\n typeof props.right === \"number\"\n ? `${props.right}px`\n : props.right,\n bottom:\n typeof props.bottom === \"number\"\n ? `${props.bottom}px`\n : props.bottom,\n }}\n />\n );\n }\n\n return (\n <StyledBox\n ref={ref}\n elementType={as}\n id={id}\n type={as === \"button\" ? type || \"button\" : undefined}\n disabled={as === \"button\" ? disabled : undefined}\n onClick={onPress}\n onKeyDown={onKeyDown}\n onKeyUp={onKeyUp}\n role={role}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-current={ariaCurrent}\n aria-disabled={ariaDisabled}\n aria-busy={ariaBusy}\n aria-describedby={ariaDescribedBy}\n aria-expanded={ariaExpanded}\n aria-haspopup={ariaHasPopup}\n aria-pressed={ariaPressed}\n aria-controls={ariaControls}\n aria-live={ariaLive}\n tabIndex={tabIndex !== undefined ? tabIndex : undefined}\n data-testid={dataTestId || testID}\n {...props}\n >\n {children}\n </StyledBox>\n );\n }\n);\n\nBox.displayName = \"Box\";\n","import React from \"react\";\nimport isPropValid from \"@emotion/is-prop-valid\";\n\n// Props that @emotion/is-prop-valid incorrectly treats as valid HTML.\n// These are React Native or component-specific props that match\n// valid HTML patterns (on* event handlers, SVG attributes).\nexport const ADDITIONAL_BLOCKED_PROPS = new Set([\n // RN-only event handlers (pass isPropValid's on* pattern)\n \"onPress\",\n \"onChangeText\",\n \"onLayout\",\n \"onMoveShouldSetResponder\",\n \"onResponderGrant\",\n \"onResponderMove\",\n \"onResponderRelease\",\n \"onResponderTerminate\",\n // SVG attributes that pass isPropValid\n \"strokeWidth\",\n // CSS properties that pass isPropValid but are used as component props\n \"overflow\",\n \"cursor\",\n \"fontSize\",\n \"fontWeight\",\n \"fontFamily\",\n \"textDecoration\",\n]);\n\nfunction shouldForwardProp(key: string): boolean {\n if (ADDITIONAL_BLOCKED_PROPS.has(key)) return false;\n return isPropValid(key);\n}\n\n/**\n * Creates a React component that renders the given HTML tag\n * but filters out non-HTML props before they reach the DOM.\n *\n * Uses @emotion/is-prop-valid (same library styled-components v4\n * uses internally) to automatically block invalid HTML attributes,\n * plus a small blocklist for false positives (RN on* handlers, SVG attrs).\n *\n * Usage: `const FilteredDiv = createFilteredElement(\"div\");`\n * Then: `const StyledBox = styled(FilteredDiv)<BoxProps>\\`...\\`;`\n *\n * styled-components can still read ALL props for CSS interpolation,\n * but only valid HTML attributes are forwarded to the DOM element.\n */\nexport function createFilteredElement(defaultTag: string) {\n const Component = React.forwardRef<HTMLElement, Record<string, unknown>>(\n ({ children, elementType, ...props }, ref) => {\n const Tag = (elementType as string) || defaultTag;\n const htmlProps: Record<string, unknown> = {};\n for (const key of Object.keys(props)) {\n if (shouldForwardProp(key)) {\n htmlProps[key] = props[key];\n }\n }\n return React.createElement(\n Tag,\n { ref, ...htmlProps },\n children as React.ReactNode\n );\n }\n );\n Component.displayName = `Filtered(${defaultTag})`;\n return Component;\n}\n","function memoize(fn) {\n var cache = {};\n return function (arg) {\n if (cache[arg] === undefined) cache[arg] = fn(arg);\n return cache[arg];\n };\n}\n\nexport default memoize;\n","import memoize from '@emotion/memoize';\n\nvar reactPropsRegex = /^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|suppressHydrationWarning|valueLink|accept|acceptCharset|accessKey|action|allow|allowUserMedia|allowPaymentRequest|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|decoding|default|defer|dir|disabled|disablePictureInPicture|download|draggable|encType|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loading|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|inert|itemProp|itemScope|itemType|itemID|itemRef|on|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan|for|class|autofocus)|(([Dd][Aa][Tt][Aa]|[Aa][Rr][Ii][Aa]|x)-.*))$/; // https://esbench.com/bench/5bfee68a4cd7e6009ef61d23\n\nvar index = memoize(function (prop) {\n return reactPropsRegex.test(prop) || prop.charCodeAt(0) === 111\n /* o */\n && prop.charCodeAt(1) === 110\n /* n */\n && prop.charCodeAt(2) < 91;\n}\n/* Z+1 */\n);\n\nexport default index;\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredSpan = createFilteredElement(\"span\");\n\nconst StyledText = styled(FilteredSpan)<TextProps>`\n color: ${(props) => props.color || \"inherit\"};\n font-size: ${(props) =>\n typeof props.fontSize === \"number\"\n ? `${props.fontSize}px`\n : props.fontSize || \"inherit\"};\n font-weight: ${(props) => props.fontWeight || \"normal\"};\n font-family: ${(props) =>\n props.fontFamily ||\n '\"Aktiv Grotesk\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif'};\n line-height: ${(props) =>\n typeof props.lineHeight === \"number\"\n ? `${props.lineHeight}px`\n : props.lineHeight || \"inherit\"};\n white-space: ${(props) => props.whiteSpace || \"normal\"};\n text-align: ${(props) => props.textAlign || \"inherit\"};\n text-decoration: ${(props) => props.textDecoration || \"none\"};\n`;\n\nexport const Text: React.FC<TextProps> = ({\n style,\n className,\n id,\n role,\n numberOfLines: _numberOfLines,\n ...props\n}) => {\n return (\n <StyledText\n {...props}\n style={style}\n className={className}\n id={id}\n role={role}\n />\n );\n};\n","export * from \"./Box\";\nexport * from \"./Text\";\nexport * from \"./Spinner\";\nexport * from \"./Icon\";\nexport * from \"./Divider\";\nexport * from \"./Input\";\nexport * from \"./TextArea\";\nexport * from \"./LinearGradient\";\n\nexport const isWeb = true;\nexport const isNative = false;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,IAAAA,gBAA+D;;;ACA/D,IAAAC,gBAAkB;AAClB,+BAAmB;;;ACDnB,mBAAkB;;;ACAlB,SAAS,QAAQ,IAAI;AACnB,MAAI,QAAQ,CAAC;AACb,SAAO,SAAU,KAAK;AACpB,QAAI,MAAM,GAAG,MAAM,OAAW,OAAM,GAAG,IAAI,GAAG,GAAG;AACjD,WAAO,MAAM,GAAG;AAAA,EAClB;AACF;AAEA,IAAO,sBAAQ;;;ACNf,IAAI,kBAAkB;AAEtB,IAAI,QAAQ;AAAA,EAAQ,SAAU,MAAM;AAClC,WAAO,gBAAgB,KAAK,IAAI,KAAK,KAAK,WAAW,CAAC,MAAM,OAEzD,KAAK,WAAW,CAAC,MAAM,OAEvB,KAAK,WAAW,CAAC,IAAI;AAAA,EAC1B;AAAA;AAEA;AAEA,IAAO,4BAAQ;;;AFRR,IAAM,2BAA2B,oBAAI,IAAI;AAAA;AAAA,EAE9C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA;AAAA,EAEA;AAAA;AAAA,EAEA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,CAAC;AAED,SAAS,kBAAkB,KAAsB;AAC/C,MAAI,yBAAyB,IAAI,GAAG,EAAG,QAAO;AAC9C,SAAO,0BAAY,GAAG;AACxB;AAgBO,SAAS,sBAAsB,YAAoB;AACxD,QAAM,YAAY,aAAAC,QAAM;AAAA,IACtB,CAAC,EAAE,UAAU,aAAa,GAAG,MAAM,GAAG,QAAQ;AAC5C,YAAM,MAAO,eAA0B;AACvC,YAAM,YAAqC,CAAC;AAC5C,iBAAW,OAAO,OAAO,KAAK,KAAK,GAAG;AACpC,YAAI,kBAAkB,GAAG,GAAG;AAC1B,oBAAU,GAAG,IAAI,MAAM,GAAG;AAAA,QAC5B;AAAA,MACF;AACA,aAAO,aAAAA,QAAM;AAAA,QACX;AAAA,QACA,EAAE,KAAK,GAAG,UAAU;AAAA,QACpB;AAAA,MACF;AAAA,IACF;AAAA,EACF;AACA,YAAU,cAAc,YAAY,UAAU;AAC9C,SAAO;AACT;;;ADsJQ;AAlNR,IAAM,cAAc,sBAAsB,KAAK;AAE/C,IAAM,gBAAY,yBAAAC,SAAO,WAAW;AAAA;AAAA;AAAA,sBAGd,CAAC,UAAU,MAAM,mBAAmB,aAAa;AAAA,kBACrD,CAAC,UAAU,MAAM,eAAe,aAAa;AAAA,kBAC7C,CAAC,UACf,OAAO,MAAM,gBAAgB,WACzB,GAAG,MAAM,WAAW,OACpB,MAAM,eAAe,CAAC;AAAA;AAAA,IAE1B,CAAC,UACD,MAAM,sBAAsB,UAC5B;AAAA,2BACuB,OAAO,MAAM,sBAAsB,WAAW,GAAG,MAAM,iBAAiB,OAAO,MAAM,iBAAiB;AAAA,2BACtG,MAAM,qBAAqB,MAAM,eAAe,aAAa;AAAA;AAAA,GAErF;AAAA,IACC,CAAC,UACD,MAAM,mBAAmB,UACzB;AAAA,wBACoB,OAAO,MAAM,mBAAmB,WAAW,GAAG,MAAM,cAAc,OAAO,MAAM,cAAc;AAAA,wBAC7F,MAAM,kBAAkB,MAAM,eAAe,aAAa;AAAA;AAAA,GAE/E;AAAA,IACC,CAAC,UACD,MAAM,oBAAoB,UAC1B;AAAA,yBACqB,OAAO,MAAM,oBAAoB,WAAW,GAAG,MAAM,eAAe,OAAO,MAAM,eAAe;AAAA,yBAChG,MAAM,mBAAmB,MAAM,eAAe,aAAa;AAAA;AAAA,GAEjF;AAAA,IACC,CAAC,UACD,MAAM,qBAAqB,UAC3B;AAAA,0BACsB,OAAO,MAAM,qBAAqB,WAAW,GAAG,MAAM,gBAAgB,OAAO,MAAM,gBAAgB;AAAA,0BACnG,MAAM,oBAAoB,MAAM,eAAe,aAAa;AAAA;AAAA,GAEnF;AAAA;AAAA,kBAEe,CAAC,UACf,MAAM,gBACL,MAAM,eACP,MAAM,qBACN,MAAM,kBACN,MAAM,mBACN,MAAM,mBACF,UACA,OAAO;AAAA,mBACI,CAAC,UAChB,OAAO,MAAM,iBAAiB,WAC1B,GAAG,MAAM,YAAY,OACrB,MAAM,gBAAgB,CAAC;AAAA,YACnB,CAAC,UACT,OAAO,MAAM,WAAW,WACpB,GAAG,MAAM,MAAM,OACf,MAAM,UAAU,MAAM;AAAA,WACnB,CAAC,UACR,OAAO,MAAM,UAAU,WACnB,GAAG,MAAM,KAAK,OACd,MAAM,SAAS,MAAM;AAAA,eACd,CAAC,UACZ,OAAO,MAAM,aAAa,WACtB,GAAG,MAAM,QAAQ,OACjB,MAAM,YAAY,MAAM;AAAA,gBAChB,CAAC,UACb,OAAO,MAAM,cAAc,WACvB,GAAG,MAAM,SAAS,OAClB,MAAM,aAAa,MAAM;AAAA,eAClB,CAAC,UACZ,OAAO,MAAM,aAAa,WACtB,GAAG,MAAM,QAAQ,OACjB,MAAM,YAAY,MAAM;AAAA,gBAChB,CAAC,UACb,OAAO,MAAM,cAAc,WACvB,GAAG,MAAM,SAAS,OAClB,MAAM,aAAa,MAAM;AAAA;AAAA,aAEpB,CAAC,UACV,OAAO,MAAM,YAAY,WACrB,GAAG,MAAM,OAAO,OAChB,MAAM,WAAW,CAAC;AAAA,IACtB,CAAC,UACD,MAAM,qBACN;AAAA,oBACgB,OAAO,MAAM,sBAAsB,WAAW,GAAG,MAAM,iBAAiB,OAAO,MAAM,iBAAiB;AAAA,qBACrG,OAAO,MAAM,sBAAsB,WAAW,GAAG,MAAM,iBAAiB,OAAO,MAAM,iBAAiB;AAAA,GACxH;AAAA,IACC,CAAC,UACD,MAAM,mBACN;AAAA,mBACe,OAAO,MAAM,oBAAoB,WAAW,GAAG,MAAM,eAAe,OAAO,MAAM,eAAe;AAAA,sBAC7F,OAAO,MAAM,oBAAoB,WAAW,GAAG,MAAM,eAAe,OAAO,MAAM,eAAe;AAAA,GACnH;AAAA,IACC,CAAC,UACD,MAAM,eAAe,UACrB,gBAAgB,OAAO,MAAM,eAAe,WAAW,GAAG,MAAM,UAAU,OAAO,MAAM,UAAU,GAAG;AAAA,IACpG,CAAC,UACD,MAAM,kBAAkB,UACxB,mBAAmB,OAAO,MAAM,kBAAkB,WAAW,GAAG,MAAM,aAAa,OAAO,MAAM,aAAa,GAAG;AAAA,IAChH,CAAC,UACD,MAAM,gBAAgB,UACtB,iBAAiB,OAAO,MAAM,gBAAgB,WAAW,GAAG,MAAM,WAAW,OAAO,MAAM,WAAW,GAAG;AAAA,IACxG,CAAC,UACD,MAAM,iBAAiB,UACvB,kBAAkB,OAAO,MAAM,iBAAiB,WAAW,GAAG,MAAM,YAAY,OAAO,MAAM,YAAY,GAAG;AAAA;AAAA,YAEpG,CAAC,UACT,OAAO,MAAM,WAAW,WAAW,GAAG,MAAM,MAAM,OAAO,MAAM,UAAU,CAAC;AAAA,IAC1E,CAAC,UACD,MAAM,cAAc,UACpB,eAAe,OAAO,MAAM,cAAc,WAAW,GAAG,MAAM,SAAS,OAAO,MAAM,SAAS,GAAG;AAAA,IAChG,CAAC,UACD,MAAM,iBAAiB,UACvB,kBAAkB,OAAO,MAAM,iBAAiB,WAAW,GAAG,MAAM,YAAY,OAAO,MAAM,YAAY,GAAG;AAAA,IAC5G,CAAC,UACD,MAAM,eAAe,UACrB,gBAAgB,OAAO,MAAM,eAAe,WAAW,GAAG,MAAM,UAAU,OAAO,MAAM,UAAU,GAAG;AAAA,IACpG,CAAC,UACD,MAAM,gBAAgB,UACtB,iBAAiB,OAAO,MAAM,gBAAgB,WAAW,GAAG,MAAM,WAAW,OAAO,MAAM,WAAW,GAAG;AAAA;AAAA,oBAExF,CAAC,UAAU,MAAM,iBAAiB,QAAQ;AAAA,eAC/C,CAAC,UAAU,MAAM,YAAY,QAAQ;AAAA,iBACnC,CAAC,UAAU,MAAM,cAAc,SAAS;AAAA,qBACpC,CAAC,UAAU,MAAM,kBAAkB,YAAY;AAAA,YACxD,CAAC,UACT,MAAM,SACF,MAAM,SACN,MAAM,WAAW,MAAM,UACrB,YACA,SAAS;AAAA,cACL,CAAC,UAAU,MAAM,YAAY,QAAQ;AAAA,SAC1C,CAAC,UACN,OAAO,MAAM,QAAQ,WAAW,GAAG,MAAM,GAAG,OAAO,MAAM,GAAG;AAAA,YACpD,CAAC,UACT,OAAO,MAAM,WAAW,WAAW,GAAG,MAAM,MAAM,OAAO,MAAM,MAAM;AAAA,UAC/D,CAAC,UACP,OAAO,MAAM,SAAS,WAAW,GAAG,MAAM,IAAI,OAAO,MAAM,IAAI;AAAA,WACxD,CAAC,UACR,OAAO,MAAM,UAAU,WAAW,GAAG,MAAM,KAAK,OAAO,MAAM,KAAK;AAAA,UAC5D,CAAC,UAAU,MAAM,IAAI;AAAA,iBACd,CAAC,UAAU,MAAM,cAAc,CAAC;AAAA,SACxC,CAAC,UACN,OAAO,MAAM,QAAQ,WAAW,GAAG,MAAM,GAAG,OAAO,MAAM,OAAO,CAAC;AAAA,gBACrD,CAAC,UAAU,MAAM,aAAa,MAAM;AAAA,cACtC,CAAC,UAAU,MAAM,YAAY,SAAS;AAAA,gBACpC,CAAC,UAAU,MAAM,aAAa,SAAS;AAAA,gBACvC,CAAC,UAAU,MAAM,aAAa,SAAS;AAAA,aAC1C,CAAC,UAAU,MAAM,MAAM;AAAA,aACvB,CAAC,UAAW,MAAM,WAAW,MAAM,CAAE;AAAA,oBAC9B,CAAC,UAAW,MAAM,WAAW,SAAS,MAAO;AAAA;AAAA;AAAA,MAG3D,CAAC,UACD,MAAM,YAAY,mBAClB,qBAAqB,MAAM,WAAW,eAAe,GAAG;AAAA,MACxD,CAAC,UACD,MAAM,YAAY,eAClB,iBAAiB,MAAM,WAAW,WAAW,GAAG;AAAA;AAAA;AAAA;AAAA,MAIhD,CAAC,UACD,MAAM,YAAY,mBAClB,qBAAqB,MAAM,WAAW,eAAe,GAAG;AAAA;AAAA;AAIvD,IAAM,MAAM,cAAAC,QAAM;AAAA,EAIvB,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,cAAc;AAAA,IACd,mBAAmB;AAAA,IACnB,gBAAgB;AAAA,IAChB,iBAAiB;AAAA,IACjB,aAAa;AAAA,IACb,aAAa;AAAA,IACb,oBAAoB;AAAA,IACpB,iBAAiB;AAAA,IACjB,iBAAiB;AAAA,IACjB,gBAAgB;AAAA,IAChB,iBAAiB;AAAA,IACjB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,eAAe;AAAA,IACf,GAAG;AAAA,EACL,GACA,QACG;AAEH,QAAI,OAAO,SAAS,KAAK;AACvB,aACE;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA,KAAK,OAAO;AAAA,UACZ;AAAA,UACA;AAAA,UACA,OAAO;AAAA,YACL,SAAS;AAAA,YACT,WAAW;AAAA,YACX,OACE,OAAO,MAAM,UAAU,WACnB,GAAG,MAAM,KAAK,OACd,MAAM;AAAA,YACZ,QACE,OAAO,MAAM,WAAW,WACpB,GAAG,MAAM,MAAM,OACf,MAAM;AAAA,YACZ,cACE,OAAO,MAAM,iBAAiB,WAC1B,GAAG,MAAM,YAAY,OACrB,MAAM;AAAA,YACZ,UAAU,MAAM;AAAA,YAChB,KAAK,OAAO,MAAM,QAAQ,WAAW,GAAG,MAAM,GAAG,OAAO,MAAM;AAAA,YAC9D,MACE,OAAO,MAAM,SAAS,WAAW,GAAG,MAAM,IAAI,OAAO,MAAM;AAAA,YAC7D,OACE,OAAO,MAAM,UAAU,WACnB,GAAG,MAAM,KAAK,OACd,MAAM;AAAA,YACZ,QACE,OAAO,MAAM,WAAW,WACpB,GAAG,MAAM,MAAM,OACf,MAAM;AAAA,UACd;AAAA;AAAA,MACF;AAAA,IAEJ;AAEA,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,aAAa;AAAA,QACb;AAAA,QACA,MAAM,OAAO,WAAW,QAAQ,WAAW;AAAA,QAC3C,UAAU,OAAO,WAAW,WAAW;AAAA,QACvC,SAAS;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA,cAAY;AAAA,QACZ,mBAAiB;AAAA,QACjB,gBAAc;AAAA,QACd,iBAAe;AAAA,QACf,aAAW;AAAA,QACX,oBAAkB;AAAA,QAClB,iBAAe;AAAA,QACf,iBAAe;AAAA,QACf,gBAAc;AAAA,QACd,iBAAe;AAAA,QACf,aAAW;AAAA,QACX,UAAU,aAAa,SAAY,WAAW;AAAA,QAC9C,eAAa,cAAc;AAAA,QAC1B,GAAG;AAAA,QAEH;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AAEA,IAAI,cAAc;;;AI3RlB,IAAAC,4BAAmB;AAkCf,IAAAC,sBAAA;AA9BJ,IAAM,eAAe,sBAAsB,MAAM;AAEjD,IAAM,iBAAa,0BAAAC,SAAO,YAAY;AAAA,WAC3B,CAAC,UAAU,MAAM,SAAS,SAAS;AAAA,eAC/B,CAAC,UACZ,OAAO,MAAM,aAAa,WACtB,GAAG,MAAM,QAAQ,OACjB,MAAM,YAAY,SAAS;AAAA,iBAClB,CAAC,UAAU,MAAM,cAAc,QAAQ;AAAA,iBACvC,CAAC,UACd,MAAM,cACN,sGAAsG;AAAA,iBACzF,CAAC,UACd,OAAO,MAAM,eAAe,WACxB,GAAG,MAAM,UAAU,OACnB,MAAM,cAAc,SAAS;AAAA,iBACpB,CAAC,UAAU,MAAM,cAAc,QAAQ;AAAA,gBACxC,CAAC,UAAU,MAAM,aAAa,SAAS;AAAA,qBAClC,CAAC,UAAU,MAAM,kBAAkB,MAAM;AAAA;AAGvD,IAAM,OAA4B,CAAC;AAAA,EACxC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe;AAAA,EACf,GAAG;AACL,MAAM;AACJ,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,EACF;AAEJ;;;AClCO,IAAM,QAAQ;;;ANNrB,sBAIO;AACP,4BAAgC;AAChC,yBAAwB;AAiRZ,IAAAC,sBAAA;AAnML,IAAM,oBAAgB;AAAA,EAC3B,CACE;AAAA,IACE,OAAO;AAAA,IACP,cAAc;AAAA,IACd,uBAAuB;AAAA,IACvB;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX,UAAU;AAAA,IACV;AAAA,IACA;AAAA,EACF,GACA,QACG;AACH,UAAM,EAAE,MAAM,QAAI,kCAAiB,EAAE,WAAW,oBAAoB,CAAC;AACrE,UAAM,mBAAe,sBAAyB,IAAI;AAClD,UAAM,eAAe,UAAU;AAC/B,UAAM,CAAC,iBAAiB,kBAAkB,QAAI,wBAAwB,IAAI;AAC1E,UAAM,CAAC,SAAS,UAAU,QAAI,wBAAS,KAAK;AAC5C,UAAM,CAAC,SAAS,UAAU,QAAI,wBAAS,KAAK;AAC5C,UAAM,CAAC,gBAAgB,iBAAiB,QAAI,wBAAS,KAAK;AAG1D,UAAM,CAAC,WAAW,QAAI;AAAA,MACpB,MACE,CAAC,SACA,OAAO,WAAW,eACjB,CAAC,CAAC,OAAO,aAAa,eAAe,EAAE;AAAA,IAC7C;AAEA,UAAM,cAAU,uBAAM;AACtB,UAAM,SAAS,kBAAkB,QAAQ,QAAQ,kBAAkB,EAAE,CAAC;AACtE,UAAM,gBAAgB,GAAG,MAAM;AAC/B,UAAM,UAAU,GAAG,MAAM;AAEzB,UAAM,UAAU,eAAgB,OAAO,OAAO,OAAQ;AAEtD,iCAAU,MAAM;AACd,UAAI,CAAC,gBAAgB,UAAU,KAAM,oBAAmB,IAAI;AAAA,IAC9D,GAAG,CAAC,cAAc,KAAK,CAAC;AAExB,kBAAAC,QAAM;AAAA,MACJ;AAAA,MACA,MAAM,aAAa;AAAA,MACnB,CAAC;AAAA,IACH;AAEA,UAAM,aAAa,MAAM,OAAO,cAAc,IAAI;AAClD,UAAM,cAAc,MAAM,OAAO,QAAQ;AACzC,UAAM,cAAc,MAAM,OAAO,QAAQ;AACzC,UAAM,cAAc,MAAM,OAAO,QAAQ,MAAM;AAC/C,UAAM,YAAY,MAAM,OAAO,QAAQ,MAAM;AAC7C,UAAM,QAAQ,MAAM,OAAO,MAAM;AAEjC,UAAM,WAAW,CAAC,CAAC;AAEnB,QAAI;AACJ,QAAI,SAAU,SAAQ;AAAA,aACb,QAAS,SAAQ;AAAA,aACjB,SAAU,SAAQ;AAAA,aAClB;AACP,cAAQ,kBAAkB,cAAc,kBAAkB;AAAA,aACnD,QAAS,SAAQ;AAAA,aACjB,QAAS,SAAQ;AAAA,QACrB,SAAQ;AAEb,UAAM,WAAW,CAAC,QAA2B;AAC3C,UAAI,CAAC,aAAc,oBAAmB,IAAI,GAAG;AAC7C,iBAAW,GAAG;AACd,iBAAW;AAAA,QACT,UAAU,IAAI;AAAA,QACd,KAAK,IAAI;AAAA,MACX,CAAC;AAAA,IACH;AAEA,UAAM,gBAAgB,CAAC,SAAe;AACpC,UAAI,CAAC,KAAK,KAAK,WAAW,QAAQ,EAAG;AACrC,YAAM,SAAS,IAAI,WAAW;AAC9B,aAAO,SAAS,CAAC,MAAM;AACrB,cAAM,MAAM,EAAE,QAAQ;AACtB,iBAAS;AAAA,UACP,MAAM,KAAK;AAAA,UACX,MAAM,KAAK;AAAA,UACX;AAAA,UACA,UAAU,KAAK;AAAA,UACf;AAAA,QACF,CAAC;AAAA,MACH;AACA,aAAO,cAAc,IAAI;AAAA,IAC3B;AAEA,UAAM,cAAc,YAAY;AAC9B,UAAI,YAAY,QAAS;AACzB,UAAI,SAAS;AACX,oBAAY;AACZ;AAAA,MACF;AACA,UAAI,YAAY;AACd,cAAM,SAAS,MAAM,WAAW;AAChC,YAAI,OAAQ,UAAS,MAAM;AAC3B;AAAA,MACF;AACA,UAAI,OAAO;AACT,qBAAa,SAAS,MAAM;AAAA,MAC9B;AAAA,IACF;AAEA,UAAM,mBAAmB,CAAC,MAA2C;AACnE,YAAM,OAAO,EAAE,OAAO,QAAQ,CAAC;AAC/B,QAAE,OAAO,QAAQ;AACjB,UAAI,KAAM,eAAc,IAAI;AAAA,IAC9B;AAEA,UAAM,iBAAiB,CAAC,MAAuB;AAC7C,QAAE,eAAe;AACjB,QAAE,gBAAgB;AAClB,UAAI,CAAC,YAAY,CAAC,WAAW,CAAC,QAAS,YAAW,IAAI;AAAA,IACxD;AAEA,UAAM,kBAAkB,CAAC,MAAuB;AAC9C,QAAE,eAAe;AACjB,QAAE,gBAAgB;AAClB,iBAAW,KAAK;AAAA,IAClB;AAEA,UAAM,aAAa,CAAC,MAAuB;AACzC,QAAE,eAAe;AACjB,QAAE,gBAAgB;AAClB,iBAAW,KAAK;AAChB,UAAI,YAAY,WAAW,QAAS;AACpC,YAAM,OAAO,EAAE,aAAa,QAAQ,CAAC;AACrC,UAAI,KAAM,eAAc,IAAI;AAAA,IAC9B;AAEA,UAAM,cAAc,CAAC,MAAyC;AAC5D,SAAG,kBAAkB;AACrB,UAAI,CAAC,aAAc,oBAAmB,IAAI;AAC1C,wBAAkB,KAAK;AACvB,iBAAW;AACX,iBAAW,IAAI;AACf,UAAI,SAAS,aAAa,QAAS,cAAa,QAAQ,QAAQ;AAAA,IAClE;AAEA,QAAI,kBAA0B,YAAY;AAC1C,QAAI,cAAsB,YAAY;AACtC,QAAI,cAAkC;AACtC,QAAI,aAAqB,YAAY;AACrC,QAAI,mBAA2B,YAAY;AAC3C,QAAI,YAAoB,YAAY;AAEpC,YAAQ,OAAO;AAAA,MACb,KAAK;AACH,0BAAkB,YAAY;AAC9B,sBAAc,YAAY;AAC1B;AAAA,MACF,KAAK;AAAA,MACL,KAAK;AACH,0BAAkB,YAAY;AAC9B,sBAAc,YAAY;AAC1B;AAAA,MACF,KAAK;AAAA,MACL,KAAK;AACH,0BAAkB;AAClB,sBAAc;AACd;AAAA,MACF,KAAK;AACH,0BAAkB,YAAY;AAC9B,sBAAc;AACd,sBAAc;AACd,qBAAa;AACb,oBAAY;AACZ;AAAA,MACF,KAAK;AACH,0BAAkB,YAAY;AAC9B,sBAAc,YAAY;AAC1B,qBAAa,YAAY;AACzB,2BAAmB,YAAY;AAC/B,oBAAY,YAAY;AACxB;AAAA,IACJ;AAEA,UAAM,UAAU,UAAU,UAAU,WAAW,WAAW;AAE1D,UAAM,cAAc,MAAM;AACxB,UAAI,UAAU,cAAc,UAAU,iBAAiB;AACrD,eACE,8EACE;AAAA;AAAA,YAAC;AAAA;AAAA,cACC,IAAG;AAAA,cACH,KAAK,WAAW;AAAA,cAChB,KAAK,OAAO,YAAY;AAAA,cACxB,UAAS;AAAA,cACT,KAAK;AAAA,cACL,MAAM;AAAA,cACN,OAAO;AAAA,cACP,QAAQ;AAAA,cACR,cAAc,WAAW;AAAA,cACzB,YAAW;AAAA,cACV,GAAI,SAAS,EAAE,OAAO,QAAQ,QAAQ,OAAO;AAAA,cAC9C,OAAO,QAAQ,EAAE,WAAW,QAAQ,IAAI;AAAA;AAAA,UAC1C;AAAA,UACC,UAAU,mBAAmB,CAAC,YAC7B,8EACE;AAAA;AAAA,cAAC;AAAA;AAAA,gBACC,UAAS;AAAA,gBACT,KAAK;AAAA,gBACL,MAAM;AAAA,gBACN,OAAO;AAAA,gBACP,QAAQ;AAAA,gBACR,iBAAiB;AAAA,gBACjB,cAAc,WAAW;AAAA,gBACxB,GAAI,SAAS,EAAE,eAAe,OAAO;AAAA;AAAA,YACxC;AAAA,YACA;AAAA,cAAC;AAAA;AAAA,gBACC,UAAS;AAAA,gBACT,OAAO,WAAW;AAAA,gBAClB,QAAQ,WAAW;AAAA,gBACnB,YAAW;AAAA,gBACX,gBAAe;AAAA,gBACf,QAAQ;AAAA,gBACR,eAAc;AAAA,gBACb,GAAI,SAAS,EAAE,eAAe,OAAO;AAAA,gBAEtC,uDAAC,kCAAS,MAAM,WAAW,UAAU,OAAM,WAAU;AAAA;AAAA,YACvD;AAAA,aACF;AAAA,WAEJ;AAAA,MAEJ;AAEA,aACE,8EACG;AAAA,kBAAU,cACT;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA,OAAO,MAAM,OAAO,QAAQ,MAAM;AAAA,YACjC,GAAI,SAAS,EAAE,eAAe,OAAO;AAAA;AAAA,QACxC,IAEA,6CAAC,OAAK,GAAI,SAAS,EAAE,eAAe,OAAO,GACzC,uDAAC,+BAAM,MAAM,WAAW,UAAU,OAAO,WAAW,GACtD;AAAA,QAGD,eACC;AAAA,UAAC;AAAA;AAAA,YACC,eAAY;AAAA,YACZ,OAAO;AAAA,YACP,UAAU,WAAW;AAAA,YACrB,YAAY,WAAW;AAAA,YACvB,YAAW;AAAA,YACX,WAAU;AAAA,YACV,eAAe;AAAA,YACf,OACE,QACI;AAAA,cACE,UAAU;AAAA,cACV,UAAU;AAAA,cACV,cAAc;AAAA,cACd,YAAY;AAAA,YACd,IACA;AAAA,YAGL,oBAAU,cAAc,uBAAuB;AAAA;AAAA,QAClD;AAAA,QAGD,eACC,YACA,UAAU,eACV,UAAU,YACT,OAAO,gBAAgB,WACtB;AAAA,UAAC;AAAA;AAAA,YACC,eAAY;AAAA,YACZ,OAAO;AAAA,YACP,UAAU,WAAW;AAAA,YACrB,YAAY,WAAW;AAAA,YACvB,WAAU;AAAA,YACV,eAAe;AAAA,YACf,OACE,QACI;AAAA,cACE,UAAU;AAAA,cACV,UAAU;AAAA,cACV,cAAc;AAAA,cACd,YAAY;AAAA,YACd,IACA;AAAA,YAEL,GAAI,SAAS,EAAE,IAAI,cAAc;AAAA,YAEjC;AAAA;AAAA,QACH,IAEA;AAAA,UAAC;AAAA;AAAA,YACC,eAAY;AAAA,YACX,GAAI,SAAS,EAAE,IAAI,cAAc;AAAA,YAEjC;AAAA;AAAA,QACH;AAAA,SAEN;AAAA,IAEJ;AAGA,UAAM,kBAAkB,QACpB;AAAA,MACE,cAAc,MAAM;AAClB,YAAI,YAAY,QAAS;AACzB,YAAI,QAAS,mBAAkB,IAAI;AAAA,YAC9B,YAAW,IAAI;AAAA,MACtB;AAAA,MACA,cAAc,MAAM;AAClB,YAAI,QAAS,mBAAkB,KAAK;AAAA,YAC/B,YAAW,KAAK;AAAA,MACvB;AAAA,MACA,SAAS,CAAC,MAAqC;AAC7C,YAAI,YAAY,WAAW,QAAS;AAGpC,YACE,OAAO,EAAE,QAAQ,YAAY,cAC7B,CAAC,EAAE,OAAO,QAAQ,gBAAgB,GAClC;AACA;AAAA,QACF;AACA,mBAAW,IAAI;AAAA,MACjB;AAAA,MACA,QAAQ,MAAM,WAAW,KAAK;AAAA,MAC9B,YAAY;AAAA,MACZ,aAAa;AAAA,MACb,QAAQ;AAAA,IACV,IACA,CAAC;AAGL,UAAM,eAAe,QACjB;AAAA,MACE,WAAW;AAAA,MACX,SAAS;AAAA,MACT,QAAS,YAAY,UACjB,gBACA;AAAA,MACJ,SAAS;AAAA,MACT,YAAY;AAAA,IACd,IACA,CAAC;AAEL,UAAM,kBAAkB,UACpB,eAAe,OAAO,WAAW,KAAK,MAAM,QAAQ,KAAK,EAAE,KAC3D,UAAU,cACR,uBACA;AAEN,UAAM,cACJ;AAAA,MACE,UAAU,WAAW,eAAe,UAAU;AAAA,MAC9C,eAAe,YAAY,UAAU,eAAe,UAAU,UAC1D,gBACA;AAAA,IACN,EACG,OAAO,OAAO,EACd,KAAK,GAAG,KAAK;AAElB,WACE;AAAA,MAAC;AAAA;AAAA,QACC,eAAY;AAAA,QACZ,eAAc;AAAA,QACd,KAAK;AAAA,QACL,YAAW;AAAA,QACX,OAAO,WAAW,SAAS;AAAA,QAC3B,UAAU,WAAW,WAAW,YAAY;AAAA,QAE3C;AAAA,mBACC;AAAA,YAAC;AAAA;AAAA,cACC,MAAK;AAAA,cACL,KAAK;AAAA,cACL;AAAA,cACA,UAAU;AAAA,cACV,OAAO,EAAE,SAAS,OAAO;AAAA,cACzB;AAAA,cACA,UAAU;AAAA,cACV,eAAY;AAAA,cACZ,eAAY;AAAA;AAAA,UACd;AAAA,UAGF;AAAA,YAAC;AAAA;AAAA,cACC,IAAI,QAAQ,WAAW;AAAA,cACvB,UAAU,YAAY;AAAA,cACtB,eAAY;AAAA,cACZ,SAAS;AAAA,cACR,GAAI,SAAS;AAAA,gBACZ,cAAc;AAAA,gBACd,aAAa,WAAW;AAAA,gBACxB,gBAAgB,UAAU,WAAW;AAAA,gBACrC,oBAAoB;AAAA,cACtB;AAAA,cACC,GAAG;AAAA,cACJ,UAAS;AAAA,cACT,OAAO,WAAW,SAAS,WAAW;AAAA,cACtC,UAAU,WAAW,WAAW,YAAY;AAAA,cAC5C,QAAQ,WAAW;AAAA,cACnB,eAAc;AAAA,cACd,YAAW;AAAA,cACX,gBAAe;AAAA,cACf,KAAK,WAAW;AAAA,cAChB,SAAS,UAAU,aAAa,IAAI,WAAW;AAAA,cAC/C,aAAa,WAAW;AAAA,cACxB;AAAA,cACA;AAAA,cACA,cAAc,WAAW;AAAA,cACzB;AAAA,cACA,UAAS;AAAA,cACT,OAAO;AAAA,cAEN,sBAAY;AAAA;AAAA,UACf;AAAA,UAEC,UAAU,WAAW,gBACpB;AAAA,YAAC;AAAA;AAAA,cACC,eAAY;AAAA,cACZ,OAAO;AAAA,cACP,UAAU,WAAW;AAAA,cACrB,YAAY,WAAW;AAAA,cACtB,GAAI,SAAS,EAAE,IAAI,SAAS,MAAM,QAAQ;AAAA,cAE1C;AAAA;AAAA,UACH;AAAA;AAAA;AAAA,IAEJ;AAAA,EAEJ;AACF;AAEA,cAAc,cAAc;","names":["import_react","import_react","React","styled","React","import_styled_components","import_jsx_runtime","styled","import_jsx_runtime","React"]}
1
+ {"version":3,"sources":["../../src/index.tsx","../../src/ImageUploader.tsx","../../../../foundation/primitives-web/src/Box.tsx","../../../../foundation/primitives-web/src/filterDOMProps.ts","../../../../../node_modules/@emotion/memoize/dist/memoize.esm.js","../../../../../node_modules/@emotion/is-prop-valid/dist/is-prop-valid.esm.js","../../../../foundation/primitives-web/src/Text.tsx","../../../../foundation/primitives-web/src/index.tsx"],"sourcesContent":["export * from \"./ImageUploader\";\n","import React, { useRef, useState, useEffect, forwardRef } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, isWeb } from \"@xsolla/xui-primitives\";\nimport {\n useId,\n useResolvedTheme,\n type ThemeOverrideProps,\n} from \"@xsolla/xui-core\";\nimport { Image, TrashCan } from \"@xsolla/xui-icons-base\";\nimport { Spinner } from \"@xsolla/xui-spinner\";\n\nexport type ImageUploaderSize = \"xl\" | \"lg\" | \"md\" | \"sm\" | \"xs\";\n\n/** Controlled value shape. */\nexport interface ImageUploaderValue {\n filename?: string;\n url?: string;\n}\n\n/**\n * Normalized file shape produced by the platform picker / drag-drop pipeline.\n * - `uri` is a data-URL on web and a file URI on native.\n * - On web, the original `File` is passed through for consumers that need it\n * (e.g. to upload via FormData / fetch).\n */\nexport type ImageUploaderFile = {\n name: string;\n size: number;\n uri: string;\n mimeType?: string;\n /** The original DOM File (web only) */\n file?: File;\n};\n\nexport interface ImageUploaderProps extends ThemeOverrideProps {\n /** Size of the uploader. Figma default is `xl`. */\n size?: ImageUploaderSize;\n /** Placeholder shown under the icon. Accepts a string or a custom React node. */\n placeholder?: React.ReactNode;\n /** Placeholder shown while the file is uploading. Accepts a string or a custom React node. */\n uploadingPlaceholder?: React.ReactNode;\n /** Description below the placeholder. Only rendered when `wideView` is true. Accepts a string or a custom React node. */\n description?: React.ReactNode;\n /** Error message — when provided, component renders in the error state. */\n errorMessage?: string;\n /** Wide view (horizontal layout). When true, the box stretches to its parent's full width. */\n wideView?: boolean;\n /** Disabled state. */\n disabled?: boolean;\n /** Controlled loading state (shows spinner + \"Uploading\" label). */\n loading?: boolean;\n\n /** Controlled value. When provided, the component reflects this value. */\n value?: ImageUploaderValue | null;\n\n /**\n * Fires when the user picks (or drops) a file. Use this to perform the\n * actual upload — the component itself does no I/O.\n *\n * If the handler returns a `Promise`:\n * - The component automatically shows the uploading state (spinner +\n * `uploadingPlaceholder`) until the promise settles.\n * - If the promise resolves to an `ImageUploaderValue` (`{url, filename?}`)\n * or a `string` URL, the component automatically calls `onChange(value)`\n * with that value. The string form is sugar for `{url: <string>}`.\n * - If the promise rejects, the component calls `onChange(null, error)`.\n *\n * For finer-grained control, pass `loading` explicitly instead.\n */\n onUpload?: (\n file: ImageUploaderFile\n ) => void | Promise<ImageUploaderValue | string | void>;\n /**\n * Fires when the displayed value changes — on file pick (with a local\n * data-URL preview), after upload resolves (with the server value), or on\n * remove (`null`). The optional second argument carries any error thrown by\n * the consumer's `onUpload`.\n */\n onChange?: (value: ImageUploaderValue | null, error?: Error) => void;\n /** Fires when the user removes the image (trash click / clear). */\n onDelete?: () => void;\n\n /**\n * Accepted file types — passed through to the hidden `<input accept>` as a\n * picker hint (web only — ignored on native). Standard HTML syntax:\n * comma-separated list of MIME types (`image/png`), MIME wildcards\n * (`image/*`), or file extensions (`.png`). Defaults to `image/*`.\n *\n * No runtime validation is performed — the consumer's `onUpload` (or the\n * backend it calls) is responsible for accepting/rejecting files.\n */\n accept?: string;\n /**\n * Native file picker hook. Required on native (no DOM `<input type=\"file\">`).\n * On web, omit this and the component falls back to a hidden file input.\n */\n openPicker?: () => Promise<ImageUploaderFile | null>;\n}\n\ntype InternalState =\n | \"default\"\n | \"hover\"\n | \"focus\"\n | \"uploading\"\n | \"uploaded\"\n | \"uploadedHover\"\n | \"error\"\n | \"disable\";\n\nexport const ImageUploader = forwardRef<HTMLInputElement, ImageUploaderProps>(\n (\n {\n size = \"xl\",\n placeholder = \"Upload\",\n uploadingPlaceholder = \"Uploading\",\n description,\n errorMessage,\n wideView = false,\n accept = \"image/*\",\n openPicker,\n value,\n onUpload,\n onChange,\n onDelete,\n disabled = false,\n loading = false,\n themeMode,\n themeProductContext,\n },\n ref\n ) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const fileInputRef = useRef<HTMLInputElement>(null);\n const isControlled = value !== undefined;\n const [internalPreview, setInternalPreview] = useState<string | null>(null);\n const [isAutoUploading, setIsAutoUploading] = useState(false);\n // Captures errors thrown by the consumer's `onUpload`. Surfaced via the\n // component's normal error UI when no explicit `errorMessage` prop is set.\n const [autoError, setAutoError] = useState<string | null>(null);\n const [isHover, setIsHover] = useState(false);\n const [isFocus, setIsFocus] = useState(false);\n const [isPreviewHover, setIsPreviewHover] = useState(false);\n // Touch / native devices have no hover, so the trash overlay would never\n // appear. Detect once on mount and force `uploadedHover` for those cases.\n const [isHoverless] = useState(\n () =>\n !isWeb ||\n (typeof window !== \"undefined\" &&\n !!window.matchMedia?.(\"(hover: none)\").matches)\n );\n\n const reactId = useId();\n const baseId = `image-uploader-${reactId.replace(/[^a-zA-Z0-9-]/g, \"\")}`;\n const descriptionId = `${baseId}-description`;\n const errorId = `${baseId}-error`;\n\n const preview = isControlled ? (value?.url ?? null) : internalPreview;\n\n useEffect(() => {\n if (!isControlled && value === null) setInternalPreview(null);\n }, [isControlled, value]);\n\n React.useImperativeHandle(\n ref,\n () => fileInputRef.current as HTMLInputElement,\n []\n );\n\n const sizeStyles = theme.sizing.imageUploader(size);\n const inputColors = theme.colors.control.input;\n const focusColors = theme.colors.control.focus;\n const alertBorder = theme.colors.control.alert.border;\n const alertText = theme.colors.content.alert.primary;\n const scrim = theme.colors.layer.scrim;\n\n // Resolved error message: explicit prop wins, fall back to caught upload error.\n const resolvedError = errorMessage || autoError;\n const hasError = !!resolvedError;\n\n let state: InternalState;\n if (disabled) state = \"disable\";\n else if (loading || isAutoUploading) state = \"uploading\";\n else if (hasError) state = \"error\";\n else if (preview)\n state = isPreviewHover || isHoverless ? \"uploadedHover\" : \"uploaded\";\n else if (isFocus) state = \"focus\";\n else if (isHover) state = \"hover\";\n else state = \"default\";\n\n const emitFile = (img: ImageUploaderFile) => {\n // Clear any prior error from a previous upload attempt.\n setAutoError(null);\n if (!isControlled) setInternalPreview(img.uri);\n onChange?.({\n filename: img.name,\n url: img.uri,\n });\n const result = onUpload?.(img);\n // If the consumer's onUpload returns a Promise:\n // - show the uploading state until it settles\n // - on resolve with a value, treat it as the canonical onChange payload\n // - on reject, surface the error internally AND via onChange(null, error)\n if (result && typeof (result as Promise<unknown>).then === \"function\") {\n setIsAutoUploading(true);\n Promise.resolve(result)\n .then((uploaded) => {\n // Accept either an ImageUploaderValue ({url, filename?}) or a\n // bare string URL as sugar for {url: <string>}.\n let next: ImageUploaderValue | null = null;\n if (typeof uploaded === \"string\") {\n next = { url: uploaded };\n } else if (\n uploaded &&\n typeof uploaded === \"object\" &&\n \"url\" in uploaded\n ) {\n next = uploaded as ImageUploaderValue;\n }\n if (next) {\n if (!isControlled) setInternalPreview(next.url ?? null);\n onChange?.(next);\n }\n })\n .catch((err: Error) => {\n // Surface internally so the error UI lights up without the\n // consumer having to wire up local state.\n setAutoError(err?.message || \"Upload failed\");\n // Reset preview so we don't keep showing the failed pick.\n if (!isControlled) setInternalPreview(null);\n onChange?.(null, err);\n })\n .finally(() => setIsAutoUploading(false));\n }\n };\n\n const handleWebFile = (file: File) => {\n const reader = new FileReader();\n reader.onload = (e) => {\n const uri = e.target?.result as string;\n // Mutate the DOM File so it satisfies BOTH the DOM File interface (for\n // direct use in FormData / fetch / .size checks) and ImageUploaderFile\n // (with .uri / .mimeType added). `.file` self-references for back-compat\n // with consumers that previously dereferenced `imageFile.file`.\n const enriched = file as File & ImageUploaderFile;\n (enriched as { uri?: string }).uri = uri;\n (enriched as { mimeType?: string }).mimeType = file.type;\n (enriched as { file?: File }).file = enriched;\n emitFile(enriched);\n };\n reader.readAsDataURL(file);\n };\n\n const handleClick = async () => {\n if (disabled || loading) return;\n if (preview) {\n removeImage();\n return;\n }\n if (openPicker) {\n const picked = await openPicker();\n if (picked) emitFile(picked);\n return;\n }\n if (isWeb) {\n fileInputRef.current?.click();\n }\n };\n\n const handleFileChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const file = e.target.files?.[0];\n e.target.value = \"\";\n if (file) handleWebFile(file);\n };\n\n const handleDragOver = (e: React.DragEvent) => {\n e.preventDefault();\n e.stopPropagation();\n if (!disabled && !loading && !preview) setIsHover(true);\n };\n\n const handleDragLeave = (e: React.DragEvent) => {\n e.preventDefault();\n e.stopPropagation();\n setIsHover(false);\n };\n\n const handleDrop = (e: React.DragEvent) => {\n e.preventDefault();\n e.stopPropagation();\n setIsHover(false);\n if (disabled || loading || preview) return;\n const file = e.dataTransfer.files?.[0];\n if (file) handleWebFile(file);\n };\n\n const removeImage = (e?: { stopPropagation?: () => void }) => {\n e?.stopPropagation?.();\n setAutoError(null);\n if (!isControlled) setInternalPreview(null);\n setIsPreviewHover(false);\n onDelete?.();\n onChange?.(null);\n if (isWeb && fileInputRef.current) fileInputRef.current.value = \"\";\n };\n\n let backgroundColor: string = inputColors.bg;\n let borderColor: string = inputColors.border;\n let borderStyle: \"dashed\" | \"solid\" = \"dashed\";\n let labelColor: string = inputColors.text;\n let descriptionColor: string = inputColors.placeholder;\n let iconColor: string = inputColors.text;\n\n switch (state) {\n case \"hover\":\n backgroundColor = inputColors.bgHover;\n borderColor = inputColors.borderHover;\n break;\n case \"focus\":\n case \"uploading\":\n backgroundColor = focusColors.bg;\n borderColor = focusColors.border;\n break;\n case \"uploaded\":\n case \"uploadedHover\":\n backgroundColor = \"transparent\";\n borderColor = \"transparent\";\n break;\n case \"error\":\n backgroundColor = inputColors.bg;\n borderColor = alertBorder;\n borderStyle = \"solid\";\n labelColor = alertText;\n iconColor = alertText;\n break;\n case \"disable\":\n backgroundColor = inputColors.bgDisable;\n borderColor = inputColors.borderDisable;\n labelColor = inputColors.textDisable;\n descriptionColor = inputColors.textDisable;\n iconColor = inputColors.textDisable;\n break;\n }\n\n const rootGap = state === \"error\" ? sizeStyles.errorGap : 0;\n const placeholderContent =\n state === \"uploading\" ? uploadingPlaceholder : placeholder;\n\n const renderInner = () => {\n if (state === \"uploaded\" || state === \"uploadedHover\") {\n return (\n <>\n <Box\n as=\"img\"\n src={preview || undefined}\n alt={value?.filename ?? \"Uploaded image\"}\n position=\"absolute\"\n top={0}\n left={0}\n right={0}\n bottom={0}\n borderRadius={sizeStyles.radius}\n resizeMode=\"cover\"\n {...(isWeb && { width: \"100%\", height: \"100%\" })}\n style={isWeb ? { objectFit: \"cover\" } : undefined}\n />\n {state === \"uploadedHover\" && !disabled && (\n <>\n <Box\n position=\"absolute\"\n top={0}\n left={0}\n right={0}\n bottom={0}\n backgroundColor={scrim}\n borderRadius={sizeStyles.radius}\n {...(isWeb && { \"aria-hidden\": \"true\" })}\n />\n <Box\n position=\"relative\"\n width={sizeStyles.iconSize}\n height={sizeStyles.iconSize}\n alignItems=\"center\"\n justifyContent=\"center\"\n zIndex={1}\n pointerEvents=\"none\"\n {...(isWeb && { \"aria-hidden\": \"true\" })}\n >\n <TrashCan size={sizeStyles.iconSize} color=\"#ffffff\" />\n </Box>\n </>\n )}\n </>\n );\n }\n\n return (\n <>\n {state === \"uploading\" ? (\n <Spinner\n size={size}\n color={theme.colors.content.brand.primary}\n {...(isWeb && { \"aria-hidden\": \"true\" })}\n />\n ) : (\n <Box {...(isWeb && { \"aria-hidden\": \"true\" })}>\n <Image size={sizeStyles.iconSize} color={iconColor} />\n </Box>\n )}\n\n {placeholderContent &&\n (typeof placeholderContent === \"string\" ? (\n <Text\n data-testid=\"image-uploader__placeholder\"\n color={labelColor}\n fontSize={sizeStyles.labelFontSize}\n lineHeight={sizeStyles.labelLineHeight}\n fontWeight=\"500\"\n textAlign=\"center\"\n numberOfLines={1}\n style={\n isWeb\n ? {\n maxWidth: \"100%\",\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n whiteSpace: \"nowrap\",\n }\n : undefined\n }\n >\n {placeholderContent}\n </Text>\n ) : (\n <Box data-testid=\"image-uploader__placeholder\">\n {placeholderContent}\n </Box>\n ))}\n\n {description &&\n wideView &&\n state !== \"uploading\" &&\n state !== \"error\" &&\n (typeof description === \"string\" ? (\n <Text\n data-testid=\"image-uploader__description\"\n color={descriptionColor}\n fontSize={sizeStyles.descriptionFontSize}\n lineHeight={sizeStyles.descriptionLineHeight}\n textAlign=\"center\"\n numberOfLines={1}\n style={\n isWeb\n ? {\n maxWidth: \"100%\",\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n whiteSpace: \"nowrap\",\n }\n : undefined\n }\n {...(isWeb && { id: descriptionId })}\n >\n {description}\n </Text>\n ) : (\n <Box\n data-testid=\"image-uploader__description\"\n {...(isWeb && { id: descriptionId })}\n >\n {description}\n </Box>\n ))}\n </>\n );\n };\n\n // Web-only DOM event handlers — stripped on native.\n const webOnlyHandlers = isWeb\n ? {\n onMouseEnter: () => {\n if (disabled || loading) return;\n if (preview) setIsPreviewHover(true);\n else setIsHover(true);\n },\n onMouseLeave: () => {\n if (preview) setIsPreviewHover(false);\n else setIsHover(false);\n },\n onFocus: (e: React.FocusEvent<HTMLElement>) => {\n if (disabled || loading || preview) return;\n // Only show the focus visual state for keyboard focus, not for\n // pointer focus (e.g. after the native file picker is cancelled).\n if (\n typeof e.target?.matches === \"function\" &&\n !e.target.matches(\":focus-visible\")\n ) {\n return;\n }\n setIsFocus(true);\n },\n onBlur: () => setIsFocus(false),\n onDragOver: handleDragOver,\n onDragLeave: handleDragLeave,\n onDrop: handleDrop,\n }\n : {};\n\n // Web-only CSS props — dropped on native to avoid style warnings.\n const webOnlyStyle = isWeb\n ? {\n boxSizing: \"border-box\" as const,\n display: \"flex\" as const,\n cursor: (disabled || loading\n ? \"not-allowed\"\n : \"pointer\") as React.CSSProperties[\"cursor\"],\n outline: \"none\",\n transition: \"background-color 0.15s ease, border-color 0.15s ease\",\n }\n : {};\n\n // aria-label needs a string; fall back to defaults when placeholder/uploadingPlaceholder\n // are passed as React nodes.\n const buttonAriaLabel = preview\n ? `Remove image${value?.filename ? `: ${value.filename}` : \"\"}`\n : state === \"uploading\"\n ? typeof uploadingPlaceholder === \"string\"\n ? uploadingPlaceholder\n : \"Uploading\"\n : typeof placeholder === \"string\"\n ? placeholder\n : \"Upload\";\n\n const describedBy =\n [\n state === \"error\" && resolvedError ? errorId : null,\n description && wideView && state !== \"uploading\" && state !== \"error\"\n ? descriptionId\n : null,\n ]\n .filter(Boolean)\n .join(\" \") || undefined;\n\n return (\n <Box\n data-testid=\"image-uploader\"\n flexDirection=\"column\"\n gap={rootGap}\n alignItems=\"flex-start\"\n width={wideView ? \"100%\" : undefined}\n >\n {isWeb && (\n <input\n type=\"file\"\n ref={fileInputRef}\n accept={accept}\n onChange={handleFileChange}\n style={{ display: \"none\" }}\n disabled={disabled}\n tabIndex={-1}\n aria-hidden=\"true\"\n data-testid=\"image-uploader__input\"\n />\n )}\n\n <Box\n as={isWeb ? \"button\" : \"div\"}\n disabled={disabled || loading}\n data-testid=\"image-uploader__button\"\n onPress={handleClick}\n {...(isWeb && {\n \"aria-label\": buttonAriaLabel,\n \"aria-busy\": loading || undefined,\n \"aria-invalid\": state === \"error\" || undefined,\n \"aria-describedby\": describedBy,\n })}\n {...webOnlyHandlers}\n position=\"relative\"\n width={wideView ? \"100%\" : sizeStyles.box}\n height={sizeStyles.box}\n flexDirection=\"column\"\n alignItems=\"center\"\n justifyContent=\"center\"\n gap={sizeStyles.gap}\n padding={state === \"uploaded\" ? 0 : sizeStyles.padding}\n borderWidth={sizeStyles.borderWidth}\n borderStyle={borderStyle}\n borderColor={borderColor}\n borderRadius={sizeStyles.radius}\n backgroundColor={backgroundColor}\n overflow=\"hidden\"\n style={webOnlyStyle}\n >\n {renderInner()}\n </Box>\n\n {state === \"error\" && resolvedError && (\n <Text\n data-testid=\"image-uploader__error\"\n color={alertText}\n fontSize={sizeStyles.errorFontSize}\n lineHeight={sizeStyles.errorLineHeight}\n {...(isWeb && { id: errorId, role: \"alert\" })}\n >\n {resolvedError}\n </Text>\n )}\n </Box>\n );\n }\n);\n\nImageUploader.displayName = \"ImageUploader\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport type { BoxProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredDiv = createFilteredElement(\"div\");\n\nconst StyledBox = styled(FilteredDiv)<BoxProps>`\n display: flex;\n box-sizing: border-box;\n background-color: ${(props) => props.backgroundColor || \"transparent\"};\n border-color: ${(props) => props.borderColor || \"transparent\"};\n border-width: ${(props) =>\n typeof props.borderWidth === \"number\"\n ? `${props.borderWidth}px`\n : props.borderWidth || 0};\n\n ${(props) =>\n props.borderBottomWidth !== undefined &&\n `\n border-bottom-width: ${typeof props.borderBottomWidth === \"number\" ? `${props.borderBottomWidth}px` : props.borderBottomWidth};\n border-bottom-color: ${props.borderBottomColor || props.borderColor || \"transparent\"};\n border-bottom-style: solid;\n `}\n ${(props) =>\n props.borderTopWidth !== undefined &&\n `\n border-top-width: ${typeof props.borderTopWidth === \"number\" ? `${props.borderTopWidth}px` : props.borderTopWidth};\n border-top-color: ${props.borderTopColor || props.borderColor || \"transparent\"};\n border-top-style: solid;\n `}\n ${(props) =>\n props.borderLeftWidth !== undefined &&\n `\n border-left-width: ${typeof props.borderLeftWidth === \"number\" ? `${props.borderLeftWidth}px` : props.borderLeftWidth};\n border-left-color: ${props.borderLeftColor || props.borderColor || \"transparent\"};\n border-left-style: solid;\n `}\n ${(props) =>\n props.borderRightWidth !== undefined &&\n `\n border-right-width: ${typeof props.borderRightWidth === \"number\" ? `${props.borderRightWidth}px` : props.borderRightWidth};\n border-right-color: ${props.borderRightColor || props.borderColor || \"transparent\"};\n border-right-style: solid;\n `}\n\n border-style: ${(props) =>\n props.borderStyle ||\n (props.borderWidth ||\n props.borderBottomWidth ||\n props.borderTopWidth ||\n props.borderLeftWidth ||\n props.borderRightWidth\n ? \"solid\"\n : \"none\")};\n border-radius: ${(props) =>\n typeof props.borderRadius === \"number\"\n ? `${props.borderRadius}px`\n : props.borderRadius || 0};\n height: ${(props) =>\n typeof props.height === \"number\"\n ? `${props.height}px`\n : props.height || \"auto\"};\n width: ${(props) =>\n typeof props.width === \"number\"\n ? `${props.width}px`\n : props.width || \"auto\"};\n min-width: ${(props) =>\n typeof props.minWidth === \"number\"\n ? `${props.minWidth}px`\n : props.minWidth || \"auto\"};\n min-height: ${(props) =>\n typeof props.minHeight === \"number\"\n ? `${props.minHeight}px`\n : props.minHeight || \"auto\"};\n max-width: ${(props) =>\n typeof props.maxWidth === \"number\"\n ? `${props.maxWidth}px`\n : props.maxWidth || \"none\"};\n max-height: ${(props) =>\n typeof props.maxHeight === \"number\"\n ? `${props.maxHeight}px`\n : props.maxHeight || \"none\"};\n\n padding: ${(props) =>\n typeof props.padding === \"number\"\n ? `${props.padding}px`\n : props.padding || 0};\n ${(props) =>\n props.paddingHorizontal &&\n `\n padding-left: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n padding-right: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n `}\n ${(props) =>\n props.paddingVertical &&\n `\n padding-top: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n padding-bottom: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n `}\n ${(props) =>\n props.paddingTop !== undefined &&\n `padding-top: ${typeof props.paddingTop === \"number\" ? `${props.paddingTop}px` : props.paddingTop};`}\n ${(props) =>\n props.paddingBottom !== undefined &&\n `padding-bottom: ${typeof props.paddingBottom === \"number\" ? `${props.paddingBottom}px` : props.paddingBottom};`}\n ${(props) =>\n props.paddingLeft !== undefined &&\n `padding-left: ${typeof props.paddingLeft === \"number\" ? `${props.paddingLeft}px` : props.paddingLeft};`}\n ${(props) =>\n props.paddingRight !== undefined &&\n `padding-right: ${typeof props.paddingRight === \"number\" ? `${props.paddingRight}px` : props.paddingRight};`}\n\n margin: ${(props) =>\n typeof props.margin === \"number\" ? `${props.margin}px` : props.margin || 0};\n ${(props) =>\n props.marginTop !== undefined &&\n `margin-top: ${typeof props.marginTop === \"number\" ? `${props.marginTop}px` : props.marginTop};`}\n ${(props) =>\n props.marginBottom !== undefined &&\n `margin-bottom: ${typeof props.marginBottom === \"number\" ? `${props.marginBottom}px` : props.marginBottom};`}\n ${(props) =>\n props.marginLeft !== undefined &&\n `margin-left: ${typeof props.marginLeft === \"number\" ? `${props.marginLeft}px` : props.marginLeft};`}\n ${(props) =>\n props.marginRight !== undefined &&\n `margin-right: ${typeof props.marginRight === \"number\" ? `${props.marginRight}px` : props.marginRight};`}\n\n flex-direction: ${(props) => props.flexDirection || \"column\"};\n flex-wrap: ${(props) => props.flexWrap || \"nowrap\"};\n align-items: ${(props) => props.alignItems || \"stretch\"};\n justify-content: ${(props) => props.justifyContent || \"flex-start\"};\n cursor: ${(props) =>\n props.cursor\n ? props.cursor\n : props.onClick || props.onPress\n ? \"pointer\"\n : \"inherit\"};\n position: ${(props) => props.position || \"static\"};\n top: ${(props) =>\n typeof props.top === \"number\" ? `${props.top}px` : props.top};\n bottom: ${(props) =>\n typeof props.bottom === \"number\" ? `${props.bottom}px` : props.bottom};\n left: ${(props) =>\n typeof props.left === \"number\" ? `${props.left}px` : props.left};\n right: ${(props) =>\n typeof props.right === \"number\" ? `${props.right}px` : props.right};\n flex: ${(props) => props.flex};\n flex-shrink: ${(props) => props.flexShrink ?? 1};\n gap: ${(props) =>\n typeof props.gap === \"number\" ? `${props.gap}px` : props.gap || 0};\n align-self: ${(props) => props.alignSelf || \"auto\"};\n overflow: ${(props) => props.overflow || \"visible\"};\n overflow-x: ${(props) => props.overflowX || \"visible\"};\n overflow-y: ${(props) => props.overflowY || \"visible\"};\n z-index: ${(props) => props.zIndex};\n opacity: ${(props) => (props.disabled ? 0.5 : 1)};\n pointer-events: ${(props) => (props.disabled ? \"none\" : \"auto\")};\n\n &:hover {\n ${(props) =>\n props.hoverStyle?.backgroundColor &&\n `background-color: ${props.hoverStyle.backgroundColor};`}\n ${(props) =>\n props.hoverStyle?.borderColor &&\n `border-color: ${props.hoverStyle.borderColor};`}\n }\n\n &:active {\n ${(props) =>\n props.pressStyle?.backgroundColor &&\n `background-color: ${props.pressStyle.backgroundColor};`}\n }\n`;\n\nexport const Box = React.forwardRef<\n HTMLDivElement | HTMLButtonElement,\n BoxProps\n>(\n (\n {\n children,\n onPress,\n onKeyDown,\n onKeyUp,\n role,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-current\": ariaCurrent,\n \"aria-disabled\": ariaDisabled,\n \"aria-live\": ariaLive,\n \"aria-busy\": ariaBusy,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-expanded\": ariaExpanded,\n \"aria-haspopup\": ariaHasPopup,\n \"aria-pressed\": ariaPressed,\n \"aria-controls\": ariaControls,\n tabIndex,\n as,\n src,\n alt,\n onError,\n onLoad,\n type,\n disabled,\n id,\n testID,\n \"data-testid\": dataTestId,\n ...props\n },\n ref\n ) => {\n // Handle as=\"img\" for rendering images with proper border-radius\n if (as === \"img\" && src) {\n return (\n <img\n src={src}\n alt={alt || \"\"}\n onError={onError}\n onLoad={onLoad}\n style={{\n display: \"block\",\n objectFit: \"cover\",\n width:\n typeof props.width === \"number\"\n ? `${props.width}px`\n : props.width,\n height:\n typeof props.height === \"number\"\n ? `${props.height}px`\n : props.height,\n borderRadius:\n typeof props.borderRadius === \"number\"\n ? `${props.borderRadius}px`\n : props.borderRadius,\n position: props.position,\n top: typeof props.top === \"number\" ? `${props.top}px` : props.top,\n left:\n typeof props.left === \"number\" ? `${props.left}px` : props.left,\n right:\n typeof props.right === \"number\"\n ? `${props.right}px`\n : props.right,\n bottom:\n typeof props.bottom === \"number\"\n ? `${props.bottom}px`\n : props.bottom,\n }}\n />\n );\n }\n\n return (\n <StyledBox\n ref={ref}\n elementType={as}\n id={id}\n type={as === \"button\" ? type || \"button\" : undefined}\n disabled={as === \"button\" ? disabled : undefined}\n onClick={onPress}\n onKeyDown={onKeyDown}\n onKeyUp={onKeyUp}\n role={role}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-current={ariaCurrent}\n aria-disabled={ariaDisabled}\n aria-busy={ariaBusy}\n aria-describedby={ariaDescribedBy}\n aria-expanded={ariaExpanded}\n aria-haspopup={ariaHasPopup}\n aria-pressed={ariaPressed}\n aria-controls={ariaControls}\n aria-live={ariaLive}\n tabIndex={tabIndex !== undefined ? tabIndex : undefined}\n data-testid={dataTestId || testID}\n {...props}\n >\n {children}\n </StyledBox>\n );\n }\n);\n\nBox.displayName = \"Box\";\n","import React from \"react\";\nimport isPropValid from \"@emotion/is-prop-valid\";\n\n// Props that @emotion/is-prop-valid incorrectly treats as valid HTML.\n// These are React Native or component-specific props that match\n// valid HTML patterns (on* event handlers, SVG attributes).\nexport const ADDITIONAL_BLOCKED_PROPS = new Set([\n // RN-only event handlers (pass isPropValid's on* pattern)\n \"onPress\",\n \"onChangeText\",\n \"onLayout\",\n \"onMoveShouldSetResponder\",\n \"onResponderGrant\",\n \"onResponderMove\",\n \"onResponderRelease\",\n \"onResponderTerminate\",\n // SVG attributes that pass isPropValid\n \"strokeWidth\",\n // CSS properties that pass isPropValid but are used as component props\n \"overflow\",\n \"cursor\",\n \"fontSize\",\n \"fontWeight\",\n \"fontFamily\",\n \"textDecoration\",\n]);\n\nfunction shouldForwardProp(key: string): boolean {\n if (ADDITIONAL_BLOCKED_PROPS.has(key)) return false;\n return isPropValid(key);\n}\n\n/**\n * Creates a React component that renders the given HTML tag\n * but filters out non-HTML props before they reach the DOM.\n *\n * Uses @emotion/is-prop-valid (same library styled-components v4\n * uses internally) to automatically block invalid HTML attributes,\n * plus a small blocklist for false positives (RN on* handlers, SVG attrs).\n *\n * Usage: `const FilteredDiv = createFilteredElement(\"div\");`\n * Then: `const StyledBox = styled(FilteredDiv)<BoxProps>\\`...\\`;`\n *\n * styled-components can still read ALL props for CSS interpolation,\n * but only valid HTML attributes are forwarded to the DOM element.\n */\nexport function createFilteredElement(defaultTag: string) {\n const Component = React.forwardRef<HTMLElement, Record<string, unknown>>(\n ({ children, elementType, ...props }, ref) => {\n const Tag = (elementType as string) || defaultTag;\n const htmlProps: Record<string, unknown> = {};\n for (const key of Object.keys(props)) {\n if (shouldForwardProp(key)) {\n htmlProps[key] = props[key];\n }\n }\n return React.createElement(\n Tag,\n { ref, ...htmlProps },\n children as React.ReactNode\n );\n }\n );\n Component.displayName = `Filtered(${defaultTag})`;\n return Component;\n}\n","function memoize(fn) {\n var cache = {};\n return function (arg) {\n if (cache[arg] === undefined) cache[arg] = fn(arg);\n return cache[arg];\n };\n}\n\nexport default memoize;\n","import memoize from '@emotion/memoize';\n\nvar reactPropsRegex = /^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|suppressHydrationWarning|valueLink|accept|acceptCharset|accessKey|action|allow|allowUserMedia|allowPaymentRequest|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|decoding|default|defer|dir|disabled|disablePictureInPicture|download|draggable|encType|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loading|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|inert|itemProp|itemScope|itemType|itemID|itemRef|on|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan|for|class|autofocus)|(([Dd][Aa][Tt][Aa]|[Aa][Rr][Ii][Aa]|x)-.*))$/; // https://esbench.com/bench/5bfee68a4cd7e6009ef61d23\n\nvar index = memoize(function (prop) {\n return reactPropsRegex.test(prop) || prop.charCodeAt(0) === 111\n /* o */\n && prop.charCodeAt(1) === 110\n /* n */\n && prop.charCodeAt(2) < 91;\n}\n/* Z+1 */\n);\n\nexport default index;\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredSpan = createFilteredElement(\"span\");\n\nconst StyledText = styled(FilteredSpan)<TextProps>`\n color: ${(props) => props.color || \"inherit\"};\n font-size: ${(props) =>\n typeof props.fontSize === \"number\"\n ? `${props.fontSize}px`\n : props.fontSize || \"inherit\"};\n font-weight: ${(props) => props.fontWeight || \"normal\"};\n font-family: ${(props) =>\n props.fontFamily ||\n '\"Aktiv Grotesk\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif'};\n line-height: ${(props) =>\n typeof props.lineHeight === \"number\"\n ? `${props.lineHeight}px`\n : props.lineHeight || \"inherit\"};\n white-space: ${(props) => props.whiteSpace || \"normal\"};\n text-align: ${(props) => props.textAlign || \"inherit\"};\n text-decoration: ${(props) => props.textDecoration || \"none\"};\n`;\n\nexport const Text: React.FC<TextProps> = ({\n style,\n className,\n id,\n role,\n numberOfLines: _numberOfLines,\n ...props\n}) => {\n return (\n <StyledText\n {...props}\n style={style}\n className={className}\n id={id}\n role={role}\n />\n );\n};\n","export * from \"./Box\";\nexport * from \"./Text\";\nexport * from \"./Spinner\";\nexport * from \"./Icon\";\nexport * from \"./Divider\";\nexport * from \"./Input\";\nexport * from \"./TextArea\";\nexport * from \"./LinearGradient\";\n\nexport const isWeb = true;\nexport const isNative = false;\n"],"mappings":"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","names":["import_react","import_react","React","styled","React","import_styled_components","import_jsx_runtime","styled","import_jsx_runtime","React"]}
package/web/index.mjs CHANGED
@@ -319,6 +319,8 @@ var ImageUploader = forwardRef(
319
319
  const fileInputRef = useRef(null);
320
320
  const isControlled = value !== void 0;
321
321
  const [internalPreview, setInternalPreview] = useState(null);
322
+ const [isAutoUploading, setIsAutoUploading] = useState(false);
323
+ const [autoError, setAutoError] = useState(null);
322
324
  const [isHover, setIsHover] = useState(false);
323
325
  const [isFocus, setIsFocus] = useState(false);
324
326
  const [isPreviewHover, setIsPreviewHover] = useState(false);
@@ -344,10 +346,11 @@ var ImageUploader = forwardRef(
344
346
  const alertBorder = theme.colors.control.alert.border;
345
347
  const alertText = theme.colors.content.alert.primary;
346
348
  const scrim = theme.colors.layer.scrim;
347
- const hasError = !!errorMessage;
349
+ const resolvedError = errorMessage || autoError;
350
+ const hasError = !!resolvedError;
348
351
  let state;
349
352
  if (disabled) state = "disable";
350
- else if (loading) state = "uploading";
353
+ else if (loading || isAutoUploading) state = "uploading";
351
354
  else if (hasError) state = "error";
352
355
  else if (preview)
353
356
  state = isPreviewHover || isHoverless ? "uploadedHover" : "uploaded";
@@ -355,25 +358,42 @@ var ImageUploader = forwardRef(
355
358
  else if (isHover) state = "hover";
356
359
  else state = "default";
357
360
  const emitFile = (img) => {
361
+ setAutoError(null);
358
362
  if (!isControlled) setInternalPreview(img.uri);
359
- onUpload?.(img);
360
363
  onChange?.({
361
364
  filename: img.name,
362
365
  url: img.uri
363
366
  });
367
+ const result = onUpload?.(img);
368
+ if (result && typeof result.then === "function") {
369
+ setIsAutoUploading(true);
370
+ Promise.resolve(result).then((uploaded) => {
371
+ let next = null;
372
+ if (typeof uploaded === "string") {
373
+ next = { url: uploaded };
374
+ } else if (uploaded && typeof uploaded === "object" && "url" in uploaded) {
375
+ next = uploaded;
376
+ }
377
+ if (next) {
378
+ if (!isControlled) setInternalPreview(next.url ?? null);
379
+ onChange?.(next);
380
+ }
381
+ }).catch((err) => {
382
+ setAutoError(err?.message || "Upload failed");
383
+ if (!isControlled) setInternalPreview(null);
384
+ onChange?.(null, err);
385
+ }).finally(() => setIsAutoUploading(false));
386
+ }
364
387
  };
365
388
  const handleWebFile = (file) => {
366
- if (!file.type.startsWith("image/")) return;
367
389
  const reader = new FileReader();
368
390
  reader.onload = (e) => {
369
391
  const uri = e.target?.result;
370
- emitFile({
371
- name: file.name,
372
- size: file.size,
373
- uri,
374
- mimeType: file.type,
375
- file
376
- });
392
+ const enriched = file;
393
+ enriched.uri = uri;
394
+ enriched.mimeType = file.type;
395
+ enriched.file = enriched;
396
+ emitFile(enriched);
377
397
  };
378
398
  reader.readAsDataURL(file);
379
399
  };
@@ -417,6 +437,7 @@ var ImageUploader = forwardRef(
417
437
  };
418
438
  const removeImage = (e) => {
419
439
  e?.stopPropagation?.();
440
+ setAutoError(null);
420
441
  if (!isControlled) setInternalPreview(null);
421
442
  setIsPreviewHover(false);
422
443
  onDelete?.();
@@ -460,6 +481,7 @@ var ImageUploader = forwardRef(
460
481
  break;
461
482
  }
462
483
  const rootGap = state === "error" ? sizeStyles.errorGap : 0;
484
+ const placeholderContent = state === "uploading" ? uploadingPlaceholder : placeholder;
463
485
  const renderInner = () => {
464
486
  if (state === "uploaded" || state === "uploadedHover") {
465
487
  return /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -520,7 +542,7 @@ var ImageUploader = forwardRef(
520
542
  ...isWeb && { "aria-hidden": "true" }
521
543
  }
522
544
  ) : /* @__PURE__ */ jsx3(Box, { ...isWeb && { "aria-hidden": "true" }, children: /* @__PURE__ */ jsx3(Image, { size: sizeStyles.iconSize, color: iconColor }) }),
523
- placeholder && /* @__PURE__ */ jsx3(
545
+ placeholderContent && (typeof placeholderContent === "string" ? /* @__PURE__ */ jsx3(
524
546
  Text,
525
547
  {
526
548
  "data-testid": "image-uploader__placeholder",
@@ -536,9 +558,9 @@ var ImageUploader = forwardRef(
536
558
  textOverflow: "ellipsis",
537
559
  whiteSpace: "nowrap"
538
560
  } : void 0,
539
- children: state === "uploading" ? uploadingPlaceholder : placeholder
561
+ children: placeholderContent
540
562
  }
541
- ),
563
+ ) : /* @__PURE__ */ jsx3(Box, { "data-testid": "image-uploader__placeholder", children: placeholderContent })),
542
564
  description && wideView && state !== "uploading" && state !== "error" && (typeof description === "string" ? /* @__PURE__ */ jsx3(
543
565
  Text,
544
566
  {
@@ -596,9 +618,9 @@ var ImageUploader = forwardRef(
596
618
  outline: "none",
597
619
  transition: "background-color 0.15s ease, border-color 0.15s ease"
598
620
  } : {};
599
- const buttonAriaLabel = preview ? `Remove image${value?.filename ? `: ${value.filename}` : ""}` : state === "uploading" ? uploadingPlaceholder : placeholder;
621
+ const buttonAriaLabel = preview ? `Remove image${value?.filename ? `: ${value.filename}` : ""}` : state === "uploading" ? typeof uploadingPlaceholder === "string" ? uploadingPlaceholder : "Uploading" : typeof placeholder === "string" ? placeholder : "Upload";
600
622
  const describedBy = [
601
- state === "error" && errorMessage ? errorId : null,
623
+ state === "error" && resolvedError ? errorId : null,
602
624
  description && wideView && state !== "uploading" && state !== "error" ? descriptionId : null
603
625
  ].filter(Boolean).join(" ") || void 0;
604
626
  return /* @__PURE__ */ jsxs(
@@ -609,7 +631,6 @@ var ImageUploader = forwardRef(
609
631
  gap: rootGap,
610
632
  alignItems: "flex-start",
611
633
  width: wideView ? "100%" : void 0,
612
- maxWidth: wideView ? sizeStyles.wideWidth : void 0,
613
634
  children: [
614
635
  isWeb && /* @__PURE__ */ jsx3(
615
636
  "input",
@@ -641,7 +662,6 @@ var ImageUploader = forwardRef(
641
662
  ...webOnlyHandlers,
642
663
  position: "relative",
643
664
  width: wideView ? "100%" : sizeStyles.box,
644
- maxWidth: wideView ? sizeStyles.wideWidth : void 0,
645
665
  height: sizeStyles.box,
646
666
  flexDirection: "column",
647
667
  alignItems: "center",
@@ -658,7 +678,7 @@ var ImageUploader = forwardRef(
658
678
  children: renderInner()
659
679
  }
660
680
  ),
661
- state === "error" && errorMessage && /* @__PURE__ */ jsx3(
681
+ state === "error" && resolvedError && /* @__PURE__ */ jsx3(
662
682
  Text,
663
683
  {
664
684
  "data-testid": "image-uploader__error",
@@ -666,7 +686,7 @@ var ImageUploader = forwardRef(
666
686
  fontSize: sizeStyles.errorFontSize,
667
687
  lineHeight: sizeStyles.errorLineHeight,
668
688
  ...isWeb && { id: errorId, role: "alert" },
669
- children: errorMessage
689
+ children: resolvedError
670
690
  }
671
691
  )
672
692
  ]