@stihl-design-system/components
Version:
Welcome to the STIHL Design System react component library.
149 lines (148 loc) • 9.24 kB
JavaScript
"use client";
import { jsx as u } from "react/jsx-runtime";
import { d as v } from "./chunks/index.cKLI89Eg.js";
import { c as L } from "./chunks/index.DQOqod3i.js";
import './assets/skeleton.D9MOCUK4.css';const M = "ds-skeleton_line_ujlx7_26", N = "ds-skeleton_shimmer-slide_ujlx7_1", C = "ds-skeleton_line--title-x-large_ujlx7_57", z = "ds-skeleton_line--title-large_ujlx7_60", W = "ds-skeleton_line--heading-x-large_ujlx7_63", w = "ds-skeleton_line--heading-large_ujlx7_66", $ = "ds-skeleton_line--heading-medium_ujlx7_69", A = "ds-skeleton_line--heading-small_ujlx7_72", E = "ds-skeleton_line--text-large_ujlx7_75", b = "ds-skeleton_line--text-medium_ujlx7_78", q = "ds-skeleton_line--text-small_ujlx7_81", B = "ds-skeleton_line--text-x-small_ujlx7_84", F = "ds-skeleton_line--text-xx-small_ujlx7_87", G = "ds-skeleton_line--utility-large_ujlx7_90", I = "ds-skeleton_line--utility-medium_ujlx7_93", J = "ds-skeleton_line--utility-small_ujlx7_96", K = "ds-skeleton_line--utility-x-small-demi_ujlx7_99", O = "ds-skeleton_line--heading-x-large-uppercase_ujlx7_106", P = "ds-skeleton_line--heading-large-uppercase_ujlx7_109", Q = "ds-skeleton_line--theme-dark_ujlx7_113", R = "ds-skeleton_multi-line-wrapper_ujlx7_143", V = "ds-skeleton_multi-line_ujlx7_143", Y = "ds-skeleton_multi-line--title-x-large_ujlx7_182", Z = "ds-skeleton_multi-line--title-large_ujlx7_185", ee = "ds-skeleton_multi-line--heading-x-large_ujlx7_188", le = "ds-skeleton_multi-line--heading-large_ujlx7_191", ie = "ds-skeleton_multi-line--heading-medium_ujlx7_194", te = "ds-skeleton_multi-line--heading-small_ujlx7_197", ne = "ds-skeleton_multi-line--text-large_ujlx7_200", se = "ds-skeleton_multi-line--text-medium_ujlx7_203", ae = "ds-skeleton_multi-line--text-small_ujlx7_206", me = "ds-skeleton_multi-line--text-x-small_ujlx7_209", ue = "ds-skeleton_multi-line--text-xx-small_ujlx7_212", _e = "ds-skeleton_multi-line--utility-large_ujlx7_215", de = "ds-skeleton_multi-line--utility-medium_ujlx7_218", re = "ds-skeleton_multi-line--utility-small_ujlx7_221", xe = "ds-skeleton_multi-line--utility-x-small-demi_ujlx7_224", oe = "ds-skeleton_multi-line--heading-x-large-uppercase_ujlx7_231", ge = "ds-skeleton_multi-line--heading-large-uppercase_ujlx7_234", ce = "ds-skeleton_multi-line--theme-dark_ujlx7_238", ke = "ds-skeleton_rectangle_ujlx7_268", je = "ds-skeleton_rectangle--theme-dark_ujlx7_299", he = "ds-skeleton_circle_ujlx7_329", Le = "ds-skeleton_circle--theme-dark_ujlx7_361", s = {
line: M,
"shimmer-slide": "ds-skeleton_shimmer-slide_ujlx7_1",
shimmerSlide: N,
"line--title-x-large": "ds-skeleton_line--title-x-large_ujlx7_57",
lineTitleXLarge: C,
"line--title-large": "ds-skeleton_line--title-large_ujlx7_60",
lineTitleLarge: z,
"line--heading-x-large": "ds-skeleton_line--heading-x-large_ujlx7_63",
lineHeadingXLarge: W,
"line--heading-large": "ds-skeleton_line--heading-large_ujlx7_66",
lineHeadingLarge: w,
"line--heading-medium": "ds-skeleton_line--heading-medium_ujlx7_69",
lineHeadingMedium: $,
"line--heading-small": "ds-skeleton_line--heading-small_ujlx7_72",
lineHeadingSmall: A,
"line--text-large": "ds-skeleton_line--text-large_ujlx7_75",
lineTextLarge: E,
"line--text-medium": "ds-skeleton_line--text-medium_ujlx7_78",
lineTextMedium: b,
"line--text-small": "ds-skeleton_line--text-small_ujlx7_81",
lineTextSmall: q,
"line--text-x-small": "ds-skeleton_line--text-x-small_ujlx7_84",
lineTextXSmall: B,
"line--text-xx-small": "ds-skeleton_line--text-xx-small_ujlx7_87",
lineTextXxSmall: F,
"line--utility-large": "ds-skeleton_line--utility-large_ujlx7_90",
lineUtilityLarge: G,
"line--utility-medium": "ds-skeleton_line--utility-medium_ujlx7_93",
lineUtilityMedium: I,
"line--utility-small": "ds-skeleton_line--utility-small_ujlx7_96",
lineUtilitySmall: J,
"line--utility-x-small-demi": "ds-skeleton_line--utility-x-small-demi_ujlx7_99",
lineUtilityXSmallDemi: K,
"line--heading-x-large-uppercase": "ds-skeleton_line--heading-x-large-uppercase_ujlx7_106",
lineHeadingXLargeUppercase: O,
"line--heading-large-uppercase": "ds-skeleton_line--heading-large-uppercase_ujlx7_109",
lineHeadingLargeUppercase: P,
"line--theme-dark": "ds-skeleton_line--theme-dark_ujlx7_113",
lineThemeDark: Q,
"multi-line-wrapper": "ds-skeleton_multi-line-wrapper_ujlx7_143",
multiLineWrapper: R,
"multi-line": "ds-skeleton_multi-line_ujlx7_143",
multiLine: V,
"multi-line--title-x-large": "ds-skeleton_multi-line--title-x-large_ujlx7_182",
multiLineTitleXLarge: Y,
"multi-line--title-large": "ds-skeleton_multi-line--title-large_ujlx7_185",
multiLineTitleLarge: Z,
"multi-line--heading-x-large": "ds-skeleton_multi-line--heading-x-large_ujlx7_188",
multiLineHeadingXLarge: ee,
"multi-line--heading-large": "ds-skeleton_multi-line--heading-large_ujlx7_191",
multiLineHeadingLarge: le,
"multi-line--heading-medium": "ds-skeleton_multi-line--heading-medium_ujlx7_194",
multiLineHeadingMedium: ie,
"multi-line--heading-small": "ds-skeleton_multi-line--heading-small_ujlx7_197",
multiLineHeadingSmall: te,
"multi-line--text-large": "ds-skeleton_multi-line--text-large_ujlx7_200",
multiLineTextLarge: ne,
"multi-line--text-medium": "ds-skeleton_multi-line--text-medium_ujlx7_203",
multiLineTextMedium: se,
"multi-line--text-small": "ds-skeleton_multi-line--text-small_ujlx7_206",
multiLineTextSmall: ae,
"multi-line--text-x-small": "ds-skeleton_multi-line--text-x-small_ujlx7_209",
multiLineTextXSmall: me,
"multi-line--text-xx-small": "ds-skeleton_multi-line--text-xx-small_ujlx7_212",
multiLineTextXxSmall: ue,
"multi-line--utility-large": "ds-skeleton_multi-line--utility-large_ujlx7_215",
multiLineUtilityLarge: _e,
"multi-line--utility-medium": "ds-skeleton_multi-line--utility-medium_ujlx7_218",
multiLineUtilityMedium: de,
"multi-line--utility-small": "ds-skeleton_multi-line--utility-small_ujlx7_221",
multiLineUtilitySmall: re,
"multi-line--utility-x-small-demi": "ds-skeleton_multi-line--utility-x-small-demi_ujlx7_224",
multiLineUtilityXSmallDemi: xe,
"multi-line--heading-x-large-uppercase": "ds-skeleton_multi-line--heading-x-large-uppercase_ujlx7_231",
multiLineHeadingXLargeUppercase: oe,
"multi-line--heading-large-uppercase": "ds-skeleton_multi-line--heading-large-uppercase_ujlx7_234",
multiLineHeadingLargeUppercase: ge,
"multi-line--theme-dark": "ds-skeleton_multi-line--theme-dark_ujlx7_238",
multiLineThemeDark: ce,
rectangle: ke,
"rectangle--theme-dark": "ds-skeleton_rectangle--theme-dark_ujlx7_299",
rectangleThemeDark: je,
circle: he,
"circle--theme-dark": "ds-skeleton_circle--theme-dark_ujlx7_361",
circleThemeDark: Le
}, Se = (p) => {
const e = v.c(39);
let i, t, _, d, r, x;
e[0] !== p ? ({
className: i,
textSize: _,
textLineCount: d,
theme: r,
variant: x,
...t
} = p, e[0] = p, e[1] = i, e[2] = t, e[3] = _, e[4] = d, e[5] = r, e[6] = x) : (i = e[1], t = e[2], _ = e[3], d = e[4], r = e[5], x = e[6]);
const o = _ === void 0 ? "text-medium" : _, X = d === void 0 ? 3 : d, f = r === void 0 ? "light" : r, c = x === void 0 ? "single-line" : x, y = o.startsWith("title-"), n = f === "dark";
if (c === "rectangle") {
let l;
e[7] !== i || e[8] !== n ? (l = L(s.rectangle, i, {
[s.rectangleThemeDark]: n
}), e[7] = i, e[8] = n, e[9] = l) : l = e[9];
let a;
return e[10] !== t || e[11] !== l ? (a = /* @__PURE__ */ u("div", { "aria-hidden": "true", className: l, ...t }), e[10] = t, e[11] = l, e[12] = a) : a = e[12], a;
}
if (c === "circle") {
let l;
e[13] !== i || e[14] !== n ? (l = L(s.circle, i, {
[s.circleThemeDark]: n
}), e[13] = i, e[14] = n, e[15] = l) : l = e[15];
let a;
return e[16] !== t || e[17] !== l ? (a = /* @__PURE__ */ u("div", { "aria-hidden": "true", className: l, ...t }), e[16] = t, e[17] = l, e[18] = a) : a = e[18], a;
}
const T = o ? s[`line--${o}`] : void 0;
let k;
e[19] !== i || e[20] !== n || e[21] !== T ? (k = L(s.line, T, i, {
[s.lineThemeDark]: n
}), e[19] = i, e[20] = n, e[21] = T, e[22] = k) : k = e[22];
const S = k;
if (c === "single-line" && !y) {
let l;
return e[23] !== S || e[24] !== t ? (l = /* @__PURE__ */ u("div", { "aria-hidden": "true", className: S, ...t }), e[23] = S, e[24] = t, e[25] = l) : l = e[25], l;
}
const g = o ? s[`multi-line--${o}`] : void 0, H = Math.max(2, y && c === "single-line" ? 2 : y ? X + 1 : X);
let j;
if (e[26] !== n || e[27] !== H || e[28] !== g) {
let l;
e[30] !== n || e[31] !== g ? (l = (a, D) => /* @__PURE__ */ u("div", { className: L(s.multiLine, g, {
[s.multiLineThemeDark]: n
}) }, D), e[30] = n, e[31] = g, e[32] = l) : l = e[32], j = Array.from({
length: H
}, l), e[26] = n, e[27] = H, e[28] = g, e[29] = j;
} else
j = e[29];
const U = j;
let m;
e[33] !== U ? (m = /* @__PURE__ */ u("div", { className: s.multiLineWrapper, children: U }), e[33] = U, e[34] = m) : m = e[34];
let h;
return e[35] !== i || e[36] !== t || e[37] !== m ? (h = /* @__PURE__ */ u("div", { "aria-hidden": "true", className: i, ...t, children: m }), e[35] = i, e[36] = t, e[37] = m, e[38] = h) : h = e[38], h;
};
export {
Se as DSSkeleton
};