diff --git a/package.json b/package.json
index eeca4da..10429e5 100644
--- a/package.json
+++ b/package.json
@@ -26,6 +26,7 @@
"svelte-loader": "^2.13.6"
},
"dependencies": {
- "sirv-cli": "^1.0.0"
+ "sirv-cli": "^1.0.0",
+ "uuid": "^8.3.2"
}
}
diff --git a/src/CarouselChild.svelte b/src/CarouselChild.svelte
new file mode 100644
index 0000000..7241390
--- /dev/null
+++ b/src/CarouselChild.svelte
@@ -0,0 +1,21 @@
+
+
+{#if id === $store.currentItemId}
+
+{/if }
+
+
\ No newline at end of file
diff --git a/src/ImageCarousel.svelte b/src/ImageCarousel.svelte
index 48c2b20..90fb58d 100644
--- a/src/ImageCarousel.svelte
+++ b/src/ImageCarousel.svelte
@@ -1,5 +1,8 @@
diff --git a/src/store.js b/src/store.js
new file mode 100644
index 0000000..999ad90
--- /dev/null
+++ b/src/store.js
@@ -0,0 +1,54 @@
+import { writable } from 'svelte/store';
+
+
+function createStore() {
+ const { subscribe, set, update } = writable({
+ items: [],
+ currentItemId: null
+ });
+
+ function setItem(id) {
+ update(store => ({
+ ...store,
+ currentItemId: id,
+ items: [
+ ...store.items,
+ id
+ ]
+ }))
+ }
+
+ function next() {
+ // TODO: move to utils functions and cover eoth tests
+ update(store => {
+ const currentItemIndex = store.items.findIndex(item => item === store.currentItemId)
+ // TODO: infinite
+ // const newCurrentItemIndex = currentItemIndex + 1 > store.items.length - 1 ? 0 : currentItemIndex + 1
+ const newCurrentItemIndex = Math.min(currentItemIndex + 1, store.items.length - 1)
+ return {
+ ...store,
+ currentItemId: store.items[newCurrentItemIndex]
+ }
+ })
+ }
+
+ function prev() {
+ update(store => {
+ const currentItemIndex = store.items.findIndex(item => item === store.currentItemId)
+ const newCurrentItemIndex = Math.max(0, currentItemIndex - 1)
+ return {
+ ...store,
+ currentItemId: store.items[newCurrentItemIndex]
+ }
+ })
+ }
+
+ return {
+ subscribe,
+ setItem,
+ next,
+ prev
+ };
+}
+
+export const store = createStore();
\ No newline at end of file
diff --git a/src/stories/ImageCarouselView.svelte b/src/stories/ImageCarouselView.svelte
index 89c24c2..f58f783 100644
--- a/src/stories/ImageCarouselView.svelte
+++ b/src/stories/ImageCarouselView.svelte
@@ -1,5 +1,6 @@
-
- Element 1
- Element 2
+
+
+ Element 1
+
+
+ Element 2
+
diff --git a/src/utils/id.js b/src/utils/id.js
new file mode 100644
index 0000000..d636c7d
--- /dev/null
+++ b/src/utils/id.js
@@ -0,0 +1,5 @@
+import { v4 as uuid } from 'uuid'
+
+export function generateId() {
+ return uuid()
+}
\ No newline at end of file
diff --git a/yarn.lock b/yarn.lock
index 043b130..14162f4 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -9492,7 +9492,7 @@ uuid@^3.3.2:
resolved "https://registry.yarnpkg.com/uuid/-/uuid-3.4.0.tgz#b23e4358afa8a202fe7a100af1f5f883f02007ee"
integrity sha512-HjSDRw6gZE5JMggctHBcjVak08+KEVhSIiDzFnT9S9aegmp85S/bReBVTb4QTFaRNptJ9kuYaNhnbNEOkbKb/A==
-uuid@^8.0.0:
+uuid@^8.0.0, uuid@^8.3.2:
version "8.3.2"
resolved "https://registry.yarnpkg.com/uuid/-/uuid-8.3.2.tgz#80d5b5ced271bb9af6c445f21a1a04c606cefbe2"
integrity sha512-+NYs2QeMWy+GWFOEm9xnn6HCDp0l7QBD7ml8zLUmJ+93Q5NF0NocErnwkTkXVFNiX3/fpC6afS8Dhb/gz7R7eg==