@activecollab/components 2.0.409 → 2.0.411

package/dist/esm/presentation/shared/MessageDialog.js

@@ -0,0 +1,331 @@
+import React, { useCallback, useContext, useState } from "react";
+import styled from "styled-components";
+import { screenBelow } from "../../components/BreakPoints";
+import { Button } from "../../components/Button";
+import { Columns } from "../../components/Columns";
+import { IconButton } from "../../components/IconButton";
+import { CancelCrossIcon, ThumbUpOutlineIcon } from "../../components/Icons";
+import { InfoBox } from "../../components/InfoBox";
+import { Media } from "../../components/Media";
+import { Modal } from "../../components/Modal";
+import { portableTextDefaultBlockRenderers } from "../../components/PortableText";
+import { StyledLink as InlineLink } from "../../components/PortableText/Styles";
+import { Row } from "../../components/Row";
+import { Stack } from "../../components/Stack";
+import { Tiles } from "../../components/Tiles";
+import { Tooltip } from "../../components/Tooltip";
+import { Body2 } from "../../components/Typography";
+import { Typography } from "../../components/Typography/Typography";
+
+/**
+ * The in-app message dialog, as a Presentation mock.
+ *
+ * Two pieces, mirroring how the product is split:
+ *
+ * - {@link MessageDialog} — the hollow dialog shell (width, closing,
+ *   feedback), built only from design-system parts. In the product this shell
+ *   lives in the application as `InAppMessageDialog`.
+ * - {@link messageComponents} — a demo message element catalog injected into
+ *   the design-system Portable Text engine, exactly like the typed cards
+ *   injected into the hollow StackedCard shell. In the product the catalog is
+ *   application code; the presentation ships this demo copy so the stories
+ *   need no app imports.
+ */
+
+/* ---- the dialog shell ---------------------------------------------- */
+
+const DIALOG_WIDTH = {
+  sm: "520px",
+  md: "720px",
+  lg: "880px"
+};
+
+/* Feedback — the thumbs up / down slot. Down-vote reuses the up icon,
+   rotated (the DS set only ships ThumbUpOutlineIcon). */
+const StyledFeedback = styled.div.withConfig({
+  displayName: "MessageDialog__StyledFeedback",
+  componentId: "sc-1kt5lil-0"
+})(["display:flex;align-items:center;justify-content:center;gap:8px;padding:8px 24px 28px;", "{padding:4px 24px 24px;}.fb-question{margin-right:4px;}.fb-btn svg{width:18px;height:18px;}.fb-down svg{transform:rotate(180deg);}"], screenBelow.sm);
+const DialogFeedback = _ref => {
+  let onVote = _ref.onVote;
+  const _useState = useState(null),
+    voted = _useState[0],
+    setVoted = _useState[1];
+  const vote = useCallback(value => {
+    setVoted(value);
+    onVote == null || onVote(value);
+  }, [onVote]);
+  return /*#__PURE__*/React.createElement(StyledFeedback, null, voted ? /*#__PURE__*/React.createElement(Body2, {
+    color: "secondary"
+  }, "Thanks for your feedback!") : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Body2, {
+    color: "secondary",
+    className: "fb-question"
+  }, "Was this helpful?"), /*#__PURE__*/React.createElement(Tooltip, {
+    title: "Yes, helpful"
+  }, /*#__PURE__*/React.createElement(IconButton, {
+    type: "button",
+    variant: "text gray",
+    className: "fb-btn",
+    "aria-label": "Yes, helpful",
+    onClick: () => vote("up")
+  }, /*#__PURE__*/React.createElement(ThumbUpOutlineIcon, null))), /*#__PURE__*/React.createElement(Tooltip, {
+    title: "No, not helpful"
+  }, /*#__PURE__*/React.createElement(IconButton, {
+    type: "button",
+    variant: "text gray",
+    className: "fb-btn fb-down",
+    "aria-label": "No, not helpful",
+    onClick: () => vote("down")
+  }, /*#__PURE__*/React.createElement(ThumbUpOutlineIcon, null)))));
+};
+
+/* The shell is behaviour only: it sizes itself, closes on click-outside /
+   Esc (DS Modal) / the X, and shows the feedback slot when an onVote handler
+   is supplied. Content is whatever the caller renders as children — usually
+   the Portable Text engine with the demo catalog injected. */
+const StyledDialog = styled.div.withConfig({
+  displayName: "MessageDialog__StyledDialog",
+  componentId: "sc-1kt5lil-1"
+})(["position:relative;box-sizing:border-box;display:flex;flex-direction:column;width:calc(100% - 32px);max-width:", ";max-height:calc(100vh - 96px);margin:56px auto 40px;overflow-y:auto;background-color:var(--page-paper-main);color:var(--color-theme-900);border-radius:12px;box-shadow:var(--shadow-primary);", "{margin:16px auto;}.dlg-close{position:absolute;top:12px;right:12px;z-index:2;}.dlg-content{padding:40px;}", "{.dlg-content{padding:32px 20px 24px;}}"], _ref2 => {
+  let $size = _ref2.$size;
+  return DIALOG_WIDTH[$size];
+}, screenBelow.sm, screenBelow.sm);
+export const MessageDialog = _ref3 => {
+  let open = _ref3.open,
+    onClose = _ref3.onClose,
+    _ref3$size = _ref3.size,
+    size = _ref3$size === void 0 ? "md" : _ref3$size,
+    onVote = _ref3.onVote,
+    children = _ref3.children;
+  return /*#__PURE__*/React.createElement(Modal, {
+    open: open,
+    onClose: onClose
+  }, /*#__PURE__*/React.createElement(StyledDialog, {
+    $size: size
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "dlg-close"
+  }, /*#__PURE__*/React.createElement(Tooltip, {
+    title: "Close"
+  }, /*#__PURE__*/React.createElement(IconButton, {
+    type: "button",
+    variant: "text gray",
+    "aria-label": "Close",
+    onClick: onClose
+  }, /*#__PURE__*/React.createElement(CancelCrossIcon, null)))), /*#__PURE__*/React.createElement("div", {
+    className: "dlg-content"
+  }, children), onVote ? /*#__PURE__*/React.createElement(DialogFeedback, {
+    onVote: onVote
+  }) : null));
+};
+
+/* ---- doc-link wiring ------------------------------------------------ */
+
+/** How a doc-link mark opens its article (by a slug-like reference). The
+    surface that renders the message supplies the handler — in the product it
+    closes the dialog and opens the article Sheet. */
+
+export const DocLinkContext = /*#__PURE__*/React.createContext(() => undefined);
+
+/* ---- the demo message element catalog ------------------------------- */
+
+/* Inline marks ------------------------------------------------------- */
+
+/* interface-name — the name of an interface element, e.g. the Security page. */
+const StyledInterfaceName = styled.span.withConfig({
+  displayName: "MessageDialog__StyledInterfaceName",
+  componentId: "sc-1kt5lil-2"
+})(["padding:0 4px;border-radius:4px;background-color:var(--color-theme-300);color:var(--color-theme-900);font-weight:600;white-space:nowrap;"]);
+const InterfaceNameMark = _ref4 => {
+  let children = _ref4.children;
+  return /*#__PURE__*/React.createElement(StyledInterfaceName, null, children);
+};
+
+/* keyboard-key — a keyboard key cap. */
+const StyledKeyboardKey = styled.kbd.withConfig({
+  displayName: "MessageDialog__StyledKeyboardKey",
+  componentId: "sc-1kt5lil-3"
+})(["display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border:1px solid var(--border-primary);border-bottom-width:2px;border-radius:5px;background-color:var(--color-theme-200);color:var(--color-theme-900);font-family:ui-monospace,\"SFMono-Regular\",Menlo,Consolas,monospace;font-size:11px;font-weight:600;line-height:1;vertical-align:baseline;"]);
+const KeyboardKeyMark = _ref5 => {
+  let children = _ref5.children;
+  return /*#__PURE__*/React.createElement(StyledKeyboardKey, null, children);
+};
+
+/* doc-link — an inline link that opens a full help article. The mark carries
+   an article reference; the open behaviour comes from DocLinkContext, so the
+   authored content stays declarative. */
+/* Built on the engine's inline anchor so a doc-link sits in the sentence
+   exactly like a default link mark — same size, weight and line box as the
+   surrounding copy — just recoloured. */
+const StyledDocLink = styled(InlineLink).withConfig({
+  displayName: "MessageDialog__StyledDocLink",
+  componentId: "sc-1kt5lil-4"
+})(["color:var(--color-secondary);text-decoration-color:var(--color-secondary);"]);
+const DocLinkMark = _ref6 => {
+  let mark = _ref6.mark,
+    children = _ref6.children;
+  const openArticle = useContext(DocLinkContext);
+  return /*#__PURE__*/React.createElement(StyledDocLink, {
+    href: "#",
+    onClick: event => {
+      event.preventDefault();
+      openArticle(mark == null ? void 0 : mark.article);
+    }
+  }, children);
+};
+
+/* Component objects --------------------------------------------------- */
+
+/* callout — rendered with the DS InfoBox; the catalog keeps its own tone
+   vocabulary and maps it to InfoBox types. */
+
+const CALLOUT_TYPE = {
+  info: "default",
+  note: "note",
+  success: "success"
+};
+const CalloutObject = _ref7 => {
+  var _ref8;
+  let node = _ref7.node,
+    children = _ref7.children;
+  return /*#__PURE__*/React.createElement(InfoBox, {
+    type: CALLOUT_TYPE[(_ref8 = node.tone) != null ? _ref8 : "info"],
+    title: node.title,
+    showIcon: true
+  }, children);
+};
+
+/* button-reference — a real DS Button shown for reference as its own block,
+   so a message can point at a button instead of screenshotting it. It is
+   intentionally non-interactive. */
+const StyledButtonReference = styled.div.withConfig({
+  displayName: "MessageDialog__StyledButtonReference",
+  componentId: "sc-1kt5lil-5"
+})(["display:flex;.c-button{pointer-events:none;}"]);
+const ButtonReferenceObject = _ref9 => {
+  var _ref0;
+  let node = _ref9.node;
+  if (typeof node.label !== "string") {
+    return null;
+  }
+  return /*#__PURE__*/React.createElement(StyledButtonReference, {
+    "aria-hidden": "true"
+  }, /*#__PURE__*/React.createElement(Button, {
+    variant: (_ref0 = node.variant) != null ? _ref0 : "primary",
+    size: "small",
+    type: "button",
+    tabIndex: -1
+  }, node.label));
+};
+
+/* row — a horizontal run of blocks (e.g. two button references). */
+const RowObject = _ref1 => {
+  var _ref10;
+  let node = _ref1.node,
+    children = _ref1.children;
+  return /*#__PURE__*/React.createElement(Row, {
+    space: (_ref10 = node.space) != null ? _ref10 : "sm"
+  }, children);
+};
+
+/* tiles — an equal-size mosaic of blocks. */
+const TilesObject = _ref11 => {
+  var _ref12;
+  let node = _ref11.node,
+    children = _ref11.children;
+  return /*#__PURE__*/React.createElement(Tiles, {
+    columns: (_ref12 = node.columns) != null ? _ref12 : 3,
+    space: "md",
+    collapseBelow: "sm"
+  }, children);
+};
+
+/* split — text beside media, with the one layout rule the messages follow:
+   screenshots sit on the right, flat illustrations on the left. `widths` is
+   authored as [text, media] and reordered with the columns. */
+
+const SplitObject = _ref13 => {
+  var _ref14;
+  let node = _ref13.node,
+    children = _ref13.children;
+  const media = node.media;
+  const widths = (_ref14 = node.widths) != null ? _ref14 : [1, 1];
+  const textColumn = /*#__PURE__*/React.createElement(Stack, {
+    space: "lg"
+  }, children);
+
+  // A split without media degrades to its text column instead of crashing.
+  if (!(media != null && media.src)) {
+    return textColumn;
+  }
+  const screenshot = media.variant === "screenshot";
+  const mediaColumn = /*#__PURE__*/React.createElement(Media, {
+    src: media.src,
+    alt: media.alt,
+    variant: media.variant,
+    caption: media.caption
+  });
+  return /*#__PURE__*/React.createElement(Columns, {
+    widths: screenshot ? widths : [...widths].reverse(),
+    space: "xl",
+    alignY: "center",
+    collapseBelow: "md"
+  }, screenshot ? textColumn : mediaColumn, screenshot ? mediaColumn : textColumn);
+};
+
+/* Default-block overrides --------------------------------------------- */
+
+/* The engine's defaults use Body 1 primary; the messages are designed on the
+   quieter Body 2 secondary voice, so the catalog overrides the text blocks —
+   demonstrating the `blocks` half of the injection contract. */
+const ParagraphBlock = _ref15 => {
+  let children = _ref15.children;
+  return /*#__PURE__*/React.createElement(Body2, {
+    color: "secondary",
+    lineHeight: "loose"
+  }, children);
+};
+const ListItemBlock = _ref16 => {
+  let children = _ref16.children;
+  return /*#__PURE__*/React.createElement(Typography, {
+    variant: "Body 2",
+    as: "li",
+    color: "secondary",
+    lineHeight: "loose"
+  }, children);
+};
+
+/* Only the delta from the default renderer: the messages want a roomier
+   rhythm between a titled section's content nodes. */
+const DefaultTitledText = portableTextDefaultBlockRenderers["titled-text"];
+const TitledTextBlock = _ref17 => {
+  let block = _ref17.block,
+    children = _ref17.children;
+  return /*#__PURE__*/React.createElement(DefaultTitledText, {
+    block: block
+  }, children ? /*#__PURE__*/React.createElement(Stack, {
+    space: "sm"
+  }, children) : undefined);
+};
+
+/** The demo catalog the presentations inject into the Portable Text engine —
+    the stand-in for the application's `messageComponents` map. */
+export const messageComponents = {
+  marks: {
+    "interface-name": InterfaceNameMark,
+    "keyboard-key": KeyboardKeyMark,
+    "doc-link": DocLinkMark
+  },
+  objects: {
+    callout: CalloutObject,
+    "button-reference": ButtonReferenceObject,
+    row: RowObject,
+    tiles: TilesObject,
+    split: SplitObject
+  },
+  blocks: {
+    paragraph: ParagraphBlock,
+    "list-item": ListItemBlock,
+    "titled-text": TitledTextBlock
+  }
+};
+//# sourceMappingURL=MessageDialog.js.map

package/dist/esm/presentation/shared/MessageDialog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MessageDialog.js","names":["React","useCallback","useContext","useState","styled","screenBelow","Button","Columns","IconButton","CancelCrossIcon","ThumbUpOutlineIcon","InfoBox","Media","Modal","portableTextDefaultBlockRenderers","StyledLink","InlineLink","Row","Stack","Tiles","Tooltip","Body2","Typography","DIALOG_WIDTH","sm","md","lg","StyledFeedback","div","withConfig","displayName","componentId","DialogFeedback","_ref","onVote","_useState","voted","setVoted","vote","value","createElement","color","Fragment","className","title","type","variant","onClick","StyledDialog","_ref2","$size","MessageDialog","_ref3","open","onClose","_ref3$size","size","children","DocLinkContext","createContext","undefined","StyledInterfaceName","span","InterfaceNameMark","_ref4","StyledKeyboardKey","kbd","KeyboardKeyMark","_ref5","StyledDocLink","DocLinkMark","_ref6","mark","openArticle","href","event","preventDefault","article","CALLOUT_TYPE","info","note","success","CalloutObject","_ref7","_ref8","node","tone","showIcon","StyledButtonReference","ButtonReferenceObject","_ref9","_ref0","label","tabIndex","RowObject","_ref1","_ref10","space","TilesObject","_ref11","_ref12","columns","collapseBelow","SplitObject","_ref13","_ref14","media","widths","textColumn","src","screenshot","mediaColumn","alt","caption","reverse","alignY","ParagraphBlock","_ref15","lineHeight","ListItemBlock","_ref16","as","DefaultTitledText","TitledTextBlock","_ref17","block","messageComponents","marks","objects","callout","row","tiles","split","blocks","paragraph"],"sources":["../../../../src/presentation/shared/MessageDialog.tsx"],"sourcesContent":["import React, {\n  ReactElement,\n  ReactNode,\n  useCallback,\n  useContext,\n  useState,\n} from \"react\";\n\nimport styled from \"styled-components\";\n\nimport { screenBelow } from \"../../components/BreakPoints\";\nimport { Button } from \"../../components/Button\";\nimport { Columns } from \"../../components/Columns\";\nimport { IconButton } from \"../../components/IconButton\";\nimport { CancelCrossIcon, ThumbUpOutlineIcon } from \"../../components/Icons\";\nimport { InfoBox, InfoBoxType } from \"../../components/InfoBox\";\nimport { Space } from \"../../components/LayoutTokens\";\nimport { Media } from \"../../components/Media\";\nimport { Modal } from \"../../components/Modal\";\nimport {\n  portableTextDefaultBlockRenderers,\n  PortableTextBlockRenderer,\n  PortableTextComponents,\n  PortableTextMarkRenderer,\n  PortableTextMediaVariant,\n  PortableTextObjectRenderer,\n} from \"../../components/PortableText\";\nimport { StyledLink as InlineLink } from \"../../components/PortableText/Styles\";\nimport { Row } from \"../../components/Row\";\nimport { Stack } from \"../../components/Stack\";\nimport { Tiles } from \"../../components/Tiles\";\nimport { Tooltip } from \"../../components/Tooltip\";\nimport { Body2 } from \"../../components/Typography\";\nimport { Typography } from \"../../components/Typography/Typography\";\n\n/**\n * The in-app message dialog, as a Presentation mock.\n *\n * Two pieces, mirroring how the product is split:\n *\n * - {@link MessageDialog} — the hollow dialog shell (width, closing,\n *   feedback), built only from design-system parts. In the product this shell\n *   lives in the application as `InAppMessageDialog`.\n * - {@link messageComponents} — a demo message element catalog injected into\n *   the design-system Portable Text engine, exactly like the typed cards\n *   injected into the hollow StackedCard shell. In the product the catalog is\n *   application code; the presentation ships this demo copy so the stories\n *   need no app imports.\n */\n\n/* ---- the dialog shell ---------------------------------------------- */\n\nexport type MessageDialogSize = \"sm\" | \"md\" | \"lg\";\n\nconst DIALOG_WIDTH: Record<MessageDialogSize, string> = {\n  sm: \"520px\",\n  md: \"720px\",\n  lg: \"880px\",\n};\n\n/* Feedback — the thumbs up / down slot. Down-vote reuses the up icon,\n   rotated (the DS set only ships ThumbUpOutlineIcon). */\nconst StyledFeedback = styled.div`\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 8px;\n  padding: 8px 24px 28px;\n\n  ${screenBelow.sm} {\n    padding: 4px 24px 24px;\n  }\n\n  .fb-question {\n    margin-right: 4px;\n  }\n\n  .fb-btn svg {\n    width: 18px;\n    height: 18px;\n  }\n\n  .fb-down svg {\n    transform: rotate(180deg);\n  }\n`;\n\nconst DialogFeedback = ({\n  onVote,\n}: {\n  onVote?: (vote: \"up\" | \"down\") => void;\n}): ReactElement => {\n  const [voted, setVoted] = useState<\"up\" | \"down\" | null>(null);\n  const vote = useCallback(\n    (value: \"up\" | \"down\") => {\n      setVoted(value);\n      onVote?.(value);\n    },\n    [onVote]\n  );\n\n  return (\n    <StyledFeedback>\n      {voted ? (\n        <Body2 color=\"secondary\">Thanks for your feedback!</Body2>\n      ) : (\n        <>\n          <Body2 color=\"secondary\" className=\"fb-question\">\n            Was this helpful?\n          </Body2>\n          <Tooltip title=\"Yes, helpful\">\n            <IconButton\n              type=\"button\"\n              variant=\"text gray\"\n              className=\"fb-btn\"\n              aria-label=\"Yes, helpful\"\n              onClick={() => vote(\"up\")}\n            >\n              <ThumbUpOutlineIcon />\n            </IconButton>\n          </Tooltip>\n          <Tooltip title=\"No, not helpful\">\n            <IconButton\n              type=\"button\"\n              variant=\"text gray\"\n              className=\"fb-btn fb-down\"\n              aria-label=\"No, not helpful\"\n              onClick={() => vote(\"down\")}\n            >\n              <ThumbUpOutlineIcon />\n            </IconButton>\n          </Tooltip>\n        </>\n      )}\n    </StyledFeedback>\n  );\n};\n\n/* The shell is behaviour only: it sizes itself, closes on click-outside /\n   Esc (DS Modal) / the X, and shows the feedback slot when an onVote handler\n   is supplied. Content is whatever the caller renders as children — usually\n   the Portable Text engine with the demo catalog injected. */\nconst StyledDialog = styled.div<{ $size: MessageDialogSize }>`\n  position: relative;\n  box-sizing: border-box;\n  display: flex;\n  flex-direction: column;\n  width: calc(100% - 32px);\n  max-width: ${({ $size }) => DIALOG_WIDTH[$size]};\n  max-height: calc(100vh - 96px);\n  margin: 56px auto 40px;\n  overflow-y: auto;\n  background-color: var(--page-paper-main);\n  color: var(--color-theme-900);\n  border-radius: 12px;\n  box-shadow: var(--shadow-primary);\n\n  ${screenBelow.sm} {\n    margin: 16px auto;\n  }\n\n  /* X floats in the corner and overlaps the content padding — it does not\n     reserve a row of its own. */\n  .dlg-close {\n    position: absolute;\n    top: 12px;\n    right: 12px;\n    z-index: 2;\n  }\n\n  .dlg-content {\n    padding: 40px;\n  }\n\n  ${screenBelow.sm} {\n    .dlg-content {\n      padding: 32px 20px 24px;\n    }\n  }\n`;\n\nexport interface MessageDialogProps {\n  open: boolean;\n  onClose: () => void;\n  size?: MessageDialogSize;\n  /** Supplying a handler shows the centred helpful / not-helpful vote. */\n  onVote?: (vote: \"up\" | \"down\") => void;\n  children: ReactNode;\n}\n\nexport const MessageDialog = ({\n  open,\n  onClose,\n  size = \"md\",\n  onVote,\n  children,\n}: MessageDialogProps): ReactElement => (\n  <Modal open={open} onClose={onClose}>\n    <StyledDialog $size={size}>\n      <div className=\"dlg-close\">\n        <Tooltip title=\"Close\">\n          <IconButton\n            type=\"button\"\n            variant=\"text gray\"\n            aria-label=\"Close\"\n            onClick={onClose}\n          >\n            <CancelCrossIcon />\n          </IconButton>\n        </Tooltip>\n      </div>\n      <div className=\"dlg-content\">{children}</div>\n      {onVote ? <DialogFeedback onVote={onVote} /> : null}\n    </StyledDialog>\n  </Modal>\n);\n\n/* ---- doc-link wiring ------------------------------------------------ */\n\n/** How a doc-link mark opens its article (by a slug-like reference). The\n    surface that renders the message supplies the handler — in the product it\n    closes the dialog and opens the article Sheet. */\nexport type OpenArticleHandler = (article?: string) => void;\n\nexport const DocLinkContext = React.createContext<OpenArticleHandler>(\n  () => undefined\n);\n\n/* ---- the demo message element catalog ------------------------------- */\n\n/* Inline marks ------------------------------------------------------- */\n\n/* interface-name — the name of an interface element, e.g. the Security page. */\nconst StyledInterfaceName = styled.span`\n  padding: 0 4px;\n  border-radius: 4px;\n  background-color: var(--color-theme-300);\n  color: var(--color-theme-900);\n  font-weight: 600;\n  white-space: nowrap;\n`;\nconst InterfaceNameMark: PortableTextMarkRenderer = ({ children }) => (\n  <StyledInterfaceName>{children}</StyledInterfaceName>\n);\n\n/* keyboard-key — a keyboard key cap. */\nconst StyledKeyboardKey = styled.kbd`\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  min-width: 20px;\n  height: 20px;\n  padding: 0 6px;\n  border: 1px solid var(--border-primary);\n  border-bottom-width: 2px;\n  border-radius: 5px;\n  background-color: var(--color-theme-200);\n  color: var(--color-theme-900);\n  font-family: ui-monospace, \"SFMono-Regular\", Menlo, Consolas, monospace;\n  font-size: 11px;\n  font-weight: 600;\n  line-height: 1;\n  vertical-align: baseline;\n`;\nconst KeyboardKeyMark: PortableTextMarkRenderer = ({ children }) => (\n  <StyledKeyboardKey>{children}</StyledKeyboardKey>\n);\n\n/* doc-link — an inline link that opens a full help article. The mark carries\n   an article reference; the open behaviour comes from DocLinkContext, so the\n   authored content stays declarative. */\n/* Built on the engine's inline anchor so a doc-link sits in the sentence\n   exactly like a default link mark — same size, weight and line box as the\n   surrounding copy — just recoloured. */\nconst StyledDocLink = styled(InlineLink)`\n  color: var(--color-secondary);\n  text-decoration-color: var(--color-secondary);\n`;\nconst DocLinkMark: PortableTextMarkRenderer = ({ mark, children }) => {\n  const openArticle = useContext(DocLinkContext);\n  return (\n    <StyledDocLink\n      href=\"#\"\n      onClick={(event: React.MouseEvent) => {\n        event.preventDefault();\n        openArticle(mark?.article as string | undefined);\n      }}\n    >\n      {children}\n    </StyledDocLink>\n  );\n};\n\n/* Component objects --------------------------------------------------- */\n\n/* callout — rendered with the DS InfoBox; the catalog keeps its own tone\n   vocabulary and maps it to InfoBox types. */\ntype CalloutTone = \"info\" | \"note\" | \"success\";\nconst CALLOUT_TYPE: Record<CalloutTone, InfoBoxType> = {\n  info: \"default\",\n  note: \"note\",\n  success: \"success\",\n};\nconst CalloutObject: PortableTextObjectRenderer = ({ node, children }) => (\n  <InfoBox\n    type={CALLOUT_TYPE[(node.tone as CalloutTone | undefined) ?? \"info\"]}\n    title={node.title as string | undefined}\n    showIcon\n  >\n    {children}\n  </InfoBox>\n);\n\n/* button-reference — a real DS Button shown for reference as its own block,\n   so a message can point at a button instead of screenshotting it. It is\n   intentionally non-interactive. */\nconst StyledButtonReference = styled.div`\n  display: flex;\n\n  .c-button {\n    pointer-events: none;\n  }\n`;\ntype ButtonReferenceVariant =\n  | \"primary\"\n  | \"secondary\"\n  | \"text colored\"\n  | \"text gray\";\nconst ButtonReferenceObject: PortableTextObjectRenderer = ({ node }) => {\n  if (typeof node.label !== \"string\") {\n    return null;\n  }\n\n  return (\n    <StyledButtonReference aria-hidden=\"true\">\n      <Button\n        variant={\n          (node.variant as ButtonReferenceVariant | undefined) ?? \"primary\"\n        }\n        size=\"small\"\n        type=\"button\"\n        tabIndex={-1}\n      >\n        {node.label}\n      </Button>\n    </StyledButtonReference>\n  );\n};\n\n/* row — a horizontal run of blocks (e.g. two button references). */\nconst RowObject: PortableTextObjectRenderer = ({ node, children }) => (\n  <Row space={(node.space as Space | undefined) ?? \"sm\"}>{children}</Row>\n);\n\n/* tiles — an equal-size mosaic of blocks. */\nconst TilesObject: PortableTextObjectRenderer = ({ node, children }) => (\n  <Tiles\n    columns={(node.columns as number | undefined) ?? 3}\n    space=\"md\"\n    collapseBelow=\"sm\"\n  >\n    {children}\n  </Tiles>\n);\n\n/* split — text beside media, with the one layout rule the messages follow:\n   screenshots sit on the right, flat illustrations on the left. `widths` is\n   authored as [text, media] and reordered with the columns. */\ninterface SplitMedia {\n  src: string;\n  alt?: string;\n  variant?: PortableTextMediaVariant;\n  caption?: string;\n}\nconst SplitObject: PortableTextObjectRenderer = ({ node, children }) => {\n  const media = node.media as SplitMedia | undefined;\n  const widths = (node.widths as number[] | undefined) ?? [1, 1];\n  const textColumn = <Stack space=\"lg\">{children}</Stack>;\n\n  // A split without media degrades to its text column instead of crashing.\n  if (!media?.src) {\n    return textColumn;\n  }\n\n  const screenshot = media.variant === \"screenshot\";\n\n  const mediaColumn = (\n    <Media\n      src={media.src}\n      alt={media.alt}\n      variant={media.variant}\n      caption={media.caption}\n    />\n  );\n\n  return (\n    <Columns\n      widths={screenshot ? widths : [...widths].reverse()}\n      space=\"xl\"\n      alignY=\"center\"\n      collapseBelow=\"md\"\n    >\n      {screenshot ? textColumn : mediaColumn}\n      {screenshot ? mediaColumn : textColumn}\n    </Columns>\n  );\n};\n\n/* Default-block overrides --------------------------------------------- */\n\n/* The engine's defaults use Body 1 primary; the messages are designed on the\n   quieter Body 2 secondary voice, so the catalog overrides the text blocks —\n   demonstrating the `blocks` half of the injection contract. */\nconst ParagraphBlock: PortableTextBlockRenderer = ({ children }) => (\n  <Body2 color=\"secondary\" lineHeight=\"loose\">\n    {children}\n  </Body2>\n);\n\nconst ListItemBlock: PortableTextBlockRenderer = ({ children }) => (\n  <Typography variant=\"Body 2\" as=\"li\" color=\"secondary\" lineHeight=\"loose\">\n    {children}\n  </Typography>\n);\n\n/* Only the delta from the default renderer: the messages want a roomier\n   rhythm between a titled section's content nodes. */\nconst DefaultTitledText = portableTextDefaultBlockRenderers[\"titled-text\"];\nconst TitledTextBlock: PortableTextBlockRenderer = ({ block, children }) => (\n  <DefaultTitledText block={block}>\n    {children ? <Stack space=\"sm\">{children}</Stack> : undefined}\n  </DefaultTitledText>\n);\n\n/** The demo catalog the presentations inject into the Portable Text engine —\n    the stand-in for the application's `messageComponents` map. */\nexport const messageComponents: PortableTextComponents = {\n  marks: {\n    \"interface-name\": InterfaceNameMark,\n    \"keyboard-key\": KeyboardKeyMark,\n    \"doc-link\": DocLinkMark,\n  },\n  objects: {\n    callout: CalloutObject,\n    \"button-reference\": ButtonReferenceObject,\n    row: RowObject,\n    tiles: TilesObject,\n    split: SplitObject,\n  },\n  blocks: {\n    paragraph: ParagraphBlock,\n    \"list-item\": ListItemBlock,\n    \"titled-text\": TitledTextBlock,\n  },\n};\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/presentation/shared/index.d.ts

@@ -12,6 +12,8 @@ export type { PresentationShellProps } from "./PresentationShell";
 export { PageHeader, ProjectPageHeader, TabHeader } from "./headers";
 export type { PageHeaderProps, ProjectPageHeaderProps, TabHeaderProps, } from "./headers";
 export { FloatingControls } from "./FloatingControls";
+export { MessageDialog, DocLinkContext, messageComponents, } from "./MessageDialog";
+export type { MessageDialogProps, MessageDialogSize, OpenArticleHandler, } from "./MessageDialog";
 export { HelpAndSupportMenu } from "./HelpAndSupportMenu";
 export type { HelpAndSupportMenuProps } from "./HelpAndSupportMenu";
 export { LinkingCommandsButton } from "./LinkingCommandsButton";

package/dist/esm/presentation/shared/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/presentation/shared/index.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,cAAc,UAAU,CAAC;AACzB,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,iBAAiB,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AACzE,YAAY,EAAE,sBAAsB,EAAE,MAAM,qBAAqB,CAAC;AAClE,OAAO,EAAE,UAAU,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;AACrE,YAAY,EACV,eAAe,EACf,sBAAsB,EACtB,cAAc,GACf,MAAM,WAAW,CAAC;AACnB,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,YAAY,EAAE,uBAAuB,EAAE,MAAM,sBAAsB,CAAC;AACpE,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,EAAE,6BAA6B,EAAE,MAAM,iCAAiC,CAAC;AAChF,YAAY,EAAE,kCAAkC,EAAE,MAAM,iCAAiC,CAAC;AAC1F,OAAO,EACL,uBAAuB,EACvB,gBAAgB,EAChB,gBAAgB,EAChB,WAAW,EACX,oBAAoB,EACpB,wBAAwB,GACzB,MAAM,2BAA2B,CAAC;AACnC,YAAY,EACV,4BAA4B,EAC5B,qBAAqB,EACrB,UAAU,EACV,iBAAiB,EACjB,UAAU,GACX,MAAM,2BAA2B,CAAC;AACnC,OAAO,EACL,iBAAiB,EACjB,mBAAmB,EACnB,oBAAoB,GACrB,MAAM,qBAAqB,CAAC;AAC7B,YAAY,EACV,sBAAsB,EACtB,iBAAiB,EACjB,iBAAiB,EACjB,UAAU,GACX,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EACL,iBAAiB,EACjB,QAAQ,EACR,OAAO,EACP,KAAK,EACL,aAAa,EACb,eAAe,GAChB,MAAM,qBAAqB,CAAC;AAC7B,YAAY,EACV,UAAU,EACV,SAAS,EACT,KAAK,EACL,YAAY,EACZ,UAAU,EACV,UAAU,EACV,cAAc,GACf,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,EAAE,eAAe,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AACzE,YAAY,EACV,oBAAoB,EACpB,wBAAwB,GACzB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,YAAY,EAAE,aAAa,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AACjE,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,YAAY,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAC9D,OAAO,EAAE,kBAAkB,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAChF,YAAY,EACV,uBAAuB,EACvB,2BAA2B,GAC5B,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EACL,cAAc,EACd,eAAe,EACf,gBAAgB,EAChB,OAAO,EACP,UAAU,GACX,MAAM,YAAY,CAAC;AACpB,YAAY,EAAE,mBAAmB,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/presentation/shared/index.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,cAAc,UAAU,CAAC;AACzB,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,iBAAiB,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AACzE,YAAY,EAAE,sBAAsB,EAAE,MAAM,qBAAqB,CAAC;AAClE,OAAO,EAAE,UAAU,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;AACrE,YAAY,EACV,eAAe,EACf,sBAAsB,EACtB,cAAc,GACf,MAAM,WAAW,CAAC;AACnB,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,EACL,aAAa,EACb,cAAc,EACd,iBAAiB,GAClB,MAAM,iBAAiB,CAAC;AACzB,YAAY,EACV,kBAAkB,EAClB,iBAAiB,EACjB,kBAAkB,GACnB,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,YAAY,EAAE,uBAAuB,EAAE,MAAM,sBAAsB,CAAC;AACpE,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,EAAE,6BAA6B,EAAE,MAAM,iCAAiC,CAAC;AAChF,YAAY,EAAE,kCAAkC,EAAE,MAAM,iCAAiC,CAAC;AAC1F,OAAO,EACL,uBAAuB,EACvB,gBAAgB,EAChB,gBAAgB,EAChB,WAAW,EACX,oBAAoB,EACpB,wBAAwB,GACzB,MAAM,2BAA2B,CAAC;AACnC,YAAY,EACV,4BAA4B,EAC5B,qBAAqB,EACrB,UAAU,EACV,iBAAiB,EACjB,UAAU,GACX,MAAM,2BAA2B,CAAC;AACnC,OAAO,EACL,iBAAiB,EACjB,mBAAmB,EACnB,oBAAoB,GACrB,MAAM,qBAAqB,CAAC;AAC7B,YAAY,EACV,sBAAsB,EACtB,iBAAiB,EACjB,iBAAiB,EACjB,UAAU,GACX,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EACL,iBAAiB,EACjB,QAAQ,EACR,OAAO,EACP,KAAK,EACL,aAAa,EACb,eAAe,GAChB,MAAM,qBAAqB,CAAC;AAC7B,YAAY,EACV,UAAU,EACV,SAAS,EACT,KAAK,EACL,YAAY,EACZ,UAAU,EACV,UAAU,EACV,cAAc,GACf,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,EAAE,eAAe,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AACzE,YAAY,EACV,oBAAoB,EACpB,wBAAwB,GACzB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,YAAY,EAAE,aAAa,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AACjE,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,YAAY,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAC9D,OAAO,EAAE,kBAAkB,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAChF,YAAY,EACV,uBAAuB,EACvB,2BAA2B,GAC5B,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EACL,cAAc,EACd,eAAe,EACf,gBAAgB,EAChB,OAAO,EACP,UAAU,GACX,MAAM,YAAY,CAAC;AACpB,YAAY,EAAE,mBAAmB,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC"}

package/dist/esm/presentation/shared/index.js

@@ -10,6 +10,7 @@ export { RoundAvatar } from "./RoundAvatar";
 export { PresentationShell, StyledPagePaper } from "./PresentationShell";
 export { PageHeader, ProjectPageHeader, TabHeader } from "./headers";
 export { FloatingControls } from "./FloatingControls";
+export { MessageDialog, DocLinkContext, messageComponents } from "./MessageDialog";
 export { HelpAndSupportMenu } from "./HelpAndSupportMenu";
 export { LinkingCommandsButton } from "./LinkingCommandsButton";
 export { LinkBranchOrPullRequestDialog } from "./LinkBranchOrPullRequestDialog";

package/dist/esm/presentation/shared/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["MainLogo","RoundAvatar","PresentationShell","StyledPagePaper","PageHeader","ProjectPageHeader","TabHeader","FloatingControls","HelpAndSupportMenu","LinkingCommandsButton","LinkBranchOrPullRequestDialog","ConnectRepositoryDialog","RepositorySelect","buildRepoOptions","CONNECTIONS","PROJECT_REPOSITORIES","CONNECTABLE_REPOSITORIES","WebhookLogsDialog","WEBHOOK_CONNECTIONS","WEBHOOK_REPOSITORIES","SourceCodeSection","IssueRow","CodeRow","Spine","HistoryDialog","CompletedHeader","SuggestSubtasksButton","TaskOptionsMenu","TaskListOptionsMenu","UserMenu","TwoFactorShield","BackupCodesDialogs","CreateLoginCodeDialogs","SettingsHeader","SettingsContent","StyledSettingRow","RowText","SettingRow"],"sources":["../../../../src/presentation/shared/index.ts"],"sourcesContent":["/**\n * Shared building blocks for the Presentation mock-ups (`Presentation/*`\n * stories). The application shell, page headers, tab bar and small widgets are\n * defined once here and reused by the List view, Column view, Task sheet and\n * empty-page stories so the chrome stays identical and in one place.\n */\nexport * from \"./tokens\";\nexport { MainLogo } from \"./MainLogo\";\nexport { RoundAvatar } from \"./RoundAvatar\";\nexport { PresentationShell, StyledPagePaper } from \"./PresentationShell\";\nexport type { PresentationShellProps } from \"./PresentationShell\";\nexport { PageHeader, ProjectPageHeader, TabHeader } from \"./headers\";\nexport type {\n  PageHeaderProps,\n  ProjectPageHeaderProps,\n  TabHeaderProps,\n} from \"./headers\";\nexport { FloatingControls } from \"./FloatingControls\";\nexport { HelpAndSupportMenu } from \"./HelpAndSupportMenu\";\nexport type { HelpAndSupportMenuProps } from \"./HelpAndSupportMenu\";\nexport { LinkingCommandsButton } from \"./LinkingCommandsButton\";\nexport { LinkBranchOrPullRequestDialog } from \"./LinkBranchOrPullRequestDialog\";\nexport type { LinkBranchOrPullRequestDialogProps } from \"./LinkBranchOrPullRequestDialog\";\nexport {\n  ConnectRepositoryDialog,\n  RepositorySelect,\n  buildRepoOptions,\n  CONNECTIONS,\n  PROJECT_REPOSITORIES,\n  CONNECTABLE_REPOSITORIES,\n} from \"./ConnectRepositoryDialog\";\nexport type {\n  ConnectRepositoryDialogProps,\n  RepositorySelectProps,\n  Connection,\n  ConnectionService,\n  Repository,\n} from \"./ConnectRepositoryDialog\";\nexport {\n  WebhookLogsDialog,\n  WEBHOOK_CONNECTIONS,\n  WEBHOOK_REPOSITORIES,\n} from \"./WebhookLogsDialog\";\nexport type {\n  WebhookLogsDialogProps,\n  WebhookConnection,\n  WebhookRepository,\n  WebhookLog,\n} from \"./WebhookLogsDialog\";\nexport {\n  SourceCodeSection,\n  IssueRow,\n  CodeRow,\n  Spine,\n  HistoryDialog,\n  CompletedHeader,\n} from \"./SourceCodeSection\";\nexport type {\n  IssueEntry,\n  CodeEntry,\n  Stage,\n  HistoryEvent,\n  StageState,\n  CodeStatus,\n  SectionVariant,\n} from \"./SourceCodeSection\";\nexport { SuggestSubtasksButton } from \"./SuggestSubtasksButton\";\nexport { TaskOptionsMenu, TaskListOptionsMenu } from \"./TaskOptionsMenu\";\nexport type {\n  TaskOptionsMenuProps,\n  TaskListOptionsMenuProps,\n} from \"./TaskOptionsMenu\";\nexport { UserMenu } from \"./UserMenu\";\nexport type { UserMenuProps, UserMenuVariant } from \"./UserMenu\";\nexport { TwoFactorShield } from \"./TwoFactorShield\";\nexport type { TwoFactorShieldProps } from \"./TwoFactorShield\";\nexport { BackupCodesDialogs, CreateLoginCodeDialogs } from \"./TwoFactorDialogs\";\nexport type {\n  BackupCodesDialogsProps,\n  CreateLoginCodeDialogsProps,\n} from \"./TwoFactorDialogs\";\nexport {\n  SettingsHeader,\n  SettingsContent,\n  StyledSettingRow,\n  RowText,\n  SettingRow,\n} from \"./settings\";\nexport type { SettingsHeaderProps, SettingRowProps } from \"./settings\";\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA,cAAc,UAAU;AACxB,SAASA,QAAQ,QAAQ,YAAY;AACrC,SAASC,WAAW,QAAQ,eAAe;AAC3C,SAASC,iBAAiB,EAAEC,eAAe,QAAQ,qBAAqB;AAExE,SAASC,UAAU,EAAEC,iBAAiB,EAAEC,SAAS,QAAQ,WAAW;AAMpE,SAASC,gBAAgB,QAAQ,oBAAoB;AACrD,SAASC,kBAAkB,QAAQ,sBAAsB;AAEzD,SAASC,qBAAqB,QAAQ,yBAAyB;AAC/D,SAASC,6BAA6B,QAAQ,iCAAiC;AAE/E,SACEC,uBAAuB,EACvBC,gBAAgB,EAChBC,gBAAgB,EAChBC,WAAW,EACXC,oBAAoB,EACpBC,wBAAwB,QACnB,2BAA2B;AAQlC,SACEC,iBAAiB,EACjBC,mBAAmB,EACnBC,oBAAoB,QACf,qBAAqB;AAO5B,SACEC,iBAAiB,EACjBC,QAAQ,EACRC,OAAO,EACPC,KAAK,EACLC,aAAa,EACbC,eAAe,QACV,qBAAqB;AAU5B,SAASC,qBAAqB,QAAQ,yBAAyB;AAC/D,SAASC,eAAe,EAAEC,mBAAmB,QAAQ,mBAAmB;AAKxE,SAASC,QAAQ,QAAQ,YAAY;AAErC,SAASC,eAAe,QAAQ,mBAAmB;AAEnD,SAASC,kBAAkB,EAAEC,sBAAsB,QAAQ,oBAAoB;AAK/E,SACEC,cAAc,EACdC,eAAe,EACfC,gBAAgB,EAChBC,OAAO,EACPC,UAAU,QACL,YAAY","ignoreList":[]}
+{"version":3,"file":"index.js","names":["MainLogo","RoundAvatar","PresentationShell","StyledPagePaper","PageHeader","ProjectPageHeader","TabHeader","FloatingControls","MessageDialog","DocLinkContext","messageComponents","HelpAndSupportMenu","LinkingCommandsButton","LinkBranchOrPullRequestDialog","ConnectRepositoryDialog","RepositorySelect","buildRepoOptions","CONNECTIONS","PROJECT_REPOSITORIES","CONNECTABLE_REPOSITORIES","WebhookLogsDialog","WEBHOOK_CONNECTIONS","WEBHOOK_REPOSITORIES","SourceCodeSection","IssueRow","CodeRow","Spine","HistoryDialog","CompletedHeader","SuggestSubtasksButton","TaskOptionsMenu","TaskListOptionsMenu","UserMenu","TwoFactorShield","BackupCodesDialogs","CreateLoginCodeDialogs","SettingsHeader","SettingsContent","StyledSettingRow","RowText","SettingRow"],"sources":["../../../../src/presentation/shared/index.ts"],"sourcesContent":["/**\n * Shared building blocks for the Presentation mock-ups (`Presentation/*`\n * stories). The application shell, page headers, tab bar and small widgets are\n * defined once here and reused by the List view, Column view, Task sheet and\n * empty-page stories so the chrome stays identical and in one place.\n */\nexport * from \"./tokens\";\nexport { MainLogo } from \"./MainLogo\";\nexport { RoundAvatar } from \"./RoundAvatar\";\nexport { PresentationShell, StyledPagePaper } from \"./PresentationShell\";\nexport type { PresentationShellProps } from \"./PresentationShell\";\nexport { PageHeader, ProjectPageHeader, TabHeader } from \"./headers\";\nexport type {\n  PageHeaderProps,\n  ProjectPageHeaderProps,\n  TabHeaderProps,\n} from \"./headers\";\nexport { FloatingControls } from \"./FloatingControls\";\nexport {\n  MessageDialog,\n  DocLinkContext,\n  messageComponents,\n} from \"./MessageDialog\";\nexport type {\n  MessageDialogProps,\n  MessageDialogSize,\n  OpenArticleHandler,\n} from \"./MessageDialog\";\nexport { HelpAndSupportMenu } from \"./HelpAndSupportMenu\";\nexport type { HelpAndSupportMenuProps } from \"./HelpAndSupportMenu\";\nexport { LinkingCommandsButton } from \"./LinkingCommandsButton\";\nexport { LinkBranchOrPullRequestDialog } from \"./LinkBranchOrPullRequestDialog\";\nexport type { LinkBranchOrPullRequestDialogProps } from \"./LinkBranchOrPullRequestDialog\";\nexport {\n  ConnectRepositoryDialog,\n  RepositorySelect,\n  buildRepoOptions,\n  CONNECTIONS,\n  PROJECT_REPOSITORIES,\n  CONNECTABLE_REPOSITORIES,\n} from \"./ConnectRepositoryDialog\";\nexport type {\n  ConnectRepositoryDialogProps,\n  RepositorySelectProps,\n  Connection,\n  ConnectionService,\n  Repository,\n} from \"./ConnectRepositoryDialog\";\nexport {\n  WebhookLogsDialog,\n  WEBHOOK_CONNECTIONS,\n  WEBHOOK_REPOSITORIES,\n} from \"./WebhookLogsDialog\";\nexport type {\n  WebhookLogsDialogProps,\n  WebhookConnection,\n  WebhookRepository,\n  WebhookLog,\n} from \"./WebhookLogsDialog\";\nexport {\n  SourceCodeSection,\n  IssueRow,\n  CodeRow,\n  Spine,\n  HistoryDialog,\n  CompletedHeader,\n} from \"./SourceCodeSection\";\nexport type {\n  IssueEntry,\n  CodeEntry,\n  Stage,\n  HistoryEvent,\n  StageState,\n  CodeStatus,\n  SectionVariant,\n} from \"./SourceCodeSection\";\nexport { SuggestSubtasksButton } from \"./SuggestSubtasksButton\";\nexport { TaskOptionsMenu, TaskListOptionsMenu } from \"./TaskOptionsMenu\";\nexport type {\n  TaskOptionsMenuProps,\n  TaskListOptionsMenuProps,\n} from \"./TaskOptionsMenu\";\nexport { UserMenu } from \"./UserMenu\";\nexport type { UserMenuProps, UserMenuVariant } from \"./UserMenu\";\nexport { TwoFactorShield } from \"./TwoFactorShield\";\nexport type { TwoFactorShieldProps } from \"./TwoFactorShield\";\nexport { BackupCodesDialogs, CreateLoginCodeDialogs } from \"./TwoFactorDialogs\";\nexport type {\n  BackupCodesDialogsProps,\n  CreateLoginCodeDialogsProps,\n} from \"./TwoFactorDialogs\";\nexport {\n  SettingsHeader,\n  SettingsContent,\n  StyledSettingRow,\n  RowText,\n  SettingRow,\n} from \"./settings\";\nexport type { SettingsHeaderProps, SettingRowProps } from \"./settings\";\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA,cAAc,UAAU;AACxB,SAASA,QAAQ,QAAQ,YAAY;AACrC,SAASC,WAAW,QAAQ,eAAe;AAC3C,SAASC,iBAAiB,EAAEC,eAAe,QAAQ,qBAAqB;AAExE,SAASC,UAAU,EAAEC,iBAAiB,EAAEC,SAAS,QAAQ,WAAW;AAMpE,SAASC,gBAAgB,QAAQ,oBAAoB;AACrD,SACEC,aAAa,EACbC,cAAc,EACdC,iBAAiB,QACZ,iBAAiB;AAMxB,SAASC,kBAAkB,QAAQ,sBAAsB;AAEzD,SAASC,qBAAqB,QAAQ,yBAAyB;AAC/D,SAASC,6BAA6B,QAAQ,iCAAiC;AAE/E,SACEC,uBAAuB,EACvBC,gBAAgB,EAChBC,gBAAgB,EAChBC,WAAW,EACXC,oBAAoB,EACpBC,wBAAwB,QACnB,2BAA2B;AAQlC,SACEC,iBAAiB,EACjBC,mBAAmB,EACnBC,oBAAoB,QACf,qBAAqB;AAO5B,SACEC,iBAAiB,EACjBC,QAAQ,EACRC,OAAO,EACPC,KAAK,EACLC,aAAa,EACbC,eAAe,QACV,qBAAqB;AAU5B,SAASC,qBAAqB,QAAQ,yBAAyB;AAC/D,SAASC,eAAe,EAAEC,mBAAmB,QAAQ,mBAAmB;AAKxE,SAASC,QAAQ,QAAQ,YAAY;AAErC,SAASC,eAAe,QAAQ,mBAAmB;AAEnD,SAASC,kBAAkB,EAAEC,sBAAsB,QAAQ,oBAAoB;AAK/E,SACEC,cAAc,EACdC,eAAe,EACfC,gBAAgB,EAChBC,OAAO,EACPC,UAAU,QACL,YAAY","ignoreList":[]}