@activecollab/components 2.0.363 → 2.0.365

package/dist/esm/presentation/stackedCard/shell.js

@@ -0,0 +1,156 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["selected", "disabled", "pending", "isDragSource", "isDragPreview", "entered", "forceHover", "resizable", "priorityColor", "onResizeDelta", "children"];
+import React, { useCallback, useRef } from "react";
+import styled, { css } from "styled-components";
+
+/**
+ * StackedCard shell (story-local, presentation-only).
+ *
+ * The hollow frame every typed content component composes. Extracted from the
+ * concept spec story (task 2/8) so the StackedCard concept stories share one
+ * shell instead of re-declaring it. The rule the whole subsystem hangs on:
+ *
+ *   THE SHELL STAYS HOLLOW.
+ *
+ * There is no `contentType` enum here, no per-type prop soup, no `if task …`.
+ * The shell owns only VISUAL STATES (selected, disabled, pending, priority,
+ * drag source/preview, entered) and the intent surface (`onResizeDelta`, the
+ * DOM props it forwards). Content — a task, a link, an image, a swatch, a note
+ * — is passed in as `children` and composes the layout primitives. A new
+ * content type later is a new wrapper, with ZERO changes in this file.
+ *
+ * Not exported from the design-system barrel; it lives here so the concept
+ * stories share one source of truth.
+ */
+
+/* ------------------------------------------------------------------ */
+/* Reference dimensions (from the concept)                             */
+/* ------------------------------------------------------------------ */
+
+export const CARD_WIDTH = 260;
+export const CARD_RADIUS = 8;
+
+/* Cover heights are reserved with aspect-ratio (width / height) so a late image
+   never reflows the card. Per-type ratios live with the shell so every content
+   component reserves the same space its skeleton does. */
+export const COVER_RATIO = "260 / 132";
+export const COVER_RATIO_HERO = "320 / 190";
+export const COVER_RATIO_IMAGE = "260 / 168";
+export const COVER_RATIO_SWATCH = "260 / 104";
+
+/* ------------------------------------------------------------------ */
+/* Shell chrome                                                        */
+/* ------------------------------------------------------------------ */
+
+const hoverStyle = css(["box-shadow:0 4px 12px rgba(0,0,0,0.12);border-color:var(--color-theme-500);"]);
+
+/* Controls (cover + entity) share one reveal rule: hidden until the card is
+   hovered OR holds focus, so they are reachable by keyboard, not mouse-only.
+   The cover also reveals its own controls; `&&` gives the forced-on state the
+   specificity to win over that resting rule. */
+const revealControls = css([".sc-control{opacity:0;transition:opacity 120ms ease;}&:hover .sc-control,&:focus-within .sc-control{opacity:1;}"]);
+const StyledCard = styled.div.withConfig({
+  displayName: "shell__StyledCard",
+  componentId: "sc-nmi1iu-0"
+})(["position:relative;display:flex;flex-direction:column;width:", "px;border-radius:", "px;background-color:var(--page-paper-main);border:1px solid var(--border-primary);box-shadow:0 1px 3px rgba(0,0,0,0.08);overflow:hidden;transition:box-shadow 150ms ease,border-color 150ms ease;", " &:hover{", "}&:focus-visible{outline:none;", " box-shadow:0 0 0 2px var(--sc-selection-ring);}", " ", " ", " ", " ", " ", " ", " ", ""], CARD_WIDTH, CARD_RADIUS, revealControls, hoverStyle, hoverStyle, _ref => {
+  let $forceHover = _ref.$forceHover;
+  return $forceHover && css(["", " && .sc-control{opacity:1;}"], hoverStyle);
+}, _ref2 => {
+  let $priorityColor = _ref2.$priorityColor;
+  return $priorityColor && css(["&::before{content:\"\";position:absolute;top:0;bottom:0;left:0;width:4px;background:", ";z-index:2;}"], $priorityColor);
+}, _ref3 => {
+  let $selected = _ref3.$selected;
+  return $selected && css(["border-color:var(--sc-selection-ring);box-shadow:0 0 0 2px var(--sc-selection-ring);"]);
+}, _ref4 => {
+  let $disabled = _ref4.$disabled;
+  return $disabled && css(["opacity:0.5;pointer-events:none;"]);
+}, _ref5 => {
+  let $pending = _ref5.$pending;
+  return $pending && css(["opacity:0.6;pointer-events:none;cursor:progress;"]);
+}, _ref6 => {
+  let $isDragSource = _ref6.$isDragSource;
+  return $isDragSource && css(["background:transparent;border:1px dashed var(--color-theme-500);box-shadow:none;&:hover{box-shadow:none;border-color:var(--color-theme-500);}> *{visibility:hidden;}"]);
+}, _ref7 => {
+  let $isDragPreview = _ref7.$isDragPreview;
+  return $isDragPreview && css(["box-shadow:0 12px 28px rgba(0,0,0,0.24);cursor:grabbing;"]);
+}, _ref8 => {
+  let $entered = _ref8.$entered;
+  return $entered && css(["&&{border-color:var(--sc-selection-ring);box-shadow:inset 0 0 0 2px var(--sc-selection-ring),0 0 0 2px var(--sc-selection-ring);}"]);
+});
+
+/* ------------------------------------------------------------------ */
+/* Resize (opt-in): handle on hover, card reports deltas               */
+/* ------------------------------------------------------------------ */
+
+const StyledResizeHandle = styled.span.withConfig({
+  displayName: "shell__StyledResizeHandle",
+  componentId: "sc-nmi1iu-1"
+})(["position:absolute;right:2px;bottom:2px;width:14px;height:14px;cursor:nwse-resize;color:var(--color-theme-600);z-index:2;svg{display:block;}"]);
+export const ResizeHandleGlyph = () => /*#__PURE__*/React.createElement("svg", {
+  width: "14",
+  height: "14",
+  viewBox: "0 0 14 14",
+  fill: "none",
+  "aria-hidden": "true"
+}, /*#__PURE__*/React.createElement("path", {
+  d: "M12 6v6H6M12 9.5L9.5 12",
+  stroke: "currentColor",
+  strokeWidth: "1.5",
+  strokeLinecap: "round"
+}));
+/* The shell forwards its ref and spreads DOM props (tabIndex, role, aria-*, the
+   keyboard/click handlers) so the focus-model and open-vs-select demos can
+   drive it — but it owns NO drag, selection, or content logic itself. */
+export const StackedCard = /*#__PURE__*/React.forwardRef((_ref9, ref) => {
+  let selected = _ref9.selected,
+    disabled = _ref9.disabled,
+    pending = _ref9.pending,
+    isDragSource = _ref9.isDragSource,
+    isDragPreview = _ref9.isDragPreview,
+    entered = _ref9.entered,
+    forceHover = _ref9.forceHover,
+    resizable = _ref9.resizable,
+    priorityColor = _ref9.priorityColor,
+    onResizeDelta = _ref9.onResizeDelta,
+    children = _ref9.children,
+    rest = _objectWithoutPropertiesLoose(_ref9, _excluded);
+  const dragOrigin = useRef(null);
+  const handlePointerDown = useCallback(e => {
+    dragOrigin.current = {
+      x: e.clientX,
+      y: e.clientY
+    };
+    e.target.setPointerCapture(e.pointerId);
+    e.preventDefault();
+  }, []);
+  const handlePointerMove = useCallback(e => {
+    if (!dragOrigin.current || !onResizeDelta) return;
+    onResizeDelta(e.clientX - dragOrigin.current.x, e.clientY - dragOrigin.current.y);
+    dragOrigin.current = {
+      x: e.clientX,
+      y: e.clientY
+    };
+  }, [onResizeDelta]);
+  const handlePointerUp = useCallback(() => {
+    dragOrigin.current = null;
+  }, []);
+  return /*#__PURE__*/React.createElement(StyledCard, _extends({
+    ref: ref,
+    $selected: selected,
+    $disabled: disabled,
+    $pending: pending,
+    $isDragSource: isDragSource,
+    $isDragPreview: isDragPreview,
+    $entered: entered,
+    $forceHover: forceHover,
+    $priorityColor: priorityColor
+  }, rest), children, resizable ? /*#__PURE__*/React.createElement(StyledResizeHandle, {
+    className: "sc-control",
+    onPointerDown: handlePointerDown,
+    onPointerMove: handlePointerMove,
+    onPointerUp: handlePointerUp
+  }, /*#__PURE__*/React.createElement(ResizeHandleGlyph, null)) : null);
+});
+StackedCard.displayName = "StackedCard";
+//# sourceMappingURL=shell.js.map

package/dist/esm/presentation/stackedCard/shell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"shell.js","names":["React","useCallback","useRef","styled","css","CARD_WIDTH","CARD_RADIUS","COVER_RATIO","COVER_RATIO_HERO","COVER_RATIO_IMAGE","COVER_RATIO_SWATCH","hoverStyle","revealControls","StyledCard","div","withConfig","displayName","componentId","_ref","$forceHover","_ref2","$priorityColor","_ref3","$selected","_ref4","$disabled","_ref5","$pending","_ref6","$isDragSource","_ref7","$isDragPreview","_ref8","$entered","StyledResizeHandle","span","ResizeHandleGlyph","createElement","width","height","viewBox","fill","d","stroke","strokeWidth","strokeLinecap","StackedCard","forwardRef","_ref9","ref","selected","disabled","pending","isDragSource","isDragPreview","entered","forceHover","resizable","priorityColor","onResizeDelta","children","rest","_objectWithoutPropertiesLoose","_excluded","dragOrigin","handlePointerDown","e","current","x","clientX","y","clientY","target","setPointerCapture","pointerId","preventDefault","handlePointerMove","handlePointerUp","_extends","className","onPointerDown","onPointerMove","onPointerUp"],"sources":["../../../../src/presentation/stackedCard/shell.tsx"],"sourcesContent":["import React, { ReactElement, ReactNode, useCallback, useRef } from \"react\";\n\nimport styled, { css } from \"styled-components\";\n\n/**\n * StackedCard shell (story-local, presentation-only).\n *\n * The hollow frame every typed content component composes. Extracted from the\n * concept spec story (task 2/8) so the StackedCard concept stories share one\n * shell instead of re-declaring it. The rule the whole subsystem hangs on:\n *\n *   THE SHELL STAYS HOLLOW.\n *\n * There is no `contentType` enum here, no per-type prop soup, no `if task …`.\n * The shell owns only VISUAL STATES (selected, disabled, pending, priority,\n * drag source/preview, entered) and the intent surface (`onResizeDelta`, the\n * DOM props it forwards). Content — a task, a link, an image, a swatch, a note\n * — is passed in as `children` and composes the layout primitives. A new\n * content type later is a new wrapper, with ZERO changes in this file.\n *\n * Not exported from the design-system barrel; it lives here so the concept\n * stories share one source of truth.\n */\n\n/* ------------------------------------------------------------------ */\n/* Reference dimensions (from the concept)                             */\n/* ------------------------------------------------------------------ */\n\nexport const CARD_WIDTH = 260;\nexport const CARD_RADIUS = 8;\n\n/* Cover heights are reserved with aspect-ratio (width / height) so a late image\n   never reflows the card. Per-type ratios live with the shell so every content\n   component reserves the same space its skeleton does. */\nexport const COVER_RATIO = \"260 / 132\";\nexport const COVER_RATIO_HERO = \"320 / 190\";\nexport const COVER_RATIO_IMAGE = \"260 / 168\";\nexport const COVER_RATIO_SWATCH = \"260 / 104\";\n\n/* ------------------------------------------------------------------ */\n/* Shell chrome                                                        */\n/* ------------------------------------------------------------------ */\n\ninterface StyledCardProps {\n  $selected?: boolean;\n  $disabled?: boolean;\n  $pending?: boolean;\n  $isDragSource?: boolean;\n  $isDragPreview?: boolean;\n  $entered?: boolean;\n  $forceHover?: boolean;\n  $priorityColor?: string;\n}\n\nconst hoverStyle = css`\n  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);\n  border-color: var(--color-theme-500);\n`;\n\n/* Controls (cover + entity) share one reveal rule: hidden until the card is\n   hovered OR holds focus, so they are reachable by keyboard, not mouse-only.\n   The cover also reveals its own controls; `&&` gives the forced-on state the\n   specificity to win over that resting rule. */\nconst revealControls = css`\n  .sc-control {\n    opacity: 0;\n    transition: opacity 120ms ease;\n  }\n\n  &:hover .sc-control,\n  &:focus-within .sc-control {\n    opacity: 1;\n  }\n`;\n\nconst StyledCard = styled.div<StyledCardProps>`\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  width: ${CARD_WIDTH}px;\n  border-radius: ${CARD_RADIUS}px;\n  background-color: var(--page-paper-main);\n  border: 1px solid var(--border-primary);\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);\n  overflow: hidden;\n  transition: box-shadow 150ms ease, border-color 150ms ease;\n\n  ${revealControls}\n\n  &:hover {\n    ${hoverStyle}\n  }\n\n  &:focus-visible {\n    outline: none;\n    ${hoverStyle}\n    box-shadow: 0 0 0 2px var(--sc-selection-ring);\n  }\n\n  ${({ $forceHover }) =>\n    $forceHover &&\n    css`\n      ${hoverStyle}\n      && .sc-control {\n        opacity: 1;\n      }\n    `}\n\n  ${({ $priorityColor }) =>\n    $priorityColor &&\n    css`\n      &::before {\n        content: \"\";\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        left: 0;\n        width: 4px;\n        background: ${$priorityColor};\n        z-index: 2;\n      }\n    `}\n\n  ${({ $selected }) =>\n    $selected &&\n    css`\n      border-color: var(--sc-selection-ring);\n      box-shadow: 0 0 0 2px var(--sc-selection-ring);\n    `}\n\n  ${({ $disabled }) =>\n    $disabled &&\n    css`\n      opacity: 0.5;\n      pointer-events: none;\n    `}\n\n  /* Pending / optimistic — the card was just created or moved and the server\n     has not confirmed it yet. Dimmed, non-interactive and NOT draggable, but\n     distinct from disabled (it is a transient in-flight state, not a policy). */\n  ${({ $pending }) =>\n    $pending &&\n    css`\n      opacity: 0.6;\n      pointer-events: none;\n      cursor: progress;\n    `}\n\n  /* Drag SOURCE — full-size outline placeholder. Content is hidden but keeps\n     its box (visibility, not display) so the card holds identical dimensions\n     and the surrounding cards never move. */\n  ${({ $isDragSource }) =>\n    $isDragSource &&\n    css`\n      background: transparent;\n      border: 1px dashed var(--color-theme-500);\n      box-shadow: none;\n\n      &:hover {\n        box-shadow: none;\n        border-color: var(--color-theme-500);\n      }\n\n      > * {\n        visibility: hidden;\n      }\n    `}\n\n  /* Drag PREVIEW — the 1:1 copy the host floats in the drag layer. Elevated\n     shadow ONLY: no rotate, no scale, no translate. */\n  ${({ $isDragPreview }) =>\n    $isDragPreview &&\n    css`\n      box-shadow: 0 12px 28px rgba(0, 0, 0, 0.24);\n      cursor: grabbing;\n    `}\n\n  /* Entered (focus model) — focus is on one of the card's inner controls. */\n  ${({ $entered }) =>\n    $entered &&\n    css`\n      && {\n        border-color: var(--sc-selection-ring);\n        box-shadow: inset 0 0 0 2px var(--sc-selection-ring),\n          0 0 0 2px var(--sc-selection-ring);\n      }\n    `}\n`;\n\n/* ------------------------------------------------------------------ */\n/* Resize (opt-in): handle on hover, card reports deltas               */\n/* ------------------------------------------------------------------ */\n\nconst StyledResizeHandle = styled.span`\n  position: absolute;\n  right: 2px;\n  bottom: 2px;\n  width: 14px;\n  height: 14px;\n  cursor: nwse-resize;\n  color: var(--color-theme-600);\n  z-index: 2;\n\n  svg {\n    display: block;\n  }\n`;\n\nexport const ResizeHandleGlyph = (): ReactElement => (\n  <svg\n    width=\"14\"\n    height=\"14\"\n    viewBox=\"0 0 14 14\"\n    fill=\"none\"\n    aria-hidden=\"true\"\n  >\n    <path\n      d=\"M12 6v6H6M12 9.5L9.5 12\"\n      stroke=\"currentColor\"\n      strokeWidth=\"1.5\"\n      strokeLinecap=\"round\"\n    />\n  </svg>\n);\n\nexport interface StackedCardProps\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, \"onResize\"> {\n  selected?: boolean;\n  disabled?: boolean;\n  /** Optimistic in-flight state — dimmed, non-interactive, not draggable. */\n  pending?: boolean;\n  /** Full-size outline placeholder left in the source position while dragging. */\n  isDragSource?: boolean;\n  /** The 1:1 elevated copy the host floats in the drag layer. */\n  isDragPreview?: boolean;\n  /** Focus model: the card has been entered and focus is on an inner control. */\n  entered?: boolean;\n  forceHover?: boolean;\n  resizable?: boolean;\n  priorityColor?: string;\n  onResizeDelta?: (dx: number, dy: number) => void;\n  children: ReactNode;\n}\n\n/* The shell forwards its ref and spreads DOM props (tabIndex, role, aria-*, the\n   keyboard/click handlers) so the focus-model and open-vs-select demos can\n   drive it — but it owns NO drag, selection, or content logic itself. */\nexport const StackedCard = React.forwardRef<HTMLDivElement, StackedCardProps>(\n  (\n    {\n      selected,\n      disabled,\n      pending,\n      isDragSource,\n      isDragPreview,\n      entered,\n      forceHover,\n      resizable,\n      priorityColor,\n      onResizeDelta,\n      children,\n      ...rest\n    },\n    ref\n  ): ReactElement => {\n    const dragOrigin = useRef<{ x: number; y: number } | null>(null);\n\n    const handlePointerDown = useCallback((e: React.PointerEvent) => {\n      dragOrigin.current = { x: e.clientX, y: e.clientY };\n      (e.target as HTMLElement).setPointerCapture(e.pointerId);\n      e.preventDefault();\n    }, []);\n\n    const handlePointerMove = useCallback(\n      (e: React.PointerEvent) => {\n        if (!dragOrigin.current || !onResizeDelta) return;\n        onResizeDelta(\n          e.clientX - dragOrigin.current.x,\n          e.clientY - dragOrigin.current.y\n        );\n        dragOrigin.current = { x: e.clientX, y: e.clientY };\n      },\n      [onResizeDelta]\n    );\n\n    const handlePointerUp = useCallback(() => {\n      dragOrigin.current = null;\n    }, []);\n\n    return (\n      <StyledCard\n        ref={ref}\n        $selected={selected}\n        $disabled={disabled}\n        $pending={pending}\n        $isDragSource={isDragSource}\n        $isDragPreview={isDragPreview}\n        $entered={entered}\n        $forceHover={forceHover}\n        $priorityColor={priorityColor}\n        {...rest}\n      >\n        {children}\n        {resizable ? (\n          <StyledResizeHandle\n            className=\"sc-control\"\n            onPointerDown={handlePointerDown}\n            onPointerMove={handlePointerMove}\n            onPointerUp={handlePointerUp}\n          >\n            <ResizeHandleGlyph />\n          </StyledResizeHandle>\n        ) : null}\n      </StyledCard>\n    );\n  }\n);\n\nStackedCard.displayName = \"StackedCard\";\n"],"mappings":";;;AAAA,OAAOA,KAAK,IAA6BC,WAAW,EAAEC,MAAM,QAAQ,OAAO;AAE3E,OAAOC,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;;AAE/C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA,OAAO,MAAMC,UAAU,GAAG,GAAG;AAC7B,OAAO,MAAMC,WAAW,GAAG,CAAC;;AAE5B;AACA;AACA;AACA,OAAO,MAAMC,WAAW,GAAG,WAAW;AACtC,OAAO,MAAMC,gBAAgB,GAAG,WAAW;AAC3C,OAAO,MAAMC,iBAAiB,GAAG,WAAW;AAC5C,OAAO,MAAMC,kBAAkB,GAAG,WAAW;;AAE7C;AACA;AACA;;AAaA,MAAMC,UAAU,GAAGP,GAAG,iFAGrB;;AAED;AACA;AACA;AACA;AACA,MAAMQ,cAAc,GAAGR,GAAG,qHAUzB;AAED,MAAMS,UAAU,GAAGV,MAAM,CAACW,GAAG,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,waAIlBZ,UAAU,EACFC,WAAW,EAO1BM,cAAc,EAGZD,UAAU,EAKVA,UAAU,EAIZO,IAAA;EAAA,IAAGC,WAAW,GAAAD,IAAA,CAAXC,WAAW;EAAA,OACdA,WAAW,IACXf,GAAG,sCACCO,UAAU,CAIb;AAAA,GAEDS,KAAA;EAAA,IAAGC,cAAc,GAAAD,KAAA,CAAdC,cAAc;EAAA,OACjBA,cAAc,IACdjB,GAAG,2GAQeiB,cAAc,CAG/B;AAAA,GAEDC,KAAA;EAAA,IAAGC,SAAS,GAAAD,KAAA,CAATC,SAAS;EAAA,OACZA,SAAS,IACTnB,GAAG,0FAGF;AAAA,GAEDoB,KAAA;EAAA,IAAGC,SAAS,GAAAD,KAAA,CAATC,SAAS;EAAA,OACZA,SAAS,IACTrB,GAAG,sCAGF;AAAA,GAKDsB,KAAA;EAAA,IAAGC,QAAQ,GAAAD,KAAA,CAARC,QAAQ;EAAA,OACXA,QAAQ,IACRvB,GAAG,sDAIF;AAAA,GAKDwB,KAAA;EAAA,IAAGC,aAAa,GAAAD,KAAA,CAAbC,aAAa;EAAA,OAChBA,aAAa,IACbzB,GAAG,0KAaF;AAAA,GAID0B,KAAA;EAAA,IAAGC,cAAc,GAAAD,KAAA,CAAdC,cAAc;EAAA,OACjBA,cAAc,IACd3B,GAAG,8DAGF;AAAA,GAGD4B,KAAA;EAAA,IAAGC,QAAQ,GAAAD,KAAA,CAARC,QAAQ;EAAA,OACXA,QAAQ,IACR7B,GAAG,uIAMF;AAAA,EACJ;;AAED;AACA;AACA;;AAEA,MAAM8B,kBAAkB,GAAG/B,MAAM,CAACgC,IAAI,CAAApB,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,mJAarC;AAED,OAAO,MAAMmB,iBAAiB,GAAGA,CAAA,kBAC/BpC,KAAA,CAAAqC,aAAA;EACEC,KAAK,EAAC,IAAI;EACVC,MAAM,EAAC,IAAI;EACXC,OAAO,EAAC,WAAW;EACnBC,IAAI,EAAC,MAAM;EACX,eAAY;AAAM,gBAElBzC,KAAA,CAAAqC,aAAA;EACEK,CAAC,EAAC,yBAAyB;EAC3BC,MAAM,EAAC,cAAc;EACrBC,WAAW,EAAC,KAAK;EACjBC,aAAa,EAAC;AAAO,CACtB,CACE,CACN;AAqBD;AACA;AACA;AACA,OAAO,MAAMC,WAAW,gBAAG9C,KAAK,CAAC+C,UAAU,CACzC,CAAAC,KAAA,EAeEC,GAAG,KACc;EAAA,IAdfC,QAAQ,GAAAF,KAAA,CAARE,QAAQ;IACRC,QAAQ,GAAAH,KAAA,CAARG,QAAQ;IACRC,OAAO,GAAAJ,KAAA,CAAPI,OAAO;IACPC,YAAY,GAAAL,KAAA,CAAZK,YAAY;IACZC,aAAa,GAAAN,KAAA,CAAbM,aAAa;IACbC,OAAO,GAAAP,KAAA,CAAPO,OAAO;IACPC,UAAU,GAAAR,KAAA,CAAVQ,UAAU;IACVC,SAAS,GAAAT,KAAA,CAATS,SAAS;IACTC,aAAa,GAAAV,KAAA,CAAbU,aAAa;IACbC,aAAa,GAAAX,KAAA,CAAbW,aAAa;IACbC,QAAQ,GAAAZ,KAAA,CAARY,QAAQ;IACLC,IAAI,GAAAC,6BAAA,CAAAd,KAAA,EAAAe,SAAA;EAIT,MAAMC,UAAU,GAAG9D,MAAM,CAAkC,IAAI,CAAC;EAEhE,MAAM+D,iBAAiB,GAAGhE,WAAW,CAAEiE,CAAqB,IAAK;IAC/DF,UAAU,CAACG,OAAO,GAAG;MAAEC,CAAC,EAAEF,CAAC,CAACG,OAAO;MAAEC,CAAC,EAAEJ,CAAC,CAACK;IAAQ,CAAC;IAClDL,CAAC,CAACM,MAAM,CAAiBC,iBAAiB,CAACP,CAAC,CAACQ,SAAS,CAAC;IACxDR,CAAC,CAACS,cAAc,CAAC,CAAC;EACpB,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMC,iBAAiB,GAAG3E,WAAW,CAClCiE,CAAqB,IAAK;IACzB,IAAI,CAACF,UAAU,CAACG,OAAO,IAAI,CAACR,aAAa,EAAE;IAC3CA,aAAa,CACXO,CAAC,CAACG,OAAO,GAAGL,UAAU,CAACG,OAAO,CAACC,CAAC,EAChCF,CAAC,CAACK,OAAO,GAAGP,UAAU,CAACG,OAAO,CAACG,CACjC,CAAC;IACDN,UAAU,CAACG,OAAO,GAAG;MAAEC,CAAC,EAAEF,CAAC,CAACG,OAAO;MAAEC,CAAC,EAAEJ,CAAC,CAACK;IAAQ,CAAC;EACrD,CAAC,EACD,CAACZ,aAAa,CAChB,CAAC;EAED,MAAMkB,eAAe,GAAG5E,WAAW,CAAC,MAAM;IACxC+D,UAAU,CAACG,OAAO,GAAG,IAAI;EAC3B,CAAC,EAAE,EAAE,CAAC;EAEN,oBACEnE,KAAA,CAAAqC,aAAA,CAACxB,UAAU,EAAAiE,QAAA;IACT7B,GAAG,EAAEA,GAAI;IACT1B,SAAS,EAAE2B,QAAS;IACpBzB,SAAS,EAAE0B,QAAS;IACpBxB,QAAQ,EAAEyB,OAAQ;IAClBvB,aAAa,EAAEwB,YAAa;IAC5BtB,cAAc,EAAEuB,aAAc;IAC9BrB,QAAQ,EAAEsB,OAAQ;IAClBpC,WAAW,EAAEqC,UAAW;IACxBnC,cAAc,EAAEqC;EAAc,GAC1BG,IAAI,GAEPD,QAAQ,EACRH,SAAS,gBACRzD,KAAA,CAAAqC,aAAA,CAACH,kBAAkB;IACjB6C,SAAS,EAAC,YAAY;IACtBC,aAAa,EAAEf,iBAAkB;IACjCgB,aAAa,EAAEL,iBAAkB;IACjCM,WAAW,EAAEL;EAAgB,gBAE7B7E,KAAA,CAAAqC,aAAA,CAACD,iBAAiB,MAAE,CACF,CAAC,GACnB,IACM,CAAC;AAEjB,CACF,CAAC;AAEDU,WAAW,CAAC9B,WAAW,GAAG,aAAa","ignoreList":[]}

package/dist/esm/presentation/stackedCard/storyScaffold.d.ts

@@ -0,0 +1,28 @@
+import { ReactElement, ReactNode } from "react";
+/**
+ * Shared spec-sheet scaffolding for the StackedCard concept stories (Sheet,
+ * Section, Labeled, Grid, Column) plus the DS token candidates the subsystem
+ * needs. Presentation-only; keeps the three StackedCard stories laying out the
+ * same way instead of each re-declaring the sheet chrome.
+ *
+ * The `--sc-*` variables are declared here as design-system PROPOSALS (a
+ * selection ring + a dark scrim family). The shell and primitives reference
+ * these only, so no rgba/hex is baked into a reusable style.
+ */
+export declare const StyledSheet: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledGrid: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledColumn: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const Labeled: ({ label, children, }: {
+    label: ReactNode;
+    children: ReactNode;
+}) => ReactElement;
+export declare const Section: ({ caption, note, children, }: {
+    caption: string;
+    note?: ReactNode;
+    children: ReactNode;
+}) => ReactElement;
+export declare const SheetHeading: ({ title, children, }: {
+    title: string;
+    children: ReactNode;
+}) => ReactElement;
+//# sourceMappingURL=storyScaffold.d.ts.map

package/dist/esm/presentation/stackedCard/storyScaffold.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"storyScaffold.d.ts","sourceRoot":"","sources":["../../../../src/presentation/stackedCard/storyScaffold.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAMvD;;;;;;;;;GASG;AAEH,eAAO,MAAM,WAAW,oEAoBvB,CAAC;AAmBF,eAAO,MAAM,UAAU,oEAKtB,CAAC;AAEF,eAAO,MAAM,YAAY,oEAIxB,CAAC;AAcF,eAAO,MAAM,OAAO,GAAI,sBAGrB;IACD,KAAK,EAAE,SAAS,CAAC;IACjB,QAAQ,EAAE,SAAS,CAAC;CACrB,KAAG,YAOH,CAAC;AAEF,eAAO,MAAM,OAAO,GAAI,8BAIrB;IACD,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,QAAQ,EAAE,SAAS,CAAC;CACrB,KAAG,YAYH,CAAC;AAEF,eAAO,MAAM,YAAY,GAAI,sBAG1B;IACD,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,SAAS,CAAC;CACrB,KAAG,YAOH,CAAC"}

package/dist/esm/presentation/stackedCard/storyScaffold.js

@@ -0,0 +1,66 @@
+import React from "react";
+import styled from "styled-components";
+import { Caption1, Title2 } from "../../components/Typography";
+
+/**
+ * Shared spec-sheet scaffolding for the StackedCard concept stories (Sheet,
+ * Section, Labeled, Grid, Column) plus the DS token candidates the subsystem
+ * needs. Presentation-only; keeps the three StackedCard stories laying out the
+ * same way instead of each re-declaring the sheet chrome.
+ *
+ * The `--sc-*` variables are declared here as design-system PROPOSALS (a
+ * selection ring + a dark scrim family). The shell and primitives reference
+ * these only, so no rgba/hex is baked into a reusable style.
+ */
+
+export const StyledSheet = styled.div.withConfig({
+  displayName: "storyScaffold__StyledSheet",
+  componentId: "sc-7oxew-0"
+})(["--sc-selection-ring:var(--color-primary-500,#2f6bff);--sc-scrim:rgba(0,0,0,0.55);--sc-scrim-strong:rgba(0,0,0,0.72);--sc-scrim-fg:#ffffff;--sc-completed-tint:rgba(72,201,176,0.16);min-height:100vh;padding:32px 40px 64px;background:var(--page-paper-dimmed,var(--color-theme-200));.sheet-title{margin-bottom:8px;}.sheet-lede{display:block;margin-bottom:24px;max-width:760px;}"]);
+const StyledSection = styled.section.withConfig({
+  displayName: "storyScaffold__StyledSection",
+  componentId: "sc-7oxew-1"
+})(["margin-top:40px;> .section-caption{display:block;margin-bottom:4px;text-transform:uppercase;letter-spacing:0.06em;}> .section-note{display:block;margin-bottom:16px;max-width:720px;}"]);
+export const StyledGrid = styled.div.withConfig({
+  displayName: "storyScaffold__StyledGrid",
+  componentId: "sc-7oxew-2"
+})(["display:flex;flex-wrap:wrap;gap:24px;align-items:flex-start;"]);
+export const StyledColumn = styled.div.withConfig({
+  displayName: "storyScaffold__StyledColumn",
+  componentId: "sc-7oxew-3"
+})(["display:flex;flex-direction:column;gap:12px;"]);
+const StyledLabeled = styled.figure.withConfig({
+  displayName: "storyScaffold__StyledLabeled",
+  componentId: "sc-7oxew-4"
+})(["margin:0;display:flex;flex-direction:column;gap:8px;> figcaption{order:-1;max-width:320px;}"]);
+export const Labeled = _ref => {
+  let label = _ref.label,
+    children = _ref.children;
+  return /*#__PURE__*/React.createElement(StyledLabeled, null, /*#__PURE__*/React.createElement("figcaption", null, /*#__PURE__*/React.createElement(Caption1, {
+    color: "secondary"
+  }, label)), children);
+};
+export const Section = _ref2 => {
+  let caption = _ref2.caption,
+    note = _ref2.note,
+    children = _ref2.children;
+  return /*#__PURE__*/React.createElement(StyledSection, null, /*#__PURE__*/React.createElement(Caption1, {
+    weight: "bold",
+    color: "tertiary",
+    className: "section-caption"
+  }, caption), note ? /*#__PURE__*/React.createElement(Caption1, {
+    color: "tertiary",
+    className: "section-note"
+  }, note) : null, /*#__PURE__*/React.createElement(StyledGrid, null, children));
+};
+export const SheetHeading = _ref3 => {
+  let title = _ref3.title,
+    children = _ref3.children;
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Title2, {
+    className: "sheet-title"
+  }, title), /*#__PURE__*/React.createElement(Caption1, {
+    color: "tertiary",
+    className: "sheet-lede"
+  }, children));
+};
+//# sourceMappingURL=storyScaffold.js.map

package/dist/esm/presentation/stackedCard/storyScaffold.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"storyScaffold.js","names":["React","styled","Caption1","Title2","StyledSheet","div","withConfig","displayName","componentId","StyledSection","section","StyledGrid","StyledColumn","StyledLabeled","figure","Labeled","_ref","label","children","createElement","color","Section","_ref2","caption","note","weight","className","SheetHeading","_ref3","title","Fragment"],"sources":["../../../../src/presentation/stackedCard/storyScaffold.tsx"],"sourcesContent":["import React, { ReactElement, ReactNode } from \"react\";\n\nimport styled from \"styled-components\";\n\nimport { Caption1, Title2 } from \"../../components/Typography\";\n\n/**\n * Shared spec-sheet scaffolding for the StackedCard concept stories (Sheet,\n * Section, Labeled, Grid, Column) plus the DS token candidates the subsystem\n * needs. Presentation-only; keeps the three StackedCard stories laying out the\n * same way instead of each re-declaring the sheet chrome.\n *\n * The `--sc-*` variables are declared here as design-system PROPOSALS (a\n * selection ring + a dark scrim family). The shell and primitives reference\n * these only, so no rgba/hex is baked into a reusable style.\n */\n\nexport const StyledSheet = styled.div`\n  --sc-selection-ring: var(--color-primary-500, #2f6bff);\n  --sc-scrim: rgba(0, 0, 0, 0.55);\n  --sc-scrim-strong: rgba(0, 0, 0, 0.72);\n  --sc-scrim-fg: #ffffff;\n  --sc-completed-tint: rgba(72, 201, 176, 0.16);\n\n  min-height: 100vh;\n  padding: 32px 40px 64px;\n  background: var(--page-paper-dimmed, var(--color-theme-200));\n\n  .sheet-title {\n    margin-bottom: 8px;\n  }\n\n  .sheet-lede {\n    display: block;\n    margin-bottom: 24px;\n    max-width: 760px;\n  }\n`;\n\nconst StyledSection = styled.section`\n  margin-top: 40px;\n\n  > .section-caption {\n    display: block;\n    margin-bottom: 4px;\n    text-transform: uppercase;\n    letter-spacing: 0.06em;\n  }\n\n  > .section-note {\n    display: block;\n    margin-bottom: 16px;\n    max-width: 720px;\n  }\n`;\n\nexport const StyledGrid = styled.div`\n  display: flex;\n  flex-wrap: wrap;\n  gap: 24px;\n  align-items: flex-start;\n`;\n\nexport const StyledColumn = styled.div`\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n`;\n\nconst StyledLabeled = styled.figure`\n  margin: 0;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n\n  > figcaption {\n    order: -1;\n    max-width: 320px;\n  }\n`;\n\nexport const Labeled = ({\n  label,\n  children,\n}: {\n  label: ReactNode;\n  children: ReactNode;\n}): ReactElement => (\n  <StyledLabeled>\n    <figcaption>\n      <Caption1 color=\"secondary\">{label}</Caption1>\n    </figcaption>\n    {children}\n  </StyledLabeled>\n);\n\nexport const Section = ({\n  caption,\n  note,\n  children,\n}: {\n  caption: string;\n  note?: ReactNode;\n  children: ReactNode;\n}): ReactElement => (\n  <StyledSection>\n    <Caption1 weight=\"bold\" color=\"tertiary\" className=\"section-caption\">\n      {caption}\n    </Caption1>\n    {note ? (\n      <Caption1 color=\"tertiary\" className=\"section-note\">\n        {note}\n      </Caption1>\n    ) : null}\n    <StyledGrid>{children}</StyledGrid>\n  </StyledSection>\n);\n\nexport const SheetHeading = ({\n  title,\n  children,\n}: {\n  title: string;\n  children: ReactNode;\n}): ReactElement => (\n  <>\n    <Title2 className=\"sheet-title\">{title}</Title2>\n    <Caption1 color=\"tertiary\" className=\"sheet-lede\">\n      {children}\n    </Caption1>\n  </>\n);\n"],"mappings":"AAAA,OAAOA,KAAK,MAAmC,OAAO;AAEtD,OAAOC,MAAM,MAAM,mBAAmB;AAEtC,SAASC,QAAQ,EAAEC,MAAM,QAAQ,6BAA6B;;AAE9D;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,OAAO,MAAMC,WAAW,GAAGH,MAAM,CAACI,GAAG,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,6XAoBpC;AAED,MAAMC,aAAa,GAAGR,MAAM,CAACS,OAAO,CAAAJ,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,6LAenC;AAED,OAAO,MAAMG,UAAU,GAAGV,MAAM,CAACI,GAAG,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,oEAKnC;AAED,OAAO,MAAMI,YAAY,GAAGX,MAAM,CAACI,GAAG,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,oDAIrC;AAED,MAAMK,aAAa,GAAGZ,MAAM,CAACa,MAAM,CAAAR,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,mGAUlC;AAED,OAAO,MAAMO,OAAO,GAAGC,IAAA;EAAA,IACrBC,KAAK,GAAAD,IAAA,CAALC,KAAK;IACLC,QAAQ,GAAAF,IAAA,CAARE,QAAQ;EAAA,oBAKRlB,KAAA,CAAAmB,aAAA,CAACN,aAAa,qBACZb,KAAA,CAAAmB,aAAA,kCACEnB,KAAA,CAAAmB,aAAA,CAACjB,QAAQ;IAACkB,KAAK,EAAC;EAAW,GAAEH,KAAgB,CACnC,CAAC,EACZC,QACY,CAAC;AAAA,CACjB;AAED,OAAO,MAAMG,OAAO,GAAGC,KAAA;EAAA,IACrBC,OAAO,GAAAD,KAAA,CAAPC,OAAO;IACPC,IAAI,GAAAF,KAAA,CAAJE,IAAI;IACJN,QAAQ,GAAAI,KAAA,CAARJ,QAAQ;EAAA,oBAMRlB,KAAA,CAAAmB,aAAA,CAACV,aAAa,qBACZT,KAAA,CAAAmB,aAAA,CAACjB,QAAQ;IAACuB,MAAM,EAAC,MAAM;IAACL,KAAK,EAAC,UAAU;IAACM,SAAS,EAAC;EAAiB,GACjEH,OACO,CAAC,EACVC,IAAI,gBACHxB,KAAA,CAAAmB,aAAA,CAACjB,QAAQ;IAACkB,KAAK,EAAC,UAAU;IAACM,SAAS,EAAC;EAAc,GAChDF,IACO,CAAC,GACT,IAAI,eACRxB,KAAA,CAAAmB,aAAA,CAACR,UAAU,QAAEO,QAAqB,CACrB,CAAC;AAAA,CACjB;AAED,OAAO,MAAMS,YAAY,GAAGC,KAAA;EAAA,IAC1BC,KAAK,GAAAD,KAAA,CAALC,KAAK;IACLX,QAAQ,GAAAU,KAAA,CAARV,QAAQ;EAAA,oBAKRlB,KAAA,CAAAmB,aAAA,CAAAnB,KAAA,CAAA8B,QAAA,qBACE9B,KAAA,CAAAmB,aAAA,CAAChB,MAAM;IAACuB,SAAS,EAAC;EAAa,GAAEG,KAAc,CAAC,eAChD7B,KAAA,CAAAmB,aAAA,CAACjB,QAAQ;IAACkB,KAAK,EAAC,UAAU;IAACM,SAAS,EAAC;EAAY,GAC9CR,QACO,CACV,CAAC;AAAA,CACJ","ignoreList":[]}

package/dist/esm/presentation/stackedCard/useInlineEdit.d.ts

@@ -0,0 +1,68 @@
+import { ChangeEvent, FocusEvent, KeyboardEvent } from "react";
+/**
+ * useInlineEdit — story-local click-to-edit state machine for StackedCard
+ * (task 4/8). Presentation-only; not exported from the design-system barrel.
+ *
+ * A card in preview/placeholder mode enters an EDITING state on click: a
+ * card-centered text field with confirm/cancel keyboard rules, an optional
+ * validator, and a single-line ↔ multi-line mode switch. The hook owns only the
+ * editing lifecycle (mode, working value, error, keyboard + outside-click); the
+ * card chrome and the async handoff after commit (e.g. the link unfurl ladder
+ * from task 3/8) live in the story that consumes it.
+ *
+ * ── The decided rules (AC task #454744) ──
+ *  Single-line   Enter confirms · click-outside confirms · Esc cancels + reverts
+ *  Multi-line    Enter = newline · Cmd/Ctrl+Enter saves · click-outside saves ·
+ *                Esc cancels + reverts
+ *  Validator     validate(value) => true | errorMessage, run before every accept
+ *                pass  → commit + exit editing
+ *                fail via a key   → STAY editing, surface the message (retry)
+ *                fail via outside → REVERT (acts as cancel) — user never trapped
+ *
+ * Keyboard is handled on the field's own keydown (never a global listener) and
+ * every keydown stops propagation, so the card focus model (task 2/8) can't
+ * swallow the Enter/Esc that belong to the editor.
+ */
+export type InlineEditValidator = (value: string) => true | string;
+export interface UseInlineEditConfig {
+    /** Seed value for the first edit; also the revert target until first commit. */
+    initialValue?: string;
+    /** Multi-line mode: Enter inserts a newline, Cmd/Ctrl+Enter saves. */
+    multiline?: boolean;
+    /** Optional validator, run before every accept. `true` passes; a string fails. */
+    validate?: InlineEditValidator;
+    /** Called with the committed value when an accept passes validation. */
+    onCommit?: (value: string) => void;
+}
+/** Props to spread onto the `<input>` or `<textarea>` while editing. */
+export interface InlineEditBind {
+    /** Callback ref — assignable to both an input and a textarea. */
+    ref: (el: HTMLInputElement | HTMLTextAreaElement | null) => void;
+    value: string;
+    onChange: (e: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
+    onKeyDown: (e: KeyboardEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
+    onBlur: (e: FocusEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
+    "aria-invalid": boolean;
+}
+export interface InlineEditController {
+    /** Whether the field is currently shown. */
+    editing: boolean;
+    /** The working value (the draft being typed). */
+    value: string;
+    /** The last committed value — what a revert restores. */
+    committed: string;
+    /** The current validation message, or null when valid / untouched. */
+    error: string | null;
+    /** Whether this editor is in multi-line mode. */
+    multiline: boolean;
+    /** Enter editing, loading the last committed value. */
+    begin: () => void;
+    /** Cancel + revert to the committed value (the Esc / invalid-outside path). */
+    cancel: () => void;
+    /** Force a committed value without going through the field (repeat demos). */
+    reset: (next?: string) => void;
+    /** Spread onto the field element while `editing`. */
+    bind: InlineEditBind;
+}
+export declare const useInlineEdit: ({ initialValue, multiline, validate, onCommit, }?: UseInlineEditConfig) => InlineEditController;
+//# sourceMappingURL=useInlineEdit.d.ts.map

package/dist/esm/presentation/stackedCard/useInlineEdit.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useInlineEdit.d.ts","sourceRoot":"","sources":["../../../../src/presentation/stackedCard/useInlineEdit.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,WAAW,EACX,UAAU,EACV,aAAa,EAKd,MAAM,OAAO,CAAC;AAEf;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AAEH,MAAM,MAAM,mBAAmB,GAAG,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,GAAG,MAAM,CAAC;AAEnE,MAAM,WAAW,mBAAmB;IAClC,gFAAgF;IAChF,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,sEAAsE;IACtE,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,kFAAkF;IAClF,QAAQ,CAAC,EAAE,mBAAmB,CAAC;IAC/B,wEAAwE;IACxE,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACpC;AAED,wEAAwE;AACxE,MAAM,WAAW,cAAc;IAC7B,iEAAiE;IACjE,GAAG,EAAE,CAAC,EAAE,EAAE,gBAAgB,GAAG,mBAAmB,GAAG,IAAI,KAAK,IAAI,CAAC;IACjE,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,CAAC,EAAE,WAAW,CAAC,gBAAgB,GAAG,mBAAmB,CAAC,KAAK,IAAI,CAAC;IAC3E,SAAS,EAAE,CAAC,CAAC,EAAE,aAAa,CAAC,gBAAgB,GAAG,mBAAmB,CAAC,KAAK,IAAI,CAAC;IAC9E,MAAM,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,gBAAgB,GAAG,mBAAmB,CAAC,KAAK,IAAI,CAAC;IACxE,cAAc,EAAE,OAAO,CAAC;CACzB;AAED,MAAM,WAAW,oBAAoB;IACnC,4CAA4C;IAC5C,OAAO,EAAE,OAAO,CAAC;IACjB,iDAAiD;IACjD,KAAK,EAAE,MAAM,CAAC;IACd,yDAAyD;IACzD,SAAS,EAAE,MAAM,CAAC;IAClB,sEAAsE;IACtE,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,iDAAiD;IACjD,SAAS,EAAE,OAAO,CAAC;IACnB,uDAAuD;IACvD,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,+EAA+E;IAC/E,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,8EAA8E;IAC9E,KAAK,EAAE,CAAC,IAAI,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/B,qDAAqD;IACrD,IAAI,EAAE,cAAc,CAAC;CACtB;AAED,eAAO,MAAM,aAAa,GAAI,mDAK3B,mBAAwB,KAAG,oBAgL7B,CAAC"}

package/dist/esm/presentation/stackedCard/useInlineEdit.js

@@ -0,0 +1,192 @@
+import { useCallback, useEffect, useRef, useState } from "react";
+
+/**
+ * useInlineEdit — story-local click-to-edit state machine for StackedCard
+ * (task 4/8). Presentation-only; not exported from the design-system barrel.
+ *
+ * A card in preview/placeholder mode enters an EDITING state on click: a
+ * card-centered text field with confirm/cancel keyboard rules, an optional
+ * validator, and a single-line ↔ multi-line mode switch. The hook owns only the
+ * editing lifecycle (mode, working value, error, keyboard + outside-click); the
+ * card chrome and the async handoff after commit (e.g. the link unfurl ladder
+ * from task 3/8) live in the story that consumes it.
+ *
+ * ── The decided rules (AC task #454744) ──
+ *  Single-line   Enter confirms · click-outside confirms · Esc cancels + reverts
+ *  Multi-line    Enter = newline · Cmd/Ctrl+Enter saves · click-outside saves ·
+ *                Esc cancels + reverts
+ *  Validator     validate(value) => true | errorMessage, run before every accept
+ *                pass  → commit + exit editing
+ *                fail via a key   → STAY editing, surface the message (retry)
+ *                fail via outside → REVERT (acts as cancel) — user never trapped
+ *
+ * Keyboard is handled on the field's own keydown (never a global listener) and
+ * every keydown stops propagation, so the card focus model (task 2/8) can't
+ * swallow the Enter/Esc that belong to the editor.
+ */
+
+/** Props to spread onto the `<input>` or `<textarea>` while editing. */
+
+export const useInlineEdit = function (_temp) {
+  let _ref = _temp === void 0 ? {} : _temp,
+    _ref$initialValue = _ref.initialValue,
+    initialValue = _ref$initialValue === void 0 ? "" : _ref$initialValue,
+    _ref$multiline = _ref.multiline,
+    multiline = _ref$multiline === void 0 ? false : _ref$multiline,
+    validate = _ref.validate,
+    onCommit = _ref.onCommit;
+  const _useState = useState(false),
+    editing = _useState[0],
+    setEditingState = _useState[1];
+  const _useState2 = useState(initialValue),
+    value = _useState2[0],
+    setValueState = _useState2[1];
+  const _useState3 = useState(initialValue),
+    committed = _useState3[0],
+    setCommittedState = _useState3[1];
+  const _useState4 = useState(null),
+    error = _useState4[0],
+    setError = _useState4[1];
+
+  // Refs mirror the state that the (stable) event handlers read, so the handlers
+  // never go stale and never need to be re-created as the value changes.
+  const elRef = useRef(null);
+  const valueRef = useRef(value);
+  const committedRef = useRef(committed);
+  const editingRef = useRef(editing);
+  // Set right before a programmatic exit so the blur that follows the field
+  // unmounting is ignored (it isn't a real click-outside).
+  const skipBlurRef = useRef(false);
+  const validateRef = useRef(validate);
+  const onCommitRef = useRef(onCommit);
+  useEffect(() => {
+    validateRef.current = validate;
+    onCommitRef.current = onCommit;
+  });
+  const setValue = useCallback(v => {
+    valueRef.current = v;
+    setValueState(v);
+  }, []);
+  const setCommitted = useCallback(v => {
+    committedRef.current = v;
+    setCommittedState(v);
+  }, []);
+  const setEditing = useCallback(v => {
+    editingRef.current = v;
+    setEditingState(v);
+  }, []);
+  const begin = useCallback(() => {
+    skipBlurRef.current = false;
+    setValue(committedRef.current);
+    setError(null);
+    setEditing(true);
+  }, [setValue, setEditing]);
+  const cancel = useCallback(() => {
+    skipBlurRef.current = true;
+    setValue(committedRef.current);
+    setError(null);
+    setEditing(false);
+  }, [setValue, setEditing]);
+  const reset = useCallback(function (next) {
+    if (next === void 0) {
+      next = initialValue;
+    }
+    skipBlurRef.current = true;
+    setCommitted(next);
+    setValue(next);
+    setError(null);
+    setEditing(false);
+  }, [initialValue, setCommitted, setValue, setEditing]);
+  const commit = useCallback(v => {
+    skipBlurRef.current = true;
+    setCommitted(v);
+    setValue(v);
+    setError(null);
+    setEditing(false);
+    onCommitRef.current == null || onCommitRef.current(v);
+  }, [setCommitted, setValue, setEditing]);
+
+  // Run the validator (if any) and accept, or handle the failure per source:
+  // a key retry keeps the user in the field with a message; an outside click
+  // reverts so the user is never trapped in an invalid editor.
+  const attempt = useCallback(source => {
+    const v = valueRef.current;
+    const result = validateRef.current ? validateRef.current(v) : true;
+    if (result === true) {
+      commit(v);
+      return true;
+    }
+    if (source === "outside") {
+      cancel();
+      return false;
+    }
+    setError(result);
+    return false;
+  }, [commit, cancel]);
+  const onChange = useCallback(e => {
+    setValue(e.target.value);
+    // Clear a stale error as the user edits; the next accept re-validates.
+    setError(prev => prev == null ? prev : null);
+  }, [setValue]);
+  const onKeyDown = useCallback(e => {
+    // Keep Enter/Esc from reaching the card's own keyboard model (task 2/8).
+    e.stopPropagation();
+    if (e.key === "Escape") {
+      e.preventDefault();
+      cancel();
+      return;
+    }
+    if (e.key === "Enter") {
+      const withMeta = e.metaKey || e.ctrlKey;
+      // Multi-line: a bare Enter is a newline; only Cmd/Ctrl+Enter saves.
+      if (multiline && !withMeta) return;
+      e.preventDefault();
+      attempt("key");
+    }
+  }, [attempt, cancel, multiline]);
+  const onBlur = useCallback(() => {
+    if (skipBlurRef.current) {
+      skipBlurRef.current = false;
+      return;
+    }
+    if (!editingRef.current) return;
+    attempt("outside");
+  }, [attempt]);
+  const setRef = useCallback(el => {
+    elRef.current = el;
+  }, []);
+
+  // On entering editing, focus the field and drop the caret at the end so the
+  // cursor is visible and existing text is ready to extend.
+  useEffect(() => {
+    if (!editing) return;
+    const el = elRef.current;
+    if (!el) return;
+    el.focus();
+    const len = el.value.length;
+    try {
+      el.setSelectionRange(len, len);
+    } catch (_unused) {
+      /* some input types disallow setSelectionRange — harmless here. */
+    }
+  }, [editing]);
+  return {
+    editing,
+    value,
+    committed,
+    error,
+    multiline,
+    begin,
+    cancel,
+    reset,
+    bind: {
+      ref: setRef,
+      value,
+      onChange,
+      onKeyDown,
+      onBlur,
+      "aria-invalid": error != null
+    }
+  };
+};
+//# sourceMappingURL=useInlineEdit.js.map

package/dist/esm/presentation/stackedCard/useInlineEdit.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useInlineEdit.js","names":["useCallback","useEffect","useRef","useState","useInlineEdit","_temp","_ref","_ref$initialValue","initialValue","_ref$multiline","multiline","validate","onCommit","_useState","editing","setEditingState","_useState2","value","setValueState","_useState3","committed","setCommittedState","_useState4","error","setError","elRef","valueRef","committedRef","editingRef","skipBlurRef","validateRef","onCommitRef","current","setValue","v","setCommitted","setEditing","begin","cancel","reset","next","commit","attempt","source","result","onChange","e","target","prev","onKeyDown","stopPropagation","key","preventDefault","withMeta","metaKey","ctrlKey","onBlur","setRef","el","focus","len","length","setSelectionRange","_unused","bind","ref"],"sources":["../../../../src/presentation/stackedCard/useInlineEdit.ts"],"sourcesContent":["import {\n  ChangeEvent,\n  FocusEvent,\n  KeyboardEvent,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n} from \"react\";\n\n/**\n * useInlineEdit — story-local click-to-edit state machine for StackedCard\n * (task 4/8). Presentation-only; not exported from the design-system barrel.\n *\n * A card in preview/placeholder mode enters an EDITING state on click: a\n * card-centered text field with confirm/cancel keyboard rules, an optional\n * validator, and a single-line ↔ multi-line mode switch. The hook owns only the\n * editing lifecycle (mode, working value, error, keyboard + outside-click); the\n * card chrome and the async handoff after commit (e.g. the link unfurl ladder\n * from task 3/8) live in the story that consumes it.\n *\n * ── The decided rules (AC task #454744) ──\n *  Single-line   Enter confirms · click-outside confirms · Esc cancels + reverts\n *  Multi-line    Enter = newline · Cmd/Ctrl+Enter saves · click-outside saves ·\n *                Esc cancels + reverts\n *  Validator     validate(value) => true | errorMessage, run before every accept\n *                pass  → commit + exit editing\n *                fail via a key   → STAY editing, surface the message (retry)\n *                fail via outside → REVERT (acts as cancel) — user never trapped\n *\n * Keyboard is handled on the field's own keydown (never a global listener) and\n * every keydown stops propagation, so the card focus model (task 2/8) can't\n * swallow the Enter/Esc that belong to the editor.\n */\n\nexport type InlineEditValidator = (value: string) => true | string;\n\nexport interface UseInlineEditConfig {\n  /** Seed value for the first edit; also the revert target until first commit. */\n  initialValue?: string;\n  /** Multi-line mode: Enter inserts a newline, Cmd/Ctrl+Enter saves. */\n  multiline?: boolean;\n  /** Optional validator, run before every accept. `true` passes; a string fails. */\n  validate?: InlineEditValidator;\n  /** Called with the committed value when an accept passes validation. */\n  onCommit?: (value: string) => void;\n}\n\n/** Props to spread onto the `<input>` or `<textarea>` while editing. */\nexport interface InlineEditBind {\n  /** Callback ref — assignable to both an input and a textarea. */\n  ref: (el: HTMLInputElement | HTMLTextAreaElement | null) => void;\n  value: string;\n  onChange: (e: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => void;\n  onKeyDown: (e: KeyboardEvent<HTMLInputElement | HTMLTextAreaElement>) => void;\n  onBlur: (e: FocusEvent<HTMLInputElement | HTMLTextAreaElement>) => void;\n  \"aria-invalid\": boolean;\n}\n\nexport interface InlineEditController {\n  /** Whether the field is currently shown. */\n  editing: boolean;\n  /** The working value (the draft being typed). */\n  value: string;\n  /** The last committed value — what a revert restores. */\n  committed: string;\n  /** The current validation message, or null when valid / untouched. */\n  error: string | null;\n  /** Whether this editor is in multi-line mode. */\n  multiline: boolean;\n  /** Enter editing, loading the last committed value. */\n  begin: () => void;\n  /** Cancel + revert to the committed value (the Esc / invalid-outside path). */\n  cancel: () => void;\n  /** Force a committed value without going through the field (repeat demos). */\n  reset: (next?: string) => void;\n  /** Spread onto the field element while `editing`. */\n  bind: InlineEditBind;\n}\n\nexport const useInlineEdit = ({\n  initialValue = \"\",\n  multiline = false,\n  validate,\n  onCommit,\n}: UseInlineEditConfig = {}): InlineEditController => {\n  const [editing, setEditingState] = useState(false);\n  const [value, setValueState] = useState(initialValue);\n  const [committed, setCommittedState] = useState(initialValue);\n  const [error, setError] = useState<string | null>(null);\n\n  // Refs mirror the state that the (stable) event handlers read, so the handlers\n  // never go stale and never need to be re-created as the value changes.\n  const elRef = useRef<HTMLInputElement | HTMLTextAreaElement | null>(null);\n  const valueRef = useRef(value);\n  const committedRef = useRef(committed);\n  const editingRef = useRef(editing);\n  // Set right before a programmatic exit so the blur that follows the field\n  // unmounting is ignored (it isn't a real click-outside).\n  const skipBlurRef = useRef(false);\n  const validateRef = useRef(validate);\n  const onCommitRef = useRef(onCommit);\n\n  useEffect(() => {\n    validateRef.current = validate;\n    onCommitRef.current = onCommit;\n  });\n\n  const setValue = useCallback((v: string) => {\n    valueRef.current = v;\n    setValueState(v);\n  }, []);\n\n  const setCommitted = useCallback((v: string) => {\n    committedRef.current = v;\n    setCommittedState(v);\n  }, []);\n\n  const setEditing = useCallback((v: boolean) => {\n    editingRef.current = v;\n    setEditingState(v);\n  }, []);\n\n  const begin = useCallback(() => {\n    skipBlurRef.current = false;\n    setValue(committedRef.current);\n    setError(null);\n    setEditing(true);\n  }, [setValue, setEditing]);\n\n  const cancel = useCallback(() => {\n    skipBlurRef.current = true;\n    setValue(committedRef.current);\n    setError(null);\n    setEditing(false);\n  }, [setValue, setEditing]);\n\n  const reset = useCallback(\n    (next: string = initialValue) => {\n      skipBlurRef.current = true;\n      setCommitted(next);\n      setValue(next);\n      setError(null);\n      setEditing(false);\n    },\n    [initialValue, setCommitted, setValue, setEditing]\n  );\n\n  const commit = useCallback(\n    (v: string) => {\n      skipBlurRef.current = true;\n      setCommitted(v);\n      setValue(v);\n      setError(null);\n      setEditing(false);\n      onCommitRef.current?.(v);\n    },\n    [setCommitted, setValue, setEditing]\n  );\n\n  // Run the validator (if any) and accept, or handle the failure per source:\n  // a key retry keeps the user in the field with a message; an outside click\n  // reverts so the user is never trapped in an invalid editor.\n  const attempt = useCallback(\n    (source: \"key\" | \"outside\"): boolean => {\n      const v = valueRef.current;\n      const result = validateRef.current ? validateRef.current(v) : true;\n      if (result === true) {\n        commit(v);\n        return true;\n      }\n      if (source === \"outside\") {\n        cancel();\n        return false;\n      }\n      setError(result);\n      return false;\n    },\n    [commit, cancel]\n  );\n\n  const onChange = useCallback(\n    (e: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {\n      setValue(e.target.value);\n      // Clear a stale error as the user edits; the next accept re-validates.\n      setError((prev) => (prev == null ? prev : null));\n    },\n    [setValue]\n  );\n\n  const onKeyDown = useCallback(\n    (e: KeyboardEvent<HTMLInputElement | HTMLTextAreaElement>) => {\n      // Keep Enter/Esc from reaching the card's own keyboard model (task 2/8).\n      e.stopPropagation();\n\n      if (e.key === \"Escape\") {\n        e.preventDefault();\n        cancel();\n        return;\n      }\n\n      if (e.key === \"Enter\") {\n        const withMeta = e.metaKey || e.ctrlKey;\n        // Multi-line: a bare Enter is a newline; only Cmd/Ctrl+Enter saves.\n        if (multiline && !withMeta) return;\n        e.preventDefault();\n        attempt(\"key\");\n      }\n    },\n    [attempt, cancel, multiline]\n  );\n\n  const onBlur = useCallback(() => {\n    if (skipBlurRef.current) {\n      skipBlurRef.current = false;\n      return;\n    }\n    if (!editingRef.current) return;\n    attempt(\"outside\");\n  }, [attempt]);\n\n  const setRef = useCallback(\n    (el: HTMLInputElement | HTMLTextAreaElement | null) => {\n      elRef.current = el;\n    },\n    []\n  );\n\n  // On entering editing, focus the field and drop the caret at the end so the\n  // cursor is visible and existing text is ready to extend.\n  useEffect(() => {\n    if (!editing) return;\n    const el = elRef.current;\n    if (!el) return;\n    el.focus();\n    const len = el.value.length;\n    try {\n      el.setSelectionRange(len, len);\n    } catch {\n      /* some input types disallow setSelectionRange — harmless here. */\n    }\n  }, [editing]);\n\n  return {\n    editing,\n    value,\n    committed,\n    error,\n    multiline,\n    begin,\n    cancel,\n    reset,\n    bind: {\n      ref: setRef,\n      value,\n      onChange,\n      onKeyDown,\n      onBlur,\n      \"aria-invalid\": error != null,\n    },\n  };\n};\n"],"mappings":"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","ignoreList":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@activecollab/components",
-  "version": "2.0.363",
+  "version": "2.0.365",
   "description": "ActiveCollab Components",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",