UNPKG

@stihl-design-system/components

Version:

Welcome to the STIHL Design System react component library.

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