fix(core): update

ts/dees-element.classes.cssmanager.ts

@@ -0,0 +1,38 @@
+import { CSSResult } from 'lit-element';
+import * as plugins from './dees-element.plugins';
+
+export interface IDbVarTriplet {
+  cssVarName: string;
+  darkValue: string;
+  brightValue: string;
+}
+
+export class CssManager {
+  public dbVarTripletStore: IDbVarTriplet[] = [];
+
+  public dbTheme(darkValueArg: string, brightValueArg: string): CSSResult {
+    const existingTriplet = this.dbVarTripletStore.find(tripletArg => tripletArg.darkValue === darkValueArg && tripletArg.brightValue === brightValueArg);
+    if (existingTriplet) {
+      return plugins.litElement.unsafeCSS(existingTriplet.cssVarName)
+    } else {
+      const newTriplet: IDbVarTriplet = {
+        cssVarName: `--${plugins.isounique.uni()}`,
+        brightValue: brightValueArg,
+        darkValue: darkValueArg
+      }
+      this.dbVarTripletStore.push(newTriplet)
+      document.body.style.setProperty(newTriplet.cssVarName, newTriplet.darkValue);
+      return plugins.litElement.unsafeCSS(newTriplet.cssVarName);
+    }
+  }
+
+  public cssGridColumns = (amountOfColumnsArg: number, gapSizeArg: number): CSSResult => {
+    let returnString = ``;
+    for (let i = 0; i < amountOfColumnsArg; i++) {
+      returnString += ` calc((100%/${amountOfColumnsArg}) - (${
+        gapSizeArg * (amountOfColumnsArg - 1)
+      }px/${amountOfColumnsArg}))`;
+    }
+    return plugins.litElement.unsafeCSS(returnString);
+  };
+}

ts/dees-element.classes.dees-element.ts

@@ -0,0 +1,38 @@
+import * as plugins from './dees-element.plugins';
+
+export class DeesElement extends plugins.litElement.LitElement {
+  // INSTANCE
+  @plugins.litElement.property({ type: Boolean })
+  public goBright: boolean = false;
+
+  // domtools
+  public domtoolsPromise = plugins.domtools.elementBasic.setup(this);
+
+  @plugins.litElement.property()
+  domtools?: plugins.domtools.DomTools;
+
+  private themeSubscription: plugins.smartrx.rxjs.Subscription;
+
+  constructor() {
+    super();
+    this.domtoolsPromise.then((domtoolsArg) => {
+      this.domtools = domtoolsArg;
+    });
+  }
+
+  public connectedCallback() {
+    super.connectedCallback();
+    this.domtoolsPromise.then(async (domtools) => {
+      this.themeSubscription = domtools.themeManager.themeObservable.subscribe((goBrightArg) => {
+        this.goBright = goBrightArg;
+      });
+    });
+    this.dispatchEvent(new CustomEvent('deesElementConnected'));
+  }
+
+  public disconnectedCallback() {
+    super.disconnectedCallback();
+    this.themeSubscription.unsubscribe();
+    this.dispatchEvent(new CustomEvent('deesElementDisconnected'));
+  }
+}

ts/dees-element.plugins.ts

@@ -1,13 +1,17 @@
 // pushrocks scope
+import * as isounique from '@pushrocks/isounique';
 import * as smartrx from '@pushrocks/smartrx';
 
 export {
+  isounique,
   smartrx
 };
 
 // third party scope
-import { LitElement, property } from 'lit-element';
+import { css, unsafeCSS, LitElement, property } from 'lit-element';
 const litElement = {
+  css,
+  unsafeCSS,
   LitElement,
   property
 };

ts/index.ts

@@ -1,47 +1,16 @@
+import { CssManager } from './dees-element.classes.cssmanager';
 import * as plugins from './dees-element.plugins';
 
 export {
-  property,
-  html,
   customElement,
-  TemplateResult,
+  property,
   internalProperty,
+  html,
+  TemplateResult,
   css,
-  unsafeCSS,
+  unsafeCSS
 } from 'lit-element';
 
-export class DeesElement extends plugins.litElement.LitElement {
-  @plugins.litElement.property({ type: Boolean })
-  public goBright: boolean = false;
+export { DeesElement } from './dees-element.classes.dees-element';
 
-  // domtools
-  public domtoolsPromise = plugins.domtools.elementBasic.setup(this);
-
-  @plugins.litElement.property()
-  domtools?: plugins.domtools.DomTools;
-
-  private themeSubscription: plugins.smartrx.rxjs.Subscription;
-
-  constructor() {
-    super();
-    this.domtoolsPromise.then((domtoolsArg) => {
-      this.domtools = domtoolsArg;
-    });
-  }
-
-  public connectedCallback() {
-    super.connectedCallback();
-    this.domtoolsPromise.then(async (domtools) => {
-      this.themeSubscription = domtools.themeManager.themeObservable.subscribe((goBrightArg) => {
-        this.goBright = goBrightArg;
-      });
-    });
-    this.dispatchEvent(new CustomEvent('deesElementConnected'));
-  }
-
-  public disconnectedCallback() {
-    super.disconnectedCallback();
-    this.themeSubscription.unsubscribe();
-    this.dispatchEvent(new CustomEvent('deesElementDisconnected'));
-  }
-}
+export const cssManager = new CssManager();

ts/tsconfig.json

@@ -1,16 +0,0 @@
-{
-  "compilerOptions": {
-    "target": "es2017",
-    "module": "es2015",
-    "moduleResolution": "node",
-    "lib": ["es2017", "dom"],
-    "declaration": true,
-    "inlineSources": true,
-    "inlineSourceMap": true,
-    "noUnusedLocals": true,
-    "noFallthroughCasesInSwitch": true,
-    "outDir": "dist/",
-    "skipLibCheck": true,
-    "experimentalDecorators": true
-  }
-}