@contember/react-utils 1.2.7 → 1.3.0-alpha.11

package/dist/development/hooks/useOnWindowResize.cjs

@@ -0,0 +1,36 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const react = require("react");
+const Context = require("../debug-context/Context.cjs");
+function useOnWindowResize(callback, interval = 300) {
+  const scopedConsoleRef = Context.useScopedConsoleRef("useOnWindowResize");
+  const callbackRef = react.useRef(callback);
+  callbackRef.current = callback;
+  const lastTimeStamp = react.useRef(0);
+  react.useLayoutEffect(() => {
+    let timeoutID = void 0;
+    function debouncedHandler(event) {
+      clearTimeout(timeoutID);
+      const delta = event.timeStamp - lastTimeStamp.current;
+      scopedConsoleRef.current.logged("window.resize:delta", delta);
+      if (delta > interval) {
+        scopedConsoleRef.current.warned("event:window.resize:immediately", null);
+        callbackRef.current(event);
+        lastTimeStamp.current = event.timeStamp;
+      } else {
+        timeoutID = setTimeout(() => {
+          scopedConsoleRef.current.warned("event:window.resize:debounced", null);
+          lastTimeStamp.current = event.timeStamp;
+          callbackRef.current(event);
+        }, interval);
+      }
+    }
+    window.addEventListener("resize", debouncedHandler);
+    return () => {
+      clearTimeout(timeoutID);
+      window.removeEventListener("resize", debouncedHandler);
+    };
+  }, [callbackRef, interval, scopedConsoleRef]);
+}
+exports.useOnWindowResize = useOnWindowResize;
+//# sourceMappingURL=useOnWindowResize.cjs.map

package/dist/development/hooks/useOnWindowResize.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useOnWindowResize.cjs","sources":["../../../src/hooks/useOnWindowResize.ts"],"sourcesContent":["import { useLayoutEffect, useRef } from 'react'\nimport { useScopedConsoleRef } from '../debug-context'\n\nexport function useOnWindowResize(\n\tcallback: (event: Event) => void,\n\tinterval: number = 300,\n) {\n\tconst scopedConsoleRef = useScopedConsoleRef('useOnWindowResize')\n\n\tconst callbackRef = useRef(callback); callbackRef.current = callback\n\tconst lastTimeStamp = useRef<number>(0)\n\n\tuseLayoutEffect(() => {\n\t\tlet timeoutID: number | undefined = undefined\n\n\t\tfunction debouncedHandler(event: Event) {\n\t\t\tclearTimeout(timeoutID)\n\n\t\t\tconst delta = event.timeStamp - lastTimeStamp.current\n\t\t\tscopedConsoleRef.current.logged('window.resize:delta', delta)\n\n\t\t\tif (delta > interval) {\n\t\t\t\tscopedConsoleRef.current.warned('event:window.resize:immediately', null)\n\t\t\t\tcallbackRef.current(event)\n\t\t\t\tlastTimeStamp.current = event.timeStamp\n\t\t\t} else {\n\t\t\t\ttimeoutID = setTimeout(() => {\n\t\t\t\t\tscopedConsoleRef.current.warned('event:window.resize:debounced', null)\n\t\t\t\t\tlastTimeStamp.current = event.timeStamp\n\t\t\t\t\tcallbackRef.current(event)\n\t\t\t\t}, interval)\n\t\t\t}\n\t\t}\n\n\t\twindow.addEventListener('resize', debouncedHandler)\n\n\t\treturn () => {\n\t\t\tclearTimeout(timeoutID)\n\t\t\twindow.removeEventListener('resize', debouncedHandler)\n\t\t}\n\t}, [callbackRef, interval, scopedConsoleRef])\n}\n"],"names":["useScopedConsoleRef","useRef","useLayoutEffect"],"mappings":";;;;AAGgB,SAAA,kBACf,UACA,WAAmB,KAClB;AACK,QAAA,mBAAmBA,4BAAoB,mBAAmB;AAE1D,QAAA,cAAcC,aAAO,QAAQ;AAAG,cAAY,UAAU;AACtD,QAAA,gBAAgBA,aAAe,CAAC;AAEtCC,QAAAA,gBAAgB,MAAM;AACrB,QAAI,YAAgC;AAEpC,aAAS,iBAAiB,OAAc;AACvC,mBAAa,SAAS;AAEhB,YAAA,QAAQ,MAAM,YAAY,cAAc;AAC7B,uBAAA,QAAQ,OAAO,uBAAuB,KAAK;AAE5D,UAAI,QAAQ,UAAU;AACJ,yBAAA,QAAQ,OAAO,mCAAmC,IAAI;AACvE,oBAAY,QAAQ,KAAK;AACzB,sBAAc,UAAU,MAAM;AAAA,MAAA,OACxB;AACN,oBAAY,WAAW,MAAM;AACX,2BAAA,QAAQ,OAAO,iCAAiC,IAAI;AACrE,wBAAc,UAAU,MAAM;AAC9B,sBAAY,QAAQ,KAAK;AAAA,WACvB,QAAQ;AAAA,MACZ;AAAA,IACD;AAEO,WAAA,iBAAiB,UAAU,gBAAgB;AAElD,WAAO,MAAM;AACZ,mBAAa,SAAS;AACf,aAAA,oBAAoB,UAAU,gBAAgB;AAAA,IAAA;AAAA,EAEpD,GAAA,CAAC,aAAa,UAAU,gBAAgB,CAAC;AAC7C;;"}

package/dist/development/hooks/usePreviousValue.cjs

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const react = require("react");
+const usePreviousValue = (value) => {
+  const ref = react.useRef(value);
+  react.useEffect(() => {
+    ref.current = value;
+  });
+  return ref.current;
+};
+exports.usePreviousValue = usePreviousValue;
+//# sourceMappingURL=usePreviousValue.cjs.map

package/dist/development/hooks/usePreviousValue.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePreviousValue.cjs","sources":["../../../src/hooks/usePreviousValue.ts"],"sourcesContent":["import { useEffect, useRef } from 'react'\n\nexport const usePreviousValue = <Value>(value: Value) => {\n\tconst ref = useRef<Value>(value)\n\tuseEffect(() => {\n\t\tref.current = value\n\t})\n\treturn ref.current\n}\n"],"names":["useRef","useEffect"],"mappings":";;;AAEa,MAAA,mBAAmB,CAAQ,UAAiB;AAClD,QAAA,MAAMA,aAAc,KAAK;AAC/BC,QAAAA,UAAU,MAAM;AACf,QAAI,UAAU;AAAA,EAAA,CACd;AACD,SAAO,IAAI;AACZ;;"}

package/dist/development/hooks/useScrollOffsets.cjs

@@ -0,0 +1,67 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const utilities = require("@contember/utilities");
+const react = require("react");
+const unwrapRefValue = require("./unwrapRefValue.cjs");
+const useOnScrollWithin = require("./useOnScrollWithin.cjs");
+const useOnWindowResize = require("./useOnWindowResize.cjs");
+const Context = require("../debug-context/Context.cjs");
+const useReferentiallyStableCallback = require("../referentiallyStable/useReferentiallyStableCallback.cjs");
+function useScrollOffsets(refOrElement, interval = 1e3 / 60) {
+  const { logged } = Context.useScopedConsoleRef("useScrollOffsets").current;
+  const [top, setTop] = react.useState(0);
+  const [bottom, setBottom] = react.useState(0);
+  const [left, setLeft] = react.useState(0);
+  const [right, setRight] = react.useState(0);
+  const updateScrollOffsetsState = useReferentiallyStableCallback.useReferentiallyStableCallback((offsets) => {
+    logged("Update the offsets:", {
+      previous: { bottom, left, right, top },
+      next: offsets
+    });
+    if (offsets.bottom !== bottom)
+      setBottom(offsets.bottom);
+    if (offsets.left !== left)
+      setLeft(offsets.left);
+    if (offsets.right !== right)
+      setRight(offsets.right);
+    if (offsets.top !== top)
+      setTop(offsets.top);
+  });
+  const handler = useReferentiallyStableCallback.useReferentiallyStableCallback(() => {
+    const maybeScrollContent = unwrapRefValue.unwrapRefValue(refOrElement) ?? document;
+    if (maybeScrollContent) {
+      getElementScrollOffsets(maybeScrollContent).then(updateScrollOffsetsState);
+    }
+  });
+  useOnScrollWithin.useOnScrollWithin(refOrElement, handler, interval);
+  useOnWindowResize.useOnWindowResize(handler);
+  react.useLayoutEffect(handler, [handler]);
+  return react.useMemo(() => ({ bottom, left, right, top }), [bottom, left, right, top]);
+}
+function isIntrinsicScrollElement(element) {
+  return element instanceof HTMLBodyElement || element instanceof HTMLHtmlElement || element instanceof DocumentType || element instanceof Document || element instanceof HTMLDocument;
+}
+function getIntrinsicScrollContainer(element) {
+  const html = document.body.parentElement;
+  utilities.assert("HTML element exists", html, (value) => value instanceof HTMLElement);
+  if (isIntrinsicScrollElement(element)) {
+    return html;
+  } else {
+    return element;
+  }
+}
+async function getElementScrollOffsets(element) {
+  const isIntrinsicScrolling = isIntrinsicScrollElement(element);
+  const scrollContainer = getIntrinsicScrollContainer(element);
+  const { scrollLeft, scrollTop, scrollHeight, scrollWidth } = scrollContainer;
+  const { height: scrollContainerHeight, width: scrollContainerWidth } = await utilities.getElementDimensions(scrollContainer);
+  const height = isIntrinsicScrolling ? window.innerHeight : scrollContainerHeight;
+  const width = isIntrinsicScrolling ? window.innerWidth : scrollContainerWidth;
+  const left = Math.round(scrollLeft);
+  const top = Math.round(scrollTop);
+  const right = Math.round(scrollWidth - width - left);
+  const bottom = Math.round(scrollHeight - height - top);
+  return { bottom, left, right, top };
+}
+exports.useScrollOffsets = useScrollOffsets;
+//# sourceMappingURL=useScrollOffsets.cjs.map

package/dist/development/hooks/useScrollOffsets.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useScrollOffsets.cjs","sources":["../../../src/hooks/useScrollOffsets.ts"],"sourcesContent":["import { assert, getElementDimensions } from '@contember/utilities'\nimport { useLayoutEffect, useMemo, useState } from 'react'\nimport { useScopedConsoleRef } from '../debug-context'\nimport { useReferentiallyStableCallback } from '../referentiallyStable'\nimport { RefObjectOrElement, unwrapRefValue } from './unwrapRefValue'\nimport { useOnScrollWithin } from './useOnScrollWithin'\nimport { useOnWindowResize } from './useOnWindowResize'\n\nexport type Offsets = {\n\tbottom: number;\n\tleft: number;\n\tright: number;\n\ttop: number;\n}\n\nexport function useScrollOffsets(refOrElement: RefObjectOrElement<HTMLElement | null> | null, interval: number = 1000 / 60) {\n\tconst { logged } = useScopedConsoleRef('useScrollOffsets').current\n\n\tconst [top, setTop] = useState(0)\n\tconst [bottom, setBottom] = useState(0)\n\tconst [left, setLeft] = useState(0)\n\tconst [right, setRight] = useState(0)\n\n\tconst updateScrollOffsetsState = useReferentiallyStableCallback((offsets: Offsets) => {\n\t\tlogged('Update the offsets:', {\n\t\t\tprevious: { bottom, left, right, top },\n\t\t\tnext: offsets,\n\t\t})\n\n\t\tif (offsets.bottom !== bottom) setBottom(offsets.bottom)\n\t\tif (offsets.left !== left) setLeft(offsets.left)\n\t\tif (offsets.right !== right) setRight(offsets.right)\n\t\tif (offsets.top !== top) setTop(offsets.top)\n\t})\n\n\tconst handler = useReferentiallyStableCallback(() => {\n\t\tconst maybeScrollContent = unwrapRefValue(refOrElement) ?? document\n\n\t\tif (maybeScrollContent) {\n\t\t\tgetElementScrollOffsets(maybeScrollContent).then(updateScrollOffsetsState)\n\t\t}\n\t})\n\n\tuseOnScrollWithin(refOrElement, handler, interval)\n\tuseOnWindowResize(handler)\n\tuseLayoutEffect(handler, [handler])\n\n\treturn useMemo(() => ({ bottom, left, right, top }), [bottom, left, right, top])\n}\n\nfunction isIntrinsicScrollElement(element: unknown): element is Document {\n\treturn element instanceof HTMLBodyElement\n\t\t|| element instanceof HTMLHtmlElement\n\t\t|| element instanceof DocumentType\n\t\t|| element instanceof Document\n\t\t|| element instanceof HTMLDocument\n}\n\nfunction getIntrinsicScrollContainer(element: HTMLElement | Document): HTMLElement {\n\tconst html = document.body.parentElement\n\tassert('HTML element exists', html, (value): value is HTMLElement => value instanceof HTMLElement)\n\n\tif (isIntrinsicScrollElement(element)) {\n\t\treturn html\n\t} else {\n\t\treturn element\n\t}\n}\n\nasync function getElementScrollOffsets(element: HTMLElement | Document): Promise<Offsets> {\n\tconst isIntrinsicScrolling = isIntrinsicScrollElement(element)\n\tconst scrollContainer = getIntrinsicScrollContainer(element)\n\n\tconst { scrollLeft, scrollTop, scrollHeight, scrollWidth } = scrollContainer\n\tconst { height: scrollContainerHeight, width: scrollContainerWidth } = await getElementDimensions(scrollContainer)\n\n\tconst height = isIntrinsicScrolling ? window.innerHeight : scrollContainerHeight\n\tconst width = isIntrinsicScrolling ? window.innerWidth : scrollContainerWidth\n\n\tconst left = Math.round(scrollLeft)\n\tconst top = Math.round(scrollTop)\n\n\tconst right = Math.round(scrollWidth - width - left)\n\tconst bottom = Math.round(scrollHeight - height - top)\n\n\treturn { bottom, left, right, top }\n}\n"],"names":["useScopedConsoleRef","useState","useReferentiallyStableCallback","unwrapRefValue","useOnScrollWithin","useOnWindowResize","useLayoutEffect","useMemo","assert","getElementDimensions"],"mappings":";;;;;;;;;AAeO,SAAS,iBAAiB,cAA6D,WAAmB,MAAO,IAAI;AAC3H,QAAM,EAAE,OAAW,IAAAA,QAAA,oBAAoB,kBAAkB,EAAE;AAE3D,QAAM,CAAC,KAAK,MAAM,IAAIC,eAAS,CAAC;AAChC,QAAM,CAAC,QAAQ,SAAS,IAAIA,eAAS,CAAC;AACtC,QAAM,CAAC,MAAM,OAAO,IAAIA,eAAS,CAAC;AAClC,QAAM,CAAC,OAAO,QAAQ,IAAIA,eAAS,CAAC;AAE9B,QAAA,2BAA2BC,8DAA+B,CAAC,YAAqB;AACrF,WAAO,uBAAuB;AAAA,MAC7B,UAAU,EAAE,QAAQ,MAAM,OAAO,IAAI;AAAA,MACrC,MAAM;AAAA,IAAA,CACN;AAED,QAAI,QAAQ,WAAW;AAAQ,gBAAU,QAAQ,MAAM;AACvD,QAAI,QAAQ,SAAS;AAAM,cAAQ,QAAQ,IAAI;AAC/C,QAAI,QAAQ,UAAU;AAAO,eAAS,QAAQ,KAAK;AACnD,QAAI,QAAQ,QAAQ;AAAK,aAAO,QAAQ,GAAG;AAAA,EAAA,CAC3C;AAEK,QAAA,UAAUA,+BAAAA,+BAA+B,MAAM;AAC9C,UAAA,qBAAqBC,eAAAA,eAAe,YAAY,KAAK;AAE3D,QAAI,oBAAoB;AACC,8BAAA,kBAAkB,EAAE,KAAK,wBAAwB;AAAA,IAC1E;AAAA,EAAA,CACA;AAEiBC,oBAAAA,kBAAA,cAAc,SAAS,QAAQ;AACjDC,oBAAA,kBAAkB,OAAO;AACTC,QAAAA,gBAAA,SAAS,CAAC,OAAO,CAAC;AAElC,SAAOC,MAAQ,QAAA,OAAO,EAAE,QAAQ,MAAM,OAAO,QAAQ,CAAC,QAAQ,MAAM,OAAO,GAAG,CAAC;AAChF;AAEA,SAAS,yBAAyB,SAAuC;AACjE,SAAA,mBAAmB,mBACtB,mBAAmB,mBACnB,mBAAmB,gBACnB,mBAAmB,YACnB,mBAAmB;AACxB;AAEA,SAAS,4BAA4B,SAA8C;AAC5E,QAAA,OAAO,SAAS,KAAK;AAC3BC,YAAA,OAAO,uBAAuB,MAAM,CAAC,UAAgC,iBAAiB,WAAW;AAE7F,MAAA,yBAAyB,OAAO,GAAG;AAC/B,WAAA;AAAA,EAAA,OACD;AACC,WAAA;AAAA,EACR;AACD;AAEA,eAAe,wBAAwB,SAAmD;AACnF,QAAA,uBAAuB,yBAAyB,OAAO;AACvD,QAAA,kBAAkB,4BAA4B,OAAO;AAE3D,QAAM,EAAE,YAAY,WAAW,cAAc,gBAAgB;AACvD,QAAA,EAAE,QAAQ,uBAAuB,OAAO,yBAAyB,MAAMC,UAAAA,qBAAqB,eAAe;AAE3G,QAAA,SAAS,uBAAuB,OAAO,cAAc;AACrD,QAAA,QAAQ,uBAAuB,OAAO,aAAa;AAEnD,QAAA,OAAO,KAAK,MAAM,UAAU;AAC5B,QAAA,MAAM,KAAK,MAAM,SAAS;AAEhC,QAAM,QAAQ,KAAK,MAAM,cAAc,QAAQ,IAAI;AACnD,QAAM,SAAS,KAAK,MAAM,eAAe,SAAS,GAAG;AAErD,SAAO,EAAE,QAAQ,MAAM,OAAO,IAAI;AACnC;;"}

package/dist/development/hooks/useStoredState.cjs

@@ -0,0 +1,23 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const react = require("react");
+const createStoredStateHook = (getStorage) => {
+  return (key, initializeValue) => {
+    const storage = getStorage();
+    const [value, setValue] = react.useState(() => {
+      const value2 = storage.getItem(key);
+      const parsedValue = value2 !== null ? JSON.parse(value2) : void 0;
+      return initializeValue(parsedValue);
+    });
+    return [value, react.useCallback((value2) => {
+      setValue((current) => {
+        const newValue = typeof value2 === "function" ? value2(current) : value2;
+        storage.setItem(key, JSON.stringify(newValue));
+        return newValue;
+      });
+    }, [key, storage])];
+  };
+};
+const useSessionStorageState = createStoredStateHook(() => sessionStorage);
+exports.useSessionStorageState = useSessionStorageState;
+//# sourceMappingURL=useStoredState.cjs.map

package/dist/development/hooks/useStoredState.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useStoredState.cjs","sources":["../../../src/hooks/useStoredState.ts"],"sourcesContent":["import { useCallback, useState } from 'react'\nimport { Serializable } from '../types'\n\nexport type SetState<V extends Serializable> = (value: V | ((current: V) => V)) => void;\nexport type ValueInitializer<V extends Serializable> = (storedValue: V | undefined) => V;\n\nconst createStoredStateHook = (getStorage: () => Storage) => {\n\treturn <V extends Serializable>(key: string, initializeValue: ValueInitializer<V>): [V, SetState<V>] => {\n\t\tconst storage = getStorage()\n\t\tconst [value, setValue] = useState<V>(() => {\n\t\t\tconst value = storage.getItem(key)\n\t\t\tconst parsedValue: V | undefined = value !== null ? JSON.parse(value) : undefined\n\t\t\treturn initializeValue(parsedValue)\n\t\t})\n\t\treturn [value, useCallback(value => {\n\t\t\tsetValue(current => {\n\t\t\t\tconst newValue = typeof value === 'function' ? (value as (current: V) => V)(current) : value\n\t\t\t\tstorage.setItem(key, JSON.stringify(newValue))\n\t\t\t\treturn newValue\n\t\t\t})\n\t\t}, [key, storage])]\n\t}\n\n}\n\nexport const useSessionStorageState = createStoredStateHook(() => sessionStorage)\n"],"names":["useState","value","useCallback"],"mappings":";;;AAMA,MAAM,wBAAwB,CAAC,eAA8B;AACrD,SAAA,CAAyB,KAAa,oBAA2D;AACvG,UAAM,UAAU;AAChB,UAAM,CAAC,OAAO,QAAQ,IAAIA,eAAY,MAAM;AACrCC,YAAAA,SAAQ,QAAQ,QAAQ,GAAG;AACjC,YAAM,cAA6BA,WAAU,OAAO,KAAK,MAAMA,MAAK,IAAI;AACxE,aAAO,gBAAgB,WAAW;AAAA,IAAA,CAClC;AACD,WAAO,CAAC,OAAOC,kBAAY,CAAAD,WAAS;AACnC,eAAS,CAAW,YAAA;AACnB,cAAM,WAAW,OAAOA,WAAU,aAAcA,OAA4B,OAAO,IAAIA;AACvF,gBAAQ,QAAQ,KAAK,KAAK,UAAU,QAAQ,CAAC;AACtC,eAAA;AAAA,MAAA,CACP;AAAA,IACC,GAAA,CAAC,KAAK,OAAO,CAAC,CAAC;AAAA,EAAA;AAGpB;AAEa,MAAA,yBAAyB,sBAAsB,MAAM,cAAc;;"}

package/dist/development/hooks/useUpdatedRef.cjs

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const react = require("react");
+function useUpdatedRef(value) {
+  const ref = react.useRef(value);
+  ref.current = value;
+  return ref;
+}
+exports.useUpdatedRef = useUpdatedRef;
+//# sourceMappingURL=useUpdatedRef.cjs.map

package/dist/development/hooks/useUpdatedRef.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useUpdatedRef.cjs","sources":["../../../src/hooks/useUpdatedRef.ts"],"sourcesContent":["import { useRef } from 'react'\n\n/**\n * Returns a stable mutable object with value that is updated upon each call\n *\n * @param value - Value that could update after initial call\n * @returns Mutable ref object with updated value\n */\nexport function useUpdatedRef<T>(value: T) {\n\tconst ref = useRef(value)\n\tref.current = value\n\n\treturn ref\n}\n"],"names":["useRef"],"mappings":";;;AAQO,SAAS,cAAiB,OAAU;AACpC,QAAA,MAAMA,aAAO,KAAK;AACxB,MAAI,UAAU;AAEP,SAAA;AACR;;"}

package/dist/development/hooks/useWindowSize.cjs

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const react = require("react");
+const useOnWindowResize = require("./useOnWindowResize.cjs");
+function useWindowSize() {
+  const [width, setWidth] = react.useState(window.innerWidth);
+  const [height, setHeight] = react.useState(window.innerHeight);
+  useOnWindowResize.useOnWindowResize(() => {
+    const { innerHeight, innerWidth } = window;
+    if (innerHeight !== height) {
+      setHeight(innerHeight);
+    }
+    if (innerWidth !== width) {
+      setWidth(innerWidth);
+    }
+  });
+  return react.useMemo(() => ({ height, width }), [height, width]);
+}
+exports.useWindowSize = useWindowSize;
+//# sourceMappingURL=useWindowSize.cjs.map

package/dist/development/hooks/useWindowSize.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useWindowSize.cjs","sources":["../../../src/hooks/useWindowSize.ts"],"sourcesContent":["import { useMemo, useState } from 'react'\nimport { useOnWindowResize } from './useOnWindowResize'\n\nexport function useWindowSize() {\n  const [width, setWidth] = useState(window.innerWidth)\n  const [height, setHeight] = useState(window.innerHeight)\n\n  useOnWindowResize(() => {\n    const { innerHeight, innerWidth } = window\n    if (innerHeight !== height) {\n      setHeight(innerHeight)\n    }\n\n    if (innerWidth !== width) {\n      setWidth(innerWidth)\n    }\n  })\n\n  return useMemo(() => ({ height, width }), [height, width])\n}\n"],"names":["useState","useOnWindowResize","useMemo"],"mappings":";;;;AAGO,SAAS,gBAAgB;AAC9B,QAAM,CAAC,OAAO,QAAQ,IAAIA,MAAAA,SAAS,OAAO,UAAU;AACpD,QAAM,CAAC,QAAQ,SAAS,IAAIA,MAAAA,SAAS,OAAO,WAAW;AAEvDC,oBAAAA,kBAAkB,MAAM;AAChB,UAAA,EAAE,aAAa,WAAe,IAAA;AACpC,QAAI,gBAAgB,QAAQ;AAC1B,gBAAU,WAAW;AAAA,IACvB;AAEA,QAAI,eAAe,OAAO;AACxB,eAAS,UAAU;AAAA,IACrB;AAAA,EAAA,CACD;AAEM,SAAAC,MAAA,QAAQ,OAAO,EAAE,QAAQ,MAAU,IAAA,CAAC,QAAQ,KAAK,CAAC;AAC3D;;"}

package/dist/development/index.cjs

@@ -0,0 +1,116 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const createNonNullableContextFactory = require("./context/createNonNullableContextFactory.cjs");
+const createOptionalContextFactory = require("./context/createOptionalContextFactory.cjs");
+const Constants = require("./debug-context/Constants.cjs");
+const Context = require("./debug-context/Context.cjs");
+const unwrapRefValue = require("./hooks/unwrapRefValue.cjs");
+const useAbortController = require("./hooks/useAbortController.cjs");
+const useAddClassNameDuringResize = require("./hooks/useAddClassNameDuringResize.cjs");
+const useArrayMapMemo = require("./hooks/useArrayMapMemo.cjs");
+const useAutoHeightTextArea = require("./hooks/useAutoHeightTextArea.cjs");
+const useChildrenAsLabel = require("./hooks/useChildrenAsLabel.cjs");
+const useCloseOnClickOutside = require("./hooks/useCloseOnClickOutside.cjs");
+const useCloseOnEscape = require("./hooks/useCloseOnEscape.cjs");
+const useComposeRef = require("./hooks/useComposeRef.cjs");
+const useConstantLengthInvariant = require("./hooks/useConstantLengthInvariant.cjs");
+const useConstantValueInvariant = require("./hooks/useConstantValueInvariant.cjs");
+const useContainerWidth = require("./hooks/useContainerWidth.cjs");
+const useDebounce = require("./hooks/useDebounce.cjs");
+const useDebounceCallback = require("./hooks/useDebounceCallback.cjs");
+const useDocumentTitle = require("./hooks/useDocumentTitle.cjs");
+const useElementSize = require("./hooks/useElementSize.cjs");
+const useElementTopOffset = require("./hooks/useElementTopOffset.cjs");
+const useEventHandler = require("./hooks/useEventHandler.cjs");
+const useExpectSameValueReference = require("./hooks/useExpectSameValueReference.cjs");
+const useForceRender = require("./hooks/useForceRender.cjs");
+const useId = require("./hooks/useId.cjs");
+const useIsMounted = require("./hooks/useIsMounted.cjs");
+const useObjectMemo = require("./hooks/useObjectMemo.cjs");
+const useOnElementClickOutsideCallback = require("./hooks/useOnElementClickOutsideCallback.cjs");
+const useOnElementMouseEnterDelayedCallback = require("./hooks/useOnElementMouseEnterDelayedCallback.cjs");
+const useOnElementMutation = require("./hooks/useOnElementMutation.cjs");
+const useOnElementResize = require("./hooks/useOnElementResize.cjs");
+const useOnScrollWithin = require("./hooks/useOnScrollWithin.cjs");
+const useOnWindowResize = require("./hooks/useOnWindowResize.cjs");
+const usePreviousValue = require("./hooks/usePreviousValue.cjs");
+const useScrollOffsets = require("./hooks/useScrollOffsets.cjs");
+const useStoredState = require("./hooks/useStoredState.cjs");
+const useUpdatedRef = require("./hooks/useUpdatedRef.cjs");
+const useWindowSize = require("./hooks/useWindowSize.cjs");
+const emptyArray = require("./referentiallyStable/emptyArray.cjs");
+const emptyObject = require("./referentiallyStable/emptyObject.cjs");
+const identityFunction = require("./referentiallyStable/identityFunction.cjs");
+const noop = require("./referentiallyStable/noop.cjs");
+const returnFalse = require("./referentiallyStable/returnFalse.cjs");
+const returnTrue = require("./referentiallyStable/returnTrue.cjs");
+const useReferentiallyStableCallback = require("./referentiallyStable/useReferentiallyStableCallback.cjs");
+const ColorSchemeProvider = require("./theming/ColorSchemeProvider.cjs");
+const GlobalClassNamePrefixContext = require("./theming/GlobalClassNamePrefixContext.cjs");
+const contexts = require("./theming/contexts.cjs");
+const useClassName = require("./theming/useClassName.cjs");
+const useClassNameFactory = require("./theming/useClassNameFactory.cjs");
+const useThemedClassName = require("./theming/useThemedClassName.cjs");
+const useThemedClassNameFactory = require("./theming/useThemedClassNameFactory.cjs");
+exports.createNonNullableContextFactory = createNonNullableContextFactory.createNonNullableContextFactory;
+exports.createOptionalContextFactory = createOptionalContextFactory.createOptionalContextFactory;
+exports.isNoopScopedConsole = Constants.isNoopScopedConsole;
+exports.noopLog = Constants.noopLog;
+exports.noopLogged = Constants.noopLogged;
+exports.noopScopedConsole = Constants.noopScopedConsole;
+exports.DebugChildren = Context.DebugChildren;
+exports.ScopedConsoleContext = Context.ScopedConsoleContext;
+exports.useScopedConsoleRef = Context.useScopedConsoleRef;
+exports.unwrapRefValue = unwrapRefValue.unwrapRefValue;
+exports.useAbortController = useAbortController.useAbortController;
+exports.useAddClassNameDuringResize = useAddClassNameDuringResize.useAddClassNameDuringResize;
+exports.useArrayMapMemo = useArrayMapMemo.useArrayMapMemo;
+exports.useAutoHeightTextArea = useAutoHeightTextArea.useAutoHeightTextArea;
+exports.getChildrenAsLabel = useChildrenAsLabel.getChildrenAsLabel;
+exports.useChildrenAsLabel = useChildrenAsLabel.useChildrenAsLabel;
+exports.useCloseOnClickOutside = useCloseOnClickOutside.useCloseOnClickOutside;
+exports.useCloseOnEscape = useCloseOnEscape.useCloseOnEscape;
+exports.useComposeRef = useComposeRef.useComposeRef;
+exports.useConstantLengthInvariant = useConstantLengthInvariant.useConstantLengthInvariant;
+exports.useConstantValueInvariant = useConstantValueInvariant.useConstantValueInvariant;
+exports.ContainerWidthContext = useContainerWidth.ContainerWidthContext;
+exports.useContainerWidth = useContainerWidth.useContainerWidth;
+exports.useDebounce = useDebounce.useDebounce;
+exports.useDebounceCallback = useDebounceCallback.useDebounceCallback;
+exports.useDocumentTitle = useDocumentTitle.useDocumentTitle;
+exports.useElementSize = useElementSize.useElementSize;
+exports.useElementTopOffset = useElementTopOffset.useElementTopOffset;
+exports.useEventHandler = useEventHandler.useEventHandler;
+exports.useExpectSameValueReference = useExpectSameValueReference.useExpectSameValueReference;
+exports.useForceRender = useForceRender.useForceRender;
+exports.useId = useId.useId;
+exports.useIsMounted = useIsMounted.useIsMounted;
+exports.useObjectMemo = useObjectMemo.useObjectMemo;
+exports.useOnElementClickOutsideCallback = useOnElementClickOutsideCallback.useOnElementClickOutsideCallback;
+exports.useOnElementMouseEnterDelayedCallback = useOnElementMouseEnterDelayedCallback.useOnElementMouseEnterDelayedCallback;
+exports.useOnElementMutation = useOnElementMutation.useOnElementMutation;
+exports.useOnElementResize = useOnElementResize.useOnElementResize;
+exports.useOnScrollWithin = useOnScrollWithin.useOnScrollWithin;
+exports.useOnWindowResize = useOnWindowResize.useOnWindowResize;
+exports.usePreviousValue = usePreviousValue.usePreviousValue;
+exports.useScrollOffsets = useScrollOffsets.useScrollOffsets;
+exports.useSessionStorageState = useStoredState.useSessionStorageState;
+exports.useUpdatedRef = useUpdatedRef.useUpdatedRef;
+exports.useWindowSize = useWindowSize.useWindowSize;
+exports.emptyArray = emptyArray.emptyArray;
+exports.emptyObject = emptyObject.emptyObject;
+exports.identityFunction = identityFunction.identityFunction;
+exports.noop = noop.noop;
+exports.returnFalse = returnFalse.returnFalse;
+exports.returnTrue = returnTrue.returnTrue;
+exports.useReferentiallyStableCallback = useReferentiallyStableCallback.useReferentiallyStableCallback;
+exports.ColorSchemeProvider = ColorSchemeProvider.ColorSchemeProvider;
+exports.GlobalClassNamePrefixContext = GlobalClassNamePrefixContext.GlobalClassNamePrefixContext;
+exports.ColorSchemeContext = contexts.ColorSchemeContext;
+exports.DEFAULT_COLOR_SCHEME = contexts.DEFAULT_COLOR_SCHEME;
+exports.useColorScheme = contexts.useColorScheme;
+exports.useClassName = useClassName.useClassName;
+exports.useClassNameFactory = useClassNameFactory.useClassNameFactory;
+exports.useThemedClassName = useThemedClassName.useThemedClassName;
+exports.useThemedClassNameFactory = useThemedClassNameFactory.useThemedClassNameFactory;
+//# sourceMappingURL=index.cjs.map

package/dist/development/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/development/index.js

@@ -8,6 +8,8 @@ import { useAddClassNameDuringResize } from "./hooks/useAddClassNameDuringResize
 import { useArrayMapMemo } from "./hooks/useArrayMapMemo.js";
 import { useAutoHeightTextArea } from "./hooks/useAutoHeightTextArea.js";
 import { getChildrenAsLabel, useChildrenAsLabel } from "./hooks/useChildrenAsLabel.js";
+import { useCloseOnClickOutside } from "./hooks/useCloseOnClickOutside.js";
+import { useCloseOnEscape } from "./hooks/useCloseOnEscape.js";
 import { useComposeRef } from "./hooks/useComposeRef.js";
 import { useConstantLengthInvariant } from "./hooks/useConstantLengthInvariant.js";
 import { useConstantValueInvariant } from "./hooks/useConstantValueInvariant.js";
@@ -77,6 +79,8 @@ export {
   useChildrenAsLabel,
   useClassName,
   useClassNameFactory,
+  useCloseOnClickOutside,
+  useCloseOnEscape,
   useColorScheme,
   useComposeRef,
   useConstantLengthInvariant,

package/dist/development/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/development/referentiallyStable/emptyArray.cjs

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const emptyArray = Object.freeze([]);
+exports.emptyArray = emptyArray;
+//# sourceMappingURL=emptyArray.cjs.map

package/dist/development/referentiallyStable/emptyArray.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"emptyArray.cjs","sources":["../../../src/referentiallyStable/emptyArray.ts"],"sourcesContent":["export const emptyArray = Object.freeze<any>([]) as any[]\n"],"names":[],"mappings":";;AAAO,MAAM,aAAa,OAAO,OAAY,CAAE,CAAA;;"}

package/dist/development/referentiallyStable/emptyObject.cjs

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const emptyObject = Object.freeze({});
+exports.emptyObject = emptyObject;
+//# sourceMappingURL=emptyObject.cjs.map

package/dist/development/referentiallyStable/emptyObject.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"emptyObject.cjs","sources":["../../../src/referentiallyStable/emptyObject.ts"],"sourcesContent":["export const emptyObject = Object.freeze({})\n"],"names":[],"mappings":";;AAAO,MAAM,cAAc,OAAO,OAAO,CAAE,CAAA;;"}

package/dist/development/referentiallyStable/identityFunction.cjs

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const identityFunction = (value) => value;
+exports.identityFunction = identityFunction;
+//# sourceMappingURL=identityFunction.cjs.map

package/dist/development/referentiallyStable/identityFunction.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"identityFunction.cjs","sources":["../../../src/referentiallyStable/identityFunction.ts"],"sourcesContent":["export const identityFunction = <Value>(value: Value) => value\n"],"names":[],"mappings":";;AAAa,MAAA,mBAAmB,CAAQ,UAAiB;;"}

package/dist/development/referentiallyStable/noop.cjs

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const noop = () => void 0;
+exports.noop = noop;
+//# sourceMappingURL=noop.cjs.map

package/dist/development/referentiallyStable/noop.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"noop.cjs","sources":["../../../src/referentiallyStable/noop.ts"],"sourcesContent":["export const noop = () => undefined\n"],"names":[],"mappings":";;AAAO,MAAM,OAAO,MAAM;;"}

package/dist/development/referentiallyStable/returnFalse.cjs

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const returnFalse = () => false;
+exports.returnFalse = returnFalse;
+//# sourceMappingURL=returnFalse.cjs.map

package/dist/development/referentiallyStable/returnFalse.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"returnFalse.cjs","sources":["../../../src/referentiallyStable/returnFalse.ts"],"sourcesContent":["export const returnFalse = () => false\n"],"names":[],"mappings":";;AAAO,MAAM,cAAc,MAAM;;"}

package/dist/development/referentiallyStable/returnTrue.cjs

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const returnTrue = () => true;
+exports.returnTrue = returnTrue;
+//# sourceMappingURL=returnTrue.cjs.map

package/dist/development/referentiallyStable/returnTrue.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"returnTrue.cjs","sources":["../../../src/referentiallyStable/returnTrue.ts"],"sourcesContent":["export const returnTrue = () => true\n"],"names":[],"mappings":";;AAAO,MAAM,aAAa,MAAM;;"}

package/dist/development/referentiallyStable/useReferentiallyStableCallback.cjs

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const react = require("react");
+const useReferentiallyStableCallback = (callback) => {
+  const ref = react.useRef(callback);
+  ref.current = callback;
+  return react.useCallback((...args) => {
+    return ref.current(...args);
+  }, []);
+};
+exports.useReferentiallyStableCallback = useReferentiallyStableCallback;
+//# sourceMappingURL=useReferentiallyStableCallback.cjs.map

package/dist/development/referentiallyStable/useReferentiallyStableCallback.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useReferentiallyStableCallback.cjs","sources":["../../../src/referentiallyStable/useReferentiallyStableCallback.ts"],"sourcesContent":["import { useCallback, useRef } from 'react'\n\n// TODO: Should be possible to remove when React.useEvent() lands\nexport const useReferentiallyStableCallback = <T extends (...args: any[]) => any>(callback: T): T => {\n\tconst ref = useRef(callback)\n\tref.current = callback\n\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\treturn useCallback<T>(((...args: any[]) => {\n\t\treturn ref.current(...args)\n\t}) as T, [])\n}\n"],"names":["useRef","useCallback"],"mappings":";;;AAGa,MAAA,iCAAiC,CAAoC,aAAmB;AAC9F,QAAA,MAAMA,aAAO,QAAQ;AAC3B,MAAI,UAAU;AAEP,SAAAC,MAAA,YAAgB,IAAI,SAAgB;AACnC,WAAA,IAAI,QAAQ,GAAG,IAAI;AAAA,EAC3B,GAAS,CAAE,CAAA;AACZ;;"}

package/dist/development/theming/ColorSchemeProvider.cjs

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxDevRuntime = require("react/jsx-dev-runtime");
+const react = require("react");
+const contexts = require("./contexts.cjs");
+const ColorSchemeProvider = react.memo(({ children, scheme }) => {
+  const inheritedColorScheme = contexts.useColorScheme();
+  return /* @__PURE__ */ jsxDevRuntime.jsxDEV(contexts.ColorSchemeContext.Provider, { value: scheme ?? inheritedColorScheme, children }, void 0, false, {
+    fileName: "/__w/interface/interface/packages/react-utils/src/theming/ColorSchemeProvider.tsx",
+    lineNumber: 13,
+    columnNumber: 3
+  }, void 0);
+});
+ColorSchemeProvider.displayName = "Interface.ColorSchemeProvider";
+exports.ColorSchemeProvider = ColorSchemeProvider;
+//# sourceMappingURL=ColorSchemeProvider.cjs.map

package/dist/development/theming/ColorSchemeProvider.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColorSchemeProvider.cjs","sources":["../../../src/theming/ColorSchemeProvider.tsx"],"sourcesContent":["import { memo } from 'react'\nimport { ColorSchemeContext, useColorScheme } from './contexts'\n\nexport type ColorSchemeProviderProps = {\n\tchildren: React.ReactNode\n\tscheme?: string\n}\n\nexport const ColorSchemeProvider = memo(({ children, scheme }: ColorSchemeProviderProps) => {\n\tconst inheritedColorScheme = useColorScheme()\n\n\treturn (\n\t\t<ColorSchemeContext.Provider value={scheme ?? inheritedColorScheme}>{children}</ColorSchemeContext.Provider>\n\t)\n})\nColorSchemeProvider.displayName = 'Interface.ColorSchemeProvider'\n"],"names":["memo","useColorScheme","ColorSchemeContext","this"],"mappings":";;;;;AAQO,MAAM,sBAAsBA,MAAAA,KAAK,CAAC,EAAE,UAAU,aAAuC;AAC3F,QAAM,uBAAuBC,SAAAA;AAE7B,8CACEC,SAAAA,mBAAmB,UAAnB,EAA4B,OAAO,UAAU,sBAAuB,SAArE,GAAA,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAA8E,GAAAC,MAAA;AAEhF,CAAC;AACD,oBAAoB,cAAc;;"}

package/dist/development/theming/ColorSchemeProvider.js

@@ -1,16 +1,14 @@
 import { jsxDEV } from "react/jsx-dev-runtime";
 import { memo } from "react";
 import { useColorScheme, ColorSchemeContext } from "./contexts.js";
-const ColorSchemeProvider = memo(
-  ({ children, scheme }) => {
-    const inheritedColorScheme = useColorScheme();
-    return /* @__PURE__ */ jsxDEV(ColorSchemeContext.Provider, { value: scheme ?? inheritedColorScheme, children }, void 0, false, {
-      fileName: "/__w/interface/interface/packages/react-utils/src/theming/ColorSchemeProvider.tsx",
-      lineNumber: 15,
-      columnNumber: 4
-    }, globalThis);
-  }
-);
+const ColorSchemeProvider = memo(({ children, scheme }) => {
+  const inheritedColorScheme = useColorScheme();
+  return /* @__PURE__ */ jsxDEV(ColorSchemeContext.Provider, { value: scheme ?? inheritedColorScheme, children }, void 0, false, {
+    fileName: "/__w/interface/interface/packages/react-utils/src/theming/ColorSchemeProvider.tsx",
+    lineNumber: 13,
+    columnNumber: 3
+  }, void 0);
+});
 ColorSchemeProvider.displayName = "Interface.ColorSchemeProvider";
 export {
   ColorSchemeProvider

package/dist/development/theming/ColorSchemeProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"ColorSchemeProvider.js","sources":["../../../src/theming/ColorSchemeProvider.tsx"],"sourcesContent":["import { KebabCase } from '@contember/utilities'\nimport { memo } from 'react'\nimport { ColorSchemeContext, useColorScheme } from './contexts'\n\nexport type ColorSchemeProviderProps<T extends KebabCase<string>> = {\n\tchildren: React.ReactNode\n\tscheme?: T\n}\n\nexport const ColorSchemeProvider = memo(\n\t<T extends KebabCase<string>>({ children, scheme }: ColorSchemeProviderProps<T>) => {\n\t\tconst inheritedColorScheme = useColorScheme()\n\n\t\treturn (\n\t\t\t<ColorSchemeContext.Provider value={scheme ?? inheritedColorScheme}>{children}</ColorSchemeContext.Provider>\n\t\t)\n\t},\n)\nColorSchemeProvider.displayName = 'Interface.ColorSchemeProvider'\n"],"names":["this"],"mappings":";;;AASO,MAAM,sBAAsB;AAAA,EAClC,CAA8B,EAAE,UAAU,aAA0C;AACnF,UAAM,uBAAuB;AAE7B,kCACE,mBAAmB,UAAnB,EAA4B,OAAO,UAAU,sBAAuB,SAArE,GAAA,QAAA,OAAA;AAAA,MAAA,UAAA;AAAA,MAAA,YAAA;AAAA,MAAA,cAAA;AAAA,IAA8E,GAAAA,UAAA;AAAA,EAEhF;AACD;AACA,oBAAoB,cAAc;"}
+{"version":3,"file":"ColorSchemeProvider.js","sources":["../../../src/theming/ColorSchemeProvider.tsx"],"sourcesContent":["import { memo } from 'react'\nimport { ColorSchemeContext, useColorScheme } from './contexts'\n\nexport type ColorSchemeProviderProps = {\n\tchildren: React.ReactNode\n\tscheme?: string\n}\n\nexport const ColorSchemeProvider = memo(({ children, scheme }: ColorSchemeProviderProps) => {\n\tconst inheritedColorScheme = useColorScheme()\n\n\treturn (\n\t\t<ColorSchemeContext.Provider value={scheme ?? inheritedColorScheme}>{children}</ColorSchemeContext.Provider>\n\t)\n})\nColorSchemeProvider.displayName = 'Interface.ColorSchemeProvider'\n"],"names":["this"],"mappings":";;;AAQO,MAAM,sBAAsB,KAAK,CAAC,EAAE,UAAU,aAAuC;AAC3F,QAAM,uBAAuB;AAE7B,gCACE,mBAAmB,UAAnB,EAA4B,OAAO,UAAU,sBAAuB,SAArE,GAAA,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAA8E,GAAAA,MAAA;AAEhF,CAAC;AACD,oBAAoB,cAAc;"}

package/dist/development/theming/GlobalClassNamePrefixContext.cjs

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const react = require("react");
+const GlobalClassNamePrefixContext = react.createContext("cui-");
+exports.GlobalClassNamePrefixContext = GlobalClassNamePrefixContext;
+//# sourceMappingURL=GlobalClassNamePrefixContext.cjs.map

package/dist/development/theming/GlobalClassNamePrefixContext.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"GlobalClassNamePrefixContext.cjs","sources":["../../../src/theming/GlobalClassNamePrefixContext.ts"],"sourcesContent":["import { createContext } from 'react'\n\nexport const GlobalClassNamePrefixContext = createContext<string>('cui-')\n"],"names":["createContext"],"mappings":";;;AAEa,MAAA,+BAA+BA,oBAAsB,MAAM;;"}

package/dist/development/theming/contexts.cjs

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const createOptionalContextFactory = require("../context/createOptionalContextFactory.cjs");
+const DEFAULT_COLOR_SCHEME = "system";
+const [ColorSchemeContext, useColorScheme] = createOptionalContextFactory.createOptionalContextFactory(
+  "Interface.ColorScheme",
+  DEFAULT_COLOR_SCHEME
+);
+exports.ColorSchemeContext = ColorSchemeContext;
+exports.DEFAULT_COLOR_SCHEME = DEFAULT_COLOR_SCHEME;
+exports.useColorScheme = useColorScheme;
+//# sourceMappingURL=contexts.cjs.map

package/dist/development/theming/contexts.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"contexts.cjs","sources":["../../../src/theming/contexts.ts"],"sourcesContent":["import { createOptionalContextFactory } from '../context'\n\nexport const DEFAULT_COLOR_SCHEME = 'system'\n\n\n/**\n * @group UI\n *\n * @description\n * Provides the current color scheme, possible values are `'light'`, `'dark'` or `'system'`.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme\n *\n */\nexport const [ColorSchemeContext, useColorScheme] = createOptionalContextFactory<string>(\n\t'Interface.ColorScheme',\n\tDEFAULT_COLOR_SCHEME,\n)\n"],"names":["createOptionalContextFactory"],"mappings":";;;AAEO,MAAM,uBAAuB;AAYvB,MAAA,CAAC,oBAAoB,cAAc,IAAIA,6BAAA;AAAA,EACnD;AAAA,EACA;AACD;;;;"}

package/dist/development/theming/useClassName.cjs

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const utilities = require("@contember/utilities");
+const react = require("react");
+const GlobalClassNamePrefixContext = require("./GlobalClassNamePrefixContext.cjs");
+function useClassName(componentClassName, additionalClassName = null, prefixOverride) {
+  const contextPrefix = react.useContext(GlobalClassNamePrefixContext.GlobalClassNamePrefixContext);
+  const classNamePrefix = prefixOverride === null || prefixOverride === "" ? "" : prefixOverride || contextPrefix;
+  const componentClassNameList = utilities.flatClassNameList(componentClassName).map(
+    (componentClassName2) => `${classNamePrefix}${componentClassName2}`
+  );
+  return utilities.deduplicateClassName(componentClassNameList.concat(
+    utilities.flatClassNameList(additionalClassName)
+  )).join(" ");
+}
+exports.useClassName = useClassName;
+//# sourceMappingURL=useClassName.cjs.map

package/dist/development/theming/useClassName.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useClassName.cjs","sources":["../../../src/theming/useClassName.ts"],"sourcesContent":["import { NestedClassName, deduplicateClassName, flatClassNameList } from '@contember/utilities'\nimport { useContext } from 'react'\nimport { GlobalClassNamePrefixContext } from './GlobalClassNamePrefixContext'\n\n/**\n * Hook for component class name accepting outer class name\n *\n * @param componentClassName - Component class name\n * @param additionalClassName - Additional class name\n * @param prefixOverride - Context component prefix override\n * @returns Prefixed component class name.\n */\nexport function useClassName (\n\tcomponentClassName: NestedClassName,\n\tadditionalClassName: NestedClassName = null,\n\tprefixOverride?: string | null | undefined,\n) {\n\tconst contextPrefix = useContext(GlobalClassNamePrefixContext)\n\tconst classNamePrefix: string = prefixOverride === null || prefixOverride === '' ? '' : prefixOverride || contextPrefix\n\n\tconst componentClassNameList: string[] = flatClassNameList(componentClassName).map(\n\t\tcomponentClassName => `${classNamePrefix}${componentClassName}`,\n\t)\n\n\treturn deduplicateClassName(componentClassNameList.concat(\n\t\tflatClassNameList(additionalClassName),\n\t)).join(' ')\n}\n"],"names":["useContext","GlobalClassNamePrefixContext","flatClassNameList","componentClassName","deduplicateClassName"],"mappings":";;;;;AAYO,SAAS,aACf,oBACA,sBAAuC,MACvC,gBACC;AACK,QAAA,gBAAgBA,iBAAWC,6BAAAA,4BAA4B;AAC7D,QAAM,kBAA0B,mBAAmB,QAAQ,mBAAmB,KAAK,KAAK,kBAAkB;AAEpG,QAAA,yBAAmCC,UAAAA,kBAAkB,kBAAkB,EAAE;AAAA,IAC9E,CAAAC,wBAAsB,GAAG,eAAe,GAAGA,mBAAkB;AAAA,EAAA;AAG9D,SAAOC,UAAAA,qBAAqB,uBAAuB;AAAA,IAClDF,UAAAA,kBAAkB,mBAAmB;AAAA,EAAA,CACrC,EAAE,KAAK,GAAG;AACZ;;"}

package/dist/development/theming/useClassName.js.map

@@ -1 +1 @@
-{"version":3,"file":"useClassName.js","sources":["../../../src/theming/useClassName.ts"],"sourcesContent":["import { NestedClassName, deduplicateClassName, flatClassNameList } from '@contember/utilities'\nimport { useContext } from 'react'\nimport { GlobalClassNamePrefixContext } from './GlobalClassNamePrefixContext'\n\n/**\n * Hook for component class name accepting outer class name\n *\n * @param componentClassName - Component class name\n * @param additionalClassName - Additional class name\n * @param prefixOverride - Context component prefix override\n * @returns Prefixed component class name.\n */\nexport function useClassName (\n\tcomponentClassName: NestedClassName,\n\tadditionalClassName: NestedClassName = null,\n\tprefixOverride?: string | null | undefined,\n) {\n\tconst contextPrefix = useContext(GlobalClassNamePrefixContext)\n\tconst classNamePrefix: string = prefixOverride === null || prefixOverride === '' ? '' : prefixOverride || contextPrefix\n\n\tconst componentClassNameList: string[] = flatClassNameList(componentClassName).map(\n\t\tcomponentClassName => `${classNamePrefix}${componentClassName}`,\n\t)\n\n\treturn deduplicateClassName(componentClassNameList.concat(\n\t\tflatClassNameList(additionalClassName),\n\t)).join(' ')\n}\n"],"names":["componentClassName"],"mappings":";;;AAYO,SAAS,aACf,oBACA,sBAAuC,MACvC,gBACC;AACK,QAAA,gBAAgB,WAAW,4BAA4B;AAC7D,QAAM,kBAA0B,mBAAmB,QAAQ,mBAAmB,KAAK,KAAK,kBAAkB;AAEpG,QAAA,yBAAmC,kBAAkB,kBAAkB,EAAE;AAAA,IAC9E,CAAAA,wBAAsB,GAAG,kBAAkBA;AAAAA,EAAA;AAG5C,SAAO,qBAAqB,uBAAuB;AAAA,IAClD,kBAAkB,mBAAmB;AAAA,EAAA,CACrC,EAAE,KAAK,GAAG;AACZ;"}
+{"version":3,"file":"useClassName.js","sources":["../../../src/theming/useClassName.ts"],"sourcesContent":["import { NestedClassName, deduplicateClassName, flatClassNameList } from '@contember/utilities'\nimport { useContext } from 'react'\nimport { GlobalClassNamePrefixContext } from './GlobalClassNamePrefixContext'\n\n/**\n * Hook for component class name accepting outer class name\n *\n * @param componentClassName - Component class name\n * @param additionalClassName - Additional class name\n * @param prefixOverride - Context component prefix override\n * @returns Prefixed component class name.\n */\nexport function useClassName (\n\tcomponentClassName: NestedClassName,\n\tadditionalClassName: NestedClassName = null,\n\tprefixOverride?: string | null | undefined,\n) {\n\tconst contextPrefix = useContext(GlobalClassNamePrefixContext)\n\tconst classNamePrefix: string = prefixOverride === null || prefixOverride === '' ? '' : prefixOverride || contextPrefix\n\n\tconst componentClassNameList: string[] = flatClassNameList(componentClassName).map(\n\t\tcomponentClassName => `${classNamePrefix}${componentClassName}`,\n\t)\n\n\treturn deduplicateClassName(componentClassNameList.concat(\n\t\tflatClassNameList(additionalClassName),\n\t)).join(' ')\n}\n"],"names":["componentClassName"],"mappings":";;;AAYO,SAAS,aACf,oBACA,sBAAuC,MACvC,gBACC;AACK,QAAA,gBAAgB,WAAW,4BAA4B;AAC7D,QAAM,kBAA0B,mBAAmB,QAAQ,mBAAmB,KAAK,KAAK,kBAAkB;AAEpG,QAAA,yBAAmC,kBAAkB,kBAAkB,EAAE;AAAA,IAC9E,CAAAA,wBAAsB,GAAG,eAAe,GAAGA,mBAAkB;AAAA,EAAA;AAG9D,SAAO,qBAAqB,uBAAuB;AAAA,IAClD,kBAAkB,mBAAmB;AAAA,EAAA,CACrC,EAAE,KAAK,GAAG;AACZ;"}

package/dist/development/theming/useClassNameFactory.cjs

@@ -0,0 +1,22 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const utilities = require("@contember/utilities");
+const react = require("react");
+const GlobalClassNamePrefixContext = require("./GlobalClassNamePrefixContext.cjs");
+const useReferentiallyStableCallback = require("../referentiallyStable/useReferentiallyStableCallback.cjs");
+function useClassNameFactory(componentClassName, glue = "-", prefixOverride) {
+  const contextPrefix = react.useContext(GlobalClassNamePrefixContext.GlobalClassNamePrefixContext);
+  const classNamePrefix = prefixOverride === null || prefixOverride === "" ? "" : prefixOverride || contextPrefix;
+  const componentClassNameList = utilities.flatClassNameList(componentClassName).map(
+    (componentClassName2) => `${classNamePrefix}${componentClassName2}`
+  );
+  function componentClassNameFor(suffix = null, additionalClassName = null) {
+    const classNameSuffix = suffix ?? "";
+    return utilities.deduplicateClassName((classNameSuffix ? classNameSuffix.match(/^[a-zA-Z0-9]/) ? componentClassNameList.map((componentClassName2) => `${componentClassName2}${glue}${classNameSuffix}`) : componentClassNameList.map((componentClassName2) => `${componentClassName2}${classNameSuffix}`) : componentClassNameList).concat(
+      utilities.flatClassNameList(additionalClassName)
+    )).join(" ");
+  }
+  return useReferentiallyStableCallback.useReferentiallyStableCallback(componentClassNameFor);
+}
+exports.useClassNameFactory = useClassNameFactory;
+//# sourceMappingURL=useClassNameFactory.cjs.map

package/dist/development/theming/useClassNameFactory.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useClassNameFactory.cjs","sources":["../../../src/theming/useClassNameFactory.ts"],"sourcesContent":["import { NestedClassName, deduplicateClassName, flatClassNameList } from '@contember/utilities'\nimport { useContext } from 'react'\nimport { useReferentiallyStableCallback } from '../referentiallyStable'\nimport { GlobalClassNamePrefixContext } from './GlobalClassNamePrefixContext'\n\n/**\n * Hook for component class name accepting outer class name\n *\n * Returns a reusable function almost that is handy for components\n * with many sub-component parts that should inherit the root component\n * name.\n *\n * Also, product of the factory is a function that can be used outside of rules of hooks.\n *\n * @param componentClassName - Component class name\n * @param glue - String to use to glue component and sub-component suffix\n * @param prefixOverride - Context component prefix override\n * @returns\n */\nexport function useClassNameFactory(\n\tcomponentClassName: NestedClassName,\n\tglue: string | null = '-',\n\tprefixOverride?: string | null | undefined,\n) {\n\tconst contextPrefix = useContext(GlobalClassNamePrefixContext)\n\tconst classNamePrefix: string = prefixOverride === null || prefixOverride === '' ? '' : prefixOverride || contextPrefix\n\n\tconst componentClassNameList: string[] = flatClassNameList(componentClassName).map(\n\t\tcomponentClassName => `${classNamePrefix}${componentClassName}`,\n\t)\n\n\tfunction componentClassNameFor(\n\t\tsuffix: string | null | undefined = null,\n\t\tadditionalClassName: NestedClassName = null,\n\t): string {\n\t\tconst classNameSuffix: string = suffix ?? ''\n\n\t\treturn deduplicateClassName((classNameSuffix\n\t\t\t? (classNameSuffix.match(/^[a-zA-Z0-9]/)\n\t\t\t\t? componentClassNameList.map(componentClassName => `${componentClassName}${glue}${classNameSuffix}`)\n\t\t\t\t: componentClassNameList.map(componentClassName => `${componentClassName}${classNameSuffix}`)\n\t\t\t)\n\t\t\t: componentClassNameList\n\t\t).concat(\n\t\t\tflatClassNameList(additionalClassName),\n\t\t)).join(' ')\n\t}\n\n\treturn useReferentiallyStableCallback(componentClassNameFor)\n}\n"],"names":["useContext","GlobalClassNamePrefixContext","flatClassNameList","componentClassName","deduplicateClassName","useReferentiallyStableCallback"],"mappings":";;;;;;AAmBO,SAAS,oBACf,oBACA,OAAsB,KACtB,gBACC;AACK,QAAA,gBAAgBA,iBAAWC,6BAAAA,4BAA4B;AAC7D,QAAM,kBAA0B,mBAAmB,QAAQ,mBAAmB,KAAK,KAAK,kBAAkB;AAEpG,QAAA,yBAAmCC,UAAAA,kBAAkB,kBAAkB,EAAE;AAAA,IAC9E,CAAAC,wBAAsB,GAAG,eAAe,GAAGA,mBAAkB;AAAA,EAAA;AAG9D,WAAS,sBACR,SAAoC,MACpC,sBAAuC,MAC9B;AACT,UAAM,kBAA0B,UAAU;AAE1C,WAAOC,UAAsB,sBAAA,kBACzB,gBAAgB,MAAM,cAAc,IACpC,uBAAuB,IAAI,CAAAD,wBAAsB,GAAGA,mBAAkB,GAAG,IAAI,GAAG,eAAe,EAAE,IACjG,uBAAuB,IAAI,CAAAA,wBAAsB,GAAGA,mBAAkB,GAAG,eAAe,EAAE,IAE3F,wBACD;AAAA,MACDD,UAAAA,kBAAkB,mBAAmB;AAAA,IAAA,CACrC,EAAE,KAAK,GAAG;AAAA,EACZ;AAEA,SAAOG,+BAAAA,+BAA+B,qBAAqB;AAC5D;;"}