@lvce-editor/virtual-dom 7.5.0 → 8.0.0

package/dist/index.js

@@ -472,6 +472,22 @@ const attachEvent = ($Node, eventMap, key, value, newEventMap) => {
   $Node.addEventListener(keyLower, wrapped, options);
 };
 
+const STYLE_REGEX = /([^:;]+):\s*([^;]+)/g;
+const KEBAB_CASE_REGEX = /-([a-z])/g;
+const setStyle = ($Element, styleString) => {
+  if (typeof styleString !== 'string') {
+    return;
+  }
+  let match;
+  while ((match = STYLE_REGEX.exec(styleString)) !== null) {
+    const key = match[1].trim();
+    const value = match[2].trim();
+    // Convert kebab-case to camelCase for CSS properties with dashes
+    const camelCaseKey = key.replaceAll(KEBAB_CASE_REGEX, (_, char) => char.toUpperCase());
+    $Element.style[camelCaseKey] = value;
+  }
+};
+
 const setProp = ($Element, key, value, eventMap, newEventMap) => {
   switch (key) {
     case 'ariaActivedescendant':
@@ -495,6 +511,9 @@ const setProp = ($Element, key, value, eventMap, newEventMap) => {
         $Element.removeAttribute('aria-owns');
       }
       break;
+    case 'childCount':
+    case 'type':
+      break;
     case 'height':
     case 'width':
       if ($Element instanceof HTMLImageElement) {
@@ -560,9 +579,7 @@ const setProp = ($Element, key, value, eventMap, newEventMap) => {
       attachEvent($Element, eventMap, eventName, value, newEventMap);
       break;
     case 'style':
-      throw new Error('style property is not supported');
-    case 'childCount':
-    case 'type':
+      setStyle($Element, value);
       break;
     case 'translate':
       $Element.style[key] = value;

package/dist/parts/SetStyle/SetStyle.d.ts

@@ -0,0 +1 @@
+export declare const setStyle: ($Element: HTMLElement, styleString: string) => void;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lvce-editor/virtual-dom",
-  "version": "7.5.0",
+  "version": "8.0.0",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/lvce-editor/virtual-dom.git"