@kopexa/grc 0.0.2 → 0.0.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/chunk-5TBN3JQA.mjs +66 -0
- package/dist/chunk-DC44K745.mjs +46 -0
- package/dist/chunk-HI7F2CF4.mjs +1 -0
- package/dist/chunk-HJUSN7FD.mjs +1 -0
- package/dist/chunk-QDYL5ABK.mjs +118 -0
- package/dist/chunk-QS5S6V26.mjs +22 -0
- package/dist/chunk-VFX3DASQ.mjs +57 -0
- package/dist/common/control/index.d.mts +3 -0
- package/dist/common/control/index.d.ts +3 -0
- package/dist/common/control/index.js +160 -0
- package/dist/common/control/index.mjs +11 -0
- package/dist/common/control/mapped-controls.d.mts +33 -0
- package/dist/common/control/mapped-controls.d.ts +33 -0
- package/dist/common/control/mapped-controls.js +159 -0
- package/dist/common/control/mapped-controls.mjs +11 -0
- package/dist/common/control/messages.d.mts +16 -0
- package/dist/common/control/messages.d.ts +16 -0
- package/dist/common/control/messages.js +45 -0
- package/dist/common/control/messages.mjs +7 -0
- package/dist/common/index.d.mts +5 -0
- package/dist/common/index.d.ts +5 -0
- package/dist/common/index.js +364 -75
- package/dist/common/index.mjs +26 -1
- package/dist/common/risk/index.d.mts +4 -0
- package/dist/common/risk/index.d.ts +4 -0
- package/dist/common/risk/index.js +185 -0
- package/dist/common/risk/index.mjs +20 -0
- package/dist/common/risk/messages.d.mts +40 -0
- package/dist/common/risk/messages.d.ts +40 -0
- package/dist/common/risk/messages.js +69 -0
- package/dist/common/risk/messages.mjs +7 -0
- package/dist/common/risk/risk-rating-display.d.mts +21 -0
- package/dist/common/risk/risk-rating-display.d.ts +21 -0
- package/dist/common/risk/risk-rating-display.js +139 -0
- package/dist/common/risk/risk-rating-display.mjs +10 -0
- package/dist/common/risk/types.d.mts +37 -0
- package/dist/common/risk/types.d.ts +37 -0
- package/dist/common/risk/types.js +82 -0
- package/dist/common/risk/types.mjs +11 -0
- package/dist/index.d.mts +5 -0
- package/dist/index.d.ts +5 -0
- package/dist/index.js +364 -75
- package/dist/index.mjs +26 -1
- package/package.json +8 -7
- package/src/common/control/index.ts +6 -0
- package/src/common/control/mapped-controls.tsx +192 -0
- package/src/common/control/messages.ts +16 -0
- package/src/common/index.ts +2 -0
- package/src/common/risk/index.ts +12 -0
- package/src/common/risk/messages.ts +40 -0
- package/src/common/risk/risk-rating-display.tsx +86 -0
- package/src/common/risk/types.ts +91 -0
- /package/dist/{chunk-BFZPRJQT.mjs → chunk-CND77GVC.mjs} +0 -0
|
@@ -0,0 +1,66 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import {
|
|
3
|
+
messages
|
|
4
|
+
} from "./chunk-DC44K745.mjs";
|
|
5
|
+
import {
|
|
6
|
+
getRiskLevelFromRating,
|
|
7
|
+
isRatingUnrated
|
|
8
|
+
} from "./chunk-VFX3DASQ.mjs";
|
|
9
|
+
|
|
10
|
+
// src/common/risk/risk-rating-display.tsx
|
|
11
|
+
import { useSafeIntl } from "@kopexa/i18n";
|
|
12
|
+
import { Tooltip } from "@kopexa/sight";
|
|
13
|
+
import { riskRating } from "@kopexa/theme";
|
|
14
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
15
|
+
function RiskRatingDisplay({
|
|
16
|
+
rating,
|
|
17
|
+
showBadge = true,
|
|
18
|
+
showLabel = true,
|
|
19
|
+
size = "md"
|
|
20
|
+
}) {
|
|
21
|
+
const intl = useSafeIntl();
|
|
22
|
+
if (isRatingUnrated(rating)) {
|
|
23
|
+
const styles2 = riskRating({ size, level: "unrated" });
|
|
24
|
+
const levelLabel2 = intl.formatMessage(messages.level_unrated);
|
|
25
|
+
return /* @__PURE__ */ jsx(Tooltip, { content: intl.formatMessage(messages.not_rated_hint), children: /* @__PURE__ */ jsxs("div", { className: styles2.base(), children: [
|
|
26
|
+
showBadge && /* @__PURE__ */ jsx("div", { className: styles2.badge(), children: "\u2014" }),
|
|
27
|
+
showLabel && /* @__PURE__ */ jsx("span", { className: styles2.label(), children: levelLabel2 })
|
|
28
|
+
] }) });
|
|
29
|
+
}
|
|
30
|
+
const ratedValue = rating;
|
|
31
|
+
const level = getRiskLevelFromRating(ratedValue.rating);
|
|
32
|
+
const styles = riskRating({
|
|
33
|
+
size,
|
|
34
|
+
level
|
|
35
|
+
});
|
|
36
|
+
const levelLabelKey = `level_${level}`;
|
|
37
|
+
const levelLabel = intl.formatMessage(messages[levelLabelKey]);
|
|
38
|
+
return /* @__PURE__ */ jsx(
|
|
39
|
+
Tooltip,
|
|
40
|
+
{
|
|
41
|
+
content: /* @__PURE__ */ jsxs("div", { className: "text-xs space-y-1", children: [
|
|
42
|
+
/* @__PURE__ */ jsxs("div", { children: [
|
|
43
|
+
intl.formatMessage(messages.likelihood),
|
|
44
|
+
": ",
|
|
45
|
+
ratedValue.likelihood,
|
|
46
|
+
"/5"
|
|
47
|
+
] }),
|
|
48
|
+
/* @__PURE__ */ jsxs("div", { children: [
|
|
49
|
+
intl.formatMessage(messages.consequence),
|
|
50
|
+
": ",
|
|
51
|
+
ratedValue.consequence,
|
|
52
|
+
"/5"
|
|
53
|
+
] }),
|
|
54
|
+
ratedValue.comment && /* @__PURE__ */ jsx("div", { className: "text-muted-foreground", children: ratedValue.comment })
|
|
55
|
+
] }),
|
|
56
|
+
children: /* @__PURE__ */ jsxs("div", { className: styles.base(), children: [
|
|
57
|
+
showBadge && /* @__PURE__ */ jsx("div", { className: styles.badge(), children: ratedValue.rating }),
|
|
58
|
+
showLabel && /* @__PURE__ */ jsx("span", { className: styles.label(), children: levelLabel })
|
|
59
|
+
] })
|
|
60
|
+
}
|
|
61
|
+
);
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
export {
|
|
65
|
+
RiskRatingDisplay
|
|
66
|
+
};
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
|
|
3
|
+
// src/common/risk/messages.ts
|
|
4
|
+
import { defineMessages } from "@kopexa/i18n";
|
|
5
|
+
var messages = defineMessages({
|
|
6
|
+
level_unrated: {
|
|
7
|
+
id: "grc.risk.level.unrated",
|
|
8
|
+
defaultMessage: "Not rated"
|
|
9
|
+
},
|
|
10
|
+
level_low: {
|
|
11
|
+
id: "grc.risk.level.low",
|
|
12
|
+
defaultMessage: "Low"
|
|
13
|
+
},
|
|
14
|
+
level_medium: {
|
|
15
|
+
id: "grc.risk.level.medium",
|
|
16
|
+
defaultMessage: "Medium"
|
|
17
|
+
},
|
|
18
|
+
level_high: {
|
|
19
|
+
id: "grc.risk.level.high",
|
|
20
|
+
defaultMessage: "High"
|
|
21
|
+
},
|
|
22
|
+
level_critical: {
|
|
23
|
+
id: "grc.risk.level.critical",
|
|
24
|
+
defaultMessage: "Critical"
|
|
25
|
+
},
|
|
26
|
+
likelihood: {
|
|
27
|
+
id: "grc.risk.likelihood",
|
|
28
|
+
defaultMessage: "Likelihood"
|
|
29
|
+
},
|
|
30
|
+
consequence: {
|
|
31
|
+
id: "grc.risk.consequence",
|
|
32
|
+
defaultMessage: "Consequence"
|
|
33
|
+
},
|
|
34
|
+
rating: {
|
|
35
|
+
id: "grc.risk.rating",
|
|
36
|
+
defaultMessage: "Rating"
|
|
37
|
+
},
|
|
38
|
+
not_rated_hint: {
|
|
39
|
+
id: "grc.risk.not_rated_hint",
|
|
40
|
+
defaultMessage: "Risk has not been assessed yet"
|
|
41
|
+
}
|
|
42
|
+
});
|
|
43
|
+
|
|
44
|
+
export {
|
|
45
|
+
messages
|
|
46
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use client";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use client";
|
|
@@ -0,0 +1,118 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import {
|
|
3
|
+
messages
|
|
4
|
+
} from "./chunk-QS5S6V26.mjs";
|
|
5
|
+
|
|
6
|
+
// src/common/control/mapped-controls.tsx
|
|
7
|
+
import { useSafeIntl } from "@kopexa/i18n";
|
|
8
|
+
import { KRN } from "@kopexa/krn";
|
|
9
|
+
import { Popover, Tooltip } from "@kopexa/sight";
|
|
10
|
+
import { relatedControlChip } from "@kopexa/theme";
|
|
11
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
12
|
+
function formatControlKrn(krnString) {
|
|
13
|
+
const parsed = KRN.tryParse(krnString);
|
|
14
|
+
if (!parsed) {
|
|
15
|
+
return { framework: null, controlId: krnString, full: krnString };
|
|
16
|
+
}
|
|
17
|
+
const framework = parsed.tryResourceId("frameworks");
|
|
18
|
+
const control = parsed.tryResourceId("controls");
|
|
19
|
+
if (framework && control) {
|
|
20
|
+
return {
|
|
21
|
+
framework,
|
|
22
|
+
controlId: control,
|
|
23
|
+
full: `${framework}:${control}`
|
|
24
|
+
};
|
|
25
|
+
}
|
|
26
|
+
const basename = parsed.basename();
|
|
27
|
+
return {
|
|
28
|
+
framework: null,
|
|
29
|
+
controlId: basename || krnString,
|
|
30
|
+
full: basename || krnString
|
|
31
|
+
};
|
|
32
|
+
}
|
|
33
|
+
function ControlChip({
|
|
34
|
+
krn,
|
|
35
|
+
size = "md",
|
|
36
|
+
interactive = false,
|
|
37
|
+
onClick,
|
|
38
|
+
className
|
|
39
|
+
}) {
|
|
40
|
+
const styles = relatedControlChip({ size, interactive });
|
|
41
|
+
const { controlId, full } = formatControlKrn(krn);
|
|
42
|
+
const displayId = controlId.toUpperCase();
|
|
43
|
+
const content = /* @__PURE__ */ jsx("span", { className: styles.chipId(), children: displayId });
|
|
44
|
+
const chip = interactive && onClick ? /* @__PURE__ */ jsx(
|
|
45
|
+
"button",
|
|
46
|
+
{
|
|
47
|
+
type: "button",
|
|
48
|
+
className: styles.chip({ className }),
|
|
49
|
+
onClick,
|
|
50
|
+
children: content
|
|
51
|
+
}
|
|
52
|
+
) : /* @__PURE__ */ jsx("span", { className: styles.chip({ className }), children: content });
|
|
53
|
+
return /* @__PURE__ */ jsx(Tooltip, { content: full, children: chip });
|
|
54
|
+
}
|
|
55
|
+
function MappedControls({
|
|
56
|
+
controls,
|
|
57
|
+
maxVisible = 2,
|
|
58
|
+
size = "md",
|
|
59
|
+
interactive = false,
|
|
60
|
+
onControlClick,
|
|
61
|
+
showEmpty = false,
|
|
62
|
+
className,
|
|
63
|
+
...rest
|
|
64
|
+
}) {
|
|
65
|
+
const intl = useSafeIntl();
|
|
66
|
+
const styles = relatedControlChip({ size, interactive });
|
|
67
|
+
if (controls.length === 0) {
|
|
68
|
+
if (!showEmpty) return null;
|
|
69
|
+
return /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground", children: intl.formatMessage(messages.no_controls) });
|
|
70
|
+
}
|
|
71
|
+
const visibleControls = controls.slice(0, maxVisible);
|
|
72
|
+
const hiddenCount = controls.length - maxVisible;
|
|
73
|
+
return /* @__PURE__ */ jsxs("div", { className: styles.root({ className }), ...rest, children: [
|
|
74
|
+
visibleControls.map((krn) => /* @__PURE__ */ jsx(
|
|
75
|
+
ControlChip,
|
|
76
|
+
{
|
|
77
|
+
krn,
|
|
78
|
+
size,
|
|
79
|
+
interactive,
|
|
80
|
+
onClick: onControlClick ? () => onControlClick(krn) : void 0
|
|
81
|
+
},
|
|
82
|
+
krn
|
|
83
|
+
)),
|
|
84
|
+
hiddenCount > 0 && /* @__PURE__ */ jsxs(Popover.Root, { children: [
|
|
85
|
+
/* @__PURE__ */ jsx(Popover.Trigger, { className: styles.overflow(), children: intl.formatMessage(messages.more_controls, {
|
|
86
|
+
count: hiddenCount
|
|
87
|
+
}) }),
|
|
88
|
+
/* @__PURE__ */ jsxs(
|
|
89
|
+
Popover.Content,
|
|
90
|
+
{
|
|
91
|
+
align: "start",
|
|
92
|
+
className: "p-2 max-w-xs",
|
|
93
|
+
showArrow: false,
|
|
94
|
+
children: [
|
|
95
|
+
/* @__PURE__ */ jsx("div", { className: "text-xs font-medium text-muted-foreground mb-2", children: intl.formatMessage(messages.view_all, {
|
|
96
|
+
count: controls.length
|
|
97
|
+
}) }),
|
|
98
|
+
/* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-1", children: controls.map((krn) => /* @__PURE__ */ jsx(
|
|
99
|
+
ControlChip,
|
|
100
|
+
{
|
|
101
|
+
krn,
|
|
102
|
+
size,
|
|
103
|
+
interactive,
|
|
104
|
+
onClick: onControlClick ? () => onControlClick(krn) : void 0
|
|
105
|
+
},
|
|
106
|
+
krn
|
|
107
|
+
)) })
|
|
108
|
+
]
|
|
109
|
+
}
|
|
110
|
+
)
|
|
111
|
+
] })
|
|
112
|
+
] });
|
|
113
|
+
}
|
|
114
|
+
|
|
115
|
+
export {
|
|
116
|
+
ControlChip,
|
|
117
|
+
MappedControls
|
|
118
|
+
};
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
|
|
3
|
+
// src/common/control/messages.ts
|
|
4
|
+
import { defineMessages } from "@kopexa/i18n";
|
|
5
|
+
var messages = defineMessages({
|
|
6
|
+
more_controls: {
|
|
7
|
+
id: "grc.control.mapped.more",
|
|
8
|
+
defaultMessage: "+{count} more"
|
|
9
|
+
},
|
|
10
|
+
view_all: {
|
|
11
|
+
id: "grc.control.mapped.view_all",
|
|
12
|
+
defaultMessage: "View all {count} controls"
|
|
13
|
+
},
|
|
14
|
+
no_controls: {
|
|
15
|
+
id: "grc.control.mapped.no_controls",
|
|
16
|
+
defaultMessage: "No mapped controls"
|
|
17
|
+
}
|
|
18
|
+
});
|
|
19
|
+
|
|
20
|
+
export {
|
|
21
|
+
messages
|
|
22
|
+
};
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
|
|
3
|
+
// src/common/risk/types.ts
|
|
4
|
+
function getRiskLevelFromRating(rating) {
|
|
5
|
+
if (rating === 0) return "unrated";
|
|
6
|
+
if (rating <= 4) return "low";
|
|
7
|
+
if (rating <= 9) return "medium";
|
|
8
|
+
if (rating <= 16) return "high";
|
|
9
|
+
return "critical";
|
|
10
|
+
}
|
|
11
|
+
function isRatingUnrated(rating) {
|
|
12
|
+
if (!rating) return true;
|
|
13
|
+
return rating.rating === 0 || rating.likelihood === 0 || rating.consequence === 0;
|
|
14
|
+
}
|
|
15
|
+
var riskLevelConfig = {
|
|
16
|
+
unrated: {
|
|
17
|
+
label: "Nicht bewertet",
|
|
18
|
+
bgColor: "bg-muted",
|
|
19
|
+
textColor: "text-muted-foreground",
|
|
20
|
+
iconBgColor: "bg-muted/50",
|
|
21
|
+
iconTextColor: "text-muted-foreground"
|
|
22
|
+
},
|
|
23
|
+
low: {
|
|
24
|
+
label: "Niedrig",
|
|
25
|
+
bgColor: "bg-success",
|
|
26
|
+
textColor: "text-success",
|
|
27
|
+
iconBgColor: "bg-success/10",
|
|
28
|
+
iconTextColor: "text-success"
|
|
29
|
+
},
|
|
30
|
+
medium: {
|
|
31
|
+
label: "Mittel",
|
|
32
|
+
bgColor: "bg-warning",
|
|
33
|
+
textColor: "text-warning",
|
|
34
|
+
iconBgColor: "bg-warning/10",
|
|
35
|
+
iconTextColor: "text-warning"
|
|
36
|
+
},
|
|
37
|
+
high: {
|
|
38
|
+
label: "Hoch",
|
|
39
|
+
bgColor: "bg-orange-500",
|
|
40
|
+
textColor: "text-orange-500",
|
|
41
|
+
iconBgColor: "bg-orange-500/10",
|
|
42
|
+
iconTextColor: "text-orange-500"
|
|
43
|
+
},
|
|
44
|
+
critical: {
|
|
45
|
+
label: "Kritisch",
|
|
46
|
+
bgColor: "bg-destructive",
|
|
47
|
+
textColor: "text-destructive",
|
|
48
|
+
iconBgColor: "bg-destructive/10",
|
|
49
|
+
iconTextColor: "text-destructive"
|
|
50
|
+
}
|
|
51
|
+
};
|
|
52
|
+
|
|
53
|
+
export {
|
|
54
|
+
getRiskLevelFromRating,
|
|
55
|
+
isRatingUnrated,
|
|
56
|
+
riskLevelConfig
|
|
57
|
+
};
|
|
@@ -0,0 +1,160 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
"use strict";
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __export = (target, all) => {
|
|
8
|
+
for (var name in all)
|
|
9
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
10
|
+
};
|
|
11
|
+
var __copyProps = (to, from, except, desc) => {
|
|
12
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
13
|
+
for (let key of __getOwnPropNames(from))
|
|
14
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
15
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
16
|
+
}
|
|
17
|
+
return to;
|
|
18
|
+
};
|
|
19
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
20
|
+
|
|
21
|
+
// src/common/control/index.ts
|
|
22
|
+
var control_exports = {};
|
|
23
|
+
__export(control_exports, {
|
|
24
|
+
ControlChip: () => ControlChip,
|
|
25
|
+
MappedControls: () => MappedControls
|
|
26
|
+
});
|
|
27
|
+
module.exports = __toCommonJS(control_exports);
|
|
28
|
+
|
|
29
|
+
// src/common/control/mapped-controls.tsx
|
|
30
|
+
var import_i18n2 = require("@kopexa/i18n");
|
|
31
|
+
var import_krn = require("@kopexa/krn");
|
|
32
|
+
var import_sight = require("@kopexa/sight");
|
|
33
|
+
var import_theme = require("@kopexa/theme");
|
|
34
|
+
|
|
35
|
+
// src/common/control/messages.ts
|
|
36
|
+
var import_i18n = require("@kopexa/i18n");
|
|
37
|
+
var messages = (0, import_i18n.defineMessages)({
|
|
38
|
+
more_controls: {
|
|
39
|
+
id: "grc.control.mapped.more",
|
|
40
|
+
defaultMessage: "+{count} more"
|
|
41
|
+
},
|
|
42
|
+
view_all: {
|
|
43
|
+
id: "grc.control.mapped.view_all",
|
|
44
|
+
defaultMessage: "View all {count} controls"
|
|
45
|
+
},
|
|
46
|
+
no_controls: {
|
|
47
|
+
id: "grc.control.mapped.no_controls",
|
|
48
|
+
defaultMessage: "No mapped controls"
|
|
49
|
+
}
|
|
50
|
+
});
|
|
51
|
+
|
|
52
|
+
// src/common/control/mapped-controls.tsx
|
|
53
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
54
|
+
function formatControlKrn(krnString) {
|
|
55
|
+
const parsed = import_krn.KRN.tryParse(krnString);
|
|
56
|
+
if (!parsed) {
|
|
57
|
+
return { framework: null, controlId: krnString, full: krnString };
|
|
58
|
+
}
|
|
59
|
+
const framework = parsed.tryResourceId("frameworks");
|
|
60
|
+
const control = parsed.tryResourceId("controls");
|
|
61
|
+
if (framework && control) {
|
|
62
|
+
return {
|
|
63
|
+
framework,
|
|
64
|
+
controlId: control,
|
|
65
|
+
full: `${framework}:${control}`
|
|
66
|
+
};
|
|
67
|
+
}
|
|
68
|
+
const basename = parsed.basename();
|
|
69
|
+
return {
|
|
70
|
+
framework: null,
|
|
71
|
+
controlId: basename || krnString,
|
|
72
|
+
full: basename || krnString
|
|
73
|
+
};
|
|
74
|
+
}
|
|
75
|
+
function ControlChip({
|
|
76
|
+
krn,
|
|
77
|
+
size = "md",
|
|
78
|
+
interactive = false,
|
|
79
|
+
onClick,
|
|
80
|
+
className
|
|
81
|
+
}) {
|
|
82
|
+
const styles = (0, import_theme.relatedControlChip)({ size, interactive });
|
|
83
|
+
const { controlId, full } = formatControlKrn(krn);
|
|
84
|
+
const displayId = controlId.toUpperCase();
|
|
85
|
+
const content = /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: styles.chipId(), children: displayId });
|
|
86
|
+
const chip = interactive && onClick ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
87
|
+
"button",
|
|
88
|
+
{
|
|
89
|
+
type: "button",
|
|
90
|
+
className: styles.chip({ className }),
|
|
91
|
+
onClick,
|
|
92
|
+
children: content
|
|
93
|
+
}
|
|
94
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: styles.chip({ className }), children: content });
|
|
95
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_sight.Tooltip, { content: full, children: chip });
|
|
96
|
+
}
|
|
97
|
+
function MappedControls({
|
|
98
|
+
controls,
|
|
99
|
+
maxVisible = 2,
|
|
100
|
+
size = "md",
|
|
101
|
+
interactive = false,
|
|
102
|
+
onControlClick,
|
|
103
|
+
showEmpty = false,
|
|
104
|
+
className,
|
|
105
|
+
...rest
|
|
106
|
+
}) {
|
|
107
|
+
const intl = (0, import_i18n2.useSafeIntl)();
|
|
108
|
+
const styles = (0, import_theme.relatedControlChip)({ size, interactive });
|
|
109
|
+
if (controls.length === 0) {
|
|
110
|
+
if (!showEmpty) return null;
|
|
111
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-xs text-muted-foreground", children: intl.formatMessage(messages.no_controls) });
|
|
112
|
+
}
|
|
113
|
+
const visibleControls = controls.slice(0, maxVisible);
|
|
114
|
+
const hiddenCount = controls.length - maxVisible;
|
|
115
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: styles.root({ className }), ...rest, children: [
|
|
116
|
+
visibleControls.map((krn) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
117
|
+
ControlChip,
|
|
118
|
+
{
|
|
119
|
+
krn,
|
|
120
|
+
size,
|
|
121
|
+
interactive,
|
|
122
|
+
onClick: onControlClick ? () => onControlClick(krn) : void 0
|
|
123
|
+
},
|
|
124
|
+
krn
|
|
125
|
+
)),
|
|
126
|
+
hiddenCount > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_sight.Popover.Root, { children: [
|
|
127
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_sight.Popover.Trigger, { className: styles.overflow(), children: intl.formatMessage(messages.more_controls, {
|
|
128
|
+
count: hiddenCount
|
|
129
|
+
}) }),
|
|
130
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
131
|
+
import_sight.Popover.Content,
|
|
132
|
+
{
|
|
133
|
+
align: "start",
|
|
134
|
+
className: "p-2 max-w-xs",
|
|
135
|
+
showArrow: false,
|
|
136
|
+
children: [
|
|
137
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "text-xs font-medium text-muted-foreground mb-2", children: intl.formatMessage(messages.view_all, {
|
|
138
|
+
count: controls.length
|
|
139
|
+
}) }),
|
|
140
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex flex-wrap gap-1", children: controls.map((krn) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
141
|
+
ControlChip,
|
|
142
|
+
{
|
|
143
|
+
krn,
|
|
144
|
+
size,
|
|
145
|
+
interactive,
|
|
146
|
+
onClick: onControlClick ? () => onControlClick(krn) : void 0
|
|
147
|
+
},
|
|
148
|
+
krn
|
|
149
|
+
)) })
|
|
150
|
+
]
|
|
151
|
+
}
|
|
152
|
+
)
|
|
153
|
+
] })
|
|
154
|
+
] });
|
|
155
|
+
}
|
|
156
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
157
|
+
0 && (module.exports = {
|
|
158
|
+
ControlChip,
|
|
159
|
+
MappedControls
|
|
160
|
+
});
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import { ComponentProps } from 'react';
|
|
3
|
+
|
|
4
|
+
interface MappedControlsProps extends ComponentProps<"div"> {
|
|
5
|
+
/** Array of control KRN strings */
|
|
6
|
+
controls: string[];
|
|
7
|
+
/** Maximum number of chips to display before showing overflow */
|
|
8
|
+
maxVisible?: number;
|
|
9
|
+
/** Size variant */
|
|
10
|
+
size?: "sm" | "md" | "lg";
|
|
11
|
+
/** Make chips interactive (clickable) */
|
|
12
|
+
interactive?: boolean;
|
|
13
|
+
/** Callback when a control chip is clicked */
|
|
14
|
+
onControlClick?: (krn: string) => void;
|
|
15
|
+
/** Show empty state when no controls */
|
|
16
|
+
showEmpty?: boolean;
|
|
17
|
+
}
|
|
18
|
+
interface ControlChipProps {
|
|
19
|
+
/** The KRN string */
|
|
20
|
+
krn: string;
|
|
21
|
+
/** Size variant */
|
|
22
|
+
size?: "sm" | "md" | "lg";
|
|
23
|
+
/** Make chip interactive */
|
|
24
|
+
interactive?: boolean;
|
|
25
|
+
/** Click handler */
|
|
26
|
+
onClick?: () => void;
|
|
27
|
+
/** Additional class names */
|
|
28
|
+
className?: string;
|
|
29
|
+
}
|
|
30
|
+
declare function ControlChip({ krn, size, interactive, onClick, className, }: ControlChipProps): react_jsx_runtime.JSX.Element;
|
|
31
|
+
declare function MappedControls({ controls, maxVisible, size, interactive, onControlClick, showEmpty, className, ...rest }: MappedControlsProps): react_jsx_runtime.JSX.Element | null;
|
|
32
|
+
|
|
33
|
+
export { ControlChip, type ControlChipProps, MappedControls, type MappedControlsProps };
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import { ComponentProps } from 'react';
|
|
3
|
+
|
|
4
|
+
interface MappedControlsProps extends ComponentProps<"div"> {
|
|
5
|
+
/** Array of control KRN strings */
|
|
6
|
+
controls: string[];
|
|
7
|
+
/** Maximum number of chips to display before showing overflow */
|
|
8
|
+
maxVisible?: number;
|
|
9
|
+
/** Size variant */
|
|
10
|
+
size?: "sm" | "md" | "lg";
|
|
11
|
+
/** Make chips interactive (clickable) */
|
|
12
|
+
interactive?: boolean;
|
|
13
|
+
/** Callback when a control chip is clicked */
|
|
14
|
+
onControlClick?: (krn: string) => void;
|
|
15
|
+
/** Show empty state when no controls */
|
|
16
|
+
showEmpty?: boolean;
|
|
17
|
+
}
|
|
18
|
+
interface ControlChipProps {
|
|
19
|
+
/** The KRN string */
|
|
20
|
+
krn: string;
|
|
21
|
+
/** Size variant */
|
|
22
|
+
size?: "sm" | "md" | "lg";
|
|
23
|
+
/** Make chip interactive */
|
|
24
|
+
interactive?: boolean;
|
|
25
|
+
/** Click handler */
|
|
26
|
+
onClick?: () => void;
|
|
27
|
+
/** Additional class names */
|
|
28
|
+
className?: string;
|
|
29
|
+
}
|
|
30
|
+
declare function ControlChip({ krn, size, interactive, onClick, className, }: ControlChipProps): react_jsx_runtime.JSX.Element;
|
|
31
|
+
declare function MappedControls({ controls, maxVisible, size, interactive, onControlClick, showEmpty, className, ...rest }: MappedControlsProps): react_jsx_runtime.JSX.Element | null;
|
|
32
|
+
|
|
33
|
+
export { ControlChip, type ControlChipProps, MappedControls, type MappedControlsProps };
|