'use client';

import { __resetStyles, __styles, mergeClasses, shorthands } from '@griffel/react';
import { tokens } from '@fluentui/react-theme';
export const messageBarClassNames = {
  root: 'fui-MessageBar',
  icon: 'fui-MessageBar__icon',
  bottomReflowSpacer: 'fui-MessageBar__bottomReflowSpacer'
};
const useRootBaseStyles = /*#__PURE__*/__resetStyles("r2oyxsj", "r1wuyrhw", [".r2oyxsj{white-space:nowrap;display:grid;grid-template-columns:auto 1fr auto auto;grid-template-rows:1fr;grid-template-areas:\"icon body secondaryActions actions\";padding-left:var(--spacingHorizontalM);border:var(--strokeWidthThin) solid var(--colorNeutralStroke1);border-radius:var(--borderRadiusMedium);align-items:center;min-height:36px;box-sizing:border-box;background-color:var(--colorNeutralBackground3);}", ".r1wuyrhw{white-space:nowrap;display:grid;grid-template-columns:auto 1fr auto auto;grid-template-rows:1fr;grid-template-areas:\"icon body secondaryActions actions\";padding-right:var(--spacingHorizontalM);border:var(--strokeWidthThin) solid var(--colorNeutralStroke1);border-radius:var(--borderRadiusMedium);align-items:center;min-height:36px;box-sizing:border-box;background-color:var(--colorNeutralBackground3);}"]);
const useIconBaseStyles = /*#__PURE__*/__resetStyles("r1df1z33", "rivnfjc", [".r1df1z33{grid-area:icon;font-size:var(--fontSizeBase500);margin-right:var(--spacingHorizontalS);color:var(--colorNeutralForeground3);display:flex;align-items:center;}", ".rivnfjc{grid-area:icon;font-size:var(--fontSizeBase500);margin-left:var(--spacingHorizontalS);color:var(--colorNeutralForeground3);display:flex;align-items:center;}"]);
const useReflowSpacerBaseStyles = /*#__PURE__*/__resetStyles("r1vx593n", null, [".r1vx593n{margin-bottom:var(--spacingVerticalS);grid-area:secondaryActions;}"]);
const useStyles = /*#__PURE__*/__styles({
  rootMultiline: {
    Huce71: "f6juhto",
    Bt984gj: "f1s2louj",
    z8tnut: "f1ngh7ph",
    Budl1dq: "f17g0uqy",
    zoa1oz: "f1w7oly7"
  },
  secondaryActionsMultiline: {
    Brf1p80: "f1e8xxv9",
    B6of3ja: "f1gaxbfw",
    jrapky: "fqcjy3b",
    t21cq0: ["fibjyge", "f9yszdx"]
  },
  square: {
    Beyfa6y: 0,
    Bbmb7ep: 0,
    Btl43ni: 0,
    B7oj6ja: 0,
    Dimara: "fokr779"
  }
}, {
  d: [".f6juhto{white-space:normal;}", ".f1s2louj{align-items:start;}", ".f1ngh7ph{padding-top:var(--spacingVerticalMNudge);}", ".f17g0uqy{grid-template-columns:auto 1fr auto;}", ".f1w7oly7{grid-template-areas:\"icon body actions\" \"secondaryActions secondaryActions secondaryActions\";}", ".f1e8xxv9{justify-content:end;}", ".f1gaxbfw{margin-top:var(--spacingVerticalMNudge);}", ".fqcjy3b{margin-bottom:var(--spacingVerticalS);}", ".fibjyge{margin-right:0px;}", ".f9yszdx{margin-left:0px;}", [".fokr779{border-radius:0;}", {
    p: -1
  }]]
});
const useIconIntentStyles = /*#__PURE__*/__styles({
  info: {},
  error: {
    sj55zd: "f1ca9wz"
  },
  warning: {
    sj55zd: "f14a4cve"
  },
  success: {
    sj55zd: "f36rra6"
  }
}, {
  d: [".f1ca9wz{color:var(--colorStatusDangerForeground1);}", ".f14a4cve{color:var(--colorStatusWarningForeground3);}", ".f36rra6{color:var(--colorStatusSuccessForeground1);}"]
});
const useRootIntentStyles = /*#__PURE__*/__styles({
  info: {},
  error: {
    De3pzq: "f1eon7jj",
    g2u3we: "f1f8dvr7",
    h3c5rm: ["f1g1ijmo", "f1nxacbt"],
    B9xav0g: "fo25q1j",
    zhjwy3: ["f1nxacbt", "f1g1ijmo"]
  },
  warning: {
    De3pzq: "f13ftzij",
    g2u3we: "frd1ypx",
    h3c5rm: ["f1gyjrma", "f18qd5xz"],
    B9xav0g: "fqyqtrt",
    zhjwy3: ["f18qd5xz", "f1gyjrma"]
  },
  success: {
    De3pzq: "f64thcm",
    g2u3we: "f1b4u7v",
    h3c5rm: ["f1nyd2b1", "f70v3om"],
    B9xav0g: "fk173vo",
    zhjwy3: ["f70v3om", "f1nyd2b1"]
  }
}, {
  d: [".f1eon7jj{background-color:var(--colorStatusDangerBackground1);}", ".f1f8dvr7{border-top-color:var(--colorStatusDangerBorder1);}", ".f1g1ijmo{border-right-color:var(--colorStatusDangerBorder1);}", ".f1nxacbt{border-left-color:var(--colorStatusDangerBorder1);}", ".fo25q1j{border-bottom-color:var(--colorStatusDangerBorder1);}", ".f13ftzij{background-color:var(--colorStatusWarningBackground1);}", ".frd1ypx{border-top-color:var(--colorStatusWarningBorder1);}", ".f1gyjrma{border-right-color:var(--colorStatusWarningBorder1);}", ".f18qd5xz{border-left-color:var(--colorStatusWarningBorder1);}", ".fqyqtrt{border-bottom-color:var(--colorStatusWarningBorder1);}", ".f64thcm{background-color:var(--colorStatusSuccessBackground1);}", ".f1b4u7v{border-top-color:var(--colorStatusSuccessBorder1);}", ".f1nyd2b1{border-right-color:var(--colorStatusSuccessBorder1);}", ".f70v3om{border-left-color:var(--colorStatusSuccessBorder1);}", ".fk173vo{border-bottom-color:var(--colorStatusSuccessBorder1);}"]
});
/**
 * Apply styling to the MessageBar slots based on the state
 */
export const useMessageBarStyles_unstable = state => {
  'use no memo';

  const rootBaseStyles = useRootBaseStyles();
  const iconBaseStyles = useIconBaseStyles();
  const iconIntentStyles = useIconIntentStyles();
  const rootIntentStyles = useRootIntentStyles();
  const reflowSpacerStyles = useReflowSpacerBaseStyles();
  const styles = useStyles();
  state.root.className = mergeClasses(messageBarClassNames.root, rootBaseStyles, state.layout === 'multiline' && styles.rootMultiline, state.shape === 'square' && styles.square, rootIntentStyles[state.intent], state.root.className);
  if (state.icon) {
    state.icon.className = mergeClasses(messageBarClassNames.icon, iconBaseStyles, iconIntentStyles[state.intent], state.icon.className);
  }
  if (state.bottomReflowSpacer) {
    state.bottomReflowSpacer.className = mergeClasses(messageBarClassNames.bottomReflowSpacer, reflowSpacerStyles);
  }
  return state;
};