@burdenoff/microfe-vibecontrols 2026.610.2 → 2026.610.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.
Files changed (6) hide show
  1. package/dist/pages/CatalogDetailPage.js +290 -262
  2. package/dist/pages/CatalogDetailPage.js.map +1 -1
  3. package/dist/pages/ComponentDetailPage.js +354 -326
  4. package/dist/pages/ComponentDetailPage.js.map +1 -1
  5. package/dist/pages/VibeDetailsPage.js +5 -5
  6. package/package.json +1 -1
package/dist/pages/ComponentDetailPage.js CHANGED
@@ -1,22 +1,24 @@
1
- import { useAddComponentToCatalogMutation as e, useDeleteComponentMutation as t, useGetComponentQuery as n, useListCatalogsQuery as r, usePublishComponentAsTemplateMutation as i, useUpdateComponentMutation as ee } from "../generated/wspace-operations.js";
2
- import { ConfirmDialog as te } from "../components/shared/ConfirmDialog.js";
3
- import { QuotaExhaustedDialog as ne } from "../components/shared/QuotaExhaustedDialog.js";
4
- import { isQuotaExhaustedError as a, markQuotaHandledLocally as re } from "../utils/quotaUtils.js";
5
- import { useVibeNavigate as o } from "../providers/VibeControlsProvider.js";
6
- import { PageHeader as s } from "../components/shared/PageHeader.js";
7
- import { ErrorState as c } from "../components/shared/ErrorState.js";
8
- import { EntityTagPicker as l } from "../components/shared/EntityTagPicker.js";
9
- import { EmptyState as u } from "../components/shared/EmptyState.js";
10
- import { Card as d } from "../components/shared/Card.js";
11
- import { StatCard as f } from "../components/shared/StatCard.js";
1
+ import { useAddComponentToCatalogMutation as e, useDeleteComponentMutation as t, useGetComponentQuery as n, useListCatalogsQuery as ee, usePublishComponentAsTemplateMutation as r, useUpdateComponentMutation as i } from "../generated/wspace-operations.js";
2
+ import { ConfirmDialog as a } from "../components/shared/ConfirmDialog.js";
3
+ import { QuotaExhaustedDialog as te } from "../components/shared/QuotaExhaustedDialog.js";
4
+ import { isQuotaExhaustedError as o, markQuotaHandledLocally as ne } from "../utils/quotaUtils.js";
5
+ import { useVibeNavigate as re } from "../providers/VibeControlsProvider.js";
6
+ import { PageHeader as ie } from "../components/shared/PageHeader.js";
7
+ import { ErrorState as ae } from "../components/shared/ErrorState.js";
8
+ import { EntityTagPicker as s } from "../components/shared/EntityTagPicker.js";
9
+ import { EmptyState as c } from "../components/shared/EmptyState.js";
10
+ import { Card as l } from "../components/shared/Card.js";
11
+ import { StatCard as u } from "../components/shared/StatCard.js";
12
12
  import "../components/shared/index.js";
13
- import { VIBE_PERMISSIONS as ie } from "../constants/permissions.js";
14
- import { EntityShareButton as ae } from "../components/sharing/EntityShareButton.js";
13
+ import { VIBE_PERMISSIONS as d } from "../constants/permissions.js";
14
+ import { EntityShareButton as f } from "../components/sharing/EntityShareButton.js";
15
15
  import "../components/sharing/index.js";
16
- import { PageSkeleton as oe } from "../components/shared/PageSkeleton.js";
17
- import { useQueryBackedTab as se } from "../hooks/useQueryBackedTab.js";
18
- import { DocsTabPanel as ce } from "../components/docs/DocsTabPanel.js";
16
+ import { PageSkeleton as p } from "../components/shared/PageSkeleton.js";
17
+ import { useQueryBackedTab as oe } from "../hooks/useQueryBackedTab.js";
18
+ import { DocsTabPanel as se } from "../components/docs/DocsTabPanel.js";
19
19
  import "../components/docs/index.js";
20
+ import { ScorecardPanel as ce } from "../components/scorecard/ScorecardPanel.js";
21
+ import "../components/scorecard/index.js";
20
22
  import { ComponentForm as le } from "../components/idp-components/ComponentForm.js";
21
23
  import { DependencyGraphTab as ue } from "../components/idp-components/DependencyGraphTab.js";
22
24
  import "../components/idp-components/index.js";
@@ -24,39 +26,40 @@ import { CatalogCard as de } from "../components/catalog/CatalogCard.js";
24
26
  import "../components/catalog/index.js";
25
27
  import { PublishTemplateForm as fe } from "../components/templates/PublishTemplateForm.js";
26
28
  import "../components/templates/index.js";
27
- import { useCallback as pe, useMemo as me, useState as p } from "react";
29
+ import { useCallback as pe, useMemo as me, useState as m } from "react";
28
30
  import { useI18n as he } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
29
- import { ArrowLeft as m, BookOpen as h, Box as g, FileCode as _, FileText as ge, Layers as v, Plus as y, RefreshCw as _e, Settings as ve, Share2 as ye, Tag as be, Trash2 as xe, Upload as b, X as Se } from "lucide-react";
30
- import { useParams as x } from "react-router-dom";
31
- import { usePermissions as S } from "@burdenoff/fe-libs/shared/providers/shell";
32
- import { AnimatePresence as C, motion as w } from "framer-motion";
33
- import { jsx as T, jsxs as E } from "react/jsx-runtime";
34
- import { MotionItem as D, MotionList as O, MotionPage as k } from "@burdenoff/fe-libs/shared/motion";
31
+ import { ArrowLeft as h, BarChart3 as ge, BookOpen as g, Box as _, FileCode as v, FileText as _e, Layers as ve, Plus as y, RefreshCw as ye, Settings as be, Share2 as xe, Tag as Se, Trash2 as Ce, Upload as b, X as x } from "lucide-react";
32
+ import { useParams as S } from "react-router-dom";
33
+ import { usePermissions as C } from "@burdenoff/fe-libs/shared/providers/shell";
34
+ import { AnimatePresence as w, motion as T } from "framer-motion";
35
+ import { jsx as E, jsxs as D } from "react/jsx-runtime";
36
+ import { MotionItem as O, MotionList as k, MotionPage as A } from "@burdenoff/fe-libs/shared/motion";
35
37
  //#region src/pages/ComponentDetailPage.tsx
36
- var A = [
38
+ var j = [
37
39
  "overview",
38
40
  "catalogs",
41
+ "scorecard",
39
42
  "docs",
40
43
  "dependencies",
41
44
  "template",
42
45
  "settings"
43
46
  ];
44
- function j() {
45
- let { t: j } = he(), { id: M } = x(), N = o(), { hasPermission: Ce, isLoading: we } = S(), P = pe((e, t) => {
46
- let n = j(e);
47
+ function M() {
48
+ let { t: M } = he(), { id: N } = S(), P = re(), { hasPermission: we, isLoading: Te } = C(), F = pe((e, t) => {
49
+ let n = M(e);
47
50
  return n === e ? t : n;
48
- }, [j]), [F, Te] = se(A, "overview"), [Ee, I] = p(!1), [De, L] = p(!1), [Oe, R] = p(!1), [z, B] = p(null), [ke, V] = p(!1), [Ae, H] = p(!1), [U, W] = p(!1), { data: je, loading: G, error: K, refetch: q } = n({
49
- variables: { id: M || "" },
50
- skip: !M,
51
+ }, [M]), [I, Ee] = oe(j, "overview"), [De, L] = m(!1), [Oe, R] = m(!1), [ke, z] = m(!1), [B, V] = m(null), [Ae, H] = m(!1), [je, U] = m(!1), [W, G] = m(!1), { data: Me, loading: K, error: q, refetch: J } = n({
52
+ variables: { id: N || "" },
53
+ skip: !N,
51
54
  fetchPolicy: "cache-and-network"
52
- }), [Me] = ee({ refetchQueries: ["GetComponent"] }), [Ne] = t({ refetchQueries: ["ListComponents"] }), [Pe] = i({ refetchQueries: ["GetComponent"] }), [Fe] = e({ refetchQueries: ["GetComponent"] }), { data: J } = r({
55
+ }), [Ne] = i({ refetchQueries: ["GetComponent"] }), [Pe] = t({ refetchQueries: ["ListComponents"] }), [Fe] = r({ refetchQueries: ["GetComponent"] }), [Ie] = e({ refetchQueries: ["GetComponent"] }), { data: Y } = ee({
53
56
  variables: { pagination: {
54
57
  limit: 100,
55
58
  offset: 0
56
59
  } },
57
- skip: !U,
60
+ skip: !W,
58
61
  fetchPolicy: "cache-and-network"
59
- }), Y = je?.vibecontrolsComponent ?? null, X = me(() => (Y?.catalogs ?? []).map((e) => {
62
+ }), X = Me?.vibecontrolsComponent ?? null, Z = me(() => (X?.catalogs ?? []).map((e) => {
60
63
  let t = e.catalog || {};
61
64
  return {
62
65
  id: t.id,
@@ -69,34 +72,34 @@ function j() {
69
72
  createdAt: t.createdAt,
70
73
  updatedAt: t.updatedAt
71
74
  };
72
- }), [Y?.catalogs]);
73
- if (we) return /* @__PURE__ */ T("div", {
75
+ }), [X?.catalogs]);
76
+ if (Te) return /* @__PURE__ */ E("div", {
74
77
  className: "flex items-center justify-center min-h-[400px]",
75
- children: /* @__PURE__ */ T("p", {
78
+ children: /* @__PURE__ */ E("p", {
76
79
  className: "text-text-secondary",
77
80
  children: "Loading permissions…"
78
81
  })
79
82
  });
80
- if (!Ce(ie.VIBE_READ)) return /* @__PURE__ */ T("div", {
83
+ if (!we(d.VIBE_READ)) return /* @__PURE__ */ E("div", {
81
84
  className: "flex items-center justify-center min-h-[400px]",
82
- children: /* @__PURE__ */ E("div", {
85
+ children: /* @__PURE__ */ D("div", {
83
86
  className: "text-center space-y-2",
84
- children: [/* @__PURE__ */ T("h2", {
87
+ children: [/* @__PURE__ */ E("h2", {
85
88
  className: "text-lg font-semibold text-foreground",
86
89
  children: "Access Denied"
87
- }), /* @__PURE__ */ T("p", {
90
+ }), /* @__PURE__ */ E("p", {
88
91
  className: "text-sm text-text-secondary",
89
92
  children: "You don't have permission to access this page."
90
93
  })]
91
94
  })
92
95
  });
93
- let Z = () => {
94
- N("/components");
95
- }, Ie = (e) => {
96
- N(`/catalogs/${e.id}`);
97
- }, Le = async (e) => {
98
- M && (await Me({ variables: {
99
- id: M,
96
+ let Q = () => {
97
+ P("/components");
98
+ }, Le = (e) => {
99
+ P(`/catalogs/${e.id}`);
100
+ }, Re = async (e) => {
101
+ N && (await Ne({ variables: {
102
+ id: N,
100
103
  input: {
101
104
  name: e.name,
102
105
  description: e.description || void 0,
@@ -112,20 +115,20 @@ function j() {
112
115
  dependencies: e.dependencies ?? void 0,
113
116
  sbomData: e.sbomData ?? void 0
114
117
  }
115
- } }), B(P("component.updatedSuccess", "Component updated successfully")), setTimeout(() => B(null), 3e3));
116
- }, Re = async () => {
117
- if (M) {
118
- R(!0);
118
+ } }), V(F("component.updatedSuccess", "Component updated successfully")), setTimeout(() => V(null), 3e3));
119
+ }, ze = async () => {
120
+ if (N) {
121
+ z(!0);
119
122
  try {
120
- await Ne({ variables: { id: M } }), L(!1), N("/components");
123
+ await Pe({ variables: { id: N } }), R(!1), P("/components");
121
124
  } finally {
122
- R(!1);
125
+ z(!1);
123
126
  }
124
127
  }
125
- }, Q = async (e) => {
126
- if (M) try {
127
- let t = await Pe({ variables: {
128
- componentId: M,
128
+ }, Be = async (e) => {
129
+ if (N) try {
130
+ let t = await Fe({ variables: {
131
+ componentId: N,
129
132
  input: {
130
133
  name: e.name,
131
134
  description: e.description || void 0,
@@ -136,181 +139,186 @@ function j() {
136
139
  sourceRepositoryUrl: e.sourceRepositoryUrl
137
140
  }
138
141
  } });
139
- if (t.error && a(t.error)) {
140
- H(!1), V(!0);
142
+ if (t.error && o(t.error)) {
143
+ U(!1), H(!0);
141
144
  return;
142
145
  }
143
- H(!1), B(P("component.publishedAsTemplate", "Published as template successfully")), setTimeout(() => B(null), 3e3);
146
+ U(!1), V(F("component.publishedAsTemplate", "Published as template successfully")), setTimeout(() => V(null), 3e3);
144
147
  } catch (e) {
145
- if (a(e)) {
146
- H(!1), re(), V(!0);
148
+ if (o(e)) {
149
+ U(!1), ne(), H(!0);
147
150
  return;
148
151
  }
149
152
  throw e;
150
153
  }
151
- }, ze = {
154
+ }, Ve = {
152
155
  EXPERIMENTAL: "bg-status-warning-bg text-status-warning-text",
153
156
  ACTIVE: "bg-status-success-bg text-status-success-text",
154
157
  DEPRECATED: "bg-status-error-bg text-status-error-text",
155
158
  END_OF_LIFE: "bg-status-error-bg text-status-error-text"
156
- }, $ = Array.isArray(Y?.dependencies) ? Y.dependencies : [], Be = [
159
+ }, $ = Array.isArray(X?.dependencies) ? X.dependencies : [], He = [
157
160
  {
158
161
  id: "overview",
159
- label: P("nav.overview", "Overview"),
160
- icon: g
162
+ label: F("nav.overview", "Overview"),
163
+ icon: _
161
164
  },
162
165
  {
163
166
  id: "catalogs",
164
- label: P("component.catalogs", "Catalogs"),
165
- icon: h,
166
- badge: `${X.length}`
167
+ label: F("component.catalogs", "Catalogs"),
168
+ icon: g,
169
+ badge: `${Z.length}`
167
170
  },
168
171
  {
169
- id: "docs",
170
- label: P("component.docs", "Docs"),
172
+ id: "scorecard",
173
+ label: F("component.scorecard", "Scorecard"),
171
174
  icon: ge
172
175
  },
176
+ {
177
+ id: "docs",
178
+ label: F("component.docs", "Docs"),
179
+ icon: _e
180
+ },
173
181
  {
174
182
  id: "dependencies",
175
- label: P("component.dependencies", "Dependencies"),
176
- icon: ye,
183
+ label: F("component.dependencies", "Dependencies"),
184
+ icon: xe,
177
185
  badge: $.length > 0 ? `${$.length}` : void 0
178
186
  },
179
187
  {
180
188
  id: "template",
181
- label: P("component.template", "Template"),
182
- icon: _
189
+ label: F("component.template", "Template"),
190
+ icon: v
183
191
  },
184
192
  {
185
193
  id: "settings",
186
- label: P("common.settings", "Settings"),
187
- icon: ve
194
+ label: F("common.settings", "Settings"),
195
+ icon: be
188
196
  }
189
197
  ];
190
- return G && !Y ? /* @__PURE__ */ E(k, {
198
+ return K && !X ? /* @__PURE__ */ D(A, {
191
199
  className: "space-y-6 p-4 sm:p-6 bg-bg-surface min-h-screen",
192
- children: [/* @__PURE__ */ E("button", {
200
+ children: [/* @__PURE__ */ D("button", {
193
201
  type: "button",
194
- onClick: Z,
202
+ onClick: Q,
195
203
  className: "flex items-center gap-2 text-text-secondary hover:text-text-primary transition-colors",
196
- children: [/* @__PURE__ */ T(m, { className: "size-4" }), P("component.backToComponents", "Back to Components")]
197
- }), /* @__PURE__ */ T(oe, { variant: "detail" })]
198
- }) : K && !Y ? /* @__PURE__ */ E(k, {
204
+ children: [/* @__PURE__ */ E(h, { className: "size-4" }), F("component.backToComponents", "Back to Components")]
205
+ }), /* @__PURE__ */ E(p, { variant: "detail" })]
206
+ }) : q && !X ? /* @__PURE__ */ D(A, {
199
207
  className: "space-y-6 p-4 sm:p-6 bg-bg-surface min-h-screen",
200
- children: [/* @__PURE__ */ E("button", {
208
+ children: [/* @__PURE__ */ D("button", {
201
209
  type: "button",
202
- onClick: Z,
210
+ onClick: Q,
203
211
  className: "flex items-center gap-2 text-text-secondary hover:text-text-primary transition-colors",
204
- children: [/* @__PURE__ */ T(m, { className: "size-4" }), P("component.backToComponents", "Back to Components")]
205
- }), /* @__PURE__ */ T(c, {
206
- title: P("component.failedLoad", "Failed to load component"),
207
- message: K.message,
208
- onRetry: () => q()
212
+ children: [/* @__PURE__ */ E(h, { className: "size-4" }), F("component.backToComponents", "Back to Components")]
213
+ }), /* @__PURE__ */ E(ae, {
214
+ title: F("component.failedLoad", "Failed to load component"),
215
+ message: q.message,
216
+ onRetry: () => J()
209
217
  })]
210
- }) : Y ? /* @__PURE__ */ E(k, {
218
+ }) : X ? /* @__PURE__ */ D(A, {
211
219
  className: "space-y-6 p-4 sm:p-6 bg-bg-surface min-h-screen",
212
220
  children: [
213
- z && /* @__PURE__ */ T("div", {
221
+ B && /* @__PURE__ */ E("div", {
214
222
  className: "fixed top-4 left-4 right-4 sm:left-auto z-50 bg-status-success-bg text-status-success-text px-4 py-3 rounded-md shadow-lg",
215
- children: z
223
+ children: B
216
224
  }),
217
- /* @__PURE__ */ E("button", {
225
+ /* @__PURE__ */ D("button", {
218
226
  type: "button",
219
- onClick: Z,
227
+ onClick: Q,
220
228
  className: "flex items-center gap-2 text-text-secondary hover:text-text-primary transition-colors",
221
- children: [/* @__PURE__ */ T(m, { className: "size-4" }), P("component.backToComponents", "Back to Components")]
229
+ children: [/* @__PURE__ */ E(h, { className: "size-4" }), F("component.backToComponents", "Back to Components")]
222
230
  }),
223
- /* @__PURE__ */ T(s, {
224
- title: Y.name,
225
- description: Y.description || P("component.noDescription", "No description"),
226
- actions: /* @__PURE__ */ E("div", {
231
+ /* @__PURE__ */ E(ie, {
232
+ title: X.name,
233
+ description: X.description || F("component.noDescription", "No description"),
234
+ actions: /* @__PURE__ */ D("div", {
227
235
  className: "flex items-center gap-2 flex-wrap",
228
236
  children: [
229
- /* @__PURE__ */ T(ae, {
237
+ /* @__PURE__ */ E(f, {
230
238
  entity: "component",
231
239
  resource: {
232
- id: Y.id,
233
- name: Y.name
240
+ id: X.id,
241
+ name: X.name
234
242
  },
235
- label: P("component.share", "Share"),
243
+ label: F("component.share", "Share"),
236
244
  variant: "button"
237
245
  }),
238
- /* @__PURE__ */ T("button", {
246
+ /* @__PURE__ */ E("button", {
239
247
  type: "button",
240
- onClick: () => q(),
241
- disabled: G,
248
+ onClick: () => J(),
249
+ disabled: K,
242
250
  className: "flex items-center justify-center p-2 bg-bg-sunken text-text-primary rounded-md hover:bg-bg-sunken/80 transition-colors disabled:opacity-50",
243
- title: P("common.refresh", "Refresh"),
244
- children: /* @__PURE__ */ T(_e, { className: `size-4 ${G ? "animate-spin" : ""}` })
251
+ title: F("common.refresh", "Refresh"),
252
+ children: /* @__PURE__ */ E(ye, { className: `size-4 ${K ? "animate-spin" : ""}` })
245
253
  }),
246
- /* @__PURE__ */ T("span", {
254
+ /* @__PURE__ */ E("span", {
247
255
  className: "inline-flex items-center px-2.5 py-1 text-xs font-medium bg-bg-sunken text-text-secondary rounded",
248
- children: Y.type
256
+ children: X.type
249
257
  }),
250
- /* @__PURE__ */ T("span", {
251
- className: `inline-flex items-center px-2.5 py-1 text-xs font-medium rounded ${ze[Y.lifecycle] || "bg-bg-sunken text-text-secondary"}`,
252
- children: Y.lifecycle
258
+ /* @__PURE__ */ E("span", {
259
+ className: `inline-flex items-center px-2.5 py-1 text-xs font-medium rounded ${Ve[X.lifecycle] || "bg-bg-sunken text-text-secondary"}`,
260
+ children: X.lifecycle
253
261
  })
254
262
  ]
255
263
  })
256
264
  }),
257
- /* @__PURE__ */ E(O, {
265
+ /* @__PURE__ */ D(k, {
258
266
  stagger: .04,
259
267
  className: "grid grid-cols-2 sm:grid-cols-4 gap-3 sm:gap-4",
260
268
  children: [
261
- /* @__PURE__ */ T(D, { children: /* @__PURE__ */ T(f, {
262
- title: P("component.type", "Type"),
263
- value: Y.type,
264
- icon: /* @__PURE__ */ T(g, { className: "size-4" })
269
+ /* @__PURE__ */ E(O, { children: /* @__PURE__ */ E(u, {
270
+ title: F("component.type", "Type"),
271
+ value: X.type,
272
+ icon: /* @__PURE__ */ E(_, { className: "size-4" })
265
273
  }) }),
266
- /* @__PURE__ */ T(D, { children: /* @__PURE__ */ T(f, {
267
- title: P("component.lifecycle", "Lifecycle"),
268
- value: Y.lifecycle,
269
- icon: /* @__PURE__ */ T(v, { className: "size-4" }),
270
- variant: Y.lifecycle === "ACTIVE" ? "success" : Y.lifecycle === "DEPRECATED" || Y.lifecycle === "END_OF_LIFE" ? "error" : "warning"
274
+ /* @__PURE__ */ E(O, { children: /* @__PURE__ */ E(u, {
275
+ title: F("component.lifecycle", "Lifecycle"),
276
+ value: X.lifecycle,
277
+ icon: /* @__PURE__ */ E(ve, { className: "size-4" }),
278
+ variant: X.lifecycle === "ACTIVE" ? "success" : X.lifecycle === "DEPRECATED" || X.lifecycle === "END_OF_LIFE" ? "error" : "warning"
271
279
  }) }),
272
- /* @__PURE__ */ T(D, { children: /* @__PURE__ */ T(f, {
273
- title: P("component.version", "Version"),
274
- value: Y.version || "-",
275
- icon: /* @__PURE__ */ T(_, { className: "size-4" })
280
+ /* @__PURE__ */ E(O, { children: /* @__PURE__ */ E(u, {
281
+ title: F("component.version", "Version"),
282
+ value: X.version || "-",
283
+ icon: /* @__PURE__ */ E(v, { className: "size-4" })
276
284
  }) }),
277
- /* @__PURE__ */ T(D, { children: /* @__PURE__ */ T(f, {
278
- title: P("component.catalogs", "Catalogs"),
279
- value: X.length,
280
- icon: /* @__PURE__ */ T(h, { className: "size-4" })
285
+ /* @__PURE__ */ E(O, { children: /* @__PURE__ */ E(u, {
286
+ title: F("component.catalogs", "Catalogs"),
287
+ value: Z.length,
288
+ icon: /* @__PURE__ */ E(g, { className: "size-4" })
281
289
  }) })
282
290
  ]
283
291
  }),
284
- /* @__PURE__ */ E(d, { children: [/* @__PURE__ */ E("div", {
292
+ /* @__PURE__ */ D(l, { children: [/* @__PURE__ */ D("div", {
285
293
  className: "p-4 border-b border-border-default flex items-center gap-2",
286
- children: [/* @__PURE__ */ T(be, { className: "size-5" }), /* @__PURE__ */ T("h3", {
294
+ children: [/* @__PURE__ */ E(Se, { className: "size-5" }), /* @__PURE__ */ E("h3", {
287
295
  className: "font-semibold text-text-primary",
288
- children: P("component.tags", "Tags")
296
+ children: F("component.tags", "Tags")
289
297
  })]
290
- }), /* @__PURE__ */ T("div", {
298
+ }), /* @__PURE__ */ E("div", {
291
299
  className: "p-4",
292
- children: /* @__PURE__ */ T(l, {
300
+ children: /* @__PURE__ */ E(s, {
293
301
  entityType: "VIBECONTROLS_COMPONENT",
294
- entityId: Y.id
302
+ entityId: X.id
295
303
  })
296
304
  })] }),
297
- /* @__PURE__ */ T("div", {
305
+ /* @__PURE__ */ E("div", {
298
306
  className: "border-b border-border-default",
299
- children: /* @__PURE__ */ T("nav", {
307
+ children: /* @__PURE__ */ E("nav", {
300
308
  className: "flex gap-1 -mb-px overflow-x-auto pb-1",
301
- "aria-label": P("component.tabsAriaLabel", "Component tabs"),
302
- children: Be.map((e) => {
303
- let t = e.icon, n = F === e.id;
304
- return /* @__PURE__ */ E("button", {
309
+ "aria-label": F("component.tabsAriaLabel", "Component tabs"),
310
+ children: He.map((e) => {
311
+ let t = e.icon, n = I === e.id;
312
+ return /* @__PURE__ */ D("button", {
305
313
  type: "button",
306
- onClick: () => Te(e.id),
314
+ onClick: () => Ee(e.id),
307
315
  className: `flex shrink-0 items-center gap-1.5 px-3 py-2.5 text-xs sm:gap-2 sm:px-4 sm:text-sm font-medium border-b-2 transition-colors whitespace-nowrap ${n ? "border-action-primary-bg text-action-primary-text" : "border-transparent text-text-secondary hover:text-text-primary hover:border-border-default"}`,
308
316
  "aria-selected": n,
309
317
  role: "tab",
310
318
  children: [
311
- /* @__PURE__ */ T(t, { className: "size-4" }),
319
+ /* @__PURE__ */ E(t, { className: "size-4" }),
312
320
  e.label,
313
- e.badge && /* @__PURE__ */ T("span", {
321
+ e.badge && /* @__PURE__ */ E("span", {
314
322
  className: `hidden rounded-full px-1.5 py-0.5 text-[10px] sm:inline-flex sm:text-xs ${n ? "bg-action-primary-bg/10 text-action-primary-bg" : "bg-bg-sunken text-text-muted"}`,
315
323
  children: e.badge
316
324
  })
@@ -319,10 +327,10 @@ function j() {
319
327
  })
320
328
  })
321
329
  }),
322
- /* @__PURE__ */ E(C, {
330
+ /* @__PURE__ */ D(w, {
323
331
  mode: "wait",
324
332
  children: [
325
- F === "overview" && /* @__PURE__ */ E(w.div, {
333
+ I === "overview" && /* @__PURE__ */ D(T.div, {
326
334
  initial: {
327
335
  opacity: 0,
328
336
  y: 8
@@ -338,90 +346,90 @@ function j() {
338
346
  transition: { duration: .2 },
339
347
  className: "space-y-6",
340
348
  children: [
341
- Y.description && /* @__PURE__ */ T(d, { children: /* @__PURE__ */ T("div", {
349
+ X.description && /* @__PURE__ */ E(l, { children: /* @__PURE__ */ E("div", {
342
350
  className: "p-4",
343
- children: /* @__PURE__ */ T("p", {
351
+ children: /* @__PURE__ */ E("p", {
344
352
  className: "text-text-primary",
345
- children: Y.description
353
+ children: X.description
346
354
  })
347
355
  }) }),
348
- /* @__PURE__ */ E(d, { children: [/* @__PURE__ */ T("div", {
356
+ /* @__PURE__ */ D(l, { children: [/* @__PURE__ */ E("div", {
349
357
  className: "p-4 border-b border-border-default",
350
- children: /* @__PURE__ */ T("h3", {
358
+ children: /* @__PURE__ */ E("h3", {
351
359
  className: "font-semibold text-text-primary",
352
- children: P("component.metadata", "Metadata")
360
+ children: F("component.metadata", "Metadata")
353
361
  })
354
- }), /* @__PURE__ */ T("div", {
362
+ }), /* @__PURE__ */ E("div", {
355
363
  className: "p-4",
356
- children: /* @__PURE__ */ E("div", {
364
+ children: /* @__PURE__ */ D("div", {
357
365
  className: "grid grid-cols-1 sm:grid-cols-2 gap-4 text-sm",
358
366
  children: [
359
- /* @__PURE__ */ E("div", { children: [/* @__PURE__ */ T("p", {
367
+ /* @__PURE__ */ D("div", { children: [/* @__PURE__ */ E("p", {
360
368
  className: "text-text-secondary",
361
- children: P("component.ownerNameLabel", "Owner")
362
- }), /* @__PURE__ */ T("p", {
369
+ children: F("component.ownerNameLabel", "Owner")
370
+ }), /* @__PURE__ */ E("p", {
363
371
  className: "font-medium text-text-primary",
364
- children: Y.ownerName || P("common.unset", "Unset")
372
+ children: X.ownerName || F("common.unset", "Unset")
365
373
  })] }),
366
- /* @__PURE__ */ E("div", { children: [/* @__PURE__ */ T("p", {
374
+ /* @__PURE__ */ D("div", { children: [/* @__PURE__ */ E("p", {
367
375
  className: "text-text-secondary",
368
- children: P("component.languageLabel", "Language")
369
- }), /* @__PURE__ */ T("p", {
376
+ children: F("component.languageLabel", "Language")
377
+ }), /* @__PURE__ */ E("p", {
370
378
  className: "font-medium text-text-primary",
371
- children: Y.language || P("common.unset", "Unset")
379
+ children: X.language || F("common.unset", "Unset")
372
380
  })] }),
373
- /* @__PURE__ */ E("div", { children: [/* @__PURE__ */ T("p", {
381
+ /* @__PURE__ */ D("div", { children: [/* @__PURE__ */ E("p", {
374
382
  className: "text-text-secondary",
375
- children: P("component.frameworkLabel", "Framework")
376
- }), /* @__PURE__ */ T("p", {
383
+ children: F("component.frameworkLabel", "Framework")
384
+ }), /* @__PURE__ */ E("p", {
377
385
  className: "font-medium text-text-primary",
378
- children: Y.framework || P("common.unset", "Unset")
386
+ children: X.framework || F("common.unset", "Unset")
379
387
  })] }),
380
- /* @__PURE__ */ E("div", { children: [/* @__PURE__ */ T("p", {
388
+ /* @__PURE__ */ D("div", { children: [/* @__PURE__ */ E("p", {
381
389
  className: "text-text-secondary",
382
- children: P("component.versionLabel", "Version")
383
- }), /* @__PURE__ */ T("p", {
390
+ children: F("component.versionLabel", "Version")
391
+ }), /* @__PURE__ */ E("p", {
384
392
  className: "font-medium text-text-primary",
385
- children: Y.version || P("common.unset", "Unset")
393
+ children: X.version || F("common.unset", "Unset")
386
394
  })] }),
387
- Y.repositoryUrl && /* @__PURE__ */ E("div", {
395
+ X.repositoryUrl && /* @__PURE__ */ D("div", {
388
396
  className: "sm:col-span-2",
389
- children: [/* @__PURE__ */ T("p", {
397
+ children: [/* @__PURE__ */ E("p", {
390
398
  className: "text-text-secondary",
391
- children: P("component.repository", "Repository")
392
- }), /* @__PURE__ */ T("a", {
393
- href: Y.repositoryUrl,
399
+ children: F("component.repository", "Repository")
400
+ }), /* @__PURE__ */ E("a", {
401
+ href: X.repositoryUrl,
394
402
  target: "_blank",
395
403
  rel: "noopener noreferrer",
396
404
  className: "font-medium text-action-primary-bg hover:underline break-all",
397
- children: Y.repositoryUrl
405
+ children: X.repositoryUrl
398
406
  })]
399
407
  }),
400
- /* @__PURE__ */ E("div", { children: [/* @__PURE__ */ T("p", {
408
+ /* @__PURE__ */ D("div", { children: [/* @__PURE__ */ E("p", {
401
409
  className: "text-text-secondary",
402
- children: P("common.created", "Created")
403
- }), /* @__PURE__ */ T("p", {
410
+ children: F("common.created", "Created")
411
+ }), /* @__PURE__ */ E("p", {
404
412
  className: "font-medium text-text-primary",
405
- children: new Date(Y.createdAt).toLocaleDateString()
413
+ children: new Date(X.createdAt).toLocaleDateString()
406
414
  })] }),
407
- /* @__PURE__ */ E("div", { children: [/* @__PURE__ */ T("p", {
415
+ /* @__PURE__ */ D("div", { children: [/* @__PURE__ */ E("p", {
408
416
  className: "text-text-secondary",
409
- children: P("common.updated", "Updated")
410
- }), /* @__PURE__ */ T("p", {
417
+ children: F("common.updated", "Updated")
418
+ }), /* @__PURE__ */ E("p", {
411
419
  className: "font-medium text-text-primary",
412
- children: new Date(Y.updatedAt).toLocaleDateString()
420
+ children: new Date(X.updatedAt).toLocaleDateString()
413
421
  })] })
414
422
  ]
415
423
  })
416
424
  })] }),
417
- Y.tags?.length > 0 && /* @__PURE__ */ T(d, { children: /* @__PURE__ */ E("div", {
425
+ X.tags?.length > 0 && /* @__PURE__ */ E(l, { children: /* @__PURE__ */ D("div", {
418
426
  className: "p-4",
419
- children: [/* @__PURE__ */ T("h3", {
427
+ children: [/* @__PURE__ */ E("h3", {
420
428
  className: "font-semibold text-text-primary mb-3",
421
- children: P("component.tags", "Tags")
422
- }), /* @__PURE__ */ T("div", {
429
+ children: F("component.tags", "Tags")
430
+ }), /* @__PURE__ */ E("div", {
423
431
  className: "flex flex-wrap gap-2",
424
- children: Y.tags.map((e) => /* @__PURE__ */ T("span", {
432
+ children: X.tags.map((e) => /* @__PURE__ */ E("span", {
425
433
  className: "px-2.5 py-1 text-sm bg-bg-sunken text-text-secondary rounded-md",
426
434
  children: e
427
435
  }, e))
@@ -429,7 +437,7 @@ function j() {
429
437
  }) })
430
438
  ]
431
439
  }, "overview"),
432
- F === "catalogs" && /* @__PURE__ */ E(w.div, {
440
+ I === "catalogs" && /* @__PURE__ */ D(T.div, {
433
441
  initial: {
434
442
  opacity: 0,
435
443
  y: 8
@@ -444,41 +452,61 @@ function j() {
444
452
  },
445
453
  transition: { duration: .2 },
446
454
  className: "space-y-4",
447
- children: [/* @__PURE__ */ E("div", {
455
+ children: [/* @__PURE__ */ D("div", {
448
456
  className: "flex items-center justify-between",
449
- children: [/* @__PURE__ */ E("p", {
457
+ children: [/* @__PURE__ */ D("p", {
450
458
  className: "text-sm text-text-secondary",
451
459
  children: [
452
- X.length,
460
+ Z.length,
453
461
  " ",
454
- P("component.catalogsContaining", "catalogs containing this component")
462
+ F("component.catalogsContaining", "catalogs containing this component")
455
463
  ]
456
- }), /* @__PURE__ */ E("button", {
464
+ }), /* @__PURE__ */ D("button", {
457
465
  type: "button",
458
- onClick: () => W(!0),
466
+ onClick: () => G(!0),
459
467
  className: "flex items-center gap-2 px-3 py-2 text-sm bg-action-primary-bg text-action-primary-text rounded-md hover:bg-action-primary-bg-hover transition-colors",
460
- children: [/* @__PURE__ */ T(y, { className: "size-4" }), P("component.addToCatalog", "Add to Catalog")]
468
+ children: [/* @__PURE__ */ E(y, { className: "size-4" }), F("component.addToCatalog", "Add to Catalog")]
461
469
  })]
462
- }), X.length > 0 ? /* @__PURE__ */ T(O, {
470
+ }), Z.length > 0 ? /* @__PURE__ */ E(k, {
463
471
  stagger: .04,
464
472
  className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4",
465
- children: X.map((e) => /* @__PURE__ */ T(D, { children: /* @__PURE__ */ T(de, {
473
+ children: Z.map((e) => /* @__PURE__ */ E(O, { children: /* @__PURE__ */ E(de, {
466
474
  catalog: e,
467
- onOpen: Ie
475
+ onOpen: Le
468
476
  }) }, e.id))
469
- }) : /* @__PURE__ */ T(u, {
470
- icon: /* @__PURE__ */ T(h, { className: "size-8 text-text-secondary" }),
471
- title: P("component.noCatalogs", "Not in any catalogs"),
472
- description: P("component.noCatalogsDescription", "This component has not been added to any catalogs yet"),
473
- action: /* @__PURE__ */ E("button", {
477
+ }) : /* @__PURE__ */ E(c, {
478
+ icon: /* @__PURE__ */ E(g, { className: "size-8 text-text-secondary" }),
479
+ title: F("component.noCatalogs", "Not in any catalogs"),
480
+ description: F("component.noCatalogsDescription", "This component has not been added to any catalogs yet"),
481
+ action: /* @__PURE__ */ D("button", {
474
482
  type: "button",
475
- onClick: () => W(!0),
483
+ onClick: () => G(!0),
476
484
  className: "flex items-center gap-2 px-4 py-2 bg-action-primary-bg text-action-primary-text rounded-md hover:bg-action-primary-bg-hover transition-colors",
477
- children: [/* @__PURE__ */ T(y, { className: "size-4" }), P("component.addToCatalog", "Add to Catalog")]
485
+ children: [/* @__PURE__ */ E(y, { className: "size-4" }), F("component.addToCatalog", "Add to Catalog")]
478
486
  })
479
487
  })]
480
488
  }, "catalogs"),
481
- F === "docs" && /* @__PURE__ */ T(w.div, {
489
+ I === "scorecard" && /* @__PURE__ */ E(T.div, {
490
+ initial: {
491
+ opacity: 0,
492
+ y: 8
493
+ },
494
+ animate: {
495
+ opacity: 1,
496
+ y: 0
497
+ },
498
+ exit: {
499
+ opacity: 0,
500
+ y: -8
501
+ },
502
+ transition: { duration: .2 },
503
+ className: "space-y-6",
504
+ children: /* @__PURE__ */ E(ce, {
505
+ ownerType: "COMPONENT",
506
+ ownerId: N || ""
507
+ })
508
+ }, "scorecard"),
509
+ I === "docs" && /* @__PURE__ */ E(T.div, {
482
510
  initial: {
483
511
  opacity: 0,
484
512
  y: 8
@@ -493,12 +521,12 @@ function j() {
493
521
  },
494
522
  transition: { duration: .2 },
495
523
  className: "space-y-6",
496
- children: /* @__PURE__ */ T(ce, {
524
+ children: /* @__PURE__ */ E(se, {
497
525
  ownerType: "COMPONENT",
498
- ownerId: M || ""
526
+ ownerId: N || ""
499
527
  })
500
528
  }, "docs"),
501
- F === "dependencies" && /* @__PURE__ */ T(w.div, {
529
+ I === "dependencies" && /* @__PURE__ */ E(T.div, {
502
530
  initial: {
503
531
  opacity: 0,
504
532
  y: 8
@@ -512,13 +540,13 @@ function j() {
512
540
  y: -8
513
541
  },
514
542
  transition: { duration: .2 },
515
- children: /* @__PURE__ */ T(ue, {
516
- componentName: Y.name,
517
- componentType: Y.type,
543
+ children: /* @__PURE__ */ E(ue, {
544
+ componentName: X.name,
545
+ componentType: X.type,
518
546
  dependencies: $
519
547
  })
520
548
  }, "dependencies"),
521
- F === "template" && /* @__PURE__ */ T(w.div, {
549
+ I === "template" && /* @__PURE__ */ E(T.div, {
522
550
  initial: {
523
551
  opacity: 0,
524
552
  y: 8
@@ -533,44 +561,44 @@ function j() {
533
561
  },
534
562
  transition: { duration: .2 },
535
563
  className: "space-y-4",
536
- children: (Y.templates?.length ?? 0) === 0 ? /* @__PURE__ */ T(d, {
564
+ children: (X.templates?.length ?? 0) === 0 ? /* @__PURE__ */ E(l, {
537
565
  padding: "lg",
538
- children: /* @__PURE__ */ E("div", {
566
+ children: /* @__PURE__ */ D("div", {
539
567
  className: "flex flex-col items-center justify-center py-12 text-center",
540
568
  children: [
541
- /* @__PURE__ */ T(_, { className: "size-12 text-text-muted mb-4" }),
542
- /* @__PURE__ */ T("h3", {
569
+ /* @__PURE__ */ E(v, { className: "size-12 text-text-muted mb-4" }),
570
+ /* @__PURE__ */ E("h3", {
543
571
  className: "text-lg font-semibold text-text-primary mb-2",
544
- children: P("component.template", "Publish as Template")
572
+ children: F("component.template", "Publish as Template")
545
573
  }),
546
- /* @__PURE__ */ T("p", {
574
+ /* @__PURE__ */ E("p", {
547
575
  className: "text-sm text-text-secondary max-w-md mb-6",
548
- children: P("component.publishDescription", "Turn this component into a reusable template. Others can clone it and fill in configuration variables to create new components.")
576
+ children: F("component.publishDescription", "Turn this component into a reusable template. Others can clone it and fill in configuration variables to create new components.")
549
577
  }),
550
- /* @__PURE__ */ E("button", {
578
+ /* @__PURE__ */ D("button", {
551
579
  type: "button",
552
- onClick: () => H(!0),
580
+ onClick: () => U(!0),
553
581
  className: "flex items-center gap-2 px-4 py-2 bg-action-primary-bg text-action-primary-text rounded-md hover:bg-action-primary-bg-hover transition-colors",
554
- children: [/* @__PURE__ */ T(b, { className: "size-4" }), P("component.publishAsTemplate", "Publish as Template")]
582
+ children: [/* @__PURE__ */ E(b, { className: "size-4" }), F("component.publishAsTemplate", "Publish as Template")]
555
583
  })
556
584
  ]
557
585
  })
558
- }) : /* @__PURE__ */ E(d, { children: [/* @__PURE__ */ T("div", {
586
+ }) : /* @__PURE__ */ D(l, { children: [/* @__PURE__ */ E("div", {
559
587
  className: "p-4 border-b border-border-default",
560
- children: /* @__PURE__ */ T("h3", {
588
+ children: /* @__PURE__ */ E("h3", {
561
589
  className: "font-semibold text-text-primary",
562
590
  children: "Published Templates"
563
591
  })
564
- }), /* @__PURE__ */ E("div", {
592
+ }), /* @__PURE__ */ D("div", {
565
593
  className: "p-4 space-y-3",
566
- children: [Y.templates.map((e) => /* @__PURE__ */ E("div", {
594
+ children: [X.templates.map((e) => /* @__PURE__ */ D("div", {
567
595
  className: "flex items-center justify-between p-3 bg-bg-sunken rounded-lg",
568
- children: [/* @__PURE__ */ E("div", {
596
+ children: [/* @__PURE__ */ D("div", {
569
597
  className: "flex items-center gap-3",
570
- children: [/* @__PURE__ */ T(_, { className: "size-5 text-action-primary-bg" }), /* @__PURE__ */ E("div", { children: [/* @__PURE__ */ T("p", {
598
+ children: [/* @__PURE__ */ E(v, { className: "size-5 text-action-primary-bg" }), /* @__PURE__ */ D("div", { children: [/* @__PURE__ */ E("p", {
571
599
  className: "text-sm font-medium text-text-primary",
572
600
  children: e.name
573
- }), /* @__PURE__ */ E("p", {
601
+ }), /* @__PURE__ */ D("p", {
574
602
  className: "text-xs text-text-muted",
575
603
  children: [
576
604
  e.category,
@@ -578,21 +606,21 @@ function j() {
578
606
  e.version || "—"
579
607
  ]
580
608
  })] })]
581
- }), /* @__PURE__ */ T("button", {
609
+ }), /* @__PURE__ */ E("button", {
582
610
  type: "button",
583
- onClick: () => N(`/templates/${e.id}`),
611
+ onClick: () => P(`/templates/${e.id}`),
584
612
  className: "text-xs text-action-primary-bg hover:underline",
585
613
  children: "View Template →"
586
614
  })]
587
- }, e.id)), /* @__PURE__ */ E("button", {
615
+ }, e.id)), /* @__PURE__ */ D("button", {
588
616
  type: "button",
589
- onClick: () => H(!0),
617
+ onClick: () => U(!0),
590
618
  className: "flex items-center gap-2 px-3 py-2 text-sm text-text-secondary border border-dashed border-border-default hover:border-border-strong rounded-lg w-full justify-center transition-colors",
591
- children: [/* @__PURE__ */ T(b, { className: "size-4" }), "Update template"]
619
+ children: [/* @__PURE__ */ E(b, { className: "size-4" }), "Update template"]
592
620
  })]
593
621
  })] })
594
622
  }, "template"),
595
- F === "settings" && /* @__PURE__ */ T(w.div, {
623
+ I === "settings" && /* @__PURE__ */ E(T.div, {
596
624
  initial: {
597
625
  opacity: 0,
598
626
  y: 8
@@ -606,39 +634,39 @@ function j() {
606
634
  y: -8
607
635
  },
608
636
  transition: { duration: .2 },
609
- children: /* @__PURE__ */ E("div", {
637
+ children: /* @__PURE__ */ D("div", {
610
638
  className: "space-y-4",
611
- children: [/* @__PURE__ */ E(d, {
639
+ children: [/* @__PURE__ */ D(l, {
612
640
  padding: "lg",
613
- children: [/* @__PURE__ */ T("h3", {
641
+ children: [/* @__PURE__ */ E("h3", {
614
642
  className: "font-semibold text-text-primary mb-4",
615
- children: P("component.editComponent", "Edit Component")
616
- }), /* @__PURE__ */ T("button", {
643
+ children: F("component.editComponent", "Edit Component")
644
+ }), /* @__PURE__ */ E("button", {
617
645
  type: "button",
618
- onClick: () => I(!0),
646
+ onClick: () => L(!0),
619
647
  className: "px-4 py-2 bg-action-primary-bg text-action-primary-text rounded-md hover:bg-action-primary-bg-hover transition-colors",
620
- children: P("component.editDetails", "Edit Details")
648
+ children: F("component.editDetails", "Edit Details")
621
649
  })]
622
- }), /* @__PURE__ */ E(d, {
650
+ }), /* @__PURE__ */ D(l, {
623
651
  padding: "lg",
624
652
  children: [
625
- /* @__PURE__ */ T("h3", {
653
+ /* @__PURE__ */ E("h3", {
626
654
  className: "font-semibold text-status-error-text mb-2",
627
- children: P("component.dangerZone", "Danger Zone")
655
+ children: F("component.dangerZone", "Danger Zone")
628
656
  }),
629
- /* @__PURE__ */ T("p", {
657
+ /* @__PURE__ */ E("p", {
630
658
  className: "text-sm text-text-secondary mb-4",
631
- children: P("component.deleteWarning", "Deleting this component will remove it from all catalogs and break any templates derived from it. This cannot be undone.")
659
+ children: F("component.deleteWarning", "Deleting this component will remove it from all catalogs and break any templates derived from it. This cannot be undone.")
632
660
  }),
633
- /* @__PURE__ */ E("button", {
661
+ /* @__PURE__ */ D("button", {
634
662
  type: "button",
635
663
  "data-testid": "component-delete-button",
636
- onClick: () => L(!0),
664
+ onClick: () => R(!0),
637
665
  className: "inline-flex items-center gap-2 px-4 py-2 bg-status-error-bg text-status-error-text rounded-md hover:opacity-90 transition-opacity",
638
- children: [/* @__PURE__ */ T(xe, {
666
+ children: [/* @__PURE__ */ E(Ce, {
639
667
  className: "size-4",
640
668
  "aria-hidden": "true"
641
- }), P("component.deleteComponent", "Delete Component")]
669
+ }), F("component.deleteComponent", "Delete Component")]
642
670
  })
643
671
  ]
644
672
  })]
@@ -646,56 +674,56 @@ function j() {
646
674
  }, "settings")
647
675
  ]
648
676
  }),
649
- /* @__PURE__ */ T(le, {
650
- isOpen: Ee,
651
- onClose: () => I(!1),
652
- onSubmit: Le,
677
+ /* @__PURE__ */ E(le, {
678
+ isOpen: De,
679
+ onClose: () => L(!1),
680
+ onSubmit: Re,
653
681
  initialData: {
654
- name: Y.name,
655
- description: Y.description || "",
656
- type: Y.type,
657
- lifecycle: Y.lifecycle,
658
- language: Y.language || "",
659
- framework: Y.framework || "",
660
- version: Y.version || "",
661
- ownerName: Y.ownerName || "",
662
- tags: Y.tags || [],
663
- repositoryUrl: Y.repositoryUrl || "",
664
- documentationUrl: Y.documentationUrl || "",
665
- dependencies: Array.isArray(Y.dependencies) ? Y.dependencies : null,
666
- sbomData: Y.sbomData && typeof Y.sbomData == "object" ? Y.sbomData : null
682
+ name: X.name,
683
+ description: X.description || "",
684
+ type: X.type,
685
+ lifecycle: X.lifecycle,
686
+ language: X.language || "",
687
+ framework: X.framework || "",
688
+ version: X.version || "",
689
+ ownerName: X.ownerName || "",
690
+ tags: X.tags || [],
691
+ repositoryUrl: X.repositoryUrl || "",
692
+ documentationUrl: X.documentationUrl || "",
693
+ dependencies: Array.isArray(X.dependencies) ? X.dependencies : null,
694
+ sbomData: X.sbomData && typeof X.sbomData == "object" ? X.sbomData : null
667
695
  },
668
- title: P("component.editComponent", "Edit Component")
696
+ title: F("component.editComponent", "Edit Component")
669
697
  }),
670
- /* @__PURE__ */ T(te, {
671
- isOpen: De,
672
- onClose: () => L(!1),
673
- onConfirm: Re,
674
- title: P("component.deleteComponent", "Delete Component"),
675
- message: P("component.deleteConfirmMessage", `Are you sure you want to delete "${Y.name}"? This action cannot be undone.`),
676
- confirmLabel: P("common.delete", "Delete"),
698
+ /* @__PURE__ */ E(a, {
699
+ isOpen: Oe,
700
+ onClose: () => R(!1),
701
+ onConfirm: ze,
702
+ title: F("component.deleteComponent", "Delete Component"),
703
+ message: F("component.deleteConfirmMessage", `Are you sure you want to delete "${X.name}"? This action cannot be undone.`),
704
+ confirmLabel: F("common.delete", "Delete"),
677
705
  variant: "danger",
678
- isLoading: Oe
706
+ isLoading: ke
679
707
  }),
680
- /* @__PURE__ */ T(ne, {
681
- isOpen: ke,
682
- onClose: () => V(!1),
708
+ /* @__PURE__ */ E(te, {
709
+ isOpen: Ae,
710
+ onClose: () => H(!1),
683
711
  onConfirm: () => {
684
- V(!1), N("/billing/plans");
712
+ H(!1), P("/billing/plans");
685
713
  },
686
714
  title: "Template Quota Reached",
687
715
  message: "You've reached the maximum number of published templates on your current plan. Upgrade your plan or purchase an add-on to publish more templates."
688
716
  }),
689
- Ae && /* @__PURE__ */ T(fe, {
690
- componentName: Y.name,
691
- componentRepositoryUrl: Y.repositoryUrl,
692
- onClose: () => H(!1),
693
- onSubmit: Q
717
+ je && /* @__PURE__ */ E(fe, {
718
+ componentName: X.name,
719
+ componentRepositoryUrl: X.repositoryUrl,
720
+ onClose: () => U(!1),
721
+ onSubmit: Be
694
722
  }),
695
- U && /* @__PURE__ */ T("div", {
723
+ W && /* @__PURE__ */ E("div", {
696
724
  className: "fixed inset-0 flex items-center justify-center z-50 p-4",
697
725
  style: { backgroundColor: "rgba(0,0,0,0.55)" },
698
- children: /* @__PURE__ */ E(w.div, {
726
+ children: /* @__PURE__ */ D(T.div, {
699
727
  initial: {
700
728
  opacity: 0,
701
729
  scale: .95
@@ -705,54 +733,54 @@ function j() {
705
733
  scale: 1
706
734
  },
707
735
  className: "bg-bg-surface rounded-lg w-full max-w-md shadow-xl",
708
- children: [/* @__PURE__ */ E("div", {
736
+ children: [/* @__PURE__ */ D("div", {
709
737
  className: "flex items-center justify-between px-4 py-3 border-b border-border-default",
710
- children: [/* @__PURE__ */ T("h2", {
738
+ children: [/* @__PURE__ */ E("h2", {
711
739
  className: "text-base font-semibold text-text-primary",
712
- children: P("component.addToCatalog", "Add to Catalog")
713
- }), /* @__PURE__ */ T("button", {
740
+ children: F("component.addToCatalog", "Add to Catalog")
741
+ }), /* @__PURE__ */ E("button", {
714
742
  type: "button",
715
- onClick: () => W(!1),
743
+ onClick: () => G(!1),
716
744
  className: "p-1.5 text-text-secondary hover:text-text-primary rounded-md hover:bg-bg-sunken transition-colors",
717
- children: /* @__PURE__ */ T(Se, { className: "size-4" })
745
+ children: /* @__PURE__ */ E(x, { className: "size-4" })
718
746
  })]
719
- }), /* @__PURE__ */ T("div", {
747
+ }), /* @__PURE__ */ E("div", {
720
748
  className: "p-2 max-h-80 overflow-y-auto",
721
- children: (J?.vibecontrolsCatalogs?.items ?? []).length === 0 ? /* @__PURE__ */ E("p", {
749
+ children: (Y?.vibecontrolsCatalogs?.items ?? []).length === 0 ? /* @__PURE__ */ D("p", {
722
750
  className: "text-sm text-text-secondary text-center py-6",
723
751
  children: [
724
752
  "No catalogs found.",
725
753
  " ",
726
- /* @__PURE__ */ T("button", {
754
+ /* @__PURE__ */ E("button", {
727
755
  type: "button",
728
756
  onClick: () => {
729
- W(!1), N("/catalogs");
757
+ G(!1), P("/catalogs");
730
758
  },
731
759
  className: "text-action-primary-bg hover:underline",
732
760
  children: "Create one first."
733
761
  })
734
762
  ]
735
- }) : (J?.vibecontrolsCatalogs?.items ?? []).map((e) => {
736
- let t = X.some((t) => t.id === e.id);
737
- return /* @__PURE__ */ E("button", {
763
+ }) : (Y?.vibecontrolsCatalogs?.items ?? []).map((e) => {
764
+ let t = Z.some((t) => t.id === e.id);
765
+ return /* @__PURE__ */ D("button", {
738
766
  type: "button",
739
767
  disabled: t,
740
768
  onClick: async () => {
741
- if (!(!M || t)) try {
742
- await Fe({ variables: {
769
+ if (!(!N || t)) try {
770
+ await Ie({ variables: {
743
771
  catalogId: e.id,
744
- componentId: M
745
- } }), W(!1), B(`Added to ${e.name}`), setTimeout(() => B(null), 3e3);
772
+ componentId: N
773
+ } }), G(!1), V(`Added to ${e.name}`), setTimeout(() => V(null), 3e3);
746
774
  } catch {}
747
775
  },
748
776
  className: `flex items-center justify-between w-full px-3 py-2.5 text-left rounded-md transition-colors ${t ? "opacity-40 cursor-not-allowed" : "hover:bg-bg-sunken cursor-pointer"}`,
749
- children: [/* @__PURE__ */ E("div", {
777
+ children: [/* @__PURE__ */ D("div", {
750
778
  className: "flex items-center gap-2",
751
- children: [/* @__PURE__ */ T(h, { className: "size-4 text-action-primary-bg flex-shrink-0" }), /* @__PURE__ */ T("span", {
779
+ children: [/* @__PURE__ */ E(g, { className: "size-4 text-action-primary-bg flex-shrink-0" }), /* @__PURE__ */ E("span", {
752
780
  className: "text-sm text-text-primary",
753
781
  children: e.name
754
782
  })]
755
- }), t && /* @__PURE__ */ T("span", {
783
+ }), t && /* @__PURE__ */ E("span", {
756
784
  className: "text-xs text-text-muted",
757
785
  children: "already added"
758
786
  })]
@@ -762,27 +790,27 @@ function j() {
762
790
  })
763
791
  })
764
792
  ]
765
- }) : /* @__PURE__ */ E(k, {
793
+ }) : /* @__PURE__ */ D(A, {
766
794
  className: "space-y-6 p-4 sm:p-6 bg-bg-surface min-h-screen",
767
- children: [/* @__PURE__ */ E("button", {
795
+ children: [/* @__PURE__ */ D("button", {
768
796
  type: "button",
769
- onClick: Z,
797
+ onClick: Q,
770
798
  className: "flex items-center gap-2 text-text-secondary hover:text-text-primary transition-colors",
771
- children: [/* @__PURE__ */ T(m, { className: "size-4" }), P("component.backToComponents", "Back to Components")]
772
- }), /* @__PURE__ */ T(u, {
773
- icon: /* @__PURE__ */ T(g, { className: "size-8 text-text-secondary" }),
774
- title: P("component.notFound", "Component not found"),
775
- description: `No component with ID "${M}" exists`,
776
- action: /* @__PURE__ */ T("button", {
799
+ children: [/* @__PURE__ */ E(h, { className: "size-4" }), F("component.backToComponents", "Back to Components")]
800
+ }), /* @__PURE__ */ E(c, {
801
+ icon: /* @__PURE__ */ E(_, { className: "size-8 text-text-secondary" }),
802
+ title: F("component.notFound", "Component not found"),
803
+ description: `No component with ID "${N}" exists`,
804
+ action: /* @__PURE__ */ E("button", {
777
805
  type: "button",
778
- onClick: Z,
806
+ onClick: Q,
779
807
  className: "px-4 py-2 bg-action-primary-bg text-action-primary-text rounded-md hover:bg-action-primary-bg-hover transition-colors",
780
- children: P("component.backToComponents", "Back to Components")
808
+ children: F("component.backToComponents", "Back to Components")
781
809
  })
782
810
  })]
783
811
  });
784
812
  }
785
813
  //#endregion
786
- export { j as ComponentDetailPage };
814
+ export { M as ComponentDetailPage };
787
815
 
788
816
  //# sourceMappingURL=ComponentDetailPage.js.map