Private
Public Access
1
0

feat: Fluent UI Outlook Lite + connections mockup

This commit is contained in:
2026-04-14 18:52:25 +00:00
parent 1199eff6c3
commit dfa4010406
34820 changed files with 1003813 additions and 205 deletions

View File

@@ -0,0 +1,69 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "createContext", {
enumerable: true,
get: function() {
return createContext;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _reactutilities = require("@fluentui/react-utilities");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _scheduler = require("scheduler");
const createProvider = (Original)=>{
const Provider = (props)=>{
// Holds an actual "props.value"
const valueRef = _react.useRef(props.value);
// Used to sync context updates and avoid stale values, can be considered as render/effect counter of Provider.
const versionRef = _react.useRef(0);
// A stable object, is used to avoid context updates via mutation of its values.
const contextValue = _react.useRef(null);
if (!contextValue.current) {
contextValue.current = {
value: valueRef,
version: versionRef,
listeners: []
};
}
(0, _reactutilities.useIsomorphicLayoutEffect)(()=>{
valueRef.current = props.value;
versionRef.current += 1;
(0, _scheduler.unstable_runWithPriority)(_scheduler.unstable_NormalPriority, ()=>{
contextValue.current.listeners.forEach((listener)=>{
listener([
versionRef.current,
props.value
]);
});
});
}, [
props.value
]);
return _react.createElement(Original, {
value: contextValue.current
}, props.children);
};
/* istanbul ignore else */ if (process.env.NODE_ENV !== 'production') {
Provider.displayName = 'ContextSelector.Provider';
}
return Provider;
};
const createContext = (defaultValue)=>{
// eslint-disable-next-line @fluentui/no-context-default-value
const context = _react.createContext({
value: {
current: defaultValue
},
version: {
current: -1
},
listeners: []
});
context.Provider = createProvider(context.Provider);
// We don't support Consumer API
delete context.Consumer;
return context;
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/createContext.ts"],"sourcesContent":["'use client';\n\nimport { useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport { unstable_NormalPriority as NormalPriority, unstable_runWithPriority as runWithPriority } from 'scheduler';\n\nimport { Context, ContextValue } from './types';\n\nconst createProvider = <Value>(Original: React.Provider<ContextValue<Value>>) => {\n const Provider: React.FC<React.ProviderProps<Value>> = props => {\n // Holds an actual \"props.value\"\n const valueRef = React.useRef(props.value);\n // Used to sync context updates and avoid stale values, can be considered as render/effect counter of Provider.\n const versionRef = React.useRef(0);\n\n // A stable object, is used to avoid context updates via mutation of its values.\n const contextValue = React.useRef<ContextValue<Value>>(null);\n\n if (!contextValue.current) {\n contextValue.current = {\n value: valueRef,\n version: versionRef,\n listeners: [],\n };\n }\n\n useIsomorphicLayoutEffect(() => {\n valueRef.current = props.value;\n versionRef.current += 1;\n\n runWithPriority(NormalPriority, () => {\n (contextValue.current as ContextValue<Value>).listeners.forEach(listener => {\n listener([versionRef.current, props.value]);\n });\n });\n }, [props.value]);\n\n return React.createElement(Original, { value: contextValue.current }, props.children);\n };\n\n /* istanbul ignore else */\n if (process.env.NODE_ENV !== 'production') {\n Provider.displayName = 'ContextSelector.Provider';\n }\n\n return Provider as unknown as React.Provider<ContextValue<Value>>;\n};\n\n/**\n * @internal\n */\nexport const createContext = <Value>(defaultValue: Value): Context<Value> => {\n // eslint-disable-next-line @fluentui/no-context-default-value\n const context = React.createContext<ContextValue<Value>>({\n value: { current: defaultValue },\n version: { current: -1 },\n listeners: [],\n });\n\n context.Provider = createProvider<Value>(context.Provider);\n\n // We don't support Consumer API\n delete (context as unknown as Context<Value>).Consumer;\n\n return context as unknown as Context<Value>;\n};\n"],"names":["createContext","createProvider","Original","Provider","props","valueRef","React","useRef","value","versionRef","contextValue","current","version","listeners","useIsomorphicLayoutEffect","runWithPriority","NormalPriority","forEach","listener","createElement","children","process","env","NODE_ENV","displayName","defaultValue","context","Consumer"],"mappings":"AAAA;;;;;+BAmDaA;;;eAAAA;;;;gCAjD6B;iEACnB;2BACgF;AAIvG,MAAMC,iBAAiB,CAAQC;IAC7B,MAAMC,WAAiDC,CAAAA;QACrD,gCAAgC;QAChC,MAAMC,WAAWC,OAAMC,MAAM,CAACH,MAAMI,KAAK;QACzC,+GAA+G;QAC/G,MAAMC,aAAaH,OAAMC,MAAM,CAAC;QAEhC,gFAAgF;QAChF,MAAMG,eAAeJ,OAAMC,MAAM,CAAsB;QAEvD,IAAI,CAACG,aAAaC,OAAO,EAAE;YACzBD,aAAaC,OAAO,GAAG;gBACrBH,OAAOH;gBACPO,SAASH;gBACTI,WAAW,EAAE;YACf;QACF;QAEAC,IAAAA,yCAAyB,EAAC;YACxBT,SAASM,OAAO,GAAGP,MAAMI,KAAK;YAC9BC,WAAWE,OAAO,IAAI;YAEtBI,IAAAA,mCAAe,EAACC,kCAAc,EAAE;gBAC7BN,aAAaC,OAAO,CAAyBE,SAAS,CAACI,OAAO,CAACC,CAAAA;oBAC9DA,SAAS;wBAACT,WAAWE,OAAO;wBAAEP,MAAMI,KAAK;qBAAC;gBAC5C;YACF;QACF,GAAG;YAACJ,MAAMI,KAAK;SAAC;QAEhB,OAAOF,OAAMa,aAAa,CAACjB,UAAU;YAAEM,OAAOE,aAAaC,OAAO;QAAC,GAAGP,MAAMgB,QAAQ;IACtF;IAEA,wBAAwB,GACxB,IAAIC,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;QACzCpB,SAASqB,WAAW,GAAG;IACzB;IAEA,OAAOrB;AACT;AAKO,MAAMH,gBAAgB,CAAQyB;IACnC,8DAA8D;IAC9D,MAAMC,UAAUpB,OAAMN,aAAa,CAAsB;QACvDQ,OAAO;YAAEG,SAASc;QAAa;QAC/Bb,SAAS;YAAED,SAAS,CAAC;QAAE;QACvBE,WAAW,EAAE;IACf;IAEAa,QAAQvB,QAAQ,GAAGF,eAAsByB,QAAQvB,QAAQ;IAEzD,gCAAgC;IAChC,OAAO,AAACuB,QAAsCC,QAAQ;IAEtD,OAAOD;AACT"}

View File

@@ -0,0 +1,24 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
createContext: function() {
return _createContext.createContext;
},
useContextSelector: function() {
return _useContextSelector.useContextSelector;
},
useHasParentContext: function() {
return _useHasParentContext.useHasParentContext;
}
});
const _createContext = require("./createContext");
const _useContextSelector = require("./useContextSelector");
const _useHasParentContext = require("./useHasParentContext");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export { createContext } from './createContext';\nexport { useContextSelector } from './useContextSelector';\nexport { useHasParentContext } from './useHasParentContext';\n// eslint-disable-next-line @fluentui/ban-context-export\nexport type { Context, ContextSelector, ContextValue, ContextValues, ContextVersion } from './types';\n"],"names":["createContext","useContextSelector","useHasParentContext"],"mappings":";;;;;;;;;;;IAASA,aAAa;eAAbA,4BAAa;;IACbC,kBAAkB;eAAlBA,sCAAkB;;IAClBC,mBAAmB;eAAnBA,wCAAmB;;;+BAFE;oCACK;qCACC"}

View File

@@ -0,0 +1,6 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/types.ts"],"sourcesContent":["import * as React from 'react';\n\n/**\n * @internal\n */\nexport type Context<Value> = React.Context<Value> & {\n Provider: React.FC<React.ProviderProps<Value>>;\n Consumer: never;\n};\n\nexport type ContextSelector<Value, SelectedValue> = (value: Value) => SelectedValue;\n\n/**\n * @internal\n */\nexport type ContextVersion = number;\n\n/**\n * @internal\n */\nexport type ContextValue<Value> = {\n /** Holds a set of subscribers from components. */\n listeners: ((payload: readonly [ContextVersion, Value]) => void)[];\n\n /** Holds an actual value of React's context that will be propagated down for computations. */\n value: // eslint-disable-next-line @typescript-eslint/no-deprecated\n React.MutableRefObject<Value>;\n\n /** A version field is used to sync a context value and consumers. */\n version: // eslint-disable-next-line @typescript-eslint/no-deprecated\n React.MutableRefObject<ContextVersion>;\n};\n\n/**\n * @internal\n */\nexport type ContextValues<Value> = ContextValue<Value> & {\n /** List of listners to publish changes */\n listeners: ((payload: readonly [ContextVersion, Record<string, Value>]) => void)[];\n};\n"],"names":[],"mappings":";;;;;iEAAuB"}

View File

@@ -0,0 +1,80 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "useContextSelector", {
enumerable: true,
get: function() {
return useContextSelector;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _reactutilities = require("@fluentui/react-utilities");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const useContextSelector = (context, selector)=>{
const contextValue = _react.useContext(context);
const { value: { current: value }, version: { current: version }, listeners } = contextValue;
const selected = selector(value);
const [state, setState] = _react.useState([
value,
selected
]);
const dispatch = (payload)=>{
setState((prevState)=>{
if (!payload) {
// early bail out when is dispatched during render
return [
value,
selected
];
}
if (payload[0] <= version) {
if (Object.is(prevState[1], selected)) {
return prevState; // bail out
}
return [
value,
selected
];
}
try {
if (Object.is(prevState[0], payload[1])) {
return prevState; // do not update
}
const nextSelected = selector(payload[1]);
if (Object.is(prevState[1], nextSelected)) {
return prevState; // do not update
}
return [
payload[1],
nextSelected
];
} catch (e) {
// ignored (stale props or some other reason)
}
// explicitly spread to enforce typing
return [
prevState[0],
prevState[1]
]; // schedule update
});
};
if (!Object.is(state[1], selected)) {
// schedule re-render
// this is safe because it's self contained
dispatch(undefined);
}
const stableDispatch = (0, _reactutilities.useEventCallback)(dispatch);
(0, _reactutilities.useIsomorphicLayoutEffect)(()=>{
listeners.push(stableDispatch);
return ()=>{
const index = listeners.indexOf(stableDispatch);
listeners.splice(index, 1);
};
}, [
stableDispatch,
listeners
]);
return state[1];
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/useContextSelector.ts"],"sourcesContent":["'use client';\n\nimport { useEventCallback, useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\nimport * as React from 'react';\n\nimport { Context, ContextSelector, ContextValue, ContextVersion } from './types';\n\n/**\n * @internal\n * This hook returns context selected value by selector.\n * It will only accept context created by `createContext`.\n * It will trigger re-render if only the selected value is referentially changed.\n */\nexport const useContextSelector = <Value, SelectedValue>(\n context: Context<Value>,\n selector: ContextSelector<Value, SelectedValue>,\n): SelectedValue => {\n const contextValue = React.useContext(context as unknown as Context<ContextValue<Value>>);\n\n const {\n value: { current: value },\n version: { current: version },\n listeners,\n } = contextValue;\n const selected = selector(value);\n\n const [state, setState] = React.useState<readonly [Value, SelectedValue]>([value, selected]);\n const dispatch = (\n payload:\n | undefined // undefined from render below\n | readonly [ContextVersion, Value], // from provider effect\n ) => {\n setState(prevState => {\n if (!payload) {\n // early bail out when is dispatched during render\n return [value, selected] as const;\n }\n\n if (payload[0] <= version) {\n if (Object.is(prevState[1], selected)) {\n return prevState; // bail out\n }\n\n return [value, selected] as const;\n }\n\n try {\n if (Object.is(prevState[0], payload[1])) {\n return prevState; // do not update\n }\n\n const nextSelected = selector(payload[1]);\n\n if (Object.is(prevState[1], nextSelected)) {\n return prevState; // do not update\n }\n\n return [payload[1], nextSelected] as const;\n } catch (e) {\n // ignored (stale props or some other reason)\n }\n\n // explicitly spread to enforce typing\n return [prevState[0], prevState[1]] as const; // schedule update\n });\n };\n\n if (!Object.is(state[1], selected)) {\n // schedule re-render\n // this is safe because it's self contained\n dispatch(undefined);\n }\n\n const stableDispatch = useEventCallback(dispatch);\n\n useIsomorphicLayoutEffect(() => {\n listeners.push(stableDispatch);\n\n return () => {\n const index = listeners.indexOf(stableDispatch);\n listeners.splice(index, 1);\n };\n }, [stableDispatch, listeners]);\n\n return state[1] as SelectedValue;\n};\n"],"names":["useContextSelector","context","selector","contextValue","React","useContext","value","current","version","listeners","selected","state","setState","useState","dispatch","payload","prevState","Object","is","nextSelected","e","undefined","stableDispatch","useEventCallback","useIsomorphicLayoutEffect","push","index","indexOf","splice"],"mappings":"AAAA;;;;;+BAaaA;;;eAAAA;;;;gCAX+C;iEACrC;AAUhB,MAAMA,qBAAqB,CAChCC,SACAC;IAEA,MAAMC,eAAeC,OAAMC,UAAU,CAACJ;IAEtC,MAAM,EACJK,OAAO,EAAEC,SAASD,KAAK,EAAE,EACzBE,SAAS,EAAED,SAASC,OAAO,EAAE,EAC7BC,SAAS,EACV,GAAGN;IACJ,MAAMO,WAAWR,SAASI;IAE1B,MAAM,CAACK,OAAOC,SAAS,GAAGR,OAAMS,QAAQ,CAAkC;QAACP;QAAOI;KAAS;IAC3F,MAAMI,WAAW,CACfC;QAIAH,SAASI,CAAAA;YACP,IAAI,CAACD,SAAS;gBACZ,kDAAkD;gBAClD,OAAO;oBAACT;oBAAOI;iBAAS;YAC1B;YAEA,IAAIK,OAAO,CAAC,EAAE,IAAIP,SAAS;gBACzB,IAAIS,OAAOC,EAAE,CAACF,SAAS,CAAC,EAAE,EAAEN,WAAW;oBACrC,OAAOM,WAAW,WAAW;gBAC/B;gBAEA,OAAO;oBAACV;oBAAOI;iBAAS;YAC1B;YAEA,IAAI;gBACF,IAAIO,OAAOC,EAAE,CAACF,SAAS,CAAC,EAAE,EAAED,OAAO,CAAC,EAAE,GAAG;oBACvC,OAAOC,WAAW,gBAAgB;gBACpC;gBAEA,MAAMG,eAAejB,SAASa,OAAO,CAAC,EAAE;gBAExC,IAAIE,OAAOC,EAAE,CAACF,SAAS,CAAC,EAAE,EAAEG,eAAe;oBACzC,OAAOH,WAAW,gBAAgB;gBACpC;gBAEA,OAAO;oBAACD,OAAO,CAAC,EAAE;oBAAEI;iBAAa;YACnC,EAAE,OAAOC,GAAG;YACV,6CAA6C;YAC/C;YAEA,sCAAsC;YACtC,OAAO;gBAACJ,SAAS,CAAC,EAAE;gBAAEA,SAAS,CAAC,EAAE;aAAC,EAAW,kBAAkB;QAClE;IACF;IAEA,IAAI,CAACC,OAAOC,EAAE,CAACP,KAAK,CAAC,EAAE,EAAED,WAAW;QAClC,qBAAqB;QACrB,2CAA2C;QAC3CI,SAASO;IACX;IAEA,MAAMC,iBAAiBC,IAAAA,gCAAgB,EAACT;IAExCU,IAAAA,yCAAyB,EAAC;QACxBf,UAAUgB,IAAI,CAACH;QAEf,OAAO;YACL,MAAMI,QAAQjB,UAAUkB,OAAO,CAACL;YAChCb,UAAUmB,MAAM,CAACF,OAAO;QAC1B;IACF,GAAG;QAACJ;QAAgBb;KAAU;IAE9B,OAAOE,KAAK,CAAC,EAAE;AACjB"}

View File

@@ -0,0 +1,20 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "useHasParentContext", {
enumerable: true,
get: function() {
return useHasParentContext;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
function useHasParentContext(context) {
const contextValue = _react.useContext(context);
if (contextValue.version) {
return contextValue.version.current !== -1;
}
return false;
}

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/useHasParentContext.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Context, ContextValue } from './types';\n\n/**\n * @internal\n * Utility hook for contexts created by react-context-selector to determine if a parent context exists\n * WARNING: This hook will not work for native React contexts\n *\n * @param context - context created by react-context-selector\n * @returns whether the hook is wrapped by a parent context\n */\nexport function useHasParentContext<Value>(context: Context<Value>): boolean {\n const contextValue = React.useContext(context as unknown as Context<ContextValue<Value>>);\n\n if (contextValue.version) {\n return contextValue.version.current !== -1;\n }\n\n return false;\n}\n"],"names":["useHasParentContext","context","contextValue","React","useContext","version","current"],"mappings":"AAAA;;;;;+BAagBA;;;eAAAA;;;;iEAXO;AAWhB,SAASA,oBAA2BC,OAAuB;IAChE,MAAMC,eAAeC,OAAMC,UAAU,CAACH;IAEtC,IAAIC,aAAaG,OAAO,EAAE;QACxB,OAAOH,aAAaG,OAAO,CAACC,OAAO,KAAK,CAAC;IAC3C;IAEA,OAAO;AACT"}