UNPKG

@stihl-design-system/components

Version:

Welcome to the STIHL Design System react component library.

133 lines (132 loc) 6.84 kB
"use client"; import { jsxs as go, jsx as z } from "react/jsx-runtime"; import { d as ko } from "./index.CgTHIF3K.js"; import { c as ao } from "./index.CEyLAtio.js"; import { forwardRef as mo } from "react"; import { u as co } from "./useBreakpoint.CMOR9ZOB.js"; import { D as fo } from "./Icon.NSsVrYeq.js"; import { Tooltip as ho } from "../tooltip.CUCSRXd3.js"; import { g as uo } from "./helpers.BbWkXTr3.js"; import '../assets/LinkButton.xMvg_ojf.css';const bo = "ds-link-button_root_oblg9_1", vo = "ds-link-button_root--highlight_oblg9_75", po = "ds-link-button_root--dark-highlight_oblg9_75", Do = "ds-link-button_root--filled_oblg9_151", No = "ds-link-button_root--outline_oblg9_179", Oo = "ds-link-button_root--ghost_oblg9_206", Lo = "ds-link-button_root--ghost-flush_oblg9_231", So = "ds-link-button_root--small_oblg9_237", Fo = "ds-link-button_root--navigation_oblg9_317", Io = "ds-link-button_root--dark-filled_oblg9_393", Go = "ds-link-button_root--dark-outline_oblg9_450", yo = "ds-link-button_root--dark-ghost_oblg9_506", Bo = "ds-link-button_root--dark-ghost-flush_oblg9_560", Ho = "ds-link-button_root--icon-left_oblg9_635", To = "ds-link-button_root--icon-only_oblg9_638", wo = "ds-link-button_root--icon-only-small_oblg9_647", Eo = "ds-link-button_icon--navigation_oblg9_659", Po = "ds-link-button_label--hidden_oblg9_667", l = { root: bo, rootHighlight: vo, rootDarkHighlight: po, rootFilled: Do, rootOutline: No, rootGhost: Oo, rootGhostFlush: Lo, rootSmall: So, rootNavigation: Fo, rootDarkFilled: Io, rootDarkOutline: Go, rootDarkGhost: yo, rootDarkGhostFlush: Bo, rootIconLeft: Ho, rootIconOnly: To, rootIconOnlySmall: wo, iconNavigation: Eo, labelHidden: Po }, Zo = ["medium", "small"], $o = ["filled", "highlight", "outline", "ghost", "navigation"], Ao = ({ variant: D, size: N, theme: o }) => { if (D === "navigation" && (N === "small" && console.warn(uo("DSLinkButton", 'A "size" prop should not be used in combination with variant="navigation". Please remove the "size" prop.')), o === "dark")) throw new Error(uo("DSLinkButton", 'A DSLinkButton with variant="navigation" does not support theme="dark". Please remove the "theme" prop.')); }, xo = mo((D, N) => { const o = ko.c(71); let a, c, d, h, i, s, e, g, u, _, O, L, S, F, I, G, y, r; o[0] !== D ? ({ children: c, aria: a, className: d, download: h, hideLabel: O, href: i, iconName: s, iconPosition: L, iconSource: e, isFlush: S, referrerPolicy: g, rel: u, size: F, target: I, theme: G, variant: y, tooltip: r, ..._ } = D, o[0] = D, o[1] = a, o[2] = c, o[3] = d, o[4] = h, o[5] = i, o[6] = s, o[7] = e, o[8] = g, o[9] = u, o[10] = _, o[11] = O, o[12] = L, o[13] = S, o[14] = F, o[15] = I, o[16] = G, o[17] = y, o[18] = r) : (a = o[1], c = o[2], d = o[3], h = o[4], i = o[5], s = o[6], e = o[7], g = o[8], u = o[9], _ = o[10], O = o[11], L = o[12], S = o[13], F = o[14], I = o[15], G = o[16], y = o[17], r = o[18]); const C = O === void 0 ? !1 : O, _o = L === void 0 ? "left" : L, B = S === void 0 ? !1 : S, H = F === void 0 ? "medium" : F, V = I === void 0 ? "_self" : I, n = G === void 0 ? "light" : G, t = y === void 0 ? "filled" : y; process.env.NODE_ENV !== "production" && Ao({ variant: t, size: H, theme: n }); const j = t === "filled", K = t === "highlight", R = t === "outline", U = t === "ghost" && B !== !0, M = t === "navigation", Z = t === "ghost" && B === !0, $ = n === "dark" && t === "filled", q = n === "dark" && t === "highlight", J = n === "dark" && t === "outline", Q = n === "dark" && t === "ghost" && B !== !0, W = n === "dark" && t === "ghost" && B === !0, X = H === "small" || t === "navigation", Y = _o === "left", oo = co(C) && H === "medium" && t !== "navigation", to = co(C) && H === "small" && t !== "navigation"; let T; o[19] !== d || o[20] !== R || o[21] !== U || o[22] !== M || o[23] !== Z || o[24] !== $ || o[25] !== q || o[26] !== J || o[27] !== Q || o[28] !== W || o[29] !== X || o[30] !== Y || o[31] !== oo || o[32] !== to || o[33] !== j || o[34] !== K ? (T = ao(l.root, d, { [l.rootFilled]: j, [l.rootHighlight]: K, [l.rootOutline]: R, [l.rootGhost]: U, [l.rootNavigation]: M, [l.rootGhostFlush]: Z, [l.rootDarkFilled]: $, [l.rootDarkHighlight]: q, [l.rootDarkOutline]: J, [l.rootDarkGhost]: Q, [l.rootDarkGhostFlush]: W, [l.rootSmall]: X, [l.rootIconLeft]: Y, [l.rootIconOnly]: oo, [l.rootIconOnlySmall]: to }), o[19] = d, o[20] = R, o[21] = U, o[22] = M, o[23] = Z, o[24] = $, o[25] = q, o[26] = J, o[27] = Q, o[28] = W, o[29] = X, o[30] = Y, o[31] = oo, o[32] = to, o[33] = j, o[34] = K, o[35] = T) : T = o[35]; const lo = T, no = co(C) && t !== "navigation"; let w; o[36] !== no ? (w = ao({ [l.labelHidden]: no }), o[36] = no, o[37] = w) : w = o[37]; const io = w, so = t === "navigation"; let E; o[38] !== so ? (E = ao({ [l.iconNavigation]: so }), o[38] = so, o[39] = E) : E = o[39]; const eo = E, ro = n === "light" && t === "filled" || n === "dark" && t === "outline" || n === "dark" && t === "ghost" ? "dark" : "light", k = i === void 0 ? "span" : "a"; let m; o[40] !== k || o[41] !== h || o[42] !== i || o[43] !== g || o[44] !== u || o[45] !== V ? (m = k === "a" && { href: i, target: V, rel: u, referrerPolicy: g, download: h }, o[40] = k, o[41] = h, o[42] = i, o[43] = g, o[44] = u, o[45] = V, o[46] = m) : m = o[46]; let f; o[47] !== c || o[48] !== io ? (f = /* @__PURE__ */ z("span", { className: io, children: c }), o[47] = c, o[48] = io, o[49] = f) : f = o[49]; let b; o[50] !== eo || o[51] !== s || o[52] !== e || o[53] !== ro ? (b = (s || e) && /* @__PURE__ */ z(fo, { name: s, theme: ro, source: e, className: eo, "aria-hidden": "true" }), o[50] = eo, o[51] = s, o[52] = e, o[53] = ro, o[54] = b) : b = o[54]; let P; o[55] !== k || o[56] !== a || o[57] !== N || o[58] !== _ || o[59] !== lo || o[60] !== m || o[61] !== f || o[62] !== b ? (P = /* @__PURE__ */ go(k, { className: lo, ...m, ...a, ..._, ref: N, children: [ f, b ] }), o[55] = k, o[56] = a, o[57] = N, o[58] = _, o[59] = lo, o[60] = m, o[61] = f, o[62] = b, o[63] = P) : P = o[63]; const A = P; if (r) { let v; o[64] !== A ? (v = /* @__PURE__ */ z(ho.Anchor, { children: A }), o[64] = A, o[65] = v) : v = o[65]; let p; o[66] !== r ? (p = /* @__PURE__ */ z(ho.Content, { children: r }), o[66] = r, o[67] = p) : p = o[67]; let x; return o[68] !== v || o[69] !== p ? (x = /* @__PURE__ */ go(ho, { placement: "top", tooltipOffset: 6, children: [ v, p ] }), o[68] = v, o[69] = p, o[70] = x) : x = o[70], x; } return A; }); xo.displayName = "DSLinkButton"; export { xo as D, Zo as L, $o as a, Ao as v };