42 lines
2.2 KiB
JavaScript
42 lines
2.2 KiB
JavaScript
'use client';
|
|
|
|
import { __resetStyles, __styles, mergeClasses } from '@griffel/react';
|
|
import { tokens } from '@fluentui/react-theme';
|
|
export const messageBarActionsClassNames = {
|
|
root: 'fui-MessageBarActions',
|
|
containerAction: 'fui-MessageBarActions__containerAction'
|
|
};
|
|
/**
|
|
* Styles for the root slot
|
|
*/
|
|
const useRootBaseStyles = /*#__PURE__*/__resetStyles("r1t4x98y", "r15utzv5", [".r1t4x98y{grid-area:secondaryActions;display:flex;column-gap:var(--spacingHorizontalM);padding-right:var(--spacingHorizontalM);}", ".r15utzv5{grid-area:secondaryActions;display:flex;column-gap:var(--spacingHorizontalM);padding-left:var(--spacingHorizontalM);}"]);
|
|
const useContainerActionBaseStyles = /*#__PURE__*/__resetStyles("rgzw8nq", "r13ur29z", [".rgzw8nq{grid-area:actions;padding-right:var(--spacingHorizontalM);}", ".r13ur29z{grid-area:actions;padding-left:var(--spacingHorizontalM);}"]);
|
|
const useMultilineStyles = /*#__PURE__*/__styles({
|
|
root: {
|
|
Brf1p80: "f1e8xxv9",
|
|
B6of3ja: "f1gaxbfw",
|
|
jrapky: "fqcjy3b",
|
|
t21cq0: ["fibjyge", "f9yszdx"],
|
|
z189sj: ["f1p3vkop", "f8cewkv"]
|
|
},
|
|
noActions: {
|
|
mc9l5x: "fjseox"
|
|
}
|
|
}, {
|
|
d: [".f1e8xxv9{justify-content:end;}", ".f1gaxbfw{margin-top:var(--spacingVerticalMNudge);}", ".fqcjy3b{margin-bottom:var(--spacingVerticalS);}", ".fibjyge{margin-right:0px;}", ".f9yszdx{margin-left:0px;}", ".f1p3vkop{padding-right:var(--spacingVerticalM);}", ".f8cewkv{padding-left:var(--spacingVerticalM);}", ".fjseox{display:none;}"]
|
|
});
|
|
/**
|
|
* Apply styling to the MessageBarActions slots based on the state
|
|
*/
|
|
export const useMessageBarActionsStyles_unstable = state => {
|
|
'use no memo';
|
|
|
|
const rootBaseStyles = useRootBaseStyles();
|
|
const containerActionBaseStyles = useContainerActionBaseStyles();
|
|
const multilineStyles = useMultilineStyles();
|
|
state.root.className = mergeClasses(messageBarActionsClassNames.root, rootBaseStyles, state.layout === 'multiline' && multilineStyles.root, !state.hasActions && multilineStyles.noActions, state.root.className);
|
|
if (state.containerAction) {
|
|
state.containerAction.className = mergeClasses(messageBarActionsClassNames.containerAction, containerActionBaseStyles, state.containerAction.className);
|
|
}
|
|
return state;
|
|
}; |