prime-ui-kit 0.4.0 → 0.4.1

package/dist/index.js

@@ -104,9 +104,7 @@ function toDataAttributes(input) {
 var AppShell_default = {
   layoutRoot: "AppShell_layoutRoot",
   layoutMain: "AppShell_layoutMain",
-  layoutNav: "AppShell_layoutNav",
-  layoutMainSurface: "AppShell_layoutMainSurface",
-  layoutMainPage: "AppShell_layoutMainPage"
+  layoutNav: "AppShell_layoutNav"
 };
 
 // src/layout/app-shell/AppShell.tsx
@@ -128,7 +126,7 @@ function AppShellNav({ className, children, ...rest }) {
   return /* @__PURE__ */ jsx4("div", { className: cx(AppShell_default.layoutNav, className), "data-layout-region": "nav", ...rest, children });
 }
 AppShellNav.displayName = "AppShell.Nav";
-var AppShellMain = React4.forwardRef(function AppShellMain2({ variant = "plain", className, children, ...rest }, forwardedRef) {
+var AppShellMain = React4.forwardRef(function AppShellMain2({ className, children, ...rest }, forwardedRef) {
   return /* @__PURE__ */ jsx4(
     ScrollContainer,
     {
@@ -136,12 +134,7 @@ var AppShellMain = React4.forwardRef(function AppShellMain2({ variant = "plain",
       ref: forwardedRef,
       axis: "vertical",
       overscrollBehavior: "contain",
-      className: cx(
-        AppShell_default.layoutMain,
-        variant === "surface" && AppShell_default.layoutMainSurface,
-        variant === "page" && AppShell_default.layoutMainPage,
-        className
-      ),
+      className: cx(AppShell_default.layoutMain, className),
       "data-layout-region": "main",
       ...rest,
       children
@@ -178,9 +171,9 @@ var AppShell = {
 import {
   ChevronsUpDown,
   PanelLeftClose,
-  PanelLeftOpen as PanelLeftOpen2,
+  PanelLeftOpen,
   PanelRightClose,
-  PanelRightOpen as PanelRightOpen2
+  PanelRightOpen
 } from "lucide-react";
 import * as React17 from "react";
 import { NavLink } from "react-router-dom";
@@ -560,6 +553,7 @@ var Sidebar_default = {
   navArea: "Sidebar_navArea",
   backdrop: "Sidebar_backdrop",
   navPanel: "Sidebar_navPanel",
+  navPanelSurface: "Sidebar_navPanelSurface",
   header: "Sidebar_header",
   headerRow: "Sidebar_headerRow",
   headerMain: "Sidebar_headerMain",
@@ -597,15 +591,12 @@ var Sidebar_default = {
   navCategoryTrigger: "Sidebar_navCategoryTrigger",
   navCategoryLabel: "Sidebar_navCategoryLabel",
   navCategoryCount: "Sidebar_navCategoryCount",
-  navCategoryPanel: "Sidebar_navCategoryPanel",
-  floatingToggle: "Sidebar_floatingToggle"
+  navCategoryPanel: "Sidebar_navCategoryPanel"
 };
 
 // src/layout/sidebar/SidebarRoot.tsx
 import { animate, useMotionValue, useMotionValueEvent, useReducedMotion } from "framer-motion";
-import { PanelLeftOpen, PanelRightOpen } from "lucide-react";
 import * as React16 from "react";
-import { createPortal as createPortal2 } from "react-dom";
 
 // src/hooks/useEscapeKey.ts
 import * as React13 from "react";
@@ -870,21 +861,11 @@ var SidebarRoot = React16.forwardRef(function SidebarRoot2({
     if (root == null) return;
     root.style.setProperty("--sb-progress", value.toString());
   });
-  const [floatingPortalReady, setFloatingPortalReady] = React16.useState(false);
-  React16.useLayoutEffect(() => {
-    setFloatingPortalReady(true);
-  }, []);
-  const showFloatingToggle = Boolean(responsive) && isMobile && !openState;
   const closeMobile = React16.useCallback(() => {
     setLayoutState("hidden");
   }, [setLayoutState]);
   const navAreaRef = useOverlayModal(mobileOpen, closeMobile);
   const navPanelId = React16.useId();
-  const floatingToggleLabel = side === "left" ? "\u041E\u0442\u043A\u0440\u044B\u0442\u044C \u0441\u0430\u0439\u0434\u0431\u0430\u0440" : "\u041E\u0442\u043A\u0440\u044B\u0442\u044C \u0441\u0430\u0439\u0434\u0431\u0430\u0440 \u0441\u043F\u0440\u0430\u0432\u0430";
-  const floatingToggleIcon = side === "left" ? /* @__PURE__ */ jsx9(PanelLeftOpen, { size: "1em" }) : /* @__PURE__ */ jsx9(PanelRightOpen, { size: "1em" });
-  const onFloatingToggleClick = React16.useCallback(() => {
-    setLayoutState("expanded");
-  }, [setLayoutState]);
   const contextValue = React16.useMemo(
     () => ({
       size,
@@ -901,7 +882,7 @@ var SidebarRoot = React16.forwardRef(function SidebarRoot2({
     }),
     [isMobile, layoutState, navPanelId, openState, setOpen, setState, side, size, toggleOpen]
   );
-  return /* @__PURE__ */ jsx9(SidebarProvider, { value: contextValue, children: /* @__PURE__ */ jsxs2(
+  return /* @__PURE__ */ jsx9(SidebarProvider, { value: contextValue, children: /* @__PURE__ */ jsx9(
     "aside",
     {
       ...rest,
@@ -920,37 +901,20 @@ var SidebarRoot = React16.forwardRef(function SidebarRoot2({
         "sidebar-mode": layoutState,
         "sidebar-root": true
       }),
-      children: [
-        /* @__PURE__ */ jsxs2("div", { ref: navAreaRef, className: Sidebar_default.navArea, children: [
-          /* @__PURE__ */ jsx9(
-            "button",
-            {
-              type: "button",
-              className: Sidebar_default.backdrop,
-              "aria-label": "\u0417\u0430\u043A\u0440\u044B\u0442\u044C \u0441\u0430\u0439\u0434\u0431\u0430\u0440",
-              onClick: closeMobile,
-              tabIndex: mobileOpen ? 0 : -1,
-              "aria-hidden": mobileOpen ? void 0 : true
-            }
-          ),
-          children
-        ] }),
-        showFloatingToggle && floatingPortalReady && typeof document !== "undefined" ? createPortal2(
-          /* @__PURE__ */ jsx9(
-            "button",
-            {
-              type: "button",
-              className: Sidebar_default.floatingToggle,
-              onClick: onFloatingToggleClick,
-              "aria-label": floatingToggleLabel,
-              "aria-controls": navPanelId,
-              "data-side": side,
-              children: /* @__PURE__ */ jsx9("span", { className: Sidebar_default.menuIcon, "aria-hidden": "true", children: floatingToggleIcon })
-            }
-          ),
-          document.body
-        ) : null
-      ]
+      children: /* @__PURE__ */ jsxs2("div", { ref: navAreaRef, className: Sidebar_default.navArea, children: [
+        /* @__PURE__ */ jsx9(
+          "button",
+          {
+            type: "button",
+            className: Sidebar_default.backdrop,
+            "aria-label": "\u0417\u0430\u043A\u0440\u044B\u0442\u044C \u0441\u0430\u0439\u0434\u0431\u0430\u0440",
+            onClick: closeMobile,
+            tabIndex: mobileOpen ? 0 : -1,
+            "aria-hidden": mobileOpen ? void 0 : true
+          }
+        ),
+        children
+      ] })
     }
   ) });
 });
@@ -961,9 +925,9 @@ import { jsx as jsx10, jsxs as jsxs3 } from "react/jsx-runtime";
 var SidebarComposedRoot = SidebarRoot;
 function iconForToggle(state, side) {
   if (side === "left") {
-    return state === "hidden" ? /* @__PURE__ */ jsx10(PanelLeftOpen2, { size: "1em" }) : /* @__PURE__ */ jsx10(PanelLeftClose, { size: "1em" });
+    return state === "hidden" ? /* @__PURE__ */ jsx10(PanelLeftOpen, { size: "1em" }) : /* @__PURE__ */ jsx10(PanelLeftClose, { size: "1em" });
   }
-  return state === "hidden" ? /* @__PURE__ */ jsx10(PanelRightOpen2, { size: "1em" }) : /* @__PURE__ */ jsx10(PanelRightClose, { size: "1em" });
+  return state === "hidden" ? /* @__PURE__ */ jsx10(PanelRightOpen, { size: "1em" }) : /* @__PURE__ */ jsx10(PanelRightClose, { size: "1em" });
 }
 var SidebarToggleButton = React17.forwardRef(
   ({
@@ -1005,19 +969,18 @@ function SidebarNavPanel({
   children,
   ...rest
 }) {
-  const { navPanelId, isMobile, state } = useSidebarContext();
-  const showEdgeToggle = showToggle && !(isMobile && state === "hidden");
-  return /* @__PURE__ */ jsxs3(
+  const { navPanelId } = useSidebarContext();
+  return /* @__PURE__ */ jsx10(
     "nav",
     {
       ...rest,
       id: id ?? navPanelId,
       className: cx(Sidebar_default.navPanel, className),
       "aria-label": rest["aria-label"] ?? "Sidebar navigation",
-      children: [
+      children: /* @__PURE__ */ jsxs3("div", { className: Sidebar_default.navPanelSurface, children: [
         children,
-        showEdgeToggle ? /* @__PURE__ */ jsx10(SidebarToggleButton, { placement: "edge" }) : null
-      ]
+        showToggle ? /* @__PURE__ */ jsx10(SidebarToggleButton, { placement: "edge" }) : null
+      ] })
     }
   );
 }