@plitzi/sdk-elements 0.37.2 → 0.37.3

package/dist/elements/basic/Button/declaration.d.ts

@@ -4,6 +4,10 @@ import { AuthorableAttributes } from '@plitzi/sdk-shared/authoring/declare';
 export type ButtonAttributes = AuthorableAttributes<ButtonProps>;
 declare const declaration: {
     readonly type: "button";
+    readonly attributeValues: {
+        readonly subType: readonly string[];
+        readonly contentPlacement: readonly string[];
+    };
     readonly content: {
         readonly attributes: {
             readonly contentPlacement: "after";
@@ -63,7 +67,7 @@ declare const declaration: {
                                 readonly 'padding-bottom': "6px";
                                 readonly cursor: "pointer";
                                 readonly 'font-size': "16px";
-                                readonly 'line-height': "24px";
+                                readonly 'line-height': "1.5";
                                 readonly 'border-top-left-radius': "4px";
                                 readonly 'border-top-right-radius': "4px";
                                 readonly 'border-bottom-left-radius': "4px";
@@ -84,7 +88,7 @@ declare const declaration: {
                                 readonly 'padding-bottom': "6px";
                                 readonly cursor: "pointer";
                                 readonly 'font-size': "16px";
-                                readonly 'line-height': "24px";
+                                readonly 'line-height': "1.5";
                                 readonly 'border-top-left-radius': "4px";
                                 readonly 'border-top-right-radius': "4px";
                                 readonly 'border-bottom-left-radius': "4px";
@@ -105,7 +109,7 @@ declare const declaration: {
                                 readonly 'padding-bottom': "6px";
                                 readonly cursor: "pointer";
                                 readonly 'font-size': "16px";
-                                readonly 'line-height': "24px";
+                                readonly 'line-height': "1.5";
                                 readonly 'border-top-left-radius': "4px";
                                 readonly 'border-top-right-radius': "4px";
                                 readonly 'border-bottom-left-radius': "4px";
@@ -119,6 +123,7 @@ declare const declaration: {
         readonly settings: {};
     };
 } & import('@plitzi/sdk-shared/authoring/declare').ElementAttributesBrand<Partial<{
+    label?: string | undefined;
     title?: string | undefined;
     content?: string | undefined;
     disabled?: boolean | undefined;

package/dist/elements/basic/Button/declaration.mjs

@@ -1,7 +1,15 @@
-import { elementDeclaration as e } from "@plitzi/sdk-shared/authoring/declare";
+import { elementDeclaration as e, valuesOf as t } from "@plitzi/sdk-shared/authoring/declare";
 //#region src/elements/basic/Button/declaration.ts
-var t = e()({
+var n = e()({
 	type: "button",
+	attributeValues: {
+		subType: t()([
+			"button",
+			"submit",
+			"reset"
+		]),
+		contentPlacement: t()(["before", "after"])
+	},
 	content: {
 		attributes: {
 			contentPlacement: "after",
@@ -51,7 +59,7 @@ var t = e()({
 						"padding-bottom": "6px",
 						cursor: "pointer",
 						"font-size": "16px",
-						"line-height": "24px",
+						"line-height": "1.5",
 						"border-top-left-radius": "4px",
 						"border-top-right-radius": "4px",
 						"border-bottom-left-radius": "4px",
@@ -68,7 +76,7 @@ var t = e()({
 						"padding-bottom": "6px",
 						cursor: "pointer",
 						"font-size": "16px",
-						"line-height": "24px",
+						"line-height": "1.5",
 						"border-top-left-radius": "4px",
 						"border-top-right-radius": "4px",
 						"border-bottom-left-radius": "4px",
@@ -85,7 +93,7 @@ var t = e()({
 						"padding-bottom": "6px",
 						cursor: "pointer",
 						"font-size": "16px",
-						"line-height": "24px",
+						"line-height": "1.5",
 						"border-top-left-radius": "4px",
 						"border-top-right-radius": "4px",
 						"border-bottom-left-radius": "4px",
@@ -98,4 +106,4 @@ var t = e()({
 	}
 });
 //#endregion
-export { t as default };
+export { n as default };

package/dist/elements/basic/Button/index.d.ts

@@ -3,6 +3,10 @@ declare const Button: {
     displayName: string;
 } & {
     readonly type: "button";
+    readonly attributeValues: {
+        readonly subType: readonly string[];
+        readonly contentPlacement: readonly string[];
+    };
     readonly content: {
         readonly attributes: {
             readonly contentPlacement: "after";
@@ -62,7 +66,7 @@ declare const Button: {
                                 readonly 'padding-bottom': "6px";
                                 readonly cursor: "pointer";
                                 readonly 'font-size': "16px";
-                                readonly 'line-height': "24px";
+                                readonly 'line-height': "1.5";
                                 readonly 'border-top-left-radius': "4px";
                                 readonly 'border-top-right-radius': "4px";
                                 readonly 'border-bottom-left-radius': "4px";
@@ -83,7 +87,7 @@ declare const Button: {
                                 readonly 'padding-bottom': "6px";
                                 readonly cursor: "pointer";
                                 readonly 'font-size': "16px";
-                                readonly 'line-height': "24px";
+                                readonly 'line-height': "1.5";
                                 readonly 'border-top-left-radius': "4px";
                                 readonly 'border-top-right-radius': "4px";
                                 readonly 'border-bottom-left-radius': "4px";
@@ -104,7 +108,7 @@ declare const Button: {
                                 readonly 'padding-bottom': "6px";
                                 readonly cursor: "pointer";
                                 readonly 'font-size': "16px";
-                                readonly 'line-height': "24px";
+                                readonly 'line-height': "1.5";
                                 readonly 'border-top-left-radius': "4px";
                                 readonly 'border-top-right-radius': "4px";
                                 readonly 'border-bottom-left-radius': "4px";
@@ -118,6 +122,7 @@ declare const Button: {
         readonly settings: {};
     };
 } & import('@plitzi/sdk-shared/authoring/declare').ElementAttributesBrand<Partial<{
+    label?: string | undefined;
     title?: string | undefined;
     content?: string | undefined;
     disabled?: boolean | undefined;

package/dist/elements/basic/Dropdown/Dropdown.mjs

@@ -3,56 +3,65 @@ import t from "../../../Element/hooks/useElement.mjs";
 import { RootElement as n } from "../../../Element/RootElement.mjs";
 import r from "./DropdownContext.mjs";
 import i from "./useDropdown.mjs";
-import { useCallback as a, useMemo as o, useRef as s } from "react";
-import c from "@plitzi/sdk-shared/hooks/usePlitziServiceContext";
-import { jsx as l, jsxs as u } from "react/jsx-runtime";
-import d from "clsx";
+import a from "./useDropdownTrigger.mjs";
+import { useCallback as o, useMemo as s, useRef as c } from "react";
+import l from "@plitzi/sdk-shared/hooks/usePlitziServiceContext";
+import { jsx as u, jsxs as d } from "react/jsx-runtime";
+import f from "clsx";
 //#region src/elements/basic/Dropdown/Dropdown.tsx
-var f = ({ ref: e, children: f, className: p = "", popupPlacement: m = "bottom", openPopup: h = !1, backgroundDisabled: g = !1, closeOnClickBackground: _ = !0, closeOnClickPopup: v = !0, containerTopOffset: y = 5, containerLeftOffset: b = 5, disabled: x = !1 }) => {
-	let { setElementState: S, definition: { styleSelectors: C } } = t(), { settings: { previewMode: w }, utils: { getWindow: T } } = c(), E = s(null), D = s(null), O = o(() => T(), [T]), k = a((e) => {
-		_ && (e.stopPropagation(), e.preventDefault(), S((e) => ({
+var p = ({ ref: e, children: p, className: m = "", popupPlacement: h = "bottom", openPopup: g = !1, backgroundDisabled: _ = !1, closeOnClickBackground: v = !0, closeOnClickPopup: y = !0, containerTopOffset: b = 5, containerLeftOffset: x = 5, disabled: S = !1 }) => {
+	let { setElementState: C, definition: { styleSelectors: w } } = t(), { settings: { previewMode: T }, utils: { getWindow: E } } = l(), D = c(null), O = c(null), k = s(() => E(), [E]), A = o((e) => {
+		v && (e.stopPropagation(), e.preventDefault(), C((e) => ({
 			...e,
 			openPopup: !1
 		})));
-	}, [_, S]), A = a((e) => {
-		S((t) => ({
+	}, [v, C]), j = o((e) => {
+		C((t) => ({
 			...t,
 			openPopup: e
 		}));
-	}, [S]), [, , j, M, , N] = i({
+	}, [C]), [, , M, N, , P] = i({
 		ref: e,
-		popupRef: E,
-		open: h,
-		disabled: !w || x,
-		closeOnClickPopup: v,
-		placement: m,
-		offsetX: b,
-		offsetY: y,
-		myWindow: O,
-		onChange: A
-	}), P = o(() => ({
-		popupRef: E,
-		openPopup: h,
-		parameters: N,
-		onClick: M
+		popupRef: D,
+		open: g,
+		disabled: !T || S,
+		closeOnClickPopup: y,
+		closeOnClickOutside: v && !_,
+		placement: h,
+		offsetX: x,
+		offsetY: b,
+		myWindow: k,
+		onChange: j
+	}), F = a({
+		popupRef: D,
+		open: g,
+		positioned: !!P,
+		enabled: !!T && !S
+	}), I = o((e) => {
+		F(e), M(e);
+	}, [F, M]), L = s(() => ({
+		popupRef: D,
+		openPopup: g,
+		parameters: P,
+		onClick: N
 	}), [
-		M,
-		h,
-		N
+		N,
+		g,
+		P
 	]);
-	return /* @__PURE__ */ u(n, {
+	return /* @__PURE__ */ d(n, {
 		ref: e,
-		className: d("plitzi-component__dropdown", p, { "container--empty--skip": !w && !f }),
-		onClick: j,
-		children: [/* @__PURE__ */ l(r, {
-			value: P,
-			children: f
-		}), h && g && w && /* @__PURE__ */ l("div", {
-			ref: D,
-			className: d("plitzi-component__dropdown__background-container", C.backgroundContainer),
-			onClick: k
+		className: f("plitzi-component__dropdown", m, { "container--empty--skip": !T && !p }),
+		onClick: I,
+		children: [/* @__PURE__ */ u(r, {
+			value: L,
+			children: p
+		}), g && _ && T && /* @__PURE__ */ u("div", {
+			ref: O,
+			className: f("plitzi-component__dropdown__background-container", w.backgroundContainer),
+			onClick: A
 		})]
 	});
-}, p = e(f);
+}, m = e(p);
 //#endregion
-export { f as Dropdown, p as default };
+export { p as Dropdown, m as default };

package/dist/elements/basic/Dropdown/declaration.d.ts

@@ -4,6 +4,9 @@ import { AuthorableAttributes } from '@plitzi/sdk-shared/authoring/declare';
 export type DropdownAttributes = AuthorableAttributes<DropdownProps>;
 declare const declaration: {
     readonly type: "dropdown";
+    readonly attributeValues: {
+        readonly popupPlacement: readonly string[];
+    };
     readonly content: {
         readonly attributes: {
             readonly popupPlacement: "bottom";

package/dist/elements/basic/Dropdown/declaration.mjs

@@ -1,7 +1,13 @@
-import { elementDeclaration as e } from "@plitzi/sdk-shared/authoring/declare";
+import { elementDeclaration as e, valuesOf as t } from "@plitzi/sdk-shared/authoring/declare";
 //#region src/elements/basic/Dropdown/declaration.ts
-var t = e()({
+var n = e()({
 	type: "dropdown",
+	attributeValues: { popupPlacement: t()([
+		"left",
+		"right",
+		"top",
+		"bottom"
+	]) },
 	content: {
 		attributes: {
 			popupPlacement: "bottom",
@@ -67,4 +73,4 @@ var t = e()({
 	initialItems: ["dropdownPopup"]
 });
 //#endregion
-export { t as default };
+export { n as default };

package/dist/elements/basic/Dropdown/index.d.ts

@@ -71,6 +71,9 @@ declare const Dropdown: {
         } & import('@plitzi/sdk-shared/authoring/declare').ElementAttributesBrand<unknown>;
     };
     type: "dropdown";
+    attributeValues: {
+        readonly popupPlacement: readonly string[];
+    };
     content: {
         readonly attributes: {
             readonly popupPlacement: "bottom";

package/dist/elements/basic/Dropdown/useDropdown.d.ts

@@ -10,6 +10,11 @@ export type UseDropdownProps = {
     disabled?: boolean;
     loading?: boolean;
     closeOnClickPopup?: boolean;
+    /**
+     * Close when the pointer goes down anywhere outside the trigger and the popup. What a menu is expected to do; off by
+     * default here because a caller that renders its own backdrop closes from that instead.
+     */
+    closeOnClickOutside?: boolean;
     placement?: 'left' | 'right' | 'top' | 'bottom';
     myWindow?: Window | null;
     offsetX?: number;
@@ -24,5 +29,5 @@ export type UseDropdownReturn = [
     DOMRect | undefined,
     FloatingPosition | undefined
 ];
-declare const useDropdown: ({ ref, popupRef, open: openProp, placement, disabled, loading, closeOnClickPopup, offsetX, offsetY, myWindow, onChange }: UseDropdownProps) => UseDropdownReturn;
+declare const useDropdown: ({ ref, popupRef, open: openProp, placement, disabled, loading, closeOnClickPopup, closeOnClickOutside, offsetX, offsetY, myWindow, onChange }: UseDropdownProps) => UseDropdownReturn;
 export default useDropdown;

package/dist/elements/basic/Dropdown/useDropdown.mjs

@@ -1,107 +1,124 @@
 import { useCallback as e, useEffect as t, useMemo as n, useState as r } from "react";
 import i from "@plitzi/plitzi-ui/hooks/useDidUpdateEffect";
 //#region src/elements/basic/Dropdown/useDropdown.ts
-var a = ({ ref: a, popupRef: o, open: s, placement: c = "bottom", disabled: l = !1, loading: u = !1, closeOnClickPopup: d = !0, offsetX: f = 0, offsetY: p = 0, myWindow: m, onChange: h }) => {
-	let [g, _] = r(s ?? !1), [v, y] = r(() => a?.current?.getBoundingClientRect()), b = n(() => m || (typeof window < "u" ? window : null), [m]), x = e((e) => {
-		if (!(l || u)) {
+var a = ({ ref: a, popupRef: o, open: s, placement: c = "bottom", disabled: l = !1, loading: u = !1, closeOnClickPopup: d = !0, closeOnClickOutside: f = !1, offsetX: p = 0, offsetY: m = 0, myWindow: h, onChange: g }) => {
+	let [_, v] = r(s ?? !1), [y, b] = r(() => a?.current?.getBoundingClientRect()), x = n(() => h || (typeof window < "u" ? window : null), [h]), S = e((e) => {
+		if (!(l || u || e.target instanceof Node && o?.current?.contains(e.target))) {
 			if (e.stopPropagation(), e.preventDefault(), s !== void 0) {
-				h?.(!g, !1);
+				g?.(!_, !1);
 				return;
 			}
-			h?.(!g, !0), _((e) => !e);
+			g?.(!_, !0), v((e) => !e);
 		}
 	}, [
 		l,
 		u,
-		h,
 		g,
-		s
-	]), S = e((e) => {
+		_,
+		s,
+		o
+	]), C = e((e) => {
 		if (!(l || u || !d)) {
 			if (e.stopPropagation(), e.preventDefault(), s !== void 0) {
-				h?.(!g, !1);
+				g?.(!_, !1);
 				return;
 			}
-			h?.(!g, !0), _((e) => !e);
+			g?.(!_, !0), v((e) => !e);
 		}
 	}, [
 		d,
 		l,
 		u,
-		h,
 		g,
+		_,
 		s
 	]);
 	t(() => {
 		let e = a?.current;
-		if (!e || typeof window > "u" || !g) return;
-		let t = () => y(a.current?.getBoundingClientRect()), n;
+		if (!e || typeof window > "u" || !_) return;
+		let t = () => b(a.current?.getBoundingClientRect()), n;
 		return typeof ResizeObserver < "u" && (n = new ResizeObserver(t), n.observe(e)), window.addEventListener("scroll", t, !0), window.addEventListener("resize", t), () => {
 			n?.disconnect(), window.removeEventListener("scroll", t, !0), window.removeEventListener("resize", t);
 		};
-	}, [g, a]);
-	let C = e((e) => {
-		e.key === "Escape" && (h?.(!g, s !== void 0), _((e) => !e));
+	}, [_, a]);
+	let w = e((e) => {
+		e.key === "Escape" && (g?.(!_, s !== void 0), v((e) => !e));
 	}, [
-		h,
 		g,
+		_,
 		s
 	]);
 	t(() => {
-		if (g && !l) return window.addEventListener("keydown", C), () => {
-			window.removeEventListener("keydown", C);
+		if (!_ || l || !f || !x) return;
+		let e = (e) => {
+			let t = e.target instanceof Node ? e.target : null;
+			!t || a?.current?.contains(t) || o?.current?.contains(t) || (g?.(!1, s === void 0), s === void 0 && v(!1));
 		};
+		return x.addEventListener("pointerdown", e, !0), () => x.removeEventListener("pointerdown", e, !0);
 	}, [
+		_,
+		l,
+		f,
+		x,
+		a,
+		o,
 		g,
-		C,
+		s
+	]), t(() => {
+		if (_ && !l) return window.addEventListener("keydown", w), () => {
+			window.removeEventListener("keydown", w);
+		};
+	}, [
+		_,
+		w,
 		l
 	]);
-	let w = e((e) => {
-		if (!v || !b) return;
-		let t = b.innerWidth, n = b.innerHeight, r = 0, i = 0;
+	let T = e((e) => {
+		if (!y || !x) return;
+		let t = x.innerWidth, n = x.innerHeight, r = 0, i = 0;
 		switch (c) {
 			case "top":
-				r = v.top - e.height, i = v.left;
+				r = y.top - e.height, i = y.left;
 				break;
 			case "bottom":
-				r = v.bottom, i = v.left;
+				r = y.bottom, i = y.left;
 				break;
 			case "left":
-				r = v.top, i = v.left - e.width;
+				r = y.top, i = y.left - e.width;
 				break;
 			case "right":
-				r = v.top, i = v.right;
+				r = y.top, i = y.right;
 				break;
-			default: r = v.bottom, i = v.left;
+			default: r = y.bottom, i = y.left;
 		}
-		return c === "bottom" ? (r += p, i += f) : c === "top" ? (r -= p, i += f) : c === "left" ? (r += p, i -= f) : c === "right" && (r += p, i += f), c === "bottom" || c === "top" ? (i + e.width > t ? i = v.right - e.width : i < 0 && (i = v.left), r = Math.max(0, Math.min(n - e.height, r))) : c === "left" || c === "right" ? (r + e.height > n ? r = v.bottom - e.height : r < 0 && (r = v.top), i = Math.max(0, Math.min(t - e.width, i))) : (r = Math.max(0, Math.min(n - e.height, r)), i = Math.max(0, Math.min(t - e.width, i))), {
+		return c === "bottom" ? (r += m, i += p) : c === "top" ? (r -= m, i += p) : c === "left" ? (r += m, i -= p) : c === "right" && (r += m, i += p), c === "bottom" || c === "top" ? (i + e.width > t ? i = y.right - e.width : i < 0 && (i = y.left), r = Math.max(0, Math.min(n - e.height, r))) : c === "left" || c === "right" ? (r + e.height > n ? r = y.bottom - e.height : r < 0 && (r = y.top), i = Math.max(0, Math.min(t - e.width, i))) : (r = Math.max(0, Math.min(n - e.height, r)), i = Math.max(0, Math.min(t - e.width, i))), {
 			top: r,
 			left: i
 		};
 	}, [
-		v,
-		b,
+		y,
+		x,
 		c,
-		p,
-		f
+		m,
+		p
 	]);
 	return i(() => {
-		_(s ?? !1);
+		v(s ?? !1);
 	}, [s]), [
-		g,
 		_,
-		x,
-		S,
 		v,
+		S,
+		C,
+		y,
 		n(() => {
-			if (!g || !a?.current || !o?.current) return;
+			if (!_ || !a?.current || !o?.current) return;
 			let e = o.current.getBoundingClientRect();
-			return w(e);
+			return T(e);
 		}, [
-			g,
+			_,
 			a,
 			o,
-			w
+			T
 		])
 	];
 };

package/dist/elements/basic/Dropdown/useDropdownTrigger.d.ts

@@ -0,0 +1,26 @@
+import { MouseEvent, RefObject } from 'react';
+export type UseDropdownTriggerProps = {
+    popupRef: RefObject<HTMLElement | null>;
+    open: boolean;
+    /** Where the popup is drawn; until it is known the popup is hidden, and nothing in it can take the focus. */
+    positioned: boolean;
+    /** Off in the builder, where a dropdown is something being edited. */
+    enabled: boolean;
+};
+/**
+ * What a dropdown tells assistive technology about the control that opens it, and where the keyboard goes.
+ *
+ * - **The trigger says it opens something** (`aria-haspopup`) **and whether it is open** (`aria-expanded`). The trigger
+ *   is the author's own button, so the attributes are written on it rather than rendered.
+ * - **Opened from the keyboard, the focus moves to the popup's first control** — the popup can come before the trigger
+ *   in the page, where Tab would never reach it. Opened with a pointer, the focus stays: nobody asked for it to move.
+ * - **Closed while the focus is inside, the focus goes back to the trigger**, so Escape leaves a person where they were
+ *   instead of on a control that has just been hidden.
+ *
+ * A dropdown with no control outside its popup has none of this: nothing a keyboard can reach opens it
+ * (`dropdown-without-control`, in the linter).
+ *
+ * @returns what the dropdown's own click handler calls first, to learn whether a keyboard pressed the trigger.
+ */
+declare const useDropdownTrigger: ({ popupRef, open, positioned, enabled }: UseDropdownTriggerProps) => ((event: MouseEvent) => void);
+export default useDropdownTrigger;

package/dist/elements/basic/Dropdown/useDropdownTrigger.mjs

@@ -0,0 +1,30 @@
+import { useCallback as e, useEffect as t, useRef as n } from "react";
+//#region src/elements/basic/Dropdown/useDropdownTrigger.ts
+var r = "button, a[href], input, select, textarea, [role=\"button\"]", i = (e) => {
+	let t = e?.closest(".plitzi-component__dropdown");
+	return t ? [...t.querySelectorAll(r)].find((t) => !e?.contains(t)) : void 0;
+}, a = ({ popupRef: a, open: o, positioned: s, enabled: c }) => {
+	let l = n(!1), u = n(o), d = e((e) => {
+		l.current = e.detail === 0;
+	}, []);
+	return t(() => {
+		let e = c ? i(a.current) : void 0;
+		e && (e.setAttribute("aria-haspopup", "true"), e.setAttribute("aria-expanded", String(o)));
+	}), t(() => {
+		let e = a.current, t = u.current && !o;
+		if (u.current = o, c && e) {
+			if (t && e.contains(e.ownerDocument.activeElement)) {
+				i(e)?.focus({ preventScroll: !0 });
+				return;
+			}
+			o && s && l.current && !e.contains(e.ownerDocument.activeElement) && (l.current = !1, e.querySelector(r)?.focus({ preventScroll: !0 }));
+		}
+	}, [
+		c,
+		o,
+		s,
+		a
+	]), d;
+};
+//#endregion
+export { a as default };

package/dist/elements/basic/Heading/declaration.d.ts

@@ -4,6 +4,9 @@ import { AuthorableAttributes } from '@plitzi/sdk-shared/authoring/declare';
 export type HeadingAttributes = AuthorableAttributes<HeadingProps>;
 declare const declaration: {
     readonly type: "heading";
+    readonly attributeValues: {
+        readonly subType: readonly string[];
+    };
     readonly content: {
         readonly attributes: {
             readonly content: "Heading";
@@ -58,7 +61,7 @@ declare const declaration: {
                                 readonly 'margin-bottom': "25px";
                                 readonly 'font-size': "38px";
                                 readonly 'font-weight': 700;
-                                readonly 'line-height': "44px";
+                                readonly 'line-height': "1.158";
                             };
                         };
                     };
@@ -73,7 +76,7 @@ declare const declaration: {
                                 readonly 'margin-bottom': "25px";
                                 readonly 'font-size': "32px";
                                 readonly 'font-weight': 700;
-                                readonly 'line-height': "36px";
+                                readonly 'line-height': "1.125";
                             };
                         };
                     };
@@ -88,7 +91,7 @@ declare const declaration: {
                                 readonly 'margin-bottom': "25px";
                                 readonly 'font-size': "24px";
                                 readonly 'font-weight': 700;
-                                readonly 'line-height': "30px";
+                                readonly 'line-height': "1.25";
                             };
                         };
                     };
@@ -103,7 +106,7 @@ declare const declaration: {
                                 readonly 'margin-bottom': "25px";
                                 readonly 'font-size': "18px";
                                 readonly 'font-weight': 700;
-                                readonly 'line-height': "24px";
+                                readonly 'line-height': "1.333";
                             };
                         };
                     };
@@ -118,7 +121,7 @@ declare const declaration: {
                                 readonly 'margin-bottom': "25px";
                                 readonly 'font-size': "14px";
                                 readonly 'font-weight': 700;
-                                readonly 'line-height': "20px";
+                                readonly 'line-height': "1.429";
                             };
                         };
                     };
@@ -133,7 +136,7 @@ declare const declaration: {
                                 readonly 'margin-bottom': "25px";
                                 readonly 'font-size': "12px";
                                 readonly 'font-weight': 700;
-                                readonly 'line-height': "18px";
+                                readonly 'line-height': "1.5";
                             };
                         };
                     };