@activecollab/components 2.0.368 → 2.0.370

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (100) hide show
  1. package/dist/cjs/components/StackedCard/Glyphs.js +86 -0
  2. package/dist/cjs/components/StackedCard/Glyphs.js.map +1 -0
  3. package/dist/cjs/components/StackedCard/Primitives.js +129 -0
  4. package/dist/cjs/components/StackedCard/Primitives.js.map +1 -0
  5. package/dist/cjs/components/StackedCard/StackedCard.js +103 -0
  6. package/dist/cjs/components/StackedCard/StackedCard.js.map +1 -0
  7. package/dist/cjs/components/StackedCard/Styles.js +192 -0
  8. package/dist/cjs/components/StackedCard/Styles.js.map +1 -0
  9. package/dist/cjs/components/StackedCard/constants.js +54 -0
  10. package/dist/cjs/components/StackedCard/constants.js.map +1 -0
  11. package/dist/cjs/components/StackedCard/index.js +50 -0
  12. package/dist/cjs/components/StackedCard/index.js.map +1 -0
  13. package/dist/cjs/components/index.js +11 -0
  14. package/dist/cjs/components/index.js.map +1 -1
  15. package/dist/cjs/presentation/shared/SourceCodeSection.js +183 -117
  16. package/dist/cjs/presentation/shared/SourceCodeSection.js.map +1 -1
  17. package/dist/cjs/presentation/stackedCard/content/ImageCard.js +5 -6
  18. package/dist/cjs/presentation/stackedCard/content/ImageCard.js.map +1 -1
  19. package/dist/cjs/presentation/stackedCard/content/LinkCard.js +28 -23
  20. package/dist/cjs/presentation/stackedCard/content/LinkCard.js.map +1 -1
  21. package/dist/cjs/presentation/stackedCard/content/NoteCard.js +5 -5
  22. package/dist/cjs/presentation/stackedCard/content/NoteCard.js.map +1 -1
  23. package/dist/cjs/presentation/stackedCard/content/SwatchCard.js +7 -8
  24. package/dist/cjs/presentation/stackedCard/content/SwatchCard.js.map +1 -1
  25. package/dist/cjs/presentation/stackedCard/content/TaskCard.js +9 -10
  26. package/dist/cjs/presentation/stackedCard/content/TaskCard.js.map +1 -1
  27. package/dist/cjs/presentation/stackedCard/content/shared.js +27 -7
  28. package/dist/cjs/presentation/stackedCard/content/shared.js.map +1 -1
  29. package/dist/cjs/presentation/stackedCard/storyScaffold.js +8 -6
  30. package/dist/cjs/presentation/stackedCard/storyScaffold.js.map +1 -1
  31. package/dist/esm/components/StackedCard/Glyphs.d.ts +19 -0
  32. package/dist/esm/components/StackedCard/Glyphs.d.ts.map +1 -0
  33. package/dist/esm/components/StackedCard/Glyphs.js +72 -0
  34. package/dist/esm/components/StackedCard/Glyphs.js.map +1 -0
  35. package/dist/esm/components/StackedCard/Primitives.d.ts +91 -0
  36. package/dist/esm/components/StackedCard/Primitives.d.ts.map +1 -0
  37. package/dist/esm/components/StackedCard/Primitives.js +122 -0
  38. package/dist/esm/components/StackedCard/Primitives.js.map +1 -0
  39. package/dist/esm/components/StackedCard/StackedCard.d.ts +74 -0
  40. package/dist/esm/components/StackedCard/StackedCard.d.ts.map +1 -0
  41. package/dist/esm/components/StackedCard/StackedCard.js +95 -0
  42. package/dist/esm/components/StackedCard/StackedCard.js.map +1 -0
  43. package/dist/esm/components/StackedCard/Styles.d.ts +46 -0
  44. package/dist/esm/components/StackedCard/Styles.d.ts.map +1 -0
  45. package/dist/esm/components/StackedCard/Styles.js +186 -0
  46. package/dist/esm/components/StackedCard/Styles.js.map +1 -0
  47. package/dist/esm/components/StackedCard/constants.d.ts +37 -0
  48. package/dist/esm/components/StackedCard/constants.d.ts.map +1 -0
  49. package/dist/esm/components/StackedCard/constants.js +48 -0
  50. package/dist/esm/components/StackedCard/constants.js.map +1 -0
  51. package/dist/esm/components/StackedCard/index.d.ts +5 -0
  52. package/dist/esm/components/StackedCard/index.d.ts.map +1 -0
  53. package/dist/esm/components/StackedCard/index.js +5 -0
  54. package/dist/esm/components/StackedCard/index.js.map +1 -0
  55. package/dist/esm/components/index.d.ts +1 -0
  56. package/dist/esm/components/index.d.ts.map +1 -1
  57. package/dist/esm/components/index.js +1 -0
  58. package/dist/esm/components/index.js.map +1 -1
  59. package/dist/esm/presentation/shared/SourceCodeSection.d.ts.map +1 -1
  60. package/dist/esm/presentation/shared/SourceCodeSection.js +183 -116
  61. package/dist/esm/presentation/shared/SourceCodeSection.js.map +1 -1
  62. package/dist/esm/presentation/stackedCard/content/ImageCard.d.ts.map +1 -1
  63. package/dist/esm/presentation/stackedCard/content/ImageCard.js +2 -3
  64. package/dist/esm/presentation/stackedCard/content/ImageCard.js.map +1 -1
  65. package/dist/esm/presentation/stackedCard/content/LinkCard.d.ts.map +1 -1
  66. package/dist/esm/presentation/stackedCard/content/LinkCard.js +14 -9
  67. package/dist/esm/presentation/stackedCard/content/LinkCard.js.map +1 -1
  68. package/dist/esm/presentation/stackedCard/content/NoteCard.js +1 -1
  69. package/dist/esm/presentation/stackedCard/content/NoteCard.js.map +1 -1
  70. package/dist/esm/presentation/stackedCard/content/SwatchCard.d.ts.map +1 -1
  71. package/dist/esm/presentation/stackedCard/content/SwatchCard.js +2 -3
  72. package/dist/esm/presentation/stackedCard/content/SwatchCard.js.map +1 -1
  73. package/dist/esm/presentation/stackedCard/content/TaskCard.d.ts.map +1 -1
  74. package/dist/esm/presentation/stackedCard/content/TaskCard.js +1 -2
  75. package/dist/esm/presentation/stackedCard/content/TaskCard.js.map +1 -1
  76. package/dist/esm/presentation/stackedCard/content/shared.d.ts +15 -0
  77. package/dist/esm/presentation/stackedCard/content/shared.d.ts.map +1 -1
  78. package/dist/esm/presentation/stackedCard/content/shared.js +22 -2
  79. package/dist/esm/presentation/stackedCard/content/shared.js.map +1 -1
  80. package/dist/esm/presentation/stackedCard/storyScaffold.d.ts +8 -6
  81. package/dist/esm/presentation/stackedCard/storyScaffold.d.ts.map +1 -1
  82. package/dist/esm/presentation/stackedCard/storyScaffold.js +8 -6
  83. package/dist/esm/presentation/stackedCard/storyScaffold.js.map +1 -1
  84. package/dist/index.js +1213 -686
  85. package/dist/index.js.map +1 -1
  86. package/dist/index.min.js +1 -1
  87. package/dist/index.min.js.map +1 -1
  88. package/package.json +1 -1
  89. package/dist/cjs/presentation/stackedCard/primitives.js +0 -254
  90. package/dist/cjs/presentation/stackedCard/primitives.js.map +0 -1
  91. package/dist/cjs/presentation/stackedCard/shell.js +0 -165
  92. package/dist/cjs/presentation/stackedCard/shell.js.map +0 -1
  93. package/dist/esm/presentation/stackedCard/primitives.d.ts +0 -84
  94. package/dist/esm/presentation/stackedCard/primitives.d.ts.map +0 -1
  95. package/dist/esm/presentation/stackedCard/primitives.js +0 -241
  96. package/dist/esm/presentation/stackedCard/primitives.js.map +0 -1
  97. package/dist/esm/presentation/stackedCard/shell.d.ts +0 -46
  98. package/dist/esm/presentation/stackedCard/shell.d.ts.map +0 -1
  99. package/dist/esm/presentation/stackedCard/shell.js +0 -156
  100. package/dist/esm/presentation/stackedCard/shell.js.map +0 -1
@@ -1 +1 @@
1
- {"version":3,"file":"TaskCard.js","names":["_react","_interopRequireDefault","require","_styledComponents","_interopRequireWildcard","_shared","_Icons","_Loaders","_Typography","_Typography2","_shared2","_primitives","_shell","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","_t","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","_extends","assign","bind","arguments","length","apply","LABEL_DOTS","StyledBody","styled","div","withConfig","displayName","componentId","_ref","$completed","css","StyledMetaCluster","StyledDot","span","_ref2","$color","StyledHiddenBadge","StyledDate","_ref3","$overdue","StyledAddAssignee","button","TaskCard","exports","_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","Cover","aspectRatio","COVER_RATIO","centerSlot","playControl","undefined","topRightSlot","coverManagement","style","width","height","background","StackRow","role","StyledClamp","Typography","as","variant","color","concat","EntityDots","className","map","key","Caption1","MessageSmallIcon","ChecklistSmallIcon","Fragment","InsertLinkIcon","EyeOffIcon","RoundAvatar","$bg","AVATAR_COLORS","teal","$size","$bordered","type","PersonPlusIcon","TaskPlaceholder","props","Placeholder","icon","label","TaskSkeleton","SkeletonLoader","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":[]}
1
+ {"version":3,"file":"TaskCard.js","names":["_react","_interopRequireDefault","require","_styledComponents","_interopRequireWildcard","_shared","_Icons","_Loaders","_StackedCard","_Typography","_Typography2","_shared2","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","_t","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","_extends","assign","bind","arguments","length","apply","LABEL_DOTS","StyledBody","styled","div","withConfig","displayName","componentId","_ref","$completed","css","StyledMetaCluster","StyledDot","span","_ref2","$color","StyledHiddenBadge","StyledDate","_ref3","$overdue","StyledAddAssignee","button","TaskCard","exports","_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","StackedCardCover","aspectRatio","COVER_RATIO","centerSlot","playControl","undefined","topRightSlot","coverManagement","style","width","height","background","StackedCardRow","role","StyledClamp","Typography","as","variant","color","concat","EntityDots","className","map","key","Caption1","MessageSmallIcon","ChecklistSmallIcon","Fragment","InsertLinkIcon","EyeOffIcon","RoundAvatar","$bg","AVATAR_COLORS","teal","$size","$bordered","type","PersonPlusIcon","TaskPlaceholder","props","Placeholder","icon","label","TaskSkeleton","SkeletonLoader","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":[]}
@@ -3,13 +3,13 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.playControl = exports.coverManagement = exports.StyledFavicon = exports.StyledColorCover = exports.StyledClamp = exports.StyledChip = exports.Placeholder = exports.EntityDots = void 0;
6
+ exports.playControl = exports.coverManagement = exports.StyledFavicon = exports.StyledColorCover = exports.StyledClamp = exports.StyledChip = exports.Placeholder = exports.EntityDots = exports.COVER_RATIO_SWATCH = exports.COVER_RATIO_IMAGE = exports.COVER_RATIO_HERO = void 0;
7
7
  var _react = _interopRequireDefault(require("react"));
8
8
  var _styledComponents = _interopRequireWildcard(require("styled-components"));
9
9
  var _Icons = require("../../../components/Icons");
10
+ var _StackedCard = require("../../../components/StackedCard");
10
11
  var _Typography = require("../../../components/Typography");
11
12
  var _Typography2 = require("../../../components/Typography/Typography");
12
- var _primitives = require("../primitives");
13
13
  var _excluded = ["icon", "label", "height", "dashed"];
14
14
  function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
15
15
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
@@ -23,14 +23,34 @@ function _extends() { return _extends = Object.assign ? Object.assign.bind() : f
23
23
  * menu, the cover-management controls, the clamp, the favicon, the chips and
24
24
  * the placeholder frame are content concerns, so they belong here where the
25
25
  * typed cards (TaskCard, LinkCard, …) compose them.
26
+ *
27
+ * The card itself — the shell, the Stack/StackRow/Cover primitives and the
28
+ * cover chrome — is the shipped design-system component,
29
+ * `components/StackedCard`. These stories import it under the concept
30
+ * vocabulary (Cover, StackRow, …) so the spec prose and the code keep using
31
+ * the same words.
32
+ */
33
+
34
+ /* ------------------------------------------------------------------ */
35
+ /* Per-type cover ratios */
36
+ /* ------------------------------------------------------------------ */
37
+
38
+ /**
39
+ * The design system ships one default cover ratio
40
+ * (`STACKED_CARD_COVER_RATIO`). How tall a cover reads is a decision of the
41
+ * content type, so the variants live here with the content: a link hero, a
42
+ * full-bleed image, a colour swatch band.
26
43
  */
44
+ var COVER_RATIO_HERO = exports.COVER_RATIO_HERO = "320 / 190";
45
+ var COVER_RATIO_IMAGE = exports.COVER_RATIO_IMAGE = "260 / 168";
46
+ var COVER_RATIO_SWATCH = exports.COVER_RATIO_SWATCH = "260 / 104";
27
47
 
28
48
  /* ------------------------------------------------------------------ */
29
49
  /* Cover chrome — media control + cover management */
30
50
  /* ------------------------------------------------------------------ */
31
51
 
32
52
  /** Centered media control (play), for a cover that wraps audio/video. */
33
- var playControl = exports.playControl = /*#__PURE__*/_react.default.createElement(_primitives.PlayBadge, null, /*#__PURE__*/_react.default.createElement(_Icons.PlayIcon, null));
53
+ var playControl = exports.playControl = /*#__PURE__*/_react.default.createElement(_StackedCard.StackedCardPlayBadge, null, /*#__PURE__*/_react.default.createElement(_Icons.PlayIcon, null));
34
54
 
35
55
  /**
36
56
  * Top-right cover management. Acts on the COVER (collapse it, remove it) — not
@@ -43,15 +63,15 @@ var coverManagement = exports.coverManagement = function coverManagement() {
43
63
  removeLabel = _ref$removeLabel === void 0 ? "Remove cover" : _ref$removeLabel,
44
64
  onCollapse = _ref.onCollapse,
45
65
  onRemove = _ref.onRemove;
46
- return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_primitives.CoverButton, {
66
+ return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_StackedCard.StackedCardCoverButton, {
47
67
  type: "button",
48
68
  "aria-label": "Collapse cover",
49
69
  onClick: onCollapse
50
- }, /*#__PURE__*/_react.default.createElement(_primitives.CollapseGlyph, null)), /*#__PURE__*/_react.default.createElement(_primitives.CoverButton, {
70
+ }, /*#__PURE__*/_react.default.createElement(_StackedCard.StackedCardCollapseGlyph, null)), /*#__PURE__*/_react.default.createElement(_StackedCard.StackedCardCoverButton, {
51
71
  type: "button",
52
72
  "aria-label": removeLabel,
53
73
  onClick: onRemove
54
- }, /*#__PURE__*/_react.default.createElement(_primitives.RemoveCoverGlyph, null)));
74
+ }, /*#__PURE__*/_react.default.createElement(_StackedCard.StackedCardRemoveCoverGlyph, null)));
55
75
  };
56
76
 
57
77
  /* ------------------------------------------------------------------ */
@@ -67,7 +87,7 @@ var EntityDots = exports.EntityDots = function EntityDots(props) {
67
87
  type: "button",
68
88
  "aria-label": "Options",
69
89
  "data-fixed": true,
70
- className: "sc-control"
90
+ className: _StackedCard.STACKED_CARD_CONTROL_CLASS
71
91
  }, props), /*#__PURE__*/_react.default.createElement(_Icons.TreeDotsIcon, null));
72
92
  };
73
93
 
@@ -1 +1 @@
1
- {"version":3,"file":"shared.js","names":["_react","_interopRequireDefault","require","_styledComponents","_interopRequireWildcard","_Icons","_Typography","_Typography2","_primitives","_excluded","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","_t","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","_objectWithoutProperties","_objectWithoutPropertiesLoose","getOwnPropertySymbols","length","indexOf","propertyIsEnumerable","_extends","assign","bind","arguments","apply","playControl","exports","createElement","PlayBadge","PlayIcon","coverManagement","_ref","undefined","_ref$removeLabel","removeLabel","onCollapse","onRemove","Fragment","CoverButton","type","onClick","CollapseGlyph","RemoveCoverGlyph","StyledEntityDots","styled","button","withConfig","displayName","componentId","EntityDots","props","className","TreeDotsIcon","StyledClamp","Body2","StyledFavicon","span","_ref2","$bg","StyledChip","StyledColorCover","div","_ref3","$color","StyledPlaceholder","_ref4","$height","_ref5","$dashed","css","Placeholder","_ref6","icon","label","height","dashed","rest","Typography","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":"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","ignoreList":[]}
1
+ {"version":3,"file":"shared.js","names":["_react","_interopRequireDefault","require","_styledComponents","_interopRequireWildcard","_Icons","_StackedCard","_Typography","_Typography2","_excluded","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","_t","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","_objectWithoutProperties","_objectWithoutPropertiesLoose","getOwnPropertySymbols","length","indexOf","propertyIsEnumerable","_extends","assign","bind","arguments","apply","COVER_RATIO_HERO","exports","COVER_RATIO_IMAGE","COVER_RATIO_SWATCH","playControl","createElement","StackedCardPlayBadge","PlayIcon","coverManagement","_ref","undefined","_ref$removeLabel","removeLabel","onCollapse","onRemove","Fragment","StackedCardCoverButton","type","onClick","StackedCardCollapseGlyph","StackedCardRemoveCoverGlyph","StyledEntityDots","styled","button","withConfig","displayName","componentId","EntityDots","props","className","STACKED_CARD_CONTROL_CLASS","TreeDotsIcon","StyledClamp","Body2","StyledFavicon","span","_ref2","$bg","StyledChip","StyledColorCover","div","_ref3","$color","StyledPlaceholder","_ref4","$height","_ref5","$dashed","css","Placeholder","_ref6","icon","label","height","dashed","rest","Typography","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":[]}
@@ -10,13 +10,15 @@ var _Typography = require("../../components/Typography");
10
10
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
11
11
  /**
12
12
  * Shared spec-sheet scaffolding for the StackedCard concept stories (Sheet,
13
- * Section, Labeled, Grid, Column) plus the DS token candidates the subsystem
14
- * needs. Presentation-only; keeps the three StackedCard stories laying out the
15
- * same way instead of each re-declaring the sheet chrome.
13
+ * Section, Labeled, Grid, Column) plus the sheet's `--sc-*` values.
14
+ * Presentation-only; keeps the StackedCard stories laying out the same way
15
+ * instead of each re-declaring the sheet chrome.
16
16
  *
17
- * The `--sc-*` variables are declared here as design-system PROPOSALS (a
18
- * selection ring + a dark scrim family). The shell and primitives reference
19
- * these only, so no rgba/hex is baked into a reusable style.
17
+ * The `--sc-*` variables (a selection ring + a dark scrim family) are the
18
+ * shipped component's theming hooks: `components/StackedCard` reads each one
19
+ * through a `var()` with a built-in fallback, and declaring them here on the
20
+ * sheet retints every card inside it. No rgba/hex is baked into a reusable
21
+ * style.
20
22
  */
21
23
 
22
24
  var StyledSheet = exports.StyledSheet = _styledComponents.default.div.withConfig({
@@ -1 +1 @@
1
- {"version":3,"file":"storyScaffold.js","names":["_react","_interopRequireDefault","require","_styledComponents","_Typography","e","__esModule","default","StyledSheet","exports","styled","div","withConfig","displayName","componentId","StyledSection","section","StyledGrid","StyledColumn","StyledLabeled","figure","Labeled","_ref","label","children","createElement","Caption1","color","Section","_ref2","caption","note","weight","className","SheetHeading","_ref3","title","Fragment","Title2"],"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":"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","ignoreList":[]}
1
+ {"version":3,"file":"storyScaffold.js","names":["_react","_interopRequireDefault","require","_styledComponents","_Typography","e","__esModule","default","StyledSheet","exports","styled","div","withConfig","displayName","componentId","StyledSection","section","StyledGrid","StyledColumn","StyledLabeled","figure","Labeled","_ref","label","children","createElement","Caption1","color","Section","_ref2","caption","note","weight","className","SheetHeading","_ref3","title","Fragment","Title2"],"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":"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","ignoreList":[]}
@@ -0,0 +1,19 @@
1
+ import { ReactElement } from "react";
2
+ /**
3
+ * StackedCard chrome glyphs.
4
+ *
5
+ * These are part of the card's own chrome — they act on the CARD (collapse the
6
+ * cover, remove the cover, resize the card), never on the entity a card
7
+ * represents. They ship with the component rather than coming from the icon
8
+ * collection so a facade never has to re-pick them and every stacked card
9
+ * reads the same.
10
+ */
11
+ /** Collapse the cover down to its thin strip. */
12
+ export declare const StackedCardCollapseGlyph: () => ReactElement;
13
+ /** Expand a collapsed cover — the inverse of collapse, shown on the strip. */
14
+ export declare const StackedCardExpandGlyph: () => ReactElement;
15
+ /** Drop the cover entirely. */
16
+ export declare const StackedCardRemoveCoverGlyph: () => ReactElement;
17
+ /** The bottom-right resize grip. */
18
+ export declare const StackedCardResizeHandleGlyph: () => ReactElement;
19
+ //# sourceMappingURL=Glyphs.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Glyphs.d.ts","sourceRoot":"","sources":["../../../../src/components/StackedCard/Glyphs.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAE5C;;;;;;;;GAQG;AAEH,iDAAiD;AACjD,eAAO,MAAM,wBAAwB,QAAO,YAU3C,CAAC;AAEF,8EAA8E;AAC9E,eAAO,MAAM,sBAAsB,QAAO,YAUzC,CAAC;AAEF,+BAA+B;AAC/B,eAAO,MAAM,2BAA2B,QAAO,YAkB9C,CAAC;AAEF,oCAAoC;AACpC,eAAO,MAAM,4BAA4B,QAAO,YAe/C,CAAC"}
@@ -0,0 +1,72 @@
1
+ import React from "react";
2
+
3
+ /**
4
+ * StackedCard chrome glyphs.
5
+ *
6
+ * These are part of the card's own chrome — they act on the CARD (collapse the
7
+ * cover, remove the cover, resize the card), never on the entity a card
8
+ * represents. They ship with the component rather than coming from the icon
9
+ * collection so a facade never has to re-pick them and every stacked card
10
+ * reads the same.
11
+ */
12
+
13
+ /** Collapse the cover down to its thin strip. */
14
+ export const StackedCardCollapseGlyph = () => /*#__PURE__*/React.createElement("svg", {
15
+ viewBox: "0 0 16 16",
16
+ fill: "none",
17
+ "aria-hidden": "true"
18
+ }, /*#__PURE__*/React.createElement("path", {
19
+ d: "M6.5 2.5v4h-4M9.5 13.5v-4h4",
20
+ stroke: "currentColor",
21
+ strokeWidth: "1.5",
22
+ strokeLinecap: "round",
23
+ strokeLinejoin: "round"
24
+ }));
25
+
26
+ /** Expand a collapsed cover — the inverse of collapse, shown on the strip. */
27
+ export const StackedCardExpandGlyph = () => /*#__PURE__*/React.createElement("svg", {
28
+ viewBox: "0 0 16 16",
29
+ fill: "none",
30
+ "aria-hidden": "true"
31
+ }, /*#__PURE__*/React.createElement("path", {
32
+ d: "M2.5 6.5v-4h4M13.5 9.5v4h-4",
33
+ stroke: "currentColor",
34
+ strokeWidth: "1.5",
35
+ strokeLinecap: "round",
36
+ strokeLinejoin: "round"
37
+ }));
38
+
39
+ /** Drop the cover entirely. */
40
+ export const StackedCardRemoveCoverGlyph = () => /*#__PURE__*/React.createElement("svg", {
41
+ viewBox: "0 0 16 16",
42
+ fill: "none",
43
+ "aria-hidden": "true"
44
+ }, /*#__PURE__*/React.createElement("rect", {
45
+ x: "2.25",
46
+ y: "3.75",
47
+ width: "11.5",
48
+ height: "8.5",
49
+ rx: "1.5",
50
+ stroke: "currentColor",
51
+ strokeWidth: "1.5"
52
+ }), /*#__PURE__*/React.createElement("path", {
53
+ d: "M6 9.5L10 6M10 9.5L6 6",
54
+ stroke: "currentColor",
55
+ strokeWidth: "1.5",
56
+ strokeLinecap: "round"
57
+ }));
58
+
59
+ /** The bottom-right resize grip. */
60
+ export const StackedCardResizeHandleGlyph = () => /*#__PURE__*/React.createElement("svg", {
61
+ width: "14",
62
+ height: "14",
63
+ viewBox: "0 0 14 14",
64
+ fill: "none",
65
+ "aria-hidden": "true"
66
+ }, /*#__PURE__*/React.createElement("path", {
67
+ d: "M12 6v6H6M12 9.5L9.5 12",
68
+ stroke: "currentColor",
69
+ strokeWidth: "1.5",
70
+ strokeLinecap: "round"
71
+ }));
72
+ //# sourceMappingURL=Glyphs.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Glyphs.js","names":["React","StackedCardCollapseGlyph","createElement","viewBox","fill","d","stroke","strokeWidth","strokeLinecap","strokeLinejoin","StackedCardExpandGlyph","StackedCardRemoveCoverGlyph","x","y","width","height","rx","StackedCardResizeHandleGlyph"],"sources":["../../../../src/components/StackedCard/Glyphs.tsx"],"sourcesContent":["import React, { ReactElement } from \"react\";\n\n/**\n * StackedCard chrome glyphs.\n *\n * These are part of the card's own chrome — they act on the CARD (collapse the\n * cover, remove the cover, resize the card), never on the entity a card\n * represents. They ship with the component rather than coming from the icon\n * collection so a facade never has to re-pick them and every stacked card\n * reads the same.\n */\n\n/** Collapse the cover down to its thin strip. */\nexport const StackedCardCollapseGlyph = (): ReactElement => (\n <svg viewBox=\"0 0 16 16\" fill=\"none\" aria-hidden=\"true\">\n <path\n d=\"M6.5 2.5v4h-4M9.5 13.5v-4h4\"\n stroke=\"currentColor\"\n strokeWidth=\"1.5\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n </svg>\n);\n\n/** Expand a collapsed cover — the inverse of collapse, shown on the strip. */\nexport const StackedCardExpandGlyph = (): ReactElement => (\n <svg viewBox=\"0 0 16 16\" fill=\"none\" aria-hidden=\"true\">\n <path\n d=\"M2.5 6.5v-4h4M13.5 9.5v4h-4\"\n stroke=\"currentColor\"\n strokeWidth=\"1.5\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n </svg>\n);\n\n/** Drop the cover entirely. */\nexport const StackedCardRemoveCoverGlyph = (): ReactElement => (\n <svg viewBox=\"0 0 16 16\" fill=\"none\" aria-hidden=\"true\">\n <rect\n x=\"2.25\"\n y=\"3.75\"\n width=\"11.5\"\n height=\"8.5\"\n rx=\"1.5\"\n stroke=\"currentColor\"\n strokeWidth=\"1.5\"\n />\n <path\n d=\"M6 9.5L10 6M10 9.5L6 6\"\n stroke=\"currentColor\"\n strokeWidth=\"1.5\"\n strokeLinecap=\"round\"\n />\n </svg>\n);\n\n/** The bottom-right resize grip. */\nexport const StackedCardResizeHandleGlyph = (): ReactElement => (\n <svg\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 14 14\"\n fill=\"none\"\n aria-hidden=\"true\"\n >\n <path\n d=\"M12 6v6H6M12 9.5L9.5 12\"\n stroke=\"currentColor\"\n strokeWidth=\"1.5\"\n strokeLinecap=\"round\"\n />\n </svg>\n);\n"],"mappings":"AAAA,OAAOA,KAAK,MAAwB,OAAO;;AAE3C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA,OAAO,MAAMC,wBAAwB,GAAGA,CAAA,kBACtCD,KAAA,CAAAE,aAAA;EAAKC,OAAO,EAAC,WAAW;EAACC,IAAI,EAAC,MAAM;EAAC,eAAY;AAAM,gBACrDJ,KAAA,CAAAE,aAAA;EACEG,CAAC,EAAC,6BAA6B;EAC/BC,MAAM,EAAC,cAAc;EACrBC,WAAW,EAAC,KAAK;EACjBC,aAAa,EAAC,OAAO;EACrBC,cAAc,EAAC;AAAO,CACvB,CACE,CACN;;AAED;AACA,OAAO,MAAMC,sBAAsB,GAAGA,CAAA,kBACpCV,KAAA,CAAAE,aAAA;EAAKC,OAAO,EAAC,WAAW;EAACC,IAAI,EAAC,MAAM;EAAC,eAAY;AAAM,gBACrDJ,KAAA,CAAAE,aAAA;EACEG,CAAC,EAAC,6BAA6B;EAC/BC,MAAM,EAAC,cAAc;EACrBC,WAAW,EAAC,KAAK;EACjBC,aAAa,EAAC,OAAO;EACrBC,cAAc,EAAC;AAAO,CACvB,CACE,CACN;;AAED;AACA,OAAO,MAAME,2BAA2B,GAAGA,CAAA,kBACzCX,KAAA,CAAAE,aAAA;EAAKC,OAAO,EAAC,WAAW;EAACC,IAAI,EAAC,MAAM;EAAC,eAAY;AAAM,gBACrDJ,KAAA,CAAAE,aAAA;EACEU,CAAC,EAAC,MAAM;EACRC,CAAC,EAAC,MAAM;EACRC,KAAK,EAAC,MAAM;EACZC,MAAM,EAAC,KAAK;EACZC,EAAE,EAAC,KAAK;EACRV,MAAM,EAAC,cAAc;EACrBC,WAAW,EAAC;AAAK,CAClB,CAAC,eACFP,KAAA,CAAAE,aAAA;EACEG,CAAC,EAAC,wBAAwB;EAC1BC,MAAM,EAAC,cAAc;EACrBC,WAAW,EAAC,KAAK;EACjBC,aAAa,EAAC;AAAO,CACtB,CACE,CACN;;AAED;AACA,OAAO,MAAMS,4BAA4B,GAAGA,CAAA,kBAC1CjB,KAAA,CAAAE,aAAA;EACEY,KAAK,EAAC,IAAI;EACVC,MAAM,EAAC,IAAI;EACXZ,OAAO,EAAC,WAAW;EACnBC,IAAI,EAAC,MAAM;EACX,eAAY;AAAM,gBAElBJ,KAAA,CAAAE,aAAA;EACEG,CAAC,EAAC,yBAAyB;EAC3BC,MAAM,EAAC,cAAc;EACrBC,WAAW,EAAC,KAAK;EACjBC,aAAa,EAAC;AAAO,CACtB,CACE,CACN","ignoreList":[]}
@@ -0,0 +1,91 @@
1
+ import React, { ReactElement, ReactNode } from "react";
2
+ import { StackedCardRowDirection, StackedCardRowRole } from "./constants";
3
+ /**
4
+ * StackedCard layout primitives.
5
+ *
6
+ * A stacked card is a portrait presentation of data: content stacks top to
7
+ * bottom in rows. There are three primitives and nothing else —
8
+ *
9
+ * - StackedCardStack — the vertical column. A card IS a stack of rows; the
10
+ * primitive is exported for nested stacks (a row that stacks internally).
11
+ * - StackedCardRow — the one layout primitive. Cover, title, meta, footer
12
+ * are all rows; a `role` sets the default padding so the anatomy stays
13
+ * predictable across every card type.
14
+ * - StackedCardCover — sugar for a bleed row that holds media, reserves its
15
+ * height with `aspect-ratio` so a late image never reflows the card, and
16
+ * carries two control slots (center + top-right).
17
+ */
18
+ /** A vertical flex column with no padding of its own. */
19
+ export declare const StackedCardStack: import("styled-components").StyledComponent<"div", any, {}, never>;
20
+ export interface IStackedCardRowProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "role"> {
21
+ /**
22
+ * Named layout role → default padding. Defaults to `custom`.
23
+ *
24
+ * This shadows the DOM `role` attribute on purpose: a row is a layout
25
+ * increment, and the concept's vocabulary for it is the role. Rows that need
26
+ * an ARIA role should carry it on their own content.
27
+ */
28
+ role?: StackedCardRowRole;
29
+ /** Zero the padding, overriding the role (media rows, edge-to-edge bands). */
30
+ bleed?: boolean;
31
+ /** Footer bands lay their children out vertically. Defaults to `row`. */
32
+ direction?: StackedCardRowDirection;
33
+ /** A row can carry its own background (a tinted footer band, a state tint). */
34
+ background?: string;
35
+ className?: string;
36
+ children: ReactNode;
37
+ }
38
+ /**
39
+ * One row of a card's stack.
40
+ *
41
+ * In `row` direction the first level of children is distributed evenly along
42
+ * the X axis; a child carrying the `data-fixed` attribute keeps its own width
43
+ * and the rest share what remains.
44
+ */
45
+ export declare const StackedCardRow: React.ForwardRefExoticComponent<IStackedCardRowProps & React.RefAttributes<HTMLDivElement>>;
46
+ export interface IStackedCardCoverProps {
47
+ /**
48
+ * CSS `aspect-ratio` value that reserves the cover's height, e.g.
49
+ * `"260 / 132"`. A ratio, not a pixel height, so the cover scales with the
50
+ * card and holds its space before the media loads.
51
+ */
52
+ aspectRatio?: string;
53
+ /** Center slot — the media control (a play button over audio/video). */
54
+ centerSlot?: ReactNode;
55
+ /** Top-right slot — cover management (collapse, remove). */
56
+ topRightSlot?: ReactNode;
57
+ /**
58
+ * Render the thin collapsed strip instead of the media box. The collapse
59
+ * CONTROL lives in the caller's `topRightSlot`; this flag is the resulting
60
+ * visual state.
61
+ */
62
+ collapsed?: boolean;
63
+ /**
64
+ * What the collapsed strip shows — an ~8px colour bar, a favicon + domain
65
+ * row. Content-specific, so the caller supplies it.
66
+ */
67
+ collapsedStrip?: ReactNode;
68
+ /** Fired when the collapsed strip's expand affordance is activated. */
69
+ onExpand?: () => void;
70
+ /** Accessible label for the expand affordance. */
71
+ expandLabel?: string;
72
+ className?: string;
73
+ /** The fill: an `<img>`, an inline `<svg>`, or a solid-colour box. */
74
+ children: ReactNode;
75
+ }
76
+ /**
77
+ * A bleed row that holds media.
78
+ *
79
+ * Controls in either slot are revealed on hover OR focus-within, so they stay
80
+ * reachable by keyboard. Collapsed, the media box gives way to a strip that is
81
+ * itself the expand button.
82
+ */
83
+ export declare const StackedCardCover: {
84
+ ({ aspectRatio, centerSlot, topRightSlot, collapsed, collapsedStrip, onExpand, expandLabel, className, children, }: IStackedCardCoverProps): ReactElement;
85
+ displayName: string;
86
+ };
87
+ /** Centered media control (a play button). Drop the glyph inside. */
88
+ export declare const StackedCardPlayBadge: import("styled-components").StyledComponent<"span", any, {}, never>;
89
+ /** Top-right cover-management button (collapse, remove …). */
90
+ export declare const StackedCardCoverButton: import("styled-components").StyledComponent<"button", any, {}, never>;
91
+ //# sourceMappingURL=Primitives.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Primitives.d.ts","sourceRoot":"","sources":["../../../../src/components/StackedCard/Primitives.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvD,OAAO,EAGL,uBAAuB,EACvB,kBAAkB,EACnB,MAAM,aAAa,CAAC;AAerB;;;;;;;;;;;;;;GAcG;AAMH,yDAAyD;AACzD,eAAO,MAAM,gBAAgB,oEAAyB,CAAC;AAMvD,MAAM,WAAW,oBACf,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,MAAM,CAAC;IAC1D;;;;;;OAMG;IACH,IAAI,CAAC,EAAE,kBAAkB,CAAC;IAC1B,8EAA8E;IAC9E,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,yEAAyE;IACzE,SAAS,CAAC,EAAE,uBAAuB,CAAC;IACpC,+EAA+E;IAC/E,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;;GAMG;AACH,eAAO,MAAM,cAAc,6FAiC1B,CAAC;AAQF,MAAM,WAAW,sBAAsB;IACrC;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,wEAAwE;IACxE,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,4DAA4D;IAC5D,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;OAGG;IACH,cAAc,CAAC,EAAE,SAAS,CAAC;IAC3B,uEAAuE;IACvE,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,kDAAkD;IAClD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sEAAsE;IACtE,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;;GAMG;AACH,eAAO,MAAM,gBAAgB;wHAU1B,sBAAsB,GAAG,YAAY;;CA0CvC,CAAC;AAQF,qEAAqE;AACrE,eAAO,MAAM,oBAAoB,qEAA6B,CAAC;AAE/D,8DAA8D;AAC9D,eAAO,MAAM,sBAAsB,uEAA+B,CAAC"}