@coreui/react 4.9.0-rc.0 → 5.0.0-alpha.0

package/dist/index.js

@@ -2477,6 +2477,54 @@ CSSTransition.propTypes = process.env.NODE_ENV !== "production" ? _extends({}, T
 }) : {};
 var CSSTransition$1 = CSSTransition;
 
+var getStoredTheme = function (localStorageItemName) {
+    return typeof window !== 'undefined' && localStorage.getItem(localStorageItemName);
+};
+var setStoredTheme = function (localStorageItemName, colorMode) {
+    return localStorage.setItem(localStorageItemName, colorMode);
+};
+var getPreferredColorScheme = function (localStorageItemName) {
+    if (typeof window === 'undefined') {
+        return 'light';
+    }
+    var storedTheme = getStoredTheme(localStorageItemName);
+    if (storedTheme) {
+        return storedTheme;
+    }
+    return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
+};
+var setTheme = function (colorMode) {
+    document.documentElement.dataset.coreuiTheme =
+        colorMode === 'auto' && window.matchMedia('(prefers-color-scheme: dark)').matches
+            ? 'dark'
+            : colorMode;
+    var event = new Event('ColorSchemeChange');
+    document.documentElement.dispatchEvent(event);
+};
+var useColorModes = function (localStorageItemName) {
+    if (localStorageItemName === void 0) { localStorageItemName = 'coreui-react-color-scheme'; }
+    var _a = React.useState(getPreferredColorScheme(localStorageItemName)), colorMode = _a[0], setColorMode = _a[1];
+    React.useEffect(function () {
+        if (colorMode) {
+            setStoredTheme(localStorageItemName, colorMode);
+            setTheme(colorMode);
+        }
+    }, [colorMode]);
+    React.useEffect(function () {
+        window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', function () {
+            var storedTheme = getStoredTheme(localStorageItemName);
+            if (storedTheme !== 'light' && storedTheme !== 'dark' && colorMode) {
+                setTheme(colorMode);
+            }
+        });
+    });
+    return {
+        colorMode: colorMode,
+        isColorModeSet: function () { return Boolean(getStoredTheme(localStorageItemName)); },
+        setColorMode: setColorMode,
+    };
+};
+
 // code borrowed from https://github.com/reach/reach-ui
 // problem described https://github.com/facebook/react/issues/13029
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -4834,6 +4882,16 @@ CCardTitle.propTypes = {
 };
 CCardTitle.displayName = 'CCardTitle';
 
+var isRTL = function (element) {
+    if (typeof document !== 'undefined' && document.documentElement.dir === 'rtl') {
+        return true;
+    }
+    if (element) {
+        return element.closest('[dir="rtl"]') !== null;
+    }
+    return false;
+};
+
 var getRTLPlacement = function (placement, element) {
     switch (placement) {
         case 'right': {
@@ -4856,16 +4914,6 @@ var isInViewport = function (element) {
         Math.floor(rect.right) <= (window.innerWidth || document.documentElement.clientWidth));
 };
 
-var isRTL = function (element) {
-    if (typeof document !== 'undefined' && document.documentElement.dir === 'rtl') {
-        return true;
-    }
-    if (element) {
-        return element.closest('[dir="rtl"]') !== null;
-    }
-    return false;
-};
-
 var CCarouselContext = React.createContext({});
 var CCarousel = React.forwardRef(function (_a, ref) {
     var children = _a.children, _b = _a.activeIndex, activeIndex = _b === void 0 ? 0 : _b, className = _a.className, controls = _a.controls, dark = _a.dark, indicators = _a.indicators, _c = _a.interval, interval = _c === void 0 ? 5000 : _c, onSlid = _a.onSlid, onSlide = _a.onSlide, _d = _a.pause, pause = _d === void 0 ? 'hover' : _d, _e = _a.touch, touch = _e === void 0 ? true : _e, transition = _a.transition, _f = _a.wrap, wrap = _f === void 0 ? true : _f, rest = __rest(_a, ["children", "activeIndex", "className", "controls", "dark", "indicators", "interval", "onSlid", "onSlide", "pause", "touch", "transition", "wrap"]);
@@ -7547,6 +7595,7 @@ exports.CWidgetStatsC = CWidgetStatsC;
 exports.CWidgetStatsD = CWidgetStatsD;
 exports.CWidgetStatsE = CWidgetStatsE;
 exports.CWidgetStatsF = CWidgetStatsF;
+exports.useColorModes = useColorModes;
 exports.useForkedRef = useForkedRef;
 exports.usePopper = usePopper;
 //# sourceMappingURL=index.js.map