@plumile/ui 0.1.168 → 0.1.170

package/lib/esm/admin/organisms/admin_topbar/adminTopbar.css.js

@@ -4,7 +4,6 @@
 /* empty css                                        */
 /* empty css                                            */
 /* empty css                                  */
-/* empty css                                          */
 /* empty css                                         */
 /* empty css                           */
 //#region src/admin/organisms/admin_topbar/adminTopbar.css.ts

package/lib/esm/atomic/atoms/badge/badge.css.js

@@ -1,4 +1,5 @@
 /* empty css                                      */
+/* empty css                                          */
 /* empty css                     */
 import { createRuntimeFn as e } from "@vanilla-extract/recipes/createRuntimeFn";
 //#region src/atomic/atoms/badge/badge.css.ts

package/lib/esm/atomic/molecules/markdown/components/MarkdownArticleContainer.css.js

@@ -1,5 +1,4 @@
 /* empty css                                         */
-/* empty css                             */
 /* empty css                                        */
 //#region src/atomic/molecules/markdown/components/MarkdownArticleContainer.css.ts
 var e = "_7ez1431 _7ez1430 txvbqbfpn txvbqbh4x txvbqbheb";

package/lib/esm/atomic/molecules/markdown/components/MarkdownTable.css.js

@@ -1,5 +1,6 @@
 /* empty css                                         */
 /* empty css                             */
+/* empty css                             */
 //#region src/atomic/molecules/markdown/components/MarkdownTable.css.ts
 var e = "tr18yy0 txvbqb1b7z txvbqb1cw txvbqb2uc txvbqb2sj txvbqb28o txvbqbp6w txvbqbwr6 txvbqbwu2", t = "tr18yy2 tr18yy1 txvbqbdhu txvbqbcjw txvbqbvow txvbqb19uf";
 //#endregion

package/lib/esm/components/dashboard/dashboard_operational/DashboardBreakdownList.js

@@ -0,0 +1,21 @@
+import { DashboardItemList as e } from "./DashboardItemList.js";
+import { DashboardToneBadge as t } from "./DashboardToneBadge.js";
+import { jsx as n } from "react/jsx-runtime";
+//#region src/components/dashboard/dashboard_operational/DashboardBreakdownList.tsx
+var r = ({ emptyState: r = null, items: i }) => /* @__PURE__ */ n(e, {
+	emptyState: r,
+	items: i.map((e) => {
+		let r;
+		return e.tone != null && (r = /* @__PURE__ */ n(t, {
+			tone: e.tone,
+			children: e.tone
+		})), {
+			...e,
+			beforeValue: r
+		};
+	})
+});
+//#endregion
+export { r as DashboardBreakdownList, r as default };
+
+//# sourceMappingURL=DashboardBreakdownList.js.map

package/lib/esm/components/dashboard/dashboard_operational/DashboardBreakdownList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DashboardBreakdownList.js","names":[],"sources":["../../../../../src/components/dashboard/dashboard_operational/DashboardBreakdownList.tsx"],"sourcesContent":["import type { JSX, ReactNode } from 'react';\n\nimport { DashboardItemList } from './DashboardItemList.js';\nimport { DashboardToneBadge } from './DashboardToneBadge.js';\nimport type { DashboardOperationalTone } from './types.js';\n\nexport type DashboardBreakdownListItem = {\n  id: string;\n  label: ReactNode;\n  value: ReactNode;\n  meta?: ReactNode;\n  tone?: DashboardOperationalTone;\n  href?: string;\n};\n\nexport type DashboardBreakdownListProps = {\n  items: readonly DashboardBreakdownListItem[];\n  emptyState?: ReactNode;\n};\n\nexport const DashboardBreakdownList = ({\n  emptyState = null,\n  items,\n}: DashboardBreakdownListProps): JSX.Element => {\n  return (\n    <DashboardItemList\n      emptyState={emptyState}\n      items={items.map((item) => {\n        let beforeValue: ReactNode;\n        if (item.tone != null) {\n          beforeValue = (\n            <DashboardToneBadge tone={item.tone}>\n              {item.tone}\n            </DashboardToneBadge>\n          );\n        }\n\n        return {\n          ...item,\n          beforeValue,\n        };\n      })}\n    />\n  );\n};\n\nexport default DashboardBreakdownList;\n"],"mappings":";;;;AAoBA,IAAa,KAA0B,EACrC,gBAAa,MACb,eAGE,kBAAC,GAAD;CACc;CACZ,OAAO,EAAM,KAAK,MAAS;EACzB,IAAI;EASJ,OARI,EAAK,QAAQ,SACf,IACE,kBAAC,GAAD;GAAoB,MAAM,EAAK;aAC5B,EAAK;EACY,CAAA,IAIjB;GACL,GAAG;GACH;EACF;CACF,CAAC;AACF,CAAA"}

package/lib/esm/components/dashboard/dashboard_operational/DashboardEntitySpotlight.css.js

@@ -0,0 +1,8 @@
+/* empty css                                      */
+/* empty css                                        */
+//#region src/components/dashboard/dashboard_operational/DashboardEntitySpotlight.css.ts
+var e = "gjsfju0 txvbqbfpn txvbqbh4x txvbqbhdy", t = "gjsfju1 txvbqb1bg3 txvbqb9j txvbqbhb2", n = "gjsfju2 txvbqb1bg1 txvbqbam txvbqbhbf txvbqbo4z txvbqbws9", r = "gjsfju3", i = "gjsfju4 txvbqbfpn txvbqbh4x txvbqbhd8", a = "gjsfju5 txvbqb1bg5 txvbqb96", o = "gjsfju6 txvbqb1bg1 txvbqb9j txvbqbhb2";
+//#endregion
+export { t as label, r as meta, i as metaItem, a as metaLabel, o as metaValue, e as root, n as title };
+
+//# sourceMappingURL=DashboardEntitySpotlight.css.js.map

package/lib/esm/components/dashboard/dashboard_operational/DashboardEntitySpotlight.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DashboardEntitySpotlight.css.js","names":[],"sources":["../../../../../src/components/dashboard/dashboard_operational/DashboardEntitySpotlight.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\n\nimport { sprinkles } from '../../../theme/sprinkles.css.js';\n\nexport const root = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 3,\n});\n\nexport const label = sprinkles({\n  color: 'textSecondary',\n  fontSize: 'sm',\n  fontWeight: 'medium',\n});\n\nexport const title = sprinkles({\n  color: 'text',\n  fontSize: 'xl',\n  fontWeight: 'semibold',\n  lineHeight: 'tight',\n  overflowWrap: 'anywhere',\n});\n\nexport const meta = style({\n  display: 'grid',\n  gap: '0.5rem',\n  gridTemplateColumns: 'repeat(auto-fit, minmax(7rem, 1fr))',\n});\n\nexport const metaItem = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 1,\n});\n\nexport const metaLabel = sprinkles({\n  color: 'textMuted',\n  fontSize: 'xs',\n});\n\nexport const metaValue = sprinkles({\n  color: 'text',\n  fontSize: 'sm',\n  fontWeight: 'medium',\n});\n"],"mappings":""}

package/lib/esm/components/dashboard/dashboard_operational/DashboardEntitySpotlight.js

@@ -0,0 +1,43 @@
+import { PanelShell as e } from "../../layout/PanelShell.js";
+import { DashboardLinkedSurface as t } from "./DashboardLinkedSurface.js";
+import { DashboardToneBadge as n } from "./DashboardToneBadge.js";
+import { label as r, root as i, title as a } from "./DashboardEntitySpotlight.css.js";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+//#region src/components/dashboard/dashboard_operational/DashboardEntitySpotlight.tsx
+var c = ({ href: c, label: l, meta: u = [], title: d, tone: f }) => /* @__PURE__ */ o(t, {
+	href: c,
+	children: /* @__PURE__ */ o(e, { children: /* @__PURE__ */ s("div", {
+		className: i,
+		children: [
+			/* @__PURE__ */ o("span", {
+				className: r,
+				children: l
+			}),
+			/* @__PURE__ */ o("strong", {
+				className: a,
+				children: d
+			}),
+			f != null && /* @__PURE__ */ o(n, {
+				tone: f,
+				children: f
+			}),
+			u.length > 0 && /* @__PURE__ */ o("dl", {
+				className: "gjsfju3",
+				children: u.map((e) => /* @__PURE__ */ s("div", {
+					className: "gjsfju4 txvbqbfpn txvbqbh4x txvbqbhd8",
+					children: [/* @__PURE__ */ o("dt", {
+						className: "gjsfju5 txvbqb1bg5 txvbqb96",
+						children: e.label
+					}), /* @__PURE__ */ o("dd", {
+						className: "gjsfju6 txvbqb1bg1 txvbqb9j txvbqbhb2",
+						children: e.value
+					})]
+				}, e.id))
+			})
+		]
+	}) })
+});
+//#endregion
+export { c as DashboardEntitySpotlight, c as default };
+
+//# sourceMappingURL=DashboardEntitySpotlight.js.map

package/lib/esm/components/dashboard/dashboard_operational/DashboardEntitySpotlight.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DashboardEntitySpotlight.js","names":[],"sources":["../../../../../src/components/dashboard/dashboard_operational/DashboardEntitySpotlight.tsx"],"sourcesContent":["import type { JSX, ReactNode } from 'react';\n\nimport { PanelShell } from '../../layout/PanelShell.js';\nimport { DashboardLinkedSurface } from './DashboardLinkedSurface.js';\nimport { DashboardToneBadge } from './DashboardToneBadge.js';\nimport type { DashboardOperationalTone } from './types.js';\nimport * as styles from './DashboardEntitySpotlight.css.js';\n\nexport type DashboardEntitySpotlightMetaItem = {\n  id: string;\n  label: ReactNode;\n  value: ReactNode;\n};\n\nexport type DashboardEntitySpotlightProps = {\n  label: ReactNode;\n  title: ReactNode;\n  href?: string;\n  tone?: DashboardOperationalTone;\n  meta?: readonly DashboardEntitySpotlightMetaItem[];\n};\n\nexport const DashboardEntitySpotlight = ({\n  href,\n  label,\n  meta = [],\n  title,\n  tone,\n}: DashboardEntitySpotlightProps): JSX.Element => {\n  return (\n    <DashboardLinkedSurface href={href}>\n      <PanelShell>\n        <div className={styles.root}>\n          <span className={styles.label}>{label}</span>\n          <strong className={styles.title}>{title}</strong>\n          {tone != null && (\n            <DashboardToneBadge tone={tone}>{tone}</DashboardToneBadge>\n          )}\n          {meta.length > 0 && (\n            <dl className={styles.meta}>\n              {meta.map((item) => {\n                return (\n                  <div key={item.id} className={styles.metaItem}>\n                    <dt className={styles.metaLabel}>{item.label}</dt>\n                    <dd className={styles.metaValue}>{item.value}</dd>\n                  </div>\n                );\n              })}\n            </dl>\n          )}\n        </div>\n      </PanelShell>\n    </DashboardLinkedSurface>\n  );\n};\n\nexport default DashboardEntitySpotlight;\n"],"mappings":";;;;;;AAsBA,IAAa,KAA4B,EACvC,SACA,OAAA,GACA,MAAA,IAAO,CAAC,GACR,OAAA,GACA,cAGE,kBAAC,GAAD;CAA8B;WAC5B,kBAAC,GAAD,EAAA,UACE,kBAAC,OAAD;EAAK,WAAW;YAAhB;GACE,kBAAC,QAAD;IAAM,WAAW;cAAe;GAAY,CAAA;GAC5C,kBAAC,UAAD;IAAQ,WAAW;cAAe;GAAc,CAAA;GAC/C,KAAQ,QACP,kBAAC,GAAD;IAA0B;cAAO;GAAyB,CAAA;GAE3D,EAAK,SAAS,KACb,kBAAC,MAAD;IAAI,WAAW;cACZ,EAAK,KAAK,MAEP,kBAAC,OAAD;KAAmB,WAAW;eAA9B,CACE,kBAAC,MAAD;MAAI,WAAW;gBAAmB,EAAK;KAAU,CAAA,GACjD,kBAAC,MAAD;MAAI,WAAW;gBAAmB,EAAK;KAAU,CAAA,CAC9C;OAHK,EAAK,EAGV,CAER;GACC,CAAA;EAEH;IACK,CAAA;AACU,CAAA"}

package/lib/esm/components/dashboard/dashboard_operational/DashboardHealthMatrix.css.js

@@ -0,0 +1,8 @@
+/* empty css                                      */
+/* empty css                                     */
+//#region src/components/dashboard/dashboard_operational/DashboardHealthMatrix.css.ts
+var e = "_5299xu0 txvbqbfpn txvbqbh4x txvbqbhdl", t = "_5299xu2 _5299xu1 txvbqbey txvbqb1d9 txvbqb2uc txvbqb2sj txvbqb1u8 txvbqbfq0 txvbqbhdy txvbqbwwl", n = "_5299xu3 txvbqb1bg1 txvbqb9j txvbqbhbf txvbqbv7x txvbqbwr6 txvbqb18ef txvbqb1avz", r = "_5299xu4 txvbqbey txvbqbfpn txvbqbh7g txvbqbhdl txvbqbv7x", i = "_5299xu5 txvbqbey txvbqbfqq txvbqbhdl", a = "_5299xu6 txvbqb1bg1 txvbqb9j txvbqbhb2";
+//#endregion
+export { i as cell, a as cellValue, r as cells, e as matrix, t as row, n as rowLabel };
+
+//# sourceMappingURL=DashboardHealthMatrix.css.js.map

package/lib/esm/components/dashboard/dashboard_operational/DashboardHealthMatrix.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DashboardHealthMatrix.css.js","names":[],"sources":["../../../../../src/components/dashboard/dashboard_operational/DashboardHealthMatrix.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\n\nimport { sprinkles } from '../../../theme/sprinkles.css.js';\n\nexport const matrix = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 2,\n});\n\nexport const row = style([\n  sprinkles({\n    alignItems: 'center',\n    borderColor: 'borderSubtle',\n    borderRadius: 'lg',\n    borderStyle: 'solid',\n    borderWidth: 1,\n    display: 'grid',\n    gap: 3,\n    padding: 3,\n  }),\n  {\n    gridTemplateColumns: 'minmax(9rem, 0.8fr) minmax(0, 2fr)',\n  },\n]);\n\nexport const rowLabel = sprinkles({\n  color: 'text',\n  fontSize: 'sm',\n  fontWeight: 'semibold',\n  minWidth: 0,\n  overflow: 'hidden',\n  textOverflow: 'ellipsis',\n  whiteSpace: 'nowrap',\n});\n\nexport const cells = sprinkles({\n  alignItems: 'center',\n  display: 'flex',\n  flexWrap: 'wrap',\n  gap: 2,\n  minWidth: 0,\n});\n\nexport const cell = sprinkles({\n  alignItems: 'center',\n  display: 'inline-flex',\n  gap: 2,\n});\n\nexport const cellValue = sprinkles({\n  color: 'text',\n  fontSize: 'sm',\n  fontWeight: 'medium',\n});\n"],"mappings":""}

package/lib/esm/components/dashboard/dashboard_operational/DashboardHealthMatrix.js

@@ -0,0 +1,34 @@
+import { DashboardLinkedSurface as e } from "./DashboardLinkedSurface.js";
+import { DashboardToneBadge as t } from "./DashboardToneBadge.js";
+import { cell as n, cellValue as r, cells as i, matrix as a, row as o, rowLabel as s } from "./DashboardHealthMatrix.css.js";
+import { Fragment as c, jsx as l, jsxs as u } from "react/jsx-runtime";
+//#region src/components/dashboard/dashboard_operational/DashboardHealthMatrix.tsx
+var d = ({ emptyState: d = null, rows: f }) => f.length === 0 ? /* @__PURE__ */ l(c, { children: d }) : /* @__PURE__ */ l("div", {
+	className: a,
+	children: f.map((a) => /* @__PURE__ */ u("div", {
+		className: o,
+		children: [/* @__PURE__ */ l("span", {
+			className: s,
+			children: a.label
+		}), /* @__PURE__ */ l("div", {
+			className: i,
+			children: a.cells.map((i) => /* @__PURE__ */ l(e, {
+				href: i.href,
+				children: /* @__PURE__ */ u("span", {
+					className: n,
+					children: [/* @__PURE__ */ l(t, {
+						tone: i.tone,
+						children: i.label
+					}), /* @__PURE__ */ l("span", {
+						className: r,
+						children: i.value
+					})]
+				})
+			}, i.id))
+		})]
+	}, a.id))
+});
+//#endregion
+export { d as DashboardHealthMatrix, d as default };
+
+//# sourceMappingURL=DashboardHealthMatrix.js.map

package/lib/esm/components/dashboard/dashboard_operational/DashboardHealthMatrix.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DashboardHealthMatrix.js","names":[],"sources":["../../../../../src/components/dashboard/dashboard_operational/DashboardHealthMatrix.tsx"],"sourcesContent":["import type { JSX, ReactNode } from 'react';\n\nimport { DashboardLinkedSurface } from './DashboardLinkedSurface.js';\nimport { DashboardToneBadge } from './DashboardToneBadge.js';\nimport type { DashboardOperationalTone } from './types.js';\nimport * as styles from './DashboardHealthMatrix.css.js';\n\nexport type DashboardHealthMatrixCell = {\n  id: string;\n  label: ReactNode;\n  value: ReactNode;\n  tone?: DashboardOperationalTone;\n  href?: string;\n};\n\nexport type DashboardHealthMatrixRow = {\n  id: string;\n  label: ReactNode;\n  cells: readonly DashboardHealthMatrixCell[];\n};\n\nexport type DashboardHealthMatrixProps = {\n  rows: readonly DashboardHealthMatrixRow[];\n  emptyState?: ReactNode;\n};\n\nexport const DashboardHealthMatrix = ({\n  emptyState = null,\n  rows,\n}: DashboardHealthMatrixProps): JSX.Element => {\n  if (rows.length === 0) {\n    return <>{emptyState}</>;\n  }\n\n  return (\n    <div className={styles.matrix}>\n      {rows.map((row) => {\n        return (\n          <div key={row.id} className={styles.row}>\n            <span className={styles.rowLabel}>{row.label}</span>\n            <div className={styles.cells}>\n              {row.cells.map((cell) => {\n                return (\n                  <DashboardLinkedSurface key={cell.id} href={cell.href}>\n                    <span className={styles.cell}>\n                      <DashboardToneBadge tone={cell.tone}>\n                        {cell.label}\n                      </DashboardToneBadge>\n                      <span className={styles.cellValue}>{cell.value}</span>\n                    </span>\n                  </DashboardLinkedSurface>\n                );\n              })}\n            </div>\n          </div>\n        );\n      })}\n    </div>\n  );\n};\n\nexport default DashboardHealthMatrix;\n"],"mappings":";;;;;AA0BA,IAAa,KAAyB,EACpC,gBAAa,MACb,cAEI,EAAK,WAAW,IACX,kBAAA,GAAA,EAAA,UAAG,EAAa,CAAA,IAIvB,kBAAC,OAAD;CAAK,WAAW;WACb,EAAK,KAAK,MAEP,kBAAC,OAAD;EAAkB,WAAW;YAA7B,CACE,kBAAC,QAAD;GAAM,WAAW;aAAkB,EAAI;EAAY,CAAA,GACnD,kBAAC,OAAD;GAAK,WAAW;aACb,EAAI,MAAM,KAAK,MAEZ,kBAAC,GAAD;IAAsC,MAAM,EAAK;cAC/C,kBAAC,QAAD;KAAM,WAAW;eAAjB,CACE,kBAAC,GAAD;MAAoB,MAAM,EAAK;gBAC5B,EAAK;KACY,CAAA,GACpB,kBAAC,QAAD;MAAM,WAAW;gBAAmB,EAAK;KAAY,CAAA,CACjD;;GACgB,GAPK,EAAK,EAOV,CAE3B;EACE,CAAA,CACF;IAhBK,EAAI,EAgBT,CAER;AACE,CAAA"}

package/lib/esm/components/dashboard/dashboard_operational/DashboardItemList.css.js

@@ -0,0 +1,8 @@
+/* empty css                                      */
+/* empty css                                 */
+//#region src/components/dashboard/dashboard_operational/DashboardItemList.css.ts
+var e = "asgse30 txvbqbfpn txvbqbh4x txvbqbhdl", t = "asgse32 asgse31 txvbqbey txvbqb1d9 txvbqb2uc txvbqb2sj txvbqb1u8 txvbqbfq0 txvbqbhdy txvbqbwwl", n = "asgse33 txvbqbfpn txvbqbh4x txvbqbhd8 txvbqbv7x", r = "asgse34 txvbqb1bg1 txvbqb9j txvbqbhb2 txvbqbwr6 txvbqb18ef txvbqb1avz", i = "asgse35 txvbqb1bg5 txvbqb96 txvbqbwr6 txvbqb18ef txvbqb1avz", a = "asgse36 txvbqb1bg1 txvbqb9j txvbqbhbf txvbqb1avz", o = "asgse37";
+//#endregion
+export { o as empty, t as item, r as label, e as list, n as main, i as meta, a as value };
+
+//# sourceMappingURL=DashboardItemList.css.js.map

package/lib/esm/components/dashboard/dashboard_operational/DashboardItemList.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DashboardItemList.css.js","names":[],"sources":["../../../../../src/components/dashboard/dashboard_operational/DashboardItemList.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\n\nimport { sprinkles } from '../../../theme/sprinkles.css.js';\nimport { vars } from '../../../theme/themeContract.css.js';\n\nexport const list = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 2,\n});\n\nexport const item = style([\n  sprinkles({\n    alignItems: 'center',\n    borderColor: 'borderSubtle',\n    borderRadius: 'lg',\n    borderStyle: 'solid',\n    borderWidth: 1,\n    display: 'grid',\n    gap: 3,\n    padding: 3,\n  }),\n  {\n    gridTemplateColumns: 'minmax(0, 1fr) auto',\n  },\n]);\n\nexport const main = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 1,\n  minWidth: 0,\n});\n\nexport const label = sprinkles({\n  color: 'text',\n  fontSize: 'sm',\n  fontWeight: 'medium',\n  overflow: 'hidden',\n  textOverflow: 'ellipsis',\n  whiteSpace: 'nowrap',\n});\n\nexport const meta = sprinkles({\n  color: 'textMuted',\n  fontSize: 'xs',\n  overflow: 'hidden',\n  textOverflow: 'ellipsis',\n  whiteSpace: 'nowrap',\n});\n\nexport const value = sprinkles({\n  color: 'text',\n  fontSize: 'sm',\n  fontWeight: 'semibold',\n  whiteSpace: 'nowrap',\n});\n\nexport const empty = style({\n  color: vars.colors.textMuted,\n  fontSize: vars.fontSize.sm,\n});\n"],"mappings":""}

package/lib/esm/components/dashboard/dashboard_operational/DashboardItemList.js

@@ -0,0 +1,30 @@
+import { DashboardLinkedSurface as e } from "./DashboardLinkedSurface.js";
+import { item as t, label as n, list as r, main as i, value as a } from "./DashboardItemList.css.js";
+import { Fragment as o, jsx as s, jsxs as c } from "react/jsx-runtime";
+//#region src/components/dashboard/dashboard_operational/DashboardItemList.tsx
+var l = ({ emptyState: l = null, items: u }) => u.length === 0 ? /* @__PURE__ */ s(o, { children: l }) : /* @__PURE__ */ s("div", {
+	className: r,
+	children: u.map((r) => /* @__PURE__ */ s(e, {
+		href: r.href,
+		children: /* @__PURE__ */ c("div", {
+			className: t,
+			children: [/* @__PURE__ */ c("div", {
+				className: i,
+				children: [/* @__PURE__ */ s("span", {
+					className: n,
+					children: r.label
+				}), r.meta != null && /* @__PURE__ */ s("span", {
+					className: "asgse35 txvbqb1bg5 txvbqb96 txvbqbwr6 txvbqb18ef txvbqb1avz",
+					children: r.meta
+				})]
+			}), /* @__PURE__ */ c("span", {
+				className: a,
+				children: [r.beforeValue, r.value]
+			})]
+		})
+	}, r.id))
+});
+//#endregion
+export { l as DashboardItemList, l as default };
+
+//# sourceMappingURL=DashboardItemList.js.map

package/lib/esm/components/dashboard/dashboard_operational/DashboardItemList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DashboardItemList.js","names":[],"sources":["../../../../../src/components/dashboard/dashboard_operational/DashboardItemList.tsx"],"sourcesContent":["import type { JSX, ReactNode } from 'react';\n\nimport { DashboardLinkedSurface } from './DashboardLinkedSurface.js';\nimport * as styles from './DashboardItemList.css.js';\n\nexport type DashboardItemListItem = {\n  id: string;\n  label: ReactNode;\n  meta?: ReactNode;\n  value?: ReactNode;\n  href?: string;\n  beforeValue?: ReactNode;\n};\n\nexport type DashboardItemListProps = {\n  items: readonly DashboardItemListItem[];\n  emptyState?: ReactNode;\n};\n\nexport const DashboardItemList = ({\n  emptyState = null,\n  items,\n}: DashboardItemListProps): JSX.Element => {\n  if (items.length === 0) {\n    return <>{emptyState}</>;\n  }\n\n  return (\n    <div className={styles.list}>\n      {items.map((item) => {\n        return (\n          <DashboardLinkedSurface key={item.id} href={item.href}>\n            <div className={styles.item}>\n              <div className={styles.main}>\n                <span className={styles.label}>{item.label}</span>\n                {item.meta != null && (\n                  <span className={styles.meta}>{item.meta}</span>\n                )}\n              </div>\n              <span className={styles.value}>\n                {item.beforeValue}\n                {item.value}\n              </span>\n            </div>\n          </DashboardLinkedSurface>\n        );\n      })}\n    </div>\n  );\n};\n\nexport default DashboardItemList;\n"],"mappings":";;;;AAmBA,IAAa,KAAqB,EAChC,gBAAa,MACb,eAEI,EAAM,WAAW,IACZ,kBAAA,GAAA,EAAA,UAAG,EAAa,CAAA,IAIvB,kBAAC,OAAD;CAAK,WAAW;WACb,EAAM,KAAK,MAER,kBAAC,GAAD;EAAsC,MAAM,EAAK;YAC/C,kBAAC,OAAD;GAAK,WAAW;aAAhB,CACE,kBAAC,OAAD;IAAK,WAAW;cAAhB,CACE,kBAAC,QAAD;KAAM,WAAW;eAAe,EAAK;IAAY,CAAA,GAChD,EAAK,QAAQ,QACZ,kBAAC,QAAD;KAAM,WAAW;eAAc,EAAK;IAAW,CAAA,CAE9C;OACL,kBAAC,QAAD;IAAM,WAAW;cAAjB,CACG,EAAK,aACL,EAAK,KACF;KACH;;CACiB,GAbK,EAAK,EAaV,CAE3B;AACE,CAAA"}

package/lib/esm/components/dashboard/dashboard_operational/DashboardLinkedSurface.css.js

@@ -0,0 +1,8 @@
+/* empty css                                      */
+/* empty css                                      */
+//#region src/components/dashboard/dashboard_operational/DashboardLinkedSurface.css.ts
+var e = "ilu5wj2 ilu5wj0 txvbqb1bc9 txvbqbfox txvbqbjzu txvbqb3f txvbqb19uf txvbqb7p txvbqb76 txvbqb7t qbwcue6 txvbqb1gg6 txvbqb1ggf qbwcue0 txvbqb1ffs txvbqb1ga0 ilu5wj1 txvbqb2uc", t = "ilu5wj3 txvbqbjzu txvbqb19uf";
+//#endregion
+export { e as link, t as surface };
+
+//# sourceMappingURL=DashboardLinkedSurface.css.js.map

package/lib/esm/components/dashboard/dashboard_operational/DashboardLinkedSurface.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DashboardLinkedSurface.css.js","names":[],"sources":["../../../../../src/components/dashboard/dashboard_operational/DashboardLinkedSurface.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\n\nimport { sprinkles } from '../../../theme/sprinkles.css.js';\nimport { focusRing, liftOnHover } from '../../../theme/styleRecipes.css.js';\n\nexport const link = style([\n  sprinkles({\n    color: 'inherit',\n    display: 'block',\n    height: 'full',\n    textDecoration: 'none',\n    width: 'full',\n    transitionProperty: 'transform',\n    transitionDuration: 150,\n    transitionTimingFunction: 'ease',\n  }),\n  liftOnHover,\n  focusRing,\n  sprinkles({ borderRadius: 'lg' }),\n]);\n\nexport const surface = sprinkles({\n  height: 'full',\n  width: 'full',\n});\n"],"mappings":""}

package/lib/esm/components/dashboard/dashboard_operational/DashboardLinkedSurface.js

@@ -0,0 +1,16 @@
+import { link as e, surface as t } from "./DashboardLinkedSurface.css.js";
+import { jsx as n } from "react/jsx-runtime";
+import r from "@plumile/router/routing/Link.js";
+//#region src/components/dashboard/dashboard_operational/DashboardLinkedSurface.tsx
+var i = ({ children: i, href: a }) => a == null || a.trim() === "" ? /* @__PURE__ */ n("div", {
+	className: t,
+	children: i
+}) : /* @__PURE__ */ n(r, {
+	to: a,
+	className: e,
+	children: i
+});
+//#endregion
+export { i as DashboardLinkedSurface, i as default };
+
+//# sourceMappingURL=DashboardLinkedSurface.js.map

package/lib/esm/components/dashboard/dashboard_operational/DashboardLinkedSurface.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DashboardLinkedSurface.js","names":[],"sources":["../../../../../src/components/dashboard/dashboard_operational/DashboardLinkedSurface.tsx"],"sourcesContent":["import type { JSX, ReactNode } from 'react';\nimport Link from '@plumile/router/routing/Link.js';\n\nimport * as styles from './DashboardLinkedSurface.css.js';\n\nexport type DashboardLinkedSurfaceProps = {\n  children: ReactNode;\n  href?: string;\n};\n\nexport const DashboardLinkedSurface = ({\n  children,\n  href,\n}: DashboardLinkedSurfaceProps): JSX.Element => {\n  if (href == null || href.trim() === '') {\n    return <div className={styles.surface}>{children}</div>;\n  }\n\n  return (\n    <Link to={href} className={styles.link}>\n      {children}\n    </Link>\n  );\n};\n\nexport default DashboardLinkedSurface;\n"],"mappings":";;;;AAUA,IAAa,KAA0B,EACrC,aACA,cAEI,KAAQ,QAAQ,EAAK,KAAK,MAAM,KAC3B,kBAAC,OAAD;CAAK,WAAW;CAAiB;AAAc,CAAA,IAItD,kBAAC,GAAD;CAAM,IAAI;CAAM,WAAW;CACxB;AACG,CAAA"}

package/lib/esm/components/dashboard/dashboard_operational/DashboardProgressBar.css.js

@@ -0,0 +1,20 @@
+/* empty css                                      */
+/* empty css                                    */
+import { createRuntimeFn as e } from "@vanilla-extract/recipes/createRuntimeFn";
+//#region src/components/dashboard/dashboard_operational/DashboardProgressBar.css.ts
+var t = "_10xsz0c1 _10xsz0c0 txvbqb1b83 txvbqb2wi txvbqbjkb txvbqbwr6 txvbqb19uf", n = e({
+	defaultClassName: "_10xsz0c2",
+	variantClassNames: { tone: {
+		neutral: "_10xsz0c3",
+		info: "_10xsz0c4",
+		success: "_10xsz0c5",
+		warning: "_10xsz0c6",
+		danger: "_10xsz0c7"
+	} },
+	defaultVariants: {},
+	compoundVariants: []
+});
+//#endregion
+export { n as fill, t as track };
+
+//# sourceMappingURL=DashboardProgressBar.css.js.map

package/lib/esm/components/dashboard/dashboard_operational/DashboardProgressBar.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DashboardProgressBar.css.js","names":[],"sources":["../../../../../src/components/dashboard/dashboard_operational/DashboardProgressBar.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { recipe } from '@vanilla-extract/recipes';\n\nimport { sprinkles } from '../../../theme/sprinkles.css.js';\nimport { vars } from '../../../theme/themeContract.css.js';\n\nexport const track = style([\n  sprinkles({\n    backgroundColor: 'surfaceMuted',\n    borderRadius: 'full',\n    height: 2,\n    overflow: 'hidden',\n    width: 'full',\n  }),\n]);\n\nexport const fill = recipe({\n  base: {\n    height: '100%',\n    minWidth: vars.spacing[0.5],\n  },\n  variants: {\n    tone: {\n      neutral: { background: vars.colors.textMuted },\n      info: { background: vars.colors.info },\n      success: { background: vars.colors.success },\n      warning: { background: vars.colors.warning },\n      danger: { background: vars.colors.error },\n    },\n  },\n});\n"],"mappings":""}

package/lib/esm/components/dashboard/dashboard_operational/DashboardProgressBar.js

@@ -0,0 +1,18 @@
+import { fill as e, track as t } from "./DashboardProgressBar.css.js";
+import { jsx as n } from "react/jsx-runtime";
+//#region src/components/dashboard/dashboard_operational/DashboardProgressBar.tsx
+var r = (e, t) => t <= 0 ? 0 : Math.max(0, Math.min(1, e / t)), i = ({ max: i, tone: a = "neutral", value: o }) => {
+	let s = r(o, i);
+	return /* @__PURE__ */ n("div", {
+		className: t,
+		role: "presentation",
+		children: /* @__PURE__ */ n("div", {
+			className: e({ tone: a }),
+			style: { width: `${Math.round(s * 100)}%` }
+		})
+	});
+};
+//#endregion
+export { i as DashboardProgressBar, i as default };
+
+//# sourceMappingURL=DashboardProgressBar.js.map

package/lib/esm/components/dashboard/dashboard_operational/DashboardProgressBar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DashboardProgressBar.js","names":[],"sources":["../../../../../src/components/dashboard/dashboard_operational/DashboardProgressBar.tsx"],"sourcesContent":["import type { JSX } from 'react';\n\nimport type { DashboardOperationalTone } from './types.js';\nimport * as styles from './DashboardProgressBar.css.js';\n\nexport type DashboardProgressBarProps = {\n  value: number;\n  max: number;\n  tone?: DashboardOperationalTone;\n};\n\nconst clampRatio = (value: number, max: number): number => {\n  if (max <= 0) {\n    return 0;\n  }\n  return Math.max(0, Math.min(1, value / max));\n};\n\nexport const DashboardProgressBar = ({\n  max,\n  tone = 'neutral',\n  value,\n}: DashboardProgressBarProps): JSX.Element => {\n  const ratio = clampRatio(value, max);\n\n  return (\n    <div className={styles.track} role=\"presentation\">\n      <div\n        className={styles.fill({ tone })}\n        style={{ width: `${Math.round(ratio * 100)}%` }}\n      />\n    </div>\n  );\n};\n\nexport default DashboardProgressBar;\n"],"mappings":";;;AAWA,IAAM,KAAc,GAAe,MAC7B,KAAO,IACF,IAEF,KAAK,IAAI,GAAG,KAAK,IAAI,GAAG,IAAQ,CAAG,CAAC,GAGhC,KAAwB,EACnC,QACA,UAAO,WACP,eAC4C;CAC5C,IAAM,IAAQ,EAAW,GAAO,CAAG;CAEnC,OACE,kBAAC,OAAD;EAAK,WAAW;EAAc,MAAK;YACjC,kBAAC,OAAD;GACE,WAAW,EAAY,EAAE,QAAK,CAAC;GAC/B,OAAO,EAAE,OAAO,GAAG,KAAK,MAAM,IAAQ,GAAG,EAAE,GAAG;EAC/C,CAAA;CACE,CAAA;AAET"}

package/lib/esm/components/dashboard/dashboard_operational/DashboardRiskQueue.js

@@ -0,0 +1,18 @@
+import { DashboardItemList as e } from "./DashboardItemList.js";
+import { DashboardToneBadge as t } from "./DashboardToneBadge.js";
+import { jsx as n } from "react/jsx-runtime";
+//#region src/components/dashboard/dashboard_operational/DashboardRiskQueue.tsx
+var r = ({ emptyState: r = null, items: i }) => /* @__PURE__ */ n(e, {
+	emptyState: r,
+	items: i.map((e) => ({
+		...e,
+		beforeValue: /* @__PURE__ */ n(t, {
+			tone: e.severity,
+			children: e.severity
+		})
+	}))
+});
+//#endregion
+export { r as DashboardRiskQueue, r as default };
+
+//# sourceMappingURL=DashboardRiskQueue.js.map

package/lib/esm/components/dashboard/dashboard_operational/DashboardRiskQueue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DashboardRiskQueue.js","names":[],"sources":["../../../../../src/components/dashboard/dashboard_operational/DashboardRiskQueue.tsx"],"sourcesContent":["import type { JSX, ReactNode } from 'react';\n\nimport { DashboardItemList } from './DashboardItemList.js';\nimport { DashboardToneBadge } from './DashboardToneBadge.js';\nimport type { DashboardOperationalTone } from './types.js';\n\nexport type DashboardRiskQueueItem = {\n  id: string;\n  label: ReactNode;\n  severity: DashboardOperationalTone;\n  value?: ReactNode;\n  meta?: ReactNode;\n  href?: string;\n};\n\nexport type DashboardRiskQueueProps = {\n  items: readonly DashboardRiskQueueItem[];\n  emptyState?: ReactNode;\n};\n\nexport const DashboardRiskQueue = ({\n  emptyState = null,\n  items,\n}: DashboardRiskQueueProps): JSX.Element => {\n  return (\n    <DashboardItemList\n      emptyState={emptyState}\n      items={items.map((item) => {\n        return {\n          ...item,\n          beforeValue: (\n            <DashboardToneBadge tone={item.severity}>\n              {item.severity}\n            </DashboardToneBadge>\n          ),\n        };\n      })}\n    />\n  );\n};\n\nexport default DashboardRiskQueue;\n"],"mappings":";;;;AAoBA,IAAa,KAAsB,EACjC,gBAAa,MACb,eAGE,kBAAC,GAAD;CACc;CACZ,OAAO,EAAM,KAAK,OACT;EACL,GAAG;EACH,aACE,kBAAC,GAAD;GAAoB,MAAM,EAAK;aAC5B,EAAK;EACY,CAAA;CAExB,EACD;AACF,CAAA"}

package/lib/esm/components/dashboard/dashboard_operational/DashboardSlaGauge.css.js

@@ -0,0 +1,8 @@
+/* empty css                                      */
+/* empty css                                 */
+//#region src/components/dashboard/dashboard_operational/DashboardSlaGauge.css.ts
+var e = "_65rqqs0 txvbqbfpn txvbqbh4x txvbqbhdy", t = "_65rqqs1 txvbqbfo txvbqbfpn txvbqbhdy txvbqblt7", n = "_65rqqs2 txvbqb1bg3 txvbqb9j txvbqbhb2", r = "_65rqqs3 txvbqb1bg1 txvbqbaz txvbqbhbf", i = "_65rqqs4 txvbqb1bg5 txvbqb96", a = "_65rqqs5";
+//#endregion
+export { t as header, n as label, e as root, a as row, i as threshold, r as value };
+
+//# sourceMappingURL=DashboardSlaGauge.css.js.map

package/lib/esm/components/dashboard/dashboard_operational/DashboardSlaGauge.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DashboardSlaGauge.css.js","names":[],"sources":["../../../../../src/components/dashboard/dashboard_operational/DashboardSlaGauge.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\n\nimport { sprinkles } from '../../../theme/sprinkles.css.js';\n\nexport const root = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 3,\n});\n\nexport const header = sprinkles({\n  alignItems: 'baseline',\n  display: 'flex',\n  gap: 3,\n  justifyContent: 'space-between',\n});\n\nexport const label = sprinkles({\n  color: 'textSecondary',\n  fontSize: 'sm',\n  fontWeight: 'medium',\n});\n\nexport const value = sprinkles({\n  color: 'text',\n  fontSize: '2xl',\n  fontWeight: 'semibold',\n});\n\nexport const threshold = sprinkles({\n  color: 'textMuted',\n  fontSize: 'xs',\n});\n\nexport const row = style({\n  display: 'grid',\n  gridTemplateColumns: 'minmax(0, 1fr) auto',\n  gap: '0.75rem',\n  alignItems: 'center',\n});\n"],"mappings":""}

package/lib/esm/components/dashboard/dashboard_operational/DashboardSlaGauge.js

@@ -0,0 +1,36 @@
+import { PanelShell as e } from "../../layout/PanelShell.js";
+import { DashboardLinkedSurface as t } from "./DashboardLinkedSurface.js";
+import { DashboardProgressBar as n } from "./DashboardProgressBar.js";
+import { header as r, label as i, root as a, row as o, threshold as s, value as c } from "./DashboardSlaGauge.css.js";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
+//#region src/components/dashboard/dashboard_operational/DashboardSlaGauge.tsx
+var d = ({ href: d, label: f, max: p, threshold: m, tone: h = "neutral", unit: g, value: _ }) => /* @__PURE__ */ l(t, {
+	href: d,
+	children: /* @__PURE__ */ l(e, { children: /* @__PURE__ */ u("div", {
+		className: a,
+		children: [/* @__PURE__ */ u("div", {
+			className: r,
+			children: [/* @__PURE__ */ l("span", {
+				className: i,
+				children: f
+			}), /* @__PURE__ */ u("strong", {
+				className: c,
+				children: [_, g]
+			})]
+		}), /* @__PURE__ */ u("div", {
+			className: o,
+			children: [/* @__PURE__ */ l(n, {
+				value: _,
+				max: p,
+				tone: h
+			}), /* @__PURE__ */ u("span", {
+				className: s,
+				children: [m ?? p, g]
+			})]
+		})]
+	}) })
+});
+//#endregion
+export { d as DashboardSlaGauge, d as default };
+
+//# sourceMappingURL=DashboardSlaGauge.js.map

package/lib/esm/components/dashboard/dashboard_operational/DashboardSlaGauge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DashboardSlaGauge.js","names":[],"sources":["../../../../../src/components/dashboard/dashboard_operational/DashboardSlaGauge.tsx"],"sourcesContent":["import type { JSX, ReactNode } from 'react';\n\nimport { PanelShell } from '../../layout/PanelShell.js';\nimport { DashboardLinkedSurface } from './DashboardLinkedSurface.js';\nimport { DashboardProgressBar } from './DashboardProgressBar.js';\nimport type { DashboardOperationalTone } from './types.js';\nimport * as styles from './DashboardSlaGauge.css.js';\n\nexport type DashboardSlaGaugeProps = {\n  label: ReactNode;\n  value: number;\n  max: number;\n  threshold?: number;\n  unit?: ReactNode;\n  href?: string;\n  tone?: DashboardOperationalTone;\n};\n\nexport const DashboardSlaGauge = ({\n  href,\n  label,\n  max,\n  threshold,\n  tone = 'neutral',\n  unit,\n  value,\n}: DashboardSlaGaugeProps): JSX.Element => {\n  return (\n    <DashboardLinkedSurface href={href}>\n      <PanelShell>\n        <div className={styles.root}>\n          <div className={styles.header}>\n            <span className={styles.label}>{label}</span>\n            <strong className={styles.value}>\n              {value}\n              {unit}\n            </strong>\n          </div>\n          <div className={styles.row}>\n            <DashboardProgressBar value={value} max={max} tone={tone} />\n            <span className={styles.threshold}>\n              {threshold ?? max}\n              {unit}\n            </span>\n          </div>\n        </div>\n      </PanelShell>\n    </DashboardLinkedSurface>\n  );\n};\n\nexport default DashboardSlaGauge;\n"],"mappings":";;;;;;AAkBA,IAAa,KAAqB,EAChC,SACA,OAAA,GACA,QACA,WAAA,GACA,UAAO,WACP,SACA,OAAA,QAGE,kBAAC,GAAD;CAA8B;WAC5B,kBAAC,GAAD,EAAA,UACE,kBAAC,OAAD;EAAK,WAAW;YAAhB,CACE,kBAAC,OAAD;GAAK,WAAW;aAAhB,CACE,kBAAC,QAAD;IAAM,WAAW;cAAe;GAAY,CAAA,GAC5C,kBAAC,UAAD;IAAQ,WAAW;cAAnB,CACG,GACA,CACK;KACL;MACL,kBAAC,OAAD;GAAK,WAAW;aAAhB,CACE,kBAAC,GAAD;IAA6B,OAAA;IAAY;IAAW;GAAO,CAAA,GAC3D,kBAAC,QAAD;IAAM,WAAW;cAAjB,CACG,KAAa,GACb,CACG;KACH;IACF;IACK,CAAA;AACU,CAAA"}

package/lib/esm/components/dashboard/dashboard_operational/DashboardTimelineChart.js

@@ -0,0 +1,12 @@
+import { MetricHistoryChart as e } from "../../charts/MetricHistoryChart.js";
+import { jsx as t } from "react/jsx-runtime";
+//#region src/components/dashboard/dashboard_operational/DashboardTimelineChart.tsx
+var n = ({ ariaLabel: n, emptyMessage: r, series: i }) => /* @__PURE__ */ t(e, {
+	ariaLabel: n,
+	emptyMessage: r,
+	series: i
+});
+//#endregion
+export { n as DashboardTimelineChart, n as default };
+
+//# sourceMappingURL=DashboardTimelineChart.js.map

package/lib/esm/components/dashboard/dashboard_operational/DashboardTimelineChart.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DashboardTimelineChart.js","names":[],"sources":["../../../../../src/components/dashboard/dashboard_operational/DashboardTimelineChart.tsx"],"sourcesContent":["import type { JSX } from 'react';\n\nimport {\n  MetricHistoryChart,\n  type MetricHistoryChartSerie,\n} from '../../charts/MetricHistoryChart.js';\n\nexport type DashboardTimelineChartProps = {\n  series: readonly MetricHistoryChartSerie[];\n  ariaLabel: string;\n  emptyMessage?: string;\n  chart?: 'line' | 'bar';\n};\n\nexport const DashboardTimelineChart = ({\n  ariaLabel,\n  emptyMessage,\n  series,\n}: DashboardTimelineChartProps): JSX.Element => {\n  return (\n    <MetricHistoryChart\n      ariaLabel={ariaLabel}\n      emptyMessage={emptyMessage}\n      series={series}\n    />\n  );\n};\n\nexport default DashboardTimelineChart;\n"],"mappings":";;;AAcA,IAAa,KAA0B,EACrC,cACA,iBACA,gBAGE,kBAAC,GAAD;CACa;CACG;CACN;AACT,CAAA"}

package/lib/esm/components/dashboard/dashboard_operational/DashboardToneBadge.css.js

@@ -0,0 +1,20 @@
+/* empty css                                      */
+/* empty css                                  */
+import { createRuntimeFn as e } from "@vanilla-extract/recipes/createRuntimeFn";
+//#region src/components/dashboard/dashboard_operational/DashboardToneBadge.css.ts
+var t = e({
+	defaultClassName: "_13nrlyi1 _13nrlyi0 txvbqb10mk txvbqb11k5 txvbqbey txvbqb2wi txvbqb2sj txvbqb1u8 txvbqbfqq txvbqb96 txvbqbhb2 txvbqbls4 txvbqbuac txvbqb1avz",
+	variantClassNames: { tone: {
+		neutral: "_13nrlyi2",
+		info: "_13nrlyi3",
+		success: "_13nrlyi4",
+		warning: "_13nrlyi5",
+		danger: "_13nrlyi6"
+	} },
+	defaultVariants: {},
+	compoundVariants: []
+});
+//#endregion
+export { t as badge };
+
+//# sourceMappingURL=DashboardToneBadge.css.js.map

package/lib/esm/components/dashboard/dashboard_operational/DashboardToneBadge.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DashboardToneBadge.css.js","names":[],"sources":["../../../../../src/components/dashboard/dashboard_operational/DashboardToneBadge.css.ts"],"sourcesContent":["import { recipe } from '@vanilla-extract/recipes';\n\nimport { sprinkles } from '../../../theme/sprinkles.css.js';\nimport { vars } from '../../../theme/themeContract.css.js';\n\nexport const badge = recipe({\n  base: sprinkles({\n    alignItems: 'center',\n    borderRadius: 'full',\n    borderStyle: 'solid',\n    borderWidth: 1,\n    display: 'inline-flex',\n    fontSize: 'xs',\n    fontWeight: 'medium',\n    justifyContent: 'center',\n    minHeight: 6,\n    paddingX: 2,\n    whiteSpace: 'nowrap',\n  }),\n  variants: {\n    tone: {\n      neutral: {\n        background: vars.colors.surfaceMuted,\n        borderColor: vars.colors.border,\n        color: vars.colors.textSecondary,\n      },\n      info: {\n        background: vars.colors.toneInfoSurface,\n        borderColor: vars.colors.toneInfoBorder,\n        color: vars.colors.toneInfoText,\n      },\n      success: {\n        background: vars.colors.toneSuccessSurface,\n        borderColor: vars.colors.toneSuccessBorder,\n        color: vars.colors.toneSuccessText,\n      },\n      warning: {\n        background: vars.colors.toneWarningSurface,\n        borderColor: vars.colors.toneWarningBorder,\n        color: vars.colors.toneWarningText,\n      },\n      danger: {\n        background: vars.colors.toneDangerSurface,\n        borderColor: vars.colors.toneDangerBorder,\n        color: vars.colors.toneDangerText,\n      },\n    },\n  },\n});\n"],"mappings":""}

package/lib/esm/components/dashboard/dashboard_operational/DashboardToneBadge.js

@@ -0,0 +1,11 @@
+import { badge as e } from "./DashboardToneBadge.css.js";
+import { jsx as t } from "react/jsx-runtime";
+//#region src/components/dashboard/dashboard_operational/DashboardToneBadge.tsx
+var n = ({ children: n, tone: r = "neutral" }) => /* @__PURE__ */ t("span", {
+	className: e({ tone: r }),
+	children: n
+});
+//#endregion
+export { n as DashboardToneBadge, n as default };
+
+//# sourceMappingURL=DashboardToneBadge.js.map

package/lib/esm/components/dashboard/dashboard_operational/DashboardToneBadge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DashboardToneBadge.js","names":[],"sources":["../../../../../src/components/dashboard/dashboard_operational/DashboardToneBadge.tsx"],"sourcesContent":["import type { JSX, ReactNode } from 'react';\n\nimport type { DashboardOperationalTone } from './types.js';\nimport * as styles from './DashboardToneBadge.css.js';\n\nexport type DashboardToneBadgeProps = {\n  children: ReactNode;\n  tone?: DashboardOperationalTone;\n};\n\nexport const DashboardToneBadge = ({\n  children,\n  tone = 'neutral',\n}: DashboardToneBadgeProps): JSX.Element => {\n  return <span className={styles.badge({ tone })}>{children}</span>;\n};\n\nexport default DashboardToneBadge;\n"],"mappings":";;;AAUA,IAAa,KAAsB,EACjC,aACA,UAAO,gBAEA,kBAAC,QAAD;CAAM,WAAW,EAAa,EAAE,QAAK,CAAC;CAAI;AAAe,CAAA"}

package/lib/esm/components/dashboard/dashboard_operational/DashboardTrendMetric.css.js

@@ -0,0 +1,8 @@
+/* empty css                                      */
+/* empty css                                    */
+//#region src/components/dashboard/dashboard_operational/DashboardTrendMetric.css.ts
+var e = "_1rr2vsl0 txvbqbfpn txvbqbh4x txvbqbhdy txvbqbjzu", t = "_1rr2vsl1 txvbqbel txvbqbfpn txvbqbhdy txvbqblt7", n = "_1rr2vsl2 txvbqb1bg3 txvbqb9j txvbqbhb2", r = "_1rr2vsl3 txvbqb1bg1 txvbqbbc txvbqbhbf txvbqbo4z", i = "_1rr2vsl4 txvbqbey txvbqbfpn txvbqbhdl txvbqbh7g", a = "_1rr2vsl5 txvbqb1bg5 txvbqb96", o = "_1rr2vsl6";
+//#endregion
+export { e as card, i as delta, a as deltaLabel, t as header, n as label, o as sparkline, r as value };
+
+//# sourceMappingURL=DashboardTrendMetric.css.js.map

package/lib/esm/components/dashboard/dashboard_operational/DashboardTrendMetric.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DashboardTrendMetric.css.js","names":[],"sources":["../../../../../src/components/dashboard/dashboard_operational/DashboardTrendMetric.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\n\nimport { sprinkles } from '../../../theme/sprinkles.css.js';\nimport { vars } from '../../../theme/themeContract.css.js';\n\nexport const card = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 3,\n  height: 'full',\n});\n\nexport const header = sprinkles({\n  alignItems: 'flex-start',\n  display: 'flex',\n  gap: 3,\n  justifyContent: 'space-between',\n});\n\nexport const label = sprinkles({\n  color: 'textSecondary',\n  fontSize: 'sm',\n  fontWeight: 'medium',\n});\n\nexport const value = sprinkles({\n  color: 'text',\n  fontSize: '3xl',\n  fontWeight: 'semibold',\n  lineHeight: 'tight',\n});\n\nexport const delta = sprinkles({\n  alignItems: 'center',\n  display: 'flex',\n  gap: 2,\n  flexWrap: 'wrap',\n});\n\nexport const deltaLabel = sprinkles({\n  color: 'textMuted',\n  fontSize: 'xs',\n});\n\nexport const sparkline = style({\n  height: vars.spacing[18],\n  minHeight: vars.spacing[18],\n});\n"],"mappings":""}

package/lib/esm/components/dashboard/dashboard_operational/DashboardTrendMetric.js

@@ -0,0 +1,58 @@
+import { MetricHistoryChart as e } from "../../charts/MetricHistoryChart.js";
+import { PanelShell as t } from "../../layout/PanelShell.js";
+import { DashboardLinkedSurface as n } from "./DashboardLinkedSurface.js";
+import { DashboardToneBadge as r } from "./DashboardToneBadge.js";
+import { card as i, header as a, label as o, value as s } from "./DashboardTrendMetric.css.js";
+import { jsx as c, jsxs as l } from "react/jsx-runtime";
+//#region src/components/dashboard/dashboard_operational/DashboardTrendMetric.tsx
+var u = (e) => e === "up" ? "+" : e === "down" ? "-" : "", d = ({ delta: d, href: f, label: p, sparkline: m, sparklineLabel: h, tone: g, unit: _, value: v }) => {
+	let y = h ?? "Metric history";
+	return /* @__PURE__ */ c(n, {
+		href: f,
+		children: /* @__PURE__ */ c(t, { children: /* @__PURE__ */ l("div", {
+			className: i,
+			children: [
+				/* @__PURE__ */ l("div", {
+					className: a,
+					children: [/* @__PURE__ */ l("div", { children: [/* @__PURE__ */ c("p", {
+						className: o,
+						children: p
+					}), /* @__PURE__ */ l("p", {
+						className: s,
+						children: [v, _]
+					})] }), g != null && /* @__PURE__ */ c(r, {
+						tone: g,
+						children: g
+					})]
+				}),
+				d != null && /* @__PURE__ */ l("div", {
+					className: "_1rr2vsl4 txvbqbey txvbqbfpn txvbqbhdl txvbqbh7g",
+					children: [/* @__PURE__ */ l(r, {
+						tone: d.tone ?? "neutral",
+						children: [u(d.direction), d.value]
+					}), d.label != null && /* @__PURE__ */ c("span", {
+						className: "_1rr2vsl5 txvbqb1bg5 txvbqb96",
+						children: d.label
+					})]
+				}),
+				m != null && m.length > 0 && /* @__PURE__ */ c("div", {
+					className: "_1rr2vsl6",
+					children: /* @__PURE__ */ c(e, {
+						ariaLabel: y,
+						series: [{
+							id: "value",
+							label: y,
+							color: "currentColor",
+							data: m
+						}],
+						emptyMessage: ""
+					})
+				})
+			]
+		}) })
+	});
+};
+//#endregion
+export { d as DashboardTrendMetric, d as default };
+
+//# sourceMappingURL=DashboardTrendMetric.js.map

package/lib/esm/components/dashboard/dashboard_operational/DashboardTrendMetric.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DashboardTrendMetric.js","names":[],"sources":["../../../../../src/components/dashboard/dashboard_operational/DashboardTrendMetric.tsx"],"sourcesContent":["import type { JSX, ReactNode } from 'react';\n\nimport { MetricHistoryChart } from '../../charts/MetricHistoryChart.js';\nimport { PanelShell } from '../../layout/PanelShell.js';\nimport { DashboardLinkedSurface } from './DashboardLinkedSurface.js';\nimport { DashboardToneBadge } from './DashboardToneBadge.js';\nimport type {\n  DashboardOperationalTone,\n  DashboardSparklinePoint,\n} from './types.js';\nimport * as styles from './DashboardTrendMetric.css.js';\n\nexport type DashboardTrendDirection = 'up' | 'down' | 'flat';\n\nexport type DashboardTrendMetricProps = {\n  label: ReactNode;\n  value: ReactNode;\n  unit?: ReactNode;\n  href?: string;\n  tone?: DashboardOperationalTone;\n  delta?: {\n    value: ReactNode;\n    direction: DashboardTrendDirection;\n    tone?: DashboardOperationalTone;\n    label?: ReactNode;\n  };\n  sparkline?: readonly DashboardSparklinePoint[];\n  sparklineLabel?: string;\n};\n\nconst directionPrefix = (direction: DashboardTrendDirection): string => {\n  if (direction === 'up') {\n    return '+';\n  }\n  if (direction === 'down') {\n    return '-';\n  }\n  return '';\n};\n\nexport const DashboardTrendMetric = ({\n  delta,\n  href,\n  label,\n  sparkline,\n  sparklineLabel,\n  tone,\n  unit,\n  value,\n}: DashboardTrendMetricProps): JSX.Element => {\n  const resolvedSparklineLabel = sparklineLabel ?? 'Metric history';\n\n  return (\n    <DashboardLinkedSurface href={href}>\n      <PanelShell>\n        <div className={styles.card}>\n          <div className={styles.header}>\n            <div>\n              <p className={styles.label}>{label}</p>\n              <p className={styles.value}>\n                {value}\n                {unit}\n              </p>\n            </div>\n            {tone != null && (\n              <DashboardToneBadge tone={tone}>{tone}</DashboardToneBadge>\n            )}\n          </div>\n          {delta != null && (\n            <div className={styles.delta}>\n              <DashboardToneBadge tone={delta.tone ?? 'neutral'}>\n                {directionPrefix(delta.direction)}\n                {delta.value}\n              </DashboardToneBadge>\n              {delta.label != null && (\n                <span className={styles.deltaLabel}>{delta.label}</span>\n              )}\n            </div>\n          )}\n          {sparkline != null && sparkline.length > 0 && (\n            <div className={styles.sparkline}>\n              <MetricHistoryChart\n                ariaLabel={resolvedSparklineLabel}\n                series={[\n                  {\n                    id: 'value',\n                    label: resolvedSparklineLabel,\n                    color: 'currentColor',\n                    data: sparkline,\n                  },\n                ]}\n                emptyMessage=\"\"\n              />\n            </div>\n          )}\n        </div>\n      </PanelShell>\n    </DashboardLinkedSurface>\n  );\n};\n\nexport default DashboardTrendMetric;\n"],"mappings":";;;;;;;AA8BA,IAAM,KAAmB,MACnB,MAAc,OACT,MAEL,MAAc,SACT,MAEF,IAGI,KAAwB,EACnC,OAAA,GACA,SACA,OAAA,GACA,WAAA,GACA,mBACA,SACA,SACA,OAAA,QAC4C;CAC5C,IAAM,IAAyB,KAAkB;CAEjD,OACE,kBAAC,GAAD;EAA8B;YAC5B,kBAAC,GAAD,EAAA,UACE,kBAAC,OAAD;GAAK,WAAW;aAAhB;IACE,kBAAC,OAAD;KAAK,WAAW;eAAhB,CACE,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,KAAD;MAAG,WAAW;gBAAe;KAAS,CAAA,GACtC,kBAAC,KAAD;MAAG,WAAW;gBAAd,CACG,GACA,CACA;OACA,EAAA,CAAA,GACJ,KAAQ,QACP,kBAAC,GAAD;MAA0B;gBAAO;KAAyB,CAAA,CAEzD;;IACJ,KAAS,QACR,kBAAC,OAAD;KAAK,WAAW;eAAhB,CACE,kBAAC,GAAD;MAAoB,MAAM,EAAM,QAAQ;gBAAxC,CACG,EAAgB,EAAM,SAAS,GAC/B,EAAM,KACW;SACnB,EAAM,SAAS,QACd,kBAAC,QAAD;MAAM,WAAW;gBAAoB,EAAM;KAAY,CAAA,CAEtD;;IAEN,KAAa,QAAQ,EAAU,SAAS,KACvC,kBAAC,OAAD;KAAK,WAAW;eACd,kBAAC,GAAD;MACE,WAAW;MACX,QAAQ,CACN;OACE,IAAI;OACJ,OAAO;OACP,OAAO;OACP,MAAM;MACR,CACF;MACA,cAAa;KACd,CAAA;IACE,CAAA;GAEJ;KACK,CAAA;CACU,CAAA;AAE5B"}

package/lib/esm/components/dashboard/dashboard_operational/DashboardWindowControl.css.js

@@ -0,0 +1,8 @@
+/* empty css                                      */
+/* empty css                                      */
+//#region src/components/dashboard/dashboard_operational/DashboardWindowControl.css.ts
+var e = "sv0g5c0 txvbqbey txvbqbfpn txvbqbh7g txvbqbhd8", t = "sv0g5c2 sv0g5c1 txvbqb10mx txvbqb11ki txvbqb6 txvbqb1b8l txvbqb18k txvbqb2uc txvbqb2sj txvbqb1u8 txvbqb1bgf txvbqbv txvbqb9j txvbqbhb2 txvbqbubf txvbqb76 txvbqb7g txvbqb7t qbwcue0 txvbqb1ffs txvbqb1ga0", n = "sv0g5c3";
+//#endregion
+export { t as button, n as buttonActive, e as group };
+
+//# sourceMappingURL=DashboardWindowControl.css.js.map

package/lib/esm/components/dashboard/dashboard_operational/DashboardWindowControl.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DashboardWindowControl.css.js","names":[],"sources":["../../../../../src/components/dashboard/dashboard_operational/DashboardWindowControl.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\n\nimport { sprinkles } from '../../../theme/sprinkles.css.js';\nimport { focusRing } from '../../../theme/styleRecipes.css.js';\nimport { vars } from '../../../theme/themeContract.css.js';\n\nexport const group = sprinkles({\n  alignItems: 'center',\n  display: 'flex',\n  flexWrap: 'wrap',\n  gap: 1,\n});\n\nexport const button = style([\n  sprinkles({\n    appearance: 'none',\n    backgroundColor: 'controlSurface',\n    borderColor: 'controlBorder',\n    borderRadius: 'lg',\n    borderStyle: 'solid',\n    borderWidth: 1,\n    color: 'controlText',\n    cursor: 'pointer',\n    fontSize: 'sm',\n    fontWeight: 'medium',\n    minHeight: 9,\n    paddingX: 3,\n    transitionDuration: 150,\n    transitionProperty: 'default',\n    transitionTimingFunction: 'ease',\n  }),\n  focusRing,\n]);\n\nexport const buttonActive = style({\n  background: vars.colors.primary,\n  borderColor: vars.colors.primary,\n  color: vars.colors.onPrimary,\n});\n"],"mappings":""}