@homebound/beam 3.35.0 → 3.37.0

package/dist/index.d.cts

@@ -4483,7 +4483,8 @@ declare const Icon: React__default.MemoExoticComponent<(props: IconProps) => JSX
  * 3. Remove all fill attributes as these will be controlled by the wrapping component
  */
 declare const Icons: {
-    kanban: JSX.Element;
+    columns: JSX.Element;
+    columnsBadged: JSX.Element;
     expand: JSX.Element;
     collapse: JSX.Element;
     drag: JSX.Element;
@@ -4499,6 +4500,7 @@ declare const Icons: {
     checkbox: JSX.Element;
     check: JSX.Element;
     search: JSX.Element;
+    searchBadged: JSX.Element;
     comment: JSX.Element;
     commentFilled: JSX.Element;
     plus: JSX.Element;
@@ -4519,6 +4521,7 @@ declare const Icons: {
     unarchive: JSX.Element;
     duplicate: JSX.Element;
     filter: JSX.Element;
+    filterBadged: JSX.Element;
     impersonate: JSX.Element;
     errorCircle: JSX.Element;
     checkCircle: JSX.Element;

package/dist/index.d.ts

@@ -4483,7 +4483,8 @@ declare const Icon: React__default.MemoExoticComponent<(props: IconProps) => JSX
  * 3. Remove all fill attributes as these will be controlled by the wrapping component
  */
 declare const Icons: {
-    kanban: JSX.Element;
+    columns: JSX.Element;
+    columnsBadged: JSX.Element;
     expand: JSX.Element;
     collapse: JSX.Element;
     drag: JSX.Element;
@@ -4499,6 +4500,7 @@ declare const Icons: {
     checkbox: JSX.Element;
     check: JSX.Element;
     search: JSX.Element;
+    searchBadged: JSX.Element;
     comment: JSX.Element;
     commentFilled: JSX.Element;
     plus: JSX.Element;
@@ -4519,6 +4521,7 @@ declare const Icons: {
     unarchive: JSX.Element;
     duplicate: JSX.Element;
     filter: JSX.Element;
+    filterBadged: JSX.Element;
     impersonate: JSX.Element;
     errorCircle: JSX.Element;
     checkCircle: JSX.Element;

package/dist/index.js

@@ -4415,7 +4415,11 @@ var Icon = React3.memo((props) => {
 });
 var Icons = {
   // Actions
-  kanban: /* @__PURE__ */ jsx3(Fragment2, { children: /* @__PURE__ */ jsx3("path", { d: "M19.893 3.001H4C2.897 3.001 2 3.898 2 5.001V19.001C2 20.104 2.897 21.001 4 21.001H19.893C20.996 21.001 21.893 20.104 21.893 19.001V8V7V6V5.001V5C21.892 3.897 20.994 3.001 19.893 3.001ZM8 19.001H4V8H8V19.001ZM14 19.001H10V8H14V19.001ZM16 19.001V8H19.893L19.894 19.001H16Z" }) }),
+  columns: /* @__PURE__ */ jsx3(Fragment2, { children: /* @__PURE__ */ jsx3("path", { d: "M19.893 3.001H4C2.897 3.001 2 3.898 2 5.001V19.001C2 20.104 2.897 21.001 4 21.001H19.893C20.996 21.001 21.893 20.104 21.893 19.001V8V7V6V5.001V5C21.892 3.897 20.994 3.001 19.893 3.001ZM8 19.001H4V8H8V19.001ZM14 19.001H10V8H14V19.001ZM16 19.001V8H19.893L19.894 19.001H16Z" }) }),
+  columnsBadged: /* @__PURE__ */ jsxs2(Fragment2, { children: [
+    /* @__PURE__ */ jsx3("path", { d: "M15.6006 3.00098C15.2173 3.75094 15 4.59994 15 5.5C15 6.67655 15.3708 7.76585 16 8.66016V19.001H19.8936L19.8926 10.9658C20.0921 10.9877 20.2947 11 20.5 11C20.9812 11 21.4477 10.9374 21.8926 10.8213V19.001C21.8926 20.104 20.9956 21.001 19.8926 21.001H4C2.897 21.001 2 20.104 2 19.001V5.00098C2 3.89798 2.897 3.00098 4 3.00098H15.6006ZM4 8V19.001H8V8H4ZM10 8V19.001H14V8H10Z" }),
+    /* @__PURE__ */ jsx3("circle", { cx: "20.5", cy: "5.5", r: "3.5", fill: `var(${"--b-primary" /* Primary */})` })
+  ] }),
   expand: /* @__PURE__ */ jsx3("path", { d: "M5 12H3V21H12V19H5V12ZM12 5H19V12H21V3H12V5Z" }),
   collapse: /* @__PURE__ */ jsx3("path", { d: "M16.121 6.465L14 4.344V10H19.656L17.535 7.879L20.707 4.707L19.293 3.293L16.121 6.465ZM4.70703 3.293L3.29303 4.707L6.46503 7.879L4.34403 10H10V4.344L7.87903 6.465L4.70703 3.293ZM19.656 14H14V19.656L16.121 17.535L19.293 20.707L20.707 19.293L17.535 16.121L19.656 14ZM6.46503 16.121L3.29303 19.293L4.70703 20.707L7.87903 17.535L10 19.656V14H4.34403L6.46503 16.121Z" }),
   drag: /* @__PURE__ */ jsxs2(Fragment2, { children: [
@@ -4461,6 +4465,10 @@ var Icons = {
   checkbox: /* @__PURE__ */ jsx3("path", { d: "M7 5C5.897 5 5 5.897 5 7V17C5 18.103 5.897 19 7 19H17C18.103 19 19 18.103 19 17V7C19 5.897 18.103 5 17 5H7ZM7 17V7H17L17.002 17H7Z" }),
   check: /* @__PURE__ */ jsx3("path", { d: "M9.99997 15.586L6.70697 12.293L5.29297 13.707L9.99997 18.414L19.707 8.70697L18.293 7.29297L9.99997 15.586Z" }),
   search: /* @__PURE__ */ jsx3("path", { d: "M10 18C11.846 18 13.543 17.365 14.897 16.312L19.293 20.708L20.707 19.294L16.311 14.898C17.365 13.543 18 11.846 18 10C18 5.589 14.411 2 10 2C5.589 2 2 5.589 2 10C2 14.411 5.589 18 10 18ZM10 4C13.309 4 16 6.691 16 10C16 13.309 13.309 16 10 16C6.691 16 4 13.309 4 10C4 6.691 6.691 4 10 4Z" }),
+  searchBadged: /* @__PURE__ */ jsxs2(Fragment2, { children: [
+    /* @__PURE__ */ jsx3("path", { d: "M10 2C11.0109 2 11.9779 2.19048 12.8691 2.53418C12.5119 3.09081 12.2502 3.71507 12.1123 4.38477C11.4549 4.13674 10.7432 4 10 4C6.691 4 4 6.691 4 10C4 13.309 6.691 16 10 16C13.0458 16 15.5653 13.7197 15.9473 10.7764C16.4398 10.9211 16.9606 11 17.5 11C17.6477 11 17.7938 10.9919 17.9385 10.9805C17.7569 12.4453 17.1749 13.7872 16.3105 14.8984L20.707 19.2939L19.293 20.708L14.8975 16.3115C13.5435 17.3645 11.846 18 10 18C5.589 18 2 14.411 2 10C2 5.589 5.589 2 10 2Z" }),
+    /* @__PURE__ */ jsx3("circle", { cx: "17.5", cy: "5.5", r: "3.5", fill: `var(${"--b-primary" /* Primary */})` })
+  ] }),
   comment: /* @__PURE__ */ jsx3("path", { d: "M12 2C6.486 2 2 5.589 2 10C2 12.908 3.898 15.516 7 16.934V22L12.34 17.995C17.697 17.852 22 14.32 22 10C22 5.589 17.514 2 12 2ZM12 16H11.667L9 18V15.583L8.359 15.336C5.67 14.301 4 12.256 4 10C4 6.691 7.589 4 12 4C16.411 4 20 6.691 20 10C20 13.309 16.411 16 12 16Z" }),
   commentFilled: /* @__PURE__ */ jsx3("path", { d: "M10 0C4.486 0 0 3.589 0 8C0 10.908 1.898 13.516 5 14.934V20L10.34 15.995C15.697 15.852 20 12.32 20 8C20 3.589 15.514 0 10 0Z" }),
   plus: /* @__PURE__ */ jsx3("path", { d: "M19 11H13V5H11V11H5V13H11V19H13V13H19V11Z" }),
@@ -4512,6 +4520,10 @@ var Icons = {
     /* @__PURE__ */ jsx3("path", { d: "M20 2H8V4H20V16H22V4C22 2.897 21.103 2 20 2Z" })
   ] }),
   filter: /* @__PURE__ */ jsx3("path", { d: "M7.625 4C7.14175 4 6.75 4.39797 6.75 4.88889V5.92952C5.73046 6.29559 5 7.28336 5 8.44444C5 9.60553 5.73046 10.5933 6.75 10.9594V19.1111C6.75 19.602 7.14175 20 7.625 20C8.10825 20 8.5 19.602 8.5 19.1111V10.9594C9.51954 10.5933 10.25 9.60553 10.25 8.44444C10.25 7.28336 9.51954 6.29559 8.5 5.92952V4.88889C8.5 4.39797 8.10825 4 7.625 4ZM8.5 8.44444C8.5 8.93537 8.10825 9.33333 7.625 9.33333C7.14175 9.33333 6.75 8.93537 6.75 8.44444C6.75 7.95353 7.14175 7.55556 7.625 7.55556C8.10825 7.55556 8.5 7.95353 8.5 8.44444ZM16.375 4C15.8917 4 15.5 4.39797 15.5 4.88889V12.1517C14.4805 12.5178 13.75 13.5056 13.75 14.6667C13.75 15.8277 14.4805 16.8156 15.5 17.1816V19.1111C15.5 19.602 15.8917 20 16.375 20C16.8583 20 17.25 19.602 17.25 19.1111V17.1816C18.2695 16.8156 19 15.8277 19 14.6667C19 13.5056 18.2695 12.5178 17.25 12.1517V4.88889C17.25 4.39797 16.8583 4 16.375 4ZM17.25 14.6667C17.25 15.1576 16.8583 15.5556 16.375 15.5556C15.8917 15.5556 15.5 15.1576 15.5 14.6667C15.5 14.1757 15.8917 13.7778 16.375 13.7778C16.8583 13.7778 17.25 14.1757 17.25 14.6667Z" }),
+  filterBadged: /* @__PURE__ */ jsxs2(Fragment2, { children: [
+    /* @__PURE__ */ jsx3("path", { d: "M7.625 4C8.10817 4 8.49988 4.39786 8.5 4.88867V5.92969C9.51948 6.29576 10.25 7.28332 10.25 8.44434C10.25 9.60537 9.51948 10.5929 8.5 10.959V19.1113C8.49988 19.6022 8.10817 20 7.625 20C7.14183 20 6.75012 19.6022 6.75 19.1113V10.959C5.73052 10.5929 5 9.60537 5 8.44434C5.00005 7.28332 5.73052 6.29576 6.75 5.92969V4.88867C6.75012 4.39786 7.14183 4 7.625 4ZM15.5 8.1084C16.0277 8.45265 16.6177 8.70846 17.25 8.85547V12.1514C18.2696 12.5174 19 13.5059 19 14.667C18.9999 15.8279 18.2695 16.8156 17.25 17.1816V19.1113C17.2499 19.6022 16.8582 20 16.375 20C15.8918 20 15.5001 19.6022 15.5 19.1113V17.1816C14.4805 16.8156 13.7501 15.8279 13.75 14.667C13.75 13.5059 14.4804 12.5174 15.5 12.1514V8.1084ZM16.375 13.7773C15.8917 13.7773 15.5 14.1761 15.5 14.667C15.5002 15.1578 15.8918 15.5557 16.375 15.5557C16.8582 15.5557 17.2498 15.1578 17.25 14.667C17.25 14.1761 16.8583 13.7773 16.375 13.7773ZM7.625 7.55566C7.14179 7.55566 6.75006 7.95347 6.75 8.44434C6.75 8.93526 7.14176 9.33301 7.625 9.33301C8.10824 9.33301 8.5 8.93526 8.5 8.44434C8.49994 7.95347 8.10821 7.55566 7.625 7.55566Z" }),
+    /* @__PURE__ */ jsx3("circle", { cx: "18.5", cy: "3.5", r: "3.5", fill: `var(${"--b-primary" /* Primary */})` })
+  ] }),
   impersonate: /* @__PURE__ */ jsxs2(Fragment2, { children: [
     /* @__PURE__ */ jsx3("path", { d: "M17.882 7L18.5 7L18.5 4L22.5 8L18.5 12L18.5 9L17.882 9L15.5 9L15.5 7L17.882 7Z" }),
     /* @__PURE__ */ jsx3("path", { d: "M16.618 14.5L16 14.5L16 11.5L12 15.5L16 19.5L16 16.5L16.618 16.5L19 16.5L19 14.5L16.618 14.5Z" }),
@@ -16155,7 +16167,7 @@ function TableCardView(props) {
     paddingBottom: "pb3",
     paddingRight: "pr3",
     paddingLeft: "pl3",
-    width: "w_330px",
+    width: "w100",
     height: "h100",
     boxShadow: "bshBasic",
     backgroundColor: ["bgColor_var", {
@@ -16228,6 +16240,7 @@ var runningInJest = false;
 function setRunningInJest() {
   runningInJest = true;
 }
+var CARD_MIN_WIDTH_PX = 280;
 var defaults = {
   style: defaultStyle,
   stickyHeader: false
@@ -16745,7 +16758,18 @@ function CardView({
   const validatedScrollIndex = savedScrollIndex !== void 0 && savedScrollIndex > 0 && savedScrollIndex < cardRows.length ? savedScrollIndex : void 0;
   const virtuosoKey = !!validatedScrollIndex && cardRows.length > 0 ? "with-data" : "virtuoso";
   if (runningInJest) {
-    return /* @__PURE__ */ jsx87("div", { className: "pt2 pb2", children: /* @__PURE__ */ jsx87("div", { className: "dg gtc_repeat_auto_fill_330px jcc gap3 pt3 pb3 pr3 pl3", children: cardRows }) });
+    return /* @__PURE__ */ jsx87("div", { className: "pt2 pb2", children: /* @__PURE__ */ jsx87("div", { ...trussProps52({
+      display: "dg",
+      gridTemplateColumns: ["gtc_var", {
+        "--gridTemplateColumns": maybeCssVar31(`repeat(auto-fill, minmax(${CARD_MIN_WIDTH_PX}px, 1fr))`)
+      }],
+      justifyContent: "jcc",
+      gap: "gap3",
+      paddingTop: "pt3",
+      paddingBottom: "pb3",
+      paddingRight: "pr3",
+      paddingLeft: "pl3"
+    }), children: cardRows }) });
   }
   return /* @__PURE__ */ jsx87("div", { className: "pt2 pb2 h100", children: /* @__PURE__ */ createElement2(VirtuosoGrid, { useWindowScroll: inDocumentScrollLayout && !customScrollParent, ...customScrollParent ? {
     customScrollParent
@@ -16758,7 +16782,9 @@ function CardView({
     }, ref) {
       return /* @__PURE__ */ jsx87("div", { ref, ...mergeProps21(void 0, style, {
         display: "dg",
-        gridTemplateColumns: "gtc_repeat_auto_fill_330px",
+        gridTemplateColumns: ["gtc_var", {
+          "--gridTemplateColumns": maybeCssVar31(`repeat(auto-fill, minmax(${CARD_MIN_WIDTH_PX}px, 1fr))`)
+        }],
         justifyContent: "jcc",
         gap: "gap3",
         paddingTop: "pt3",
@@ -20309,8 +20335,8 @@ function FilterDropdownMenu(props) {
         opacity: "o0"
       } : {}
     }), children: searchTextField }),
-    sm && hasSearch && /* @__PURE__ */ jsx145(IconButton, { variant: "outline", icon: "search", label: "Search", onClick: () => setSearchIsOpen(!searchIsOpen), active: searchIsOpen, ...testId.searchButton }),
-    sm && hasFilters && /* @__PURE__ */ jsx145(IconButton, { variant: "outline", icon: "filter", label: "Filter", active: isOpen, onClick: () => setIsOpen(!isOpen), ...testId.button }),
+    sm && hasSearch && /* @__PURE__ */ jsx145(IconButton, { variant: "outline", icon: searchValue ? "searchBadged" : "search", label: "Search", onClick: () => setSearchIsOpen(!searchIsOpen), active: searchIsOpen, ...testId.searchButton }),
+    sm && hasFilters && /* @__PURE__ */ jsx145(IconButton, { variant: "outline", icon: activeFilterCount > 0 ? "filterBadged" : "filter", label: "Filter", active: isOpen, onClick: () => setIsOpen(!isOpen), ...testId.button }),
     !sm && hasFilters && /* @__PURE__ */ jsx145(Button, { label: "Filter", icon: "filter", size: "md", endAdornment: /* @__PURE__ */ jsxs72("div", { className: "df aic gap1", children: [
       activeFilterCount > 0 && /* @__PURE__ */ jsx145(CountBadge, { count: activeFilterCount }),
       /* @__PURE__ */ jsx145(Icon, { icon: isOpen ? "chevronUp" : "chevronDown" })
@@ -20399,7 +20425,7 @@ function EditColumnsButton(props) {
   } = useMenuTrigger3({
     isDisabled: !!disabled
   }, state, buttonRef);
-  const tid = useTestIds(props, "kanban");
+  const tid = useTestIds(props, "columns");
   const {
     sm
   } = useBreakpoint();
@@ -20419,7 +20445,7 @@ function EditColumnsButton(props) {
     api.setVisibleColumns(columns.filter((column2) => column2.canHide ? ids.includes(column2.id) : true).map((c) => c.id));
   }, [columns, api]);
   return /* @__PURE__ */ jsx146(OverlayTrigger, { ...props, trigger: {
-    icon: "kanban",
+    icon: "columns",
     size: "md",
     label: "",
     variant: "secondaryBlack"