-
-
- Confirm
-
diff --git a/src/components/Tune/TuneButton.vue b/src/components/Tune/TuneButton.vue
deleted file mode 100644
index 2de47bd6c..000000000
--- a/src/components/Tune/TuneButton.vue
+++ /dev/null
@@ -1,34 +0,0 @@
-
-
-
-
-
-
diff --git a/src/components/Tune/TuneButtonSelect.story.vue b/src/components/Tune/TuneButtonSelect.story.vue
deleted file mode 100644
index f325e7130..000000000
--- a/src/components/Tune/TuneButtonSelect.story.vue
+++ /dev/null
@@ -1,5 +0,0 @@
-
-
-
-
-
diff --git a/src/components/Tune/TuneButtonSelect.vue b/src/components/Tune/TuneButtonSelect.vue
deleted file mode 100644
index 9631d2931..000000000
--- a/src/components/Tune/TuneButtonSelect.vue
+++ /dev/null
@@ -1,35 +0,0 @@
-
-
-
-
-
- {{ label || definition.title }}
-
-
-
- {{ modelValue }}
-
-
-
-
diff --git a/src/components/Tune/TuneCheckbox.story.vue b/src/components/Tune/TuneCheckbox.story.vue
deleted file mode 100644
index ffe968ac4..000000000
--- a/src/components/Tune/TuneCheckbox.story.vue
+++ /dev/null
@@ -1,15 +0,0 @@
-
-
-
-
-
-
diff --git a/src/components/Tune/TuneCheckbox.vue b/src/components/Tune/TuneCheckbox.vue
deleted file mode 100644
index 96b18af19..000000000
--- a/src/components/Tune/TuneCheckbox.vue
+++ /dev/null
@@ -1,36 +0,0 @@
-
-
-
-
-
-
-
- {{ hint || definition.description }}
-
-
-
-
diff --git a/src/components/Tune/TuneCombobox.story.vue b/src/components/Tune/TuneCombobox.story.vue
deleted file mode 100644
index 9ebd64e0c..000000000
--- a/src/components/Tune/TuneCombobox.story.vue
+++ /dev/null
@@ -1,18 +0,0 @@
-
-
-
-
-
-
diff --git a/src/components/Tune/TuneCombobox.vue b/src/components/Tune/TuneCombobox.vue
deleted file mode 100644
index 812a20b7c..000000000
--- a/src/components/Tune/TuneCombobox.vue
+++ /dev/null
@@ -1,148 +0,0 @@
-
-
-
-
-
- {{ label || definition.title }}
-
-
-
-
-
-
-
-
-
-
-
-
-
- {{ item.name }}
-
-
-
-
-
-
-
-
-
-
-
diff --git a/src/components/Tune/TuneComboboxMultiple.story.vue b/src/components/Tune/TuneComboboxMultiple.story.vue
deleted file mode 100644
index e56e5192e..000000000
--- a/src/components/Tune/TuneComboboxMultiple.story.vue
+++ /dev/null
@@ -1,18 +0,0 @@
-
-
-
-
-
-
diff --git a/src/components/Tune/TuneComboboxMultiple.vue b/src/components/Tune/TuneComboboxMultiple.vue
deleted file mode 100644
index 349b87c68..000000000
--- a/src/components/Tune/TuneComboboxMultiple.vue
+++ /dev/null
@@ -1,157 +0,0 @@
-
-
-
-
-
- {{ label || definition.title }}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- {{ item.name }}
-
-
-
-
-
-
-
-
-
-
-
diff --git a/src/components/Tune/TuneErrorInput.story.vue b/src/components/Tune/TuneErrorInput.story.vue
deleted file mode 100644
index a57a936a9..000000000
--- a/src/components/Tune/TuneErrorInput.story.vue
+++ /dev/null
@@ -1,7 +0,0 @@
-
-
-
-
-
-
diff --git a/src/components/Tune/TuneErrorInput.vue b/src/components/Tune/TuneErrorInput.vue
deleted file mode 100644
index 4bb0b19b6..000000000
--- a/src/components/Tune/TuneErrorInput.vue
+++ /dev/null
@@ -1,11 +0,0 @@
-
-
-
-
- {{ error }}
-
-
diff --git a/src/components/Tune/TuneForm.story.vue b/src/components/Tune/TuneForm.story.vue
deleted file mode 100644
index 9f2140e4c..000000000
--- a/src/components/Tune/TuneForm.story.vue
+++ /dev/null
@@ -1,100 +0,0 @@
-
-
-
-
-
- Show errors
-
-
-
diff --git a/src/components/Tune/TuneForm.vue b/src/components/Tune/TuneForm.vue
deleted file mode 100644
index bfe54edd3..000000000
--- a/src/components/Tune/TuneForm.vue
+++ /dev/null
@@ -1,63 +0,0 @@
-
-
-
-
-
-
diff --git a/src/components/Tune/TuneIconHint.story.vue b/src/components/Tune/TuneIconHint.story.vue
deleted file mode 100644
index 335d2da5a..000000000
--- a/src/components/Tune/TuneIconHint.story.vue
+++ /dev/null
@@ -1,11 +0,0 @@
-
-
-
-
-
-
-
-
diff --git a/src/components/Tune/TuneIconHint.vue b/src/components/Tune/TuneIconHint.vue
deleted file mode 100644
index aa054952d..000000000
--- a/src/components/Tune/TuneIconHint.vue
+++ /dev/null
@@ -1,11 +0,0 @@
-
-
-
-
-
-
diff --git a/src/components/Tune/TuneInput.story.vue b/src/components/Tune/TuneInput.story.vue
deleted file mode 100644
index 087f829b5..000000000
--- a/src/components/Tune/TuneInput.story.vue
+++ /dev/null
@@ -1,7 +0,0 @@
-
-
-
-
-
-
diff --git a/src/components/Tune/TuneInput.vue b/src/components/Tune/TuneInput.vue
deleted file mode 100644
index 17f0d401a..000000000
--- a/src/components/Tune/TuneInput.vue
+++ /dev/null
@@ -1,118 +0,0 @@
-
-
-
-
-
-
-
- {{ label || definition.title }}
-
-
-
-
diff --git a/src/components/Tune/TuneInputDuration.story.vue b/src/components/Tune/TuneInputDuration.story.vue
deleted file mode 100644
index c64761ba4..000000000
--- a/src/components/Tune/TuneInputDuration.story.vue
+++ /dev/null
@@ -1,21 +0,0 @@
-
-
-
-
-
-
-
-
diff --git a/src/components/Tune/TuneInputDuration.vue b/src/components/Tune/TuneInputDuration.vue
deleted file mode 100644
index 51ba42812..000000000
--- a/src/components/Tune/TuneInputDuration.vue
+++ /dev/null
@@ -1,135 +0,0 @@
-
-
-
-
-
- {{ label || definition?.title }}
-
-
-
-
-
- {{ item.label }}
-
-
-
-
-
-
-
diff --git a/src/components/Tune/TuneInputSocial.vue b/src/components/Tune/TuneInputSocial.vue
deleted file mode 100644
index 68493ba11..000000000
--- a/src/components/Tune/TuneInputSocial.vue
+++ /dev/null
@@ -1,44 +0,0 @@
-
-
-
-
-
-
-
-
diff --git a/src/components/Tune/TuneInputUrl.vue b/src/components/Tune/TuneInputUrl.vue
deleted file mode 100644
index 62d2849b5..000000000
--- a/src/components/Tune/TuneInputUrl.vue
+++ /dev/null
@@ -1,42 +0,0 @@
-
-
-
-
-
-
-
-
diff --git a/src/components/Tune/TuneLabelInput.story.vue b/src/components/Tune/TuneLabelInput.story.vue
deleted file mode 100644
index dfffc09e0..000000000
--- a/src/components/Tune/TuneLabelInput.story.vue
+++ /dev/null
@@ -1,12 +0,0 @@
-
-
-
-
-
- Label
-
-
-
diff --git a/src/components/Tune/TuneLabelInput.vue b/src/components/Tune/TuneLabelInput.vue
deleted file mode 100644
index c494640d7..000000000
--- a/src/components/Tune/TuneLabelInput.vue
+++ /dev/null
@@ -1,18 +0,0 @@
-
-
-
-
-
-
-
- {{ sublabel }}
-
-
diff --git a/src/components/Tune/TuneListbox.story.vue b/src/components/Tune/TuneListbox.story.vue
deleted file mode 100644
index 3bce8875d..000000000
--- a/src/components/Tune/TuneListbox.story.vue
+++ /dev/null
@@ -1,15 +0,0 @@
-
-
-
-
-
-
diff --git a/src/components/Tune/TuneListbox.vue b/src/components/Tune/TuneListbox.vue
deleted file mode 100644
index f4a2c6239..000000000
--- a/src/components/Tune/TuneListbox.vue
+++ /dev/null
@@ -1,137 +0,0 @@
-
-
-
-
-
-
-
- {{ label || definition?.title }}
-
-
-
-
-
- {{ selectedItem?.name || selectedItem?.value }}
-
- Select
-
-
-
-
-
-
-
-
-
-
- {{ item?.name || item.value }}
-
-
-
-
-
-
-
-
-
-
-
-
-
diff --git a/src/components/Tune/TuneListboxMultiple.story.vue b/src/components/Tune/TuneListboxMultiple.story.vue
deleted file mode 100644
index 16cf1f586..000000000
--- a/src/components/Tune/TuneListboxMultiple.story.vue
+++ /dev/null
@@ -1,15 +0,0 @@
-
-
-
-
-
-
diff --git a/src/components/Tune/TuneListboxMultiple.vue b/src/components/Tune/TuneListboxMultiple.vue
deleted file mode 100644
index 16736f3fa..000000000
--- a/src/components/Tune/TuneListboxMultiple.vue
+++ /dev/null
@@ -1,158 +0,0 @@
-
-
-
-
-
-
-
- {{ label || definition?.title }}
-
-
-
-
-
- {{ placeholder || definition?.examples?.[0] }}
-
-
-
- {{ selectedItems.map(item => item?.name || item.value).join(', ') }}
-
-
-
-
-
-
-
-
-
-
-
- {{ item?.name || item.value }}
-
-
-
-
-
-
-
-
-
-
-
-
-
diff --git a/src/components/Tune/TuneLoadingSpinner.story.vue b/src/components/Tune/TuneLoadingSpinner.story.vue
deleted file mode 100644
index c1d568388..000000000
--- a/src/components/Tune/TuneLoadingSpinner.story.vue
+++ /dev/null
@@ -1,7 +0,0 @@
-
-
-
-
-
-
diff --git a/src/components/Tune/TuneLoadingSpinner.vue b/src/components/Tune/TuneLoadingSpinner.vue
deleted file mode 100644
index 818b31f28..000000000
--- a/src/components/Tune/TuneLoadingSpinner.vue
+++ /dev/null
@@ -1,7 +0,0 @@
-
-
-
-
-
-
diff --git a/src/components/Tune/TuneMenu.story.vue b/src/components/Tune/TuneMenu.story.vue
deleted file mode 100644
index 9b2770ab9..000000000
--- a/src/components/Tune/TuneMenu.story.vue
+++ /dev/null
@@ -1,26 +0,0 @@
-
-
-
-
-
-
diff --git a/src/components/Tune/TuneMenu.vue b/src/components/Tune/TuneMenu.vue
deleted file mode 100644
index d38009c18..000000000
--- a/src/components/Tune/TuneMenu.vue
+++ /dev/null
@@ -1,70 +0,0 @@
-
-
-
-
-
-
-
- {{ selected }}
-
-
-
-
-
-
-
diff --git a/src/components/Tune/TuneModal.story.vue b/src/components/Tune/TuneModal.story.vue
deleted file mode 100644
index 2a3633a89..000000000
--- a/src/components/Tune/TuneModal.story.vue
+++ /dev/null
@@ -1,38 +0,0 @@
-
-
-
-
- Open modal
-
- Lorem ipsum dolor sit amet consectetur adipisicing elit. Distinctio illo
- expedita libero, eaque iste aliquam praesentium necessitatibus ipsum
- impedit hic temporibus officia omnis deleniti, at sint, doloremque atque
- sit id?
-
-
-
-
-
-# TuneModal
-
-The TuneModal component provides a modal dialog box that appears on top of the current page, dimming the background content and prompting the user for an action. This component uses the @headlessui/vue package for creating accessible dialogs and transitions.
-
-### Props
-
-- **open**: a boolean value that determines whether the modal should be shown or hidden. When true, the modal is displayed; otherwise, it is hidden. This property is required.
-- **title**: a string value that specifies the title of the modal dialog box.
-
-### Slots
-
-The TuneModal component provides two slots for inserting content:
-
-- **Default slot**: Use this slot to add the main content of the modal dialog box. You can include any valid HTML markup, such as text, images, forms, or other components.
-
-- **Footer slot**: Use this slot to add any additional buttons, links, or other UI elements to the bottom of the modal dialog box.
-
-### Emits
-
-- **close**: an event emitted when the user closes the modal dialog box. This event does not contain any data.
-
diff --git a/src/components/Tune/TuneModal.vue b/src/components/Tune/TuneModal.vue
deleted file mode 100644
index 3455ddd88..000000000
--- a/src/components/Tune/TuneModal.vue
+++ /dev/null
@@ -1,66 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Close
-
-
-
- {{ title }}
-
-
-
-
-
-
-
-
-
-
-
diff --git a/src/components/Tune/TunePopover.story.vue b/src/components/Tune/TunePopover.story.vue
deleted file mode 100644
index b91d41b28..000000000
--- a/src/components/Tune/TunePopover.story.vue
+++ /dev/null
@@ -1,17 +0,0 @@
-
-
-
-
-
-
-
-
- Lorem ipsum dolor sit amet, consectetur adipisicing elit. Amet
- aperiam vitae eveniet vel ex praesentium nam quis deserunt porro
- harum. Magni maiores ipsa ea? Rem, quidem. Quas sunt ducimus rerum.
-
-
-
-
-
diff --git a/src/components/Tune/TunePopover.vue b/src/components/Tune/TunePopover.vue
deleted file mode 100644
index ef9cb79dc..000000000
--- a/src/components/Tune/TunePopover.vue
+++ /dev/null
@@ -1,56 +0,0 @@
-
-
-
-
-
-
-
- {{ label }}
-
-
-
-
-
-
-
-
-
diff --git a/src/components/Tune/TuneRadio.story.vue b/src/components/Tune/TuneRadio.story.vue
deleted file mode 100644
index a58e3e13e..000000000
--- a/src/components/Tune/TuneRadio.story.vue
+++ /dev/null
@@ -1,22 +0,0 @@
-
-
-
-
-
-
diff --git a/src/components/Tune/TuneRadio.vue b/src/components/Tune/TuneRadio.vue
deleted file mode 100644
index a872301df..000000000
--- a/src/components/Tune/TuneRadio.vue
+++ /dev/null
@@ -1,39 +0,0 @@
-
-
-
-
-
-
-
- {{ hint || definition.description }}
-
-
-
-
diff --git a/src/components/Tune/TuneSelect.vue b/src/components/Tune/TuneSelect.vue
deleted file mode 100644
index 8d4cecf3a..000000000
--- a/src/components/Tune/TuneSelect.vue
+++ /dev/null
@@ -1,31 +0,0 @@
-
-
-
-
-
- {{ item.label }}
-
-
-
diff --git a/src/components/Tune/TuneSwitch.story.vue b/src/components/Tune/TuneSwitch.story.vue
deleted file mode 100644
index c044d4afc..000000000
--- a/src/components/Tune/TuneSwitch.story.vue
+++ /dev/null
@@ -1,14 +0,0 @@
-
-
-
-
-
-
diff --git a/src/components/Tune/TuneSwitch.vue b/src/components/Tune/TuneSwitch.vue
deleted file mode 100644
index eef25202a..000000000
--- a/src/components/Tune/TuneSwitch.vue
+++ /dev/null
@@ -1,94 +0,0 @@
-
-
-
-
-
-
- {{ label || definition?.title }}
-
-
-
-
-
-
-
-
-
-
-
-
-
- {{ label || definition?.title }}
-
-
diff --git a/src/components/Tune/TuneTag.story.vue b/src/components/Tune/TuneTag.story.vue
deleted file mode 100644
index 790c7360d..000000000
--- a/src/components/Tune/TuneTag.story.vue
+++ /dev/null
@@ -1,7 +0,0 @@
-
-
-
-
-
-
diff --git a/src/components/Tune/TuneTag.vue b/src/components/Tune/TuneTag.vue
deleted file mode 100644
index affe14c59..000000000
--- a/src/components/Tune/TuneTag.vue
+++ /dev/null
@@ -1,11 +0,0 @@
-
-
-
-
- {{ label }}
-
-
diff --git a/src/components/Tune/TuneTextarea.story.vue b/src/components/Tune/TuneTextarea.story.vue
deleted file mode 100644
index 9a4033801..000000000
--- a/src/components/Tune/TuneTextarea.story.vue
+++ /dev/null
@@ -1,13 +0,0 @@
-
-
-
-
-
-
diff --git a/src/components/Tune/TuneTextarea.vue b/src/components/Tune/TuneTextarea.vue
deleted file mode 100644
index 0e2d188fa..000000000
--- a/src/components/Tune/TuneTextarea.vue
+++ /dev/null
@@ -1,101 +0,0 @@
-
-
-
-
-
-
-
- {{ label || definition?.title }}
-
-
-
-
diff --git a/src/components/Tune/TuneTextareaArray.story.vue b/src/components/Tune/TuneTextareaArray.story.vue
deleted file mode 100644
index 8e7a5c788..000000000
--- a/src/components/Tune/TuneTextareaArray.story.vue
+++ /dev/null
@@ -1,13 +0,0 @@
-
-
-
-
-
-
diff --git a/src/components/Tune/TuneTextareaArray.vue b/src/components/Tune/TuneTextareaArray.vue
deleted file mode 100644
index ff4bb84c2..000000000
--- a/src/components/Tune/TuneTextareaArray.vue
+++ /dev/null
@@ -1,45 +0,0 @@
-
-
-
-
diff --git a/src/components/Tune/TuneTextareaJson.story.vue b/src/components/Tune/TuneTextareaJson.story.vue
deleted file mode 100644
index 6d0214a49..000000000
--- a/src/components/Tune/TuneTextareaJson.story.vue
+++ /dev/null
@@ -1,13 +0,0 @@
-
-
-
-
-
-
diff --git a/src/components/Tune/TuneTextareaJson.vue b/src/components/Tune/TuneTextareaJson.vue
deleted file mode 100644
index 18624a6a6..000000000
--- a/src/components/Tune/TuneTextareaJson.vue
+++ /dev/null
@@ -1,51 +0,0 @@
-
-
-
-
diff --git a/src/components/Tune/_Form/FormArray.vue b/src/components/Tune/_Form/FormArray.vue
deleted file mode 100644
index 169fb0533..000000000
--- a/src/components/Tune/_Form/FormArray.vue
+++ /dev/null
@@ -1,113 +0,0 @@
-
-
-
-
-
-
-
- {{ definition?.title }}
-
-
-
Add
-
diff --git a/src/components/Tune/_Form/FormBoolean.vue b/src/components/Tune/_Form/FormBoolean.vue
deleted file mode 100644
index 1596b96aa..000000000
--- a/src/components/Tune/_Form/FormBoolean.vue
+++ /dev/null
@@ -1,22 +0,0 @@
-
-
-
-
diff --git a/src/components/Tune/_Form/FormNumber.vue b/src/components/Tune/_Form/FormNumber.vue
deleted file mode 100644
index 2753209c8..000000000
--- a/src/components/Tune/_Form/FormNumber.vue
+++ /dev/null
@@ -1,34 +0,0 @@
-
-
-
-
diff --git a/src/components/Tune/_Form/FormString.vue b/src/components/Tune/_Form/FormString.vue
deleted file mode 100644
index e4f892b0d..000000000
--- a/src/components/Tune/_Form/FormString.vue
+++ /dev/null
@@ -1,61 +0,0 @@
-
-
-
-
diff --git a/src/main.ts b/src/main.ts
index 3c1b35b11..277de704b 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -8,7 +8,8 @@ import App from '@/App.vue';
import router from '@/router';
import i18n from '@/helpers/i18n';
import '@/helpers/auth';
-import '@/assets/css/main.scss';
+import '@snapshot-labs/tune/dist/style.css';
+import '@/style.scss';
import { apolloClient } from '@/helpers/apollo';
import { DefaultApolloClient } from '@vue/apollo-composable';
import VueTippy from 'vue-tippy';
diff --git a/src/assets/css/main.scss b/src/style.scss
similarity index 60%
rename from src/assets/css/main.scss
rename to src/style.scss
index a5977e2c9..8f3485827 100644
--- a/src/assets/css/main.scss
+++ b/src/style.scss
@@ -1,6 +1,4 @@
-@import '../fonts/iconfont.css';
-@import './tippy.scss';
-@import './tune.scss';
+@import './assets/fonts/iconfont.css';
@tailwind base;
@tailwind components;
@@ -35,21 +33,21 @@
@layer base {
@font-face {
font-family: 'Calibre';
- src: url('../fonts/Calibre-Medium-Custom.woff2') format('woff2');
+ src: url('./assets/fonts/Calibre-Medium-Custom.woff2') format('woff2');
font-weight: 500;
font-style: normal;
}
@font-face {
font-family: 'Calibre';
- src: url('../fonts/Calibre-Semibold-Custom.woff2') format('woff2');
+ src: url('./assets/fonts/Calibre-Semibold-Custom.woff2') format('woff2');
font-weight: 600;
font-style: normal;
}
@font-face {
font-family: 'SpaceMono';
- src: url('../fonts/space-mono-v11-latin-700.woff2') format('woff2');
+ src: url('./assets/fonts/space-mono-v11-latin-700.woff2') format('woff2');
}
html {
@@ -117,6 +115,44 @@
}
}
+// Tune component styles
+
+.tune-label {
+ @apply font-sans;
+}
+
+.tune-sublabel {
+ @apply font-sans;
+}
+
+.tune-button {
+ @apply rounded-full;
+}
+
+.tune-input {
+ @apply rounded-full;
+}
+
+.tune-textarea {
+ @apply rounded-3xl px-3;
+}
+
+.tune-listbox-button {
+ @apply rounded-full;
+}
+
+.tune-button-select {
+ @apply rounded-full;
+}
+
+.tune-input-duration {
+ @apply rounded-full;
+}
+
+.tune-error-text {
+ @apply font-sans;
+}
+
// Fade transition for Vue's transition and transition-group
.fade-enter-active,
.fade-leave-active {
@@ -183,6 +219,94 @@ input[type='number'] {
-moz-appearance: textfield;
}
+// V-Tippy tooltip package styling - could be moved somewhere else?
+.tippy-box[data-animation='fade'][data-state='hidden'] {
+ opacity: 0;
+}
+[data-tippy-root] {
+ max-width: calc(100vw - 10px);
+}
+.tippy-box {
+ position: relative;
+ background-color: var(--text-color);
+ color: var(--header-bg);
+ border-radius: 7px;
+ font-size: 16px;
+ line-height: 1.4;
+ outline: 0;
+ transition-property: transform, visibility, opacity;
+ padding: 2px 4px;
+ text-align: center;
+ font-weight: 500;
+}
+.tippy-box[data-placement^='top'] > .tippy-arrow {
+ bottom: 0;
+}
+.tippy-box[data-placement^='top'] > .tippy-arrow:before {
+ bottom: -7px;
+ left: 0;
+ border-width: 8px 8px 0;
+ border-top-color: var(--text-color);
+ transform-origin: center top;
+}
+.tippy-box[data-placement^='bottom'] > .tippy-arrow {
+ top: 0;
+}
+.tippy-box[data-placement^='bottom'] > .tippy-arrow:before {
+ top: -7px;
+ left: 0;
+ border-width: 0 8px 8px;
+ border-bottom-color: var(--text-color);
+ transform-origin: center bottom;
+}
+.tippy-box[data-placement^='left'] > .tippy-arrow {
+ right: 0;
+}
+.tippy-box[data-placement^='left'] > .tippy-arrow:before {
+ border-width: 8px 0 8px 8px;
+ border-left-color: var(--text-color);
+ right: -7px;
+ transform-origin: center left;
+}
+.tippy-box[data-placement^='right'] > .tippy-arrow {
+ left: 0;
+}
+.tippy-box[data-placement^='right'] > .tippy-arrow:before {
+ left: -7px;
+ border-width: 8px 8px 8px 0;
+ border-right-color: var(--text-color);
+ transform-origin: center right;
+}
+.tippy-box[data-inertia][data-state='visible'] {
+ transition-timing-function: cubic-bezier(0.54, 1.5, 0.38, 1.11);
+}
+.tippy-arrow {
+ width: 16px;
+ height: 16px;
+ color: #333;
+}
+.tippy-arrow:before {
+ content: '';
+ position: absolute;
+ border-color: transparent;
+ border-style: solid;
+}
+.tippy-content {
+ position: relative;
+ padding: 5px 9px;
+ z-index: 1;
+ overflow-wrap: break-word;
+}
+.tippy-box[data-theme~='urlified'] {
+ max-width: 200px;
+ white-space: pre-wrap;
+ color: var(--header-bg);
+
+ a {
+ color: var(--header-bg);
+ }
+}
+
.lazy-loading {
@apply animate-pulse-fast bg-skin-border;
}
diff --git a/src/vars.scss b/src/vars.scss
new file mode 100644
index 000000000..e69de29bb
diff --git a/tailwind.config.js b/tailwind.config.js
index ac51f8850..5b191c879 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -6,7 +6,7 @@ module.exports = {
extend: {
colors: {
snapshot: '#f3b04e',
- 'skin-primary': 'var(--primary-color)',
+ primary: 'var(--primary-color)',
'skin-border': 'var(--border-color)',
'skin-text': 'var(--text-color)',
'skin-link': 'var(--link-color)',
diff --git a/vite.config.ts b/vite.config.ts
index 0141701a3..822a2abda 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -26,15 +26,17 @@ export default defineConfig({
}),
ViteComponents({
directoryAsNamespace: true,
- globalNamespaces: ['Tune'],
- globs: ['src/components/**/*.vue', '!src/components/Tune/_Form/*.vue'],
resolvers: [
IconsResolver({
customCollections: ['s'],
alias: {
ho: 'heroicons-outline'
}
- })
+ }),
+ componentName => {
+ if (componentName.startsWith('Tune'))
+ return { name: componentName, from: '@snapshot-labs/tune' };
+ }
]
}),
visualizer({
@@ -81,6 +83,12 @@ export default defineConfig({
optimizeDeps: {
esbuildOptions: {
target: 'esnext'
+ },
+ exclude: ['@snapshot-labs/tune']
+ },
+ server: {
+ watch: {
+ ignored: ['!**/node_modules/@snapshot-labs/tune/**']
}
}
});
diff --git a/yarn.lock b/yarn.lock
index 446a2b776..c1027d5c2 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -679,14 +679,14 @@
"@ethersproject/properties" "^5.7.0"
"@ethersproject/strings" "^5.7.0"
-"@floating-ui/core@^1.3.0", "@floating-ui/core@^1.4.2":
+"@floating-ui/core@^1.0.0", "@floating-ui/core@^1.3.0", "@floating-ui/core@^1.4.2":
version "1.5.0"
resolved "https://registry.yarnpkg.com/@floating-ui/core/-/core-1.5.0.tgz#5c05c60d5ae2d05101c3021c1a2a350ddc027f8c"
integrity sha512-kK1h4m36DQ0UHGj5Ah4db7R0rHemTqqO0QLvUqi1/mUUp3LuAWbWxdxSIf/XsnH9VS6rRVPLJCncjRzUvyCLXg==
dependencies:
"@floating-ui/utils" "^0.1.3"
-"@floating-ui/dom@^1.3.0", "@floating-ui/dom@^1.4.5":
+"@floating-ui/dom@^1.0.0", "@floating-ui/dom@^1.2.1", "@floating-ui/dom@^1.3.0", "@floating-ui/dom@^1.4.5":
version "1.5.3"
resolved "https://registry.yarnpkg.com/@floating-ui/dom/-/dom-1.5.3.tgz#54e50efcb432c06c23cd33de2b575102005436fa"
integrity sha512-ClAbQnEqJAKCJOEbbLo5IUlZHkNszqhuxS4fHAVxRPXPya6Ysf2G8KypnYcOTpx6I8xcgF9bbHb6g/2KpbV8qA==
@@ -699,6 +699,14 @@
resolved "https://registry.yarnpkg.com/@floating-ui/utils/-/utils-0.1.6.tgz#22958c042e10b67463997bd6ea7115fe28cbcaf9"
integrity sha512-OfX7E2oUDYxtBvsuS4e/jSn4Q9Qb6DzgeYtsAdkPZ47znpoNsMgZw0+tVijiv3uGNR6dgNlty6r9rzIzHjtd/A==
+"@floating-ui/vue@^0.2.0":
+ version "0.2.1"
+ resolved "https://registry.yarnpkg.com/@floating-ui/vue/-/vue-0.2.1.tgz#a52b66e020897ad0535d0d0d3b09932446fc6231"
+ integrity sha512-HE+EIeakID7wI6vUwF0yMpaW48bNaPj8QtnQaRMkaQFhQReVBA4bY6fmJ3J7X+dqVgDbMhyfCG0fBJfdQMdWxQ==
+ dependencies:
+ "@floating-ui/dom" "^1.2.1"
+ vue-demi "^0.13.11"
+
"@floating-ui/vue@^1.0.0":
version "1.0.2"
resolved "https://registry.yarnpkg.com/@floating-ui/vue/-/vue-1.0.2.tgz#ebd704843c2f3b780c1ce6652a7245873278563f"
@@ -724,6 +732,15 @@
dependencies:
"@hapi/hoek" "^9.0.0"
+"@headlessui-float/vue@^0.11.0":
+ version "0.11.3"
+ resolved "https://registry.yarnpkg.com/@headlessui-float/vue/-/vue-0.11.3.tgz#681a919943d7342e3560ef75d61311be958d3c1b"
+ integrity sha512-pGljsWtpDbwVK3JtWC78nG8rNnGQMXbB0obIEKM+XfrMSxv94ZoAJm6Too/baJTxqtxSXbR4I2YPgLY3sEkTDg==
+ dependencies:
+ "@floating-ui/core" "^1.0.0"
+ "@floating-ui/dom" "^1.0.0"
+ "@floating-ui/vue" "^0.2.0"
+
"@headlessui-float/vue@^0.12.0":
version "0.12.0"
resolved "https://registry.yarnpkg.com/@headlessui-float/vue/-/vue-0.12.0.tgz#315abf12d87545fb0328db413f4462bee33651a3"
@@ -733,7 +750,7 @@
"@floating-ui/dom" "^1.3.0"
"@floating-ui/vue" "^1.0.0"
-"@headlessui/vue@^1.7.16":
+"@headlessui/vue@^1.7.12", "@headlessui/vue@^1.7.16":
version "1.7.16"
resolved "https://registry.yarnpkg.com/@headlessui/vue/-/vue-1.7.16.tgz#bdc9d32d329248910325539b99e6abfce0c69f89"
integrity sha512-nKT+nf/q6x198SsyK54mSszaQl/z+QxtASmgMEJtpxSX2Q0OPJX0upS/9daDyiECpeAsvjkoOrm2O/6PyBQ+Qg==
@@ -1323,6 +1340,20 @@
json-to-graphql-query "^2.2.4"
lodash.set "^4.3.2"
+"@snapshot-labs/tune@^0.1.34":
+ version "0.1.34"
+ resolved "https://registry.yarnpkg.com/@snapshot-labs/tune/-/tune-0.1.34.tgz#8a4d8fbb4d70ae6d411f4867c6345becc440f38f"
+ integrity sha512-NoT8kw4AQUD25xkDS/3f17s3s02gGkdiMT2Qadjp6m+FtiMS8BYbI89+DbQrI3uYc6EdiM2QjWUaXHc7LRPT3Q==
+ dependencies:
+ "@headlessui-float/vue" "^0.11.0"
+ "@headlessui/vue" "^1.7.12"
+ "@vueuse/core" "^10.1.2"
+ lodash "^4.17.21"
+ minisearch "^6.0.1"
+ sass "^1.60.0"
+ vue "^3.2.47"
+ vue-tippy "^6.0.0"
+
"@solana/buffer-layout@^4.0.0":
version "4.0.1"
resolved "https://registry.yarnpkg.com/@solana/buffer-layout/-/buffer-layout-4.0.1.tgz#b996235eaec15b1e0b5092a8ed6028df77fa6c15"
@@ -1993,7 +2024,7 @@
js-beautify "1.14.9"
vue-component-type-helpers "1.8.4"
-"@vueuse/core@^10.6.1":
+"@vueuse/core@^10.1.2", "@vueuse/core@^10.6.1":
version "10.6.1"
resolved "https://registry.yarnpkg.com/@vueuse/core/-/core-10.6.1.tgz#5b16d8238054c6983b6cb7cd77a78035f098dd89"
integrity sha512-Pc26IJbqgC9VG1u6VY/xrXXfxD33hnvxBnKrLlA2LJlyHII+BSrRoTPJgGYq7qZOu61itITFUnm6QbacwZ4H8Q==
@@ -5503,10 +5534,10 @@ minipass@^4.2.4:
resolved "https://registry.yarnpkg.com/minipass/-/minipass-7.0.2.tgz#58a82b7d81c7010da5bd4b2c0c85ac4b4ec5131e"
integrity sha512-eL79dXrE1q9dBbDCLg7xfn/vl7MS4F1gvJAgjJrQli/jbQWdUttuVawphqpffoIYfRdq78LHx6GP4bU/EQ2ATA==
-minisearch@^6.2.0:
- version "6.2.0"
- resolved "https://registry.yarnpkg.com/minisearch/-/minisearch-6.2.0.tgz#310b50508551f22e10815f5baedeeeded03a6b5d"
- integrity sha512-BECkorDF1TY2rGKt9XHdSeP9TP29yUbrAaCh/C03wpyf1vx3uYcP/+8XlMcpTkgoU0rBVnHMAOaP83Rc9Tm+TQ==
+minisearch@^6.0.1:
+ version "6.1.0"
+ resolved "https://registry.yarnpkg.com/minisearch/-/minisearch-6.1.0.tgz#6e74e743dbd0e88fa5ca52fef2391e0aa7055252"
+ integrity sha512-PNxA/X8pWk+TiqPbsoIYH0GQ5Di7m6326/lwU/S4mlo4wGQddIcf/V//1f9TB0V4j59b57b+HZxt8h3iMROGvg==
mixpanel-browser@^2.48.1:
version "2.48.1"
@@ -6605,7 +6636,7 @@ sass-loader@^13.2.2:
klona "^2.0.6"
neo-async "^2.6.2"
-sass@~1.62.1:
+sass@^1.60.0, sass@~1.62.1:
version "1.62.1"
resolved "https://registry.yarnpkg.com/sass/-/sass-1.62.1.tgz#caa8d6bf098935bc92fc73fa169fb3790cacd029"
integrity sha512-NHpxIzN29MXvWiuswfc1W3I0N8SXBd8UR26WntmDlRYf0bSADnwnOjsyMZ3lMezSlArD33Vs3YFhp7dWvL770A==
@@ -7542,6 +7573,11 @@ vue-demi@>=0.13.0, vue-demi@>=0.14.6, vue-demi@^0.14.6:
resolved "https://registry.yarnpkg.com/vue-demi/-/vue-demi-0.14.6.tgz#dc706582851dc1cdc17a0054f4fec2eb6df74c92"
integrity sha512-8QA7wrYSHKaYgUxDA5ZC24w+eHm3sYCbp0EzcDwKqN3p6HqtTCGR/GVsPyZW92unff4UlcSh++lmqDWN3ZIq4w==
+vue-demi@^0.13.11:
+ version "0.13.11"
+ resolved "https://registry.yarnpkg.com/vue-demi/-/vue-demi-0.13.11.tgz#7d90369bdae8974d87b1973564ad390182410d99"
+ integrity sha512-IR8HoEEGM65YY3ZJYAjMlKygDQn25D5ajNFNoKh9RSDMQtlzCxtfQjdQgv9jjK+m3377SsJXY8ysq8kLCZL25A==
+
vue-eslint-parser@^7.10.0:
version "7.11.0"
resolved "https://registry.yarnpkg.com/vue-eslint-parser/-/vue-eslint-parser-7.11.0.tgz#214b5dea961007fcffb2ee65b8912307628d0daf"
@@ -7584,14 +7620,14 @@ vue-router@^4.2.5:
dependencies:
"@vue/devtools-api" "^6.5.0"
-vue-tippy@^6.3.1:
+vue-tippy@^6.0.0, vue-tippy@^6.3.1:
version "6.3.1"
resolved "https://registry.yarnpkg.com/vue-tippy/-/vue-tippy-6.3.1.tgz#8d0e03294dad862d71f3a90e486721720cff832c"
integrity sha512-U2jpGwmwg+u/a36/XDnGlOF+W944xHGlVELsrTNWmZ0nUi2E/VW0c/buBkzntFUwRh6BHwFWcKL8BHcyG2mogQ==
dependencies:
tippy.js "^6.3.7"
-vue@^3.3.8:
+vue@^3.2.47, vue@^3.3.8:
version "3.3.8"
resolved "https://registry.yarnpkg.com/vue/-/vue-3.3.8.tgz#532ff071af24f6a69e5ecc53a66858a9ee874ffc"
integrity sha512-5VSX/3DabBikOXMsxzlW8JyfeLKlG9mzqnWgLQLty88vdZL7ZJgrdgBOmrArwxiLtmS+lNNpPcBYqrhE6TQW5w==
From f74a3cd8b148bf08358268bea110ffa7671801bf Mon Sep 17 00:00:00 2001
From: Wan <495709+wa0x6e@users.noreply.github.com>
Date: Thu, 23 Nov 2023 00:18:34 +0800
Subject: [PATCH 04/20] chore: remove unused files/package (#4384)
* chore: remove unused files/package
* fix: avoid call when unecessary
---
package.json | 1 -
src/helpers/lensResolver.ts | 101 ------------------------------------
src/helpers/utils.ts | 4 ++
yarn.lock | 5 --
4 files changed, 4 insertions(+), 107 deletions(-)
delete mode 100644 src/helpers/lensResolver.ts
diff --git a/package.json b/package.json
index 48ba0359b..e35e9c23b 100644
--- a/package.json
+++ b/package.json
@@ -16,7 +16,6 @@
"test:unit:coverage": "vitest run --coverage"
},
"dependencies": {
- "@adraffy/ens-normalize": "^1.10.0",
"@apollo/client": "^3.8.7",
"@braintree/sanitize-url": "^6.0.4",
"@ensdomains/eth-ens-namehash": "^2.0.15",
diff --git a/src/helpers/lensResolver.ts b/src/helpers/lensResolver.ts
deleted file mode 100644
index 57ec415d5..000000000
--- a/src/helpers/lensResolver.ts
+++ /dev/null
@@ -1,101 +0,0 @@
-import getProvider from '@snapshot-labs/snapshot.js/src/utils/provider';
-import Multicaller from '@snapshot-labs/snapshot.js/src/utils/multicaller';
-import { getAddress } from '@ethersproject/address';
-import { BigNumber } from '@ethersproject/bignumber';
-
-type Handle = string;
-type Address = string;
-type ProfileId = number;
-
-const network = '137';
-const abi: string[] = [
- 'function balanceOf(address owner) view returns (uint256)',
- 'function tokenOfOwnerByIndex(address owner, uint256 index) view returns (uint256)',
- 'function getHandle(uint256 profileId) view returns (string)'
-];
-const contractAddress = '0xDb46d1Dc155634FbC732f92E853b10B288AD5a1d';
-
-class LensResolver {
- _multicaller!: Multicaller;
-
- get multi() {
- if (!this._multicaller) {
- const broviderUrl = import.meta.env.VITE_BROVIDER_URL;
- const provider = getProvider(network, { broviderUrl });
- this._multicaller = new Multicaller(network, provider, abi);
- }
- return this._multicaller;
- }
-
- async getAvailableHandleMapping(addresses: Address[]): Promise
{
- if (!addresses.length) return [];
- addresses.forEach(address => {
- address = getAddress(address).toString();
- this.multi.call(address, contractAddress, 'balanceOf', [address]);
- });
-
- const balances: Record = await this.multi.execute();
- return Object.entries(balances)
- .map(([addr, bal]): [Address, number] => [addr, bal.toNumber()])
- .filter(([addr, bal]) => !!bal && addr !== 'undefined')
- .map(([addr]) => addr);
- }
-
- async getTokensMapping(
- addresses: Address[]
- ): Promise<[Address, ProfileId][]> {
- if (!addresses.length) return [];
- addresses.forEach(address => {
- address = getAddress(address).toString();
- this.multi.call(address, contractAddress, 'tokenOfOwnerByIndex', [
- address,
- 0
- ]);
- });
-
- const tokens: Record = await this.multi.execute();
-
- return Object.entries(tokens).map(([address, token]) => [
- address,
- token.toNumber()
- ]);
- }
-
- async getHandleMapping(
- tokenMapping: [Address, ProfileId][]
- ): Promise> {
- if (!tokenMapping.length) return {};
- tokenMapping.forEach(([address, token]) => {
- this.multi.call(address, contractAddress, 'getHandle', [token]);
- });
-
- const handles: Record = await this.multi.execute();
-
- return Object.entries(handles)
- .filter(([address]) => address !== 'undefined')
- .map(([address, handle]) => [address, handle.toString()])
- .reduce((acc, [address, handle]) => {
- acc[address] = handle;
- return acc;
- }, {});
- }
-
- async resolveAddresses(
- addresses: Address[]
- ): Promise> {
- const addressesWithHandles =
- await this.getAvailableHandleMapping(addresses);
- const tokenMapping = await this.getTokensMapping(addressesWithHandles);
- return this.getHandleMapping(tokenMapping);
- }
-}
-
-export const resolveLensAddresses = async (addresses: Address[]) => {
- try {
- const resolver = new LensResolver();
- return await resolver.resolveAddresses(addresses);
- } catch (e) {
- console.log(e);
- return {};
- }
-};
diff --git a/src/helpers/utils.ts b/src/helpers/utils.ts
index f07d3cc75..c292e2191 100644
--- a/src/helpers/utils.ts
+++ b/src/helpers/utils.ts
@@ -169,6 +169,10 @@ export async function resolveLens(handle: string) {
export async function lookupAddress(
addresses: string[]
): Promise> {
+ if (addresses.length === 0) {
+ return {};
+ }
+
try {
const results = await fetch(import.meta.env.VITE_STAMP_URL, {
method: 'POST',
diff --git a/yarn.lock b/yarn.lock
index c1027d5c2..63f10f946 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -12,11 +12,6 @@
resolved "https://registry.yarnpkg.com/@adraffy/ens-normalize/-/ens-normalize-1.9.0.tgz#223572538f6bea336750039bb43a4016dcc8182d"
integrity sha512-iowxq3U30sghZotgl4s/oJRci6WPBfNO5YYgk2cIOMCHr3LeGPcsZjCEr+33Q4N+oV3OABDAtA+pyvWjbvBifQ==
-"@adraffy/ens-normalize@^1.10.0":
- version "1.10.0"
- resolved "https://registry.yarnpkg.com/@adraffy/ens-normalize/-/ens-normalize-1.10.0.tgz#d2a39395c587e092d77cbbc80acf956a54f38bf7"
- integrity sha512-nA9XHtlAkYfJxY7bce8DcN7eKxWWCWkU+1GR9d+U6MbNpfwQp8TI7vqOsBsMcHoT4mBu2kypKoSKnghEzOOq5Q==
-
"@alloc/quick-lru@^5.2.0":
version "5.2.0"
resolved "https://registry.yarnpkg.com/@alloc/quick-lru/-/quick-lru-5.2.0.tgz#7bf68b20c0a350f936915fcae06f58e32007ce30"
From 86105a6a3365ef3e7dbd3406a780eeb6b498a002 Mon Sep 17 00:00:00 2001
From: Sam <51686767+samuveth@users.noreply.github.com>
Date: Thu, 23 Nov 2023 15:57:21 +0700
Subject: [PATCH 05/20] fix: Ui component resolve (#4386)
* Revert "Revert "ref: Major refactor Tune into Snapshot (#4374)" (#4385)"
This reverts commit 2cdece747958513983a0c4b8a843beeae7379859.
* Fix ui component resolve
---
package.json | 2 +-
src/{style.scss => assets/css/main.scss} | 136 +------------
src/assets/css/tippy.scss | 87 +++++++++
src/assets/css/tune.scss | 181 ++++++++++++++++++
src/assets/icons/spinner.svg | 1 +
src/components/BaseCalendar.vue | 2 +-
src/components/BaseIndicator.vue | 2 +-
src/components/BaseProgressBar.vue | 2 +-
src/components/BlockSpacesListItem.vue | 2 +-
src/components/InputCheckbox.vue | 2 +-
src/components/ModalSpacesListItem.vue | 2 +-
.../ProfileAboutDelegateListItem.vue | 2 +-
src/components/ProfileActivityListItem.vue | 2 +-
src/components/SetupSidebarStepper.vue | 12 +-
.../SpaceProposalResultsProgressBar.vue | 2 +-
src/components/TheNavbar.vue | 4 +-
src/components/Tune/TuneButton.story.vue | 5 +
src/components/Tune/TuneButton.vue | 34 ++++
.../Tune/TuneButtonSelect.story.vue | 5 +
src/components/Tune/TuneButtonSelect.vue | 35 ++++
src/components/Tune/TuneCheckbox.story.vue | 15 ++
src/components/Tune/TuneCheckbox.vue | 36 ++++
src/components/Tune/TuneCombobox.story.vue | 18 ++
src/components/Tune/TuneCombobox.vue | 148 ++++++++++++++
.../Tune/TuneComboboxMultiple.story.vue | 18 ++
src/components/Tune/TuneComboboxMultiple.vue | 157 +++++++++++++++
src/components/Tune/TuneErrorInput.story.vue | 7 +
src/components/Tune/TuneErrorInput.vue | 11 ++
src/components/Tune/TuneForm.story.vue | 100 ++++++++++
src/components/Tune/TuneForm.vue | 63 ++++++
src/components/Tune/TuneIconHint.story.vue | 11 ++
src/components/Tune/TuneIconHint.vue | 11 ++
src/components/Tune/TuneInput.story.vue | 7 +
src/components/Tune/TuneInput.vue | 118 ++++++++++++
.../Tune/TuneInputDuration.story.vue | 21 ++
src/components/Tune/TuneInputDuration.vue | 135 +++++++++++++
src/components/Tune/TuneInputSocial.vue | 44 +++++
src/components/Tune/TuneInputUrl.vue | 42 ++++
src/components/Tune/TuneLabelInput.story.vue | 12 ++
src/components/Tune/TuneLabelInput.vue | 18 ++
src/components/Tune/TuneListbox.story.vue | 15 ++
src/components/Tune/TuneListbox.vue | 137 +++++++++++++
.../Tune/TuneListboxMultiple.story.vue | 15 ++
src/components/Tune/TuneListboxMultiple.vue | 158 +++++++++++++++
.../Tune/TuneLoadingSpinner.story.vue | 7 +
src/components/Tune/TuneLoadingSpinner.vue | 7 +
src/components/Tune/TuneMenu.story.vue | 26 +++
src/components/Tune/TuneMenu.vue | 70 +++++++
src/components/Tune/TuneModal.story.vue | 38 ++++
src/components/Tune/TuneModal.vue | 66 +++++++
src/components/Tune/TunePopover.story.vue | 17 ++
src/components/Tune/TunePopover.vue | 56 ++++++
src/components/Tune/TuneRadio.story.vue | 22 +++
src/components/Tune/TuneRadio.vue | 39 ++++
src/components/Tune/TuneSelect.vue | 31 +++
src/components/Tune/TuneSwitch.story.vue | 14 ++
src/components/Tune/TuneSwitch.vue | 94 +++++++++
src/components/Tune/TuneTag.story.vue | 7 +
src/components/Tune/TuneTag.vue | 11 ++
src/components/Tune/TuneTextarea.story.vue | 13 ++
src/components/Tune/TuneTextarea.vue | 101 ++++++++++
.../Tune/TuneTextareaArray.story.vue | 13 ++
src/components/Tune/TuneTextareaArray.vue | 45 +++++
.../Tune/TuneTextareaJson.story.vue | 13 ++
src/components/Tune/TuneTextareaJson.vue | 51 +++++
src/components/Tune/_Form/FormArray.vue | 113 +++++++++++
src/components/Tune/_Form/FormBoolean.vue | 22 +++
src/components/Tune/_Form/FormNumber.vue | 34 ++++
src/components/Tune/_Form/FormString.vue | 61 ++++++
.../Ui/{Collapsible.vue => UiCollapsible.vue} | 0
...leContent.vue => UiCollapsibleContent.vue} | 0
...lapsibleText.vue => UiCollapsibleText.vue} | 0
src/components/Ui/{Input.vue => UiInput.vue} | 0
.../Ui/{Select.vue => UiSelect.vue} | 0
src/main.ts | 3 +-
src/vars.scss | 0
tailwind.config.js | 2 +-
vite.config.ts | 14 +-
yarn.lock | 58 ++----
79 files changed, 2676 insertions(+), 209 deletions(-)
rename src/{style.scss => assets/css/main.scss} (60%)
create mode 100644 src/assets/css/tippy.scss
create mode 100644 src/assets/css/tune.scss
create mode 100644 src/assets/icons/spinner.svg
create mode 100644 src/components/Tune/TuneButton.story.vue
create mode 100644 src/components/Tune/TuneButton.vue
create mode 100644 src/components/Tune/TuneButtonSelect.story.vue
create mode 100644 src/components/Tune/TuneButtonSelect.vue
create mode 100644 src/components/Tune/TuneCheckbox.story.vue
create mode 100644 src/components/Tune/TuneCheckbox.vue
create mode 100644 src/components/Tune/TuneCombobox.story.vue
create mode 100644 src/components/Tune/TuneCombobox.vue
create mode 100644 src/components/Tune/TuneComboboxMultiple.story.vue
create mode 100644 src/components/Tune/TuneComboboxMultiple.vue
create mode 100644 src/components/Tune/TuneErrorInput.story.vue
create mode 100644 src/components/Tune/TuneErrorInput.vue
create mode 100644 src/components/Tune/TuneForm.story.vue
create mode 100644 src/components/Tune/TuneForm.vue
create mode 100644 src/components/Tune/TuneIconHint.story.vue
create mode 100644 src/components/Tune/TuneIconHint.vue
create mode 100644 src/components/Tune/TuneInput.story.vue
create mode 100644 src/components/Tune/TuneInput.vue
create mode 100644 src/components/Tune/TuneInputDuration.story.vue
create mode 100644 src/components/Tune/TuneInputDuration.vue
create mode 100644 src/components/Tune/TuneInputSocial.vue
create mode 100644 src/components/Tune/TuneInputUrl.vue
create mode 100644 src/components/Tune/TuneLabelInput.story.vue
create mode 100644 src/components/Tune/TuneLabelInput.vue
create mode 100644 src/components/Tune/TuneListbox.story.vue
create mode 100644 src/components/Tune/TuneListbox.vue
create mode 100644 src/components/Tune/TuneListboxMultiple.story.vue
create mode 100644 src/components/Tune/TuneListboxMultiple.vue
create mode 100644 src/components/Tune/TuneLoadingSpinner.story.vue
create mode 100644 src/components/Tune/TuneLoadingSpinner.vue
create mode 100644 src/components/Tune/TuneMenu.story.vue
create mode 100644 src/components/Tune/TuneMenu.vue
create mode 100644 src/components/Tune/TuneModal.story.vue
create mode 100644 src/components/Tune/TuneModal.vue
create mode 100644 src/components/Tune/TunePopover.story.vue
create mode 100644 src/components/Tune/TunePopover.vue
create mode 100644 src/components/Tune/TuneRadio.story.vue
create mode 100644 src/components/Tune/TuneRadio.vue
create mode 100644 src/components/Tune/TuneSelect.vue
create mode 100644 src/components/Tune/TuneSwitch.story.vue
create mode 100644 src/components/Tune/TuneSwitch.vue
create mode 100644 src/components/Tune/TuneTag.story.vue
create mode 100644 src/components/Tune/TuneTag.vue
create mode 100644 src/components/Tune/TuneTextarea.story.vue
create mode 100644 src/components/Tune/TuneTextarea.vue
create mode 100644 src/components/Tune/TuneTextareaArray.story.vue
create mode 100644 src/components/Tune/TuneTextareaArray.vue
create mode 100644 src/components/Tune/TuneTextareaJson.story.vue
create mode 100644 src/components/Tune/TuneTextareaJson.vue
create mode 100644 src/components/Tune/_Form/FormArray.vue
create mode 100644 src/components/Tune/_Form/FormBoolean.vue
create mode 100644 src/components/Tune/_Form/FormNumber.vue
create mode 100644 src/components/Tune/_Form/FormString.vue
rename src/components/Ui/{Collapsible.vue => UiCollapsible.vue} (100%)
rename src/components/Ui/{CollapsibleContent.vue => UiCollapsibleContent.vue} (100%)
rename src/components/Ui/{CollapsibleText.vue => UiCollapsibleText.vue} (100%)
rename src/components/Ui/{Input.vue => UiInput.vue} (100%)
rename src/components/Ui/{Select.vue => UiSelect.vue} (100%)
delete mode 100644 src/vars.scss
diff --git a/package.json b/package.json
index e35e9c23b..ab0359a3e 100644
--- a/package.json
+++ b/package.json
@@ -38,7 +38,6 @@
"@snapshot-labs/lock": "^0.2.1",
"@snapshot-labs/pineapple": "^1.1.0",
"@snapshot-labs/snapshot.js": "^0.9.2",
- "@snapshot-labs/tune": "^0.1.34",
"@vue/apollo-composable": "4.0.0-beta.11",
"@vueuse/core": "^10.6.1",
"@vueuse/head": "^2.0.0",
@@ -51,6 +50,7 @@
"js-sha256": "^0.10.1",
"jsonexport": "^3.2.0",
"lodash": "^4.17.21",
+ "minisearch": "^6.2.0",
"mixpanel-browser": "^2.48.1",
"remarkable": "^2.0.1",
"remove-markdown": "^0.5.0",
diff --git a/src/style.scss b/src/assets/css/main.scss
similarity index 60%
rename from src/style.scss
rename to src/assets/css/main.scss
index 8f3485827..a5977e2c9 100644
--- a/src/style.scss
+++ b/src/assets/css/main.scss
@@ -1,4 +1,6 @@
-@import './assets/fonts/iconfont.css';
+@import '../fonts/iconfont.css';
+@import './tippy.scss';
+@import './tune.scss';
@tailwind base;
@tailwind components;
@@ -33,21 +35,21 @@
@layer base {
@font-face {
font-family: 'Calibre';
- src: url('./assets/fonts/Calibre-Medium-Custom.woff2') format('woff2');
+ src: url('../fonts/Calibre-Medium-Custom.woff2') format('woff2');
font-weight: 500;
font-style: normal;
}
@font-face {
font-family: 'Calibre';
- src: url('./assets/fonts/Calibre-Semibold-Custom.woff2') format('woff2');
+ src: url('../fonts/Calibre-Semibold-Custom.woff2') format('woff2');
font-weight: 600;
font-style: normal;
}
@font-face {
font-family: 'SpaceMono';
- src: url('./assets/fonts/space-mono-v11-latin-700.woff2') format('woff2');
+ src: url('../fonts/space-mono-v11-latin-700.woff2') format('woff2');
}
html {
@@ -115,44 +117,6 @@
}
}
-// Tune component styles
-
-.tune-label {
- @apply font-sans;
-}
-
-.tune-sublabel {
- @apply font-sans;
-}
-
-.tune-button {
- @apply rounded-full;
-}
-
-.tune-input {
- @apply rounded-full;
-}
-
-.tune-textarea {
- @apply rounded-3xl px-3;
-}
-
-.tune-listbox-button {
- @apply rounded-full;
-}
-
-.tune-button-select {
- @apply rounded-full;
-}
-
-.tune-input-duration {
- @apply rounded-full;
-}
-
-.tune-error-text {
- @apply font-sans;
-}
-
// Fade transition for Vue's transition and transition-group
.fade-enter-active,
.fade-leave-active {
@@ -219,94 +183,6 @@ input[type='number'] {
-moz-appearance: textfield;
}
-// V-Tippy tooltip package styling - could be moved somewhere else?
-.tippy-box[data-animation='fade'][data-state='hidden'] {
- opacity: 0;
-}
-[data-tippy-root] {
- max-width: calc(100vw - 10px);
-}
-.tippy-box {
- position: relative;
- background-color: var(--text-color);
- color: var(--header-bg);
- border-radius: 7px;
- font-size: 16px;
- line-height: 1.4;
- outline: 0;
- transition-property: transform, visibility, opacity;
- padding: 2px 4px;
- text-align: center;
- font-weight: 500;
-}
-.tippy-box[data-placement^='top'] > .tippy-arrow {
- bottom: 0;
-}
-.tippy-box[data-placement^='top'] > .tippy-arrow:before {
- bottom: -7px;
- left: 0;
- border-width: 8px 8px 0;
- border-top-color: var(--text-color);
- transform-origin: center top;
-}
-.tippy-box[data-placement^='bottom'] > .tippy-arrow {
- top: 0;
-}
-.tippy-box[data-placement^='bottom'] > .tippy-arrow:before {
- top: -7px;
- left: 0;
- border-width: 0 8px 8px;
- border-bottom-color: var(--text-color);
- transform-origin: center bottom;
-}
-.tippy-box[data-placement^='left'] > .tippy-arrow {
- right: 0;
-}
-.tippy-box[data-placement^='left'] > .tippy-arrow:before {
- border-width: 8px 0 8px 8px;
- border-left-color: var(--text-color);
- right: -7px;
- transform-origin: center left;
-}
-.tippy-box[data-placement^='right'] > .tippy-arrow {
- left: 0;
-}
-.tippy-box[data-placement^='right'] > .tippy-arrow:before {
- left: -7px;
- border-width: 8px 8px 8px 0;
- border-right-color: var(--text-color);
- transform-origin: center right;
-}
-.tippy-box[data-inertia][data-state='visible'] {
- transition-timing-function: cubic-bezier(0.54, 1.5, 0.38, 1.11);
-}
-.tippy-arrow {
- width: 16px;
- height: 16px;
- color: #333;
-}
-.tippy-arrow:before {
- content: '';
- position: absolute;
- border-color: transparent;
- border-style: solid;
-}
-.tippy-content {
- position: relative;
- padding: 5px 9px;
- z-index: 1;
- overflow-wrap: break-word;
-}
-.tippy-box[data-theme~='urlified'] {
- max-width: 200px;
- white-space: pre-wrap;
- color: var(--header-bg);
-
- a {
- color: var(--header-bg);
- }
-}
-
.lazy-loading {
@apply animate-pulse-fast bg-skin-border;
}
diff --git a/src/assets/css/tippy.scss b/src/assets/css/tippy.scss
new file mode 100644
index 000000000..0455b0265
--- /dev/null
+++ b/src/assets/css/tippy.scss
@@ -0,0 +1,87 @@
+// V-Tippy tooltip package styling - could be moved somewhere else?
+.tippy-box[data-animation='fade'][data-state='hidden'] {
+ opacity: 0;
+}
+[data-tippy-root] {
+ max-width: calc(100vw - 10px);
+}
+.tippy-box {
+ position: relative;
+ background-color: var(--text-color);
+ color: var(--header-bg);
+ border-radius: 7px;
+ font-size: 16px;
+ line-height: 1.4;
+ outline: 0;
+ transition-property: transform, visibility, opacity;
+ padding: 2px 4px;
+ text-align: center;
+ font-weight: 500;
+}
+.tippy-box[data-placement^='top'] > .tippy-arrow {
+ bottom: 0;
+}
+.tippy-box[data-placement^='top'] > .tippy-arrow:before {
+ bottom: -7px;
+ left: 0;
+ border-width: 8px 8px 0;
+ border-top-color: var(--text-color);
+ transform-origin: center top;
+}
+.tippy-box[data-placement^='bottom'] > .tippy-arrow {
+ top: 0;
+}
+.tippy-box[data-placement^='bottom'] > .tippy-arrow:before {
+ top: -7px;
+ left: 0;
+ border-width: 0 8px 8px;
+ border-bottom-color: var(--text-color);
+ transform-origin: center bottom;
+}
+.tippy-box[data-placement^='left'] > .tippy-arrow {
+ right: 0;
+}
+.tippy-box[data-placement^='left'] > .tippy-arrow:before {
+ border-width: 8px 0 8px 8px;
+ border-left-color: var(--text-color);
+ right: -7px;
+ transform-origin: center left;
+}
+.tippy-box[data-placement^='right'] > .tippy-arrow {
+ left: 0;
+}
+.tippy-box[data-placement^='right'] > .tippy-arrow:before {
+ left: -7px;
+ border-width: 8px 8px 8px 0;
+ border-right-color: var(--text-color);
+ transform-origin: center right;
+}
+.tippy-box[data-inertia][data-state='visible'] {
+ transition-timing-function: cubic-bezier(0.54, 1.5, 0.38, 1.11);
+}
+.tippy-arrow {
+ width: 16px;
+ height: 16px;
+ color: #333;
+}
+.tippy-arrow:before {
+ content: '';
+ position: absolute;
+ border-color: transparent;
+ border-style: solid;
+}
+.tippy-content {
+ position: relative;
+ padding: 5px 9px;
+ z-index: 1;
+ overflow-wrap: break-word;
+}
+.tippy-box[data-theme~='urlified'] {
+ max-width: 200px;
+ white-space: pre-wrap;
+ color: var(--header-bg);
+
+ a {
+ color: var(--header-bg);
+ }
+}
diff --git a/src/assets/css/tune.scss b/src/assets/css/tune.scss
new file mode 100644
index 000000000..fd6ccbc99
--- /dev/null
+++ b/src/assets/css/tune.scss
@@ -0,0 +1,181 @@
+.tune-input {
+ @apply form-input rounded-full border-skin-border bg-transparent text-base text-skin-link focus:border-skin-text focus:outline-none focus:ring-0;
+}
+
+.tune-textarea {
+ @extend .tune-input;
+ @apply no-scrollbar rounded-3xl px-3;
+
+ &.disabled {
+ @apply cursor-not-allowed;
+ }
+}
+
+.tune-textarea-json {
+ @apply no-scrollbar overflow-x-scroll whitespace-pre;
+
+ &.disabled {
+ @apply cursor-not-allowed;
+ }
+}
+
+.tune-switch {
+ @apply border-transparent;
+
+ &.switched-on-bg {
+ @apply bg-green;
+ }
+ &.switched-off-bg {
+ @apply bg-skin-border;
+ }
+
+ &.switched-on-text {
+ @apply text-green;
+ }
+ &.switched-off-text {
+ @apply text-skin-text;
+ }
+}
+
+.tune-switch-button {
+ @apply bg-skin-bg;
+}
+
+.tune-input-loading {
+ @apply rounded-r-full bg-skin-bg;
+}
+
+.tune-button {
+ @apply flex h-[42px] cursor-pointer justify-center rounded-full border border-skin-border px-3 py-2 hover:border-skin-text disabled:cursor-not-allowed;
+
+ &.primary {
+ @apply border-skin-primary bg-skin-primary text-white;
+ }
+
+ &.disabled {
+ @apply border-skin-border bg-skin-bg text-skin-border;
+ }
+}
+
+.tune-button-select {
+ @apply relative flex w-full justify-start truncate pl-3 pr-5 text-left text-base text-skin-link rounded-full;
+
+ &.disabled {
+ @apply cursor-not-allowed border-skin-border;
+ }
+}
+
+.tune-input-duration {
+ @apply rounded-full border border-skin-border px-3 text-base text-skin-link focus-within:border-skin-text;
+ &.disabled {
+ @apply cursor-not-allowed;
+ }
+}
+
+.tune-input-duration-label {
+ @apply text-skin-text;
+}
+
+.tune-select {
+ @apply text-left;
+
+ &.disabled {
+ @apply cursor-not-allowed;
+ }
+}
+
+.tune-listbox-button {
+ @apply rounded-full border border-skin-border text-base text-skin-link hover:border-skin-text;
+
+ &.disabled {
+ @apply hover:border-skin-border;
+ }
+
+ &.error {
+ @apply border-red;
+ }
+}
+
+.tune-listbox-options {
+ @apply rounded-md border border-skin-border bg-skin-bg shadow-lg;
+}
+
+.tune-listbox-item {
+ &.selected {
+ @apply text-skin-link;
+ }
+ &.disabled {
+ @apply text-skin-border;
+ }
+ &.active {
+ @apply bg-skin-border;
+ }
+}
+
+.tune-listbox-placeholder {
+ @apply text-skin-text opacity-60;
+}
+
+.tune-label {
+ @apply font-sans text-skin-text;
+}
+
+.tune-sublabel {
+ @apply font-sans text-sm text-skin-text opacity-60;
+}
+
+.tune-icon-hint {
+ @apply text-sm hover:text-skin-link;
+}
+
+.tune-error-text {
+ @apply font-sans text-sm text-red;
+}
+
+.tune-error-border {
+ @apply border-red;
+}
+
+.tune-tag {
+ @apply rounded-md border border-skin-border bg-skin-border px-2 py-1 text-sm text-skin-text;
+}
+
+.tune-menu-list {
+ @apply rounded-md border border-skin-border bg-skin-header-bg shadow-lg;
+}
+
+.tune-menu-list-item {
+ @apply bg-skin-header-bg text-skin-text;
+
+ &.active {
+ @apply bg-skin-border text-skin-link;
+ }
+}
+
+.tune-popover {
+ @apply rounded-md border bg-skin-header-bg shadow-lg;
+}
+
+.tune-modal-panel {
+ @apply rounded-md border border-skin-border bg-skin-bg p-4 sm:w-[440px];
+}
+
+.tune-modal-backdrop {
+ @apply bg-skin-border opacity-70;
+}
+
+.tune-modal-title {
+ @apply text-center text-lg font-medium text-skin-text;
+}
+
+.tune-input-checkbox {
+ @apply form-checkbox h-[20px] w-[20px] rounded-lg border-skin-text bg-skin-bg text-skin-primary focus:ring-0 focus:ring-offset-0 focus-visible:ring-offset-1 focus-visible:ring-offset-skin-text;
+}
+
+.tune-input-radio {
+ @apply form-radio h-[20px] w-[20px] rounded-full border-skin-text bg-skin-bg text-skin-primary focus:ring-0 focus:ring-offset-0 focus-visible:ring-offset-1 focus-visible:ring-offset-skin-text;
+}
+
+.tune-form-array-objects {
+ @apply rounded-xl border p-3;
+}
diff --git a/src/assets/icons/spinner.svg b/src/assets/icons/spinner.svg
new file mode 100644
index 000000000..ccb5e4da3
--- /dev/null
+++ b/src/assets/icons/spinner.svg
@@ -0,0 +1 @@
+
-
diff --git a/src/components/BaseProgressBar.vue b/src/components/BaseProgressBar.vue
index a6d9ec357..afdb0477b 100644
--- a/src/components/BaseProgressBar.vue
+++ b/src/components/BaseProgressBar.vue
@@ -7,7 +7,7 @@ defineProps<{ value: number }>();