@pgcorp/ui-kit 0.10.0 → 0.10.1

package/dist/src/components/shared/data-display/SActionListItem.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,194 @@
+import { useOwnedAttrs as e } from "../../../internal/ownedAttrs.js";
+import { validateBoundedInteger as t, validateNonEmptyString as n } from "../../../internal/runtimeContract.js";
+import { resolveSemanticToneBinding as r } from "../../../internal/semanticTone.js";
+import i from "./SBadge.vue.js";
+import a from "../controls/SButton.vue.js";
+import o from "./SActionCard.vue.js";
+import { Fragment as s, computed as c, createBlock as l, createCommentVNode as u, createElementBlock as d, createElementVNode as f, createSlots as p, createTextVNode as m, createVNode as h, defineComponent as g, mergeProps as _, normalizeClass as v, openBlock as y, renderList as b, renderSlot as x, resolveDynamicComponent as S, toDisplayString as C, useSlots as w, withCtx as T } from "vue";
+//#region src/components/shared/data-display/SActionListItem.vue?vue&type=script&setup=true&lang.ts
+var E = [
+	"data-s-tone",
+	"data-selected",
+	"data-density",
+	"data-interactive",
+	"data-mode",
+	"data-disabled",
+	"data-trailing-layout",
+	"data-height-mode",
+	"data-title-presentation",
+	"data-title-weight",
+	"data-detail-presentation",
+	"data-detail-overflow",
+	"role"
+], D = {
+	key: 0,
+	class: "s-action-list-item__icon",
+	"aria-hidden": "true"
+}, O = { class: "s-action-list-item__copy" }, k = ["title"], A = {
+	key: 0,
+	class: "s-action-list-item__description"
+}, j = {
+	key: 1,
+	class: "s-action-list-item__detail"
+}, M = { class: "s-action-list-item__trailing" }, N = /*@__PURE__*/ g({
+	inheritAttrs: !1,
+	__name: "SActionListItem",
+	props: {
+		title: {},
+		titleTooltip: { default: void 0 },
+		description: { default: void 0 },
+		detail: { default: void 0 },
+		icon: { default: void 0 },
+		surface: { default: void 0 },
+		indentLevel: { default: 0 },
+		selected: {
+			type: Boolean,
+			default: !1
+		},
+		tone: { default: "default" },
+		density: { default: "comfortable" },
+		surfacePadding: { default: "none" },
+		surfaceRadius: { default: "md" },
+		actionLabel: { default: void 0 },
+		actionIcon: { default: void 0 },
+		actionSeverity: { default: "secondary" },
+		actionDisabled: {
+			type: Boolean,
+			default: !1
+		},
+		statusLabel: { default: void 0 },
+		statusSeverity: { default: "secondary" },
+		badges: { default: () => [] },
+		trailingIcon: { default: void 0 },
+		trailingLayout: { default: "responsive" },
+		heightMode: { default: "content" },
+		titlePresentation: { default: "text" },
+		titleWeight: { default: "semibold" },
+		detailPresentation: { default: "text" },
+		detailOverflow: { default: "clamp-2" }
+	},
+	emits: ["activate", "action"],
+	setup(g, { emit: N }) {
+		let P = g, F = N, I = w(), L = c(() => t("SActionListItem", "indentLevel", P.indentLevel, {
+			minimum: 0,
+			maximum: 8
+		})), R = c(() => ({ "--s-action-list-item-indent": `${L.value * .875}rem` })), z = e({
+			component: "SActionListItem",
+			owner: "action list item root"
+		}), B = c(() => r("SActionListItem", "tone", P.tone, [
+			"default",
+			"primary",
+			"success",
+			"danger"
+		])), V = c(() => z.bindings()), H = c(() => {
+			let e = V.value.role;
+			return typeof e == "string" ? e : "listitem";
+		}), U = c(() => {
+			if (!Array.isArray(P.badges)) throw TypeError("SActionListItem: badges должен быть массивом. / SActionListItem: badges must be an array.");
+			let e = /* @__PURE__ */ new Set();
+			for (let [t, r] of P.badges.entries()) {
+				let i = r, a = n("SActionListItem", `badges[${t}].id`, typeof i == "object" && i && !Array.isArray(i) ? i.id : void 0);
+				if (e.has(a)) throw TypeError(`SActionListItem: badges должен содержать уникальные id; дублируется ${JSON.stringify(a)}. / SActionListItem: badges must contain unique ids; duplicate ${JSON.stringify(a)}.`);
+				e.add(a);
+			}
+			return P.badges;
+		}), W = c(() => !!(P.actionLabel || P.statusLabel || U.value.length > 0 || P.trailingIcon || I.status || I.actions)), G = c(() => P.surface ?? {
+			mode: "action",
+			accessibleLabel: P.title
+		}), K = c(() => G.value.mode), q = c(() => G.value.mode === "static" ? !1 : G.value.disabled ?? !1);
+		function J(e) {
+			F("action", e);
+		}
+		return (e, t) => (y(), d("div", _(V.value, {
+			"data-s-tone": B.value["data-s-tone"],
+			class: "s-action-list-item",
+			"data-selected": g.selected,
+			"data-density": g.density,
+			"data-interactive": K.value !== "static",
+			"data-mode": K.value,
+			"data-disabled": q.value || void 0,
+			"data-trailing-layout": g.trailingLayout,
+			"data-height-mode": g.heightMode,
+			"data-title-presentation": g.titlePresentation,
+			"data-title-weight": g.titleWeight,
+			"data-detail-presentation": g.detailPresentation,
+			"data-detail-overflow": g.detailOverflow,
+			style: R.value,
+			role: H.value
+		}), [h(o, {
+			surface: G.value,
+			selected: g.selected,
+			tone: g.tone,
+			density: g.density,
+			padding: g.surfacePadding,
+			radius: g.surfaceRadius,
+			fill: g.heightMode === "fill" ? "container" : "content",
+			"actions-layout": g.trailingLayout,
+			onActivate: t[0] ||= (e) => F("activate", e)
+		}, p({
+			default: T(() => [f("div", { class: v(["s-action-list-item__main", { "s-action-list-item__main--static": K.value === "static" }]) }, [g.icon ? (y(), d("span", D, [(y(), l(S(g.icon)))])) : u("", !0), f("span", O, [
+				f("strong", {
+					class: "s-action-list-item__title",
+					title: g.titleTooltip
+				}, [x(e.$slots, "title", {}, () => [m(C(g.title), 1)], !0)], 8, k),
+				g.description || e.$slots.description ? (y(), d("span", A, [x(e.$slots, "description", {}, () => [m(C(g.description), 1)], !0)])) : u("", !0),
+				g.detail || e.$slots.detail ? (y(), d("span", j, [x(e.$slots, "detail", {}, () => [m(C(g.detail), 1)], !0)])) : u("", !0)
+			])], 2)]),
+			_: 2
+		}, [W.value ? {
+			name: "actions",
+			fn: T(() => [f("div", M, [
+				x(e.$slots, "status", {}, void 0, !0),
+				g.statusLabel ? (y(), l(i, {
+					key: 0,
+					severity: g.statusSeverity
+				}, {
+					default: T(() => [m(C(g.statusLabel), 1)]),
+					_: 1
+				}, 8, ["severity"])) : u("", !0),
+				(y(!0), d(s, null, b(U.value, (e) => (y(), l(i, {
+					key: e.id,
+					severity: e.severity
+				}, {
+					default: T(() => [m(C(e.label), 1)]),
+					_: 2
+				}, 1032, ["severity"]))), 128)),
+				g.actionLabel ? (y(), l(a, {
+					key: 1,
+					size: "sm",
+					label: g.actionLabel,
+					"leading-icon": g.actionIcon,
+					severity: g.actionSeverity,
+					disabled: q.value || g.actionDisabled,
+					onClick: J
+				}, null, 8, [
+					"label",
+					"leading-icon",
+					"severity",
+					"disabled"
+				])) : u("", !0),
+				x(e.$slots, "actions", {
+					disabled: q.value || g.actionDisabled,
+					emitAction: J
+				}, void 0, !0),
+				g.trailingIcon ? (y(), l(S(g.trailingIcon), {
+					key: 2,
+					class: "s-action-list-item__trailing-icon",
+					"aria-hidden": "true"
+				})) : u("", !0)
+			])]),
+			key: "0"
+		} : void 0]), 1032, [
+			"surface",
+			"selected",
+			"tone",
+			"density",
+			"padding",
+			"radius",
+			"fill",
+			"actions-layout"
+		])], 16, E));
+	}
+});
+//#endregion
+export { N as default };

package/dist/src/components/shared/data-display/SBadge.vue.d.ts

@@ -0,0 +1,33 @@
+import { Component } from 'vue';
+import { PillSurfaceIconMotion, PillSurfaceMaxWidth, PillSurfaceSeverity, PillSurfaceSize } from '../../../internal/pillSurface';
+export type BadgeSeverity = PillSurfaceSeverity;
+export interface Props {
+    severity?: BadgeSeverity;
+    dot?: boolean;
+    size?: PillSurfaceSize;
+    leadingIcon?: Component;
+    iconMotion?: PillSurfaceIconMotion;
+    truncate?: boolean;
+    maxWidth?: PillSurfaceMaxWidth;
+}
+declare var __VLS_6: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_6) => any;
+};
+declare const __VLS_base: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {
+    size: PillSurfaceSize;
+    maxWidth: PillSurfaceMaxWidth;
+    severity: BadgeSeverity;
+    iconMotion: PillSurfaceIconMotion;
+    dot: boolean;
+    truncate: boolean;
+    leadingIcon: Component;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/src/components/shared/data-display/SBadge.vue.js

@@ -0,0 +1,5 @@
+import e from "./SBadge.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/shared/data-display/SBadge.vue
+var t = e;
+//#endregion
+export { t as default };

package/dist/src/components/shared/data-display/SBadge.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,49 @@
+import { useOwnedAttrs as e } from "../../../internal/ownedAttrs.js";
+import { PILL_ICON_CLASS as t, PILL_ICON_GRAPHIC_CLASS as n, PILL_ICON_SPIN_CLASS as r, PILL_LABEL_CLASS as i, PILL_LABEL_TRUNCATE_CLASS as a, resolvePillSurfaceBindings as o } from "../../../internal/pillSurface.js";
+import { Fragment as s, computed as c, createBlock as l, createCommentVNode as u, createElementBlock as d, createElementVNode as f, defineComponent as p, mergeProps as m, normalizeClass as h, openBlock as g, renderSlot as _, resolveDynamicComponent as v, unref as y } from "vue";
+//#region src/components/shared/data-display/SBadge.vue?vue&type=script&setup=true&lang.ts
+var b = /*@__PURE__*/ p({
+	inheritAttrs: !1,
+	__name: "SBadge",
+	props: {
+		severity: { default: "secondary" },
+		dot: {
+			type: Boolean,
+			default: !1
+		},
+		size: { default: "md" },
+		leadingIcon: { default: void 0 },
+		iconMotion: { default: "static" },
+		truncate: {
+			type: Boolean,
+			default: !1
+		},
+		maxWidth: { default: "none" }
+	},
+	setup(p) {
+		let b = p, x = e({
+			component: "SBadge",
+			owner: "badge root"
+		}), S = c(() => o("SBadge", {
+			kind: "badge",
+			severity: b.severity,
+			size: b.size,
+			dot: b.dot,
+			closable: !1,
+			disabled: !1,
+			truncate: b.truncate,
+			maxWidth: b.maxWidth,
+			iconMotion: b.iconMotion
+		}));
+		return (e, o) => (g(), d("span", m({
+			...y(x).bindings(),
+			...S.value
+		}, { class: "s-badge" }), [p.dot ? u("", !0) : (g(), d(s, { key: 0 }, [p.leadingIcon ? (g(), d("span", {
+			key: 0,
+			class: h(y(t)),
+			"aria-hidden": "true"
+		}, [(g(), l(v(p.leadingIcon), { class: h([y(n), { [y(r)]: p.iconMotion === "spin" }]) }, null, 8, ["class"]))], 2)) : u("", !0), f("span", { class: h([y(i), { [y(a)]: p.truncate }]) }, [_(e.$slots, "default")], 2)], 64))], 16));
+	}
+});
+//#endregion
+export { b as default };

package/dist/src/components/shared/data-display/SChart.vue.d.ts

@@ -0,0 +1,51 @@
+import { SChartAccessibility, SChartBarMode, SChartCategory, SChartCurve, SChartDataLabels, SChartDataTablePresentation, SChartDomain, SChartGrid, SChartLegend, SChartMarkers, SChartRadialLabel, SChartSeries, SChartSize, SChartType, SChartXLabels } from './chart';
+export interface Props {
+    type: SChartType;
+    categories: readonly SChartCategory[];
+    series: readonly SChartSeries[];
+    accessibility: SChartAccessibility;
+    size?: SChartSize;
+    domain?: SChartDomain;
+    xAxis?: boolean;
+    yAxis?: boolean;
+    xAxisLabel?: string;
+    yAxisLabel?: string;
+    xLabels?: SChartXLabels;
+    yTickCount?: number;
+    grid?: SChartGrid;
+    legend?: SChartLegend;
+    dataLabels?: SChartDataLabels;
+    markers?: SChartMarkers;
+    curve?: SChartCurve;
+    barMode?: SChartBarMode;
+    radialLabel?: SChartRadialLabel;
+    centerLabel?: string;
+    centerValue?: string;
+    dataTablePresentation?: SChartDataTablePresentation;
+    emptyLabel?: string;
+    valueFormatter?: (value: number) => string;
+}
+declare const __VLS_export: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {
+    legend: SChartLegend;
+    size: SChartSize;
+    grid: SChartGrid;
+    domain: SChartDomain;
+    xLabels: SChartXLabels;
+    emptyLabel: string;
+    xAxis: boolean;
+    yAxis: boolean;
+    xAxisLabel: string;
+    yAxisLabel: string;
+    yTickCount: number;
+    dataLabels: SChartDataLabels;
+    markers: SChartMarkers;
+    curve: SChartCurve;
+    barMode: SChartBarMode;
+    radialLabel: SChartRadialLabel;
+    centerLabel: string;
+    centerValue: string;
+    dataTablePresentation: SChartDataTablePresentation;
+    valueFormatter: (value: number) => string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/src/components/shared/data-display/SChart.vue.js

@@ -0,0 +1,8 @@
+import "../../../../assets/src/components/shared/data-display/SChart.css_vue_type_style_index_0_src_47d0c0a8_scoped_47d0c0a8_lang.css";
+import e from "../../../../_virtual/_plugin-vue_export-helper.js";
+import t from "./SChart.vue_vue_type_script_setup_true_lang.js";
+/* empty css                                                                    */
+//#region src/components/shared/data-display/SChart.vue
+var n = /*#__PURE__*/ e(t, [["__scopeId", "data-v-47d0c0a8"]]);
+//#endregion
+export { n as default };