@react-fabric/core 1.0.0-beta.0

package/dist/cjs/core/section/Section.js

@@ -0,0 +1,44 @@
+'use strict';
+
+var classNames = require('classnames');
+var ErrorBoundary = require('../boundary/ErrorBoundary.js');
+var Section_module = require('./Section.module.css');
+var jsxRuntime = require('react/jsx-runtime');
+
+/*
+ * React Fabric
+ * @version: 1.0.0
+ *
+ *
+ * The MIT License (MIT)
+ * Copyright (c) 2024 Adarsh Pastakia
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy of this software
+ * and associated documentation files (the "Software"), to deal in the Software without restriction,
+ * including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense,
+ * and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so,
+ * subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all copies or substantial
+ * portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED
+ * TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL
+ * THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT,
+ * TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+ */
+
+var Section = function Section(_ref) {
+  var children = _ref.children,
+    dir = _ref.dir;
+  return /*#__PURE__*/jsxRuntime.jsx("div", {
+    "data-ref": "section",
+    dir: dir,
+    className: classNames(Section_module.section, "grid area-content overflow-hidden"),
+    children: /*#__PURE__*/jsxRuntime.jsx(ErrorBoundary.ErrorBoundary, {
+      children: children
+    })
+  });
+};
+
+exports.Section = Section;

package/dist/cjs/core/section/Section.module.css

@@ -0,0 +1 @@
+@layer comp{.section{grid-template:"head head head" auto "side-s content side-e" 1fr "foot foot foot" auto/auto 1fr auto}}

package/dist/cjs/core/theme/Theme.module.css

@@ -0,0 +1 @@
+@layer comp{.themeProvider{&>*{background-color:theme(backgroundColor.base)}}}

package/dist/cjs/core/theme/ThemeProvider.js

@@ -0,0 +1,74 @@
+'use strict';
+
+var utilities = require('@react-fabric/utilities');
+var classNames = require('classnames');
+var react = require('react');
+var Theme_module = require('./Theme.module.css');
+var jsxRuntime = require('react/jsx-runtime');
+
+/*
+ * React Fabric
+ * @version: 1.0.0
+ *
+ *
+ * The MIT License (MIT)
+ * Copyright (c) 2024 Adarsh Pastakia
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy of this software
+ * and associated documentation files (the "Software"), to deal in the Software without restriction,
+ * including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense,
+ * and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so,
+ * subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all copies or substantial
+ * portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED
+ * TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL
+ * THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT,
+ * TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+ */
+
+/**
+ * Theme override
+ */
+var ThemeProvider = function ThemeProvider(_ref) {
+  var children = _ref.children,
+    branding = _ref.branding,
+    primaryColor = _ref.primaryColor,
+    accentColor = _ref.accentColor,
+    tintColor = _ref.tintColor,
+    colorScheme = _ref.colorScheme,
+    rounding = _ref.rounding;
+  var styles = react.useMemo(function () {
+    var ret = {};
+    if (primaryColor && utilities.isColor(primaryColor)) {
+      ret["--primary"] = primaryColor;
+    }
+    if (primaryColor && !utilities.isColor(primaryColor)) {
+      ret["--primary"] = "var(--".concat(primaryColor, ")");
+    }
+    if (accentColor && utilities.isColor(accentColor)) {
+      ret["--accent"] = accentColor;
+    }
+    if (accentColor && !utilities.isColor(accentColor)) {
+      ret["--accent"] = "var(--".concat(accentColor, ")");
+    }
+    if (tintColor && utilities.isColor(tintColor)) {
+      ret["--tint"] = tintColor;
+    }
+    if (tintColor && !utilities.isColor(tintColor)) {
+      ret["--tint"] = "var(--".concat(tintColor, ")");
+    }
+    return ret;
+  }, [primaryColor, accentColor, tintColor]);
+  return /*#__PURE__*/jsxRuntime.jsx("div", {
+    style: styles,
+    "data-color-scheme": colorScheme,
+    "data-rounding": rounding,
+    className: classNames(Theme_module.themeProvider, "contents theme-base", branding),
+    children: children
+  });
+};
+
+exports.ThemeProvider = ThemeProvider;

package/dist/cjs/core/viewport/Viewport.js

@@ -0,0 +1,39 @@
+'use strict';
+
+var classNames = require('classnames');
+var Viewport_module = require('./Viewport.module.css');
+var jsxRuntime = require('react/jsx-runtime');
+
+/*
+ * React Fabric
+ * @version: 1.0.0
+ *
+ *
+ * The MIT License (MIT)
+ * Copyright (c) 2024 Adarsh Pastakia
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy of this software
+ * and associated documentation files (the "Software"), to deal in the Software without restriction,
+ * including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense,
+ * and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so,
+ * subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all copies or substantial
+ * portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED
+ * TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL
+ * THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT,
+ * TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+ */
+
+var Viewport = function Viewport(_ref) {
+  var children = _ref.children;
+  return /*#__PURE__*/jsxRuntime.jsx("div", {
+    "data-ref": "viewport",
+    className: classNames(Viewport_module.viewport, "grid overflow-hidden absolute inset-0"),
+    children: children
+  });
+};
+
+exports.Viewport = Viewport;

package/dist/cjs/core/viewport/Viewport.module.css

@@ -0,0 +1 @@
+@layer comp{.viewport{--fabric-viewport:color-mix(in lab,var(--fabric-bg) 76%,var(--tint));background-color:var(--fabric-viewport);color:var(--fabric-text);grid-template:"head head head" auto "crumbbar crumbbar crumbbar" auto "side-s content side-e" 1fr "foot foot foot" auto/auto 1fr auto}}

package/dist/cjs/hooks/useClientService.js

@@ -0,0 +1,30 @@
+'use strict';
+
+/*
+ * React Fabric
+ * @version: 1.0.0
+ *
+ *
+ * The MIT License (MIT)
+ * Copyright (c) 2024 Adarsh Pastakia
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy of this software
+ * and associated documentation files (the "Software"), to deal in the Software without restriction,
+ * including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense,
+ * and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so,
+ * subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all copies or substantial
+ * portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED
+ * TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL
+ * THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT,
+ * TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+ */
+
+var useClientService = function useClientService(clientApi, serverMock) {
+  return typeof window === "undefined" ? serverMock : clientApi;
+};
+
+exports.useClientService = useClientService;

package/dist/cjs/hooks/useControlledValue.js

@@ -0,0 +1,22 @@
+'use strict';
+
+var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
+var react = require('react');
+var useEffectDebugger = require('./useEffectDebugger.js');
+
+var useControlledValue = function useControlledValue(value, defaultValue) {
+  var _useState = react.useState(defaultValue),
+    _useState2 = _slicedToArray(_useState, 2),
+    currentValue = _useState2[0],
+    updateValue = _useState2[1];
+  var deferred = react.useDeferredValue(value);
+  useEffectDebugger.useEffectDebugger(function () {
+    updateValue(deferred !== null && deferred !== void 0 ? deferred : defaultValue);
+  }, [deferred], "useControlledValue change");
+  return {
+    currentValue: currentValue,
+    updateValue: updateValue
+  };
+};
+
+exports.useControlledValue = useControlledValue;

package/dist/cjs/hooks/useDebounce.js

@@ -0,0 +1,56 @@
+'use strict';
+
+var react = require('react');
+
+/*
+ * React Fabric
+ * @version: 1.0.0
+ *
+ *
+ * The MIT License (MIT)
+ * Copyright (c) 2024 Adarsh Pastakia
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy of this software
+ * and associated documentation files (the "Software"), to deal in the Software without restriction,
+ * including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense,
+ * and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so,
+ * subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all copies or substantial
+ * portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED
+ * TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL
+ * THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT,
+ * TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+ */
+
+var useDebounce = function useDebounce(callback, deps) {
+  var delay = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 100;
+  var timerRef = react.useRef();
+  var cb = react.useMemo(function () {
+    if (typeof window !== "undefined") {
+      window.clearTimeout(timerRef.current);
+    }
+    var fn = function fn() {
+      for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+        args[_key] = arguments[_key];
+      }
+      if (typeof window !== "undefined") {
+        window.clearTimeout(timerRef.current);
+        timerRef.current = window.setTimeout(function () {
+          return callback === null || callback === void 0 ? void 0 : callback.apply(void 0, args);
+        }, delay);
+      }
+    };
+    fn.cancel = function () {
+      if (typeof window !== "undefined") {
+        clearTimeout(timerRef.current);
+      }
+    };
+    return fn;
+  }, deps);
+  return cb;
+};
+
+exports.useDebounce = useDebounce;

package/dist/cjs/hooks/useEffectDebugger.js

@@ -0,0 +1,113 @@
+'use strict';
+
+var utilities = require('@react-fabric/utilities');
+var react = require('react');
+
+/*
+ * React Fabric
+ * @version: 1.0.0
+ *
+ *
+ * The MIT License (MIT)
+ * Copyright (c) 2024 Adarsh Pastakia
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy of this software
+ * and associated documentation files (the "Software"), to deal in the Software without restriction,
+ * including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense,
+ * and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so,
+ * subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all copies or substantial
+ * portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED
+ * TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL
+ * THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT,
+ * TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+ */
+
+var loggerM = utilities.useLogger("useMemoDebugger");
+var loggerE = utilities.useLogger("useEffectDebugger");
+var loggerLE = utilities.useLogger("useLayoutEffectDebugger");
+var compareInputs = function compareInputs(oldInputs, newInputs, prefix, logger) {
+  if (process.env.NODE_ENV === "production" && typeof window !== "undefined" &&
+  // @ts-expect-error ignore
+  window.DEBUG_HOOKS !== true) return;
+
+  // Edge-case: different array lengths
+  if (oldInputs.length !== newInputs.length) {
+    // Not helpful to compare item by item, so just output the whole array
+    logger.debug("Deps have a different length", {
+      process: prefix
+    }, oldInputs.length, newInputs.length);
+    return;
+  }
+
+  // Compare individual items
+  oldInputs.forEach(function (oldInput, index) {
+    var newInput = newInputs[index];
+    var diff = [];
+    if (oldInput !== newInput) {
+      var _ref, _ref2, _ref3, _oldInput$type$name, _oldInput$type, _oldInput$substr, _ref4, _ref5, _ref6, _newInput$type$name, _newInput$type, _newInput$substr;
+      diff.push("Dep [".concat(index, "] has a different value"), (_ref = (_ref2 = (_ref3 = (_oldInput$type$name = oldInput === null || oldInput === void 0 || (_oldInput$type = oldInput.type) === null || _oldInput$type === void 0 ? void 0 : _oldInput$type.name) !== null && _oldInput$type$name !== void 0 ? _oldInput$type$name : oldInput === null || oldInput === void 0 ? void 0 : oldInput.tagName) !== null && _ref3 !== void 0 ? _ref3 : oldInput === null || oldInput === void 0 ? void 0 : oldInput.name) !== null && _ref2 !== void 0 ? _ref2 : oldInput === null || oldInput === void 0 || (_oldInput$substr = oldInput.substr) === null || _oldInput$substr === void 0 ? void 0 : _oldInput$substr.call(oldInput, 0, 24)) !== null && _ref !== void 0 ? _ref : oldInput, (_ref4 = (_ref5 = (_ref6 = (_newInput$type$name = newInput === null || newInput === void 0 || (_newInput$type = newInput.type) === null || _newInput$type === void 0 ? void 0 : _newInput$type.name) !== null && _newInput$type$name !== void 0 ? _newInput$type$name : newInput === null || newInput === void 0 ? void 0 : newInput.tagName) !== null && _ref6 !== void 0 ? _ref6 : newInput === null || newInput === void 0 ? void 0 : newInput.name) !== null && _ref5 !== void 0 ? _ref5 : newInput === null || newInput === void 0 || (_newInput$substr = newInput.substr) === null || _newInput$substr === void 0 ? void 0 : _newInput$substr.call(newInput, 0, 24)) !== null && _ref4 !== void 0 ? _ref4 : newInput, "\n\n");
+    }
+    diff.length && logger.debug.apply(logger, ["Diff", {
+      process: prefix
+    }].concat(diff));
+  });
+};
+var useMemoDebugger = function useMemoDebugger(func, inputs, prefix) {
+  // Using a ref to hold the inputs from the previous run (or same run for initial run
+  var oldInputsRef = react.useRef(inputs);
+  return react.useMemo(function () {
+    // Get the old inputs
+    var oldInputs = oldInputsRef.current;
+
+    // Compare the old inputs to the current inputs
+    compareInputs(oldInputs, inputs, prefix, loggerM);
+
+    // Save the current inputs
+    oldInputsRef.current = inputs;
+
+    // Execute wrapped effect
+    return func();
+  }, inputs);
+};
+var useEffectDebugger = function useEffectDebugger(func, inputs, prefix) {
+  // Using a ref to hold the inputs from the previous run (or same run for initial run
+  var oldInputsRef = react.useRef(inputs);
+  react.useEffect(function () {
+    // Get the old inputs
+    var oldInputs = oldInputsRef.current;
+
+    // Compare the old inputs to the current inputs
+    compareInputs(oldInputs, inputs, prefix, loggerE);
+
+    // Save the current inputs
+    oldInputsRef.current = inputs;
+
+    // Execute wrapped effect
+    return func();
+  }, inputs);
+};
+var useLayoutEffectDebugger = function useLayoutEffectDebugger(func, inputs, prefix) {
+  // Using a ref to hold the inputs from the previous run (or same run for initial run
+  var oldInputsRef = react.useRef(inputs);
+  react.useLayoutEffect(function () {
+    // Get the old inputs
+    var oldInputs = oldInputsRef.current;
+
+    // Compare the old inputs to the current inputs
+    compareInputs(oldInputs, inputs, prefix, loggerLE);
+
+    // Save the current inputs
+    oldInputsRef.current = inputs;
+
+    // Execute wrapped effect
+    return func();
+  }, inputs);
+};
+
+exports.useEffectDebugger = useEffectDebugger;
+exports.useLayoutEffectDebugger = useLayoutEffectDebugger;
+exports.useMemoDebugger = useMemoDebugger;

package/dist/cjs/hooks/useIsDark.js

@@ -0,0 +1,33 @@
+'use strict';
+
+var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
+var react = require('react');
+var useEffectDebugger = require('./useEffectDebugger.js');
+
+var useIsDark = function useIsDark() {
+  var _useState = react.useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    isDark = _useState2[0],
+    setDark = _useState2[1];
+  var checkTheme = react.useCallback(function () {
+    var _ref = getComputedStyle(document.documentElement).backgroundColor.match(/\d?\d?\d/g),
+      _ref2 = _slicedToArray(_ref, 1),
+      r = _ref2[0];
+    setDark(+r < 50);
+  }, []);
+  useEffectDebugger.useLayoutEffectDebugger(function () {
+    if (MutationObserver) {
+      var ob = new MutationObserver(checkTheme);
+      ob.observe(document.documentElement, {
+        attributes: true
+      });
+      checkTheme();
+      return function () {
+        ob.disconnect();
+      };
+    }
+  }, [], "useIsDark");
+  return isDark;
+};
+
+exports.useIsDark = useIsDark;

package/dist/cjs/hooks/useIsRtl.js

@@ -0,0 +1,27 @@
+'use strict';
+
+var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
+var react = require('react');
+var reactI18next = require('react-i18next');
+var useEffectDebugger = require('./useEffectDebugger.js');
+
+var useIsRtl = function useIsRtl() {
+  var _useTranslation = reactI18next.useTranslation("core"),
+    i18n = _useTranslation.i18n;
+  var _useState = react.useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    isRtl = _useState2[0],
+    setIsRtl = _useState2[1];
+
+  /** ***************** update RTL flag on i18n locale change *******************/
+  useEffectDebugger.useLayoutEffectDebugger(function () {
+    try {
+      setIsRtl(i18n.dir() === "rtl");
+    } catch (_unused) {
+      //
+    }
+  }, [i18n.language], "useIsRtl");
+  return isRtl;
+};
+
+exports.useIsRtl = useIsRtl;

package/dist/cjs/hooks/useNavigator.js

@@ -0,0 +1,36 @@
+'use strict';
+
+var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
+var react = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+var useNavigator = function useNavigator() {
+  var totalCount = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
+  var defaultIndex = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+  var _useState = react.useState(defaultIndex),
+    _useState2 = _slicedToArray(_useState, 2),
+    currentIndex = _useState2[0],
+    setCurrentIndex = _useState2[1];
+  var onNavigate = react.useCallback(function (dir) {
+    if (dir === -1) {
+      setCurrentIndex(currentIndex > 0 ? currentIndex - 1 : totalCount - 1);
+    }
+    if (dir === 1) {
+      setCurrentIndex(currentIndex + 1 < totalCount ? currentIndex + 1 : 0);
+    }
+  }, [currentIndex, totalCount]);
+  var headLabel = react.useMemo(function () {
+    return /*#__PURE__*/jsxRuntime.jsxs("span", {
+      className: "text-muted leading-none",
+      children: [currentIndex + 1, "/", totalCount]
+    });
+  }, [currentIndex, totalCount]);
+  return {
+    headLabel: headLabel,
+    onNavigate: onNavigate,
+    currentIndex: currentIndex,
+    setCurrentIndex: setCurrentIndex
+  };
+};
+
+exports.useNavigator = useNavigator;

package/dist/cjs/hooks/useOverlayService.js

@@ -0,0 +1,55 @@
+'use strict';
+
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
+var _asyncToGenerator = require('@babel/runtime/helpers/asyncToGenerator');
+var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
+var _regeneratorRuntime = require('@babel/runtime/regenerator');
+var react = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+var _excluded = ["onClose"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var useOverlayService = function useOverlayService(ModalOrFlyout) {
+  var _useState = react.useState(null),
+    _useState2 = _slicedToArray(_useState, 2),
+    Overlay = _useState2[0],
+    setOverlay = _useState2[1];
+  var openOverlay = /*#__PURE__*/function () {
+    var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+      var _ref2,
+        onClose,
+        props,
+        _args = arguments;
+      return _regeneratorRuntime.wrap(function _callee$(_context) {
+        while (1) switch (_context.prev = _context.next) {
+          case 0:
+            _ref2 = _args.length > 0 && _args[0] !== undefined ? _args[0] : {}, onClose = _ref2.onClose, props = _objectWithoutProperties(_ref2, _excluded);
+            _context.next = 3;
+            return new Promise(function (resolve) {
+              var handleClose = function handleClose(args) {
+                setOverlay(null);
+                resolve(args);
+                onClose === null || onClose === void 0 || onClose(args);
+              };
+              setOverlay( /*#__PURE__*/jsxRuntime.jsx(ModalOrFlyout, _objectSpread(_objectSpread({}, props), {}, {
+                onClose: handleClose
+              })));
+            });
+          case 3:
+            return _context.abrupt("return", _context.sent);
+          case 4:
+          case "end":
+            return _context.stop();
+        }
+      }, _callee);
+    }));
+    return function openOverlay() {
+      return _ref.apply(this, arguments);
+    };
+  }();
+  return [Overlay, openOverlay];
+};
+
+exports.useOverlayService = useOverlayService;

package/dist/cjs/hooks/usePropToggle.js

@@ -0,0 +1,40 @@
+'use strict';
+
+var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
+var react = require('react');
+var useEffectDebugger = require('./useEffectDebugger.js');
+
+/**
+ * hook to control boolean props
+ * @param isOn (is prop true)
+ * @param callback (optional callback)
+ * @param key (optional key to pass to callback)
+ * @returns
+ */
+var usePropToggle = function usePropToggle() {
+  var isOn = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
+  var onToggle = arguments.length > 1 ? arguments[1] : undefined;
+  var key = arguments.length > 2 ? arguments[2] : undefined;
+  var toggleRef = react.useRef(isOn);
+  var _useState = react.useState(isOn),
+    _useState2 = _slicedToArray(_useState, 2),
+    toggleOn = _useState2[0],
+    setToggleOn = _useState2[1];
+
+  /** ***************** update toggle state on change *******************/
+  useEffectDebugger.useLayoutEffectDebugger(function () {
+    toggleRef.current = isOn;
+    setToggleOn(isOn);
+  }, [isOn], "usePropToggle");
+
+  /** ***************** toggle handler *******************/
+  var doToggle = react.useCallback(function () {
+    if ((onToggle === null || onToggle === void 0 ? void 0 : onToggle(!toggleOn, key)) !== false) {
+      toggleRef.current = !toggleOn;
+      setToggleOn(!toggleOn);
+    }
+  }, [toggleOn, onToggle, key]);
+  return [toggleOn, doToggle, toggleRef];
+};
+
+exports.usePropToggle = usePropToggle;

package/dist/cjs/hooks/useResize.js

@@ -0,0 +1,75 @@
+'use strict';
+
+var react = require('react');
+var useIsRtl = require('./useIsRtl.js');
+
+/*
+ * React Fabric
+ * @version: 1.0.0
+ *
+ *
+ * The MIT License (MIT)
+ * Copyright (c) 2024 Adarsh Pastakia
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy of this software
+ * and associated documentation files (the "Software"), to deal in the Software without restriction,
+ * including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense,
+ * and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so,
+ * subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all copies or substantial
+ * portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED
+ * TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL
+ * THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT,
+ * TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+ */
+
+var useResize = function useResize(onResize, _ref) {
+  var _ref$isReverse = _ref.isReverse,
+    isReverse = _ref$isReverse === void 0 ? false : _ref$isReverse,
+    _ref$isVertical = _ref.isVertical,
+    isVertical = _ref$isVertical === void 0 ? false : _ref$isVertical,
+    onStart = _ref.onStart,
+    onEnd = _ref.onEnd;
+  var refEl = react.useRef(null);
+  var isRtl = useIsRtl.useIsRtl();
+  var onResizing = react.useCallback(function (evt) {
+    if (refEl.current != null) {
+      var _refEl$current;
+      /** ***************** check if reverse enabled of RTL *******************/
+      var reversed = ((isRtl ? 1 : 0) ^ (isReverse ? 1 : 0)) === 1;
+      var box = (_refEl$current = refEl.current) === null || _refEl$current === void 0 ? void 0 : _refEl$current.getBoundingClientRect();
+      var x = (evt.clientX - (reversed ? box.left : box.right)) * (reversed ? -1 : 1);
+      var y = evt.clientY - box.bottom;
+      onResize({
+        x: x,
+        y: y
+      });
+    }
+  }, [onResize, isRtl, isReverse]);
+
+  /** ***************** dettach handlers on mouseup *******************/
+  var onResizeEnd = react.useCallback(function () {
+    document.body.style.cursor = "unset";
+    document.removeEventListener("mousemove", onResizing);
+    document.removeEventListener("mouseup", onResizeEnd);
+    onEnd === null || onEnd === void 0 || onEnd();
+  }, [onEnd, onResizing]);
+
+  /** ***************** attach handlers on mousedown *******************/
+  var onResizeStart = react.useCallback(function (e) {
+    e.preventDefault();
+    document.body.style.cursor = isVertical ? "row-resize" : "col-resize";
+    document.addEventListener("mousemove", onResizing);
+    document.addEventListener("mouseup", onResizeEnd);
+    onStart === null || onStart === void 0 || onStart();
+  }, [onResizing, onResizeEnd, onStart]);
+  return {
+    ref: refEl,
+    onMouseDown: onResizeStart
+  };
+};
+
+exports.useResize = useResize;