From afb5e25b1d805ef305a6307480b5df71684e48ea Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Keviin=20=C3=85berg=20Kultalahti?= <kevin.aberg@gmail.com>
Date: Thu, 15 Apr 2021 18:06:22 +0200
Subject: [PATCH] adds wip progresscircle component

---
 packages/bbui/package.json                    |  1 +
 .../src/ProgressCircle/ProgressCircle.svelte  | 29 +++++++++++++++++++
 packages/bbui/src/index.js                    |  1 +
 packages/bbui/yarn.lock                       |  5 ++++
 4 files changed, 36 insertions(+)
 create mode 100644 packages/bbui/src/ProgressCircle/ProgressCircle.svelte

diff --git a/packages/bbui/package.json b/packages/bbui/package.json
index 0313c7ed1f..f0f67d8b3c 100644
--- a/packages/bbui/package.json
+++ b/packages/bbui/package.json
@@ -57,6 +57,7 @@
     "@spectrum-css/modal": "^3.0.1",
     "@spectrum-css/popover": "^3.0.1",
     "@spectrum-css/progressbar": "^1.0.2",
+    "@spectrum-css/progresscircle": "^1.0.2",
     "@spectrum-css/table": "^3.0.1",
     "@spectrum-css/tabs": "^3.0.1",
     "@spectrum-css/toast": "^3.0.1",
diff --git a/packages/bbui/src/ProgressCircle/ProgressCircle.svelte b/packages/bbui/src/ProgressCircle/ProgressCircle.svelte
new file mode 100644
index 0000000000..ba1dc10965
--- /dev/null
+++ b/packages/bbui/src/ProgressCircle/ProgressCircle.svelte
@@ -0,0 +1,29 @@
+<script>
+    // WIP! Does not yet work.
+    import "@spectrum-css/progresscircle/dist/index-vars.css"
+    import { tweened } from 'svelte/motion';
+    import { cubicOut } from 'svelte/easing';
+
+    export let value = false
+    export let small;
+    export let large;
+
+    export let overBackground;
+</script>
+
+<div class:spectrum-ProgressBar--indeterminate={!value} class:spectrum-ProgressCircle--small={small} class:spectrum-ProgressCircle--large={large} class="spectrum-ProgressCircle">
+    <div class="spectrum-ProgressCircle-track"></div>
+    <div class="spectrum-ProgressCircle-fills">
+      <div class="spectrum-ProgressCircle-fillMask1">
+        <div class="spectrum-ProgressCircle-fillSubMask1">
+          <div class="spectrum-ProgressCircle-fill"></div>
+        </div>
+      </div>
+      <div class="spectrum-ProgressCircle-fillMask2">
+        <div class="spectrum-ProgressCircle-fillSubMask2">
+          <div class="spectrum-ProgressCircle-fill"></div>
+        </div>
+      </div>
+    </div>
+  </div>
+
diff --git a/packages/bbui/src/index.js b/packages/bbui/src/index.js
index 76fa75a77c..f5b2987ad3 100644
--- a/packages/bbui/src/index.js
+++ b/packages/bbui/src/index.js
@@ -22,6 +22,7 @@ export { default as Switcher } from "./Switcher/Switcher.svelte"
 export { default as DropdownMenu } from "./DropdownMenu/DropdownMenu.svelte"
 export { default as Popover } from "./Popover/Popover.svelte"
 export { default as ProgressBar } from "./ProgressBar/ProgressBar.svelte"
+export { default as ProgressCircle } from "./ProgressCircle/ProgressCircle.svelte"
 export { default as Label } from "./Styleguide/Label.svelte"
 export { default as Link } from "./Link/Link.svelte"
 export { default as Close } from "./Button/Close.svelte"
diff --git a/packages/bbui/yarn.lock b/packages/bbui/yarn.lock
index 03128bb054..93ee6ebdd7 100644
--- a/packages/bbui/yarn.lock
+++ b/packages/bbui/yarn.lock
@@ -480,6 +480,11 @@
   resolved "https://registry.yarnpkg.com/@spectrum-css/progressbar/-/progressbar-1.0.2.tgz#b5a59432517f9ae6dad49d9504691bc5ac42b424"
   integrity sha512-+jExeBLtVCqo3BqtFq5WCtZ028Dzk+oUnX6y4z6ZamKPqOyOELOtFnhYnyhyRndQOqYwKUTXx9zsaWA/lpJOHw==
 
+"@spectrum-css/progresscircle@^1.0.2":
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/@spectrum-css/progresscircle/-/progresscircle-1.0.2.tgz#258ea9170fb70f795edda03e38a61d93bef4487c"
+  integrity sha512-JLULpyzjIY95lzlWR1yE1gv4l1K6p+scQ+edmuZZUHBzwM3pUtkvHJmUlA9TYdResUYW6Uka60VRdY6lZ8gnFQ==
+
 "@spectrum-css/table@^3.0.1":
   version "3.0.1"
   resolved "https://registry.yarnpkg.com/@spectrum-css/table/-/table-3.0.1.tgz#753e0e2498082c0c36b9600828516aff3ac338cd"