@btst/stack 5.1.0 → 5.2.0

package/dist/packages/stack/src/plugins/job-board/client/components/pages/job-list-page.internal.cjs

@@ -0,0 +1,178 @@
+"use client";
+'use strict';
+
+const jsxRuntime = require('react/jsx-runtime');
+const React = require('react');
+const context = require('@btst/stack/context');
+const button = require('../../../../../../../ui/src/components/button.cjs');
+const label = require('../../../../../../../ui/src/components/label.cjs');
+const utils = require('../../../utils.cjs');
+const constants = require('../../constants.cjs');
+const plugins_jobBoard_client_hooks_index = require('../../../../../../../../plugins/job-board/client/hooks/index.cjs');
+const shared = require('../shared.cjs');
+
+function JobRow({ job }) {
+  const copy = plugins_jobBoard_client_hooks_index.useJobBoardLocalization();
+  const { Link, resolve } = context.usePluginSiteNavigation(constants.JOB_BOARD_PLUGIN_ID);
+  return /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsxs(
+    Link,
+    {
+      "aria-label": job.title,
+      href: resolve("jobs", encodeURIComponent(job.slug)).href,
+      className: "group grid min-w-0 gap-4 py-6 transition-colors hover:bg-muted/40 focus-visible:outline-2 focus-visible:outline-offset-4 focus-visible:outline-ring motion-reduce:transition-none sm:grid-cols-[minmax(0,1.6fr)_minmax(0,1fr)_auto] sm:items-center sm:gap-6 sm:py-7",
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-w-0 flex-col gap-2", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "break-words text-xl font-semibold leading-snug group-hover:underline group-hover:underline-offset-4 sm:text-2xl", children: job.title }),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "break-words text-sm text-muted-foreground", children: job.department })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-w-0 flex-col gap-1 text-sm", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "break-words", children: job.location }),
+          job.remote && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground", children: copy.remote })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between gap-4 text-sm sm:flex-col sm:items-end sm:gap-2", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("span", { children: shared.employmentLabel(job.employmentType, copy) }),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-medium underline underline-offset-4", children: copy.viewRole })
+        ] })
+      ]
+    }
+  ) });
+}
+function JobListPage({ department }) {
+  const copy = plugins_jobBoard_client_hooks_index.useJobBoardLocalization();
+  const { Link, resolve } = context.usePluginSiteNavigation(constants.JOB_BOARD_PLUGIN_ID);
+  const [state, setFilterState] = React.useState({
+    department: "",
+    location: "",
+    employmentType: "",
+    remote: false
+  });
+  const setState = (patch) => setFilterState((current) => ({ ...current, ...patch }));
+  const employmentType = [
+    "full-time",
+    "part-time",
+    "contract",
+    "internship"
+  ].includes(state.employmentType) ? state.employmentType : void 0;
+  const filters = {
+    department: department || state.department || void 0,
+    location: state.location || void 0,
+    employmentType,
+    remote: state.remote || void 0
+  };
+  const { data, fetchNextPage, hasNextPage, isFetchingNextPage } = plugins_jobBoard_client_hooks_index.useSuspenseJobs(filters);
+  const hydrated = plugins_jobBoard_client_hooks_index.useJobBoardHydrated();
+  const jobs = data.pages.flatMap((page) => page.items).filter((job) => !hydrated || utils.isJobOpen(job));
+  const firstPage = data.pages[0];
+  const taxonomies = firstPage?.taxonomies;
+  const filtered = !!(filters.department || filters.location || filters.employmentType || filters.remote);
+  const canClear = !!(!department && state.department || state.location || state.employmentType || state.remote);
+  return /* @__PURE__ */ jsxRuntime.jsxs(shared.JobPage, { children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("header", { className: "flex max-w-3xl flex-col gap-4", children: [
+      department && /* @__PURE__ */ jsxRuntime.jsx(
+        Link,
+        {
+          className: "inline-flex min-h-11 items-center self-start text-sm underline underline-offset-4",
+          href: resolve("jobs").href,
+          children: copy.backToJobs
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "break-words text-4xl font-semibold leading-tight tracking-tight sm:text-5xl", children: department ? copy.departmentTitle.replace("{department}", department) : copy.title }),
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "max-w-2xl text-lg leading-relaxed text-muted-foreground", children: copy.intro })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("fieldset", { className: "grid min-w-0 gap-4 rounded-lg border bg-muted/20 p-4 sm:grid-cols-2 lg:grid-cols-4 lg:p-5", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("legend", { className: "sr-only", children: copy.title }),
+      !department && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-w-0 flex-col gap-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(label.Label, { htmlFor: "job-board-department", children: copy.department }),
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          "select",
+          {
+            id: "job-board-department",
+            className: shared.jobSelectClass,
+            value: state.department,
+            onChange: (event) => setState({ department: event.target.value }),
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx("option", { value: "", children: copy.allDepartments }),
+              taxonomies?.departments.map((value) => /* @__PURE__ */ jsxRuntime.jsx("option", { value, children: value }, value))
+            ]
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-w-0 flex-col gap-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(label.Label, { htmlFor: "job-board-location", children: copy.location }),
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          "select",
+          {
+            id: "job-board-location",
+            className: shared.jobSelectClass,
+            value: state.location,
+            onChange: (event) => setState({ location: event.target.value }),
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx("option", { value: "", children: copy.allLocations }),
+              taxonomies?.locations.map((value) => /* @__PURE__ */ jsxRuntime.jsx("option", { value, children: value }, value))
+            ]
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-w-0 flex-col gap-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(label.Label, { htmlFor: "job-board-type", children: copy.employmentType }),
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          "select",
+          {
+            id: "job-board-type",
+            className: shared.jobSelectClass,
+            value: state.employmentType,
+            onChange: (event) => setState({ employmentType: event.target.value }),
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx("option", { value: "", children: copy.allEmploymentTypes }),
+              taxonomies?.employmentTypes.map((value) => /* @__PURE__ */ jsxRuntime.jsx("option", { value, children: shared.employmentLabel(value, copy) }, value))
+            ]
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "flex min-h-11 items-center gap-3 self-end text-sm", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "input",
+          {
+            className: "size-5 accent-primary",
+            type: "checkbox",
+            checked: state.remote,
+            onChange: (event) => setState({ remote: event.target.checked })
+          }
+        ),
+        copy.remoteOnly
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("section", { "aria-label": copy.title, className: "flex min-w-0 flex-col gap-5", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap items-center justify-between gap-3", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("p", { role: "status", className: "text-sm text-muted-foreground", children: copy.openRoles.replace("{count}", String(firstPage?.total ?? 0)) }),
+        canClear && /* @__PURE__ */ jsxRuntime.jsx(
+          button.Button,
+          {
+            className: "min-h-11",
+            variant: "ghost",
+            onClick: () => setState({
+              department: "",
+              location: "",
+              employmentType: "",
+              remote: false
+            }),
+            children: copy.clearFilters
+          }
+        )
+      ] }),
+      jobs.length ? /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "flex min-w-0 flex-col divide-y border-y", children: jobs.map((job) => /* @__PURE__ */ jsxRuntime.jsx(JobRow, { job }, job.id)) }) : /* @__PURE__ */ jsxRuntime.jsx(shared.JobsEmpty, { filtered }),
+      hasNextPage && /* @__PURE__ */ jsxRuntime.jsx(
+        button.Button,
+        {
+          className: "min-h-11 self-center",
+          variant: "outline",
+          disabled: isFetchingNextPage,
+          onClick: () => void fetchNextPage(),
+          children: isFetchingNextPage ? copy.loadingMore : copy.loadMore
+        }
+      )
+    ] })
+  ] });
+}
+
+exports.JobListPage = JobListPage;

package/dist/packages/stack/src/plugins/job-board/client/components/pages/job-list-page.internal.mjs

@@ -0,0 +1,176 @@
+"use client";
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useState } from 'react';
+import { usePluginSiteNavigation } from '@btst/stack/context';
+import { Button } from '../../../../../../../ui/src/components/button.mjs';
+import { Label } from '../../../../../../../ui/src/components/label.mjs';
+import { isJobOpen } from '../../../utils.mjs';
+import { JOB_BOARD_PLUGIN_ID } from '../../constants.mjs';
+import { useJobBoardLocalization, useSuspenseJobs, useJobBoardHydrated } from '../../../../../../../../plugins/job-board/client/hooks/index.mjs';
+import { JobPage, jobSelectClass, employmentLabel, JobsEmpty } from '../shared.mjs';
+
+function JobRow({ job }) {
+  const copy = useJobBoardLocalization();
+  const { Link, resolve } = usePluginSiteNavigation(JOB_BOARD_PLUGIN_ID);
+  return /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs(
+    Link,
+    {
+      "aria-label": job.title,
+      href: resolve("jobs", encodeURIComponent(job.slug)).href,
+      className: "group grid min-w-0 gap-4 py-6 transition-colors hover:bg-muted/40 focus-visible:outline-2 focus-visible:outline-offset-4 focus-visible:outline-ring motion-reduce:transition-none sm:grid-cols-[minmax(0,1.6fr)_minmax(0,1fr)_auto] sm:items-center sm:gap-6 sm:py-7",
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-col gap-2", children: [
+          /* @__PURE__ */ jsx("h2", { className: "break-words text-xl font-semibold leading-snug group-hover:underline group-hover:underline-offset-4 sm:text-2xl", children: job.title }),
+          /* @__PURE__ */ jsx("span", { className: "break-words text-sm text-muted-foreground", children: job.department })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-col gap-1 text-sm", children: [
+          /* @__PURE__ */ jsx("span", { className: "break-words", children: job.location }),
+          job.remote && /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: copy.remote })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-4 text-sm sm:flex-col sm:items-end sm:gap-2", children: [
+          /* @__PURE__ */ jsx("span", { children: employmentLabel(job.employmentType, copy) }),
+          /* @__PURE__ */ jsx("span", { className: "font-medium underline underline-offset-4", children: copy.viewRole })
+        ] })
+      ]
+    }
+  ) });
+}
+function JobListPage({ department }) {
+  const copy = useJobBoardLocalization();
+  const { Link, resolve } = usePluginSiteNavigation(JOB_BOARD_PLUGIN_ID);
+  const [state, setFilterState] = useState({
+    department: "",
+    location: "",
+    employmentType: "",
+    remote: false
+  });
+  const setState = (patch) => setFilterState((current) => ({ ...current, ...patch }));
+  const employmentType = [
+    "full-time",
+    "part-time",
+    "contract",
+    "internship"
+  ].includes(state.employmentType) ? state.employmentType : void 0;
+  const filters = {
+    department: department || state.department || void 0,
+    location: state.location || void 0,
+    employmentType,
+    remote: state.remote || void 0
+  };
+  const { data, fetchNextPage, hasNextPage, isFetchingNextPage } = useSuspenseJobs(filters);
+  const hydrated = useJobBoardHydrated();
+  const jobs = data.pages.flatMap((page) => page.items).filter((job) => !hydrated || isJobOpen(job));
+  const firstPage = data.pages[0];
+  const taxonomies = firstPage?.taxonomies;
+  const filtered = !!(filters.department || filters.location || filters.employmentType || filters.remote);
+  const canClear = !!(!department && state.department || state.location || state.employmentType || state.remote);
+  return /* @__PURE__ */ jsxs(JobPage, { children: [
+    /* @__PURE__ */ jsxs("header", { className: "flex max-w-3xl flex-col gap-4", children: [
+      department && /* @__PURE__ */ jsx(
+        Link,
+        {
+          className: "inline-flex min-h-11 items-center self-start text-sm underline underline-offset-4",
+          href: resolve("jobs").href,
+          children: copy.backToJobs
+        }
+      ),
+      /* @__PURE__ */ jsx("h1", { className: "break-words text-4xl font-semibold leading-tight tracking-tight sm:text-5xl", children: department ? copy.departmentTitle.replace("{department}", department) : copy.title }),
+      /* @__PURE__ */ jsx("p", { className: "max-w-2xl text-lg leading-relaxed text-muted-foreground", children: copy.intro })
+    ] }),
+    /* @__PURE__ */ jsxs("fieldset", { className: "grid min-w-0 gap-4 rounded-lg border bg-muted/20 p-4 sm:grid-cols-2 lg:grid-cols-4 lg:p-5", children: [
+      /* @__PURE__ */ jsx("legend", { className: "sr-only", children: copy.title }),
+      !department && /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-col gap-2", children: [
+        /* @__PURE__ */ jsx(Label, { htmlFor: "job-board-department", children: copy.department }),
+        /* @__PURE__ */ jsxs(
+          "select",
+          {
+            id: "job-board-department",
+            className: jobSelectClass,
+            value: state.department,
+            onChange: (event) => setState({ department: event.target.value }),
+            children: [
+              /* @__PURE__ */ jsx("option", { value: "", children: copy.allDepartments }),
+              taxonomies?.departments.map((value) => /* @__PURE__ */ jsx("option", { value, children: value }, value))
+            ]
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-col gap-2", children: [
+        /* @__PURE__ */ jsx(Label, { htmlFor: "job-board-location", children: copy.location }),
+        /* @__PURE__ */ jsxs(
+          "select",
+          {
+            id: "job-board-location",
+            className: jobSelectClass,
+            value: state.location,
+            onChange: (event) => setState({ location: event.target.value }),
+            children: [
+              /* @__PURE__ */ jsx("option", { value: "", children: copy.allLocations }),
+              taxonomies?.locations.map((value) => /* @__PURE__ */ jsx("option", { value, children: value }, value))
+            ]
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-col gap-2", children: [
+        /* @__PURE__ */ jsx(Label, { htmlFor: "job-board-type", children: copy.employmentType }),
+        /* @__PURE__ */ jsxs(
+          "select",
+          {
+            id: "job-board-type",
+            className: jobSelectClass,
+            value: state.employmentType,
+            onChange: (event) => setState({ employmentType: event.target.value }),
+            children: [
+              /* @__PURE__ */ jsx("option", { value: "", children: copy.allEmploymentTypes }),
+              taxonomies?.employmentTypes.map((value) => /* @__PURE__ */ jsx("option", { value, children: employmentLabel(value, copy) }, value))
+            ]
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs("label", { className: "flex min-h-11 items-center gap-3 self-end text-sm", children: [
+        /* @__PURE__ */ jsx(
+          "input",
+          {
+            className: "size-5 accent-primary",
+            type: "checkbox",
+            checked: state.remote,
+            onChange: (event) => setState({ remote: event.target.checked })
+          }
+        ),
+        copy.remoteOnly
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs("section", { "aria-label": copy.title, className: "flex min-w-0 flex-col gap-5", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center justify-between gap-3", children: [
+        /* @__PURE__ */ jsx("p", { role: "status", className: "text-sm text-muted-foreground", children: copy.openRoles.replace("{count}", String(firstPage?.total ?? 0)) }),
+        canClear && /* @__PURE__ */ jsx(
+          Button,
+          {
+            className: "min-h-11",
+            variant: "ghost",
+            onClick: () => setState({
+              department: "",
+              location: "",
+              employmentType: "",
+              remote: false
+            }),
+            children: copy.clearFilters
+          }
+        )
+      ] }),
+      jobs.length ? /* @__PURE__ */ jsx("ul", { className: "flex min-w-0 flex-col divide-y border-y", children: jobs.map((job) => /* @__PURE__ */ jsx(JobRow, { job }, job.id)) }) : /* @__PURE__ */ jsx(JobsEmpty, { filtered }),
+      hasNextPage && /* @__PURE__ */ jsx(
+        Button,
+        {
+          className: "min-h-11 self-center",
+          variant: "outline",
+          disabled: isFetchingNextPage,
+          onClick: () => void fetchNextPage(),
+          children: isFetchingNextPage ? copy.loadingMore : copy.loadMore
+        }
+      )
+    ] })
+  ] });
+}
+
+export { JobListPage };

package/dist/packages/stack/src/plugins/job-board/client/components/pages/job-list-page.mjs

@@ -0,0 +1,26 @@
+"use client";
+import { jsx } from 'react/jsx-runtime';
+import { lazy } from 'react';
+import { ComposedRoute } from '@btst/stack/client/components';
+import { JobNotFound, JobLoading, JobError } from '../shared.mjs';
+
+const JobList = lazy(
+  () => import('./job-list-page.internal.mjs').then((module) => ({
+    default: module.JobListPage
+  }))
+);
+function JobListPageComponent() {
+  return /* @__PURE__ */ jsx(
+    ComposedRoute,
+    {
+      path: "/jobs",
+      PageComponent: JobList,
+      ErrorComponent: JobError,
+      LoadingComponent: JobLoading,
+      NotFoundComponent: JobNotFound,
+      onError: (error) => console.error("[btst/job-board]", error)
+    }
+  );
+}
+
+export { JobListPageComponent };

package/dist/packages/stack/src/plugins/job-board/client/components/shared.cjs

@@ -0,0 +1,84 @@
+"use client";
+'use strict';
+
+const jsxRuntime = require('react/jsx-runtime');
+const context = require('@btst/stack/context');
+const button = require('../../../../../../ui/src/components/button.cjs');
+const empty = require('../../../../../../ui/src/components/empty.cjs');
+const skeleton = require('../../../../../../ui/src/components/skeleton.cjs');
+const utils = require('../../../../../../ui/src/lib/utils.cjs');
+const constants = require('../constants.cjs');
+const plugins_jobBoard_client_hooks_index = require('../../../../../../../plugins/job-board/client/hooks/index.cjs');
+
+function JobPage({ children }) {
+  const { className } = context.usePluginOverrides(constants.JOB_BOARD_PLUGIN_ID);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-testid": "job-board-page",
+      className: utils.cn(
+        "mx-auto flex w-full min-w-0 max-w-6xl flex-col gap-10 px-4 py-8 sm:px-6 sm:py-12",
+        className
+      ),
+      children
+    }
+  );
+}
+function JobLoading() {
+  const copy = plugins_jobBoard_client_hooks_index.useJobBoardLocalization();
+  return /* @__PURE__ */ jsxRuntime.jsxs(JobPage, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx("p", { role: "status", className: "text-muted-foreground", children: copy.loading }),
+    /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-12 w-2/3" }),
+    /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-24 w-full" }),
+    /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-24 w-full" })
+  ] });
+}
+function JobError({ error, resetErrorBoundary }) {
+  const copy = plugins_jobBoard_client_hooks_index.useJobBoardLocalization();
+  return /* @__PURE__ */ jsxRuntime.jsx(JobPage, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { role: "alert", className: "flex max-w-xl flex-col gap-4", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "text-2xl font-semibold", children: copy.errorTitle }),
+    /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground", children: process.env.NODE_ENV === "development" && error instanceof Error ? error.message : copy.errorDescription }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      button.Button,
+      {
+        className: "min-h-11 self-start",
+        variant: "outline",
+        onClick: resetErrorBoundary,
+        children: copy.retry
+      }
+    )
+  ] }) });
+}
+function JobNotFound() {
+  const copy = plugins_jobBoard_client_hooks_index.useJobBoardLocalization();
+  const { Link, resolve } = context.usePluginSiteNavigation(constants.JOB_BOARD_PLUGIN_ID);
+  return /* @__PURE__ */ jsxRuntime.jsx(JobPage, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex max-w-xl flex-col gap-4", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "text-3xl font-semibold", children: copy.notFoundTitle }),
+    /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground", children: copy.notFoundDescription }),
+    /* @__PURE__ */ jsxRuntime.jsx(button.Button, { className: "min-h-11 self-start", variant: "outline", asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(Link, { href: resolve("jobs").href, children: copy.backToJobs }) })
+  ] }) });
+}
+function JobsEmpty({ filtered }) {
+  const copy = plugins_jobBoard_client_hooks_index.useJobBoardLocalization();
+  return /* @__PURE__ */ jsxRuntime.jsx(empty.Empty, { className: "items-start border text-left", children: /* @__PURE__ */ jsxRuntime.jsxs(empty.EmptyHeader, { className: "items-start text-left", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(empty.EmptyTitle, { children: copy.emptyTitle }),
+    /* @__PURE__ */ jsxRuntime.jsx(empty.EmptyDescription, { children: filtered ? copy.filteredEmptyDescription : copy.emptyDescription })
+  ] }) });
+}
+function employmentLabel(type, copy) {
+  return {
+    "full-time": copy.fullTime,
+    "part-time": copy.partTime,
+    contract: copy.contract,
+    internship: copy.internship
+  }[type];
+}
+const jobSelectClass = "border-input bg-background min-h-11 w-full min-w-0 rounded-md border px-3 text-sm focus-visible:outline-2 focus-visible:outline-ring";
+
+exports.JobError = JobError;
+exports.JobLoading = JobLoading;
+exports.JobNotFound = JobNotFound;
+exports.JobPage = JobPage;
+exports.JobsEmpty = JobsEmpty;
+exports.employmentLabel = employmentLabel;
+exports.jobSelectClass = jobSelectClass;

package/dist/packages/stack/src/plugins/job-board/client/components/shared.mjs

@@ -0,0 +1,76 @@
+"use client";
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { usePluginSiteNavigation, usePluginOverrides } from '@btst/stack/context';
+import { Button } from '../../../../../../ui/src/components/button.mjs';
+import { Empty, EmptyHeader, EmptyTitle, EmptyDescription } from '../../../../../../ui/src/components/empty.mjs';
+import { Skeleton } from '../../../../../../ui/src/components/skeleton.mjs';
+import { cn } from '../../../../../../ui/src/lib/utils.mjs';
+import { JOB_BOARD_PLUGIN_ID } from '../constants.mjs';
+import { useJobBoardLocalization } from '../../../../../../../plugins/job-board/client/hooks/index.mjs';
+
+function JobPage({ children }) {
+  const { className } = usePluginOverrides(JOB_BOARD_PLUGIN_ID);
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-testid": "job-board-page",
+      className: cn(
+        "mx-auto flex w-full min-w-0 max-w-6xl flex-col gap-10 px-4 py-8 sm:px-6 sm:py-12",
+        className
+      ),
+      children
+    }
+  );
+}
+function JobLoading() {
+  const copy = useJobBoardLocalization();
+  return /* @__PURE__ */ jsxs(JobPage, { children: [
+    /* @__PURE__ */ jsx("p", { role: "status", className: "text-muted-foreground", children: copy.loading }),
+    /* @__PURE__ */ jsx(Skeleton, { className: "h-12 w-2/3" }),
+    /* @__PURE__ */ jsx(Skeleton, { className: "h-24 w-full" }),
+    /* @__PURE__ */ jsx(Skeleton, { className: "h-24 w-full" })
+  ] });
+}
+function JobError({ error, resetErrorBoundary }) {
+  const copy = useJobBoardLocalization();
+  return /* @__PURE__ */ jsx(JobPage, { children: /* @__PURE__ */ jsxs("div", { role: "alert", className: "flex max-w-xl flex-col gap-4", children: [
+    /* @__PURE__ */ jsx("h1", { className: "text-2xl font-semibold", children: copy.errorTitle }),
+    /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: process.env.NODE_ENV === "development" && error instanceof Error ? error.message : copy.errorDescription }),
+    /* @__PURE__ */ jsx(
+      Button,
+      {
+        className: "min-h-11 self-start",
+        variant: "outline",
+        onClick: resetErrorBoundary,
+        children: copy.retry
+      }
+    )
+  ] }) });
+}
+function JobNotFound() {
+  const copy = useJobBoardLocalization();
+  const { Link, resolve } = usePluginSiteNavigation(JOB_BOARD_PLUGIN_ID);
+  return /* @__PURE__ */ jsx(JobPage, { children: /* @__PURE__ */ jsxs("div", { className: "flex max-w-xl flex-col gap-4", children: [
+    /* @__PURE__ */ jsx("h1", { className: "text-3xl font-semibold", children: copy.notFoundTitle }),
+    /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: copy.notFoundDescription }),
+    /* @__PURE__ */ jsx(Button, { className: "min-h-11 self-start", variant: "outline", asChild: true, children: /* @__PURE__ */ jsx(Link, { href: resolve("jobs").href, children: copy.backToJobs }) })
+  ] }) });
+}
+function JobsEmpty({ filtered }) {
+  const copy = useJobBoardLocalization();
+  return /* @__PURE__ */ jsx(Empty, { className: "items-start border text-left", children: /* @__PURE__ */ jsxs(EmptyHeader, { className: "items-start text-left", children: [
+    /* @__PURE__ */ jsx(EmptyTitle, { children: copy.emptyTitle }),
+    /* @__PURE__ */ jsx(EmptyDescription, { children: filtered ? copy.filteredEmptyDescription : copy.emptyDescription })
+  ] }) });
+}
+function employmentLabel(type, copy) {
+  return {
+    "full-time": copy.fullTime,
+    "part-time": copy.partTime,
+    contract: copy.contract,
+    internship: copy.internship
+  }[type];
+}
+const jobSelectClass = "border-input bg-background min-h-11 w-full min-w-0 rounded-md border px-3 text-sm focus-visible:outline-2 focus-visible:outline-ring";
+
+export { JobError, JobLoading, JobNotFound, JobPage, JobsEmpty, employmentLabel, jobSelectClass };

package/dist/packages/stack/src/plugins/job-board/client/constants.cjs

@@ -0,0 +1,5 @@
+'use strict';
+
+const JOB_BOARD_PLUGIN_ID = "jobBoard";
+
+exports.JOB_BOARD_PLUGIN_ID = JOB_BOARD_PLUGIN_ID;

package/dist/packages/stack/src/plugins/job-board/client/constants.mjs

@@ -0,0 +1,3 @@
+const JOB_BOARD_PLUGIN_ID = "jobBoard";
+
+export { JOB_BOARD_PLUGIN_ID };

package/dist/packages/stack/src/plugins/job-board/client/localization/index.cjs

@@ -0,0 +1,46 @@
+'use strict';
+
+const jobBoardLocalization = {
+  title: "Open roles",
+  intro: "Find a role by team, location and employment type.",
+  departmentTitle: "{department} roles",
+  department: "Department",
+  allDepartments: "All departments",
+  location: "Location",
+  allLocations: "All locations",
+  employmentType: "Employment type",
+  allEmploymentTypes: "All employment types",
+  remoteOnly: "Remote roles only",
+  remote: "Remote",
+  onSite: "On site",
+  fullTime: "Full time",
+  partTime: "Part time",
+  contract: "Contract",
+  internship: "Internship",
+  clearFilters: "Clear filters",
+  viewRole: "View role",
+  openRoles: "{count} open roles",
+  loadMore: "Show more roles",
+  loadingMore: "Loading more roles\u2026",
+  loading: "Loading open roles\u2026",
+  emptyTitle: "No open roles",
+  emptyDescription: "There are no open positions right now. Check back for new roles.",
+  filteredEmptyDescription: "No roles match these filters. Change a filter or clear them to see other positions.",
+  errorTitle: "Open roles could not be loaded",
+  errorDescription: "Check your connection and try loading the roles again.",
+  retry: "Try again",
+  notFoundTitle: "This role is no longer available",
+  notFoundDescription: "The role may have closed or the link may have changed. See the current open positions.",
+  backToJobs: "All open roles",
+  aboutRole: "About the role",
+  requirements: "What you will bring",
+  salary: "Salary",
+  closingDate: "Applications close",
+  apply: "Apply for this role",
+  application: "Your application",
+  applicationDescription: "Complete the application form for this role.",
+  applicationsUnavailable: "Applications are not available for this role.",
+  workplace: "Workplace"
+};
+
+exports.jobBoardLocalization = jobBoardLocalization;

package/dist/packages/stack/src/plugins/job-board/client/localization/index.mjs

@@ -0,0 +1,44 @@
+const jobBoardLocalization = {
+  title: "Open roles",
+  intro: "Find a role by team, location and employment type.",
+  departmentTitle: "{department} roles",
+  department: "Department",
+  allDepartments: "All departments",
+  location: "Location",
+  allLocations: "All locations",
+  employmentType: "Employment type",
+  allEmploymentTypes: "All employment types",
+  remoteOnly: "Remote roles only",
+  remote: "Remote",
+  onSite: "On site",
+  fullTime: "Full time",
+  partTime: "Part time",
+  contract: "Contract",
+  internship: "Internship",
+  clearFilters: "Clear filters",
+  viewRole: "View role",
+  openRoles: "{count} open roles",
+  loadMore: "Show more roles",
+  loadingMore: "Loading more roles\u2026",
+  loading: "Loading open roles\u2026",
+  emptyTitle: "No open roles",
+  emptyDescription: "There are no open positions right now. Check back for new roles.",
+  filteredEmptyDescription: "No roles match these filters. Change a filter or clear them to see other positions.",
+  errorTitle: "Open roles could not be loaded",
+  errorDescription: "Check your connection and try loading the roles again.",
+  retry: "Try again",
+  notFoundTitle: "This role is no longer available",
+  notFoundDescription: "The role may have closed or the link may have changed. See the current open positions.",
+  backToJobs: "All open roles",
+  aboutRole: "About the role",
+  requirements: "What you will bring",
+  salary: "Salary",
+  closingDate: "Applications close",
+  apply: "Apply for this role",
+  application: "Your application",
+  applicationDescription: "Complete the application form for this role.",
+  applicationsUnavailable: "Applications are not available for this role.",
+  workplace: "Workplace"
+};
+
+export { jobBoardLocalization };