@excalidraw/common 0.18.0-54a9826 → 0.18.0-60b2758

package/dist/dev/index.js

@@ -1562,7 +1562,7 @@ var normalizeInputColor = (color) => {
   }
   const tc = tinycolor(color);
   if (tc.isValid()) {
-    if (tc.getFormat() === "hex" && !color.startsWith("#")) {
+    if (["hex", "hex8"].includes(tc.getFormat()) && !color.startsWith("#")) {
       return `#${color}`;
     }
     return color;
@@ -1659,7 +1659,8 @@ var CLASSES = {
   SEARCH_MENU_INPUT_WRAPPER: "layer-ui__search-inputWrapper",
   CONVERT_ELEMENT_TYPE_POPUP: "ConvertElementTypePopup",
   SHAPE_ACTIONS_THEME_SCOPE: "shape-actions-theme-scope",
-  FRAME_NAME: "frame-name"
+  FRAME_NAME: "frame-name",
+  DROPDOWN_MENU_EVENT_WRAPPER: "dropdown-menu-event-wrapper"
 };
 var FONT_SIZES = {
   sm: 16,
@@ -3158,6 +3159,9 @@ var setFeatureFlag = (flag, value) => {
     console.error("unable to set feature flag", e);
   }
 };
+var oneOf = (needle, haystack) => {
+  return haystack.includes(needle);
+};
 
 // src/random.ts
 var random = new Random(Date.now());
@@ -3231,6 +3235,173 @@ var Emitter = class {
     this.subscribers = [];
   }
 };
+
+// debug.ts
+init_define_import_meta_env();
+var lessPrecise = (num, precision = 5) => parseFloat(num.toPrecision(precision));
+var getAvgFrameTime = (times) => lessPrecise(times.reduce((a, b) => a + b) / times.length);
+var Debug = class _Debug {
+  static DEBUG_LOG_TIMES = true;
+  static TIMES_AGGR = {};
+  static TIMES_AVG = {};
+  static LAST_DEBUG_LOG_CALL = 0;
+  static DEBUG_LOG_INTERVAL_ID = null;
+  static LAST_FRAME_TIMESTAMP = 0;
+  static FRAME_COUNT = 0;
+  static ANIMATION_FRAME_ID = null;
+  static scheduleAnimationFrame = () => {
+    if (_Debug.DEBUG_LOG_INTERVAL_ID !== null) {
+      _Debug.ANIMATION_FRAME_ID = requestAnimationFrame((timestamp) => {
+        if (_Debug.LAST_FRAME_TIMESTAMP !== timestamp) {
+          _Debug.LAST_FRAME_TIMESTAMP = timestamp;
+          _Debug.FRAME_COUNT++;
+        }
+        if (_Debug.DEBUG_LOG_INTERVAL_ID !== null) {
+          _Debug.scheduleAnimationFrame();
+        }
+      });
+    }
+  };
+  static setupInterval = () => {
+    if (_Debug.DEBUG_LOG_INTERVAL_ID === null) {
+      console.info("%c(starting perf recording)", "color: lime");
+      _Debug.DEBUG_LOG_INTERVAL_ID = window.setInterval(_Debug.debugLogger, 1e3);
+      _Debug.scheduleAnimationFrame();
+    }
+    _Debug.LAST_DEBUG_LOG_CALL = Date.now();
+  };
+  static debugLogger = () => {
+    if (_Debug.DEBUG_LOG_TIMES) {
+      for (const [name, { t, times }] of Object.entries(_Debug.TIMES_AGGR)) {
+        if (times.length) {
+          console.info(
+            name,
+            lessPrecise(times.reduce((a, b) => a + b)),
+            times.sort((a, b) => a - b).map((x) => lessPrecise(x))
+          );
+          _Debug.TIMES_AGGR[name] = { t, times: [] };
+        }
+      }
+      for (const [name, { t, times, avg }] of Object.entries(_Debug.TIMES_AVG)) {
+        if (times.length) {
+          const totalTime = times.reduce((a, b) => a + b);
+          const avgFrameTime = lessPrecise(totalTime / _Debug.FRAME_COUNT);
+          console.info(
+            name,
+            `- ${times.length} calls - ${avgFrameTime}ms/frame across ${_Debug.FRAME_COUNT} frames (${lessPrecise(
+              avgFrameTime / 16.67 * 100,
+              1
+            )}% of frame budget)`
+          );
+          _Debug.TIMES_AVG[name] = {
+            t,
+            times: [],
+            avg: avg != null ? getAvgFrameTime([avg, avgFrameTime]) : avgFrameTime
+          };
+        }
+      }
+    }
+    _Debug.FRAME_COUNT = 0;
+    if (Date.now() - _Debug.LAST_DEBUG_LOG_CALL > 600 && _Debug.DEBUG_LOG_INTERVAL_ID !== null) {
+      console.info("%c(stopping perf recording)", "color: red");
+      window.clearInterval(_Debug.DEBUG_LOG_INTERVAL_ID);
+      window.cancelAnimationFrame(_Debug.ANIMATION_FRAME_ID);
+      _Debug.ANIMATION_FRAME_ID = null;
+      _Debug.FRAME_COUNT = 0;
+      _Debug.LAST_FRAME_TIMESTAMP = 0;
+      _Debug.DEBUG_LOG_INTERVAL_ID = null;
+      _Debug.TIMES_AGGR = {};
+      _Debug.TIMES_AVG = {};
+    }
+  };
+  static logTime = (time, name = "default") => {
+    _Debug.setupInterval();
+    const now = performance.now();
+    const { t, times } = _Debug.TIMES_AGGR[name] = _Debug.TIMES_AGGR[name] || {
+      t: 0,
+      times: []
+    };
+    if (t) {
+      times.push(time != null ? time : now - t);
+    }
+    _Debug.TIMES_AGGR[name].t = now;
+  };
+  static logTimeAverage = (time, name = "default") => {
+    _Debug.setupInterval();
+    const now = performance.now();
+    const { t, times } = _Debug.TIMES_AVG[name] = _Debug.TIMES_AVG[name] || {
+      t: 0,
+      times: []
+    };
+    if (t) {
+      times.push(time != null ? time : now - t);
+    }
+    _Debug.TIMES_AVG[name].t = now;
+  };
+  static logWrapper = (type) => (fn, name = "default") => {
+    return (...args) => {
+      const t0 = performance.now();
+      const ret = fn(...args);
+      _Debug[type](performance.now() - t0, name);
+      return ret;
+    };
+  };
+  static logTimeWrap = _Debug.logWrapper("logTime");
+  static logTimeAverageWrap = _Debug.logWrapper("logTimeAverage");
+  static perfWrap = (fn, name = "default") => {
+    return (...args) => {
+      console.time(name);
+      const ret = fn(...args);
+      console.timeEnd(name);
+      return ret;
+    };
+  };
+  static CHANGED_CACHE = {};
+  static logChanged(name, obj) {
+    const prev = _Debug.CHANGED_CACHE[name];
+    _Debug.CHANGED_CACHE[name] = obj;
+    if (!prev) {
+      return;
+    }
+    const allKeys = /* @__PURE__ */ new Set([...Object.keys(prev), ...Object.keys(obj)]);
+    const changed = {};
+    for (const key of allKeys) {
+      const prevVal = prev[key];
+      const nextVal = obj[key];
+      if (!deepEqual(prevVal, nextVal)) {
+        changed[key] = { prev: prevVal, next: nextVal };
+      }
+    }
+    if (Object.keys(changed).length > 0) {
+      console.info(`[${name}] changed:`, changed);
+    }
+  }
+};
+function deepEqual(a, b) {
+  if (Object.is(a, b)) {
+    return true;
+  }
+  if (a === null || b === null || typeof a !== "object" || typeof b !== "object") {
+    return false;
+  }
+  if (Array.isArray(a) !== Array.isArray(b)) {
+    return false;
+  }
+  const keysA = Object.keys(a);
+  const keysB = Object.keys(b);
+  if (keysA.length !== keysB.length) {
+    return false;
+  }
+  for (const key of keysA) {
+    if (!deepEqual(
+      a[key],
+      b[key]
+    )) {
+      return false;
+    }
+  }
+  return true;
+}
 export {
   ACTIVE_THRESHOLD,
   ALLOWED_PASTE_MIME_TYPES,
@@ -3283,6 +3454,7 @@ export {
   DEFAULT_VERTICAL_ALIGN,
   DOUBLE_TAP_POSITION_THRESHOLD,
   DRAGGING_THRESHOLD,
+  Debug,
   EDITOR_LS_KEYS,
   ELEMENT_LINK_KEY,
   ELEMENT_READY_TO_ERASE_OPACITY,
@@ -3455,6 +3627,7 @@ export {
   normalizeEOL,
   normalizeInputColor,
   normalizeLink,
+  oneOf,
   preventUnload,
   promiseTry,
   queryFocusableElements,