npm - roosterjs-content-model-core - Versions diffs - 0.21.0 → 0.21.1 - Mend

roosterjs-content-model-core 0.21.0 → 0.21.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (16) hide show

package/lib/editor/DarkColorHandlerImpl.d.ts CHANGED Viewed

@@ -4,9 +4,9 @@ import type { ColorKeyAndValue, DarkColorHandler, ModeIndependentColor } from 'r
  */
 export declare class DarkColorHandlerImpl implements DarkColorHandler {
     private contentDiv;
+    private getDarkColor;
     private knownColors;
-    readonly baseLightness: number;
-    constructor(contentDiv: HTMLElement, baseDarkColor?: string);
+    constructor(contentDiv: HTMLElement, getDarkColor: (color: string) => string);
     /**
      * Get a copy of known colors
      * @returns

package/lib/editor/DarkColorHandlerImpl.js CHANGED Viewed

@@ -2,9 +2,7 @@
 var _a, _b;
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.DarkColorHandlerImpl = void 0;
-var Color = require("color");
 var roosterjs_editor_dom_1 = require("roosterjs-editor-dom");
-var DefaultLightness = 21.25; // Lightness for #333333
 var VARIABLE_REGEX = /^\s*var\(\s*(\-\-[a-zA-Z0-9\-_]+)\s*(?:,\s*(.*))?\)\s*$/;
 var VARIABLE_PREFIX = 'var(';
 var COLOR_VAR_PREFIX = 'darkColor';
@@ -27,10 +25,10 @@ var ColorAttributeName = [
  * @internal
  */
 var DarkColorHandlerImpl = /** @class */ (function () {
-    function DarkColorHandlerImpl(contentDiv, baseDarkColor) {
+    function DarkColorHandlerImpl(contentDiv, getDarkColor) {
         this.contentDiv = contentDiv;
+        this.getDarkColor = getDarkColor;
         this.knownColors = {};
-        this.baseLightness = getLightness(baseDarkColor);
     }
     /**
      * Get a copy of known colors
@@ -58,7 +56,7 @@ var DarkColorHandlerImpl = /** @class */ (function () {
             colorKey =
                 colorKey || "--" + COLOR_VAR_PREFIX + "_" + lightModeColor.replace(/[^\d\w]/g, '_');
             if (!this.knownColors[colorKey]) {
-                darkModeColor = darkModeColor || getDarkColor(lightModeColor, this.baseLightness);
+                darkModeColor = darkModeColor || this.getDarkColor(lightModeColor);
                 this.knownColors[colorKey] = { lightModeColor: lightModeColor, darkModeColor: darkModeColor };
                 this.contentDiv.style.setProperty(colorKey, darkModeColor);
             }
@@ -157,28 +155,4 @@ var DarkColorHandlerImpl = /** @class */ (function () {
     return DarkColorHandlerImpl;
 }());
 exports.DarkColorHandlerImpl = DarkColorHandlerImpl;
-function getDarkColor(color, baseLightness) {
-    try {
-        var computedColor = Color(color || undefined);
-        var colorLab = computedColor.lab().array();
-        var newLValue = (100 - colorLab[0]) * ((100 - baseLightness) / 100) + baseLightness;
-        color = Color.lab(newLValue, colorLab[1], colorLab[2])
-            .rgb()
-            .alpha(computedColor.alpha())
-            .toString();
-    }
-    catch (_a) { }
-    return color;
-}
-function getLightness(color) {
-    var result = DefaultLightness;
-    if (color) {
-        try {
-            var computedColor = Color(color || undefined);
-            result = computedColor.lab().array()[0];
-        }
-        catch (_a) { }
-    }
-    return result;
-}
 //# sourceMappingURL=DarkColorHandlerImpl.js.map

package/lib/editor/DarkColorHandlerImpl.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DarkColorHandlerImpl.js","sourceRoot":"","sources":["../../../../packages-content-model/roosterjs-content-model-core/lib/editor/DarkColorHandlerImpl.ts"],"names":[],"mappings":"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","sourcesContent":["import * as Color from 'color';\nimport { getObjectKeys, parseColor, setColor } from 'roosterjs-editor-dom';\nimport type {\n ColorKeyAndValue,\n DarkColorHandler,\n ModeIndependentColor,\n} from 'roosterjs-editor-types';\n\nconst DefaultLightness = 21.25; // Lightness for #333333\nconst VARIABLE_REGEX = /^\\svar\$\\s(\\-\\-[a-zA-Z0-9\\-_]+)\\s(?:,\\s(.))?\$\\s$/;\nconst VARIABLE_PREFIX = 'var(';\nconst COLOR_VAR_PREFIX = 'darkColor';\nconst enum ColorAttributeEnum {\n CssColor = 0,\n HtmlColor = 1,\n}\nconst ColorAttributeName: { [key in ColorAttributeEnum]: string }[] = [\n {\n [ColorAttributeEnum.CssColor]: 'color',\n [ColorAttributeEnum.HtmlColor]: 'color',\n },\n {\n [ColorAttributeEnum.CssColor]: 'background-color',\n [ColorAttributeEnum.HtmlColor]: 'bgcolor',\n },\n];\n\n/*\n @internal\n /\nexport class DarkColorHandlerImpl implements DarkColorHandler {\n private knownColors: Record<string, Readonly<ModeIndependentColor>> = {};\n readonly baseLightness: number;\n\n constructor(private contentDiv: HTMLElement, baseDarkColor?: string) {\n this.baseLightness = getLightness(baseDarkColor);\n }\n\n /\n Get a copy of known colors\n * @returns\n /\n getKnownColorsCopy() {\n return Object.values(this.knownColors);\n }\n\n /\n Given a light mode color value and an optional dark mode color value, register this color\n * so that editor can handle it, then return the CSS color value for current color mode.\n * @param lightModeColor Light mode color value\n * @param isDarkMode Whether current color mode is dark mode\n * @param darkModeColor Optional dark mode color value. If not passed, we will calculate one.\n /\n registerColor(lightModeColor: string, isDarkMode: boolean, darkModeColor?: string): string {\n const parsedColor = this.parseColorValue(lightModeColor);\n let colorKey: string \| undefined;\n\n if (parsedColor) {\n lightModeColor = parsedColor.lightModeColor;\n darkModeColor = parsedColor.darkModeColor \|\| darkModeColor;\n colorKey = parsedColor.key;\n }\n\n if (isDarkMode && lightModeColor) {\n colorKey =\n colorKey \|\| `--${COLOR_VAR_PREFIX}_${lightModeColor.replace(/[^\\d\\w]/g, '_')}`;\n\n if (!this.knownColors[colorKey]) {\n darkModeColor = darkModeColor \|\| getDarkColor(lightModeColor, this.baseLightness);\n\n this.knownColors[colorKey] = { lightModeColor, darkModeColor };\n this.contentDiv.style.setProperty(colorKey, darkModeColor);\n }\n\n return `var(${colorKey}, ${lightModeColor})`;\n } else {\n return lightModeColor;\n }\n }\n\n /\n Reset known color record, clean up registered color variables.\n /\n reset(): void {\n getObjectKeys(this.knownColors).forEach(key => this.contentDiv.style.removeProperty(key));\n this.knownColors = {};\n }\n\n /\n Parse an existing color value, if it is in variable-based color format, extract color key,\n * light color and query related dark color if any\n * @param color The color string to parse\n * @param isInDarkMode Whether current content is in dark mode. When set to true, if the color value is not in dark var format,\n * we will treat is as a dark mode color and try to find a matched dark mode color.\n /\n parseColorValue(color: string \| undefined \| null, isInDarkMode?: boolean): ColorKeyAndValue {\n let key: string \| undefined;\n let lightModeColor = '';\n let darkModeColor: string \| undefined;\n\n if (color) {\n const match = color.startsWith(VARIABLE_PREFIX) ? VARIABLE_REGEX.exec(color) : null;\n\n if (match) {\n if (match[2]) {\n key = match[1];\n lightModeColor = match[2];\n darkModeColor = this.knownColors[key]?.darkModeColor;\n } else {\n lightModeColor = '';\n }\n } else if (isInDarkMode) {\n // If editor is in dark mode but the color is not in dark color format, it is possible the color was inserted from external code\n // without any light color info. So we first try to see if there is a known dark color can match this color, and use its related\n // light color as light mode color. Otherwise we need to drop this color to avoid show \"white on white\" content.\n lightModeColor = this.findLightColorFromDarkColor(color) \|\| '';\n\n if (lightModeColor) {\n darkModeColor = color;\n }\n } else {\n lightModeColor = color;\n }\n }\n\n return { key, lightModeColor, darkModeColor };\n }\n\n /\n Find related light mode color from dark mode color.\n * @param darkColor The existing dark color\n /\n findLightColorFromDarkColor(darkColor: string): string \| null {\n const rgbSearch = parseColor(darkColor);\n\n if (rgbSearch) {\n const key = getObjectKeys(this.knownColors).find(key => {\n const rgbCurrent = parseColor(this.knownColors[key].darkModeColor);\n\n return (\n rgbCurrent &&\n rgbCurrent[0] == rgbSearch[0] &&\n rgbCurrent[1] == rgbSearch[1] &&\n rgbCurrent[2] == rgbSearch[2]\n );\n });\n\n if (key) {\n return this.knownColors[key].lightModeColor;\n }\n }\n\n return null;\n }\n\n /\n Transform element color, from dark to light or from light to dark\n * @param element The element to transform color\n * @param fromDarkMode Whether this is transforming color from dark mode\n * @param toDarkMode Whether this is transforming color to dark mode\n /\n transformElementColor(element: HTMLElement, fromDarkMode: boolean, toDarkMode: boolean): void {\n ColorAttributeName.forEach((names, i) => {\n const color = this.parseColorValue(\n element.style.getPropertyValue(names[ColorAttributeEnum.CssColor]) \|\|\n element.getAttribute(names[ColorAttributeEnum.HtmlColor]),\n !!fromDarkMode\n ).lightModeColor;\n\n element.style.setProperty(names[ColorAttributeEnum.CssColor], null);\n element.removeAttribute(names[ColorAttributeEnum.HtmlColor]);\n\n if (color && color != 'inherit') {\n setColor(element, color, i != 0, toDarkMode, false /shouldAdaptFontColor/, this);\n }\n });\n }\n}\n\nfunction getDarkColor(color: string, baseLightness: number): string {\n try {\n const computedColor = Color(color \|\| undefined);\n const colorLab = computedColor.lab().array();\n const newLValue = (100 - colorLab[0]) ((100 - baseLightness) / 100) + baseLightness;\n color = Color.lab(newLValue, colorLab[1], colorLab[2])\n .rgb()\n .alpha(computedColor.alpha())\n .toString();\n } catch {}\n\n return color;\n}\n\nfunction getLightness(color?: string): number {\n let result = DefaultLightness;\n\n if (color) {\n try {\n const computedColor = Color(color \|\| undefined);\n result = computedColor.lab().array()[0];\n } catch {}\n }\n\n return result;\n}\n"]}
1	+ {"version":3,"file":"DarkColorHandlerImpl.js","sourceRoot":"","sources":["../../../../packages-content-model/roosterjs-content-model-core/lib/editor/DarkColorHandlerImpl.ts"],"names":[],"mappings":";;;;AAAA,6DAA2E;AAO3E,IAAM,cAAc,GAAG,yDAAyD,CAAC;AACjF,IAAM,eAAe,GAAG,MAAM,CAAC;AAC/B,IAAM,gBAAgB,GAAG,WAAW,CAAC;AACrC,IAAW,kBAGV;AAHD,WAAW,kBAAkB;IACzB,mEAAY,CAAA;IACZ,qEAAa,CAAA;AACjB,CAAC,EAHU,kBAAkB,KAAlB,kBAAkB,QAG5B;AACD,IAAM,kBAAkB,GAA8C;;QAE9D,uBAA+B,OAAO;QACtC,wBAAgC,OAAO;;;QAGvC,uBAA+B,kBAAkB;QACjD,wBAAgC,SAAS;;CAEhD,CAAC;AAEF;;GAEG;AACH;IAGI,8BAAoB,UAAuB,EAAU,YAAuC;QAAxE,eAAU,GAAV,UAAU,CAAa;QAAU,iBAAY,GAAZ,YAAY,CAA2B;QAFpF,gBAAW,GAAmD,EAAE,CAAC;IAEsB,CAAC;IAEhG;;;OAGG;IACH,iDAAkB,GAAlB;QACI,OAAO,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;IAC3C,CAAC;IAED;;;;;;OAMG;IACH,4CAAa,GAAb,UAAc,cAAsB,EAAE,UAAmB,EAAE,aAAsB;QAC7E,IAAM,WAAW,GAAG,IAAI,CAAC,eAAe,CAAC,cAAc,CAAC,CAAC;QACzD,IAAI,QAA4B,CAAC;QAEjC,IAAI,WAAW,EAAE;YACb,cAAc,GAAG,WAAW,CAAC,cAAc,CAAC;YAC5C,aAAa,GAAG,WAAW,CAAC,aAAa,IAAI,aAAa,CAAC;YAC3D,QAAQ,GAAG,WAAW,CAAC,GAAG,CAAC;SAC9B;QAED,IAAI,UAAU,IAAI,cAAc,EAAE;YAC9B,QAAQ;gBACJ,QAAQ,IAAI,OAAK,gBAAgB,SAAI,cAAc,CAAC,OAAO,CAAC,UAAU,EAAE,GAAG,CAAG,CAAC;YAEnF,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC,EAAE;gBAC7B,aAAa,GAAG,aAAa,IAAI,IAAI,CAAC,YAAY,CAAC,cAAc,CAAC,CAAC;gBAEnE,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC,GAAG,EAAE,cAAc,gBAAA,EAAE,aAAa,eAAA,EAAE,CAAC;gBAC/D,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,WAAW,CAAC,QAAQ,EAAE,aAAa,CAAC,CAAC;aAC9D;YAED,OAAO,SAAO,QAAQ,UAAK,cAAc,MAAG,CAAC;SAChD;aAAM;YACH,OAAO,cAAc,CAAC;SACzB;IACL,CAAC;IAED;;OAEG;IACH,oCAAK,GAAL;QAAA,iBAGC;QAFG,IAAA,oCAAa,EAAC,IAAI,CAAC,WAAW,CAAC,CAAC,OAAO,CAAC,UAAA,GAAG,IAAI,OAAA,KAAI,CAAC,UAAU,CAAC,KAAK,CAAC,cAAc,CAAC,GAAG,CAAC,EAAzC,CAAyC,CAAC,CAAC;QAC1F,IAAI,CAAC,WAAW,GAAG,EAAE,CAAC;IAC1B,CAAC;IAED;;;;;;OAMG;IACH,8CAAe,GAAf,UAAgB,KAAgC,EAAE,YAAsB;;QACpE,IAAI,GAAuB,CAAC;QAC5B,IAAI,cAAc,GAAG,EAAE,CAAC;QACxB,IAAI,aAAiC,CAAC;QAEtC,IAAI,KAAK,EAAE;YACP,IAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,cAAc,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;YAEpF,IAAI,KAAK,EAAE;gBACP,IAAI,KAAK,CAAC,CAAC,CAAC,EAAE;oBACV,GAAG,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC;oBACf,cAAc,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC;oBAC1B,aAAa,GAAG,MAAA,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,0CAAE,aAAa,CAAC;iBACxD;qBAAM;oBACH,cAAc,GAAG,EAAE,CAAC;iBACvB;aACJ;iBAAM,IAAI,YAAY,EAAE;gBACrB,gIAAgI;gBAChI,gIAAgI;gBAChI,gHAAgH;gBAChH,cAAc,GAAG,IAAI,CAAC,2BAA2B,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC;gBAE/D,IAAI,cAAc,EAAE;oBAChB,aAAa,GAAG,KAAK,CAAC;iBACzB;aACJ;iBAAM;gBACH,cAAc,GAAG,KAAK,CAAC;aAC1B;SACJ;QAED,OAAO,EAAE,GAAG,KAAA,EAAE,cAAc,gBAAA,EAAE,aAAa,eAAA,EAAE,CAAC;IAClD,CAAC;IAED;;;OAGG;IACH,0DAA2B,GAA3B,UAA4B,SAAiB;QAA7C,iBAqBC;QApBG,IAAM,SAAS,GAAG,IAAA,iCAAU,EAAC,SAAS,CAAC,CAAC;QAExC,IAAI,SAAS,EAAE;YACX,IAAM,GAAG,GAAG,IAAA,oCAAa,EAAC,IAAI,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,UAAA,GAAG;gBAChD,IAAM,UAAU,GAAG,IAAA,iCAAU,EAAC,KAAI,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC,aAAa,CAAC,CAAC;gBAEnE,OAAO,CACH,UAAU;oBACV,UAAU,CAAC,CAAC,CAAC,IAAI,SAAS,CAAC,CAAC,CAAC;oBAC7B,UAAU,CAAC,CAAC,CAAC,IAAI,SAAS,CAAC,CAAC,CAAC;oBAC7B,UAAU,CAAC,CAAC,CAAC,IAAI,SAAS,CAAC,CAAC,CAAC,CAChC,CAAC;YACN,CAAC,CAAC,CAAC;YAEH,IAAI,GAAG,EAAE;gBACL,OAAO,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC,cAAc,CAAC;aAC/C;SACJ;QAED,OAAO,IAAI,CAAC;IAChB,CAAC;IAED;;;;;OAKG;IACH,oDAAqB,GAArB,UAAsB,OAAoB,EAAE,YAAqB,EAAE,UAAmB;QAAtF,iBAeC;QAdG,kBAAkB,CAAC,OAAO,CAAC,UAAC,KAAK,EAAE,CAAC;YAChC,IAAM,KAAK,GAAG,KAAI,CAAC,eAAe,CAC9B,OAAO,CAAC,KAAK,CAAC,gBAAgB,CAAC,KAAK,kBAA6B,CAAC;gBAC9D,OAAO,CAAC,YAAY,CAAC,KAAK,mBAA8B,CAAC,EAC7D,CAAC,CAAC,YAAY,CACjB,CAAC,cAAc,CAAC;YAEjB,OAAO,CAAC,KAAK,CAAC,WAAW,CAAC,KAAK,kBAA6B,EAAE,IAAI,CAAC,CAAC;YACpE,OAAO,CAAC,eAAe,CAAC,KAAK,mBAA8B,CAAC,CAAC;YAE7D,IAAI,KAAK,IAAI,KAAK,IAAI,SAAS,EAAE;gBAC7B,IAAA,+BAAQ,EAAC,OAAO,EAAE,KAAK,EAAE,CAAC,IAAI,CAAC,EAAE,UAAU,EAAE,KAAK,CAAC,wBAAwB,EAAE,KAAI,CAAC,CAAC;aACtF;QACL,CAAC,CAAC,CAAC;IACP,CAAC;IACL,2BAAC;AAAD,CAAC,AAhJD,IAgJC;AAhJY,oDAAoB","sourcesContent":["import { getObjectKeys, parseColor, setColor } from 'roosterjs-editor-dom';\nimport type {\n ColorKeyAndValue,\n DarkColorHandler,\n ModeIndependentColor,\n} from 'roosterjs-editor-types';\n\nconst VARIABLE_REGEX = /^\\svar\$\\s(\\-\\-[a-zA-Z0-9\\-_]+)\\s(?:,\\s(.))?\$\\s$/;\nconst VARIABLE_PREFIX = 'var(';\nconst COLOR_VAR_PREFIX = 'darkColor';\nconst enum ColorAttributeEnum {\n CssColor = 0,\n HtmlColor = 1,\n}\nconst ColorAttributeName: { [key in ColorAttributeEnum]: string }[] = [\n {\n [ColorAttributeEnum.CssColor]: 'color',\n [ColorAttributeEnum.HtmlColor]: 'color',\n },\n {\n [ColorAttributeEnum.CssColor]: 'background-color',\n [ColorAttributeEnum.HtmlColor]: 'bgcolor',\n },\n];\n\n/*\n @internal\n /\nexport class DarkColorHandlerImpl implements DarkColorHandler {\n private knownColors: Record<string, Readonly<ModeIndependentColor>> = {};\n\n constructor(private contentDiv: HTMLElement, private getDarkColor: (color: string) => string) {}\n\n /\n Get a copy of known colors\n * @returns\n /\n getKnownColorsCopy() {\n return Object.values(this.knownColors);\n }\n\n /\n Given a light mode color value and an optional dark mode color value, register this color\n * so that editor can handle it, then return the CSS color value for current color mode.\n * @param lightModeColor Light mode color value\n * @param isDarkMode Whether current color mode is dark mode\n * @param darkModeColor Optional dark mode color value. If not passed, we will calculate one.\n /\n registerColor(lightModeColor: string, isDarkMode: boolean, darkModeColor?: string): string {\n const parsedColor = this.parseColorValue(lightModeColor);\n let colorKey: string \| undefined;\n\n if (parsedColor) {\n lightModeColor = parsedColor.lightModeColor;\n darkModeColor = parsedColor.darkModeColor \|\| darkModeColor;\n colorKey = parsedColor.key;\n }\n\n if (isDarkMode && lightModeColor) {\n colorKey =\n colorKey \|\| `--${COLOR_VAR_PREFIX}_${lightModeColor.replace(/[^\\d\\w]/g, '_')}`;\n\n if (!this.knownColors[colorKey]) {\n darkModeColor = darkModeColor \|\| this.getDarkColor(lightModeColor);\n\n this.knownColors[colorKey] = { lightModeColor, darkModeColor };\n this.contentDiv.style.setProperty(colorKey, darkModeColor);\n }\n\n return `var(${colorKey}, ${lightModeColor})`;\n } else {\n return lightModeColor;\n }\n }\n\n /\n Reset known color record, clean up registered color variables.\n /\n reset(): void {\n getObjectKeys(this.knownColors).forEach(key => this.contentDiv.style.removeProperty(key));\n this.knownColors = {};\n }\n\n /\n Parse an existing color value, if it is in variable-based color format, extract color key,\n * light color and query related dark color if any\n * @param color The color string to parse\n * @param isInDarkMode Whether current content is in dark mode. When set to true, if the color value is not in dark var format,\n * we will treat is as a dark mode color and try to find a matched dark mode color.\n /\n parseColorValue(color: string \| undefined \| null, isInDarkMode?: boolean): ColorKeyAndValue {\n let key: string \| undefined;\n let lightModeColor = '';\n let darkModeColor: string \| undefined;\n\n if (color) {\n const match = color.startsWith(VARIABLE_PREFIX) ? VARIABLE_REGEX.exec(color) : null;\n\n if (match) {\n if (match[2]) {\n key = match[1];\n lightModeColor = match[2];\n darkModeColor = this.knownColors[key]?.darkModeColor;\n } else {\n lightModeColor = '';\n }\n } else if (isInDarkMode) {\n // If editor is in dark mode but the color is not in dark color format, it is possible the color was inserted from external code\n // without any light color info. So we first try to see if there is a known dark color can match this color, and use its related\n // light color as light mode color. Otherwise we need to drop this color to avoid show \"white on white\" content.\n lightModeColor = this.findLightColorFromDarkColor(color) \|\| '';\n\n if (lightModeColor) {\n darkModeColor = color;\n }\n } else {\n lightModeColor = color;\n }\n }\n\n return { key, lightModeColor, darkModeColor };\n }\n\n /\n Find related light mode color from dark mode color.\n * @param darkColor The existing dark color\n /\n findLightColorFromDarkColor(darkColor: string): string \| null {\n const rgbSearch = parseColor(darkColor);\n\n if (rgbSearch) {\n const key = getObjectKeys(this.knownColors).find(key => {\n const rgbCurrent = parseColor(this.knownColors[key].darkModeColor);\n\n return (\n rgbCurrent &&\n rgbCurrent[0] == rgbSearch[0] &&\n rgbCurrent[1] == rgbSearch[1] &&\n rgbCurrent[2] == rgbSearch[2]\n );\n });\n\n if (key) {\n return this.knownColors[key].lightModeColor;\n }\n }\n\n return null;\n }\n\n /\n Transform element color, from dark to light or from light to dark\n * @param element The element to transform color\n * @param fromDarkMode Whether this is transforming color from dark mode\n * @param toDarkMode Whether this is transforming color to dark mode\n /\n transformElementColor(element: HTMLElement, fromDarkMode: boolean, toDarkMode: boolean): void {\n ColorAttributeName.forEach((names, i) => {\n const color = this.parseColorValue(\n element.style.getPropertyValue(names[ColorAttributeEnum.CssColor]) \|\|\n element.getAttribute(names[ColorAttributeEnum.HtmlColor]),\n !!fromDarkMode\n ).lightModeColor;\n\n element.style.setProperty(names[ColorAttributeEnum.CssColor], null);\n element.removeAttribute(names[ColorAttributeEnum.HtmlColor]);\n\n if (color && color != 'inherit') {\n setColor(element, color, i != 0, toDarkMode, false /shouldAdaptFontColor*/, this);\n }\n });\n }\n}\n"]}

package/lib/editor/createStandaloneEditorCore.js CHANGED Viewed

@@ -12,6 +12,7 @@ var standaloneCoreApiMap_1 = require("./standaloneCoreApiMap");
  * @param options Editor options
  */
 function createStandaloneEditorCore(contentDiv, options, unportedCoreApiMap, unportedCorePluginState, tempPlugins) {
+    var _a;
     var corePlugins = (0, createStandaloneEditorCorePlugins_1.createStandaloneEditorCorePlugins)(options, contentDiv);
     return (0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)({ contentDiv: contentDiv, api: (0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)({}, standaloneCoreApiMap_1.standaloneCoreApiMap), unportedCoreApiMap), options.coreApiOverride), originalApi: (0, tslib_1.__assign)((0, tslib_1.__assign)({}, standaloneCoreApiMap_1.standaloneCoreApiMap), unportedCoreApiMap), plugins: (0, tslib_1.__spreadArray)((0, tslib_1.__spreadArray)([
             corePlugins.cache,
@@ -22,7 +23,7 @@ function createStandaloneEditorCore(contentDiv, options, unportedCoreApiMap, unp
             corePlugins.entity
         ], (0, tslib_1.__read)(tempPlugins), false), [
             corePlugins.lifecycle,
-        ], false), environment: createEditorEnvironment(), darkColorHandler: new DarkColorHandlerImpl_1.DarkColorHandlerImpl(contentDiv, options.baseDarkColor), trustedHTMLHandler: options.trustedHTMLHandler || defaultTrustHtmlHandler }, (0, createStandaloneEditorDefaultSettings_1.createStandaloneEditorDefaultSettings)(options)), getPluginState(corePlugins)), unportedCorePluginState);
+        ], false), environment: createEditorEnvironment(), darkColorHandler: new DarkColorHandlerImpl_1.DarkColorHandlerImpl(contentDiv, (_a = options.getDarkColor) !== null && _a !== void 0 ? _a : getDarkColorFallback), trustedHTMLHandler: options.trustedHTMLHandler || defaultTrustHtmlHandler }, (0, createStandaloneEditorDefaultSettings_1.createStandaloneEditorDefaultSettings)(options)), getPluginState(corePlugins)), unportedCorePluginState);
 }
 exports.createStandaloneEditorCore = createStandaloneEditorCore;
 function createEditorEnvironment() {
@@ -54,4 +55,8 @@ function getPluginState(corePlugins) {
         selection: corePlugins.selection.getState(),
     };
 }
+// A fallback function, always return original color
+function getDarkColorFallback(color) {
+    return color;
+}
 //# sourceMappingURL=createStandaloneEditorCore.js.map

package/lib/editor/createStandaloneEditorCore.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"createStandaloneEditorCore.js","sourceRoot":"","sources":["../../../../packages-content-model/roosterjs-content-model-core/lib/editor/createStandaloneEditorCore.ts"],"names":[],"mappings":";;;;AAAA,qGAAoG;AACpG,iGAAgG;AAChG,+DAA8D;AAC9D,+DAA8D;AAY9D;;;;GAIG;AACH,SAAgB,0BAA0B,CACtC,UAA0B,EAC1B,OAAgC,EAChC,kBAAsC,EACtC,uBAAgD,EAChD,WAA2B;IAE3B,IAAM,WAAW,GAAG,IAAA,qEAAiC,EAAC,OAAO,EAAE,UAAU,CAAC,CAAC;IAE3E,2EACI,UAAU,YAAA,EACV,GAAG,wEAAO,2CAAoB,GAAK,kBAAkB,GAAK,OAAO,CAAC,eAAe,GACjF,WAAW,kDAAO,2CAAoB,GAAK,kBAAkB,GAC7D,OAAO;YACH,WAAW,CAAC,KAAK;YACjB,WAAW,CAAC,MAAM;YAClB,WAAW,CAAC,SAAS;YACrB,WAAW,CAAC,QAAQ;YACpB,WAAW,CAAC,SAAS;YACrB,WAAW,CAAC,MAAM;+BACf,WAAW;YACd,WAAW,CAAC,SAAS;mBAEzB,WAAW,EAAE,uBAAuB,EAAE,EACtC,gBAAgB,EAAE,IAAI,2CAAoB,~~CAAC~~,UAAU,~~EAAE~~,OAAO,CAAC,~~aAAa~~,~~CAAC~~,~~EAC7E~~,kBAAkB,EAAE,OAAO,CAAC,kBAAkB,IAAI,uBAAuB,IACtE,IAAA,6EAAqC,EAAC,OAAO,CAAC,GAC9C,cAAc,CAAC,WAAW,CAAC,GAC3B,uBAAuB,EAC5B;AACN,CAAC;~~AA9BD~~,~~gEA8BC~~;AAED,SAAS,uBAAuB;IAC5B,oHAAoH;IACpH,IAAM,SAAS,GAAG,MAAM,CAAC,SAAS,CAAC,SAAS,CAAC;IAE7C,OAAO;QACH,KAAK,EAAE,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;QACvD,SAAS,EAAE,UAAU,CAAC,IAAI,CAAC,SAAS,CAAC;QACrC,QAAQ,EACJ,SAAS,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC;YAChC,SAAS,CAAC,OAAO,CAAC,QAAQ,CAAC,GAAG,CAAC;YAC/B,SAAS,CAAC,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC;KACvC,CAAC;AACN,CAAC;AAED;;GAEG;AACH,SAAgB,uBAAuB,CAAC,IAAY;IAChD,OAAO,IAAI,CAAC;AAChB,CAAC;AAFD,0DAEC;AAED,SAAS,cAAc,CAAC,WAAwC;IAC5D,OAAO;QACH,QAAQ,EAAE,WAAW,CAAC,QAAQ,CAAC,QAAQ,EAAE;QACzC,SAAS,EAAE,WAAW,CAAC,SAAS,CAAC,QAAQ,EAAE;QAC3C,KAAK,EAAE,WAAW,CAAC,KAAK,CAAC,QAAQ,EAAE;QACnC,MAAM,EAAE,WAAW,CAAC,MAAM,CAAC,QAAQ,EAAE;QACrC,SAAS,EAAE,WAAW,CAAC,SAAS,CAAC,QAAQ,EAAE;QAC3C,MAAM,EAAE,WAAW,CAAC,MAAM,CAAC,QAAQ,EAAE;QACrC,SAAS,EAAE,WAAW,CAAC,SAAS,CAAC,QAAQ,EAAE;KAC9C,CAAC;AACN,CAAC","sourcesContent":["import { createStandaloneEditorCorePlugins } from '../corePlugin/createStandaloneEditorCorePlugins';\nimport { createStandaloneEditorDefaultSettings } from './createStandaloneEditorDefaultSettings';\nimport { DarkColorHandlerImpl } from './DarkColorHandlerImpl';\nimport { standaloneCoreApiMap } from './standaloneCoreApiMap';\nimport type { EditorPlugin } from 'roosterjs-editor-types';\nimport type {\n EditorEnvironment,\n StandaloneEditorCore,\n StandaloneEditorCorePluginState,\n StandaloneEditorCorePlugins,\n StandaloneEditorOptions,\n UnportedCoreApiMap,\n UnportedCorePluginState,\n} from 'roosterjs-content-model-types';\n\n/*\n A temporary function to create Standalone Editor core\n * @param contentDiv Editor content DIV\n * @param options Editor options\n /\nexport function createStandaloneEditorCore(\n contentDiv: HTMLDivElement,\n options: StandaloneEditorOptions,\n unportedCoreApiMap: UnportedCoreApiMap,\n unportedCorePluginState: UnportedCorePluginState,\n tempPlugins: EditorPlugin[]\n): StandaloneEditorCore {\n const corePlugins = createStandaloneEditorCorePlugins(options, contentDiv);\n\n return {\n contentDiv,\n api: { ...standaloneCoreApiMap, ...unportedCoreApiMap, ...options.coreApiOverride },\n originalApi: { ...standaloneCoreApiMap, ...unportedCoreApiMap },\n plugins: [\n corePlugins.cache,\n corePlugins.format,\n corePlugins.copyPaste,\n corePlugins.domEvent,\n corePlugins.selection,\n corePlugins.entity,\n ...tempPlugins,\n corePlugins.lifecycle,\n ],\n environment: createEditorEnvironment(),\n darkColorHandler: new DarkColorHandlerImpl(contentDiv, options.~~baseDarkColor~~),\n trustedHTMLHandler: options.trustedHTMLHandler \|\| defaultTrustHtmlHandler,\n ...createStandaloneEditorDefaultSettings(options),\n ...getPluginState(corePlugins),\n ...unportedCorePluginState,\n };\n}\n\nfunction createEditorEnvironment(): EditorEnvironment {\n // It is ok to use global window here since the environment should always be the same for all windows in one session\n const userAgent = window.navigator.userAgent;\n\n return {\n isMac: window.navigator.appVersion.indexOf('Mac') != -1,\n isAndroid: /android/i.test(userAgent),\n isSafari:\n userAgent.indexOf('Safari') >= 0 &&\n userAgent.indexOf('Chrome') < 0 &&\n userAgent.indexOf('Android') < 0,\n };\n}\n\n/\n @internal export for test only\n */\nexport function defaultTrustHtmlHandler(html: string) {\n return html;\n}\n\nfunction getPluginState(corePlugins: StandaloneEditorCorePlugins): StandaloneEditorCorePluginState {\n return {\n domEvent: corePlugins.domEvent.getState(),\n copyPaste: corePlugins.copyPaste.getState(),\n cache: corePlugins.cache.getState(),\n format: corePlugins.format.getState(),\n lifecycle: corePlugins.lifecycle.getState(),\n entity: corePlugins.entity.getState(),\n selection: corePlugins.selection.getState(),\n };\n}\n"]}
1	+ {"version":3,"file":"createStandaloneEditorCore.js","sourceRoot":"","sources":["../../../../packages-content-model/roosterjs-content-model-core/lib/editor/createStandaloneEditorCore.ts"],"names":[],"mappings":";;;;AAAA,qGAAoG;AACpG,iGAAgG;AAChG,+DAA8D;AAC9D,+DAA8D;AAY9D;;;;GAIG;AACH,SAAgB,0BAA0B,CACtC,UAA0B,EAC1B,OAAgC,EAChC,kBAAsC,EACtC,uBAAgD,EAChD,WAA2B;;IAE3B,IAAM,WAAW,GAAG,IAAA,qEAAiC,EAAC,OAAO,EAAE,UAAU,CAAC,CAAC;IAE3E,2EACI,UAAU,YAAA,EACV,GAAG,wEAAO,2CAAoB,GAAK,kBAAkB,GAAK,OAAO,CAAC,eAAe,GACjF,WAAW,kDAAO,2CAAoB,GAAK,kBAAkB,GAC7D,OAAO;YACH,WAAW,CAAC,KAAK;YACjB,WAAW,CAAC,MAAM;YAClB,WAAW,CAAC,SAAS;YACrB,WAAW,CAAC,QAAQ;YACpB,WAAW,CAAC,SAAS;YACrB,WAAW,CAAC,MAAM;+BACf,WAAW;YACd,WAAW,CAAC,SAAS;mBAEzB,WAAW,EAAE,uBAAuB,EAAE,EACtC,gBAAgB,EAAE,IAAI,2CAAoB,CACtC,UAAU,EACV,MAAA,OAAO,CAAC,YAAY,mCAAI,oBAAoB,CAC/C,EACD,kBAAkB,EAAE,OAAO,CAAC,kBAAkB,IAAI,uBAAuB,IACtE,IAAA,6EAAqC,EAAC,OAAO,CAAC,GAC9C,cAAc,CAAC,WAAW,CAAC,GAC3B,uBAAuB,EAC5B;AACN,CAAC;AAjCD,gEAiCC;AAED,SAAS,uBAAuB;IAC5B,oHAAoH;IACpH,IAAM,SAAS,GAAG,MAAM,CAAC,SAAS,CAAC,SAAS,CAAC;IAE7C,OAAO;QACH,KAAK,EAAE,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;QACvD,SAAS,EAAE,UAAU,CAAC,IAAI,CAAC,SAAS,CAAC;QACrC,QAAQ,EACJ,SAAS,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC;YAChC,SAAS,CAAC,OAAO,CAAC,QAAQ,CAAC,GAAG,CAAC;YAC/B,SAAS,CAAC,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC;KACvC,CAAC;AACN,CAAC;AAED;;GAEG;AACH,SAAgB,uBAAuB,CAAC,IAAY;IAChD,OAAO,IAAI,CAAC;AAChB,CAAC;AAFD,0DAEC;AAED,SAAS,cAAc,CAAC,WAAwC;IAC5D,OAAO;QACH,QAAQ,EAAE,WAAW,CAAC,QAAQ,CAAC,QAAQ,EAAE;QACzC,SAAS,EAAE,WAAW,CAAC,SAAS,CAAC,QAAQ,EAAE;QAC3C,KAAK,EAAE,WAAW,CAAC,KAAK,CAAC,QAAQ,EAAE;QACnC,MAAM,EAAE,WAAW,CAAC,MAAM,CAAC,QAAQ,EAAE;QACrC,SAAS,EAAE,WAAW,CAAC,SAAS,CAAC,QAAQ,EAAE;QAC3C,MAAM,EAAE,WAAW,CAAC,MAAM,CAAC,QAAQ,EAAE;QACrC,SAAS,EAAE,WAAW,CAAC,SAAS,CAAC,QAAQ,EAAE;KAC9C,CAAC;AACN,CAAC;AAED,oDAAoD;AACpD,SAAS,oBAAoB,CAAC,KAAa;IACvC,OAAO,KAAK,CAAC;AACjB,CAAC","sourcesContent":["import { createStandaloneEditorCorePlugins } from '../corePlugin/createStandaloneEditorCorePlugins';\nimport { createStandaloneEditorDefaultSettings } from './createStandaloneEditorDefaultSettings';\nimport { DarkColorHandlerImpl } from './DarkColorHandlerImpl';\nimport { standaloneCoreApiMap } from './standaloneCoreApiMap';\nimport type { EditorPlugin } from 'roosterjs-editor-types';\nimport type {\n EditorEnvironment,\n StandaloneEditorCore,\n StandaloneEditorCorePluginState,\n StandaloneEditorCorePlugins,\n StandaloneEditorOptions,\n UnportedCoreApiMap,\n UnportedCorePluginState,\n} from 'roosterjs-content-model-types';\n\n/*\n A temporary function to create Standalone Editor core\n * @param contentDiv Editor content DIV\n * @param options Editor options\n /\nexport function createStandaloneEditorCore(\n contentDiv: HTMLDivElement,\n options: StandaloneEditorOptions,\n unportedCoreApiMap: UnportedCoreApiMap,\n unportedCorePluginState: UnportedCorePluginState,\n tempPlugins: EditorPlugin[]\n): StandaloneEditorCore {\n const corePlugins = createStandaloneEditorCorePlugins(options, contentDiv);\n\n return {\n contentDiv,\n api: { ...standaloneCoreApiMap, ...unportedCoreApiMap, ...options.coreApiOverride },\n originalApi: { ...standaloneCoreApiMap, ...unportedCoreApiMap },\n plugins: [\n corePlugins.cache,\n corePlugins.format,\n corePlugins.copyPaste,\n corePlugins.domEvent,\n corePlugins.selection,\n corePlugins.entity,\n ...tempPlugins,\n corePlugins.lifecycle,\n ],\n environment: createEditorEnvironment(),\n darkColorHandler: new DarkColorHandlerImpl(\n contentDiv,\n options.getDarkColor ?? getDarkColorFallback\n ),\n trustedHTMLHandler: options.trustedHTMLHandler \|\| defaultTrustHtmlHandler,\n ...createStandaloneEditorDefaultSettings(options),\n ...getPluginState(corePlugins),\n ...unportedCorePluginState,\n };\n}\n\nfunction createEditorEnvironment(): EditorEnvironment {\n // It is ok to use global window here since the environment should always be the same for all windows in one session\n const userAgent = window.navigator.userAgent;\n\n return {\n isMac: window.navigator.appVersion.indexOf('Mac') != -1,\n isAndroid: /android/i.test(userAgent),\n isSafari:\n userAgent.indexOf('Safari') >= 0 &&\n userAgent.indexOf('Chrome') < 0 &&\n userAgent.indexOf('Android') < 0,\n };\n}\n\n/\n @internal export for test only\n */\nexport function defaultTrustHtmlHandler(html: string) {\n return html;\n}\n\nfunction getPluginState(corePlugins: StandaloneEditorCorePlugins): StandaloneEditorCorePluginState {\n return {\n domEvent: corePlugins.domEvent.getState(),\n copyPaste: corePlugins.copyPaste.getState(),\n cache: corePlugins.cache.getState(),\n format: corePlugins.format.getState(),\n lifecycle: corePlugins.lifecycle.getState(),\n entity: corePlugins.entity.getState(),\n selection: corePlugins.selection.getState(),\n };\n}\n\n// A fallback function, always return original color\nfunction getDarkColorFallback(color: string) {\n return color;\n}\n"]}

package/lib-amd/editor/DarkColorHandlerImpl.d.ts CHANGED Viewed

@@ -4,9 +4,9 @@ import type { ColorKeyAndValue, DarkColorHandler, ModeIndependentColor } from 'r
  */
 export declare class DarkColorHandlerImpl implements DarkColorHandler {
     private contentDiv;
+    private getDarkColor;
     private knownColors;
-    readonly baseLightness: number;
-    constructor(contentDiv: HTMLElement, baseDarkColor?: string);
+    constructor(contentDiv: HTMLElement, getDarkColor: (color: string) => string);
     /**
      * Get a copy of known colors
      * @returns

package/lib-amd/editor/DarkColorHandlerImpl.js CHANGED Viewed

@@ -1,9 +1,8 @@
-define(["require", "exports", "color", "roosterjs-editor-dom"], function (require, exports, Color, roosterjs_editor_dom_1) {
+define(["require", "exports", "roosterjs-editor-dom"], function (require, exports, roosterjs_editor_dom_1) {
     "use strict";
     var _a, _b;
     Object.defineProperty(exports, "__esModule", { value: true });
     exports.DarkColorHandlerImpl = void 0;
-    var DefaultLightness = 21.25; // Lightness for #333333
     var VARIABLE_REGEX = /^\s*var\(\s*(\-\-[a-zA-Z0-9\-_]+)\s*(?:,\s*(.*))?\)\s*$/;
     var VARIABLE_PREFIX = 'var(';
     var COLOR_VAR_PREFIX = 'darkColor';
@@ -26,10 +25,10 @@ define(["require", "exports", "color", "roosterjs-editor-dom"], function (requir
      * @internal
      */
     var DarkColorHandlerImpl = /** @class */ (function () {
-        function DarkColorHandlerImpl(contentDiv, baseDarkColor) {
+        function DarkColorHandlerImpl(contentDiv, getDarkColor) {
             this.contentDiv = contentDiv;
+            this.getDarkColor = getDarkColor;
             this.knownColors = {};
-            this.baseLightness = getLightness(baseDarkColor);
         }
         /**
          * Get a copy of known colors
@@ -57,7 +56,7 @@ define(["require", "exports", "color", "roosterjs-editor-dom"], function (requir
                 colorKey =
                     colorKey || "--" + COLOR_VAR_PREFIX + "_" + lightModeColor.replace(/[^\d\w]/g, '_');
                 if (!this.knownColors[colorKey]) {
-                    darkModeColor = darkModeColor || getDarkColor(lightModeColor, this.baseLightness);
+                    darkModeColor = darkModeColor || this.getDarkColor(lightModeColor);
                     this.knownColors[colorKey] = { lightModeColor: lightModeColor, darkModeColor: darkModeColor };
                     this.contentDiv.style.setProperty(colorKey, darkModeColor);
                 }
@@ -156,29 +155,5 @@ define(["require", "exports", "color", "roosterjs-editor-dom"], function (requir
         return DarkColorHandlerImpl;
     }());
     exports.DarkColorHandlerImpl = DarkColorHandlerImpl;
-    function getDarkColor(color, baseLightness) {
-        try {
-            var computedColor = Color(color || undefined);
-            var colorLab = computedColor.lab().array();
-            var newLValue = (100 - colorLab[0]) * ((100 - baseLightness) / 100) + baseLightness;
-            color = Color.lab(newLValue, colorLab[1], colorLab[2])
-                .rgb()
-                .alpha(computedColor.alpha())
-                .toString();
-        }
-        catch (_a) { }
-        return color;
-    }
-    function getLightness(color) {
-        var result = DefaultLightness;
-        if (color) {
-            try {
-                var computedColor = Color(color || undefined);
-                result = computedColor.lab().array()[0];
-            }
-            catch (_a) { }
-        }
-        return result;
-    }
 });
 //# sourceMappingURL=DarkColorHandlerImpl.js.map

package/lib-amd/editor/DarkColorHandlerImpl.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DarkColorHandlerImpl.js","sourceRoot":"","sources":["../../../../packages-content-model/roosterjs-content-model-core/lib/editor/DarkColorHandlerImpl.ts"],"names":[],"mappings":"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","sourcesContent":["import * as Color from 'color';\nimport { getObjectKeys, parseColor, setColor } from 'roosterjs-editor-dom';\nimport type {\n ColorKeyAndValue,\n DarkColorHandler,\n ModeIndependentColor,\n} from 'roosterjs-editor-types';\n\nconst DefaultLightness = 21.25; // Lightness for #333333\nconst VARIABLE_REGEX = /^\\svar\$\\s(\\-\\-[a-zA-Z0-9\\-_]+)\\s(?:,\\s(.))?\$\\s$/;\nconst VARIABLE_PREFIX = 'var(';\nconst COLOR_VAR_PREFIX = 'darkColor';\nconst enum ColorAttributeEnum {\n CssColor = 0,\n HtmlColor = 1,\n}\nconst ColorAttributeName: { [key in ColorAttributeEnum]: string }[] = [\n {\n [ColorAttributeEnum.CssColor]: 'color',\n [ColorAttributeEnum.HtmlColor]: 'color',\n },\n {\n [ColorAttributeEnum.CssColor]: 'background-color',\n [ColorAttributeEnum.HtmlColor]: 'bgcolor',\n },\n];\n\n/*\n @internal\n /\nexport class DarkColorHandlerImpl implements DarkColorHandler {\n private knownColors: Record<string, Readonly<ModeIndependentColor>> = {};\n readonly baseLightness: number;\n\n constructor(private contentDiv: HTMLElement, baseDarkColor?: string) {\n this.baseLightness = getLightness(baseDarkColor);\n }\n\n /\n Get a copy of known colors\n * @returns\n /\n getKnownColorsCopy() {\n return Object.values(this.knownColors);\n }\n\n /\n Given a light mode color value and an optional dark mode color value, register this color\n * so that editor can handle it, then return the CSS color value for current color mode.\n * @param lightModeColor Light mode color value\n * @param isDarkMode Whether current color mode is dark mode\n * @param darkModeColor Optional dark mode color value. If not passed, we will calculate one.\n /\n registerColor(lightModeColor: string, isDarkMode: boolean, darkModeColor?: string): string {\n const parsedColor = this.parseColorValue(lightModeColor);\n let colorKey: string \| undefined;\n\n if (parsedColor) {\n lightModeColor = parsedColor.lightModeColor;\n darkModeColor = parsedColor.darkModeColor \|\| darkModeColor;\n colorKey = parsedColor.key;\n }\n\n if (isDarkMode && lightModeColor) {\n colorKey =\n colorKey \|\| `--${COLOR_VAR_PREFIX}_${lightModeColor.replace(/[^\\d\\w]/g, '_')}`;\n\n if (!this.knownColors[colorKey]) {\n darkModeColor = darkModeColor \|\| getDarkColor(lightModeColor, this.baseLightness);\n\n this.knownColors[colorKey] = { lightModeColor, darkModeColor };\n this.contentDiv.style.setProperty(colorKey, darkModeColor);\n }\n\n return `var(${colorKey}, ${lightModeColor})`;\n } else {\n return lightModeColor;\n }\n }\n\n /\n Reset known color record, clean up registered color variables.\n /\n reset(): void {\n getObjectKeys(this.knownColors).forEach(key => this.contentDiv.style.removeProperty(key));\n this.knownColors = {};\n }\n\n /\n Parse an existing color value, if it is in variable-based color format, extract color key,\n * light color and query related dark color if any\n * @param color The color string to parse\n * @param isInDarkMode Whether current content is in dark mode. When set to true, if the color value is not in dark var format,\n * we will treat is as a dark mode color and try to find a matched dark mode color.\n /\n parseColorValue(color: string \| undefined \| null, isInDarkMode?: boolean): ColorKeyAndValue {\n let key: string \| undefined;\n let lightModeColor = '';\n let darkModeColor: string \| undefined;\n\n if (color) {\n const match = color.startsWith(VARIABLE_PREFIX) ? VARIABLE_REGEX.exec(color) : null;\n\n if (match) {\n if (match[2]) {\n key = match[1];\n lightModeColor = match[2];\n darkModeColor = this.knownColors[key]?.darkModeColor;\n } else {\n lightModeColor = '';\n }\n } else if (isInDarkMode) {\n // If editor is in dark mode but the color is not in dark color format, it is possible the color was inserted from external code\n // without any light color info. So we first try to see if there is a known dark color can match this color, and use its related\n // light color as light mode color. Otherwise we need to drop this color to avoid show \"white on white\" content.\n lightModeColor = this.findLightColorFromDarkColor(color) \|\| '';\n\n if (lightModeColor) {\n darkModeColor = color;\n }\n } else {\n lightModeColor = color;\n }\n }\n\n return { key, lightModeColor, darkModeColor };\n }\n\n /\n Find related light mode color from dark mode color.\n * @param darkColor The existing dark color\n /\n findLightColorFromDarkColor(darkColor: string): string \| null {\n const rgbSearch = parseColor(darkColor);\n\n if (rgbSearch) {\n const key = getObjectKeys(this.knownColors).find(key => {\n const rgbCurrent = parseColor(this.knownColors[key].darkModeColor);\n\n return (\n rgbCurrent &&\n rgbCurrent[0] == rgbSearch[0] &&\n rgbCurrent[1] == rgbSearch[1] &&\n rgbCurrent[2] == rgbSearch[2]\n );\n });\n\n if (key) {\n return this.knownColors[key].lightModeColor;\n }\n }\n\n return null;\n }\n\n /\n Transform element color, from dark to light or from light to dark\n * @param element The element to transform color\n * @param fromDarkMode Whether this is transforming color from dark mode\n * @param toDarkMode Whether this is transforming color to dark mode\n /\n transformElementColor(element: HTMLElement, fromDarkMode: boolean, toDarkMode: boolean): void {\n ColorAttributeName.forEach((names, i) => {\n const color = this.parseColorValue(\n element.style.getPropertyValue(names[ColorAttributeEnum.CssColor]) \|\|\n element.getAttribute(names[ColorAttributeEnum.HtmlColor]),\n !!fromDarkMode\n ).lightModeColor;\n\n element.style.setProperty(names[ColorAttributeEnum.CssColor], null);\n element.removeAttribute(names[ColorAttributeEnum.HtmlColor]);\n\n if (color && color != 'inherit') {\n setColor(element, color, i != 0, toDarkMode, false /shouldAdaptFontColor/, this);\n }\n });\n }\n}\n\nfunction getDarkColor(color: string, baseLightness: number): string {\n try {\n const computedColor = Color(color \|\| undefined);\n const colorLab = computedColor.lab().array();\n const newLValue = (100 - colorLab[0]) ((100 - baseLightness) / 100) + baseLightness;\n color = Color.lab(newLValue, colorLab[1], colorLab[2])\n .rgb()\n .alpha(computedColor.alpha())\n .toString();\n } catch {}\n\n return color;\n}\n\nfunction getLightness(color?: string): number {\n let result = DefaultLightness;\n\n if (color) {\n try {\n const computedColor = Color(color \|\| undefined);\n result = computedColor.lab().array()[0];\n } catch {}\n }\n\n return result;\n}\n"]}
1	+ {"version":3,"file":"DarkColorHandlerImpl.js","sourceRoot":"","sources":["../../../../packages-content-model/roosterjs-content-model-core/lib/editor/DarkColorHandlerImpl.ts"],"names":[],"mappings":"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","sourcesContent":["import { getObjectKeys, parseColor, setColor } from 'roosterjs-editor-dom';\nimport type {\n ColorKeyAndValue,\n DarkColorHandler,\n ModeIndependentColor,\n} from 'roosterjs-editor-types';\n\nconst VARIABLE_REGEX = /^\\svar\$\\s(\\-\\-[a-zA-Z0-9\\-_]+)\\s(?:,\\s(.))?\$\\s$/;\nconst VARIABLE_PREFIX = 'var(';\nconst COLOR_VAR_PREFIX = 'darkColor';\nconst enum ColorAttributeEnum {\n CssColor = 0,\n HtmlColor = 1,\n}\nconst ColorAttributeName: { [key in ColorAttributeEnum]: string }[] = [\n {\n [ColorAttributeEnum.CssColor]: 'color',\n [ColorAttributeEnum.HtmlColor]: 'color',\n },\n {\n [ColorAttributeEnum.CssColor]: 'background-color',\n [ColorAttributeEnum.HtmlColor]: 'bgcolor',\n },\n];\n\n/*\n @internal\n /\nexport class DarkColorHandlerImpl implements DarkColorHandler {\n private knownColors: Record<string, Readonly<ModeIndependentColor>> = {};\n\n constructor(private contentDiv: HTMLElement, private getDarkColor: (color: string) => string) {}\n\n /\n Get a copy of known colors\n * @returns\n /\n getKnownColorsCopy() {\n return Object.values(this.knownColors);\n }\n\n /\n Given a light mode color value and an optional dark mode color value, register this color\n * so that editor can handle it, then return the CSS color value for current color mode.\n * @param lightModeColor Light mode color value\n * @param isDarkMode Whether current color mode is dark mode\n * @param darkModeColor Optional dark mode color value. If not passed, we will calculate one.\n /\n registerColor(lightModeColor: string, isDarkMode: boolean, darkModeColor?: string): string {\n const parsedColor = this.parseColorValue(lightModeColor);\n let colorKey: string \| undefined;\n\n if (parsedColor) {\n lightModeColor = parsedColor.lightModeColor;\n darkModeColor = parsedColor.darkModeColor \|\| darkModeColor;\n colorKey = parsedColor.key;\n }\n\n if (isDarkMode && lightModeColor) {\n colorKey =\n colorKey \|\| `--${COLOR_VAR_PREFIX}_${lightModeColor.replace(/[^\\d\\w]/g, '_')}`;\n\n if (!this.knownColors[colorKey]) {\n darkModeColor = darkModeColor \|\| this.getDarkColor(lightModeColor);\n\n this.knownColors[colorKey] = { lightModeColor, darkModeColor };\n this.contentDiv.style.setProperty(colorKey, darkModeColor);\n }\n\n return `var(${colorKey}, ${lightModeColor})`;\n } else {\n return lightModeColor;\n }\n }\n\n /\n Reset known color record, clean up registered color variables.\n /\n reset(): void {\n getObjectKeys(this.knownColors).forEach(key => this.contentDiv.style.removeProperty(key));\n this.knownColors = {};\n }\n\n /\n Parse an existing color value, if it is in variable-based color format, extract color key,\n * light color and query related dark color if any\n * @param color The color string to parse\n * @param isInDarkMode Whether current content is in dark mode. When set to true, if the color value is not in dark var format,\n * we will treat is as a dark mode color and try to find a matched dark mode color.\n /\n parseColorValue(color: string \| undefined \| null, isInDarkMode?: boolean): ColorKeyAndValue {\n let key: string \| undefined;\n let lightModeColor = '';\n let darkModeColor: string \| undefined;\n\n if (color) {\n const match = color.startsWith(VARIABLE_PREFIX) ? VARIABLE_REGEX.exec(color) : null;\n\n if (match) {\n if (match[2]) {\n key = match[1];\n lightModeColor = match[2];\n darkModeColor = this.knownColors[key]?.darkModeColor;\n } else {\n lightModeColor = '';\n }\n } else if (isInDarkMode) {\n // If editor is in dark mode but the color is not in dark color format, it is possible the color was inserted from external code\n // without any light color info. So we first try to see if there is a known dark color can match this color, and use its related\n // light color as light mode color. Otherwise we need to drop this color to avoid show \"white on white\" content.\n lightModeColor = this.findLightColorFromDarkColor(color) \|\| '';\n\n if (lightModeColor) {\n darkModeColor = color;\n }\n } else {\n lightModeColor = color;\n }\n }\n\n return { key, lightModeColor, darkModeColor };\n }\n\n /\n Find related light mode color from dark mode color.\n * @param darkColor The existing dark color\n /\n findLightColorFromDarkColor(darkColor: string): string \| null {\n const rgbSearch = parseColor(darkColor);\n\n if (rgbSearch) {\n const key = getObjectKeys(this.knownColors).find(key => {\n const rgbCurrent = parseColor(this.knownColors[key].darkModeColor);\n\n return (\n rgbCurrent &&\n rgbCurrent[0] == rgbSearch[0] &&\n rgbCurrent[1] == rgbSearch[1] &&\n rgbCurrent[2] == rgbSearch[2]\n );\n });\n\n if (key) {\n return this.knownColors[key].lightModeColor;\n }\n }\n\n return null;\n }\n\n /\n Transform element color, from dark to light or from light to dark\n * @param element The element to transform color\n * @param fromDarkMode Whether this is transforming color from dark mode\n * @param toDarkMode Whether this is transforming color to dark mode\n /\n transformElementColor(element: HTMLElement, fromDarkMode: boolean, toDarkMode: boolean): void {\n ColorAttributeName.forEach((names, i) => {\n const color = this.parseColorValue(\n element.style.getPropertyValue(names[ColorAttributeEnum.CssColor]) \|\|\n element.getAttribute(names[ColorAttributeEnum.HtmlColor]),\n !!fromDarkMode\n ).lightModeColor;\n\n element.style.setProperty(names[ColorAttributeEnum.CssColor], null);\n element.removeAttribute(names[ColorAttributeEnum.HtmlColor]);\n\n if (color && color != 'inherit') {\n setColor(element, color, i != 0, toDarkMode, false /shouldAdaptFontColor*/, this);\n }\n });\n }\n}\n"]}

package/lib-amd/editor/createStandaloneEditorCore.js CHANGED Viewed

@@ -8,6 +8,7 @@ define(["require", "exports", "tslib", "../corePlugin/createStandaloneEditorCore
      * @param options Editor options
      */
     function createStandaloneEditorCore(contentDiv, options, unportedCoreApiMap, unportedCorePluginState, tempPlugins) {
+        var _a;
         var corePlugins = (0, createStandaloneEditorCorePlugins_1.createStandaloneEditorCorePlugins)(options, contentDiv);
         return (0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)({ contentDiv: contentDiv, api: (0, tslib_1.__assign)((0, tslib_1.__assign)((0, tslib_1.__assign)({}, standaloneCoreApiMap_1.standaloneCoreApiMap), unportedCoreApiMap), options.coreApiOverride), originalApi: (0, tslib_1.__assign)((0, tslib_1.__assign)({}, standaloneCoreApiMap_1.standaloneCoreApiMap), unportedCoreApiMap), plugins: (0, tslib_1.__spreadArray)((0, tslib_1.__spreadArray)([
                 corePlugins.cache,
@@ -18,7 +19,7 @@ define(["require", "exports", "tslib", "../corePlugin/createStandaloneEditorCore
                 corePlugins.entity
             ], (0, tslib_1.__read)(tempPlugins), false), [
                 corePlugins.lifecycle,
-            ], false), environment: createEditorEnvironment(), darkColorHandler: new DarkColorHandlerImpl_1.DarkColorHandlerImpl(contentDiv, options.baseDarkColor), trustedHTMLHandler: options.trustedHTMLHandler || defaultTrustHtmlHandler }, (0, createStandaloneEditorDefaultSettings_1.createStandaloneEditorDefaultSettings)(options)), getPluginState(corePlugins)), unportedCorePluginState);
+            ], false), environment: createEditorEnvironment(), darkColorHandler: new DarkColorHandlerImpl_1.DarkColorHandlerImpl(contentDiv, (_a = options.getDarkColor) !== null && _a !== void 0 ? _a : getDarkColorFallback), trustedHTMLHandler: options.trustedHTMLHandler || defaultTrustHtmlHandler }, (0, createStandaloneEditorDefaultSettings_1.createStandaloneEditorDefaultSettings)(options)), getPluginState(corePlugins)), unportedCorePluginState);
     }
     exports.createStandaloneEditorCore = createStandaloneEditorCore;
     function createEditorEnvironment() {
@@ -50,5 +51,9 @@ define(["require", "exports", "tslib", "../corePlugin/createStandaloneEditorCore
             selection: corePlugins.selection.getState(),
         };
     }
+    // A fallback function, always return original color
+    function getDarkColorFallback(color) {
+        return color;
+    }
 });
 //# sourceMappingURL=createStandaloneEditorCore.js.map

package/lib-amd/editor/createStandaloneEditorCore.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"createStandaloneEditorCore.js","sourceRoot":"","sources":["../../../../packages-content-model/roosterjs-content-model-core/lib/editor/createStandaloneEditorCore.ts"],"names":[],"mappings":";;;;IAeA;;;;OAIG;IACH,SAAgB,0BAA0B,CACtC,UAA0B,EAC1B,OAAgC,EAChC,kBAAsC,EACtC,uBAAgD,EAChD,WAA2B;QAE3B,IAAM,WAAW,GAAG,IAAA,qEAAiC,EAAC,OAAO,EAAE,UAAU,CAAC,CAAC;QAE3E,2EACI,UAAU,YAAA,EACV,GAAG,wEAAO,2CAAoB,GAAK,kBAAkB,GAAK,OAAO,CAAC,eAAe,GACjF,WAAW,kDAAO,2CAAoB,GAAK,kBAAkB,GAC7D,OAAO;gBACH,WAAW,CAAC,KAAK;gBACjB,WAAW,CAAC,MAAM;gBAClB,WAAW,CAAC,SAAS;gBACrB,WAAW,CAAC,QAAQ;gBACpB,WAAW,CAAC,SAAS;gBACrB,WAAW,CAAC,MAAM;mCACf,WAAW;gBACd,WAAW,CAAC,SAAS;uBAEzB,WAAW,EAAE,uBAAuB,EAAE,EACtC,gBAAgB,EAAE,IAAI,2CAAoB,~~CAAC~~,UAAU,~~EAAE~~,OAAO,CAAC,~~aAAa~~,~~CAAC~~,~~EAC7E~~,kBAAkB,EAAE,OAAO,CAAC,kBAAkB,IAAI,uBAAuB,IACtE,IAAA,6EAAqC,EAAC,OAAO,CAAC,GAC9C,cAAc,CAAC,WAAW,CAAC,GAC3B,uBAAuB,EAC5B;IACN,CAAC;~~IA9BD~~,~~gEA8BC~~;IAED,SAAS,uBAAuB;QAC5B,oHAAoH;QACpH,IAAM,SAAS,GAAG,MAAM,CAAC,SAAS,CAAC,SAAS,CAAC;QAE7C,OAAO;YACH,KAAK,EAAE,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;YACvD,SAAS,EAAE,UAAU,CAAC,IAAI,CAAC,SAAS,CAAC;YACrC,QAAQ,EACJ,SAAS,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC;gBAChC,SAAS,CAAC,OAAO,CAAC,QAAQ,CAAC,GAAG,CAAC;gBAC/B,SAAS,CAAC,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC;SACvC,CAAC;IACN,CAAC;IAED;;OAEG;IACH,SAAgB,uBAAuB,CAAC,IAAY;QAChD,OAAO,IAAI,CAAC;IAChB,CAAC;IAFD,0DAEC;IAED,SAAS,cAAc,CAAC,WAAwC;QAC5D,OAAO;YACH,QAAQ,EAAE,WAAW,CAAC,QAAQ,CAAC,QAAQ,EAAE;YACzC,SAAS,EAAE,WAAW,CAAC,SAAS,CAAC,QAAQ,EAAE;YAC3C,KAAK,EAAE,WAAW,CAAC,KAAK,CAAC,QAAQ,EAAE;YACnC,MAAM,EAAE,WAAW,CAAC,MAAM,CAAC,QAAQ,EAAE;YACrC,SAAS,EAAE,WAAW,CAAC,SAAS,CAAC,QAAQ,EAAE;YAC3C,MAAM,EAAE,WAAW,CAAC,MAAM,CAAC,QAAQ,EAAE;YACrC,SAAS,EAAE,WAAW,CAAC,SAAS,CAAC,QAAQ,EAAE;SAC9C,CAAC;IACN,CAAC","sourcesContent":["import { createStandaloneEditorCorePlugins } from '../corePlugin/createStandaloneEditorCorePlugins';\nimport { createStandaloneEditorDefaultSettings } from './createStandaloneEditorDefaultSettings';\nimport { DarkColorHandlerImpl } from './DarkColorHandlerImpl';\nimport { standaloneCoreApiMap } from './standaloneCoreApiMap';\nimport type { EditorPlugin } from 'roosterjs-editor-types';\nimport type {\n EditorEnvironment,\n StandaloneEditorCore,\n StandaloneEditorCorePluginState,\n StandaloneEditorCorePlugins,\n StandaloneEditorOptions,\n UnportedCoreApiMap,\n UnportedCorePluginState,\n} from 'roosterjs-content-model-types';\n\n/*\n A temporary function to create Standalone Editor core\n * @param contentDiv Editor content DIV\n * @param options Editor options\n /\nexport function createStandaloneEditorCore(\n contentDiv: HTMLDivElement,\n options: StandaloneEditorOptions,\n unportedCoreApiMap: UnportedCoreApiMap,\n unportedCorePluginState: UnportedCorePluginState,\n tempPlugins: EditorPlugin[]\n): StandaloneEditorCore {\n const corePlugins = createStandaloneEditorCorePlugins(options, contentDiv);\n\n return {\n contentDiv,\n api: { ...standaloneCoreApiMap, ...unportedCoreApiMap, ...options.coreApiOverride },\n originalApi: { ...standaloneCoreApiMap, ...unportedCoreApiMap },\n plugins: [\n corePlugins.cache,\n corePlugins.format,\n corePlugins.copyPaste,\n corePlugins.domEvent,\n corePlugins.selection,\n corePlugins.entity,\n ...tempPlugins,\n corePlugins.lifecycle,\n ],\n environment: createEditorEnvironment(),\n darkColorHandler: new DarkColorHandlerImpl(contentDiv, options.~~baseDarkColor~~),\n trustedHTMLHandler: options.trustedHTMLHandler \|\| defaultTrustHtmlHandler,\n ...createStandaloneEditorDefaultSettings(options),\n ...getPluginState(corePlugins),\n ...unportedCorePluginState,\n };\n}\n\nfunction createEditorEnvironment(): EditorEnvironment {\n // It is ok to use global window here since the environment should always be the same for all windows in one session\n const userAgent = window.navigator.userAgent;\n\n return {\n isMac: window.navigator.appVersion.indexOf('Mac') != -1,\n isAndroid: /android/i.test(userAgent),\n isSafari:\n userAgent.indexOf('Safari') >= 0 &&\n userAgent.indexOf('Chrome') < 0 &&\n userAgent.indexOf('Android') < 0,\n };\n}\n\n/\n @internal export for test only\n */\nexport function defaultTrustHtmlHandler(html: string) {\n return html;\n}\n\nfunction getPluginState(corePlugins: StandaloneEditorCorePlugins): StandaloneEditorCorePluginState {\n return {\n domEvent: corePlugins.domEvent.getState(),\n copyPaste: corePlugins.copyPaste.getState(),\n cache: corePlugins.cache.getState(),\n format: corePlugins.format.getState(),\n lifecycle: corePlugins.lifecycle.getState(),\n entity: corePlugins.entity.getState(),\n selection: corePlugins.selection.getState(),\n };\n}\n"]}
1	+ {"version":3,"file":"createStandaloneEditorCore.js","sourceRoot":"","sources":["../../../../packages-content-model/roosterjs-content-model-core/lib/editor/createStandaloneEditorCore.ts"],"names":[],"mappings":";;;;IAeA;;;;OAIG;IACH,SAAgB,0BAA0B,CACtC,UAA0B,EAC1B,OAAgC,EAChC,kBAAsC,EACtC,uBAAgD,EAChD,WAA2B;;QAE3B,IAAM,WAAW,GAAG,IAAA,qEAAiC,EAAC,OAAO,EAAE,UAAU,CAAC,CAAC;QAE3E,2EACI,UAAU,YAAA,EACV,GAAG,wEAAO,2CAAoB,GAAK,kBAAkB,GAAK,OAAO,CAAC,eAAe,GACjF,WAAW,kDAAO,2CAAoB,GAAK,kBAAkB,GAC7D,OAAO;gBACH,WAAW,CAAC,KAAK;gBACjB,WAAW,CAAC,MAAM;gBAClB,WAAW,CAAC,SAAS;gBACrB,WAAW,CAAC,QAAQ;gBACpB,WAAW,CAAC,SAAS;gBACrB,WAAW,CAAC,MAAM;mCACf,WAAW;gBACd,WAAW,CAAC,SAAS;uBAEzB,WAAW,EAAE,uBAAuB,EAAE,EACtC,gBAAgB,EAAE,IAAI,2CAAoB,CACtC,UAAU,EACV,MAAA,OAAO,CAAC,YAAY,mCAAI,oBAAoB,CAC/C,EACD,kBAAkB,EAAE,OAAO,CAAC,kBAAkB,IAAI,uBAAuB,IACtE,IAAA,6EAAqC,EAAC,OAAO,CAAC,GAC9C,cAAc,CAAC,WAAW,CAAC,GAC3B,uBAAuB,EAC5B;IACN,CAAC;IAjCD,gEAiCC;IAED,SAAS,uBAAuB;QAC5B,oHAAoH;QACpH,IAAM,SAAS,GAAG,MAAM,CAAC,SAAS,CAAC,SAAS,CAAC;QAE7C,OAAO;YACH,KAAK,EAAE,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;YACvD,SAAS,EAAE,UAAU,CAAC,IAAI,CAAC,SAAS,CAAC;YACrC,QAAQ,EACJ,SAAS,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC;gBAChC,SAAS,CAAC,OAAO,CAAC,QAAQ,CAAC,GAAG,CAAC;gBAC/B,SAAS,CAAC,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC;SACvC,CAAC;IACN,CAAC;IAED;;OAEG;IACH,SAAgB,uBAAuB,CAAC,IAAY;QAChD,OAAO,IAAI,CAAC;IAChB,CAAC;IAFD,0DAEC;IAED,SAAS,cAAc,CAAC,WAAwC;QAC5D,OAAO;YACH,QAAQ,EAAE,WAAW,CAAC,QAAQ,CAAC,QAAQ,EAAE;YACzC,SAAS,EAAE,WAAW,CAAC,SAAS,CAAC,QAAQ,EAAE;YAC3C,KAAK,EAAE,WAAW,CAAC,KAAK,CAAC,QAAQ,EAAE;YACnC,MAAM,EAAE,WAAW,CAAC,MAAM,CAAC,QAAQ,EAAE;YACrC,SAAS,EAAE,WAAW,CAAC,SAAS,CAAC,QAAQ,EAAE;YAC3C,MAAM,EAAE,WAAW,CAAC,MAAM,CAAC,QAAQ,EAAE;YACrC,SAAS,EAAE,WAAW,CAAC,SAAS,CAAC,QAAQ,EAAE;SAC9C,CAAC;IACN,CAAC;IAED,oDAAoD;IACpD,SAAS,oBAAoB,CAAC,KAAa;QACvC,OAAO,KAAK,CAAC;IACjB,CAAC","sourcesContent":["import { createStandaloneEditorCorePlugins } from '../corePlugin/createStandaloneEditorCorePlugins';\nimport { createStandaloneEditorDefaultSettings } from './createStandaloneEditorDefaultSettings';\nimport { DarkColorHandlerImpl } from './DarkColorHandlerImpl';\nimport { standaloneCoreApiMap } from './standaloneCoreApiMap';\nimport type { EditorPlugin } from 'roosterjs-editor-types';\nimport type {\n EditorEnvironment,\n StandaloneEditorCore,\n StandaloneEditorCorePluginState,\n StandaloneEditorCorePlugins,\n StandaloneEditorOptions,\n UnportedCoreApiMap,\n UnportedCorePluginState,\n} from 'roosterjs-content-model-types';\n\n/*\n A temporary function to create Standalone Editor core\n * @param contentDiv Editor content DIV\n * @param options Editor options\n /\nexport function createStandaloneEditorCore(\n contentDiv: HTMLDivElement,\n options: StandaloneEditorOptions,\n unportedCoreApiMap: UnportedCoreApiMap,\n unportedCorePluginState: UnportedCorePluginState,\n tempPlugins: EditorPlugin[]\n): StandaloneEditorCore {\n const corePlugins = createStandaloneEditorCorePlugins(options, contentDiv);\n\n return {\n contentDiv,\n api: { ...standaloneCoreApiMap, ...unportedCoreApiMap, ...options.coreApiOverride },\n originalApi: { ...standaloneCoreApiMap, ...unportedCoreApiMap },\n plugins: [\n corePlugins.cache,\n corePlugins.format,\n corePlugins.copyPaste,\n corePlugins.domEvent,\n corePlugins.selection,\n corePlugins.entity,\n ...tempPlugins,\n corePlugins.lifecycle,\n ],\n environment: createEditorEnvironment(),\n darkColorHandler: new DarkColorHandlerImpl(\n contentDiv,\n options.getDarkColor ?? getDarkColorFallback\n ),\n trustedHTMLHandler: options.trustedHTMLHandler \|\| defaultTrustHtmlHandler,\n ...createStandaloneEditorDefaultSettings(options),\n ...getPluginState(corePlugins),\n ...unportedCorePluginState,\n };\n}\n\nfunction createEditorEnvironment(): EditorEnvironment {\n // It is ok to use global window here since the environment should always be the same for all windows in one session\n const userAgent = window.navigator.userAgent;\n\n return {\n isMac: window.navigator.appVersion.indexOf('Mac') != -1,\n isAndroid: /android/i.test(userAgent),\n isSafari:\n userAgent.indexOf('Safari') >= 0 &&\n userAgent.indexOf('Chrome') < 0 &&\n userAgent.indexOf('Android') < 0,\n };\n}\n\n/\n @internal export for test only\n */\nexport function defaultTrustHtmlHandler(html: string) {\n return html;\n}\n\nfunction getPluginState(corePlugins: StandaloneEditorCorePlugins): StandaloneEditorCorePluginState {\n return {\n domEvent: corePlugins.domEvent.getState(),\n copyPaste: corePlugins.copyPaste.getState(),\n cache: corePlugins.cache.getState(),\n format: corePlugins.format.getState(),\n lifecycle: corePlugins.lifecycle.getState(),\n entity: corePlugins.entity.getState(),\n selection: corePlugins.selection.getState(),\n };\n}\n\n// A fallback function, always return original color\nfunction getDarkColorFallback(color: string) {\n return color;\n}\n"]}

package/lib-mjs/editor/DarkColorHandlerImpl.d.ts CHANGED Viewed

@@ -4,9 +4,9 @@ import type { ColorKeyAndValue, DarkColorHandler, ModeIndependentColor } from 'r
  */
 export declare class DarkColorHandlerImpl implements DarkColorHandler {
     private contentDiv;
+    private getDarkColor;
     private knownColors;
-    readonly baseLightness: number;
-    constructor(contentDiv: HTMLElement, baseDarkColor?: string);
+    constructor(contentDiv: HTMLElement, getDarkColor: (color: string) => string);
     /**
      * Get a copy of known colors
      * @returns

package/lib-mjs/editor/DarkColorHandlerImpl.js CHANGED Viewed

@@ -1,7 +1,5 @@
 var _a, _b;
-import * as Color from 'color';
 import { getObjectKeys, parseColor, setColor } from 'roosterjs-editor-dom';
-var DefaultLightness = 21.25; // Lightness for #333333
 var VARIABLE_REGEX = /^\s*var\(\s*(\-\-[a-zA-Z0-9\-_]+)\s*(?:,\s*(.*))?\)\s*$/;
 var VARIABLE_PREFIX = 'var(';
 var COLOR_VAR_PREFIX = 'darkColor';
@@ -24,10 +22,10 @@ var ColorAttributeName = [
  * @internal
  */
 var DarkColorHandlerImpl = /** @class */ (function () {
-    function DarkColorHandlerImpl(contentDiv, baseDarkColor) {
+    function DarkColorHandlerImpl(contentDiv, getDarkColor) {
         this.contentDiv = contentDiv;
+        this.getDarkColor = getDarkColor;
         this.knownColors = {};
-        this.baseLightness = getLightness(baseDarkColor);
     }
     /**
      * Get a copy of known colors
@@ -55,7 +53,7 @@ var DarkColorHandlerImpl = /** @class */ (function () {
             colorKey =
                 colorKey || "--" + COLOR_VAR_PREFIX + "_" + lightModeColor.replace(/[^\d\w]/g, '_');
             if (!this.knownColors[colorKey]) {
-                darkModeColor = darkModeColor || getDarkColor(lightModeColor, this.baseLightness);
+                darkModeColor = darkModeColor || this.getDarkColor(lightModeColor);
                 this.knownColors[colorKey] = { lightModeColor: lightModeColor, darkModeColor: darkModeColor };
                 this.contentDiv.style.setProperty(colorKey, darkModeColor);
             }
@@ -154,28 +152,4 @@ var DarkColorHandlerImpl = /** @class */ (function () {
     return DarkColorHandlerImpl;
 }());
 export { DarkColorHandlerImpl };
-function getDarkColor(color, baseLightness) {
-    try {
-        var computedColor = Color(color || undefined);
-        var colorLab = computedColor.lab().array();
-        var newLValue = (100 - colorLab[0]) * ((100 - baseLightness) / 100) + baseLightness;
-        color = Color.lab(newLValue, colorLab[1], colorLab[2])
-            .rgb()
-            .alpha(computedColor.alpha())
-            .toString();
-    }
-    catch (_a) { }
-    return color;
-}
-function getLightness(color) {
-    var result = DefaultLightness;
-    if (color) {
-        try {
-            var computedColor = Color(color || undefined);
-            result = computedColor.lab().array()[0];
-        }
-        catch (_a) { }
-    }
-    return result;
-}
 //# sourceMappingURL=DarkColorHandlerImpl.js.map

package/lib-mjs/editor/DarkColorHandlerImpl.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DarkColorHandlerImpl.js","sourceRoot":"","sources":["../../../../packages-content-model/roosterjs-content-model-core/lib/editor/DarkColorHandlerImpl.ts"],"names":[],"mappings":"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","sourcesContent":["import * as Color from 'color';\nimport { getObjectKeys, parseColor, setColor } from 'roosterjs-editor-dom';\nimport type {\n ColorKeyAndValue,\n DarkColorHandler,\n ModeIndependentColor,\n} from 'roosterjs-editor-types';\n\nconst DefaultLightness = 21.25; // Lightness for #333333\nconst VARIABLE_REGEX = /^\\svar\$\\s(\\-\\-[a-zA-Z0-9\\-_]+)\\s(?:,\\s(.))?\$\\s$/;\nconst VARIABLE_PREFIX = 'var(';\nconst COLOR_VAR_PREFIX = 'darkColor';\nconst enum ColorAttributeEnum {\n CssColor = 0,\n HtmlColor = 1,\n}\nconst ColorAttributeName: { [key in ColorAttributeEnum]: string }[] = [\n {\n [ColorAttributeEnum.CssColor]: 'color',\n [ColorAttributeEnum.HtmlColor]: 'color',\n },\n {\n [ColorAttributeEnum.CssColor]: 'background-color',\n [ColorAttributeEnum.HtmlColor]: 'bgcolor',\n },\n];\n\n/*\n @internal\n /\nexport class DarkColorHandlerImpl implements DarkColorHandler {\n private knownColors: Record<string, Readonly<ModeIndependentColor>> = {};\n readonly baseLightness: number;\n\n constructor(private contentDiv: HTMLElement, baseDarkColor?: string) {\n this.baseLightness = getLightness(baseDarkColor);\n }\n\n /\n Get a copy of known colors\n * @returns\n /\n getKnownColorsCopy() {\n return Object.values(this.knownColors);\n }\n\n /\n Given a light mode color value and an optional dark mode color value, register this color\n * so that editor can handle it, then return the CSS color value for current color mode.\n * @param lightModeColor Light mode color value\n * @param isDarkMode Whether current color mode is dark mode\n * @param darkModeColor Optional dark mode color value. If not passed, we will calculate one.\n /\n registerColor(lightModeColor: string, isDarkMode: boolean, darkModeColor?: string): string {\n const parsedColor = this.parseColorValue(lightModeColor);\n let colorKey: string \| undefined;\n\n if (parsedColor) {\n lightModeColor = parsedColor.lightModeColor;\n darkModeColor = parsedColor.darkModeColor \|\| darkModeColor;\n colorKey = parsedColor.key;\n }\n\n if (isDarkMode && lightModeColor) {\n colorKey =\n colorKey \|\| `--${COLOR_VAR_PREFIX}_${lightModeColor.replace(/[^\\d\\w]/g, '_')}`;\n\n if (!this.knownColors[colorKey]) {\n darkModeColor = darkModeColor \|\| getDarkColor(lightModeColor, this.baseLightness);\n\n this.knownColors[colorKey] = { lightModeColor, darkModeColor };\n this.contentDiv.style.setProperty(colorKey, darkModeColor);\n }\n\n return `var(${colorKey}, ${lightModeColor})`;\n } else {\n return lightModeColor;\n }\n }\n\n /\n Reset known color record, clean up registered color variables.\n /\n reset(): void {\n getObjectKeys(this.knownColors).forEach(key => this.contentDiv.style.removeProperty(key));\n this.knownColors = {};\n }\n\n /\n Parse an existing color value, if it is in variable-based color format, extract color key,\n * light color and query related dark color if any\n * @param color The color string to parse\n * @param isInDarkMode Whether current content is in dark mode. When set to true, if the color value is not in dark var format,\n * we will treat is as a dark mode color and try to find a matched dark mode color.\n /\n parseColorValue(color: string \| undefined \| null, isInDarkMode?: boolean): ColorKeyAndValue {\n let key: string \| undefined;\n let lightModeColor = '';\n let darkModeColor: string \| undefined;\n\n if (color) {\n const match = color.startsWith(VARIABLE_PREFIX) ? VARIABLE_REGEX.exec(color) : null;\n\n if (match) {\n if (match[2]) {\n key = match[1];\n lightModeColor = match[2];\n darkModeColor = this.knownColors[key]?.darkModeColor;\n } else {\n lightModeColor = '';\n }\n } else if (isInDarkMode) {\n // If editor is in dark mode but the color is not in dark color format, it is possible the color was inserted from external code\n // without any light color info. So we first try to see if there is a known dark color can match this color, and use its related\n // light color as light mode color. Otherwise we need to drop this color to avoid show \"white on white\" content.\n lightModeColor = this.findLightColorFromDarkColor(color) \|\| '';\n\n if (lightModeColor) {\n darkModeColor = color;\n }\n } else {\n lightModeColor = color;\n }\n }\n\n return { key, lightModeColor, darkModeColor };\n }\n\n /\n Find related light mode color from dark mode color.\n * @param darkColor The existing dark color\n /\n findLightColorFromDarkColor(darkColor: string): string \| null {\n const rgbSearch = parseColor(darkColor);\n\n if (rgbSearch) {\n const key = getObjectKeys(this.knownColors).find(key => {\n const rgbCurrent = parseColor(this.knownColors[key].darkModeColor);\n\n return (\n rgbCurrent &&\n rgbCurrent[0] == rgbSearch[0] &&\n rgbCurrent[1] == rgbSearch[1] &&\n rgbCurrent[2] == rgbSearch[2]\n );\n });\n\n if (key) {\n return this.knownColors[key].lightModeColor;\n }\n }\n\n return null;\n }\n\n /\n Transform element color, from dark to light or from light to dark\n * @param element The element to transform color\n * @param fromDarkMode Whether this is transforming color from dark mode\n * @param toDarkMode Whether this is transforming color to dark mode\n /\n transformElementColor(element: HTMLElement, fromDarkMode: boolean, toDarkMode: boolean): void {\n ColorAttributeName.forEach((names, i) => {\n const color = this.parseColorValue(\n element.style.getPropertyValue(names[ColorAttributeEnum.CssColor]) \|\|\n element.getAttribute(names[ColorAttributeEnum.HtmlColor]),\n !!fromDarkMode\n ).lightModeColor;\n\n element.style.setProperty(names[ColorAttributeEnum.CssColor], null);\n element.removeAttribute(names[ColorAttributeEnum.HtmlColor]);\n\n if (color && color != 'inherit') {\n setColor(element, color, i != 0, toDarkMode, false /shouldAdaptFontColor/, this);\n }\n });\n }\n}\n\nfunction getDarkColor(color: string, baseLightness: number): string {\n try {\n const computedColor = Color(color \|\| undefined);\n const colorLab = computedColor.lab().array();\n const newLValue = (100 - colorLab[0]) ((100 - baseLightness) / 100) + baseLightness;\n color = Color.lab(newLValue, colorLab[1], colorLab[2])\n .rgb()\n .alpha(computedColor.alpha())\n .toString();\n } catch {}\n\n return color;\n}\n\nfunction getLightness(color?: string): number {\n let result = DefaultLightness;\n\n if (color) {\n try {\n const computedColor = Color(color \|\| undefined);\n result = computedColor.lab().array()[0];\n } catch {}\n }\n\n return result;\n}\n"]}
1	+ {"version":3,"file":"DarkColorHandlerImpl.js","sourceRoot":"","sources":["../../../../packages-content-model/roosterjs-content-model-core/lib/editor/DarkColorHandlerImpl.ts"],"names":[],"mappings":"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","sourcesContent":["import { getObjectKeys, parseColor, setColor } from 'roosterjs-editor-dom';\nimport type {\n ColorKeyAndValue,\n DarkColorHandler,\n ModeIndependentColor,\n} from 'roosterjs-editor-types';\n\nconst VARIABLE_REGEX = /^\\svar\$\\s(\\-\\-[a-zA-Z0-9\\-_]+)\\s(?:,\\s(.))?\$\\s$/;\nconst VARIABLE_PREFIX = 'var(';\nconst COLOR_VAR_PREFIX = 'darkColor';\nconst enum ColorAttributeEnum {\n CssColor = 0,\n HtmlColor = 1,\n}\nconst ColorAttributeName: { [key in ColorAttributeEnum]: string }[] = [\n {\n [ColorAttributeEnum.CssColor]: 'color',\n [ColorAttributeEnum.HtmlColor]: 'color',\n },\n {\n [ColorAttributeEnum.CssColor]: 'background-color',\n [ColorAttributeEnum.HtmlColor]: 'bgcolor',\n },\n];\n\n/*\n @internal\n /\nexport class DarkColorHandlerImpl implements DarkColorHandler {\n private knownColors: Record<string, Readonly<ModeIndependentColor>> = {};\n\n constructor(private contentDiv: HTMLElement, private getDarkColor: (color: string) => string) {}\n\n /\n Get a copy of known colors\n * @returns\n /\n getKnownColorsCopy() {\n return Object.values(this.knownColors);\n }\n\n /\n Given a light mode color value and an optional dark mode color value, register this color\n * so that editor can handle it, then return the CSS color value for current color mode.\n * @param lightModeColor Light mode color value\n * @param isDarkMode Whether current color mode is dark mode\n * @param darkModeColor Optional dark mode color value. If not passed, we will calculate one.\n /\n registerColor(lightModeColor: string, isDarkMode: boolean, darkModeColor?: string): string {\n const parsedColor = this.parseColorValue(lightModeColor);\n let colorKey: string \| undefined;\n\n if (parsedColor) {\n lightModeColor = parsedColor.lightModeColor;\n darkModeColor = parsedColor.darkModeColor \|\| darkModeColor;\n colorKey = parsedColor.key;\n }\n\n if (isDarkMode && lightModeColor) {\n colorKey =\n colorKey \|\| `--${COLOR_VAR_PREFIX}_${lightModeColor.replace(/[^\\d\\w]/g, '_')}`;\n\n if (!this.knownColors[colorKey]) {\n darkModeColor = darkModeColor \|\| this.getDarkColor(lightModeColor);\n\n this.knownColors[colorKey] = { lightModeColor, darkModeColor };\n this.contentDiv.style.setProperty(colorKey, darkModeColor);\n }\n\n return `var(${colorKey}, ${lightModeColor})`;\n } else {\n return lightModeColor;\n }\n }\n\n /\n Reset known color record, clean up registered color variables.\n /\n reset(): void {\n getObjectKeys(this.knownColors).forEach(key => this.contentDiv.style.removeProperty(key));\n this.knownColors = {};\n }\n\n /\n Parse an existing color value, if it is in variable-based color format, extract color key,\n * light color and query related dark color if any\n * @param color The color string to parse\n * @param isInDarkMode Whether current content is in dark mode. When set to true, if the color value is not in dark var format,\n * we will treat is as a dark mode color and try to find a matched dark mode color.\n /\n parseColorValue(color: string \| undefined \| null, isInDarkMode?: boolean): ColorKeyAndValue {\n let key: string \| undefined;\n let lightModeColor = '';\n let darkModeColor: string \| undefined;\n\n if (color) {\n const match = color.startsWith(VARIABLE_PREFIX) ? VARIABLE_REGEX.exec(color) : null;\n\n if (match) {\n if (match[2]) {\n key = match[1];\n lightModeColor = match[2];\n darkModeColor = this.knownColors[key]?.darkModeColor;\n } else {\n lightModeColor = '';\n }\n } else if (isInDarkMode) {\n // If editor is in dark mode but the color is not in dark color format, it is possible the color was inserted from external code\n // without any light color info. So we first try to see if there is a known dark color can match this color, and use its related\n // light color as light mode color. Otherwise we need to drop this color to avoid show \"white on white\" content.\n lightModeColor = this.findLightColorFromDarkColor(color) \|\| '';\n\n if (lightModeColor) {\n darkModeColor = color;\n }\n } else {\n lightModeColor = color;\n }\n }\n\n return { key, lightModeColor, darkModeColor };\n }\n\n /\n Find related light mode color from dark mode color.\n * @param darkColor The existing dark color\n /\n findLightColorFromDarkColor(darkColor: string): string \| null {\n const rgbSearch = parseColor(darkColor);\n\n if (rgbSearch) {\n const key = getObjectKeys(this.knownColors).find(key => {\n const rgbCurrent = parseColor(this.knownColors[key].darkModeColor);\n\n return (\n rgbCurrent &&\n rgbCurrent[0] == rgbSearch[0] &&\n rgbCurrent[1] == rgbSearch[1] &&\n rgbCurrent[2] == rgbSearch[2]\n );\n });\n\n if (key) {\n return this.knownColors[key].lightModeColor;\n }\n }\n\n return null;\n }\n\n /\n Transform element color, from dark to light or from light to dark\n * @param element The element to transform color\n * @param fromDarkMode Whether this is transforming color from dark mode\n * @param toDarkMode Whether this is transforming color to dark mode\n /\n transformElementColor(element: HTMLElement, fromDarkMode: boolean, toDarkMode: boolean): void {\n ColorAttributeName.forEach((names, i) => {\n const color = this.parseColorValue(\n element.style.getPropertyValue(names[ColorAttributeEnum.CssColor]) \|\|\n element.getAttribute(names[ColorAttributeEnum.HtmlColor]),\n !!fromDarkMode\n ).lightModeColor;\n\n element.style.setProperty(names[ColorAttributeEnum.CssColor], null);\n element.removeAttribute(names[ColorAttributeEnum.HtmlColor]);\n\n if (color && color != 'inherit') {\n setColor(element, color, i != 0, toDarkMode, false /shouldAdaptFontColor*/, this);\n }\n });\n }\n}\n"]}

package/lib-mjs/editor/createStandaloneEditorCore.js CHANGED Viewed

@@ -9,6 +9,7 @@ import { standaloneCoreApiMap } from './standaloneCoreApiMap';
  * @param options Editor options
  */
 export function createStandaloneEditorCore(contentDiv, options, unportedCoreApiMap, unportedCorePluginState, tempPlugins) {
+    var _a;
     var corePlugins = createStandaloneEditorCorePlugins(options, contentDiv);
     return __assign(__assign(__assign({ contentDiv: contentDiv, api: __assign(__assign(__assign({}, standaloneCoreApiMap), unportedCoreApiMap), options.coreApiOverride), originalApi: __assign(__assign({}, standaloneCoreApiMap), unportedCoreApiMap), plugins: __spreadArray(__spreadArray([
             corePlugins.cache,
@@ -19,7 +20,7 @@ export function createStandaloneEditorCore(contentDiv, options, unportedCoreApiM
             corePlugins.entity
         ], __read(tempPlugins), false), [
             corePlugins.lifecycle,
-        ], false), environment: createEditorEnvironment(), darkColorHandler: new DarkColorHandlerImpl(contentDiv, options.baseDarkColor), trustedHTMLHandler: options.trustedHTMLHandler || defaultTrustHtmlHandler }, createStandaloneEditorDefaultSettings(options)), getPluginState(corePlugins)), unportedCorePluginState);
+        ], false), environment: createEditorEnvironment(), darkColorHandler: new DarkColorHandlerImpl(contentDiv, (_a = options.getDarkColor) !== null && _a !== void 0 ? _a : getDarkColorFallback), trustedHTMLHandler: options.trustedHTMLHandler || defaultTrustHtmlHandler }, createStandaloneEditorDefaultSettings(options)), getPluginState(corePlugins)), unportedCorePluginState);
 }
 function createEditorEnvironment() {
     // It is ok to use global window here since the environment should always be the same for all windows in one session
@@ -49,4 +50,8 @@ function getPluginState(corePlugins) {
         selection: corePlugins.selection.getState(),
     };
 }
+// A fallback function, always return original color
+function getDarkColorFallback(color) {
+    return color;
+}
 //# sourceMappingURL=createStandaloneEditorCore.js.map

package/lib-mjs/editor/createStandaloneEditorCore.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"createStandaloneEditorCore.js","sourceRoot":"","sources":["../../../../packages-content-model/roosterjs-content-model-core/lib/editor/createStandaloneEditorCore.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,iCAAiC,EAAE,MAAM,iDAAiD,CAAC;AACpG,OAAO,EAAE,qCAAqC,EAAE,MAAM,yCAAyC,CAAC;AAChG,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAC9D,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAY9D;;;;GAIG;AACH,MAAM,UAAU,0BAA0B,CACtC,UAA0B,EAC1B,OAAgC,EAChC,kBAAsC,EACtC,uBAAgD,EAChD,WAA2B;IAE3B,IAAM,WAAW,GAAG,iCAAiC,CAAC,OAAO,EAAE,UAAU,CAAC,CAAC;IAE3E,oCACI,UAAU,YAAA,EACV,GAAG,iCAAO,oBAAoB,GAAK,kBAAkB,GAAK,OAAO,CAAC,eAAe,GACjF,WAAW,wBAAO,oBAAoB,GAAK,kBAAkB,GAC7D,OAAO;YACH,WAAW,CAAC,KAAK;YACjB,WAAW,CAAC,MAAM;YAClB,WAAW,CAAC,SAAS;YACrB,WAAW,CAAC,QAAQ;YACpB,WAAW,CAAC,SAAS;YACrB,WAAW,CAAC,MAAM;kBACf,WAAW;YACd,WAAW,CAAC,SAAS;mBAEzB,WAAW,EAAE,uBAAuB,EAAE,EACtC,gBAAgB,EAAE,IAAI,oBAAoB,~~CAAC~~,UAAU,~~EAAE~~,OAAO,CAAC,~~aAAa~~,~~CAAC~~,~~EAC7E~~,kBAAkB,EAAE,OAAO,CAAC,kBAAkB,IAAI,uBAAuB,IACtE,qCAAqC,CAAC,OAAO,CAAC,GAC9C,cAAc,CAAC,WAAW,CAAC,GAC3B,uBAAuB,EAC5B;AACN,CAAC;AAED,SAAS,uBAAuB;IAC5B,oHAAoH;IACpH,IAAM,SAAS,GAAG,MAAM,CAAC,SAAS,CAAC,SAAS,CAAC;IAE7C,OAAO;QACH,KAAK,EAAE,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;QACvD,SAAS,EAAE,UAAU,CAAC,IAAI,CAAC,SAAS,CAAC;QACrC,QAAQ,EACJ,SAAS,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC;YAChC,SAAS,CAAC,OAAO,CAAC,QAAQ,CAAC,GAAG,CAAC;YAC/B,SAAS,CAAC,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC;KACvC,CAAC;AACN,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,uBAAuB,CAAC,IAAY;IAChD,OAAO,IAAI,CAAC;AAChB,CAAC;AAED,SAAS,cAAc,CAAC,WAAwC;IAC5D,OAAO;QACH,QAAQ,EAAE,WAAW,CAAC,QAAQ,CAAC,QAAQ,EAAE;QACzC,SAAS,EAAE,WAAW,CAAC,SAAS,CAAC,QAAQ,EAAE;QAC3C,KAAK,EAAE,WAAW,CAAC,KAAK,CAAC,QAAQ,EAAE;QACnC,MAAM,EAAE,WAAW,CAAC,MAAM,CAAC,QAAQ,EAAE;QACrC,SAAS,EAAE,WAAW,CAAC,SAAS,CAAC,QAAQ,EAAE;QAC3C,MAAM,EAAE,WAAW,CAAC,MAAM,CAAC,QAAQ,EAAE;QACrC,SAAS,EAAE,WAAW,CAAC,SAAS,CAAC,QAAQ,EAAE;KAC9C,CAAC;AACN,CAAC","sourcesContent":["import { createStandaloneEditorCorePlugins } from '../corePlugin/createStandaloneEditorCorePlugins';\nimport { createStandaloneEditorDefaultSettings } from './createStandaloneEditorDefaultSettings';\nimport { DarkColorHandlerImpl } from './DarkColorHandlerImpl';\nimport { standaloneCoreApiMap } from './standaloneCoreApiMap';\nimport type { EditorPlugin } from 'roosterjs-editor-types';\nimport type {\n EditorEnvironment,\n StandaloneEditorCore,\n StandaloneEditorCorePluginState,\n StandaloneEditorCorePlugins,\n StandaloneEditorOptions,\n UnportedCoreApiMap,\n UnportedCorePluginState,\n} from 'roosterjs-content-model-types';\n\n/*\n A temporary function to create Standalone Editor core\n * @param contentDiv Editor content DIV\n * @param options Editor options\n /\nexport function createStandaloneEditorCore(\n contentDiv: HTMLDivElement,\n options: StandaloneEditorOptions,\n unportedCoreApiMap: UnportedCoreApiMap,\n unportedCorePluginState: UnportedCorePluginState,\n tempPlugins: EditorPlugin[]\n): StandaloneEditorCore {\n const corePlugins = createStandaloneEditorCorePlugins(options, contentDiv);\n\n return {\n contentDiv,\n api: { ...standaloneCoreApiMap, ...unportedCoreApiMap, ...options.coreApiOverride },\n originalApi: { ...standaloneCoreApiMap, ...unportedCoreApiMap },\n plugins: [\n corePlugins.cache,\n corePlugins.format,\n corePlugins.copyPaste,\n corePlugins.domEvent,\n corePlugins.selection,\n corePlugins.entity,\n ...tempPlugins,\n corePlugins.lifecycle,\n ],\n environment: createEditorEnvironment(),\n darkColorHandler: new DarkColorHandlerImpl(contentDiv, options.~~baseDarkColor~~),\n trustedHTMLHandler: options.trustedHTMLHandler \|\| defaultTrustHtmlHandler,\n ...createStandaloneEditorDefaultSettings(options),\n ...getPluginState(corePlugins),\n ...unportedCorePluginState,\n };\n}\n\nfunction createEditorEnvironment(): EditorEnvironment {\n // It is ok to use global window here since the environment should always be the same for all windows in one session\n const userAgent = window.navigator.userAgent;\n\n return {\n isMac: window.navigator.appVersion.indexOf('Mac') != -1,\n isAndroid: /android/i.test(userAgent),\n isSafari:\n userAgent.indexOf('Safari') >= 0 &&\n userAgent.indexOf('Chrome') < 0 &&\n userAgent.indexOf('Android') < 0,\n };\n}\n\n/\n @internal export for test only\n */\nexport function defaultTrustHtmlHandler(html: string) {\n return html;\n}\n\nfunction getPluginState(corePlugins: StandaloneEditorCorePlugins): StandaloneEditorCorePluginState {\n return {\n domEvent: corePlugins.domEvent.getState(),\n copyPaste: corePlugins.copyPaste.getState(),\n cache: corePlugins.cache.getState(),\n format: corePlugins.format.getState(),\n lifecycle: corePlugins.lifecycle.getState(),\n entity: corePlugins.entity.getState(),\n selection: corePlugins.selection.getState(),\n };\n}\n"]}
1	+ {"version":3,"file":"createStandaloneEditorCore.js","sourceRoot":"","sources":["../../../../packages-content-model/roosterjs-content-model-core/lib/editor/createStandaloneEditorCore.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,iCAAiC,EAAE,MAAM,iDAAiD,CAAC;AACpG,OAAO,EAAE,qCAAqC,EAAE,MAAM,yCAAyC,CAAC;AAChG,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAC9D,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAY9D;;;;GAIG;AACH,MAAM,UAAU,0BAA0B,CACtC,UAA0B,EAC1B,OAAgC,EAChC,kBAAsC,EACtC,uBAAgD,EAChD,WAA2B;;IAE3B,IAAM,WAAW,GAAG,iCAAiC,CAAC,OAAO,EAAE,UAAU,CAAC,CAAC;IAE3E,oCACI,UAAU,YAAA,EACV,GAAG,iCAAO,oBAAoB,GAAK,kBAAkB,GAAK,OAAO,CAAC,eAAe,GACjF,WAAW,wBAAO,oBAAoB,GAAK,kBAAkB,GAC7D,OAAO;YACH,WAAW,CAAC,KAAK;YACjB,WAAW,CAAC,MAAM;YAClB,WAAW,CAAC,SAAS;YACrB,WAAW,CAAC,QAAQ;YACpB,WAAW,CAAC,SAAS;YACrB,WAAW,CAAC,MAAM;kBACf,WAAW;YACd,WAAW,CAAC,SAAS;mBAEzB,WAAW,EAAE,uBAAuB,EAAE,EACtC,gBAAgB,EAAE,IAAI,oBAAoB,CACtC,UAAU,EACV,MAAA,OAAO,CAAC,YAAY,mCAAI,oBAAoB,CAC/C,EACD,kBAAkB,EAAE,OAAO,CAAC,kBAAkB,IAAI,uBAAuB,IACtE,qCAAqC,CAAC,OAAO,CAAC,GAC9C,cAAc,CAAC,WAAW,CAAC,GAC3B,uBAAuB,EAC5B;AACN,CAAC;AAED,SAAS,uBAAuB;IAC5B,oHAAoH;IACpH,IAAM,SAAS,GAAG,MAAM,CAAC,SAAS,CAAC,SAAS,CAAC;IAE7C,OAAO;QACH,KAAK,EAAE,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;QACvD,SAAS,EAAE,UAAU,CAAC,IAAI,CAAC,SAAS,CAAC;QACrC,QAAQ,EACJ,SAAS,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC;YAChC,SAAS,CAAC,OAAO,CAAC,QAAQ,CAAC,GAAG,CAAC;YAC/B,SAAS,CAAC,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC;KACvC,CAAC;AACN,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,uBAAuB,CAAC,IAAY;IAChD,OAAO,IAAI,CAAC;AAChB,CAAC;AAED,SAAS,cAAc,CAAC,WAAwC;IAC5D,OAAO;QACH,QAAQ,EAAE,WAAW,CAAC,QAAQ,CAAC,QAAQ,EAAE;QACzC,SAAS,EAAE,WAAW,CAAC,SAAS,CAAC,QAAQ,EAAE;QAC3C,KAAK,EAAE,WAAW,CAAC,KAAK,CAAC,QAAQ,EAAE;QACnC,MAAM,EAAE,WAAW,CAAC,MAAM,CAAC,QAAQ,EAAE;QACrC,SAAS,EAAE,WAAW,CAAC,SAAS,CAAC,QAAQ,EAAE;QAC3C,MAAM,EAAE,WAAW,CAAC,MAAM,CAAC,QAAQ,EAAE;QACrC,SAAS,EAAE,WAAW,CAAC,SAAS,CAAC,QAAQ,EAAE;KAC9C,CAAC;AACN,CAAC;AAED,oDAAoD;AACpD,SAAS,oBAAoB,CAAC,KAAa;IACvC,OAAO,KAAK,CAAC;AACjB,CAAC","sourcesContent":["import { createStandaloneEditorCorePlugins } from '../corePlugin/createStandaloneEditorCorePlugins';\nimport { createStandaloneEditorDefaultSettings } from './createStandaloneEditorDefaultSettings';\nimport { DarkColorHandlerImpl } from './DarkColorHandlerImpl';\nimport { standaloneCoreApiMap } from './standaloneCoreApiMap';\nimport type { EditorPlugin } from 'roosterjs-editor-types';\nimport type {\n EditorEnvironment,\n StandaloneEditorCore,\n StandaloneEditorCorePluginState,\n StandaloneEditorCorePlugins,\n StandaloneEditorOptions,\n UnportedCoreApiMap,\n UnportedCorePluginState,\n} from 'roosterjs-content-model-types';\n\n/*\n A temporary function to create Standalone Editor core\n * @param contentDiv Editor content DIV\n * @param options Editor options\n /\nexport function createStandaloneEditorCore(\n contentDiv: HTMLDivElement,\n options: StandaloneEditorOptions,\n unportedCoreApiMap: UnportedCoreApiMap,\n unportedCorePluginState: UnportedCorePluginState,\n tempPlugins: EditorPlugin[]\n): StandaloneEditorCore {\n const corePlugins = createStandaloneEditorCorePlugins(options, contentDiv);\n\n return {\n contentDiv,\n api: { ...standaloneCoreApiMap, ...unportedCoreApiMap, ...options.coreApiOverride },\n originalApi: { ...standaloneCoreApiMap, ...unportedCoreApiMap },\n plugins: [\n corePlugins.cache,\n corePlugins.format,\n corePlugins.copyPaste,\n corePlugins.domEvent,\n corePlugins.selection,\n corePlugins.entity,\n ...tempPlugins,\n corePlugins.lifecycle,\n ],\n environment: createEditorEnvironment(),\n darkColorHandler: new DarkColorHandlerImpl(\n contentDiv,\n options.getDarkColor ?? getDarkColorFallback\n ),\n trustedHTMLHandler: options.trustedHTMLHandler \|\| defaultTrustHtmlHandler,\n ...createStandaloneEditorDefaultSettings(options),\n ...getPluginState(corePlugins),\n ...unportedCorePluginState,\n };\n}\n\nfunction createEditorEnvironment(): EditorEnvironment {\n // It is ok to use global window here since the environment should always be the same for all windows in one session\n const userAgent = window.navigator.userAgent;\n\n return {\n isMac: window.navigator.appVersion.indexOf('Mac') != -1,\n isAndroid: /android/i.test(userAgent),\n isSafari:\n userAgent.indexOf('Safari') >= 0 &&\n userAgent.indexOf('Chrome') < 0 &&\n userAgent.indexOf('Android') < 0,\n };\n}\n\n/\n @internal export for test only\n */\nexport function defaultTrustHtmlHandler(html: string) {\n return html;\n}\n\nfunction getPluginState(corePlugins: StandaloneEditorCorePlugins): StandaloneEditorCorePluginState {\n return {\n domEvent: corePlugins.domEvent.getState(),\n copyPaste: corePlugins.copyPaste.getState(),\n cache: corePlugins.cache.getState(),\n format: corePlugins.format.getState(),\n lifecycle: corePlugins.lifecycle.getState(),\n entity: corePlugins.entity.getState(),\n selection: corePlugins.selection.getState(),\n };\n}\n\n// A fallback function, always return original color\nfunction getDarkColorFallback(color: string) {\n return color;\n}\n"]}

package/package.json CHANGED Viewed

@@ -3,13 +3,12 @@
     "description": "Content Model for roosterjs (Under development)",
     "dependencies": {
         "tslib": "^2.3.1",
-        "color": "^3.0.0",
         "roosterjs-editor-types": "^8.59.0",
         "roosterjs-editor-dom": "^8.59.0",
-        "roosterjs-content-model-dom": "^0.21.0",
-        "roosterjs-content-model-types": "^0.21.0"
+        "roosterjs-content-model-dom": "^0.21.1",
+        "roosterjs-content-model-types": "^0.21.1"
     },
-    "version": "0.21.0",
+    "version": "0.21.1",
     "main": "./lib/index.js",
     "typings": "./lib/index.d.ts",
     "module": "./lib-mjs/index.js",