@koehler8/cms 1.0.0-beta.14 → 1.0.0-beta.15
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/src/components/Home.vue +8 -52
package/package.json
CHANGED
package/src/components/Home.vue
CHANGED
|
@@ -10,21 +10,6 @@
|
|
|
10
10
|
:key="entry.key"
|
|
11
11
|
v-bind="entry.props"
|
|
12
12
|
/>
|
|
13
|
-
<div
|
|
14
|
-
v-if="showLoadingIndicator"
|
|
15
|
-
class="page-loading-placeholder"
|
|
16
|
-
role="status"
|
|
17
|
-
aria-live="polite"
|
|
18
|
-
>
|
|
19
|
-
Loading…
|
|
20
|
-
</div>
|
|
21
|
-
<div
|
|
22
|
-
v-else-if="loadErrorMessage"
|
|
23
|
-
class="page-error-message"
|
|
24
|
-
role="alert"
|
|
25
|
-
>
|
|
26
|
-
{{ loadErrorMessage }}
|
|
27
|
-
</div>
|
|
28
13
|
</main>
|
|
29
14
|
<ComingSoonModal
|
|
30
15
|
:open="isComingSoonVisible"
|
|
@@ -35,7 +20,7 @@
|
|
|
35
20
|
</template>
|
|
36
21
|
|
|
37
22
|
<script setup>
|
|
38
|
-
import { computed, nextTick,
|
|
23
|
+
import { computed, nextTick, provide, watch } from 'vue';
|
|
39
24
|
|
|
40
25
|
import ComingSoonModal from '../components/ComingSoonModal.vue';
|
|
41
26
|
import IntroGate from '../components/IntroGate.vue';
|
|
@@ -106,25 +91,13 @@ provide('pageContent', pageContent);
|
|
|
106
91
|
provide('pageConfig', currentPage);
|
|
107
92
|
provide('currentPageId', computed(() => currentPage.value.id));
|
|
108
93
|
|
|
109
|
-
//
|
|
110
|
-
//
|
|
111
|
-
//
|
|
112
|
-
//
|
|
113
|
-
//
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
nextTick().then(() => {
|
|
117
|
-
isHydrating.value = false;
|
|
118
|
-
});
|
|
119
|
-
});
|
|
120
|
-
|
|
121
|
-
const showLoadingIndicator = computed(() =>
|
|
122
|
-
!isHydrating.value &&
|
|
123
|
-
isLoading.value &&
|
|
124
|
-
componentKeys.value.length === 0 &&
|
|
125
|
-
!loadError.value
|
|
126
|
-
);
|
|
127
|
-
const loadErrorMessage = computed(() => loadError.value ? (loadError.value.message || 'Unable to load page content.') : '');
|
|
94
|
+
// Loading + error state are exposed via inject so sites can build their
|
|
95
|
+
// own preloader / error surface as a component (e.g. site/components/
|
|
96
|
+
// Preloader.vue or the bundled Preloader). Home itself no longer renders
|
|
97
|
+
// any built-in placeholder UI — sites that want one opt in by listing a
|
|
98
|
+
// preloader component in their pages/{pageId}.json `components[]`.
|
|
99
|
+
provide('pageIsLoading', isLoading);
|
|
100
|
+
provide('pageLoadError', loadError);
|
|
128
101
|
|
|
129
102
|
watch(componentKeys, async () => {
|
|
130
103
|
await nextTick();
|
|
@@ -142,20 +115,3 @@ watch(
|
|
|
142
115
|
);
|
|
143
116
|
</script>
|
|
144
117
|
|
|
145
|
-
<style scoped>
|
|
146
|
-
.page-loading-placeholder,
|
|
147
|
-
.page-error-message {
|
|
148
|
-
display: flex;
|
|
149
|
-
align-items: center;
|
|
150
|
-
justify-content: center;
|
|
151
|
-
min-height: 40vh;
|
|
152
|
-
font-size: 1.125rem;
|
|
153
|
-
font-weight: 600;
|
|
154
|
-
color: #111;
|
|
155
|
-
text-align: center;
|
|
156
|
-
}
|
|
157
|
-
|
|
158
|
-
.page-error-message {
|
|
159
|
-
color: #b00020;
|
|
160
|
-
}
|
|
161
|
-
</style>
|