@stihl-design-system/components
Version:
Welcome to the STIHL Design System react component library.
154 lines (153 loc) • 8.21 kB
JavaScript
"use client";
import { jsxs as lt, jsx as f, Fragment as ht } from "react/jsx-runtime";
import { d as _t } from "./index.D-sRdssb.js";
import { c as F } from "./index.DL9mof6u.js";
import { forwardRef as mt } from "react";
import { D as bt } from "./Icon.CDLyB7Pv.js";
import { NumberIndicator as ft } from "../numberindicator.BdnPMogE.js";
import { Tooltip as st } from "../tooltip.Cj3AvYgB.js";
import { g as P } from "./helpers.CexwVao7.js";
import '../assets/ActionLink.D7fuY3NQ.css';const vt = "ds-action-link_root_o08fb_1", kt = "ds-action-link_root--indent-level-1_o08fb_75", It = "ds-action-link_root--active_o08fb_78", ut = "ds-action-link_root--active--with-marker_o08fb_81", Nt = "ds-action-link_root--icon--top_o08fb_84", At = "ds-action-link_root--stretched_o08fb_110", gt = "ds-action-link_active-marker_o08fb_115", wt = "ds-action-link_active-marker--with-indent_o08fb_127", Wt = "ds-action-link_icon-wrapper_o08fb_131", Lt = "ds-action-link_icon-wrapper--x-large_o08fb_134", St = "ds-action-link_icon-wrapper--with-number-indicator_o08fb_137", Pt = "ds-action-link_icon-wrapper--with-number-indicator--with-value_o08fb_145", Tt = "ds-action-link_label_o08fb_149", Dt = "ds-action-link_label--bold_o08fb_160", xt = "ds-action-link_label--active_o08fb_171", Ct = "ds-action-link_label--icon-top_o08fb_182", Mt = "ds-action-link_number-indicator_o08fb_205", o = {
root: vt,
rootIndentLevel1: kt,
rootActive: It,
rootActiveWithMarker: ut,
rootIconTop: Nt,
rootStretched: At,
activeMarker: gt,
activeMarkerWithIndent: wt,
iconWrapper: Wt,
iconWrapperXLarge: Lt,
iconWrapperWithNumberIndicator: St,
iconWrapperWithNumberIndicatorWithValue: Pt,
label: Tt,
labelBold: Dt,
labelActive: xt,
labelIconTop: Ct,
numberIndicator: Mt
}, Ft = ["left", "top"], Gt = ["large", "x-large"], Rt = [0, 1], Zt = ["normal", "bold"], Et = ({
iconName: m,
iconSize: b,
iconSource: t,
iconPosition: a,
indentLevel: l,
stretched: s,
weight: p
}) => {
if (m && !t && b === "x-large" && console.warn(P("DSActionLink", 'An "iconSize" prop set to "x-large" has no effect when "iconName" is set. Please remove the "iconSize" prop or provide a custom icon via the "iconSource" prop.')), a === "top") {
if (!m && !t)
throw new Error(P("DSActionLink", 'The "iconPosition" prop should not be set to "top", when no "iconName" or "iconSource" prop was provided. Please either remove the "iconPosition" prop or set a valid icon via the "iconName" or "iconSource" prop.'));
b === "x-large" && console.warn(P("DSActionLink", 'An "iconSize" prop set to "x-large" has no effect when "iconPosition" is set to "top". Please remove the "iconSize" prop.')), p === "bold" && console.warn(P("DSActionLink", 'A "weight" prop set to "bold" with "iconPosition" set to "top" has no effect. Please remove the "weight" prop.')), l === 1 && console.warn(P("DSActionLink", 'An "indentLevel" prop set to "1" with "iconPosition" set to "top" has no effect. Please remove the "indentLevel" prop.')), s && console.warn(P("DSActionLink", 'A "stretched" prop set to "true" with "iconPosition" set to "top" has no effect. Please remove the "stretched" prop.'));
}
}, Ot = mt((m, b) => {
const t = _t.c(81);
let a, l, s, p, h, n, r, i, v, k, I, T, D, x, C, M, E, O, _;
t[0] !== m ? ({
children: l,
aria: a,
className: s,
download: p,
href: h,
iconName: n,
iconPosition: T,
iconSize: D,
iconSource: r,
indentLevel: x,
isActive: C,
numberIndicatorValue: i,
referrerPolicy: v,
rel: k,
stretched: M,
target: E,
tooltip: _,
weight: O,
...I
} = m, t[0] = m, t[1] = a, t[2] = l, t[3] = s, t[4] = p, t[5] = h, t[6] = n, t[7] = r, t[8] = i, t[9] = v, t[10] = k, t[11] = I, t[12] = T, t[13] = D, t[14] = x, t[15] = C, t[16] = M, t[17] = E, t[18] = O, t[19] = _) : (a = t[1], l = t[2], s = t[3], p = t[4], h = t[5], n = t[6], r = t[7], i = t[8], v = t[9], k = t[10], I = t[11], T = t[12], D = t[13], x = t[14], C = t[15], M = t[16], E = t[17], O = t[18], _ = t[19]);
const e = T === void 0 ? "left" : T, z = D === void 0 ? "large" : D, G = x === void 0 ? 0 : x, d = C === void 0 ? !1 : C, pt = M === void 0 ? !1 : M, R = E === void 0 ? "_self" : E, dt = O === void 0 ? "normal" : O;
process.env.NODE_ENV !== "production" && Et({
iconName: n,
iconSize: z,
iconSource: r,
iconPosition: e,
indentLevel: G,
stretched: pt,
weight: dt
});
const c = i?.trim() === "", Z = e === "top", $ = G === 1, q = d && e === "left", J = pt === !0 && e === "left";
let V;
t[20] !== s || t[21] !== d || t[22] !== q || t[23] !== J || t[24] !== Z || t[25] !== $ ? (V = F(o.root, s, {
[o.rootIconTop]: Z,
[o.rootIndentLevel1]: $,
[o.rootActive]: d,
[o.rootActiveWithMarker]: q,
[o.rootStretched]: J
}), t[20] = s, t[21] = d, t[22] = q, t[23] = J, t[24] = Z, t[25] = $, t[26] = V) : V = t[26];
const Q = V, U = G === 1;
let K;
t[27] !== U ? (K = F(o.activeMarker, {
[o.activeMarkerWithIndent]: U
}), t[27] = U, t[28] = K) : K = t[28];
const Y = K, tt = d && e === "left", et = dt === "bold", ot = e === "top";
let y;
t[29] !== tt || t[30] !== et || t[31] !== ot ? (y = F(o.label, {
[o.labelActive]: tt,
[o.labelBold]: et,
[o.labelIconTop]: ot
}), t[29] = tt, t[30] = et, t[31] = ot, t[32] = y) : y = t[32];
const it = y, nt = z === "x-large", rt = (n || r) && (i || c), ct = (n || r) && !c;
let B;
t[33] !== nt || t[34] !== rt || t[35] !== ct ? (B = F(o.iconWrapper, {
[o.iconWrapperXLarge]: nt,
[o.iconWrapperWithNumberIndicator]: rt,
[o.iconWrapperWithNumberIndicatorWithValue]: ct
}), t[33] = nt, t[34] = rt, t[35] = ct, t[36] = B) : B = t[36];
const at = B, u = h === void 0 ? "span" : "a";
let N;
t[37] !== u || t[38] !== p || t[39] !== h || t[40] !== v || t[41] !== k || t[42] !== R ? (N = u === "a" && {
href: h,
target: R,
rel: k,
referrerPolicy: v,
download: p
}, t[37] = u, t[38] = p, t[39] = h, t[40] = v, t[41] = k, t[42] = R, t[43] = N) : N = t[43];
let A;
t[44] !== Y || t[45] !== e || t[46] !== d ? (A = d && e === "left" && /* @__PURE__ */ f("div", { className: Y }), t[44] = Y, t[45] = e, t[46] = d, t[47] = A) : A = t[47];
let g;
t[48] !== n || t[49] !== e || t[50] !== z || t[51] !== r || t[52] !== at || t[53] !== c || t[54] !== i ? (g = (n || r) && /* @__PURE__ */ f(ht, { children: /* @__PURE__ */ lt("span", { className: at, children: [
/* @__PURE__ */ f(bt, { name: n, theme: "light", source: r, "aria-hidden": "true", size: n || e === "top" ? "large" : z }),
(e === "left" && c || e === "top" && (i || c)) && /* @__PURE__ */ f(ft, { variant: "highlight", label: i })
] }) }), t[48] = n, t[49] = e, t[50] = z, t[51] = r, t[52] = at, t[53] = c, t[54] = i, t[55] = g) : g = t[55];
let w;
t[56] !== l || t[57] !== it ? (w = /* @__PURE__ */ f("span", { className: it, children: l }), t[56] = l, t[57] = it, t[58] = w) : w = t[58];
let W;
t[59] !== e || t[60] !== c || t[61] !== i ? (W = e === "left" && i && !c && /* @__PURE__ */ f(ft, { variant: "default", label: i, className: o.numberIndicator }), t[59] = e, t[60] = c, t[61] = i, t[62] = W) : W = t[62];
let X;
t[63] !== u || t[64] !== a || t[65] !== b || t[66] !== I || t[67] !== Q || t[68] !== N || t[69] !== A || t[70] !== g || t[71] !== w || t[72] !== W ? (X = /* @__PURE__ */ lt(u, { className: Q, ...N, ...a, ...I, ref: b, children: [
A,
g,
w,
W
] }), t[63] = u, t[64] = a, t[65] = b, t[66] = I, t[67] = Q, t[68] = N, t[69] = A, t[70] = g, t[71] = w, t[72] = W, t[73] = X) : X = t[73];
const j = X;
if (_) {
let L;
t[74] !== j ? (L = /* @__PURE__ */ f(st.Anchor, { children: j }), t[74] = j, t[75] = L) : L = t[75];
let S;
t[76] !== _ ? (S = /* @__PURE__ */ f(st.Content, { children: _ }), t[76] = _, t[77] = S) : S = t[77];
let H;
return t[78] !== L || t[79] !== S ? (H = /* @__PURE__ */ lt(st, { placement: "top", tooltipOffset: 6, children: [
L,
S
] }), t[78] = L, t[79] = S, t[80] = H) : H = t[80], H;
}
return j;
});
Ot.displayName = "DSActionLink";
export {
Ft as A,
Ot as D,
Gt as a,
Rt as b,
Zt as c,
Et as v
};