@equinor/fusion-web-theme - npm Package Compare versions

Comparing version 0.1.0-alpha.1 to 0.1.0-alpha.2

CHANGELOG.md

@@ -6,2 +6,13 @@ # Change Log
 
+# [0.1.0-alpha.2](https://github.com/equinor/fusion-web/compare/@equinor/fusion-web-theme@0.1.0-alpha.1...@equinor/fusion-web-theme@0.1.0-alpha.2) (2021-03-18)
+
+
+### Bug Fixes
+
+* style property as css properties ([1ab144a](https://github.com/equinor/fusion-web/commit/1ab144a0264e3319053d8645541aa40fa7fe0d64))
+
+
+
+
+
 # [0.1.0-alpha.1](https://github.com/equinor/fusion-web/compare/@equinor/fusion-web-theme@0.1.0-alpha.0...@equinor/fusion-web-theme@0.1.0-alpha.1) (2021-03-18)
@@ -8,0 +19,0 @@

dist/style-property.d.ts

@@ -11,8 +11,8 @@ import { Properties } from 'csstype';
     static makeCssVar(element: string, module: string): string;
-    static makeCss(obj: Partial<Properties>): string;
+    static makeCss(obj: Properties): string;
     static makeVariable({ attribute, value }: StyleAttribute): string;
-    static extractVariables(styles: Record<string, StyleProperty>): string[];
+    static extractVariables<T extends StyleProperty>(styles: Record<string, T>): string[];
     constructor(name: string, value: T);
     abstract get attributes(): Record<A, StyleAttribute>;
-    get style(): Partial<Properties>;
+    get style(): Properties;
     get css(): string;
@@ -19,0 +19,0 @@ get variables(): string[];

dist/style-property.js

@@ -26,3 +26,4 @@ const camel2kebab = (x) => x.replace(/([a-z0-9])([A-Z])/g, '$1-$2').toLowerCase();
     get css() {
-        return StyleProperty.makeCss(this.style);
+        const { attributes, style } = this;
+        return StyleProperty.makeCss(Object.assign(Object.assign({}, style), Object.keys(attributes).reduce((cur, key) => Object.assign(cur, { [key]: StyleProperty.makeVariable(attributes[key]) }), {})));
     }
@@ -29,0 +30,0 @@ get variables() {

dist/styles/colors.d.ts

@@ -0,1 +1,2 @@
+import { Properties } from 'csstype';
 import StyleProperty from '../style-property';
@@ -7,3 +8,4 @@ export declare type Color = {
 };
-export declare class ColorStyleProperty extends StyleProperty<Color, 'color'> {
+export declare type ColorStyleAttribute = 'color';
+export declare class ColorStyleProperty extends StyleProperty<Color, ColorStyleAttribute> {
     get attributes(): {
@@ -15,2 +17,3 @@ color: {
     };
+    get style(): Properties;
 }
@@ -17,0 +20,0 @@ export declare const colors: {

dist/styles/colors.js

@@ -11,2 +11,7 @@ import { tokens } from '@equinor/eds-tokens';
     }
+    get style() {
+        return {
+            color: this.value.rgba,
+        };
+    }
 }
@@ -13,0 +18,0 @@ const createStyleProperty = (obj, name) => Object.keys(obj).reduce((cur, key) => Object.assign(cur, { [key]: new ColorStyleProperty(`${name}-${key}`, obj[key]) }), {});

dist/styles/elevation.d.ts

@@ -0,4 +1,6 @@
+import { tokens } from '@equinor/eds-tokens';
 import { StyleAttribute, StyleProperty } from '../style-property';
-declare type ElevationAttributes = 'shadow';
-export declare class ElevationStyleProperty extends StyleProperty<string, ElevationAttributes> {
+export declare type ElevationType = keyof typeof tokens.elevation;
+export declare type ElevationAttribute = 'shadow';
+export declare class ElevationStyleProperty extends StyleProperty<string, ElevationAttribute> {
     get attributes(): Record<'shadow', StyleAttribute>;
@@ -5,0 +7,0 @@ get style(): {

dist/styles/elevation.js

 import { tokens } from '@equinor/eds-tokens';
 import { StyleProperty } from '../style-property';
-const types = Object.keys(tokens.elevation);
 export class ElevationStyleProperty extends StyleProperty {
@@ -21,2 +20,3 @@ get attributes() {
 };
+const types = Object.keys(tokens.elevation);
 export const elevation = types.reduce((obj, type) => Object.assign(obj, { [type]: createStyleProp(type) }), {});
@@ -23,0 +23,0 @@ export const elevationVariables = ElevationStyleProperty.extractVariables(elevation);

package.json

 {
   "name": "@equinor/fusion-web-theme",
-  "version": "0.1.0-alpha.1",
+  "version": "0.1.0-alpha.2",
   "description": "fusion web theme",
@@ -44,3 +44,3 @@ "keywords": [
   },
-  "gitHead": "1b09475b235386531a4dcda918eb81a9aa7a5cbe"
+  "gitHead": "81c94f8f98369412482d03d0590d0140d6643c42"
 }

No alert changes

Improved metrics

Total package byte prevSize

24894

increased by5%

Lines of code

265

increased by4.33%

No dependency changes