@stealthscale/component-feedback 0.2.2 → 0.2.3

package/dist/pages/meter/meter.props.js

@@ -0,0 +1,3 @@
+export const dropped = {"RootProps": {"conditions": 284, "foreign": 1038}, "LabelProps": {"conditions": 284, "foreign": 1041}, "MarkerProps": {"conditions": 284, "foreign": 1041}, "RangeProps": {"conditions": 284, "foreign": 1041}, "SegmentProps": {"conditions": 284, "foreign": 1040}, "TrackProps": {"conditions": 284, "foreign": 1041}, "ValueTextProps": {"conditions": 284, "foreign": 1041}};
+export const parts = {"RootProps": [{"accepts": "\"ltr\" | \"rtl\"", "fallback": "\"ltr\"", "kind": "option", "name": "dir", "refers": [], "required": false, "says": "The document's text/writing direction."}, {"accepts": "NumberFormatOptions", "fallback": "{ style: \"percent\" }", "kind": "option", "name": "formatOptions", "refers": [], "required": false, "says": "The options to use for formatting the value."}, {"accepts": "(() => Document | Node | ShadowRoot)", "fallback": "", "kind": "option", "name": "getRootNode", "refers": [], "required": false, "says": "A root node to correctly resolve document in custom environments. E.x.: Iframes, Electron."}, {"accepts": "string", "fallback": "", "kind": "option", "name": "id", "refers": [], "required": false, "says": "The unique identifier of the machine."}, {"accepts": "ElementIds", "fallback": "", "kind": "option", "name": "ids", "refers": ["progress.ElementIds"], "required": false, "says": "The ids of the elements in the progress bar. Useful for composition."}, {"accepts": "\"inline\" | \"stacked\"", "fallback": "", "kind": "variant", "name": "layout", "refers": [], "required": false, "says": ""}, {"accepts": "string", "fallback": "\"en-US\"", "kind": "option", "name": "locale", "refers": [], "required": false, "says": "The locale to use for formatting the value."}, {"accepts": "number", "fallback": "100", "kind": "option", "name": "max", "refers": [], "required": false, "says": "The maximum allowed value of the progress bar."}, {"accepts": "number", "fallback": "0", "kind": "option", "name": "min", "refers": [], "required": false, "says": "The minimum allowed value of the progress bar."}, {"accepts": "\"accent\" | \"error\" | \"info\" | \"neutral\" | \"primary\" | \"secondary\" | \"success\" | \"warning\"", "fallback": "", "kind": "variant", "name": "palette", "refers": [], "required": false, "says": ""}, {"accepts": "\"full\" | \"rounded\" | \"square\"", "fallback": "", "kind": "variant", "name": "shape", "refers": [], "required": false, "says": ""}, {"accepts": "\"lg\" | \"md\" | \"sm\" | \"xl\" | \"xs\"", "fallback": "", "kind": "variant", "name": "size", "refers": [], "required": false, "says": ""}, {"accepts": "number", "fallback": "", "kind": "option", "name": "value", "refers": [], "required": true, "says": "The measured value, between `min` and `max`."}, {"accepts": "\"outline\" | \"subtle\"", "fallback": "", "kind": "variant", "name": "variant", "refers": [], "required": false, "says": ""}], "LabelProps": [], "MarkerProps": [{"accepts": "number", "fallback": "", "kind": "option", "name": "value", "refers": [], "required": true, "says": "Value the marker is placed at, in the units of `min` and `max`."}], "RangeProps": [], "SegmentProps": [{"accepts": "SegmentColor", "fallback": "", "kind": "option", "name": "color", "refers": ["kit.SegmentColor"], "required": false, "says": "Color the segment fills in: a series color, or a palette's solid. The series color at the segment's place unless stated."}, {"accepts": "number", "fallback": "", "kind": "option", "name": "value", "refers": [], "required": true, "says": "Amount the segment stands for, in the units of `min` and `max`."}], "TrackProps": [], "ValueTextProps": []};
+export const shapes = {"progress.ElementIds": [{"accepts": "string", "name": "root", "says": ""}, {"accepts": "string", "name": "track", "says": ""}, {"accepts": "string", "name": "label", "says": ""}, {"accepts": "string", "name": "circle", "says": ""}], "kit.SegmentColor": [{"accepts": "", "name": "\"accent\"", "says": ""}, {"accepts": "", "name": "\"error\"", "says": ""}, {"accepts": "", "name": "\"info\"", "says": ""}, {"accepts": "", "name": "\"neutral\"", "says": ""}, {"accepts": "", "name": "\"primary\"", "says": ""}, {"accepts": "", "name": "\"secondary\"", "says": ""}, {"accepts": "", "name": "\"series.1\"", "says": ""}, {"accepts": "", "name": "\"series.2\"", "says": ""}, {"accepts": "", "name": "\"series.3\"", "says": ""}, {"accepts": "", "name": "\"series.4\"", "says": ""}, {"accepts": "", "name": "\"series.5\"", "says": ""}, {"accepts": "", "name": "\"series.6\"", "says": ""}, {"accepts": "", "name": "\"series.7\"", "says": ""}, {"accepts": "", "name": "\"series.8\"", "says": ""}, {"accepts": "", "name": "\"success\"", "says": ""}, {"accepts": "", "name": "\"warning\"", "says": ""}]};

package/dist/pages/pages.json

@@ -0,0 +1,115 @@
+{
+  "format": 1,
+  "pages": [
+    {
+      "about": "alert.about",
+      "group": "",
+      "id": "components/feedback/alert",
+      "module": "alert/alert.js",
+      "namespace": "",
+      "props": "alert/alert.props.js",
+      "specimen": "src/alert/alert.specimen.tsx",
+      "title": "alert.title"
+    },
+    {
+      "about": "empty-state.about",
+      "group": "",
+      "id": "components/feedback/empty-state",
+      "module": "empty-state/empty-state.js",
+      "namespace": "",
+      "props": "empty-state/empty-state.props.js",
+      "specimen": "src/empty-state/empty-state.specimen.tsx",
+      "title": "empty-state.title"
+    },
+    {
+      "about": "loader.about",
+      "group": "",
+      "id": "components/feedback/loader",
+      "module": "loader/loader.js",
+      "namespace": "",
+      "props": "loader/loader.props.js",
+      "specimen": "src/loader/loader.specimen.tsx",
+      "title": "loader.title"
+    },
+    {
+      "about": "meter.about",
+      "group": "",
+      "id": "components/feedback/meter",
+      "module": "meter/meter.js",
+      "namespace": "",
+      "props": "meter/meter.props.js",
+      "specimen": "src/meter/meter.specimen.tsx",
+      "title": "meter.title"
+    },
+    {
+      "about": "progress-circle.about",
+      "group": "",
+      "id": "components/feedback/progress-circle",
+      "module": "progress-circle/progress-circle.js",
+      "namespace": "",
+      "props": "progress-circle/progress-circle.props.js",
+      "specimen": "src/progress-circle/progress-circle.specimen.tsx",
+      "title": "progress-circle.title"
+    },
+    {
+      "about": "progress.about",
+      "group": "",
+      "id": "components/feedback/progress",
+      "module": "progress/progress.js",
+      "namespace": "",
+      "props": "progress/progress.props.js",
+      "specimen": "src/progress/progress.specimen.tsx",
+      "title": "progress.title"
+    },
+    {
+      "about": "skeleton-text.about",
+      "group": "",
+      "id": "components/feedback/skeleton-text",
+      "module": "skeleton-text/skeleton-text.js",
+      "namespace": "",
+      "props": "skeleton-text/skeleton-text.props.js",
+      "specimen": "src/skeleton-text/skeleton-text.specimen.tsx",
+      "title": "skeleton-text.title"
+    },
+    {
+      "about": "skeleton.about",
+      "group": "",
+      "id": "components/feedback/skeleton",
+      "module": "skeleton/skeleton.js",
+      "namespace": "",
+      "props": "skeleton/skeleton.props.js",
+      "specimen": "src/skeleton/skeleton.specimen.tsx",
+      "title": "skeleton.title"
+    },
+    {
+      "about": "spinner.about",
+      "group": "",
+      "id": "components/feedback/spinner",
+      "module": "spinner/spinner.js",
+      "namespace": "",
+      "props": "spinner/spinner.props.js",
+      "specimen": "src/spinner/spinner.specimen.tsx",
+      "title": "spinner.title"
+    },
+    {
+      "about": "toast.about",
+      "group": "",
+      "id": "components/feedback/toast",
+      "module": "toast/toast.js",
+      "namespace": "",
+      "props": "toast/toast.props.js",
+      "specimen": "src/toast/toast.specimen.tsx",
+      "title": "toast.title"
+    }
+  ],
+  "requires": {
+    "@stealthscale/component-actions": "^0.2.0",
+    "@stealthscale/component-data": "^0.2.0",
+    "@stealthscale/component-forms": "^0.3.0",
+    "@stealthscale/component-layout": "^0.2.0",
+    "@stealthscale/component-surfaces": "^0.1.0",
+    "@stealthscale/component-typography": "^0.3.0",
+    "@stealthscale/specimen": "^0.3.0",
+    "lucide-react": "^1.52.0"
+  }
+}

package/dist/pages/progress/progress.js

@@ -0,0 +1,550 @@
+import { t as __exportAll } from "../../rolldown-runtime-D7D4PA-g.js";
+import { a as recipe } from "../../recipes-CX1gSsN7.js";
+import { D as Range, E as Segment, O as Marker, T as Track, j as Root, k as Label, w as ValueText } from "../../shared-Xc-n0bn7.js";
+import { c } from "react/compiler-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Matrix, Room, scenesOf, specimen, useWords } from "@stealthscale/specimen";
+import { Stack } from "@stealthscale/component-layout";
+import { Status } from "@stealthscale/component-data";
+//#region src/progress/examples/imported.example.tsx
+var imported_example_exports = /* @__PURE__ */ __exportAll({
+	Imported: () => Imported,
+	source: () => source$5
+});
+function Imported() {
+	const $ = c(17);
+	const { t } = useWords("progress");
+	let t0;
+	if ($[0] !== t) {
+		t0 = t("imported");
+		$[0] = t;
+		$[1] = t0;
+	} else t0 = $[1];
+	let t1;
+	if ($[2] !== t0) {
+		t1 = /* @__PURE__ */ jsx(Label, { children: t0 });
+		$[2] = t0;
+		$[3] = t1;
+	} else t1 = $[3];
+	let t2;
+	if ($[4] !== t) {
+		t2 = t("rows");
+		$[4] = t;
+		$[5] = t2;
+	} else t2 = $[5];
+	let t3;
+	if ($[6] !== t2) {
+		t3 = /* @__PURE__ */ jsx(ValueText, { children: t2 });
+		$[6] = t2;
+		$[7] = t3;
+	} else t3 = $[7];
+	let t4;
+	if ($[8] !== t) {
+		t4 = t("rows");
+		$[8] = t;
+		$[9] = t4;
+	} else t4 = $[9];
+	let t5;
+	if ($[10] === Symbol.for("react.memo_cache_sentinel")) {
+		t5 = /* @__PURE__ */ jsx(Range, {});
+		$[10] = t5;
+	} else t5 = $[10];
+	let t6;
+	if ($[11] !== t4) {
+		t6 = /* @__PURE__ */ jsx(Track, {
+			"aria-valuetext": t4,
+			children: t5
+		});
+		$[11] = t4;
+		$[12] = t6;
+	} else t6 = $[12];
+	let t7;
+	if ($[13] !== t1 || $[14] !== t3 || $[15] !== t6) {
+		t7 = /* @__PURE__ */ jsxs(Root, {
+			max: 4200,
+			palette: "success",
+			value: 2650,
+			children: [
+				t1,
+				t3,
+				t6
+			]
+		});
+		$[13] = t1;
+		$[14] = t3;
+		$[15] = t6;
+		$[16] = t7;
+	} else t7 = $[16];
+	return t7;
+}
+const source$5 = "import { type ReactElement } from \"react\";\n\nimport { useWords } from \"@stealthscale/specimen\";\n\nimport { Progress } from \"@stealthscale/component-feedback\";\n\nexport function Imported(): ReactElement {\n  const { t } = useWords(\"progress\");\n\n  return (\n    <Progress.Root max={4200} palette=\"success\" value={2650}>\n      <Progress.Label>{t(\"imported\")}</Progress.Label>\n      <Progress.ValueText>{t(\"rows\")}</Progress.ValueText>\n      <Progress.Track aria-valuetext={t(\"rows\")}>\n        <Progress.Range />\n      </Progress.Track>\n    </Progress.Root>\n  );\n}\n";
+//#endregion
+//#region src/progress/examples/outcomes.example.tsx
+var outcomes_example_exports = /* @__PURE__ */ __exportAll({
+	Outcomes: () => Outcomes,
+	source: () => source$4
+});
+const TESTS = 1200;
+const OUTCOMES = [
+	{
+		color: "success",
+		count: 812,
+		key: "passed"
+	},
+	{
+		color: "error",
+		count: 12,
+		key: "failed"
+	},
+	{
+		color: "neutral",
+		count: 40,
+		key: "skipped"
+	}
+];
+const RUN = OUTCOMES.reduce((sum, outcome) => sum + outcome.count, 0);
+function Outcomes() {
+	const $ = c(22);
+	const { t } = useWords("progress");
+	let t0;
+	if ($[0] !== t) {
+		t0 = t("outcomes.value", {
+			run: RUN,
+			tests: TESTS
+		});
+		$[0] = t;
+		$[1] = t0;
+	} else t0 = $[1];
+	const words = t0;
+	let t1;
+	if ($[2] !== t) {
+		t1 = t("outcomes.label");
+		$[2] = t;
+		$[3] = t1;
+	} else t1 = $[3];
+	let t2;
+	if ($[4] !== t1) {
+		t2 = /* @__PURE__ */ jsx(Label, { children: t1 });
+		$[4] = t1;
+		$[5] = t2;
+	} else t2 = $[5];
+	let t3;
+	if ($[6] !== words) {
+		t3 = /* @__PURE__ */ jsx(ValueText, { children: words });
+		$[6] = words;
+		$[7] = t3;
+	} else t3 = $[7];
+	let t4;
+	if ($[8] === Symbol.for("react.memo_cache_sentinel")) {
+		t4 = OUTCOMES.map(_temp);
+		$[8] = t4;
+	} else t4 = $[8];
+	let t5;
+	if ($[9] !== words) {
+		t5 = /* @__PURE__ */ jsx(Track, {
+			"aria-valuetext": words,
+			children: t4
+		});
+		$[9] = words;
+		$[10] = t5;
+	} else t5 = $[10];
+	let t6;
+	if ($[11] !== t2 || $[12] !== t3 || $[13] !== t5) {
+		t6 = /* @__PURE__ */ jsxs(Root, {
+			max: TESTS,
+			value: RUN,
+			children: [
+				t2,
+				t3,
+				t5
+			]
+		});
+		$[11] = t2;
+		$[12] = t3;
+		$[13] = t5;
+		$[14] = t6;
+	} else t6 = $[14];
+	let t7;
+	if ($[15] !== t) {
+		t7 = OUTCOMES.map((t8) => {
+			const { color: color_0, count: count_0, key: key_0 } = t8;
+			return /* @__PURE__ */ jsxs(Status.Root, {
+				palette: color_0,
+				size: "sm",
+				children: [/* @__PURE__ */ jsx(Status.Indicator, {}), t(`outcomes.${key_0}`, { count: count_0 })]
+			}, key_0);
+		});
+		$[15] = t;
+		$[16] = t7;
+	} else t7 = $[16];
+	let t8;
+	if ($[17] !== t7) {
+		t8 = /* @__PURE__ */ jsx(Stack, {
+			direction: "row",
+			gap: "md",
+			wrap: true,
+			children: t7
+		});
+		$[17] = t7;
+		$[18] = t8;
+	} else t8 = $[18];
+	let t9;
+	if ($[19] !== t6 || $[20] !== t8) {
+		t9 = /* @__PURE__ */ jsxs(Stack, {
+			gap: "sm",
+			children: [t6, t8]
+		});
+		$[19] = t6;
+		$[20] = t8;
+		$[21] = t9;
+	} else t9 = $[21];
+	return t9;
+}
+function _temp(t0) {
+	const { color, count, key } = t0;
+	return /* @__PURE__ */ jsx(Segment, {
+		color,
+		value: count
+	}, key);
+}
+const source$4 = "import { type ReactElement } from \"react\";\n\nimport { Status } from \"@stealthscale/component-data\";\nimport { Stack } from \"@stealthscale/component-layout\";\nimport { useWords } from \"@stealthscale/specimen\";\n\nimport { Progress } from \"@stealthscale/component-feedback\";\n\nconst TESTS = 1200;\n\nconst OUTCOMES = [\n  { color: \"success\", count: 812, key: \"passed\" },\n  { color: \"error\", count: 12, key: \"failed\" },\n  { color: \"neutral\", count: 40, key: \"skipped\" },\n] as const;\n\nconst RUN = OUTCOMES.reduce((sum, outcome) => sum + outcome.count, 0);\n\nexport function Outcomes(): ReactElement {\n  const { t } = useWords(\"progress\");\n  const words = t(\"outcomes.value\", { run: RUN, tests: TESTS });\n\n  return (\n    <Stack gap=\"sm\">\n      <Progress.Root max={TESTS} value={RUN}>\n        <Progress.Label>{t(\"outcomes.label\")}</Progress.Label>\n        <Progress.ValueText>{words}</Progress.ValueText>\n        <Progress.Track aria-valuetext={words}>\n          {OUTCOMES.map(({ color, count, key }) => (\n            <Progress.Segment color={color} key={key} value={count} />\n          ))}\n        </Progress.Track>\n      </Progress.Root>\n      <Stack direction=\"row\" gap=\"md\" wrap>\n        {OUTCOMES.map(({ color, count, key }) => (\n          <Status.Root key={key} palette={color} size=\"sm\">\n            <Status.Indicator />\n            {t(`outcomes.${key}`, { count })}\n          </Status.Root>\n        ))}\n      </Stack>\n    </Stack>\n  );\n}\n";
+//#endregion
+//#region src/progress/examples/plan.example.tsx
+var plan_example_exports = /* @__PURE__ */ __exportAll({
+	Plan: () => Plan,
+	source: () => source$3
+});
+const DONE = 62;
+const PLANNED = 70;
+function Plan() {
+	const $ = c(18);
+	const { t } = useWords("progress");
+	let t0;
+	if ($[0] !== t) {
+		t0 = t("plan.label");
+		$[0] = t;
+		$[1] = t0;
+	} else t0 = $[1];
+	let t1;
+	if ($[2] !== t0) {
+		t1 = /* @__PURE__ */ jsx(Label, { children: t0 });
+		$[2] = t0;
+		$[3] = t1;
+	} else t1 = $[3];
+	let t2;
+	if ($[4] !== t) {
+		t2 = t("plan.value", {
+			done: DONE,
+			planned: PLANNED
+		});
+		$[4] = t;
+		$[5] = t2;
+	} else t2 = $[5];
+	let t3;
+	if ($[6] !== t2) {
+		t3 = /* @__PURE__ */ jsx(ValueText, { children: t2 });
+		$[6] = t2;
+		$[7] = t3;
+	} else t3 = $[7];
+	let t4;
+	if ($[8] !== t) {
+		t4 = t("plan.spoken", {
+			done: DONE,
+			planned: PLANNED
+		});
+		$[8] = t;
+		$[9] = t4;
+	} else t4 = $[9];
+	let t5;
+	let t6;
+	if ($[10] === Symbol.for("react.memo_cache_sentinel")) {
+		t5 = /* @__PURE__ */ jsx(Range, {});
+		t6 = /* @__PURE__ */ jsx(Marker, { value: PLANNED });
+		$[10] = t5;
+		$[11] = t6;
+	} else {
+		t5 = $[10];
+		t6 = $[11];
+	}
+	let t7;
+	if ($[12] !== t4) {
+		t7 = /* @__PURE__ */ jsxs(Track, {
+			"aria-valuetext": t4,
+			children: [t5, t6]
+		});
+		$[12] = t4;
+		$[13] = t7;
+	} else t7 = $[13];
+	let t8;
+	if ($[14] !== t1 || $[15] !== t3 || $[16] !== t7) {
+		t8 = /* @__PURE__ */ jsxs(Root, {
+			palette: "warning",
+			value: DONE,
+			children: [
+				t1,
+				t3,
+				t7
+			]
+		});
+		$[14] = t1;
+		$[15] = t3;
+		$[16] = t7;
+		$[17] = t8;
+	} else t8 = $[17];
+	return t8;
+}
+const source$3 = "import { type ReactElement } from \"react\";\n\nimport { useWords } from \"@stealthscale/specimen\";\n\nimport { Progress } from \"@stealthscale/component-feedback\";\n\nconst DONE = 62;\n\nconst PLANNED = 70;\n\nexport function Plan(): ReactElement {\n  const { t } = useWords(\"progress\");\n\n  return (\n    <Progress.Root palette={DONE < PLANNED ? \"warning\" : \"primary\"} value={DONE}>\n      <Progress.Label>{t(\"plan.label\")}</Progress.Label>\n      <Progress.ValueText>{t(\"plan.value\", { done: DONE, planned: PLANNED })}</Progress.ValueText>\n      <Progress.Track aria-valuetext={t(\"plan.spoken\", { done: DONE, planned: PLANNED })}>\n        <Progress.Range />\n        <Progress.Marker value={PLANNED} />\n      </Progress.Track>\n    </Progress.Root>\n  );\n}\n";
+//#endregion
+//#region src/progress/examples/playback.example.tsx
+var playback_example_exports = /* @__PURE__ */ __exportAll({
+	Playback: () => Playback,
+	source: () => source$2
+});
+function Playback() {
+	const $ = c(8);
+	const { t } = useWords("progress");
+	let t0;
+	if ($[0] !== t) {
+		t0 = t("playback");
+		$[0] = t;
+		$[1] = t0;
+	} else t0 = $[1];
+	let t1;
+	if ($[2] !== t) {
+		t1 = t("played");
+		$[2] = t;
+		$[3] = t1;
+	} else t1 = $[3];
+	let t2;
+	if ($[4] === Symbol.for("react.memo_cache_sentinel")) {
+		t2 = /* @__PURE__ */ jsx(Range, {});
+		$[4] = t2;
+	} else t2 = $[4];
+	let t3;
+	if ($[5] !== t0 || $[6] !== t1) {
+		t3 = /* @__PURE__ */ jsx(Root, {
+			max: 245,
+			size: "xs",
+			value: 161,
+			children: /* @__PURE__ */ jsx(Track, {
+				"aria-label": t0,
+				"aria-valuetext": t1,
+				children: t2
+			})
+		});
+		$[5] = t0;
+		$[6] = t1;
+		$[7] = t3;
+	} else t3 = $[7];
+	return t3;
+}
+const source$2 = "import { type ReactElement } from \"react\";\n\nimport { useWords } from \"@stealthscale/specimen\";\n\nimport { Progress } from \"@stealthscale/component-feedback\";\n\nexport function Playback(): ReactElement {\n  const { t } = useWords(\"progress\");\n\n  return (\n    <Progress.Root max={245} size=\"xs\" value={161}>\n      <Progress.Track aria-label={t(\"playback\")} aria-valuetext={t(\"played\")}>\n        <Progress.Range />\n      </Progress.Track>\n    </Progress.Root>\n  );\n}\n";
+//#endregion
+//#region src/progress/examples/preparing.example.tsx
+var preparing_example_exports = /* @__PURE__ */ __exportAll({
+	Preparing: () => Preparing,
+	source: () => source$1
+});
+function Preparing(props) {
+	const $ = c(8);
+	const { t } = useWords("progress");
+	let t0;
+	if ($[0] !== t) {
+		t0 = t("preparing");
+		$[0] = t;
+		$[1] = t0;
+	} else t0 = $[1];
+	let t1;
+	if ($[2] !== t0) {
+		t1 = /* @__PURE__ */ jsx(Label, { children: t0 });
+		$[2] = t0;
+		$[3] = t1;
+	} else t1 = $[3];
+	let t2;
+	if ($[4] === Symbol.for("react.memo_cache_sentinel")) {
+		t2 = /* @__PURE__ */ jsx(Track, { children: /* @__PURE__ */ jsx(Range, {}) });
+		$[4] = t2;
+	} else t2 = $[4];
+	let t3;
+	if ($[5] !== props || $[6] !== t1) {
+		t3 = /* @__PURE__ */ jsxs(Root, {
+			value: null,
+			...props,
+			children: [t1, t2]
+		});
+		$[5] = props;
+		$[6] = t1;
+		$[7] = t3;
+	} else t3 = $[7];
+	return t3;
+}
+const source$1 = "import { type ReactElement } from \"react\";\n\nimport { useWords } from \"@stealthscale/specimen\";\n\nimport { Progress } from \"@stealthscale/component-feedback\";\n\nexport function Preparing(props: Progress.RootProps): ReactElement {\n  const { t } = useWords(\"progress\");\n\n  return (\n    <Progress.Root value={null} {...props}>\n      <Progress.Label>{t(\"preparing\")}</Progress.Label>\n      <Progress.Track>\n        <Progress.Range />\n      </Progress.Track>\n    </Progress.Root>\n  );\n}\n";
+//#endregion
+//#region src/progress/examples/reconciling.example.tsx
+var reconciling_example_exports = /* @__PURE__ */ __exportAll({
+	Reconciling: () => Reconciling,
+	source: () => source
+});
+function Reconciling(props) {
+	const $ = c(9);
+	const { t } = useWords("progress");
+	let t0;
+	if ($[0] !== t) {
+		t0 = t("reconciling");
+		$[0] = t;
+		$[1] = t0;
+	} else t0 = $[1];
+	let t1;
+	if ($[2] !== t0) {
+		t1 = /* @__PURE__ */ jsx(Label, { children: t0 });
+		$[2] = t0;
+		$[3] = t1;
+	} else t1 = $[3];
+	let t2;
+	if ($[4] === Symbol.for("react.memo_cache_sentinel")) {
+		t2 = /* @__PURE__ */ jsx(ValueText, {});
+		$[4] = t2;
+	} else t2 = $[4];
+	let t3;
+	if ($[5] === Symbol.for("react.memo_cache_sentinel")) {
+		t3 = /* @__PURE__ */ jsx(Track, { children: /* @__PURE__ */ jsx(Range, {}) });
+		$[5] = t3;
+	} else t3 = $[5];
+	let t4;
+	if ($[6] !== props || $[7] !== t1) {
+		t4 = /* @__PURE__ */ jsxs(Root, {
+			value: 62,
+			...props,
+			children: [
+				t1,
+				t2,
+				t3
+			]
+		});
+		$[6] = props;
+		$[7] = t1;
+		$[8] = t4;
+	} else t4 = $[8];
+	return t4;
+}
+const source = "import { type ReactElement } from \"react\";\n\nimport { useWords } from \"@stealthscale/specimen\";\n\nimport { Progress } from \"@stealthscale/component-feedback\";\n\nexport function Reconciling(props: Progress.RootProps): ReactElement {\n  const { t } = useWords(\"progress\");\n\n  return (\n    <Progress.Root value={62} {...props}>\n      <Progress.Label>{t(\"reconciling\")}</Progress.Label>\n      <Progress.ValueText />\n      <Progress.Track>\n        <Progress.Range />\n      </Progress.Track>\n    </Progress.Root>\n  );\n}\n";
+//#endregion
+//#region src/progress/progress.specimen.tsx
+/**
+* Catalogue page for the progress bar.
+*
+* @remarks
+*   `scenesOf` generates one scene per recipe axis from a labelled bar at 62%, each in a room at
+*   the `xs` measure, because a bar is as wide as its container. The palette scene crosses the
+*   looks, the shape scene uses the thickest track, and the effect scene uses the primary palette.
+*   Hand-written scenes render a value the machine does not know in both looks, a count in its own
+*   units, a bar without words named by `aria-label`, a migration against its plan's marker, and a
+*   test run split by outcome. The words are keys under `progress` in
+*   `locales/en/specimen/progress.json`.
+*/
+/**
+* Looks of the unknown-value scene.
+*/
+const LOOKS = ["outline", "subtle"];
+/**
+* Hand-written scene for a value the machine does not know, in both looks.
+*/
+const unknown = {
+	about: "progress.unknown.about",
+	draw: () => /* @__PURE__ */ jsx(Matrix, {
+		knob: "variant",
+		of: LOOKS,
+		children: (variant) => /* @__PURE__ */ jsx(Room, {
+			size: "xs",
+			children: /* @__PURE__ */ jsx(Preparing, { variant })
+		})
+	}),
+	example: preparing_example_exports,
+	props: { variant: "outline" },
+	title: "progress.unknown.title"
+};
+/**
+* Hand-written scene for a count in its own units.
+*/
+const units = {
+	about: "progress.units.about",
+	draw: () => /* @__PURE__ */ jsx(Room, {
+		size: "xs",
+		children: /* @__PURE__ */ jsx(Imported, {})
+	}),
+	example: imported_example_exports,
+	title: "progress.units.title"
+};
+/**
+* Hand-written scene for a bar without words, named by `aria-label`.
+*/
+const bare = {
+	about: "progress.bare.about",
+	draw: () => /* @__PURE__ */ jsx(Room, {
+		size: "xs",
+		children: /* @__PURE__ */ jsx(Playback, {})
+	}),
+	example: playback_example_exports,
+	title: "progress.bare.title"
+};
+/**
+* Hand-written scene for a migration against the share its plan expects, marked on the track.
+*/
+const planned = {
+	about: "progress.plan.about",
+	draw: () => /* @__PURE__ */ jsx(Room, {
+		size: "xs",
+		children: /* @__PURE__ */ jsx(Plan, {})
+	}),
+	example: plan_example_exports,
+	title: "progress.plan.title"
+};
+/**
+* Hand-written scene for a test run split by outcome, each outcome a segment.
+*/
+const split = {
+	about: "progress.outcomes.about",
+	draw: () => /* @__PURE__ */ jsx(Room, {
+		size: "xs",
+		children: /* @__PURE__ */ jsx(Outcomes, {})
+	}),
+	example: outcomes_example_exports,
+	title: "progress.outcomes.title"
+};
+var progress_specimen_default = specimen({
+	about: "progress.about",
+	id: "components/feedback/progress",
+	imports: "import { Progress } from \"@stealthscale/component-feedback\";",
+	scenes: [
+		...scenesOf(recipe, {
+			axes: {
+				effect: { with: { palette: "primary" } },
+				palette: { across: "variant" },
+				shape: { with: { size: "xl" } }
+			},
+			draw: (props) => /* @__PURE__ */ jsx(Room, {
+				size: "xs",
+				children: /* @__PURE__ */ jsx(Reconciling, { ...props })
+			}),
+			example: reconciling_example_exports,
+			namespace: "progress",
+			order: [
+				"size",
+				"shape",
+				"palette",
+				"layout",
+				"striped",
+				"animated",
+				"effect"
+			]
+		}),
+		unknown,
+		units,
+		bare,
+		planned,
+		split
+	],
+	title: "progress.title"
+});
+//#endregion
+export { bare, progress_specimen_default as default, planned, split, units, unknown };