flinker-dom 1.1.11 → 1.1.13

package/dist/esm/components.js

@@ -117,7 +117,7 @@ export class UIComponent {
                 res.pseudo = {};
             const state = {};
             this.whenHoveredFn(state);
-            res.pseudo['hover'] = state;
+            res.pseudo[':hover'] = state;
         }
         if (this.mapStateFn)
             this.mapStateFn(res);
@@ -353,7 +353,7 @@ export class Button extends Text {
                 res.pseudo = {};
             const state = {};
             this.whenHoveredFn(state);
-            res.pseudo['hover'] = state;
+            res.pseudo[':hover'] = state;
         }
         if (!this.childrenColl)
             this.dom.textContent = this.props.text ?? null;
@@ -673,7 +673,7 @@ export class Input extends UIComponent {
                 res.pseudo = {};
             const state = {};
             this.whenHoveredFn(state);
-            res.pseudo['hover'] = state;
+            res.pseudo[':hover'] = state;
         }
         if (this.whenFocusedFn) {
             if (!res.pseudo)
@@ -687,7 +687,7 @@ export class Input extends UIComponent {
                 res.pseudo = {};
             const state = {};
             this.whenPlaceholderShownFn(state);
-            res.pseudo['placeholder'] = state;
+            res.pseudo['::placeholder'] = state;
         }
         if (this.mapStateFn)
             this.mapStateFn(res);

package/dist/esm/processor.js

@@ -71,19 +71,19 @@ const abbreviations = {
     'user-select': 'U',
     'z-index': 'Z'
 };
+const pseudoClasses = ['none', ':hover', ':focus', ':link', ':visited', ':active', '::placeholder', '::before'];
 export class StyleSheetProcessor {
     constructor(styleSheet) {
         this.hash = new Map();
         this.list = Array.of();
-        const all = ['none', 'hover', 'focus', 'placeholder'];
-        all.forEach(t => {
-            if (t === 'hover') {
+        pseudoClasses.forEach(t => {
+            if (t === ':hover') {
                 const pc = new HoverPseudoClass(styleSheet);
-                this.hash.set('hover', pc);
+                this.hash.set(':hover', pc);
                 this.list.push(pc);
             }
             else {
-                const pc = new PseudoClass(t, styleSheet, t === 'placeholder' ? '::' : ':');
+                const pc = new PseudoClass(t, styleSheet);
                 this.hash.set(t, pc);
                 this.list.push(pc);
             }
@@ -109,16 +109,15 @@ export class StyleSheetProcessor {
     }
 }
 export class PseudoClass {
-    constructor(type, styleSheet, divider = ':') {
+    constructor(type, styleSheet) {
         this.type = type;
         this.styleSheet = styleSheet;
         this.style = '';
         this.hashSum = '';
-        this.divider = divider;
     }
     insertRule(className, tag) {
         if (this.style) {
-            const rule = tag + '.' + className + (this.type === 'none' ? '' : this.divider + this.type) + '{' + this.style + '}';
+            const rule = tag + '.' + className + (this.type === 'none' ? '' : this.type) + '{' + this.style + '}';
             this.styleSheet.insertRule(rule);
         }
     }
@@ -143,7 +142,7 @@ export class PseudoClass {
 }
 class HoverPseudoClass extends PseudoClass {
     constructor(styleSheet) {
-        super('hover', styleSheet);
+        super(':hover', styleSheet);
         this.isMobileDevice = ('ontouchstart' in window) || (navigator.maxTouchPoints > 0);
     }
     insertRule(className, tag) {

package/dist/types/processor.d.ts

@@ -1,4 +1,6 @@
 import { type RulePriority } from './core';
+declare const pseudoClasses: readonly ["none", ":hover", ":focus", ":link", ":visited", ":active", "::placeholder", "::before"];
+export type PseudoClassType = typeof pseudoClasses[number];
 export declare class StyleSheetProcessor {
     private readonly hash;
     private readonly list;
@@ -8,16 +10,15 @@ export declare class StyleSheetProcessor {
     insertRule(className: string, tag: string): void;
     clearValues(): void;
 }
-export type PseudoClassType = 'none' | 'hover' | 'focus' | 'placeholder';
 export declare class PseudoClass {
     readonly type: PseudoClassType;
     readonly styleSheet: CSSStyleSheet;
     style: string;
     hashSum: string;
-    readonly divider: string;
-    constructor(type: PseudoClassType, styleSheet: CSSStyleSheet, divider?: string);
+    constructor(type: PseudoClassType, styleSheet: CSSStyleSheet);
     insertRule(className: string, tag: string): void;
     setValue(key: string, value: string, priority: RulePriority, appendToClassName?: boolean): void;
     isEmpty(): boolean;
     clear(): void;
 }
+export {};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "flinker-dom",
   "description": "Free TypeScript library for writing frontend apps",
-  "version": "1.1.11",
+  "version": "1.1.13",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/Dittner/FlinkerDOM.git"