flinker-dom 1.1.10 → 1.1.12

package/dist/esm/core.js

@@ -115,6 +115,7 @@ const RuleBuilder = () => {
     operator.borderRight = (value) => { setValue('border-right', Array.isArray(value) ? value.join(' ') : value); };
     operator.borderTop = (value) => { setValue('border-top', Array.isArray(value) ? value.join(' ') : value); };
     operator.borderBottom = (value) => { setValue('border-bottom', Array.isArray(value) ? value.join(' ') : value); };
+    operator.content = (value) => { setValue('content', value); };
     operator.cornerRadius = (value) => { setValue('border-radius', value); };
     operator.opacity = (value) => { setValue('opacity', value); };
     operator.shadow = (value) => { setValue('box-shadow', value); };

package/dist/esm/processor.js

@@ -17,6 +17,7 @@ const abbreviations = {
     'box-shadow': 'BS',
     'caret-color': 'CC',
     'color': 'C',
+    'content': 'CO',
     'cursor': 'CU',
     'display': 'D',
     'flex-direction': 'F',
@@ -70,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);
             }
@@ -108,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);
         }
     }
@@ -142,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/core.d.ts

@@ -28,6 +28,7 @@ export interface UIComponentProps {
     children?: any;
     className?: string;
     cornerRadius?: string;
+    content?: string;
     cursor?: 'auto' | 'pointer' | 'wait' | 'crosshair' | 'not-allowed' | 'zoom-in' | 'grab' | 'inherit';
     disableHorizontalScroll?: boolean;
     disableScroll?: boolean;

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.10",
+  "version": "1.1.12",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/Dittner/FlinkerDOM.git"