@veritone-ce/design-system 2.8.14-next.2.0 → 2.8.14

package/dist/esm/Drawer/components.js

@@ -0,0 +1,259 @@
+'use strict';
+'use client';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import * as React from 'react';
+import { useTransitionStyles, useMergeRefs, FloatingPortal, FloatingFocusManager } from '@floating-ui/react';
+import { RemoveScroll } from 'react-remove-scroll';
+import css from './styles.module.scss.js';
+import { useDrawer, DrawerContext, useDrawerContext } from './state.js';
+import { cx } from '../styles/cx.js';
+import '../styles/defaultThemeOptions.js';
+import '@capsizecss/core';
+import 'color2k';
+import { defaultThemeCssVariableUsages } from '../styles/defaultTheme.js';
+import '../styles/provider.client.js';
+import '../styles/css-vars.js';
+import Button from '../Button/index.js';
+import Typography from '../Typography/index.js';
+import IconButton from '../IconButton/index.js';
+import { CloseIcon } from '../Icon/internal.js';
+
+const Drawer = React.forwardRef(function Drawer2({
+  placement = "end",
+  children,
+  portalEl,
+  style,
+  className,
+  overlay = true,
+  strategy = "fixed",
+  overlayStyle,
+  overlayClassName,
+  lockScroll = true,
+  disableAutoFocus = false,
+  "data-testid": dataTestId,
+  ...options
+}, propRef) {
+  const drawer = useDrawer({
+    ...options,
+    dismissEnabled: overlay
+  });
+  const { isMounted: overlayIsMounted, styles: overlayTransitionStyles } = useTransitionStyles(drawer.context, {
+    duration: 225,
+    initial: {
+      opacity: 0
+    }
+  });
+  const { isMounted: innerIsMounted, styles: innerTransitionStyles } = useTransitionStyles(drawer.context, {
+    duration: 225,
+    initial: {
+      transform: `translateX(${placement === "start" ? "-66px" : "66px"})`
+    }
+  });
+  const ref = useMergeRefs([drawer.context.refs.setFloating, propRef]);
+  const strategyCn = css[`drawer-overlay-strategy-${strategy}`];
+  const placementCn = css[`drawer-overlay-placement-${placement}`];
+  let content = null;
+  if (overlayIsMounted || innerIsMounted) {
+    content = /* @__PURE__ */ jsx(FloatingPortal, { root: portalEl, children: /* @__PURE__ */ jsx(RemoveScroll, { enabled: overlay && lockScroll, children: /* @__PURE__ */ jsx(
+      "div",
+      {
+        style: {
+          ...overlayTransitionStyles,
+          ...overlayStyle
+        },
+        className: cx(
+          css["drawer-overlay"],
+          strategyCn,
+          placementCn,
+          overlay && css["drawer-overlay-enabled"],
+          overlayClassName
+        ),
+        children: /* @__PURE__ */ jsx(
+          "div",
+          {
+            ref,
+            ...drawer.getFloatingProps(),
+            "aria-labelledby": drawer.labelId,
+            "aria-describedby": drawer.descriptionId,
+            className: css["drawer-wrapper"],
+            children: /* @__PURE__ */ jsx(
+              FloatingFocusManager,
+              {
+                context: drawer.context,
+                disabled: disableAutoFocus,
+                children: /* @__PURE__ */ jsx(
+                  "div",
+                  {
+                    "data-testid": dataTestId,
+                    className: cx(css["drawer"], className),
+                    style: {
+                      ...innerTransitionStyles,
+                      ...style
+                    },
+                    children
+                  }
+                )
+              }
+            )
+          }
+        )
+      }
+    ) }) });
+  }
+  return /* @__PURE__ */ jsx(DrawerContext.Provider, { value: drawer, children: content });
+});
+const DrawerStart = React.forwardRef(
+  function DrawerStart2({ children, ...props }, ref) {
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        ...props,
+        className: cx(css["drawer-start"], props.className),
+        children
+      }
+    );
+  }
+);
+const DrawerContent = React.forwardRef(function DrawerContent2({ children, ...props }, ref) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ...props,
+      ref,
+      className: cx(css["drawer-content"], props.className),
+      children
+    }
+  );
+});
+const DrawerEnd = React.forwardRef(
+  function DrawerEnd2({ children, ...props }, ref) {
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        ...props,
+        className: cx(css["drawer-end"], props.className),
+        children
+      }
+    );
+  }
+);
+const DrawerTitle = React.forwardRef(function DrawerTitle2({
+  children,
+  actions,
+  container = "text",
+  palette = defaultThemeCssVariableUsages.palette.brand["1"].base,
+  ...props
+}, ref) {
+  const { setLabelId } = useDrawerContext();
+  const id = React.useId();
+  React.useLayoutEffect(() => {
+    setLabelId(id);
+    return () => setLabelId(void 0);
+  }, [id, setLabelId]);
+  return /* @__PURE__ */ jsxs(
+    DrawerStart,
+    {
+      "data-container": container,
+      style: {
+        ...{
+          "--vt-ce-drawer-palette-surface": palette.surface,
+          "--vt-ce-drawer-palette-on": palette.on
+        }
+      },
+      className: css["drawer-title-container"],
+      children: [
+        /* @__PURE__ */ jsx(
+          Typography,
+          {
+            variant: "title",
+            ref,
+            id,
+            color: "inherit",
+            leadingTrim: true,
+            ...props,
+            className: cx(css["drawer-title"], props.className),
+            children
+          }
+        ),
+        actions && /* @__PURE__ */ jsx("span", { className: css["drawer-title-actions"], children: actions })
+      ]
+    }
+  );
+});
+const DrawerTypography = React.forwardRef(function DrawerTypography2({ children, ...props }, ref) {
+  return /* @__PURE__ */ jsx(
+    Typography,
+    {
+      variant: "paragraph2",
+      color: "primary",
+      ...props,
+      ref,
+      className: cx(css["drawer-typography"], props.className),
+      children
+    }
+  );
+});
+const DrawerDescription = React.forwardRef(function DrawerDescription2({ children, ...props }, ref) {
+  const { setDescriptionId } = useDrawerContext();
+  const id = React.useId();
+  React.useLayoutEffect(() => {
+    setDescriptionId(id);
+    return () => setDescriptionId(void 0);
+  }, [id, setDescriptionId]);
+  return /* @__PURE__ */ jsx(
+    DrawerTypography,
+    {
+      variant: "paragraph2",
+      color: "primary",
+      ...props,
+      ref,
+      id,
+      children
+    }
+  );
+});
+const DrawerActions = React.forwardRef(function DrawerActions2({ children, ...props }, ref) {
+  return /* @__PURE__ */ jsx(DrawerEnd, { children: /* @__PURE__ */ jsx(
+    "div",
+    {
+      ...props,
+      ref,
+      className: cx(css["drawer-actions"], props.className),
+      children
+    }
+  ) });
+});
+const DrawerCloseButton = React.forwardRef(function DrawerCloseButton2(props, ref) {
+  const { dismiss } = useDrawerContext();
+  return /* @__PURE__ */ jsx(
+    Button,
+    {
+      variant: "tertiary",
+      ...props,
+      ref,
+      onClick: (e) => {
+        dismiss();
+        props.onClick?.(e);
+      }
+    }
+  );
+});
+const DrawerCloseIconButton = React.forwardRef(function DrawerCloseIconButton2({ children = /* @__PURE__ */ jsx(CloseIcon, {}), ...props }, ref) {
+  const { dismiss } = useDrawerContext();
+  return /* @__PURE__ */ jsx(
+    IconButton,
+    {
+      ...props,
+      ref,
+      onClick: (e) => {
+        dismiss();
+        props.onClick?.(e);
+      },
+      children
+    }
+  );
+});
+
+export { DrawerActions, DrawerCloseButton, DrawerCloseIconButton, DrawerContent, DrawerDescription, DrawerEnd, DrawerStart, DrawerTitle, DrawerTypography, Drawer as default };

package/dist/esm/Drawer/factory.js

@@ -0,0 +1,14 @@
+'use strict';
+import { jsx } from 'react/jsx-runtime';
+import { forwardRef } from 'react';
+import Drawer from './components.js';
+
+function createDrawerComponent(overrides) {
+  return forwardRef(
+    function ScopedDrawer(props, ref) {
+      return /* @__PURE__ */ jsx(Drawer, { ...overrides, ref, ...props });
+    }
+  );
+}
+
+export { createDrawerComponent };

package/dist/esm/Drawer/state.js

@@ -0,0 +1,47 @@
+'use strict';
+'use client';
+import * as React from 'react';
+import { useFloating, useDismiss, useRole, useInteractions } from '@floating-ui/react';
+
+function useDrawer({
+  open,
+  dismissEnabled,
+  onDismiss: dismissDrawer
+}) {
+  const [labelId, setLabelId] = React.useState();
+  const [descriptionId, setDescriptionId] = React.useState();
+  const data = useFloating({
+    open,
+    onOpenChange: (newOpen) => !newOpen && dismissDrawer()
+  });
+  const context = data.context;
+  const dismiss = useDismiss(context, {
+    enabled: dismissEnabled,
+    outsidePressEvent: "mousedown"
+  });
+  const role = useRole(context);
+  const interactions = useInteractions([dismiss, role]);
+  return React.useMemo(
+    () => ({
+      open,
+      dismiss: dismissDrawer,
+      ...interactions,
+      ...data,
+      labelId,
+      descriptionId,
+      setLabelId,
+      setDescriptionId
+    }),
+    [open, dismissDrawer, interactions, data, labelId, descriptionId]
+  );
+}
+const DrawerContext = React.createContext(null);
+const useDrawerContext = () => {
+  const context = React.useContext(DrawerContext);
+  if (context == null) {
+    throw new Error("Drawer components must be wrapped in <Drawer />");
+  }
+  return context;
+};
+
+export { DrawerContext, useDrawer, useDrawerContext };

package/dist/esm/Drawer/styles.module.scss.js

@@ -0,0 +1,3 @@
+var css = {"drawer-overlay":"vt_ce_Drawer_drawer-overlay__c6c8eeed","drawer-overlay-enabled":"vt_ce_Drawer_drawer-overlay-enabled__93462945","drawer-overlay-strategy-fixed":"vt_ce_Drawer_drawer-overlay-strategy-fixed__0b78d0d8","drawer-overlay-strategy-absolute":"vt_ce_Drawer_drawer-overlay-strategy-absolute__3181a6d4","drawer-overlay-placement-start":"vt_ce_Drawer_drawer-overlay-placement-start__cfb6e519","drawer":"vt_ce_Drawer_drawer__b597d43d","drawer-overlay-placement-end":"vt_ce_Drawer_drawer-overlay-placement-end__50fb02c0","drawer-wrapper":"vt_ce_Drawer_drawer-wrapper__481c177b","drawer-start":"vt_ce_Drawer_drawer-start__4fe52d7b","drawer-end":"vt_ce_Drawer_drawer-end__421c6a83","drawer-content":"vt_ce_Drawer_drawer-content__dbd7e7c6","drawer-title-container":"vt_ce_Drawer_drawer-title-container__4e14c630","drawer-title":"vt_ce_Drawer_drawer-title__89950b53","drawer-title-actions":"vt_ce_Drawer_drawer-title-actions__12843076","drawer-typography":"vt_ce_Drawer_drawer-typography__4996d261","drawer-actions":"vt_ce_Drawer_drawer-actions__f712137a"};
+
+export { css as default };

package/dist/esm/ErrorBoundary/index.js

@@ -0,0 +1,52 @@
+'use strict';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import React__default from 'react';
+import { ErrorOutline } from '@mui/icons-material';
+import styles from './styles.module.scss.js';
+import Typography from '../Typography/index.js';
+import { cx } from '../styles/cx.js';
+import '../styles/defaultThemeOptions.js';
+import '@capsizecss/core';
+import 'color2k';
+import '../styles/defaultTheme.js';
+import '../styles/provider.client.js';
+import '../styles/css-vars.js';
+
+class ErrorBoundary extends React__default.Component {
+  constructor(props) {
+    super(props);
+    this.state = { hasError: false, error: null, info: null };
+  }
+  static getDerivedStateFromError(error) {
+    return { hasError: true, error };
+  }
+  componentDidCatch(error, info) {
+    this.setState({ hasError: true, error, info });
+  }
+  render() {
+    if (this.state.hasError || this.props.error) {
+      return this.props.fallback ?? /* @__PURE__ */ jsx(
+        "div",
+        {
+          style: this.props.style,
+          className: cx(styles.fallbackContainer, this.props.className),
+          children: /* @__PURE__ */ jsxs("div", { className: styles.customMessageContainer, children: [
+            /* @__PURE__ */ jsx(
+              ErrorOutline,
+              {
+                fontSize: "large",
+                sx: {
+                  color: (theme) => theme.palette.error.main
+                }
+              }
+            ),
+            /* @__PURE__ */ jsx(Typography, { variant: "h4", children: this.props.message ?? "Error" })
+          ] })
+        }
+      );
+    }
+    return this.props.children;
+  }
+}
+
+export { ErrorBoundary as default };

package/dist/esm/ErrorBoundary/styles.module.scss.js

@@ -0,0 +1,3 @@
+var styles = {"fallbackContainer":"vt_ce_ErrorBoundary_fallbackContainer__bafaad44","customMessageContainer":"vt_ce_ErrorBoundary_customMessageContainer__97495086"};
+
+export { styles as default };

package/dist/esm/FileUploader/controlled.js

@@ -0,0 +1,304 @@
+'use strict';
+'use client';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useMemo } from 'react';
+import { CloudUploadOutlined, DeleteOutline, CheckOutlined, WarningOutlined } from '@mui/icons-material';
+import { useDropzone } from 'react-dropzone';
+import { cx } from '../styles/cx.js';
+import '../styles/defaultThemeOptions.js';
+import '@capsizecss/core';
+import 'color2k';
+import { defaultThemeCssVariableUsages } from '../styles/defaultTheme.js';
+import '../styles/provider.client.js';
+import '../styles/css-vars.js';
+import Typography from '../Typography/index.js';
+import IconButton from '../IconButton/index.js';
+import { adaptMuiSvgIcon } from '../Icon/wrappers.js';
+import '../Icon/factory.js';
+import styles from './styles.module.scss.js';
+import LinearProgress from '../unstable/LinearProgress/index.js';
+
+const CloudUploadOutlinedIcon = adaptMuiSvgIcon(CloudUploadOutlined);
+const DeleteOutlineIcon = adaptMuiSvgIcon(DeleteOutline);
+const CheckOutlineIcon = adaptMuiSvgIcon(CheckOutlined);
+const WarningOutlineIcon = adaptMuiSvgIcon(WarningOutlined);
+var FILE_STATES = /* @__PURE__ */ ((FILE_STATES2) => {
+  FILE_STATES2["PENDING"] = "pending";
+  FILE_STATES2["ADDED"] = "added";
+  FILE_STATES2["UPLOADING"] = "uploading";
+  FILE_STATES2["CANCELLED"] = "cancelled";
+  FILE_STATES2["FINISHED"] = "finished";
+  FILE_STATES2["ERROR"] = "error";
+  FILE_STATES2["ABORTED"] = "aborted";
+  return FILE_STATES2;
+})(FILE_STATES || {});
+function resolveFileState(state) {
+  if (state === void 0 || state === null) {
+    return "added" /* ADDED */;
+  }
+  if (typeof state === "string") {
+    switch (state) {
+      case "idle":
+        return "added" /* ADDED */;
+      case "pending":
+        return "pending" /* PENDING */;
+      case "success":
+        return "finished" /* FINISHED */;
+      case "error":
+        return "error" /* ERROR */;
+      default:
+        return state;
+    }
+  } else {
+    if (state.error) {
+      return "error" /* ERROR */;
+    }
+    if (state.loading) {
+      return "uploading" /* UPLOADING */;
+    }
+    if (state.called) {
+      return "finished" /* FINISHED */;
+    }
+    return "added" /* ADDED */;
+  }
+}
+function resolveFileStates(fileStates) {
+  if (fileStates === void 0 || fileStates === null || fileStates.length === 0) {
+    return ["added" /* ADDED */, 0];
+  }
+  let somePending = false;
+  let someUploading = false;
+  let allAreFinished = true;
+  let complete = 0;
+  const formatReturn = (state) => {
+    return [state, complete / fileStates.length * 100];
+  };
+  for (const fileState of fileStates) {
+    if (fileState === "finished" /* FINISHED */) {
+      complete++;
+      continue;
+    }
+    allAreFinished = false;
+    switch (fileState) {
+      case "pending" /* PENDING */:
+        somePending = true;
+        break;
+      case "uploading" /* UPLOADING */:
+        someUploading = true;
+        break;
+      case "cancelled" /* CANCELLED */:
+        return formatReturn("cancelled" /* CANCELLED */);
+      case "error" /* ERROR */:
+        complete++;
+        return formatReturn("error" /* ERROR */);
+      case "aborted" /* ABORTED */:
+        return formatReturn("aborted" /* ABORTED */);
+    }
+  }
+  if (allAreFinished) {
+    return formatReturn("finished" /* FINISHED */);
+  }
+  if (someUploading) {
+    return formatReturn("uploading" /* UPLOADING */);
+  }
+  if (somePending) {
+    return formatReturn("pending" /* PENDING */);
+  }
+  return formatReturn("added" /* ADDED */);
+}
+function UploadDropzone({
+  accept,
+  multiple,
+  disabled = false,
+  mini,
+  state: propsState,
+  onDrop,
+  className,
+  ...containerProps
+}) {
+  const [state, progress] = useMemo(
+    () => resolveFileStates(
+      Array.isArray(propsState) ? propsState.map((s) => resolveFileState(s)) : [resolveFileState(propsState)]
+    ),
+    [propsState]
+  );
+  const { getRootProps, getInputProps } = useDropzone({
+    disabled,
+    multiple,
+    accept,
+    onDrop: (files, fileRejections, event) => {
+      onDrop(files, fileRejections, event);
+    }
+  });
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ...getRootProps(),
+      "data-testid": "dropzone",
+      ...containerProps,
+      "data-disabled": disabled,
+      "data-mini": mini,
+      className: cx(styles.dropzone, className),
+      children: [
+        /* @__PURE__ */ jsx("input", { type: "file", className: styles.input, ...getInputProps() }),
+        /* @__PURE__ */ jsxs("span", { className: styles.uploadIconContainer, children: [
+          state === "error" /* ERROR */ ? /* @__PURE__ */ jsx(WarningOutlineIcon, { className: styles.icon }) : state === "finished" /* FINISHED */ ? /* @__PURE__ */ jsx(CheckOutlineIcon, { className: styles.icon }) : /* @__PURE__ */ jsx(CloudUploadOutlinedIcon, { className: styles.icon }),
+          /* @__PURE__ */ jsxs(
+            "svg",
+            {
+              viewBox: "0 0 250 250",
+              className: styles.uploadProgress,
+              style: {
+                ...{
+                  "--vt-ce-uploader-progress": progress,
+                  // FIXME
+                  "--vt-ce-uploader-error": state === "error" /* ERROR */
+                }
+              },
+              children: [
+                /* @__PURE__ */ jsx("circle", { className: styles.uploadProgressBg }),
+                progress > 0 && /* @__PURE__ */ jsx(
+                  "circle",
+                  {
+                    "data-success": state === "finished" /* FINISHED */,
+                    "data-error": state === "error" /* ERROR */,
+                    className: styles.uploadProgressFg
+                  }
+                )
+              ]
+            }
+          )
+        ] }),
+        !mini && /* @__PURE__ */ jsxs("div", { children: [
+          /* @__PURE__ */ jsxs("span", { children: [
+            /* @__PURE__ */ jsx(
+              Typography,
+              {
+                as: "span",
+                variant: "paragraph2",
+                className: styles.browseLabel,
+                children: "Browse files"
+              }
+            ),
+            /* @__PURE__ */ jsxs(Typography, { as: "span", variant: "paragraph2", children: [
+              " ",
+              "from your computer or drag and drop here"
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs(
+            Typography,
+            {
+              as: "p",
+              variant: "paragraph3",
+              className: styles.fileFormatLabel,
+              children: [
+                "Supported File Formats: ",
+                Object.values(accept).flat().join(", ")
+              ]
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+function UploadListContainer({
+  className,
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx("div", { ...props, className: cx(styles.uploadsContainer, className), children: /* @__PURE__ */ jsx("table", { className: styles.uploads, children: /* @__PURE__ */ jsx("tbody", { children }) }) });
+}
+function UploadList({
+  items,
+  onAbort,
+  ...containerProps
+}) {
+  return /* @__PURE__ */ jsx(UploadListContainer, { ...containerProps, children: items.map((item, index) => /* @__PURE__ */ jsx(
+    UploadListItem,
+    {
+      item,
+      onAbort: onAbort && ((e) => {
+        onAbort(item, e);
+      })
+    },
+    index
+  )) });
+}
+function UploadListItem({
+  item,
+  onAbort
+}) {
+  const state = useMemo(() => resolveFileState(item.state), [item.state]);
+  const isAborted = state === "aborted" /* ABORTED */;
+  const isSuccess = state === "finished" /* FINISHED */;
+  const isError = state === "error" /* ERROR */;
+  const isFinished = !["pending" /* PENDING */, "uploading" /* UPLOADING */].includes(
+    state
+  );
+  const progress = useMemo(() => {
+    if (item.progress !== void 0) {
+      return item.progress;
+    }
+    switch (state) {
+      case "added" /* ADDED */:
+        return 0;
+      case "pending" /* PENDING */:
+        return 0;
+      case "error" /* ERROR */:
+        return 100;
+      case "finished" /* FINISHED */:
+        return 100;
+    }
+    return 0;
+  }, [item.progress, state]);
+  return /* @__PURE__ */ jsxs("tr", { "data-testid": "file-item", className: styles.lineItem, children: [
+    /* @__PURE__ */ jsxs("td", { children: [
+      /* @__PURE__ */ jsx(Typography, { as: "p", variant: "label", className: styles.label, children: item.file.name }),
+      /* @__PURE__ */ jsx(
+        LinearProgress,
+        {
+          value: progress,
+          variant: state === "uploading" /* UPLOADING */ ? "indeterminate" : "determinate",
+          color: (isSuccess ? defaultThemeCssVariableUsages.palette.indicator.success.base : isError ? defaultThemeCssVariableUsages.palette.indicator.error.base : defaultThemeCssVariableUsages.palette.action.primary.base).surface
+        }
+      ),
+      isError && /* @__PURE__ */ jsx(
+        Typography,
+        {
+          as: "p",
+          variant: "paragraph3",
+          className: styles.feedbackText,
+          children: "An error occurred."
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx("td", { className: styles.deleteBtn, children: isFinished ? isSuccess ? /* @__PURE__ */ jsx(
+      IconButton,
+      {
+        "data-testid": "file-item-success-button",
+        "aria-label": "success",
+        disabled: true,
+        children: /* @__PURE__ */ jsx(CheckOutlineIcon, {})
+      }
+    ) : isError ? /* @__PURE__ */ jsx(
+      IconButton,
+      {
+        "data-testid": "file-item-error-button",
+        "aria-label": "error",
+        disabled: true,
+        children: /* @__PURE__ */ jsx(WarningOutlineIcon, {})
+      }
+    ) : !isAborted && onAbort !== void 0 ? /* @__PURE__ */ jsx(
+      IconButton,
+      {
+        "data-testid": "file-item-delete-button",
+        "aria-label": "delete",
+        onClick: onAbort,
+        children: /* @__PURE__ */ jsx(DeleteOutlineIcon, {})
+      }
+    ) : null : null })
+  ] });
+}
+
+export { FILE_STATES, UploadDropzone, UploadList, UploadListContainer, UploadListItem };

package/dist/esm/FileUploader/styles.module.scss.js

@@ -0,0 +1,3 @@
+var styles = {"dropzone":"vt_ce_FileUploader_dropzone__67a7b572","browseLabel":"vt_ce_FileUploader_browseLabel__6ff61262","input":"vt_ce_FileUploader_input__bc9e7afd","fileFormatLabel":"vt_ce_FileUploader_fileFormatLabel__9046e635","uploadIconContainer":"vt_ce_FileUploader_uploadIconContainer__c1ade8fa","icon":"vt_ce_FileUploader_icon__b16f9b3b","uploadProgress":"vt_ce_FileUploader_uploadProgress__550e3a26","uploadProgressBg":"vt_ce_FileUploader_uploadProgressBg__1c53c2dc","uploadProgressFg":"vt_ce_FileUploader_uploadProgressFg__e908d658","uploadsContainer":"vt_ce_FileUploader_uploadsContainer__0b908e6a","uploads":"vt_ce_FileUploader_uploads__4eaf83ba","lineItem":"vt_ce_FileUploader_lineItem__49e6d4e7","deleteBtn":"vt_ce_FileUploader_deleteBtn__3bd64874","label":"vt_ce_FileUploader_label__f468b603","feedbackText":"vt_ce_FileUploader_feedbackText__dac0b241"};
+
+export { styles as default };