1 files changed, 23 insertions, 0 deletions
diff --git a/packages/integrations/markdoc/src/html/css/parse-inline-css-to-react.ts b/packages/integrations/markdoc/src/html/css/parse-inline-css-to-react.ts
new file mode 100644
index 000000000..3b67f9a32
--- /dev/null
+++ b/packages/integrations/markdoc/src/html/css/parse-inline-css-to-react.ts
@@ -0,0 +1,23 @@
+
+import { styleToObject } from "./style-to-object.js";
+
+export function parseInlineCSSToReactLikeObject(css: string | undefined | null): React.CSSProperties | undefined {
+  if (typeof css === "string") {
+    const cssObject: Record<string, string> = {};
+    styleToObject(css, (originalCssDirective: string, value: string) => {
+      const reactCssDirective = convertCssDirectiveNameToReactCamelCase(originalCssDirective);
+      cssObject[reactCssDirective] = value;
+    });
+    return cssObject;
+  }
+
+  return undefined;
+}
+
+function convertCssDirectiveNameToReactCamelCase(original: string): string {
+  // capture group 1 is the character to capitalize, the hyphen is omitted by virtue of being outside the capture group
+  const replaced = original.replace(/-([a-z0-9])/ig, (_match, char) => {
+    return char.toUpperCase();
+  });
+  return replaced;
+}