@codeleap/styles 4.3.7 → 4.3.8

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@codeleap/styles",
-  "version": "4.3.7",
+  "version": "4.3.8",
   "main": "src/index.ts",
   "license": "UNLICENSED",
   "repository": {
@@ -9,7 +9,7 @@
     "directory": "packages/styles"
   },
   "devDependencies": {
-    "@codeleap/config": "4.3.7",
+    "@codeleap/config": "4.3.8",
     "ts-node-dev": "1.1.8"
   },
   "scripts": {

package/package.json.bak

@@ -1,6 +1,6 @@
 {
   "name": "@codeleap/styles",
-  "version": "4.3.7",
+  "version": "4.3.8",
   "main": "src/index.ts",
   "license": "UNLICENSED",
   "repository": {

package/src/lib/createStyles.ts

@@ -1,30 +1,28 @@
-import { ICSS, ITheme, AnyRecord } from '../types'
+import { AnyRecord, ICSS, ITheme } from '../types'
 import { themeStore } from './themeStore'
 
-type StylesShape<K extends string, P extends AnyRecord> = Partial<Record<K, ICSS & Partial<P>>>
+type Value = AnyRecord
 
-export function createStyles<K extends string, P extends AnyRecord = AnyRecord>(
-  styles: StylesShape<K, P> | ((theme: ITheme) => StylesShape<K, P>),
-) {
+type StylesShape<K extends string, V extends Value> = Partial<Record<K, ICSS & Partial<Omit<V, keyof ICSS>>>>
 
+export function createStyles<K extends string, V extends Value = {}>(
+  styles: StylesShape<K, V> | ((theme: ITheme) => StylesShape<K, V>),
+) {
   const compute = () => {
-    let styleObj = {} as StylesShape<K, P>
     const current = themeStore.getState().current
 
     if (typeof styles === 'function') {
-      styleObj = !current ? {} : styles(current)
+      return !current ? {} as StylesShape<K, V> : styles(current)
     } else {
-      styleObj = styles
+      return styles
     }
-
-    return styleObj
   }
   
   // We use a proxy here so that the color scheme is recomputed every time the
   // theme changes. This is necessary because the theme is a singleton which does not cause
   // a re-render when it changes. The end-user will only have to worry about remounting the root component
   // when the theme changes in order to get the new color scheme due to this proxy.
-  return new Proxy(compute() as StylesShape<K, P>, {
+  return new Proxy(compute() as StylesShape<K, V>, {
     get(target, prop) {
       return compute()[prop as string]
     },