@datawheel/bespoke 0.1.26 → 0.1.28

package/dist/index.js

@@ -16,14 +16,14 @@ import { Notifications, notifications } from '@mantine/notifications';
 import React, { forwardRef, useMemo, useState, useCallback, useContext, useEffect, createContext, useRef, Fragment as Fragment$1, createElement } from 'react';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import { useDispatch, useSelector } from 'react-redux';
-import { Stack, Text, Badge, Group, Tooltip, ActionIcon, Center, useMantineTheme, Modal, Button, Flex, Title, Select, SegmentedControl, MultiSelect, Box, List, Menu, Anchor, MantineProvider, Divider, Burger, Navbar, ScrollArea, Avatar, AppShell, UnstyledButton, ThemeIcon, LoadingOverlay, Skeleton, Container, TextInput, Loader, Alert, Autocomplete, Card, Space, Code, Textarea, rem, Overlay, Grid, Input, Popover, Checkbox, Radio, Switch, Drawer, Tabs, Header, px, SimpleGrid, Image, Paper, FileInput, Accordion, HoverCard, CopyButton, NumberInput, Col } from '@mantine/core';
+import { Stack, Text, Badge, Group, Tooltip, ActionIcon, Center, useMantineTheme, Modal, Button, Flex, SegmentedControl, Select, MultiSelect, Title, Box, List, Menu, Anchor, MantineProvider, Divider, Burger, Navbar, ScrollArea, Avatar, AppShell, UnstyledButton, ThemeIcon, LoadingOverlay, Skeleton, Container, TextInput, Loader, Alert, Collapse, Card, Space, Code, Textarea, rem, Overlay, Grid, Input, Popover, Checkbox, Radio, Switch, Drawer, Autocomplete, Tabs, Header, px, SimpleGrid, Image, Paper, FileInput, Accordion, HoverCard, CopyButton, NumberInput, Col } from '@mantine/core';
 import { dataConcat } from 'd3plus-viz';
 import * as d3plus from 'd3plus-react';
 import Router, { useRouter } from 'next/router';
-import { IconInfoCircle, IconAlignLeft, IconAlignCenter, IconAlignRight, IconBoxMargin, IconTable, IconMathFunction, IconUsers, IconLogout, IconSearch, IconTrash, IconUserCircle, IconEdit, IconDatabase, IconServer, IconPencil, IconAlertCircle, IconCircleCheck, IconPlayerPlay, IconAlarmFilled, IconBox, IconLink, IconCirclePlus, IconCircleX, IconFlag, IconFileAnalytics, IconPlus, IconCamera, IconShare, IconCircleDashed, IconListSearch, IconExternalLink, IconSettings, IconFileOff, IconFilesOff, IconMenu, IconRefresh, IconPolaroid, IconCircleMinus, IconEyeOff, IconLogin, IconWorld, IconLock, IconVariable, IconArrowRightCircle, IconDownload, IconTemplate, IconChartBar, IconCode, IconUpload, IconCodePlus, IconClipboardCheck, IconClipboardCopy, IconPalette, IconEye, IconMinimize, IconMaximize, IconRss, IconGlobe } from '@tabler/icons-react';
-import { useDisclosure, useDebouncedValue, useSetState, useMediaQuery, useHotkeys, useFullscreen, getHotkeyHandler } from '@mantine/hooks';
-import Link from 'next/link';
+import { IconInfoCircle, IconSearch, IconAlignLeft, IconAlignCenter, IconAlignRight, IconBoxMargin, IconTable, IconMathFunction, IconUsers, IconLogout, IconTrash, IconUserCircle, IconEdit, IconDatabase, IconServer, IconPencil, IconAlertCircle, IconCircleCheck, IconPlayerPlay, IconAlarmFilled, IconBox, IconLink, IconCirclePlus, IconCircleX, IconFlag, IconFileAnalytics, IconPlus, IconX, IconChevronDown, IconCamera, IconShare, IconCircleDashed, IconListSearch, IconExternalLink, IconSettings, IconFileOff, IconFilesOff, IconHierarchy3, IconMenu, IconRefresh, IconPolaroid, IconCircleMinus, IconEyeOff, IconChevronLeft, IconChevronRight, IconLogin, IconWorld, IconLock, IconVariable, IconArrowRightCircle, IconDownload, IconTemplate, IconChartBar, IconCode, IconUpload, IconCodePlus, IconClipboardCheck, IconClipboardCopy, IconPalette, IconEye, IconMinimize, IconMaximize, IconRss, IconGlobe } from '@tabler/icons-react';
+import { useMediaQuery, useDisclosure, useDebouncedValue, useSetState, useHotkeys, useFullscreen, getHotkeyHandler } from '@mantine/hooks';
 import dynamic from 'next/dynamic';
+import Link from 'next/link';
 import parse2, { Element, domToReact, Text as Text$1 } from 'html-react-parser';
 import { UserProvider, withPageAuthRequired, useUser } from '@auth0/nextjs-auth0/client';
 import { Prism } from '@mantine/prism';
@@ -37,6 +37,8 @@ import slugifyFn from 'slugify';
 import { FacebookShareButton, FacebookIcon, TwitterShareButton, TwitterIcon, TelegramShareButton, TelegramIcon, WhatsappShareButton, WhatsappIcon, LinkedinShareButton, LinkedinIcon, RedditShareButton, RedditIcon, EmailShareButton, EmailIcon } from 'react-share';
 import Head from 'next/head';
 import { DragDropContext, Droppable, Draggable } from '@hello-pangea/dnd';
+import * as d3 from 'd3';
+import * as d3Dag from 'd3-dag';
 import Editor, { useMonaco } from '@monaco-editor/react';
 import { format } from 'pretty-format';
 import { Editor as Editor$1 } from '@tinymce/tinymce-react';
@@ -194,7 +196,6 @@ var init_http = __esm({
     init_imageSearch();
     init_lib();
     transformDeletePayload = (id) => {
-      console.log("transformDeletePayload", id);
       return { id };
     };
     transformReadMembers = (params) => {
@@ -274,7 +275,7 @@ var init_block = __esm({
 });
 
 // types/cms.ts
-var ENTITY_TYPES, ENTITY_PRETTY_NAMES, REPORT_TYPES, SELECTOR_TYPES, REPORT_FIELDS, ALLOWED, ACCESS, BLOCK_CONTENT_TYPES, BLOCK_LOGIC_TYPES, BLOCK_LOGIC_LOCALE, BLOCK_TYPES, BLOCK_FIELDS, BLOCK_MAP, BLOCK_SETTINGS, FORMATTER_TYPES, FORMATTER_TYPES_NAMES, FORMATTER_INPUT_TYPES, FORMATTER_INPUT_TYPES_NAMES;
+var ENTITY_TYPES, ENTITY_PRETTY_NAMES, REPORT_TYPES, SELECTOR_TYPES, SELECTOR_COMPONENTS, REPORT_FIELDS, ALLOWED, ACCESS, BLOCK_CONTENT_TYPES, BLOCK_LOGIC_TYPES, BLOCK_LOGIC_LOCALE, BLOCK_TYPES, BLOCK_FIELDS, BLOCK_MAP, BLOCK_SETTINGS, FORMATTER_TYPES, FORMATTER_TYPES_NAMES, FORMATTER_INPUT_TYPES, FORMATTER_INPUT_TYPES_NAMES;
 var init_cms = __esm({
   "types/cms.ts"() {
     init_esm_shims();
@@ -314,6 +315,10 @@ var init_cms = __esm({
       SINGLE: "single",
       MULTI: "multi"
     };
+    SELECTOR_COMPONENTS = {
+      SEGMENTED_CONTROL: "segmented control",
+      SELECTOR: "selector"
+    };
     REPORT_FIELDS = {
       TITLE: "title",
       SUBTITLE: "subtitle",
@@ -882,6 +887,7 @@ var init_runSelector = __esm({
       const evalResult = mortarEval_default("variables", variables, transpiledLogic, formatterFunctions, void 0, blockContext);
       const { vars, log, error } = evalResult;
       const type = vars.type || SELECTOR_TYPES.SINGLE;
+      const component = vars.component || "Selector";
       const name = vars.name || "Unlabeled Selector";
       const options = scaffoldDynamic_default(vars.options || []);
       const maybeFixForMulti2 = (defaultValue2) => type === SELECTOR_TYPES.MULTI && !Array.isArray(defaultValue2) ? [defaultValue2] : defaultValue2;
@@ -900,7 +906,8 @@ var init_runSelector = __esm({
         name,
         type,
         options,
-        defaultValue
+        defaultValue,
+        component
       };
       return { config, log, error };
     };
@@ -1078,11 +1085,26 @@ async function apiFetch(url, settings, readMemberFn, locale = "en") {
 }
 async function runSingleBlock(block, formatterFunctions, blockContext, readMemberFn) {
   const { locale, variables, query } = parseBlockContext(blockContext);
+  const allowed = isBlockAllowed(block, blockContext, variables, formatterFunctions);
   let resp = null;
   const unswappedAPI = block.contentByLocale?.logic?.content?.api;
   let apiResponse;
   let duration = null;
   let api = null;
+  if (!allowed) {
+    return {
+      outputVariables: {},
+      renderVariables: {},
+      status: {
+        api: null,
+        duration: null,
+        resp: null,
+        log: [],
+        error: null,
+        allowed: false
+      }
+    };
+  }
   if (unswappedAPI) {
     api = swapAPI(unswappedAPI, formatterFunctions, blockContext);
     const isAbsolute = new RegExp("^(?:[a-z+]+:)?//", "i");
@@ -1095,7 +1117,7 @@ async function runSingleBlock(block, formatterFunctions, blockContext, readMembe
       return result;
     }, (e) => {
       if (verbose2)
-        console.error(`Error fetching ${api}: ${e.message}`);
+        console.error(`Error fetching ${api} block ${block.id}: ${e.message}`);
       return { data: {}, requestDuration: 0 };
     });
     resp = apiResponse.data;
@@ -1115,7 +1137,8 @@ async function runSingleBlock(block, formatterFunctions, blockContext, readMembe
         duration: null,
         resp: null,
         log: log2,
-        error: error2
+        error: error2,
+        allowed
       }
     };
   }
@@ -1129,7 +1152,8 @@ async function runSingleBlock(block, formatterFunctions, blockContext, readMembe
         duration: null,
         resp: null,
         log: [],
-        error: null
+        error: null,
+        allowed
       }
     };
   }
@@ -1146,7 +1170,8 @@ async function runSingleBlock(block, formatterFunctions, blockContext, readMembe
         log,
         duration,
         resp,
-        api
+        api,
+        allowed
       }
     };
   }
@@ -1159,11 +1184,12 @@ async function runSingleBlock(block, formatterFunctions, blockContext, readMembe
       error,
       duration,
       resp,
-      api
+      api,
+      allowed
     }
   };
 }
-var verbose2, ORIGIN, swapAPI, urlProxy, getDependencies, runConsumersV2, getDurationColor, getSizeColor;
+var verbose2, ORIGIN, swapAPI, urlProxy, getDependencies, isBlockAllowed, runConsumersV2, getDurationColor, getSizeColor;
 var init_runConsumers = __esm({
   "libs/blocks/runConsumers.ts"() {
     init_esm_shims();
@@ -1195,27 +1221,51 @@ var init_runConsumers = __esm({
       return url;
     };
     ({ urlProxy } = apiFactory("/api/cms"));
-    getDependencies = (bid, blocks, acc = [], crawlUp = true, crawlDown = true) => {
+    getDependencies = (bid, blocks, acc = [], crawlUp = true, crawlDown = true, withinSection = true, visited = []) => {
+      if (visited.includes(bid))
+        return [];
+      visited.push(bid);
       const rootBlock = blocks[bid];
       if (rootBlock.inputs.length && crawlUp) {
         rootBlock.inputs.forEach((iid) => {
           const rel = `${iid}-${bid}`;
           if (!acc.includes(rel))
             acc.push(rel);
-          rootBlock.inputs.forEach((iid2) => getDependencies(iid2, blocks, acc, crawlUp, false));
+          rootBlock.inputs.forEach((iid2) => getDependencies(iid2, blocks, acc, crawlUp, false, withinSection, visited));
         });
       }
       if (rootBlock.consumers.length && crawlDown) {
         rootBlock.consumers.forEach((cid) => {
           const rel = `${bid}-${cid}`;
-          if (!acc.includes(rel) && blocks[cid].section_id === blocks[bid].section_id)
+          if (!acc.includes(rel) && (blocks[cid].section_id === blocks[bid].section_id || !withinSection))
             acc.push(rel);
-          rootBlock.consumers.filter((cid2) => blocks[cid2].section_id === blocks[bid].section_id).forEach((cid2) => getDependencies(cid2, blocks, acc, crawlUp, crawlDown));
+          rootBlock.consumers.filter((cid2) => blocks[cid2].section_id === blocks[bid].section_id || !withinSection).forEach((cid2) => getDependencies(cid2, blocks, acc, crawlUp, crawlDown, withinSection, visited));
         });
       }
       return acc;
     };
-    runConsumersV2 = async (blocks, sections, bid, formatterFunctions, blockContext, initialVariables = {}, readMemberFn) => {
+    isBlockAllowed = (block, blockContext, variables, formatterFunctions) => {
+      let allowed = true;
+      if (block && "allowed" in block.settings && block.settings.allowed !== "always") {
+        if (block.settings.allowed === "never") {
+          allowed = false;
+        } else {
+          const parsedBlockContext = parseBlockContext(blockContext);
+          const { error, output } = mortarEval_default(
+            "variables",
+            variables,
+            block.settings.allowedLogic || "return false;",
+            formatterFunctions,
+            void 0,
+            parsedBlockContext
+          );
+          if (!error)
+            allowed = Boolean(output);
+        }
+      }
+      return allowed;
+    };
+    runConsumersV2 = async (blocks, sections, bid, formatterFunctions, blockContext, initialVariables = {}, readMemberFn, mode = "section") => {
       if (!bid && !sections)
         return { variables: { ...initialVariables } };
       const variablesById = { ...initialVariables };
@@ -1223,8 +1273,9 @@ var init_runConsumers = __esm({
       const parsedBlockContext = parseBlockContext(blockContext);
       const attributes = parsedBlockContext.variables;
       const rootBlocks = bid ? { [bid]: blocks[bid] } : sections.reduce((rootBlocks2, { id }) => ({ ...rootBlocks2, ...getRootBlocksForSection_default(id, blocks) }), {});
+      const withinSection = mode === "section";
       const blockDeps = Object.keys(rootBlocks).reduce((deps, id) => {
-        const dependencies = getDependencies(Number(id), blocks, [], !bid).map((rel) => rel.split("-"));
+        const dependencies = getDependencies(Number(id), blocks, [], !bid, true, withinSection).map((rel) => rel.split("-"));
         return [...deps, ...dependencies];
       }, []);
       const orderedDAG = Object.keys(rootBlocks).reduce(
@@ -1240,6 +1291,19 @@ var init_runConsumers = __esm({
           );
           const runningTask = dependenciesDone.then(() => {
             const variables = block.inputs.reduce((acc, d) => ({ ...acc, ...variablesById[d] }), attributes);
+            const inputNotAllowed = block.inputs.find((iid) => !statusById[iid].allowed || statusById[iid].hiddenByCascade);
+            if (inputNotAllowed) {
+              statusById[bid2] = {
+                api: null,
+                duration: null,
+                resp: null,
+                log: [],
+                error: null,
+                allowed: false,
+                hiddenByCascade: statusById[inputNotAllowed].hiddenByCascade || inputNotAllowed
+              };
+              return;
+            }
             return runSingleBlock(
               block,
               formatterFunctions,
@@ -2401,15 +2465,16 @@ var init_actions = __esm({
   }
 });
 function ResourceProvider(props) {
-  const { pathSegment } = props;
+  const { pathSegment, profilePrefix } = props;
   const formatters = useFormatterList();
   const value = useMemo(() => ({
+    profilePrefix,
     pathSegment,
     formatterFunctions: locales3.reduce((acc, locale) => ({
       ...acc,
       [locale]: formatters.data ? funcifyFormattersByLocale(formatters.data, locale) : {}
     }), {})
-  }), [formatters, pathSegment]);
+  }), [formatters, pathSegment, profilePrefix]);
   return /* @__PURE__ */ jsx(ResourceContext.Provider, { value, children: props.children });
 }
 function useBespoke() {
@@ -2429,7 +2494,8 @@ var init_ResourceProvider = __esm({
     ({ locales: locales3 } = getLocales_default());
     initialContext = {
       pathSegment: "path",
-      formatterFunctions: locales3.reduce((acc, d) => ({ ...acc, [d]: {} }), {})
+      formatterFunctions: locales3.reduce((acc, d) => ({ ...acc, [d]: {} }), {}),
+      profilePrefix: "path"
     };
     ResourceContext = createContext(initialContext);
   }
@@ -2517,7 +2583,7 @@ function processResult(data, req) {
   }
   return { ...result, data };
 }
-var localeDefault5, useAppDispatch, useAppSelector, useReportList, useVariantList, useSectionList, useFormatterList, useReportRef, useSectionRef, useBlockRef, useDimensionRef, useVariantRef, useFormatterRef, useInputVariablesFlat, useInputVariablesHash, useBlockStatus, useFormatterFunctionsForLocale, useBlockContext, getFormatterUsageCount, useFormatterUsageCount, useFormatterUsageCountList;
+var localeDefault5, useAppDispatch, useAppSelector, useReportList, useVariantList, useSectionList, useBlockList, useFormatterList, useReportRef, useSectionRef, useBlockRef, useDimensionRef, useVariantRef, useFormatterRef, useInputVariablesFlat, useInputVariablesHash, useBlockStatus, useFormatterFunctionsForLocale, useProfilePrefix, useBlockContext, getFormatterUsageCount, useFormatterUsageCount, useFormatterUsageCountList;
 var init_hooks = __esm({
   "store/hooks.ts"() {
     init_esm_shims();
@@ -2532,6 +2598,7 @@ var init_hooks = __esm({
     useReportList = entityListHookFactory("report");
     useVariantList = entityListHookFactory("variant");
     useSectionList = entityListHookFactory("section");
+    useBlockList = entityListHookFactory("block");
     useFormatterList = entityListHookFactory("formatter");
     useReportRef = entityRefHookFactory("report");
     useSectionRef = entityRefHookFactory("section");
@@ -2573,6 +2640,10 @@ var init_hooks = __esm({
       const resource = useContext(ResourceContext);
       return resource.formatterFunctions[locale];
     };
+    useProfilePrefix = () => {
+      const resource = useContext(ResourceContext);
+      return resource.profilePrefix;
+    };
     useBlockContext = (id = void 0, locale = void 0) => {
       useAppSelector((state2) => state2);
       const localeDefault9 = useAppSelector((state2) => state2.status.localeDefault);
@@ -2626,6 +2697,7 @@ var init_store = __esm({
         return getDefaultMiddleware({
           thunk: {
             extraArgument: apiFactory("/api/cms/")
+            // serializableCheck: false,
           }
         });
       }
@@ -2633,7 +2705,7 @@ var init_store = __esm({
     storeWrapper = createWrapper(storeFactory);
   }
 });
-function withFetcher(Component, useRef6) {
+function withFetcher(Component, useRef7) {
   const ComponentWithFetcher = (props) => {
     const {
       id,
@@ -2641,7 +2713,7 @@ function withFetcher(Component, useRef6) {
       skelWidth,
       ...otherProps
     } = props;
-    const ref = useRef6(id);
+    const ref = useRef7(id);
     if (ref.isUninitialized || ref.isFetching) {
       return /* @__PURE__ */ jsx(Skeleton, { width: skelWidth, height: skelHeight });
     }
@@ -3285,8 +3357,13 @@ init_esm_shims();
 
 // frontend/components/explore/ExploreTile.tsx
 init_esm_shims();
-function ExploreTile({ profile, profilePrefix }) {
-  const url = `${profilePrefix}${profile.path}`;
+init_store2();
+function ExploreTile({ profile, profilePrefix, onSelect }) {
+  const currentLocale = useAppSelector((state) => state.status.currentLocale);
+  const localeDefault9 = useAppSelector((state) => state.status.localeDefault);
+  const localePrefix = currentLocale === localeDefault9 ? "" : `/${currentLocale}`;
+  const url = `${localePrefix}${profilePrefix}${profile.path}`;
+  const router = useRouter();
   const images = profile.members.map((m) => /* @__PURE__ */ jsx(
     Image,
     {
@@ -3301,21 +3378,37 @@ function ExploreTile({ profile, profilePrefix }) {
     /* @__PURE__ */ jsx(Text, { weight: 500, children: m.name }),
     /* @__PURE__ */ jsx(Badge, { color: "green", variant: "light", children: m.metadata.variant.name })
   ] }, m.id));
+  const onItemSubmit = (innerUrl) => {
+    router.push(`${innerUrl}`);
+    if (onSelect)
+      onSelect();
+  };
   return /* @__PURE__ */ jsx(Grid.Col, { xs: 12, sm: 6, md: 4, lg: 4, xl: 3, children: /* @__PURE__ */ jsxs(Card, { shadow: "sm", p: "lg", radius: "md", withBorder: true, children: [
     /* @__PURE__ */ jsx(Card.Section, { children: /* @__PURE__ */ jsx(Group, { grow: true, spacing: 0, children: images }) }),
     /* @__PURE__ */ jsx(Group, { position: "apart", mt: "md", mb: "xs", children: names }),
-    /* @__PURE__ */ jsx(Link, { href: url, passHref: true, prefetch: false, children: /* @__PURE__ */ jsx(Button, { variant: "light", color: "blue", fullWidth: true, mt: "md", radius: "md", children: `See ${profile.report.name} Report` }) })
+    /* @__PURE__ */ jsx(
+      "a",
+      {
+        href: url,
+        onClick: (evt) => {
+          evt.preventDefault();
+          onItemSubmit(url);
+        },
+        children: /* @__PURE__ */ jsx(Button, { variant: "light", color: "blue", fullWidth: true, mt: "md", radius: "md", children: `See ${profile.report.name} Report` })
+      }
+    )
   ] }) }, profile.id);
 }
 var ExploreTile_default = ExploreTile;
-function ExploreResults({ results = [], profilePrefix }) {
+function ExploreResults({ results = [], profilePrefix, onSelect = () => {
+} }) {
   const [scrollSize, setScrollSize] = useState(500);
   useEffect(() => {
     const { innerHeight } = window;
     setScrollSize(innerHeight - 200);
   }, []);
   return /* @__PURE__ */ jsx(ScrollArea, { offsetScrollbars: true, type: "always", style: { height: scrollSize }, children: /* @__PURE__ */ jsx(Grid, { align: "stretch", children: results.map(
-    (item) => /* @__PURE__ */ jsx(ExploreTile_default, { profile: item, profilePrefix }, item.id)
+    (item) => /* @__PURE__ */ jsx(ExploreTile_default, { profile: item, profilePrefix, onSelect }, item.id)
   ) }) });
 }
 var ExploreResults_default = ExploreResults;
@@ -3326,10 +3419,12 @@ function BespokeExplore({
   locale,
   profilePrefix,
   initialReportId,
-  initialVariantId
+  initialVariantId,
+  onSelect
 }) {
   const dispatch = useAppDispatch();
   const defaultFilters = {
+    // initial reportIds should go here to avoid multiple unnecesary requests
     profile: void 0,
     variant: void 0
   };
@@ -3348,6 +3443,7 @@ function BespokeExplore({
     });
   }, []);
   useEffect(() => {
+    let cancelled = false;
     if (metadata) {
       setLoading(true);
       const filterProfile = filters.profile && !Number.isNaN(filters.profile) ? filters.profile : [];
@@ -3366,7 +3462,7 @@ function BespokeExplore({
         all: false
       };
       dispatch(actions_exports.reportSearch(params)).then((resp) => {
-        if (resp && resp.results) {
+        if (resp && resp.results && !cancelled) {
           setResults(resp.results);
         }
         setLoading(false);
@@ -3376,6 +3472,9 @@ function BespokeExplore({
         setLoading(false);
       });
     }
+    return () => {
+      cancelled = false;
+    };
   }, [debouncedQuery, filters, metadata]);
   const onFilterChange = (newFilters) => {
     setFilters(newFilters);
@@ -3418,7 +3517,7 @@ function BespokeExplore({
     ),
     /* @__PURE__ */ jsx(LoadingOverlay, { visible: loading }),
     !loading && results.length === 0 && /* @__PURE__ */ jsx(Alert, { title: "No results", color: "blue", children: "Try another search or filter." }),
-    !loading && /* @__PURE__ */ jsx(ExploreResults_default, { results, profilePrefix })
+    !loading && /* @__PURE__ */ jsx(ExploreResults_default, { results, profilePrefix, onSelect })
   ] });
 }
 var Explore_default = BespokeExplore;
@@ -3429,13 +3528,14 @@ init_getLocales();
 var { localeDefault: localeDefault6 } = getLocales_default();
 function BespokeExploreModal({
   exploreProps = { profilePrefix: "/", locale: localeDefault6 },
-  icon = /* @__PURE__ */ jsx(IconSearch, {}),
+  icon = /* @__PURE__ */ jsx(IconSearch, { size: 20 }),
   actionIconProps = {},
-  modalProps = {}
+  modalProps = {},
+  children
 }) {
   const [opened, setOpened] = useState(false);
   const btnConfig = {
-    variant: "subtle",
+    variant: "light",
     size: "md",
     radius: "md",
     ...actionIconProps
@@ -3444,10 +3544,22 @@ function BespokeExploreModal({
     fullScreen: true,
     opened,
     onClose: () => setOpened(false)
+    //...modalProps,
   };
+  const actionIcon = /* @__PURE__ */ jsx(ActionIcon, { ...btnConfig, onClick: () => setOpened(true), children: icon });
   return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(Modal, { ...modalProps, ...mdlConfig, children: /* @__PURE__ */ jsx(Explore_default, { ...exploreProps }) }),
-    /* @__PURE__ */ jsx(ActionIcon, { ...btnConfig, onClick: () => setOpened(true), children: icon })
+    /* @__PURE__ */ jsx(Modal, { ...modalProps, ...mdlConfig, children: /* @__PURE__ */ jsx(Explore_default, { ...exploreProps, onSelect: () => setOpened(false) }) }),
+    /* @__PURE__ */ jsx("div", { onClick: () => setOpened(true), children: children ? /* @__PURE__ */ jsx(Tooltip, { label: "Click to search", children: /* @__PURE__ */ jsxs(
+      Group,
+      {
+        spacing: "sm",
+        style: { cursor: "pointer" },
+        children: [
+          children,
+          actionIcon
+        ]
+      }
+    ) }) : /* @__PURE__ */ jsx(Fragment, { children: actionIcon }) })
   ] });
 }
 var ExploreModal_default = BespokeExploreModal;
@@ -3472,8 +3584,10 @@ var SearchItem = forwardRef(
   }
 );
 var SearchItem_default = SearchItem;
-function BespokeSearch({ locale, profilePrefix, autocompleteProps = {} }) {
+function BespokeSearch({ locale, profilePrefix, autocompleteProps = {}, children }) {
   const dispatch = useAppDispatch();
+  const currentLocale = useAppSelector((state) => state.status.currentLocale);
+  const localeDefault9 = useAppSelector((state) => state.status.localeDefault);
   const router = useRouter();
   const [query, setQuery] = useState("");
   const [debouncedQuery, cancel] = useDebouncedValue(query, 500);
@@ -3481,6 +3595,7 @@ function BespokeSearch({ locale, profilePrefix, autocompleteProps = {} }) {
   const [loading, setLoading] = useState(false);
   const [redirecting, setRedirecting] = useState(false);
   const [initialized, setInitialized] = useState(false);
+  const [visible, setVisible] = useState(children ? false : true);
   const inputRef = useRef();
   const doSearch = () => {
     setLoading(true);
@@ -3500,7 +3615,7 @@ function BespokeSearch({ locale, profilePrefix, autocompleteProps = {} }) {
     dispatch(actions_exports.reportSearch(params)).then((value) => {
       if (value && value.results) {
         setResults(value.results.map((r) => {
-          r.value = `VALUE: ${r.name}...`;
+          r.value = `VALUE: ${r.id}`;
           return r;
         }));
       }
@@ -3518,10 +3633,16 @@ function BespokeSearch({ locale, profilePrefix, autocompleteProps = {} }) {
   }, [debouncedQuery]);
   useEffect(() => {
     cancel();
-    if (inputRef.current) {
+    if (inputRef.current && visible) {
       setInitialized(true);
     }
   }, []);
+  useEffect(() => {
+    cancel();
+    if (inputRef.current && visible) {
+      setInitialized(true);
+    }
+  }, [visible]);
   const acConfig = {
     placeholder: "Search",
     size: "md",
@@ -3531,14 +3652,24 @@ function BespokeSearch({ locale, profilePrefix, autocompleteProps = {} }) {
   };
   const onItemSubmit = (item) => {
     setRedirecting(true);
-    router.push(`${profilePrefix}${item.path}`);
+    setVisible(false);
+    const localePrefix = currentLocale === localeDefault9 ? "" : `/${currentLocale}`;
+    const url = `${localePrefix}${profilePrefix}${item.path}`;
+    router.push(url);
   };
   const onChange = (searchTerm) => {
     if (!searchTerm.includes("VALUE:")) {
       setQuery(searchTerm);
     }
   };
-  return /* @__PURE__ */ jsx(
+  const doClose = () => {
+    setVisible(false);
+  };
+  const doOpen = () => {
+    setVisible(true);
+    doSearch();
+  };
+  const autocompleteElement = /* @__PURE__ */ jsx(
     Autocomplete,
     {
       value: query,
@@ -3549,11 +3680,26 @@ function BespokeSearch({ locale, profilePrefix, autocompleteProps = {} }) {
       disabled: (loading || redirecting) && !initialized,
       limit: 10,
       maxDropdownHeight: 250,
-      rightSection: loading ? /* @__PURE__ */ jsx(Loader, { size: 20 }) : "",
+      rightSection: /* @__PURE__ */ jsx(Group, { spacing: 0, position: "right", children: loading ? /* @__PURE__ */ jsx(Loader, { size: 20 }) : /* @__PURE__ */ jsx(Fragment, {}) }),
+      rightSectionWidth: 50,
       ref: inputRef,
       ...acConfig
     }
   );
+  const finalElement = children ? /* @__PURE__ */ jsx(Tooltip, { label: "Click to search", disabled: visible, children: /* @__PURE__ */ jsxs(
+    Group,
+    {
+      spacing: "sm",
+      align: "center",
+      style: { cursor: "pointer" },
+      children: [
+        !visible && /* @__PURE__ */ jsx("div", { onClick: () => setVisible(true), children }),
+        visible && /* @__PURE__ */ jsx(Fragment, { children: autocompleteElement }),
+        visible ? /* @__PURE__ */ jsx(ActionIcon, { variant: "light", onClick: doClose, children: /* @__PURE__ */ jsx(IconX, { size: 20 }) }) : /* @__PURE__ */ jsx(ActionIcon, { variant: "light", onClick: doOpen, children: /* @__PURE__ */ jsx(IconSearch, { size: 20 }) })
+      ]
+    }
+  ) }) : autocompleteElement;
+  return finalElement;
 }
 var Search_default = BespokeSearch;
 
@@ -3626,7 +3772,7 @@ function ParagraphView({ paragraph, tooltip, size = "md" }) {
 // frontend/components/report/blocks/Stat.tsx
 init_esm_shims();
 init_sanitizeBlockContent();
-function Stat({ subtitle, title, value, tooltip = "stat tooltip" }) {
+function Stat({ subtitle, title, value, tooltip }) {
   const titleHTML = sanitizeBlockContent_default(title);
   const valueHTML = sanitizeBlockContent_default(value);
   const subtitleHTML = sanitizeBlockContent_default(subtitle);
@@ -3658,21 +3804,62 @@ function SubtitleView({ subtitle, tooltip }) {
 // frontend/components/report/blocks/Title.tsx
 init_esm_shims();
 init_sanitizeBlockContent();
+init_hooks();
 function TitleView({ title, tooltip, slug, settings }) {
   const titleHTML = sanitizeBlockContent_default(title) || "<span class='cr-block-placeholder'>Title</span>";
   const tooltipHTML = sanitizeBlockContent_default(tooltip);
   const intOrder = settings && settings.order ? parseInt(settings.order, 10) : 1;
   const order = intOrder <= 6 ? intOrder : 1;
-  return /* @__PURE__ */ jsxs(Group, { spacing: "xs", children: [
-    tooltip && /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Tooltip, { label: tooltipHTML, withArrow: true, withinPortal: true, children: /* @__PURE__ */ jsx(ActionIcon, { children: /* @__PURE__ */ jsx(IconInfoCircle, {}) }) }) }, "tooltip"),
-    /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
-      Title,
-      {
-        order,
-        dangerouslySetInnerHTML: { __html: titleHTML }
-      }
-    ) })
-  ] });
+  const searchOnClick = settings && settings.search ? settings.search : "off";
+  const currentLocale = useAppSelector((state) => state.status.currentLocale);
+  const profilePrefix = useProfilePrefix();
+  const initialIds = useAppSelector(
+    (state) => ({
+      reportId: state.variables.attributes.report_id,
+      variantId: state.variables.attributes.variant_id1
+    })
+  );
+  const titleElement = /* @__PURE__ */ jsx(
+    Title,
+    {
+      order,
+      dangerouslySetInnerHTML: { __html: titleHTML }
+    }
+  );
+  const locale = currentLocale;
+  const finalElement = useMemo(() => {
+    let component = /* @__PURE__ */ jsx(Fragment, {});
+    if (searchOnClick === "modal") {
+      component = /* @__PURE__ */ jsx(ExploreModal_default, { exploreProps: {
+        locale,
+        profilePrefix,
+        initialReportId: initialIds.reportId,
+        initialVariantId: initialIds.variantId
+      }, children: titleElement });
+    } else if (searchOnClick === "inline") {
+      component = /* @__PURE__ */ jsx(
+        Search_default,
+        {
+          locale,
+          profilePrefix,
+          children: titleElement
+        }
+      );
+    } else {
+      component = titleElement;
+    }
+    return component;
+  }, [searchOnClick, titleElement]);
+  return /* @__PURE__ */ jsxs(
+    Group,
+    {
+      spacing: "sm",
+      children: [
+        tooltip && /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Tooltip, { label: tooltipHTML, withArrow: true, withinPortal: true, children: /* @__PURE__ */ jsx(ActionIcon, { children: /* @__PURE__ */ jsx(IconInfoCircle, {}) }) }) }, "tooltip"),
+        /* @__PURE__ */ jsx("div", { children: finalElement })
+      ]
+    }
+  );
 }
 
 // frontend/components/report/blocks/Selector.tsx
@@ -3726,12 +3913,13 @@ function useOnChangeSelector(blockId, section, selectorIdentifier) {
         formatters,
         blockContext,
         initialVariables,
-        readMemberFn
+        readMemberFn,
+        "report"
       ).then((data) => {
         dispatch(variablesActions.setVariableChange({
           attributes,
           variables: data.variables,
-          status: {}
+          status: data.status
         }));
       });
     },
@@ -3757,7 +3945,7 @@ var parseMultiValue = (selectorValue, defaultValue) => {
   return defaultValue;
 };
 function Selector(config) {
-  const { name, options, id, defaultValue, section } = config;
+  const { name, options, id, defaultValue, section, component } = config;
   const selectorIdentifier = getSelectorIdentifier(id);
   const router = useRouter();
   const callback = useOnChangeSelector(id, section, selectorIdentifier);
@@ -3768,22 +3956,22 @@ function Selector(config) {
     (d) => ({ value: d.id, label: d.label })
   ), [optDependency]);
   return {
-    [SELECTOR_TYPES.SINGLE]: data.length > 3 ? /* @__PURE__ */ jsx(
-      Select,
+    [SELECTOR_TYPES.SINGLE]: component === SELECTOR_COMPONENTS.SEGMENTED_CONTROL ? /* @__PURE__ */ jsx(
+      SegmentedControl,
       {
-        label: name,
         data,
         value,
-        onChange: (value2) => callback(value2)
+        onChange: (value2) => callback(value2),
+        name,
+        fullWidth: true
       }
     ) : /* @__PURE__ */ jsx(
-      SegmentedControl,
+      Select,
       {
+        label: name,
         data,
         value,
-        onChange: (value2) => callback(value2),
-        name,
-        fullWidth: true
+        onChange: (value2) => callback(value2)
       }
     ),
     [SELECTOR_TYPES.MULTI]: /* @__PURE__ */ jsx(
@@ -3887,7 +4075,8 @@ function useInitialState(pathSegmentsKey) {
             formatters,
             blockContext,
             variables,
-            readMemberFn
+            readMemberFn,
+            "report"
           ).then((data) => {
             return dispatch(variablesActions.setVariableChange({ ...data, attributes }));
           });
@@ -3924,7 +4113,7 @@ function createOutline(elements, variables) {
     const node = {
       id,
       order,
-      label: variables[id] ? variables[id][`title${id}title`] : "-Not calculated yet-",
+      label: variables[id] ? variables[id][`title${id}title`] : `Title ${id}`,
       children: []
     };
     nodes[id] = node;
@@ -3986,12 +4175,12 @@ function useContentOutline(min = 1, max = 6, headings = []) {
   return useMemo(() => {
     if (titlesSorted && titlesSorted?.length > 0) {
       return createOutline(titlesSorted, titleVariables);
+    } else {
+      return [];
     }
   }, [titlesSorted, titleVariables]);
 }
-function NavView({ headings, settings }) {
-  const { type, min, max } = settings;
-  const contentOutline = useContentOutline(parseInt(min, 10), parseInt(max, 10), headings);
+var DesktopNav = ({ contentOutline }) => {
   const renderMenu = (nodes) => {
     if (!nodes || !nodes?.length) {
       return null;
@@ -4024,6 +4213,80 @@ function NavView({ headings, settings }) {
       )
     }
   ) });
+};
+var MobileAccordion = ({ contentOutline, closeNav }) => {
+  const [value, setValue] = useState(null);
+  return /* @__PURE__ */ jsx(Stack, { children: contentOutline.map(
+    (node) => node.children.length ? /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsxs(Group, { spacing: 0, noWrap: true, children: [
+        /* @__PURE__ */ jsx(
+          UnstyledButton,
+          {
+            w: "100%",
+            component: "a",
+            onClick: closeNav,
+            href: `#bespoke-title-${node.id}`,
+            children: /* @__PURE__ */ jsx(Text, { pl: "sm", dangerouslySetInnerHTML: { __html: node.label } })
+          },
+          node.id
+        ),
+        /* @__PURE__ */ jsx(
+          ActionIcon,
+          {
+            component: "a",
+            size: "lg",
+            onClick: () => setValue((value2) => value2 === node.id ? null : node.id),
+            children: /* @__PURE__ */ jsx(
+              IconChevronDown,
+              {
+                style: {
+                  transition: "transform 0.2s",
+                  transform: value === node.id ? "rotate(-180deg)" : "none"
+                },
+                stroke: 1
+              }
+            )
+          }
+        )
+      ] }, node.id),
+      /* @__PURE__ */ jsx(
+        Collapse,
+        {
+          in: value === node.id,
+          pl: "sm",
+          transitionTimingFunction: "linear",
+          transitionDuration: 200,
+          children: /* @__PURE__ */ jsx(MobileAccordion, { contentOutline: node.children, closeNav })
+        }
+      )
+    ] }) : /* @__PURE__ */ jsx(Group, { noWrap: true, children: /* @__PURE__ */ jsx(
+      UnstyledButton,
+      {
+        display: "flex",
+        w: "100%",
+        component: "a",
+        href: `#bespoke-title-${node.id}`,
+        children: /* @__PURE__ */ jsx(Text, { pl: "sm", dangerouslySetInnerHTML: { __html: node.label } })
+      },
+      node.id
+    ) }, node.id)
+  ) });
+};
+var MobileNav = ({ contentOutline }) => {
+  const [opened, { toggle }] = useDisclosure(false);
+  const label = opened ? "Close content outline" : "Open content outline";
+  return /* @__PURE__ */ jsxs(Box, { component: "nav", children: [
+    /* @__PURE__ */ jsx(Group, { children: /* @__PURE__ */ jsx(Burger, { opened, onClick: toggle, "aria-label": label, size: "md" }) }),
+    /* @__PURE__ */ jsx(Collapse, { in: opened, mt: "md", children: /* @__PURE__ */ jsx(MobileAccordion, { contentOutline, closeNav: toggle }) })
+  ] });
+};
+function NavView({ headings, settings }) {
+  const { type, min, max } = settings;
+  const contentOutline = useContentOutline(parseInt(min, 10), parseInt(max, 10), headings);
+  const theme = useMantineTheme();
+  const mq = `(max-width: ${theme.breakpoints.md})`;
+  const smallerThanMd = useMediaQuery(mq);
+  return smallerThanMd ? /* @__PURE__ */ jsx(MobileNav, { contentOutline }) : /* @__PURE__ */ jsx(DesktopNav, { contentOutline });
 }
 
 // frontend/components/report/blocks/index.tsx
@@ -4062,8 +4325,9 @@ var validateOptionsArray = (options) => {
   return options.map((d) => typeof d === "string" ? { id: d, label: d } : d);
 };
 var maybeFixForMulti = (defaultValue, type) => type === SELECTOR_TYPES.MULTI && !Array.isArray(defaultValue) ? [defaultValue] : defaultValue;
-var Selector_default = (vars, id) => {
+var selectorAdapter = (vars, id) => {
   const type = vars.type || SELECTOR_TYPES.SINGLE;
+  const component = vars.component || "Selector";
   const name = vars.name || "Unlabeled Selector";
   const options = validateOptionsArray(vars.options || []);
   let defaultValue;
@@ -4081,9 +4345,11 @@ var Selector_default = (vars, id) => {
     name,
     type,
     options,
+    component,
     defaultValue
   };
 };
+var Selector_default = selectorAdapter;
 
 // components/blocks/types/adapters/index.js
 var adapters_default = {
@@ -4126,6 +4392,10 @@ var SELECTOR_TYPE = {
   SINGLE: "single",
   MULTI: "multi"
 };
+var SELECTOR_COMPONENT = {
+  SEGMENTED_CONTROL: "segmented control",
+  SELECTOR: "selector"
+};
 var OPTION_TYPE = {
   STATIC: "static",
   DYNAMIC: "dynamic"
@@ -4347,14 +4617,16 @@ function SelectorUI(props) {
   } = props;
   const [selectorIdentifier, setSelectorIdentifier] = useState("");
   const [selectorType, setSelectorType] = useState(SELECTOR_TYPE.SINGLE);
+  const [selectorComponent, setSelectorComponent] = useState(SELECTOR_COMPONENT.SELECTOR);
   const [options, setOptions] = useState({ static: [], dynamic: {} });
   const [optionsType, setOptionsType] = useState(OPTION_TYPE.STATIC);
-  const stateFields = [selectorIdentifier, selectorType, options, optionsType];
+  const stateFields = [selectorIdentifier, selectorType, selectorComponent, options, optionsType];
   useEffect(() => {
     if (!simpleState)
       return;
     setSelectorIdentifier(simpleState.name || "");
     setSelectorType(simpleState.type);
+    setSelectorComponent(simpleState.component);
     if (simpleState.options?.hasOwnProperty("dynamic") && simpleState.options?.hasOwnProperty("static")) {
       setOptions(simpleState.options);
     }
@@ -4364,6 +4636,7 @@ function SelectorUI(props) {
     () => {
       const logicObj = {
         name: selectorIdentifier,
+        component: selectorComponent,
         type: selectorType
       };
       let defaultValue;
@@ -4390,6 +4663,7 @@ function SelectorUI(props) {
       const simpleState2 = {
         name: selectorIdentifier,
         type: selectorType,
+        component: selectorComponent,
         optionsType,
         options
       };
@@ -4418,6 +4692,15 @@ function SelectorUI(props) {
         data: Object.values(SELECTOR_TYPE)
       }
     ),
+    selectorType === SELECTOR_TYPE.SINGLE && /* @__PURE__ */ jsx(
+      Select,
+      {
+        label: "Selector Component",
+        value: selectorComponent,
+        onChange: setSelectorComponent,
+        data: Object.values(SELECTOR_COMPONENT)
+      }
+    ),
     /* @__PURE__ */ jsx(
       Select,
       {
@@ -4518,7 +4801,9 @@ function TitlePreview({ title, tooltip, slug, settings }) {
   const tooltipHTML = sanitizeBlockContent_default(tooltip);
   const intOrder = settings && settings.order ? parseInt(settings.order, 10) : 1;
   const order = intOrder <= 6 ? intOrder : 1;
-  return /* @__PURE__ */ jsxs("div", { children: [
+  const searchOnClick = settings && settings.search && settings.search !== "off" ? true : false;
+  const searchType = settings && settings.search ? settings.search : "";
+  return /* @__PURE__ */ jsxs(Group, { spacing: "sm", children: [
     tooltip && /* @__PURE__ */ jsx("div", { style: { position: "absolute", right: "50px" }, children: /* @__PURE__ */ jsx(Tooltip, { label: tooltipHTML, withArrow: true, withinPortal: true, children: /* @__PURE__ */ jsx(ActionIcon, { children: /* @__PURE__ */ jsx(IconInfoCircle, {}) }) }) }, "tooltip"),
     /* @__PURE__ */ jsx(
       Title,
@@ -4526,7 +4811,8 @@ function TitlePreview({ title, tooltip, slug, settings }) {
         order,
         dangerouslySetInnerHTML: { __html: titleHTML }
       }
-    )
+    ),
+    searchOnClick && /* @__PURE__ */ jsx(Tooltip, { label: `Click will open '${searchType}' report search`, children: /* @__PURE__ */ jsx(ActionIcon, { variant: "light", children: /* @__PURE__ */ jsx(IconSearch, { size: 20 }) }) })
   ] });
 }
 
@@ -4579,7 +4865,18 @@ function SelectorPreview(config) {
   };
   const { name } = config;
   return {
-    [SELECTOR_TYPES.SINGLE]: /* @__PURE__ */ jsx(
+    [SELECTOR_TYPES.SINGLE]: config.component === SELECTOR_COMPONENTS.SEGMENTED_CONTROL ? /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx(Text, { size: "sm", fw: 500, children: name }),
+      /* @__PURE__ */ jsx(
+        SegmentedControl,
+        {
+          data,
+          value,
+          onChange: onChangeSingle,
+          fullWidth: true
+        }
+      )
+    ] }) : /* @__PURE__ */ jsx(
       Select,
       {
         label: name,
@@ -4971,7 +5268,6 @@ init_varSwap();
 init_mortarEval();
 init_envvars();
 init_runSelector();
-init_block();
 function Block({ blockId, active = true }) {
   const { query, locale = localeDefault4 } = useRouter();
   const block = useBlockRef(blockId).data;
@@ -4984,8 +5280,9 @@ function Block({ blockId, active = true }) {
     locale
   };
   const generatorVariables = useAppSelector((state) => state.variables.variables[block.id] || {});
+  const blockStatus = useAppSelector((state) => state.variables.status[block.id] || {});
   const [content, setContent] = useState(() => {
-    if (![BLOCK_TYPES.GENERATOR, BLOCK_TYPES.VIZ, BLOCK_TYPES.NAV].includes(block?.type)) {
+    if (![BLOCK_TYPES.GENERATOR, BLOCK_TYPES.VIZ, BLOCK_TYPES.NAV].includes(block.type)) {
       if (block?.type === BLOCK_TYPES.SELECTOR) {
         const blockContent2 = getBlockContent(block, locale);
         const { config: renderVariables } = runSelector_default(blockContent2?.logic, formatterFunctions, blockContext);
@@ -5005,24 +5302,6 @@ function Block({ blockId, active = true }) {
     }
     return null;
   });
-  let allowed = true;
-  if (block && "allowed" in block.settings && block.settings.allowed !== "always") {
-    if (block.settings.allowed === "never") {
-      allowed = false;
-    } else {
-      const parsedBlockContext = parseBlockContext(blockContext);
-      const { vars, error, output } = mortarEval_default(
-        "variables",
-        variables,
-        block.settings.allowedLogic || "return false;",
-        formatterFunctions,
-        void 0,
-        parsedBlockContext
-      );
-      if (!error)
-        allowed = Boolean(output);
-    }
-  }
   useEffect(() => {
     const fetch = async () => {
       if (!block || block.type === BLOCK_TYPES.GENERATOR)
@@ -5077,7 +5356,7 @@ function Block({ blockId, active = true }) {
     };
     fetch();
   }, [blockContent, variables]);
-  if (!block || !content || !allowed)
+  if (!block || !content || !blockStatus.allowed)
     return null;
   const Renderer = blocks_default[block.type];
   return /* @__PURE__ */ jsx("div", { id: `bespoke-${block.type}-${block.id}`, className: `cms-block-wrapper cms-block-${blockId}`, children: /* @__PURE__ */ jsx(Renderer, { ...content, settings: block.settings }) });
@@ -5906,7 +6185,8 @@ function DesignSectionMenu({ sectionId }) {
     return null;
   const {
     memberImageBg,
-    optionsMenu
+    optionsMenu,
+    hidden
   } = section.settings;
   return /* @__PURE__ */ jsxs(
     Popover,
@@ -5942,6 +6222,15 @@ function DesignSectionMenu({ sectionId }) {
               onChange: (e) => handleChange("optionsMenu", e.currentTarget.checked)
             }
           ),
+          /* @__PURE__ */ jsx(
+            Checkbox,
+            {
+              size: "xs",
+              label: "Hide section",
+              checked: hidden,
+              onChange: (e) => handleChange("hidden", e.currentTarget.checked)
+            }
+          ),
           Object.entries(sectionSettings).map(([key, { label, defaultValue, options }]) => /* @__PURE__ */ jsxs(Group, { spacing: "xs", position: "apart", noWrap: true, style: { width: "100%" }, children: [
             label && /* @__PURE__ */ jsx(Text, { fz: "sm", children: label }),
             /* @__PURE__ */ jsx(
@@ -5981,6 +6270,9 @@ function SectionMenu({ sectionId }) {
   ] });
 }
 var SectionMenu_default = SectionMenu;
+
+// frontend/components/report/Section.tsx
+init_cms();
 var getStyles = (styles, settings) => (theme) => styles ? styles(theme, settings) : {};
 var PositionWrapper = ({ settings, styles, children, ...props }) => {
   const { position } = settings;
@@ -6045,11 +6337,20 @@ function Section({ section }) {
     ...settings
   };
   const state = useAppSelector((state2) => state2);
+  const status = useAppSelector((state2) => state2.variables.status);
   const sectionStyles = useBespokeStyles()["Section"];
   const blockRecords = selectBlockRecords(state);
   const theme = useMantineTheme();
   const smallScreen = useMediaQuery(`(max-width: ${theme.breakpoints.sm}px)`);
-  const columns = Object.values(blockRecords || {}).filter((d) => d.section_id === id).reduce((acc, d) => {
+  const sectionBlocks = Object.values(blockRecords || {}).filter((d) => d.section_id === id);
+  const allowedSection = sectionBlocks.some((b) => {
+    try {
+      return status[b.id].allowed && b.type !== BLOCK_TYPES.GENERATOR;
+    } catch (e) {
+      return b.settings.allowed === "always";
+    }
+  });
+  const columns = sectionBlocks.reduce((acc, d) => {
     if (!acc[d.blockcol]) {
       acc[d.blockcol] = { [d.blockrow]: d };
     } else {
@@ -6057,6 +6358,9 @@ function Section({ section }) {
     }
     return acc;
   }, {});
+  const displaySection = Object.keys(blockRecords).length > 0 && !settings.hidden && allowedSection;
+  if (!displaySection)
+    return null;
   return /* @__PURE__ */ jsxs(
     PositionWrapper,
     {
@@ -6295,8 +6599,14 @@ init_esm_shims();
 
 // components/builder/JumpTo.tsx
 init_esm_shims();
+init_store2();
 function JumpTo() {
-  const contentOutline = useContentOutline();
+  const blocks = useBlockList();
+  const titleBlocks = useMemo(
+    () => blocks.data ? blocks.data.filter((d) => d.type === "title").map((d) => d.id) : [],
+    [blocks.data]
+  );
+  const contentOutline = useContentOutline(1, 6, titleBlocks);
   const handleClick = (blockId) => {
     const section = document.getElementById(`title-${blockId}`);
     if (section) {
@@ -6308,7 +6618,7 @@ function JumpTo() {
     if (!nodes) {
       return null;
     }
-    return /* @__PURE__ */ jsx(Fragment, { children: nodes.map((node) => /* @__PURE__ */ jsxs(Fragment, { children: [
+    return /* @__PURE__ */ jsx(Fragment, { children: nodes.map((node) => /* @__PURE__ */ jsxs(Fragment$1, { children: [
       /* @__PURE__ */ jsx(
         Menu.Item,
         {
@@ -6316,11 +6626,10 @@ function JumpTo() {
           onClick: () => handleClick(node.id),
           pl: 10 * node.order,
           children: node.label
-        },
-        `jump-key-${node.id}`
+        }
       ),
       renderOutline(node.children)
-    ] })) });
+    ] }, `jump-key-${node.id}`)) });
   };
   return /* @__PURE__ */ jsx("div", { style: { position: "fixed", bottom: 10, right: 10, zIndex: 10 }, children: /* @__PURE__ */ jsxs(Menu, { shadow: "md", position: "top-end", offset: 0, children: [
     /* @__PURE__ */ jsx(Menu.Target, { children: /* @__PURE__ */ jsx(ActionIcon, { variant: "filled", color: "blue", children: /* @__PURE__ */ jsx(IconListSearch, {}) }) }),
@@ -7141,12 +7450,13 @@ function VariantEditor({ for: variant, onClose: closeHandler }) {
         ),
         variantConfig.config[selectedLocale] && /* @__PURE__ */ jsxs(Fragment, { children: [
           /* @__PURE__ */ jsx(Space, { h: "lg" }),
-          /* @__PURE__ */ jsxs(Group, { grow: true, children: [
+          /* @__PURE__ */ jsxs(Group, { grow: true, align: "flex-end", children: [
             /* @__PURE__ */ jsx(
               TextInput,
               {
                 onChange: (e) => onChangeConfig("path", e.target.value),
-                placeholder: "Enter a source API",
+                title: "Api endpoint",
+                description: "Enter the url to retrieve a member list to ingest. (JSON) and click Fetch.",
                 value: variantConfig.config[selectedLocale].path
               }
             ),
@@ -7167,19 +7477,24 @@ function VariantEditor({ for: variant, onClose: closeHandler }) {
               Select,
               {
                 value: variantConfig.config[selectedLocale].accessor,
-                label: "Accessor property (array)",
+                label: "Elements",
+                description: "Choose the key that returns the array of elements that \n                        are going to be ingested as members.",
                 data: accessorSelectData,
+                disabled: accessorSelectData.length === 0,
+                placeholder: accessorSelectData.length === 0 ? "Root is an array" : "",
                 onChange: (e) => onChangeAccessor(e)
               }
             ),
             /* @__PURE__ */ jsx(Divider, { label: "First element preview", labelPosition: "center" }),
-            payload[variantConfig.config[selectedLocale].accessor] && /* @__PURE__ */ jsx(InputMenuItem_default, { variables: payload[variantConfig.config[selectedLocale].accessor][0] }),
+            payload[variantConfig.config[selectedLocale].accessor] && !Array.isArray(payload) && /* @__PURE__ */ jsx(InputMenuItem_default, { variables: payload[variantConfig.config[selectedLocale].accessor][0] }),
+            Array.isArray(payload) && payload[0] && /* @__PURE__ */ jsx(InputMenuItem_default, { variables: payload[0] }),
             /* @__PURE__ */ jsx(Space, { h: "md" }),
             /* @__PURE__ */ jsx(
               Select,
               {
                 value: variantConfig.config[selectedLocale].idKey,
-                label: "Key property",
+                label: "Unique identificator",
+                description: "Choose the field that is a unique identification for a single member.",
                 data: keys,
                 onChange: (e) => onChangeConfig("idKey", e)
               }
@@ -7189,13 +7504,29 @@ function VariantEditor({ for: variant, onClose: closeHandler }) {
               Select,
               {
                 value: variantConfig.config[selectedLocale].labelKey,
-                label: "Label property",
+                label: "Members' name",
+                description: "Choose the field that contains the members name.",
                 data: keys,
                 onChange: (e) => onChangeConfig("labelKey", e)
               }
             ),
             /* @__PURE__ */ jsx(Space, { h: "md" }),
+            /* @__PURE__ */ jsx(
+              Select,
+              {
+                value: variantConfig.config[selectedLocale].zValueKey || "",
+                label: "Member's relevance (optional)",
+                description: "Choose a field that will be converted to a number and \n                        normalized from 0 to 1 to determine the member's relevance.",
+                data: [
+                  { value: "null", label: "None" },
+                  ...keys
+                ],
+                onChange: (e) => onChangeConfig("zValueKey", e)
+              }
+            ),
+            /* @__PURE__ */ jsx(Space, { h: "md" }),
             /* @__PURE__ */ jsx(Title, { order: 3, size: "h5", children: "Attributes" }),
+            /* @__PURE__ */ jsx(Text, { size: "sm", children: "Attributes are properties to be ingested as metadata with the member element. Could be constants (same value for every member) or dynamic (based on a property of the data)" }),
             /* @__PURE__ */ jsx(Space, { h: "xs" }),
             variantConfig.config[selectedLocale].attributes && variantConfig.config[selectedLocale].attributes.map((attr, ix) => /* @__PURE__ */ jsxs(Group, { align: "end", grow: true, children: [
               /* @__PURE__ */ jsx(
@@ -7292,7 +7623,7 @@ function VariantEditor({ for: variant, onClose: closeHandler }) {
           }
         )
       ] }),
-      size: 145
+      size: 165
     }
   );
 }
@@ -7371,7 +7702,7 @@ function DimensionEditor({ id, onClose: closeHandler }) {
         /* @__PURE__ */ jsx(Button, { variant: "outline", disabled: loading, loading, onClick: closeHandler, children: "Cancel" }),
         /* @__PURE__ */ jsx(Button, { disabled: loading, loading, onClick: submitHandler, children: "Save Dimension" })
       ] }),
-      size: 145
+      size: 165
     }
   );
 }
@@ -7442,7 +7773,7 @@ function ReportEditor({ id, onClose: closeHandler }) {
         /* @__PURE__ */ jsx(Button, { variant: "outline", disabled: loading, loading, onClick: closeHandler, children: "Cancel" }),
         /* @__PURE__ */ jsx(Button, { disabled: loading, loading, onClick: submitHandler, children: "Save Report" })
       ] }),
-      size: 145
+      size: 165
     }
   );
 }
@@ -7463,17 +7794,155 @@ function HeaderLayout(props) {
 
 // components/builder/CMSHeader.tsx
 init_statusSlice();
+init_hooks();
+
+// components/builder/BlockGraph.tsx
+init_esm_shims();
+init_store2();
+function BlockGraph() {
+  const [screenWidth, setScreenWidth] = useState(window.innerWidth - 40);
+  const [screenHeight, setScreenHeight] = useState(window.innerHeight - 150);
+  useEffect(() => {
+    const handleResize = () => {
+      setScreenWidth(window.innerWidth - 40);
+      setScreenHeight(window.innerHeight - 120);
+    };
+    window.addEventListener("resize", handleResize);
+    return () => {
+      window.removeEventListener("resize", handleResize);
+    };
+  }, []);
+  const blocks = useBlockList();
+  const sections = useSectionList();
+  const [sectionSelected, setSectionSelected] = useState(null);
+  const sectionList = useMemo(() => {
+    if (sections.isSuccess) {
+      const sectionsOptions = sections.data.map((n) => ({
+        value: `${n.id}`,
+        label: `Section ${n.id}`
+      }));
+      setSectionSelected(sectionsOptions[0].value);
+      return sectionsOptions;
+    } else {
+      return [];
+    }
+  }, [sections.isLoading]);
+  const data = useMemo(() => {
+    if (blocks.isSuccess && sectionSelected) {
+      const rootNode = { id: "root", label: "section", size: 40, parentIds: [] };
+      const globalNode = { id: "wide", label: "report", size: 40, parentIds: [] };
+      const sectionBlocks = blocks.data.filter((n) => `${n.section_id}` === `${sectionSelected}`);
+      const sectionBlocksIds = sectionBlocks.map((n) => n.id);
+      return [
+        rootNode,
+        globalNode,
+        ...sectionBlocks.map((n) => {
+          const projectedSize = n.consumers.length > 0 ? n.consumers.length * 20 : 40;
+          const parentIds = n.inputs.length > 0 ? n.inputs.map((i) => sectionBlocksIds.includes(i) ? `${i}` : `${globalNode.id}`) : [`${rootNode.id}`];
+          return {
+            id: `${n.id}`,
+            label: `${n.type}`,
+            size: projectedSize > 50 ? 50 : projectedSize,
+            parentIds: [...Array.from(new Set(parentIds))]
+          };
+        })
+      ];
+    } else {
+      return [];
+    }
+  }, [blocks.isLoading, sectionSelected]);
+  const svgRef = useRef(null);
+  useEffect(() => {
+    const dag = d3Dag.dagStratify()(data);
+    const nodeRadius = 40;
+    const layout = d3Dag.sugiyama().nodeSize((node) => {
+      const data2 = node ? node.data : null;
+      const internalRadius = data2 ? data2.size : nodeRadius;
+      return [(node ? 3.6 : 0.25) * internalRadius, 3 * internalRadius];
+    });
+    const { width, height } = layout(dag);
+    const svgSelection = d3.select(svgRef.current);
+    svgSelection.selectAll("*").remove();
+    svgSelection.attr("viewBox", [0, 0, width, height].join(" "));
+    const defs = svgSelection.append("defs");
+    const steps = dag.size();
+    const interp = d3.interpolateRainbow;
+    const colorMap = /* @__PURE__ */ new Map();
+    data.forEach((node, i) => {
+      colorMap.set(node.id, interp(i / steps));
+    });
+    const line2 = d3.line().curve(d3.curveCatmullRom).x((d) => d.x).y((d) => d.y);
+    const paths = svgSelection.append("g").selectAll("g").data(dag.links()).enter().append("g");
+    paths.append("path").attr("class", "curve").attr("d", ({ points }) => line2(points)).attr("fill", "none").attr("stroke-width", 3).attr("stroke", ({ source, target }) => {
+      const gradId = encodeURIComponent(`${source.data.id}--${target.data.id}`);
+      const grad = defs.append("linearGradient").attr("id", gradId).attr("gradientUnits", "userSpaceOnUse").attr("x1", source.x).attr("x2", target.x).attr("y1", source.y).attr("y2", target.y);
+      grad.append("stop").attr("offset", "0%").attr("stop-color", colorMap.get(source.data.id));
+      grad.append("stop").attr("offset", "100%").attr("stop-color", colorMap.get(target.data.id));
+      return `url(#${gradId})`;
+    });
+    const nodes = svgSelection.append("g").selectAll("g").data(dag.descendants()).enter().append("g").attr("transform", ({ x, y }) => `translate(${x}, ${y})`);
+    nodes.append("circle").attr("r", (n) => n.data.size).attr("fill", (n) => colorMap.get(n.data.id));
+    const arrows = svgSelection.append("g").selectAll("g").data(dag.links()).enter().append("g");
+    const arrow = d3.symbol().type(d3.symbolTriangle).size(nodeRadius * 1.5);
+    arrows.append("path").attr("class", "arrow").attr("d", arrow).attr("transform", (link) => {
+      const { points, target } = link;
+      const [end, start] = points.reverse();
+      const dx = start.x - end.x;
+      const dy = start.y - end.y;
+      const scale = target.data.size * 1 / Math.sqrt(dx * dx + dy * dy);
+      const angle = Math.atan2(-dy, -dx) * 180 / Math.PI + 90;
+      return `translate(${end.x + dx * scale}, ${end.y + dy * scale}) rotate(${angle})`;
+    }).attr("fill", ({ target }) => colorMap.get(target.data.id)).attr("stroke", "white");
+    const texts = svgSelection.append("g").selectAll("g").data(dag.descendants()).enter().append("g").attr("transform", ({ x, y }) => `translate(${x}, ${y})`);
+    texts.append("text").text((d) => d.data.id).attr("font-weight", "bold").attr("font-family", "sans-serif").attr("text-anchor", "middle").attr("font-size", "10px").style("transform", "translate(0px,10px)").attr("alignment-baseline", "middle").attr("fill", "black");
+    texts.append("text").text((d) => d.data.label).attr("font-weight", "bold").attr("font-family", "sans-serif").attr("font-size", "15px").style("transform", "translate(0px,-5px)").attr("text-anchor", "middle").attr("alignment-baseline", "middle").attr("fill", "black");
+  }, [data]);
+  const handlePrev = () => {
+    const currentIndex = sectionList.findIndex((item) => item.value === sectionSelected);
+    if (currentIndex > 0) {
+      setSectionSelected(sectionList[currentIndex - 1].value);
+    }
+  };
+  const handleNext = () => {
+    const currentIndex = sectionList.findIndex((item) => item.value === sectionSelected);
+    if (currentIndex < sectionList.length - 1) {
+      setSectionSelected(sectionList[currentIndex + 1].value);
+    }
+  };
+  return /* @__PURE__ */ jsxs(Stack, { spacing: 0, children: [
+    /* @__PURE__ */ jsxs(Group, { align: "flex-end", w: "100%", position: "apart", children: [
+      /* @__PURE__ */ jsx(
+        Select,
+        {
+          label: "Chooose a section",
+          placeholder: "Pick one",
+          value: sectionSelected,
+          onChange: setSectionSelected,
+          data: sectionList,
+          width: "80%"
+        }
+      ),
+      /* @__PURE__ */ jsxs(Group, { grow: true, maw: 100, children: [
+        /* @__PURE__ */ jsx(ActionIcon, { onClick: handlePrev, variant: "outline", children: /* @__PURE__ */ jsx(IconChevronLeft, { size: "1.125rem" }) }),
+        /* @__PURE__ */ jsx(ActionIcon, { onClick: handleNext, variant: "outline", children: /* @__PURE__ */ jsx(IconChevronRight, { size: "1.125rem" }) })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx("svg", { ref: svgRef, width: screenWidth, height: screenHeight })
+  ] });
+}
 function CMSHeader(props) {
-  const { report: currentReport, profilePrefix } = props;
+  const { report: currentReport } = props;
   const { id } = currentReport;
   const { newConfirmation } = useDialog();
   const dispatch = useAppDispatch();
   const resource = useContext(ResourceContext);
+  const profilePrefix = useProfilePrefix();
   const currentLocale = useAppSelector((state) => state.status.currentLocale);
   const localeDefault9 = useAppSelector((state) => state.status.localeDefault);
   const localeOptions = useAppSelector(selectLocaleOptions);
   const previewsFromState = useAppSelector((state) => state.status.previews);
   const [opened, handlers] = useDisclosure(false);
+  const [openedGraph, handlersGraph] = useDisclosure(false);
   const { user } = useUser();
   const castedUser = user;
   const dimensions = useMemo(() => {
@@ -7651,9 +8120,11 @@ function CMSHeader(props) {
               /* @__PURE__ */ jsx(Text, { fw: 700, children: currentReport.name })
             ] }) }),
             /* @__PURE__ */ jsx(Menu.Label, { children: "Settings" }),
-            /* @__PURE__ */ jsx(Menu.Item, { onClick: handlers.open, icon: /* @__PURE__ */ jsx(IconSettings, { size: 20 }), children: "Report settings" })
+            /* @__PURE__ */ jsx(Menu.Item, { onClick: handlers.open, icon: /* @__PURE__ */ jsx(IconSettings, { size: 20 }), children: "Report settings" }),
+            /* @__PURE__ */ jsx(Menu.Item, { onClick: handlersGraph.open, icon: /* @__PURE__ */ jsx(IconHierarchy3, { size: 20 }), children: "Block Graph" })
           ] })
         ] }),
+        /* @__PURE__ */ jsx(Modal, { opened: openedGraph, onClose: handlersGraph.close, title: "Block Graph", fullScreen: true, children: /* @__PURE__ */ jsx(BlockGraph, {}) }),
         /* @__PURE__ */ jsx(
           Drawer,
           {
@@ -7747,6 +8218,15 @@ var customSettings = {
         { label: "6", value: "6" }
       ]
     },
+    search: {
+      label: "Search on Click",
+      defaultValue: "off",
+      options: [
+        { label: "Off", value: "off" },
+        { label: "Inline", value: "inline" },
+        { label: "Modal", value: "modal" }
+      ]
+    },
     ...defaultSettings2
   },
   [BLOCK_TYPES.GENERATOR]: {
@@ -7760,8 +8240,8 @@ var customSettings = {
     }
   },
   [BLOCK_TYPES.NAV]: {
-    type: {
-      label: "Nav type",
+    variant: {
+      label: "Nav variant",
       defaultValue: "inline",
       options: [
         { label: "Inline", value: "inline" },
@@ -8039,7 +8519,8 @@ var emptyStatus = {
   duration: null,
   error: null,
   log: [],
-  resp: null
+  resp: null,
+  allowed: true
 };
 function BlockPreview(props) {
   const {
@@ -9324,13 +9805,15 @@ function SectionHeader({
   active,
   isDragging,
   id,
-  dragHandleProps
+  dragHandleProps,
+  hidden
 }) {
   return /* @__PURE__ */ jsxs(
     Group,
     {
       className: `cms-section-header${active || isDragging ? " active" : ""}`,
       position: "apart",
+      bg: hidden ? "red.1" : "none",
       children: [
         /* @__PURE__ */ jsxs(Group, { className: "cms-section-header-editor", spacing: 0, children: [
           /* @__PURE__ */ jsxs(Code, { style: { backgroundColor: "transparent" }, children: [
@@ -9339,6 +9822,7 @@ function SectionHeader({
           ] }, "s1"),
           /* @__PURE__ */ jsx(ActionIcon, { ...dragHandleProps, children: /* @__PURE__ */ jsx(IconMenu, { size: 16 }) }, "b1")
         ] }),
+        hidden && /* @__PURE__ */ jsx(Text, { size: "xs", fw: 600, color: "dark.3", children: "Section will be hidden on the frontend" }),
         /* @__PURE__ */ jsx(SectionMenu_default, { sectionId: id })
       ]
     }
@@ -9360,7 +9844,7 @@ function SectionEditor({
   const [sectionState, setSectionState2] = useSetState({});
   const blocks = useAppSelector((state) => state.records.entities.block);
   const blockSettings = getBlockSettings();
-  const { memberImageBg, optionsMenu } = section.settings;
+  const { memberImageBg, optionsMenu, hidden } = section.settings;
   const [hoverBlock, setHoverBlock] = useState();
   const { inputs, consumers } = useMemo(() => {
     if (hoverBlock) {
@@ -9473,6 +9957,7 @@ function SectionEditor({
             active: isActive,
             id: section.id,
             isDragging,
+            hidden,
             dragHandleProps
           }
         ),
@@ -9645,7 +10130,7 @@ init_ordering();
 init_store2();
 init_actions();
 function BuilderEditor(props) {
-  const { profilePrefix, id } = props;
+  const { id } = props;
   const reportRef = useReportRef(id);
   return useMemo(() => {
     if (reportRef.isError) {
@@ -9659,14 +10144,13 @@ function BuilderEditor(props) {
       {
         report: reportRef.data,
         locale: props.locale,
-        isLoading: reportRef.isFetching,
-        profilePrefix
+        isLoading: reportRef.isFetching
       }
     );
   }, [reportRef.status, reportRef.data?.sections]);
 }
 function InteractiveReport(props) {
-  const { report, isLoading, profilePrefix } = props;
+  const { report, isLoading } = props;
   const theme = useMantineTheme();
   const dispatch = useAppDispatch();
   const resource = useContext(ResourceContext);
@@ -9744,7 +10228,7 @@ function InteractiveReport(props) {
     }
   ), [sectionOrder, activeSection, maybeActivate]);
   return /* @__PURE__ */ jsxs(Stack, { styles: { backgroundColor: theme.colors.gray[2] }, spacing: 0, children: [
-    /* @__PURE__ */ jsx(CMSHeader, { report, profilePrefix }),
+    /* @__PURE__ */ jsx(CMSHeader, { report }),
     /* @__PURE__ */ jsxs(Alert, { icon: /* @__PURE__ */ jsx(IconFlag, {}), children: [
       "You are editing the ",
       /* @__PURE__ */ jsx(Code, { children: currentLocale.toUpperCase() }),
@@ -10112,7 +10596,7 @@ function FormatterForm({ formatterId, onEditEnd }) {
               }
             )
           ] }),
-          size: 145
+          size: 165
         }
       )
     }
@@ -11054,7 +11538,7 @@ function MemberForm({ memberId, onEditEnd }) {
                 }
               )
             ] }),
-            size: 145
+            size: 165
           }
         )
       }
@@ -11106,6 +11590,11 @@ function MembersTable({ members, onClickEdit, onSort }) {
       title: "Variant",
       accessor: "variant.name"
     },
+    {
+      title: "Relevance",
+      sortable: true,
+      accessor: "zvalue"
+    },
     {
       title: "Slug",
       accessor: "slug",
@@ -11217,8 +11706,8 @@ function MetadataEditor() {
           ...getParams,
           locale: "all",
           includes: true,
-          sort: internalSort ? internalSort.columnAccessor : "id",
-          direction: internalSort ? internalSort.direction : "asc"
+          sort: internalSort ? internalSort.columnAccessor : "zvalue",
+          direction: internalSort ? internalSort.direction : "desc"
         }
       }
     ).then((response) => response.data && response.data.data && response.data.data.results ? response.data.data.results : []);
@@ -11807,7 +12296,7 @@ function UserForm({ userId, onEditEnd, roles }) {
               }
             )
           ] }),
-          size: 145
+          size: 165
         }
       )
     }
@@ -11997,7 +12486,7 @@ function BespokeManager(options) {
     title = "Bespoke CMS",
     pathSegment = "bespoke",
     locale = localeDefault4,
-    profilePrefix
+    profilePrefix = "/profilePathManager"
   } = options;
   const notifications3 = {
     position: "bottom-center",
@@ -12009,17 +12498,17 @@ function BespokeManager(options) {
     FailureComponent: UnauthorizeView
   });
   function BespokeManagerPage() {
-    return /* @__PURE__ */ jsxs(ResourceProvider, { pathSegment, children: [
+    return /* @__PURE__ */ jsxs(ResourceProvider, { pathSegment, profilePrefix, children: [
       /* @__PURE__ */ jsx(Head, { children: /* @__PURE__ */ jsx("title", { children: title }) }),
       /* @__PURE__ */ jsxs(MantineProvider, { inherit: false, children: [
         /* @__PURE__ */ jsx(Notifications, { ...notifications3 }),
-        /* @__PURE__ */ jsx(DialogProvider, { children: /* @__PURE__ */ jsx(BespokeManagerShell, { locale, profilePrefix }) })
+        /* @__PURE__ */ jsx(DialogProvider, { children: /* @__PURE__ */ jsx(BespokeManagerShell, { locale }) })
       ] })
     ] });
   }
 }
 function BespokeManagerShell(props) {
-  const { locale, profilePrefix } = props;
+  const { locale } = props;
   const [opened, { toggle: toggleOpened }] = useDisclosure(true);
   const { user, error, isLoading } = useUser();
   const location = useManagerLocation();
@@ -12145,7 +12634,7 @@ function BespokeManagerShell(props) {
       if (location.page === "reports") {
         if (location.params.length > 0) {
           const reportId = Number.parseInt(location.params[0]);
-          return /* @__PURE__ */ jsx(BuilderEditor, { id: reportId, locale, profilePrefix });
+          return /* @__PURE__ */ jsx(BuilderEditor, { id: reportId, locale });
         }
         return /* @__PURE__ */ jsx(ReportPicker, {});
       }
@@ -12196,12 +12685,13 @@ init_ResourceProvider();
 function BespokeRenderer({
   pathSegmentsKey = "bespoke",
   bespokeStyles,
-  buildTime
+  buildTime,
+  profilePrefix = "/defaultPath"
 }) {
   const loading = useInitialState(pathSegmentsKey);
   if (loading)
     return /* @__PURE__ */ jsx(LoadingOverlay, { visible: true });
-  return /* @__PURE__ */ jsx(MantineProvider, { theme: { other: { bespokeStyles } }, inherit: true, children: /* @__PURE__ */ jsxs(ResourceProvider, { pathSegment: "bespoke", children: [
+  return /* @__PURE__ */ jsx(MantineProvider, { theme: { other: { bespokeStyles } }, inherit: true, children: /* @__PURE__ */ jsxs(ResourceProvider, { pathSegment: "bespoke", profilePrefix, children: [
     /* @__PURE__ */ jsx(Report_default, {}),
     /* @__PURE__ */ jsx("small", { children: buildTime })
   ] }) });