@mui/docs 7.0.0-alpha.0 → 7.0.0-alpha.1

package/esm/MarkdownElement/index.d.ts

@@ -0,0 +1 @@
+export * from "./MarkdownElement.js";

package/esm/MarkdownElement/index.js

@@ -0,0 +1 @@
+export * from "./MarkdownElement.js";

package/esm/NProgressBar/NProgressBar.d.ts

@@ -0,0 +1,6 @@
+import * as React from 'react';
+export interface NProgressBarProps {
+  children?: React.ReactNode;
+}
+declare const NProgressBar: React.FunctionComponent<NProgressBarProps>;
+export default NProgressBar;

package/{node → esm}/NProgressBar/NProgressBar.js

@@ -1,20 +1,12 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var React = _interopRequireWildcard(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _nprogress = _interopRequireDefault(require("nprogress"));
-var _NoSsr = require("@mui/base/NoSsr");
-var _utils = require("@mui/utils");
-var _GlobalStyles = _interopRequireDefault(require("@mui/material/GlobalStyles"));
-var _styles = require("@mui/material/styles");
-var _jsxRuntime = require("react/jsx-runtime");
-_nprogress.default.configure({
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import NProgress from 'nprogress';
+import { NoSsr } from '@mui/base/NoSsr';
+import { exactProp } from '@mui/utils';
+import GlobalStyles from '@mui/material/GlobalStyles';
+import { keyframes } from '@mui/material/styles';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+NProgress.configure({
   barSelector: '.nprogress-bar',
   template: `
     <div class="nprogress-bar">
@@ -23,7 +15,7 @@ _nprogress.default.configure({
     </div>
   `
 });
-const muiNProgressPulse = (0, _styles.keyframes)`
+const muiNProgressPulse = keyframes`
   30% {
     opacity: 0.6;
   }
@@ -42,8 +34,8 @@ const muiNProgressPulse = (0, _styles.keyframes)`
  * The implementation is highly inspired by the YouTube one.
  */
 function NProgressBar(props) {
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_NoSsr.NoSsr, {
-    children: [props.children, /*#__PURE__*/(0, _jsxRuntime.jsx)(_GlobalStyles.default, {
+  return /*#__PURE__*/_jsxs(NoSsr, {
+    children: [props.children, /*#__PURE__*/_jsx(GlobalStyles, {
       styles: theme => ({
         '#nprogress': {
           direction: 'ltr',
@@ -92,9 +84,9 @@ function NProgressBar(props) {
   });
 }
 process.env.NODE_ENV !== "production" ? NProgressBar.propTypes = {
-  children: _propTypes.default.node
+  children: PropTypes.node
 } : void 0;
 if (process.env.NODE_ENV !== 'production') {
-  process.env.NODE_ENV !== "production" ? NProgressBar.propTypes = (0, _utils.exactProp)(NProgressBar.propTypes) : void 0;
+  process.env.NODE_ENV !== "production" ? NProgressBar.propTypes = exactProp(NProgressBar.propTypes) : void 0;
 }
-var _default = exports.default = NProgressBar;
+export default NProgressBar;

package/esm/NProgressBar/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from "./NProgressBar.js";
+export * from "./NProgressBar.js";

package/esm/NProgressBar/index.js

@@ -0,0 +1 @@
+export { default } from "./NProgressBar.js";

package/esm/SectionTitle/SectionTitle.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+export interface SectionTitleProps<Hash extends string = string> {
+  title: string;
+  hash: Hash;
+  level?: 'h2' | 'h3' | 'h4';
+}
+export declare function SectionTitle(props: SectionTitleProps): React.JSX.Element;

package/esm/SectionTitle/SectionTitle.js

@@ -0,0 +1,30 @@
+var _span;
+import * as React from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export function SectionTitle(props) {
+  const {
+    title,
+    hash,
+    level: Level = 'h2'
+  } = props;
+  return /*#__PURE__*/_jsx(Level, {
+    id: hash,
+    style: {
+      flexGrow: 1
+    },
+    children: /*#__PURE__*/_jsxs("a", {
+      "aria-labelledby": hash,
+      className: "title-link-to-anchor",
+      href: `#${hash}`,
+      tabIndex: -1,
+      children: [title, _span || (_span = /*#__PURE__*/_jsx("span", {
+        className: "anchor-icon",
+        children: /*#__PURE__*/_jsx("svg", {
+          children: /*#__PURE__*/_jsx("use", {
+            xlinkHref: "#anchor-link-icon"
+          })
+        })
+      }))]
+    })
+  });
+}

package/esm/SectionTitle/index.d.ts

@@ -0,0 +1 @@
+export * from "./SectionTitle.js";

package/esm/SectionTitle/index.js

@@ -0,0 +1 @@
+export * from "./SectionTitle.js";

package/esm/branding/BrandingProvider.d.ts

@@ -0,0 +1,9 @@
+import * as React from 'react';
+export interface BrandingProviderProps {
+  children: React.ReactNode;
+  /**
+   * If not `undefined`, the provider is considered nesting and does not render NextNProgressBar & CssBaseline
+   */
+  mode?: 'light' | 'dark';
+}
+export declare function BrandingProvider(props: BrandingProviderProps): React.JSX.Element;

package/esm/branding/BrandingProvider.js

@@ -0,0 +1,17 @@
+import * as React from 'react';
+import { ThemeProvider, useTheme } from '@mui/material/styles';
+import { brandingDarkTheme, brandingLightTheme } from "./brandingTheme.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+export function BrandingProvider(props) {
+  const {
+    children,
+    mode: modeProp
+  } = props;
+  const upperTheme = useTheme();
+  const mode = modeProp || upperTheme.palette.mode;
+  const theme = mode === 'dark' ? brandingDarkTheme : brandingLightTheme;
+  return /*#__PURE__*/_jsx(ThemeProvider, {
+    theme: modeProp ? () => theme : theme,
+    children: children
+  });
+}

package/esm/branding/brandingTheme.d.ts

@@ -0,0 +1,151 @@
+import type { CSSObject } from '@mui/system';
+import { ThemeOptions, Theme } from '@mui/material/styles';
+interface ApplyDarkStyles {
+  (scheme: CSSObject): CSSObject;
+}
+declare module '@mui/material/styles' {
+  interface Theme {
+    applyDarkStyles: ApplyDarkStyles;
+  }
+}
+declare module '@mui/material/styles/createPalette' {
+  interface ColorRange {
+    50: string;
+    100: string;
+    200: string;
+    300: string;
+    400: string;
+    500: string;
+    600: string;
+    700: string;
+    800: string;
+    900: string;
+  }
+  interface PaletteColor extends ColorRange {}
+  interface Palette {
+    primaryDark: PaletteColor;
+    gradients: {
+      radioSubtle: string;
+      linearSubtle: string;
+    };
+  }
+  interface TypeText {
+    tertiary: string;
+  }
+}
+declare module '@mui/material/styles/createTypography' {
+  interface TypographyOptions {
+    fontWeightSemiBold?: number;
+    fontWeightExtraBold?: number;
+    fontFamilyCode?: string;
+    fontFamilySystem?: string;
+  }
+  interface Typography {
+    fontWeightSemiBold: number;
+    fontWeightExtraBold: number;
+    fontFamilyCode: string;
+    fontFamilySystem: string;
+  }
+}
+declare module '@mui/material/Chip' {
+  interface ChipPropsColorOverrides {
+    grey: true;
+  }
+}
+declare module '@mui/material/SvgIcon' {
+  interface SvgIconPropsColorOverrides {
+    danger: true;
+  }
+  interface SvgIconPropsSizeOverrides {
+    xs: true;
+    sm: true;
+    md: true;
+    lg: true;
+    xl: true;
+    xl2: true;
+    xl3: true;
+    xl4: true;
+  }
+}
+export declare const blue: {
+  50: string;
+  100: string;
+  200: string;
+  300: string;
+  400: string;
+  main: string;
+  500: string;
+  600: string;
+  700: string;
+  800: string;
+  900: string;
+};
+export declare const blueDark: {
+  50: string;
+  100: string;
+  200: string;
+  300: string;
+  main: string;
+  400: string;
+  500: string;
+  600: string;
+  700: string;
+  800: string;
+  900: string;
+};
+export declare const grey: {
+  50: string;
+  100: string;
+  200: string;
+  300: string;
+  400: string;
+  500: string;
+  600: string;
+  700: string;
+  800: string;
+  900: string;
+};
+export declare const error: {
+  50: string;
+  100: string;
+  200: string;
+  300: string;
+  400: string;
+  500: string;
+  main: string;
+  600: string;
+  700: string;
+  800: string;
+  900: string;
+};
+export declare const success: {
+  50: string;
+  100: string;
+  200: string;
+  300: string;
+  400: string;
+  500: string;
+  600: string;
+  700: string;
+  800: string;
+  900: string;
+};
+export declare const warning: {
+  50: string;
+  100: string;
+  200: string;
+  300: string;
+  400: string;
+  500: string;
+  main: string;
+  600: string;
+  700: string;
+  800: string;
+  900: string;
+};
+export declare const getMetaThemeColor: (mode: "light" | "dark") => string;
+export declare const getDesignTokens: (mode: "light" | "dark") => ThemeOptions;
+export declare function getThemedComponents(): ThemeOptions;
+export declare const brandingDarkTheme: Theme;
+export declare const brandingLightTheme: Theme;
+export {};