@redsift/table 11.11.0-muiv7 → 11.11.0-muiv8-alpha.0

package/_internal/ToolbarWrapper2.js

@@ -1,6 +1,6 @@
 import { a as _objectWithoutProperties, b as _extends } from './_rollupPluginBabelHelpers.js';
 import React__default from 'react';
-import { S as ServerSideControlledPagination, C as ControlledPagination } from './ControlledPagination.js';
+import { S as ServerSideControlledPagination, C as ControlledPagination } from './ServerSideControlledPagination.js';
 
 const _excluded = ["hideToolbar", "RenderedToolbar", "filterModel", "onFilterModelChange", "pagination", "paginationPlacement", "selectionStatus", "apiRef", "isRowSelectable", "paginationModel", "onPaginationModelChange", "pageSizeOptions", "paginationProps", "paginationMode", "rowCount"];
 const ToolbarWrapper = _ref => {

package/_internal/useControlledDatagridState.js

@@ -1,42 +1,10 @@
 import * as React from 'react';
 import { useState, useEffect } from 'react';
-import { P as PropTypes, R as RtlProvider, O as DefaultPropsProvider, T as THEME_ID, b as createTheme, Q as createTypography, a as styleFunctionSx } from './Portal.js';
+import { P as PropTypes, J as exactProp, K as useTheme$1, A as useId, L as useEnhancedEffect, M as GlobalStyles, R as RtlProvider, N as DefaultPropsProvider, Q as GlobalStyles$1, T as THEME_ID, j as createTheme, U as createTypography, e as styleFunctionSx } from './ServerSideControlledPagination.js';
 import { j as jsxRuntimeExports } from './jsx-runtime.js';
-import { k as useTheme$1, G as GlobalStyles, l as GlobalStyles$1 } from './ControlledPagination.js';
 import { ThemeContext as ThemeContext$2 } from '@emotion/react';
 import styled, { css } from 'styled-components';
 
-/**
- * A version of `React.useLayoutEffect` that does not show a warning when server-side rendering.
- * This is useful for effects that are only needed for client-side rendering but not for SSR.
- *
- * Before you use this hook, make sure to read https://gist.github.com/gaearon/e7d97cdf38a2907924ea12e4ebdf3c85
- * and confirm it doesn't apply to your use-case.
- */
-const useEnhancedEffect = typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect;
-var useEnhancedEffect$1 = useEnhancedEffect;
-
-// This module is based on https://github.com/airbnb/prop-types-exact repository.
-// However, in order to reduce the number of dependencies and to remove some extra safe checks
-// the module was forked.
-
-const specialProperty$1 = 'exact-prop: \u200b';
-function exactProp$1(propTypes) {
-  if (process.env.NODE_ENV === 'production') {
-    return propTypes;
-  }
-  return {
-    ...propTypes,
-    [specialProperty$1]: props => {
-      const unsupportedProps = Object.keys(props).filter(prop => !propTypes.hasOwnProperty(prop));
-      if (unsupportedProps.length > 0) {
-        return new Error(`The following props are not supported: ${unsupportedProps.map(prop => `\`${prop}\``).join(', ')}. Please remove them.`);
-      }
-      return null;
-    }
-  };
-}
-
 const ThemeContext = /*#__PURE__*/React.createContext(null);
 if (process.env.NODE_ENV !== 'production') {
   ThemeContext.displayName = 'ThemeContext';
@@ -113,71 +81,7 @@ process.env.NODE_ENV !== "production" ? ThemeProvider$2.propTypes = {
   theme: PropTypes.oneOfType([PropTypes.object, PropTypes.func]).isRequired
 } : void 0;
 if (process.env.NODE_ENV !== 'production') {
-  process.env.NODE_ENV !== "production" ? ThemeProvider$2.propTypes = exactProp$1(ThemeProvider$2.propTypes) : void 0;
-}
-
-// This module is based on https://github.com/airbnb/prop-types-exact repository.
-// However, in order to reduce the number of dependencies and to remove some extra safe checks
-// the module was forked.
-
-const specialProperty = 'exact-prop: \u200b';
-function exactProp(propTypes) {
-  if (process.env.NODE_ENV === 'production') {
-    return propTypes;
-  }
-  return {
-    ...propTypes,
-    [specialProperty]: props => {
-      const unsupportedProps = Object.keys(props).filter(prop => !propTypes.hasOwnProperty(prop));
-      if (unsupportedProps.length > 0) {
-        return new Error(`The following props are not supported: ${unsupportedProps.map(prop => `\`${prop}\``).join(', ')}. Please remove them.`);
-      }
-      return null;
-    }
-  };
-}
-
-let globalId = 0;
-
-// TODO React 17: Remove `useGlobalId` once React 17 support is removed
-function useGlobalId(idOverride) {
-  const [defaultId, setDefaultId] = React.useState(idOverride);
-  const id = idOverride || defaultId;
-  React.useEffect(() => {
-    if (defaultId == null) {
-      // Fallback to this default id when possible.
-      // Use the incrementing value for client-side rendering only.
-      // We can't use it server-side.
-      // If you want to use random values please consider the Birthday Problem: https://en.wikipedia.org/wiki/Birthday_problem
-      globalId += 1;
-      setDefaultId(`mui-${globalId}`);
-    }
-  }, [defaultId]);
-  return id;
-}
-
-// See https://github.com/mui/material-ui/issues/41190#issuecomment-2040873379 for why
-const safeReact = {
-  ...React
-};
-const maybeReactUseId = safeReact.useId;
-
-/**
- *
- * @example <div id={useId()} />
- * @param idOverride
- * @returns {string}
- */
-function useId(idOverride) {
-  // React.useId() is only available from React 17.0.0.
-  if (maybeReactUseId !== undefined) {
-    const reactId = maybeReactUseId();
-    return idOverride ?? reactId;
-  }
-
-  // TODO: uncomment once we enable eslint-plugin-react-compiler // eslint-disable-next-line react-compiler/react-compiler
-  // eslint-disable-next-line react-hooks/rules-of-hooks -- `React.useId` is invariant at runtime.
-  return useGlobalId(idOverride);
+  process.env.NODE_ENV !== "production" ? ThemeProvider$2.propTypes = exactProp(ThemeProvider$2.propTypes) : void 0;
 }
 
 function useLayerOrder(theme) {
@@ -195,7 +99,7 @@ function useLayerOrder(theme) {
   } else {
     layerOrder = `@layer ${layerOrder};`;
   }
-  useEnhancedEffect$1(() => {
+  useEnhancedEffect(() => {
     const head = document.querySelector('head');
     if (!head) {
       return;
@@ -309,9 +213,6 @@ if (process.env.NODE_ENV !== 'production') {
   process.env.NODE_ENV !== "production" ? ThemeProvider$1.propTypes = exactProp(ThemeProvider$1.propTypes) : void 0;
 }
 
-/**
- * Split this component for RSC import
- */
 const DEFAULT_MODE_STORAGE_KEY = 'mode';
 const DEFAULT_COLOR_SCHEME_STORAGE_KEY = 'color-scheme';
 const DEFAULT_ATTRIBUTE = 'data-color-scheme';
@@ -339,7 +240,7 @@ function InitColorSchemeScript(options) {
     setter += `${colorSchemeNode}.classList.remove('${selector}'.replace('%s', light), '${selector}'.replace('%s', dark));
       ${colorSchemeNode}.classList.add('${selector}'.replace('%s', colorScheme));`;
   }
-  const matches = attribute.match(/\[([^\]]+)\]/); // case [data-color-scheme=%s] or [data-color-scheme]
+  const matches = attribute.match(/\[([^[\]]+)\]/); // case [data-color-scheme='%s'] or [data-color-scheme]
   if (matches) {
     const [attr, value] = matches[1].split('=');
     if (!value) {
@@ -348,7 +249,7 @@ function InitColorSchemeScript(options) {
     }
     setter += `
       ${colorSchemeNode}.setAttribute('${attr}'.replace('%s', colorScheme), ${value ? `${value}.replace('%s', colorScheme)` : '""'});`;
-  } else {
+  } else if (attribute !== '.%s') {
     setter += `${colorSchemeNode}.setAttribute('${attribute}', colorScheme);`;
   }
   return /*#__PURE__*/jsxRuntimeExports.jsx("script", {
@@ -710,6 +611,7 @@ function createCssVarsProvider(options) {
       disableNestedContext = false,
       disableStyleSheetGeneration = false,
       defaultMode: initialMode = 'system',
+      forceThemeRerender = false,
       noSsr
     } = props;
     const hasMounted = React.useRef(false);
@@ -761,10 +663,18 @@ function createCssVarsProvider(options) {
       mode = ctx.mode;
       colorScheme = ctx.colorScheme;
     }
-    const memoTheme = React.useMemo(() => {
-      // `colorScheme` is undefined on the server and hydration phase
-      const calculatedColorScheme = colorScheme || restThemeProp.defaultColorScheme;
+    if (process.env.NODE_ENV !== 'production') {
+      if (forceThemeRerender && !restThemeProp.vars) {
+        console.warn(['MUI: The `forceThemeRerender` prop should only be used with CSS theme variables.', 'Note that it will slow down the app when changing between modes, so only do this when you cannot find a better solution.'].join('\n'));
+      }
+    }
 
+    // `colorScheme` is undefined on the server and hydration phase
+    let calculatedColorScheme = colorScheme || restThemeProp.defaultColorScheme;
+    if (restThemeProp.vars && !forceThemeRerender) {
+      calculatedColorScheme = restThemeProp.defaultColorScheme;
+    }
+    const memoTheme = React.useMemo(() => {
       // 2. get the `vars` object that refers to the CSS custom properties
       const themeVars = restThemeProp.generateThemeVars?.() || restThemeProp.vars;
 
@@ -799,12 +709,12 @@ function createCssVarsProvider(options) {
         }
       }
       return resolveTheme ? resolveTheme(theme) : theme;
-    }, [restThemeProp, colorScheme, components, colorSchemes, cssVarPrefix]);
+    }, [restThemeProp, calculatedColorScheme, components, colorSchemes, cssVarPrefix]);
 
     // 5. Declaring effects
     // 5.1 Updates the selector value to use the current color scheme which tells CSS to use the proper stylesheet.
     const colorSchemeSelector = restThemeProp.colorSchemeSelector;
-    useEnhancedEffect$1(() => {
+    useEnhancedEffect(() => {
       if (colorScheme && colorSchemeNode && colorSchemeSelector && colorSchemeSelector !== 'media') {
         const selector = colorSchemeSelector;
         let rule = colorSchemeSelector;
@@ -937,13 +847,17 @@ function createCssVarsProvider(options) {
      * The document to attach the attribute to.
      */
     documentNode: PropTypes.any,
+    /**
+     * If `true`, theme values are recalculated when the mode changes.
+     */
+    forceThemeRerender: PropTypes.bool,
     /**
      * The key in the local storage used to store current color scheme.
      */
     modeStorageKey: PropTypes.string,
     /**
      * If `true`, the mode will be the same value as the storage without an extra rerendering after the hydration.
-     * You should use this option in conjuction with `InitColorSchemeScript` component.
+     * You should use this option in conjunction with `InitColorSchemeScript` component.
      */
     noSsr: PropTypes.bool,
     /**
@@ -996,6 +910,53 @@ const defaultConfig = {
   defaultDarkColorScheme: 'dark',
   modeStorageKey: 'mui-mode'
 };
+process.env.NODE_ENV !== "production" ? {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * DOM attribute for applying a color scheme.
+   * @default 'data-mui-color-scheme'
+   * @example '.mode-%s' // for class based color scheme
+   * @example '[data-mode-%s]' // for data-attribute without '='
+   */
+  attribute: PropTypes.string,
+  /**
+   * The node (provided as string) used to attach the color-scheme attribute.
+   * @default 'document.documentElement'
+   */
+  colorSchemeNode: PropTypes.string,
+  /**
+   * localStorage key used to store `colorScheme`.
+   * @default 'mui-color-scheme'
+   */
+  colorSchemeStorageKey: PropTypes.string,
+  /**
+   * The default color scheme to be used in dark mode.
+   * @default 'dark'
+   */
+  defaultDarkColorScheme: PropTypes.string,
+  /**
+   * The default color scheme to be used in light mode.
+   * @default 'light'
+   */
+  defaultLightColorScheme: PropTypes.string,
+  /**
+   * The default mode when the storage is empty (user's first visit).
+   * @default 'system'
+   */
+  defaultMode: PropTypes.oneOf(['dark', 'light', 'system']),
+  /**
+   * localStorage key used to store `mode`.
+   * @default 'mui-mode'
+   */
+  modeStorageKey: PropTypes.string,
+  /**
+   * Nonce string to pass to the inline script for CSP headers.
+   */
+  nonce: PropTypes.string
+} : void 0;
 
 const {
   CssVarsProvider: InternalCssVarsProvider,
@@ -1087,22 +1048,22 @@ function ThemeProvider({
   });
 }
 
-/* eslint-disable */
-// https://github.com/zloirock/core-js/issues/86#issuecomment-115759028
-var ponyfillGlobal = typeof window != 'undefined' && window.Math == Math ? window : typeof self != 'undefined' && self.Math == Math ? self : Function('return this')();
+/**
+ * @ignore - do not document.
+ */
 
 // Store the license information in a global, so it can be shared
 // when module duplication occurs. The duplication of the modules can happen
 // if using multiple version of MUI X at the same time of the bundler
 // decide to duplicate to improve the size of the chunks.
 // eslint-disable-next-line no-underscore-dangle
-ponyfillGlobal.__MUI_LICENSE_INFO__ = ponyfillGlobal.__MUI_LICENSE_INFO__ || {
+globalThis.__MUI_LICENSE_INFO__ = globalThis.__MUI_LICENSE_INFO__ || {
   key: undefined
 };
 class LicenseInfo {
   static getLicenseInfo() {
     // eslint-disable-next-line no-underscore-dangle
-    return ponyfillGlobal.__MUI_LICENSE_INFO__;
+    return globalThis.__MUI_LICENSE_INFO__;
   }
   static getLicenseKey() {
     return LicenseInfo.getLicenseInfo().key;