@industry-theme/backlogmd-kanban-panel 1.0.42 → 1.0.44

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.
@@ -1 +1 @@
1
- {"version":3,"file":"KanbanPanel.d.ts","sourceRoot":"","sources":["../../src/panels/KanbanPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA6E,MAAM,OAAO,CAAC;AAelG,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,UAAU,CAAC;AAiBtD;;;;;;;GAOG;AACH,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CA21CvD,CAAC"}
1
+ {"version":3,"file":"KanbanPanel.d.ts","sourceRoot":"","sources":["../../src/panels/KanbanPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA6E,MAAM,OAAO,CAAC;AAelG,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,UAAU,CAAC;AAiBtD;;;;;;;GAOG;AACH,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CA83CvD,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"TaskCard.d.ts","sourceRoot":"","sources":["../../../../src/panels/kanban/components/TaskCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAIxC,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAgB7C,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,IAAI,CAAC;IACX,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IAC/B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAgS5C,CAAC"}
1
+ {"version":3,"file":"TaskCard.d.ts","sourceRoot":"","sources":["../../../../src/panels/kanban/components/TaskCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAIxC,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAgB7C,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,IAAI,CAAC;IACX,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IAC/B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAoR5C,CAAC"}
@@ -9213,7 +9213,8 @@ const TaskCard = ({
9213
9213
  borderRadius: theme2.radii[2],
9214
9214
  padding: "12px",
9215
9215
  border: `1px solid ${theme2.colors.border}`,
9216
- borderLeft: `4px solid ${getPriorityColor(task.priority)}`,
9216
+ borderLeft: `4px solid transparent`,
9217
+ borderRight: `4px solid ${getPriorityColor(task.priority)}`,
9217
9218
  cursor: isDragOverlay ? "grabbing" : "grab",
9218
9219
  transition: isDragging ? "none" : "all 0.2s ease",
9219
9220
  minHeight: "44px",
@@ -9265,20 +9266,12 @@ const TaskCard = ({
9265
9266
  ...attributes,
9266
9267
  onMouseEnter: (e) => {
9267
9268
  if (!isDragging && !isDragOverlay) {
9268
- const desc = e.currentTarget.querySelector("p");
9269
- if (desc) {
9270
- desc.style.maxHeight = "20em";
9271
- }
9272
- e.currentTarget.style.borderLeft = `4px solid ${getPriorityColor(task.priority)}`;
9269
+ e.currentTarget.style.borderLeft = `4px solid ${theme2.colors.primary}`;
9273
9270
  }
9274
9271
  },
9275
9272
  onMouseLeave: (e) => {
9276
9273
  if (!isDragging && !isDragOverlay) {
9277
- const desc = e.currentTarget.querySelector("p");
9278
- if (desc) {
9279
- desc.style.maxHeight = "2.8em";
9280
- }
9281
- e.currentTarget.style.borderLeft = `4px solid ${getPriorityColor(task.priority)}`;
9274
+ e.currentTarget.style.borderLeft = `4px solid transparent`;
9282
9275
  }
9283
9276
  },
9284
9277
  children: [
@@ -9325,9 +9318,8 @@ const TaskCard = ({
9325
9318
  color: theme2.colors.textSecondary,
9326
9319
  overflow: "hidden",
9327
9320
  lineHeight: "1.4",
9328
- maxHeight: "2.8em",
9321
+ maxHeight: "2.8em"
9329
9322
  // 2 lines (1.4 * 2)
9330
- transition: "max-height 0.3s ease"
9331
9323
  },
9332
9324
  children: task.description
9333
9325
  }
@@ -11093,6 +11085,7 @@ const KanbanPanel = ({
11093
11085
  const [selectedMilestoneId, setSelectedMilestoneId] = useState(null);
11094
11086
  const [milestoneStatusFilter, setMilestoneStatusFilter] = useState(null);
11095
11087
  const [searchQuery, setSearchQuery] = useState("");
11088
+ const [isSearchVisible, setIsSearchVisible] = useState(false);
11096
11089
  const searchDebounceRef = useRef(null);
11097
11090
  const handleSearchChange = useCallback((value) => {
11098
11091
  setSearchQuery(value);
@@ -11587,77 +11580,33 @@ const KanbanPanel = ({
11587
11580
  }
11588
11581
  )
11589
11582
  ] }),
11590
- isBacklogProject && viewMode === "board" && totalTasksState.total > 0 && /* @__PURE__ */ jsxs(
11591
- "div",
11592
- {
11593
- style: {
11594
- position: "relative",
11595
- flex: "1 1 200px",
11596
- maxWidth: "300px",
11597
- minWidth: "150px"
11598
- },
11599
- children: [
11600
- /* @__PURE__ */ jsx(
11601
- Search,
11602
- {
11603
- size: 16,
11604
- color: theme2.colors.textSecondary,
11605
- style: {
11606
- position: "absolute",
11607
- left: "10px",
11608
- top: "50%",
11609
- transform: "translateY(-50%)",
11610
- pointerEvents: "none"
11611
- }
11612
- }
11613
- ),
11614
- /* @__PURE__ */ jsx(
11615
- "input",
11616
- {
11617
- type: "text",
11618
- placeholder: "Search tasks...",
11619
- value: searchQuery,
11620
- onChange: (e) => handleSearchChange(e.target.value),
11621
- style: {
11622
- width: "100%",
11623
- padding: "8px 32px 8px 32px",
11624
- fontSize: theme2.fontSizes[1],
11625
- fontFamily: theme2.fonts.body,
11626
- border: `1px solid ${theme2.colors.border}`,
11627
- borderRadius: theme2.radii[2],
11628
- background: theme2.colors.backgroundSecondary,
11629
- color: theme2.colors.text,
11630
- outline: "none",
11631
- boxSizing: "border-box"
11632
- }
11633
- }
11634
- ),
11635
- searchQuery && /* @__PURE__ */ jsx(
11636
- "button",
11637
- {
11638
- onClick: handleClearSearch,
11639
- style: {
11640
- position: "absolute",
11641
- right: "6px",
11642
- top: "50%",
11643
- transform: "translateY(-50%)",
11644
- background: "transparent",
11645
- border: "none",
11646
- padding: "4px",
11647
- cursor: "pointer",
11648
- display: "flex",
11649
- alignItems: "center",
11650
- justifyContent: "center",
11651
- color: theme2.colors.textSecondary
11652
- },
11653
- "aria-label": "Clear search",
11654
- children: /* @__PURE__ */ jsx(X, { size: 14 })
11583
+ isBacklogProject && totalTasksState.total > 0 && /* @__PURE__ */ jsx("div", { style: { display: "flex", alignItems: "center", gap: "8px", flexWrap: "wrap" }, children: viewMode === "board" ? /* @__PURE__ */ jsxs(Fragment, { children: [
11584
+ /* @__PURE__ */ jsx(
11585
+ "button",
11586
+ {
11587
+ onClick: () => {
11588
+ const newVisible = !isSearchVisible;
11589
+ setIsSearchVisible(newVisible);
11590
+ if (!newVisible) {
11591
+ setSearchQuery("");
11655
11592
  }
11656
- )
11657
- ]
11658
- }
11659
- ),
11660
- isBacklogProject && totalTasksState.total > 0 && /* @__PURE__ */ jsx("div", { style: { display: "flex", alignItems: "center", gap: "12px", flexWrap: "wrap" }, children: viewMode === "board" ? /* @__PURE__ */ jsxs(Fragment, { children: [
11593
+ },
11594
+ style: {
11595
+ display: "flex",
11596
+ alignItems: "center",
11597
+ justifyContent: "center",
11598
+ background: isSearchVisible ? theme2.colors.primary : theme2.colors.backgroundSecondary,
11599
+ color: isSearchVisible ? theme2.colors.textOnPrimary : theme2.colors.textSecondary,
11600
+ border: isSearchVisible ? "none" : `1px solid ${theme2.colors.border}`,
11601
+ borderRadius: theme2.radii[2],
11602
+ padding: "6px",
11603
+ cursor: "pointer",
11604
+ transition: "all 0.2s ease"
11605
+ },
11606
+ title: isSearchVisible ? "Hide search" : "Search tasks",
11607
+ children: /* @__PURE__ */ jsx(Search, { size: 16 })
11608
+ }
11609
+ ),
11661
11610
  canWrite && /* @__PURE__ */ jsxs(
11662
11611
  "button",
11663
11612
  {
@@ -11681,26 +11630,6 @@ const KanbanPanel = ({
11681
11630
  "Add Task"
11682
11631
  ]
11683
11632
  }
11684
- ),
11685
- totalTasksState.hasMore && /* @__PURE__ */ jsx(
11686
- "button",
11687
- {
11688
- onClick: loadMoreTasks,
11689
- disabled: totalTasksState.isLoadingMore,
11690
- style: {
11691
- background: theme2.colors.backgroundSecondary,
11692
- color: theme2.colors.text,
11693
- border: `1px solid ${theme2.colors.border}`,
11694
- borderRadius: theme2.radii[2],
11695
- padding: "6px 12px",
11696
- fontSize: theme2.fontSizes[1],
11697
- fontWeight: theme2.fontWeights.medium,
11698
- cursor: totalTasksState.isLoadingMore ? "wait" : "pointer",
11699
- opacity: totalTasksState.isLoadingMore ? 0.7 : 1,
11700
- transition: "opacity 0.2s ease"
11701
- },
11702
- children: totalTasksState.isLoadingMore ? "Loading..." : `Load more (${totalTasksState.total - totalTasksState.loaded} remaining)`
11703
- }
11704
11633
  )
11705
11634
  ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
11706
11635
  canWrite && /* @__PURE__ */ jsxs(
@@ -11787,6 +11716,108 @@ const KanbanPanel = ({
11787
11716
  ]
11788
11717
  }
11789
11718
  ),
11719
+ isBacklogProject && viewMode === "board" && totalTasksState.total > 0 && isSearchVisible && /* @__PURE__ */ jsxs(
11720
+ "div",
11721
+ {
11722
+ style: {
11723
+ flexShrink: 0,
11724
+ display: "flex",
11725
+ alignItems: "center",
11726
+ gap: "12px"
11727
+ },
11728
+ children: [
11729
+ /* @__PURE__ */ jsxs(
11730
+ "div",
11731
+ {
11732
+ style: {
11733
+ position: "relative",
11734
+ flex: 1
11735
+ },
11736
+ children: [
11737
+ /* @__PURE__ */ jsx(
11738
+ Search,
11739
+ {
11740
+ size: 16,
11741
+ color: theme2.colors.textSecondary,
11742
+ style: {
11743
+ position: "absolute",
11744
+ left: "10px",
11745
+ top: "50%",
11746
+ transform: "translateY(-50%)",
11747
+ pointerEvents: "none"
11748
+ }
11749
+ }
11750
+ ),
11751
+ /* @__PURE__ */ jsx(
11752
+ "input",
11753
+ {
11754
+ type: "text",
11755
+ placeholder: "Search tasks...",
11756
+ value: searchQuery,
11757
+ onChange: (e) => handleSearchChange(e.target.value),
11758
+ style: {
11759
+ width: "100%",
11760
+ padding: "8px 32px 8px 32px",
11761
+ fontSize: theme2.fontSizes[1],
11762
+ fontFamily: theme2.fonts.body,
11763
+ border: `1px solid ${theme2.colors.border}`,
11764
+ borderRadius: theme2.radii[2],
11765
+ background: theme2.colors.backgroundSecondary,
11766
+ color: theme2.colors.text,
11767
+ outline: "none",
11768
+ boxSizing: "border-box"
11769
+ }
11770
+ }
11771
+ ),
11772
+ searchQuery && /* @__PURE__ */ jsx(
11773
+ "button",
11774
+ {
11775
+ onClick: handleClearSearch,
11776
+ style: {
11777
+ position: "absolute",
11778
+ right: "6px",
11779
+ top: "50%",
11780
+ transform: "translateY(-50%)",
11781
+ background: "transparent",
11782
+ border: "none",
11783
+ padding: "4px",
11784
+ cursor: "pointer",
11785
+ display: "flex",
11786
+ alignItems: "center",
11787
+ justifyContent: "center",
11788
+ color: theme2.colors.textSecondary
11789
+ },
11790
+ "aria-label": "Clear search",
11791
+ children: /* @__PURE__ */ jsx(X, { size: 14 })
11792
+ }
11793
+ )
11794
+ ]
11795
+ }
11796
+ ),
11797
+ totalTasksState.hasMore && /* @__PURE__ */ jsx(
11798
+ "button",
11799
+ {
11800
+ onClick: loadMoreTasks,
11801
+ disabled: totalTasksState.isLoadingMore,
11802
+ style: {
11803
+ flexShrink: 0,
11804
+ background: theme2.colors.backgroundSecondary,
11805
+ color: theme2.colors.text,
11806
+ border: `1px solid ${theme2.colors.border}`,
11807
+ borderRadius: theme2.radii[2],
11808
+ padding: "8px 12px",
11809
+ fontSize: theme2.fontSizes[1],
11810
+ fontWeight: theme2.fontWeights.medium,
11811
+ cursor: totalTasksState.isLoadingMore ? "wait" : "pointer",
11812
+ opacity: totalTasksState.isLoadingMore ? 0.7 : 1,
11813
+ transition: "opacity 0.2s ease"
11814
+ },
11815
+ children: totalTasksState.isLoadingMore ? "Loading..." : `Load more (${totalTasksState.total - totalTasksState.loaded} remaining)`
11816
+ }
11817
+ )
11818
+ ]
11819
+ }
11820
+ ),
11790
11821
  currentError && /* @__PURE__ */ jsxs(
11791
11822
  "div",
11792
11823
  {