@paperbits/styles - npm Package Compare versions

Comparing version 0.1.43 to 0.1.44

ko/bindingHandlers/bindingHandlers.stylable.ts

 import * as ko from "knockout";
-import { IView, IViewManager } from "@paperbits/common/ui";
-import { IEventManager } from "@paperbits/common/events";
-import { StyleService } from "../..";
 
-
-export class StyleableBindingHandler {
-    constructor(
-        private readonly viewManager: IViewManager,
-        private readonly eventManager: IEventManager,
-        private readonly styleService: StyleService
-    ) {
-        ko.bindingHandlers["stylable"] = {
-            init: (element: HTMLElement, valueAccessor) => {
-                const config = ko.unwrap(valueAccessor());
-
-                ko.applyBindingsToNode(element, {
-                    click: (ignored, event: MouseEvent) => {
-                        event.preventDefault();
-                        event.stopImmediatePropagation();
-
-                        const view: IView = {
-                            heading: config.elementStyle.displayName,
-                            component: {
-                                name: "style-editor",
-                                params: {
-                                    elementStyle: config.elementStyle,
-                                    onUpdate: () => {
-                                        this.styleService.updateStyle(config.elementStyle);
-                                    }
-                                }
-                            },
-                            resize: "vertically horizontally"
-                        };
-
-                        this.viewManager.openViewAsPopup(view);
-                    },
-
-                    styled: config.elementStyle.key
-                });
-            }
-        };
+ko.bindingHandlers["stylable"] = {
+    init: (element: HTMLElement, valueAccessor) => {
+        const style = ko.unwrap(valueAccessor());
+        element["stylable"] = { style: style };
     }
-}
+};

ko/bindingHandlers/bindingHandlers.styled.ts

@@ -16,13 +16,19 @@ import * as ko from "knockout";
 
+                let classNames: string;
                 const cssObservable = ko.observable();
 
                 if (typeof styleConfig === "string" || styleConfig instanceof String) {
-                    const className = await this.styleCompiler.getClassNameByStyleKeyAsync(<string>styleConfig);
-                    cssObservable(className);
+                    classNames = await this.styleCompiler.getClassNameByStyleKeyAsync(<string>styleConfig);
                 }
                 else {
-                    const classNames = await this.styleCompiler.getClassNamesByStyleConfigAsync(styleConfig);
-                    cssObservable(classNames);
+                    if (styleConfig.key) {
+                        classNames = await this.styleCompiler.getClassNameByStyleKeyAsync(styleConfig.key);
+                    }
+                    else {
+                        classNames = await this.styleCompiler.getClassNamesByStyleConfigAsync(styleConfig);
+                    }
                 }
 
+                cssObservable(classNames);
+
                 ko.applyBindingsToNode(element, { css: cssObservable });
@@ -29,0 +35,0 @@ }

package.json

 {
     "name": "@paperbits/styles",
-    "version": "0.1.43",
+    "version": "0.1.44",
     "description": "Paperbits style editors.",
@@ -19,3 +19,3 @@ "author": "Paperbits",
     "dependencies": {
-        "@paperbits/common": "0.1.43",
+        "@paperbits/common": "0.1.44",
         "cropperjs": "^1.4.0",
@@ -22,0 +22,0 @@ "google-maps": "^3.2.1",

styles.edit.module.ts

@@ -1,3 +0,1 @@
-import { BackgroundStylePlugin } from "./plugins/backgroundStylePlugin";
-import { StylePlugin } from "./plugins/stylePlugin";
 /**
@@ -13,2 +11,3 @@ * @license
 import { StyleEditor } from "./workshops/styleEditor";
+import { StyleGuide } from "./styleGuide/styleGuide";
 import { BoxEditor } from "./workshops/boxes/boxEditor";
@@ -25,8 +24,10 @@ import { ColorSelector, ColorEditor } from "./workshops/colors";
 import { Background } from "./workshops/background";
-import { LivingStyleGuide } from "./livingStyleGuide";
-import { StyleableBindingHandler } from "./ko/bindingHandlers/bindingHandlers.stylable";
 import { StylesheetBindingHandler } from "./ko/bindingHandlers/bindingHandlers.stylesheet";
+import { BackgroundStylePlugin } from "./plugins/backgroundStylePlugin";
+import { StylePlugin } from "./plugins/stylePlugin";
+import "./ko/bindingHandlers/bindingHandlers.stylable";
 import "./ko/bindingHandlers/bindingHandlers.colorPicker";
 import "./ko/bindingHandlers/bindingHandlers.jss";
 
+
 export class StylingEditModule implements IInjectorModule {
@@ -49,8 +50,7 @@ public register(injector: IInjector): void {
         injector.bind("styleEditor", StyleEditor);
-        injector.bind("livingStyleGuide", LivingStyleGuide);
+        injector.bind("styleGuide", StyleGuide);
         injector.bind("stylePlugin", StylePlugin);
         injector.bind("backgroundStylePlugin", BackgroundStylePlugin);
-        injector.bindToCollection("autostart", StyleableBindingHandler);
         injector.bindToCollection("autostart", StylesheetBindingHandler);
     }
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

146376

increased by7.01%

Lines of code

2693

increased by8.59%

Dependency changes

• + Added@paperbits/common@0.1.44(transitive)

• - Removed@paperbits/common@0.1.43(transitive)

• Updated@paperbits/common@0.1.44