qt-ui-kit 1.0.25 → 1.0.27

package/dist/index.mjs

@@ -14873,9 +14873,9 @@ function formatCustomRelative(date) {
     return `Tomorrow @ ${format(date, "h:mm a")}`;
   }
   if (isSameWeek(date, now, { weekStartsOn: 1 })) {
-    return `${format(date, "EEEE")} @ ${format(date, "h:mm a")}`;
+    return `${format(date, "EEE")} @ ${format(date, "h:mm a")}`;
   }
-  return `${format(date, "EEEE, do MMMM")} @ ${format(date, "h:mm a")}`;
+  return `${format(date, "EEE, do MMMM")} @ ${format(date, "h:mm a")}`;
 }
 
 // src/components/molecules/text_content/sender_source_row/sender_source_row.tsx
@@ -16373,6 +16373,282 @@ function SearchBar() {
   ] });
 }
 
+// src/components/atoms/icons/base_icons/Mail.tsx
+import { jsx as jsx39 } from "react/jsx-runtime";
+function Mail({
+  size = 24,
+  color = "#1D1D1F",
+  fillColor = "none"
+}) {
+  const getIconData = () => {
+    switch (size) {
+      case 16:
+        return {
+          viewBox: "0 0 16 16",
+          path: /* @__PURE__ */ jsx39(
+            "path",
+            {
+              d: "M2 5.33337L7.2604 8.84031C7.70827 9.13888 8.29173 9.13888 8.7396 8.84031L14 5.33337M3.33333 12.6667H12.6667C13.403 12.6667 14 12.0698 14 11.3334V4.66671C14 3.93033 13.403 3.33337 12.6667 3.33337H3.33333C2.59695 3.33337 2 3.93033 2 4.66671V11.3334C2 12.0698 2.59695 12.6667 3.33333 12.6667Z",
+              stroke: color,
+              "stroke-width": "1.25",
+              "stroke-linecap": "round",
+              "stroke-linejoin": "round"
+            }
+          )
+        };
+      case 20:
+        return {
+          viewBox: "0 0 20 20",
+          path: /* @__PURE__ */ jsx39(
+            "path",
+            {
+              d: "M2.5 6.66663L9.0755 11.0503C9.63533 11.4235 10.3647 11.4235 10.9245 11.0503L17.5 6.66663M4.16667 15.8333H15.8333C16.7538 15.8333 17.5 15.0871 17.5 14.1666V5.83329C17.5 4.91282 16.7538 4.16663 15.8333 4.16663H4.16667C3.24619 4.16663 2.5 4.91282 2.5 5.83329V14.1666C2.5 15.0871 3.24619 15.8333 4.16667 15.8333Z",
+              stroke: color,
+              "stroke-width": "1.5",
+              "stroke-linecap": "round",
+              "stroke-linejoin": "round"
+            }
+          )
+        };
+      case 24:
+        return {
+          viewBox: "0 0 24 24",
+          path: /* @__PURE__ */ jsx39(
+            "path",
+            {
+              d: "M3 8L10.8906 13.2604C11.5624 13.7083 12.4376 13.7083 13.1094 13.2604L21 8M5 19H19C20.1046 19 21 18.1046 21 17V7C21 5.89543 20.1046 5 19 5H5C3.89543 5 3 5.89543 3 7V17C3 18.1046 3.89543 19 5 19Z",
+              stroke: color,
+              "stroke-width": "2",
+              "stroke-linecap": "round",
+              "stroke-linejoin": "round"
+            }
+          )
+        };
+      case 36:
+        return {
+          viewBox: "0 0 36 36",
+          path: /* @__PURE__ */ jsx39(
+            "path",
+            {
+              d: "M4.5 12L16.3359 19.8906C17.3436 20.5624 18.6564 20.5624 19.6641 19.8906L31.5 12M7.5 28.5H28.5C30.1569 28.5 31.5 27.1569 31.5 25.5V10.5C31.5 8.84315 30.1569 7.5 28.5 7.5H7.5C5.84315 7.5 4.5 8.84315 4.5 10.5V25.5C4.5 27.1569 5.84315 28.5 7.5 28.5Z",
+              stroke: color,
+              "stroke-width": "2.25",
+              "stroke-linecap": "round",
+              "stroke-linejoin": "round"
+            }
+          )
+        };
+    }
+  };
+  const { viewBox, path } = getIconData();
+  return /* @__PURE__ */ jsx39(
+    "svg",
+    {
+      width: size,
+      height: size,
+      viewBox,
+      fill: fillColor,
+      xmlns: "http://www.w3.org/2000/svg",
+      children: path
+    }
+  );
+}
+
+// src/components/atoms/icons/base_icons/PlusLarge.tsx
+import { jsx as jsx40 } from "react/jsx-runtime";
+function PlusLarge({
+  size = 24,
+  color = "#1D1D1F",
+  fillColor = "none"
+}) {
+  const getIconData = () => {
+    switch (size) {
+      case 16:
+        return {
+          viewBox: "0 0 16 16",
+          path: /* @__PURE__ */ jsx40("path", { d: "M8.00033 2.66663V13.3333M13.3337 7.99996L2.66699 7.99996", stroke: color, "stroke-width": "1.25", "stroke-linecap": "round", "stroke-linejoin": "round" })
+        };
+      case 20:
+        return {
+          viewBox: "0 0 20 20",
+          path: /* @__PURE__ */ jsx40("path", { d: "M9.99967 3.33337V16.6667M16.6663 10L3.33301 10", stroke: color, "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" })
+        };
+      case 24:
+        return {
+          viewBox: "0 0 24 24",
+          path: /* @__PURE__ */ jsx40("path", { d: "M12 4V20M20 12L4 12", stroke: color, "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" })
+        };
+      case 36:
+        return {
+          viewBox: "0 0 36 36",
+          path: /* @__PURE__ */ jsx40("path", { d: "M18 6V30M30 18L6 18", stroke: color, "stroke-width": "2.25", "stroke-linecap": "round", "stroke-linejoin": "round" })
+        };
+    }
+  };
+  const { viewBox, path } = getIconData();
+  return /* @__PURE__ */ jsx40(
+    "svg",
+    {
+      width: size,
+      height: size,
+      viewBox,
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: path
+    }
+  );
+}
+
+// src/components/molecules/buttons/nav_button/filter_nav_button/filter_nav_button.tsx
+import clsx11 from "clsx";
+import { jsx as jsx41, jsxs as jsxs27 } from "react/jsx-runtime";
+function FilterNavButton({ icon, label, active }) {
+  return /* @__PURE__ */ jsxs27("div", { className: "w-min h-min flex flex-none flex-col place-items-center gap-2", children: [
+    /* @__PURE__ */ jsx41(
+      "div",
+      {
+        className: clsx11(
+          "w-[44px] h-[44px] flex flex-none flex-col place-items-center place-content-center rounded-xl hover:bg-qtneutral-200 hover:border-2 hover:border-qtneutral-500"
+        ),
+        children: icon
+      }
+    ),
+    /* @__PURE__ */ jsx41("div", { className: "font-medium text-[0.7rem] text-qtneutral-900", children: label })
+  ] });
+}
+
+// src/components/organisms/filter_bar/filter_bar.tsx
+import { jsx as jsx42, jsxs as jsxs28 } from "react/jsx-runtime";
+function FilterBar({ activeFilters, onAddMore }) {
+  return /* @__PURE__ */ jsxs28("div", { className: "flex flex-col w-[54px] place-items-center gap-4", children: [
+    /* @__PURE__ */ jsx42(
+      FilterNavButton,
+      {
+        icon: /* @__PURE__ */ jsx42(
+          FireIcon,
+          {
+            variant: activeFilters?.has("fires") ? void 0 : "none" /* OUTLINED */
+          }
+        ),
+        label: "Fires",
+        active: true
+      }
+    ),
+    /* @__PURE__ */ jsx42(
+      FilterNavButton,
+      {
+        icon: /* @__PURE__ */ jsx42(
+          Mail,
+          {
+            size: 36,
+            fillColor: activeFilters?.has("new") ? "#BFF4F6" : void 0
+          }
+        ),
+        label: "Unread"
+      }
+    ),
+    /* @__PURE__ */ jsx42(
+      FilterNavButton,
+      {
+        icon: /* @__PURE__ */ jsx42(
+          CheckBox,
+          {
+            size: 36,
+            fillColor: activeFilters?.has("done") ? "#E8FE99" : void 0
+          }
+        ),
+        label: "Done"
+      }
+    ),
+    /* @__PURE__ */ jsx42("hr", { className: "w-full border-0.5 text-qtneutral-700" }),
+    /* @__PURE__ */ jsx42(
+      FilterNavButton,
+      {
+        icon: /* @__PURE__ */ jsx42(
+          "div",
+          {
+            className: activeFilters?.has("slack" /* SLACK */) ? "" : "grayscale",
+            children: /* @__PURE__ */ jsx42(SlackIcon, {})
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ jsx42(
+      FilterNavButton,
+      {
+        icon: /* @__PURE__ */ jsx42(
+          "div",
+          {
+            className: activeFilters?.has("google_mail" /* GMAIL */) ? "" : "grayscale",
+            children: /* @__PURE__ */ jsx42(GoogleMailIcon, {})
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ jsx42(
+      FilterNavButton,
+      {
+        icon: /* @__PURE__ */ jsx42(
+          "div",
+          {
+            className: activeFilters?.has("google_calendar" /* GCAL */) ? "" : "grayscale",
+            children: /* @__PURE__ */ jsx42(GoogleCalendarIcon, {})
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ jsx42(
+      FilterNavButton,
+      {
+        icon: /* @__PURE__ */ jsxs28(
+          "div",
+          {
+            className: activeFilters?.has("atlassian_jira" /* AJIRA */) ? "" : "grayscale",
+            children: [
+              /* @__PURE__ */ jsx42(AtlassianIcon, {}),
+              " "
+            ]
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ jsx42(
+      FilterNavButton,
+      {
+        icon: /* @__PURE__ */ jsxs28(
+          "div",
+          {
+            className: activeFilters?.has("microsoft_teams" /* MSTEAMS */) ? "" : "grayscale",
+            children: [
+              /* @__PURE__ */ jsx42(MicrosoftTeamsIcon, {}),
+              " "
+            ]
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ jsx42(
+      FilterNavButton,
+      {
+        icon: /* @__PURE__ */ jsxs28(
+          "div",
+          {
+            className: activeFilters?.has(
+              "microsoft_mail" /* MSMAIL */ || "microsoft_calendar" /* MSCAL */
+            ) ? "" : "grayscale",
+            children: [
+              /* @__PURE__ */ jsx42(MicrosoftOutlookMailIcon, {}),
+              " "
+            ]
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ jsx42("hr", { className: "w-full border-0.5 text-qtneutral-700" }),
+    /* @__PURE__ */ jsx42("div", { onClick: onAddMore, children: /* @__PURE__ */ jsx42(FilterNavButton, { icon: /* @__PURE__ */ jsx42(PlusLarge, { size: 36 }) }) })
+  ] });
+}
+
 // src/types/events.ts
 var EventState = /* @__PURE__ */ ((EventState2) => {
   EventState2["NEW"] = "new";
@@ -16479,7 +16755,7 @@ export {
   EventCard,
   EventState,
   EventType,
-  NavBar as FilterBar,
+  FilterBar,
   IntegrationService,
   NavBar,
   PreviewCard,