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,26 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "Breadcrumb", {
enumerable: true,
get: function() {
return Breadcrumb;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _useBreadcrumb = require("./useBreadcrumb");
const _renderBreadcrumb = require("./renderBreadcrumb");
const _useBreadcrumbStylesstyles = require("./useBreadcrumbStyles.styles");
const _useBreadcrumbContextValue = require("./useBreadcrumbContextValue");
const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
const Breadcrumb = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
const state = (0, _useBreadcrumb.useBreadcrumb_unstable)(props, ref);
const contextValues = (0, _useBreadcrumbContextValue.useBreadcrumbContextValues_unstable)(state);
(0, _useBreadcrumbStylesstyles.useBreadcrumbStyles_unstable)(state);
(0, _reactsharedcontexts.useCustomStyleHook_unstable)('useBreadcrumbStyles_unstable')(state);
return (0, _renderBreadcrumb.renderBreadcrumb_unstable)(state, contextValues);
});
Breadcrumb.displayName = 'Breadcrumb';

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/Breadcrumb/Breadcrumb.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useBreadcrumb_unstable } from './useBreadcrumb';\nimport { renderBreadcrumb_unstable } from './renderBreadcrumb';\nimport { useBreadcrumbStyles_unstable } from './useBreadcrumbStyles.styles';\nimport type { BreadcrumbProps } from './Breadcrumb.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useBreadcrumbContextValues_unstable } from './useBreadcrumbContextValue';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * Breadcrumb component - TODO: add more docs\n */\nexport const Breadcrumb: ForwardRefComponent<BreadcrumbProps> = React.forwardRef((props, ref) => {\n const state = useBreadcrumb_unstable(props, ref);\n const contextValues = useBreadcrumbContextValues_unstable(state);\n\n useBreadcrumbStyles_unstable(state);\n useCustomStyleHook_unstable('useBreadcrumbStyles_unstable')(state);\n\n return renderBreadcrumb_unstable(state, contextValues);\n});\n\nBreadcrumb.displayName = 'Breadcrumb';\n"],"names":["React","useBreadcrumb_unstable","renderBreadcrumb_unstable","useBreadcrumbStyles_unstable","useBreadcrumbContextValues_unstable","useCustomStyleHook_unstable","Breadcrumb","forwardRef","props","ref","state","contextValues","displayName"],"mappings":"AAAA;;;;;;;;;;;;iEAEuB,QAAQ;+BACQ,kBAAkB;kCACf,qBAAqB;2CAClB,+BAA+B;2CAGxB,8BAA8B;qCACtC,kCAAkC;AAKvE,MAAMM,aAAAA,WAAAA,GAAmDN,OAAMO,UAAU,CAAC,CAACC,OAAOC;IACvF,MAAMC,YAAQT,qCAAAA,EAAuBO,OAAOC;IAC5C,MAAME,oBAAgBP,8DAAAA,EAAoCM;QAE1DP,uDAAAA,EAA6BO;QAC7BL,gDAAAA,EAA4B,gCAAgCK;IAE5D,WAAOR,2CAAAA,EAA0BQ,OAAOC;AAC1C,GAAG;AAEHL,WAAWM,WAAW,GAAG"}

View File

@@ -0,0 +1,4 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/Breadcrumb/Breadcrumb.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\n/**\n * Data shared between breadcrumb components\n */\nexport type BreadcrumbContextValues = Required<Pick<BreadcrumbProps, 'size'>>;\n\nexport type BreadcrumbSlots = {\n /**\n * Root element of the component.\n */\n root: Slot<'nav'>;\n /**\n * Ordered list which contains items.\n */\n list?: Slot<'ol'>;\n};\n\n/**\n * Breadcrumb Props\n */\nexport type BreadcrumbProps = ComponentProps<BreadcrumbSlots> & {\n /**\n * Sets the focus behavior for the Breadcrumb.\n *\n * `tab`\n * This behaviour will cycle through all elements inside of the Breadcrumb when pressing the Tab key and then release focus\n * after the last inner element.\n *\n * `arrow`\n * This behaviour will cycle through all elements inside of the Breadcrumb when pressing the Arrow key.\n *\n * @default 'tab'\n */\n focusMode?: 'arrow' | 'tab';\n\n /**\n * Controls size of Breadcrumb items and dividers.\n *\n * @default 'medium'\n */\n size?: 'small' | 'medium' | 'large';\n};\n\n/**\n * State used in rendering Breadcrumb\n */\nexport type BreadcrumbState = ComponentState<BreadcrumbSlots> & Required<Pick<BreadcrumbProps, 'size'>>;\n\nexport type BreadcrumbBaseProps = Omit<BreadcrumbProps, 'size'>;\n\nexport type BreadcrumbBaseState = Omit<BreadcrumbState, 'size'>;\n"],"names":[],"mappings":""}

View File

@@ -0,0 +1,33 @@
'use client';
"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, {
BreadcrumbProvider: function() {
return BreadcrumbProvider;
},
breadcrumbDefaultValue: function() {
return breadcrumbDefaultValue;
},
useBreadcrumbContext_unstable: function() {
return useBreadcrumbContext_unstable;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const BreadcrumbContext = /*#__PURE__*/ _react.createContext(undefined);
const breadcrumbDefaultValue = {
size: 'medium'
};
const BreadcrumbProvider = BreadcrumbContext.Provider;
const useBreadcrumbContext_unstable = ()=>{
var _React_useContext;
return (_React_useContext = _react.useContext(BreadcrumbContext)) !== null && _React_useContext !== void 0 ? _React_useContext : breadcrumbDefaultValue;
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/Breadcrumb/BreadcrumbContext.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { BreadcrumbContextValues } from './Breadcrumb.types';\n\nconst BreadcrumbContext = React.createContext<BreadcrumbContextValues | undefined>(undefined);\n\n/**\n * @internal\n */\nexport const breadcrumbDefaultValue: BreadcrumbContextValues = {\n size: 'medium',\n};\n\n/**\n * @internal\n */\nexport const BreadcrumbProvider = BreadcrumbContext.Provider;\n\n/**\n * @internal\n */\nexport const useBreadcrumbContext_unstable = (): BreadcrumbContextValues =>\n React.useContext(BreadcrumbContext) ?? breadcrumbDefaultValue;\n"],"names":["React","BreadcrumbContext","createContext","undefined","breadcrumbDefaultValue","size","BreadcrumbProvider","Provider","useBreadcrumbContext_unstable","useContext"],"mappings":"AAAA;;;;;;;;;;;;sBAiBaM;eAAAA;;0BAPAF;;;iCAYAI;;;;;iEApBU,QAAQ;AAG/B,MAAMP,kCAAoBD,OAAME,aAAa,CAAsCC;AAK5E,MAAMC,yBAAkD;IAC7DC,MAAM;AACR,EAAE;AAKK,2BAA2BJ,kBAAkBM,QAAQ,CAAC;AAKtD,MAAMC,gCAAgC;QAC3CR;WAAAA,CAAAA,oBAAAA,OAAMS,UAAU,CAACR,kBAAAA,MAAAA,QAAjBD,sBAAAA,KAAAA,IAAAA,oBAAuCI;EAAuB"}

View File

@@ -0,0 +1,47 @@
"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, {
Breadcrumb: function() {
return _Breadcrumb.Breadcrumb;
},
BreadcrumbProvider: function() {
return _BreadcrumbContext.BreadcrumbProvider;
},
breadcrumbClassNames: function() {
return _useBreadcrumbStylesstyles.breadcrumbClassNames;
},
breadcrumbDefaultValue: function() {
return _BreadcrumbContext.breadcrumbDefaultValue;
},
renderBreadcrumb_unstable: function() {
return _renderBreadcrumb.renderBreadcrumb_unstable;
},
useBreadcrumbA11yBehavior_unstable: function() {
return _useBreadcrumb.useBreadcrumbA11yBehavior_unstable;
},
useBreadcrumbBase_unstable: function() {
return _useBreadcrumb.useBreadcrumbBase_unstable;
},
useBreadcrumbContext_unstable: function() {
return _BreadcrumbContext.useBreadcrumbContext_unstable;
},
useBreadcrumbStyles_unstable: function() {
return _useBreadcrumbStylesstyles.useBreadcrumbStyles_unstable;
},
useBreadcrumb_unstable: function() {
return _useBreadcrumb.useBreadcrumb_unstable;
}
});
const _Breadcrumb = require("./Breadcrumb");
const _BreadcrumbContext = require("./BreadcrumbContext");
const _renderBreadcrumb = require("./renderBreadcrumb");
const _useBreadcrumb = require("./useBreadcrumb");
const _useBreadcrumbStylesstyles = require("./useBreadcrumbStyles.styles");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/Breadcrumb/index.ts"],"sourcesContent":["export { Breadcrumb } from './Breadcrumb';\nexport type {\n BreadcrumbBaseProps,\n BreadcrumbBaseState,\n BreadcrumbContextValues,\n BreadcrumbProps,\n BreadcrumbSlots,\n BreadcrumbState,\n} from './Breadcrumb.types';\nexport { BreadcrumbProvider, breadcrumbDefaultValue, useBreadcrumbContext_unstable } from './BreadcrumbContext';\nexport { renderBreadcrumb_unstable } from './renderBreadcrumb';\nexport {\n useBreadcrumb_unstable,\n useBreadcrumbBase_unstable,\n useBreadcrumbA11yBehavior_unstable,\n} from './useBreadcrumb';\nexport { breadcrumbClassNames, useBreadcrumbStyles_unstable } from './useBreadcrumbStyles.styles';\n"],"names":["Breadcrumb","BreadcrumbProvider","breadcrumbDefaultValue","useBreadcrumbContext_unstable","renderBreadcrumb_unstable","useBreadcrumb_unstable","useBreadcrumbBase_unstable","useBreadcrumbA11yBehavior_unstable","breadcrumbClassNames","useBreadcrumbStyles_unstable"],"mappings":";;;;;;;;;;;IAASA;qCAAU;;;eASVC,qCAAkB;;IAOlBO,oBAAoB;;;;eAPAN,yCAAsB;;;eAC1CE,2CAAyB;;;eAIhCG,iDAAkC;;;eADlCD,yCAA0B;;;eAJyBH,gDAA6B;;;eAOnDM,uDAA4B;;;eAJzDJ,qCAAsB;;;4BAZG,eAAe;mCASgD,sBAAsB;kCACtE,qBAAqB;+BAKxD,kBAAkB;2CAC0C,+BAA+B"}

View File

@@ -0,0 +1,24 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "renderBreadcrumb_unstable", {
enumerable: true,
get: function() {
return renderBreadcrumb_unstable;
}
});
const _jsxruntime = require("@fluentui/react-jsx-runtime/jsx-runtime");
const _reactutilities = require("@fluentui/react-utilities");
const _BreadcrumbContext = require("./BreadcrumbContext");
const renderBreadcrumb_unstable = (state, contextValues)=>{
(0, _reactutilities.assertSlots)(state);
return /*#__PURE__*/ (0, _jsxruntime.jsx)(state.root, {
children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_BreadcrumbContext.BreadcrumbProvider, {
value: contextValues,
children: state.list && /*#__PURE__*/ (0, _jsxruntime.jsx)(state.list, {
children: state.root.children
})
})
});
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/Breadcrumb/renderBreadcrumb.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\n\nimport { BreadcrumbProvider } from './BreadcrumbContext';\nimport type { BreadcrumbState, BreadcrumbSlots, BreadcrumbContextValues } from './Breadcrumb.types';\n/**\n * Render the final JSX of Breadcrumb\n */\nexport const renderBreadcrumb_unstable = (\n state: BreadcrumbState,\n contextValues: BreadcrumbContextValues,\n): JSXElement => {\n assertSlots<BreadcrumbSlots>(state);\n return (\n <state.root>\n <BreadcrumbProvider value={contextValues}>\n {state.list && <state.list>{state.root.children}</state.list>}\n </BreadcrumbProvider>\n </state.root>\n );\n};\n"],"names":["assertSlots","BreadcrumbProvider","renderBreadcrumb_unstable","state","contextValues","root","value","list","children"],"mappings":";;;;+BAWaE;;;;;;4BAVb,gDAAiD;gCAErB,4BAA4B;mCAGrB,sBAAsB;AAKlD,kCAAkC,CACvCC,OACAC;QAEAJ,2BAAAA,EAA6BG;IAC7B,OAAA,WAAA,OACE,eAAA,EAACA,MAAME,IAAI,EAAA;kBACT,WAAA,GAAA,mBAAA,EAACJ,qCAAAA,EAAAA;YAAmBK,OAAOF;sBACxBD,MAAMI,IAAI,IAAA,WAAA,OAAI,eAAA,EAACJ,MAAMI,IAAI,EAAA;0BAAEJ,MAAME,IAAI,CAACG,QAAQ;;;;AAIvD,EAAE"}

View File

@@ -0,0 +1,73 @@
'use client';
"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, {
useBreadcrumbA11yBehavior_unstable: function() {
return useBreadcrumbA11yBehavior_unstable;
},
useBreadcrumbBase_unstable: function() {
return useBreadcrumbBase_unstable;
},
useBreadcrumb_unstable: function() {
return useBreadcrumb_unstable;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _reactutilities = require("@fluentui/react-utilities");
const _reacttabster = require("@fluentui/react-tabster");
const useBreadcrumb_unstable = (props, ref)=>{
const { focusMode = 'tab', size = 'medium', ...breadcrumbProps } = props;
const state = useBreadcrumbBase_unstable(breadcrumbProps, ref);
const focusAttributes = useBreadcrumbA11yBehavior_unstable({
focusMode
});
return {
...state,
root: {
...focusAttributes,
...state.root
},
size
};
};
const useBreadcrumbBase_unstable = (props, ref)=>{
const { focusMode = 'tab', list, ...rest } = props;
var _props_arialabel;
return {
components: {
root: 'nav',
list: 'ol'
},
root: _reactutilities.slot.always((0, _reactutilities.getIntrinsicElementProps)('nav', {
ref,
'aria-label': (_props_arialabel = props['aria-label']) !== null && _props_arialabel !== void 0 ? _props_arialabel : 'breadcrumb',
...rest
}), {
elementType: 'nav'
}),
list: _reactutilities.slot.optional(list, {
renderByDefault: true,
defaultProps: {
role: 'list'
},
elementType: 'ol'
})
};
};
const useBreadcrumbA11yBehavior_unstable = ({ focusMode })=>{
const focusAttributes = (0, _reacttabster.useArrowNavigationGroup)({
circular: true,
axis: 'horizontal',
memorizeCurrent: true
});
return focusMode === 'arrow' ? focusAttributes : {};
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/Breadcrumb/useBreadcrumb.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport type { BreadcrumbBaseProps, BreadcrumbBaseState, BreadcrumbProps, BreadcrumbState } from './Breadcrumb.types';\nimport { TabsterDOMAttribute, useArrowNavigationGroup } from '@fluentui/react-tabster';\n\n/**\n * Create the state required to render Breadcrumb.\n *\n * The returned state can be modified with hooks such as useBreadcrumbStyles_unstable,\n * before being passed to renderBreadcrumb_unstable.\n *\n * @param props - props from this instance of Breadcrumb\n * @param ref - reference to root HTMLElement of Breadcrumb\n */\nexport const useBreadcrumb_unstable = (props: BreadcrumbProps, ref: React.Ref<HTMLElement>): BreadcrumbState => {\n const { focusMode = 'tab', size = 'medium', ...breadcrumbProps } = props;\n const state = useBreadcrumbBase_unstable(breadcrumbProps, ref);\n const focusAttributes = useBreadcrumbA11yBehavior_unstable({ focusMode });\n\n return {\n ...state,\n root: {\n ...focusAttributes,\n ...state.root,\n },\n size,\n };\n};\n\n/**\n * Base hook for Breadcrumb component, which manages state related to slots structure and ARIA attributes.\n *\n * Note: keyboard navigation behavior is not handled in this hook, but in useBreadcrumbA11yBehavior_unstable.\n *\n * @param props - props from this instance of Breadcrumb\n * @param ref - reference to root HTMLElement of Breadcrumb\n */\nexport const useBreadcrumbBase_unstable = (\n props: BreadcrumbBaseProps,\n ref: React.Ref<HTMLElement>,\n): BreadcrumbBaseState => {\n const { focusMode = 'tab', list, ...rest } = props;\n\n return {\n components: {\n root: 'nav',\n list: 'ol',\n },\n root: slot.always(\n getIntrinsicElementProps('nav', {\n ref,\n 'aria-label': props['aria-label'] ?? 'breadcrumb',\n ...rest,\n }),\n { elementType: 'nav' },\n ),\n list: slot.optional(list, { renderByDefault: true, defaultProps: { role: 'list' }, elementType: 'ol' }),\n };\n};\n\n/**\n * Hook to get accessibility attributes for Breadcrumb component, such as roving tab index.\n * Based on Tabster's useArrowNavigationGroup.\n *\n * @param focusMode - whether the Breadcrumb uses arrow key navigation or tab key navigation\n * @returns Tabster DOM attributes\n */\nexport const useBreadcrumbA11yBehavior_unstable = ({\n focusMode,\n}: Pick<BreadcrumbBaseProps, 'focusMode'>): Partial<TabsterDOMAttribute> => {\n const focusAttributes = useArrowNavigationGroup({\n circular: true,\n axis: 'horizontal',\n memorizeCurrent: true,\n });\n\n return focusMode === 'arrow' ? focusAttributes : {};\n};\n"],"names":["React","getIntrinsicElementProps","slot","useArrowNavigationGroup","useBreadcrumb_unstable","props","ref","focusMode","size","breadcrumbProps","state","useBreadcrumbBase_unstable","focusAttributes","useBreadcrumbA11yBehavior_unstable","root","list","rest","components","always","elementType","optional","renderByDefault","defaultProps","role","circular","axis","memorizeCurrent"],"mappings":"AAAA;;;;;;;;;;;;sCAqEaa;eAAAA;;IA9BAF,0BAAAA;;;0BAvBAP;;;;;iEAdU,QAAQ;gCACgB,4BAA4B;8BAEd,0BAA0B;AAWhF,MAAMA,yBAAyB,CAACC,OAAwBC;IAC7D,MAAM,EAAEC,YAAY,KAAK,EAAEC,OAAO,QAAQ,EAAE,GAAGC,iBAAiB,GAAGJ;IACnE,MAAMK,QAAQC,2BAA2BF,iBAAiBH;IAC1D,MAAMM,kBAAkBC,mCAAmC;QAAEN;IAAU;IAEvE,OAAO;QACL,GAAGG,KAAK;QACRI,MAAM;YACJ,GAAGF,eAAe;YAClB,GAAGF,MAAMI,IAAI;QACf;QACAN;IACF;AACF,EAAE;AAUK,mCAAmC,CACxCH,OACAC;IAEA,MAAM,EAAEC,YAAY,KAAK,EAAEQ,IAAI,EAAE,GAAGC,MAAM,GAAGX;QAUzBA;IARpB,OAAO;QACLY,YAAY;YACVH,MAAM;YACNC,MAAM;QACR;QACAD,MAAMZ,oBAAAA,CAAKgB,MAAM,KACfjB,wCAAAA,EAAyB,OAAO;YAC9BK;YACA,cAAcD,CAAAA,mBAAAA,KAAK,CAAC,aAAA,AAAa,MAAA,QAAnBA,qBAAAA,KAAAA,IAAAA,mBAAuB;YACrC,GAAGW,IAAI;QACT,IACA;YAAEG,aAAa;QAAM;QAEvBJ,MAAMb,oBAAAA,CAAKkB,QAAQ,CAACL,MAAM;YAAEM,iBAAiB;YAAMC,cAAc;gBAAEC,MAAM;YAAO;YAAGJ,aAAa;QAAK;IACvG;AACF,EAAE;AASK,2CAA2C,CAAC,EACjDZ,SAAS,EAC8B;IACvC,MAAMK,sBAAkBT,qCAAAA,EAAwB;QAC9CqB,UAAU;QACVC,MAAM;QACNC,iBAAiB;IACnB;IAEA,OAAOnB,cAAc,UAAUK,kBAAkB,CAAC;AACpD,EAAE"}

View File

@@ -0,0 +1,21 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "useBreadcrumbContextValues_unstable", {
enumerable: true,
get: function() {
return useBreadcrumbContextValues_unstable;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
function useBreadcrumbContextValues_unstable(state) {
const { size } = state;
return _react.useMemo(()=>({
size
}), [
size
]);
}

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/Breadcrumb/useBreadcrumbContextValue.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type { BreadcrumbContextValues, BreadcrumbState } from './Breadcrumb.types';\n\nexport function useBreadcrumbContextValues_unstable(state: BreadcrumbState): BreadcrumbContextValues {\n const { size } = state;\n return React.useMemo(() => ({ size }), [size]);\n}\n"],"names":["React","useBreadcrumbContextValues_unstable","state","size","useMemo"],"mappings":"AAAA;;;;;;;;;;;;iEAEuB,QAAQ;AAGxB,SAASC,oCAAoCC,KAAsB;IACxE,MAAM,EAAEC,IAAI,EAAE,GAAGD;IACjB,OAAOF,OAAMI,OAAO,CAAC,IAAO,CAAA;YAAED;SAAK,CAAA,EAAI;QAACA;KAAK;AAC/C"}

View File

@@ -0,0 +1,36 @@
'use client';
"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, {
breadcrumbClassNames: function() {
return breadcrumbClassNames;
},
useBreadcrumbStyles_unstable: function() {
return useBreadcrumbStyles_unstable;
}
});
const _react = require("@griffel/react");
const breadcrumbClassNames = {
root: 'fui-Breadcrumb',
list: 'fui-Breadcrumb__list'
};
const useListClassName = /*#__PURE__*/ (0, _react.__resetStyles)("rc5rb6b", null, [
".rc5rb6b{list-style-type:none;display:flex;align-items:center;margin:0;padding:0;}"
]);
const useBreadcrumbStyles_unstable = (state)=>{
'use no memo';
const listBaseClassName = useListClassName();
state.root.className = (0, _react.mergeClasses)(breadcrumbClassNames.root, state.root.className);
if (state.list) {
state.list.className = (0, _react.mergeClasses)(listBaseClassName, breadcrumbClassNames.list, state.list.className);
}
return state;
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["useBreadcrumbStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeResetStyles, mergeClasses } from '@griffel/react';\nexport const breadcrumbClassNames = {\n root: 'fui-Breadcrumb',\n list: 'fui-Breadcrumb__list'\n};\nconst useListClassName = makeResetStyles({\n listStyleType: 'none',\n display: 'flex',\n alignItems: 'center',\n margin: 0,\n padding: 0\n});\n/**\n * Apply styling to the Breadcrumb slots based on the state\n */ export const useBreadcrumbStyles_unstable = (state)=>{\n 'use no memo';\n const listBaseClassName = useListClassName();\n state.root.className = mergeClasses(breadcrumbClassNames.root, state.root.className);\n if (state.list) {\n state.list.className = mergeClasses(listBaseClassName, breadcrumbClassNames.list, state.list.className);\n }\n return state;\n};\n"],"names":["__resetStyles","mergeClasses","breadcrumbClassNames","root","list","useListClassName","useBreadcrumbStyles_unstable","state","listBaseClassName","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAECE,oBAAoB;;;gCAaY;eAA5BI;;;uBAd6B,gBAAgB;AACvD,6BAA6B;IAChCH,IAAI,EAAE,gBAAgB;IACtBC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,gBAAgB,GAAA,WAAA,GAAGL,wBAAA,EAAA,WAAA,MAAA;IAAA;CAMxB,CAAC;AAGS,sCAAsCO,KAAK,IAAG;IACrD,aAAa;IACb,MAAMC,iBAAiB,GAAGH,gBAAgB,CAAC,CAAC;IAC5CE,KAAK,CAACJ,IAAI,CAACM,SAAS,GAAGR,uBAAY,EAACC,oBAAoB,CAACC,IAAI,EAAEI,KAAK,CAACJ,IAAI,CAACM,SAAS,CAAC;IACpF,IAAIF,KAAK,CAACH,IAAI,EAAE;QACZG,KAAK,CAACH,IAAI,CAACK,SAAS,OAAGR,mBAAY,EAACO,iBAAiB,EAAEN,oBAAoB,CAACE,IAAI,EAAEG,KAAK,CAACH,IAAI,CAACK,SAAS,CAAC;IAC3G;IACA,OAAOF,KAAK;AAChB,CAAC"}

View File

@@ -0,0 +1,40 @@
'use client';
"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, {
breadcrumbClassNames: function() {
return breadcrumbClassNames;
},
useBreadcrumbStyles_unstable: function() {
return useBreadcrumbStyles_unstable;
}
});
const _react = require("@griffel/react");
const breadcrumbClassNames = {
root: 'fui-Breadcrumb',
list: 'fui-Breadcrumb__list'
};
const useListClassName = (0, _react.makeResetStyles)({
listStyleType: 'none',
display: 'flex',
alignItems: 'center',
margin: 0,
padding: 0
});
const useBreadcrumbStyles_unstable = (state)=>{
'use no memo';
const listBaseClassName = useListClassName();
state.root.className = (0, _react.mergeClasses)(breadcrumbClassNames.root, state.root.className);
if (state.list) {
state.list.className = (0, _react.mergeClasses)(listBaseClassName, breadcrumbClassNames.list, state.list.className);
}
return state;
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/Breadcrumb/useBreadcrumbStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeResetStyles, mergeClasses } from '@griffel/react';\nimport type { BreadcrumbSlots, BreadcrumbState } from './Breadcrumb.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const breadcrumbClassNames: SlotClassNames<BreadcrumbSlots> = {\n root: 'fui-Breadcrumb',\n list: 'fui-Breadcrumb__list',\n};\n\nconst useListClassName = makeResetStyles({\n listStyleType: 'none',\n display: 'flex',\n alignItems: 'center',\n margin: 0,\n padding: 0,\n});\n\n/**\n * Apply styling to the Breadcrumb slots based on the state\n */\nexport const useBreadcrumbStyles_unstable = (state: BreadcrumbState): BreadcrumbState => {\n 'use no memo';\n\n const listBaseClassName = useListClassName();\n state.root.className = mergeClasses(breadcrumbClassNames.root, state.root.className);\n if (state.list) {\n state.list.className = mergeClasses(listBaseClassName, breadcrumbClassNames.list, state.list.className);\n }\n return state;\n};\n"],"names":["makeResetStyles","mergeClasses","breadcrumbClassNames","root","list","useListClassName","listStyleType","display","alignItems","margin","padding","useBreadcrumbStyles_unstable","state","listBaseClassName","className"],"mappings":"AAAA;;;;;;;;;;;;IAMaE,oBAAAA;;;IAgBAS,4BAAAA;;;;uBApBiC,iBAAiB;AAIxD,6BAA8D;IACnER,MAAM;IACNC,MAAM;AACR,EAAE;AAEF,MAAMC,uBAAmBL,sBAAAA,EAAgB;IACvCM,eAAe;IACfC,SAAS;IACTC,YAAY;IACZC,QAAQ;IACRC,SAAS;AACX;AAKO,qCAAqC,CAACE;IAC3C;IAEA,MAAMC,oBAAoBR;IAC1BO,MAAMT,IAAI,CAACW,SAAS,OAAGb,mBAAAA,EAAaC,qBAAqBC,IAAI,EAAES,MAAMT,IAAI,CAACW,SAAS;IACnF,IAAIF,MAAMR,IAAI,EAAE;QACdQ,MAAMR,IAAI,CAACU,SAAS,OAAGb,mBAAAA,EAAaY,mBAAmBX,qBAAqBE,IAAI,EAAEQ,MAAMR,IAAI,CAACU,SAAS;IACxG;IACA,OAAOF;AACT,EAAE"}