Skip to content

Commit 57c115d

Browse files
nickmessingnickmessing
committed
feat(api): full API refactor + docs
1 parent a8cc467 commit 57c115d

File tree

232 files changed

+10091
-5171
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

232 files changed

+10091
-5171
lines changed

‎.gitignore

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -131,3 +131,5 @@ dist
131131

132132
# Development data folder
133133
.devdata
134+
135+
cache

‎.vscode/settings.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,5 +5,5 @@
55
"vue.complete.casing.tags": "pascal",
66
"typescript.preferences.importModuleSpecifier": "non-relative",
77
"typescript.tsdk": "node_modules/typescript/lib",
8-
"cSpell.words": ["composables", "Pinia", "Tinybase", "todos"]
8+
"cSpell.words": ["composables", "Pinia", "Tinybase", "todos", "wildcarded"]
99
}

‎package.json

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,8 @@
99
"dev": "run-p dev:*"
1010
},
1111
"devDependencies": {
12-
"npm-run-all2": "^6.1.2"
12+
"npm-run-all2": "^6.1.2",
13+
"vite": "^5.2.10",
14+
"vitest": "^1.6.0"
1315
}
1416
}

‎packages/private/docs/.vitepress/config.mts

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
import { defineConfig } from 'vitepress'
2+
3+
// https://vitepress.dev/reference/site-config
4+
export default defineConfig({
5+
title: 'Vue TinyBase',
6+
description: 'Vue + TinyBase Documentation',
7+
head: [['link', { rel: 'icon', href: '/logo.svg' }]],
8+
themeConfig: {
9+
logo: '/logo.svg',
10+
11+
nav: [
12+
{ text: 'Home', link: '/' },
13+
{ text: 'Guide', link: '/guide' },
14+
{ text: 'API', link: '/api' },
15+
],
16+
17+
sidebar: {
18+
'/api': [
19+
{
20+
text: 'Store',
21+
items: [
22+
{ text: 'Composables', link: '/api/store/composables' },
23+
{ text: 'Context', link: '/api/store/context' },
24+
{ text: 'Events', link: '/api/store/events' },
25+
{ text: 'Writable References', link: '/api/store/references' },
26+
],
27+
},
28+
{
29+
text: 'Common',
30+
items: [
31+
{ text: 'Composables', link: '/api/common/composables' },
32+
{ text: 'Types', link: '/api/common/types' },
33+
],
34+
},
35+
],
36+
},
37+
38+
socialLinks: [{ icon: 'github', link: 'https://github.com/nickmessing/vue-tinybase' }],
39+
40+
search: {
41+
provider: 'local',
42+
},
43+
},
44+
})

‎packages/private/docs/.vitepress/theme/components/DefaultStoreSwitch.vue

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
<script setup lang="ts">
2+
import { ref, watch } from 'vue'
3+
4+
const isDefaultStoreSelected = ref(localStorage.getItem('isDefaultStoreSelected') === 'true' || false)
5+
6+
watch(isDefaultStoreSelected, () => {
7+
localStorage.setItem('isDefaultStoreSelected', isDefaultStoreSelected.value.toString())
8+
if (isDefaultStoreSelected.value) {
9+
document.body.classList.add('default-store')
10+
document.body.classList.remove('custom-store')
11+
} else {
12+
document.body.classList.remove('default-store')
13+
document.body.classList.add('custom-store')
14+
}
15+
})
16+
</script>
17+
18+
<template>
19+
<input v-model="isDefaultStoreSelected" type="checkbox" id="default-store-switch" />
20+
</template>

‎packages/private/docs/.vitepress/theme/components/MyLayout.vue

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
<script setup>
2+
import DefaultTheme from 'vitepress/theme'
3+
import VPSwitchStoreStyle from './VPSwitchStoreStyle.vue'
4+
5+
const { Layout } = DefaultTheme
6+
</script>
7+
8+
<template>
9+
<Layout>
10+
<template #sidebar-nav-before>
11+
<VPSwitchStoreStyle />
12+
</template>
13+
</Layout>
14+
</template>

‎packages/private/docs/.vitepress/theme/components/VPSwitch.vue

Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,65 @@
1+
<!-- Copied from https://github.com/vuejs/vitepress/blob/8fef47848bd3418014b06eea1337b1e66e0473c6/src/client/theme-default/components/VPSwitch.vue -->
2+
3+
<template>
4+
<button class="VPSwitch" type="button" role="switch">
5+
<span class="check">
6+
<span class="icon" v-if="$slots.default">
7+
<slot />
8+
</span>
9+
</span>
10+
</button>
11+
</template>
12+
13+
<style scoped>
14+
.VPSwitch {
15+
position: relative;
16+
border-radius: 11px;
17+
display: block;
18+
width: 40px;
19+
height: 22px;
20+
flex-shrink: 0;
21+
border: 1px solid var(--vp-input-border-color);
22+
background-color: var(--vp-input-switch-bg-color);
23+
transition: border-color 0.25s !important;
24+
}
25+
26+
.VPSwitch:hover {
27+
border-color: var(--vp-c-brand-1);
28+
}
29+
30+
.check {
31+
position: absolute;
32+
top: 1px;
33+
/*rtl:ignore*/
34+
left: 1px;
35+
width: 18px;
36+
height: 18px;
37+
border-radius: 50%;
38+
background-color: var(--vp-c-neutral-inverse);
39+
box-shadow: var(--vp-shadow-1);
40+
transition: transform 0.25s !important;
41+
}
42+
43+
.icon {
44+
position: relative;
45+
display: block;
46+
width: 18px;
47+
height: 18px;
48+
border-radius: 50%;
49+
overflow: hidden;
50+
}
51+
52+
.icon :deep([class^='vpi-']) {
53+
position: absolute;
54+
top: 3px;
55+
left: 3px;
56+
width: 12px;
57+
height: 12px;
58+
color: var(--vp-c-text-2);
59+
}
60+
61+
.dark .icon :deep([class^='vpi-']) {
62+
color: var(--vp-c-text-1);
63+
transition: opacity 0.25s !important;
64+
}
65+
</style>

‎packages/private/docs/.vitepress/theme/components/VPSwitchStoreStyle.vue

Lines changed: 78 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,78 @@
1+
<script lang="ts" setup>
2+
// copy/pasted from https://github.com/vuejs/vitepress/blob/8fef47848bd3418014b06eea1337b1e66e0473c6/src/client/theme-default/components/VPSwitchAppearance.vue
3+
// minor modifications
4+
import { watch, ref } from 'vue'
5+
import VPSwitch from './VPSwitch.vue'
6+
7+
const isDefaultStoreSelected = ref(localStorage.getItem('isDefaultStoreSelected') !== 'false')
8+
9+
watch(
10+
isDefaultStoreSelected,
11+
() => {
12+
localStorage.setItem('isDefaultStoreSelected', isDefaultStoreSelected.value.toString())
13+
if (isDefaultStoreSelected.value) {
14+
document.body.classList.add('default-store')
15+
document.body.classList.remove('custom-store')
16+
} else {
17+
document.body.classList.remove('default-store')
18+
document.body.classList.add('custom-store')
19+
}
20+
},
21+
{ immediate: true },
22+
)
23+
</script>
24+
25+
<template>
26+
<div class="store-style-switch-container">
27+
<h2>Store type</h2>
28+
<div class="store-style-switch">
29+
<span class="store-style-default">Default</span>
30+
<VPSwitch
31+
class="VPSwitchStoreStyle"
32+
:aria-checked="isDefaultStoreSelected"
33+
@click="isDefaultStoreSelected = !isDefaultStoreSelected"
34+
/>
35+
<span class="store-style-custom">Multiple</span>
36+
</div>
37+
</div>
38+
</template>
39+
40+
<style>
41+
.store-style-switch-container {
42+
display: flex;
43+
flex-direction: column;
44+
gap: 8px;
45+
align-items: stretch;
46+
margin-top: 16px;
47+
padding: 8px;
48+
background-color: hsla(0, 0%, 100%, 0.2);
49+
border-radius: 8px;
50+
}
51+
52+
.store-style-switch-container h2 {
53+
font-size: 13px;
54+
font-weight: 700;
55+
}
56+
57+
.store-style-switch {
58+
display: flex;
59+
flex-direction: row;
60+
align-items: center;
61+
justify-content: space-between;
62+
font-size: 12px;
63+
}
64+
65+
body.custom-store .store-style-custom,
66+
body.default-store .store-style-default {
67+
font-weight: 700;
68+
}
69+
70+
body.custom-store .hide-custom-store,
71+
body.default-store .hide-default-store {
72+
display: none;
73+
}
74+
75+
.custom-store .VPSwitchStoreStyle .check {
76+
transform: translateX(18px);
77+
}
78+
</style>

‎packages/private/docs/.vitepress/theme/index.mts

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
import DefaultTheme from 'vitepress/theme'
2+
import MyLayout from './components/MyLayout.vue'
3+
4+
import './styles/index.css'
5+
6+
export default {
7+
extends: DefaultTheme,
8+
Layout: MyLayout,
9+
}

‎packages/private/docs/.vitepress/theme/styles/index.css

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
:root {
2+
--vp-c-brand-1: hsl(338, 78%, 48%);
3+
--vp-c-brand-2: hsl(338, 61%, 26%);
4+
--vp-c-brand-3: hsl(338, 55%, 10%);
5+
--vp-c-brand-soft: hsla(338, 61%, 26%, 0.14);
6+
}
7+
8+
.blue {
9+
color: hsl(215, 78%, 48%);
10+
}

0 commit comments

Comments
 (0)