@node-projects/web-component-designer 0.1.353 → 0.2.2

package/dist/elements/services/propertiesService/DefaultEditorTypesService.js

@@ -8,11 +8,14 @@ import { BooleanPropertyEditor } from './propertyEditors/BooleanPropertyEditor.j
 import { ImageButtonListPropertyEditor } from './propertyEditors/ImageButtonListPropertyEditor.js';
 import { ThicknessPropertyEditor } from "./propertyEditors/ThicknessPropertyEditor.js";
 import { FontPropertyEditor } from './propertyEditors/FontPropertyEditor.js';
-import { AnglePropertyEditor } from './propertyEditors/AnglePropertyEditor.js';
+import { CssNumericPropertyEditor } from './propertyEditors/CssNumericPropertyEditor.js';
+import { isCssNumericPropertyType } from './propertyEditors/CssNumericPropertyEditorConfig.js';
 export class DefaultEditorTypesService {
     getEditorForProperty(property) {
         if (property.createEditor)
             return property.createEditor(property);
+        if (isCssNumericPropertyType(property.type, property.name))
+            return new CssNumericPropertyEditor(property);
         switch (property.type) {
             case "json":
                 {
@@ -34,10 +37,6 @@ export class DefaultEditorTypesService {
                 {
                     return new NumberPropertyEditor(property);
                 }
-            case "angle":
-                {
-                    return new AnglePropertyEditor(property);
-                }
             case "list":
                 {
                     return new SelectPropertyEditor(property);
@@ -58,7 +57,6 @@ export class DefaultEditorTypesService {
                 {
                     return new ThicknessPropertyEditor(property);
                 }
-            case "css-length":
             case "string":
             default:
                 {

package/dist/elements/services/propertiesService/DefaultEditorTypesService.js.map

@@ -1 +1 @@
-{"version":3,"file":"DefaultEditorTypesService.js","sourceRoot":"","sources":["../../../../src/elements/services/propertiesService/DefaultEditorTypesService.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,mBAAmB,EAAE,MAAM,0CAA0C,CAAC;AAC/E,OAAO,EAAE,kBAAkB,EAAE,MAAM,yCAAyC,CAAC;AAC7E,OAAO,EAAE,kBAAkB,EAAE,MAAM,yCAAyC,CAAC;AAC7E,OAAO,EAAE,oBAAoB,EAAE,MAAM,2CAA2C,CAAC;AACjF,OAAO,EAAE,oBAAoB,EAAE,MAAM,2CAA2C,CAAC;AACjF,OAAO,EAAE,kBAAkB,EAAE,MAAM,yCAAyC,CAAC;AAC7E,OAAO,EAAE,qBAAqB,EAAE,MAAM,4CAA4C,CAAC;AACnF,OAAO,EAAE,6BAA6B,EAAE,MAAM,oDAAoD,CAAC;AACnG,OAAO,EAAE,uBAAuB,EAAE,MAAM,8CAA8C,CAAC;AACvF,OAAO,EAAE,kBAAkB,EAAE,MAAM,yCAAyC,CAAC;AAC7E,OAAO,EAAE,mBAAmB,EAAE,MAAM,0CAA0C,CAAC;AAE/E,MAAM,OAAO,yBAAyB;IACpC,oBAAoB,CAAC,QAAmB;QACtC,IAAI,QAAQ,CAAC,YAAY;YACvB,OAAO,QAAQ,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC;QAEzC,QAAqB,QAAQ,CAAC,IAAI,EAAE,CAAC;YACnC,KAAK,MAAM;gBACT,CAAC;oBACC,OAAO,IAAI,kBAAkB,CAAC,QAAQ,CAAC,CAAC;gBAC1C,CAAC;YACH,KAAK,OAAO;gBACV,CAAC;oBACC,OAAO,IAAI,mBAAmB,CAAC,QAAQ,CAAC,CAAC;gBAC3C,CAAC;YACH,KAAK,MAAM;gBACT,CAAC;oBACC,OAAO,IAAI,kBAAkB,CAAC,QAAQ,CAAC,CAAC;gBAC1C,CAAC;YACH,KAAK,MAAM;gBACT,CAAC;oBACC,OAAO,IAAI,kBAAkB,CAAC,QAAQ,CAAC,CAAC;gBAC1C,CAAC;YACH,KAAK,QAAQ;gBACX,CAAC;oBACC,OAAO,IAAI,oBAAoB,CAAC,QAAQ,CAAC,CAAC;gBAC5C,CAAC;YACH,KAAK,OAAO;gBACV,CAAC;oBACC,OAAO,IAAI,mBAAmB,CAAC,QAAQ,CAAC,CAAC;gBAC3C,CAAC;YACH,KAAK,MAAM;gBACT,CAAC;oBACC,OAAO,IAAI,oBAAoB,CAAC,QAAQ,CAAC,CAAC;gBAC5C,CAAC;YACH,KAAK,MAAM;gBACT,CAAC;oBACC,OAAO,IAAI,oBAAoB,CAAC,QAAQ,CAAC,CAAC;gBAC5C,CAAC;YACH,KAAK,SAAS;gBACZ,CAAC;oBACC,OAAO,IAAI,qBAAqB,CAAC,QAAQ,CAAC,CAAC;gBAC7C,CAAC;YACH,KAAK,UAAU;gBACb,CAAC;oBACC,OAAO,IAAI,6BAA6B,CAAC,QAAQ,CAAC,CAAC;gBACrD,CAAC;YACH,KAAK,WAAW;gBACd,CAAC;oBACC,OAAO,IAAI,uBAAuB,CAAC,QAAQ,CAAC,CAAC;gBAC/C,CAAC;YACH,KAAK,YAAY,CAAC;YAClB,KAAK,QAAQ,CAAC;YACd;gBACE,CAAC;oBACC,OAAO,IAAI,kBAAkB,CAAC,QAAQ,CAAC,CAAC;gBAC1C,CAAC;QACL,CAAC;IACH,CAAC;CACF"}
+{"version":3,"file":"DefaultEditorTypesService.js","sourceRoot":"","sources":["../../../../src/elements/services/propertiesService/DefaultEditorTypesService.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,mBAAmB,EAAE,MAAM,0CAA0C,CAAC;AAC/E,OAAO,EAAE,kBAAkB,EAAE,MAAM,yCAAyC,CAAC;AAC7E,OAAO,EAAE,kBAAkB,EAAE,MAAM,yCAAyC,CAAC;AAC7E,OAAO,EAAE,oBAAoB,EAAE,MAAM,2CAA2C,CAAC;AACjF,OAAO,EAAE,oBAAoB,EAAE,MAAM,2CAA2C,CAAC;AACjF,OAAO,EAAE,kBAAkB,EAAE,MAAM,yCAAyC,CAAC;AAC7E,OAAO,EAAE,qBAAqB,EAAE,MAAM,4CAA4C,CAAC;AACnF,OAAO,EAAE,6BAA6B,EAAE,MAAM,oDAAoD,CAAC;AACnG,OAAO,EAAE,uBAAuB,EAAE,MAAM,8CAA8C,CAAC;AACvF,OAAO,EAAE,kBAAkB,EAAE,MAAM,yCAAyC,CAAC;AAC7E,OAAO,EAAE,wBAAwB,EAAE,MAAM,+CAA+C,CAAC;AACzF,OAAO,EAAE,wBAAwB,EAAE,MAAM,qDAAqD,CAAC;AAE/F,MAAM,OAAO,yBAAyB;IACpC,oBAAoB,CAAC,QAAmB;QACtC,IAAI,QAAQ,CAAC,YAAY;YACvB,OAAO,QAAQ,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC;QAEzC,IAAI,wBAAwB,CAAC,QAAQ,CAAC,IAAI,EAAE,QAAQ,CAAC,IAAI,CAAC;YACxD,OAAO,IAAI,wBAAwB,CAAC,QAAQ,CAAC,CAAC;QAEhD,QAAqB,QAAQ,CAAC,IAAI,EAAE,CAAC;YACnC,KAAK,MAAM;gBACT,CAAC;oBACC,OAAO,IAAI,kBAAkB,CAAC,QAAQ,CAAC,CAAC;gBAC1C,CAAC;YACH,KAAK,OAAO;gBACV,CAAC;oBACC,OAAO,IAAI,mBAAmB,CAAC,QAAQ,CAAC,CAAC;gBAC3C,CAAC;YACH,KAAK,MAAM;gBACT,CAAC;oBACC,OAAO,IAAI,kBAAkB,CAAC,QAAQ,CAAC,CAAC;gBAC1C,CAAC;YACH,KAAK,MAAM;gBACT,CAAC;oBACC,OAAO,IAAI,kBAAkB,CAAC,QAAQ,CAAC,CAAC;gBAC1C,CAAC;YACH,KAAK,QAAQ;gBACX,CAAC;oBACC,OAAO,IAAI,oBAAoB,CAAC,QAAQ,CAAC,CAAC;gBAC5C,CAAC;YACH,KAAK,MAAM;gBACT,CAAC;oBACC,OAAO,IAAI,oBAAoB,CAAC,QAAQ,CAAC,CAAC;gBAC5C,CAAC;YACH,KAAK,MAAM;gBACT,CAAC;oBACC,OAAO,IAAI,oBAAoB,CAAC,QAAQ,CAAC,CAAC;gBAC5C,CAAC;YACH,KAAK,SAAS;gBACZ,CAAC;oBACC,OAAO,IAAI,qBAAqB,CAAC,QAAQ,CAAC,CAAC;gBAC7C,CAAC;YACH,KAAK,UAAU;gBACb,CAAC;oBACC,OAAO,IAAI,6BAA6B,CAAC,QAAQ,CAAC,CAAC;gBACrD,CAAC;YACH,KAAK,WAAW;gBACd,CAAC;oBACC,OAAO,IAAI,uBAAuB,CAAC,QAAQ,CAAC,CAAC;gBAC/C,CAAC;YACH,KAAK,QAAQ,CAAC;YACd;gBACE,CAAC;oBACC,OAAO,IAAI,kBAAkB,CAAC,QAAQ,CAAC,CAAC;gBAC1C,CAAC;QACL,CAAC;IACH,CAAC;CACF"}

package/dist/elements/services/propertiesService/IProperty.d.ts

@@ -1,6 +1,7 @@
 import { IPropertiesService } from './IPropertiesService.js';
 import { IPropertyEditor } from './IPropertyEditor.js';
 import { PropertyType } from './PropertyType.js';
+import type { IDesignItem } from '../../item/IDesignItem.js';
 export interface IProperty {
     name: string;
     renamable?: boolean;
@@ -9,13 +10,17 @@ export interface IProperty {
     group?: string;
     attributeName?: string;
     description?: string;
-    type?: 'addNew' | 'json' | 'color' | 'date' | 'number' | 'list' | 'enum' | 'boolean' | 'img-lis' | 'thickness' | 'css-length' | 'string' | string;
+    type?: 'addNew' | 'json' | 'color' | 'date' | 'number' | 'list' | 'enum' | 'boolean' | 'img-lis' | 'thickness' | 'css-length' | 'length' | 'angle' | 'time' | 'frequency' | 'flex' | 'resolution' | 'string' | string;
     default?: any;
     min?: number;
     max?: number;
     step?: number;
     readonly?: boolean;
     values?: string[];
+    units?: string[];
+    unitSteps?: Record<string, number>;
+    numericValueDecimalPlaces?: number;
+    numericValueConverter?: (value: number, fromUnit: string, toUnit: string, property: IProperty, numericType: string, numberText?: string, rawValue?: string, designItems?: IDesignItem[]) => string | number | null | undefined;
     enumValues?: [name: string, value: string | number][];
     createEditor?: (property: IProperty) => IPropertyEditor;
     value?: any;

package/dist/elements/services/propertiesService/PropertyMutationHandling.d.ts

@@ -0,0 +1,6 @@
+export type AttributeMutationRecordLike = Pick<MutationRecord, 'type' | 'attributeName' | 'oldValue'> & {
+    target: unknown;
+};
+export declare function didAttributePresenceChange(mutation: AttributeMutationRecordLike): boolean;
+export declare function didStyleDeclarationSetChange(mutation: AttributeMutationRecordLike, filter?: (name: string) => boolean): boolean;
+export declare function didCustomStyleDeclarationSetChange(mutation: AttributeMutationRecordLike): boolean;

package/dist/elements/services/propertiesService/PropertyMutationHandling.js

@@ -0,0 +1,89 @@
+function getMutationAttributeValue(mutation) {
+    const target = mutation.target;
+    if (typeof target.getAttribute !== 'function' || !mutation.attributeName)
+        return null;
+    return target.getAttribute(mutation.attributeName);
+}
+function getStyleDeclarationNames(styleText, filter) {
+    const names = new Set();
+    if (!styleText)
+        return names;
+    let name = '';
+    let inValue = false;
+    let quote = null;
+    for (let i = 0; i < styleText.length; i++) {
+        const char = styleText[i];
+        if (quote) {
+            if (char === '\\') {
+                i++;
+                continue;
+            }
+            if (char === quote)
+                quote = null;
+            continue;
+        }
+        if (char === '\'' || char === '"') {
+            quote = char;
+            continue;
+        }
+        if (!inValue) {
+            if (char === ':') {
+                inValue = true;
+                continue;
+            }
+            if (char === ';') {
+                name = '';
+                continue;
+            }
+            name += char;
+            continue;
+        }
+        if (char === ';') {
+            const trimmedName = name.trim();
+            if (trimmedName && (!filter || filter(trimmedName)))
+                names.add(trimmedName);
+            name = '';
+            inValue = false;
+        }
+    }
+    if (inValue) {
+        const trimmedName = name.trim();
+        if (trimmedName && (!filter || filter(trimmedName)))
+            names.add(trimmedName);
+    }
+    else {
+        const trimmedName = name.trim();
+        if (!name)
+            return names;
+        if (!filter || filter(trimmedName))
+            names.add(trimmedName);
+    }
+    return names;
+}
+function areSetsEqual(left, right) {
+    if (left.size !== right.size)
+        return false;
+    for (const value of left) {
+        if (!right.has(value))
+            return false;
+    }
+    return true;
+}
+export function didAttributePresenceChange(mutation) {
+    if (mutation.type !== 'attributes' || !mutation.attributeName)
+        return false;
+    const currentValue = getMutationAttributeValue(mutation);
+    return mutation.oldValue == null || currentValue == null;
+}
+export function didStyleDeclarationSetChange(mutation, filter) {
+    if (mutation.type !== 'attributes' || mutation.attributeName !== 'style')
+        return false;
+    const currentValue = getMutationAttributeValue(mutation);
+    const oldNames = getStyleDeclarationNames(mutation.oldValue, filter);
+    const currentNames = getStyleDeclarationNames(currentValue, filter);
+    return !areSetsEqual(oldNames, currentNames);
+}
+export function didCustomStyleDeclarationSetChange(mutation) {
+    return didStyleDeclarationSetChange(mutation, name => name.startsWith('--'));
+}
+//# sourceMappingURL=PropertyMutationHandling.js.map

package/dist/elements/services/propertiesService/PropertyMutationHandling.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PropertyMutationHandling.js","sourceRoot":"","sources":["../../../../src/elements/services/propertiesService/PropertyMutationHandling.ts"],"names":[],"mappings":"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"}

package/dist/elements/services/propertiesService/propertyEditors/BasePropertyEditor.d.ts

@@ -8,6 +8,8 @@ export declare abstract class BasePropertyEditor<T extends HTMLElement> implemen
     designItems: IDesignItem[];
     protected disableChangeNotification: boolean;
     constructor(property: IProperty);
+    protected _previewValueChanged(newValue: any): Promise<void>;
+    protected _removePreviewValue(): Promise<void>;
     protected _valueChanged(newValue: any): Promise<void>;
     designItemsChanged(designItems: IDesignItem[]): void;
     abstract refreshValue(valueType: ValueType, value: any): any;

package/dist/elements/services/propertiesService/propertyEditors/BasePropertyEditor.js

@@ -7,6 +7,18 @@ export class BasePropertyEditor {
     constructor(property) {
         this.property = property;
     }
+    async _previewValueChanged(newValue) {
+        if (!this.disableChangeNotification) {
+            if (this.designItems && this.designItems.length)
+                await this.property.service.previewValue?.(this.designItems, this.property, newValue);
+        }
+    }
+    async _removePreviewValue() {
+        if (!this.disableChangeNotification) {
+            if (this.designItems && this.designItems.length)
+                await this.property.service.removePreviewValue?.(this.designItems, this.property);
+        }
+    }
     async _valueChanged(newValue) {
         if (!this.disableChangeNotification) {
             if (this.designItems && this.designItems.length) {

package/dist/elements/services/propertiesService/propertyEditors/BasePropertyEditor.js.map

@@ -1 +1 @@
-{"version":3,"file":"BasePropertyEditor.js","sourceRoot":"","sources":["../../../../../src/elements/services/propertiesService/propertyEditors/BasePropertyEditor.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAG5C,MAAM,OAAgB,kBAAkB;IAE/B,OAAO,CAAI;IACX,QAAQ,CAAY;IACpB,WAAW,CAAgB;IAExB,yBAAyB,GAAY,KAAK,CAAC;IAErD,YAAY,QAAmB;QAC7B,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;IAC3B,CAAC;IAES,KAAK,CAAC,aAAa,CAAC,QAAQ;QACpC,IAAI,CAAC,IAAI,CAAC,yBAAyB,EAAE,CAAC;YACpC,IAAI,IAAI,CAAC,WAAW,IAAI,IAAI,CAAC,WAAW,CAAC,MAAM,EAAE,CAAC;gBAChD,MAAM,EAAE,GAAG,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,gBAAgB,GAAG,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;gBAChF,IAAI,QAAQ,IAAI,IAAI;oBAClB,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,UAAU,CAAC,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAC;;oBAE3E,MAAM,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;gBAClF,EAAE,CAAC,MAAM,EAAE,CAAC;YACd,CAAC;QACH,CAAC;IACH,CAAC;IAEM,kBAAkB,CAAC,WAA0B;QAClD,IAAI,CAAC,WAAW,GAAG,WAAW,CAAC;IACjC,CAAC;IAIM,+BAA+B,CAAC,SAAoB,EAAE,KAAU;QACrE,IAAI,SAAS,IAAI,SAAS,CAAC,IAAI;YAC7B,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC,aAAa,CAAC,CAAC;;YAE1C,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,MAAM,CAAC,aAAa,CAAC,CAAC;QAC/C,IAAI,CAAC,yBAAyB,GAAG,IAAI,CAAC;QACtC,IAAI,CAAC;YACH,IAAI,CAAC,YAAY,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC;QACtC,CAAC;QAAC,OAAO,GAAG,EAAE,CAAC;YACb,OAAO,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;QACrB,CAAC;QACD,IAAI,CAAC,yBAAyB,GAAG,KAAK,CAAC;IACzC,CAAC;CACF"}
+{"version":3,"file":"BasePropertyEditor.js","sourceRoot":"","sources":["../../../../../src/elements/services/propertiesService/propertyEditors/BasePropertyEditor.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAG5C,MAAM,OAAgB,kBAAkB;IAE/B,OAAO,CAAI;IACX,QAAQ,CAAY;IACpB,WAAW,CAAgB;IAExB,yBAAyB,GAAY,KAAK,CAAC;IAErD,YAAY,QAAmB;QAC7B,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;IAC3B,CAAC;IAES,KAAK,CAAC,oBAAoB,CAAC,QAAQ;QAC3C,IAAI,CAAC,IAAI,CAAC,yBAAyB,EAAE,CAAC;YACpC,IAAI,IAAI,CAAC,WAAW,IAAI,IAAI,CAAC,WAAW,CAAC,MAAM;gBAC7C,MAAM,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,YAAY,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;QAC1F,CAAC;IACH,CAAC;IAES,KAAK,CAAC,mBAAmB;QACjC,IAAI,CAAC,IAAI,CAAC,yBAAyB,EAAE,CAAC;YACpC,IAAI,IAAI,CAAC,WAAW,IAAI,IAAI,CAAC,WAAW,CAAC,MAAM;gBAC7C,MAAM,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,kBAAkB,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;QACtF,CAAC;IACH,CAAC;IAES,KAAK,CAAC,aAAa,CAAC,QAAQ;QACpC,IAAI,CAAC,IAAI,CAAC,yBAAyB,EAAE,CAAC;YACpC,IAAI,IAAI,CAAC,WAAW,IAAI,IAAI,CAAC,WAAW,CAAC,MAAM,EAAE,CAAC;gBAChD,MAAM,EAAE,GAAG,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,gBAAgB,GAAG,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;gBAChF,IAAI,QAAQ,IAAI,IAAI;oBAClB,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,UAAU,CAAC,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAC;;oBAE3E,MAAM,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;gBAClF,EAAE,CAAC,MAAM,EAAE,CAAC;YACd,CAAC;QACH,CAAC;IACH,CAAC;IAEM,kBAAkB,CAAC,WAA0B;QAClD,IAAI,CAAC,WAAW,GAAG,WAAW,CAAC;IACjC,CAAC;IAIM,+BAA+B,CAAC,SAAoB,EAAE,KAAU;QACrE,IAAI,SAAS,IAAI,SAAS,CAAC,IAAI;YAC7B,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC,aAAa,CAAC,CAAC;;YAE1C,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,MAAM,CAAC,aAAa,CAAC,CAAC;QAC/C,IAAI,CAAC,yBAAyB,GAAG,IAAI,CAAC;QACtC,IAAI,CAAC;YACH,IAAI,CAAC,YAAY,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC;QACtC,CAAC;QAAC,OAAO,GAAG,EAAE,CAAC;YACb,OAAO,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;QACrB,CAAC;QACD,IAAI,CAAC,yBAAyB,GAAG,KAAK,CAAC;IACzC,CAAC;CACF"}

package/dist/elements/services/propertiesService/propertyEditors/CssLengthPropertyEditor.d.ts

@@ -0,0 +1 @@
+export { CssNumericPropertyEditor as CssLengthPropertyEditor } from './CssNumericPropertyEditor.js';

package/dist/elements/services/propertiesService/propertyEditors/CssLengthPropertyEditor.js

@@ -0,0 +1,2 @@
+export { CssNumericPropertyEditor as CssLengthPropertyEditor } from './CssNumericPropertyEditor.js';
+//# sourceMappingURL=CssLengthPropertyEditor.js.map

package/dist/elements/services/propertiesService/propertyEditors/CssLengthPropertyEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CssLengthPropertyEditor.js","sourceRoot":"","sources":["../../../../../src/elements/services/propertiesService/propertyEditors/CssLengthPropertyEditor.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,wBAAwB,IAAI,uBAAuB,EAAE,MAAM,+BAA+B,CAAC"}

package/dist/elements/services/propertiesService/propertyEditors/CssLengthPropertyEditorConfig.d.ts

@@ -0,0 +1,3 @@
+export { defaultCssNumericUnits as defaultCssLengthUnits } from './CssNumericPropertyEditorConfig.js';
+export { getCssNumericEditorConfig as getCssLengthEditorConfig } from './CssNumericPropertyEditorConfig.js';
+export { isCssNumericPropertyType as isCssLengthPropertyType } from './CssNumericPropertyEditorConfig.js';

package/dist/elements/services/propertiesService/propertyEditors/CssLengthPropertyEditorConfig.js

@@ -0,0 +1,4 @@
+export { defaultCssNumericUnits as defaultCssLengthUnits } from './CssNumericPropertyEditorConfig.js';
+export { getCssNumericEditorConfig as getCssLengthEditorConfig } from './CssNumericPropertyEditorConfig.js';
+export { isCssNumericPropertyType as isCssLengthPropertyType } from './CssNumericPropertyEditorConfig.js';
+//# sourceMappingURL=CssLengthPropertyEditorConfig.js.map

package/dist/elements/services/propertiesService/propertyEditors/CssLengthPropertyEditorConfig.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CssLengthPropertyEditorConfig.js","sourceRoot":"","sources":["../../../../../src/elements/services/propertiesService/propertyEditors/CssLengthPropertyEditorConfig.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,sBAAsB,IAAI,qBAAqB,EAAE,MAAM,qCAAqC,CAAC;AACtG,OAAO,EAAE,yBAAyB,IAAI,wBAAwB,EAAE,MAAM,qCAAqC,CAAC;AAC5G,OAAO,EAAE,wBAAwB,IAAI,uBAAuB,EAAE,MAAM,qCAAqC,CAAC"}

package/dist/elements/services/propertiesService/propertyEditors/CssNumericPropertyEditor.d.ts

@@ -0,0 +1,10 @@
+import { NumericStyleInput } from '../../../controls/NumericStyleInput.js';
+import { IDesignItem } from '../../../item/IDesignItem.js';
+import { IProperty } from '../IProperty.js';
+import { BasePropertyEditor } from './BasePropertyEditor.js';
+import { ValueType } from '../ValueType.js';
+export declare class CssNumericPropertyEditor extends BasePropertyEditor<NumericStyleInput> {
+    constructor(property: IProperty);
+    designItemsChanged(designItems: IDesignItem[]): void;
+    refreshValue(valueType: ValueType, value: any): void;
+}

package/dist/elements/services/propertiesService/propertyEditors/CssNumericPropertyEditor.js

@@ -0,0 +1,34 @@
+import { NumericStyleInput } from '../../../controls/NumericStyleInput.js';
+import { BasePropertyEditor } from './BasePropertyEditor.js';
+import { getCssNumericEditorConfig } from './CssNumericPropertyEditorConfig.js';
+export class CssNumericPropertyEditor extends BasePropertyEditor {
+    constructor(property) {
+        super(property);
+        const config = getCssNumericEditorConfig(property);
+        const selector = new NumericStyleInput();
+        selector.units = config?.units ?? property.units ?? [];
+        selector.fixedValues = config?.fixedValues ?? property.values;
+        selector.unitValueConverter = args => config?.convertValue({ ...args, designItems: this.designItems });
+        selector.unitSteps = config?.unitSteps ?? property.unitSteps ?? {};
+        selector.step = property.step;
+        selector.min = property.min;
+        selector.max = property.max;
+        selector.readOnly = property.readonly;
+        selector.valueChanged.on(async (e) => this._valueChanged(e.newValue === '' ? null : e.newValue));
+        selector.valuePreviewChanged.on(async (e) => this._previewValueChanged(e.newValue === '' ? null : e.newValue));
+        selector.valuePreviewFinished.on(async (e) => {
+            await this._removePreviewValue();
+            if (e.wasCancelled)
+                return;
+            await this._valueChanged(e.newValue === '' ? null : e.newValue);
+        });
+        this.element = selector;
+    }
+    designItemsChanged(designItems) {
+        super.designItemsChanged(designItems);
+    }
+    refreshValue(valueType, value) {
+        this.element.value = value == null ? '' : String(value);
+    }
+}
+//# sourceMappingURL=CssNumericPropertyEditor.js.map

package/dist/elements/services/propertiesService/propertyEditors/CssNumericPropertyEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CssNumericPropertyEditor.js","sourceRoot":"","sources":["../../../../../src/elements/services/propertiesService/propertyEditors/CssNumericPropertyEditor.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,wCAAwC,CAAC;AAG3E,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAE7D,OAAO,EAAE,yBAAyB,EAAE,MAAM,qCAAqC,CAAC;AAEhF,MAAM,OAAO,wBAAyB,SAAQ,kBAAqC;IAEjF,YAAY,QAAmB;QAC7B,KAAK,CAAC,QAAQ,CAAC,CAAC;QAEhB,MAAM,MAAM,GAAG,yBAAyB,CAAC,QAAQ,CAAC,CAAC;QACnD,MAAM,QAAQ,GAAG,IAAI,iBAAiB,EAAE,CAAC;QACzC,QAAQ,CAAC,KAAK,GAAG,MAAM,EAAE,KAAK,IAAI,QAAQ,CAAC,KAAK,IAAI,EAAE,CAAC;QACvD,QAAQ,CAAC,WAAW,GAAG,MAAM,EAAE,WAAW,IAAI,QAAQ,CAAC,MAAM,CAAC;QAC9D,QAAQ,CAAC,kBAAkB,GAAG,IAAI,CAAC,EAAE,CAAC,MAAM,EAAE,YAAY,CAAC,EAAE,GAAG,IAAI,EAAE,WAAW,EAAE,IAAI,CAAC,WAAW,EAAE,CAAC,CAAC;QACvG,QAAQ,CAAC,SAAS,GAAG,MAAM,EAAE,SAAS,IAAI,QAAQ,CAAC,SAAS,IAAI,EAAE,CAAC;QACnE,QAAQ,CAAC,IAAI,GAAG,QAAQ,CAAC,IAAI,CAAC;QAC9B,QAAQ,CAAC,GAAG,GAAG,QAAQ,CAAC,GAAG,CAAC;QAC5B,QAAQ,CAAC,GAAG,GAAG,QAAQ,CAAC,GAAG,CAAC;QAC5B,QAAQ,CAAC,QAAQ,GAAG,QAAQ,CAAC,QAAQ,CAAC;QACtC,QAAQ,CAAC,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,QAAQ,KAAK,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC;QACjG,QAAQ,CAAC,mBAAmB,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAC,CAAC,QAAQ,KAAK,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC;QAC/G,QAAQ,CAAC,oBAAoB,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE;YAC3C,MAAM,IAAI,CAAC,mBAAmB,EAAE,CAAC;YACjC,IAAI,CAAC,CAAC,YAAY;gBAChB,OAAO;YACT,MAAM,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,QAAQ,KAAK,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC;QAClE,CAAC,CAAC,CAAC;QACH,IAAI,CAAC,OAAO,GAAG,QAAQ,CAAC;IAC1B,CAAC;IAEe,kBAAkB,CAAC,WAA0B;QAC3D,KAAK,CAAC,kBAAkB,CAAC,WAAW,CAAC,CAAC;IACxC,CAAC;IAED,YAAY,CAAC,SAAoB,EAAE,KAAU;QAC3C,IAAI,CAAC,OAAO,CAAC,KAAK,GAAG,KAAK,IAAI,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;IAC1D,CAAC;CACF"}

package/dist/elements/services/propertiesService/propertyEditors/CssNumericPropertyEditorConfig.d.ts

@@ -0,0 +1,30 @@
+import type { IDesignItem } from '../../../item/IDesignItem.js';
+import type { IProperty } from '../IProperty.js';
+export type CssNumericPropertyType = 'length' | 'angle' | 'time' | 'frequency' | 'flex' | 'resolution';
+export type CssNumericUnitConversionResult = string | number | null | undefined;
+export type CssNumericUnitConversionContext = {
+    property: IProperty;
+    numericType: CssNumericPropertyType;
+    designItems?: IDesignItem[];
+    value: number;
+    numberText: string;
+    rawValue: string;
+    fromUnit: string;
+    toUnit: string;
+};
+export type CssNumericEditorConfig = {
+    numericType: CssNumericPropertyType;
+    units: string[];
+    fixedValues: string[];
+    unitSteps: Record<string, number>;
+    convertValue: (context: Omit<CssNumericUnitConversionContext, 'property' | 'numericType'>) => string;
+};
+export declare const defaultCssNumericUnits: Record<CssNumericPropertyType, string[]>;
+export declare const defaultCssNumericUnitSteps: Record<CssNumericPropertyType, Record<string, number>>;
+export declare function defaultConvertCssNumericUnitValue(context: CssNumericUnitConversionContext): string;
+export declare function getCssNumericPropertyType(type?: string, propertyName?: string): CssNumericPropertyType | null;
+export declare function isCssNumericPropertyType(type?: string, propertyName?: string): boolean;
+export declare function convertCssNumericUnitValue(context: CssNumericUnitConversionContext): string;
+export declare function getCssNumericKeywordValues(values?: string[]): string[];
+export declare function applyCssNumericPropertyDefaults(property: IProperty): IProperty;
+export declare function getCssNumericEditorConfig(property: IProperty): CssNumericEditorConfig | null;