@lar-works/design-system 0.2.1 → 0.3.0

package/dist/board/Filters.js

@@ -0,0 +1,64 @@
+import { Button } from "../actions/Button.js";
+import { Checkbox } from "../forms/Checkbox.js";
+import { Popover } from "../overlays/Popover.js";
+import { buttonKind } from "./ButtonKinds.js";
+import { forwardRef } from "react";
+import { ChevronDownIcon } from "lucide-react";
+import { jsx, jsxs } from "react/jsx-runtime";
+// src/board/Filters.tsx
+/** The List's filters: menus of checklists, then the active choices as chips that remove themselves, then Clear. */
+const FilterBar = forwardRef(({ children }, ref) => /* @__PURE__ */ jsx("div", {
+	ref,
+	"data-item-filters": true,
+	className: "flex flex-wrap items-center gap-1.5",
+	children
+}));
+FilterBar.displayName = "FilterBar";
+/** A filter's button, its name and how many choices are on, opening its checklist. */
+function FilterMenu({ which, name, picked, children }) {
+	return /* @__PURE__ */ jsxs(Popover, { children: [/* @__PURE__ */ jsx(Popover.Trigger, {
+		asChild: true,
+		children: /* @__PURE__ */ jsxs(Button, {
+			...buttonKind("other"),
+			"data-filter": which,
+			rightIcon: /* @__PURE__ */ jsx(ChevronDownIcon, {}),
+			children: [name, picked > 0 && ` · ${picked}`]
+		})
+	}), /* @__PURE__ */ jsx(Popover.Content, {
+		side: "bottom",
+		align: "start",
+		children
+	})] });
+}
+/** A filter menu's checklist. */
+function FilterChoices({ children }) {
+	return /* @__PURE__ */ jsx("div", {
+		className: "grid w-52 gap-0.5",
+		children
+	});
+}
+/** One choice in a filter's checklist: its checkbox, then what it is, such as a badge. */
+function FilterChoice({ checked, onToggle, children }) {
+	return /* @__PURE__ */ jsxs("label", {
+		"data-filter-choice": true,
+		className: "flex cursor-pointer items-center gap-2 rounded-md px-1.5 py-1 text-xs hover:bg-(--accent)",
+		children: [/* @__PURE__ */ jsx(Checkbox, {
+			checked,
+			onChange: onToggle
+		}), children]
+	});
+}
+/** An active choice as a chip, such as a badge ending in ×, which removes the choice. */
+function FilterChip({ removeLabel, onRemove, children }) {
+	return /* @__PURE__ */ jsx("button", {
+		type: "button",
+		"data-filter-chip": true,
+		"aria-label": removeLabel,
+		title: removeLabel,
+		onClick: onRemove,
+		children
+	});
+}
+export { FilterBar, FilterChip, FilterChoice, FilterChoices, FilterMenu };
+
+//# sourceMappingURL=Filters.js.map

package/dist/board/Filters.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Filters.js","names":[],"sources":["../../src/board/Filters.tsx"],"sourcesContent":["import { ChevronDownIcon } from 'lucide-react';\nimport { forwardRef, type ReactNode } from 'react';\n\nimport { Button } from '../actions/Button';\nimport { Checkbox } from '../forms/Checkbox';\nimport { Popover } from '../overlays/Popover';\nimport { buttonKind } from './ButtonKinds';\n\n/** The List's filters: menus of checklists, then the active choices as chips that remove themselves, then Clear. */\nexport const FilterBar = forwardRef<HTMLDivElement, { children: ReactNode }>(({ children }, ref) => (\n    <div ref={ref} data-item-filters className=\"flex flex-wrap items-center gap-1.5\">\n        {children}\n    </div>\n));\n\nFilterBar.displayName = 'FilterBar';\n\ninterface FilterMenuProps {\n    /** What the menu filters, as `data-filter`. */\n    which: string;\n    name: string;\n    /** How many of its choices are on, after its name. */\n    picked: number;\n    children: ReactNode;\n}\n\n/** A filter's button, its name and how many choices are on, opening its checklist. */\nexport function FilterMenu({ which, name, picked, children }: FilterMenuProps) {\n    return (\n        <Popover>\n            <Popover.Trigger asChild>\n                <Button {...buttonKind('other')} data-filter={which} rightIcon={<ChevronDownIcon />}>\n                    {name}\n                    {picked > 0 && ` · ${picked}`}\n                </Button>\n            </Popover.Trigger>\n            <Popover.Content side=\"bottom\" align=\"start\">\n                {children}\n            </Popover.Content>\n        </Popover>\n    );\n}\n\n/** A filter menu's checklist. */\nexport function FilterChoices({ children }: { children: ReactNode }) {\n    return <div className=\"grid w-52 gap-0.5\">{children}</div>;\n}\n\n/** One choice in a filter's checklist: its checkbox, then what it is, such as a badge. */\nexport function FilterChoice({\n    checked,\n    onToggle,\n    children,\n}: {\n    checked: boolean;\n    onToggle: () => void;\n    children: ReactNode;\n}) {\n    return (\n        <label\n            data-filter-choice\n            className=\"flex cursor-pointer items-center gap-2 rounded-md px-1.5 py-1 text-xs hover:bg-(--accent)\"\n        >\n            <Checkbox checked={checked} onChange={onToggle} />\n            {children}\n        </label>\n    );\n}\n\n/** An active choice as a chip, such as a badge ending in ×, which removes the choice. */\nexport function FilterChip({\n    removeLabel,\n    onRemove,\n    children,\n}: {\n    removeLabel: string;\n    onRemove: () => void;\n    children: ReactNode;\n}) {\n    return (\n        <button type=\"button\" data-filter-chip aria-label={removeLabel} title={removeLabel} onClick={onRemove}>\n            {children}\n        </button>\n    );\n}\n"],"mappings":";;;;;;;;;AASA,MAAa,YAAY,YAAqD,EAAE,YAAY,QACxF,oBAAC,OAAD;CAAU;CAAK,qBAAA;CAAkB,WAAU;CACtC;AACA,CAAA,CACR;AAED,UAAU,cAAc;;AAYxB,SAAgB,WAAW,EAAE,OAAO,MAAM,QAAQ,YAA6B;CAC3E,OACI,qBAAC,SAAD,EAAA,UAAA,CACI,oBAAC,QAAQ,SAAT;EAAiB,SAAA;EACb,UAAA,qBAAC,QAAD;GAAQ,GAAI,WAAW,OAAO;GAAG,eAAa;GAAO,WAAW,oBAAC,iBAAD,CAAkB,CAAA;GAAlF,UAAA,CACK,MACA,SAAS,KAAK,MAAM,QACjB;;CACK,CAAA,GACjB,oBAAC,QAAQ,SAAT;EAAiB,MAAK;EAAS,OAAM;EAChC;CACY,CAAA,CACZ,EAAA,CAAA;AAEjB;;AAGA,SAAgB,cAAc,EAAE,YAAqC;CACjE,OAAO,oBAAC,OAAD;EAAK,WAAU;EAAqB;CAAc,CAAA;AAC7D;;AAGA,SAAgB,aAAa,EACzB,SACA,UACA,YAKD;CACC,OACI,qBAAC,SAAD;EACI,sBAAA;EACA,WAAU;EAFd,UAAA,CAII,oBAAC,UAAD;GAAmB;GAAS,UAAU;EAAW,CAAA,GAChD,QACE;;AAEf;;AAGA,SAAgB,WAAW,EACvB,aACA,UACA,YAKD;CACC,OACI,oBAAC,UAAD;EAAQ,MAAK;EAAS,oBAAA;EAAiB,cAAY;EAAa,OAAO;EAAa,SAAS;EACxF;CACG,CAAA;AAEhB"}

package/dist/board/ItemDetails.d.ts

@@ -0,0 +1,167 @@
+import { DataAttributes } from "./DataAttributes.js";
+import { ReactNode, Ref } from "react";
+declare const headings: {
+  readonly section: 'm-0 text-[13px] font-medium';
+  readonly muted: 'm-0 text-[13px] font-medium text-(--muted-foreground)';
+  readonly label: 'm-0 text-[11px] font-medium tracking-wider text-(--muted-foreground) uppercase';
+};
+/** A section's heading: a sidebar `section`'s, a `muted` one over the comments or a description's own section, or the
+ *  small uppercase `label` over the description and the record. `as` a `label` it names the field `htmlFor` names, or
+ *  as a `span` a group that names itself. */
+export declare function DetailsHeading({ presentation, as, htmlFor, children }: {
+  presentation?: keyof typeof headings;
+  as?: 'h2' | 'label' | 'span';
+  htmlFor?: string | undefined;
+  children: ReactNode;
+}): import("react").JSX.Element;
+/** A sidebar section, or a section of the body such as a concept's parts: its heading over its content. */
+export declare function DetailsSection({ heading, children, ...data }: {
+  heading: ReactNode;
+  children: ReactNode;
+} & DataAttributes): import("react").JSX.Element;
+/** A section of the description, such as Acceptance Criteria: its muted heading over its text. */
+export declare function TextSection({ heading, children }: {
+  heading: ReactNode;
+  children: ReactNode;
+}): import("react").JSX.Element;
+/**
+ * A section of the main column, beside the sidebar: the record, description or comments, its `header` over its
+ * content. When it `fill`s, its content takes the height left.
+ */
+export declare function MainSection({ as: Tag, header, fill, children, ...data }: {
+  as?: 'div' | 'section';
+  header: ReactNode;
+  fill?: boolean;
+  children: ReactNode;
+} & DataAttributes): import("react").JSX.Element;
+/** A main section's header row: its small uppercase `heading`, then its actions at the end. */
+export declare function SectionHeader({ heading, children }: {
+  heading: ReactNode;
+  children?: ReactNode;
+}): import("react").JSX.Element;
+/** A short status in a section's header, such as a save that could not be read back, truncating. */
+export declare function HeaderStatus({ children }: {
+  children: string;
+}): import("react").JSX.Element;
+/** A line of the details in the body size: an error, announced, or a muted empty state. `mainColumn` keeps it in the
+ *  main column beside the sidebar. */
+export declare function DetailsText({ tone, mainColumn, children }: {
+  tone?: 'muted' | 'error';
+  mainColumn?: boolean;
+  children: ReactNode;
+}): import("react").JSX.Element;
+/** A placeholder that keeps the main column's place while the details load. */
+export declare function MainColumnSlot({ children }: {
+  children: ReactNode;
+}): import("react").JSX.Element;
+/** The meta area under the summary: its facts, wrapping onto as many lines as the width needs. */
+export declare function MetaArea({ children, ...data }: {
+  children: ReactNode;
+} & DataAttributes): import("react").JSX.Element;
+/**
+ * A labelled fact: in the meta area, its value wrapping rather than running past the dialog; in a `record`, a fact of
+ * the work record whose value wraps onto lines of its own.
+ */
+export declare function DetailFact({ label, presentation, children, ...data }: {
+  label: string;
+  presentation?: 'meta' | 'record';
+  children: ReactNode;
+} & DataAttributes): import("react").JSX.Element;
+/** A line of short items, such as a review round's verdicts, wrapping. */
+export declare function InlineList({ items }: {
+  items: readonly string[];
+}): import("react").JSX.Element;
+/** Facts one under the other, such as a record's review rounds. */
+export declare function FactList({ children, ...data }: {
+  children: ReactNode;
+} & DataAttributes): import("react").JSX.Element;
+/** The editor's slot in a main section: a column that takes the height left when it `fill`s. */
+export declare function EditorSlot({ fill, children }: {
+  fill: boolean;
+  children: ReactNode;
+}): import("react").JSX.Element;
+/** Under an editor: whether it changed, or `error` in its place, announced and wrapping, then its buttons. */
+export declare function EditActions({ status, error, children, ...data }: {
+  status: string;
+  error?: string | null | undefined;
+  children: ReactNode;
+} & DataAttributes): import("react").JSX.Element;
+/** How a Spec's sync stands: its `status`, announced, then what answers it, then an `error`, announced. */
+export declare function SpecSync({ status, error, children }: {
+  status?: string | undefined;
+  error?: string | null | undefined;
+  children?: ReactNode;
+}): import("react").JSX.Element;
+/** Linked work items, such as sub-tickets or blockers, one TicketLink each; or attachments, one AttachmentLink each. */
+export declare function TicketLinkList({ children }: {
+  children: ReactNode;
+}): import("react").JSX.Element;
+/** A linked work item: done or open (`stateLabel` names it), its `reference` and `title` linked, and its tracker's
+ *  `fields` under them. */
+export declare function TicketLink({ closed, stateLabel, href, reference, title, fields }: {
+  closed: boolean;
+  stateLabel: string;
+  href: string;
+  reference: string;
+  title: string;
+  fields?: ReactNode;
+}): import("react").JSX.Element;
+/** An attachment's name, linked. */
+export declare function AttachmentLink({ href, name }: {
+  href: string;
+  name: string;
+}): import("react").JSX.Element;
+/** A sprint's count over its children: `count` ("This sprint: 2 of 5 done") and the sprint's `name`. */
+export declare function SprintCount({ count, name }: {
+  count: string;
+  name: string;
+}): import("react").JSX.Element;
+/** The work an item waits on, struck through once closed. */
+export declare function WaitsOnList({ items }: {
+  items: readonly {
+    key: string;
+    title: string;
+    closed: boolean;
+  }[];
+}): import("react").JSX.Element;
+/** Chips in a wrapping line, grouped with no box of their own, such as the labels fact's, for tests to name. */
+export declare function ChipGroup({ children, ...data }: {
+  children: ReactNode;
+} & DataAttributes): import("react").JSX.Element;
+/** A popover's panel for picking labels: 18rem wide, its picker over its status. */
+export declare function LabelEditorPanel({ children }: {
+  children: ReactNode;
+}): import("react").JSX.Element;
+/** A kind change that failed: each of its `lines`, then the `action` that retries it, announced. */
+export declare function ChangeFailed({ lines, action, ...data }: {
+  lines: readonly string[];
+  action: ReactNode;
+} & DataAttributes): import("react").JSX.Element;
+/** Where the item's kind and its ticket's disagree: the `message`, the `actions` that answer it, then a `hint` and any
+ *  `error`, which the caller renders as caption Text. */
+export declare function KindQuestion({ message, actions, children, ...data }: {
+  message: string;
+  actions: ReactNode;
+  children?: ReactNode;
+} & DataAttributes): import("react").JSX.Element;
+/** A ticket's outgoing title and text, as the tracker will receive them; the labels name each for assistive
+ *  technology. */
+export declare function OutgoingTicket({ title, text, titleLabel, textLabel }: {
+  title: string;
+  text: string;
+  titleLabel: string;
+  textLabel: string;
+}): import("react").JSX.Element;
+/** A check's run: its `command`, then what it says of the run. */
+export declare function CheckRun({ command, children }: {
+  command: string;
+  children: ReactNode;
+}): import("react").JSX.Element;
+/** A section's own scrolling panel that focus moves to when it opens, such as Create issue's; `label` names it. */
+export declare function FocusPanel({ label, ref, children }: {
+  label: string;
+  ref?: Ref<HTMLElement>;
+  children: ReactNode;
+}): import("react").JSX.Element;
+export {};
+//# sourceMappingURL=ItemDetails.d.ts.map

package/dist/board/ItemDetails.js

@@ -0,0 +1,339 @@
+import { CircleCheckIcon, CircleDotIcon } from "lucide-react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+// src/board/ItemDetails.tsx
+const headings = {
+	section: "m-0 text-[13px] font-medium",
+	muted: "m-0 text-[13px] font-medium text-(--muted-foreground)",
+	label: "m-0 text-[11px] font-medium tracking-wider text-(--muted-foreground) uppercase"
+};
+/** A section's heading: a sidebar `section`'s, a `muted` one over the comments or a description's own section, or the
+*  small uppercase `label` over the description and the record. `as` a `label` it names the field `htmlFor` names, or
+*  as a `span` a group that names itself. */
+function DetailsHeading({ presentation = "section", as = "h2", htmlFor, children }) {
+	if (as === "label") return /* @__PURE__ */ jsx("label", {
+		htmlFor,
+		className: headings[presentation],
+		children
+	});
+	if (as === "span") return /* @__PURE__ */ jsx("span", {
+		className: headings[presentation],
+		children
+	});
+	return /* @__PURE__ */ jsx("h2", {
+		className: headings[presentation],
+		children
+	});
+}
+/** A sidebar section, or a section of the body such as a concept's parts: its heading over its content. */
+function DetailsSection({ heading, children, ...data }) {
+	return /* @__PURE__ */ jsxs("section", {
+		...data,
+		className: "grid min-w-0 grid-cols-[minmax(0,1fr)] gap-2",
+		children: [/* @__PURE__ */ jsx(DetailsHeading, { children: heading }), children]
+	});
+}
+/** A section of the description, such as Acceptance Criteria: its muted heading over its text. */
+function TextSection({ heading, children }) {
+	return /* @__PURE__ */ jsxs("section", {
+		className: "grid min-w-0 gap-2",
+		children: [/* @__PURE__ */ jsx(DetailsHeading, {
+			presentation: "muted",
+			children: heading
+		}), children]
+	});
+}
+/**
+* A section of the main column, beside the sidebar: the record, description or comments, its `header` over its
+* content. When it `fill`s, its content takes the height left.
+*/
+function MainSection({ as: Tag = "div", header, fill = false, children, ...data }) {
+	return /* @__PURE__ */ jsxs(Tag, {
+		...data,
+		className: `grid min-w-0 gap-2 ${fill ? "min-h-0 grid-rows-[auto_minmax(0,1fr)]" : ""} @min-[45rem]:col-start-1`,
+		children: [header, children]
+	});
+}
+/** A main section's header row: its small uppercase `heading`, then its actions at the end. */
+function SectionHeader({ heading, children }) {
+	return /* @__PURE__ */ jsxs("div", {
+		className: "flex h-7 items-center justify-between gap-2",
+		children: [/* @__PURE__ */ jsx(DetailsHeading, {
+			presentation: "label",
+			children: heading
+		}), children && /* @__PURE__ */ jsx("span", {
+			className: "flex min-w-0 items-center gap-3",
+			children
+		})]
+	});
+}
+/** A short status in a section's header, such as a save that could not be read back, truncating. */
+function HeaderStatus({ children }) {
+	return /* @__PURE__ */ jsx("span", {
+		className: "truncate text-xs text-(--muted-foreground)",
+		role: "status",
+		title: children,
+		children
+	});
+}
+/** A line of the details in the body size: an error, announced, or a muted empty state. `mainColumn` keeps it in the
+*  main column beside the sidebar. */
+function DetailsText({ tone = "muted", mainColumn = false, children }) {
+	return /* @__PURE__ */ jsx("p", {
+		className: `m-0 text-sm ${tone === "error" ? "text-(--error-foreground)" : "text-(--muted-foreground)"}${mainColumn ? " @min-[45rem]:col-start-1" : ""}`,
+		role: tone === "error" ? "alert" : void 0,
+		children
+	});
+}
+/** A placeholder that keeps the main column's place while the details load. */
+function MainColumnSlot({ children }) {
+	return /* @__PURE__ */ jsx("div", {
+		className: "@min-[45rem]:col-start-1",
+		children
+	});
+}
+/** The meta area under the summary: its facts, wrapping onto as many lines as the width needs. */
+function MetaArea({ children, ...data }) {
+	return /* @__PURE__ */ jsx("div", {
+		...data,
+		className: "flex min-w-0 flex-wrap items-center gap-x-5 gap-y-2",
+		children
+	});
+}
+/**
+* A labelled fact: in the meta area, its value wrapping rather than running past the dialog; in a `record`, a fact of
+* the work record whose value wraps onto lines of its own.
+*/
+function DetailFact({ label, presentation = "meta", children, ...data }) {
+	if (presentation === "record") return /* @__PURE__ */ jsxs("div", {
+		...data,
+		className: "flex min-w-0 flex-wrap items-baseline gap-x-1.5 text-sm",
+		children: [/* @__PURE__ */ jsx("span", {
+			className: "shrink-0 text-xs text-(--muted-foreground)",
+			children: label
+		}), children]
+	});
+	return /* @__PURE__ */ jsxs("div", {
+		...data,
+		className: "flex max-w-full min-w-0 items-baseline gap-1.5 text-sm",
+		children: [/* @__PURE__ */ jsx("span", {
+			className: "shrink-0 text-xs text-(--muted-foreground)",
+			children: label
+		}), /* @__PURE__ */ jsx("span", {
+			className: "min-w-0 wrap-anywhere",
+			children
+		})]
+	});
+}
+/** A line of short items, such as a review round's verdicts, wrapping. */
+function InlineList({ items }) {
+	return /* @__PURE__ */ jsx("ul", {
+		className: "m-0 flex list-none flex-wrap gap-x-3 p-0",
+		children: items.map((item, index) => /* @__PURE__ */ jsx("li", { children: item }, index))
+	});
+}
+/** Facts one under the other, such as a record's review rounds. */
+function FactList({ children, ...data }) {
+	return /* @__PURE__ */ jsx("div", {
+		...data,
+		className: "grid gap-1",
+		children
+	});
+}
+/** The editor's slot in a main section: a column that takes the height left when it `fill`s. */
+function EditorSlot({ fill, children }) {
+	return /* @__PURE__ */ jsx("div", {
+		className: fill ? "flex min-h-0 flex-col" : "contents",
+		children
+	});
+}
+/** Under an editor: whether it changed, or `error` in its place, announced and wrapping, then its buttons. */
+function EditActions({ status, error, children, ...data }) {
+	return /* @__PURE__ */ jsxs("div", {
+		...data,
+		className: "flex items-start gap-2",
+		children: [error ? /* @__PURE__ */ jsx("p", {
+			className: "m-0 me-auto min-w-0 flex-1 py-1.5 text-xs text-(--error-foreground)",
+			role: "alert",
+			children: error
+		}) : /* @__PURE__ */ jsx("span", {
+			className: "me-auto min-w-0 flex-1 py-1.5 text-xs text-(--muted-foreground)",
+			children: status
+		}), children]
+	});
+}
+/** How a Spec's sync stands: its `status`, announced, then what answers it, then an `error`, announced. */
+function SpecSync({ status, error, children }) {
+	return /* @__PURE__ */ jsxs("div", {
+		className: "grid gap-2 text-sm",
+		"data-spec-sync": true,
+		children: [
+			status && /* @__PURE__ */ jsx("p", {
+				className: "m-0",
+				role: "status",
+				children: status
+			}),
+			children,
+			error && /* @__PURE__ */ jsx("p", {
+				className: "m-0 text-(--error-foreground)",
+				role: "alert",
+				children: error
+			})
+		]
+	});
+}
+/** Linked work items, such as sub-tickets or blockers, one TicketLink each; or attachments, one AttachmentLink each. */
+function TicketLinkList({ children }) {
+	return /* @__PURE__ */ jsx("ul", {
+		className: "m-0 grid list-none gap-1.5 p-0",
+		children
+	});
+}
+/** A linked work item: done or open (`stateLabel` names it), its `reference` and `title` linked, and its tracker's
+*  `fields` under them. */
+function TicketLink({ closed, stateLabel, href, reference, title, fields }) {
+	return /* @__PURE__ */ jsxs("li", {
+		className: "flex items-start gap-2 text-sm",
+		children: [closed ? /* @__PURE__ */ jsx(CircleCheckIcon, {
+			"aria-label": stateLabel,
+			className: "mt-0.5 size-3.5 shrink-0 text-(--success)"
+		}) : /* @__PURE__ */ jsx(CircleDotIcon, {
+			"aria-label": stateLabel,
+			className: "mt-0.5 size-3.5 shrink-0 text-(--muted-foreground)"
+		}), /* @__PURE__ */ jsxs("span", {
+			className: "min-w-0",
+			children: [/* @__PURE__ */ jsxs("a", {
+				href,
+				target: "_blank",
+				rel: "noopener",
+				className: "wrap-anywhere hover:underline",
+				children: [
+					/* @__PURE__ */ jsx("span", {
+						className: "text-(--muted-foreground)",
+						children: reference
+					}),
+					" ",
+					title
+				]
+			}), fields]
+		})]
+	});
+}
+/** An attachment's name, linked. */
+function AttachmentLink({ href, name }) {
+	return /* @__PURE__ */ jsx("li", {
+		className: "text-sm",
+		children: /* @__PURE__ */ jsx("a", {
+			href,
+			target: "_blank",
+			rel: "noopener",
+			className: "wrap-anywhere underline",
+			children: name
+		})
+	});
+}
+/** A sprint's count over its children: `count` ("This sprint: 2 of 5 done") and the sprint's `name`. */
+function SprintCount({ count, name }) {
+	return /* @__PURE__ */ jsxs("div", {
+		className: "text-sm",
+		children: [/* @__PURE__ */ jsx("p", {
+			className: "m-0 font-medium",
+			children: count
+		}), /* @__PURE__ */ jsx("p", {
+			className: "m-0 text-xs text-(--muted-foreground)",
+			children: name
+		})]
+	});
+}
+/** The work an item waits on, struck through once closed. */
+function WaitsOnList({ items }) {
+	return /* @__PURE__ */ jsx("ul", {
+		className: "m-0 grid list-none gap-1.5 p-0 text-sm",
+		"data-waits-on": true,
+		children: items.map((item) => /* @__PURE__ */ jsx("li", {
+			className: item.closed ? "text-(--muted-foreground) line-through" : "",
+			children: item.title
+		}, item.key))
+	});
+}
+/** Chips in a wrapping line, grouped with no box of their own, such as the labels fact's, for tests to name. */
+function ChipGroup({ children, ...data }) {
+	return /* @__PURE__ */ jsx("span", {
+		...data,
+		className: "contents",
+		children
+	});
+}
+/** A popover's panel for picking labels: 18rem wide, its picker over its status. */
+function LabelEditorPanel({ children }) {
+	return /* @__PURE__ */ jsx("div", {
+		className: "grid w-72 gap-2",
+		children
+	});
+}
+/** A kind change that failed: each of its `lines`, then the `action` that retries it, announced. */
+function ChangeFailed({ lines, action, ...data }) {
+	return /* @__PURE__ */ jsxs("div", {
+		...data,
+		role: "alert",
+		className: "grid w-full justify-items-start gap-1 text-xs text-(--error-foreground)",
+		children: [lines.map((line, index) => /* @__PURE__ */ jsx("p", {
+			className: "m-0",
+			children: line
+		}, index)), action]
+	});
+}
+/** Where the item's kind and its ticket's disagree: the `message`, the `actions` that answer it, then a `hint` and any
+*  `error`, which the caller renders as caption Text. */
+function KindQuestion({ message, actions, children, ...data }) {
+	return /* @__PURE__ */ jsxs("div", {
+		...data,
+		className: "grid w-full gap-2 rounded-lg border border-(--border) p-3",
+		children: [
+			/* @__PURE__ */ jsx("p", {
+				className: "m-0 text-sm",
+				children: message
+			}),
+			/* @__PURE__ */ jsx("span", {
+				className: "flex flex-wrap gap-2",
+				children: actions
+			}),
+			children
+		]
+	});
+}
+/** A ticket's outgoing title and text, as the tracker will receive them; the labels name each for assistive
+*  technology. */
+function OutgoingTicket({ title, text, titleLabel, textLabel }) {
+	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("div", {
+		"aria-label": titleLabel,
+		className: "font-medium wrap-anywhere",
+		children: title
+	}), /* @__PURE__ */ jsx("pre", {
+		"aria-label": textLabel,
+		className: "m-0 max-h-64 overflow-auto text-xs wrap-anywhere whitespace-pre-wrap",
+		children: text
+	})] });
+}
+/** A check's run: its `command`, then what it says of the run. */
+function CheckRun({ command, children }) {
+	return /* @__PURE__ */ jsxs("section", {
+		className: "min-w-0 rounded border border-(--border) p-2",
+		children: [/* @__PURE__ */ jsx("code", {
+			className: "wrap-anywhere whitespace-pre-wrap",
+			children: command
+		}), children]
+	});
+}
+/** A section's own scrolling panel that focus moves to when it opens, such as Create issue's; `label` names it. */
+function FocusPanel({ label, ref, children }) {
+	return /* @__PURE__ */ jsx("section", {
+		ref,
+		tabIndex: -1,
+		"aria-label": label,
+		className: "grid max-h-[50dvh] w-full gap-3 overflow-y-auto pt-1",
+		children
+	});
+}
+export { AttachmentLink, ChangeFailed, CheckRun, ChipGroup, DetailFact, DetailsHeading, DetailsSection, DetailsText, EditActions, EditorSlot, FactList, FocusPanel, HeaderStatus, InlineList, KindQuestion, LabelEditorPanel, MainColumnSlot, MainSection, MetaArea, OutgoingTicket, SectionHeader, SpecSync, SprintCount, TextSection, TicketLink, TicketLinkList, WaitsOnList };
+
+//# sourceMappingURL=ItemDetails.js.map

package/dist/board/ItemDetails.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ItemDetails.js","names":[],"sources":["../../src/board/ItemDetails.tsx"],"sourcesContent":["// What Lar Factory's item dialog shows from a piece of work's details: its sections' headings, the meta area's facts\n// and people, the main column's description, record and comments, and the sidebar's lists.\n\nimport { CircleCheckIcon, CircleDotIcon } from 'lucide-react';\nimport type { ReactNode, Ref } from 'react';\n\nimport type { DataAttributes } from './DataAttributes';\n\nconst headings = {\n    section: 'm-0 text-[13px] font-medium',\n    muted: 'm-0 text-[13px] font-medium text-(--muted-foreground)',\n    label: 'm-0 text-[11px] font-medium tracking-wider text-(--muted-foreground) uppercase',\n} as const;\n\n/** A section's heading: a sidebar `section`'s, a `muted` one over the comments or a description's own section, or the\n *  small uppercase `label` over the description and the record. `as` a `label` it names the field `htmlFor` names, or\n *  as a `span` a group that names itself. */\nexport function DetailsHeading({\n    presentation = 'section',\n    as = 'h2',\n    htmlFor,\n    children,\n}: {\n    presentation?: keyof typeof headings;\n    as?: 'h2' | 'label' | 'span';\n    htmlFor?: string | undefined;\n    children: ReactNode;\n}) {\n    if (as === 'label')\n        return (\n            <label htmlFor={htmlFor} className={headings[presentation]}>\n                {children}\n            </label>\n        );\n\n    if (as === 'span') return <span className={headings[presentation]}>{children}</span>;\n\n    return <h2 className={headings[presentation]}>{children}</h2>;\n}\n\n/** A sidebar section, or a section of the body such as a concept's parts: its heading over its content. */\nexport function DetailsSection({\n    heading,\n    children,\n    ...data\n}: {\n    heading: ReactNode;\n    children: ReactNode;\n} & DataAttributes) {\n    return (\n        <section {...data} className=\"grid min-w-0 grid-cols-[minmax(0,1fr)] gap-2\">\n            <DetailsHeading>{heading}</DetailsHeading>\n            {children}\n        </section>\n    );\n}\n\n/** A section of the description, such as Acceptance Criteria: its muted heading over its text. */\nexport function TextSection({ heading, children }: { heading: ReactNode; children: ReactNode }) {\n    return (\n        <section className=\"grid min-w-0 gap-2\">\n            <DetailsHeading presentation=\"muted\">{heading}</DetailsHeading>\n            {children}\n        </section>\n    );\n}\n\n/**\n * A section of the main column, beside the sidebar: the record, description or comments, its `header` over its\n * content. When it `fill`s, its content takes the height left.\n */\nexport function MainSection({\n    as: Tag = 'div',\n    header,\n    fill = false,\n    children,\n    ...data\n}: {\n    as?: 'div' | 'section';\n    header: ReactNode;\n    fill?: boolean;\n    children: ReactNode;\n} & DataAttributes) {\n    return (\n        <Tag\n            {...data}\n            className={`grid min-w-0 gap-2 ${fill ? 'min-h-0 grid-rows-[auto_minmax(0,1fr)]' : ''} @min-[45rem]:col-start-1`}\n        >\n            {header}\n            {children}\n        </Tag>\n    );\n}\n\n/** A main section's header row: its small uppercase `heading`, then its actions at the end. */\nexport function SectionHeader({ heading, children }: { heading: ReactNode; children?: ReactNode }) {\n    return (\n        <div className=\"flex h-7 items-center justify-between gap-2\">\n            <DetailsHeading presentation=\"label\">{heading}</DetailsHeading>\n            {children && <span className=\"flex min-w-0 items-center gap-3\">{children}</span>}\n        </div>\n    );\n}\n\n/** A short status in a section's header, such as a save that could not be read back, truncating. */\nexport function HeaderStatus({ children }: { children: string }) {\n    return (\n        <span className=\"truncate text-xs text-(--muted-foreground)\" role=\"status\" title={children}>\n            {children}\n        </span>\n    );\n}\n\n/** A line of the details in the body size: an error, announced, or a muted empty state. `mainColumn` keeps it in the\n *  main column beside the sidebar. */\nexport function DetailsText({\n    tone = 'muted',\n    mainColumn = false,\n    children,\n}: {\n    tone?: 'muted' | 'error';\n    mainColumn?: boolean;\n    children: ReactNode;\n}) {\n    return (\n        <p\n            className={`m-0 text-sm ${tone === 'error' ? 'text-(--error-foreground)' : 'text-(--muted-foreground)'}${mainColumn ? ' @min-[45rem]:col-start-1' : ''}`}\n            role={tone === 'error' ? 'alert' : undefined}\n        >\n            {children}\n        </p>\n    );\n}\n\n/** A placeholder that keeps the main column's place while the details load. */\nexport function MainColumnSlot({ children }: { children: ReactNode }) {\n    return <div className=\"@min-[45rem]:col-start-1\">{children}</div>;\n}\n\n/** The meta area under the summary: its facts, wrapping onto as many lines as the width needs. */\nexport function MetaArea({ children, ...data }: { children: ReactNode } & DataAttributes) {\n    return (\n        <div {...data} className=\"flex min-w-0 flex-wrap items-center gap-x-5 gap-y-2\">\n            {children}\n        </div>\n    );\n}\n\n/**\n * A labelled fact: in the meta area, its value wrapping rather than running past the dialog; in a `record`, a fact of\n * the work record whose value wraps onto lines of its own.\n */\nexport function DetailFact({\n    label,\n    presentation = 'meta',\n    children,\n    ...data\n}: {\n    label: string;\n    presentation?: 'meta' | 'record';\n    children: ReactNode;\n} & DataAttributes) {\n    if (presentation === 'record')\n        return (\n            <div {...data} className=\"flex min-w-0 flex-wrap items-baseline gap-x-1.5 text-sm\">\n                <span className=\"shrink-0 text-xs text-(--muted-foreground)\">{label}</span>\n                {children}\n            </div>\n        );\n\n    return (\n        <div {...data} className=\"flex max-w-full min-w-0 items-baseline gap-1.5 text-sm\">\n            <span className=\"shrink-0 text-xs text-(--muted-foreground)\">{label}</span>\n            <span className=\"min-w-0 wrap-anywhere\">{children}</span>\n        </div>\n    );\n}\n\n/** A line of short items, such as a review round's verdicts, wrapping. */\nexport function InlineList({ items }: { items: readonly string[] }) {\n    return (\n        <ul className=\"m-0 flex list-none flex-wrap gap-x-3 p-0\">\n            {items.map((item, index) => (\n                <li key={index}>{item}</li>\n            ))}\n        </ul>\n    );\n}\n\n/** Facts one under the other, such as a record's review rounds. */\nexport function FactList({ children, ...data }: { children: ReactNode } & DataAttributes) {\n    return (\n        <div {...data} className=\"grid gap-1\">\n            {children}\n        </div>\n    );\n}\n\n/** The editor's slot in a main section: a column that takes the height left when it `fill`s. */\nexport function EditorSlot({ fill, children }: { fill: boolean; children: ReactNode }) {\n    return <div className={fill ? 'flex min-h-0 flex-col' : 'contents'}>{children}</div>;\n}\n\n/** Under an editor: whether it changed, or `error` in its place, announced and wrapping, then its buttons. */\nexport function EditActions({\n    status,\n    error,\n    children,\n    ...data\n}: {\n    status: string;\n    error?: string | null | undefined;\n    children: ReactNode;\n} & DataAttributes) {\n    return (\n        <div {...data} className=\"flex items-start gap-2\">\n            {error ? (\n                <p className=\"m-0 me-auto min-w-0 flex-1 py-1.5 text-xs text-(--error-foreground)\" role=\"alert\">\n                    {error}\n                </p>\n            ) : (\n                <span className=\"me-auto min-w-0 flex-1 py-1.5 text-xs text-(--muted-foreground)\">{status}</span>\n            )}\n            {children}\n        </div>\n    );\n}\n\n/** How a Spec's sync stands: its `status`, announced, then what answers it, then an `error`, announced. */\nexport function SpecSync({\n    status,\n    error,\n    children,\n}: {\n    status?: string | undefined;\n    error?: string | null | undefined;\n    children?: ReactNode;\n}) {\n    return (\n        <div className=\"grid gap-2 text-sm\" data-spec-sync>\n            {status && (\n                <p className=\"m-0\" role=\"status\">\n                    {status}\n                </p>\n            )}\n            {children}\n            {error && (\n                <p className=\"m-0 text-(--error-foreground)\" role=\"alert\">\n                    {error}\n                </p>\n            )}\n        </div>\n    );\n}\n\n/** Linked work items, such as sub-tickets or blockers, one TicketLink each; or attachments, one AttachmentLink each. */\nexport function TicketLinkList({ children }: { children: ReactNode }) {\n    return <ul className=\"m-0 grid list-none gap-1.5 p-0\">{children}</ul>;\n}\n\n/** A linked work item: done or open (`stateLabel` names it), its `reference` and `title` linked, and its tracker's\n *  `fields` under them. */\nexport function TicketLink({\n    closed,\n    stateLabel,\n    href,\n    reference,\n    title,\n    fields,\n}: {\n    closed: boolean;\n    stateLabel: string;\n    href: string;\n    reference: string;\n    title: string;\n    fields?: ReactNode;\n}) {\n    return (\n        <li className=\"flex items-start gap-2 text-sm\">\n            {closed ? (\n                <CircleCheckIcon aria-label={stateLabel} className=\"mt-0.5 size-3.5 shrink-0 text-(--success)\" />\n            ) : (\n                <CircleDotIcon aria-label={stateLabel} className=\"mt-0.5 size-3.5 shrink-0 text-(--muted-foreground)\" />\n            )}\n            <span className=\"min-w-0\">\n                <a href={href} target=\"_blank\" rel=\"noopener\" className=\"wrap-anywhere hover:underline\">\n                    <span className=\"text-(--muted-foreground)\">{reference}</span> {title}\n                </a>\n                {fields}\n            </span>\n        </li>\n    );\n}\n\n/** An attachment's name, linked. */\nexport function AttachmentLink({ href, name }: { href: string; name: string }) {\n    return (\n        <li className=\"text-sm\">\n            <a href={href} target=\"_blank\" rel=\"noopener\" className=\"wrap-anywhere underline\">\n                {name}\n            </a>\n        </li>\n    );\n}\n\n/** A sprint's count over its children: `count` (\"This sprint: 2 of 5 done\") and the sprint's `name`. */\nexport function SprintCount({ count, name }: { count: string; name: string }) {\n    return (\n        <div className=\"text-sm\">\n            <p className=\"m-0 font-medium\">{count}</p>\n            <p className=\"m-0 text-xs text-(--muted-foreground)\">{name}</p>\n        </div>\n    );\n}\n\n/** The work an item waits on, struck through once closed. */\nexport function WaitsOnList({ items }: { items: readonly { key: string; title: string; closed: boolean }[] }) {\n    return (\n        <ul className=\"m-0 grid list-none gap-1.5 p-0 text-sm\" data-waits-on>\n            {items.map((item) => (\n                <li key={item.key} className={item.closed ? 'text-(--muted-foreground) line-through' : ''}>\n                    {item.title}\n                </li>\n            ))}\n        </ul>\n    );\n}\n\n/** Chips in a wrapping line, grouped with no box of their own, such as the labels fact's, for tests to name. */\nexport function ChipGroup({ children, ...data }: { children: ReactNode } & DataAttributes) {\n    return (\n        <span {...data} className=\"contents\">\n            {children}\n        </span>\n    );\n}\n\n/** A popover's panel for picking labels: 18rem wide, its picker over its status. */\nexport function LabelEditorPanel({ children }: { children: ReactNode }) {\n    return <div className=\"grid w-72 gap-2\">{children}</div>;\n}\n\n/** A kind change that failed: each of its `lines`, then the `action` that retries it, announced. */\nexport function ChangeFailed({\n    lines,\n    action,\n    ...data\n}: {\n    lines: readonly string[];\n    action: ReactNode;\n} & DataAttributes) {\n    return (\n        <div {...data} role=\"alert\" className=\"grid w-full justify-items-start gap-1 text-xs text-(--error-foreground)\">\n            {lines.map((line, index) => (\n                <p key={index} className=\"m-0\">\n                    {line}\n                </p>\n            ))}\n            {action}\n        </div>\n    );\n}\n\n/** Where the item's kind and its ticket's disagree: the `message`, the `actions` that answer it, then a `hint` and any\n *  `error`, which the caller renders as caption Text. */\nexport function KindQuestion({\n    message,\n    actions,\n    children,\n    ...data\n}: {\n    message: string;\n    actions: ReactNode;\n    children?: ReactNode;\n} & DataAttributes) {\n    return (\n        <div {...data} className=\"grid w-full gap-2 rounded-lg border border-(--border) p-3\">\n            <p className=\"m-0 text-sm\">{message}</p>\n            <span className=\"flex flex-wrap gap-2\">{actions}</span>\n            {children}\n        </div>\n    );\n}\n\n/** A ticket's outgoing title and text, as the tracker will receive them; the labels name each for assistive\n *  technology. */\nexport function OutgoingTicket({\n    title,\n    text,\n    titleLabel,\n    textLabel,\n}: {\n    title: string;\n    text: string;\n    titleLabel: string;\n    textLabel: string;\n}) {\n    return (\n        <>\n            <div aria-label={titleLabel} className=\"font-medium wrap-anywhere\">\n                {title}\n            </div>\n            <pre\n                aria-label={textLabel}\n                className=\"m-0 max-h-64 overflow-auto text-xs wrap-anywhere whitespace-pre-wrap\"\n            >\n                {text}\n            </pre>\n        </>\n    );\n}\n\n/** A check's run: its `command`, then what it says of the run. */\nexport function CheckRun({ command, children }: { command: string; children: ReactNode }) {\n    return (\n        <section className=\"min-w-0 rounded border border-(--border) p-2\">\n            <code className=\"wrap-anywhere whitespace-pre-wrap\">{command}</code>\n            {children}\n        </section>\n    );\n}\n\n/** A section's own scrolling panel that focus moves to when it opens, such as Create issue's; `label` names it. */\nexport function FocusPanel({ label, ref, children }: { label: string; ref?: Ref<HTMLElement>; children: ReactNode }) {\n    return (\n        <section\n            ref={ref}\n            tabIndex={-1}\n            aria-label={label}\n            className=\"grid max-h-[50dvh] w-full gap-3 overflow-y-auto pt-1\"\n        >\n            {children}\n        </section>\n    );\n}\n"],"mappings":"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"}