@snack-uikit/toaster 0.8.14-preview-abb5f7dc.0 → 0.8.14

package/dist/esm/components/ToastUpload/components/LoadingStatus/index.js

@@ -1 +0,0 @@
-export * from './LoadingStatus';

package/dist/esm/components/ToastUpload/components/LoadingStatus/styles.module.css

@@ -1,3 +0,0 @@
-.successIcon{
-  color:var(--sys-green-accent-default, #57b762);
-}

package/dist/esm/components/ToastUpload/constants.d.ts

@@ -1,16 +0,0 @@
-import { ProgressBarProps } from '@snack-uikit/progress-bar';
-import { ToastUploadStatus } from './types';
-export declare const TOAST_UPLOAD_STATUS: {
-    readonly Loading: "loading";
-    readonly Pause: "pause";
-    readonly Error: "error";
-    readonly Uploaded: "uploaded";
-    readonly ErrorUploaded: "errorUploaded";
-};
-export declare const TOAST_UPLOAD_ITEM_STATUS: {
-    readonly Loading: "loading";
-    readonly Pause: "pause";
-    readonly Error: "error";
-    readonly Uploaded: "uploaded";
-};
-export declare const progressBarAppearanceByStatus: Record<ToastUploadStatus, ProgressBarProps['appearance']>;

package/dist/esm/components/ToastUpload/constants.js

@@ -1,20 +0,0 @@
-export const TOAST_UPLOAD_STATUS = {
-    Loading: 'loading',
-    Pause: 'pause',
-    Error: 'error',
-    Uploaded: 'uploaded',
-    ErrorUploaded: 'errorUploaded',
-};
-export const TOAST_UPLOAD_ITEM_STATUS = {
-    Loading: 'loading',
-    Pause: 'pause',
-    Error: 'error',
-    Uploaded: 'uploaded',
-};
-export const progressBarAppearanceByStatus = {
-    pause: 'neutral',
-    loading: 'green',
-    uploaded: 'green',
-    errorUploaded: 'red',
-    error: 'red',
-};

package/dist/esm/components/ToastUpload/index.d.ts

@@ -1 +0,0 @@
-export * from './ToastUpload';

package/dist/esm/components/ToastUpload/index.js

@@ -1 +0,0 @@
-export * from './ToastUpload';

package/dist/esm/components/ToastUpload/styles.module.css

@@ -1,110 +0,0 @@
-.container{
-  padding:var(--space-toaster-toast-system-event-container-padding, 16px);
-  border-radius:var(--radius-toaster-toast-system-event-container, 16px);
-  gap:var(--space-toaster-toast-system-event-container-gap, 16px);
-  cursor:default;
-  position:relative;
-  overflow:hidden;
-  display:flex;
-  flex-direction:column;
-  box-sizing:border-box;
-  width:calc(var(--size-toaster-toast-system-event-container, 320px) - 2 * var(--space-toaster-toast-system-event-container-padding, 16px));
-  max-width:100%;
-  max-height:386px;
-  padding:var(--space-toaster-toast-system-event-container-padding, 16px) 0;
-  background-color:var(--sys-invert-neutral-background, #30303c);
-}
-.container[data-collapsed=false]{
-  gap:0;
-}
-
-.titleLine{
-  display:flex;
-  flex-direction:column;
-  padding:0 var(--space-toaster-toast-system-event-container-padding, 16px);
-}
-
-.titleLineBody{
-  gap:var(--space-toaster-toast-upload-body-gap, 16px);
-  display:flex;
-  align-items:center;
-}
-
-.title{
-  font-family:var(--sans-title-s-font-family, SB Sans Interface);
-  font-weight:var(--sans-title-s-font-weight, Semibold);
-  line-height:var(--sans-title-s-line-height, 20px);
-  font-size:var(--sans-title-s-font-size, 14px);
-  letter-spacing:var(--sans-title-s-letter-spacing, 0.15px);
-  paragraph-spacing:var(--sans-title-s-paragraph-spacing, 7.7px);
-  flex-grow:1;
-  color:var(--sys-invert-neutral-text-main, #e6e8ef);
-}
-
-.generalProgress{
-  gap:var(--space-toaster-toast-upload-general-progress-gap, 4px);
-  display:flex;
-  flex-direction:column;
-  align-self:stretch;
-}
-
-.statusLine{
-  gap:var(--space-toaster-toast-upload-status-line-gap, 8px);
-  display:flex;
-  align-items:center;
-}
-
-.statusWrap{
-  gap:var(--space-toaster-toast-upload-status-wrap-gap, 4px);
-  display:flex;
-  flex-grow:1;
-  align-items:center;
-}
-
-.description{
-  font-family:var(--sans-body-m-font-family, SB Sans Interface);
-  font-weight:var(--sans-body-m-font-weight, Regular);
-  line-height:var(--sans-body-m-line-height, 20px);
-  font-size:var(--sans-body-m-font-size, 14px);
-  letter-spacing:var(--sans-body-m-letter-spacing, 0.1px);
-  paragraph-spacing:var(--sans-body-m-paragraph-spacing, 7.7px);
-  color:var(--sys-invert-neutral-text-main, #e6e8ef);
-}
-.description[data-status=loading]{
-  color:var(--sys-invert-neutral-text-light, #8b8e9b);
-}
-.description[data-status=uploaded]{
-  color:var(--sys-invert-neutral-text-light, #8b8e9b);
-}
-
-.totalCounter{
-  font-family:var(--sans-body-m-font-family, SB Sans Interface);
-  font-weight:var(--sans-body-m-font-weight, Regular);
-  line-height:var(--sans-body-m-line-height, 20px);
-  font-size:var(--sans-body-m-font-size, 14px);
-  letter-spacing:var(--sans-body-m-letter-spacing, 0.1px);
-  paragraph-spacing:var(--sans-body-m-paragraph-spacing, 7.7px);
-  color:var(--sys-invert-neutral-text-support, #bec2cf);
-}
-
-.totalPercentage{
-  font-family:var(--sans-body-m-font-family, SB Sans Interface);
-  font-weight:var(--sans-body-m-font-weight, Regular);
-  line-height:var(--sans-body-m-line-height, 20px);
-  font-size:var(--sans-body-m-font-size, 14px);
-  letter-spacing:var(--sans-body-m-letter-spacing, 0.1px);
-  paragraph-spacing:var(--sans-body-m-paragraph-spacing, 7.7px);
-  color:var(--sys-invert-neutral-text-support, #bec2cf);
-}
-
-.list{
-  overflow:scroll;
-  display:flex;
-  flex-direction:column;
-  max-height:280px;
-  padding:0 var(--space-toaster-toast-system-event-container-padding, 16px);
-  transition:all 0.1s;
-}
-.list[data-collapsed=false]{
-  max-height:0;
-}

package/dist/esm/components/ToastUpload/types.d.ts

@@ -1,31 +0,0 @@
-import { MouseEvent } from 'react';
-import { ProgressBarProps } from '@snack-uikit/progress-bar';
-import { ValueOf } from '@snack-uikit/utils';
-import { TOAST_UPLOAD_ITEM_STATUS, TOAST_UPLOAD_STATUS } from './constants';
-export type ToastUploadStatus = ValueOf<typeof TOAST_UPLOAD_STATUS>;
-export type ToastUploadItemStatus = ValueOf<typeof TOAST_UPLOAD_ITEM_STATUS>;
-export type ToastUploadStateSubscription<T> = (subscription: (newValue: T) => void) => () => void;
-export type WithStateSubscription<T> = {
-    subscribeToState?: ToastUploadStateSubscription<Partial<T>>;
-} & T;
-export type ToastUploadItemLink = {
-    text: string;
-    href: string;
-    onClick?(e: MouseEvent<HTMLAnchorElement>): void;
-};
-export type UploadActions = {
-    onCancel?: () => void;
-    onPause?: () => void;
-    onRetry?: () => void;
-    onContinue?: () => void;
-};
-export type UploadItem = WithStateSubscription<{
-    id: string;
-    title: string;
-    status: ToastUploadItemStatus;
-    statusLabel: string;
-    progress: ProgressBarProps['progress'];
-    size: string;
-    actions: UploadActions;
-    link?: ToastUploadItemLink;
-}>;

package/dist/esm/components/ToastUpload/types.js

@@ -1 +0,0 @@
-export {};

package/dist/esm/components/ToastUpload/utils/formatPercent.d.ts

@@ -1 +0,0 @@
-export declare const formatPercent: (value: number) => string;

package/dist/esm/components/ToastUpload/utils/formatPercent.js

@@ -1 +0,0 @@
-export const formatPercent = (value) => `${value}%`;

package/dist/esm/components/ToastUpload/utils/index.d.ts

@@ -1 +0,0 @@
-export * from './formatPercent';

package/dist/esm/components/ToastUpload/utils/index.js

@@ -1 +0,0 @@
-export * from './formatPercent';

package/dist/esm/helperComponents/ButtonTextNeutral/ButtonTextNeutral.d.ts

@@ -1,7 +0,0 @@
-import { MouseEvent } from 'react';
-export type ButtonTextNeutralProps = {
-    label: string;
-    onClick(e: MouseEvent<HTMLButtonElement>): void;
-    critical?: boolean;
-};
-export declare function ButtonTextNeutral({ label, onClick, critical }: ButtonTextNeutralProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/helperComponents/ButtonTextNeutral/ButtonTextNeutral.js

@@ -1,5 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import styles from './styles.module.css';
-export function ButtonTextNeutral({ label, onClick, critical }) {
-    return (_jsx("button", { type: 'button', className: styles.buttonTextNeutral, onClick: onClick, "aria-label": 'action', "data-critical": critical || undefined, children: label }));
-}

package/dist/esm/helperComponents/ButtonTextNeutral/index.d.ts

@@ -1 +0,0 @@
-export * from './ButtonTextNeutral';

package/dist/esm/helperComponents/ButtonTextNeutral/index.js

@@ -1 +0,0 @@
-export * from './ButtonTextNeutral';

package/dist/esm/helperComponents/ButtonTextNeutral/styles.module.css

@@ -1,32 +0,0 @@
-.buttonTextNeutral{
-  font-family:var(--sans-body-m-font-family, SB Sans Interface);
-  font-weight:var(--sans-body-m-font-weight, Regular);
-  line-height:var(--sans-body-m-line-height, 20px);
-  font-size:var(--sans-body-m-font-size, 14px);
-  letter-spacing:var(--sans-body-m-letter-spacing, 0.1px);
-  paragraph-spacing:var(--sans-body-m-paragraph-spacing, 7.7px);
-  cursor:pointer;
-  display:flex;
-  align-items:center;
-  justify-content:center;
-  box-sizing:border-box;
-  margin:0;
-  padding:0;
-  color:var(--sys-invert-neutral-text-light, #8b8e9b);
-  background-color:transparent;
-  border:none;
-}
-.buttonTextNeutral:hover{
-  color:var(--sys-invert-neutral-text-main, #e6e8ef);
-}
-.buttonTextNeutral:focus, .buttonTextNeutral:active{
-  color:var(--sys-invert-neutral-accent-pressed, #aaaebd);
-}
-.buttonTextNeutral:focus-visible{
-  outline-width:var(--border-state-focus-s-border-width, 2px);
-  outline-style:var(--border-state-focus-s-border-style, solid);
-  outline-color:var(--border-state-focus-s-border-color, );
-  color:var(--sys-invert-neutral-text-main, #e6e8ef);
-  outline-color:var(--sys-available-on-complementary, #ffffff);
-  outline-offset:var(--spacing-state-focus-offset, 2px);
-}

package/src/components/ToastUpload/ToastUpload.tsx

@@ -1,111 +0,0 @@
-import cn from 'classnames';
-import { MouseEvent } from 'react';
-import { ToastContentProps as RtToastContentProps } from 'react-toastify';
-
-import { ChevronDownSVG, ChevronUpSVG, CrossSVG } from '@snack-uikit/icons';
-import { ProgressBar } from '@snack-uikit/progress-bar';
-import { extractSupportProps, WithSupportProps } from '@snack-uikit/utils';
-
-import { ButtonTextNeutral, ButtonTextNeutralProps } from '../../helperComponents/ButtonTextNeutral';
-import { ButtonIcon } from './components/ButtonIcon';
-import { FileItem } from './components/FileItem';
-import { LoadingStatus } from './components/LoadingStatus';
-import { progressBarAppearanceByStatus } from './constants';
-import styles from './styles.module.scss';
-import { ToastUploadStatus, UploadActions, UploadItem } from './types';
-import { formatPercent } from './utils';
-
-export type ToastUploadProps = Partial<RtToastContentProps> &
-  WithSupportProps<{
-    status: ToastUploadStatus;
-    title: string;
-    description: string;
-    totalProgressCounter: string;
-    totalProgressPercentage: number;
-    onCloseClick?(e: MouseEvent<HTMLButtonElement>, close?: () => void): void;
-    closable?: boolean;
-    className?: string;
-    items: UploadItem[];
-    collapsed: boolean;
-    onCollapsed: (collapsed: boolean) => void;
-    generalActions: UploadActions;
-    cancelButton?: ButtonTextNeutralProps;
-  }>;
-
-export function ToastUpload({
-  status,
-  title,
-  description,
-  totalProgressCounter,
-  totalProgressPercentage,
-  closeToast,
-  onCloseClick,
-  closable,
-  className,
-  items,
-  collapsed,
-  onCollapsed,
-  generalActions,
-  cancelButton,
-  ...rest
-}: ToastUploadProps) {
-  const handleCloseClick = (e: MouseEvent<HTMLButtonElement>) => {
-    e.stopPropagation();
-    onCloseClick ? onCloseClick(e, closeToast) : closeToast?.();
-  };
-
-  const handleCollapseClick = (e: MouseEvent<HTMLButtonElement>) => {
-    e.stopPropagation();
-    onCollapsed(!collapsed);
-  };
-
-  return (
-    <div className={cn(styles.container, className)} {...extractSupportProps(rest)} data-collapsed={collapsed}>
-      <div className={styles.titleLine}>
-        <div className={styles.titleLineBody}>
-          <div className={styles.title}>{title}</div>
-
-          {cancelButton && <ButtonTextNeutral {...cancelButton} />}
-
-          <ButtonIcon onClick={handleCollapseClick}>{collapsed ? <ChevronUpSVG /> : <ChevronDownSVG />}</ButtonIcon>
-
-          {closable && (
-            <ButtonIcon type='button' className={styles.buttonAction} onClick={handleCloseClick}>
-              <CrossSVG />
-            </ButtonIcon>
-          )}
-        </div>
-
-        <div className={styles.generalProgress}>
-          <div className={styles.statusLine}>
-            <div className={styles.statusWrap}>
-              <LoadingStatus status={status} actions={generalActions} />
-
-              <span className={styles.description} data-status={status}>
-                {description}
-              </span>
-            </div>
-
-            <span className={styles.totalCounter}>{totalProgressCounter}</span>
-
-            <span className={styles.totalPercentage}>{formatPercent(totalProgressPercentage)}</span>
-          </div>
-
-          {!collapsed && (
-            <ProgressBar
-              progress={totalProgressPercentage}
-              size='xs'
-              appearance={progressBarAppearanceByStatus[status]}
-            />
-          )}
-        </div>
-      </div>
-
-      <div className={styles.list} data-collapsed={collapsed}>
-        {items.map(item => (
-          <FileItem key={item.id} item={item} />
-        ))}
-      </div>
-    </div>
-  );
-}

package/src/components/ToastUpload/ToastUploadToaster.tsx

@@ -1,11 +0,0 @@
-import { useState } from 'react';
-
-import { ToastUpload, ToastUploadProps } from './ToastUpload';
-
-export type ToastUploadToasterProps = Omit<ToastUploadProps, 'collapsed' | 'onCollapsed'>;
-
-export function ToastUploadForToaster(props: ToastUploadToasterProps) {
-  const [collapsed, setCollapsed] = useState(true);
-
-  return <ToastUpload {...props} collapsed={collapsed} onCollapsed={setCollapsed} />;
-}

package/src/components/ToastUpload/components/ButtonIcon/ButtonIcon.tsx

@@ -1,10 +0,0 @@
-import cn from 'classnames';
-import { ButtonHTMLAttributes } from 'react';
-
-import styles from './styles.module.scss';
-
-export type ButtonIconProps = ButtonHTMLAttributes<HTMLButtonElement>;
-
-export function ButtonIcon({ className, ...props }: ButtonIconProps) {
-  return <button type='button' className={cn(styles.buttonIcon, className)} {...props}></button>;
-}

package/src/components/ToastUpload/components/ButtonIcon/index.ts

@@ -1 +0,0 @@
-export * from './ButtonIcon';

package/src/components/ToastUpload/components/ButtonIcon/styles.module.scss

@@ -1,45 +0,0 @@
-/* stylelint-disable scss/operator-no-newline-after */
-
-@use '@snack-uikit/figma-tokens/build/scss/components/styles-tokens-toaster-toasterSystemEvent';
-@use '@snack-uikit/figma-tokens/build/scss/components/styles-tokens-toaster-toasterUpload';
-@use '@snack-uikit/figma-tokens/build/scss/components/styles-tokens-element';
-@use '@snack-uikit/figma-tokens/build/scss/styles-theme-variables';
-
-.buttonIcon {
-  cursor: pointer;
-
-  display: flex;
-  align-items: center;
-  justify-content: center;
-
-  box-sizing: border-box;
-  margin: 0;
-  padding: 0;
-
-  color: styles-theme-variables.$sys-invert-neutral-text-light;
-
-  background-color: transparent;
-  border: none;
-
-  svg {
-    width: styles-tokens-element.$icon-s !important; /* stylelint-disable-line declaration-no-important */
-    height: styles-tokens-element.$icon-s !important; /* stylelint-disable-line declaration-no-important */
-  }
-
-  &:hover {
-    color: styles-theme-variables.$sys-invert-neutral-text-main;
-  }
-
-  &:focus,
-  &:active {
-    color: styles-theme-variables.$sys-invert-neutral-accent-pressed;
-  }
-
-  &:focus-visible {
-    @include styles-theme-variables.outline-var(styles-tokens-element.$container-focused-s);
-
-    color: styles-theme-variables.$sys-invert-neutral-text-main;
-    outline-color: styles-theme-variables.$sys-available-on-complementary;
-    outline-offset: styles-theme-variables.$spacing-state-focus-offset;
-  }
-}

package/src/components/ToastUpload/components/FileItem/FileItem.tsx

@@ -1,74 +0,0 @@
-import { useEffect, useState } from 'react';
-
-import { CrossSVG } from '@snack-uikit/icons';
-import { Link } from '@snack-uikit/link';
-import { ProgressBar } from '@snack-uikit/progress-bar';
-
-import { progressBarAppearanceByStatus } from '../../constants';
-import { UploadItem } from '../../types';
-import { formatPercent } from '../../utils';
-import { ButtonIcon } from '../ButtonIcon';
-import { LoadingStatus } from '../LoadingStatus';
-import styles from './styles.module.scss';
-
-export type FileItemProps = { item: UploadItem };
-
-export function FileItem({ item: initItem }: FileItemProps) {
-  const [item, setItem] = useState(initItem);
-
-  const showLink = item.status === 'uploaded' && item.link;
-
-  useEffect(() => {
-    if (initItem.subscribeToState) {
-      return initItem.subscribeToState(newValue => setItem(prev => ({ ...prev, ...newValue })));
-    }
-
-    return setItem(initItem);
-  }, [initItem]);
-
-  return (
-    <div className={styles.fileLine} key={item.id}>
-      <div className={styles.fileHeadLine}>
-        <span className={styles.fileTitle}>{item.title}</span>
-
-        {showLink && (
-          <Link
-            text={item.link?.text}
-            href={item.link?.href}
-            size='m'
-            truncateVariant='end'
-            onClick={item.link?.onClick}
-            appearance='invert-neutral'
-            textMode='accent'
-          />
-        )}
-
-        {!showLink && (
-          <ButtonIcon onClick={item.actions.onCancel}>
-            <CrossSVG />
-          </ButtonIcon>
-        )}
-      </div>
-
-      <ProgressBar progress={item.progress} size='xs' appearance={progressBarAppearanceByStatus[item.status]} />
-
-      <div className={styles.fileStatusLine}>
-        <div className={styles.fileStatusWrap}>
-          <LoadingStatus status={item.status} actions={item.actions} />
-
-          <span className={styles.fileStatusDescription} data-status={item.status}>
-            {item.statusLabel}
-          </span>
-        </div>
-
-        <span className={styles.fileSize} data-status={item.status}>
-          {item.size}
-        </span>
-
-        <span className={styles.fileStatusPercentage} data-status={item.status}>
-          {formatPercent(item.progress)}
-        </span>
-      </div>
-    </div>
-  );
-}

package/src/components/ToastUpload/components/FileItem/index.ts

@@ -1 +0,0 @@
-export * from './FileItem';

package/src/components/ToastUpload/components/FileItem/styles.module.scss

@@ -1,93 +0,0 @@
-/* stylelint-disable scss/operator-no-newline-after */
-
-@use '@snack-uikit/figma-tokens/build/scss/components/styles-tokens-toaster-toasterSystemEvent';
-@use '@snack-uikit/figma-tokens/build/scss/components/styles-tokens-toaster-toasterUpload';
-@use '@snack-uikit/figma-tokens/build/scss/components/styles-tokens-element';
-@use '@snack-uikit/figma-tokens/build/scss/styles-theme-variables';
-
-.fileLine {
-  @include styles-theme-variables.composite-var(
-    styles-tokens-toaster-toasterUpload.$toaster-upload-file-line-container
-  );
-
-  display: flex;
-  flex-direction: column;
-}
-
-.fileHeadLine {
-  @include styles-theme-variables.composite-var(
-    styles-tokens-toaster-toasterUpload.$toaster-upload-file-line-headline
-  );
-
-  display: flex;
-  align-items: center;
-}
-
-.fileTitle {
-  @include styles-theme-variables.composite-var(styles-theme-variables.$sans-body-s);
-
-  flex-grow: 1;
-  color: styles-theme-variables.$sys-invert-neutral-text-main;
-}
-
-
-.fileStatusLine {
-  @include styles-theme-variables.composite-var(
-    styles-tokens-toaster-toasterUpload.$toaster-upload-status-line-container
-  );
-
-  display: flex;
-  align-items: center;
-}
-
-.fileStatusWrap {
-  @include styles-theme-variables.composite-var(
-    styles-tokens-toaster-toasterUpload.$toaster-upload-status-line-status-wrap
-  );
-
-  display: flex;
-  flex-grow: 1;
-  align-items: center;
-}
-
-.fileStatusDescription {
-  @include styles-theme-variables.composite-var(styles-theme-variables.$sans-body-s);
-
-  color: styles-theme-variables.$sys-invert-neutral-text-main;
-
-  &[data-status='loading'] {
-    color: styles-theme-variables.$sys-invert-neutral-text-disabled;
-  }
-
-  &[data-status='uploaded'] {
-    color: styles-theme-variables.$sys-invert-neutral-text-disabled;
-  }
-}
-
-.fileSize {
-  @include styles-theme-variables.composite-var(styles-theme-variables.$sans-body-s);
-
-  color: styles-theme-variables.$sys-invert-neutral-text-disabled;
-
-  &[data-status='loading'] {
-    color: styles-theme-variables.$sys-invert-neutral-text-main;
-  }
-
-  &[data-status='uploaded'] {
-    color: styles-theme-variables.$sys-invert-neutral-text-main;
-  }
-}
-
-.fileStatusPercentage {
-  @include styles-theme-variables.composite-var(styles-theme-variables.$sans-body-s);
-
-  color: styles-theme-variables.$sys-invert-neutral-text-disabled;
-
-  &[data-status='loading'] {
-    color: styles-theme-variables.$sys-invert-neutral-text-main;
-  }
-
-  &[data-status='uploaded'] {
-    color: styles-theme-variables.$sys-invert-neutral-text-main;
-  }
-}

package/src/components/ToastUpload/components/LoadingStatus/LoadingStatus.tsx

@@ -1,38 +0,0 @@
-import { CheckFilledSVG, PauseSVG, PlaySVG, UpdateSVG } from '@snack-uikit/icons';
-
-import { ToastUploadStatus, UploadActions } from '../../types';
-import { ButtonIcon } from '../ButtonIcon';
-import styles from './styles.module.scss';
-
-export type LoadingStatusProps = {
-  status: ToastUploadStatus;
-  actions: UploadActions;
-};
-
-export function LoadingStatus({ status, actions }: LoadingStatusProps) {
-  if (status === 'loading') {
-    return (
-      <ButtonIcon onClick={actions.onPause}>
-        <PauseSVG />
-      </ButtonIcon>
-    );
-  }
-
-  if (status === 'pause') {
-    return (
-      <ButtonIcon onClick={actions.onContinue}>
-        <PlaySVG />
-      </ButtonIcon>
-    );
-  }
-
-  if (status === 'uploaded') {
-    return <CheckFilledSVG className={styles.successIcon} />;
-  }
-
-  return (
-    <ButtonIcon onClick={actions.onRetry}>
-      <UpdateSVG />
-    </ButtonIcon>
-  );
-}

package/src/components/ToastUpload/components/LoadingStatus/index.ts

@@ -1 +0,0 @@
-export * from './LoadingStatus';

package/src/components/ToastUpload/components/LoadingStatus/styles.module.scss

@@ -1,8 +0,0 @@
-/* stylelint-disable scss/operator-no-newline-after */
-
-@use '@snack-uikit/figma-tokens/build/scss/styles-theme-variables';
-
-
-.successIcon {
-  color: styles-theme-variables.$sys-green-accent-default;
-}