neue Homepage auf react basis

This commit is contained in:
2026-08-07 21:39:30 +02:00
parent 164bdd19ad
commit ee89442c04
52191 changed files with 1230242 additions and 58 deletions
+22
View File
@@ -0,0 +1,22 @@
type Listener<T> = (value: T) => void;
export declare class Store<State> {
state: State;
private listeners;
private updateTick;
static create<T>(state: T): Store<T>;
constructor(state: State);
subscribe: (fn: Listener<State>) => () => void;
/**
* Returns the current state snapshot. Meant for usage with `useSyncExternalStore`.
* If you want to access the state, use the `state` property instead.
*/
getSnapshot: () => State;
setState(newState: State): void;
update(changes: Partial<State>): void;
set<Key extends keyof State, T extends State[Key]>(key: Key, value: T): void;
use: <F extends (...args: any) => any>(selector: F, ...args: SelectorArgs<F>) => ReturnType<F>;
}
export type ReadonlyStore<State> = Pick<Store<State>, 'getSnapshot' | 'subscribe' | 'state'>;
type SelectorArgs<Selector> = Selector extends ((...params: infer Params) => any) ? Tail<Params> : never;
type Tail<T extends readonly any[]> = T extends readonly [any, ...infer Rest] ? Rest : [];
export {};
+22
View File
@@ -0,0 +1,22 @@
type Listener<T> = (value: T) => void;
export declare class Store<State> {
state: State;
private listeners;
private updateTick;
static create<T>(state: T): Store<T>;
constructor(state: State);
subscribe: (fn: Listener<State>) => () => void;
/**
* Returns the current state snapshot. Meant for usage with `useSyncExternalStore`.
* If you want to access the state, use the `state` property instead.
*/
getSnapshot: () => State;
setState(newState: State): void;
update(changes: Partial<State>): void;
set<Key extends keyof State, T extends State[Key]>(key: Key, value: T): void;
use: <F extends (...args: any) => any>(selector: F, ...args: SelectorArgs<F>) => ReturnType<F>;
}
export type ReadonlyStore<State> = Pick<Store<State>, 'getSnapshot' | 'subscribe' | 'state'>;
type SelectorArgs<Selector> = Selector extends ((...params: infer Params) => any) ? Tail<Params> : never;
type Tail<T extends readonly any[]> = T extends readonly [any, ...infer Rest] ? Rest : [];
export {};
+74
View File
@@ -0,0 +1,74 @@
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.Store = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _useStore = require("./useStore");
/* eslint-disable no-cond-assign */
class Store {
// HACK: `any` fixes adding listeners that accept partial state.
// Internal state to handle recursive `setState()` calls
static create(state) {
return new Store(state);
}
constructor(state) {
this.state = state;
this.listeners = new Set();
this.updateTick = 0;
}
subscribe = fn => {
this.listeners.add(fn);
return () => {
this.listeners.delete(fn);
};
};
/**
* Returns the current state snapshot. Meant for usage with `useSyncExternalStore`.
* If you want to access the state, use the `state` property instead.
*/
getSnapshot = () => {
return this.state;
};
setState(newState) {
this.state = newState;
this.updateTick += 1;
const currentTick = this.updateTick;
const it = this.listeners.values();
let result;
while (result = it.next(), !result.done) {
if (currentTick !== this.updateTick) {
// If the tick has changed, a recursive `setState` call has been made,
// and it has already notified all listeners.
return;
}
const listener = result.value;
listener(newState);
}
}
update(changes) {
for (const key in changes) {
if (!Object.is(this.state[key], changes[key])) {
this.setState((0, _extends2.default)({}, this.state, changes));
return;
}
}
}
set(key, value) {
if (!Object.is(this.state[key], value)) {
this.setState((0, _extends2.default)({}, this.state, {
[key]: value
}));
}
}
use = (selector, a1, a2, a3) => {
return (0, _useStore.useStore)(this, selector, a1, a2, a3);
};
}
exports.Store = Store;
+66
View File
@@ -0,0 +1,66 @@
import _extends from "@babel/runtime/helpers/esm/extends";
import { useStore } from "./useStore.mjs";
/* eslint-disable no-cond-assign */
export class Store {
// HACK: `any` fixes adding listeners that accept partial state.
// Internal state to handle recursive `setState()` calls
static create(state) {
return new Store(state);
}
constructor(state) {
this.state = state;
this.listeners = new Set();
this.updateTick = 0;
}
subscribe = fn => {
this.listeners.add(fn);
return () => {
this.listeners.delete(fn);
};
};
/**
* Returns the current state snapshot. Meant for usage with `useSyncExternalStore`.
* If you want to access the state, use the `state` property instead.
*/
getSnapshot = () => {
return this.state;
};
setState(newState) {
this.state = newState;
this.updateTick += 1;
const currentTick = this.updateTick;
const it = this.listeners.values();
let result;
while (result = it.next(), !result.done) {
if (currentTick !== this.updateTick) {
// If the tick has changed, a recursive `setState` call has been made,
// and it has already notified all listeners.
return;
}
const listener = result.value;
listener(newState);
}
}
update(changes) {
for (const key in changes) {
if (!Object.is(this.state[key], changes[key])) {
this.setState(_extends({}, this.state, changes));
return;
}
}
}
set(key, value) {
if (!Object.is(this.state[key], value)) {
this.setState(_extends({}, this.state, {
[key]: value
}));
}
}
use = (selector, a1, a2, a3) => {
return useStore(this, selector, a1, a2, a3);
};
}
+55
View File
@@ -0,0 +1,55 @@
import { OverrideMemoizeOptions, UnknownMemoizer } from 'reselect';
import type { CreateSelectorFunction } from "./createSelectorType.mjs";
export type { CreateSelectorFunction } from "./createSelectorType.mjs";
/**
* Creates a selector function that can be used to derive values from the store's state.
*
* The combiner function can have up to three additional parameters, but it **cannot have optional or default parameters**.
*
* This function accepts up to six functions and combines them into a single selector function.
* The resulting selector will take the state from the combined selectors and any additional parameters required by the combiner.
*
* The return type of the resulting selector is determined by the return type of the combiner function.
*
* @example
* const selector = createSelector(
* (state) => state.disabled
* );
*
* @example
* const selector = createSelector(
* (state) => state.disabled,
* (state) => state.open,
* (disabled, open) => ({ disabled, open })
* );
*/
export declare const createSelector: CreateSelectorFunction;
export declare const createSelectorMemoizedWithOptions: (options?: OverrideMemoizeOptions<UnknownMemoizer>) => CreateSelectorFunction;
/**
* Creates a memoized selector function that can be used to derive values from the store's state.
* This is useful for selectors that produce non-primitive values, such as objects or arrays, where memoization can help prevent unnecessary re-renders in React components.
*
* The memoization is implemented in a way that only the most recent selector result is cached.
* This is suitable for cases where the selector is called with the same state and arguments repeatedly,
* but may not be ideal for selectors that are called with a wide variety of states and arguments.
*
* The combiner function can have up to three additional parameters, but it **cannot have optional or default parameters**.
*
* This function accepts up to six functions and combines them into a single selector function.
* The resulting selector will take the state from the combined selectors and any additional parameters required by the combiner.
*
* The return type of the resulting selector is determined by the return type of the combiner function.
*
* @example
* const selector = createSelectorMemoized(
* (state) => state.disabled
* );
*
* @example
* const selector = createSelectorMemoized(
* (state) => state.disabled,
* (state) => state.open,
* (disabled, open) => ({ disabled, open })
* );
*/
export declare const createSelectorMemoized: CreateSelectorFunction;
+55
View File
@@ -0,0 +1,55 @@
import { OverrideMemoizeOptions, UnknownMemoizer } from 'reselect';
import type { CreateSelectorFunction } from "./createSelectorType.js";
export type { CreateSelectorFunction } from "./createSelectorType.js";
/**
* Creates a selector function that can be used to derive values from the store's state.
*
* The combiner function can have up to three additional parameters, but it **cannot have optional or default parameters**.
*
* This function accepts up to six functions and combines them into a single selector function.
* The resulting selector will take the state from the combined selectors and any additional parameters required by the combiner.
*
* The return type of the resulting selector is determined by the return type of the combiner function.
*
* @example
* const selector = createSelector(
* (state) => state.disabled
* );
*
* @example
* const selector = createSelector(
* (state) => state.disabled,
* (state) => state.open,
* (disabled, open) => ({ disabled, open })
* );
*/
export declare const createSelector: CreateSelectorFunction;
export declare const createSelectorMemoizedWithOptions: (options?: OverrideMemoizeOptions<UnknownMemoizer>) => CreateSelectorFunction;
/**
* Creates a memoized selector function that can be used to derive values from the store's state.
* This is useful for selectors that produce non-primitive values, such as objects or arrays, where memoization can help prevent unnecessary re-renders in React components.
*
* The memoization is implemented in a way that only the most recent selector result is cached.
* This is suitable for cases where the selector is called with the same state and arguments repeatedly,
* but may not be ideal for selectors that are called with a wide variety of states and arguments.
*
* The combiner function can have up to three additional parameters, but it **cannot have optional or default parameters**.
*
* This function accepts up to six functions and combines them into a single selector function.
* The resulting selector will take the state from the combined selectors and any additional parameters required by the combiner.
*
* The return type of the resulting selector is determined by the return type of the combiner function.
*
* @example
* const selector = createSelectorMemoized(
* (state) => state.disabled
* );
*
* @example
* const selector = createSelectorMemoized(
* (state) => state.disabled,
* (state) => state.open,
* (disabled, open) => ({ disabled, open })
* );
*/
export declare const createSelectorMemoized: CreateSelectorFunction;
+223
View File
@@ -0,0 +1,223 @@
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.createSelectorMemoizedWithOptions = exports.createSelectorMemoized = exports.createSelector = void 0;
var _index = _interopRequireDefault(require("../formatErrorMessage/index.js"));
var _reselect = require("reselect");
/* eslint-disable no-underscore-dangle */ // __cacheKey__
const reselectCreateSelector = (0, _reselect.createSelectorCreator)({
memoize: _reselect.lruMemoize,
memoizeOptions: {
maxSize: 1,
equalityCheck: Object.is
}
});
/**
* Creates a selector function that can be used to derive values from the store's state.
*
* The combiner function can have up to three additional parameters, but it **cannot have optional or default parameters**.
*
* This function accepts up to six functions and combines them into a single selector function.
* The resulting selector will take the state from the combined selectors and any additional parameters required by the combiner.
*
* The return type of the resulting selector is determined by the return type of the combiner function.
*
* @example
* const selector = createSelector(
* (state) => state.disabled
* );
*
* @example
* const selector = createSelector(
* (state) => state.disabled,
* (state) => state.open,
* (disabled, open) => ({ disabled, open })
* );
*/
/* eslint-disable id-denylist */
const createSelector = (a, b, c, d, e, f, g, h, ...other) => {
if (other.length > 0) {
throw new Error(process.env.NODE_ENV !== "production" ? 'MUI X: Unsupported number of selectors. ' + 'The createSelector function supports up to 8 input selectors. ' + 'Consider combining selectors or restructuring your selector logic.' : (0, _index.default)(179));
}
let selector;
if (a && b && c && d && e && f && g && h) {
selector = (state, a1, a2, a3) => {
const va = a(state, a1, a2, a3);
const vb = b(state, a1, a2, a3);
const vc = c(state, a1, a2, a3);
const vd = d(state, a1, a2, a3);
const ve = e(state, a1, a2, a3);
const vf = f(state, a1, a2, a3);
const vg = g(state, a1, a2, a3);
return h(va, vb, vc, vd, ve, vf, vg, a1, a2, a3);
};
} else if (a && b && c && d && e && f && g) {
selector = (state, a1, a2, a3) => {
const va = a(state, a1, a2, a3);
const vb = b(state, a1, a2, a3);
const vc = c(state, a1, a2, a3);
const vd = d(state, a1, a2, a3);
const ve = e(state, a1, a2, a3);
const vf = f(state, a1, a2, a3);
return g(va, vb, vc, vd, ve, vf, a1, a2, a3);
};
} else if (a && b && c && d && e && f) {
selector = (state, a1, a2, a3) => {
const va = a(state, a1, a2, a3);
const vb = b(state, a1, a2, a3);
const vc = c(state, a1, a2, a3);
const vd = d(state, a1, a2, a3);
const ve = e(state, a1, a2, a3);
return f(va, vb, vc, vd, ve, a1, a2, a3);
};
} else if (a && b && c && d && e) {
selector = (state, a1, a2, a3) => {
const va = a(state, a1, a2, a3);
const vb = b(state, a1, a2, a3);
const vc = c(state, a1, a2, a3);
const vd = d(state, a1, a2, a3);
return e(va, vb, vc, vd, a1, a2, a3);
};
} else if (a && b && c && d) {
selector = (state, a1, a2, a3) => {
const va = a(state, a1, a2, a3);
const vb = b(state, a1, a2, a3);
const vc = c(state, a1, a2, a3);
return d(va, vb, vc, a1, a2, a3);
};
} else if (a && b && c) {
selector = (state, a1, a2, a3) => {
const va = a(state, a1, a2, a3);
const vb = b(state, a1, a2, a3);
return c(va, vb, a1, a2, a3);
};
} else if (a && b) {
selector = (state, a1, a2, a3) => {
const va = a(state, a1, a2, a3);
return b(va, a1, a2, a3);
};
} else if (a) {
selector = a;
} else {
throw new Error(process.env.NODE_ENV !== "production" ? 'MUI X: Missing arguments for createSelector. ' + 'At least one selector function is required. ' + 'Provide one or more selector functions as arguments.' : (0, _index.default)(180));
}
return selector;
};
/* eslint-enable id-denylist */
exports.createSelector = createSelector;
const createSelectorMemoizedWithOptions = options => (...inputs) => {
const cache = new WeakMap();
let nextCacheId = 1;
const combiner = inputs[inputs.length - 1];
const nSelectors = inputs.length - 1 || 1;
// (s1, s2, ..., sN, a1, a2, a3) => { ... }
const argsLength = Math.max(combiner.length - nSelectors, 0);
if (argsLength > 3) {
throw new Error(process.env.NODE_ENV !== "production" ? 'MUI X: Unsupported number of arguments for selector combiner. ' + 'The combiner function supports up to 3 additional arguments beyond the selector outputs. ' + 'Consider restructuring your selector to use fewer arguments.' : (0, _index.default)(181));
}
// prettier-ignore
const selector = (state, a1, a2, a3) => {
let cacheKey = state.__cacheKey__;
if (!cacheKey) {
cacheKey = {
id: nextCacheId
};
state.__cacheKey__ = cacheKey;
nextCacheId += 1;
}
let fn = cache.get(cacheKey);
if (!fn) {
const selectors = inputs.length === 1 ? [x => x, combiner] : inputs;
let reselectArgs = inputs;
const selectorArgs = [undefined, undefined, undefined];
switch (argsLength) {
case 0:
break;
case 1:
{
reselectArgs = [...selectors.slice(0, -1), () => selectorArgs[0], combiner];
break;
}
case 2:
{
reselectArgs = [...selectors.slice(0, -1), () => selectorArgs[0], () => selectorArgs[1], combiner];
break;
}
case 3:
{
reselectArgs = [...selectors.slice(0, -1), () => selectorArgs[0], () => selectorArgs[1], () => selectorArgs[2], combiner];
break;
}
default:
throw new Error(process.env.NODE_ENV !== "production" ? 'MUI X: Unsupported number of arguments for selector. ' + 'The memoized selector supports up to 3 additional arguments. ' + 'Consider restructuring your selector to use fewer arguments.' : (0, _index.default)(182));
}
if (options) {
reselectArgs = [...reselectArgs, options];
}
fn = reselectCreateSelector(...reselectArgs);
fn.selectorArgs = selectorArgs;
cache.set(cacheKey, fn);
}
/* eslint-disable no-fallthrough */
switch (argsLength) {
case 3:
fn.selectorArgs[2] = a3;
case 2:
fn.selectorArgs[1] = a2;
case 1:
fn.selectorArgs[0] = a1;
case 0:
default:
}
switch (argsLength) {
case 0:
return fn(state);
case 1:
return fn(state, a1);
case 2:
return fn(state, a1, a2);
case 3:
return fn(state, a1, a2, a3);
default:
throw /* minify-error-disabled */new Error('unreachable');
}
};
return selector;
};
/**
* Creates a memoized selector function that can be used to derive values from the store's state.
* This is useful for selectors that produce non-primitive values, such as objects or arrays, where memoization can help prevent unnecessary re-renders in React components.
*
* The memoization is implemented in a way that only the most recent selector result is cached.
* This is suitable for cases where the selector is called with the same state and arguments repeatedly,
* but may not be ideal for selectors that are called with a wide variety of states and arguments.
*
* The combiner function can have up to three additional parameters, but it **cannot have optional or default parameters**.
*
* This function accepts up to six functions and combines them into a single selector function.
* The resulting selector will take the state from the combined selectors and any additional parameters required by the combiner.
*
* The return type of the resulting selector is determined by the return type of the combiner function.
*
* @example
* const selector = createSelectorMemoized(
* (state) => state.disabled
* );
*
* @example
* const selector = createSelectorMemoized(
* (state) => state.disabled,
* (state) => state.open,
* (disabled, open) => ({ disabled, open })
* );
*/
exports.createSelectorMemoizedWithOptions = createSelectorMemoizedWithOptions;
const createSelectorMemoized = exports.createSelectorMemoized = createSelectorMemoizedWithOptions();
+215
View File
@@ -0,0 +1,215 @@
import _formatErrorMessage from "../formatErrorMessage/index.mjs";
import { lruMemoize, createSelectorCreator } from 'reselect';
/* eslint-disable no-underscore-dangle */ // __cacheKey__
const reselectCreateSelector = createSelectorCreator({
memoize: lruMemoize,
memoizeOptions: {
maxSize: 1,
equalityCheck: Object.is
}
});
/**
* Creates a selector function that can be used to derive values from the store's state.
*
* The combiner function can have up to three additional parameters, but it **cannot have optional or default parameters**.
*
* This function accepts up to six functions and combines them into a single selector function.
* The resulting selector will take the state from the combined selectors and any additional parameters required by the combiner.
*
* The return type of the resulting selector is determined by the return type of the combiner function.
*
* @example
* const selector = createSelector(
* (state) => state.disabled
* );
*
* @example
* const selector = createSelector(
* (state) => state.disabled,
* (state) => state.open,
* (disabled, open) => ({ disabled, open })
* );
*/
/* eslint-disable id-denylist */
export const createSelector = (a, b, c, d, e, f, g, h, ...other) => {
if (other.length > 0) {
throw new Error(process.env.NODE_ENV !== "production" ? 'MUI X: Unsupported number of selectors. ' + 'The createSelector function supports up to 8 input selectors. ' + 'Consider combining selectors or restructuring your selector logic.' : _formatErrorMessage(179));
}
let selector;
if (a && b && c && d && e && f && g && h) {
selector = (state, a1, a2, a3) => {
const va = a(state, a1, a2, a3);
const vb = b(state, a1, a2, a3);
const vc = c(state, a1, a2, a3);
const vd = d(state, a1, a2, a3);
const ve = e(state, a1, a2, a3);
const vf = f(state, a1, a2, a3);
const vg = g(state, a1, a2, a3);
return h(va, vb, vc, vd, ve, vf, vg, a1, a2, a3);
};
} else if (a && b && c && d && e && f && g) {
selector = (state, a1, a2, a3) => {
const va = a(state, a1, a2, a3);
const vb = b(state, a1, a2, a3);
const vc = c(state, a1, a2, a3);
const vd = d(state, a1, a2, a3);
const ve = e(state, a1, a2, a3);
const vf = f(state, a1, a2, a3);
return g(va, vb, vc, vd, ve, vf, a1, a2, a3);
};
} else if (a && b && c && d && e && f) {
selector = (state, a1, a2, a3) => {
const va = a(state, a1, a2, a3);
const vb = b(state, a1, a2, a3);
const vc = c(state, a1, a2, a3);
const vd = d(state, a1, a2, a3);
const ve = e(state, a1, a2, a3);
return f(va, vb, vc, vd, ve, a1, a2, a3);
};
} else if (a && b && c && d && e) {
selector = (state, a1, a2, a3) => {
const va = a(state, a1, a2, a3);
const vb = b(state, a1, a2, a3);
const vc = c(state, a1, a2, a3);
const vd = d(state, a1, a2, a3);
return e(va, vb, vc, vd, a1, a2, a3);
};
} else if (a && b && c && d) {
selector = (state, a1, a2, a3) => {
const va = a(state, a1, a2, a3);
const vb = b(state, a1, a2, a3);
const vc = c(state, a1, a2, a3);
return d(va, vb, vc, a1, a2, a3);
};
} else if (a && b && c) {
selector = (state, a1, a2, a3) => {
const va = a(state, a1, a2, a3);
const vb = b(state, a1, a2, a3);
return c(va, vb, a1, a2, a3);
};
} else if (a && b) {
selector = (state, a1, a2, a3) => {
const va = a(state, a1, a2, a3);
return b(va, a1, a2, a3);
};
} else if (a) {
selector = a;
} else {
throw new Error(process.env.NODE_ENV !== "production" ? 'MUI X: Missing arguments for createSelector. ' + 'At least one selector function is required. ' + 'Provide one or more selector functions as arguments.' : _formatErrorMessage(180));
}
return selector;
};
/* eslint-enable id-denylist */
export const createSelectorMemoizedWithOptions = options => (...inputs) => {
const cache = new WeakMap();
let nextCacheId = 1;
const combiner = inputs[inputs.length - 1];
const nSelectors = inputs.length - 1 || 1;
// (s1, s2, ..., sN, a1, a2, a3) => { ... }
const argsLength = Math.max(combiner.length - nSelectors, 0);
if (argsLength > 3) {
throw new Error(process.env.NODE_ENV !== "production" ? 'MUI X: Unsupported number of arguments for selector combiner. ' + 'The combiner function supports up to 3 additional arguments beyond the selector outputs. ' + 'Consider restructuring your selector to use fewer arguments.' : _formatErrorMessage(181));
}
// prettier-ignore
const selector = (state, a1, a2, a3) => {
let cacheKey = state.__cacheKey__;
if (!cacheKey) {
cacheKey = {
id: nextCacheId
};
state.__cacheKey__ = cacheKey;
nextCacheId += 1;
}
let fn = cache.get(cacheKey);
if (!fn) {
const selectors = inputs.length === 1 ? [x => x, combiner] : inputs;
let reselectArgs = inputs;
const selectorArgs = [undefined, undefined, undefined];
switch (argsLength) {
case 0:
break;
case 1:
{
reselectArgs = [...selectors.slice(0, -1), () => selectorArgs[0], combiner];
break;
}
case 2:
{
reselectArgs = [...selectors.slice(0, -1), () => selectorArgs[0], () => selectorArgs[1], combiner];
break;
}
case 3:
{
reselectArgs = [...selectors.slice(0, -1), () => selectorArgs[0], () => selectorArgs[1], () => selectorArgs[2], combiner];
break;
}
default:
throw new Error(process.env.NODE_ENV !== "production" ? 'MUI X: Unsupported number of arguments for selector. ' + 'The memoized selector supports up to 3 additional arguments. ' + 'Consider restructuring your selector to use fewer arguments.' : _formatErrorMessage(182));
}
if (options) {
reselectArgs = [...reselectArgs, options];
}
fn = reselectCreateSelector(...reselectArgs);
fn.selectorArgs = selectorArgs;
cache.set(cacheKey, fn);
}
/* eslint-disable no-fallthrough */
switch (argsLength) {
case 3:
fn.selectorArgs[2] = a3;
case 2:
fn.selectorArgs[1] = a2;
case 1:
fn.selectorArgs[0] = a1;
case 0:
default:
}
switch (argsLength) {
case 0:
return fn(state);
case 1:
return fn(state, a1);
case 2:
return fn(state, a1, a2);
case 3:
return fn(state, a1, a2, a3);
default:
throw /* minify-error-disabled */new Error('unreachable');
}
};
return selector;
};
/**
* Creates a memoized selector function that can be used to derive values from the store's state.
* This is useful for selectors that produce non-primitive values, such as objects or arrays, where memoization can help prevent unnecessary re-renders in React components.
*
* The memoization is implemented in a way that only the most recent selector result is cached.
* This is suitable for cases where the selector is called with the same state and arguments repeatedly,
* but may not be ideal for selectors that are called with a wide variety of states and arguments.
*
* The combiner function can have up to three additional parameters, but it **cannot have optional or default parameters**.
*
* This function accepts up to six functions and combines them into a single selector function.
* The resulting selector will take the state from the combined selectors and any additional parameters required by the combiner.
*
* The return type of the resulting selector is determined by the return type of the combiner function.
*
* @example
* const selector = createSelectorMemoized(
* (state) => state.disabled
* );
*
* @example
* const selector = createSelectorMemoized(
* (state) => state.disabled,
* (state) => state.open,
* (disabled, open) => ({ disabled, open })
* );
*/
export const createSelectorMemoized = createSelectorMemoizedWithOptions();
+18
View File
@@ -0,0 +1,18 @@
import type { Selector } from 'reselect';
/**
* The NoOptionalParams type is a utility type that checks if a function has optional or default parameters.
* If the function has optional or default parameters, it returns a string literal type with an error message.
* Otherwise, it returns the original function type.
*
* This is used to enforce that the combiner function passed to createSelector does not have optional or default parameters,
* as memoization relies on the Function.length property, which does not account for optional or default parameters.
*/
type NoOptionalParams<F extends Fn> = Parameters<F> extends Required<Parameters<F>> ? F : 'Combiner cannot have optional or default parameters because memoization relies on Function.length';
export type CreateSelectorFunction = <const Args extends any[], const Selectors extends ReadonlyArray<Selector<any>>, const Combiner extends (...args: readonly [...ReturnTypes<Selectors>, ...Args]) => any>(...items: [...Selectors, NoOptionalParams<Combiner>]) => (...args: Selectors['length'] extends 0 ? MergeParams<ReturnTypes<Selectors>, Parameters<Combiner>> : [StateFromSelectorList<Selectors>, ...MergeParams<ReturnTypes<Selectors>, Parameters<Combiner>>]) => ReturnType<Combiner>;
type StateFromSelectorList<Selectors extends readonly any[]> = Selectors extends [f: infer F, ...other: infer R] ? StateFromSelector<F> extends StateFromSelectorList<R> ? StateFromSelector<F> : StateFromSelectorList<R> : {};
type StateFromSelector<T> = T extends ((first: infer F, ...args: any[]) => any) ? F : never;
type Fn = (...args: any[]) => any;
type ReturnTypes<FunctionsArray extends readonly Fn[]> = { [Index in keyof FunctionsArray]: FunctionsArray[Index] extends FunctionsArray[number] ? ReturnType<FunctionsArray[Index]> : never };
type MergeParams<STypes extends readonly unknown[], CTypes extends readonly unknown[]> = STypes['length'] extends 0 ? CTypes : MergeParams<DropFirst<STypes>, DropFirst<CTypes>>;
type DropFirst<T> = T extends [any, ...infer Xs] ? Xs : [];
export {};
+18
View File
@@ -0,0 +1,18 @@
import type { Selector } from 'reselect';
/**
* The NoOptionalParams type is a utility type that checks if a function has optional or default parameters.
* If the function has optional or default parameters, it returns a string literal type with an error message.
* Otherwise, it returns the original function type.
*
* This is used to enforce that the combiner function passed to createSelector does not have optional or default parameters,
* as memoization relies on the Function.length property, which does not account for optional or default parameters.
*/
type NoOptionalParams<F extends Fn> = Parameters<F> extends Required<Parameters<F>> ? F : 'Combiner cannot have optional or default parameters because memoization relies on Function.length';
export type CreateSelectorFunction = <const Args extends any[], const Selectors extends ReadonlyArray<Selector<any>>, const Combiner extends (...args: readonly [...ReturnTypes<Selectors>, ...Args]) => any>(...items: [...Selectors, NoOptionalParams<Combiner>]) => (...args: Selectors['length'] extends 0 ? MergeParams<ReturnTypes<Selectors>, Parameters<Combiner>> : [StateFromSelectorList<Selectors>, ...MergeParams<ReturnTypes<Selectors>, Parameters<Combiner>>]) => ReturnType<Combiner>;
type StateFromSelectorList<Selectors extends readonly any[]> = Selectors extends [f: infer F, ...other: infer R] ? StateFromSelector<F> extends StateFromSelectorList<R> ? StateFromSelector<F> : StateFromSelectorList<R> : {};
type StateFromSelector<T> = T extends ((first: infer F, ...args: any[]) => any) ? F : never;
type Fn = (...args: any[]) => any;
type ReturnTypes<FunctionsArray extends readonly Fn[]> = { [Index in keyof FunctionsArray]: FunctionsArray[Index] extends FunctionsArray[number] ? ReturnType<FunctionsArray[Index]> : never };
type MergeParams<STypes extends readonly unknown[], CTypes extends readonly unknown[]> = STypes['length'] extends 0 ? CTypes : MergeParams<DropFirst<STypes>, DropFirst<CTypes>>;
type DropFirst<T> = T extends [any, ...infer Xs] ? Xs : [];
export {};
+5
View File
@@ -0,0 +1,5 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
+1
View File
@@ -0,0 +1 @@
export {};
+4
View File
@@ -0,0 +1,4 @@
export * from "./createSelector.mjs";
export * from "./useStore.mjs";
export * from "./useStoreEffect.mjs";
export * from "./Store.mjs";
+4
View File
@@ -0,0 +1,4 @@
export * from "./createSelector.js";
export * from "./useStore.js";
export * from "./useStoreEffect.js";
export * from "./Store.js";
+49
View File
@@ -0,0 +1,49 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
var _createSelector = require("./createSelector");
Object.keys(_createSelector).forEach(function (key) {
if (key === "default" || key === "__esModule") return;
if (key in exports && exports[key] === _createSelector[key]) return;
Object.defineProperty(exports, key, {
enumerable: true,
get: function () {
return _createSelector[key];
}
});
});
var _useStore = require("./useStore");
Object.keys(_useStore).forEach(function (key) {
if (key === "default" || key === "__esModule") return;
if (key in exports && exports[key] === _useStore[key]) return;
Object.defineProperty(exports, key, {
enumerable: true,
get: function () {
return _useStore[key];
}
});
});
var _useStoreEffect = require("./useStoreEffect");
Object.keys(_useStoreEffect).forEach(function (key) {
if (key === "default" || key === "__esModule") return;
if (key in exports && exports[key] === _useStoreEffect[key]) return;
Object.defineProperty(exports, key, {
enumerable: true,
get: function () {
return _useStoreEffect[key];
}
});
});
var _Store = require("./Store");
Object.keys(_Store).forEach(function (key) {
if (key === "default" || key === "__esModule") return;
if (key in exports && exports[key] === _Store[key]) return;
Object.defineProperty(exports, key, {
enumerable: true,
get: function () {
return _Store[key];
}
});
});
+4
View File
@@ -0,0 +1,4 @@
export * from "./createSelector.mjs";
export * from "./useStore.mjs";
export * from "./useStoreEffect.mjs";
export * from "./Store.mjs";
+5
View File
@@ -0,0 +1,5 @@
import type { ReadonlyStore } from "./Store.mjs";
export declare function useStore<State, Value>(store: ReadonlyStore<State>, selector: (state: State) => Value): Value;
export declare function useStore<State, Value, A1>(store: ReadonlyStore<State>, selector: (state: State, a1: A1) => Value, a1: A1): Value;
export declare function useStore<State, Value, A1, A2>(store: ReadonlyStore<State>, selector: (state: State, a1: A1, a2: A2) => Value, a1: A1, a2: A2): Value;
export declare function useStore<State, Value, A1, A2, A3>(store: ReadonlyStore<State>, selector: (state: State, a1: A1, a2: A2, a3: A3) => Value, a1: A1, a2: A2, a3: A3): Value;
+5
View File
@@ -0,0 +1,5 @@
import type { ReadonlyStore } from "./Store.js";
export declare function useStore<State, Value>(store: ReadonlyStore<State>, selector: (state: State) => Value): Value;
export declare function useStore<State, Value, A1>(store: ReadonlyStore<State>, selector: (state: State, a1: A1) => Value, a1: A1): Value;
export declare function useStore<State, Value, A1, A2>(store: ReadonlyStore<State>, selector: (state: State, a1: A1, a2: A2) => Value, a1: A1, a2: A2): Value;
export declare function useStore<State, Value, A1, A2, A3>(store: ReadonlyStore<State>, selector: (state: State, a1: A1, a2: A2, a3: A3) => Value, a1: A1, a2: A2, a3: A3): Value;
+29
View File
@@ -0,0 +1,29 @@
"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.useStore = useStore;
var React = _interopRequireWildcard(require("react"));
var _shim = require("use-sync-external-store/shim");
var _withSelector = require("use-sync-external-store/shim/with-selector");
var _reactMajor = _interopRequireDefault(require("../reactMajor"));
/* We need to import the shim because React 17 does not support the `useSyncExternalStore` API.
* More info: https://github.com/mui/mui-x/issues/18303#issuecomment-2958392341 */
/* Some tests fail in R18 with the raw useSyncExternalStore. It may be possible to make it work
* but for now we only enable it for R19+. */
const canUseRawUseSyncExternalStore = _reactMajor.default >= 19;
const useStoreImplementation = canUseRawUseSyncExternalStore ? useStoreR19 : useStoreLegacy;
function useStore(store, selector, a1, a2, a3) {
return useStoreImplementation(store, selector, a1, a2, a3);
}
function useStoreR19(store, selector, a1, a2, a3) {
const getSelection = React.useCallback(() => selector(store.getSnapshot(), a1, a2, a3), [store, selector, a1, a2, a3]);
return (0, _shim.useSyncExternalStore)(store.subscribe, getSelection, getSelection);
}
function useStoreLegacy(store, selector, a1, a2, a3) {
return (0, _withSelector.useSyncExternalStoreWithSelector)(store.subscribe, store.getSnapshot, store.getSnapshot, state => selector(state, a1, a2, a3));
}
+20
View File
@@ -0,0 +1,20 @@
import * as React from 'react';
/* We need to import the shim because React 17 does not support the `useSyncExternalStore` API.
* More info: https://github.com/mui/mui-x/issues/18303#issuecomment-2958392341 */
import { useSyncExternalStore } from 'use-sync-external-store/shim';
import { useSyncExternalStoreWithSelector } from 'use-sync-external-store/shim/with-selector';
import reactMajor from "../reactMajor/index.mjs";
/* Some tests fail in R18 with the raw useSyncExternalStore. It may be possible to make it work
* but for now we only enable it for R19+. */
const canUseRawUseSyncExternalStore = reactMajor >= 19;
const useStoreImplementation = canUseRawUseSyncExternalStore ? useStoreR19 : useStoreLegacy;
export function useStore(store, selector, a1, a2, a3) {
return useStoreImplementation(store, selector, a1, a2, a3);
}
function useStoreR19(store, selector, a1, a2, a3) {
const getSelection = React.useCallback(() => selector(store.getSnapshot(), a1, a2, a3), [store, selector, a1, a2, a3]);
return useSyncExternalStore(store.subscribe, getSelection, getSelection);
}
function useStoreLegacy(store, selector, a1, a2, a3) {
return useSyncExternalStoreWithSelector(store.subscribe, store.getSnapshot, store.getSnapshot, state => selector(state, a1, a2, a3));
}
+6
View File
@@ -0,0 +1,6 @@
import type { ReadonlyStore } from "./Store.mjs";
/**
* An Effect implementation for the Store. This should be used for side-effects only. To
* compute and store derived state, use `createSelectorMemoized` instead.
*/
export declare function useStoreEffect<State, Value>(store: ReadonlyStore<State>, selector: (state: State) => Value, effect: (previous: Value, next: Value) => void): void;
+6
View File
@@ -0,0 +1,6 @@
import type { ReadonlyStore } from "./Store.js";
/**
* An Effect implementation for the Store. This should be used for side-effects only. To
* compute and store derived state, use `createSelectorMemoized` instead.
*/
export declare function useStoreEffect<State, Value>(store: ReadonlyStore<State>, selector: (state: State) => Value, effect: (previous: Value, next: Value) => void): void;
+58
View File
@@ -0,0 +1,58 @@
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.useStoreEffect = useStoreEffect;
var _useLazyRef = _interopRequireDefault(require("@mui/utils/useLazyRef"));
var _useOnMount = _interopRequireDefault(require("@mui/utils/useOnMount"));
const noop = () => {};
/**
* An Effect implementation for the Store. This should be used for side-effects only. To
* compute and store derived state, use `createSelectorMemoized` instead.
*/
function useStoreEffect(store, selector, effect) {
const instance = (0, _useLazyRef.default)(initialize, {
store,
selector
}).current;
instance.effect = effect;
(0, _useOnMount.default)(instance.onMount);
}
// `useLazyRef` typings are incorrect, `params` should not be optional
function initialize(params) {
const {
store,
selector
} = params;
let previousState = selector(store.state);
const instance = {
effect: noop,
dispose: null,
// We want a single subscription done right away and cleared on unmount only,
// but React triggers `useOnMount` multiple times in dev, so we need to manage
// the subscription anyway.
subscribe: () => {
instance.dispose ?? (instance.dispose = store.subscribe(state => {
const nextState = selector(state);
if (!Object.is(previousState, nextState)) {
const prev = previousState;
previousState = nextState;
instance.effect(prev, nextState);
}
}));
},
onMount: () => {
instance.subscribe();
return () => {
instance.dispose?.();
instance.dispose = null;
};
}
};
instance.subscribe();
return instance;
}
+51
View File
@@ -0,0 +1,51 @@
import useLazyRef from '@mui/utils/useLazyRef';
import useOnMount from '@mui/utils/useOnMount';
const noop = () => {};
/**
* An Effect implementation for the Store. This should be used for side-effects only. To
* compute and store derived state, use `createSelectorMemoized` instead.
*/
export function useStoreEffect(store, selector, effect) {
const instance = useLazyRef(initialize, {
store,
selector
}).current;
instance.effect = effect;
useOnMount(instance.onMount);
}
// `useLazyRef` typings are incorrect, `params` should not be optional
function initialize(params) {
const {
store,
selector
} = params;
let previousState = selector(store.state);
const instance = {
effect: noop,
dispose: null,
// We want a single subscription done right away and cleared on unmount only,
// but React triggers `useOnMount` multiple times in dev, so we need to manage
// the subscription anyway.
subscribe: () => {
instance.dispose ??= store.subscribe(state => {
const nextState = selector(state);
if (!Object.is(previousState, nextState)) {
const prev = previousState;
previousState = nextState;
instance.effect(prev, nextState);
}
});
},
onMount: () => {
instance.subscribe();
return () => {
instance.dispose?.();
instance.dispose = null;
};
}
};
instance.subscribe();
return instance;
}