@trops/dash-core 0.1.517 → 0.1.518

package/dist/index.js

@@ -49741,6 +49741,14 @@ var PrivacySecuritySection = function PrivacySecuritySection() {
     _useState14 = _slicedToArray(_useState13, 2),
     selectedPackageKey = _useState14[0],
     setSelectedPackageKey = _useState14[1];
+  // Two top-level tabs so the inline `HowThisWorksPanel` (which carries
+  // example fixtures and is intentionally tall) doesn't push the
+  // package list/detail below the viewport. "permissions" is the
+  // default and contains the actual UI users came here to use.
+  var _useState15 = React.useState("permissions"),
+    _useState16 = _slicedToArray(_useState15, 2),
+    activeTab = _useState16[0],
+    setActiveTab = _useState16[1];
   var reload = React.useCallback(/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
     var _api$widgetMcp, api, result, _t;
     return _regeneratorRuntime.wrap(function (_context) {
@@ -49962,7 +49970,7 @@ var PrivacySecuritySection = function PrivacySecuritySection() {
   return /*#__PURE__*/jsxRuntime.jsxs("div", {
     className: "flex flex-col flex-1 min-h-0",
     children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
-      className: "flex-shrink-0 flex flex-col space-y-4 p-6 border-b border-gray-800",
+      className: "flex-shrink-0 flex flex-col space-y-3 px-6 pt-6 pb-3 border-b border-gray-800",
       children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
         className: "flex flex-col space-y-2",
         children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.SubHeading3, {
@@ -49972,14 +49980,38 @@ var PrivacySecuritySection = function PrivacySecuritySection() {
           className: "text-xs opacity-60",
           children: "Granting access here is a trust signal about the widget \u2014 not a per-dashboard switch."
         })]
-      }), /*#__PURE__*/jsxRuntime.jsx(EnforcementToggles, {}), /*#__PURE__*/jsxRuntime.jsx(HowThisWorksPanel, {}), error && /*#__PURE__*/jsxRuntime.jsx("div", {
+      }), /*#__PURE__*/jsxRuntime.jsx(DashReact.Tabs3, {
+        value: activeTab,
+        onValueChange: setActiveTab,
+        backgroundColor: "bg-transparent",
+        spacing: "p-0",
+        children: /*#__PURE__*/jsxRuntime.jsxs(DashReact.Tabs3.List, {
+          spacing: "p-0.5",
+          children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.Tabs3.Trigger, {
+            value: "permissions",
+            children: "Permissions"
+          }), /*#__PURE__*/jsxRuntime.jsx(DashReact.Tabs3.Trigger, {
+            value: "help",
+            children: "Help"
+          })]
+        })
+      }), error && /*#__PURE__*/jsxRuntime.jsx("div", {
         className: "text-xs text-red-400 bg-red-900 bg-opacity-20 border border-red-700 rounded p-3",
         children: error
       })]
-    }), /*#__PURE__*/jsxRuntime.jsx(SectionLayout, {
-      listContent: listContent,
-      detailContent: detailContent,
-      emptyDetailMessage: "Select a package to view its grants"
+    }), activeTab === "permissions" ? /*#__PURE__*/jsxRuntime.jsxs("div", {
+      className: "flex flex-col flex-1 min-h-0",
+      children: [/*#__PURE__*/jsxRuntime.jsx("div", {
+        className: "flex-shrink-0 px-6 py-4 border-b border-gray-800",
+        children: /*#__PURE__*/jsxRuntime.jsx(EnforcementToggles, {})
+      }), /*#__PURE__*/jsxRuntime.jsx(SectionLayout, {
+        listContent: listContent,
+        detailContent: detailContent,
+        emptyDetailMessage: "Select a package to view its grants"
+      })]
+    }) : /*#__PURE__*/jsxRuntime.jsx("div", {
+      className: "flex-1 overflow-y-auto p-6",
+      children: /*#__PURE__*/jsxRuntime.jsx(HowThisWorksPanel, {})
     }), /*#__PURE__*/jsxRuntime.jsx(GrantManuallyModal, {
       isOpen: !!manualGrantWidgetId,
       setIsOpen: function setIsOpen(open) {
@@ -50016,19 +50048,19 @@ var EnforcementToggles = function EnforcementToggles() {
   // pendingDisable: { flag: 'enforce' | 'jit' } | null
   // When the user toggles a flag from ON → OFF, we open a confirm modal
   // before persisting. ON → ON or OFF → ON go through immediately.
-  var _useState15 = React.useState(null),
-    _useState16 = _slicedToArray(_useState15, 2),
-    pendingDisable = _useState16[0],
-    setPendingDisable = _useState16[1];
+  var _useState17 = React.useState(null),
+    _useState18 = _slicedToArray(_useState17, 2),
+    pendingDisable = _useState18[0],
+    setPendingDisable = _useState18[1];
 
   // lastTestResult: feedback for the "Test prompt" button. Tells the
   // user whether their JIT response was actually persisted, so they
   // don't have to interpret the post-grant "server not connected"
   // error as failure.
-  var _useState17 = React.useState(null),
-    _useState18 = _slicedToArray(_useState17, 2),
-    lastTestResult = _useState18[0],
-    setLastTestResult = _useState18[1];
+  var _useState19 = React.useState(null),
+    _useState20 = _slicedToArray(_useState19, 2),
+    lastTestResult = _useState20[0],
+    setLastTestResult = _useState20[1];
 
   // Auto-clear the test result after 30 seconds so it doesn't linger
   // forever after a successful test.
@@ -50429,10 +50461,10 @@ var noop = function noop() {};
  * users who don't want the wall of text collapse manually.
  */
 var HowThisWorksPanel = function HowThisWorksPanel() {
-  var _useState19 = React.useState(true),
-    _useState20 = _slicedToArray(_useState19, 2),
-    open = _useState20[0],
-    setOpen = _useState20[1];
+  var _useState21 = React.useState(true),
+    _useState22 = _slicedToArray(_useState21, 2),
+    open = _useState22[0],
+    setOpen = _useState22[1];
   return /*#__PURE__*/jsxRuntime.jsxs("div", {
     className: "border border-gray-700 rounded",
     children: [/*#__PURE__*/jsxRuntime.jsxs("button", {