@abgov/react-components 7.2.0-dev.12 → 7.2.0-dev.13

package/index.d.ts

@@ -62,6 +62,7 @@ export * from './lib/side-menu/side-menu';
 export * from './lib/skeleton/skeleton';
 export * from './lib/spacer/spacer';
 export * from './lib/spinner/spinner';
+export * from './lib/scroll-panel/scroll-panel';
 export * from './lib/table/table';
 export * from './lib/table/table-sort-header';
 export * from './lib/tabs/tabs';
@@ -80,3 +81,4 @@ export * from './lib/work-side-menu-item/work-side-menu-item';
 export * from './lib/work-side-notification-item/work-side-notification-item';
 export * from './lib/work-side-notification-panel/work-side-notification-panel';
 export * from './lib/theme/theme-context';
+export * from './lib/workspace-layout/workspace-layout';

package/index.js

@@ -412,6 +412,9 @@ function GoabDataGrid({
     }
   );
 }
+const GoabWorkspaceLayoutScrollState = {
+  NO_SCROLL: "no-scroll"
+};
 function dispatch(el, eventName, detail, opts) {
   if (!el) {
     console.error("dispatch element is null");
@@ -3962,6 +3965,21 @@ function GoabSpinner({
     }
   );
 }
+function GoabScrollPanel({
+  header,
+  children,
+  footer,
+  height,
+  testId,
+  ...rest
+}) {
+  const hostStyle = height ? { height } : void 0;
+  return /* @__PURE__ */ jsxRuntime.jsxs("goa-scroll-panel", { height, testid: testId, style: hostStyle, ...rest, children: [
+    header && /* @__PURE__ */ jsxRuntime.jsx("div", { slot: "header", children: header }),
+    children,
+    footer && /* @__PURE__ */ jsxRuntime.jsx("div", { slot: "footer", children: footer })
+  ] });
+}
 function GoabTable({ onSort, onMultiSort, sortMode, ...props }) {
   const ref = react.useRef(null);
   react.useEffect(() => {
@@ -4505,6 +4523,50 @@ function useTheme() {
   }
   return ctx;
 }
+const GoabWorkspaceLayoutScrollStateDefault = {
+  scrollPosition: GoabWorkspaceLayoutScrollState.NO_SCROLL,
+  isScrollable: false
+};
+const GoabWorkspaceLayoutScrollStateContext = react.createContext(
+  GoabWorkspaceLayoutScrollStateDefault
+);
+function useGoabWorkspaceLayoutScrollState() {
+  return react.useContext(GoabWorkspaceLayoutScrollStateContext);
+}
+function GoabWorkspaceLayout({
+  sideMenu,
+  pageHeader,
+  pageFooter,
+  pushDrawer,
+  children,
+  testId,
+  onScrollStateChange,
+  ...rest
+}) {
+  const ref = react.useRef(null);
+  const [scrollState, setScrollState] = react.useState(GoabWorkspaceLayoutScrollStateDefault);
+  react.useEffect(() => {
+    const el = ref.current;
+    if (!el) return;
+    const listener = (e) => {
+      const detail = e.detail;
+      setScrollState({
+        scrollPosition: detail.state,
+        isScrollable: detail.isScrollable
+      });
+      onScrollStateChange == null ? void 0 : onScrollStateChange({ ...detail, event: e });
+    };
+    el.addEventListener("_scrollStateChange", listener);
+    return () => el.removeEventListener("_scrollStateChange", listener);
+  }, [onScrollStateChange]);
+  return /* @__PURE__ */ jsxRuntime.jsx(GoabWorkspaceLayoutScrollStateContext.Provider, { value: scrollState, children: /* @__PURE__ */ jsxRuntime.jsxs("goa-workspace-layout", { ref, testid: testId, ...rest, children: [
+    sideMenu && /* @__PURE__ */ jsxRuntime.jsx("div", { slot: "side-menu", children: sideMenu }),
+    pageHeader && /* @__PURE__ */ jsxRuntime.jsx("div", { slot: "page-header", children: pageHeader }),
+    children,
+    pageFooter && /* @__PURE__ */ jsxRuntime.jsx("div", { slot: "page-footer", children: pageFooter }),
+    pushDrawer && /* @__PURE__ */ jsxRuntime.jsx("div", { slot: "push-drawer", children: pushDrawer })
+  ] }) });
+}
 exports.GoALinkButton = GoALinkButton;
 exports.GoabAccordion = GoabAccordion;
 exports.GoabAppFooter = GoabAppFooter;
@@ -4579,6 +4641,7 @@ exports.GoabPublicSubformIndex = GoabPublicSubformIndex;
 exports.GoabPushDrawer = GoabPushDrawer;
 exports.GoabRadioGroup = GoabRadioGroup;
 exports.GoabRadioItem = GoabRadioItem;
+exports.GoabScrollPanel = GoabScrollPanel;
 exports.GoabSideMenu = GoabSideMenu;
 exports.GoabSideMenuGroup = GoabSideMenuGroup;
 exports.GoabSideMenuHeading = GoabSideMenuHeading;
@@ -4602,6 +4665,8 @@ exports.GoabWorkSideMenuGroup = GoabWorkSideMenuGroup;
 exports.GoabWorkSideMenuItem = GoabWorkSideMenuItem;
 exports.GoabWorkSideNotificationItem = GoabWorkSideNotificationItem;
 exports.GoabWorkSideNotificationPanel = GoabWorkSideNotificationPanel;
+exports.GoabWorkspaceLayout = GoabWorkspaceLayout;
+exports.useGoabWorkspaceLayoutScrollState = useGoabWorkspaceLayoutScrollState;
 exports.usePublicFormController = usePublicFormController;
 exports.useTheme = useTheme;
 //# sourceMappingURL=index.js.map