@activecollab/components 2.0.369 → 2.0.371

package/dist/esm/presentation/stackedCard/content/LinkCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"LinkCard.js","names":["React","styled","StyledChip","StyledClamp","StyledColorCover","StyledFavicon","coverManagement","playControl","Placeholder","formatFetchedAt","ArrowRefreshIcon","InsertLinkIcon","WarningTriangleIcon","SkeletonLoader","Body2","Caption1","Typography","Cover","StackRow","COVER_RATIO","COVER_RATIO_HERO","StyledDomainRow","div","withConfig","displayName","componentId","StyledChips","StyledStaleStrip","StyledReunfurl","button","StyledErrorBody","StyledRetry","StyledFooterTitle","StyledDisplayToggle","DisplayToggle","_ref","display","onToggle","createElement","type","className","onClick","LinkCard","_ref2","_data$heroColor2","_data$faviconColor2","unfurl","_ref2$display","onToggleDisplay","status","tier","data","fetchedAt","retry","reunfurl","weight","color","$bg","url","as","variant","hasBasic","hasFull","toggle","undefined","_data$heroColor","_data$faviconColor","Fragment","aspectRatio","centerSlot","playable","topRightSlot","$color","heroColor","style","width","height","role","direction","background","faviconColor","borderRadius","domain","flex","title","description","StaleStrip","onReunfurl","marginTop","kind","duration","_ref3","LinkSkeleton","LinkPlaceholder","props","_extends","icon","label"],"sources":["../../../../../src/presentation/stackedCard/content/LinkCard.tsx"],"sourcesContent":["import React, { ReactElement } from \"react\";\n\nimport styled from \"styled-components\";\n\nimport {\n  StyledChip,\n  StyledClamp,\n  StyledColorCover,\n  StyledFavicon,\n  coverManagement,\n  playControl,\n  Placeholder,\n} from \"./shared\";\nimport { UnfurlController, formatFetchedAt } from \"./unfurl\";\nimport {\n  ArrowRefreshIcon,\n  InsertLinkIcon,\n  WarningTriangleIcon,\n} from \"../../../components/Icons\";\nimport { SkeletonLoader } from \"../../../components/Loaders\";\nimport { Body2, Caption1 } from \"../../../components/Typography\";\nimport { Typography } from \"../../../components/Typography/Typography\";\nimport { Cover, StackRow } from \"../primitives\";\nimport { COVER_RATIO, COVER_RATIO_HERO } from \"../shell\";\n\n/**\n * LinkCard — a link preview as a LIFECYCLE, not two static layouts.\n *\n * Data climbs a progressive ladder (url → basic → full); the anatomy is\n * CONSTANT at every tier, so each slot swaps a skeleton for real content in\n * place and the card never reflows on upgrade. Four statuses layer on top:\n *   resolving — climbing the ladder, aspect + rows reserved by skeletons\n *   resolved  — the full card\n *   stale     — resolved, but past its cache window: shows `fetchedAt` and a\n *               re-unfurl affordance\n *   error     — the unfurl failed: favicon + raw URL + retry, NO media\n *\n * Compact ↔ expanded is a user-switchable DISPLAY LEVEL on the same link\n * entity (the data lives in the controller, so switching never refetches or\n * loses it) — not two separate card types.\n */\n\nexport type LinkDisplay = \"compact\" | \"expanded\";\n\n/* ------------------------------------------------------------------ */\n/* Small building blocks                                               */\n/* ------------------------------------------------------------------ */\n\nconst StyledDomainRow = styled.div`\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  min-height: 16px;\n`;\n\nconst StyledChips = styled.div`\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  min-height: 18px;\n`;\n\n/* The stale strip — a re-unfurl affordance with the fetch time. */\nconst StyledStaleStrip = styled.div`\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  color: var(--color-theme-600);\n\n  > span {\n    flex: 1 1 auto;\n    min-width: 0;\n  }\n`;\n\nconst StyledReunfurl = styled.button`\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n  flex: 0 0 auto;\n  padding: 3px 8px;\n  border: 1px solid var(--border-primary);\n  border-radius: 6px;\n  background: var(--page-paper-main);\n  color: var(--color-theme-800);\n  font-size: 11px;\n  cursor: pointer;\n\n  svg {\n    width: 12px;\n    height: 12px;\n  }\n\n  &:hover {\n    background: var(--color-theme-200);\n    border-color: var(--sc-selection-ring);\n  }\n`;\n\n/* The error body — favicon + raw URL + retry, no media (per spec §5). */\nconst StyledErrorBody = styled.div`\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n  padding: 12px;\n\n  .err-head {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    color: var(--red-alert);\n  }\n\n  .err-head svg {\n    width: 16px;\n    height: 16px;\n    flex: 0 0 auto;\n  }\n\n  .err-url {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    word-break: break-all;\n  }\n`;\n\nconst StyledRetry = styled.button`\n  align-self: flex-start;\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 5px 10px;\n  border: 1px solid var(--border-primary);\n  border-radius: 6px;\n  background: var(--page-paper-main);\n  color: var(--color-theme-800);\n  cursor: pointer;\n\n  svg {\n    width: 14px;\n    height: 14px;\n  }\n\n  &:hover {\n    background: var(--color-theme-200);\n    border-color: var(--sc-selection-ring);\n  }\n`;\n\n/* The expanded footer band — tinted, holds the title + domain under the hero. */\nconst StyledFooterTitle = styled(Body2)`\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n`;\n\n/* ------------------------------------------------------------------ */\n/* The display-level switch — lives in the entity \"…\" slot             */\n/* ------------------------------------------------------------------ */\n\nconst StyledDisplayToggle = styled.button`\n  display: inline-flex;\n  align-items: center;\n  padding: 2px 8px;\n  border: 1px solid var(--border-primary);\n  border-radius: 10px;\n  background: var(--color-theme-200);\n  color: var(--color-theme-700);\n  font-size: 11px;\n  cursor: pointer;\n  white-space: nowrap;\n\n  &:hover {\n    background: var(--color-theme-300);\n  }\n`;\n\nconst DisplayToggle = ({\n  display,\n  onToggle,\n}: {\n  display: LinkDisplay;\n  onToggle: () => void;\n}): ReactElement => (\n  <StyledDisplayToggle\n    type=\"button\"\n    data-fixed\n    className=\"sc-control\"\n    aria-label=\"Switch display level\"\n    onClick={onToggle}\n  >\n    {display === \"compact\" ? \"Expand ▾\" : \"Compact ▴\"}\n  </StyledDisplayToggle>\n);\n\n/* ------------------------------------------------------------------ */\n/* LinkCard                                                            */\n/* ------------------------------------------------------------------ */\n\nexport interface LinkCardProps {\n  unfurl: UnfurlController;\n  display?: LinkDisplay;\n  onToggleDisplay?: () => void;\n}\n\nexport const LinkCard = ({\n  unfurl,\n  display = \"compact\",\n  onToggleDisplay,\n}: LinkCardProps): ReactElement => {\n  const { status, tier, data, fetchedAt, retry, reunfurl } = unfurl;\n\n  // ── Error: favicon + raw URL + retry, no media ──────────────────\n  if (status === \"error\") {\n    return (\n      <StyledErrorBody>\n        <div className=\"err-head\">\n          <WarningTriangleIcon />\n          <Caption1 weight=\"bold\" color=\"tertiary\">\n            Couldn’t load a preview\n          </Caption1>\n        </div>\n        <div className=\"err-url\">\n          <StyledFavicon $bg=\"var(--color-theme-400)\" data-fixed />\n          <Caption1 color=\"secondary\">{data.url}</Caption1>\n        </div>\n        <StyledRetry type=\"button\" onClick={retry}>\n          <ArrowRefreshIcon />\n          <Typography as=\"span\" variant=\"Caption 1\">\n            Retry\n          </Typography>\n        </StyledRetry>\n      </StyledErrorBody>\n    );\n  }\n\n  const hasBasic = tier === \"basic\" || tier === \"full\";\n  const hasFull = tier === \"full\";\n  const toggle = onToggleDisplay ?? (() => undefined);\n\n  // ── Expanded: hero + tinted footer band (title + domain) ────────\n  if (display === \"expanded\") {\n    return (\n      <>\n        <Cover\n          aspectRatio={COVER_RATIO_HERO}\n          centerSlot={hasFull && data.playable ? playControl : undefined}\n          topRightSlot={coverManagement()}\n        >\n          {hasFull ? (\n            <StyledColorCover $color={data.heroColor ?? \"#1D9E75\"} />\n          ) : (\n            <SkeletonLoader style={{ width: \"100%\", height: \"100%\" }} />\n          )}\n        </Cover>\n        <StackRow\n          role=\"footer\"\n          direction=\"column\"\n          background=\"var(--color-theme-200)\"\n        >\n          <StyledDomainRow>\n            {hasBasic ? (\n              <StyledFavicon $bg={data.faviconColor ?? \"#0F6E56\"} data-fixed />\n            ) : (\n              <SkeletonLoader\n                data-fixed\n                style={{ width: 16, height: 16, borderRadius: 4 }}\n              />\n            )}\n            {hasBasic ? (\n              <Caption1 color=\"tertiary\">{data.domain}</Caption1>\n            ) : (\n              <Caption1 color=\"tertiary\">{data.url}</Caption1>\n            )}\n            <span style={{ flex: \"1 1 auto\" }} />\n            <DisplayToggle display={display} onToggle={toggle} />\n          </StyledDomainRow>\n          {hasBasic ? (\n            <StyledFooterTitle weight=\"bold\">{data.title}</StyledFooterTitle>\n          ) : (\n            <SkeletonLoader style={{ height: 14, width: \"90%\" }} />\n          )}\n          {hasFull ? (\n            <Caption1 color=\"tertiary\">{data.description}</Caption1>\n          ) : (\n            <SkeletonLoader style={{ height: 10, width: \"70%\" }} />\n          )}\n        </StackRow>\n        {status === \"stale\" ? (\n          <StackRow role=\"meta\">\n            <StaleStrip fetchedAt={fetchedAt} onReunfurl={reunfurl} />\n          </StackRow>\n        ) : null}\n      </>\n    );\n  }\n\n  // ── Compact: cover + favicon/domain + title + chips ─────────────\n  return (\n    <>\n      <Cover\n        aspectRatio={COVER_RATIO}\n        centerSlot={hasFull && data.playable ? playControl : undefined}\n      >\n        {hasFull ? (\n          <StyledColorCover $color={data.heroColor ?? \"#1D9E75\"} />\n        ) : (\n          <SkeletonLoader style={{ width: \"100%\", height: \"100%\" }} />\n        )}\n      </Cover>\n\n      <StackRow role=\"custom\">\n        <StyledDomainRow>\n          {hasBasic ? (\n            <StyledFavicon $bg={data.faviconColor ?? \"#0F6E56\"} data-fixed />\n          ) : (\n            <SkeletonLoader\n              data-fixed\n              style={{ width: 16, height: 16, borderRadius: 4 }}\n            />\n          )}\n          {hasBasic ? (\n            <Caption1 color=\"tertiary\">{data.domain}</Caption1>\n          ) : (\n            <Caption1 color=\"tertiary\">{data.url}</Caption1>\n          )}\n          <span style={{ flex: \"1 1 auto\" }} />\n          <DisplayToggle display={display} onToggle={toggle} />\n        </StyledDomainRow>\n      </StackRow>\n\n      <StackRow role=\"title\">\n        {hasBasic ? (\n          <StyledClamp>{data.title}</StyledClamp>\n        ) : (\n          <div style={{ width: \"100%\" }}>\n            <SkeletonLoader style={{ height: 14, width: \"92%\" }} />\n            <SkeletonLoader\n              style={{ height: 14, width: \"60%\", marginTop: 6 }}\n            />\n          </div>\n        )}\n      </StackRow>\n\n      <StackRow role=\"custom\">\n        <StyledChips>\n          {hasFull ? (\n            <>\n              {data.kind ? (\n                <StyledChip data-fixed>{data.kind}</StyledChip>\n              ) : null}\n              {data.duration ? (\n                <StyledChip data-fixed>{data.duration}</StyledChip>\n              ) : null}\n            </>\n          ) : (\n            <SkeletonLoader\n              style={{ height: 18, width: 96, borderRadius: 10 }}\n            />\n          )}\n        </StyledChips>\n      </StackRow>\n\n      {status === \"stale\" ? (\n        <StackRow role=\"meta\">\n          <StaleStrip fetchedAt={fetchedAt} onReunfurl={reunfurl} />\n        </StackRow>\n      ) : null}\n    </>\n  );\n};\n\n/* The stale affordance — fetch time + a manual re-unfurl button. */\nconst StaleStrip = ({\n  fetchedAt,\n  onReunfurl,\n}: {\n  fetchedAt: number | null;\n  onReunfurl: () => void;\n}): ReactElement => (\n  <StyledStaleStrip>\n    <Typography as=\"span\" variant=\"Caption 1\" color=\"tertiary\">\n      Preview may be out of date · fetched {formatFetchedAt(fetchedAt)}\n    </Typography>\n    <StyledReunfurl type=\"button\" onClick={onReunfurl}>\n      <ArrowRefreshIcon />\n      Re-unfurl\n    </StyledReunfurl>\n  </StyledStaleStrip>\n);\n\n/* ---- skeleton ---- */\n\n/* Mirrors the compact anatomy row for row (this is the `resolving` render at\n   tier `url`), so a resolving link never reflows as it climbs the ladder. */\nexport const LinkSkeleton = (): ReactElement => (\n  <>\n    <Cover aspectRatio={COVER_RATIO}>\n      <SkeletonLoader style={{ width: \"100%\", height: \"100%\" }} />\n    </Cover>\n    <StackRow role=\"custom\">\n      <StyledDomainRow>\n        <SkeletonLoader\n          data-fixed\n          style={{ width: 16, height: 16, borderRadius: 4 }}\n        />\n        <SkeletonLoader style={{ height: 10, width: \"40%\" }} />\n      </StyledDomainRow>\n    </StackRow>\n    <StackRow role=\"title\">\n      <div style={{ width: \"100%\" }}>\n        <SkeletonLoader style={{ height: 14, width: \"92%\" }} />\n        <SkeletonLoader style={{ height: 14, width: \"60%\", marginTop: 6 }} />\n      </div>\n    </StackRow>\n    <StackRow role=\"custom\">\n      <StyledChips>\n        <SkeletonLoader style={{ height: 18, width: 96, borderRadius: 10 }} />\n      </StyledChips>\n    </StackRow>\n  </>\n);\n\n/* ---- placeholder ---- */\n\nexport const LinkPlaceholder = (\n  props: React.ButtonHTMLAttributes<HTMLButtonElement>\n): ReactElement => (\n  <Placeholder icon={<InsertLinkIcon />} label=\"Add a link\" {...props} />\n);\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"LinkCard.js","names":["React","styled","COVER_RATIO_HERO","StyledChip","StyledClamp","StyledColorCover","StyledFavicon","coverManagement","playControl","Placeholder","formatFetchedAt","ArrowRefreshIcon","InsertLinkIcon","WarningTriangleIcon","SkeletonLoader","STACKED_CARD_COVER_RATIO","COVER_RATIO","STACKED_CARD_CONTROL_CLASS","StackedCardCover","Cover","StackedCardRow","StackRow","Body2","Caption1","Typography","StyledDomainRow","div","withConfig","displayName","componentId","StyledChips","StyledStaleStrip","StyledReunfurl","button","StyledErrorRow","StyledRetry","StyledFooterTitle","StyledDisplayToggle","DisplayToggle","_ref","display","onToggle","createElement","type","className","onClick","LinkCard","_ref2","_data$heroColor2","_data$faviconColor2","unfurl","_ref2$display","onToggleDisplay","status","tier","data","fetchedAt","retry","reunfurl","role","direction","weight","color","$bg","url","as","variant","hasBasic","hasFull","toggle","undefined","_data$heroColor","_data$faviconColor","Fragment","aspectRatio","centerSlot","playable","topRightSlot","$color","heroColor","style","width","height","background","faviconColor","borderRadius","domain","flex","title","description","StaleStrip","onReunfurl","marginTop","kind","duration","_ref3","LinkSkeleton","LinkPlaceholder","props","_extends","icon","label"],"sources":["../../../../../src/presentation/stackedCard/content/LinkCard.tsx"],"sourcesContent":["import React, { ReactElement } from \"react\";\n\nimport styled from \"styled-components\";\n\nimport {\n  COVER_RATIO_HERO,\n  StyledChip,\n  StyledClamp,\n  StyledColorCover,\n  StyledFavicon,\n  coverManagement,\n  playControl,\n  Placeholder,\n} from \"./shared\";\nimport { UnfurlController, formatFetchedAt } from \"./unfurl\";\nimport {\n  ArrowRefreshIcon,\n  InsertLinkIcon,\n  WarningTriangleIcon,\n} from \"../../../components/Icons\";\nimport { SkeletonLoader } from \"../../../components/Loaders\";\nimport {\n  STACKED_CARD_COVER_RATIO as COVER_RATIO,\n  STACKED_CARD_CONTROL_CLASS,\n  StackedCardCover as Cover,\n  StackedCardRow as StackRow,\n} from \"../../../components/StackedCard\";\nimport { Body2, Caption1 } from \"../../../components/Typography\";\nimport { Typography } from \"../../../components/Typography/Typography\";\n\n/**\n * LinkCard — a link preview as a LIFECYCLE, not two static layouts.\n *\n * Data climbs a progressive ladder (url → basic → full); the anatomy is\n * CONSTANT at every tier, so each slot swaps a skeleton for real content in\n * place and the card never reflows on upgrade. Four statuses layer on top:\n *   resolving — climbing the ladder, aspect + rows reserved by skeletons\n *   resolved  — the full card\n *   stale     — resolved, but past its cache window: shows `fetchedAt` and a\n *               re-unfurl affordance\n *   error     — the unfurl failed: favicon + raw URL + retry, NO media\n *\n * Compact ↔ expanded is a user-switchable DISPLAY LEVEL on the same link\n * entity (the data lives in the controller, so switching never refetches or\n * loses it) — not two separate card types.\n */\n\nexport type LinkDisplay = \"compact\" | \"expanded\";\n\n/* ------------------------------------------------------------------ */\n/* Small building blocks                                               */\n/* ------------------------------------------------------------------ */\n\nconst StyledDomainRow = styled.div`\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  min-height: 16px;\n`;\n\nconst StyledChips = styled.div`\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  min-height: 18px;\n`;\n\n/* The stale strip — a re-unfurl affordance with the fetch time. */\nconst StyledStaleStrip = styled.div`\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  color: var(--color-theme-600);\n\n  > span {\n    flex: 1 1 auto;\n    min-width: 0;\n  }\n`;\n\nconst StyledReunfurl = styled.button`\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n  flex: 0 0 auto;\n  padding: 3px 8px;\n  border: 1px solid var(--border-primary);\n  border-radius: 6px;\n  background: var(--page-paper-main);\n  color: var(--color-theme-800);\n  font-size: 11px;\n  cursor: pointer;\n\n  svg {\n    width: 12px;\n    height: 12px;\n  }\n\n  &:hover {\n    background: var(--color-theme-200);\n    border-color: var(--sc-selection-ring);\n  }\n`;\n\n/* The error body — favicon + raw URL + retry, no media (per spec §5). It is a\n   column row like any other: the padding comes from the role, so the error\n   state lines up with the states it replaces instead of setting its own inset.\n   Only the gap is widened — three stacked blocks, not four text lines. */\nconst StyledErrorRow = styled(StackRow)`\n  gap: 10px;\n\n  .err-head {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    color: var(--red-alert);\n  }\n\n  .err-head svg {\n    width: 16px;\n    height: 16px;\n    flex: 0 0 auto;\n  }\n\n  .err-url {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    word-break: break-all;\n  }\n`;\n\nconst StyledRetry = styled.button`\n  align-self: flex-start;\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 5px 10px;\n  border: 1px solid var(--border-primary);\n  border-radius: 6px;\n  background: var(--page-paper-main);\n  color: var(--color-theme-800);\n  cursor: pointer;\n\n  svg {\n    width: 14px;\n    height: 14px;\n  }\n\n  &:hover {\n    background: var(--color-theme-200);\n    border-color: var(--sc-selection-ring);\n  }\n`;\n\n/* The expanded footer band — tinted, holds the title + domain under the hero. */\nconst StyledFooterTitle = styled(Body2)`\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n`;\n\n/* ------------------------------------------------------------------ */\n/* The display-level switch — lives in the entity \"…\" slot             */\n/* ------------------------------------------------------------------ */\n\nconst StyledDisplayToggle = styled.button`\n  display: inline-flex;\n  align-items: center;\n  padding: 2px 8px;\n  border: 1px solid var(--border-primary);\n  border-radius: 10px;\n  background: var(--color-theme-200);\n  color: var(--color-theme-700);\n  font-size: 11px;\n  cursor: pointer;\n  white-space: nowrap;\n\n  &:hover {\n    background: var(--color-theme-300);\n  }\n`;\n\nconst DisplayToggle = ({\n  display,\n  onToggle,\n}: {\n  display: LinkDisplay;\n  onToggle: () => void;\n}): ReactElement => (\n  <StyledDisplayToggle\n    type=\"button\"\n    data-fixed\n    className={STACKED_CARD_CONTROL_CLASS}\n    aria-label=\"Switch display level\"\n    onClick={onToggle}\n  >\n    {display === \"compact\" ? \"Expand ▾\" : \"Compact ▴\"}\n  </StyledDisplayToggle>\n);\n\n/* ------------------------------------------------------------------ */\n/* LinkCard                                                            */\n/* ------------------------------------------------------------------ */\n\nexport interface LinkCardProps {\n  unfurl: UnfurlController;\n  display?: LinkDisplay;\n  onToggleDisplay?: () => void;\n}\n\nexport const LinkCard = ({\n  unfurl,\n  display = \"compact\",\n  onToggleDisplay,\n}: LinkCardProps): ReactElement => {\n  const { status, tier, data, fetchedAt, retry, reunfurl } = unfurl;\n\n  // ── Error: favicon + raw URL + retry, no media ──────────────────\n  if (status === \"error\") {\n    return (\n      <StyledErrorRow role=\"custom\" direction=\"column\">\n        <div className=\"err-head\">\n          <WarningTriangleIcon />\n          <Caption1 weight=\"bold\" color=\"tertiary\">\n            Couldn’t load a preview\n          </Caption1>\n        </div>\n        <div className=\"err-url\">\n          <StyledFavicon $bg=\"var(--color-theme-400)\" data-fixed />\n          <Caption1 color=\"secondary\">{data.url}</Caption1>\n        </div>\n        <StyledRetry type=\"button\" onClick={retry}>\n          <ArrowRefreshIcon />\n          <Typography as=\"span\" variant=\"Caption 1\">\n            Retry\n          </Typography>\n        </StyledRetry>\n      </StyledErrorRow>\n    );\n  }\n\n  const hasBasic = tier === \"basic\" || tier === \"full\";\n  const hasFull = tier === \"full\";\n  const toggle = onToggleDisplay ?? (() => undefined);\n\n  // ── Expanded: hero + tinted footer band (title + domain) ────────\n  if (display === \"expanded\") {\n    return (\n      <>\n        <Cover\n          aspectRatio={COVER_RATIO_HERO}\n          centerSlot={hasFull && data.playable ? playControl : undefined}\n          topRightSlot={coverManagement()}\n        >\n          {hasFull ? (\n            <StyledColorCover $color={data.heroColor ?? \"#1D9E75\"} />\n          ) : (\n            <SkeletonLoader style={{ width: \"100%\", height: \"100%\" }} />\n          )}\n        </Cover>\n        <StackRow\n          role=\"footer\"\n          direction=\"column\"\n          background=\"var(--color-theme-200)\"\n        >\n          <StyledDomainRow>\n            {hasBasic ? (\n              <StyledFavicon $bg={data.faviconColor ?? \"#0F6E56\"} data-fixed />\n            ) : (\n              <SkeletonLoader\n                data-fixed\n                style={{ width: 16, height: 16, borderRadius: 4 }}\n              />\n            )}\n            {hasBasic ? (\n              <Caption1 color=\"tertiary\">{data.domain}</Caption1>\n            ) : (\n              <Caption1 color=\"tertiary\">{data.url}</Caption1>\n            )}\n            <span style={{ flex: \"1 1 auto\" }} />\n            <DisplayToggle display={display} onToggle={toggle} />\n          </StyledDomainRow>\n          {hasBasic ? (\n            <StyledFooterTitle weight=\"bold\">{data.title}</StyledFooterTitle>\n          ) : (\n            <SkeletonLoader style={{ height: 14, width: \"90%\" }} />\n          )}\n          {hasFull ? (\n            <Caption1 color=\"tertiary\">{data.description}</Caption1>\n          ) : (\n            <SkeletonLoader style={{ height: 10, width: \"70%\" }} />\n          )}\n        </StackRow>\n        {status === \"stale\" ? (\n          <StackRow role=\"meta\">\n            <StaleStrip fetchedAt={fetchedAt} onReunfurl={reunfurl} />\n          </StackRow>\n        ) : null}\n      </>\n    );\n  }\n\n  // ── Compact: cover + favicon/domain + title + chips ─────────────\n  return (\n    <>\n      <Cover\n        aspectRatio={COVER_RATIO}\n        centerSlot={hasFull && data.playable ? playControl : undefined}\n      >\n        {hasFull ? (\n          <StyledColorCover $color={data.heroColor ?? \"#1D9E75\"} />\n        ) : (\n          <SkeletonLoader style={{ width: \"100%\", height: \"100%\" }} />\n        )}\n      </Cover>\n\n      <StackRow role=\"custom\">\n        <StyledDomainRow>\n          {hasBasic ? (\n            <StyledFavicon $bg={data.faviconColor ?? \"#0F6E56\"} data-fixed />\n          ) : (\n            <SkeletonLoader\n              data-fixed\n              style={{ width: 16, height: 16, borderRadius: 4 }}\n            />\n          )}\n          {hasBasic ? (\n            <Caption1 color=\"tertiary\">{data.domain}</Caption1>\n          ) : (\n            <Caption1 color=\"tertiary\">{data.url}</Caption1>\n          )}\n          <span style={{ flex: \"1 1 auto\" }} />\n          <DisplayToggle display={display} onToggle={toggle} />\n        </StyledDomainRow>\n      </StackRow>\n\n      <StackRow role=\"title\">\n        {hasBasic ? (\n          <StyledClamp>{data.title}</StyledClamp>\n        ) : (\n          <div style={{ width: \"100%\" }}>\n            <SkeletonLoader style={{ height: 14, width: \"92%\" }} />\n            <SkeletonLoader\n              style={{ height: 14, width: \"60%\", marginTop: 6 }}\n            />\n          </div>\n        )}\n      </StackRow>\n\n      <StackRow role=\"custom\">\n        <StyledChips>\n          {hasFull ? (\n            <>\n              {data.kind ? (\n                <StyledChip data-fixed>{data.kind}</StyledChip>\n              ) : null}\n              {data.duration ? (\n                <StyledChip data-fixed>{data.duration}</StyledChip>\n              ) : null}\n            </>\n          ) : (\n            <SkeletonLoader\n              style={{ height: 18, width: 96, borderRadius: 10 }}\n            />\n          )}\n        </StyledChips>\n      </StackRow>\n\n      {status === \"stale\" ? (\n        <StackRow role=\"meta\">\n          <StaleStrip fetchedAt={fetchedAt} onReunfurl={reunfurl} />\n        </StackRow>\n      ) : null}\n    </>\n  );\n};\n\n/* The stale affordance — fetch time + a manual re-unfurl button. */\nconst StaleStrip = ({\n  fetchedAt,\n  onReunfurl,\n}: {\n  fetchedAt: number | null;\n  onReunfurl: () => void;\n}): ReactElement => (\n  <StyledStaleStrip>\n    <Typography as=\"span\" variant=\"Caption 1\" color=\"tertiary\">\n      Preview may be out of date · fetched {formatFetchedAt(fetchedAt)}\n    </Typography>\n    <StyledReunfurl type=\"button\" onClick={onReunfurl}>\n      <ArrowRefreshIcon />\n      Re-unfurl\n    </StyledReunfurl>\n  </StyledStaleStrip>\n);\n\n/* ---- skeleton ---- */\n\n/* Mirrors the compact anatomy row for row (this is the `resolving` render at\n   tier `url`), so a resolving link never reflows as it climbs the ladder. */\nexport const LinkSkeleton = (): ReactElement => (\n  <>\n    <Cover aspectRatio={COVER_RATIO}>\n      <SkeletonLoader style={{ width: \"100%\", height: \"100%\" }} />\n    </Cover>\n    <StackRow role=\"custom\">\n      <StyledDomainRow>\n        <SkeletonLoader\n          data-fixed\n          style={{ width: 16, height: 16, borderRadius: 4 }}\n        />\n        <SkeletonLoader style={{ height: 10, width: \"40%\" }} />\n      </StyledDomainRow>\n    </StackRow>\n    <StackRow role=\"title\">\n      <div style={{ width: \"100%\" }}>\n        <SkeletonLoader style={{ height: 14, width: \"92%\" }} />\n        <SkeletonLoader style={{ height: 14, width: \"60%\", marginTop: 6 }} />\n      </div>\n    </StackRow>\n    <StackRow role=\"custom\">\n      <StyledChips>\n        <SkeletonLoader style={{ height: 18, width: 96, borderRadius: 10 }} />\n      </StyledChips>\n    </StackRow>\n  </>\n);\n\n/* ---- placeholder ---- */\n\nexport const LinkPlaceholder = (\n  props: React.ButtonHTMLAttributes<HTMLButtonElement>\n): ReactElement => (\n  <Placeholder icon={<InsertLinkIcon />} label=\"Add a link\" {...props} />\n);\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/presentation/stackedCard/content/NoteCard.js

@@ -4,8 +4,8 @@ import styled from "styled-components";
 import { EntityDots, Placeholder } from "./shared";
 import { NoteIcon } from "../../../components/Icons";
 import { SkeletonLoader } from "../../../components/Loaders";
+import { StackedCardRow as StackRow } from "../../../components/StackedCard";
 import { Body2 } from "../../../components/Typography";
-import { StackRow } from "../primitives";
 
 /**
  * NoteCard — the new fifth type. A multi-line text card (Milanote-style): a

package/dist/esm/presentation/stackedCard/content/NoteCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"NoteCard.js","names":["React","styled","EntityDots","Placeholder","NoteIcon","SkeletonLoader","Body2","StackRow","StyledNoteBody","withConfig","displayName","componentId","SAMPLE_NOTE","NoteCard","_ref","_ref$title","title","_ref$body","body","createElement","Fragment","role","weight","direction","color","NotePlaceholder","props","_extends","icon","label","NoteSkeleton","style","height","width"],"sources":["../../../../../src/presentation/stackedCard/content/NoteCard.tsx"],"sourcesContent":["import React, { ReactElement } from \"react\";\n\nimport styled from \"styled-components\";\n\nimport { EntityDots, Placeholder } from \"./shared\";\nimport { NoteIcon } from \"../../../components/Icons\";\nimport { SkeletonLoader } from \"../../../components/Loaders\";\nimport { Body2 } from \"../../../components/Typography\";\nimport { StackRow } from \"../primitives\";\n\n/**\n * NoteCard — the new fifth type. A multi-line text card (Milanote-style): a\n * title row that owns the \"…\" menu, then padded body rows. The body clamps at a\n * line limit and fades out; auto-height, so the card grows with its content.\n * Inline editing lands in task 4/8 — this is the read view + placeholder.\n */\n\n/* The body clamps at a max height and fades out with a mask so long notes end\n   softly instead of hard-cropping. white-space: pre-line keeps authored breaks. */\nconst StyledNoteBody = styled(Body2)`\n  display: block;\n  max-height: 132px;\n  overflow: hidden;\n  white-space: pre-line;\n  -webkit-mask-image: linear-gradient(180deg, #000 72%, transparent);\n  mask-image: linear-gradient(180deg, #000 72%, transparent);\n`;\n\nexport const SAMPLE_NOTE = `Kickoff open questions before we lock the columns:\n\n• Who owns the migration off react-dnd, and does it block the canvas work or run in parallel?\n• Confirm the outline-placeholder choreography reads the same in a scrolled column.\n• Do we ship the note type in v1, or defer inline editing?`;\n\nexport interface NoteCardProps {\n  title?: string;\n  body?: string;\n}\n\nexport const NoteCard = ({\n  title = \"Kickoff notes\",\n  body = SAMPLE_NOTE,\n}: NoteCardProps): ReactElement => (\n  <>\n    <StackRow role=\"title\">\n      <Body2 weight=\"bold\">{title}</Body2>\n      <EntityDots aria-label=\"Note options\" />\n    </StackRow>\n    <StackRow role=\"custom\" direction=\"column\">\n      <StyledNoteBody color=\"secondary\">{body}</StyledNoteBody>\n    </StackRow>\n  </>\n);\n\n/* ---- placeholder + skeleton ---- */\n\nexport const NotePlaceholder = (\n  props: React.ButtonHTMLAttributes<HTMLButtonElement>\n): ReactElement => (\n  <Placeholder icon={<NoteIcon />} label=\"Write a note\" {...props} />\n);\n\n/* Skeleton mirrors the note anatomy: a title line, then several body lines. */\nexport const NoteSkeleton = (): ReactElement => (\n  <>\n    <StackRow role=\"title\">\n      <SkeletonLoader style={{ height: 14, width: \"50%\" }} />\n    </StackRow>\n    <StackRow role=\"custom\" direction=\"column\">\n      <SkeletonLoader style={{ height: 10, width: \"100%\" }} />\n      <SkeletonLoader style={{ height: 10, width: \"96%\" }} />\n      <SkeletonLoader style={{ height: 10, width: \"88%\" }} />\n      <SkeletonLoader style={{ height: 10, width: \"70%\" }} />\n    </StackRow>\n  </>\n);\n"],"mappings":";AAAA,OAAOA,KAAK,MAAwB,OAAO;AAE3C,OAAOC,MAAM,MAAM,mBAAmB;AAEtC,SAASC,UAAU,EAAEC,WAAW,QAAQ,UAAU;AAClD,SAASC,QAAQ,QAAQ,2BAA2B;AACpD,SAASC,cAAc,QAAQ,6BAA6B;AAC5D,SAASC,KAAK,QAAQ,gCAAgC;AACtD,SAASC,QAAQ,QAAQ,eAAe;;AAExC;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA,MAAMC,cAAc,GAAGP,MAAM,CAACK,KAAK,CAAC,CAAAG,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,oMAOnC;AAED,OAAO,MAAMC,WAAW,wTAImC;AAO3D,OAAO,MAAMC,QAAQ,GAAGC,IAAA;EAAA,IAAAC,UAAA,GAAAD,IAAA,CACtBE,KAAK;IAALA,KAAK,GAAAD,UAAA,cAAG,eAAe,GAAAA,UAAA;IAAAE,SAAA,GAAAH,IAAA,CACvBI,IAAI;IAAJA,IAAI,GAAAD,SAAA,cAAGL,WAAW,GAAAK,SAAA;EAAA,oBAElBjB,KAAA,CAAAmB,aAAA,CAAAnB,KAAA,CAAAoB,QAAA,qBACEpB,KAAA,CAAAmB,aAAA,CAACZ,QAAQ;IAACc,IAAI,EAAC;EAAO,gBACpBrB,KAAA,CAAAmB,aAAA,CAACb,KAAK;IAACgB,MAAM,EAAC;EAAM,GAAEN,KAAa,CAAC,eACpChB,KAAA,CAAAmB,aAAA,CAACjB,UAAU;IAAC,cAAW;EAAc,CAAE,CAC/B,CAAC,eACXF,KAAA,CAAAmB,aAAA,CAACZ,QAAQ;IAACc,IAAI,EAAC,QAAQ;IAACE,SAAS,EAAC;EAAQ,gBACxCvB,KAAA,CAAAmB,aAAA,CAACX,cAAc;IAACgB,KAAK,EAAC;EAAW,GAAEN,IAAqB,CAChD,CACV,CAAC;AAAA,CACJ;;AAED;;AAEA,OAAO,MAAMO,eAAe,GAC1BC,KAAoD,iBAEpD1B,KAAA,CAAAmB,aAAA,CAAChB,WAAW,EAAAwB,QAAA;EAACC,IAAI,eAAE5B,KAAA,CAAAmB,aAAA,CAACf,QAAQ,MAAE,CAAE;EAACyB,KAAK,EAAC;AAAc,GAAKH,KAAK,CAAG,CACnE;;AAED;AACA,OAAO,MAAMI,YAAY,GAAGA,CAAA,kBAC1B9B,KAAA,CAAAmB,aAAA,CAAAnB,KAAA,CAAAoB,QAAA,qBACEpB,KAAA,CAAAmB,aAAA,CAACZ,QAAQ;EAACc,IAAI,EAAC;AAAO,gBACpBrB,KAAA,CAAAmB,aAAA,CAACd,cAAc;EAAC0B,KAAK,EAAE;IAAEC,MAAM,EAAE,EAAE;IAAEC,KAAK,EAAE;EAAM;AAAE,CAAE,CAC9C,CAAC,eACXjC,KAAA,CAAAmB,aAAA,CAACZ,QAAQ;EAACc,IAAI,EAAC,QAAQ;EAACE,SAAS,EAAC;AAAQ,gBACxCvB,KAAA,CAAAmB,aAAA,CAACd,cAAc;EAAC0B,KAAK,EAAE;IAAEC,MAAM,EAAE,EAAE;IAAEC,KAAK,EAAE;EAAO;AAAE,CAAE,CAAC,eACxDjC,KAAA,CAAAmB,aAAA,CAACd,cAAc;EAAC0B,KAAK,EAAE;IAAEC,MAAM,EAAE,EAAE;IAAEC,KAAK,EAAE;EAAM;AAAE,CAAE,CAAC,eACvDjC,KAAA,CAAAmB,aAAA,CAACd,cAAc;EAAC0B,KAAK,EAAE;IAAEC,MAAM,EAAE,EAAE;IAAEC,KAAK,EAAE;EAAM;AAAE,CAAE,CAAC,eACvDjC,KAAA,CAAAmB,aAAA,CAACd,cAAc;EAAC0B,KAAK,EAAE;IAAEC,MAAM,EAAE,EAAE;IAAEC,KAAK,EAAE;EAAM;AAAE,CAAE,CAC9C,CACV,CACH","ignoreList":[]}
+{"version":3,"file":"NoteCard.js","names":["React","styled","EntityDots","Placeholder","NoteIcon","SkeletonLoader","StackedCardRow","StackRow","Body2","StyledNoteBody","withConfig","displayName","componentId","SAMPLE_NOTE","NoteCard","_ref","_ref$title","title","_ref$body","body","createElement","Fragment","role","weight","direction","color","NotePlaceholder","props","_extends","icon","label","NoteSkeleton","style","height","width"],"sources":["../../../../../src/presentation/stackedCard/content/NoteCard.tsx"],"sourcesContent":["import React, { ReactElement } from \"react\";\n\nimport styled from \"styled-components\";\n\nimport { EntityDots, Placeholder } from \"./shared\";\nimport { NoteIcon } from \"../../../components/Icons\";\nimport { SkeletonLoader } from \"../../../components/Loaders\";\nimport { StackedCardRow as StackRow } from \"../../../components/StackedCard\";\nimport { Body2 } from \"../../../components/Typography\";\n\n/**\n * NoteCard — the new fifth type. A multi-line text card (Milanote-style): a\n * title row that owns the \"…\" menu, then padded body rows. The body clamps at a\n * line limit and fades out; auto-height, so the card grows with its content.\n * Inline editing lands in task 4/8 — this is the read view + placeholder.\n */\n\n/* The body clamps at a max height and fades out with a mask so long notes end\n   softly instead of hard-cropping. white-space: pre-line keeps authored breaks. */\nconst StyledNoteBody = styled(Body2)`\n  display: block;\n  max-height: 132px;\n  overflow: hidden;\n  white-space: pre-line;\n  -webkit-mask-image: linear-gradient(180deg, #000 72%, transparent);\n  mask-image: linear-gradient(180deg, #000 72%, transparent);\n`;\n\nexport const SAMPLE_NOTE = `Kickoff open questions before we lock the columns:\n\n• Who owns the migration off react-dnd, and does it block the canvas work or run in parallel?\n• Confirm the outline-placeholder choreography reads the same in a scrolled column.\n• Do we ship the note type in v1, or defer inline editing?`;\n\nexport interface NoteCardProps {\n  title?: string;\n  body?: string;\n}\n\nexport const NoteCard = ({\n  title = \"Kickoff notes\",\n  body = SAMPLE_NOTE,\n}: NoteCardProps): ReactElement => (\n  <>\n    <StackRow role=\"title\">\n      <Body2 weight=\"bold\">{title}</Body2>\n      <EntityDots aria-label=\"Note options\" />\n    </StackRow>\n    <StackRow role=\"custom\" direction=\"column\">\n      <StyledNoteBody color=\"secondary\">{body}</StyledNoteBody>\n    </StackRow>\n  </>\n);\n\n/* ---- placeholder + skeleton ---- */\n\nexport const NotePlaceholder = (\n  props: React.ButtonHTMLAttributes<HTMLButtonElement>\n): ReactElement => (\n  <Placeholder icon={<NoteIcon />} label=\"Write a note\" {...props} />\n);\n\n/* Skeleton mirrors the note anatomy: a title line, then several body lines. */\nexport const NoteSkeleton = (): ReactElement => (\n  <>\n    <StackRow role=\"title\">\n      <SkeletonLoader style={{ height: 14, width: \"50%\" }} />\n    </StackRow>\n    <StackRow role=\"custom\" direction=\"column\">\n      <SkeletonLoader style={{ height: 10, width: \"100%\" }} />\n      <SkeletonLoader style={{ height: 10, width: \"96%\" }} />\n      <SkeletonLoader style={{ height: 10, width: \"88%\" }} />\n      <SkeletonLoader style={{ height: 10, width: \"70%\" }} />\n    </StackRow>\n  </>\n);\n"],"mappings":";AAAA,OAAOA,KAAK,MAAwB,OAAO;AAE3C,OAAOC,MAAM,MAAM,mBAAmB;AAEtC,SAASC,UAAU,EAAEC,WAAW,QAAQ,UAAU;AAClD,SAASC,QAAQ,QAAQ,2BAA2B;AACpD,SAASC,cAAc,QAAQ,6BAA6B;AAC5D,SAASC,cAAc,IAAIC,QAAQ,QAAQ,iCAAiC;AAC5E,SAASC,KAAK,QAAQ,gCAAgC;;AAEtD;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA,MAAMC,cAAc,GAAGR,MAAM,CAACO,KAAK,CAAC,CAAAE,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,oMAOnC;AAED,OAAO,MAAMC,WAAW,wTAImC;AAO3D,OAAO,MAAMC,QAAQ,GAAGC,IAAA;EAAA,IAAAC,UAAA,GAAAD,IAAA,CACtBE,KAAK;IAALA,KAAK,GAAAD,UAAA,cAAG,eAAe,GAAAA,UAAA;IAAAE,SAAA,GAAAH,IAAA,CACvBI,IAAI;IAAJA,IAAI,GAAAD,SAAA,cAAGL,WAAW,GAAAK,SAAA;EAAA,oBAElBlB,KAAA,CAAAoB,aAAA,CAAApB,KAAA,CAAAqB,QAAA,qBACErB,KAAA,CAAAoB,aAAA,CAACb,QAAQ;IAACe,IAAI,EAAC;EAAO,gBACpBtB,KAAA,CAAAoB,aAAA,CAACZ,KAAK;IAACe,MAAM,EAAC;EAAM,GAAEN,KAAa,CAAC,eACpCjB,KAAA,CAAAoB,aAAA,CAAClB,UAAU;IAAC,cAAW;EAAc,CAAE,CAC/B,CAAC,eACXF,KAAA,CAAAoB,aAAA,CAACb,QAAQ;IAACe,IAAI,EAAC,QAAQ;IAACE,SAAS,EAAC;EAAQ,gBACxCxB,KAAA,CAAAoB,aAAA,CAACX,cAAc;IAACgB,KAAK,EAAC;EAAW,GAAEN,IAAqB,CAChD,CACV,CAAC;AAAA,CACJ;;AAED;;AAEA,OAAO,MAAMO,eAAe,GAC1BC,KAAoD,iBAEpD3B,KAAA,CAAAoB,aAAA,CAACjB,WAAW,EAAAyB,QAAA;EAACC,IAAI,eAAE7B,KAAA,CAAAoB,aAAA,CAAChB,QAAQ,MAAE,CAAE;EAAC0B,KAAK,EAAC;AAAc,GAAKH,KAAK,CAAG,CACnE;;AAED;AACA,OAAO,MAAMI,YAAY,GAAGA,CAAA,kBAC1B/B,KAAA,CAAAoB,aAAA,CAAApB,KAAA,CAAAqB,QAAA,qBACErB,KAAA,CAAAoB,aAAA,CAACb,QAAQ;EAACe,IAAI,EAAC;AAAO,gBACpBtB,KAAA,CAAAoB,aAAA,CAACf,cAAc;EAAC2B,KAAK,EAAE;IAAEC,MAAM,EAAE,EAAE;IAAEC,KAAK,EAAE;EAAM;AAAE,CAAE,CAC9C,CAAC,eACXlC,KAAA,CAAAoB,aAAA,CAACb,QAAQ;EAACe,IAAI,EAAC,QAAQ;EAACE,SAAS,EAAC;AAAQ,gBACxCxB,KAAA,CAAAoB,aAAA,CAACf,cAAc;EAAC2B,KAAK,EAAE;IAAEC,MAAM,EAAE,EAAE;IAAEC,KAAK,EAAE;EAAO;AAAE,CAAE,CAAC,eACxDlC,KAAA,CAAAoB,aAAA,CAACf,cAAc;EAAC2B,KAAK,EAAE;IAAEC,MAAM,EAAE,EAAE;IAAEC,KAAK,EAAE;EAAM;AAAE,CAAE,CAAC,eACvDlC,KAAA,CAAAoB,aAAA,CAACf,cAAc;EAAC2B,KAAK,EAAE;IAAEC,MAAM,EAAE,EAAE;IAAEC,KAAK,EAAE;EAAM;AAAE,CAAE,CAAC,eACvDlC,KAAA,CAAAoB,aAAA,CAACf,cAAc;EAAC2B,KAAK,EAAE;IAAEC,MAAM,EAAE,EAAE;IAAEC,KAAK,EAAE;EAAM;AAAE,CAAE,CAC9C,CACV,CACH","ignoreList":[]}

package/dist/esm/presentation/stackedCard/content/SwatchCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SwatchCard.d.ts","sourceRoot":"","sources":["../../../../../src/presentation/stackedCard/content/SwatchCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAS5C;;;GAGG;AAEH,MAAM,WAAW,eAAe;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,GAAG,CAAC,EAAE,MAAM,CAAC;CACd;AAED,eAAO,MAAM,UAAU,GAAI,uBAIxB,eAAe,KAAG,YAYpB,CAAC;AAIF,eAAO,MAAM,iBAAiB,GAC5B,OAAO,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,KACnD,YAEF,CAAC;AAEF,eAAO,MAAM,cAAc,QAAO,YAUjC,CAAC"}
+{"version":3,"file":"SwatchCard.d.ts","sourceRoot":"","sources":["../../../../../src/presentation/stackedCard/content/SwatchCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAW5C;;;GAGG;AAEH,MAAM,WAAW,eAAe;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,GAAG,CAAC,EAAE,MAAM,CAAC;CACd;AAED,eAAO,MAAM,UAAU,GAAI,uBAIxB,eAAe,KAAG,YAYpB,CAAC;AAIF,eAAO,MAAM,iBAAiB,GAC5B,OAAO,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,KACnD,YAEF,CAAC;AAEF,eAAO,MAAM,cAAc,QAAO,YAUjC,CAAC"}

package/dist/esm/presentation/stackedCard/content/SwatchCard.js

@@ -1,11 +1,10 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import React from "react";
-import { StyledColorCover, Placeholder } from "./shared";
+import { COVER_RATIO_SWATCH, StyledColorCover, Placeholder } from "./shared";
 import { ImageIcon } from "../../../components/Icons";
 import { SkeletonLoader } from "../../../components/Loaders";
+import { StackedCardCover as Cover, StackedCardRow as StackRow } from "../../../components/StackedCard";
 import { Body2, Caption1 } from "../../../components/Typography";
-import { Cover, StackRow } from "../primitives";
-import { COVER_RATIO_SWATCH } from "../shell";
 
 /**
  * SwatchCard — the cover IS the colour; a title row states its name and hex.

package/dist/esm/presentation/stackedCard/content/SwatchCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"SwatchCard.js","names":["React","StyledColorCover","Placeholder","ImageIcon","SkeletonLoader","Body2","Caption1","Cover","StackRow","COVER_RATIO_SWATCH","SwatchCard","_ref","_ref$color","color","_ref$name","name","_ref$hex","hex","createElement","Fragment","aspectRatio","$color","role","style","fontFamily","SwatchPlaceholder","props","_extends","icon","label","SwatchSkeleton","width","height"],"sources":["../../../../../src/presentation/stackedCard/content/SwatchCard.tsx"],"sourcesContent":["import React, { ReactElement } from \"react\";\n\nimport { StyledColorCover, Placeholder } from \"./shared\";\nimport { ImageIcon } from \"../../../components/Icons\";\nimport { SkeletonLoader } from \"../../../components/Loaders\";\nimport { Body2, Caption1 } from \"../../../components/Typography\";\nimport { Cover, StackRow } from \"../primitives\";\nimport { COVER_RATIO_SWATCH } from \"../shell\";\n\n/**\n * SwatchCard — the cover IS the colour; a title row states its name and hex.\n * The swatch value is a literal data colour by design (not a theme token).\n */\n\nexport interface SwatchCardProps {\n  color?: string;\n  name?: string;\n  hex?: string;\n}\n\nexport const SwatchCard = ({\n  color = \"#1D9E75\",\n  name = \"Teal\",\n  hex = \"#1D9E75\",\n}: SwatchCardProps): ReactElement => (\n  <>\n    <Cover aspectRatio={COVER_RATIO_SWATCH}>\n      <StyledColorCover $color={color} />\n    </Cover>\n    <StackRow role=\"title\">\n      <Body2>{name}</Body2>\n      <Caption1 color=\"tertiary\" data-fixed style={{ fontFamily: \"monospace\" }}>\n        {hex}\n      </Caption1>\n    </StackRow>\n  </>\n);\n\n/* ---- placeholder + skeleton ---- */\n\nexport const SwatchPlaceholder = (\n  props: React.ButtonHTMLAttributes<HTMLButtonElement>\n): ReactElement => (\n  <Placeholder icon={<ImageIcon />} label=\"Pick a colour\" {...props} />\n);\n\nexport const SwatchSkeleton = (): ReactElement => (\n  <>\n    <Cover aspectRatio={COVER_RATIO_SWATCH}>\n      <SkeletonLoader style={{ width: \"100%\", height: \"100%\" }} />\n    </Cover>\n    <StackRow role=\"title\">\n      <SkeletonLoader style={{ height: 14, width: \"40%\" }} />\n      <SkeletonLoader data-fixed style={{ height: 12, width: 60 }} />\n    </StackRow>\n  </>\n);\n"],"mappings":";AAAA,OAAOA,KAAK,MAAwB,OAAO;AAE3C,SAASC,gBAAgB,EAAEC,WAAW,QAAQ,UAAU;AACxD,SAASC,SAAS,QAAQ,2BAA2B;AACrD,SAASC,cAAc,QAAQ,6BAA6B;AAC5D,SAASC,KAAK,EAAEC,QAAQ,QAAQ,gCAAgC;AAChE,SAASC,KAAK,EAAEC,QAAQ,QAAQ,eAAe;AAC/C,SAASC,kBAAkB,QAAQ,UAAU;;AAE7C;AACA;AACA;AACA;;AAQA,OAAO,MAAMC,UAAU,GAAGC,IAAA;EAAA,IAAAC,UAAA,GAAAD,IAAA,CACxBE,KAAK;IAALA,KAAK,GAAAD,UAAA,cAAG,SAAS,GAAAA,UAAA;IAAAE,SAAA,GAAAH,IAAA,CACjBI,IAAI;IAAJA,IAAI,GAAAD,SAAA,cAAG,MAAM,GAAAA,SAAA;IAAAE,QAAA,GAAAL,IAAA,CACbM,GAAG;IAAHA,GAAG,GAAAD,QAAA,cAAG,SAAS,GAAAA,QAAA;EAAA,oBAEfhB,KAAA,CAAAkB,aAAA,CAAAlB,KAAA,CAAAmB,QAAA,qBACEnB,KAAA,CAAAkB,aAAA,CAACX,KAAK;IAACa,WAAW,EAAEX;EAAmB,gBACrCT,KAAA,CAAAkB,aAAA,CAACjB,gBAAgB;IAACoB,MAAM,EAAER;EAAM,CAAE,CAC7B,CAAC,eACRb,KAAA,CAAAkB,aAAA,CAACV,QAAQ;IAACc,IAAI,EAAC;EAAO,gBACpBtB,KAAA,CAAAkB,aAAA,CAACb,KAAK,QAAEU,IAAY,CAAC,eACrBf,KAAA,CAAAkB,aAAA,CAACZ,QAAQ;IAACO,KAAK,EAAC,UAAU;IAAC,kBAAU;IAACU,KAAK,EAAE;MAAEC,UAAU,EAAE;IAAY;EAAE,GACtEP,GACO,CACF,CACV,CAAC;AAAA,CACJ;;AAED;;AAEA,OAAO,MAAMQ,iBAAiB,GAC5BC,KAAoD,iBAEpD1B,KAAA,CAAAkB,aAAA,CAAChB,WAAW,EAAAyB,QAAA;EAACC,IAAI,eAAE5B,KAAA,CAAAkB,aAAA,CAACf,SAAS,MAAE,CAAE;EAAC0B,KAAK,EAAC;AAAe,GAAKH,KAAK,CAAG,CACrE;AAED,OAAO,MAAMI,cAAc,GAAGA,CAAA,kBAC5B9B,KAAA,CAAAkB,aAAA,CAAAlB,KAAA,CAAAmB,QAAA,qBACEnB,KAAA,CAAAkB,aAAA,CAACX,KAAK;EAACa,WAAW,EAAEX;AAAmB,gBACrCT,KAAA,CAAAkB,aAAA,CAACd,cAAc;EAACmB,KAAK,EAAE;IAAEQ,KAAK,EAAE,MAAM;IAAEC,MAAM,EAAE;EAAO;AAAE,CAAE,CACtD,CAAC,eACRhC,KAAA,CAAAkB,aAAA,CAACV,QAAQ;EAACc,IAAI,EAAC;AAAO,gBACpBtB,KAAA,CAAAkB,aAAA,CAACd,cAAc;EAACmB,KAAK,EAAE;IAAES,MAAM,EAAE,EAAE;IAAED,KAAK,EAAE;EAAM;AAAE,CAAE,CAAC,eACvD/B,KAAA,CAAAkB,aAAA,CAACd,cAAc;EAAC,kBAAU;EAACmB,KAAK,EAAE;IAAES,MAAM,EAAE,EAAE;IAAED,KAAK,EAAE;EAAG;AAAE,CAAE,CACtD,CACV,CACH","ignoreList":[]}
+{"version":3,"file":"SwatchCard.js","names":["React","COVER_RATIO_SWATCH","StyledColorCover","Placeholder","ImageIcon","SkeletonLoader","StackedCardCover","Cover","StackedCardRow","StackRow","Body2","Caption1","SwatchCard","_ref","_ref$color","color","_ref$name","name","_ref$hex","hex","createElement","Fragment","aspectRatio","$color","role","style","fontFamily","SwatchPlaceholder","props","_extends","icon","label","SwatchSkeleton","width","height"],"sources":["../../../../../src/presentation/stackedCard/content/SwatchCard.tsx"],"sourcesContent":["import React, { ReactElement } from \"react\";\n\nimport { COVER_RATIO_SWATCH, StyledColorCover, Placeholder } from \"./shared\";\nimport { ImageIcon } from \"../../../components/Icons\";\nimport { SkeletonLoader } from \"../../../components/Loaders\";\nimport {\n  StackedCardCover as Cover,\n  StackedCardRow as StackRow,\n} from \"../../../components/StackedCard\";\nimport { Body2, Caption1 } from \"../../../components/Typography\";\n\n/**\n * SwatchCard — the cover IS the colour; a title row states its name and hex.\n * The swatch value is a literal data colour by design (not a theme token).\n */\n\nexport interface SwatchCardProps {\n  color?: string;\n  name?: string;\n  hex?: string;\n}\n\nexport const SwatchCard = ({\n  color = \"#1D9E75\",\n  name = \"Teal\",\n  hex = \"#1D9E75\",\n}: SwatchCardProps): ReactElement => (\n  <>\n    <Cover aspectRatio={COVER_RATIO_SWATCH}>\n      <StyledColorCover $color={color} />\n    </Cover>\n    <StackRow role=\"title\">\n      <Body2>{name}</Body2>\n      <Caption1 color=\"tertiary\" data-fixed style={{ fontFamily: \"monospace\" }}>\n        {hex}\n      </Caption1>\n    </StackRow>\n  </>\n);\n\n/* ---- placeholder + skeleton ---- */\n\nexport const SwatchPlaceholder = (\n  props: React.ButtonHTMLAttributes<HTMLButtonElement>\n): ReactElement => (\n  <Placeholder icon={<ImageIcon />} label=\"Pick a colour\" {...props} />\n);\n\nexport const SwatchSkeleton = (): ReactElement => (\n  <>\n    <Cover aspectRatio={COVER_RATIO_SWATCH}>\n      <SkeletonLoader style={{ width: \"100%\", height: \"100%\" }} />\n    </Cover>\n    <StackRow role=\"title\">\n      <SkeletonLoader style={{ height: 14, width: \"40%\" }} />\n      <SkeletonLoader data-fixed style={{ height: 12, width: 60 }} />\n    </StackRow>\n  </>\n);\n"],"mappings":";AAAA,OAAOA,KAAK,MAAwB,OAAO;AAE3C,SAASC,kBAAkB,EAAEC,gBAAgB,EAAEC,WAAW,QAAQ,UAAU;AAC5E,SAASC,SAAS,QAAQ,2BAA2B;AACrD,SAASC,cAAc,QAAQ,6BAA6B;AAC5D,SACEC,gBAAgB,IAAIC,KAAK,EACzBC,cAAc,IAAIC,QAAQ,QACrB,iCAAiC;AACxC,SAASC,KAAK,EAAEC,QAAQ,QAAQ,gCAAgC;;AAEhE;AACA;AACA;AACA;;AAQA,OAAO,MAAMC,UAAU,GAAGC,IAAA;EAAA,IAAAC,UAAA,GAAAD,IAAA,CACxBE,KAAK;IAALA,KAAK,GAAAD,UAAA,cAAG,SAAS,GAAAA,UAAA;IAAAE,SAAA,GAAAH,IAAA,CACjBI,IAAI;IAAJA,IAAI,GAAAD,SAAA,cAAG,MAAM,GAAAA,SAAA;IAAAE,QAAA,GAAAL,IAAA,CACbM,GAAG;IAAHA,GAAG,GAAAD,QAAA,cAAG,SAAS,GAAAA,QAAA;EAAA,oBAEflB,KAAA,CAAAoB,aAAA,CAAApB,KAAA,CAAAqB,QAAA,qBACErB,KAAA,CAAAoB,aAAA,CAACb,KAAK;IAACe,WAAW,EAAErB;EAAmB,gBACrCD,KAAA,CAAAoB,aAAA,CAAClB,gBAAgB;IAACqB,MAAM,EAAER;EAAM,CAAE,CAC7B,CAAC,eACRf,KAAA,CAAAoB,aAAA,CAACX,QAAQ;IAACe,IAAI,EAAC;EAAO,gBACpBxB,KAAA,CAAAoB,aAAA,CAACV,KAAK,QAAEO,IAAY,CAAC,eACrBjB,KAAA,CAAAoB,aAAA,CAACT,QAAQ;IAACI,KAAK,EAAC,UAAU;IAAC,kBAAU;IAACU,KAAK,EAAE;MAAEC,UAAU,EAAE;IAAY;EAAE,GACtEP,GACO,CACF,CACV,CAAC;AAAA,CACJ;;AAED;;AAEA,OAAO,MAAMQ,iBAAiB,GAC5BC,KAAoD,iBAEpD5B,KAAA,CAAAoB,aAAA,CAACjB,WAAW,EAAA0B,QAAA;EAACC,IAAI,eAAE9B,KAAA,CAAAoB,aAAA,CAAChB,SAAS,MAAE,CAAE;EAAC2B,KAAK,EAAC;AAAe,GAAKH,KAAK,CAAG,CACrE;AAED,OAAO,MAAMI,cAAc,GAAGA,CAAA,kBAC5BhC,KAAA,CAAAoB,aAAA,CAAApB,KAAA,CAAAqB,QAAA,qBACErB,KAAA,CAAAoB,aAAA,CAACb,KAAK;EAACe,WAAW,EAAErB;AAAmB,gBACrCD,KAAA,CAAAoB,aAAA,CAACf,cAAc;EAACoB,KAAK,EAAE;IAAEQ,KAAK,EAAE,MAAM;IAAEC,MAAM,EAAE;EAAO;AAAE,CAAE,CACtD,CAAC,eACRlC,KAAA,CAAAoB,aAAA,CAACX,QAAQ;EAACe,IAAI,EAAC;AAAO,gBACpBxB,KAAA,CAAAoB,aAAA,CAACf,cAAc;EAACoB,KAAK,EAAE;IAAES,MAAM,EAAE,EAAE;IAAED,KAAK,EAAE;EAAM;AAAE,CAAE,CAAC,eACvDjC,KAAA,CAAAoB,aAAA,CAACf,cAAc;EAAC,kBAAU;EAACoB,KAAK,EAAE;IAAES,MAAM,EAAE,EAAE;IAAED,KAAK,EAAE;EAAG;AAAE,CAAE,CACtD,CACV,CACH","ignoreList":[]}

package/dist/esm/presentation/stackedCard/content/TaskCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TaskCard.d.ts","sourceRoot":"","sources":["../../../../../src/presentation/stackedCard/content/TaskCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AA+I5C,MAAM,WAAW,aAAa;IAC5B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,iEAAiE;IACjE,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,gEAAgE;IAChE,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,wEAAwE;IACxE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,uDAAuD;IACvD,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,2CAA2C;IAC3C,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,gFAAgF;IAChF,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,6EAA6E;IAC7E,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,6DAA6D;IAC7D,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,eAAO,MAAM,QAAQ,GAAI,qLAetB,aAAa,KAAG,YA+FlB,CAAC;AAIF,eAAO,MAAM,eAAe,GAC1B,OAAO,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,KACnD,YAMF,CAAC;AAGF,eAAO,MAAM,YAAY,QAAO,YAiB/B,CAAC"}
+{"version":3,"file":"TaskCard.d.ts","sourceRoot":"","sources":["../../../../../src/presentation/stackedCard/content/TaskCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAkJ5C,MAAM,WAAW,aAAa;IAC5B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,iEAAiE;IACjE,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,gEAAgE;IAChE,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,wEAAwE;IACxE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,uDAAuD;IACvD,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,2CAA2C;IAC3C,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,gFAAgF;IAChF,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,6EAA6E;IAC7E,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,6DAA6D;IAC7D,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,eAAO,MAAM,QAAQ,GAAI,qLAetB,aAAa,KAAG,YA+FlB,CAAC;AAIF,eAAO,MAAM,eAAe,GAC1B,OAAO,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,KACnD,YAMF,CAAC;AAGF,eAAO,MAAM,YAAY,QAAO,YAiB/B,CAAC"}

package/dist/esm/presentation/stackedCard/content/TaskCard.js

@@ -4,11 +4,10 @@ import styled, { css } from "styled-components";
 import { EntityDots, StyledClamp, coverManagement, playControl, Placeholder } from "./shared";
 import { ChecklistSmallIcon, EyeOffIcon, InsertLinkIcon, MessageSmallIcon, PersonPlusIcon } from "../../../components/Icons";
 import { SkeletonLoader } from "../../../components/Loaders";
+import { STACKED_CARD_COVER_RATIO as COVER_RATIO, StackedCardCover as Cover, StackedCardRow as StackRow } from "../../../components/StackedCard";
 import { Caption1 } from "../../../components/Typography";
 import { Typography } from "../../../components/Typography/Typography";
 import { RoundAvatar, AVATAR_COLORS } from "../../shared";
-import { Cover, StackRow } from "../primitives";
-import { COVER_RATIO } from "../shell";
 
 /**
  * TaskCard — the baseline-preservation card.

package/dist/esm/presentation/stackedCard/content/TaskCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"TaskCard.js","names":["React","styled","css","EntityDots","StyledClamp","coverManagement","playControl","Placeholder","ChecklistSmallIcon","EyeOffIcon","InsertLinkIcon","MessageSmallIcon","PersonPlusIcon","SkeletonLoader","Caption1","Typography","RoundAvatar","AVATAR_COLORS","Cover","StackRow","COVER_RATIO","LABEL_DOTS","StyledBody","div","withConfig","displayName","componentId","_ref","$completed","StyledMetaCluster","StyledDot","span","_ref2","$color","StyledHiddenBadge","StyledDate","_ref3","$overdue","StyledAddAssignee","button","TaskCard","_ref4","_ref4$title","title","_ref4$cover","cover","_ref4$playable","playable","_ref4$coverControls","coverControls","_ref4$showTaskId","showTaskId","_ref4$taskId","taskId","_ref4$dateLabel","dateLabel","_ref4$overdue","overdue","_ref4$showDependencie","showDependencies","_ref4$dependencyCount","dependencyCount","_ref4$hiddenFromClien","hiddenFromClients","_ref4$projectDefaultH","projectDefaultHidden","_ref4$assigned","assigned","_ref4$completed","completed","showHiddenSignifier","dateIsOverdue","createElement","aspectRatio","centerSlot","undefined","topRightSlot","style","width","height","background","role","as","variant","color","className","map","key","Fragment","$bg","teal","$size","$bordered","type","TaskPlaceholder","props","_extends","icon","label","TaskSkeleton","borderRadius"],"sources":["../../../../../src/presentation/stackedCard/content/TaskCard.tsx"],"sourcesContent":["import React, { ReactElement } from \"react\";\n\nimport styled, { css } from \"styled-components\";\n\nimport {\n  EntityDots,\n  StyledClamp,\n  coverManagement,\n  playControl,\n  Placeholder,\n} from \"./shared\";\nimport {\n  ChecklistSmallIcon,\n  EyeOffIcon,\n  InsertLinkIcon,\n  MessageSmallIcon,\n  PersonPlusIcon,\n} from \"../../../components/Icons\";\nimport { SkeletonLoader } from \"../../../components/Loaders\";\nimport { Caption1 } from \"../../../components/Typography\";\nimport { Typography } from \"../../../components/Typography/Typography\";\nimport { RoundAvatar, AVATAR_COLORS } from \"../../shared\";\nimport { Cover, StackRow } from \"../primitives\";\nimport { COVER_RATIO } from \"../shell\";\n\n/**\n * TaskCard — the baseline-preservation card.\n *\n * This is the replacement for today's column card, so it must reproduce every\n * behavior that card has (note 52104 §B2) — none of them are optional, each is\n * a silent-regression risk. Every one is a prop here so the story can toggle it:\n *\n *  - task-number prefix in the title      (config-gated, mirrors `show_task_id`)\n *  - overdue date colouring               (red ONLY when overdue AND not completed)\n *  - dependency counter                   (behind a feature-flag prop)\n *  - hidden-from-clients signifier        (shown only when it DIFFERS from the\n *                                          project default)\n *  - inline assignee affordance           (avatar, or an add-assignee placeholder)\n *  - completed                            (teal tint, no \"…\" menu, no overdue colour)\n *\n * The pending/optimistic and priority states are SHELL states (dimmed +\n * pointer-events off; red left bar), so the card is wrapped in a `<StackedCard\n * pending>` / `<StackedCard priorityColor>` by the host — they are not the\n * card's own concern and live on the shell, not here.\n */\n\nconst LABEL_DOTS = [\"#378ADD\", \"#D85A30\", \"#639922\", \"#EF9F27\", \"#7F77DD\"];\n\n/* The completed tint fills the card body; the shell keeps the priority bar and\n   selection ring on top of it. */\nconst StyledBody = styled.div<{ $completed?: boolean }>`\n  display: flex;\n  flex-direction: column;\n\n  ${({ $completed }) =>\n    $completed &&\n    css`\n      background: var(--sc-completed-tint, rgba(72, 201, 176, 0.16));\n    `}\n`;\n\nconst StyledMetaCluster = styled.div`\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  color: var(--color-theme-600);\n\n  .sc-dots {\n    display: flex;\n    gap: 4px;\n  }\n\n  .sc-sep {\n    opacity: 0.6;\n  }\n\n  .sc-count {\n    display: inline-flex;\n    align-items: center;\n    gap: 3px;\n  }\n\n  svg {\n    width: 14px;\n    height: 14px;\n  }\n`;\n\nconst StyledDot = styled.span<{ $color: string }>`\n  width: 11px;\n  height: 11px;\n  border-radius: 50%;\n  background: ${({ $color }) => $color};\n`;\n\n/* Hidden-from-clients signifier — an eye-off badge, shown only when the task's\n   visibility differs from the project default. */\nconst StyledHiddenBadge = styled.span`\n  display: inline-flex;\n  align-items: center;\n  gap: 3px;\n  color: var(--color-theme-600);\n\n  svg {\n    width: 14px;\n    height: 14px;\n  }\n`;\n\n/* Date — bold; turns red only when overdue AND the task is not completed. */\nconst StyledDate = styled.span<{ $overdue?: boolean }>`\n  font-weight: bold;\n  color: ${({ $overdue }) =>\n    $overdue ? \"var(--red-alert)\" : \"var(--color-theme-900)\"};\n`;\n\n/* Inline assignee affordance placeholder — a dashed add-assignee target that\n   stands in until the real picker is wired at integration. */\nconst StyledAddAssignee = styled.button`\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 24px;\n  height: 24px;\n  padding: 0;\n  border: 1.5px dashed var(--color-theme-400);\n  border-radius: 50%;\n  background: transparent;\n  color: var(--color-theme-600);\n  cursor: pointer;\n\n  svg {\n    width: 14px;\n    height: 14px;\n    display: block;\n  }\n\n  &:hover {\n    border-color: var(--sc-selection-ring);\n    color: var(--color-theme-800);\n  }\n`;\n\nexport interface TaskCardProps {\n  title?: string;\n  /** Optional cover — task cards in a column usually have none. */\n  cover?: boolean;\n  playable?: boolean;\n  coverControls?: boolean;\n  /** Config-gated task-number prefix (mirrors `show_task_id`). */\n  showTaskId?: boolean;\n  taskId?: number;\n  dateLabel?: string;\n  /** Overdue date — colours the date red, but only when NOT completed. */\n  overdue?: boolean;\n  /** Dependency counter, gated behind a feature flag. */\n  showDependencies?: boolean;\n  dependencyCount?: number;\n  /** The task's hidden-from-clients flag. */\n  hiddenFromClients?: boolean;\n  /** The project default for client visibility; the signifier shows on a diff. */\n  projectDefaultHidden?: boolean;\n  /** Whether the task has an assignee (avatar) or shows the add affordance. */\n  assigned?: boolean;\n  /** Completed — teal tint, no \"…\" menu, no overdue colour. */\n  completed?: boolean;\n}\n\nexport const TaskCard = ({\n  title = \"Implement the design from the reference on this page\",\n  cover = false,\n  playable = false,\n  coverControls = false,\n  showTaskId = false,\n  taskId = 4521,\n  dateLabel = \"May 8 – Sep 10\",\n  overdue = false,\n  showDependencies = false,\n  dependencyCount = 2,\n  hiddenFromClients = false,\n  projectDefaultHidden = false,\n  assigned = true,\n  completed = false,\n}: TaskCardProps): ReactElement => {\n  // Signifier appears only when the task's visibility differs from the default.\n  const showHiddenSignifier = hiddenFromClients !== projectDefaultHidden;\n  // Overdue colour is suppressed on completed tasks.\n  const dateIsOverdue = overdue && !completed;\n\n  return (\n    <StyledBody $completed={completed}>\n      {cover ? (\n        <Cover\n          aspectRatio={COVER_RATIO}\n          centerSlot={playable ? playControl : undefined}\n          topRightSlot={coverControls ? coverManagement() : undefined}\n        >\n          <div\n            style={{\n              width: \"100%\",\n              height: \"100%\",\n              background: \"var(--color-theme-300)\",\n            }}\n          />\n        </Cover>\n      ) : null}\n\n      <StackRow role=\"title\">\n        <StyledClamp>\n          {showTaskId ? (\n            <Typography as=\"span\" variant=\"Caption 1\" color=\"tertiary\">\n              {`#${taskId} `}\n            </Typography>\n          ) : null}\n          {title}\n        </StyledClamp>\n        {/* Completed tasks drop the \"…\" menu. */}\n        {completed ? null : <EntityDots aria-label=\"Task options\" />}\n      </StackRow>\n\n      <StackRow role=\"meta\">\n        <StyledMetaCluster>\n          <span className=\"sc-dots\">\n            {LABEL_DOTS.map((color) => (\n              <StyledDot key={color} $color={color} />\n            ))}\n          </span>\n          <Caption1 color=\"tertiary\">+3</Caption1>\n          <span className=\"sc-sep\">·</span>\n          <span className=\"sc-count\">\n            <MessageSmallIcon />\n            <Caption1 color=\"tertiary\">7</Caption1>\n          </span>\n          <span className=\"sc-sep\">·</span>\n          <span className=\"sc-count\">\n            <ChecklistSmallIcon />\n            <Caption1 color=\"tertiary\">2</Caption1>\n          </span>\n          {showDependencies ? (\n            <>\n              <span className=\"sc-sep\">·</span>\n              <span className=\"sc-count\" title=\"Dependencies\">\n                <InsertLinkIcon />\n                <Caption1 color=\"tertiary\">{dependencyCount}</Caption1>\n              </span>\n            </>\n          ) : null}\n          {showHiddenSignifier ? (\n            <>\n              <span className=\"sc-sep\">·</span>\n              <StyledHiddenBadge title=\"Hidden from clients\">\n                <EyeOffIcon />\n              </StyledHiddenBadge>\n            </>\n          ) : null}\n        </StyledMetaCluster>\n      </StackRow>\n\n      <StackRow role=\"footer\">\n        <StyledDate $overdue={dateIsOverdue}>{dateLabel}</StyledDate>\n        <span />\n        {assigned ? (\n          <RoundAvatar\n            $bg={AVATAR_COLORS.teal}\n            $size={24}\n            $bordered={false}\n            data-fixed\n          >\n            MS\n          </RoundAvatar>\n        ) : (\n          <StyledAddAssignee type=\"button\" aria-label=\"Assign task\" data-fixed>\n            <PersonPlusIcon />\n          </StyledAddAssignee>\n        )}\n      </StackRow>\n    </StyledBody>\n  );\n};\n\n/* ---- placeholder + skeleton ---- */\n\nexport const TaskPlaceholder = (\n  props: React.ButtonHTMLAttributes<HTMLButtonElement>\n): ReactElement => (\n  <Placeholder\n    icon={<ChecklistSmallIcon />}\n    label=\"Name this task\"\n    {...props}\n  />\n);\n\n/* Skeleton mirrors the task anatomy row for row: title, meta, footer. */\nexport const TaskSkeleton = (): ReactElement => (\n  <>\n    <StackRow role=\"title\">\n      <SkeletonLoader style={{ height: 14, width: \"90%\" }} />\n    </StackRow>\n    <StackRow role=\"meta\">\n      <SkeletonLoader style={{ height: 10, width: \"55%\" }} />\n    </StackRow>\n    <StackRow role=\"footer\">\n      <SkeletonLoader style={{ height: 12, width: 64 }} data-fixed />\n      <span />\n      <SkeletonLoader\n        data-fixed\n        style={{ width: 24, height: 24, borderRadius: \"50%\" }}\n      />\n    </StackRow>\n  </>\n);\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"TaskCard.js","names":["React","styled","css","EntityDots","StyledClamp","coverManagement","playControl","Placeholder","ChecklistSmallIcon","EyeOffIcon","InsertLinkIcon","MessageSmallIcon","PersonPlusIcon","SkeletonLoader","STACKED_CARD_COVER_RATIO","COVER_RATIO","StackedCardCover","Cover","StackedCardRow","StackRow","Caption1","Typography","RoundAvatar","AVATAR_COLORS","LABEL_DOTS","StyledBody","div","withConfig","displayName","componentId","_ref","$completed","StyledMetaCluster","StyledDot","span","_ref2","$color","StyledHiddenBadge","StyledDate","_ref3","$overdue","StyledAddAssignee","button","TaskCard","_ref4","_ref4$title","title","_ref4$cover","cover","_ref4$playable","playable","_ref4$coverControls","coverControls","_ref4$showTaskId","showTaskId","_ref4$taskId","taskId","_ref4$dateLabel","dateLabel","_ref4$overdue","overdue","_ref4$showDependencie","showDependencies","_ref4$dependencyCount","dependencyCount","_ref4$hiddenFromClien","hiddenFromClients","_ref4$projectDefaultH","projectDefaultHidden","_ref4$assigned","assigned","_ref4$completed","completed","showHiddenSignifier","dateIsOverdue","createElement","aspectRatio","centerSlot","undefined","topRightSlot","style","width","height","background","role","as","variant","color","className","map","key","Fragment","$bg","teal","$size","$bordered","type","TaskPlaceholder","props","_extends","icon","label","TaskSkeleton","borderRadius"],"sources":["../../../../../src/presentation/stackedCard/content/TaskCard.tsx"],"sourcesContent":["import React, { ReactElement } from \"react\";\n\nimport styled, { css } from \"styled-components\";\n\nimport {\n  EntityDots,\n  StyledClamp,\n  coverManagement,\n  playControl,\n  Placeholder,\n} from \"./shared\";\nimport {\n  ChecklistSmallIcon,\n  EyeOffIcon,\n  InsertLinkIcon,\n  MessageSmallIcon,\n  PersonPlusIcon,\n} from \"../../../components/Icons\";\nimport { SkeletonLoader } from \"../../../components/Loaders\";\nimport {\n  STACKED_CARD_COVER_RATIO as COVER_RATIO,\n  StackedCardCover as Cover,\n  StackedCardRow as StackRow,\n} from \"../../../components/StackedCard\";\nimport { Caption1 } from \"../../../components/Typography\";\nimport { Typography } from \"../../../components/Typography/Typography\";\nimport { RoundAvatar, AVATAR_COLORS } from \"../../shared\";\n\n/**\n * TaskCard — the baseline-preservation card.\n *\n * This is the replacement for today's column card, so it must reproduce every\n * behavior that card has (note 52104 §B2) — none of them are optional, each is\n * a silent-regression risk. Every one is a prop here so the story can toggle it:\n *\n *  - task-number prefix in the title      (config-gated, mirrors `show_task_id`)\n *  - overdue date colouring               (red ONLY when overdue AND not completed)\n *  - dependency counter                   (behind a feature-flag prop)\n *  - hidden-from-clients signifier        (shown only when it DIFFERS from the\n *                                          project default)\n *  - inline assignee affordance           (avatar, or an add-assignee placeholder)\n *  - completed                            (teal tint, no \"…\" menu, no overdue colour)\n *\n * The pending/optimistic and priority states are SHELL states (dimmed +\n * pointer-events off; red left bar), so the card is wrapped in a `<StackedCard\n * pending>` / `<StackedCard priorityColor>` by the host — they are not the\n * card's own concern and live on the shell, not here.\n */\n\nconst LABEL_DOTS = [\"#378ADD\", \"#D85A30\", \"#639922\", \"#EF9F27\", \"#7F77DD\"];\n\n/* The completed tint fills the card body; the shell keeps the priority bar and\n   selection ring on top of it. */\nconst StyledBody = styled.div<{ $completed?: boolean }>`\n  display: flex;\n  flex-direction: column;\n\n  ${({ $completed }) =>\n    $completed &&\n    css`\n      background: var(--sc-completed-tint, rgba(72, 201, 176, 0.16));\n    `}\n`;\n\nconst StyledMetaCluster = styled.div`\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  color: var(--color-theme-600);\n\n  .sc-dots {\n    display: flex;\n    gap: 4px;\n  }\n\n  .sc-sep {\n    opacity: 0.6;\n  }\n\n  .sc-count {\n    display: inline-flex;\n    align-items: center;\n    gap: 3px;\n  }\n\n  svg {\n    width: 14px;\n    height: 14px;\n  }\n`;\n\nconst StyledDot = styled.span<{ $color: string }>`\n  width: 11px;\n  height: 11px;\n  border-radius: 50%;\n  background: ${({ $color }) => $color};\n`;\n\n/* Hidden-from-clients signifier — an eye-off badge, shown only when the task's\n   visibility differs from the project default. */\nconst StyledHiddenBadge = styled.span`\n  display: inline-flex;\n  align-items: center;\n  gap: 3px;\n  color: var(--color-theme-600);\n\n  svg {\n    width: 14px;\n    height: 14px;\n  }\n`;\n\n/* Date — bold; turns red only when overdue AND the task is not completed. */\nconst StyledDate = styled.span<{ $overdue?: boolean }>`\n  font-weight: bold;\n  color: ${({ $overdue }) =>\n    $overdue ? \"var(--red-alert)\" : \"var(--color-theme-900)\"};\n`;\n\n/* Inline assignee affordance placeholder — a dashed add-assignee target that\n   stands in until the real picker is wired at integration. */\nconst StyledAddAssignee = styled.button`\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 24px;\n  height: 24px;\n  padding: 0;\n  border: 1.5px dashed var(--color-theme-400);\n  border-radius: 50%;\n  background: transparent;\n  color: var(--color-theme-600);\n  cursor: pointer;\n\n  svg {\n    width: 14px;\n    height: 14px;\n    display: block;\n  }\n\n  &:hover {\n    border-color: var(--sc-selection-ring);\n    color: var(--color-theme-800);\n  }\n`;\n\nexport interface TaskCardProps {\n  title?: string;\n  /** Optional cover — task cards in a column usually have none. */\n  cover?: boolean;\n  playable?: boolean;\n  coverControls?: boolean;\n  /** Config-gated task-number prefix (mirrors `show_task_id`). */\n  showTaskId?: boolean;\n  taskId?: number;\n  dateLabel?: string;\n  /** Overdue date — colours the date red, but only when NOT completed. */\n  overdue?: boolean;\n  /** Dependency counter, gated behind a feature flag. */\n  showDependencies?: boolean;\n  dependencyCount?: number;\n  /** The task's hidden-from-clients flag. */\n  hiddenFromClients?: boolean;\n  /** The project default for client visibility; the signifier shows on a diff. */\n  projectDefaultHidden?: boolean;\n  /** Whether the task has an assignee (avatar) or shows the add affordance. */\n  assigned?: boolean;\n  /** Completed — teal tint, no \"…\" menu, no overdue colour. */\n  completed?: boolean;\n}\n\nexport const TaskCard = ({\n  title = \"Implement the design from the reference on this page\",\n  cover = false,\n  playable = false,\n  coverControls = false,\n  showTaskId = false,\n  taskId = 4521,\n  dateLabel = \"May 8 – Sep 10\",\n  overdue = false,\n  showDependencies = false,\n  dependencyCount = 2,\n  hiddenFromClients = false,\n  projectDefaultHidden = false,\n  assigned = true,\n  completed = false,\n}: TaskCardProps): ReactElement => {\n  // Signifier appears only when the task's visibility differs from the default.\n  const showHiddenSignifier = hiddenFromClients !== projectDefaultHidden;\n  // Overdue colour is suppressed on completed tasks.\n  const dateIsOverdue = overdue && !completed;\n\n  return (\n    <StyledBody $completed={completed}>\n      {cover ? (\n        <Cover\n          aspectRatio={COVER_RATIO}\n          centerSlot={playable ? playControl : undefined}\n          topRightSlot={coverControls ? coverManagement() : undefined}\n        >\n          <div\n            style={{\n              width: \"100%\",\n              height: \"100%\",\n              background: \"var(--color-theme-300)\",\n            }}\n          />\n        </Cover>\n      ) : null}\n\n      <StackRow role=\"title\">\n        <StyledClamp>\n          {showTaskId ? (\n            <Typography as=\"span\" variant=\"Caption 1\" color=\"tertiary\">\n              {`#${taskId} `}\n            </Typography>\n          ) : null}\n          {title}\n        </StyledClamp>\n        {/* Completed tasks drop the \"…\" menu. */}\n        {completed ? null : <EntityDots aria-label=\"Task options\" />}\n      </StackRow>\n\n      <StackRow role=\"meta\">\n        <StyledMetaCluster>\n          <span className=\"sc-dots\">\n            {LABEL_DOTS.map((color) => (\n              <StyledDot key={color} $color={color} />\n            ))}\n          </span>\n          <Caption1 color=\"tertiary\">+3</Caption1>\n          <span className=\"sc-sep\">·</span>\n          <span className=\"sc-count\">\n            <MessageSmallIcon />\n            <Caption1 color=\"tertiary\">7</Caption1>\n          </span>\n          <span className=\"sc-sep\">·</span>\n          <span className=\"sc-count\">\n            <ChecklistSmallIcon />\n            <Caption1 color=\"tertiary\">2</Caption1>\n          </span>\n          {showDependencies ? (\n            <>\n              <span className=\"sc-sep\">·</span>\n              <span className=\"sc-count\" title=\"Dependencies\">\n                <InsertLinkIcon />\n                <Caption1 color=\"tertiary\">{dependencyCount}</Caption1>\n              </span>\n            </>\n          ) : null}\n          {showHiddenSignifier ? (\n            <>\n              <span className=\"sc-sep\">·</span>\n              <StyledHiddenBadge title=\"Hidden from clients\">\n                <EyeOffIcon />\n              </StyledHiddenBadge>\n            </>\n          ) : null}\n        </StyledMetaCluster>\n      </StackRow>\n\n      <StackRow role=\"footer\">\n        <StyledDate $overdue={dateIsOverdue}>{dateLabel}</StyledDate>\n        <span />\n        {assigned ? (\n          <RoundAvatar\n            $bg={AVATAR_COLORS.teal}\n            $size={24}\n            $bordered={false}\n            data-fixed\n          >\n            MS\n          </RoundAvatar>\n        ) : (\n          <StyledAddAssignee type=\"button\" aria-label=\"Assign task\" data-fixed>\n            <PersonPlusIcon />\n          </StyledAddAssignee>\n        )}\n      </StackRow>\n    </StyledBody>\n  );\n};\n\n/* ---- placeholder + skeleton ---- */\n\nexport const TaskPlaceholder = (\n  props: React.ButtonHTMLAttributes<HTMLButtonElement>\n): ReactElement => (\n  <Placeholder\n    icon={<ChecklistSmallIcon />}\n    label=\"Name this task\"\n    {...props}\n  />\n);\n\n/* Skeleton mirrors the task anatomy row for row: title, meta, footer. */\nexport const TaskSkeleton = (): ReactElement => (\n  <>\n    <StackRow role=\"title\">\n      <SkeletonLoader style={{ height: 14, width: \"90%\" }} />\n    </StackRow>\n    <StackRow role=\"meta\">\n      <SkeletonLoader style={{ height: 10, width: \"55%\" }} />\n    </StackRow>\n    <StackRow role=\"footer\">\n      <SkeletonLoader style={{ height: 12, width: 64 }} data-fixed />\n      <span />\n      <SkeletonLoader\n        data-fixed\n        style={{ width: 24, height: 24, borderRadius: \"50%\" }}\n      />\n    </StackRow>\n  </>\n);\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/presentation/stackedCard/content/shared.d.ts

@@ -6,7 +6,22 @@ import React, { ReactElement, ReactNode } from "react";
  * menu, the cover-management controls, the clamp, the favicon, the chips and
  * the placeholder frame are content concerns, so they belong here where the
  * typed cards (TaskCard, LinkCard, …) compose them.
+ *
+ * The card itself — the shell, the Stack/StackRow/Cover primitives and the
+ * cover chrome — is the shipped design-system component,
+ * `components/StackedCard`. These stories import it under the concept
+ * vocabulary (Cover, StackRow, …) so the spec prose and the code keep using
+ * the same words.
+ */
+/**
+ * The design system ships one default cover ratio
+ * (`STACKED_CARD_COVER_RATIO`). How tall a cover reads is a decision of the
+ * content type, so the variants live here with the content: a link hero, a
+ * full-bleed image, a colour swatch band.
  */
+export declare const COVER_RATIO_HERO = "320 / 190";
+export declare const COVER_RATIO_IMAGE = "260 / 168";
+export declare const COVER_RATIO_SWATCH = "260 / 104";
 /** Centered media control (play), for a cover that wraps audio/video. */
 export declare const playControl: React.JSX.Element;
 /**

package/dist/esm/presentation/stackedCard/content/shared.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"shared.d.ts","sourceRoot":"","sources":["../../../../../src/presentation/stackedCard/content/shared.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAcvD;;;;;;;GAOG;AAMH,yEAAyE;AACzE,eAAO,MAAM,WAAW,mBAIvB,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,eAAe,GAAI,yCAI7B;IACD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;CAClB,KAAG,YASR,CAAC;AA8BF,eAAO,MAAM,UAAU,GACrB,OAAO,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,KACnD,YAUF,CAAC;AAMF,0DAA0D;AAC1D,eAAO,MAAM,WAAW,sQAKvB,CAAC;AAEF,6EAA6E;AAC7E,eAAO,MAAM,aAAa;SAAsB,MAAM;SAOrD,CAAC;AAEF,gEAAgE;AAChE,eAAO,MAAM,UAAU,qEAStB,CAAC;AAEF,oFAAoF;AACpF,eAAO,MAAM,gBAAgB;YAAwB,MAAM;SAI1D,CAAC;AA6CF;;;;GAIG;AACH,eAAO,MAAM,WAAW,GAAI,0CAMzB;IACD,IAAI,EAAE,SAAS,CAAC;IAChB,KAAK,EAAE,SAAS,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB,GAAG,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,KAAG,YAOnD,CAAC"}
+{"version":3,"file":"shared.d.ts","sourceRoot":"","sources":["../../../../../src/presentation/stackedCard/content/shared.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAevD;;;;;;;;;;;;;GAaG;AAMH;;;;;GAKG;AACH,eAAO,MAAM,gBAAgB,cAAc,CAAC;AAC5C,eAAO,MAAM,iBAAiB,cAAc,CAAC;AAC7C,eAAO,MAAM,kBAAkB,cAAc,CAAC;AAM9C,yEAAyE;AACzE,eAAO,MAAM,WAAW,mBAIvB,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,eAAe,GAAI,yCAI7B;IACD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;CAClB,KAAG,YASR,CAAC;AA8BF,eAAO,MAAM,UAAU,GACrB,OAAO,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,KACnD,YAUF,CAAC;AAMF,0DAA0D;AAC1D,eAAO,MAAM,WAAW,sQAKvB,CAAC;AAEF,6EAA6E;AAC7E,eAAO,MAAM,aAAa;SAAsB,MAAM;SAOrD,CAAC;AAEF,gEAAgE;AAChE,eAAO,MAAM,UAAU,qEAStB,CAAC;AAEF,oFAAoF;AACpF,eAAO,MAAM,gBAAgB;YAAwB,MAAM;SAI1D,CAAC;AA6CF;;;;GAIG;AACH,eAAO,MAAM,WAAW,GAAI,0CAMzB;IACD,IAAI,EAAE,SAAS,CAAC;IAChB,KAAK,EAAE,SAAS,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB,GAAG,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,KAAG,YAOnD,CAAC"}

package/dist/esm/presentation/stackedCard/content/shared.js

@@ -4,9 +4,9 @@ const _excluded = ["icon", "label", "height", "dashed"];
 import React from "react";
 import styled, { css } from "styled-components";
 import { PlayIcon, TreeDotsIcon } from "../../../components/Icons";
+import { STACKED_CARD_CONTROL_CLASS, StackedCardCollapseGlyph as CollapseGlyph, StackedCardCoverButton as CoverButton, StackedCardPlayBadge as PlayBadge, StackedCardRemoveCoverGlyph as RemoveCoverGlyph } from "../../../components/StackedCard";
 import { Body2 } from "../../../components/Typography";
 import { Typography } from "../../../components/Typography/Typography";
-import { CollapseGlyph, CoverButton, PlayBadge, RemoveCoverGlyph } from "../primitives";
 
 /**
  * Content-level chrome shared by the typed StackedCard components.
@@ -15,7 +15,27 @@ import { CollapseGlyph, CoverButton, PlayBadge, RemoveCoverGlyph } from "../prim
  * menu, the cover-management controls, the clamp, the favicon, the chips and
  * the placeholder frame are content concerns, so they belong here where the
  * typed cards (TaskCard, LinkCard, …) compose them.
+ *
+ * The card itself — the shell, the Stack/StackRow/Cover primitives and the
+ * cover chrome — is the shipped design-system component,
+ * `components/StackedCard`. These stories import it under the concept
+ * vocabulary (Cover, StackRow, …) so the spec prose and the code keep using
+ * the same words.
+ */
+
+/* ------------------------------------------------------------------ */
+/* Per-type cover ratios                                               */
+/* ------------------------------------------------------------------ */
+
+/**
+ * The design system ships one default cover ratio
+ * (`STACKED_CARD_COVER_RATIO`). How tall a cover reads is a decision of the
+ * content type, so the variants live here with the content: a link hero, a
+ * full-bleed image, a colour swatch band.
  */
+export const COVER_RATIO_HERO = "320 / 190";
+export const COVER_RATIO_IMAGE = "260 / 168";
+export const COVER_RATIO_SWATCH = "260 / 104";
 
 /* ------------------------------------------------------------------ */
 /* Cover chrome — media control + cover management                     */
@@ -58,7 +78,7 @@ export const EntityDots = props => /*#__PURE__*/React.createElement(StyledEntity
   type: "button",
   "aria-label": "Options",
   "data-fixed": true,
-  className: "sc-control"
+  className: STACKED_CARD_CONTROL_CLASS
 }, props), /*#__PURE__*/React.createElement(TreeDotsIcon, null));
 
 /* ------------------------------------------------------------------ */

package/dist/esm/presentation/stackedCard/content/shared.js.map

@@ -1 +1 @@
-{"version":3,"file":"shared.js","names":["React","styled","css","PlayIcon","TreeDotsIcon","Body2","Typography","CollapseGlyph","CoverButton","PlayBadge","RemoveCoverGlyph","playControl","createElement","coverManagement","_temp","_ref","_ref$removeLabel","removeLabel","onCollapse","onRemove","Fragment","type","onClick","StyledEntityDots","button","withConfig","displayName","componentId","EntityDots","props","_extends","className","StyledClamp","StyledFavicon","span","_ref2","$bg","StyledChip","StyledColorCover","div","_ref3","$color","StyledPlaceholder","_ref4","$height","_ref5","$dashed","Placeholder","_ref6","icon","label","height","dashed","rest","_objectWithoutPropertiesLoose","_excluded","as","variant","color"],"sources":["../../../../../src/presentation/stackedCard/content/shared.tsx"],"sourcesContent":["import React, { ReactElement, ReactNode } from \"react\";\n\nimport styled, { css } from \"styled-components\";\n\nimport { PlayIcon, TreeDotsIcon } from \"../../../components/Icons\";\nimport { Body2 } from \"../../../components/Typography\";\nimport { Typography } from \"../../../components/Typography/Typography\";\nimport {\n  CollapseGlyph,\n  CoverButton,\n  PlayBadge,\n  RemoveCoverGlyph,\n} from \"../primitives\";\n\n/**\n * Content-level chrome shared by the typed StackedCard components.\n *\n * These live OUTSIDE the shell on purpose. The shell is hollow; the \"…\" entity\n * menu, the cover-management controls, the clamp, the favicon, the chips and\n * the placeholder frame are content concerns, so they belong here where the\n * typed cards (TaskCard, LinkCard, …) compose them.\n */\n\n/* ------------------------------------------------------------------ */\n/* Cover chrome — media control + cover management                     */\n/* ------------------------------------------------------------------ */\n\n/** Centered media control (play), for a cover that wraps audio/video. */\nexport const playControl = (\n  <PlayBadge>\n    <PlayIcon />\n  </PlayBadge>\n);\n\n/**\n * Top-right cover management. Acts on the COVER (collapse it, remove it) — not\n * on the entity. Callers wire the click handlers; the default is inert chrome\n * for the static demos.\n */\nexport const coverManagement = ({\n  removeLabel = \"Remove cover\",\n  onCollapse,\n  onRemove,\n}: {\n  removeLabel?: string;\n  onCollapse?: () => void;\n  onRemove?: () => void;\n} = {}): ReactElement => (\n  <>\n    <CoverButton type=\"button\" aria-label=\"Collapse cover\" onClick={onCollapse}>\n      <CollapseGlyph />\n    </CoverButton>\n    <CoverButton type=\"button\" aria-label={removeLabel} onClick={onRemove}>\n      <RemoveCoverGlyph />\n    </CoverButton>\n  </>\n);\n\n/* ------------------------------------------------------------------ */\n/* Entity \"…\" menu — acts on the ENTITY, lives in a content row         */\n/* ------------------------------------------------------------------ */\n\nconst StyledEntityDots = styled.button`\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 26px;\n  height: 26px;\n  padding: 0;\n  border: 0;\n  border-radius: 6px;\n  cursor: pointer;\n  color: var(--color-theme-700);\n  background: var(--color-theme-200);\n\n  svg {\n    width: 16px;\n    height: 16px;\n    display: block;\n  }\n\n  &:hover {\n    background: var(--color-theme-300);\n  }\n`;\n\nexport const EntityDots = (\n  props: React.ButtonHTMLAttributes<HTMLButtonElement>\n): ReactElement => (\n  <StyledEntityDots\n    type=\"button\"\n    aria-label=\"Options\"\n    data-fixed\n    className=\"sc-control\"\n    {...props}\n  >\n    <TreeDotsIcon />\n  </StyledEntityDots>\n);\n\n/* ------------------------------------------------------------------ */\n/* Text + inline bits                                                   */\n/* ------------------------------------------------------------------ */\n\n/** Two-line title clamp — the card's name row content. */\nexport const StyledClamp = styled(Body2)`\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n`;\n\n/** A favicon square — a solid data colour stands in for the real favicon. */\nexport const StyledFavicon = styled.span<{ $bg: string }>`\n  display: inline-flex;\n  width: 16px;\n  height: 16px;\n  border-radius: 4px;\n  background: ${({ $bg }) => $bg};\n  flex-shrink: 0;\n`;\n\n/** A small pill for link metadata (media kind, duration, …). */\nexport const StyledChip = styled.span`\n  display: inline-flex;\n  align-items: center;\n  padding: 2px 8px;\n  border-radius: 10px;\n  background: var(--color-theme-300);\n  color: var(--color-theme-800);\n  font-size: 11px;\n  white-space: nowrap;\n`;\n\n/** A solid-colour cover fill (swatch value, generic link cover, image stand-in). */\nexport const StyledColorCover = styled.div<{ $color: string }>`\n  width: 100%;\n  height: 100%;\n  background: ${({ $color }) => $color};\n`;\n\n/* ------------------------------------------------------------------ */\n/* Placeholder frame — the interactive empty state, per type           */\n/* ------------------------------------------------------------------ */\n\nconst StyledPlaceholder = styled.button<{\n  $height?: number;\n  $dashed?: boolean;\n}>`\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: 10px;\n  width: 100%;\n  height: ${({ $height }) => $height ?? 150}px;\n  padding: 0;\n  border: 0;\n  background: transparent;\n  color: var(--color-theme-600);\n  text-align: center;\n  cursor: pointer;\n\n  ${({ $dashed }) =>\n    $dashed &&\n    css`\n      margin: 8px;\n      width: calc(100% - 16px);\n      border: 1.5px dashed var(--color-theme-400);\n      border-radius: 6px;\n\n      &:hover {\n        border-color: var(--sc-selection-ring);\n        color: var(--color-theme-700);\n      }\n    `}\n\n  > svg {\n    width: 40px;\n    height: 40px;\n    color: var(--color-theme-500);\n  }\n`;\n\n/**\n * The shared placeholder frame. Each type supplies its own icon and verb-first,\n * sentence-case invitation (ActiveCollab voice). Interactive by design — the\n * whole frame is a button — and distinct from the loading skeleton.\n */\nexport const Placeholder = ({\n  icon,\n  label,\n  height,\n  dashed,\n  ...rest\n}: {\n  icon: ReactNode;\n  label: ReactNode;\n  height?: number;\n  dashed?: boolean;\n} & React.ButtonHTMLAttributes<HTMLButtonElement>): ReactElement => (\n  <StyledPlaceholder type=\"button\" $height={height} $dashed={dashed} {...rest}>\n    {icon}\n    <Typography as=\"span\" variant=\"Body 2\" color=\"secondary\">\n      {label}\n    </Typography>\n  </StyledPlaceholder>\n);\n"],"mappings":";;;AAAA,OAAOA,KAAK,MAAmC,OAAO;AAEtD,OAAOC,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAE/C,SAASC,QAAQ,EAAEC,YAAY,QAAQ,2BAA2B;AAClE,SAASC,KAAK,QAAQ,gCAAgC;AACtD,SAASC,UAAU,QAAQ,2CAA2C;AACtE,SACEC,aAAa,EACbC,WAAW,EACXC,SAAS,EACTC,gBAAgB,QACX,eAAe;;AAEtB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA,OAAO,MAAMC,WAAW,gBACtBX,KAAA,CAAAY,aAAA,CAACH,SAAS,qBACRT,KAAA,CAAAY,aAAA,CAACT,QAAQ,MAAE,CACF,CACZ;;AAED;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMU,eAAe,GAAG,SAAAA,CAAAC,KAAA;EAAA,IAAAC,IAAA,GAAAD,KAAA,cAQ3B,CAAC,CAAC,GAAAA,KAAA;IAAAE,gBAAA,GAAAD,IAAA,CAPJE,WAAW;IAAXA,WAAW,GAAAD,gBAAA,cAAG,cAAc,GAAAA,gBAAA;IAC5BE,UAAU,GAAAH,IAAA,CAAVG,UAAU;IACVC,QAAQ,GAAAJ,IAAA,CAARI,QAAQ;EAAA,oBAMRnB,KAAA,CAAAY,aAAA,CAAAZ,KAAA,CAAAoB,QAAA,qBACEpB,KAAA,CAAAY,aAAA,CAACJ,WAAW;IAACa,IAAI,EAAC,QAAQ;IAAC,cAAW,gBAAgB;IAACC,OAAO,EAAEJ;EAAW,gBACzElB,KAAA,CAAAY,aAAA,CAACL,aAAa,MAAE,CACL,CAAC,eACdP,KAAA,CAAAY,aAAA,CAACJ,WAAW;IAACa,IAAI,EAAC,QAAQ;IAAC,cAAYJ,WAAY;IAACK,OAAO,EAAEH;EAAS,gBACpEnB,KAAA,CAAAY,aAAA,CAACF,gBAAgB,MAAE,CACR,CACb,CAAC;AAAA,CACJ;;AAED;AACA;AACA;;AAEA,MAAMa,gBAAgB,GAAGtB,MAAM,CAACuB,MAAM,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,qSAsBrC;AAED,OAAO,MAAMC,UAAU,GACrBC,KAAoD,iBAEpD7B,KAAA,CAAAY,aAAA,CAACW,gBAAgB,EAAAO,QAAA;EACfT,IAAI,EAAC,QAAQ;EACb,cAAW,SAAS;EACpB,kBAAU;EACVU,SAAS,EAAC;AAAY,GAClBF,KAAK,gBAET7B,KAAA,CAAAY,aAAA,CAACR,YAAY,MAAE,CACC,CACnB;;AAED;AACA;AACA;;AAEA;AACA,OAAO,MAAM4B,WAAW,GAAG/B,MAAM,CAACI,KAAK,CAAC,CAAAoB,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,6FAKvC;;AAED;AACA,OAAO,MAAMM,aAAa,GAAGhC,MAAM,CAACiC,IAAI,CAAAT,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,oGAKxBQ,KAAA;EAAA,IAAGC,GAAG,GAAAD,KAAA,CAAHC,GAAG;EAAA,OAAOA,GAAG;AAAA,EAE/B;;AAED;AACA,OAAO,MAAMC,UAAU,GAAGpC,MAAM,CAACiC,IAAI,CAAAT,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,mLASpC;;AAED;AACA,OAAO,MAAMW,gBAAgB,GAAGrC,MAAM,CAACsC,GAAG,CAAAd,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,gDAG1Ba,KAAA;EAAA,IAAGC,MAAM,GAAAD,KAAA,CAANC,MAAM;EAAA,OAAOA,MAAM;AAAA,EACrC;;AAED;AACA;AACA;;AAEA,MAAMC,iBAAiB,GAAGzC,MAAM,CAACuB,MAAM,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,gSAU3BgB,KAAA;EAAA,IAAGC,OAAO,GAAAD,KAAA,CAAPC,OAAO;EAAA,OAAOA,OAAO,WAAPA,OAAO,GAAI,GAAG;AAAA,GAQvCC,KAAA;EAAA,IAAGC,OAAO,GAAAD,KAAA,CAAPC,OAAO;EAAA,OACVA,OAAO,IACP5C,GAAG,kLAUF;AAAA,EAOJ;;AAED;AACA;AACA;AACA;AACA;AACA,OAAO,MAAM6C,WAAW,GAAGC,KAAA;EAAA,IACzBC,IAAI,GAAAD,KAAA,CAAJC,IAAI;IACJC,KAAK,GAAAF,KAAA,CAALE,KAAK;IACLC,MAAM,GAAAH,KAAA,CAANG,MAAM;IACNC,MAAM,GAAAJ,KAAA,CAANI,MAAM;IACHC,IAAI,GAAAC,6BAAA,CAAAN,KAAA,EAAAO,SAAA;EAAA,oBAOPvD,KAAA,CAAAY,aAAA,CAAC8B,iBAAiB,EAAAZ,QAAA;IAACT,IAAI,EAAC,QAAQ;IAACuB,OAAO,EAAEO,MAAO;IAACL,OAAO,EAAEM;EAAO,GAAKC,IAAI,GACxEJ,IAAI,eACLjD,KAAA,CAAAY,aAAA,CAACN,UAAU;IAACkD,EAAE,EAAC,MAAM;IAACC,OAAO,EAAC,QAAQ;IAACC,KAAK,EAAC;EAAW,GACrDR,KACS,CACK,CAAC;AAAA,CACrB","ignoreList":[]}
+{"version":3,"file":"shared.js","names":["React","styled","css","PlayIcon","TreeDotsIcon","STACKED_CARD_CONTROL_CLASS","StackedCardCollapseGlyph","CollapseGlyph","StackedCardCoverButton","CoverButton","StackedCardPlayBadge","PlayBadge","StackedCardRemoveCoverGlyph","RemoveCoverGlyph","Body2","Typography","COVER_RATIO_HERO","COVER_RATIO_IMAGE","COVER_RATIO_SWATCH","playControl","createElement","coverManagement","_temp","_ref","_ref$removeLabel","removeLabel","onCollapse","onRemove","Fragment","type","onClick","StyledEntityDots","button","withConfig","displayName","componentId","EntityDots","props","_extends","className","StyledClamp","StyledFavicon","span","_ref2","$bg","StyledChip","StyledColorCover","div","_ref3","$color","StyledPlaceholder","_ref4","$height","_ref5","$dashed","Placeholder","_ref6","icon","label","height","dashed","rest","_objectWithoutPropertiesLoose","_excluded","as","variant","color"],"sources":["../../../../../src/presentation/stackedCard/content/shared.tsx"],"sourcesContent":["import React, { ReactElement, ReactNode } from \"react\";\n\nimport styled, { css } from \"styled-components\";\n\nimport { PlayIcon, TreeDotsIcon } from \"../../../components/Icons\";\nimport {\n  STACKED_CARD_CONTROL_CLASS,\n  StackedCardCollapseGlyph as CollapseGlyph,\n  StackedCardCoverButton as CoverButton,\n  StackedCardPlayBadge as PlayBadge,\n  StackedCardRemoveCoverGlyph as RemoveCoverGlyph,\n} from \"../../../components/StackedCard\";\nimport { Body2 } from \"../../../components/Typography\";\nimport { Typography } from \"../../../components/Typography/Typography\";\n\n/**\n * Content-level chrome shared by the typed StackedCard components.\n *\n * These live OUTSIDE the shell on purpose. The shell is hollow; the \"…\" entity\n * menu, the cover-management controls, the clamp, the favicon, the chips and\n * the placeholder frame are content concerns, so they belong here where the\n * typed cards (TaskCard, LinkCard, …) compose them.\n *\n * The card itself — the shell, the Stack/StackRow/Cover primitives and the\n * cover chrome — is the shipped design-system component,\n * `components/StackedCard`. These stories import it under the concept\n * vocabulary (Cover, StackRow, …) so the spec prose and the code keep using\n * the same words.\n */\n\n/* ------------------------------------------------------------------ */\n/* Per-type cover ratios                                               */\n/* ------------------------------------------------------------------ */\n\n/**\n * The design system ships one default cover ratio\n * (`STACKED_CARD_COVER_RATIO`). How tall a cover reads is a decision of the\n * content type, so the variants live here with the content: a link hero, a\n * full-bleed image, a colour swatch band.\n */\nexport const COVER_RATIO_HERO = \"320 / 190\";\nexport const COVER_RATIO_IMAGE = \"260 / 168\";\nexport const COVER_RATIO_SWATCH = \"260 / 104\";\n\n/* ------------------------------------------------------------------ */\n/* Cover chrome — media control + cover management                     */\n/* ------------------------------------------------------------------ */\n\n/** Centered media control (play), for a cover that wraps audio/video. */\nexport const playControl = (\n  <PlayBadge>\n    <PlayIcon />\n  </PlayBadge>\n);\n\n/**\n * Top-right cover management. Acts on the COVER (collapse it, remove it) — not\n * on the entity. Callers wire the click handlers; the default is inert chrome\n * for the static demos.\n */\nexport const coverManagement = ({\n  removeLabel = \"Remove cover\",\n  onCollapse,\n  onRemove,\n}: {\n  removeLabel?: string;\n  onCollapse?: () => void;\n  onRemove?: () => void;\n} = {}): ReactElement => (\n  <>\n    <CoverButton type=\"button\" aria-label=\"Collapse cover\" onClick={onCollapse}>\n      <CollapseGlyph />\n    </CoverButton>\n    <CoverButton type=\"button\" aria-label={removeLabel} onClick={onRemove}>\n      <RemoveCoverGlyph />\n    </CoverButton>\n  </>\n);\n\n/* ------------------------------------------------------------------ */\n/* Entity \"…\" menu — acts on the ENTITY, lives in a content row         */\n/* ------------------------------------------------------------------ */\n\nconst StyledEntityDots = styled.button`\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 26px;\n  height: 26px;\n  padding: 0;\n  border: 0;\n  border-radius: 6px;\n  cursor: pointer;\n  color: var(--color-theme-700);\n  background: var(--color-theme-200);\n\n  svg {\n    width: 16px;\n    height: 16px;\n    display: block;\n  }\n\n  &:hover {\n    background: var(--color-theme-300);\n  }\n`;\n\nexport const EntityDots = (\n  props: React.ButtonHTMLAttributes<HTMLButtonElement>\n): ReactElement => (\n  <StyledEntityDots\n    type=\"button\"\n    aria-label=\"Options\"\n    data-fixed\n    className={STACKED_CARD_CONTROL_CLASS}\n    {...props}\n  >\n    <TreeDotsIcon />\n  </StyledEntityDots>\n);\n\n/* ------------------------------------------------------------------ */\n/* Text + inline bits                                                   */\n/* ------------------------------------------------------------------ */\n\n/** Two-line title clamp — the card's name row content. */\nexport const StyledClamp = styled(Body2)`\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n`;\n\n/** A favicon square — a solid data colour stands in for the real favicon. */\nexport const StyledFavicon = styled.span<{ $bg: string }>`\n  display: inline-flex;\n  width: 16px;\n  height: 16px;\n  border-radius: 4px;\n  background: ${({ $bg }) => $bg};\n  flex-shrink: 0;\n`;\n\n/** A small pill for link metadata (media kind, duration, …). */\nexport const StyledChip = styled.span`\n  display: inline-flex;\n  align-items: center;\n  padding: 2px 8px;\n  border-radius: 10px;\n  background: var(--color-theme-300);\n  color: var(--color-theme-800);\n  font-size: 11px;\n  white-space: nowrap;\n`;\n\n/** A solid-colour cover fill (swatch value, generic link cover, image stand-in). */\nexport const StyledColorCover = styled.div<{ $color: string }>`\n  width: 100%;\n  height: 100%;\n  background: ${({ $color }) => $color};\n`;\n\n/* ------------------------------------------------------------------ */\n/* Placeholder frame — the interactive empty state, per type           */\n/* ------------------------------------------------------------------ */\n\nconst StyledPlaceholder = styled.button<{\n  $height?: number;\n  $dashed?: boolean;\n}>`\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: 10px;\n  width: 100%;\n  height: ${({ $height }) => $height ?? 150}px;\n  padding: 0;\n  border: 0;\n  background: transparent;\n  color: var(--color-theme-600);\n  text-align: center;\n  cursor: pointer;\n\n  ${({ $dashed }) =>\n    $dashed &&\n    css`\n      margin: 8px;\n      width: calc(100% - 16px);\n      border: 1.5px dashed var(--color-theme-400);\n      border-radius: 6px;\n\n      &:hover {\n        border-color: var(--sc-selection-ring);\n        color: var(--color-theme-700);\n      }\n    `}\n\n  > svg {\n    width: 40px;\n    height: 40px;\n    color: var(--color-theme-500);\n  }\n`;\n\n/**\n * The shared placeholder frame. Each type supplies its own icon and verb-first,\n * sentence-case invitation (ActiveCollab voice). Interactive by design — the\n * whole frame is a button — and distinct from the loading skeleton.\n */\nexport const Placeholder = ({\n  icon,\n  label,\n  height,\n  dashed,\n  ...rest\n}: {\n  icon: ReactNode;\n  label: ReactNode;\n  height?: number;\n  dashed?: boolean;\n} & React.ButtonHTMLAttributes<HTMLButtonElement>): ReactElement => (\n  <StyledPlaceholder type=\"button\" $height={height} $dashed={dashed} {...rest}>\n    {icon}\n    <Typography as=\"span\" variant=\"Body 2\" color=\"secondary\">\n      {label}\n    </Typography>\n  </StyledPlaceholder>\n);\n"],"mappings":"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","ignoreList":[]}

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

@@ -1,13 +1,15 @@
 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.
+ * Section, Labeled, Grid, Column) plus the sheet's `--sc-*` values.
+ * Presentation-only; keeps the 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.
+ * The `--sc-*` variables (a selection ring + a dark scrim family) are the
+ * shipped component's theming hooks: `components/StackedCard` reads each one
+ * through a `var()` with a built-in fallback, and declaring them here on the
+ * sheet retints every card inside it. 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>;

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

@@ -1 +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"}
+{"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;;;;;;;;;;;GAWG;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

@@ -4,13 +4,15 @@ 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.
+ * Section, Labeled, Grid, Column) plus the sheet's `--sc-*` values.
+ * Presentation-only; keeps the 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.
+ * The `--sc-*` variables (a selection ring + a dark scrim family) are the
+ * shipped component's theming hooks: `components/StackedCard` reads each one
+ * through a `var()` with a built-in fallback, and declaring them here on the
+ * sheet retints every card inside it. No rgba/hex is baked into a reusable
+ * style.
  */
 
 export const StyledSheet = styled.div.withConfig({

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

@@ -1 +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":[]}
+{"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 sheet's `--sc-*` values.\n * Presentation-only; keeps the StackedCard stories laying out the same way\n * instead of each re-declaring the sheet chrome.\n *\n * The `--sc-*` variables (a selection ring + a dark scrim family) are the\n * shipped component's theming hooks: `components/StackedCard` reads each one\n * through a `var()` with a built-in fallback, and declaring them here on the\n * sheet retints every card inside it. No rgba/hex is baked into a reusable\n * 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;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":[]}