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,15 @@
'use client';
import * as React from 'react';
import { useMenuItemCheckbox_unstable } from './useMenuItemCheckbox';
import { renderMenuItemCheckbox_unstable } from './renderMenuItemCheckbox';
import { useMenuItemCheckboxStyles_unstable } from './useMenuItemCheckboxStyles.styles';
import { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';
/**
* Define a styled MenuItemCheckbox, using the `useMenuItemCheckbox_unstable` hook.
*/ export const MenuItemCheckbox = /*#__PURE__*/ React.forwardRef((props, ref)=>{
const state = useMenuItemCheckbox_unstable(props, ref);
useMenuItemCheckboxStyles_unstable(state);
useCustomStyleHook_unstable('useMenuItemCheckboxStyles_unstable')(state);
return renderMenuItemCheckbox_unstable(state);
});
MenuItemCheckbox.displayName = 'MenuItemCheckbox';

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/MenuItemCheckbox/MenuItemCheckbox.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useMenuItemCheckbox_unstable } from './useMenuItemCheckbox';\nimport { renderMenuItemCheckbox_unstable } from './renderMenuItemCheckbox';\nimport { useMenuItemCheckboxStyles_unstable } from './useMenuItemCheckboxStyles.styles';\nimport type { MenuItemCheckboxProps } from './MenuItemCheckbox.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * Define a styled MenuItemCheckbox, using the `useMenuItemCheckbox_unstable` hook.\n */\nexport const MenuItemCheckbox: ForwardRefComponent<MenuItemCheckboxProps> = React.forwardRef((props, ref) => {\n const state = useMenuItemCheckbox_unstable(props, ref);\n\n useMenuItemCheckboxStyles_unstable(state);\n\n useCustomStyleHook_unstable('useMenuItemCheckboxStyles_unstable')(state);\n\n return renderMenuItemCheckbox_unstable(state);\n});\n\nMenuItemCheckbox.displayName = 'MenuItemCheckbox';\n"],"names":["React","useMenuItemCheckbox_unstable","renderMenuItemCheckbox_unstable","useMenuItemCheckboxStyles_unstable","useCustomStyleHook_unstable","MenuItemCheckbox","forwardRef","props","ref","state","displayName"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,4BAA4B,QAAQ,wBAAwB;AACrE,SAASC,+BAA+B,QAAQ,2BAA2B;AAC3E,SAASC,kCAAkC,QAAQ,qCAAqC;AAGxF,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,iCAA+DL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IACnG,MAAMC,QAAQR,6BAA6BM,OAAOC;IAElDL,mCAAmCM;IAEnCL,4BAA4B,sCAAsCK;IAElE,OAAOP,gCAAgCO;AACzC,GAAG;AAEHJ,iBAAiBK,WAAW,GAAG"}

View File

@@ -0,0 +1 @@
export { };

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/MenuItemCheckbox/MenuItemCheckbox.types.ts"],"sourcesContent":["import type { MenuItemSelectableProps, MenuItemSelectableState } from '../../selectable/index';\nimport type { MenuItemProps, MenuItemState } from '../MenuItem/MenuItem.types';\n\nexport type MenuItemCheckboxProps = MenuItemProps & MenuItemSelectableProps;\n\nexport type MenuItemCheckboxState = MenuItemState & MenuItemSelectableState;\n"],"names":[],"mappings":"AAKA,WAA4E"}

View File

@@ -0,0 +1,4 @@
export { MenuItemCheckbox } from './MenuItemCheckbox';
export { renderMenuItemCheckbox_unstable } from './renderMenuItemCheckbox';
export { useMenuItemCheckbox_unstable, useMenuItemCheckboxBase_unstable } from './useMenuItemCheckbox';
export { menuItemCheckboxClassNames, useMenuItemCheckboxStyles_unstable } from './useMenuItemCheckboxStyles.styles';

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/MenuItemCheckbox/index.ts"],"sourcesContent":["export type { MenuItemCheckboxProps, MenuItemCheckboxState } from './MenuItemCheckbox.types';\nexport { MenuItemCheckbox } from './MenuItemCheckbox';\nexport { renderMenuItemCheckbox_unstable } from './renderMenuItemCheckbox';\nexport { useMenuItemCheckbox_unstable, useMenuItemCheckboxBase_unstable } from './useMenuItemCheckbox';\nexport { menuItemCheckboxClassNames, useMenuItemCheckboxStyles_unstable } from './useMenuItemCheckboxStyles.styles';\n"],"names":["MenuItemCheckbox","renderMenuItemCheckbox_unstable","useMenuItemCheckbox_unstable","useMenuItemCheckboxBase_unstable","menuItemCheckboxClassNames","useMenuItemCheckboxStyles_unstable"],"mappings":"AACA,SAASA,gBAAgB,QAAQ,qBAAqB;AACtD,SAASC,+BAA+B,QAAQ,2BAA2B;AAC3E,SAASC,4BAA4B,EAAEC,gCAAgC,QAAQ,wBAAwB;AACvG,SAASC,0BAA0B,EAAEC,kCAAkC,QAAQ,qCAAqC"}

View File

@@ -0,0 +1,18 @@
import { jsx as _jsx, jsxs as _jsxs } from "@fluentui/react-jsx-runtime/jsx-runtime";
import { assertSlots } from '@fluentui/react-utilities';
/** Function that renders the final JSX of the component */ export const renderMenuItemCheckbox_unstable = (state)=>{
assertSlots(state);
return /*#__PURE__*/ _jsxs(state.root, {
children: [
state.checkmark && /*#__PURE__*/ _jsx(state.checkmark, {}),
state.icon && /*#__PURE__*/ _jsx(state.icon, {}),
state.content && /*#__PURE__*/ _jsxs(state.content, {
children: [
state.content.children,
state.subText && /*#__PURE__*/ _jsx(state.subText, {})
]
}),
state.secondaryContent && /*#__PURE__*/ _jsx(state.secondaryContent, {})
]
});
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/MenuItemCheckbox/renderMenuItemCheckbox.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport type { MenuItemCheckboxState } from './MenuItemCheckbox.types';\nimport type { MenuItemSlots } from '../MenuItem/MenuItem.types';\n\n/** Function that renders the final JSX of the component */\nexport const renderMenuItemCheckbox_unstable = (state: MenuItemCheckboxState): JSXElement => {\n assertSlots<MenuItemSlots>(state);\n\n return (\n <state.root>\n {state.checkmark && <state.checkmark />}\n {state.icon && <state.icon />}\n {state.content && (\n <state.content>\n {state.content.children}\n {state.subText && <state.subText />}\n </state.content>\n )}\n {state.secondaryContent && <state.secondaryContent />}\n </state.root>\n );\n};\n"],"names":["assertSlots","renderMenuItemCheckbox_unstable","state","root","checkmark","icon","content","children","subText","secondaryContent"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AACjD,SAASA,WAAW,QAAQ,4BAA4B;AAKxD,0DAA0D,GAC1D,OAAO,MAAMC,kCAAkC,CAACC;IAC9CF,YAA2BE;IAE3B,qBACE,MAACA,MAAMC,IAAI;;YACRD,MAAME,SAAS,kBAAI,KAACF,MAAME,SAAS;YACnCF,MAAMG,IAAI,kBAAI,KAACH,MAAMG,IAAI;YACzBH,MAAMI,OAAO,kBACZ,MAACJ,MAAMI,OAAO;;oBACXJ,MAAMI,OAAO,CAACC,QAAQ;oBACtBL,MAAMM,OAAO,kBAAI,KAACN,MAAMM,OAAO;;;YAGnCN,MAAMO,gBAAgB,kBAAI,KAACP,MAAMO,gBAAgB;;;AAGxD,EAAE"}

View File

@@ -0,0 +1,50 @@
'use client';
import * as React from 'react';
import { slot } from '@fluentui/react-utilities';
import { Checkmark16Filled } from '@fluentui/react-icons';
import { useMenuListContext_unstable } from '../../contexts/menuListContext';
import { useMenuItemBase_unstable } from '../MenuItem/useMenuItem';
/** Returns the props and state required to render the component */ export const useMenuItemCheckbox_unstable = (props, ref)=>{
const state = useMenuItemCheckboxBase_unstable(props, ref);
// Set default checkmark icon
if (state.checkmark) {
var _state_checkmark;
var _children;
(_children = (_state_checkmark = state.checkmark).children) !== null && _children !== void 0 ? _children : _state_checkmark.children = /*#__PURE__*/ React.createElement(Checkmark16Filled, null);
}
return state;
};
/**
* Base hook for MenuItemCheckbox component, produces state required to render the component
*
* @internal
*/ export const useMenuItemCheckboxBase_unstable = (props, ref)=>{
const toggleCheckbox = useMenuListContext_unstable((context)=>context.toggleCheckbox);
const { name, value } = props;
const checked = useMenuListContext_unstable((context)=>{
var _context_checkedValues;
const checkedItems = ((_context_checkedValues = context.checkedValues) === null || _context_checkedValues === void 0 ? void 0 : _context_checkedValues[name]) || [];
return checkedItems.indexOf(value) !== -1;
});
const state = {
...useMenuItemBase_unstable({
role: 'menuitemcheckbox',
persistOnClick: true,
...props,
'aria-checked': checked,
checkmark: slot.optional(props.checkmark, {
renderByDefault: true,
elementType: 'span'
}),
onClick: (e)=>{
var _props_onClick;
toggleCheckbox === null || toggleCheckbox === void 0 ? void 0 : toggleCheckbox(e, name, value, checked);
(_props_onClick = props.onClick) === null || _props_onClick === void 0 ? void 0 : _props_onClick.call(props, e);
}
}, ref),
name,
value,
checked
};
return state;
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/MenuItemCheckbox/useMenuItemCheckbox.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { slot } from '@fluentui/react-utilities';\nimport { Checkmark16Filled } from '@fluentui/react-icons';\nimport { useMenuListContext_unstable } from '../../contexts/menuListContext';\nimport { useMenuItemBase_unstable } from '../MenuItem/useMenuItem';\nimport type { MenuItemCheckboxProps, MenuItemCheckboxState } from './MenuItemCheckbox.types';\nimport type { ARIAButtonElement, ARIAButtonElementIntersection } from '@fluentui/react-aria';\n\n/** Returns the props and state required to render the component */\nexport const useMenuItemCheckbox_unstable = (\n props: MenuItemCheckboxProps,\n ref: React.Ref<ARIAButtonElement<'div'>>,\n): MenuItemCheckboxState => {\n const state = useMenuItemCheckboxBase_unstable(props, ref);\n\n // Set default checkmark icon\n if (state.checkmark) {\n state.checkmark.children ??= <Checkmark16Filled />;\n }\n\n return state;\n};\n\n/**\n * Base hook for MenuItemCheckbox component, produces state required to render the component\n *\n * @internal\n */\nexport const useMenuItemCheckboxBase_unstable = (\n props: MenuItemCheckboxProps,\n ref: React.Ref<ARIAButtonElement<'div'>>,\n): MenuItemCheckboxState => {\n const toggleCheckbox = useMenuListContext_unstable(context => context.toggleCheckbox);\n const { name, value } = props;\n\n const checked = useMenuListContext_unstable(context => {\n const checkedItems = context.checkedValues?.[name] || [];\n return checkedItems.indexOf(value) !== -1;\n });\n\n const state: MenuItemCheckboxState = {\n ...useMenuItemBase_unstable(\n {\n role: 'menuitemcheckbox',\n persistOnClick: true,\n ...props,\n 'aria-checked': checked,\n checkmark: slot.optional(props.checkmark, {\n renderByDefault: true,\n elementType: 'span',\n }),\n onClick: (e: React.MouseEvent<ARIAButtonElementIntersection<'div'>>) => {\n toggleCheckbox?.(e, name, value, checked);\n props.onClick?.(e);\n },\n },\n ref,\n ),\n name,\n value,\n checked,\n };\n\n return state;\n};\n"],"names":["React","slot","Checkmark16Filled","useMenuListContext_unstable","useMenuItemBase_unstable","useMenuItemCheckbox_unstable","props","ref","state","useMenuItemCheckboxBase_unstable","checkmark","children","toggleCheckbox","context","name","value","checked","checkedItems","checkedValues","indexOf","role","persistOnClick","optional","renderByDefault","elementType","onClick","e"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,IAAI,QAAQ,4BAA4B;AACjD,SAASC,iBAAiB,QAAQ,wBAAwB;AAC1D,SAASC,2BAA2B,QAAQ,iCAAiC;AAC7E,SAASC,wBAAwB,QAAQ,0BAA0B;AAInE,iEAAiE,GACjE,OAAO,MAAMC,+BAA+B,CAC1CC,OACAC;IAEA,MAAMC,QAAQC,iCAAiCH,OAAOC;IAEtD,6BAA6B;IAC7B,IAAIC,MAAME,SAAS,EAAE;YACnBF;;QAAAA,cAAAA,mBAAAA,MAAME,SAAS,EAACC,yDAAhBH,iBAAgBG,yBAAa,oBAACT;IAChC;IAEA,OAAOM;AACT,EAAE;AAEF;;;;CAIC,GACD,OAAO,MAAMC,mCAAmC,CAC9CH,OACAC;IAEA,MAAMK,iBAAiBT,4BAA4BU,CAAAA,UAAWA,QAAQD,cAAc;IACpF,MAAM,EAAEE,IAAI,EAAEC,KAAK,EAAE,GAAGT;IAExB,MAAMU,UAAUb,4BAA4BU,CAAAA;YACrBA;QAArB,MAAMI,eAAeJ,EAAAA,yBAAAA,QAAQK,aAAa,cAArBL,6CAAAA,sBAAuB,CAACC,KAAK,KAAI,EAAE;QACxD,OAAOG,aAAaE,OAAO,CAACJ,WAAW,CAAC;IAC1C;IAEA,MAAMP,QAA+B;QACnC,GAAGJ,yBACD;YACEgB,MAAM;YACNC,gBAAgB;YAChB,GAAGf,KAAK;YACR,gBAAgBU;YAChBN,WAAWT,KAAKqB,QAAQ,CAAChB,MAAMI,SAAS,EAAE;gBACxCa,iBAAiB;gBACjBC,aAAa;YACf;YACAC,SAAS,CAACC;oBAERpB;gBADAM,2BAAAA,qCAAAA,eAAiBc,GAAGZ,MAAMC,OAAOC;iBACjCV,iBAAAA,MAAMmB,OAAO,cAAbnB,qCAAAA,oBAAAA,OAAgBoB;YAClB;QACF,GACAnB,IACD;QACDO;QACAC;QACAC;IACF;IAEA,OAAOR;AACT,EAAE"}

View File

@@ -0,0 +1,36 @@
'use client';
import { mergeClasses } from '@griffel/react';
import { useCheckmarkStyles_unstable } from '../../selectable/index';
import { useMenuItemStyles_unstable } from '../MenuItem/useMenuItemStyles.styles';
export const menuItemCheckboxClassNames = {
root: 'fui-MenuItemCheckbox',
icon: 'fui-MenuItemCheckbox__icon',
checkmark: 'fui-MenuItemCheckbox__checkmark',
content: 'fui-MenuItemCheckbox__content',
secondaryContent: 'fui-MenuItemCheckbox__secondaryContent',
subText: 'fui-MenuItemCheckbox__subText'
};
export const useMenuItemCheckboxStyles_unstable = state => {
'use no memo';
state.root.className = mergeClasses(menuItemCheckboxClassNames.root, state.root.className);
if (state.content) {
state.content.className = mergeClasses(menuItemCheckboxClassNames.content, state.content.className);
}
if (state.secondaryContent) {
state.secondaryContent.className = mergeClasses(menuItemCheckboxClassNames.secondaryContent, state.secondaryContent.className);
}
if (state.icon) {
state.icon.className = mergeClasses(menuItemCheckboxClassNames.icon, state.icon.className);
}
if (state.checkmark) {
state.checkmark.className = mergeClasses(menuItemCheckboxClassNames.checkmark, state.checkmark.className);
}
if (state.subText) {
state.subText.className = mergeClasses(menuItemCheckboxClassNames.subText, state.subText.className);
}
useMenuItemStyles_unstable(state);
useCheckmarkStyles_unstable(state);
return state;
};

View File

@@ -0,0 +1 @@
{"version":3,"names":["mergeClasses","useCheckmarkStyles_unstable","useMenuItemStyles_unstable","menuItemCheckboxClassNames","root","icon","checkmark","content","secondaryContent","subText","useMenuItemCheckboxStyles_unstable","state","className"],"sources":["useMenuItemCheckboxStyles.styles.js"],"sourcesContent":["'use client';\nimport { mergeClasses } from '@griffel/react';\nimport { useCheckmarkStyles_unstable } from '../../selectable/index';\nimport { useMenuItemStyles_unstable } from '../MenuItem/useMenuItemStyles.styles';\nexport const menuItemCheckboxClassNames = {\n root: 'fui-MenuItemCheckbox',\n icon: 'fui-MenuItemCheckbox__icon',\n checkmark: 'fui-MenuItemCheckbox__checkmark',\n content: 'fui-MenuItemCheckbox__content',\n secondaryContent: 'fui-MenuItemCheckbox__secondaryContent',\n subText: 'fui-MenuItemCheckbox__subText'\n};\nexport const useMenuItemCheckboxStyles_unstable = (state)=>{\n 'use no memo';\n state.root.className = mergeClasses(menuItemCheckboxClassNames.root, state.root.className);\n if (state.content) {\n state.content.className = mergeClasses(menuItemCheckboxClassNames.content, state.content.className);\n }\n if (state.secondaryContent) {\n state.secondaryContent.className = mergeClasses(menuItemCheckboxClassNames.secondaryContent, state.secondaryContent.className);\n }\n if (state.icon) {\n state.icon.className = mergeClasses(menuItemCheckboxClassNames.icon, state.icon.className);\n }\n if (state.checkmark) {\n state.checkmark.className = mergeClasses(menuItemCheckboxClassNames.checkmark, state.checkmark.className);\n }\n if (state.subText) {\n state.subText.className = mergeClasses(menuItemCheckboxClassNames.subText, state.subText.className);\n }\n useMenuItemStyles_unstable(state);\n useCheckmarkStyles_unstable(state);\n return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAASA,YAAY,QAAQ,gBAAgB;AAC7C,SAASC,2BAA2B,QAAQ,wBAAwB;AACpE,SAASC,0BAA0B,QAAQ,sCAAsC;AACjF,OAAO,MAAMC,0BAA0B,GAAG;EACtCC,IAAI,EAAE,sBAAsB;EAC5BC,IAAI,EAAE,4BAA4B;EAClCC,SAAS,EAAE,iCAAiC;EAC5CC,OAAO,EAAE,+BAA+B;EACxCC,gBAAgB,EAAE,wCAAwC;EAC1DC,OAAO,EAAE;AACb,CAAC;AACD,OAAO,MAAMC,kCAAkC,GAAIC,KAAK,IAAG;EACvD,aAAa;;EACbA,KAAK,CAACP,IAAI,CAACQ,SAAS,GAAGZ,YAAY,CAACG,0BAA0B,CAACC,IAAI,EAAEO,KAAK,CAACP,IAAI,CAACQ,SAAS,CAAC;EAC1F,IAAID,KAAK,CAACJ,OAAO,EAAE;IACfI,KAAK,CAACJ,OAAO,CAACK,SAAS,GAAGZ,YAAY,CAACG,0BAA0B,CAACI,OAAO,EAAEI,KAAK,CAACJ,OAAO,CAACK,SAAS,CAAC;EACvG;EACA,IAAID,KAAK,CAACH,gBAAgB,EAAE;IACxBG,KAAK,CAACH,gBAAgB,CAACI,SAAS,GAAGZ,YAAY,CAACG,0BAA0B,CAACK,gBAAgB,EAAEG,KAAK,CAACH,gBAAgB,CAACI,SAAS,CAAC;EAClI;EACA,IAAID,KAAK,CAACN,IAAI,EAAE;IACZM,KAAK,CAACN,IAAI,CAACO,SAAS,GAAGZ,YAAY,CAACG,0BAA0B,CAACE,IAAI,EAAEM,KAAK,CAACN,IAAI,CAACO,SAAS,CAAC;EAC9F;EACA,IAAID,KAAK,CAACL,SAAS,EAAE;IACjBK,KAAK,CAACL,SAAS,CAACM,SAAS,GAAGZ,YAAY,CAACG,0BAA0B,CAACG,SAAS,EAAEK,KAAK,CAACL,SAAS,CAACM,SAAS,CAAC;EAC7G;EACA,IAAID,KAAK,CAACF,OAAO,EAAE;IACfE,KAAK,CAACF,OAAO,CAACG,SAAS,GAAGZ,YAAY,CAACG,0BAA0B,CAACM,OAAO,EAAEE,KAAK,CAACF,OAAO,CAACG,SAAS,CAAC;EACvG;EACAV,0BAA0B,CAACS,KAAK,CAAC;EACjCV,2BAA2B,CAACU,KAAK,CAAC;EAClC,OAAOA,KAAK;AAChB,CAAC","ignoreList":[]}

View File

@@ -0,0 +1,34 @@
'use client';
import { mergeClasses } from '@griffel/react';
import { useCheckmarkStyles_unstable } from '../../selectable/index';
import { useMenuItemStyles_unstable } from '../MenuItem/useMenuItemStyles.styles';
export const menuItemCheckboxClassNames = {
root: 'fui-MenuItemCheckbox',
icon: 'fui-MenuItemCheckbox__icon',
checkmark: 'fui-MenuItemCheckbox__checkmark',
content: 'fui-MenuItemCheckbox__content',
secondaryContent: 'fui-MenuItemCheckbox__secondaryContent',
subText: 'fui-MenuItemCheckbox__subText'
};
export const useMenuItemCheckboxStyles_unstable = (state)=>{
'use no memo';
state.root.className = mergeClasses(menuItemCheckboxClassNames.root, state.root.className);
if (state.content) {
state.content.className = mergeClasses(menuItemCheckboxClassNames.content, state.content.className);
}
if (state.secondaryContent) {
state.secondaryContent.className = mergeClasses(menuItemCheckboxClassNames.secondaryContent, state.secondaryContent.className);
}
if (state.icon) {
state.icon.className = mergeClasses(menuItemCheckboxClassNames.icon, state.icon.className);
}
if (state.checkmark) {
state.checkmark.className = mergeClasses(menuItemCheckboxClassNames.checkmark, state.checkmark.className);
}
if (state.subText) {
state.subText.className = mergeClasses(menuItemCheckboxClassNames.subText, state.subText.className);
}
useMenuItemStyles_unstable(state);
useCheckmarkStyles_unstable(state);
return state;
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/MenuItemCheckbox/useMenuItemCheckboxStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { mergeClasses } from '@griffel/react';\nimport { useCheckmarkStyles_unstable } from '../../selectable/index';\nimport { useMenuItemStyles_unstable } from '../MenuItem/useMenuItemStyles.styles';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { MenuItemSlots } from '../index';\nimport type { MenuItemCheckboxState } from './MenuItemCheckbox.types';\n\nexport const menuItemCheckboxClassNames: SlotClassNames<Omit<MenuItemSlots, 'submenuIndicator'>> = {\n root: 'fui-MenuItemCheckbox',\n icon: 'fui-MenuItemCheckbox__icon',\n checkmark: 'fui-MenuItemCheckbox__checkmark',\n content: 'fui-MenuItemCheckbox__content',\n secondaryContent: 'fui-MenuItemCheckbox__secondaryContent',\n subText: 'fui-MenuItemCheckbox__subText',\n};\n\nexport const useMenuItemCheckboxStyles_unstable = (state: MenuItemCheckboxState): MenuItemCheckboxState => {\n 'use no memo';\n\n state.root.className = mergeClasses(menuItemCheckboxClassNames.root, state.root.className);\n\n if (state.content) {\n state.content.className = mergeClasses(menuItemCheckboxClassNames.content, state.content.className);\n }\n\n if (state.secondaryContent) {\n state.secondaryContent.className = mergeClasses(\n menuItemCheckboxClassNames.secondaryContent,\n state.secondaryContent.className,\n );\n }\n\n if (state.icon) {\n state.icon.className = mergeClasses(menuItemCheckboxClassNames.icon, state.icon.className);\n }\n\n if (state.checkmark) {\n state.checkmark.className = mergeClasses(menuItemCheckboxClassNames.checkmark, state.checkmark.className);\n }\n\n if (state.subText) {\n state.subText.className = mergeClasses(menuItemCheckboxClassNames.subText, state.subText.className);\n }\n\n useMenuItemStyles_unstable(state);\n useCheckmarkStyles_unstable(state);\n\n return state;\n};\n"],"names":["mergeClasses","useCheckmarkStyles_unstable","useMenuItemStyles_unstable","menuItemCheckboxClassNames","root","icon","checkmark","content","secondaryContent","subText","useMenuItemCheckboxStyles_unstable","state","className"],"mappings":"AAAA;AAEA,SAASA,YAAY,QAAQ,iBAAiB;AAC9C,SAASC,2BAA2B,QAAQ,yBAAyB;AACrE,SAASC,0BAA0B,QAAQ,uCAAuC;AAKlF,OAAO,MAAMC,6BAAsF;IACjGC,MAAM;IACNC,MAAM;IACNC,WAAW;IACXC,SAAS;IACTC,kBAAkB;IAClBC,SAAS;AACX,EAAE;AAEF,OAAO,MAAMC,qCAAqC,CAACC;IACjD;IAEAA,MAAMP,IAAI,CAACQ,SAAS,GAAGZ,aAAaG,2BAA2BC,IAAI,EAAEO,MAAMP,IAAI,CAACQ,SAAS;IAEzF,IAAID,MAAMJ,OAAO,EAAE;QACjBI,MAAMJ,OAAO,CAACK,SAAS,GAAGZ,aAAaG,2BAA2BI,OAAO,EAAEI,MAAMJ,OAAO,CAACK,SAAS;IACpG;IAEA,IAAID,MAAMH,gBAAgB,EAAE;QAC1BG,MAAMH,gBAAgB,CAACI,SAAS,GAAGZ,aACjCG,2BAA2BK,gBAAgB,EAC3CG,MAAMH,gBAAgB,CAACI,SAAS;IAEpC;IAEA,IAAID,MAAMN,IAAI,EAAE;QACdM,MAAMN,IAAI,CAACO,SAAS,GAAGZ,aAAaG,2BAA2BE,IAAI,EAAEM,MAAMN,IAAI,CAACO,SAAS;IAC3F;IAEA,IAAID,MAAML,SAAS,EAAE;QACnBK,MAAML,SAAS,CAACM,SAAS,GAAGZ,aAAaG,2BAA2BG,SAAS,EAAEK,MAAML,SAAS,CAACM,SAAS;IAC1G;IAEA,IAAID,MAAMF,OAAO,EAAE;QACjBE,MAAMF,OAAO,CAACG,SAAS,GAAGZ,aAAaG,2BAA2BM,OAAO,EAAEE,MAAMF,OAAO,CAACG,SAAS;IACpG;IAEAV,2BAA2BS;IAC3BV,4BAA4BU;IAE5B,OAAOA;AACT,EAAE"}