From b8f919f252e62635b3779d6c76a6283df26cd579 Mon Sep 17 00:00:00 2001
From: "Samuel M. Bednarz" <samuelmorkbednarz@gmail.com>
Date: Tue, 10 Sep 2024 16:01:57 +0200
Subject: [PATCH] Fixes issues with types for named accents

---
 packages/core/engine/defaults.ts    | 12 +++++++++++-
 packages/core/engine/generator.ts   |  4 ++--
 packages/core/engine/types/index.ts |  4 ++--
 packages/nobel/src/App.vue          | 11 +++++++++--
 4 files changed, 24 insertions(+), 7 deletions(-)

diff --git a/packages/core/engine/defaults.ts b/packages/core/engine/defaults.ts
index d0340ec..668c024 100644
--- a/packages/core/engine/defaults.ts
+++ b/packages/core/engine/defaults.ts
@@ -7,10 +7,20 @@ export const defaultSettings: UmbraSettings = {
   tints: [5, 10, 10, 10, 15, 15, 25, 15, 15, 15, 15, 25]
 }
 
+const warningAccent = {
+  name: 'warning',
+  color: '#ff0000'
+}
+
+const successAccent = {
+  name: 'success',
+  color: '#00ff00'
+}
+
 export const defaultScheme: UmbraScheme = {
   background: '#090233',
   foreground: '#ff5555',
-  accents: ['#5200ff'],
+  accents: ["#ffffff", warningAccent, successAccent],
   settings: defaultSettings,
   inversed: {
     background: '#ff5555',
diff --git a/packages/core/engine/generator.ts b/packages/core/engine/generator.ts
index d23a831..4cf509a 100644
--- a/packages/core/engine/generator.ts
+++ b/packages/core/engine/generator.ts
@@ -58,7 +58,7 @@ function replaceAtIndex(array: (number | string)[], index: number, value: string
   return newArray
 }
 
-function putAccentInRange(adjusted: UmbraAdjusted, accent: Accent | string, input: UmbraScheme) {
+function putAccentInRange(adjusted: UmbraAdjusted, accent: Partial<Accent> | string, input: UmbraScheme) {
   const isString = typeof accent === 'string'
   const color = isString ? accent : accent.color
   const insertion = input.settings?.insertion
@@ -74,7 +74,7 @@ function putAccentInRange(adjusted: UmbraAdjusted, accent: Accent | string, inpu
 function accents(input: UmbraScheme, adjusted: UmbraAdjusted) {
   const { background, foreground } = adjusted
 
-  function gen(accent: string | Accent) {
+  function gen(accent: string | Partial<Accent>) {
     const isString = typeof accent === 'string'
 
     const name = isString ? undefined : accent.name
diff --git a/packages/core/engine/types/index.ts b/packages/core/engine/types/index.ts
index ea2b2d1..6080b07 100644
--- a/packages/core/engine/types/index.ts
+++ b/packages/core/engine/types/index.ts
@@ -39,13 +39,13 @@ export interface UmbraScheme extends UmbraColors {
 export interface UmbraColors {
   background: string
   foreground: string
-  accents: string | string[]
+  accents: string | (string | Partial<Accent>)[]
 }
 
 export interface UmbraAdjusted {
   background: Colord
   foreground: Colord
-  accents: string[]
+  accents: (string | Partial<Accent>)[]
 }
 
 export interface UmbraSettings {
diff --git a/packages/nobel/src/App.vue b/packages/nobel/src/App.vue
index c862403..801e0d1 100644
--- a/packages/nobel/src/App.vue
+++ b/packages/nobel/src/App.vue
@@ -1,6 +1,10 @@
 <script setup lang="ts">
 import { ref } from 'vue'
 
+import { useRoute } from 'vue-router'
+
+// ...
+
 import IconHome from './components/Icons/IconHome.vue'
 import IconWidth from './components/Icons/IconWidth.vue'
 import IconPaint from './components/Icons/IconPaint.vue'
@@ -12,6 +16,9 @@ import TextScreen from './components/TextScreen.vue'
 
 import { umbra } from '@umbrajs/core'
 
+const route = useRoute()
+
+
 const inversed = ref(true)
 
 const warningAccent = {
@@ -40,7 +47,7 @@ function toggleTheme() {
 
 <template>
   <header>
-    <TextScreen>{{ $route.fullPath }}</TextScreen>
+    <TextScreen>{{ route.fullPath }}</TextScreen>
     <nav>
       <ButtonGroup>
         <RouterLink to="/" class="button focus small" activeClass="primary">
@@ -66,7 +73,7 @@ function toggleTheme() {
     </nav>
   </header>
   <main>
-    <router-view :key="$route.path"></router-view>
+    <router-view :key="route.path"></router-view>
   </main>
 </template>