add scrum points

src/components/Item/ItemContent.tsx

@@ -16,6 +16,7 @@ import {
   constructMenuTimePickerOnChange,
   constructTimePicker,
 } from './helpers';
+import { Icon } from '../Icon/Icon';
 
 function useDatePickers(item: Item) {
   const { stateManager, boardModifiers } = Preact.useContext(KanbanContext);
@@ -254,6 +255,22 @@ export const ItemContent = Preact.memo(function ItemContent({
           onEditTime={onEditTime}
           getDateColor={getDateColor}
         />
+
+        <div className={c('item-points-list')}>
+          {item.data.completedPoints != undefined && (
+            <div className={c('item-points-completed')}>
+              <Icon name="lightbulb" />
+              <span>{item.data.completedPoints}</span>
+            </div>
+          )}
+          {item.data.points != undefined && (
+            <div>
+              <Icon name="lightbulb" />
+              <span>{item.data.points}</span>
+            </div>
+          )}
+        </div>
+
         {!hideTagsDisplay && !!item.data.metadata.tags?.length && (
           <div className={c('item-tags')}>
             {item.data.metadata.tags.map((tag, i) => {

src/components/Lane/LaneHeader.tsx

@@ -44,6 +44,16 @@ export const LaneHeader = Preact.memo(function LaneHeader({
     }
   }, [lane.data.forceEditMode]);
 
+  const [points, completedPoints] = lane.children.reduce(
+    ([points, completedPoints], child) => {
+      return [
+        points + (child.data.points ?? 0),
+        completedPoints + (child.data.completedPoints ?? 0),
+      ];
+    },
+    [0, 0]
+  );
+
   return (
     <>
       <div
@@ -53,13 +63,14 @@ export const LaneHeader = Preact.memo(function LaneHeader({
         <div className={c('lane-grip')} ref={dragHandleRef}>
           <GripIcon />
         </div>
-
         <LaneTitle
           isEditing={isEditing}
           setIsEditing={setIsEditing}
           itemCount={lane.children.length}
           maxItems={lane.data.maxItems}
           title={lane.data.title}
+          points={points}
+          completedPoints={completedPoints}
           onChange={(e) => {
             const { title, maxItems } = parseLaneTitle(
               (e.target as HTMLTextAreaElement).value

src/components/Lane/LaneTitle.tsx

@@ -16,6 +16,8 @@ export interface LaneTitleProps {
   isEditing: boolean;
   setIsEditing: Preact.StateUpdater<boolean>;
   onChange: Preact.ChangeEventHandler<HTMLTextAreaElement>;
+  points: number;
+  completedPoints: number;
 }
 
 export function LaneTitle({
@@ -25,6 +27,8 @@ export function LaneTitle({
   setIsEditing,
   title,
   onChange,
+  points,
+  completedPoints,
 }: LaneTitleProps) {
   const { stateManager } = Preact.useContext(KanbanContext);
   const inputRef = Preact.useRef<HTMLTextAreaElement>();
@@ -84,7 +88,7 @@ export function LaneTitle({
                 const internalLinkPath =
                   e.target instanceof
                     (e.view as Window & typeof globalThis).HTMLAnchorElement &&
-                  e.target.hasClass('internal-link')
+                    e.target.hasClass('internal-link')
                     ? e.target.dataset.href
                     : undefined;
 
@@ -113,6 +117,13 @@ export function LaneTitle({
           )}
         </div>
       )}
+
+      {completedPoints != 0 && (
+        <div className={c('lane-title-points-completed')}>
+          {completedPoints}
+        </div>
+      )}
+      {points != 0 && <div className={c('lane-title-points')}>{points}</div>}
     </>
   );
 }

src/components/types.ts

@@ -79,6 +79,8 @@ export interface ItemData {
   metadata: ItemMetaData;
   dom?: HTMLDivElement;
   forceEditMode?: boolean;
+  points?: number;
+  completedPoints?: number;
 }
 
 export interface ErrorReport {

src/main.less

@@ -1535,3 +1535,46 @@ body:not(.native-scrollbars)
   left: 0;
   transform: translate(0, -100%);
 }
+
+.kanban-plugin__item-points-list {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 10px;
+}
+
+.kanban-plugin__item-points-list > .kanban-plugin__item-points-completed {
+  background-color: var(--color-accent);
+}
+
+.kanban-plugin__item-points-list .kanban-plugin__icon   {
+  --icon-stroke: 3;
+  line-height: var(--line-height-tight);
+}
+
+
+.kanban-plugin__item-points-list > *   {
+  background-color: var(--color-accent-2);
+  padding: 2px;
+  border-radius: 4px;
+  color: var(--text-on-accent);
+}
+
+.kanban-plugin__lane-title-points-completed  {
+  color: var(--color-accent);
+  display: block;
+  padding: 4;
+  line-height: 1;
+  margin-left: 5px;
+  font-size: 13px;
+  font-weight: 600;
+}
+
+.kanban-plugin__lane-title-points  {
+  color: var(--color-accent-2);
+  display: block;
+  padding: 4;
+  line-height: 1;
+  margin-left: 5px;
+  font-size: 13px;
+  font-weight: 600;
+}

src/parsers/formats/list.ts

@@ -161,6 +161,18 @@ export function listItemToItemData(
 
   itemData.title = replaceBrs(executeDeletion(title));
 
+  const extractPoints = (regex: RegExp) => {
+    const match = itemData.titleRaw.match(regex);
+    const result = parseFloat(match?.[1]);
+    if (!isNaN(result)) {
+      itemData.title = itemData.title.replace(match?.[0], '');
+      return result;
+    }
+  };
+
+  itemData.points = extractPoints(/\((\d+\.?\d*)\)/);
+  itemData.completedPoints = extractPoints(/(?<!\[)\[(\d+\.?\d*)\](?!\[)/);
+
   return itemData;
 }