diff --git a/showbits-thermal-printer-ui/src/App.vue b/showbits-thermal-printer-ui/src/App.vue
index 2104671..30c7479 100644
--- a/showbits-thermal-printer-ui/src/App.vue
+++ b/showbits-thermal-printer-ui/src/App.vue
@@ -1,11 +1,11 @@
 <script setup lang="ts">
-import CSegment from "./components/CSegment.vue";
+import CSelector from "./components/CSelector.vue";
 </script>
 
 <template>
   <div class="scroll">
     <div class="strip">
-      <CSegment />
+      <CSelector />
     </div>
   </div>
 </template>
diff --git a/showbits-thermal-printer-ui/src/components/CSegmentCalendar.vue b/showbits-thermal-printer-ui/src/components/CDocumentCalendar.vue
similarity index 93%
rename from showbits-thermal-printer-ui/src/components/CSegmentCalendar.vue
rename to showbits-thermal-printer-ui/src/components/CDocumentCalendar.vue
index aeced05..bf91e8c 100644
--- a/showbits-thermal-printer-ui/src/components/CSegmentCalendar.vue
+++ b/showbits-thermal-printer-ui/src/components/CDocumentCalendar.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { useApiRequest } from "@/apiRequest";
 import { ref } from "vue";
-import CSegmentError from "./CSegmentError.vue";
+import CError from "./CError.vue";
 
 const { disabled, error, makeRequest } = useApiRequest();
 
@@ -50,7 +50,7 @@ function submit() {
     <label><input v-model="feed" type="checkbox" :disabled /> Feed</label>
 
     <button :disabled>Print</button>
-    <CSegmentError :message="error" />
+    <CError :message="error" />
   </form>
 </template>
 
diff --git a/showbits-thermal-printer-ui/src/components/CSegmentCells.vue b/showbits-thermal-printer-ui/src/components/CDocumentCells.vue
similarity index 95%
rename from showbits-thermal-printer-ui/src/components/CSegmentCells.vue
rename to showbits-thermal-printer-ui/src/components/CDocumentCells.vue
index 91ea764..6fc83a7 100644
--- a/showbits-thermal-printer-ui/src/components/CSegmentCells.vue
+++ b/showbits-thermal-printer-ui/src/components/CDocumentCells.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { useApiRequest } from "@/apiRequest";
 import { ref } from "vue";
-import CSegmentError from "./CSegmentError.vue";
+import CError from "./CError.vue";
 
 const { disabled, error, makeRequest } = useApiRequest();
 
@@ -71,7 +71,7 @@ function submit() {
     </div>
 
     <button :disabled>Print</button>
-    <CSegmentError :message="error" />
+    <CError :message="error" />
   </form>
 </template>
 
diff --git a/showbits-thermal-printer-ui/src/components/CSegmentChat.vue b/showbits-thermal-printer-ui/src/components/CDocumentChat.vue
similarity index 95%
rename from showbits-thermal-printer-ui/src/components/CSegmentChat.vue
rename to showbits-thermal-printer-ui/src/components/CDocumentChat.vue
index 9d76c23..e7cf222 100644
--- a/showbits-thermal-printer-ui/src/components/CSegmentChat.vue
+++ b/showbits-thermal-printer-ui/src/components/CDocumentChat.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { useApiRequest } from "@/apiRequest";
 import { ref, useTemplateRef } from "vue";
-import CSegmentError from "./CSegmentError.vue";
+import CError from "./CError.vue";
 
 const { disabled, error, makeRequest } = useApiRequest();
 const form = useTemplateRef<HTMLFormElement>("form");
@@ -56,7 +56,7 @@ function submit() {
     <label><input v-model="feed" type="checkbox" :disabled /> Feed</label>
 
     <button :disabled>Print</button>
-    <CSegmentError :message="error" />
+    <CError :message="error" />
   </form>
 </template>
 
diff --git a/showbits-thermal-printer-ui/src/components/CSegmentEgg.vue b/showbits-thermal-printer-ui/src/components/CDocumentEgg.vue
similarity index 94%
rename from showbits-thermal-printer-ui/src/components/CSegmentEgg.vue
rename to showbits-thermal-printer-ui/src/components/CDocumentEgg.vue
index 6ebc441..a3ab706 100644
--- a/showbits-thermal-printer-ui/src/components/CSegmentEgg.vue
+++ b/showbits-thermal-printer-ui/src/components/CDocumentEgg.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { useApiRequest } from "@/apiRequest";
 import { ref } from "vue";
-import CSegmentError from "./CSegmentError.vue";
+import CError from "./CError.vue";
 
 const { disabled, error, makeRequest } = useApiRequest();
 
@@ -54,7 +54,7 @@ function submit() {
     <label><input v-model="feed" type="checkbox" :disabled /> Feed</label>
 
     <button :disabled>Print</button>
-    <CSegmentError :message="error" />
+    <CError :message="error" />
   </form>
 </template>
 
diff --git a/showbits-thermal-printer-ui/src/components/CSegmentImage.vue b/showbits-thermal-printer-ui/src/components/CDocumentImage.vue
similarity index 95%
rename from showbits-thermal-printer-ui/src/components/CSegmentImage.vue
rename to showbits-thermal-printer-ui/src/components/CDocumentImage.vue
index 854395b..ebf844d 100644
--- a/showbits-thermal-printer-ui/src/components/CSegmentImage.vue
+++ b/showbits-thermal-printer-ui/src/components/CDocumentImage.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { useApiRequest } from "@/apiRequest";
 import { ref, useTemplateRef } from "vue";
-import CSegmentError from "./CSegmentError.vue";
+import CError from "./CError.vue";
 
 const { disabled, error, makeRequest } = useApiRequest();
 const image = useTemplateRef<HTMLInputElement>("image");
@@ -63,7 +63,7 @@ function submit() {
     </div>
 
     <button :disabled>Print</button>
-    <CSegmentError :message="error" />
+    <CError :message="error" />
   </form>
 </template>
 
diff --git a/showbits-thermal-printer-ui/src/components/CSegmentText.vue b/showbits-thermal-printer-ui/src/components/CDocumentText.vue
similarity index 95%
rename from showbits-thermal-printer-ui/src/components/CSegmentText.vue
rename to showbits-thermal-printer-ui/src/components/CDocumentText.vue
index 7046bea..56a9eb6 100644
--- a/showbits-thermal-printer-ui/src/components/CSegmentText.vue
+++ b/showbits-thermal-printer-ui/src/components/CDocumentText.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { useApiRequest } from "@/apiRequest";
 import { computed, ref, type StyleValue, useTemplateRef } from "vue";
-import CSegmentError from "./CSegmentError.vue";
+import CError from "./CError.vue";
 
 const { disabled, error, makeRequest } = useApiRequest();
 const form = useTemplateRef<HTMLFormElement>("form");
@@ -54,7 +54,7 @@ function submit() {
     </div>
 
     <button :disabled>Print</button>
-    <CSegmentError :message="error" />
+    <CError :message="error" />
   </form>
 </template>
 
diff --git a/showbits-thermal-printer-ui/src/components/CSegmentTictactoe.vue b/showbits-thermal-printer-ui/src/components/CDocumentTictactoe.vue
similarity index 90%
rename from showbits-thermal-printer-ui/src/components/CSegmentTictactoe.vue
rename to showbits-thermal-printer-ui/src/components/CDocumentTictactoe.vue
index c67a6cd..59d9bef 100644
--- a/showbits-thermal-printer-ui/src/components/CSegmentTictactoe.vue
+++ b/showbits-thermal-printer-ui/src/components/CDocumentTictactoe.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { useApiRequest } from "@/apiRequest";
 import { ref } from "vue";
-import CSegmentError from "./CSegmentError.vue";
+import CError from "./CError.vue";
 
 const { disabled, error, makeRequest } = useApiRequest();
 
@@ -29,7 +29,7 @@ function submit() {
     <label><input v-model="feed" type="checkbox" :disabled /> Feed</label>
 
     <button :disabled>Print</button>
-    <CSegmentError :message="error" />
+    <CError :message="error" />
   </form>
 </template>
 
diff --git a/showbits-thermal-printer-ui/src/components/CSegmentError.vue b/showbits-thermal-printer-ui/src/components/CError.vue
similarity index 100%
rename from showbits-thermal-printer-ui/src/components/CSegmentError.vue
rename to showbits-thermal-printer-ui/src/components/CError.vue
diff --git a/showbits-thermal-printer-ui/src/components/CSegment.vue b/showbits-thermal-printer-ui/src/components/CSelector.vue
similarity index 65%
rename from showbits-thermal-printer-ui/src/components/CSegment.vue
rename to showbits-thermal-printer-ui/src/components/CSelector.vue
index 8475ca1..9d2faa2 100644
--- a/showbits-thermal-printer-ui/src/components/CSegment.vue
+++ b/showbits-thermal-printer-ui/src/components/CSelector.vue
@@ -1,12 +1,12 @@
 <script setup lang="ts">
 import { ref } from "vue";
-import CSegmentCalendar from "./CSegmentCalendar.vue";
-import CSegmentEgg from "./CSegmentEgg.vue";
-import CSegmentText from "./CSegmentText.vue";
-import CSegmentTictactoe from "./CSegmentTictactoe.vue";
-import CSegmentCells from "./CSegmentCells.vue";
-import CSegmentChat from "./CSegmentChat.vue";
-import CSegmentImage from "./CSegmentImage.vue";
+import CDocumentCalendar from "./CDocumentCalendar.vue";
+import CDocumentCells from "./CDocumentCells.vue";
+import CDocumentChat from "./CDocumentChat.vue";
+import CDocumentEgg from "./CDocumentEgg.vue";
+import CDocumentImage from "./CDocumentImage.vue";
+import CDocumentText from "./CDocumentText.vue";
+import CDocumentTictactoe from "./CDocumentTictactoe.vue";
 
 const mode = ref<
   "calendar" | "chat" | "cells" | "egg" | "image" | "text" | "tictactoe"
@@ -16,13 +16,13 @@ const mode = ref<
 <template>
   <div class="outer">
     <button v-if="mode" class="close" @click="mode = undefined">X</button>
-    <CSegmentCalendar v-if="mode === 'calendar'" />
-    <CSegmentChat v-if="mode === 'chat'" />
-    <CSegmentCells v-if="mode === 'cells'" />
-    <CSegmentEgg v-if="mode === 'egg'" />
-    <CSegmentImage v-if="mode === 'image'" />
-    <CSegmentText v-if="mode === 'text'" />
-    <CSegmentTictactoe v-if="mode === 'tictactoe'" />
+    <CDocumentCalendar v-if="mode === 'calendar'" />
+    <CDocumentChat v-if="mode === 'chat'" />
+    <CDocumentCells v-if="mode === 'cells'" />
+    <CDocumentEgg v-if="mode === 'egg'" />
+    <CDocumentImage v-if="mode === 'image'" />
+    <CDocumentText v-if="mode === 'text'" />
+    <CDocumentTictactoe v-if="mode === 'tictactoe'" />
     <hr v-if="mode !== undefined" />
     <section>
       <p>What do you want to print?</p>