gov-layout 1.3.4 → 1.3.5

package/dist/index.d.mts

@@ -53,7 +53,9 @@ interface StaffSidebarProps {
     onExpandRequest?: () => void;
 }
 
-declare function StaffSidebar({ orgLogo, orgName, orgSubtitle, menuItems, bottomMenuItems, user, roleLabel, onNavigate, onLogout, onProfile, currentPath, width, className, collapsible, isOpen: controlledIsOpen, onToggle, onExpandRequest, }: StaffSidebarProps): react_jsx_runtime.JSX.Element;
+declare function StaffSidebar({ orgLogo, orgName, orgSubtitle, menuItems, bottomMenuItems, user, roleLabel, onNavigate, onLogout, onProfile, currentPath, width, className, collapsible, isOpen: controlledIsOpen, onToggle, onExpandRequest, topOffset, }: StaffSidebarProps & {
+    topOffset?: number | string;
+}): react_jsx_runtime.JSX.Element;
 
 interface SidebarHeaderProps {
     orgLogo?: string;

package/dist/index.d.ts

@@ -53,7 +53,9 @@ interface StaffSidebarProps {
     onExpandRequest?: () => void;
 }
 
-declare function StaffSidebar({ orgLogo, orgName, orgSubtitle, menuItems, bottomMenuItems, user, roleLabel, onNavigate, onLogout, onProfile, currentPath, width, className, collapsible, isOpen: controlledIsOpen, onToggle, onExpandRequest, }: StaffSidebarProps): react_jsx_runtime.JSX.Element;
+declare function StaffSidebar({ orgLogo, orgName, orgSubtitle, menuItems, bottomMenuItems, user, roleLabel, onNavigate, onLogout, onProfile, currentPath, width, className, collapsible, isOpen: controlledIsOpen, onToggle, onExpandRequest, topOffset, }: StaffSidebarProps & {
+    topOffset?: number | string;
+}): react_jsx_runtime.JSX.Element;
 
 interface SidebarHeaderProps {
     orgLogo?: string;

package/dist/index.js

@@ -3,7 +3,30 @@
 var react = require('react');
 var jsxRuntime = require('react/jsx-runtime');
 
-// src/sidebar/StaffSidebar.tsx
+// #style-inject:#style-inject
+function styleInject(css, { insertAt } = {}) {
+  if (typeof document === "undefined") return;
+  const head = document.head || document.getElementsByTagName("head")[0];
+  const style = document.createElement("style");
+  style.type = "text/css";
+  if (insertAt === "top") {
+    if (head.firstChild) {
+      head.insertBefore(style, head.firstChild);
+    } else {
+      head.appendChild(style);
+    }
+  } else {
+    head.appendChild(style);
+  }
+  if (style.styleSheet) {
+    style.styleSheet.cssText = css;
+  } else {
+    style.appendChild(document.createTextNode(css));
+  }
+}
+
+// src/styles.css
+styleInject(".text-primary,\n.text-text-primary {\n  color: var(--color-alias-text-colors-primary, #060d26);\n}\n.text-secondary,\n.text-text-secondary {\n  color: var(--color-alias-text-colors-secondary, #1e7d55);\n}\n.text-tertiary,\n.text-text-tertiary {\n  color: var(--color-alias-text-colors-tertiary, #475272);\n}\n.text-placeholder,\n.text-text-placeholder {\n  color: var(--color-alias-text-colors-placeholder, #707993);\n}\n.text-critical,\n.text-text-critical {\n  color: var(--color-alias-text-colors-critical, #f21515);\n}\n");
 function useDarkMode() {
   const [isDark, setIsDark] = react.useState(false);
   react.useEffect(() => {
@@ -934,7 +957,8 @@ function StaffSidebar({
   collapsible = false,
   isOpen: controlledIsOpen,
   onToggle,
-  onExpandRequest
+  onExpandRequest,
+  topOffset = 0
 }) {
   const isDark = useDarkMode();
   const [internalOpen, setInternalOpen] = react.useState(true);
@@ -968,9 +992,9 @@ function StaffSidebar({
         className,
         style: {
           position: "fixed",
-          top: 0,
+          top: topOffset,
           left: 0,
-          height: "100vh",
+          height: `calc(100vh - ${typeof topOffset === "number" ? topOffset + "px" : topOffset})`,
           width: currentWidth,
           background: isDark ? "#1e293b" : "#fff",
           borderRight: `1px solid ${isDark ? "#374151" : "var(--color-border-colors-neutral, #c8cedd)"}`,
@@ -1043,7 +1067,7 @@ function StaffSidebar({
           title: sidebarOpen ? "\u0E22\u0E48\u0E2D Sidebar" : "\u0E02\u0E22\u0E32\u0E22 Sidebar",
           style: {
             position: "fixed",
-            top: "10%",
+            top: `calc(${typeof topOffset === "number" ? topOffset + "px" : topOffset} + 10vh)`,
             left: currentWidth,
             zIndex: 51,
             width: "24px",