@rescui/dropdown 0.11.1-RUI-297-Add-react-compiler-to-the-packages-build-dbbefd7b8.10 → 0.11.1-RUI-297-Add-react-compiler-to-the-packages-build-8aaaed4be.39

package/lib/dropdown.js

@@ -1,5 +1,7 @@
 "use client";
-import React, { useState, useRef, useEffect, useImperativeHandle, useContext, useCallback } from 'react';
+import _extends from '@babel/runtime-corejs3/helpers/esm/extends';
+import { c } from 'react-compiler-runtime';
+import React, { useState, useRef, useImperativeHandle, useContext, useEffect } from 'react';
 import PropTypes from 'prop-types';
 import cn from 'classnames';
 import { usePopper } from 'react-popper';
@@ -11,7 +13,7 @@ import { useDropdownState, DROPDOWN_STATES } from './use-dropdown-state.js';
 import { useScrollableContainer } from './use-scrollable-container.js';
 import styles from './dropdown.p.module.css.js';
 import { applyMaxSize, sameWidthModifier } from './custom-modifiers.js';
-import { extractThemeFromCss, extractPrimaryColors } from './css-vars-utils.js';
+import { useExtractCssValues } from './use-extract-css-values.js';
 
 function getPopperOptions(_ref) {
   let {
@@ -58,57 +60,126 @@ const Portal = _ref2 => {
   return target ? /*#__PURE__*/ReactDOM.createPortal(children, target) : null;
 };
 
-function useOnOutsideClick(_ref3) {
-  let {
+function useOnOutsideClick(t0) {
+  const $ = c(13);
+  const {
     onOutsideClick,
     isEnabled,
-    ignoreElements = [],
+    ignoreElements: t1,
     ownerDocument
-  } = _ref3;
-  const ignoreElementRefsExists = ignoreElements.length > 0 && ignoreElements.every(Boolean);
-  const handleDocumentClick = useCallback(e => {
-    for (const element of ignoreElements) {
-      if (!element || e.target === element || element.contains(e.target)) {
-        return;
+  } = t0;
+  let t2;
+
+  if ($[0] !== t1) {
+    t2 = t1 === undefined ? [] : t1;
+    $[0] = t1;
+    $[1] = t2;
+  } else {
+    t2 = $[1];
+  }
+
+  const ignoreElements = t2;
+  let t3;
+
+  if ($[2] !== ignoreElements) {
+    t3 = ignoreElements.length > 0 && ignoreElements.every(Boolean);
+    $[2] = ignoreElements;
+    $[3] = t3;
+  } else {
+    t3 = $[3];
+  }
+
+  const ignoreElementRefsExists = t3;
+  let t4;
+
+  if ($[4] !== ignoreElements || $[5] !== onOutsideClick) {
+    t4 = e => {
+      for (const element of ignoreElements) {
+        if (!element || e.target === element || element.contains(e.target)) {
+          return;
+        }
       }
-    }
 
-    onOutsideClick();
-  }, [onOutsideClick, ...ignoreElements]); // eslint-disable-next-line consistent-return
+      onOutsideClick();
+    };
+
+    $[4] = ignoreElements;
+    $[5] = onOutsideClick;
+    $[6] = t4;
+  } else {
+    t4 = $[6];
+  }
+
+  const handleDocumentClick = t4;
+  let t5;
+  let t6;
+
+  if ($[7] !== handleDocumentClick || $[8] !== ignoreElementRefsExists || $[9] !== isEnabled || $[10] !== ownerDocument) {
+    t5 = () => {
+      if (isEnabled && ignoreElementRefsExists && ownerDocument) {
+        ownerDocument.addEventListener("click", handleDocumentClick, true);
+        return () => ownerDocument.removeEventListener("click", handleDocumentClick, true);
+      }
+    };
 
-  useEffect(() => {
-    if (isEnabled && ignoreElementRefsExists && ownerDocument) {
-      ownerDocument.addEventListener('click', handleDocumentClick, true);
-      return () => ownerDocument.removeEventListener('click', handleDocumentClick, true);
-    }
-  }, [handleDocumentClick, ignoreElementRefsExists, isEnabled, ownerDocument]);
+    t6 = [handleDocumentClick, ignoreElementRefsExists, isEnabled, ownerDocument];
+    $[7] = handleDocumentClick;
+    $[8] = ignoreElementRefsExists;
+    $[9] = isEnabled;
+    $[10] = ownerDocument;
+    $[11] = t5;
+    $[12] = t6;
+  } else {
+    t5 = $[11];
+    t6 = $[12];
+  }
+
+  useEffect(t5, t6);
 }
 
-function useKeyPress(_ref4) {
-  let {
+function useKeyPress(t0) {
+  const $ = c(6);
+  const {
     key,
     onKeyPress,
     isEnabled,
     ownerDocument
-  } = _ref4;
-  useEffect(() => {
-    if (!isEnabled || !ownerDocument) {
-      return;
-    }
-
-    const keyDownHandler = e => {
-      if (e.key === key) {
-        e.preventDefault();
-        onKeyPress();
+  } = t0;
+  let t1;
+  let t2;
+
+  if ($[0] !== isEnabled || $[1] !== key || $[2] !== onKeyPress || $[3] !== ownerDocument) {
+    t1 = () => {
+      if (!isEnabled || !ownerDocument) {
+        return;
       }
-    };
 
-    ownerDocument.addEventListener('keydown', keyDownHandler, true); // eslint-disable-next-line consistent-return
+      const keyDownHandler = e => {
+        if (e.key === key) {
+          e.preventDefault();
+          onKeyPress();
+        }
+      };
 
-    return () => {
-      ownerDocument.removeEventListener('keydown', keyDownHandler, true);
+      ownerDocument.addEventListener("keydown", keyDownHandler, true);
+      return () => {
+        ownerDocument.removeEventListener("keydown", keyDownHandler, true);
+      };
     };
-  }, [isEnabled, key, onKeyPress, ownerDocument]);
+
+    t2 = [isEnabled, key, onKeyPress, ownerDocument];
+    $[0] = isEnabled;
+    $[1] = key;
+    $[2] = onKeyPress;
+    $[3] = ownerDocument;
+    $[4] = t1;
+    $[5] = t2;
+  } else {
+    t1 = $[4];
+    t2 = $[5];
+  }
+
+  useEffect(t1, t2);
 }
 
 const THEME_STYLES = {
@@ -120,165 +191,298 @@ const MODE_STYLES = {
   rock: styles.modeRock
 };
 
-const DropdownRender = (_ref5, externalRef) => {
-  let {
+const DropdownRender = (t0, externalRef) => {
+  const $ = c(60);
+  const {
     children,
     trigger,
     theme: themeFromProps,
-    isOpen: isOpenFromProps = false,
-    placement = 'bottom-start',
-    mode = 'classic',
-    // eslint-disable-next-line @typescript-eslint/no-empty-function
-    onRequestClose = () => {},
+    isOpen: t1,
+    placement: t2,
+    mode: t3,
+    onRequestClose: t4,
     minWidth,
     maxWidth,
     maxHeight,
     leastMaxHeight,
-    cancelCloseAnimation = false,
+    cancelCloseAnimation: t5,
     className,
-    closeOnEsc = true,
-    closeOnTab = false,
-    disableFocusLock = false,
-    renderInTrigger = false,
-    disableFlip = false
-  } = _ref5;
+    closeOnEsc: t6,
+    closeOnTab: t7,
+    disableFocusLock: t8,
+    renderInTrigger: t9,
+    disableFlip: t10
+  } = t0;
+  const isOpenFromProps = t1 === undefined ? false : t1;
+  const placement = t2 === undefined ? "bottom-start" : t2;
+  const mode = t3 === undefined ? "classic" : t3;
+  const onRequestClose = t4 === undefined ? _temp : t4;
+  const cancelCloseAnimation = t5 === undefined ? false : t5;
+  const closeOnEsc = t6 === undefined ? true : t6;
+  const closeOnTab = t7 === undefined ? false : t7;
+  const disableFocusLock = t8 === undefined ? false : t8;
+  const renderInTrigger = t9 === undefined ? false : t9;
+  const disableFlip = t10 === undefined ? false : t10;
   const [popperRef, setPopperRef] = useState(null);
-  const [triggerRef, setTriggerRef] = useState(null);
+  const [triggerRef, setTriggerRef] = useState(undefined);
   const {
     setContentEl,
     scrollableStyles
   } = useScrollableContainer();
-  const scrollableRef = useRef(null); // We set isOpen this way to avoid hydration issue due to
-  // the Portal to document.body which does not exist on the server.
-  // So even if isOpen prop is used, the tooltip will not render on the server, and
-  // it's the same on the first client render, so there is no hydration issue.
-
-  const [isFirstRender, setIsFirstRender] = useState(true);
-  useEffect(() => {
-    setIsFirstRender(false);
-  }, []);
-  const isOpen = isFirstRender && !renderInTrigger ? false : isOpenFromProps;
+  const scrollableRef = useRef(null);
+  const isOpen = typeof triggerRef !== "undefined" || renderInTrigger ? isOpenFromProps : false;
   const ownerDocument = triggerRef?.ownerDocument;
-  useOnOutsideClick({
-    isEnabled: isOpen,
-    onOutsideClick: onRequestClose,
-    ignoreElements: [popperRef, triggerRef],
-    ownerDocument
-  });
-  useKeyPress({
-    key: 'Escape',
-    isEnabled: isOpen && closeOnEsc,
-    onKeyPress: onRequestClose,
-    ownerDocument
-  });
-  useKeyPress({
-    key: 'Tab',
-    isEnabled: isOpen && closeOnTab,
-    onKeyPress: onRequestClose,
-    ownerDocument
-  });
-  const [handleAnimationEnd, dropdownState] = useDropdownState(isOpen, cancelCloseAnimation);
+  let t11;
+
+  if ($[0] !== popperRef || $[1] !== triggerRef) {
+    t11 = [popperRef, triggerRef];
+    $[0] = popperRef;
+    $[1] = triggerRef;
+    $[2] = t11;
+  } else {
+    t11 = $[2];
+  }
+
+  const outsideClickIgnoreElements = t11;
+  let t12;
+
+  if ($[3] !== isOpen || $[4] !== onRequestClose || $[5] !== outsideClickIgnoreElements || $[6] !== ownerDocument) {
+    t12 = {
+      isEnabled: isOpen,
+      onOutsideClick: onRequestClose,
+      ignoreElements: outsideClickIgnoreElements,
+      ownerDocument
+    };
+    $[3] = isOpen;
+    $[4] = onRequestClose;
+    $[5] = outsideClickIgnoreElements;
+    $[6] = ownerDocument;
+    $[7] = t12;
+  } else {
+    t12 = $[7];
+  }
+
+  useOnOutsideClick(t12);
+  const t13 = isOpen && closeOnEsc;
+  let t14;
+
+  if ($[8] !== onRequestClose || $[9] !== ownerDocument || $[10] !== t13) {
+    t14 = {
+      key: "Escape",
+      isEnabled: t13,
+      onKeyPress: onRequestClose,
+      ownerDocument
+    };
+    $[8] = onRequestClose;
+    $[9] = ownerDocument;
+    $[10] = t13;
+    $[11] = t14;
+  } else {
+    t14 = $[11];
+  }
+
+  useKeyPress(t14);
+  const t15 = isOpen && closeOnTab;
+  let t16;
+
+  if ($[12] !== onRequestClose || $[13] !== ownerDocument || $[14] !== t15) {
+    t16 = {
+      key: "Tab",
+      isEnabled: t15,
+      onKeyPress: onRequestClose,
+      ownerDocument
+    };
+    $[12] = onRequestClose;
+    $[13] = ownerDocument;
+    $[14] = t15;
+    $[15] = t16;
+  } else {
+    t16 = $[15];
+  }
+
+  useKeyPress(t16);
+  let t17;
+
+  if ($[16] !== disableFlip || $[17] !== leastMaxHeight || $[18] !== maxHeight || $[19] !== maxWidth || $[20] !== minWidth || $[21] !== placement) {
+    t17 = getPopperOptions({
+      placement,
+      maxHeight,
+      leastMaxHeight,
+      minWidth,
+      maxWidth,
+      disableFlip
+    });
+    $[16] = disableFlip;
+    $[17] = leastMaxHeight;
+    $[18] = maxHeight;
+    $[19] = maxWidth;
+    $[20] = minWidth;
+    $[21] = placement;
+    $[22] = t17;
+  } else {
+    t17 = $[22];
+  }
+
   const {
     styles: popperStyles,
     attributes,
     update
-  } = usePopper(triggerRef, popperRef, getPopperOptions({
-    placement,
-    maxHeight,
-    leastMaxHeight,
-    minWidth,
-    maxWidth,
-    disableFlip
-  }));
-  useImperativeHandle(externalRef, () => ({
-    scheduleUpdate: () => {
-      if (update) {
-        update();
+  } = usePopper(triggerRef ?? null, popperRef, t17);
+  const resolvedPlacement = attributes.popper?.["data-popper-placement"] ?? null;
+  let t18;
+
+  if ($[23] !== cancelCloseAnimation || $[24] !== isOpen || $[25] !== popperRef || $[26] !== resolvedPlacement) {
+    t18 = {
+      isOpen,
+      cancelCloseAnimation,
+      contentRef: scrollableRef,
+      popperElement: popperRef,
+      resolvedPlacement
+    };
+    $[23] = cancelCloseAnimation;
+    $[24] = isOpen;
+    $[25] = popperRef;
+    $[26] = resolvedPlacement;
+    $[27] = t18;
+  } else {
+    t18 = $[27];
+  }
+
+  const dropdownState = useDropdownState(t18);
+  let t19;
+
+  if ($[28] !== update) {
+    t19 = () => ({
+      scheduleUpdate: () => {
+        update?.();
       }
-    }
-  }));
+    });
+
+    $[28] = update;
+    $[29] = t19;
+  } else {
+    t19 = $[29];
+  }
+
+  useImperativeHandle(externalRef, t19);
   const {
     dropdownZIndex
   } = useLayeringContext();
-  const triggerRenderer = typeof trigger === 'function' ? trigger({
-    ref: setTriggerRef
-  }) : /*#__PURE__*/React.createElement("span", {
-    "data-test": "dropdown-trigger",
-    className: styles.triggerWrapper,
-    ref: setTriggerRef
-  }, trigger);
-  const dropdownShouldBeRendered = dropdownState !== DROPDOWN_STATES.CLOSE;
-  const wrapperShouldBeHidden = dropdownState === DROPDOWN_STATES.CLOSING;
-  let primaryColors = {};
-  let themeFromCss = 'light';
-
-  if (triggerRef && dropdownShouldBeRendered) {
-    // In theory this part of the code might cause issues with SSR.
-    // But in this specific context, because of the nature of the state-ref "triggerRef",
-    // we are sure that the dropdown wouldn't be rendered on the first client render.
-    // Therefore, the first render on the client will be the same as on the server.
-    const triggerStyles = ownerDocument?.defaultView?.getComputedStyle(triggerRef);
-
-    if (triggerStyles) {
-      themeFromCss = extractThemeFromCss(triggerStyles);
-      primaryColors = extractPrimaryColors(triggerStyles);
-    }
+  let t20;
+
+  if ($[30] !== trigger) {
+    t20 = typeof trigger === "function" ? trigger({
+      ref: setTriggerRef
+    }) : /*#__PURE__*/React.createElement("span", {
+      "data-test": "dropdown-trigger",
+      className: styles.triggerWrapper,
+      ref: setTriggerRef
+    }, trigger);
+    $[30] = trigger;
+    $[31] = t20;
+  } else {
+    t20 = $[31];
   }
 
+  const triggerRenderer = t20;
+  const dropdownShouldBeRendered = dropdownState !== DROPDOWN_STATES.CLOSE;
+  const wrapperIsInitial = dropdownState === DROPDOWN_STATES.OPENING_PREPARE;
+  const wrapperShouldBeHidden = wrapperIsInitial || dropdownState === DROPDOWN_STATES.CLOSING;
+  const {
+    primaryColors,
+    themeFromCss
+  } = useExtractCssValues(triggerRef, dropdownShouldBeRendered, ownerDocument?.defaultView);
   const {
     theme: themeFromContext,
     noProvider
   } = useContext(ThemeContext);
   const theme = themeFromProps || (noProvider ? themeFromCss : themeFromContext);
-  const childrenTheme = mode === 'rock' ? getInverseTheme(theme) : theme; // immediately fire handleAnimationEnd event on visibility change in case transition is disabled
-  // it may happen if the user hard-disabled all transitions in his browser
+  let t21;
+
+  if ($[32] !== mode || $[33] !== theme) {
+    t21 = mode === "rock" ? getInverseTheme(theme) : theme;
+    $[32] = mode;
+    $[33] = theme;
+    $[34] = t21;
+  } else {
+    t21 = $[34];
+  }
 
-  useEffect(() => {
-    if (dropdownShouldBeRendered && scrollableRef.current) {
-      const ownerWindow = scrollableRef.current.ownerDocument.defaultView;
-      const isTransitionDisabled = ownerWindow?.getComputedStyle(scrollableRef.current).transitionDuration === '0s';
+  const childrenTheme = t21;
+  let t22;
 
-      if (isTransitionDisabled) {
-        handleAnimationEnd();
+  if ($[35] !== attributes.popper || $[36] !== children || $[37] !== childrenTheme || $[38] !== className || $[39] !== disableFocusLock || $[40] !== dropdownShouldBeRendered || $[41] !== dropdownState || $[42] !== dropdownZIndex || $[43] !== maxHeight || $[44] !== mode || $[45] !== noProvider || $[46] !== ownerDocument?.body || $[47] !== popperStyles || $[48] !== primaryColors || $[49] !== renderInTrigger || $[50] !== scrollableStyles || $[51] !== setContentEl || $[52] !== theme || $[53] !== triggerRef || $[54] !== wrapperIsInitial || $[55] !== wrapperShouldBeHidden) {
+    t22 = dropdownShouldBeRendered && /*#__PURE__*/React.createElement(Portal, {
+      target: renderInTrigger ? triggerRef : ownerDocument?.body
+    }, /*#__PURE__*/React.createElement("div", _extends({
+      ref: setPopperRef,
+      style: {
+        maxHeight,
+        ...popperStyles.popper,
+        zIndex: dropdownZIndex,
+        ...primaryColors
+      },
+      className: cn(styles.dropdown, className, MODE_STYLES[mode], THEME_STYLES[theme]),
+      "data-test": "dropdown"
+    }, attributes.popper), /*#__PURE__*/React.createElement(LayeringProvider, {
+      baseLayer: "dropdown"
+    }, /*#__PURE__*/React.createElement("div", {
+      ref: scrollableRef,
+      style: scrollableStyles,
+      className: cn(styles.contentWrapper, wrapperIsInitial && styles.wrapperInitial, wrapperShouldBeHidden && styles.wrapperHidden),
+      "data-test": "dropdown-content"
+    }, /*#__PURE__*/React.createElement(ThemeProvider, {
+      ignoreThemeValueForCSSApi: noProvider,
+      theme: childrenTheme
+    }, /*#__PURE__*/React.createElement(FocusLock, {
+      className: THEME_STYLES[childrenTheme],
+      ref: setContentEl,
+      disabled: dropdownState === DROPDOWN_STATES.CLOSING || disableFocusLock,
+      returnFocus: {
+        preventScroll: true
+      },
+      focusOptions: {
+        preventScroll: true
       }
-    }
-  }, [handleAnimationEnd, dropdownShouldBeRendered]);
-  return /*#__PURE__*/React.createElement(React.Fragment, null, triggerRenderer, dropdownShouldBeRendered && /*#__PURE__*/React.createElement(Portal, {
-    target: renderInTrigger ? triggerRef : ownerDocument?.body
-  }, /*#__PURE__*/React.createElement("div", {
-    ref: setPopperRef,
-    style: {
-      maxHeight,
-      ...popperStyles.popper,
-      zIndex: dropdownZIndex,
-      ...primaryColors
-    },
-    className: cn(styles.dropdown, className, MODE_STYLES[mode], THEME_STYLES[theme]),
-    "data-test": "dropdown",
-    ...attributes.popper
-  }, /*#__PURE__*/React.createElement(LayeringProvider, {
-    baseLayer: 'dropdown'
-  }, /*#__PURE__*/React.createElement("div", {
-    ref: scrollableRef,
-    style: scrollableStyles,
-    className: cn(styles.contentWrapper, wrapperShouldBeHidden && styles.wrapperHidden),
-    onTransitionEnd: handleAnimationEnd,
-    onAnimationEnd: handleAnimationEnd,
-    "data-test": "dropdown-content"
-  }, /*#__PURE__*/React.createElement(ThemeProvider, {
-    ignoreThemeValueForCSSApi: noProvider,
-    theme: childrenTheme
-  }, /*#__PURE__*/React.createElement(FocusLock, {
-    className: THEME_STYLES[childrenTheme],
-    ref: setContentEl,
-    disabled: dropdownState !== DROPDOWN_STATES.OPEN || disableFocusLock,
-    returnFocus: {
-      preventScroll: true
-    },
-    focusOptions: {
-      preventScroll: true
-    }
-  }, children)))))));
+    }, children))))));
+    $[35] = attributes.popper;
+    $[36] = children;
+    $[37] = childrenTheme;
+    $[38] = className;
+    $[39] = disableFocusLock;
+    $[40] = dropdownShouldBeRendered;
+    $[41] = dropdownState;
+    $[42] = dropdownZIndex;
+    $[43] = maxHeight;
+    $[44] = mode;
+    $[45] = noProvider;
+    $[46] = ownerDocument?.body;
+    $[47] = popperStyles;
+    $[48] = primaryColors;
+    $[49] = renderInTrigger;
+    $[50] = scrollableStyles;
+    $[51] = setContentEl;
+    $[52] = theme;
+    $[53] = triggerRef;
+    $[54] = wrapperIsInitial;
+    $[55] = wrapperShouldBeHidden;
+    $[56] = t22;
+  } else {
+    t22 = $[56];
+  }
+
+  let t23;
+
+  if ($[57] !== t22 || $[58] !== triggerRenderer) {
+    t23 = /*#__PURE__*/React.createElement(React.Fragment, null, triggerRenderer, t22);
+    $[57] = t22;
+    $[58] = triggerRenderer;
+    $[59] = t23;
+  } else {
+    t23 = $[59];
+  }
+
+  return t23;
 };
 /* eslint-enable react/prop-types */
 
@@ -298,4 +502,7 @@ Dropdown.propTypes = {
   renderInTrigger: PropTypes.bool,
   disableFlip: PropTypes.bool
 };
+
+function _temp() {}
+
 export { Dropdown, Dropdown as default };

package/lib/dropdown.p.module.css.js

@@ -1,15 +1,12 @@
 var styles = {
-  "themeLight": "_themeLight_60may_59",
-  "themeDark": "_themeDark_60may_62",
-  "dropdown": "_dropdown_60may_66",
-  "triggerWrapper": "_triggerWrapper_60may_73",
-  "contentWrapper": "_contentWrapper_60may_77",
-  "fadeInBottomToTop": "_fadeInBottomToTop_60may_1",
-  "fadeInTopToBottom": "_fadeInTopToBottom_60may_1",
-  "fadeInLeftToRight": "_fadeInLeftToRight_60may_1",
-  "fadeInRightToLeft": "_fadeInRightToLeft_60may_1",
-  "wrapperHidden": "_wrapperHidden_60may_110",
-  "modeClassic": "_modeClassic_60may_130",
-  "modeRock": "_modeRock_60may_134"
+  "themeLight": "_themeLight_1l8zv6n_7",
+  "themeDark": "_themeDark_1l8zv6n_10",
+  "dropdown": "_dropdown_1l8zv6n_14",
+  "triggerWrapper": "_triggerWrapper_1l8zv6n_21",
+  "contentWrapper": "_contentWrapper_1l8zv6n_25",
+  "wrapperInitial": "_wrapperInitial_1l8zv6n_41",
+  "wrapperHidden": "_wrapperHidden_1l8zv6n_45",
+  "modeClassic": "_modeClassic_1l8zv6n_65",
+  "modeRock": "_modeRock_1l8zv6n_69"
 };
 export { styles as default };

package/lib/index.css

@@ -1,58 +1,15 @@
-@keyframes _fadeInTopToBottom_60may_1{
-  0%{
-    opacity:0;
-
-    transform:translateY(-10px);
-  }
-  100%{
-    opacity:1;
-
-    transform:none;
-  }
-}
-@keyframes _fadeInBottomToTop_60may_1{
-  0%{
-    opacity:0;
-
-    transform:translateY(10px);
-  }
-  100%{
-    opacity:1;
-
-    transform:none;
-  }
+@property --_rs-theme-dark-coefficient{
+  syntax:'<number>';
+  inherits:true;
+  initial-value:0;
 }
-@keyframes _fadeInLeftToRight_60may_1{
-  0%{
-    opacity:0;
-
-    transform:translateX(-10px);
-  }
-  100%{
-    opacity:1;
-
-    transform:none;
-  }
-}
-@keyframes _fadeInRightToLeft_60may_1{
-  0%{
-    opacity:0;
-
-    transform:translateX(10px);
-  }
-  100%{
-    opacity:1;
-
-    transform:none;
-  }
-}
-._themeLight_60may_59{
+._themeLight_1l8zv6n_7{
   --rs-theme-dark:0;
 }
-._themeDark_60may_62{
+._themeDark_1l8zv6n_10{
   --rs-theme-dark:1;
 }
-._dropdown_60may_66{
+._dropdown_1l8zv6n_14{
   --_rs-theme-dark:var(
     --_rs-internal-force-theme-dark-consult-rescui-before-using,
     var(--rs-theme-dark, 0)
@@ -62,7 +19,7 @@
   --_rs-theme-light-coefficient:calc(1 - var(--_rs-theme-dark-coefficient));
 }
 @supports (color: color-mix(in srgb, #fff 50%, #000 50%)){
-._dropdown_60may_66{
+._dropdown_1l8zv6n_14{
     --_rs-color-primary:color-mix(in srgb, var(--rs-color-primary-light-theme, #6B57FF) calc(100%*var(--_rs-theme-light-coefficient, 1)), var(--rs-color-primary-dark-theme, #8473FF) calc(100%*var(--_rs-theme-dark-coefficient, 0)));
     --_rs-color-primary-dim:color-mix(in srgb, var(--rs-color-primary-dim-light-theme, #8979ff) calc(100%*var(--_rs-theme-light-coefficient, 1)), var(--rs-color-primary-dim-dark-theme, #6f61d2) calc(100%*var(--_rs-theme-dark-coefficient, 0)));
     --_rs-color-primary-fog:color-mix(in srgb, var(--rs-color-primary-fog-light-theme, #e1ddff) calc(100%*var(--_rs-theme-light-coefficient, 1)), var(--rs-color-primary-fog-dark-theme, #2e2b49) calc(100%*var(--_rs-theme-dark-coefficient, 0)));
@@ -71,7 +28,7 @@
 }
   }
 @supports not (color: color-mix(in srgb, #fff 50%, #000 50%)){
-._dropdown_60may_66{
+._dropdown_1l8zv6n_14{
     --_rs-color-primary:rgb(calc(var(--_rs-theme-light-coefficient, 1)*107 + var(--_rs-theme-dark-coefficient, 0)*132), calc(var(--_rs-theme-light-coefficient, 1)*87 + var(--_rs-theme-dark-coefficient, 0)*115), 255);
     --_rs-color-primary-dim:rgb(calc(var(--_rs-theme-light-coefficient, 1)*137 + var(--_rs-theme-dark-coefficient, 0)*111), calc(var(--_rs-theme-light-coefficient, 1)*121 + var(--_rs-theme-dark-coefficient, 0)*97), calc(var(--_rs-theme-light-coefficient, 1)*255 + var(--_rs-theme-dark-coefficient, 0)*210));
     --_rs-color-primary-fog:rgb(calc(var(--_rs-theme-light-coefficient, 1)*225 + var(--_rs-theme-dark-coefficient, 0)*46), calc(var(--_rs-theme-light-coefficient, 1)*221 + var(--_rs-theme-dark-coefficient, 0)*43), calc(var(--_rs-theme-light-coefficient, 1)*255 + var(--_rs-theme-dark-coefficient, 0)*73));
@@ -79,14 +36,14 @@
     --_rs-color-primary-t-fog:rgba(calc(var(--_rs-theme-light-coefficient, 1)*107 + var(--_rs-theme-dark-coefficient, 0)*132), calc(var(--_rs-theme-light-coefficient, 1)*87 + var(--_rs-theme-dark-coefficient, 0)*115), 255, calc(var(--_rs-theme-light-coefficient, 1)*0.2 + var(--_rs-theme-dark-coefficient, 0)*0.3));
 }
   }
-._dropdown_60may_66 {
+._dropdown_1l8zv6n_14 {
   display:flex;
   flex-direction:column;
 }
-._triggerWrapper_60may_73{
+._triggerWrapper_1l8zv6n_21{
   display:inline-block;
 }
-._contentWrapper_60may_77{
+._contentWrapper_1l8zv6n_25{
   position:relative;
 
   display:block;
@@ -98,42 +55,36 @@
   background-clip:padding-box;
   box-shadow:0 0 0 1px rgb(calc(209 - var(--_rs-theme-dark-coefficient, 0)*138), calc(209 - var(--_rs-theme-dark-coefficient, 0)*138), calc(210 - var(--_rs-theme-dark-coefficient, 0)*137));
 
-  transition:opacity var(--rs-transition-function, linear) 200ms, transform var(--rs-transition-function, linear) 200ms;
-}
-[data-popper-placement^='top'] ._contentWrapper_60may_77{
-  animation:_fadeInBottomToTop_60may_1 var(--rs-transition-function, ease) 200ms;
-}
-[data-popper-placement^='bottom'] ._contentWrapper_60may_77{
-  animation:_fadeInTopToBottom_60may_1 var(--rs-transition-function, ease) 200ms;
+  transition:opacity var(--rs-transition-function, ease) 200ms, transform var(--rs-transition-function, ease) 200ms;
 }
-[data-popper-placement^='right'] ._contentWrapper_60may_77{
-  animation:_fadeInLeftToRight_60may_1 var(--rs-transition-function, ease) 200ms;
+._wrapperInitial_1l8zv6n_41{
+  transition:none;
 }
-[data-popper-placement^='left'] ._contentWrapper_60may_77{
-  animation:_fadeInRightToLeft_60may_1 var(--rs-transition-function, ease) 200ms;
-}
-._wrapperHidden_60may_110{
+._wrapperHidden_1l8zv6n_45{
   opacity:0;
 }
-[data-popper-placement^='top'] ._wrapperHidden_60may_110{
+[data-popper-placement^='top'] ._wrapperHidden_1l8zv6n_45{
   transform:translateY(10px);
 }
-[data-popper-placement^='bottom'] ._wrapperHidden_60may_110{
+[data-popper-placement^='bottom'] ._wrapperHidden_1l8zv6n_45{
   transform:translateY(-10px);
 }
-[data-popper-placement^='right'] ._wrapperHidden_60may_110{
+[data-popper-placement^='right'] ._wrapperHidden_1l8zv6n_45{
   transform:translateX(-10px);
 }
-[data-popper-placement^='left'] ._wrapperHidden_60may_110{
+[data-popper-placement^='left'] ._wrapperHidden_1l8zv6n_45{
   transform:translateX(10px);
 }
-._modeClassic_60may_130 ._contentWrapper_60may_77{
+._modeClassic_1l8zv6n_65 ._contentWrapper_1l8zv6n_25{
   background-color:rgb(calc(255 - var(--_rs-theme-dark-coefficient, 0)*230), calc(255 - var(--_rs-theme-dark-coefficient, 0)*230), calc(255 - var(--_rs-theme-dark-coefficient, 0)*227));
 }
-._modeRock_60may_134 ._contentWrapper_60may_77{
+._modeRock_1l8zv6n_69 ._contentWrapper_1l8zv6n_25{
   background-color:rgb(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227));
 }
-._modeRock_60may_134{
+._modeClassic_1l8zv6n_65._themeDark_1l8zv6n_10 ._contentWrapper_1l8zv6n_25, ._modeRock_1l8zv6n_69._themeLight_1l8zv6n_7 ._contentWrapper_1l8zv6n_25{
+    color-scheme:dark;
+  }
+._modeRock_1l8zv6n_69{
   --rs-parent-color-primary-light-theme:var(--rs-color-primary-light-theme);
   --rs-parent-color-primary-dim-light-theme:var(
     --rs-color-primary-dim-light-theme
@@ -162,7 +113,7 @@
     --rs-color-primary-t-fog-dark-theme
   );
 }
-._modeRock_60may_134 > *{
+._modeRock_1l8zv6n_69 > *{
   --rs-color-primary-dark-theme:var(--rs-parent-color-primary-light-theme);
   --rs-color-primary-dim-dark-theme:var(
     --rs-parent-color-primary-dim-light-theme

package/lib/use-dropdown-state.d.ts

@@ -1,7 +1,17 @@
+import type { RefObject } from 'react';
 export declare enum DROPDOWN_STATES {
+    OPENING_PREPARE = "OPENING_PREPARE",
     OPENING = "OPENING",
     OPEN = "OPEN",
     CLOSING = "CLOSING",
     CLOSE = "CLOSE"
 }
-export declare function useDropdownState(isOpen: boolean, cancelCloseAnimation?: boolean): [() => void, DROPDOWN_STATES];
+type UseDropdownStateOptions = {
+    isOpen: boolean;
+    cancelCloseAnimation?: boolean;
+    contentRef: RefObject<HTMLDivElement | null>;
+    popperElement: HTMLElement | null;
+    resolvedPlacement: string | null;
+};
+export declare function useDropdownState({ isOpen, cancelCloseAnimation, contentRef, popperElement, resolvedPlacement }: UseDropdownStateOptions): DROPDOWN_STATES;
+export {};

package/lib/use-dropdown-state.js

@@ -1,36 +1,196 @@
 "use client";
-import { useState, useRef, useCallback } from 'react';
+import { c } from 'react-compiler-runtime';
+import { useState, useEffect, useLayoutEffect } from 'react';
+const useIsomorphicLayoutEffect = typeof window === 'undefined' ? useEffect : useLayoutEffect;
+const DROPDOWN_TRANSITION_PROPERTIES = ['opacity', 'transform'];
+
+const getDropdownTransition = (element, property) => element.getAnimations().find(animation => animation.transitionProperty === property);
+
 var DROPDOWN_STATES;
 
 (function (DROPDOWN_STATES) {
+  DROPDOWN_STATES["OPENING_PREPARE"] = "OPENING_PREPARE";
   DROPDOWN_STATES["OPENING"] = "OPENING";
   DROPDOWN_STATES["OPEN"] = "OPEN";
   DROPDOWN_STATES["CLOSING"] = "CLOSING";
   DROPDOWN_STATES["CLOSE"] = "CLOSE";
 })(DROPDOWN_STATES || (DROPDOWN_STATES = {}));
 
-function useDropdownState(isOpen, cancelCloseAnimation) {
-  const [, setDummyState] = useState(false);
-  const stateRef = useRef(DROPDOWN_STATES.CLOSE);
-  const onAnimationEnd = useCallback(() => {
-    if ((stateRef.current === DROPDOWN_STATES.CLOSING || stateRef.current === DROPDOWN_STATES.OPENING) && !isOpen) {
-      stateRef.current = DROPDOWN_STATES.CLOSE; //force rerender
+function useDropdownState(t0) {
+  const $ = c(16);
+  const {
+    isOpen,
+    cancelCloseAnimation,
+    contentRef,
+    popperElement,
+    resolvedPlacement
+  } = t0;
+  const [dropdownState, setDropdownState] = useState(isOpen ? DROPDOWN_STATES.OPENING_PREPARE : DROPDOWN_STATES.CLOSE);
+  let t1;
 
-      setDummyState(s => !s);
-    } else if (stateRef.current === DROPDOWN_STATES.OPENING && isOpen) {
-      stateRef.current = DROPDOWN_STATES.OPEN; //force rerender
+  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+    t1 = expectedState => {
+      setDropdownState(state => {
+        if (state !== expectedState) {
+          return state;
+        }
 
-      setDummyState(s => !s);
-    }
-  }, [isOpen]);
+        if (expectedState === DROPDOWN_STATES.CLOSING) {
+          return DROPDOWN_STATES.CLOSE;
+        }
+
+        if (expectedState === DROPDOWN_STATES.OPENING) {
+          return DROPDOWN_STATES.OPEN;
+        }
+
+        return state;
+      });
+    };
+
+    $[0] = t1;
+  } else {
+    t1 = $[0];
+  }
+
+  const completeTransition = t1;
+  let t2;
+
+  if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
+    t2 = () => {
+      setDropdownState(_temp);
+    };
+
+    $[1] = t2;
+  } else {
+    t2 = $[1];
+  }
+
+  const completeOpeningPreparation = t2;
+  let t3;
+  let t4;
+
+  if ($[2] !== contentRef || $[3] !== dropdownState || $[4] !== popperElement || $[5] !== resolvedPlacement) {
+    t3 = () => {
+      const contentElement = contentRef.current;
+
+      if (dropdownState !== DROPDOWN_STATES.OPENING_PREPARE || !popperElement || !contentElement || !resolvedPlacement) {
+        return;
+      }
+
+      contentElement.getBoundingClientRect();
+      completeOpeningPreparation();
+    };
+
+    t4 = [completeOpeningPreparation, contentRef, dropdownState, popperElement, resolvedPlacement];
+    $[2] = contentRef;
+    $[3] = dropdownState;
+    $[4] = popperElement;
+    $[5] = resolvedPlacement;
+    $[6] = t3;
+    $[7] = t4;
+  } else {
+    t3 = $[6];
+    t4 = $[7];
+  }
+
+  useIsomorphicLayoutEffect(t3, t4);
+  let t5;
+
+  if ($[8] !== contentRef || $[9] !== dropdownState) {
+    t5 = () => {
+      if (dropdownState !== DROPDOWN_STATES.OPENING && dropdownState !== DROPDOWN_STATES.CLOSING) {
+        return;
+      }
+
+      const contentElement_0 = contentRef.current;
 
-  if (isOpen && stateRef.current !== DROPDOWN_STATES.OPEN) {
-    stateRef.current = DROPDOWN_STATES.OPENING;
-  } else if (stateRef.current === DROPDOWN_STATES.OPEN && !isOpen) {
-    stateRef.current = cancelCloseAnimation ? DROPDOWN_STATES.CLOSE : DROPDOWN_STATES.CLOSING;
+      if (!contentElement_0) {
+        return;
+      }
+
+      let isCurrentPhase = true;
+
+      const completeCurrentPhase = () => {
+        if (isCurrentPhase) {
+          completeTransition(dropdownState);
+        }
+      };
+
+      const waitForCurrentTransition = (property, previousTransition) => {
+        if (!isCurrentPhase) {
+          return Promise.resolve();
+        }
+
+        const transition = getDropdownTransition(contentElement_0, property);
+
+        if (!transition || transition === previousTransition) {
+          return Promise.resolve();
+        }
+
+        return transition.finished.then(() => {
+          if (!isCurrentPhase) {
+            return Promise.resolve();
+          }
+
+          const replacementTransition = getDropdownTransition(contentElement_0, property);
+
+          if (replacementTransition && replacementTransition !== transition) {
+            return waitForCurrentTransition(property, transition);
+          }
+
+          return Promise.resolve();
+        }, () => waitForCurrentTransition(property, transition));
+      };
+
+      Promise.all(DROPDOWN_TRANSITION_PROPERTIES.map(property_0 => waitForCurrentTransition(property_0))).then(completeCurrentPhase);
+      return () => {
+        isCurrentPhase = false;
+      };
+    };
+
+    $[8] = contentRef;
+    $[9] = dropdownState;
+    $[10] = t5;
+  } else {
+    t5 = $[10];
+  }
+
+  let t6;
+
+  if ($[11] !== contentRef || $[12] !== dropdownState || $[13] !== popperElement || $[14] !== resolvedPlacement) {
+    t6 = [completeTransition, contentRef, dropdownState, popperElement, resolvedPlacement];
+    $[11] = contentRef;
+    $[12] = dropdownState;
+    $[13] = popperElement;
+    $[14] = resolvedPlacement;
+    $[15] = t6;
+  } else {
+    t6 = $[15];
+  }
+
+  useIsomorphicLayoutEffect(t5, t6);
+
+  if (isOpen && dropdownState === DROPDOWN_STATES.CLOSE) {
+    setDropdownState(DROPDOWN_STATES.OPENING_PREPARE);
+  } else {
+    if (isOpen && dropdownState === DROPDOWN_STATES.CLOSING) {
+      setDropdownState(DROPDOWN_STATES.OPENING);
+    } else {
+      if (!isOpen && dropdownState === DROPDOWN_STATES.OPENING_PREPARE) {
+        setDropdownState(DROPDOWN_STATES.CLOSE);
+      } else {
+        if (!isOpen && (dropdownState === DROPDOWN_STATES.OPEN || dropdownState === DROPDOWN_STATES.OPENING)) {
+          setDropdownState(cancelCloseAnimation ? DROPDOWN_STATES.CLOSE : DROPDOWN_STATES.CLOSING);
+        }
+      }
+    }
   }
 
-  return [onAnimationEnd, stateRef.current];
+  return dropdownState;
+}
+
+function _temp(state_0) {
+  return state_0 === DROPDOWN_STATES.OPENING_PREPARE ? DROPDOWN_STATES.OPENING : state_0;
 }
 
 export { DROPDOWN_STATES, useDropdownState };

package/lib/use-extract-css-values.d.ts

@@ -0,0 +1,5 @@
+import type { Theme } from '@rescui/ui-contexts';
+export declare const useExtractCssValues: (triggerRef: Element | null | undefined, shouldBeRendered: boolean, defaultView: Window | undefined) => {
+    primaryColors: Record<string, string>;
+    themeFromCss: Theme;
+};

package/lib/use-extract-css-values.js

@@ -0,0 +1,78 @@
+import { c } from 'react-compiler-runtime';
+import { useState, useEffect, useLayoutEffect } from 'react';
+const PRIMARY_COLORS = ['--rs-color-primary-light-theme', '--rs-color-primary-dim-light-theme', '--rs-color-primary-fog-light-theme', '--rs-color-primary-t-dim-light-theme', '--rs-color-primary-t-fog-light-theme', '--rs-color-primary-dark-theme', '--rs-color-primary-dim-dark-theme', '--rs-color-primary-fog-dark-theme', '--rs-color-primary-t-dim-dark-theme', '--rs-color-primary-t-fog-dark-theme'];
+
+const extractPrimaryColors = styles => {
+  const colors = {};
+  PRIMARY_COLORS.forEach(varName => {
+    colors[varName] = styles.getPropertyValue(varName) || 'initial';
+  });
+  return colors;
+};
+/** Check out `@rescui/colors/src/public-api.p.css` file */
+
+
+const extractThemeFromCss = styles => {
+  const themeDark = parseInt(styles.getPropertyValue('--rs-theme-dark'), 10) || 0;
+  const themeFlip = parseInt(styles.getPropertyValue('--rs-theme-flip'), 10) || 0;
+  const themeDarkCoefficient = themeDark * (1 - themeFlip) + themeFlip * (1 - themeDark);
+  return themeDarkCoefficient === 1 ? 'dark' : 'light';
+};
+
+const useIsomorphicLayoutEffect = typeof window === 'undefined' ? useEffect : useLayoutEffect;
+
+const useExtractCssValues = (triggerRef, shouldBeRendered, defaultView) => {
+  const $ = c(6);
+  let t0;
+
+  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+    t0 = {
+      primaryColors: {},
+      themeFromCss: "light"
+    };
+    $[0] = t0;
+  } else {
+    t0 = $[0];
+  }
+
+  const [cssValues, setCssValues] = useState(t0);
+  let t1;
+  let t2;
+
+  if ($[1] !== defaultView || $[2] !== shouldBeRendered || $[3] !== triggerRef) {
+    t1 = () => {
+      if (triggerRef && shouldBeRendered) {
+        const triggerStyles = defaultView?.getComputedStyle(triggerRef);
+
+        if (triggerStyles) {
+          const newCssValues = {
+            primaryColors: extractPrimaryColors(triggerStyles),
+            themeFromCss: extractThemeFromCss(triggerStyles)
+          };
+          setCssValues(oldValues => {
+            if (JSON.stringify(oldValues) !== JSON.stringify(newCssValues)) {
+              return newCssValues;
+            }
+
+            return oldValues;
+          });
+        }
+      }
+    };
+
+    t2 = [triggerRef, shouldBeRendered, defaultView];
+    $[1] = defaultView;
+    $[2] = shouldBeRendered;
+    $[3] = triggerRef;
+    $[4] = t1;
+    $[5] = t2;
+  } else {
+    t1 = $[4];
+    t2 = $[5];
+  }
+
+  useIsomorphicLayoutEffect(t1, t2);
+  return cssValues;
+};
+
+export { useExtractCssValues };

package/lib/use-scrollable-container.js

@@ -1,4 +1,5 @@
 "use client";
+import { c } from 'react-compiler-runtime';
 import { useState } from 'react';
 import { useResizeObserver } from '@rescui/use-resize-observer';
 
@@ -14,22 +15,44 @@ function isOverflown(element) {
 
 
 const useScrollableContainer = () => {
+  const $ = c(3);
   const [contentEl, setContentEl] = useState(null);
   const [isScrollable, setIsScrollable] = useState(false);
-  useResizeObserver(contentEl, () => {
-    const containerEl = contentEl.parentElement;
-
-    if (containerEl) {
-      setIsScrollable(isOverflown(containerEl));
-    }
-  });
-  const scrollableStyles = {
-    overflowY: isScrollable ? 'scroll' : 'auto'
-  };
-  return {
-    setContentEl,
-    scrollableStyles
-  };
+  let t0;
+
+  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+    t0 = entry => {
+      const containerEl = entry.target.parentElement;
+
+      if (containerEl) {
+        setIsScrollable(isOverflown(containerEl));
+      }
+    };
+
+    $[0] = t0;
+  } else {
+    t0 = $[0];
+  }
+
+  useResizeObserver(contentEl, t0);
+  const t1 = isScrollable ? "scroll" : "auto";
+  let t2;
+
+  if ($[1] !== t1) {
+    const scrollableStyles = {
+      overflowY: t1
+    };
+    t2 = {
+      setContentEl,
+      scrollableStyles
+    };
+    $[1] = t1;
+    $[2] = t2;
+  } else {
+    t2 = $[2];
+  }
+
+  return t2;
 };
 
 export { useScrollableContainer };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rescui/dropdown",
-  "version": "0.11.1-RUI-297-Add-react-compiler-to-the-packages-build-dbbefd7b8.10+dbbefd7b8",
+  "version": "0.11.1-RUI-297-Add-react-compiler-to-the-packages-build-8aaaed4be.39+8aaaed4be",
   "description": "",
   "license": "Apache-2.0",
   "author": "JetBrains",
@@ -18,9 +18,10 @@
   "dependencies": {
     "@babel/runtime-corejs3": "^7.26.0",
     "@popperjs/core": "^2.11.8",
-    "@rescui/use-resize-observer": "0.3.4-RUI-297-Add-react-compiler-to-the-packages-build-dbbefd7b8.10+dbbefd7b8",
+    "@rescui/use-resize-observer": "0.3.4-RUI-297-Add-react-compiler-to-the-packages-build-8aaaed4be.39+8aaaed4be",
     "classnames": "^2.2.6",
     "popper-max-size-modifier": "^0.2.0",
+    "react-compiler-runtime": "^1.0.0",
     "react-focus-lock": "^2.8.1",
     "react-popper": "^2.2.5"
   },
@@ -31,15 +32,15 @@
     "react-dom": ">=17.0.0 <20"
   },
   "devDependencies": {
-    "@rescui/colors": "0.3.3-RUI-297-Add-react-compiler-to-the-packages-build-dbbefd7b8.14+dbbefd7b8",
-    "@rescui/icons": "1.8.3-RUI-297-Add-react-compiler-to-the-packages-build-dbbefd7b8.14+dbbefd7b8",
+    "@rescui/colors": "0.3.3-RUI-297-Add-react-compiler-to-the-packages-build-8aaaed4be.43+8aaaed4be",
+    "@rescui/icons": "1.8.3-RUI-297-Add-react-compiler-to-the-packages-build-8aaaed4be.43+8aaaed4be",
     "@rescui/scripts": "0.5.2",
-    "@rescui/typography": "0.27.3-RUI-297-Add-react-compiler-to-the-packages-build-dbbefd7b8.14+dbbefd7b8",
+    "@rescui/typography": "0.27.3-RUI-297-Add-react-compiler-to-the-packages-build-8aaaed4be.43+8aaaed4be",
     "@rescui/visual-regression": "0.1.4"
   },
   "scripts": {
     "build": "rescui-scripts build"
   },
   "nx": {},
-  "gitHead": "dbbefd7b8e24da18262edf3baffa35039ae01af3"
+  "gitHead": "8aaaed4bee650c002b7f195438380b70c31cc5a4"
 }

package/lib/css-vars-utils.d.ts

@@ -1,3 +0,0 @@
-export declare const extractPrimaryColors: (styles: CSSStyleDeclaration) => Record<string, string>;
-/** Check out `@rescui/colors/src/public-api.p.css` file */
-export declare const extractThemeFromCss: (styles: CSSStyleDeclaration) => "dark" | "light";

package/lib/css-vars-utils.js

@@ -1,20 +0,0 @@
-const PRIMARY_COLORS = ['--rs-color-primary-light-theme', '--rs-color-primary-dim-light-theme', '--rs-color-primary-fog-light-theme', '--rs-color-primary-t-dim-light-theme', '--rs-color-primary-t-fog-light-theme', '--rs-color-primary-dark-theme', '--rs-color-primary-dim-dark-theme', '--rs-color-primary-fog-dark-theme', '--rs-color-primary-t-dim-dark-theme', '--rs-color-primary-t-fog-dark-theme'];
-
-const extractPrimaryColors = styles => {
-  const colors = {};
-  PRIMARY_COLORS.forEach(varName => {
-    colors[varName] = styles.getPropertyValue(varName) || 'initial';
-  });
-  return colors;
-};
-/** Check out `@rescui/colors/src/public-api.p.css` file */
-
-
-const extractThemeFromCss = styles => {
-  const themeDark = parseInt(styles.getPropertyValue('--rs-theme-dark'), 10) || 0;
-  const themeFlip = parseInt(styles.getPropertyValue('--rs-theme-flip'), 10) || 0;
-  const themeDarkCoefficient = themeDark * (1 - themeFlip) + themeFlip * (1 - themeDark);
-  return themeDarkCoefficient === 1 ? 'dark' : 'light';
-};
-
-export { extractPrimaryColors, extractThemeFromCss };