'use client'; import { shorthands, __styles, mergeClasses } from '@griffel/react'; import { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster'; import { tokens } from '@fluentui/react-theme'; export const linkClassNames = { root: 'fui-Link' }; const useStyles = /*#__PURE__*/__styles({ focusIndicator: { Bttzg6e: "fhgqx19", B3uz8dt: "f1olyrje", B6ihwck: "f1p93eir", g9k6zt: "f1nev41a" }, root: { B486eqv: "f2hkw1w", De3pzq: "f3rmtva", B7ck84d: "f1ewtqcl", sj55zd: "fyind8e", Bceei9c: "f1k6fduh", mc9l5x: "f1w7gpdv", Bahqtrf: "fk6fouc", Be2twd7: "fkhj508", Bhrd7zp: "figsok6", jrapky: 0, Frg6f3: 0, t21cq0: 0, B6of3ja: 0, B74szlk: "f1s184ao", Byoj8tv: 0, uwmqm3: 0, z189sj: 0, z8tnut: 0, B0ocmuz: "f1mk8lai", B68tc82: 0, Bmxbyg5: 0, Bpg54ce: "fnbmjn9", fsow6f: ["f1o700av", "fes3tcz"], w71qe1: "f1iuv45f", Bkioxbp: "f1cmlufx", ygn44y: "f9n3di6", famaaq: "f1ids18y", Bde5pd6: "f1tx3yz7", Bi91k9c: "f1deo86v", i089h6: "f1eh06m1", lj723h: "f1iescvh" }, button: { icvyot: "f1ern45e", vrafjx: ["f1n71otn", "f1deefiw"], oivjwe: "f1h8hb77", wvpqe5: ["f1deefiw", "f1n71otn"] }, href: { Be2twd7: "fjoy568" }, subtle: { sj55zd: "f2yjg6r", Bde5pd6: "f1tx3yz7", Bi91k9c: "fj1cjhr", i089h6: "f1eh06m1", lj723h: "fhucn0c" }, inline: { w71qe1: "f13mvf36" }, disabled: { w71qe1: "f1iuv45f", sj55zd: "f1s2aq7o", Bceei9c: "fdrzuqr", Bde5pd6: "fbnuktb", Bi91k9c: "fvgxktp", i089h6: "fljg2da", lj723h: "f19wldhg" }, inverted: { sj55zd: "f1qz2gb0", Bi91k9c: "f1ujg2k6", lj723h: "f1ebemlp" }, brand: { sj55zd: "f179xftw", Bi91k9c: "f1sk1dtk", lj723h: "f182g21t" } }, { d: [".fhgqx19[data-fui-focus-visible]{text-decoration-color:var(--colorStrokeFocus2);}", ".f1olyrje[data-fui-focus-visible]{text-decoration-line:underline;}", ".f1p93eir[data-fui-focus-visible]{text-decoration-style:double;}", ".f1nev41a[data-fui-focus-visible]{outline-style:none;}", ".f3rmtva{background-color:transparent;}", ".f1ewtqcl{box-sizing:border-box;}", ".fyind8e{color:var(--colorBrandForegroundLink);}", ".f1k6fduh{cursor:pointer;}", ".f1w7gpdv{display:inline;}", ".fk6fouc{font-family:var(--fontFamilyBase);}", ".fkhj508{font-size:var(--fontSizeBase300);}", ".figsok6{font-weight:var(--fontWeightRegular);}", [".f1s184ao{margin:0;}", { p: -1 }], [".f1mk8lai{padding:0;}", { p: -1 }], [".fnbmjn9{overflow:inherit;}", { p: -1 }], ".f1o700av{text-align:left;}", ".fes3tcz{text-align:right;}", ".f1iuv45f{text-decoration-line:none;}", ".f1cmlufx{text-decoration-thickness:var(--strokeWidthThin);}", ".f9n3di6{text-overflow:inherit;}", ".f1ids18y{-webkit-user-select:text;-moz-user-select:text;user-select:text;}", ".f1ern45e{border-top-style:none;}", ".f1n71otn{border-right-style:none;}", ".f1deefiw{border-left-style:none;}", ".f1h8hb77{border-bottom-style:none;}", ".fjoy568{font-size:inherit;}", ".f2yjg6r{color:var(--colorNeutralForeground2Link);}", ".f13mvf36{text-decoration-line:underline;}", ".f1s2aq7o{color:var(--colorNeutralForegroundDisabled);}", ".fdrzuqr{cursor:not-allowed;}", ".f1qz2gb0{color:var(--colorBrandForegroundInverted);}", ".f179xftw{color:var(--colorNeutralForegroundInvertedLink);}"], i: [".f2hkw1w:focus-visible{outline-style:none;}"], h: [".f1tx3yz7:hover{text-decoration-line:underline;}", ".f1deo86v:hover{color:var(--colorBrandForegroundLinkHover);}", ".fj1cjhr:hover{color:var(--colorNeutralForeground2LinkHover);}", ".fbnuktb:hover{text-decoration-line:none;}", ".fvgxktp:hover{color:var(--colorNeutralForegroundDisabled);}", ".f1ujg2k6:hover{color:var(--colorBrandForegroundInverted);}", ".f1sk1dtk:hover{color:var(--colorNeutralForegroundInvertedLinkHover);}"], a: [".f1eh06m1:active{text-decoration-line:underline;}", ".f1iescvh:active{color:var(--colorBrandForegroundLinkPressed);}", ".fhucn0c:active{color:var(--colorNeutralForeground2LinkPressed);}", ".fljg2da:active{text-decoration-line:none;}", ".f19wldhg:active{color:var(--colorNeutralForegroundDisabled);}", ".f1ebemlp:active{color:var(--colorBrandForegroundInverted);}", ".f182g21t:active{color:var(--colorNeutralForegroundInvertedLinkPressed);}"] }); export const useLinkStyles_unstable = state => { 'use no memo'; const styles = useStyles(); const { appearance, disabled, inline, root, backgroundAppearance } = state; state.root.className = mergeClasses(linkClassNames.root, styles.root, styles.focusIndicator, root.as === 'a' && root.href && styles.href, root.as === 'button' && styles.button, appearance === 'subtle' && styles.subtle, backgroundAppearance === 'inverted' && styles.inverted, backgroundAppearance === 'brand' && styles.brand, inline && styles.inline, disabled && styles.disabled, state.root.className); return state; };