@storyshelf/app 0.6.2 → 0.8.0

package/dist/pages/settings-design-links.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"settings-design-links.mjs","names":[],"sources":["../../src/pages/settings-design-links.tsx"],"sourcesContent":["import type { HtmlEscapedString } from \"hono/utils/html\";\nimport { Button, Card, Field, FormActions, Meta, SectionTitle, Table } from \"../ui/components.tsx\";\nimport { csrfField } from \"../ui/csrf-field.tsx\";\n\n/* eslint-disable promise-function-async -- Hono JSX components return HtmlEscapedString | Promise<HtmlEscapedString> */\n\ntype Rendered = HtmlEscapedString | Promise<HtmlEscapedString>;\n\n/** Field-level and page-level errors of the Design settings forms. */\nexport type DesignFormState = { errors?: Record<string, string>; globalError?: string };\n\n/** A project-level design file link (shown in the library header). */\nexport interface SettingsDesignFile {\n  id: string;\n  label: string;\n  url: string;\n}\n\n/** A manual `import_path → URL` component mapping. */\nexport interface SettingsDesignComponent {\n  id: string;\n  importPath: string;\n  url: string;\n}\n\nexport function FilesCard(props: {\n  base: string;\n  files: SettingsDesignFile[];\n  isAdmin: boolean;\n  formState?: DesignFormState;\n  urlHint: string;\n}): Rendered {\n  const { base, files, isAdmin, formState, urlHint } = props;\n  return (\n    <Card>\n      <SectionTitle>Design files</SectionTitle>\n      <Meta>\n        Design files for this project. They appear in the library header; individual stories link to\n        a design through their component (see below) or their story parameters.\n      </Meta>\n      <LinkTable\n        rows={files.map((file) => ({\n          id: file.id,\n          key: file.label,\n          url: file.url,\n          removeAction: isAdmin ? `${base}/files/${file.id}/delete` : undefined,\n        }))}\n        keyHeading=\"Label\"\n        confirm=\"Remove this design file?\"\n      />\n      {files.length === 0 ? <Meta>No design files linked.</Meta> : null}\n      {isAdmin ? (\n        <AddFileForm base={base} urlHint={urlHint} error={formState?.errors?.[\"file\"]} />\n      ) : null}\n    </Card>\n  );\n}\n\n/** Rows of `key → design link` with an optional remove action. */\nfunction LinkTable(props: {\n  rows: { id: string; key: string; url: string; removeAction?: string }[];\n  keyHeading: string;\n  confirm: string;\n}): Rendered {\n  return (\n    <Table>\n      <table>\n        <thead>\n          <tr>\n            <th>{props.keyHeading}</th>\n            <th>Design</th>\n            <th>\n              <span class=\"visually-hidden\">Actions</span>\n            </th>\n          </tr>\n        </thead>\n        <tbody>\n          {props.rows.map((row): Rendered => (\n            <tr key={row.id}>\n              <td>{row.key}</td>\n              <td class=\"truncate max-w-cell\" title={row.url}>\n                <a href={row.url} target=\"_blank\" rel=\"noopener noreferrer\">\n                  {row.url}\n                </a>\n              </td>\n              <td>\n                {row.removeAction ? (\n                  <RemoveForm\n                    action={row.removeAction}\n                    confirm={props.confirm}\n                    label={`Remove ${row.key}`}\n                  />\n                ) : null}\n              </td>\n            </tr>\n          ))}\n        </tbody>\n      </table>\n    </Table>\n  );\n}\n\nfunction AddFileForm(props: { base: string; urlHint: string; error?: string }): Rendered {\n  const action = `${props.base}/files`;\n  return (\n    <form method=\"post\" action={action} hx-post={action} hx-target=\"body\">\n      {csrfField()}\n      <div class=\"grid grid--2\">\n        <Field label=\"Label\" name=\"label\" required placeholder=\"Design system\" />\n        <Field\n          label=\"Design URL\"\n          name=\"url\"\n          type=\"url\"\n          required\n          placeholder={props.urlHint}\n          error={props.error}\n        />\n      </div>\n      <FormActions>\n        <Button variant=\"primary\" type=\"submit\" icon=\"plus\">\n          Add design file\n        </Button>\n      </FormActions>\n    </form>\n  );\n}\n\nexport function ComponentsCard(props: {\n  base: string;\n  components: SettingsDesignComponent[];\n  formState?: DesignFormState;\n  urlHint: string;\n}): Rendered {\n  const { base, components, formState, urlHint } = props;\n  return (\n    <Card>\n      <SectionTitle>Component mapping</SectionTitle>\n      <Meta>\n        Map a story file (its import path) to a design. A manual mapping overrides the story&apos;s\n        own <code>storyshelf.figma</code> and <code>design</code> parameters, and survives new\n        builds. Mappings are keyed by the story file path, so update one after a file is renamed or\n        moved.\n      </Meta>\n      <LinkTable\n        rows={components.map((component) => ({\n          id: component.id,\n          key: component.importPath,\n          url: component.url,\n          removeAction: `${base}/components/${component.id}/delete`,\n        }))}\n        keyHeading=\"Story file\"\n        confirm=\"Remove this mapping?\"\n      />\n      {components.length === 0 ? <Meta>No component mappings.</Meta> : null}\n      <MapComponentForm base={base} urlHint={urlHint} error={formState?.errors?.[\"component\"]} />\n    </Card>\n  );\n}\n\nfunction MapComponentForm(props: { base: string; urlHint: string; error?: string }): Rendered {\n  const action = `${props.base}/components`;\n  return (\n    <form method=\"post\" action={action} hx-post={action} hx-target=\"body\">\n      {csrfField()}\n      <div class=\"grid grid--2\">\n        <Field\n          label=\"Story file\"\n          name=\"importPath\"\n          required\n          placeholder=\"./src/Button.stories.tsx\"\n        />\n        <Field\n          label=\"Design URL\"\n          name=\"url\"\n          type=\"url\"\n          required\n          placeholder={props.urlHint}\n          error={props.error}\n        />\n      </div>\n      <FormActions>\n        <Button variant=\"primary\" type=\"submit\" icon=\"plus\">\n          Map component\n        </Button>\n      </FormActions>\n    </form>\n  );\n}\n\nexport function RemoveForm(props: { action: string; confirm: string; label: string }): Rendered {\n  return (\n    <form\n      method=\"post\"\n      action={props.action}\n      hx-post={props.action}\n      hx-target=\"body\"\n      hx-confirm={props.confirm}\n    >\n      {csrfField()}\n      <Button variant=\"ghost\" size=\"sm\" type=\"submit\" aria-label={props.label}>\n        Remove\n      </Button>\n    </form>\n  );\n}\n"],"mappings":"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"}

package/dist/pages/settings-design.mjs

@@ -0,0 +1,47 @@
+import "node:path";
+import "node:url";
+import.meta.url;
+import { Alert, EmptyState } from "../ui/feedback.mjs";
+import { ComponentsCard, FilesCard } from "./settings-design-links.mjs";
+import { CredentialCard } from "./settings-design-credential.mjs";
+import { jsx, jsxs } from "hono/jsx/jsx-runtime";
+// src/pages/settings-design.tsx
+/** Design settings tab: project file links, component mapping and provider credentials (admin-only parts gated). */
+function renderSettingsDesign(project, design, isAdmin, formState) {
+	const base = `/projects/${project.slug}/settings/design`;
+	const urlHint = design.providers.map((provider) => provider.urlHint).join(" or ");
+	if (design.providers.length === 0) return /* @__PURE__ */ jsx(EmptyState, {
+		title: "No design provider configured",
+		description: "Add a design provider (for example @storyshelf/design-figma) to createShelfApp({ design: [...] }) to link components to design files."
+	});
+	return /* @__PURE__ */ jsxs("div", {
+		class: "grid max-w-form",
+		children: [
+			formState?.globalError ? /* @__PURE__ */ jsx(Alert, {
+				tone: "danger",
+				children: formState.globalError
+			}) : null,
+			/* @__PURE__ */ jsx(FilesCard, {
+				base,
+				files: design.files,
+				isAdmin,
+				formState,
+				urlHint
+			}),
+			isAdmin ? /* @__PURE__ */ jsx(ComponentsCard, {
+				base,
+				components: design.components,
+				formState,
+				urlHint
+			}) : null,
+			isAdmin ? design.providers.map((provider) => /* @__PURE__ */ jsx(CredentialCard, {
+				base,
+				provider,
+				formState
+			}, provider.kind)) : null
+		]
+	});
+}
+export { renderSettingsDesign };
+
+//# sourceMappingURL=settings-design.mjs.map

package/dist/pages/settings-design.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"settings-design.mjs","names":[],"sources":["../../src/pages/settings-design.tsx"],"sourcesContent":["import type { Project } from \"@storyshelf/core/schema\";\nimport type { HtmlEscapedString } from \"hono/utils/html\";\nimport { Alert, EmptyState } from \"../ui/components.tsx\";\nimport { CredentialCard, type SettingsDesignProvider } from \"./settings-design-credential.tsx\";\nimport {\n  ComponentsCard,\n  FilesCard,\n  type DesignFormState,\n  type SettingsDesignComponent,\n  type SettingsDesignFile,\n} from \"./settings-design-links.tsx\";\n\nexport type { SettingsDesignComponent, SettingsDesignFile } from \"./settings-design-links.tsx\";\nexport type {\n  DesignCredentialState,\n  SettingsDesignCredential,\n  SettingsDesignProvider,\n} from \"./settings-design-credential.tsx\";\n\n/** Data behind the Design settings tab. */\nexport interface SettingsDesignData {\n  files: SettingsDesignFile[];\n  components: SettingsDesignComponent[];\n  /** Configured design providers; empty when the server wires none. */\n  providers: SettingsDesignProvider[];\n}\n\n/** Design settings tab: project file links, component mapping and provider credentials (admin-only parts gated). */\nexport function renderSettingsDesign(\n  project: Project,\n  design: SettingsDesignData,\n  isAdmin: boolean,\n  formState?: DesignFormState,\n): unknown {\n  const base = `/projects/${project.slug}/settings/design`;\n  const urlHint = design.providers.map((provider) => provider.urlHint).join(\" or \");\n  if (design.providers.length === 0) {\n    return (\n      <EmptyState\n        title=\"No design provider configured\"\n        description=\"Add a design provider (for example @storyshelf/design-figma) to createShelfApp({ design: [...] }) to link components to design files.\"\n      />\n    );\n  }\n  return (\n    <div class=\"grid max-w-form\">\n      {formState?.globalError ? <Alert tone=\"danger\">{formState.globalError}</Alert> : null}\n      <FilesCard\n        base={base}\n        files={design.files}\n        isAdmin={isAdmin}\n        formState={formState}\n        urlHint={urlHint}\n      />\n      {isAdmin ? (\n        <ComponentsCard\n          base={base}\n          components={design.components}\n          formState={formState}\n          urlHint={urlHint}\n        />\n      ) : null}\n      {isAdmin\n        ? design.providers.map((provider): HtmlEscapedString | Promise<HtmlEscapedString> => (\n            <CredentialCard\n              key={provider.kind}\n              base={base}\n              provider={provider}\n              formState={formState}\n            />\n          ))\n        : null}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;AA4BA,SAAgB,qBACd,SACA,QACA,SACA,WACS;CACT,MAAM,OAAO,aAAa,QAAQ,KAAK;CACvC,MAAM,UAAU,OAAO,UAAU,KAAK,aAAa,SAAS,OAAO,CAAC,CAAC,KAAK,MAAM;CAChF,IAAI,OAAO,UAAU,WAAW,GAC9B,OACE,oBAAC,YAAD;EACE,OAAM;EACN,aAAY;CACb,CAAA;CAGL,OACE,qBAAC,OAAD;EAAK,OAAM;EAAX,UAAA;GACG,WAAW,cAAc,oBAAC,OAAD;IAAO,MAAK;IAAU,UAAA,UAAU;GAAmB,CAAA,IAAI;GACjF,oBAAC,WAAD;IACQ;IACN,OAAO,OAAO;IACL;IACE;IACF;GACV,CAAA;GACA,UACC,oBAAC,gBAAD;IACQ;IACN,YAAY,OAAO;IACR;IACF;GACV,CAAA,IACC;GACH,UACG,OAAO,UAAU,KAAK,aACpB,oBAAC,gBAAD;IAEQ;IACI;IACC;GACZ,GAJM,SAAS,IAIf,CACF,IACD;EACD;;AAET"}

package/dist/pages/settings-general.mjs

@@ -3,15 +3,18 @@ import "node:url";
 import.meta.url;
 import { Button } from "../ui/buttons.mjs";
 import { Alert, Meta } from "../ui/feedback.mjs";
-import { Field, FormActions, SelectField } from "../ui/forms.mjs";
+import { CheckField, Field, FormActions, SelectField } from "../ui/forms.mjs";
 import { Card, SectionTitle } from "../ui/layout.mjs";
 import { csrfField } from "../ui/csrf-field.mjs";
+import { targetChoices } from "./target-choices.mjs";
 import { jsx, jsxs } from "hono/jsx/jsx-runtime";
-//#region src/pages/settings-general.tsx
+import { isCaptureTarget } from "@storyshelf/core/adapter/capture-runner";
+// src/pages/settings-general.tsx
 /** General settings tab: project metadata, diff thresholds, and danger zone. */
-function renderSettingsGeneral(project, formState, isAdmin) {
+function renderSettingsGeneral(project, formState, isAdmin, offered) {
 	const errors = formState?.errors ?? {};
 	const browser = project.browser ?? "chromium";
+	const targets = targetChoices(offered, isCaptureTarget(browser) ? [browser] : []);
 	return /* @__PURE__ */ jsxs("div", {
 		class: "grid max-w-form",
 		children: [
@@ -71,25 +74,8 @@ function renderSettingsGeneral(project, formState, isAdmin) {
 						name: "browser",
 						value: browser,
 						disabled: !isAdmin,
-						options: [
-							{
-								value: "chromium",
-								label: "Chromium (default)"
-							},
-							{
-								value: "firefox",
-								label: "Firefox"
-							},
-							{
-								value: "webkit",
-								label: "WebKit (Safari engine)"
-							},
-							{
-								value: "chrome",
-								label: "Chrome (Chromium engine)"
-							}
-						],
-						hint: "Rendering engine for captures. Baselines track the browser, so switching starts a fresh baseline. Firefox and WebKit need Playwright system dependencies installed on the server."
+						options: targets.choices,
+						hint: `Where captures render. Baselines are kept per target, so switching starts a fresh baseline for the new one.${targets.unavailable.length > 0 ? ` Not selectable on this server: ${targets.unavailable.join("; ")}.` : ""}`
 					}),
 					/* @__PURE__ */ jsx(Field, {
 						label: "Public branch regex",
@@ -106,6 +92,45 @@ function renderSettingsGeneral(project, formState, isAdmin) {
 					}) }) : /* @__PURE__ */ jsx(Meta, { children: "You need admin access to edit settings." })
 				]
 			})] }),
+			/* @__PURE__ */ jsxs(Card, { children: [
+				/* @__PURE__ */ jsx(SectionTitle, { children: "Review" }),
+				/* @__PURE__ */ jsx(Meta, { children: "Comments on builds and stories, and a build-level verdict from approvers and admins. The default branch is never held for review." }),
+				/* @__PURE__ */ jsxs("form", {
+					method: "post",
+					action: `/projects/${project.slug}/settings/review`,
+					"hx-post": `/projects/${project.slug}/settings/review`,
+					"hx-target": "body",
+					"hx-swap": "outerHTML",
+					children: [
+						csrfField(),
+						/* @__PURE__ */ jsx(CheckField, {
+							label: "Review builds before they are accepted",
+							name: "reviewEnabled",
+							value: "true",
+							checked: project.reviewEnabled !== false,
+							disabled: !isAdmin,
+							hint: "With review off, comments and verdicts are hidden, not deleted, and the project's builds waiting for a verdict are accepted when you save."
+						}),
+						/* @__PURE__ */ jsx(Field, {
+							label: "Approvals required",
+							name: "reviewApprovals",
+							type: "number",
+							step: "1",
+							min: "1",
+							max: "20",
+							value: String(project.reviewApprovals ?? 1),
+							error: errors["reviewApprovals"],
+							hint: "Approvals a build needs when screenshots are not captured. A rejection always rejects the build."
+						}),
+						isAdmin ? /* @__PURE__ */ jsx(FormActions, { children: /* @__PURE__ */ jsx(Button, {
+							variant: "primary",
+							type: "submit",
+							icon: "check",
+							children: "Save review settings"
+						}) }) : null
+					]
+				})
+			] }),
 			isAdmin ? /* @__PURE__ */ jsxs(Card, {
 				tone: "danger",
 				children: [
@@ -132,7 +157,6 @@ function renderSettingsGeneral(project, formState, isAdmin) {
 		]
 	});
 }
-//#endregion
 export { renderSettingsGeneral };
 
 //# sourceMappingURL=settings-general.mjs.map

package/dist/pages/settings-general.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"settings-general.mjs","names":[],"sources":["../../src/pages/settings-general.tsx"],"sourcesContent":["import type { Project } from \"@storyshelf/core/schema\";\nimport {\n  Alert,\n  Button,\n  Card,\n  Field,\n  FormActions,\n  Meta,\n  SectionTitle,\n  SelectField,\n} from \"../ui/components.tsx\";\nimport { csrfField } from \"../ui/csrf-field.tsx\";\n\n/** Form state for the settings tabs (field errors and global error). */\nexport interface SettingsFormState {\n  errors?: Record<string, string>;\n  globalError?: string;\n}\n\n/** General settings tab: project metadata, diff thresholds, and danger zone. */\nexport function renderSettingsGeneral(\n  project: Project,\n  formState: SettingsFormState | undefined,\n  isAdmin: boolean,\n): unknown {\n  const errors = formState?.errors ?? {};\n  const browser = project.browser ?? \"chromium\";\n  return (\n    <div class=\"grid max-w-form\">\n      {formState?.globalError ? <Alert tone=\"danger\">{formState.globalError}</Alert> : null}\n      <Card>\n        <SectionTitle>General</SectionTitle>\n        <form\n          method=\"post\"\n          action={`/projects/${project.slug}/settings`}\n          hx-post={`/projects/${project.slug}/settings`}\n          hx-target=\"body\"\n          hx-swap=\"outerHTML\"\n        >\n          {csrfField()}\n          <Field label=\"Name\" name=\"name\" value={project.name} error={errors[\"name\"]} />\n          <Field\n            label=\"Git repository\"\n            name=\"gitRepository\"\n            value={project.gitRepository ?? \"\"}\n            placeholder=\"owner/repo\"\n          />\n          <Field label=\"Default branch\" name=\"gitDefaultBranch\" value={project.gitDefaultBranch} />\n          <div class=\"grid grid--2\">\n            <Field\n              label=\"Pixel threshold\"\n              name=\"pixelThreshold\"\n              type=\"number\"\n              step=\"0.01\"\n              min=\"0\"\n              max=\"1\"\n              value={String(project.pixelThreshold)}\n              hint=\"Per-pixel color distance 0–1\"\n            />\n            <Field\n              label=\"Max diff ratio\"\n              name=\"maxDiffRatio\"\n              type=\"number\"\n              step=\"0.001\"\n              min=\"0\"\n              max=\"1\"\n              value={String(project.maxDiffRatio)}\n              hint=\"Allowed diff ratio 0–1\"\n            />\n          </div>\n          <SelectField\n            label=\"Capture browser\"\n            name=\"browser\"\n            value={browser}\n            disabled={!isAdmin}\n            options={[\n              { value: \"chromium\", label: \"Chromium (default)\" },\n              { value: \"firefox\", label: \"Firefox\" },\n              { value: \"webkit\", label: \"WebKit (Safari engine)\" },\n              { value: \"chrome\", label: \"Chrome (Chromium engine)\" },\n            ]}\n            hint=\"Rendering engine for captures. Baselines track the browser, so switching starts a fresh baseline. Firefox and WebKit need Playwright system dependencies installed on the server.\"\n          />\n          <Field\n            label=\"Public branch regex\"\n            name=\"publicBranchRegex\"\n            value={project.publicBranchRegex ?? \"\"}\n            placeholder=\"^main$\"\n            hint=\"Branches matching this regex are publicly viewable.\"\n          />\n          {isAdmin ? (\n            <FormActions>\n              <Button variant=\"primary\" type=\"submit\" icon=\"check\">\n                Save changes\n              </Button>\n            </FormActions>\n          ) : (\n            <Meta>You need admin access to edit settings.</Meta>\n          )}\n        </form>\n      </Card>\n\n      {isAdmin ? (\n        <Card tone=\"danger\">\n          <SectionTitle level={3} tone=\"danger\">\n            Danger zone\n          </SectionTitle>\n          <Meta>\n            Deleting a project removes all builds, snapshots, baselines and tokens. This cannot be\n            undone.\n          </Meta>\n          <form\n            method=\"post\"\n            action={`/projects/${project.slug}/delete`}\n            hx-post={`/projects/${project.slug}/delete`}\n            hx-target=\"body\"\n            hx-confirm=\"Delete this project? This cannot be undone.\"\n          >\n            <Button variant=\"danger\" type=\"submit\">\n              Delete project\n            </Button>\n          </form>\n        </Card>\n      ) : null}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;AAoBA,SAAgB,sBACd,SACA,WACA,SACS;CACT,MAAM,SAAS,WAAW,UAAU,CAAC;CACrC,MAAM,UAAU,QAAQ,WAAW;CACnC,OACE,qBAAC,OAAD;EAAK,OAAM;EAAX,UAAA;GACG,WAAW,cAAc,oBAAC,OAAD;IAAO,MAAK;IAAU,UAAA,UAAU;GAAmB,CAAA,IAAI;GACjF,qBAAC,MAAD,EAAA,UAAA,CACE,oBAAC,cAAD,EAAA,UAAc,UAAqB,CAAA,GACnC,qBAAC,QAAD;IACE,QAAO;IACP,QAAQ,aAAa,QAAQ,KAAK;IAClC,WAAS,aAAa,QAAQ,KAAK;IACnC,aAAU;IACV,WAAQ;IALV,UAAA;KAOG,UAAU;KACX,oBAAC,OAAD;MAAO,OAAM;MAAO,MAAK;MAAO,OAAO,QAAQ;MAAM,OAAO,OAAO;KAAU,CAAA;KAC7E,oBAAC,OAAD;MACE,OAAM;MACN,MAAK;MACL,OAAO,QAAQ,iBAAiB;MAChC,aAAY;KACb,CAAA;KACD,oBAAC,OAAD;MAAO,OAAM;MAAiB,MAAK;MAAmB,OAAO,QAAQ;KAAmB,CAAA;KACxF,qBAAC,OAAD;MAAK,OAAM;MAAX,UAAA,CACE,oBAAC,OAAD;OACE,OAAM;OACN,MAAK;OACL,MAAK;OACL,MAAK;OACL,KAAI;OACJ,KAAI;OACJ,OAAO,OAAO,QAAQ,cAAc;OACpC,MAAK;MACN,CAAA,GACD,oBAAC,OAAD;OACE,OAAM;OACN,MAAK;OACL,MAAK;OACL,MAAK;OACL,KAAI;OACJ,KAAI;OACJ,OAAO,OAAO,QAAQ,YAAY;OAClC,MAAK;MACN,CAAA,CACE;;KACL,oBAAC,aAAD;MACE,OAAM;MACN,MAAK;MACL,OAAO;MACP,UAAU,CAAC;MACX,SAAS;OACP;QAAE,OAAO;QAAY,OAAO;OAAqB;OACjD;QAAE,OAAO;QAAW,OAAO;OAAU;OACrC;QAAE,OAAO;QAAU,OAAO;OAAyB;OACnD;QAAE,OAAO;QAAU,OAAO;OAA2B;MACvD;MACA,MAAK;KACN,CAAA;KACD,oBAAC,OAAD;MACE,OAAM;MACN,MAAK;MACL,OAAO,QAAQ,qBAAqB;MACpC,aAAY;MACZ,MAAK;KACN,CAAA;KACA,UACC,oBAAC,aAAD,EAAA,UACE,oBAAC,QAAD;MAAQ,SAAQ;MAAU,MAAK;MAAS,MAAK;MAAQ,UAAA;KAE7C,CAAA,EACG,CAAA,IAEb,oBAAC,MAAD,EAAA,UAAM,0CAA6C,CAAA;IAEjD;GACF,CAAA,CAAA,EAAA,CAAA;GAEL,UACC,qBAAC,MAAD;IAAM,MAAK;IAAX,UAAA;KACE,oBAAC,cAAD;MAAc,OAAO;MAAG,MAAK;MAAS,UAAA;KAExB,CAAA;KACd,oBAAC,MAAD,EAAA,UAAM,iGAGA,CAAA;KACN,oBAAC,QAAD;MACE,QAAO;MACP,QAAQ,aAAa,QAAQ,KAAK;MAClC,WAAS,aAAa,QAAQ,KAAK;MACnC,aAAU;MACV,cAAW;MAEX,UAAA,oBAAC,QAAD;OAAQ,SAAQ;OAAS,MAAK;OAAS,UAAA;MAE/B,CAAA;KACJ,CAAA;IACF;GACJ,CAAA,IAAA;EACD;;AAET"}
+{"version":3,"file":"settings-general.mjs","names":[],"sources":["../../src/pages/settings-general.tsx"],"sourcesContent":["import { isCaptureTarget, type RunnerTarget } from \"@storyshelf/core/adapter/capture-runner\";\nimport type { Project } from \"@storyshelf/core/schema\";\nimport {\n  Alert,\n  Button,\n  Card,\n  CheckField,\n  Field,\n  FormActions,\n  Meta,\n  SectionTitle,\n  SelectField,\n} from \"../ui/components.tsx\";\nimport { csrfField } from \"../ui/csrf-field.tsx\";\nimport { targetChoices } from \"./target-choices.ts\";\n\n/** Form state for the settings tabs (field errors and global error). */\nexport interface SettingsFormState {\n  errors?: Record<string, string>;\n  globalError?: string;\n}\n\n/** General settings tab: project metadata, diff thresholds, and danger zone. */\nexport function renderSettingsGeneral(\n  project: Project,\n  formState: SettingsFormState | undefined,\n  isAdmin: boolean,\n  /** What the runner offers; omitted when it publishes no list. */\n  offered?: readonly RunnerTarget[],\n): unknown {\n  const errors = formState?.errors ?? {};\n  const browser = project.browser ?? \"chromium\";\n  const targets = targetChoices(offered, isCaptureTarget(browser) ? [browser] : []);\n  return (\n    <div class=\"grid max-w-form\">\n      {formState?.globalError ? <Alert tone=\"danger\">{formState.globalError}</Alert> : null}\n      <Card>\n        <SectionTitle>General</SectionTitle>\n        <form\n          method=\"post\"\n          action={`/projects/${project.slug}/settings`}\n          hx-post={`/projects/${project.slug}/settings`}\n          hx-target=\"body\"\n          hx-swap=\"outerHTML\"\n        >\n          {csrfField()}\n          <Field label=\"Name\" name=\"name\" value={project.name} error={errors[\"name\"]} />\n          <Field\n            label=\"Git repository\"\n            name=\"gitRepository\"\n            value={project.gitRepository ?? \"\"}\n            placeholder=\"owner/repo\"\n          />\n          <Field label=\"Default branch\" name=\"gitDefaultBranch\" value={project.gitDefaultBranch} />\n          <div class=\"grid grid--2\">\n            <Field\n              label=\"Pixel threshold\"\n              name=\"pixelThreshold\"\n              type=\"number\"\n              step=\"0.01\"\n              min=\"0\"\n              max=\"1\"\n              value={String(project.pixelThreshold)}\n              hint=\"Per-pixel color distance 0–1\"\n            />\n            <Field\n              label=\"Max diff ratio\"\n              name=\"maxDiffRatio\"\n              type=\"number\"\n              step=\"0.001\"\n              min=\"0\"\n              max=\"1\"\n              value={String(project.maxDiffRatio)}\n              hint=\"Allowed diff ratio 0–1\"\n            />\n          </div>\n          <SelectField\n            label=\"Capture browser\"\n            name=\"browser\"\n            value={browser}\n            disabled={!isAdmin}\n            options={targets.choices}\n            hint={`Where captures render. Baselines are kept per target, so switching starts a fresh baseline for the new one.${\n              targets.unavailable.length > 0\n                ? ` Not selectable on this server: ${targets.unavailable.join(\"; \")}.`\n                : \"\"\n            }`}\n          />\n          <Field\n            label=\"Public branch regex\"\n            name=\"publicBranchRegex\"\n            value={project.publicBranchRegex ?? \"\"}\n            placeholder=\"^main$\"\n            hint=\"Branches matching this regex are publicly viewable.\"\n          />\n          {isAdmin ? (\n            <FormActions>\n              <Button variant=\"primary\" type=\"submit\" icon=\"check\">\n                Save changes\n              </Button>\n            </FormActions>\n          ) : (\n            <Meta>You need admin access to edit settings.</Meta>\n          )}\n        </form>\n      </Card>\n\n      <Card>\n        <SectionTitle>Review</SectionTitle>\n        <Meta>\n          Comments on builds and stories, and a build-level verdict from approvers and admins. The\n          default branch is never held for review.\n        </Meta>\n        <form\n          method=\"post\"\n          action={`/projects/${project.slug}/settings/review`}\n          hx-post={`/projects/${project.slug}/settings/review`}\n          hx-target=\"body\"\n          hx-swap=\"outerHTML\"\n        >\n          {csrfField()}\n          <CheckField\n            label=\"Review builds before they are accepted\"\n            name=\"reviewEnabled\"\n            value=\"true\"\n            checked={project.reviewEnabled !== false}\n            disabled={!isAdmin}\n            hint=\"With review off, comments and verdicts are hidden, not deleted, and the project's builds waiting for a verdict are accepted when you save.\"\n          />\n          <Field\n            label=\"Approvals required\"\n            name=\"reviewApprovals\"\n            type=\"number\"\n            step=\"1\"\n            min=\"1\"\n            max=\"20\"\n            value={String(project.reviewApprovals ?? 1)}\n            error={errors[\"reviewApprovals\"]}\n            hint=\"Approvals a build needs when screenshots are not captured. A rejection always rejects the build.\"\n          />\n          {isAdmin ? (\n            <FormActions>\n              <Button variant=\"primary\" type=\"submit\" icon=\"check\">\n                Save review settings\n              </Button>\n            </FormActions>\n          ) : null}\n        </form>\n      </Card>\n\n      {isAdmin ? (\n        <Card tone=\"danger\">\n          <SectionTitle level={3} tone=\"danger\">\n            Danger zone\n          </SectionTitle>\n          <Meta>\n            Deleting a project removes all builds, snapshots, baselines and tokens. This cannot be\n            undone.\n          </Meta>\n          <form\n            method=\"post\"\n            action={`/projects/${project.slug}/delete`}\n            hx-post={`/projects/${project.slug}/delete`}\n            hx-target=\"body\"\n            hx-confirm=\"Delete this project? This cannot be undone.\"\n          >\n            <Button variant=\"danger\" type=\"submit\">\n              Delete project\n            </Button>\n          </form>\n        </Card>\n      ) : null}\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/pages/settings-labels.mjs

@@ -8,9 +8,10 @@ import { Card, SectionTitle } from "../ui/layout.mjs";
 import { Table } from "../ui/table.mjs";
 import { csrfField } from "../ui/csrf-field.mjs";
 import { jsx, jsxs } from "hono/jsx/jsx-runtime";
-//#region src/pages/settings-labels.tsx
+// src/pages/settings-labels.tsx
 /** Labels settings tab: label-type table plus the create-type form. */
 function renderSettingsLabels(project, labelTypes, isAdmin, formState) {
+	const editing = isAdmin ? labelTypes.find((item) => item.key === formState?.editKey) : void 0;
 	return /* @__PURE__ */ jsxs("div", {
 		class: "grid max-w-form",
 		children: [
@@ -39,7 +40,13 @@ function renderSettingsLabels(project, labelTypes, isAdmin, formState) {
 						class: "truncate max-w-cell",
 						children: labelType.linkTemplate ?? "—"
 					}),
-					/* @__PURE__ */ jsx("td", { children: isAdmin && labelType.key !== "persistent" && labelType.key !== "branch" ? /* @__PURE__ */ jsxs("form", {
+					/* @__PURE__ */ jsxs("td", { children: [isAdmin && labelType.key !== "persistent" ? /* @__PURE__ */ jsx(Button, {
+						variant: "ghost",
+						size: "sm",
+						href: `/projects/${project.slug}/settings/labels?edit=${labelType.key}`,
+						"aria-label": `Edit ${labelType.key}`,
+						children: "Edit"
+					}) : null, isAdmin && labelType.key !== "persistent" && labelType.key !== "branch" ? /* @__PURE__ */ jsxs("form", {
 						method: "post",
 						action: `/projects/${project.slug}/settings/labels/${labelType.key}/delete`,
 						"hx-post": `/projects/${project.slug}/settings/labels/${labelType.key}/delete`,
@@ -54,10 +61,44 @@ function renderSettingsLabels(project, labelTypes, isAdmin, formState) {
 					}) : /* @__PURE__ */ jsx(Meta, {
 						as: "span",
 						children: "built-in"
-					}) })
+					})] })
 				] }, labelType.id)) })] }) }),
 				labelTypes.length === 0 ? /* @__PURE__ */ jsx(Meta, { children: "No label types configured." }) : null
 			] }),
+			editing ? /* @__PURE__ */ jsxs(Card, { children: [/* @__PURE__ */ jsxs(SectionTitle, {
+				level: 3,
+				children: ["Edit label type: ", editing.key]
+			}), /* @__PURE__ */ jsxs("form", {
+				method: "post",
+				action: `/projects/${project.slug}/settings/labels/${editing.key}`,
+				"hx-post": `/projects/${project.slug}/settings/labels/${editing.key}`,
+				"hx-target": "body",
+				children: [
+					csrfField(),
+					/* @__PURE__ */ jsx(Field, {
+						label: "Name",
+						name: "labelName",
+						required: true,
+						value: editing.name
+					}),
+					/* @__PURE__ */ jsx(Field, {
+						label: "Link template",
+						name: "linkTemplate",
+						value: editing.linkTemplate ?? "",
+						placeholder: "https://jira.example.com/browse/{value}",
+						hint: "Placeholders: {value}, {repo}, {branch}. Leave empty for no link."
+					}),
+					/* @__PURE__ */ jsxs(FormActions, { children: [/* @__PURE__ */ jsx(Button, {
+						variant: "primary",
+						type: "submit",
+						children: "Save label type"
+					}), /* @__PURE__ */ jsx(Button, {
+						variant: "ghost",
+						href: `/projects/${project.slug}/settings/labels`,
+						children: "Cancel"
+					})] })
+				]
+			})] }) : null,
 			isAdmin ? /* @__PURE__ */ jsxs(Card, { children: [/* @__PURE__ */ jsx(SectionTitle, {
 				level: 3,
 				children: "Create label type"
@@ -101,7 +142,6 @@ function renderSettingsLabels(project, labelTypes, isAdmin, formState) {
 		]
 	});
 }
-//#endregion
 export { renderSettingsLabels };
 
 //# sourceMappingURL=settings-labels.mjs.map

package/dist/pages/settings-labels.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"settings-labels.mjs","names":[],"sources":["../../src/pages/settings-labels.tsx"],"sourcesContent":["import type { LabelType } from \"@storyshelf/core/schema\";\nimport type { Project } from \"@storyshelf/core/schema\";\nimport type { HtmlEscapedString } from \"hono/utils/html\";\nimport {\n  Alert,\n  Badge,\n  Button,\n  Card,\n  Field,\n  FormActions,\n  Meta,\n  SectionTitle,\n  Table,\n} from \"../ui/components.tsx\";\nimport { csrfField } from \"../ui/csrf-field.tsx\";\n\n/** Labels settings tab: label-type table plus the create-type form. */\nexport function renderSettingsLabels(\n  project: Project,\n  labelTypes: LabelType[],\n  isAdmin: boolean,\n  formState?: { globalError?: string },\n): unknown {\n  return (\n    <div class=\"grid max-w-form\">\n      {formState?.globalError ? <Alert tone=\"danger\">{formState.globalError}</Alert> : null}\n      <Card>\n        <SectionTitle>Label types</SectionTitle>\n        <Meta>\n          Labels attach typed values to builds (e.g. pr=123, jira=ABC-123). Values link out via the\n          template.\n        </Meta>\n        <Table>\n          <table>\n            <thead>\n              <tr>\n                <th>Key</th>\n                <th>Name</th>\n                <th>Template</th>\n                <th>\n                  <span class=\"visually-hidden\">Actions</span>\n                </th>\n              </tr>\n            </thead>\n            <tbody>\n              {labelTypes.map((labelType): HtmlEscapedString | Promise<HtmlEscapedString> => (\n                <tr key={labelType.id}>\n                  <td>\n                    <Badge tone=\"neutral\">{labelType.key}</Badge>\n                  </td>\n                  <td>{labelType.name}</td>\n                  <td class=\"truncate max-w-cell\">{labelType.linkTemplate ?? \"—\"}</td>\n                  <td>\n                    {isAdmin && labelType.key !== \"persistent\" && labelType.key !== \"branch\" ? (\n                      <form\n                        method=\"post\"\n                        action={`/projects/${project.slug}/settings/labels/${labelType.key}/delete`}\n                        hx-post={`/projects/${project.slug}/settings/labels/${labelType.key}/delete`}\n                        hx-target=\"body\"\n                        hx-confirm=\"Delete this label type?\"\n                      >\n                        {csrfField()}\n                        <Button\n                          variant=\"ghost\"\n                          type=\"submit\"\n                          aria-label={`Delete ${labelType.key}`}\n                        >\n                          Delete\n                        </Button>\n                      </form>\n                    ) : (\n                      <Meta as=\"span\">built-in</Meta>\n                    )}\n                  </td>\n                </tr>\n              ))}\n            </tbody>\n          </table>\n        </Table>\n        {labelTypes.length === 0 ? <Meta>No label types configured.</Meta> : null}\n      </Card>\n\n      {isAdmin ? (\n        <Card>\n          <SectionTitle level={3}>Create label type</SectionTitle>\n          <form\n            method=\"post\"\n            action={`/projects/${project.slug}/settings/labels`}\n            hx-post={`/projects/${project.slug}/settings/labels`}\n            hx-target=\"body\"\n          >\n            {csrfField()}\n            <div class=\"grid grid--2\">\n              <Field\n                label=\"Key\"\n                name=\"key\"\n                required\n                placeholder=\"jira\"\n                pattern=\"^[a-z0-9_-]+$\"\n                hint=\"Lowercase, no spaces.\"\n              />\n              <Field label=\"Name\" name=\"labelName\" required placeholder=\"Jira issue\" />\n            </div>\n            <Field\n              label=\"Link template\"\n              name=\"linkTemplate\"\n              placeholder=\"https://jira.example.com/browse/{value}\"\n              hint=\"Use {value} placeholder. Optional.\"\n            />\n            <FormActions>\n              <Button variant=\"primary\" type=\"submit\" icon=\"plus\">\n                Add label type\n              </Button>\n            </FormActions>\n          </form>\n        </Card>\n      ) : null}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;AAiBA,SAAgB,qBACd,SACA,YACA,SACA,WACS;CACT,OACE,qBAAC,OAAD;EAAK,OAAM;EAAX,UAAA;GACG,WAAW,cAAc,oBAAC,OAAD;IAAO,MAAK;IAAU,UAAA,UAAU;GAAmB,CAAA,IAAI;GACjF,qBAAC,MAAD,EAAA,UAAA;IACE,oBAAC,cAAD,EAAA,UAAc,cAAyB,CAAA;IACvC,oBAAC,MAAD,EAAA,UAAM,sGAGA,CAAA;IACN,oBAAC,OAAD,EAAA,UACE,qBAAC,SAAD,EAAA,UAAA,CACE,oBAAC,SAAD,EAAA,UACE,qBAAC,MAAD,EAAA,UAAA;KACE,oBAAC,MAAD,EAAA,UAAI,MAAO,CAAA;KACX,oBAAC,MAAD,EAAA,UAAI,OAAQ,CAAA;KACZ,oBAAC,MAAD,EAAA,UAAI,WAAY,CAAA;KAChB,oBAAC,MAAD,EAAA,UACE,oBAAC,QAAD;MAAM,OAAM;MAAkB,UAAA;KAAa,CAAA,EACzC,CAAA;IACF,EAAA,CAAA,EACC,CAAA,GACP,oBAAC,SAAD,EAAA,UACG,WAAW,KAAK,cACf,qBAAC,MAAD,EAAA,UAAA;KACE,oBAAC,MAAD,EAAA,UACE,oBAAC,OAAD;MAAO,MAAK;MAAW,UAAA,UAAU;KAAW,CAAA,EAC1C,CAAA;KACJ,oBAAC,MAAD,EAAA,UAAK,UAAU,KAAS,CAAA;KACxB,oBAAC,MAAD;MAAI,OAAM;MAAuB,UAAA,UAAU,gBAAgB;KAAQ,CAAA;KACnE,oBAAC,MAAD,EAAA,UACG,WAAW,UAAU,QAAQ,gBAAgB,UAAU,QAAQ,WAC9D,qBAAC,QAAD;MACE,QAAO;MACP,QAAQ,aAAa,QAAQ,KAAK,mBAAmB,UAAU,IAAI;MACnE,WAAS,aAAa,QAAQ,KAAK,mBAAmB,UAAU,IAAI;MACpE,aAAU;MACV,cAAW;MALb,UAAA,CAOG,UAAU,GACX,oBAAC,QAAD;OACE,SAAQ;OACR,MAAK;OACL,cAAY,UAAU,UAAU;OACjC,UAAA;MAEO,CAAA,CACJ;KAEN,CAAA,IAAA,oBAAC,MAAD;MAAM,IAAG;MAAO,UAAA;KAAc,CAAA,EAE9B,CAAA;IACF,EAAA,GA5BK,UAAU,EA4Bf,CACL,EACI,CAAA,CACF,EAAA,CAAA,EACF,CAAA;IACN,WAAW,WAAW,IAAI,oBAAC,MAAD,EAAA,UAAM,6BAAgC,CAAA,IAAI;GACjE,EAAA,CAAA;GAEL,UACC,qBAAC,MAAD,EAAA,UAAA,CACE,oBAAC,cAAD;IAAc,OAAO;IAAG,UAAA;GAA+B,CAAA,GACvD,qBAAC,QAAD;IACE,QAAO;IACP,QAAQ,aAAa,QAAQ,KAAK;IAClC,WAAS,aAAa,QAAQ,KAAK;IACnC,aAAU;IAJZ,UAAA;KAMG,UAAU;KACX,qBAAC,OAAD;MAAK,OAAM;MAAX,UAAA,CACE,oBAAC,OAAD;OACE,OAAM;OACN,MAAK;OACL,UAAA;OACA,aAAY;OACZ,SAAQ;OACR,MAAK;MACN,CAAA,GACD,oBAAC,OAAD;OAAO,OAAM;OAAO,MAAK;OAAY,UAAA;OAAS,aAAY;MAAc,CAAA,CACrE;;KACL,oBAAC,OAAD;MACE,OAAM;MACN,MAAK;MACL,aAAY;MACZ,MAAK;KACN,CAAA;KACD,oBAAC,aAAD,EAAA,UACE,oBAAC,QAAD;MAAQ,SAAQ;MAAU,MAAK;MAAS,MAAK;MAAO,UAAA;KAE5C,CAAA,EACG,CAAA;IACT;GACF,CAAA,CAAA,EAAA,CAAA,IACJ;EACD;;AAET"}
+{"version":3,"file":"settings-labels.mjs","names":[],"sources":["../../src/pages/settings-labels.tsx"],"sourcesContent":["import type { LabelType } from \"@storyshelf/core/schema\";\nimport type { Project } from \"@storyshelf/core/schema\";\nimport type { HtmlEscapedString } from \"hono/utils/html\";\nimport {\n  Alert,\n  Badge,\n  Button,\n  Card,\n  Field,\n  FormActions,\n  Meta,\n  SectionTitle,\n  Table,\n} from \"../ui/components.tsx\";\nimport { csrfField } from \"../ui/csrf-field.tsx\";\n\n/** Labels settings tab: label-type table plus the create-type form. */\nexport function renderSettingsLabels(\n  project: Project,\n  labelTypes: LabelType[],\n  isAdmin: boolean,\n  formState?: { globalError?: string; editKey?: string },\n): unknown {\n  const editing = isAdmin ? labelTypes.find((item) => item.key === formState?.editKey) : undefined;\n  return (\n    <div class=\"grid max-w-form\">\n      {formState?.globalError ? <Alert tone=\"danger\">{formState.globalError}</Alert> : null}\n      <Card>\n        <SectionTitle>Label types</SectionTitle>\n        <Meta>\n          Labels attach typed values to builds (e.g. pr=123, jira=ABC-123). Values link out via the\n          template.\n        </Meta>\n        <Table>\n          <table>\n            <thead>\n              <tr>\n                <th>Key</th>\n                <th>Name</th>\n                <th>Template</th>\n                <th>\n                  <span class=\"visually-hidden\">Actions</span>\n                </th>\n              </tr>\n            </thead>\n            <tbody>\n              {labelTypes.map((labelType): HtmlEscapedString | Promise<HtmlEscapedString> => (\n                <tr key={labelType.id}>\n                  <td>\n                    <Badge tone=\"neutral\">{labelType.key}</Badge>\n                  </td>\n                  <td>{labelType.name}</td>\n                  <td class=\"truncate max-w-cell\">{labelType.linkTemplate ?? \"—\"}</td>\n                  <td>\n                    {isAdmin && labelType.key !== \"persistent\" ? (\n                      <Button\n                        variant=\"ghost\"\n                        size=\"sm\"\n                        href={`/projects/${project.slug}/settings/labels?edit=${labelType.key}`}\n                        aria-label={`Edit ${labelType.key}`}\n                      >\n                        Edit\n                      </Button>\n                    ) : null}\n                    {isAdmin && labelType.key !== \"persistent\" && labelType.key !== \"branch\" ? (\n                      <form\n                        method=\"post\"\n                        action={`/projects/${project.slug}/settings/labels/${labelType.key}/delete`}\n                        hx-post={`/projects/${project.slug}/settings/labels/${labelType.key}/delete`}\n                        hx-target=\"body\"\n                        hx-confirm=\"Delete this label type?\"\n                      >\n                        {csrfField()}\n                        <Button\n                          variant=\"ghost\"\n                          type=\"submit\"\n                          aria-label={`Delete ${labelType.key}`}\n                        >\n                          Delete\n                        </Button>\n                      </form>\n                    ) : (\n                      <Meta as=\"span\">built-in</Meta>\n                    )}\n                  </td>\n                </tr>\n              ))}\n            </tbody>\n          </table>\n        </Table>\n        {labelTypes.length === 0 ? <Meta>No label types configured.</Meta> : null}\n      </Card>\n\n      {editing ? (\n        <Card>\n          <SectionTitle level={3}>Edit label type: {editing.key}</SectionTitle>\n          <form\n            method=\"post\"\n            action={`/projects/${project.slug}/settings/labels/${editing.key}`}\n            hx-post={`/projects/${project.slug}/settings/labels/${editing.key}`}\n            hx-target=\"body\"\n          >\n            {csrfField()}\n            <Field label=\"Name\" name=\"labelName\" required value={editing.name} />\n            <Field\n              label=\"Link template\"\n              name=\"linkTemplate\"\n              value={editing.linkTemplate ?? \"\"}\n              placeholder=\"https://jira.example.com/browse/{value}\"\n              hint=\"Placeholders: {value}, {repo}, {branch}. Leave empty for no link.\"\n            />\n            <FormActions>\n              <Button variant=\"primary\" type=\"submit\">\n                Save label type\n              </Button>\n              <Button variant=\"ghost\" href={`/projects/${project.slug}/settings/labels`}>\n                Cancel\n              </Button>\n            </FormActions>\n          </form>\n        </Card>\n      ) : null}\n\n      {isAdmin ? (\n        <Card>\n          <SectionTitle level={3}>Create label type</SectionTitle>\n          <form\n            method=\"post\"\n            action={`/projects/${project.slug}/settings/labels`}\n            hx-post={`/projects/${project.slug}/settings/labels`}\n            hx-target=\"body\"\n          >\n            {csrfField()}\n            <div class=\"grid grid--2\">\n              <Field\n                label=\"Key\"\n                name=\"key\"\n                required\n                placeholder=\"jira\"\n                pattern=\"^[a-z0-9_-]+$\"\n                hint=\"Lowercase, no spaces.\"\n              />\n              <Field label=\"Name\" name=\"labelName\" required placeholder=\"Jira issue\" />\n            </div>\n            <Field\n              label=\"Link template\"\n              name=\"linkTemplate\"\n              placeholder=\"https://jira.example.com/browse/{value}\"\n              hint=\"Use {value} placeholder. Optional.\"\n            />\n            <FormActions>\n              <Button variant=\"primary\" type=\"submit\" icon=\"plus\">\n                Add label type\n              </Button>\n            </FormActions>\n          </form>\n        </Card>\n      ) : null}\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/pages/settings-links.mjs

@@ -0,0 +1,111 @@
+import "node:path";
+import "node:url";
+import.meta.url;
+import { Button } from "../ui/buttons.mjs";
+import { Alert, Badge, Meta } from "../ui/feedback.mjs";
+import { Field, FormActions, SelectField } from "../ui/forms.mjs";
+import { Card, SectionTitle } from "../ui/layout.mjs";
+import { Table } from "../ui/table.mjs";
+import { csrfField } from "../ui/csrf-field.mjs";
+import { jsx, jsxs } from "hono/jsx/jsx-runtime";
+// src/pages/settings-links.tsx
+const linkRow = (base, link, isAdmin) => /* @__PURE__ */ jsxs("tr", { children: [
+	/* @__PURE__ */ jsx("td", { children: /* @__PURE__ */ jsx(Badge, {
+		tone: "neutral",
+		children: link.packageName
+	}) }),
+	/* @__PURE__ */ jsx("td", { children: link.upstreamName }),
+	/* @__PURE__ */ jsx("td", { children: isAdmin ? /* @__PURE__ */ jsxs("form", {
+		method: "post",
+		action: `${base}/delete`,
+		"hx-post": `${base}/delete`,
+		"hx-target": "body",
+		"hx-confirm": "Remove this link?",
+		children: [
+			csrfField(),
+			/* @__PURE__ */ jsx("input", {
+				type: "hidden",
+				name: "package",
+				value: link.packageName
+			}),
+			/* @__PURE__ */ jsx(Button, {
+				variant: "ghost",
+				type: "submit",
+				"aria-label": `Remove ${link.packageName}`,
+				children: "Remove"
+			})
+		]
+	}) : null })
+] }, link.packageName);
+/** Links settings tab: linked packages plus the add-link form. */
+function renderSettingsLinks(project, links, candidates, isAdmin, formState) {
+	const base = `/projects/${project.slug}/settings/links`;
+	return /* @__PURE__ */ jsxs("div", {
+		class: "grid max-w-form",
+		children: [
+			formState?.globalError ? /* @__PURE__ */ jsx(Alert, {
+				tone: "danger",
+				children: formState.globalError
+			}) : null,
+			/* @__PURE__ */ jsxs(Card, { children: [
+				/* @__PURE__ */ jsx(SectionTitle, { children: "Linked packages" }),
+				/* @__PURE__ */ jsx(Meta, { children: "Link a package this project consumes (e.g. @acme/design-system) to the project that publishes it. Review pages then show where a story uses it, with links to the upstream component." }),
+				/* @__PURE__ */ jsx(Table, { children: /* @__PURE__ */ jsxs("table", { children: [/* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", { children: [
+					/* @__PURE__ */ jsx("th", { children: "Package" }),
+					/* @__PURE__ */ jsx("th", { children: "Upstream project" }),
+					/* @__PURE__ */ jsx("th", { children: /* @__PURE__ */ jsx("span", {
+						class: "visually-hidden",
+						children: "Actions"
+					}) })
+				] }) }), /* @__PURE__ */ jsx("tbody", { children: links.map((link) => linkRow(base, link, isAdmin)) })] }) }),
+				links.length === 0 ? /* @__PURE__ */ jsx(Meta, { children: "No packages linked." }) : null
+			] }),
+			isAdmin ? /* @__PURE__ */ jsx(AddLinkCard, {
+				base,
+				candidates
+			}) : null
+		]
+	});
+}
+/** Form card linking a package to an upstream project. */
+function AddLinkCard(props) {
+	const { base, candidates } = props;
+	return /* @__PURE__ */ jsxs(Card, { children: [/* @__PURE__ */ jsx(SectionTitle, {
+		level: 3,
+		children: "Link a package"
+	}), /* @__PURE__ */ jsxs("form", {
+		method: "post",
+		action: base,
+		"hx-post": base,
+		"hx-target": "body",
+		children: [
+			csrfField(),
+			/* @__PURE__ */ jsxs("div", {
+				class: "grid grid--2",
+				children: [/* @__PURE__ */ jsx(Field, {
+					label: "Package",
+					name: "package",
+					required: true,
+					placeholder: "@acme/design-system"
+				}), /* @__PURE__ */ jsx(SelectField, {
+					label: "Upstream project",
+					name: "upstreamSlug",
+					required: true,
+					options: candidates.map((candidate) => ({
+						value: candidate.slug,
+						label: candidate.name
+					}))
+				})]
+			}),
+			/* @__PURE__ */ jsx(FormActions, { children: /* @__PURE__ */ jsx(Button, {
+				variant: "primary",
+				type: "submit",
+				icon: "plus",
+				children: "Link package"
+			}) })
+		]
+	})] });
+}
+export { renderSettingsLinks };
+
+//# sourceMappingURL=settings-links.mjs.map

package/dist/pages/settings-links.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"settings-links.mjs","names":[],"sources":["../../src/pages/settings-links.tsx"],"sourcesContent":["import type { Project } from \"@storyshelf/core/schema\";\nimport type { HtmlEscapedString } from \"hono/utils/html\";\nimport {\n  Alert,\n  Badge,\n  Button,\n  Card,\n  Field,\n  FormActions,\n  Meta,\n  SectionTitle,\n  SelectField,\n  Table,\n} from \"../ui/components.tsx\";\nimport { csrfField } from \"../ui/csrf-field.tsx\";\n\n/* eslint-disable promise-function-async -- Hono JSX components return HtmlEscapedString | Promise<HtmlEscapedString> */\n\n/** A package linked to the upstream project that publishes it. */\nexport interface SettingsLink {\n  packageName: string;\n  upstreamSlug: string;\n  upstreamName: string;\n}\n\n/** Another project that can be chosen as an upstream. */\nexport interface SettingsLinkCandidate {\n  slug: string;\n  name: string;\n}\n\nconst linkRow = (\n  base: string,\n  link: SettingsLink,\n  isAdmin: boolean,\n): HtmlEscapedString | Promise<HtmlEscapedString> => (\n  <tr key={link.packageName}>\n    <td>\n      <Badge tone=\"neutral\">{link.packageName}</Badge>\n    </td>\n    <td>{link.upstreamName}</td>\n    <td>\n      {isAdmin ? (\n        <form\n          method=\"post\"\n          action={`${base}/delete`}\n          hx-post={`${base}/delete`}\n          hx-target=\"body\"\n          hx-confirm=\"Remove this link?\"\n        >\n          {csrfField()}\n          <input type=\"hidden\" name=\"package\" value={link.packageName} />\n          <Button variant=\"ghost\" type=\"submit\" aria-label={`Remove ${link.packageName}`}>\n            Remove\n          </Button>\n        </form>\n      ) : null}\n    </td>\n  </tr>\n);\n\n/** Links settings tab: linked packages plus the add-link form. */\nexport function renderSettingsLinks(\n  project: Project,\n  links: SettingsLink[],\n  candidates: SettingsLinkCandidate[],\n  isAdmin: boolean,\n  formState?: { globalError?: string },\n): unknown {\n  const base = `/projects/${project.slug}/settings/links`;\n  return (\n    <div class=\"grid max-w-form\">\n      {formState?.globalError ? <Alert tone=\"danger\">{formState.globalError}</Alert> : null}\n      <Card>\n        <SectionTitle>Linked packages</SectionTitle>\n        <Meta>\n          Link a package this project consumes (e.g. @acme/design-system) to the project that\n          publishes it. Review pages then show where a story uses it, with links to the upstream\n          component.\n        </Meta>\n        <Table>\n          <table>\n            <thead>\n              <tr>\n                <th>Package</th>\n                <th>Upstream project</th>\n                <th>\n                  <span class=\"visually-hidden\">Actions</span>\n                </th>\n              </tr>\n            </thead>\n            <tbody>{links.map((link) => linkRow(base, link, isAdmin))}</tbody>\n          </table>\n        </Table>\n        {links.length === 0 ? <Meta>No packages linked.</Meta> : null}\n      </Card>\n      {isAdmin ? <AddLinkCard base={base} candidates={candidates} /> : null}\n    </div>\n  );\n}\n\n/** Form card linking a package to an upstream project. */\nfunction AddLinkCard(props: {\n  base: string;\n  candidates: SettingsLinkCandidate[];\n}): HtmlEscapedString | Promise<HtmlEscapedString> {\n  const { base, candidates } = props;\n  return (\n    <Card>\n      <SectionTitle level={3}>Link a package</SectionTitle>\n      <form method=\"post\" action={base} hx-post={base} hx-target=\"body\">\n        {csrfField()}\n        <div class=\"grid grid--2\">\n          <Field label=\"Package\" name=\"package\" required placeholder=\"@acme/design-system\" />\n          <SelectField\n            label=\"Upstream project\"\n            name=\"upstreamSlug\"\n            required\n            options={candidates.map((candidate) => ({\n              value: candidate.slug,\n              label: candidate.name,\n            }))}\n          />\n        </div>\n        <FormActions>\n          <Button variant=\"primary\" type=\"submit\" icon=\"plus\">\n            Link package\n          </Button>\n        </FormActions>\n      </form>\n    </Card>\n  );\n}\n"],"mappings":";;;;;;;;;;;AA+BA,MAAM,WACJ,MACA,MACA,YAEA,qBAAC,MAAD,EAAA,UAAA;CACE,oBAAC,MAAD,EAAA,UACE,oBAAC,OAAD;EAAO,MAAK;EAAW,UAAA,KAAK;CAAmB,CAAA,EAC7C,CAAA;CACJ,oBAAC,MAAD,EAAA,UAAK,KAAK,aAAiB,CAAA;CAC3B,oBAAC,MAAD,EAAA,UACG,UACC,qBAAC,QAAD;EACE,QAAO;EACP,QAAQ,GAAG,KAAK;EAChB,WAAS,GAAG,KAAK;EACjB,aAAU;EACV,cAAW;EALb,UAAA;GAOG,UAAU;GACX,oBAAC,SAAD;IAAO,MAAK;IAAS,MAAK;IAAU,OAAO,KAAK;GAAc,CAAA;GAC9D,oBAAC,QAAD;IAAQ,SAAQ;IAAQ,MAAK;IAAS,cAAY,UAAU,KAAK;IAAe,UAAA;GAExE,CAAA;EACJ;CACJ,CAAA,IAAA,KACF,CAAA;AACF,EAAA,GAtBK,KAAK,WAsBV;;AAIN,SAAgB,oBACd,SACA,OACA,YACA,SACA,WACS;CACT,MAAM,OAAO,aAAa,QAAQ,KAAK;CACvC,OACE,qBAAC,OAAD;EAAK,OAAM;EAAX,UAAA;GACG,WAAW,cAAc,oBAAC,OAAD;IAAO,MAAK;IAAU,UAAA,UAAU;GAAmB,CAAA,IAAI;GACjF,qBAAC,MAAD,EAAA,UAAA;IACE,oBAAC,cAAD,EAAA,UAAc,kBAA6B,CAAA;IAC3C,oBAAC,MAAD,EAAA,UAAM,wLAIA,CAAA;IACN,oBAAC,OAAD,EAAA,UACE,qBAAC,SAAD,EAAA,UAAA,CACE,oBAAC,SAAD,EAAA,UACE,qBAAC,MAAD,EAAA,UAAA;KACE,oBAAC,MAAD,EAAA,UAAI,UAAW,CAAA;KACf,oBAAC,MAAD,EAAA,UAAI,mBAAoB,CAAA;KACxB,oBAAC,MAAD,EAAA,UACE,oBAAC,QAAD;MAAM,OAAM;MAAkB,UAAA;KAAa,CAAA,EACzC,CAAA;IACF,EAAA,CAAA,EACC,CAAA,GACP,oBAAC,SAAD,EAAA,UAAQ,MAAM,KAAK,SAAS,QAAQ,MAAM,MAAM,OAAO,CAAC,EAAS,CAAA,CAC5D,EAAA,CAAA,EACF,CAAA;IACN,MAAM,WAAW,IAAI,oBAAC,MAAD,EAAA,UAAM,sBAAyB,CAAA,IAAI;GACrD,EAAA,CAAA;GACL,UAAU,oBAAC,aAAD;IAAmB;IAAkB;GAAa,CAAA,IAAI;EAC9D;;AAET;;AAGA,SAAS,YAAY,OAG8B;CACjD,MAAM,EAAE,MAAM,eAAe;CAC7B,OACE,qBAAC,MAAD,EAAA,UAAA,CACE,oBAAC,cAAD;EAAc,OAAO;EAAG,UAAA;CAA4B,CAAA,GACpD,qBAAC,QAAD;EAAM,QAAO;EAAO,QAAQ;EAAM,WAAS;EAAM,aAAU;EAA3D,UAAA;GACG,UAAU;GACX,qBAAC,OAAD;IAAK,OAAM;IAAX,UAAA,CACE,oBAAC,OAAD;KAAO,OAAM;KAAU,MAAK;KAAU,UAAA;KAAS,aAAY;IAAuB,CAAA,GAClF,oBAAC,aAAD;KACE,OAAM;KACN,MAAK;KACL,UAAA;KACA,SAAS,WAAW,KAAK,eAAe;MACtC,OAAO,UAAU;MACjB,OAAO,UAAU;KACnB,EAAE;IACH,CAAA,CACE;;GACL,oBAAC,aAAD,EAAA,UACE,oBAAC,QAAD;IAAQ,SAAQ;IAAU,MAAK;IAAS,MAAK;IAAO,UAAA;GAE5C,CAAA,EACG,CAAA;EACT;CACF,CAAA,CAAA,EAAA,CAAA;AAEV"}

package/dist/pages/settings-members.mjs

@@ -8,7 +8,7 @@ import { Card, SectionTitle } from "../ui/layout.mjs";
 import { Table } from "../ui/table.mjs";
 import { csrfField } from "../ui/csrf-field.mjs";
 import { jsx, jsxs } from "hono/jsx/jsx-runtime";
-//#region src/pages/settings-members.tsx
+// src/pages/settings-members.tsx
 /** Members settings tab: member roster plus the add-member form. */
 function renderSettingsMembers(project, members, groupMappings, isAdmin, formState) {
 	return /* @__PURE__ */ jsxs("div", {
@@ -186,7 +186,6 @@ function renderSettingsMembers(project, members, groupMappings, isAdmin, formSta
 		]
 	});
 }
-//#endregion
 export { renderSettingsMembers };
 
 //# sourceMappingURL=settings-members.mjs.map

package/dist/pages/settings-notifications-git.mjs

@@ -0,0 +1,127 @@
+import "node:path";
+import "node:url";
+import.meta.url;
+import { Button } from "../ui/buttons.mjs";
+import { Alert } from "../ui/feedback.mjs";
+import { Field, FormActions, SelectField, TextareaField } from "../ui/forms.mjs";
+import { Card, SectionTitle } from "../ui/layout.mjs";
+import { csrfField } from "../ui/csrf-field.mjs";
+import { isServerlessHost } from "@storyshelf/core/config";
+import { Fragment, jsx, jsxs } from "hono/jsx/jsx-runtime";
+// src/pages/settings-notifications-git.tsx
+/** GitHub only: show builds as check runs posted by a GitHub App, not as commit statuses. */
+const GitHubAppFields = ({ errors }) => /* @__PURE__ */ jsxs(Fragment, { children: [
+	/* @__PURE__ */ jsx(SelectField, {
+		label: "GitHub mode",
+		name: "mode",
+		options: [{
+			value: "statuses",
+			label: "Commit statuses (token)"
+		}, {
+			value: "checks",
+			label: "Check runs (GitHub App)"
+		}],
+		hint: errors?.["mode"] ?? "GitHub only. Check runs list each changed snapshot and need a GitHub App installed on the repository; GitLab always uses statuses."
+	}),
+	/* @__PURE__ */ jsx(Field, {
+		label: "App ID",
+		name: "appId",
+		placeholder: "123456",
+		error: errors?.["appId"]
+	}),
+	/* @__PURE__ */ jsx(Field, {
+		label: "Installation ID",
+		name: "installationId",
+		placeholder: "7654321",
+		error: errors?.["installationId"]
+	}),
+	/* @__PURE__ */ jsx(TextareaField, {
+		label: "App private key",
+		name: "privateKey",
+		rows: 4,
+		placeholder: "-----BEGIN RSA PRIVATE KEY-----",
+		hint: "The PEM key generated for the App. It is stored encrypted and never shown again.",
+		error: errors?.["privateKey"]
+	})
+] });
+/** The repository, prefix and token fields of the git channel form. */
+const GitChannelFields = ({ errors }) => /* @__PURE__ */ jsxs(Fragment, { children: [
+	/* @__PURE__ */ jsx(Field, {
+		label: "Owner",
+		name: "owner",
+		required: true,
+		placeholder: "my-org",
+		hint: "Organization, user or group that owns the repository.",
+		error: errors?.["owner"]
+	}),
+	/* @__PURE__ */ jsx(Field, {
+		label: "Repository",
+		name: "repo",
+		required: true,
+		placeholder: "my-repo",
+		error: errors?.["repo"]
+	}),
+	/* @__PURE__ */ jsx(Field, {
+		label: "Host",
+		name: "host",
+		placeholder: "https://gitlab.example.com",
+		hint: "GitLab only: a self-managed host. Leave blank for gitlab.com.",
+		error: errors?.["host"]
+	}),
+	/* @__PURE__ */ jsx(Field, {
+		label: "Status prefix",
+		name: "prefix",
+		placeholder: "storyshelf",
+		hint: "Statuses (or check runs) are named <prefix>/testing and <prefix>/storybook; require <prefix>/testing in branch protection (`storyshelf protect` prints the rule). Give each project in a shared repository its own prefix.",
+		error: errors?.["prefix"]
+	}),
+	/* @__PURE__ */ jsx(Field, {
+		label: "Token",
+		name: "token",
+		type: "password",
+		placeholder: "ghp_…",
+		hint: "A token that can write commit statuses (GitHub: repo:status; GitLab: api). Not needed for GitHub checks.",
+		error: errors?.["token"]
+	}),
+	/* @__PURE__ */ jsx(GitHubAppFields, { errors })
+] });
+/** Git channel creation card (admins only): repository, status prefix and token. */
+const CreateGitChannelCard = ({ project, providers, formState }) => /* @__PURE__ */ jsxs(Card, { children: [
+	/* @__PURE__ */ jsx(SectionTitle, {
+		level: 3,
+		children: "Add a git channel"
+	}),
+	isServerlessHost() ? /* @__PURE__ */ jsx(Alert, {
+		tone: "info",
+		title: "Statuses are delivered inline",
+		children: "This host has no job consumer, so a build's state is written in the request that changes it, without retries. A failure shows on the channel and the next change writes the current state again."
+	}) : null,
+	/* @__PURE__ */ jsxs("form", {
+		method: "post",
+		action: `/projects/${project.slug}/settings/notifications`,
+		"hx-post": `/projects/${project.slug}/settings/notifications`,
+		"hx-target": "body",
+		children: [
+			csrfField(),
+			/* @__PURE__ */ jsx(SelectField, {
+				label: "Git provider",
+				name: "gitProvider",
+				options: providers.map((provider) => ({
+					value: provider.kind,
+					label: provider.name
+				})),
+				hint: formState?.errors?.["gitProvider"]
+			}),
+			/* @__PURE__ */ jsx(GitChannelFields, { errors: formState?.errors }),
+			/* @__PURE__ */ jsx(FormActions, { children: /* @__PURE__ */ jsx(Button, {
+				variant: "primary",
+				type: "submit",
+				icon: "plus",
+				children: "Add git channel"
+			}) })
+		]
+	})
+] });
+export { CreateGitChannelCard };
+
+//# sourceMappingURL=settings-notifications-git.mjs.map