@noya-app/noya-designsystem 0.1.84 → 0.1.85

package/dist/index.mjs

@@ -18871,28 +18871,32 @@ function ToastContent3({ toast }) {
     index_parts_exports3.Root,
     {
       toast,
-      className: "n-px-2 n-py-2.5 n-grid n-grid-cols-[auto_max-content] n-gap-x-2.5 n-items-center n-rounded n-text-sm n-bg-popover-background n-shadow-popover n-text-text-muted"
+      className: "n-relative n-flex n-items-start n-gap-2 n-rounded n-text-sm n-bg-popover-background n-shadow-popover n-text-text-muted n-px-3 n-py-2.5 n-pr-10"
     },
-    toast.data?.title && /* @__PURE__ */ React123.createElement(
+    /* @__PURE__ */ React123.createElement("div", { className: "n-flex n-flex-col n-gap-0.5 n-min-w-0" }, toast.data?.title && /* @__PURE__ */ React123.createElement(
       index_parts_exports3.Title,
       {
-        className: `n-mb-[5px] ${textStyles.label} n-font-bold n-text-text`
+        className: `${textStyles.label} n-font-bold n-text-text`
       },
       toast.data.title
-    ),
-    /* @__PURE__ */ React123.createElement(
+    ), /* @__PURE__ */ React123.createElement(
       index_parts_exports3.Description,
       {
         className: `${textStyles.small} n-text-text-muted`
       },
       toast.data?.content
-    ),
-    toast.data?.action && /* @__PURE__ */ React123.createElement(index_parts_exports3.Action, { render: /* @__PURE__ */ React123.createElement("span", null) }, toast.data.action),
+    ), toast.data?.action && /* @__PURE__ */ React123.createElement(index_parts_exports3.Action, { render: /* @__PURE__ */ React123.createElement("span", { className: "n-mt-1" }) }, toast.data.action)),
     /* @__PURE__ */ React123.createElement(
       index_parts_exports3.Close,
       {
         "aria-label": "Close",
-        render: /* @__PURE__ */ React123.createElement(IconButton, { iconName: "Cross1Icon" })
+        render: /* @__PURE__ */ React123.createElement(
+          IconButton,
+          {
+            className: "!n-absolute n-top-2 n-right-2",
+            iconName: "Cross1Icon"
+          }
+        )
       }
     )
   );
@@ -41762,7 +41766,8 @@ var DrawerWorkspaceLayout = memoGeneric(function DrawerWorkspaceLayout2({
   rightTabItems,
   rightTabValue,
   onChangeRightTab,
-  onChangeLeftTab
+  onChangeLeftTab,
+  compactDrawerMenu
 }) {
   const [{ leftSidebarCollapsed, rightSidebarCollapsed }, setLayoutState] = useState76({
     leftSidebarCollapsed: true,
@@ -41806,6 +41811,7 @@ var DrawerWorkspaceLayout = memoGeneric(function DrawerWorkspaceLayout2({
     [allTabItems]
   );
   const hasTabs = allSelectableTabItems.length > 0;
+  const compactTabItem = compactDrawerMenu && allSelectableTabItems.length === 1 ? allSelectableTabItems[0] : void 0;
   const leftSelectableTabItems = useMemo151(
     () => (leftTabItems ?? []).filter(isSelectableMenuItem),
     [leftTabItems]
@@ -41859,7 +41865,7 @@ var DrawerWorkspaceLayout = memoGeneric(function DrawerWorkspaceLayout2({
       id: EDITOR_PANEL_GROUP_ID,
       className: "n-flex n-flex-col n-flex-1 n-relative focus:n-outline-none"
     },
-    hasTabs && /* @__PURE__ */ React311.createElement(React311.Fragment, null, /* @__PURE__ */ React311.createElement(
+    hasTabs && !compactTabItem && /* @__PURE__ */ React311.createElement(React311.Fragment, null, /* @__PURE__ */ React311.createElement(
       "div",
       {
         className: "n-flex n-flex-row n-items-center n-gap-1 n-px-2 n-py-1.5 n-bg-sidebar-background n-flex-none",
@@ -41876,6 +41882,22 @@ var DrawerWorkspaceLayout = memoGeneric(function DrawerWorkspaceLayout2({
         }
       )
     ), /* @__PURE__ */ React311.createElement(Divider, null)),
+    compactTabItem && /* @__PURE__ */ React311.createElement("div", { className: "n-absolute n-top-0 n-left-0 n-h-[calc(var(--n-toolbar-height)+1px)] n-w-[calc(var(--n-toolbar-height)+1px)] n-bg-sidebar-background n-border-r n-border-b n-border-divider-strong n-z-10 n-flex n-items-center n-justify-center" }, /* @__PURE__ */ React311.createElement(
+      Button,
+      {
+        "aria-label": typeof compactTabItem.title === "string" ? compactTabItem.title : "Toggle sidebar",
+        variant: "none",
+        className: "n-rounded",
+        style: {
+          width: "var(--n-input-height)",
+          height: "var(--n-input-height)"
+        },
+        icon: compactTabItem.icon,
+        tooltip: compactTabItem.tooltip ?? compactTabItem.title,
+        active: activeTabValue === compactTabItem.value,
+        onClick: () => handleSelectTab(compactTabItem.value)
+      }
+    )),
     /* @__PURE__ */ React311.createElement("div", { className: "n-flex-1 n-flex n-flex-col n-relative n-min-h-0" }, isDrawerOpen && /* @__PURE__ */ React311.createElement("div", { className: "n-absolute n-inset-0 n-z-20 n-flex n-flex-col" }, /* @__PURE__ */ React311.createElement("div", { className: "n-flex-none n-max-h-[50vh] n-overflow-auto n-bg-sidebar-background n-border-b n-border-divider-strong n-shadow-lg" }, activeDrawerPanel), /* @__PURE__ */ React311.createElement(
       "div",
       {
@@ -42670,6 +42692,7 @@ var WorkspaceLayout = forwardRefGeneric(function WorkspaceLayout2({
   sideType = "auto",
   sideTypeBreakpoint = 800,
   detectSize = "container",
+  compactDrawerMenu,
   leftOptions: {
     visible: leftVisible = true,
     minSize: leftMinSize = 200,
@@ -42900,6 +42923,7 @@ var WorkspaceLayout = forwardRefGeneric(function WorkspaceLayout2({
         autoSavePrefix,
         leftSidebarRef,
         rightSidebarRef,
+        compactDrawerMenu,
         onLeftSidebarStateChange,
         onRightSidebarStateChange,
         shouldAutoSave