@tribepad/themis 1.6.9 → 1.6.10

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tribepad/themis",
-  "version": "1.6.9",
+  "version": "1.6.10",
   "description": "Accessible React component library built on React Aria primitives",
   "author": "Tribepad <mbasford@tribepad.com>",
   "license": "MIT",

package/src/elements/Tabs/Tabs.stories.tsx

@@ -390,6 +390,39 @@ export const Stepper: Story = {
   ),
 };
 
+/**
+ * StepperVerticalNonLinear: vertical stepper driven by explicit per-step
+ * `completed` state plus a `sublabel`. This is the EOS blueprint-editor left
+ * rail: the current step (Pipeline & Journeys) is itself completed, while an
+ * earlier step (Candidate Workflow) is still outstanding — which the default
+ * index-based inference can't express.
+ */
+export const StepperVerticalNonLinear: Story = {
+  render: () => (
+    <Tabs
+      variant="stepper"
+      orientation="vertical"
+      defaultSelectedKey="pipeline"
+      className="w-[240px]"
+    >
+      <TabList aria-label="Edit blueprint steps">
+        <Tab id="details" completed>Position Details</Tab>
+        <Tab id="workflow" completed={false}>Candidate Workflow</Tab>
+        <Tab id="pipeline" completed sublabel="Current step">Pipeline &amp; Journeys</Tab>
+      </TabList>
+      <TabPanel id="details">
+        <div className="p-4">Position Details — completed.</div>
+      </TabPanel>
+      <TabPanel id="workflow">
+        <div className="p-4">Candidate Workflow — still outstanding (open “2”).</div>
+      </TabPanel>
+      <TabPanel id="pipeline">
+        <div className="p-4">Pipeline &amp; Journeys — current step, also completed.</div>
+      </TabPanel>
+    </Tabs>
+  ),
+};
+
 /**
  * StepperFirstStep: Stepper with the first step active (no completed steps).
  */