feat: update themes to use ThemeConfig

Sergey Onufrienko created 2 years ago

Change summary

styles/src/themes/andromeda/andromeda.ts               | 13 +++-
styles/src/themes/atelier/atelier-cave-dark.ts         | 16 ++--
styles/src/themes/atelier/atelier-cave-light.ts        | 16 ++--
styles/src/themes/atelier/atelier-dune-dark.ts         | 16 ++--
styles/src/themes/atelier/atelier-dune-light.ts        | 16 ++--
styles/src/themes/atelier/atelier-estuary-dark.ts      | 16 ++--
styles/src/themes/atelier/atelier-estuary-light.ts     | 14 ++--
styles/src/themes/atelier/atelier-forest-dark.ts       | 16 ++--
styles/src/themes/atelier/atelier-forest-light.ts      | 16 ++--
styles/src/themes/atelier/atelier-heath-dark.ts        | 16 ++--
styles/src/themes/atelier/atelier-heath-light.ts       | 16 ++--
styles/src/themes/atelier/atelier-lakeside-dark.ts     | 16 ++--
styles/src/themes/atelier/atelier-lakeside-light.ts    | 16 ++--
styles/src/themes/atelier/atelier-plateau-dark.ts      | 16 ++--
styles/src/themes/atelier/atelier-plateau-light.ts     | 14 ++--
styles/src/themes/atelier/atelier-savanna-dark.ts      | 16 ++--
styles/src/themes/atelier/atelier-savanna-light.ts     | 16 ++--
styles/src/themes/atelier/atelier-seaside-dark.ts      | 16 ++--
styles/src/themes/atelier/atelier-seaside-light.ts     | 16 ++--
styles/src/themes/atelier/atelier-sulphurpool-dark.ts  | 16 ++--
styles/src/themes/atelier/atelier-sulphurpool-light.ts | 16 ++--
styles/src/themes/atelier/common.ts                    |  2 
styles/src/themes/ayu/ayu-dark.ts                      | 17 +++--
styles/src/themes/ayu/ayu-light.ts                     | 17 +++--
styles/src/themes/ayu/ayu-mirage.ts                    | 17 +++--
styles/src/themes/gruvbox/gruvbox-common.ts            | 35 +++++++----
styles/src/themes/one/one-dark.ts                      | 19 +++++-
styles/src/themes/one/one-light.ts                     | 19 +++++-
styles/src/themes/rose-pine/rose-pine-dawn.ts          | 13 +++-
styles/src/themes/rose-pine/rose-pine-moon.ts          | 13 +++-
styles/src/themes/rose-pine/rose-pine.ts               | 13 +++-
styles/src/themes/sandcastle/sandcastle.ts             | 13 +++-
styles/src/themes/solarized/solarized.ts               | 24 ++++++--
styles/src/themes/summercamp/summercamp.ts             | 12 +++-
34 files changed, 310 insertions(+), 233 deletions(-)

Detailed changes

styles/src/themes/andromeda/andromeda.ts

@@ -1,6 +1,5 @@
 import chroma from "chroma-js"
-import { Meta } from "../common/colorScheme"
-import { colorRamp, createColorScheme } from "../common/ramps"
+import { Meta, colorRamp, createColorScheme, ThemeAppearance } from "../common"
 
 const name = "Andromeda"
 
@@ -27,8 +26,6 @@ const ramps = {
     magenta: colorRamp(chroma("#C74DED")),
 }
 
-export const dark = createColorScheme(name, false, ramps)
-
 export const meta: Meta = {
     name,
     author: "EliverLara",
@@ -37,3 +34,11 @@ export const meta: Meta = {
     },
     url: "https://github.com/EliverLara/Andromeda",
 }
+
+export const dark = createColorScheme({
+    name: meta.name,
+    author: meta.author,
+    appearance: ThemeAppearance.Dark,
+    inputColor: ramps,
+    override: { syntax: {} },
+})

styles/src/themes/atelier/atelier-cave-dark.ts

@@ -1,6 +1,5 @@
 import chroma from "chroma-js"
-import { Meta } from "../common/colorScheme"
-import { colorRamp, createColorScheme } from "../common/ramps"
+import { Meta, colorRamp, createColorScheme, ThemeAppearance } from "../common"
 import { metaCommon, name, buildSyntax, Variant } from "./common"
 
 const variant: Variant = {
@@ -34,10 +33,11 @@ const syntax = buildSyntax(variant)
 const theme = (variant: Variant) => {
     const { meta, colors } = variant
 
-    return createColorScheme(
-        meta.name,
-        false,
-        {
+    return createColorScheme({
+        name: meta.name,
+        author: meta.author,
+        appearance: ThemeAppearance.Dark,
+        inputColor: {
             neutral: chroma.scale([
                 colors.base00,
                 colors.base01,
@@ -57,8 +57,8 @@ const theme = (variant: Variant) => {
             violet: colorRamp(chroma(colors.base0E)),
             magenta: colorRamp(chroma(colors.base0F)),
         },
-        syntax
-    )
+        override: { syntax },
+    })
 }
 
 export const dark = theme(variant)

styles/src/themes/atelier/atelier-cave-light.ts

@@ -1,6 +1,5 @@
 import chroma from "chroma-js"
-import { Meta } from "../common/colorScheme"
-import { colorRamp, createColorScheme } from "../common/ramps"
+import { Meta, colorRamp, createColorScheme, ThemeAppearance } from "../common"
 import { metaCommon, name, buildSyntax, Variant } from "./common"
 
 const variant: Variant = {
@@ -34,10 +33,11 @@ const syntax = buildSyntax(variant)
 const theme = (variant: Variant) => {
     const { meta, colors } = variant
 
-    return createColorScheme(
-        meta.name,
-        true,
-        {
+    return createColorScheme({
+        name: meta.name,
+        author: meta.author,
+        appearance: ThemeAppearance.Light,
+        inputColor: {
             neutral: chroma.scale(
                 [
                     colors.base00,
@@ -59,8 +59,8 @@ const theme = (variant: Variant) => {
             violet: colorRamp(chroma(colors.base0E)),
             magenta: colorRamp(chroma(colors.base0F)),
         },
-        syntax
-    )
+        override: { syntax },
+    })
 }
 
 export const dark = theme(variant)

styles/src/themes/atelier/atelier-dune-dark.ts

@@ -1,6 +1,5 @@
 import chroma from "chroma-js"
-import { Meta } from "../common/colorScheme"
-import { colorRamp, createColorScheme } from "../common/ramps"
+import { Meta, colorRamp, createColorScheme, ThemeAppearance } from "../common"
 import { metaCommon, name, buildSyntax, Variant } from "./common"
 
 const variant: Variant = {
@@ -34,10 +33,11 @@ const syntax = buildSyntax(variant)
 const theme = (variant: Variant) => {
     const { meta, colors } = variant
 
-    return createColorScheme(
-        meta.name,
-        false,
-        {
+    return createColorScheme({
+        name: meta.name,
+        author: meta.author,
+        appearance: ThemeAppearance.Dark,
+        inputColor: {
             neutral: chroma.scale([
                 colors.base00,
                 colors.base01,
@@ -57,8 +57,8 @@ const theme = (variant: Variant) => {
             violet: colorRamp(chroma(colors.base0E)),
             magenta: colorRamp(chroma(colors.base0F)),
         },
-        syntax
-    )
+        override: { syntax },
+    })
 }
 
 export const dark = theme(variant)

styles/src/themes/atelier/atelier-dune-light.ts

@@ -1,6 +1,5 @@
 import chroma from "chroma-js"
-import { Meta } from "../common/colorScheme"
-import { colorRamp, createColorScheme } from "../common/ramps"
+import { Meta, colorRamp, createColorScheme, ThemeAppearance } from "../common"
 import { metaCommon, name, buildSyntax, Variant } from "./common"
 
 const variant: Variant = {
@@ -34,10 +33,11 @@ const syntax = buildSyntax(variant)
 const theme = (variant: Variant) => {
     const { meta, colors } = variant
 
-    return createColorScheme(
-        meta.name,
-        true,
-        {
+    return createColorScheme({
+        name: meta.name,
+        author: meta.author,
+        appearance: ThemeAppearance.Light,
+        inputColor: {
             neutral: chroma.scale(
                 [
                     colors.base00,
@@ -59,8 +59,8 @@ const theme = (variant: Variant) => {
             violet: colorRamp(chroma(colors.base0E)),
             magenta: colorRamp(chroma(colors.base0F)),
         },
-        syntax
-    )
+        override: { syntax },
+    })
 }
 
 export const dark = theme(variant)

styles/src/themes/atelier/atelier-estuary-dark.ts

@@ -1,6 +1,5 @@
 import chroma from "chroma-js"
-import { Meta } from "../common/colorScheme"
-import { colorRamp, createColorScheme } from "../common/ramps"
+import { Meta, colorRamp, createColorScheme, ThemeAppearance } from "../common"
 import { metaCommon, name, buildSyntax, Variant } from "./common"
 
 const variant: Variant = {
@@ -34,10 +33,11 @@ const syntax = buildSyntax(variant)
 const theme = (variant: Variant) => {
     const { meta, colors } = variant
 
-    return createColorScheme(
-        meta.name,
-        false,
-        {
+    return createColorScheme({
+        name: meta.name,
+        author: meta.author,
+        appearance: ThemeAppearance.Dark,
+        inputColor: {
             neutral: chroma.scale([
                 colors.base00,
                 colors.base01,
@@ -57,8 +57,8 @@ const theme = (variant: Variant) => {
             violet: colorRamp(chroma(colors.base0E)),
             magenta: colorRamp(chroma(colors.base0F)),
         },
-        syntax
-    )
+        override: { syntax },
+    })
 }
 
 export const dark = theme(variant)

styles/src/themes/atelier/atelier-estuary-light.ts

@@ -1,6 +1,5 @@
 import chroma from "chroma-js"
-import { Meta } from "../common/colorScheme"
-import { colorRamp, createColorScheme } from "../common/ramps"
+import { Meta, colorRamp, createColorScheme, ThemeAppearance } from "../common"
 import { metaCommon, name, buildSyntax, Variant } from "./common"
 
 const variant: Variant = {
@@ -34,10 +33,11 @@ const syntax = buildSyntax(variant)
 const theme = (variant: Variant) => {
     const { meta, colors } = variant
 
-    return createColorScheme(
-        meta.name,
-        true,
-        {
+    return createColorScheme({
+        name: meta.name,
+        author: meta.author,
+        appearance: ThemeAppearance.Light,
+        inputColor:{
             neutral: chroma.scale(
                 [
                     colors.base00,
@@ -59,7 +59,7 @@ const theme = (variant: Variant) => {
             violet: colorRamp(chroma(colors.base0E)),
             magenta: colorRamp(chroma(colors.base0F)),
         },
-        syntax
+        override: { syntax },}
     )
 }
 

styles/src/themes/atelier/atelier-forest-dark.ts

@@ -1,6 +1,5 @@
 import chroma from "chroma-js"
-import { Meta } from "../common/colorScheme"
-import { colorRamp, createColorScheme } from "../common/ramps"
+import { Meta, colorRamp, createColorScheme, ThemeAppearance } from "../common"
 import { metaCommon, name, buildSyntax, Variant } from "./common"
 
 const variant: Variant = {
@@ -34,10 +33,11 @@ const syntax = buildSyntax(variant)
 const theme = (variant: Variant) => {
     const { meta, colors } = variant
 
-    return createColorScheme(
-        meta.name,
-        false,
-        {
+    return createColorScheme({
+        name: meta.name,
+        author: meta.author,
+        appearance: ThemeAppearance.Dark,
+        inputColor: {
             neutral: chroma.scale([
                 colors.base00,
                 colors.base01,
@@ -57,8 +57,8 @@ const theme = (variant: Variant) => {
             violet: colorRamp(chroma(colors.base0E)),
             magenta: colorRamp(chroma(colors.base0F)),
         },
-        syntax
-    )
+        override: { syntax },
+    })
 }
 
 export const dark = theme(variant)

styles/src/themes/atelier/atelier-forest-light.ts

@@ -1,6 +1,5 @@
 import chroma from "chroma-js"
-import { Meta } from "../common/colorScheme"
-import { colorRamp, createColorScheme } from "../common/ramps"
+import { Meta, colorRamp, createColorScheme, ThemeAppearance } from "../common"
 import { metaCommon, name, buildSyntax, Variant } from "./common"
 
 const variant: Variant = {
@@ -34,10 +33,11 @@ const syntax = buildSyntax(variant)
 const theme = (variant: Variant) => {
     const { meta, colors } = variant
 
-    return createColorScheme(
-        meta.name,
-        true,
-        {
+    return createColorScheme({
+        name: meta.name,
+        author: meta.author,
+        appearance: ThemeAppearance.Dark,
+        inputColor: {
             neutral: chroma.scale(
                 [
                     colors.base00,
@@ -59,8 +59,8 @@ const theme = (variant: Variant) => {
             violet: colorRamp(chroma(colors.base0E)),
             magenta: colorRamp(chroma(colors.base0F)),
         },
-        syntax
-    )
+        override: { syntax },
+    })
 }
 
 export const dark = theme(variant)

styles/src/themes/atelier/atelier-heath-dark.ts

@@ -1,6 +1,5 @@
 import chroma from "chroma-js"
-import { Meta } from "../common/colorScheme"
-import { colorRamp, createColorScheme } from "../common/ramps"
+import { Meta, colorRamp, createColorScheme, ThemeAppearance } from "../common"
 import { metaCommon, name, buildSyntax, Variant } from "./common"
 
 const variant: Variant = {
@@ -34,10 +33,11 @@ const syntax = buildSyntax(variant)
 const theme = (variant: Variant) => {
     const { meta, colors } = variant
 
-    return createColorScheme(
-        meta.name,
-        false,
-        {
+    return createColorScheme({
+        name: meta.name,
+        author: meta.author,
+        appearance: ThemeAppearance.Dark,
+        inputColor: {
             neutral: chroma.scale([
                 colors.base00,
                 colors.base01,
@@ -57,8 +57,8 @@ const theme = (variant: Variant) => {
             violet: colorRamp(chroma(colors.base0E)),
             magenta: colorRamp(chroma(colors.base0F)),
         },
-        syntax
-    )
+        override: { syntax },
+    })
 }
 
 export const dark = theme(variant)

styles/src/themes/atelier/atelier-heath-light.ts

@@ -1,6 +1,5 @@
 import chroma from "chroma-js"
-import { Meta } from "../common/colorScheme"
-import { colorRamp, createColorScheme } from "../common/ramps"
+import { Meta, colorRamp, createColorScheme, ThemeAppearance } from "../common"
 import { metaCommon, name, buildSyntax, Variant } from "./common"
 
 const variant: Variant = {
@@ -34,10 +33,11 @@ const syntax = buildSyntax(variant)
 const theme = (variant: Variant) => {
     const { meta, colors } = variant
 
-    return createColorScheme(
-        meta.name,
-        true,
-        {
+    return createColorScheme({
+        name: meta.name,
+        author: meta.author,
+        appearance: ThemeAppearance.Light,
+        inputColor: {
             neutral: chroma.scale(
                 [
                     colors.base00,
@@ -59,8 +59,8 @@ const theme = (variant: Variant) => {
             violet: colorRamp(chroma(colors.base0E)),
             magenta: colorRamp(chroma(colors.base0F)),
         },
-        syntax
-    )
+        override: { syntax },
+    })
 }
 
 export const dark = theme(variant)

styles/src/themes/atelier/atelier-lakeside-dark.ts

@@ -1,6 +1,5 @@
 import chroma from "chroma-js"
-import { Meta } from "../common/colorScheme"
-import { colorRamp, createColorScheme } from "../common/ramps"
+import { Meta, colorRamp, createColorScheme, ThemeAppearance } from "../common"
 import { metaCommon, name, buildSyntax, Variant } from "./common"
 
 const variant: Variant = {
@@ -34,10 +33,11 @@ const syntax = buildSyntax(variant)
 const theme = (variant: Variant) => {
     const { meta, colors } = variant
 
-    return createColorScheme(
-        meta.name,
-        false,
-        {
+    return createColorScheme({
+        name: meta.name,
+        author: meta.author,
+        appearance: ThemeAppearance.Dark,
+        inputColor: {
             neutral: chroma.scale([
                 colors.base00,
                 colors.base01,
@@ -57,8 +57,8 @@ const theme = (variant: Variant) => {
             violet: colorRamp(chroma(colors.base0E)),
             magenta: colorRamp(chroma(colors.base0F)),
         },
-        syntax
-    )
+        override: { syntax },
+    })
 }
 
 export const dark = theme(variant)

styles/src/themes/atelier/atelier-lakeside-light.ts

@@ -1,6 +1,5 @@
 import chroma from "chroma-js"
-import { Meta } from "../common/colorScheme"
-import { colorRamp, createColorScheme } from "../common/ramps"
+import { Meta, colorRamp, createColorScheme, ThemeAppearance } from "../common"
 import { metaCommon, name, buildSyntax, Variant } from "./common"
 
 const variant: Variant = {
@@ -34,10 +33,11 @@ const syntax = buildSyntax(variant)
 const theme = (variant: Variant) => {
     const { meta, colors } = variant
 
-    return createColorScheme(
-        meta.name,
-        true,
-        {
+    return createColorScheme({
+        name: meta.name,
+        author: meta.author,
+        appearance: ThemeAppearance.Light,
+        inputColor: {
             neutral: chroma.scale(
                 [
                     colors.base00,
@@ -59,8 +59,8 @@ const theme = (variant: Variant) => {
             violet: colorRamp(chroma(colors.base0E)),
             magenta: colorRamp(chroma(colors.base0F)),
         },
-        syntax
-    )
+        override: { syntax },
+    })
 }
 
 export const dark = theme(variant)

styles/src/themes/atelier/atelier-plateau-dark.ts

@@ -1,6 +1,5 @@
 import chroma from "chroma-js"
-import { Meta } from "../common/colorScheme"
-import { colorRamp, createColorScheme } from "../common/ramps"
+import { Meta, colorRamp, createColorScheme, ThemeAppearance } from "../common"
 import { metaCommon, name, buildSyntax, Variant } from "./common"
 
 const variant: Variant = {
@@ -34,10 +33,11 @@ const syntax = buildSyntax(variant)
 const theme = (variant: Variant) => {
     const { meta, colors } = variant
 
-    return createColorScheme(
-        meta.name,
-        false,
-        {
+    return createColorScheme({
+        name: meta.name,
+        author: meta.author,
+        appearance: ThemeAppearance.Dark,
+        inputColor: {
             neutral: chroma.scale([
                 colors.base00,
                 colors.base01,
@@ -57,8 +57,8 @@ const theme = (variant: Variant) => {
             violet: colorRamp(chroma(colors.base0E)),
             magenta: colorRamp(chroma(colors.base0F)),
         },
-        syntax
-    )
+        override: { syntax },
+    })
 }
 
 export const dark = theme(variant)

styles/src/themes/atelier/atelier-plateau-light.ts

@@ -1,6 +1,5 @@
 import chroma from "chroma-js"
-import { Meta } from "../common/colorScheme"
-import { colorRamp, createColorScheme } from "../common/ramps"
+import { Meta, colorRamp, createColorScheme, ThemeAppearance } from "../common"
 import { metaCommon, name, buildSyntax, Variant } from "./common"
 
 const variant: Variant = {
@@ -34,10 +33,11 @@ const syntax = buildSyntax(variant)
 const theme = (variant: Variant) => {
     const { meta, colors } = variant
 
-    return createColorScheme(
-        meta.name,
-        true,
-        {
+    return createColorScheme({
+        name: meta.name,
+        author: meta.author,
+        appearance: ThemeAppearance.Light,
+        inputColor:{
             neutral: chroma.scale(
                 [
                     colors.base00,
@@ -59,7 +59,7 @@ const theme = (variant: Variant) => {
             violet: colorRamp(chroma(colors.base0E)),
             magenta: colorRamp(chroma(colors.base0F)),
         },
-        syntax
+        override: { syntax },}
     )
 }
 

styles/src/themes/atelier/atelier-savanna-dark.ts

@@ -1,6 +1,5 @@
 import chroma from "chroma-js"
-import { Meta } from "../common/colorScheme"
-import { colorRamp, createColorScheme } from "../common/ramps"
+import { Meta, colorRamp, createColorScheme, ThemeAppearance } from "../common"
 import { metaCommon, name, buildSyntax, Variant } from "./common"
 
 const variant: Variant = {
@@ -34,10 +33,11 @@ const syntax = buildSyntax(variant)
 const theme = (variant: Variant) => {
     const { meta, colors } = variant
 
-    return createColorScheme(
-        meta.name,
-        false,
-        {
+    return createColorScheme({
+        name: meta.name,
+        author: meta.author,
+        appearance: ThemeAppearance.Dark,
+        inputColor: {
             neutral: chroma.scale([
                 colors.base00,
                 colors.base01,
@@ -57,8 +57,8 @@ const theme = (variant: Variant) => {
             violet: colorRamp(chroma(colors.base0E)),
             magenta: colorRamp(chroma(colors.base0F)),
         },
-        syntax
-    )
+        override: { syntax },
+    })
 }
 
 export const dark = theme(variant)

styles/src/themes/atelier/atelier-savanna-light.ts

@@ -1,6 +1,5 @@
 import chroma from "chroma-js"
-import { Meta } from "../common/colorScheme"
-import { colorRamp, createColorScheme } from "../common/ramps"
+import { Meta, colorRamp, createColorScheme, ThemeAppearance } from "../common"
 import { metaCommon, name, buildSyntax, Variant } from "./common"
 
 const variant: Variant = {
@@ -34,10 +33,11 @@ const syntax = buildSyntax(variant)
 const theme = (variant: Variant) => {
     const { meta, colors } = variant
 
-    return createColorScheme(
-        meta.name,
-        true,
-        {
+    return createColorScheme({
+        name: meta.name,
+        author: meta.author,
+        appearance: ThemeAppearance.Light,
+        inputColor: {
             neutral: chroma.scale(
                 [
                     colors.base00,
@@ -59,8 +59,8 @@ const theme = (variant: Variant) => {
             violet: colorRamp(chroma(colors.base0E)),
             magenta: colorRamp(chroma(colors.base0F)),
         },
-        syntax
-    )
+        override: { syntax },
+    })
 }
 
 export const dark = theme(variant)

styles/src/themes/atelier/atelier-seaside-dark.ts

@@ -1,6 +1,5 @@
 import chroma from "chroma-js"
-import { Meta } from "../common/colorScheme"
-import { colorRamp, createColorScheme } from "../common/ramps"
+import { Meta, colorRamp, createColorScheme, ThemeAppearance } from "../common"
 import { metaCommon, name, buildSyntax, Variant } from "./common"
 
 const variant: Variant = {
@@ -34,10 +33,11 @@ const syntax = buildSyntax(variant)
 const theme = (variant: Variant) => {
     const { meta, colors } = variant
 
-    return createColorScheme(
-        meta.name,
-        false,
-        {
+    return createColorScheme({
+        name: meta.name,
+        author: meta.author,
+        appearance: ThemeAppearance.Dark,
+        inputColor: {
             neutral: chroma.scale([
                 colors.base00,
                 colors.base01,
@@ -57,8 +57,8 @@ const theme = (variant: Variant) => {
             violet: colorRamp(chroma(colors.base0E)),
             magenta: colorRamp(chroma(colors.base0F)),
         },
-        syntax
-    )
+        override: { syntax },
+    })
 }
 
 export const dark = theme(variant)

styles/src/themes/atelier/atelier-seaside-light.ts

@@ -1,6 +1,5 @@
 import chroma from "chroma-js"
-import { Meta } from "../common/colorScheme"
-import { colorRamp, createColorScheme } from "../common/ramps"
+import { Meta, colorRamp, createColorScheme, ThemeAppearance } from "../common"
 import { metaCommon, name, buildSyntax, Variant } from "./common"
 
 const variant: Variant = {
@@ -34,10 +33,11 @@ const syntax = buildSyntax(variant)
 const theme = (variant: Variant) => {
     const { meta, colors } = variant
 
-    return createColorScheme(
-        meta.name,
-        true,
-        {
+    return createColorScheme({
+        name: meta.name,
+        author: meta.author,
+        appearance: ThemeAppearance.Light,
+        inputColor: {
             neutral: chroma.scale(
                 [
                     colors.base00,
@@ -59,8 +59,8 @@ const theme = (variant: Variant) => {
             violet: colorRamp(chroma(colors.base0E)),
             magenta: colorRamp(chroma(colors.base0F)),
         },
-        syntax
-    )
+        override: { syntax },
+    })
 }
 
 export const dark = theme(variant)

styles/src/themes/atelier/atelier-sulphurpool-dark.ts

@@ -1,6 +1,5 @@
 import chroma from "chroma-js"
-import { Meta } from "../common/colorScheme"
-import { colorRamp, createColorScheme } from "../common/ramps"
+import { Meta, colorRamp, createColorScheme, ThemeAppearance } from "../common"
 import { metaCommon, name, buildSyntax, Variant } from "./common"
 
 const variant: Variant = {
@@ -34,10 +33,11 @@ const syntax = buildSyntax(variant)
 const theme = (variant: Variant) => {
     const { meta, colors } = variant
 
-    return createColorScheme(
-        meta.name,
-        false,
-        {
+    return createColorScheme({
+        name: meta.name,
+        author: meta.author,
+        appearance: ThemeAppearance.Dark,
+        inputColor: {
             neutral: chroma.scale([
                 colors.base00,
                 colors.base01,
@@ -57,8 +57,8 @@ const theme = (variant: Variant) => {
             violet: colorRamp(chroma(colors.base0E)),
             magenta: colorRamp(chroma(colors.base0F)),
         },
-        syntax
-    )
+        override: { syntax },
+    })
 }
 
 export const dark = theme(variant)

styles/src/themes/atelier/atelier-sulphurpool-light.ts

@@ -1,6 +1,5 @@
 import chroma from "chroma-js"
-import { Meta } from "../common/colorScheme"
-import { colorRamp, createColorScheme } from "../common/ramps"
+import { Meta, colorRamp, createColorScheme, ThemeAppearance } from "../common"
 import { metaCommon, name, buildSyntax, Variant } from "./common"
 
 const variant: Variant = {
@@ -34,10 +33,11 @@ const syntax = buildSyntax(variant)
 const theme = (variant: Variant) => {
     const { meta, colors } = variant
 
-    return createColorScheme(
-        meta.name,
-        true,
-        {
+    return createColorScheme({
+        name: meta.name,
+        author: meta.author,
+        appearance: ThemeAppearance.Light,
+        inputColor: {
             neutral: chroma.scale(
                 [
                     colors.base00,
@@ -59,8 +59,8 @@ const theme = (variant: Variant) => {
             violet: colorRamp(chroma(colors.base0E)),
             magenta: colorRamp(chroma(colors.base0F)),
         },
-        syntax
-    )
+        override: { syntax },
+    })
 }
 
 export const dark = theme(variant)

styles/src/themes/atelier/common.ts

@@ -1,4 +1,4 @@
-import { License, Meta, ThemeSyntax } from "../common/colorScheme"
+import { License, Meta, ThemeSyntax } from "../common"
 
 export interface Variant {
     meta: Meta

styles/src/themes/ayu/ayu-dark.ts

@@ -1,17 +1,18 @@
-import { createColorScheme } from "../common/ramps"
+import { createColorScheme, ThemeAppearance } from "../common"
 import { ayu, meta as themeMeta, buildTheme } from "./common"
 
 export const meta = {
     ...themeMeta,
-    name: `${themeMeta.name} Dark`
+    name: `${themeMeta.name} Dark`,
 }
 
 const variant = ayu.dark
 const theme = buildTheme(variant, false)
 
-export const dark = createColorScheme(
-    meta.name,
-    false,
-    theme.ramps,
-    theme.syntax
-)
+export const dark = createColorScheme({
+    name: meta.name,
+    author: meta.author,
+    appearance: ThemeAppearance.Dark,
+    inputColor: theme.ramps,
+    override: { syntax: theme.syntax },
+})

styles/src/themes/ayu/ayu-light.ts

@@ -1,17 +1,18 @@
-import { createColorScheme } from "../common/ramps"
+import { createColorScheme, ThemeAppearance } from "../common"
 import { ayu, meta as themeMeta, buildTheme } from "./common"
 
 export const meta = {
     ...themeMeta,
-    name: `${themeMeta.name} Light`
+    name: `${themeMeta.name} Light`,
 }
 
 const variant = ayu.light
 const theme = buildTheme(variant, true)
 
-export const light = createColorScheme(
-    meta.name,
-    true,
-    theme.ramps,
-    theme.syntax
-)
+export const light = createColorScheme({
+    name: meta.name,
+    author: meta.author,
+    appearance: ThemeAppearance.Light,
+    inputColor: theme.ramps,
+    override: { syntax: theme.syntax },
+})

styles/src/themes/ayu/ayu-mirage.ts

@@ -1,17 +1,18 @@
-import { createColorScheme } from "../common/ramps"
+import { createColorScheme, ThemeAppearance } from "../common"
 import { ayu, meta as themeMeta, buildTheme } from "./common"
 
 export const meta = {
     ...themeMeta,
-    name: `${themeMeta.name} Mirage`
+    name: `${themeMeta.name} Mirage`,
 }
 
 const variant = ayu.mirage
 const theme = buildTheme(variant, false)
 
-export const dark = createColorScheme(
-    meta.name,
-    false,
-    theme.ramps,
-    theme.syntax
-)
+export const dark = createColorScheme({
+    name: meta.name,
+    author: meta.author,
+    appearance: ThemeAppearance.Dark,
+    inputColor: theme.ramps,
+    override: { syntax: theme.syntax },
+})

styles/src/themes/gruvbox/gruvbox-common.ts

@@ -1,8 +1,20 @@
 import chroma from "chroma-js"
-import { Meta, ThemeSyntax } from "../common/colorScheme"
-import { colorRamp, createColorScheme } from "../common/ramps"
+import {
+    Meta,
+    colorRamp,
+    createColorScheme,
+    ThemeSyntax,
+    ThemeAppearance,
+} from "../common"
 
-const name = "Gruvbox"
+export const meta: Meta = {
+    name: "Gruvbox",
+    license: {
+        SPDX: "MIT", // "MIT/X11"
+    },
+    author: "morhetz <[e-mail]>",
+    url: "https://github.com/morhetz/gruvbox",
+}
 
 const color = {
     dark0_hard: "#1d2021",
@@ -233,7 +245,13 @@ const buildVariant = (variant: Variant) => {
         title: { color: colors.green },
     }
 
-    return createColorScheme(name, isLight, ramps, syntax)
+    return createColorScheme({
+        name,
+        author: meta.author,
+        appearance: variant.appearance as ThemeAppearance,
+        inputColor: ramps,
+        override: { syntax },
+    })
 }
 
 // Variants
@@ -243,12 +261,3 @@ export const darkSoft = buildVariant(variant[2])
 export const lightHard = buildVariant(variant[3])
 export const lightDefault = buildVariant(variant[4])
 export const lightSoft = buildVariant(variant[5])
-
-export const meta: Meta = {
-    name,
-    license: {
-        SPDX: "MIT", // "MIT/X11"
-    },
-    author: "morhetz <[e-mail]>",
-    url: "https://github.com/morhetz/gruvbox",
-}

styles/src/themes/one/one-dark.ts

@@ -1,7 +1,12 @@
 import chroma from "chroma-js"
 import { fontWeights } from "../../common"
-import { Meta, ThemeSyntax } from "../common/colorScheme"
-import { colorRamp, createColorScheme } from "../common/ramps"
+import {
+    Meta,
+    colorRamp,
+    createColorScheme,
+    ThemeSyntax,
+    ThemeAppearance,
+} from "../common"
 
 const name = "One Dark"
 
@@ -67,8 +72,6 @@ const syntax: ThemeSyntax = {
     constructor: { color: color.blue },
 }
 
-export const dark = createColorScheme(name, false, ramps, syntax)
-
 export const meta: Meta = {
     name,
     author: "simurai",
@@ -77,3 +80,11 @@ export const meta: Meta = {
     },
     url: "https://github.com/atom/atom/tree/master/packages/one-dark-ui",
 }
+
+export const dark = createColorScheme({
+    name: meta.name,
+    author: meta.author,
+    appearance: ThemeAppearance.Dark,
+    inputColor: ramps,
+    override: { syntax },
+})

styles/src/themes/one/one-light.ts

@@ -1,7 +1,12 @@
 import chroma from "chroma-js"
 import { fontWeights } from "../../common"
-import { Meta, ThemeSyntax } from "../common/colorScheme"
-import { colorRamp, createColorScheme } from "../common/ramps"
+import {
+    Meta,
+    colorRamp,
+    createColorScheme,
+    ThemeSyntax,
+    ThemeAppearance,
+} from "../common"
 
 const name = "One Light"
 
@@ -66,8 +71,6 @@ const syntax: ThemeSyntax = {
     variant: { color: color.blue },
 }
 
-export const light = createColorScheme(name, true, ramps, syntax)
-
 export const meta: Meta = {
     name,
     author: "simurai",
@@ -76,3 +79,11 @@ export const meta: Meta = {
     },
     url: "https://github.com/atom/atom/tree/master/packages/one-light-ui",
 }
+
+export const light = createColorScheme({
+    name: meta.name,
+    author: meta.author,
+    appearance: ThemeAppearance.Light,
+    inputColor: ramps,
+    override: { syntax },
+})

styles/src/themes/rose-pine/rose-pine-dawn.ts

@@ -1,6 +1,5 @@
 import chroma from "chroma-js"
-import { Meta } from "../common/colorScheme"
-import { colorRamp, createColorScheme } from "../common/ramps"
+import { Meta, colorRamp, createColorScheme, ThemeAppearance } from "../common"
 
 const name = "Rosé Pine Dawn"
 
@@ -27,8 +26,6 @@ const ramps = {
     magenta: colorRamp(chroma("#79549F")),
 }
 
-export const light = createColorScheme(name, true, ramps)
-
 export const meta: Meta = {
     name,
     author: "edunfelt",
@@ -37,3 +34,11 @@ export const meta: Meta = {
     },
     url: "https://github.com/edunfelt/base16-rose-pine-scheme",
 }
+
+export const light = createColorScheme({
+    name: meta.name,
+    author: meta.author,
+    appearance: ThemeAppearance.Light,
+    inputColor: ramps,
+    override: { syntax: {} },
+})

styles/src/themes/rose-pine/rose-pine-moon.ts

@@ -1,6 +1,5 @@
 import chroma from "chroma-js"
-import { Meta } from "../common/colorScheme"
-import { colorRamp, createColorScheme } from "../common/ramps"
+import { Meta, colorRamp, createColorScheme, ThemeAppearance } from "../common"
 
 const name = "Rosé Pine Moon"
 
@@ -27,8 +26,6 @@ const ramps = {
     magenta: colorRamp(chroma("#AB6FE9")),
 }
 
-export const dark = createColorScheme(name, false, ramps)
-
 export const meta: Meta = {
     name,
     author: "edunfelt",
@@ -37,3 +34,11 @@ export const meta: Meta = {
     },
     url: "https://github.com/edunfelt/base16-rose-pine-scheme",
 }
+
+export const dark = createColorScheme({
+    name: meta.name,
+    author: meta.author,
+    appearance: ThemeAppearance.Dark,
+    inputColor: ramps,
+    override: { syntax: {} },
+})

styles/src/themes/rose-pine/rose-pine.ts

@@ -1,6 +1,5 @@
 import chroma from "chroma-js"
-import { Meta } from "../common/colorScheme"
-import { colorRamp, createColorScheme } from "../common/ramps"
+import { Meta, colorRamp, createColorScheme, ThemeAppearance } from "../common"
 
 const name = "Rosé Pine"
 
@@ -25,8 +24,6 @@ const ramps = {
     magenta: colorRamp(chroma("#AB6FE9")),
 }
 
-export const dark = createColorScheme(name, false, ramps)
-
 export const meta: Meta = {
     name,
     author: "edunfelt",
@@ -35,3 +32,11 @@ export const meta: Meta = {
     },
     url: "https://github.com/edunfelt/base16-rose-pine-scheme",
 }
+
+export const dark = createColorScheme({
+    name: meta.name,
+    author: meta.author,
+    appearance: ThemeAppearance.Dark,
+    inputColor: ramps,
+    override: { syntax: {} },
+})

styles/src/themes/sandcastle/sandcastle.ts

@@ -1,6 +1,5 @@
 import chroma from "chroma-js"
-import { Meta } from "../common/colorScheme"
-import { colorRamp, createColorScheme } from "../common/ramps"
+import { Meta, colorRamp, createColorScheme, ThemeAppearance } from "../common"
 
 const name = "Sandcastle"
 
@@ -25,8 +24,6 @@ const ramps = {
     magenta: colorRamp(chroma("#a87322")),
 }
 
-export const dark = createColorScheme(name, false, ramps)
-
 export const meta: Meta = {
     name,
     author: "gessig",
@@ -35,3 +32,11 @@ export const meta: Meta = {
     },
     url: "https://github.com/gessig/base16-sandcastle-scheme",
 }
+
+export const dark = createColorScheme({
+    name: meta.name,
+    author: meta.author,
+    appearance: ThemeAppearance.Dark,
+    inputColor: ramps,
+    override: { syntax: {} },
+})

styles/src/themes/solarized/solarized.ts

@@ -1,6 +1,5 @@
 import chroma from "chroma-js"
-import { Meta as Metadata } from "../common/colorScheme"
-import { colorRamp, createColorScheme } from "../common/ramps"
+import { Meta, colorRamp, createColorScheme, ThemeAppearance } from "../common"
 
 const name = "Solarized"
 
@@ -27,10 +26,7 @@ const ramps = {
     magenta: colorRamp(chroma("#d33682")),
 }
 
-export const dark = createColorScheme(`${name} Dark`, false, ramps)
-export const light = createColorScheme(`${name} Light`, true, ramps)
-
-export const meta: Metadata = {
+export const meta: Meta = {
     name,
     author: "Ethan Schoonover",
     license: {
@@ -38,3 +34,19 @@ export const meta: Metadata = {
     },
     url: "https://github.com/altercation/solarized",
 }
+
+export const dark = createColorScheme({
+    name: `${name} Dark`,
+    author: meta.author,
+    appearance: ThemeAppearance.Dark,
+    inputColor: ramps,
+    override: { syntax: {} },
+})
+
+export const light = createColorScheme({
+    name: `${name} Light`,
+    author: meta.author,
+    appearance: ThemeAppearance.Light,
+    inputColor: ramps,
+    override: { syntax: {} },
+})

styles/src/themes/summercamp/summercamp.ts

@@ -1,6 +1,5 @@
 import chroma from "chroma-js"
-import { Meta } from "../common/colorScheme"
-import { colorRamp, createColorScheme } from "../common/ramps"
+import { Meta, colorRamp, createColorScheme, ThemeAppearance } from "../common"
 
 const name = "Summercamp"
 
@@ -27,7 +26,6 @@ const ramps = {
     magenta: colorRamp(chroma("#F69BE7")),
 }
 
-export const dark = createColorScheme(name, false, ramps)
 export const meta: Meta = {
     name,
     author: "zoefiri",
@@ -36,3 +34,11 @@ export const meta: Meta = {
         SPDX: "MIT",
     },
 }
+
+export const dark = createColorScheme({
+    name: meta.name,
+    author: meta.author,
+    appearance: ThemeAppearance.Dark,
+    inputColor: ramps,
+    override: { syntax: {} },
+})