@react-spectrum/progress 3.7.22 → 3.8.0

package/dist/progress.fc185de6.css

@@ -1,288 +0,0 @@
-.yaf-qa_i18nFontFamily {
-  font-synthesis: weight;
-  font-family: adobe-clean, Source Sans Pro, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Ubuntu, Trebuchet MS, Lucida Grande, sans-serif;
-}
-
-.yaf-qa_i18nFontFamily:lang(ar) {
-  font-family: myriad-arabic, adobe-clean, Source Sans Pro, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Ubuntu, Trebuchet MS, Lucida Grande, sans-serif;
-}
-
-.yaf-qa_i18nFontFamily:lang(he) {
-  font-family: myriad-hebrew, adobe-clean, Source Sans Pro, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Ubuntu, Trebuchet MS, Lucida Grande, sans-serif;
-}
-
-.yaf-qa_i18nFontFamily:lang(zh) {
-  font-family: adobe-clean-han-traditional, source-han-traditional, MingLiu, Heiti TC Light, sans-serif;
-}
-
-.yaf-qa_i18nFontFamily:lang(zh-Hans) {
-  font-family: adobe-clean-han-simplified-c, source-han-simplified-c, SimSun, Heiti SC Light, sans-serif;
-}
-
-.yaf-qa_i18nFontFamily:lang(zh-Hant) {
-  font-family: adobe-clean-han-traditional, source-han-traditional, MingLiu, Microsoft JhengHei UI, Microsoft JhengHei, Heiti TC Light, sans-serif;
-}
-
-.yaf-qa_i18nFontFamily:lang(zh-SG), .yaf-qa_i18nFontFamily:lang(zh-CN) {
-  font-family: adobe-clean-han-simplified-c, source-han-simplified-c, SimSun, Heiti SC Light, sans-serif;
-}
-
-.yaf-qa_i18nFontFamily:lang(ko) {
-  font-family: adobe-clean-han-korean, source-han-korean, Malgun Gothic, Apple Gothic, sans-serif;
-}
-
-.yaf-qa_i18nFontFamily:lang(ja) {
-  font-family: adobe-clean-han-japanese, Hiragino Kaku Gothic ProN, ヒラギノ角ゴ ProN W3, Osaka, YuGothic, Yu Gothic, メイリオ, Meiryo, ＭＳ Ｐゴシック, MS PGothic, sans-serif;
-}
-
-.yaf-qa_spectrum-FocusRing-ring {
-  --spectrum-focus-ring-border-radius: var(--spectrum-textfield-border-radius, var(--spectrum-alias-border-radius-regular));
-  --spectrum-focus-ring-gap: var(--spectrum-alias-input-focusring-gap);
-  --spectrum-focus-ring-size: var(--spectrum-alias-input-focusring-size);
-  --spectrum-focus-ring-border-size: 0px;
-  --spectrum-focus-ring-color: var(--spectrum-high-contrast-focus-ring-color, var(--spectrum-alias-focus-ring-color, var(--spectrum-alias-focus-color)));
-}
-
-.yaf-qa_spectrum-FocusRing-ring:after {
-  border-radius: calc(var(--spectrum-focus-ring-border-radius)  + var(--spectrum-focus-ring-gap));
-  content: "";
-  margin: calc(-1 * var(--spectrum-focus-ring-border-size));
-  pointer-events: none;
-  transition: box-shadow var(--spectrum-global-animation-duration-100, .13s) ease-out, margin var(--spectrum-global-animation-duration-100, .13s) ease-out;
-  display: block;
-  position: absolute;
-  inset: 0;
-}
-
-.yaf-qa_spectrum-FocusRing.yaf-qa_focus-ring:after {
-  margin: calc(var(--spectrum-focus-ring-gap) * -1 - var(--spectrum-focus-ring-border-size));
-  box-shadow: 0 0 0 var(--spectrum-focus-ring-size) var(--spectrum-focus-ring-color);
-}
-
-.yaf-qa_spectrum-FocusRing--quiet:after {
-  border-radius: 0;
-}
-
-.yaf-qa_spectrum-FocusRing--quiet.yaf-qa_focus-ring:after {
-  margin: 0 0 calc(var(--spectrum-focus-ring-gap) * -1 - var(--spectrum-focus-ring-border-size)) 0;
-  box-shadow: 0 var(--spectrum-focus-ring-size) 0 var(--spectrum-focus-ring-color);
-}
-
-@media (forced-colors: active) {
-  .yaf-qa_spectrum-FocusRing, .yaf-qa_spectrum-FocusRing-ring, .yaf-qa_spectrum-FocusRing--quiet {
-    --spectrum-high-contrast-focus-ring-color: Highlight;
-  }
-
-  :is(.yaf-qa_spectrum-FocusRing, .yaf-qa_spectrum-FocusRing-ring, .yaf-qa_spectrum-FocusRing--quiet):after {
-    forced-color-adjust: none;
-  }
-}
-
-.yaf-qa_spectrum-BarLoader {
-  min-inline-size: var(--spectrum-global-dimension-static-size-600, 48px);
-  inline-size: var(--spectrum-barloader-large-width, var(--spectrum-global-dimension-size-2400));
-  vertical-align: top;
-  isolation: isolate;
-  flex-flow: wrap;
-  justify-content: space-between;
-  align-items: center;
-  display: inline-flex;
-  position: relative;
-}
-
-.yaf-qa_spectrum-BarLoader.yaf-qa_spectrum-BarLoader--indeterminate {
-  max-inline-size: var(--spectrum-barloader-large-width, var(--spectrum-global-dimension-size-2400));
-}
-
-.yaf-qa_spectrum-BarLoader.yaf-qa_spectrum-BarLoader--indeterminate.yaf-qa_spectrum-BarLoader--sideLabel .yaf-qa_spectrum-BarLoader-track {
-  max-inline-size: var(--spectrum-barloader-large-width, var(--spectrum-global-dimension-size-2400));
-  inline-size: 100%;
-}
-
-.yaf-qa_spectrum-BarLoader-track {
-  min-inline-size: var(--spectrum-global-dimension-static-size-600, 48px);
-  inline-size: 100%;
-  height: var(--spectrum-barloader-large-height, var(--spectrum-global-dimension-size-75));
-  border-radius: var(--spectrum-barloader-large-border-radius);
-  z-index: 1;
-  overflow: hidden;
-}
-
-.yaf-qa_spectrum-BarLoader-fill {
-  height: var(--spectrum-barloader-large-height, var(--spectrum-global-dimension-size-75));
-  border: none;
-  transition: width 1s;
-}
-
-.yaf-qa_spectrum-BarLoader-label, .yaf-qa_spectrum-BarLoader-percentage {
-  font-size: var(--spectrum-fieldlabel-text-size, var(--spectrum-global-dimension-font-size-75));
-  font-weight: var(--spectrum-fieldlabel-text-font-weight, var(--spectrum-global-font-weight-regular));
-  line-height: var(--spectrum-fieldlabel-text-line-height, var(--spectrum-global-font-line-height-small));
-  text-align: start;
-  margin-bottom: var(--spectrum-barloader-large-label-gap-y, var(--spectrum-global-dimension-size-115));
-}
-
-.yaf-qa_spectrum-BarLoader-label {
-  flex: 1;
-}
-
-.yaf-qa_spectrum-BarLoader-percentage {
-  align-self: flex-start;
-  margin-inline-start: var(--spectrum-barloader-small-label-gap-x, var(--spectrum-global-dimension-size-150));
-}
-
-.yaf-qa_spectrum-BarLoader--sideLabel {
-  flex-flow: row;
-  justify-content: space-between;
-  min-inline-size: fit-content;
-  display: inline-flex;
-}
-
-.yaf-qa_spectrum-BarLoader--sideLabel .yaf-qa_spectrum-BarLoader-track {
-  inline-size: inherit;
-}
-
-.yaf-qa_spectrum-BarLoader--sideLabel .yaf-qa_spectrum-BarLoader-label {
-  margin-inline-end: var(--spectrum-barloader-large-label-gap-x, var(--spectrum-global-dimension-size-150));
-  margin-bottom: 0;
-}
-
-.yaf-qa_spectrum-BarLoader--sideLabel .yaf-qa_spectrum-BarLoader-percentage {
-  text-align: end;
-  margin-inline-start: var(--spectrum-barloader-large-label-gap-x, var(--spectrum-global-dimension-size-150));
-  order: 3;
-  margin-bottom: 0;
-}
-
-.yaf-qa_spectrum-BarLoader--small {
-  min-inline-size: var(--spectrum-global-dimension-static-size-600, 48px);
-}
-
-.yaf-qa_spectrum-BarLoader--small .yaf-qa_spectrum-BarLoader-fill {
-  height: var(--spectrum-barloader-small-height, var(--spectrum-global-dimension-size-50));
-}
-
-.yaf-qa_spectrum-BarLoader--small .yaf-qa_spectrum-BarLoader-track {
-  height: var(--spectrum-barloader-small-height, var(--spectrum-global-dimension-size-50));
-  border-radius: var(--spectrum-barloader-small-border-radius);
-}
-
-.yaf-qa_spectrum-BarLoader--indeterminate .yaf-qa_spectrum-BarLoader-fill {
-  inline-size: var(--spectrum-barloader-large-indeterminate-fill-width, var(--spectrum-global-dimension-size-1700));
-  animation-duration: var(--spectrum-barloader-large-indeterminate-duration, var(--spectrum-global-animation-duration-2000));
-  animation-iteration-count: infinite;
-  animation-timing-function: var(--spectrum-barloader-large-indeterminate-animation-ease, var(--spectrum-global-animation-ease-in-out));
-  will-change: transform;
-  position: relative;
-}
-
-[dir="ltr"] :is(.yaf-qa_spectrum-BarLoader--indeterminate .yaf-qa_spectrum-BarLoader-fill) {
-  animation-name: yaf-qa_indeterminate-loop-ltr;
-}
-
-[dir="rtl"] :is(.yaf-qa_spectrum-BarLoader--indeterminate .yaf-qa_spectrum-BarLoader-fill) {
-  animation-name: yaf-qa_indeterminate-loop-rtl;
-}
-
-@keyframes yaf-qa_indeterminate-loop-ltr {
-  from {
-    transform: translate(calc(var(--spectrum-barloader-large-indeterminate-fill-width, var(--spectrum-global-dimension-size-1700)) * -1));
-  }
-
-  to {
-    transform: translate(var(--spectrum-barloader-large-width, var(--spectrum-global-dimension-size-2400)));
-  }
-}
-
-@keyframes yaf-qa_indeterminate-loop-rtl {
-  from {
-    transform: translate(var(--spectrum-barloader-large-width, var(--spectrum-global-dimension-size-2400)));
-  }
-
-  to {
-    transform: translate(calc(var(--spectrum-barloader-large-width, var(--spectrum-global-dimension-size-2400)) * -1));
-  }
-}
-
-.yaf-qa_spectrum-BarLoader {
-  --spectrum-barloader-large-track-fill-color: var(--spectrum-accent-color-900);
-  --spectrum-barloader-static-black-track-color: #00000040;
-  --spectrum-barloader-static-black-fill-color: var(--spectrum-global-color-static-black, #000);
-}
-
-.yaf-qa_spectrum-BarLoader .yaf-qa_spectrum-BarLoader-fill {
-  background: var(--spectrum-barloader-large-track-fill-color, var(--spectrum-global-color-blue-500));
-}
-
-.yaf-qa_spectrum-BarLoader .yaf-qa_spectrum-BarLoader-track {
-  background-color: var(--spectrum-barloader-large-track-color, var(--spectrum-alias-track-color-default));
-}
-
-.yaf-qa_spectrum-BarLoader.yaf-qa_spectrum-BarLoader--overBackground .yaf-qa_spectrum-BarLoader-fill {
-  background: var(--spectrum-barloader-large-over-background-track-fill-color, var(--spectrum-global-color-static-white));
-}
-
-.yaf-qa_spectrum-BarLoader.yaf-qa_spectrum-BarLoader--overBackground .yaf-qa_spectrum-BarLoader-label, .yaf-qa_spectrum-BarLoader.yaf-qa_spectrum-BarLoader--overBackground .yaf-qa_spectrum-BarLoader-percentage {
-  color: var(--spectrum-barloader-large-over-background-track-fill-color, var(--spectrum-global-color-static-white));
-}
-
-.yaf-qa_spectrum-BarLoader.yaf-qa_spectrum-BarLoader--overBackground .yaf-qa_spectrum-BarLoader-track {
-  background-color: var(--spectrum-barloader-large-over-background-track-color, var(--spectrum-alias-track-color-over-background));
-}
-
-.yaf-qa_spectrum-BarLoader.yaf-qa_spectrum-BarLoader--staticWhite .yaf-qa_spectrum-BarLoader-fill {
-  background: var(--spectrum-barloader-large-over-background-track-fill-color, var(--spectrum-global-color-static-white));
-}
-
-.yaf-qa_spectrum-BarLoader.yaf-qa_spectrum-BarLoader--staticWhite .yaf-qa_spectrum-BarLoader-label, .yaf-qa_spectrum-BarLoader.yaf-qa_spectrum-BarLoader--staticWhite .yaf-qa_spectrum-BarLoader-percentage {
-  color: var(--spectrum-barloader-large-over-background-track-fill-color, var(--spectrum-global-color-static-white));
-}
-
-.yaf-qa_spectrum-BarLoader.yaf-qa_spectrum-BarLoader--staticWhite .yaf-qa_spectrum-BarLoader-track {
-  background-color: var(--spectrum-barloader-large-over-background-track-color, var(--spectrum-alias-track-color-over-background));
-}
-
-.yaf-qa_spectrum-BarLoader.yaf-qa_spectrum-BarLoader--staticBlack .yaf-qa_spectrum-BarLoader-track {
-  background-color: var(--spectrum-barloader-static-black-track-color);
-}
-
-.yaf-qa_spectrum-BarLoader.yaf-qa_spectrum-BarLoader--staticBlack .yaf-qa_spectrum-BarLoader-label, .yaf-qa_spectrum-BarLoader.yaf-qa_spectrum-BarLoader--staticBlack .yaf-qa_spectrum-BarLoader-percentage {
-  color: var(--spectrum-barloader-static-black-fill-color);
-}
-
-.yaf-qa_spectrum-BarLoader.yaf-qa_spectrum-BarLoader--staticBlack .yaf-qa_spectrum-BarLoader-fill {
-  background: var(--spectrum-barloader-static-black-fill-color);
-}
-
-.yaf-qa_spectrum-BarLoader.yaf-qa_is-positive .yaf-qa_spectrum-BarLoader-fill {
-  background: var(--spectrum-meter-large-track-color-positive, var(--spectrum-semantic-positive-color-status));
-}
-
-.yaf-qa_spectrum-BarLoader.yaf-qa_is-warning .yaf-qa_spectrum-BarLoader-fill {
-  background: var(--spectrum-meter-large-track-color-warning, var(--spectrum-semantic-notice-color-status));
-}
-
-.yaf-qa_spectrum-BarLoader.yaf-qa_is-critical .yaf-qa_spectrum-BarLoader-fill {
-  background: var(--spectrum-meter-large-track-color-critical, var(--spectrum-semantic-negative-color-status));
-}
-
-.yaf-qa_spectrum-BarLoader-label, .yaf-qa_spectrum-BarLoader-percentage {
-  color: var(--spectrum-fieldlabel-text-color, var(--spectrum-alias-label-text-color));
-}
-
-@media (forced-colors: active) {
-  .yaf-qa_spectrum-BarLoader-track {
-    forced-color-adjust: none;
-    --spectrum-barloader-large-track-fill-color: ButtonText;
-    --spectrum-barloader-large-over-background-track-fill-color: ButtonText;
-    --spectrum-barloader-large-over-background-track-color: ButtonFace;
-    --spectrum-barloader-static-black-track-color: ButtonFace;
-    --spectrum-barloader-static-black-fill-color: ButtonText;
-    --spectrum-meter-large-track-color-positive: ButtonText;
-    --spectrum-meter-large-track-color-warning: ButtonText;
-    --spectrum-meter-large-track-color-critical: ButtonText;
-    --spectrum-barloader-large-track-color: ButtonFace;
-    border: 1px solid buttontext;
-  }
-}
-/*# sourceMappingURL=progress.fc185de6.css.map */

package/dist/progress.fc185de6.css.map

@@ -1 +0,0 @@
-{"mappings":"AA4DA;;;;;AAIE;;;;AAIA;;;;AAIA;;;;AAIA;;;;AAIA;;;;AAIA;;;;AAQA;;;;AAIA;;;;AAKF;;;;;;;;AAOE;;;;;;;;;;;AAqBE;;;;;AAQF;;;;AAKE;;;;;AAOJ;EACE;;;;EAIE;;;;;AAMJ;;;;;;;;;;;;AAWE;;;;AAKE;;;;;AAOJ;;;;;;;;;AAUA;;;;;;AAOA;;;;;;;;AASA;;;;AAIA;;;;;AAKA;;;;;;;AAME;;;;AAIA;;;;;AAIA;;;;;;;AAQF;;;;AAGE;;;;AAIA;;;;;AAMF;;;;;;;;;AAQE;;;;AAGA;;;;AAKF;;;;;;;;;;AASA;;;;;;;;;;AAqBA;;;;;;AAKE;;;;AAIA;;;;AAME;;;;AAIA;;;;AAKA;;;;AATA;;;;AAIA;;;;AAKA;;;;AAMA;;;;AAIA;;;;AAKA;;;;AAKA;;;;AAKA;;;;AAKA;;;;AAMJ;;;;AAeA;EACE","sources":["packages/@adobe/spectrum-css-temp/components/barloader/vars.css"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n@import './index.css';\n@import './skin.css';\n"],"names":[],"version":3,"file":"progress.fc185de6.css.map"}

package/dist/types.d.ts

@@ -1,22 +0,0 @@
-import { ProgressBarProps, SpectrumProgressBarBaseProps, SpectrumProgressBarProps, SpectrumProgressCircleProps } from "@react-types/progress";
-import React, { HTMLAttributes } from "react";
-import { DOMRefValue } from "@react-types/shared";
-interface ProgressBarBaseProps extends SpectrumProgressBarBaseProps, ProgressBarProps {
-    barClassName?: string;
-    barProps?: HTMLAttributes<HTMLDivElement>;
-    labelProps?: HTMLAttributes<HTMLLabelElement>;
-}
-export const ProgressBarBase: React.ForwardRefExoticComponent<ProgressBarBaseProps & React.RefAttributes<DOMRefValue<HTMLDivElement>>>;
-/**
- * ProgressBars show the progression of a system operation: downloading, uploading, processing, etc., in a visual way.
- * They can represent either determinate or indeterminate progress.
- */
-export const ProgressBar: React.ForwardRefExoticComponent<SpectrumProgressBarProps & React.RefAttributes<DOMRefValue<HTMLDivElement>>>;
-/**
- * ProgressCircles show the progression of a system operation such as downloading, uploading, or processing, in a visual way.
- * They can represent determinate or indeterminate progress.
- */
-export const ProgressCircle: React.ForwardRefExoticComponent<SpectrumProgressCircleProps & React.RefAttributes<DOMRefValue<HTMLDivElement>>>;
-export type { SpectrumProgressBarProps, SpectrumProgressCircleProps } from '@react-types/progress';
-
-//# sourceMappingURL=types.d.ts.map

package/dist/types.d.ts.map

@@ -1 +0,0 @@
-{"mappings":";;;AAmBA,8BAA+B,SAAQ,4BAA4B,EAAE,gBAAgB;IACnF,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,eAAe,cAAc,CAAC,CAAC;IAC1C,UAAU,CAAC,EAAE,eAAe,gBAAgB,CAAC,CAAA;CAC9C;AAGD,OAAO,MAAM,yHAwEX,CAAC;AC9EH;;;GAGG;AACH,OAAO,MAAM,yHAwBX,CAAC;AC3BH;;;GAGG;AACH,OAAO,MAAM,+HAgFX,CAAC;ACxFH,YAAY,EAAC,wBAAwB,EAAE,2BAA2B,EAAC,MAAM,uBAAuB,CAAC","sources":["packages/@react-spectrum/progress/src/packages/@react-spectrum/progress/src/ProgressBarBase.tsx","packages/@react-spectrum/progress/src/packages/@react-spectrum/progress/src/ProgressBar.tsx","packages/@react-spectrum/progress/src/packages/@react-spectrum/progress/src/ProgressCircle.tsx","packages/@react-spectrum/progress/src/packages/@react-spectrum/progress/src/index.ts","packages/@react-spectrum/progress/src/index.ts"],"sourcesContent":[null,null,null,null,"/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n/// <reference types=\"css-module-types\" />\n\nexport {ProgressBar} from './ProgressBar';\nexport {ProgressCircle} from './ProgressCircle';\nexport {ProgressBarBase} from './ProgressBarBase';\nexport type {SpectrumProgressBarProps, SpectrumProgressCircleProps} from '@react-types/progress';\n"],"names":[],"version":3,"file":"types.d.ts.map"}

package/src/ProgressBar.tsx

@@ -1,49 +0,0 @@
-/*
- * Copyright 2020 Adobe. All rights reserved.
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License. You may obtain a copy
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software distributed under
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
- * OF ANY KIND, either express or implied. See the License for the specific language
- * governing permissions and limitations under the License.
- */
-
-import {classNames} from '@react-spectrum/utils';
-import {DOMRef} from '@react-types/shared';
-import {ProgressBarBase} from './ProgressBarBase';
-import React from 'react';
-import {SpectrumProgressBarProps} from '@react-types/progress';
-import styles from '@adobe/spectrum-css-temp/components/barloader/vars.css';
-import {useProgressBar} from '@react-aria/progress';
-
-/**
- * ProgressBars show the progression of a system operation: downloading, uploading, processing, etc., in a visual way.
- * They can represent either determinate or indeterminate progress.
- */
-export const ProgressBar = React.forwardRef(function ProgressBar(props: SpectrumProgressBarProps, ref: DOMRef<HTMLDivElement>) {
-  let {staticColor, variant, ...otherProps} = props;
-  const {
-    progressBarProps,
-    labelProps
-  } = useProgressBar(props);
-
-  return (
-    <ProgressBarBase
-      {...otherProps}
-      ref={ref}
-      barProps={progressBarProps}
-      labelProps={labelProps}
-      barClassName={
-        classNames(
-          styles,
-          {
-            'spectrum-BarLoader--overBackground': variant === 'overBackground',
-            'spectrum-BarLoader--staticWhite': staticColor === 'white',
-            'spectrum-BarLoader--staticBlack': staticColor === 'black'
-          }
-        )
-      } />
-  );
-});

package/src/ProgressBarBase.tsx

@@ -1,99 +0,0 @@
-/*
- * Copyright 2020 Adobe. All rights reserved.
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License. You may obtain a copy
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software distributed under
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
- * OF ANY KIND, either express or implied. See the License for the specific language
- * governing permissions and limitations under the License.
- */
-
-import {clamp} from '@react-aria/utils';
-import {classNames, useDOMRef, useStyleProps} from '@react-spectrum/utils';
-import {DOMRef} from '@react-types/shared';
-import {ProgressBarProps, SpectrumProgressBarBaseProps} from '@react-types/progress';
-import React, {CSSProperties, HTMLAttributes} from 'react';
-import styles from '@adobe/spectrum-css-temp/components/barloader/vars.css';
-
-interface ProgressBarBaseProps extends SpectrumProgressBarBaseProps, ProgressBarProps {
-  barClassName?: string,
-  barProps?: HTMLAttributes<HTMLDivElement>,
-  labelProps?: HTMLAttributes<HTMLLabelElement>
-}
-
-// Base ProgressBar component shared with Meter.
-export const ProgressBarBase = React.forwardRef(function ProgressBarBase(props: ProgressBarBaseProps, ref: DOMRef<HTMLDivElement>) {
-  let {
-    value = 0,
-    minValue = 0,
-    maxValue = 100,
-    size = 'L',
-    label,
-    barClassName,
-    showValueLabel = !!label,
-    labelPosition = 'top',
-    isIndeterminate = false,
-    barProps,
-    labelProps,
-    'aria-label': ariaLabel,
-    'aria-labelledby': ariaLabelledby,
-    ...otherProps
-  } = props;
-  let domRef = useDOMRef(ref);
-  let {styleProps} = useStyleProps(otherProps);
-
-  value = clamp(value, minValue, maxValue);
-
-  let barStyle: CSSProperties = {};
-  if (!isIndeterminate) {
-    let percentage = (value - minValue) / (maxValue - minValue);
-    barStyle.width = `${Math.round(percentage * 100)}%`;
-  }
-
-  // Ideally this should be in useProgressBar, but children
-  // are not supported in ProgressCircle which shares that hook...
-  if (!label && !ariaLabel && !ariaLabelledby && process.env.NODE_ENV !== 'production') {
-    console.warn('If you do not provide a visible label via children, you must specify an aria-label or aria-labelledby attribute for accessibility');
-  }
-  // use inline style for fit-content because cssnano is too smart for us and will strip out the -moz prefix in css files
-  return (
-    <div
-      {...barProps}
-      ref={domRef}
-      className={
-        classNames(
-          styles,
-          'spectrum-BarLoader',
-          {
-            'spectrum-BarLoader--small': size === 'S',
-            'spectrum-BarLoader--large': size === 'L',
-            'spectrum-BarLoader--indeterminate': isIndeterminate,
-            'spectrum-BarLoader--sideLabel': labelPosition === 'side'
-          },
-          barClassName,
-          styleProps.className
-        )
-      }
-      style={{minWidth: '-moz-fit-content', ...styleProps.style}}>
-      {label &&
-        <span
-          {...labelProps}
-          className={classNames(styles, 'spectrum-BarLoader-label')}>
-            {label}
-        </span>
-      }
-      {showValueLabel && barProps && 
-        <div className={classNames(styles, 'spectrum-BarLoader-percentage')}>
-          {barProps['aria-valuetext']}
-        </div>
-      }
-      <div className={classNames(styles, 'spectrum-BarLoader-track')}>
-        <div
-          className={classNames(styles, 'spectrum-BarLoader-fill')}
-          style={barStyle} />
-      </div>
-    </div>
-  );
-});

package/src/ProgressCircle.tsx

@@ -1,106 +0,0 @@
-/*
- * Copyright 2020 Adobe. All rights reserved.
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License. You may obtain a copy
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software distributed under
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
- * OF ANY KIND, either express or implied. See the License for the specific language
- * governing permissions and limitations under the License.
- */
-
-import {clamp} from '@react-aria/utils';
-import {classNames, useDOMRef, useStyleProps} from '@react-spectrum/utils';
-import {DOMRef} from '@react-types/shared';
-import React, {CSSProperties} from 'react';
-import {SpectrumProgressCircleProps} from '@react-types/progress';
-import styles from '@adobe/spectrum-css-temp/components/circleloader/vars.css';
-import {useProgressBar} from '@react-aria/progress';
-
-
-/**
- * ProgressCircles show the progression of a system operation such as downloading, uploading, or processing, in a visual way.
- * They can represent determinate or indeterminate progress.
- */
-export const ProgressCircle = React.forwardRef(function ProgressCircle(props: SpectrumProgressCircleProps, ref: DOMRef<HTMLDivElement>) {
-  let {
-    value = 0,
-    minValue = 0,
-    maxValue = 100,
-    size = 'M',
-    staticColor,
-    variant,
-    isIndeterminate = false,
-    'aria-label': ariaLabel,
-    'aria-labelledby': ariaLabelledby,
-    ...otherProps
-  } = props;
-  let domRef = useDOMRef(ref);
-  let {styleProps} = useStyleProps(otherProps);
-
-  value = clamp(value, minValue, maxValue);
-  let {progressBarProps} = useProgressBar({...props, value});
-
-  let subMask1Style: CSSProperties = {};
-  let subMask2Style: CSSProperties = {};
-  if (!isIndeterminate) {
-    let percentage = (value - minValue) / (maxValue - minValue) * 100;
-    let angle;
-    if (percentage > 0 && percentage <= 50) {
-      angle = -180 + (percentage / 50 * 180);
-      subMask1Style.transform = `rotate(${angle}deg)`;
-      subMask2Style.transform = 'rotate(-180deg)';
-    } else if (percentage > 50) {
-      angle = -180 + (percentage - 50) / 50 * 180;
-      subMask1Style.transform = 'rotate(0deg)';
-      subMask2Style.transform = `rotate(${angle}deg)`;
-    }
-  }
-
-  if (!ariaLabel && !ariaLabelledby && process.env.NODE_ENV !== 'production') {
-    console.warn('ProgressCircle requires an aria-label or aria-labelledby attribute for accessibility');
-  }
-
-  return (
-    <div
-      {...styleProps}
-      {...progressBarProps}
-      ref={domRef}
-      className={
-        classNames(
-          styles,
-          'spectrum-CircleLoader',
-          {
-            'spectrum-CircleLoader--indeterminate': isIndeterminate,
-            'spectrum-CircleLoader--small': size === 'S',
-            'spectrum-CircleLoader--large': size === 'L',
-            'spectrum-CircleLoader--overBackground': variant === 'overBackground',
-            'spectrum-CircleLoader--staticWhite': staticColor === 'white',
-            'spectrum-CircleLoader--staticBlack': staticColor === 'black'
-          },
-          styleProps.className
-        )
-      }>
-      <div className={classNames(styles, 'spectrum-CircleLoader-track')} />
-      <div className={classNames(styles, 'spectrum-CircleLoader-fills')} >
-        <div className={classNames(styles, 'spectrum-CircleLoader-fillMask1')} >
-          <div
-            className={classNames(styles, 'spectrum-CircleLoader-fillSubMask1')}
-            data-testid="fillSubMask1"
-            style={subMask1Style}>
-            <div className={classNames(styles, 'spectrum-CircleLoader-fill')} />
-          </div>
-        </div>
-        <div className={classNames(styles, 'spectrum-CircleLoader-fillMask2')} >
-          <div
-            className={classNames(styles, 'spectrum-CircleLoader-fillSubMask2')}
-            data-testid="fillSubMask2"
-            style={subMask2Style} >
-            <div className={classNames(styles, 'spectrum-CircleLoader-fill')} />
-          </div>
-        </div>
-      </div>
-    </div>
-  );
-});