linked-data-browser 0.0.8-alpha.6 → 0.0.8-alpha.8

package/dist-lib/index.mjs

@@ -1,19 +1,3 @@
-// components/solidFetchConfig.ts
-import { Platform } from "react-native";
-import { fetch as solidAuthFetch } from "@inrupt/solid-client-authn-browser";
-import { dataset } from "@ldo/solid-react";
-function createSolidFetch() {
-  const baseFetch = solidAuthFetch;
-  return async (input, init) => {
-    if (Platform.OS !== "web" && init?.body instanceof Blob) {
-      const arrayBuffer = await init.body.arrayBuffer();
-      return baseFetch(input, { ...init, body: arrayBuffer });
-    }
-    return baseFetch(input, init);
-  };
-}
-dataset.setContext("solid", { fetch: createSolidFetch() });
-
 // components/DataBrowser.tsx
 import { useMemo as useMemo10 } from "react";
 import { BrowserSolidLdoProvider } from "@ldo/solid-react";
@@ -28,7 +12,6 @@ import React35, {
 import React33 from "react";
 import { useSolidAuth as useSolidAuth6 } from "@ldo/solid-react";
 import { StyleSheet as StyleSheet28 } from "react-native";
-import { useTheme as useTheme18 } from "@react-navigation/native";
 
 // components/nav/header/AddressBox.tsx
 import React6, { useEffect as useEffect2, useMemo as useMemo2 } from "react";
@@ -41,7 +24,7 @@ import {
   TextInput,
   View as View3,
   StyleSheet as StyleSheet4,
-  Platform as Platform3
+  Platform as Platform2
 } from "react-native";
 import { useTheme as useTheme3 } from "@react-navigation/native";
 
@@ -258,7 +241,7 @@ import * as React3 from "react";
 import {
   Pressable,
   View as View2,
-  Platform as Platform2,
+  Platform,
   StyleSheet as StyleSheet3
 } from "react-native";
 import { CircleSnail } from "react-native-progress";
@@ -290,9 +273,9 @@ var getButtonStyles = (style, variant = "default", size = "default", isPressed =
   };
   const sizeStyles = {
     default: {
-      height: Platform2.OS === "web" ? 40 : 48,
-      paddingHorizontal: Platform2.OS === "web" ? 16 : 20,
-      paddingVertical: Platform2.OS === "web" ? 8 : 12
+      height: Platform.OS === "web" ? 40 : 48,
+      paddingHorizontal: Platform.OS === "web" ? 16 : 20,
+      paddingVertical: Platform.OS === "web" ? 8 : 12
     },
     sm: {
       height: 36,
@@ -300,7 +283,7 @@ var getButtonStyles = (style, variant = "default", size = "default", isPressed =
       paddingHorizontal: 12
     },
     lg: {
-      height: Platform2.OS === "web" ? 44 : 56,
+      height: Platform.OS === "web" ? 44 : 56,
       borderRadius: 6,
       paddingHorizontal: 32
     },
@@ -344,7 +327,7 @@ var getButtonStyles = (style, variant = "default", size = "default", isPressed =
 };
 var getButtonTextStyles = (variant = "default", size = "default", isPressed = false, theme) => {
   const baseStyles = {
-    fontSize: Platform2.OS === "web" ? 14 : 16,
+    fontSize: Platform.OS === "web" ? 14 : 16,
     fontWeight: "500",
     color: theme.colors.text
   };
@@ -352,7 +335,7 @@ var getButtonTextStyles = (variant = "default", size = "default", isPressed = fa
     default: {},
     sm: {},
     lg: {
-      fontSize: Platform2.OS === "web" ? 14 : 18
+      fontSize: Platform.OS === "web" ? 14 : 18
     },
     icon: {}
   };
@@ -483,10 +466,10 @@ var inputBaseStyles = StyleSheet4.create({
     paddingVertical: 8,
     fontSize: 16,
     // Platform specific adjustments
-    ...Platform3.OS === "web" && {
+    ...Platform2.OS === "web" && {
       width: "100%"
     },
-    ...Platform3.OS !== "web" && {
+    ...Platform2.OS !== "web" && {
       height: 48,
       // native:h-12
       fontSize: 18,
@@ -497,7 +480,7 @@ var inputBaseStyles = StyleSheet4.create({
   },
   disabled: {
     opacity: 0.5,
-    ...Platform3.OS === "web" && {
+    ...Platform2.OS === "web" && {
       cursor: "not-allowed"
     }
   },
@@ -549,7 +532,7 @@ function useDataBrowserConfig() {
 
 // components/TargetResourceProvider.tsx
 import { useResource, useSolidAuth } from "@ldo/solid-react";
-import { Platform as Platform4 } from "react-native";
+import { Platform as Platform3 } from "react-native";
 var TargetResourceContext = createContext3({});
 function useTargetResource() {
   return useContext3(TargetResourceContext);
@@ -560,13 +543,13 @@ var TargetResourceProvider = ({
   const { mode, origin } = useDataBrowserConfig();
   const { ranInitialAuthCheck } = useSolidAuth();
   const [currentUrl, setCurrentUrl] = useState(() => {
-    return Platform4.OS === "web" ? new URL(window.location.href) : new URL("");
+    return Platform3.OS === "web" ? new URL(window.location.href) : new URL("");
   });
   const handleUrlChange = useCallback(() => {
     setCurrentUrl(new URL(window.location.href));
   }, []);
   useEffect(() => {
-    if (Platform4.OS === "web") {
+    if (Platform3.OS === "web") {
       window.addEventListener("popstate", handleUrlChange);
       const originalPushState = history.pushState;
       const originalReplaceState = history.replaceState;
@@ -595,7 +578,7 @@ var TargetResourceProvider = ({
         finalUrl = `${origin}?uri=${encodeURIComponent(newRoute)}`;
       }
       setCurrentUrl(new URL(finalUrl));
-      if (Platform4.OS === "web") {
+      if (Platform3.OS === "web") {
         window.history.pushState(null, "", finalUrl);
       }
     },
@@ -1992,7 +1975,7 @@ import { Sun } from "lucide-react-native";
 // components/ui/switch.tsx
 import * as SwitchPrimitives from "@rn-primitives/switch";
 import * as React7 from "react";
-import { Platform as Platform5, StyleSheet as StyleSheet6 } from "react-native";
+import { Platform as Platform4, StyleSheet as StyleSheet6 } from "react-native";
 import Animated, {
   interpolateColor,
   useAnimatedStyle,
@@ -2100,7 +2083,7 @@ function SwitchNative({
     /* @__PURE__ */ React7.createElement(SwitchPrimitives.Root, { style: styles3.switchNativeRoot, ...props }, /* @__PURE__ */ React7.createElement(Animated.View, { style: animatedThumbStyle }, /* @__PURE__ */ React7.createElement(SwitchPrimitives.Thumb, { style: styles3.switchNativeThumb })))
   );
 }
-var Switch = Platform5.select({
+var Switch = Platform4.select({
   web: SwitchWeb,
   default: SwitchNative
 });
@@ -2109,7 +2092,7 @@ var Switch = Platform5.select({
 import * as DropdownMenuPrimitive from "@rn-primitives/dropdown-menu";
 import * as React8 from "react";
 import {
-  Platform as Platform6,
+  Platform as Platform5,
   Pressable as Pressable2,
   StyleSheet as StyleSheet7,
   Text as Text3,
@@ -2120,6 +2103,36 @@ import { ChevronDown } from "lucide-react-native";
 import { ChevronRight as ChevronRight2 } from "lucide-react-native";
 import { ChevronUp } from "lucide-react-native";
 import { useTheme as useTheme6 } from "@react-navigation/native";
+var DROPDOWN_ANIMATION_CSS = `
+@keyframes dropdown-in {
+  from { opacity: 0; transform: scaleY(0) translateY(-8px); }
+  to   { opacity: 1; transform: scaleY(1) translateY(0); }
+}
+@keyframes dropdown-out {
+  from { opacity: 1; transform: scaleY(1) translateY(0); }
+  to   { opacity: 0; transform: scaleY(0) translateY(-8px); }
+}
+[role="menu"] {
+  transform-origin: var(--radix-dropdown-menu-content-transform-origin);
+}
+[role="menu"][data-state="open"] {
+  animation: dropdown-in 200ms cubic-bezier(0.16, 1, 0.3, 1);
+}
+[role="menu"][data-state="closed"] {
+  animation: dropdown-out 150ms ease-in;
+}
+`;
+function useDropdownAnimation() {
+  React8.useEffect(() => {
+    if (Platform5.OS !== "web") return;
+    const id = "rnp-dropdown-menu-animations";
+    if (document.getElementById(id)) return;
+    const el = document.createElement("style");
+    el.id = id;
+    el.textContent = DROPDOWN_ANIMATION_CSS;
+    document.head.appendChild(el);
+  }, []);
+}
 var DropdownMenu = DropdownMenuPrimitive.Root;
 var DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;
 var DropdownMenuGroup = DropdownMenuPrimitive.Group;
@@ -2134,7 +2147,7 @@ function DropdownMenuSubTrigger({
 }) {
   const theme = useTheme6();
   const { open } = DropdownMenuPrimitive.useSubContext();
-  const SubIcon = Platform6.OS === "web" ? ChevronRight2 : open ? ChevronUp : ChevronDown;
+  const SubIcon = Platform5.OS === "web" ? ChevronRight2 : open ? ChevronUp : ChevronDown;
   return /* @__PURE__ */ React8.createElement(
     TextStyleProvider,
     {
@@ -2187,13 +2200,14 @@ function DropdownMenuContent({
   ...props
 }) {
   const theme = useTheme6();
+  useDropdownAnimation();
   return /* @__PURE__ */ React8.createElement(DropdownMenuPrimitive.Portal, { hostName: portalHost }, /* @__PURE__ */ React8.createElement(
     DropdownMenuPrimitive.Overlay,
     {
       style: overlayStyle ? StyleSheet7.flatten([
-        Platform6.OS !== "web" ? StyleSheet7.absoluteFill : void 0,
+        Platform5.OS !== "web" ? StyleSheet7.absoluteFill : void 0,
         overlayStyle
-      ]) : Platform6.OS !== "web" ? StyleSheet7.absoluteFill : void 0
+      ]) : Platform5.OS !== "web" ? StyleSheet7.absoluteFill : void 0
     },
     /* @__PURE__ */ React8.createElement(
       DropdownMenuPrimitive.Content,
@@ -2219,7 +2233,7 @@ function DropdownMenuItem({
   ...props
 }) {
   const theme = useTheme6();
-  return /* @__PURE__ */ React8.createElement(TextStyleProvider, { style: { color: theme.colors.text } }, /* @__PURE__ */ React8.createElement(DropdownMenuPrimitive.Item, { asChild: true, ...props }, /* @__PURE__ */ React8.createElement(
+  return /* @__PURE__ */ React8.createElement(TextStyleProvider, { size: "sm", style: { color: theme.colors.text } }, /* @__PURE__ */ React8.createElement(DropdownMenuPrimitive.Item, { asChild: true, ...props }, /* @__PURE__ */ React8.createElement(
     Pressable2,
     {
       style: ({ pressed, hovered }) => StyleSheet7.flatten([
@@ -2333,7 +2347,7 @@ function DropdownMenuShortcut({ style, ...props }) {
 var styles4 = StyleSheet7.create({
   // SubTrigger styles
   subTriggerText: {
-    fontSize: Platform6.OS === "web" ? 14 : 18
+    fontSize: Platform5.OS === "web" ? 14 : 18
     // text-sm native:text-lg
   },
   subTriggerTextOpen: {
@@ -2346,7 +2360,7 @@ var styles4 = StyleSheet7.create({
     // gap-2
     paddingHorizontal: 8,
     // px-2
-    paddingVertical: Platform6.OS === "web" ? 6 : 8,
+    paddingVertical: Platform5.OS === "web" ? 6 : 8,
     // py-1.5 native:py-2
     borderRadius: 2
     // rounded-sm
@@ -2377,11 +2391,10 @@ var styles4 = StyleSheet7.create({
     // mt-1
     padding: 4,
     // p-1
-    shadowOffset: { width: 0, height: 1 },
-    shadowOpacity: 0.05,
-    // shadow-foreground/5
-    shadowRadius: 2,
-    elevation: 2
+    shadowOffset: { width: 0, height: 4 },
+    shadowOpacity: 0.12,
+    shadowRadius: 8,
+    elevation: 8
     // Android shadow
     // Border color, background color, and shadow color applied at render time
   },
@@ -2397,11 +2410,10 @@ var styles4 = StyleSheet7.create({
     borderWidth: 1,
     padding: 4,
     // p-1
-    shadowOffset: { width: 0, height: 1 },
-    shadowOpacity: 0.05,
-    // shadow-foreground/5
-    shadowRadius: 2,
-    elevation: 2
+    shadowOffset: { width: 0, height: 4 },
+    shadowOpacity: 0.12,
+    shadowRadius: 8,
+    elevation: 8
     // Android shadow
     // Border color, background color, and shadow color applied at render time
   },
@@ -2415,7 +2427,7 @@ var styles4 = StyleSheet7.create({
     // rounded-sm
     paddingHorizontal: 8,
     // px-2
-    paddingVertical: Platform6.OS === "web" ? 6 : 8
+    paddingVertical: Platform5.OS === "web" ? 6 : 8
     // py-1.5 native:py-2
   },
   itemInset: {
@@ -2433,7 +2445,7 @@ var styles4 = StyleSheet7.create({
     alignItems: "center",
     borderRadius: 2,
     // rounded-sm
-    paddingVertical: Platform6.OS === "web" ? 6 : 8,
+    paddingVertical: Platform5.OS === "web" ? 6 : 8,
     // py-1.5 native:py-2
     paddingLeft: 32,
     // pl-8
@@ -2465,7 +2477,7 @@ var styles4 = StyleSheet7.create({
     alignItems: "center",
     borderRadius: 2,
     // rounded-sm
-    paddingVertical: Platform6.OS === "web" ? 6 : 8,
+    paddingVertical: Platform5.OS === "web" ? 6 : 8,
     // py-1.5 native:py-2
     paddingLeft: 32,
     // pl-8
@@ -2502,7 +2514,7 @@ var styles4 = StyleSheet7.create({
     // px-2
     paddingVertical: 6,
     // py-1.5
-    fontSize: Platform6.OS === "web" ? 14 : 16,
+    fontSize: Platform5.OS === "web" ? 14 : 16,
     // text-sm native:text-base
     fontWeight: "600"
     // font-semibold
@@ -2525,7 +2537,7 @@ var styles4 = StyleSheet7.create({
   // Shortcut styles
   shortcut: {
     marginLeft: "auto",
-    fontSize: Platform6.OS === "web" ? 12 : 14,
+    fontSize: Platform5.OS === "web" ? 12 : 14,
     // text-xs native:text-sm
     letterSpacing: 0.1
     // tracking-widest
@@ -2534,7 +2546,7 @@ var styles4 = StyleSheet7.create({
 });
 
 // components/ThemeProvider.tsx
-import React9, { useEffect as useEffect3 } from "react";
+import React9, { useEffect as useEffect4 } from "react";
 import AsyncStorage from "@react-native-async-storage/async-storage";
 import {
   createContext as createContext4,
@@ -2542,7 +2554,7 @@ import {
   useMemo as useMemo3,
   useState as useState3
 } from "react";
-import { Appearance, Platform as Platform8 } from "react-native";
+import { Appearance, Platform as Platform7 } from "react-native";
 import {
   ThemeProvider as ApplicationThemeProvider,
   DarkTheme,
@@ -2554,7 +2566,7 @@ var NAV_THEME = {
   light: {
     background: "hsl(0 0% 99%)",
     border: "hsl(220 13% 91%)",
-    card: "hsl(0 0% 100%)",
+    card: "hsl(220 14% 96%)",
     notification: "hsl(0 72% 51%)",
     primary: "hsl(220 70% 45%)",
     text: "hsl(220 15% 12%)"
@@ -2562,7 +2574,7 @@ var NAV_THEME = {
   dark: {
     background: "hsl(222 18% 8%)",
     border: "hsl(217 18% 18%)",
-    card: "hsl(222 18% 10%)",
+    card: "hsl(222 18% 14%)",
     notification: "hsl(0 62% 50%)",
     primary: "hsl(217 91% 60%)",
     text: "hsl(210 20% 96%)"
@@ -2571,9 +2583,9 @@ var NAV_THEME = {
 
 // lib/android-navigation-bar.ts
 import * as NavigationBar from "expo-navigation-bar";
-import { Platform as Platform7 } from "react-native";
+import { Platform as Platform6 } from "react-native";
 async function setAndroidNavigationBar(theme) {
-  if (Platform7.OS !== "android") return;
+  if (Platform6.OS !== "android") return;
   await NavigationBar.setButtonStyleAsync(theme === "dark" ? "light" : "dark");
   await NavigationBar.setBackgroundColorAsync(
     theme === "dark" ? NAV_THEME.dark.background : NAV_THEME.light.background
@@ -2599,7 +2611,7 @@ var ThemeProviderContext = createContext4({
 function useThemeChange() {
   return useContext4(ThemeProviderContext);
 }
-var usePlatformSpecificSetup = Platform8.select({
+var usePlatformSpecificSetup = Platform7.select({
   android: useSetAndroidNavigationBar,
   default: noop
 });
@@ -2611,7 +2623,7 @@ var ThemeProvider = ({
   const resolvedScheme = colorScheme ?? "light";
   usePlatformSpecificSetup();
   useSetWebBackgroundClassName(resolvedScheme);
-  useEffect3(() => {
+  useEffect4(() => {
     const lookupCurColorScheme = async () => {
       setColorScheme(Appearance.getColorScheme() ?? "light");
       const storedColorSchemeName = await AsyncStorage.getItem(COLOR_SCHEME_KEY) || Appearance.getColorScheme();
@@ -2641,10 +2653,10 @@ var ThemeProvider = ({
     /* @__PURE__ */ React9.createElement(ThemeProviderContext.Provider, { value: context }, children)
   ));
 };
-var useIsomorphicLayoutEffect = Platform8.OS === "web" && typeof window === "undefined" ? React9.useEffect : React9.useLayoutEffect;
+var useIsomorphicLayoutEffect = Platform7.OS === "web" && typeof window === "undefined" ? React9.useEffect : React9.useLayoutEffect;
 function useSetWebBackgroundClassName(colorScheme) {
   useIsomorphicLayoutEffect(() => {
-    if (Platform8.OS !== "web" || typeof document === "undefined") return;
+    if (Platform7.OS !== "web" || typeof document === "undefined") return;
     const el = document.documentElement;
     el.classList.add("bg-background");
     if (colorScheme === "dark") {
@@ -2840,7 +2852,7 @@ import { EllipsisVertical } from "lucide-react-native";
 import * as DialogPrimitive from "@rn-primitives/dialog";
 import * as React14 from "react";
 import {
-  Platform as Platform9,
+  Platform as Platform8,
   StyleSheet as StyleSheet11,
   View as View8
 } from "react-native";
@@ -2884,7 +2896,7 @@ function DialogOverlayNative({
     )
   );
 }
-var DialogOverlay = Platform9.select({
+var DialogOverlay = Platform8.select({
   web: DialogOverlayWeb,
   default: DialogOverlayNative
 });
@@ -2906,7 +2918,7 @@ function DialogContent({
       ...props
     },
     children,
-    /* @__PURE__ */ React14.createElement(DialogPrimitive.Close, { style: styles8.closeButton }, /* @__PURE__ */ React14.createElement(X, { size: Platform9.OS === "web" ? 16 : 18, color: colors.text }))
+    /* @__PURE__ */ React14.createElement(DialogPrimitive.Close, { style: styles8.closeButton }, /* @__PURE__ */ React14.createElement(X, { size: Platform8.OS === "web" ? 16 : 18, color: colors.text }))
   )));
 }
 function DialogHeader({ style, ...props }) {
@@ -2918,7 +2930,7 @@ function DialogFooter({ style, ...props }) {
     {
       style: StyleSheet11.flatten([
         styles8.footer,
-        Platform9.OS === "web" && styles8.footerRow,
+        Platform8.OS === "web" && styles8.footerRow,
         style
       ]),
       ...props
@@ -3007,8 +3019,7 @@ var styles8 = StyleSheet11.create({
     flexDirection: "column",
     gap: 6,
     // gap-1.5
-    textAlign: "center",
-    borderBottomWidth: 1
+    textAlign: "center"
   },
   footer: {
     flexDirection: "column-reverse",
@@ -3020,17 +3031,17 @@ var styles8 = StyleSheet11.create({
     justifyContent: "flex-end"
   },
   title: {
-    fontSize: Platform9.OS === "web" ? 18 : 20,
+    fontSize: Platform8.OS === "web" ? 18 : 20,
     // text-lg native:text-xl
     fontWeight: "600",
     // font-semibold
-    lineHeight: Platform9.OS === "web" ? 20 : 22,
+    lineHeight: Platform8.OS === "web" ? 20 : 22,
     // leading-none
     letterSpacing: -0.025
     // tracking-tight
   },
   description: {
-    fontSize: Platform9.OS === "web" ? 14 : 16,
+    fontSize: Platform8.OS === "web" ? 14 : 16,
     // text-sm native:text-base
     opacity: 0.7
   }
@@ -3047,7 +3058,7 @@ var SignInMenu = () => {
   const onIdpSubmit = useCallback2(async () => {
     setIdpError(void 0);
     try {
-      await login(idpValue);
+      await login(idpValue, window.location.href);
     } catch (err) {
       if (err instanceof Error) {
         setIdpError(err.message);
@@ -3061,7 +3072,7 @@ var SignInMenu = () => {
       Button,
       {
         key: "signUp",
-        onPress: () => signUp(defaultIssuer),
+        onPress: () => signUp(defaultIssuer, window.location.href),
         variant: "ghost",
         text: "Sign Up"
       }
@@ -3069,7 +3080,7 @@ var SignInMenu = () => {
       Button,
       {
         key: "logIn",
-        onPress: () => login(defaultIssuer),
+        onPress: () => login(defaultIssuer, window.location.href),
         variant: "default",
         text: "Log In"
       }
@@ -3085,13 +3096,13 @@ var SignInMenu = () => {
     )), /* @__PURE__ */ React15.createElement(DropdownMenuContent, { style: styles9.dropdownContent }, /* @__PURE__ */ React15.createElement(DropdownMenuGroup, null, isSmallScreen && /* @__PURE__ */ React15.createElement(
       DropdownMenuItem,
       {
-        onPress: () => signUp(defaultIssuer)
+        onPress: () => signUp(defaultIssuer, window.location.href)
       },
       /* @__PURE__ */ React15.createElement(Text2, null, "Sign Up")
     ), isSmallScreen && /* @__PURE__ */ React15.createElement(
       DropdownMenuItem,
       {
-        onPress: () => login(defaultIssuer)
+        onPress: () => login(defaultIssuer, window.location.href)
       },
       /* @__PURE__ */ React15.createElement(Text2, null, "Log In")
     ), /* @__PURE__ */ React15.createElement(Dialog, null, /* @__PURE__ */ React15.createElement(DialogTrigger, { asChild: true }, /* @__PURE__ */ React15.createElement(DropdownMenuItem, { closeOnPress: false }, /* @__PURE__ */ React15.createElement(Text2, null, "Log in with Another Pod"))), /* @__PURE__ */ React15.createElement(DialogContent, { style: styles9.dialogContent }, /* @__PURE__ */ React15.createElement(DialogHeader, null, /* @__PURE__ */ React15.createElement(DialogTitle, null, "Solid WebId or Identity Provider"), /* @__PURE__ */ React15.createElement(DialogDescription, null, /* @__PURE__ */ React15.createElement(
@@ -3131,7 +3142,7 @@ import { ViewIcon } from "lucide-react-native";
 
 // components/useViewContext.tsx
 import createContainer from "constate";
-import React18, { useEffect as useEffect4, useMemo as useMemo4, useState as useState5 } from "react";
+import React18, { useEffect as useEffect5, useMemo as useMemo4, useState as useState5 } from "react";
 import { EyeOff } from "lucide-react-native";
 import { OctagonX } from "lucide-react-native";
 import { CircleSlash } from "lucide-react-native";
@@ -3157,7 +3168,7 @@ function Card({
     {
       style: StyleSheet13.flatten([
         styles10.card,
-        { backgroundColor: colors.background, borderColor: colors.border },
+        { backgroundColor: colors.card, borderColor: colors.border },
         style
       ]),
       ...props
@@ -3282,7 +3293,7 @@ import { useLdo } from "@ldo/solid-react";
 var [ViewContextProvider, useViewContext] = createContainer(() => {
   const { targetUri, targetResource, refresh, navigateTo } = useTargetResource();
   const { resourceViews } = useDataBrowserConfig();
-  const { dataset: dataset2 } = useLdo();
+  const { dataset } = useLdo();
   const validViews = useMemo4(() => {
     if (!targetResource || !targetUri) {
       return [
@@ -3302,14 +3313,14 @@ var [ViewContextProvider, useViewContext] = createContainer(() => {
     const errorViews = getErrorViews(targetResource);
     if (errorViews) return errorViews;
     const potentialViews = resourceViews.filter(
-      (view) => view.canDisplay(targetUri, targetResource, dataset2)
+      (view) => view.canDisplay(targetUri, targetResource, dataset)
     );
     return potentialViews.length > 0 ? potentialViews : [constructErrorView(`No valid view for ${targetUri}`, OctagonX)];
-  }, [targetResource, targetUri, resourceViews, dataset2]);
+  }, [targetResource, targetUri, resourceViews, dataset]);
   const [curViewConfig, setCurViewConfig] = useState5(
     validViews[0]
   );
-  useEffect4(() => {
+  useEffect5(() => {
     setCurViewConfig(validViews[0]);
   }, [targetUri, validViews]);
   return {
@@ -3461,7 +3472,7 @@ import React32, {
   createContext as createContext5,
   useCallback as useCallback8,
   useContext as useContext5,
-  useEffect as useEffect6,
+  useEffect as useEffect7,
   useMemo as useMemo9,
   useState as useState9
 } from "react";
@@ -3613,7 +3624,7 @@ import React25, { useCallback as useCallback4, useMemo as useMemo5 } from "react
 // components/ui/checkbox.tsx
 import * as CheckboxPrimitive from "@rn-primitives/checkbox";
 import * as React24 from "react";
-import { Platform as Platform10, StyleSheet as StyleSheet20 } from "react-native";
+import { Platform as Platform9, StyleSheet as StyleSheet20 } from "react-native";
 import { Check as Check2 } from "lucide-react-native";
 import { useTheme as useTheme14 } from "@react-navigation/native";
 var getCheckboxStyles = (checked = false, disabled = false, theme) => {
@@ -3654,7 +3665,7 @@ function Checkbox({
     Check2,
     {
       size: 12,
-      strokeWidth: Platform10.OS === "web" ? 2.5 : 3.5,
+      strokeWidth: Platform9.OS === "web" ? 2.5 : 3.5,
       color: theme.colors.background
     }
   )));
@@ -3772,7 +3783,7 @@ import React27, {
   useMemo as useMemo6,
   useState as useState7,
   useRef,
-  useEffect as useEffect5
+  useEffect as useEffect6
 } from "react";
 import { View as View14, StyleSheet as StyleSheet23 } from "react-native";
 import { useTheme as useTheme15 } from "@react-navigation/native";
@@ -3816,7 +3827,7 @@ function InputDropdown({
     },
     [onItemSelect]
   );
-  useEffect5(() => {
+  useEffect6(() => {
     const handleClickOutside = (event) => {
       if (inputRef.current && !inputRef.current.contains(event.target)) {
         setIsDropdownOpen(false);
@@ -4120,6 +4131,7 @@ var SharingModalProvider = ({
   const { targetResource } = useViewContext();
   const { colors } = useTheme17();
   const [isOpen, setIsOpen] = useState9(false);
+  const [resourceOverride, setResourceOverride] = useState9();
   const [wacResult, setWacResult] = useState9();
   const [isLoading, setIsLoading] = useState9(false);
   const [editedRules, setEditedRules] = useState9({
@@ -4128,10 +4140,11 @@ var SharingModalProvider = ({
     agent: {}
   });
   const { width, height } = useWindowDimensions3();
-  useEffect6(() => {
-    if (targetResource && targetResource.type !== "InvalidIdentifierResource" && isOpen) {
+  const activeResource = resourceOverride ?? targetResource;
+  useEffect7(() => {
+    if (isOpen && (activeResource?.type === "SolidContainer" || activeResource?.type === "SolidLeaf")) {
       setIsLoading(true);
-      targetResource.getWac().then((wac) => {
+      activeResource.getWac().then((wac) => {
         setWacResult(
           wac
         );
@@ -4141,7 +4154,7 @@ var SharingModalProvider = ({
         setIsLoading(false);
       });
     }
-  }, [targetResource, isOpen]);
+  }, [activeResource, isOpen]);
   const didEdit = useMemo9(() => {
     if (wacResult?.type !== "getWacRuleSuccess") return false;
     return !isEqual(editedRules, wacResult.wacRule);
@@ -4149,19 +4162,26 @@ var SharingModalProvider = ({
   const context = useMemo9(
     () => ({
       isModalOpen: isOpen,
-      openSharingModal: () => setIsOpen(true),
-      closeSharingModal: () => setIsOpen(false)
+      openSharingModal: (resource) => {
+        setResourceOverride(resource);
+        setIsOpen(true);
+      },
+      closeSharingModal: () => {
+        setIsOpen(false);
+        setResourceOverride(void 0);
+      }
     }),
     [isOpen]
   );
   const onApplyChanges = useCallback8(async () => {
-    if (didEdit && (targetResource?.type === "SolidContainer" || targetResource?.type === "SolidLeaf")) {
+    if (didEdit && (activeResource?.type === "SolidContainer" || activeResource?.type === "SolidLeaf")) {
       setIsLoading(true);
-      const result = await targetResource.setWac(editedRules);
+      const result = await activeResource.setWac(editedRules);
       setIsLoading(false);
     }
     setIsOpen(false);
-  }, [editedRules, targetResource, didEdit]);
+    setResourceOverride(void 0);
+  }, [editedRules, activeResource, didEdit]);
   return /* @__PURE__ */ React32.createElement(sharingModalContext.Provider, { value: context }, /* @__PURE__ */ React32.createElement(Dialog, { open: isOpen, onOpenChange: (value) => setIsOpen(value) }, /* @__PURE__ */ React32.createElement(
     DialogContent,
     {
@@ -4198,7 +4218,6 @@ var styles23 = StyleSheet27.create({
   scrollView: {
     flex: 1,
     borderTopWidth: 1,
-    borderBottomWidth: 1,
     paddingTop: 8,
     paddingBottom: 8,
     marginLeft: -24,
@@ -4212,29 +4231,22 @@ var styles23 = StyleSheet27.create({
 var Header = () => {
   const { session } = useSolidAuth6();
   const { openSharingModal } = useSharingModal();
-  const { colors } = useTheme18();
-  return /* @__PURE__ */ React33.createElement(
-    Card,
+  const { targetResource } = useViewContext();
+  const handleShare = () => {
+    if (targetResource?.type === "SolidLeaf" || targetResource?.type === "SolidContainer") {
+      openSharingModal(targetResource);
+    }
+  };
+  return /* @__PURE__ */ React33.createElement(Card, { style: styles24.card }, /* @__PURE__ */ React33.createElement(AddressBox, null), session.isActive && /* @__PURE__ */ React33.createElement(
+    Button,
     {
-      style: [
-        styles24.card,
-        { borderBottomWidth: 1, borderBottomColor: colors.border }
-      ]
-    },
-    /* @__PURE__ */ React33.createElement(AddressBox, null),
-    session.isLoggedIn && /* @__PURE__ */ React33.createElement(
-      Button,
-      {
-        key: "setMemu",
-        variant: "ghost",
-        style: styles24.shareButton,
-        onPress: openSharingModal,
-        iconLeft: UserPlus
-      }
-    ),
-    /* @__PURE__ */ React33.createElement(ViewMenu, null),
-    session.isLoggedIn ? /* @__PURE__ */ React33.createElement(AvatarMenu, null) : /* @__PURE__ */ React33.createElement(SignInMenu, null)
-  );
+      key: "setMemu",
+      variant: "ghost",
+      style: styles24.shareButton,
+      onPress: handleShare,
+      iconLeft: UserPlus
+    }
+  ), /* @__PURE__ */ React33.createElement(ViewMenu, null), session.isActive ? /* @__PURE__ */ React33.createElement(AvatarMenu, null) : /* @__PURE__ */ React33.createElement(SignInMenu, null));
 };
 var styles24 = StyleSheet28.create({
   card: {
@@ -4337,11 +4349,11 @@ var DialogProvider = ({
 
 // components/nav/Layout.tsx
 import { useSolidAuth as useSolidAuth7 } from "@ldo/solid-react";
-import { useTheme as useTheme19 } from "@react-navigation/native";
+import { useTheme as useTheme18 } from "@react-navigation/native";
 var ValidViewContext = createContext7({});
 var Layout = () => {
   const { ranInitialAuthCheck } = useSolidAuth7();
-  const { colors } = useTheme19();
+  const { colors } = useTheme18();
   if (!ranInitialAuthCheck) {
     return /* @__PURE__ */ React35.createElement(React35.Fragment, null);
   }
@@ -4377,11 +4389,11 @@ var styles25 = StyleSheet29.create({
 // components/DataBrowser.tsx
 import { PortalHost } from "@rn-primitives/portal";
 import { NotifierWrapper } from "react-native-notifier";
-import { Platform as Platform11 } from "react-native";
+import { Platform as Platform10 } from "react-native";
 var DataBrowser = (props) => {
   const providerProps = useMemo10(() => {
     return {
-      origin: Platform11.OS === "web" && !props.origin ? window.location.origin : void 0,
+      origin: Platform10.OS === "web" && !props.origin ? window.location.origin : void 0,
       defaultIssuer: props.mode === "server-ui" ? window.location.origin : "https://solidcommunity.net",
       ...props
     };
@@ -4392,7 +4404,7 @@ var DataBrowser = (props) => {
 // components/ui/accordion.tsx
 import * as AccordionPrimitive from "@rn-primitives/accordion";
 import * as React37 from "react";
-import { Platform as Platform12, Pressable as Pressable4, View as View19, StyleSheet as StyleSheet30 } from "react-native";
+import { Platform as Platform11, Pressable as Pressable4, View as View19, StyleSheet as StyleSheet30 } from "react-native";
 import Animated3, {
   Extrapolation,
   FadeIn as FadeIn2,
@@ -4405,7 +4417,7 @@ import Animated3, {
   withTiming as withTiming2
 } from "react-native-reanimated";
 import { ChevronDown as ChevronDown3 } from "lucide-react-native";
-import { useTheme as useTheme20 } from "@react-navigation/native";
+import { useTheme as useTheme19 } from "@react-navigation/native";
 function Accordion({
   children,
   ...props
@@ -4414,7 +4426,7 @@ function Accordion({
     AccordionPrimitive.Root,
     {
       ...props,
-      asChild: Platform12.OS !== "web"
+      asChild: Platform11.OS !== "web"
     },
     /* @__PURE__ */ React37.createElement(Animated3.View, { layout: LinearTransition.duration(200) }, children)
   ));
@@ -4424,7 +4436,7 @@ function AccordionItem({
   value,
   ...props
 }) {
-  const { colors } = useTheme20();
+  const { colors } = useTheme19();
   return /* @__PURE__ */ React37.createElement(
     Animated3.View,
     {
@@ -4445,13 +4457,13 @@ function AccordionItem({
     )
   );
 }
-var Trigger4 = Platform12.OS === "web" ? View19 : Pressable4;
+var Trigger4 = Platform11.OS === "web" ? View19 : Pressable4;
 function AccordionTrigger({
   style,
   children,
   ...props
 }) {
-  const { colors } = useTheme20();
+  const { colors } = useTheme19();
   const { isExpanded } = AccordionPrimitive.useItemContext();
   const progress = useDerivedValue2(
     () => isExpanded ? withTiming2(1, { duration: 250 }) : withTiming2(0, { duration: 200 })
@@ -4461,7 +4473,7 @@ function AccordionTrigger({
     opacity: interpolate(progress.value, [0, 1], [1, 0.8], Extrapolation.CLAMP)
   }));
   const textStyles2 = {
-    fontSize: Platform12.OS === "web" ? 16 : 18,
+    fontSize: Platform11.OS === "web" ? 16 : 18,
     fontWeight: "500",
     color: colors.text
   };
@@ -4470,7 +4482,7 @@ function AccordionTrigger({
     {
       style: StyleSheet30.flatten([
         styles26.trigger,
-        { flex: Platform12.OS === "web" ? 1 : void 0 },
+        { flex: Platform11.OS === "web" ? 1 : void 0 },
         style
       ])
     },
@@ -4483,9 +4495,9 @@ function AccordionContent({
   children,
   ...props
 }) {
-  const { colors } = useTheme20();
+  const { colors } = useTheme19();
   const textStyles2 = {
-    fontSize: Platform12.OS === "web" ? 14 : 18,
+    fontSize: Platform11.OS === "web" ? 14 : 18,
     color: colors.text
   };
   return /* @__PURE__ */ React37.createElement(TextStyleProvider, { style: textStyles2 }, /* @__PURE__ */ React37.createElement(
@@ -4505,7 +4517,7 @@ function InnerContent({
   children,
   style
 }) {
-  if (Platform12.OS === "web") {
+  if (Platform11.OS === "web") {
     return /* @__PURE__ */ React37.createElement(View19, { style: StyleSheet30.flatten([styles26.innerContent, style]) }, children);
   }
   return /* @__PURE__ */ React37.createElement(
@@ -4543,7 +4555,7 @@ var styles26 = StyleSheet30.create({
 });
 
 // components/ui/alert.tsx
-import { useTheme as useTheme21 } from "@react-navigation/native";
+import { useTheme as useTheme20 } from "@react-navigation/native";
 import * as React38 from "react";
 import { View as View20, StyleSheet as StyleSheet31 } from "react-native";
 function Alert({
@@ -4554,7 +4566,7 @@ function Alert({
   iconSize = 16,
   ...props
 }) {
-  const { colors } = useTheme21();
+  const { colors } = useTheme20();
   const getAlertStyles = () => {
     const baseAlertStyles = {
       backgroundColor: colors.background,
@@ -4572,7 +4584,7 @@ function Alert({
   )), children);
 }
 function AlertTitle({ style, ...props }) {
-  const { colors } = useTheme21();
+  const { colors } = useTheme20();
   return /* @__PURE__ */ React38.createElement(
     Text2,
     {
@@ -4585,7 +4597,7 @@ function AlertDescription({
   style,
   ...props
 }) {
-  const { colors } = useTheme21();
+  const { colors } = useTheme20();
   return /* @__PURE__ */ React38.createElement(
     Text2,
     {
@@ -4645,9 +4657,9 @@ var AspectRatio = AspectRatioPrimitive.Root;
 import React39 from "react";
 import * as Slot2 from "@rn-primitives/slot";
 import { View as View22, StyleSheet as StyleSheet32 } from "react-native";
-import { useTheme as useTheme22 } from "@react-navigation/native";
+import { useTheme as useTheme21 } from "@react-navigation/native";
 function Badge({ style, variant = "default", asChild, ...props }) {
-  const { colors } = useTheme22();
+  const { colors } = useTheme21();
   const Component = asChild ? Slot2.View : View22;
   const getVariantStyles = () => {
     switch (variant) {
@@ -4718,7 +4730,7 @@ var CollapsibleContent = CollapsiblePrimitive.Content;
 import * as ContextMenuPrimitive from "@rn-primitives/context-menu";
 import * as React40 from "react";
 import {
-  Platform as Platform13,
+  Platform as Platform12,
   StyleSheet as StyleSheet33,
   Text as Text5,
   View as View23
@@ -4727,7 +4739,7 @@ import { Check as Check3 } from "lucide-react-native";
 import { ChevronDown as ChevronDown4 } from "lucide-react-native";
 import { ChevronRight as ChevronRight3 } from "lucide-react-native";
 import { ChevronUp as ChevronUp2 } from "lucide-react-native";
-import { useTheme as useTheme23 } from "@react-navigation/native";
+import { useTheme as useTheme22 } from "@react-navigation/native";
 var ContextMenu = ContextMenuPrimitive.Root;
 var ContextMenuTrigger = ContextMenuPrimitive.Trigger;
 var ContextMenuGroup = ContextMenuPrimitive.Group;
@@ -4739,11 +4751,11 @@ function ContextMenuSubTrigger({
   children,
   ...props
 }) {
-  const { colors } = useTheme23();
+  const { colors } = useTheme22();
   const { open } = ContextMenuPrimitive.useSubContext();
-  const Icon2 = Platform13.OS === "web" ? ChevronRight3 : open ? ChevronUp2 : ChevronDown4;
+  const Icon2 = Platform12.OS === "web" ? ChevronRight3 : open ? ChevronUp2 : ChevronDown4;
   const textStyles2 = {
-    fontSize: Platform13.OS === "web" ? 14 : 18,
+    fontSize: Platform12.OS === "web" ? 14 : 18,
     color: open ? colors.primary : colors.primary
   };
   const triggerStyles = StyleSheet33.flatten([
@@ -4760,7 +4772,7 @@ function ContextMenuSubContent({
   style,
   ...props
 }) {
-  const { colors } = useTheme23();
+  const { colors } = useTheme22();
   const contentStyles = StyleSheet33.flatten([
     styles29.subContent,
     {
@@ -4778,7 +4790,7 @@ function ContextMenuContent({
   portalHost,
   ...props
 }) {
-  const { colors } = useTheme23();
+  const { colors } = useTheme22();
   const contentStyles = StyleSheet33.flatten([
     styles29.content,
     {
@@ -4792,9 +4804,9 @@ function ContextMenuContent({
     ContextMenuPrimitive.Overlay,
     {
       style: overlayStyle ? StyleSheet33.flatten([
-        Platform13.OS !== "web" ? StyleSheet33.absoluteFill : void 0,
+        Platform12.OS !== "web" ? StyleSheet33.absoluteFill : void 0,
         overlayStyle
-      ]) : Platform13.OS !== "web" ? StyleSheet33.absoluteFill : void 0
+      ]) : Platform12.OS !== "web" ? StyleSheet33.absoluteFill : void 0
     },
     /* @__PURE__ */ React40.createElement(ContextMenuPrimitive.Content, { style: contentStyles, ...props })
   ));
@@ -4804,9 +4816,9 @@ function ContextMenuItem({
   inset,
   ...props
 }) {
-  const { colors } = useTheme23();
+  const { colors } = useTheme22();
   const textStyles2 = {
-    fontSize: Platform13.OS === "web" ? 14 : 18,
+    fontSize: Platform12.OS === "web" ? 14 : 18,
     color: colors.text
   };
   const itemStyles = StyleSheet33.flatten([
@@ -4824,7 +4836,7 @@ function ContextMenuCheckboxItem({
   children,
   ...props
 }) {
-  const { colors } = useTheme23();
+  const { colors } = useTheme22();
   const checkboxStyles = StyleSheet33.flatten([
     styles29.checkboxItem,
     {
@@ -4839,7 +4851,7 @@ function ContextMenuRadioItem({
   children,
   ...props
 }) {
-  const { colors } = useTheme23();
+  const { colors } = useTheme22();
   const radioStyles = StyleSheet33.flatten([
     styles29.radioItem,
     {
@@ -4854,7 +4866,7 @@ function ContextMenuLabel({
   inset,
   ...props
 }) {
-  const { colors } = useTheme23();
+  const { colors } = useTheme22();
   const labelStyles = StyleSheet33.flatten([
     styles29.label,
     {
@@ -4869,7 +4881,7 @@ function ContextMenuSeparator({
   style,
   ...props
 }) {
-  const { colors } = useTheme23();
+  const { colors } = useTheme22();
   const separatorStyles = StyleSheet33.flatten([
     styles29.separator,
     {
@@ -4880,7 +4892,7 @@ function ContextMenuSeparator({
   return /* @__PURE__ */ React40.createElement(ContextMenuPrimitive.Separator, { style: separatorStyles, ...props });
 }
 function ContextMenuShortcut({ style, ...props }) {
-  const { colors } = useTheme23();
+  const { colors } = useTheme22();
   const shortcutStyles = StyleSheet33.flatten([
     styles29.shortcut,
     {
@@ -4975,7 +4987,7 @@ var styles29 = StyleSheet33.create({
   label: {
     paddingHorizontal: 8,
     paddingVertical: 6,
-    fontSize: Platform13.OS === "web" ? 14 : 16,
+    fontSize: Platform12.OS === "web" ? 14 : 16,
     fontWeight: "600"
   },
   separator: {
@@ -4985,7 +4997,7 @@ var styles29 = StyleSheet33.create({
   },
   shortcut: {
     marginLeft: "auto",
-    fontSize: Platform13.OS === "web" ? 12 : 14,
+    fontSize: Platform12.OS === "web" ? 12 : 14,
     letterSpacing: 1
   }
 });
@@ -4993,9 +5005,9 @@ var styles29 = StyleSheet33.create({
 // components/ui/hover-card.tsx
 import * as HoverCardPrimitive from "@rn-primitives/hover-card";
 import * as React41 from "react";
-import { Platform as Platform14, StyleSheet as StyleSheet34 } from "react-native";
+import { Platform as Platform13, StyleSheet as StyleSheet34 } from "react-native";
 import Animated4, { FadeIn as FadeIn3 } from "react-native-reanimated";
-import { useTheme as useTheme24 } from "@react-navigation/native";
+import { useTheme as useTheme23 } from "@react-navigation/native";
 var HoverCard = HoverCardPrimitive.Root;
 var HoverCardTrigger = HoverCardPrimitive.Trigger;
 function HoverCardContent({
@@ -5004,7 +5016,7 @@ function HoverCardContent({
   sideOffset = 4,
   ...props
 }) {
-  const { colors } = useTheme24();
+  const { colors } = useTheme23();
   const contentStyles = StyleSheet34.flatten([
     styles30.content,
     {
@@ -5020,7 +5032,7 @@ function HoverCardContent({
   return /* @__PURE__ */ React41.createElement(HoverCardPrimitive.Portal, null, /* @__PURE__ */ React41.createElement(
     HoverCardPrimitive.Overlay,
     {
-      style: Platform14.OS !== "web" ? StyleSheet34.absoluteFill : void 0
+      style: Platform13.OS !== "web" ? StyleSheet34.absoluteFill : void 0
     },
     /* @__PURE__ */ React41.createElement(Animated4.View, { entering: FadeIn3 }, /* @__PURE__ */ React41.createElement(TextStyleProvider, { style: textStyles2 }, /* @__PURE__ */ React41.createElement(
       HoverCardPrimitive.Content,
@@ -5094,12 +5106,12 @@ var styles31 = StyleSheet35.create({
 // components/ui/menubar.tsx
 import * as MenubarPrimitive from "@rn-primitives/menubar";
 import * as React43 from "react";
-import { Platform as Platform15, Text as Text7, View as View24, StyleSheet as StyleSheet36 } from "react-native";
+import { Platform as Platform14, Text as Text7, View as View24, StyleSheet as StyleSheet36 } from "react-native";
 import { Check as Check4 } from "lucide-react-native";
 import { ChevronDown as ChevronDown5 } from "lucide-react-native";
 import { ChevronRight as ChevronRight4 } from "lucide-react-native";
 import { ChevronUp as ChevronUp3 } from "lucide-react-native";
-import { useTheme as useTheme25 } from "@react-navigation/native";
+import { useTheme as useTheme24 } from "@react-navigation/native";
 var MenubarMenu = MenubarPrimitive.Menu;
 var MenubarGroup = MenubarPrimitive.Group;
 var MenubarPortal = MenubarPrimitive.Portal;
@@ -5109,7 +5121,7 @@ function Menubar({
   style,
   ...props
 }) {
-  const { colors } = useTheme25();
+  const { colors } = useTheme24();
   const rootStyles = StyleSheet36.flatten([
     styles32.root,
     {
@@ -5124,7 +5136,7 @@ function MenubarTrigger({
   style,
   ...props
 }) {
-  const { colors } = useTheme25();
+  const { colors } = useTheme24();
   const { value } = MenubarPrimitive.useRootContext();
   const { value: itemValue } = MenubarPrimitive.useMenuContext();
   const triggerStyles = StyleSheet36.flatten([
@@ -5143,11 +5155,11 @@ function MenubarSubTrigger({
   children,
   ...props
 }) {
-  const { colors } = useTheme25();
+  const { colors } = useTheme24();
   const { open } = MenubarPrimitive.useSubContext();
-  const Icon2 = Platform15.OS === "web" ? ChevronRight4 : open ? ChevronUp3 : ChevronDown5;
+  const Icon2 = Platform14.OS === "web" ? ChevronRight4 : open ? ChevronUp3 : ChevronDown5;
   const textStyles2 = {
-    fontSize: Platform15.OS === "web" ? 14 : 18,
+    fontSize: Platform14.OS === "web" ? 14 : 18,
     color: open ? colors.primary : colors.primary
   };
   const triggerStyles = StyleSheet36.flatten([
@@ -5164,7 +5176,7 @@ function MenubarSubContent({
   style,
   ...props
 }) {
-  const { colors } = useTheme25();
+  const { colors } = useTheme24();
   const contentStyles = StyleSheet36.flatten([
     styles32.subContent,
     {
@@ -5181,7 +5193,7 @@ function MenubarContent({
   portalHost,
   ...props
 }) {
-  const { colors } = useTheme25();
+  const { colors } = useTheme24();
   const contentStyles = StyleSheet36.flatten([
     styles32.content,
     {
@@ -5198,9 +5210,9 @@ function MenubarItem({
   inset,
   ...props
 }) {
-  const { colors } = useTheme25();
+  const { colors } = useTheme24();
   const textStyles2 = {
-    fontSize: Platform15.OS === "web" ? 14 : 18,
+    fontSize: Platform14.OS === "web" ? 14 : 18,
     color: colors.text
   };
   const itemStyles = StyleSheet36.flatten([
@@ -5219,7 +5231,7 @@ function MenubarCheckboxItem({
   checked,
   ...props
 }) {
-  const { colors } = useTheme25();
+  const { colors } = useTheme24();
   const checkboxStyles = StyleSheet36.flatten([
     styles32.checkboxItem,
     {
@@ -5243,7 +5255,7 @@ function MenubarRadioItem({
   children,
   ...props
 }) {
-  const { colors } = useTheme25();
+  const { colors } = useTheme24();
   const radioStyles = StyleSheet36.flatten([
     styles32.radioItem,
     {
@@ -5258,7 +5270,7 @@ function MenubarLabel({
   inset,
   ...props
 }) {
-  const { colors } = useTheme25();
+  const { colors } = useTheme24();
   const labelStyles = StyleSheet36.flatten([
     styles32.label,
     {
@@ -5273,7 +5285,7 @@ function MenubarSeparator({
   style,
   ...props
 }) {
-  const { colors } = useTheme25();
+  const { colors } = useTheme24();
   const separatorStyles = StyleSheet36.flatten([
     styles32.separator,
     {
@@ -5284,7 +5296,7 @@ function MenubarSeparator({
   return /* @__PURE__ */ React43.createElement(MenubarPrimitive.Separator, { style: separatorStyles, ...props });
 }
 function MenubarShortcut({ style, ...props }) {
-  const { colors } = useTheme25();
+  const { colors } = useTheme24();
   const shortcutStyles = StyleSheet36.flatten([
     styles32.shortcut,
     {
@@ -5297,7 +5309,7 @@ function MenubarShortcut({ style, ...props }) {
 var styles32 = StyleSheet36.create({
   root: {
     flexDirection: "row",
-    height: Platform15.OS === "web" ? 40 : 48,
+    height: Platform14.OS === "web" ? 40 : 48,
     alignItems: "center",
     gap: 4,
     borderRadius: 6,
@@ -5310,7 +5322,7 @@ var styles32 = StyleSheet36.create({
     borderRadius: 6,
     paddingHorizontal: 12,
     paddingVertical: 6,
-    fontSize: Platform15.OS === "web" ? 14 : 16,
+    fontSize: Platform14.OS === "web" ? 14 : 16,
     fontWeight: "500"
   },
   subTrigger: {
@@ -5394,7 +5406,7 @@ var styles32 = StyleSheet36.create({
   label: {
     paddingHorizontal: 8,
     paddingVertical: 6,
-    fontSize: Platform15.OS === "web" ? 14 : 16,
+    fontSize: Platform14.OS === "web" ? 14 : 16,
     fontWeight: "600"
   },
   separator: {
@@ -5404,7 +5416,7 @@ var styles32 = StyleSheet36.create({
   },
   shortcut: {
     marginLeft: "auto",
-    fontSize: Platform15.OS === "web" ? 12 : 14,
+    fontSize: Platform14.OS === "web" ? 12 : 14,
     letterSpacing: 1
   },
   icon: {
@@ -5415,9 +5427,9 @@ var styles32 = StyleSheet36.create({
 // components/ui/navigation-menu.tsx
 import * as NavigationMenuPrimitive from "@rn-primitives/navigation-menu";
 import * as React44 from "react";
-import { Platform as Platform16, View as View25, StyleSheet as StyleSheet37, Pressable as Pressable5 } from "react-native";
+import { Platform as Platform15, View as View25, StyleSheet as StyleSheet37, Pressable as Pressable5 } from "react-native";
 import { ChevronDown as ChevronDown6 } from "lucide-react-native";
-import { useTheme as useTheme26 } from "@react-navigation/native";
+import { useTheme as useTheme25 } from "@react-navigation/native";
 function NavigationMenu({
   style,
   children,
@@ -5430,7 +5442,7 @@ function NavigationMenu({
       ...props
     },
     children,
-    Platform16.OS === "web" && /* @__PURE__ */ React44.createElement(NavigationMenuViewport, null)
+    Platform15.OS === "web" && /* @__PURE__ */ React44.createElement(NavigationMenuViewport, null)
   );
 }
 function NavigationMenuList({
@@ -5451,7 +5463,7 @@ function NavigationMenuTrigger({
   children,
   ...props
 }) {
-  const { colors } = useTheme26();
+  const { colors } = useTheme25();
   const { value } = NavigationMenuPrimitive.useRootContext();
   const { value: itemValue } = NavigationMenuPrimitive.useItemContext();
   const isActive = value === itemValue;
@@ -5475,7 +5487,7 @@ function NavigationMenuContent({
   portalHost,
   ...props
 }) {
-  const { colors } = useTheme26();
+  const { colors } = useTheme25();
   return /* @__PURE__ */ React44.createElement(NavigationMenuPrimitive.Portal, { hostName: portalHost }, /* @__PURE__ */ React44.createElement(
     NavigationMenuPrimitive.Content,
     {
@@ -5497,7 +5509,7 @@ function NavigationMenuViewport({
   style,
   ...props
 }) {
-  const { colors } = useTheme26();
+  const { colors } = useTheme25();
   return /* @__PURE__ */ React44.createElement(View25, { style: styles33.viewportContainer }, /* @__PURE__ */ React44.createElement(
     View25,
     {
@@ -5519,7 +5531,7 @@ function NavigationMenuIndicator({
   style,
   ...props
 }) {
-  const { colors } = useTheme26();
+  const { colors } = useTheme25();
   return /* @__PURE__ */ React44.createElement(
     NavigationMenuPrimitive.Indicator,
     {
@@ -5553,14 +5565,14 @@ var styles33 = StyleSheet37.create({
     alignItems: "center",
     justifyContent: "center",
     gap: 4,
-    ...Platform16.OS === "web" && {
+    ...Platform15.OS === "web" && {
       listStyle: "none"
     }
   },
   trigger: {
     flexDirection: "row",
-    height: Platform16.OS === "web" ? 40 : 48,
-    paddingHorizontal: Platform16.OS === "web" ? 16 : 12,
+    height: Platform15.OS === "web" ? 40 : 48,
+    paddingHorizontal: Platform15.OS === "web" ? 16 : 12,
     paddingVertical: 8,
     alignItems: "center",
     justifyContent: "center",
@@ -5573,7 +5585,7 @@ var styles33 = StyleSheet37.create({
   },
   content: {
     width: "100%",
-    ...Platform16.OS !== "web" && {
+    ...Platform15.OS !== "web" && {
       borderWidth: 1,
       borderRadius: 8,
       shadowColor: "#000",
@@ -5585,7 +5597,7 @@ var styles33 = StyleSheet37.create({
     }
   },
   viewportContainer: {
-    ...Platform16.OS === "web" && {
+    ...Platform15.OS === "web" && {
       position: "fixed",
       right: 0,
       top: 48,
@@ -5596,7 +5608,7 @@ var styles33 = StyleSheet37.create({
     }
   },
   viewport: {
-    ...Platform16.OS === "web" && {
+    ...Platform15.OS === "web" && {
       position: "relative",
       marginTop: 6,
       width: "100%",
@@ -5638,9 +5650,9 @@ var styles33 = StyleSheet37.create({
 // components/ui/popover.tsx
 import React45 from "react";
 import * as PopoverPrimitive from "@rn-primitives/popover";
-import { Platform as Platform17, StyleSheet as StyleSheet38 } from "react-native";
+import { Platform as Platform16, StyleSheet as StyleSheet38 } from "react-native";
 import Animated5, { FadeIn as FadeIn4, FadeOut as FadeOut2 } from "react-native-reanimated";
-import { useTheme as useTheme27 } from "@react-navigation/native";
+import { useTheme as useTheme26 } from "@react-navigation/native";
 var Popover = PopoverPrimitive.Root;
 var PopoverTrigger = PopoverPrimitive.Trigger;
 function PopoverContent({
@@ -5650,7 +5662,7 @@ function PopoverContent({
   portalHost,
   ...props
 }) {
-  const { colors } = useTheme27();
+  const { colors } = useTheme26();
   const contentStyles = StyleSheet38.flatten([
     styles34.content,
     {
@@ -5666,7 +5678,7 @@ function PopoverContent({
   return /* @__PURE__ */ React45.createElement(PopoverPrimitive.Portal, { hostName: portalHost }, /* @__PURE__ */ React45.createElement(
     PopoverPrimitive.Overlay,
     {
-      style: Platform17.OS !== "web" ? StyleSheet38.absoluteFill : void 0
+      style: Platform16.OS !== "web" ? StyleSheet38.absoluteFill : void 0
     },
     /* @__PURE__ */ React45.createElement(Animated5.View, { entering: FadeIn4.duration(200), exiting: FadeOut2 }, /* @__PURE__ */ React45.createElement(TextStyleProvider, { style: textStyles2 }, /* @__PURE__ */ React45.createElement(
       PopoverPrimitive.Content,
@@ -5696,7 +5708,7 @@ var styles34 = StyleSheet38.create({
 // components/ui/progress.tsx
 import * as ProgressPrimitive from "@rn-primitives/progress";
 import * as React46 from "react";
-import { Platform as Platform18, View as View26, StyleSheet as StyleSheet39 } from "react-native";
+import { Platform as Platform17, View as View26, StyleSheet as StyleSheet39 } from "react-native";
 import Animated6, {
   Extrapolation as Extrapolation2,
   interpolate as interpolate2,
@@ -5704,14 +5716,14 @@ import Animated6, {
   useDerivedValue as useDerivedValue3,
   withSpring
 } from "react-native-reanimated";
-import { useTheme as useTheme28 } from "@react-navigation/native";
+import { useTheme as useTheme27 } from "@react-navigation/native";
 function Progress({
   style,
   value,
   indicatorStyle,
   ...props
 }) {
-  const { colors } = useTheme28();
+  const { colors } = useTheme27();
   const progressStyles = StyleSheet39.flatten([
     styles35.progress,
     { backgroundColor: colors.border },
@@ -5723,7 +5735,7 @@ function Indicator4({
   value,
   style
 }) {
-  const { colors } = useTheme28();
+  const { colors } = useTheme27();
   const progress = useDerivedValue3(() => value ?? 0);
   const indicator = useAnimatedStyle3(() => {
     return {
@@ -5733,7 +5745,7 @@ function Indicator4({
       )
     };
   });
-  if (Platform18.OS === "web") {
+  if (Platform17.OS === "web") {
     return /* @__PURE__ */ React46.createElement(
       View26,
       {
@@ -5783,7 +5795,7 @@ var styles35 = StyleSheet39.create({
 import React47 from "react";
 import * as RadioGroupPrimitive from "@rn-primitives/radio-group";
 import { View as View27, StyleSheet as StyleSheet40 } from "react-native";
-import { useTheme as useTheme29 } from "@react-navigation/native";
+import { useTheme as useTheme28 } from "@react-navigation/native";
 function RadioGroup4({
   style,
   ...props
@@ -5800,7 +5812,7 @@ function RadioGroupItem({
   style,
   ...props
 }) {
-  const { colors } = useTheme29();
+  const { colors } = useTheme28();
   const itemStyles = StyleSheet40.flatten([
     styles36.item,
     {
@@ -5859,7 +5871,7 @@ var styles36 = StyleSheet40.create({
 // components/ui/select.tsx
 import * as SelectPrimitive from "@rn-primitives/select";
 import * as React48 from "react";
-import { Platform as Platform19, StyleSheet as StyleSheet41, View as View28 } from "react-native";
+import { Platform as Platform18, StyleSheet as StyleSheet41, View as View28 } from "react-native";
 import Animated7, { FadeIn as FadeIn5, FadeOut as FadeOut3 } from "react-native-reanimated";
 import { Check as Check5 } from "lucide-react-native";
 import { ChevronDown as ChevronDown7 } from "lucide-react-native";
@@ -5884,7 +5896,7 @@ function SelectScrollUpButton({
   style,
   ...props
 }) {
-  if (Platform19.OS !== "web") {
+  if (Platform18.OS !== "web") {
     return null;
   }
   return /* @__PURE__ */ React48.createElement(
@@ -5900,7 +5912,7 @@ function SelectScrollDownButton({
   style,
   ...props
 }) {
-  if (Platform19.OS !== "web") {
+  if (Platform18.OS !== "web") {
     return null;
   }
   return /* @__PURE__ */ React48.createElement(
@@ -5923,7 +5935,7 @@ function SelectContent({
   return /* @__PURE__ */ React48.createElement(SelectPrimitive.Portal, { hostName: portalHost }, /* @__PURE__ */ React48.createElement(
     SelectPrimitive.Overlay,
     {
-      style: Platform19.OS !== "web" ? StyleSheet41.absoluteFill : void 0
+      style: Platform18.OS !== "web" ? StyleSheet41.absoluteFill : void 0
     },
     /* @__PURE__ */ React48.createElement(
       Animated7.View,
@@ -6101,13 +6113,13 @@ import Animated8, {
   withTiming as withTiming3
 } from "react-native-reanimated";
 import { StyleSheet as StyleSheet42 } from "react-native";
-import { useTheme as useTheme30 } from "@react-navigation/native";
+import { useTheme as useTheme29 } from "@react-navigation/native";
 var duration = 1e3;
 function Skeleton({
   style,
   ...props
 }) {
-  const { colors } = useTheme30();
+  const { colors } = useTheme29();
   const sv = useSharedValue(1);
   React49.useEffect(() => {
     sv.value = withRepeat(
@@ -6393,7 +6405,7 @@ var styles41 = StyleSheet45.create({
 // components/ui/toggle-group.tsx
 import * as React53 from "react";
 import { StyleSheet as StyleSheet46 } from "react-native";
-import { useTheme as useTheme31 } from "@react-navigation/native";
+import { useTheme as useTheme30 } from "@react-navigation/native";
 import * as ToggleGroupPrimitive from "@rn-primitives/toggle-group";
 var ToggleGroupContext = React53.createContext(null);
 function ToggleGroup({
@@ -6428,7 +6440,7 @@ function ToggleGroupItem({
   size,
   ...props
 }) {
-  const { colors } = useTheme31();
+  const { colors } = useTheme30();
   const context = useToggleGroupContext();
   const { value } = ToggleGroupPrimitive.useRootContext();
   const isSelected = ToggleGroupPrimitive.utils.getIsSelected(
@@ -6475,7 +6487,7 @@ function ToggleGroupIcon({
   icon: Icon2,
   ...props
 }) {
-  const { colors } = useTheme31();
+  const { colors } = useTheme30();
   return /* @__PURE__ */ React53.createElement(Icon2, { color: colors.text, ...props });
 }
 var styles42 = StyleSheet46.create({
@@ -6515,7 +6527,7 @@ var styles42 = StyleSheet46.create({
 import * as TogglePrimitive from "@rn-primitives/toggle";
 import * as React54 from "react";
 import { StyleSheet as StyleSheet47 } from "react-native";
-import { useTheme as useTheme32 } from "@react-navigation/native";
+import { useTheme as useTheme31 } from "@react-navigation/native";
 var toggleVariants = {
   default: {
     backgroundColor: "transparent"
@@ -6535,7 +6547,7 @@ function Toggle({
   size = "default",
   ...props
 }) {
-  const { colors } = useTheme32();
+  const { colors } = useTheme31();
   const textStyles2 = {
     fontSize: size === "sm" ? 14 : size === "lg" ? 16 : 14,
     fontWeight: "500",
@@ -6576,7 +6588,7 @@ function ToggleIcon({
   icon: Icon2,
   ...props
 }) {
-  const { colors } = useTheme32();
+  const { colors } = useTheme31();
   return /* @__PURE__ */ React54.createElement(Icon2, { color: colors.text, ...props });
 }
 var styles43 = StyleSheet47.create({
@@ -6609,9 +6621,9 @@ var styles43 = StyleSheet47.create({
 // components/ui/tooltip.tsx
 import * as TooltipPrimitive from "@rn-primitives/tooltip";
 import * as React55 from "react";
-import { Platform as Platform20, StyleSheet as StyleSheet48 } from "react-native";
+import { Platform as Platform19, StyleSheet as StyleSheet48 } from "react-native";
 import Animated9, { FadeIn as FadeIn6, FadeOut as FadeOut4 } from "react-native-reanimated";
-import { useTheme as useTheme33 } from "@react-navigation/native";
+import { useTheme as useTheme32 } from "@react-navigation/native";
 var Tooltip = TooltipPrimitive.Root;
 var TooltipTrigger = TooltipPrimitive.Trigger;
 function TooltipContent({
@@ -6620,7 +6632,7 @@ function TooltipContent({
   portalHost,
   ...props
 }) {
-  const { colors } = useTheme33();
+  const { colors } = useTheme32();
   const tooltipStyles = StyleSheet48.flatten([
     styles44.content,
     {
@@ -6631,19 +6643,19 @@ function TooltipContent({
     style
   ]);
   const textStyles2 = {
-    fontSize: Platform20.OS === "web" ? 14 : 16,
+    fontSize: Platform19.OS === "web" ? 14 : 16,
     color: colors.text
   };
   return /* @__PURE__ */ React55.createElement(TooltipPrimitive.Portal, { hostName: portalHost }, /* @__PURE__ */ React55.createElement(
     TooltipPrimitive.Overlay,
     {
-      style: Platform20.OS !== "web" ? StyleSheet48.absoluteFill : void 0
+      style: Platform19.OS !== "web" ? StyleSheet48.absoluteFill : void 0
     },
     /* @__PURE__ */ React55.createElement(
       Animated9.View,
       {
-        entering: Platform20.select({ web: void 0, default: FadeIn6 }),
-        exiting: Platform20.select({ web: void 0, default: FadeOut4 })
+        entering: Platform19.select({ web: void 0, default: FadeIn6 }),
+        exiting: Platform19.select({ web: void 0, default: FadeOut4 })
       },
       /* @__PURE__ */ React55.createElement(TextStyleProvider, { style: textStyles2 }, /* @__PURE__ */ React55.createElement(
         TooltipPrimitive.Content,
@@ -6674,7 +6686,7 @@ var styles44 = StyleSheet48.create({
 // components/ui/typography.tsx
 import * as Slot3 from "@rn-primitives/slot";
 import * as React56 from "react";
-import { Platform as Platform21, Text as RNText2, StyleSheet as StyleSheet49 } from "react-native";
+import { Platform as Platform20, Text as RNText2, StyleSheet as StyleSheet49 } from "react-native";
 function H1({ style, asChild = false, ...props }) {
   const Component = asChild ? Slot3.Text : RNText2;
   return /* @__PURE__ */ React56.createElement(
@@ -6732,7 +6744,7 @@ function BlockQuote({ style, asChild = false, ...props }) {
   return /* @__PURE__ */ React56.createElement(
     Component,
     {
-      role: Platform21.OS === "web" ? "blockquote" : void 0,
+      role: Platform20.OS === "web" ? "blockquote" : void 0,
       style: StyleSheet49.flatten([styles45.blockquote, style]),
       ...props
     }
@@ -6743,7 +6755,7 @@ function Code({ style, asChild = false, ...props }) {
   return /* @__PURE__ */ React56.createElement(
     Component,
     {
-      role: Platform21.OS === "web" ? "code" : void 0,
+      role: Platform20.OS === "web" ? "code" : void 0,
       style: StyleSheet49.flatten([styles45.code, style]),
       ...props
     }
@@ -6858,11 +6870,11 @@ var ContainerResourceCreator = {
 };
 
 // resourceCreators/RdfResourceCreator.ts
-import { Code as Code2 } from "lucide-react-native";
+import { FileCode } from "lucide-react-native";
 var RdfResourceCreator = {
   name: "createRdf",
   displayName: "RDF Turtle",
-  displayIcon: Code2,
+  displayIcon: FileCode,
   canCreate: (container) => container.type === "SolidContainer",
   create: async ({ container, createUtils }) => {
     createUtils.loadingMessage("Asking for file name\u2026");
@@ -6880,6 +6892,7 @@ var RdfResourceCreator = {
 
 // resourceCreators/FileUploadResourceCreator.ts
 import { FileUp } from "lucide-react-native";
+import { Platform as Platform21 } from "react-native";
 function basename(path) {
   const lastSlash = path.lastIndexOf("/");
   return lastSlash === -1 ? path : path.slice(lastSlash + 1);
@@ -6900,9 +6913,11 @@ var FileUploadResourceCreator = {
     const slug = basename(file.name);
     const mimeType = file.type || "application/octet-stream";
     createUtils.loadingMessage(`Uploading ${slug}\u2026`);
+    const body = Platform21.OS !== "web" ? await file.arrayBuffer() : file;
     const result = await container.uploadChildAndOverwrite(
       slug,
-      file,
+      // @ts-ignore
+      body,
       mimeType
     );
     if (result.isError) {
@@ -6916,34 +6931,27 @@ var FileUploadResourceCreator = {
 // resourceViews/Container/ContainerResourceView.tsx
 import { Folders } from "lucide-react-native";
 
+// resourceViews/Container/DefaultContainerView.tsx
+import React62 from "react";
+
 // resourceViews/Container/ContainerView.tsx
 import React57, {
   useCallback as useCallback10,
   useMemo as useMemo11,
   useState as useState11
 } from "react";
-import {
-  View as View29,
-  FlatList,
-  StyleSheet as StyleSheet50,
-  Pressable as Pressable6,
-  ScrollView as ScrollView3,
-  Platform as Platform22
-} from "react-native";
+import { Platform as Platform22 } from "react-native";
 import * as DocumentPicker from "expo-document-picker";
 import { CircleX as CircleX2 } from "lucide-react-native";
-import { Folder as Folder2 } from "lucide-react-native";
-import { Code as Code3 } from "lucide-react-native";
-import { File } from "lucide-react-native";
-import { Trash as Trash2 } from "lucide-react-native";
-import { Plus as Plus2 } from "lucide-react-native";
 import { Notifier } from "react-native-notifier";
-import { useTheme as useTheme34 } from "@react-navigation/native";
-import { Loader2 } from "lucide-react-native";
-var ContainerView = () => {
+var ContainerView = ({
+  Layout: Layout2,
+  SideMenu,
+  Content: Content13,
+  ResourceItem
+}) => {
   const { targetResource, navigateTo } = useViewContext();
   const { prompt } = useDialog();
-  const { colors } = useTheme34();
   const { resourceCreators = [] } = useDataBrowserConfig();
   const [isCreating, setIsCreating] = useState11(false);
   const [loadingMessages, setLoadingMessages] = useState11([]);
@@ -6987,10 +6995,7 @@ var ContainerView = () => {
       setIsCreating(true);
       setLoadingMessages([]);
       try {
-        await creator.create({
-          container: targetResource,
-          createUtils
-        });
+        await creator.create({ container: targetResource, createUtils });
       } finally {
         setIsCreating(false);
         setLoadingMessages([]);
@@ -7001,9 +7006,8 @@ var ContainerView = () => {
   const onDelete = useCallback10(
     async (item) => {
       if (targetResource?.type !== "SolidContainer") return;
-      const createResult = await item.delete();
-      if (createResult.isError)
-        Notifier.showNotification({ title: createResult.message });
+      const result = await item.delete();
+      if (result.isError) Notifier.showNotification({ title: result.message });
     },
     [targetResource?.type]
   );
@@ -7016,100 +7020,159 @@ var ContainerView = () => {
       }
     );
   }
-  return /* @__PURE__ */ React57.createElement(View29, { style: styles46.mainContainer }, /* @__PURE__ */ React57.createElement(View29, { style: styles46.leftPanel }, /* @__PURE__ */ React57.createElement(DropdownMenu, null, /* @__PURE__ */ React57.createElement(DropdownMenuTrigger, { asChild: true }, /* @__PURE__ */ React57.createElement(
+  const renderResource = (item) => {
+    const displayName = item.uri.replace(targetResource.uri, "").replace(/\/$/, "") || "/";
+    return /* @__PURE__ */ React57.createElement(
+      ResourceItem,
+      {
+        key: item.uri,
+        item,
+        displayName,
+        onNavigate: () => navigateTo(item.uri),
+        onDelete: () => onDelete(item)
+      }
+    );
+  };
+  return /* @__PURE__ */ React57.createElement(
+    Layout2,
+    {
+      sideMenu: /* @__PURE__ */ React57.createElement(
+        SideMenu,
+        {
+          creators: availableCreators,
+          isCreating,
+          loadingMessages,
+          onCreate: runCreator
+        }
+      ),
+      content: /* @__PURE__ */ React57.createElement(
+        Content13,
+        {
+          resources: targetResource.children(),
+          renderResource,
+          creatorsAvailable: availableCreators.length > 0
+        }
+      )
+    }
+  );
+};
+
+// resourceViews/Container/DefaultContainerLayout.tsx
+import React58 from "react";
+import { View as View29, StyleSheet as StyleSheet50 } from "react-native";
+import { useTheme as useTheme33 } from "@react-navigation/native";
+var DefaultContainerLayout = ({ sideMenu, content }) => {
+  const { colors } = useTheme33();
+  return /* @__PURE__ */ React58.createElement(View29, { style: [styles46.container, { backgroundColor: colors.card }] }, /* @__PURE__ */ React58.createElement(View29, { style: styles46.leftPanel }, sideMenu), /* @__PURE__ */ React58.createElement(View29, { style: [styles46.rightPanel, { backgroundColor: colors.background }] }, content));
+};
+var styles46 = StyleSheet50.create({
+  container: {
+    flex: 1,
+    flexDirection: "row",
+    paddingTop: 16
+  },
+  leftPanel: {
+    maxWidth: 220,
+    flex: 1,
+    paddingHorizontal: 16,
+    paddingBottom: 16
+  },
+  rightPanel: {
+    flex: 3,
+    borderTopLeftRadius: 12
+  }
+});
+
+// resourceViews/Container/DefaultContainerSideMenu.tsx
+import React59 from "react";
+import { View as View30, ScrollView as ScrollView3, StyleSheet as StyleSheet51 } from "react-native";
+import { Plus as Plus2, Loader2, Home, User as User2 } from "lucide-react-native";
+import { useTheme as useTheme34 } from "@react-navigation/native";
+import { useSolidAuth as useSolidAuth8, useRootContainerFor } from "@ldo/solid-react";
+var DefaultContainerSideMenu = ({ creators, isCreating, loadingMessages, onCreate }) => {
+  const { colors } = useTheme34();
+  const { session } = useSolidAuth8();
+  const storageRoot = useRootContainerFor(session.webId);
+  const { navigateTo } = useTargetResource();
+  return /* @__PURE__ */ React59.createElement(React59.Fragment, null, /* @__PURE__ */ React59.createElement(DropdownMenu, null, /* @__PURE__ */ React59.createElement(DropdownMenuTrigger, { asChild: true }, /* @__PURE__ */ React59.createElement(
     Button,
     {
       text: "Create",
       iconLeft: Plus2,
-      disabled: isCreating || availableCreators.length === 0
+      disabled: isCreating || creators.length === 0
     }
-  )), /* @__PURE__ */ React57.createElement(DropdownMenuContent, { style: styles46.createDropdownContent }, availableCreators.map((creator) => /* @__PURE__ */ React57.createElement(
-    DropdownMenuItem,
+  )), /* @__PURE__ */ React59.createElement(
+    DropdownMenuContent,
     {
-      key: creator.name,
-      onPress: () => runCreator(creator)
+      align: "start",
+      sideOffset: 4,
+      style: styles47.dropdownContent
     },
-    /* @__PURE__ */ React57.createElement(Icon, { icon: creator.displayIcon }),
-    /* @__PURE__ */ React57.createElement(Text2, null, creator.displayName)
-  )))), isCreating && /* @__PURE__ */ React57.createElement(
-    View29,
+    creators.map((creator) => /* @__PURE__ */ React59.createElement(
+      DropdownMenuItem,
+      {
+        key: creator.name,
+        onPress: () => onCreate(creator)
+      },
+      /* @__PURE__ */ React59.createElement(Icon, { icon: creator.displayIcon }),
+      /* @__PURE__ */ React59.createElement(Text2, null, creator.displayName)
+    ))
+  )), isCreating && /* @__PURE__ */ React59.createElement(
+    View30,
     {
-      style: [styles46.creatingPanel, { backgroundColor: colors.border }]
+      style: [styles47.creatingPanel, { backgroundColor: colors.border }]
     },
-    /* @__PURE__ */ React57.createElement(View29, { style: styles46.creatingHeader }, /* @__PURE__ */ React57.createElement(Loader2, { size: 16, style: styles46.spinner }), /* @__PURE__ */ React57.createElement(Text2, null, "Creating\u2026")),
-    loadingMessages.length > 0 && /* @__PURE__ */ React57.createElement(
+    /* @__PURE__ */ React59.createElement(View30, { style: styles47.creatingHeader }, /* @__PURE__ */ React59.createElement(Loader2, { size: 16, style: styles47.spinner }), /* @__PURE__ */ React59.createElement(Text2, null, "Creating\u2026")),
+    loadingMessages.length > 0 && /* @__PURE__ */ React59.createElement(
       ScrollView3,
       {
-        style: styles46.loadingMessages,
-        contentContainerStyle: styles46.loadingMessagesContent
+        style: styles47.loadingMessages,
+        contentContainerStyle: styles47.loadingMessagesContent
       },
-      loadingMessages.map((msg, i) => /* @__PURE__ */ React57.createElement(Text2, { key: i, style: styles46.loadingMessageItem }, msg))
+      loadingMessages.map((msg, i) => /* @__PURE__ */ React59.createElement(Text2, { key: i, style: styles47.loadingMessageItem }, msg))
     )
-  )), /* @__PURE__ */ React57.createElement(
-    View29,
+  ), session.isActive && /* @__PURE__ */ React59.createElement(React59.Fragment, null, /* @__PURE__ */ React59.createElement(
+    View30,
     {
-      style: [
-        styles46.rightPanel,
-        { borderLeftWidth: 1, borderLeftColor: colors.border }
-      ]
-    },
-    /* @__PURE__ */ React57.createElement(
-      FlatList,
-      {
-        data: targetResource.children(),
-        keyExtractor: (item) => item.uri,
-        ItemSeparatorComponent: () => /* @__PURE__ */ React57.createElement(
-          View29,
-          {
-            style: [styles46.listSeparator, { backgroundColor: colors.border }]
-          }
-        ),
-        renderItem: ({ item }) => {
-          const TypeIcon = item.type === "SolidContainer" ? Folder2 : item.uri.endsWith(".ttl") ? Code3 : File;
-          const displayName = item.uri.replace(targetResource.uri, "").replace(/\/$/, "") || "/";
-          return /* @__PURE__ */ React57.createElement(
-            Pressable6,
-            {
-              onPress: () => navigateTo(item.uri),
-              style: ({ hovered }) => [
-                styles46.listItemRow,
-                hovered && { backgroundColor: colors.border }
-              ]
-            },
-            /* @__PURE__ */ React57.createElement(View29, { style: styles46.listItem }, /* @__PURE__ */ React57.createElement(View29, { style: styles46.listItemText }, /* @__PURE__ */ React57.createElement(Icon, { icon: TypeIcon, size: 18 }), /* @__PURE__ */ React57.createElement(
-              Text2,
-              {
-                style: styles46.listItemLabel,
-                numberOfLines: 1,
-                ellipsizeMode: "middle"
-              },
-              displayName
-            )), /* @__PURE__ */ React57.createElement(
-              Button,
-              {
-                variant: "ghost",
-                size: "icon",
-                style: styles46.deleteButton,
-                onPress: () => onDelete(item),
-                iconLeft: Trash2
-              }
-            ))
-          );
-        }
-      }
-    )
-  ));
+      style: [styles47.separator, { backgroundColor: colors.border }]
+    }
+  ), /* @__PURE__ */ React59.createElement(View30, { style: styles47.navSection }, storageRoot && /* @__PURE__ */ React59.createElement(
+    Button,
+    {
+      variant: "ghost",
+      iconLeft: Home,
+      text: "Home",
+      style: styles47.navItem,
+      onPress: () => navigateTo(storageRoot.uri)
+    }
+  ), /* @__PURE__ */ React59.createElement(
+    Button,
+    {
+      variant: "ghost",
+      iconLeft: User2,
+      text: "Profile",
+      style: styles47.navItem,
+      onPress: () => navigateTo(session.webId ?? "")
+    }
+  ))));
 };
-var styles46 = StyleSheet50.create({
-  mainContainer: {
-    flex: 1,
-    flexDirection: "row"
+var styles47 = StyleSheet51.create({
+  navSection: {
+    gap: 2,
+    marginBottom: 4
   },
-  leftPanel: {
-    maxWidth: 220,
-    flex: 1,
-    padding: 16,
-    paddingRight: 12
+  navItem: {
+    justifyContent: "flex-start",
+    paddingHorizontal: 8
+  },
+  separator: {
+    height: 1,
+    marginBottom: 12
+  },
+  dropdownContent: {
+    minWidth: 220,
+    paddingVertical: 6,
+    paddingHorizontal: 6
   },
   creatingPanel: {
     marginTop: 12,
@@ -7134,69 +7197,180 @@ var styles46 = StyleSheet50.create({
   loadingMessageItem: {
     fontSize: 12,
     opacity: 0.85
+  }
+});
+
+// resourceViews/Container/DefaultContainerContent.tsx
+import React60 from "react";
+import { View as View31, FlatList, StyleSheet as StyleSheet52 } from "react-native";
+import { FolderOpen } from "lucide-react-native";
+import { useTheme as useTheme35 } from "@react-navigation/native";
+var DefaultContainerContent = ({ resources, renderResource, creatorsAvailable }) => {
+  const { colors } = useTheme35();
+  const emptyState = /* @__PURE__ */ React60.createElement(View31, { style: styles48.emptyState }, /* @__PURE__ */ React60.createElement(View31, { style: styles48.emptyStateIcon }, /* @__PURE__ */ React60.createElement(FolderOpen, { size: 40, color: colors.text })), /* @__PURE__ */ React60.createElement(Text2, { muted: true }, "This container is empty"), creatorsAvailable && /* @__PURE__ */ React60.createElement(Text2, { muted: true, size: "sm" }, "Use Create to add resources"));
+  return /* @__PURE__ */ React60.createElement(
+    FlatList,
+    {
+      data: resources,
+      keyExtractor: (item) => item.uri,
+      style: styles48.list,
+      contentContainerStyle: styles48.listContent,
+      ListEmptyComponent: /* @__PURE__ */ React60.createElement(React60.Fragment, null, emptyState),
+      ItemSeparatorComponent: () => /* @__PURE__ */ React60.createElement(View31, { style: [styles48.separator, { backgroundColor: colors.border }] }),
+      renderItem: ({ item }) => renderResource(item)
+    }
+  );
+};
+var styles48 = StyleSheet52.create({
+  list: {
+    flex: 1
   },
-  rightPanel: {
-    flex: 3
+  listContent: {
+    flexGrow: 1,
+    paddingHorizontal: 16,
+    paddingVertical: 8
   },
-  createDropdownContent: {
-    minWidth: 220,
-    paddingVertical: 6,
-    paddingHorizontal: 6
+  emptyState: {
+    flex: 1,
+    alignItems: "center",
+    justifyContent: "center",
+    gap: 4,
+    paddingVertical: 48
+  },
+  emptyStateIcon: {
+    opacity: 0.2,
+    marginBottom: 8
   },
-  listSeparator: {
+  separator: {
     height: 1,
     width: "100%"
-  },
-  listItemRow: {
+  }
+});
+
+// resourceViews/Container/DefaultContainerResourceItem.tsx
+import React61, { useCallback as useCallback11 } from "react";
+import { View as View32, Pressable as Pressable6, StyleSheet as StyleSheet53, Platform as Platform23 } from "react-native";
+import {
+  Folder as Folder2,
+  Code as Code2,
+  File,
+  MoreHorizontal,
+  Download,
+  Share2,
+  Trash as Trash2
+} from "lucide-react-native";
+import { useTheme as useTheme36 } from "@react-navigation/native";
+import { useSolidAuth as useSolidAuth9 } from "@ldo/solid-react";
+import { Notifier as Notifier2 } from "react-native-notifier";
+var DefaultContainerResourceItem = ({ item, displayName, onNavigate, onDelete }) => {
+  const { colors } = useTheme36();
+  const { fetch: fetch2 } = useSolidAuth9();
+  const { openSharingModal } = useSharingModal();
+  const TypeIcon = item.type === "SolidContainer" ? Folder2 : item.uri.endsWith(".ttl") ? Code2 : File;
+  const handleDownload = useCallback11(async () => {
+    if (item.type !== "SolidLeaf") return;
+    if (Platform23.OS !== "web") {
+      Notifier2.showNotification({ title: "Download is only available on web" });
+      return;
+    }
+    const response = await fetch2(item.uri);
+    const blob = await response.blob();
+    const url = URL.createObjectURL(blob);
+    const a = document.createElement("a");
+    a.href = url;
+    a.download = displayName;
+    document.body.appendChild(a);
+    a.click();
+    document.body.removeChild(a);
+    URL.revokeObjectURL(url);
+  }, [item, displayName, fetch2]);
+  const handleShare = useCallback11(() => {
+    if (item.type === "SolidLeaf" || item.type === "SolidContainer") {
+      openSharingModal(item);
+    }
+  }, [item, openSharingModal]);
+  return /* @__PURE__ */ React61.createElement(
+    Pressable6,
+    {
+      onPress: onNavigate,
+      style: ({ hovered }) => [
+        styles49.row,
+        hovered && { backgroundColor: colors.border }
+      ]
+    },
+    /* @__PURE__ */ React61.createElement(View32, { style: styles49.inner }, /* @__PURE__ */ React61.createElement(View32, { style: styles49.label }, /* @__PURE__ */ React61.createElement(Icon, { icon: TypeIcon, size: 18 }), /* @__PURE__ */ React61.createElement(Text2, { style: styles49.name, numberOfLines: 1, ellipsizeMode: "middle" }, displayName)), /* @__PURE__ */ React61.createElement(DropdownMenu, null, /* @__PURE__ */ React61.createElement(DropdownMenuTrigger, { asChild: true }, /* @__PURE__ */ React61.createElement(
+      Button,
+      {
+        variant: "ghost",
+        size: "icon",
+        style: styles49.actionButton,
+        iconLeft: MoreHorizontal
+      }
+    )), /* @__PURE__ */ React61.createElement(DropdownMenuContent, { align: "end", sideOffset: 4 }, item.type === "SolidLeaf" && /* @__PURE__ */ React61.createElement(DropdownMenuItem, { onPress: handleDownload }, /* @__PURE__ */ React61.createElement(Icon, { icon: Download }), /* @__PURE__ */ React61.createElement(Text2, null, "Download")), /* @__PURE__ */ React61.createElement(DropdownMenuItem, { onPress: handleShare }, /* @__PURE__ */ React61.createElement(Icon, { icon: Share2 }), /* @__PURE__ */ React61.createElement(Text2, null, "Share")), /* @__PURE__ */ React61.createElement(DropdownMenuSeparator, null), /* @__PURE__ */ React61.createElement(DropdownMenuItem, { onPress: onDelete }, /* @__PURE__ */ React61.createElement(Icon, { icon: Trash2 }), /* @__PURE__ */ React61.createElement(Text2, { style: { color: colors.notification } }, "Delete")))))
+  );
+};
+var styles49 = StyleSheet53.create({
+  row: {
     minHeight: 48,
     justifyContent: "center"
   },
-  listItem: {
+  inner: {
     flexDirection: "row",
     paddingHorizontal: 16,
     paddingVertical: 12,
     justifyContent: "space-between",
     alignItems: "center"
   },
-  listItemText: {
+  label: {
     flexDirection: "row",
     alignItems: "center",
     gap: 12,
     flex: 1,
     minWidth: 0
   },
-  listItemLabel: {
+  name: {
     flex: 1
   },
-  deleteButton: {
+  actionButton: {
     width: 36,
     height: 36,
     padding: 0
   }
 });
 
+// resourceViews/Container/DefaultContainerView.tsx
+var DefaultContainerView = () => /* @__PURE__ */ React62.createElement(
+  ContainerView,
+  {
+    Layout: DefaultContainerLayout,
+    SideMenu: DefaultContainerSideMenu,
+    Content: DefaultContainerContent,
+    ResourceItem: DefaultContainerResourceItem
+  }
+);
+
 // resourceViews/Container/ContainerResourceView.tsx
 var ContainerResourceView = {
   name: "container",
   displayName: "Container",
   displayIcon: Folders,
-  view: ContainerView,
+  view: DefaultContainerView,
   canDisplay: (targetUri, targetResource) => {
     return targetResource.type === "SolidContainer";
   }
 };
 
 // resourceViews/Profile/ProfileResourceView.tsx
-import { User as User2 } from "lucide-react-native";
+import { User as User3 } from "lucide-react-native";
 
 // resourceViews/Profile/ProfileView.tsx
-import { ScrollView as ScrollView4, View as View31, StyleSheet as StyleSheet52 } from "react-native";
-import React59 from "react";
+import { ScrollView as ScrollView4, View as View34, StyleSheet as StyleSheet55 } from "react-native";
+import React64 from "react";
 
 // resourceViews/Profile/ProfileKnows.tsx
-import React58, { useCallback as useCallback11, useState as useState12 } from "react";
+import React63, { useCallback as useCallback12, useState as useState12 } from "react";
 import { Plus as Plus3 } from "lucide-react-native";
-import { View as View30, StyleSheet as StyleSheet51 } from "react-native";
+import { View as View33, StyleSheet as StyleSheet54 } from "react-native";
 import { Trash as Trash3 } from "lucide-react-native";
 var ProfileKnows = ({
   resource,
@@ -7204,13 +7378,13 @@ var ProfileKnows = ({
   setProfile
 }) => {
   const [newContact, setNewContact] = useState12("");
-  const addNewContact = useCallback11(() => {
+  const addNewContact = useCallback12(() => {
     setProfile(resource, (cProfile) => {
       cProfile.knows?.add({ "@id": newContact });
     });
     setNewContact("");
   }, [newContact, resource, setProfile]);
-  return /* @__PURE__ */ React58.createElement(View30, { style: styles47.container }, /* @__PURE__ */ React58.createElement(
+  return /* @__PURE__ */ React63.createElement(View33, { style: styles50.container }, /* @__PURE__ */ React63.createElement(
     Input,
     {
       placeholder: "https://example.pod/john/profile/card#me",
@@ -7224,12 +7398,12 @@ var ProfileKnows = ({
       onChangeText: setNewContact,
       onSubmitEditing: addNewContact
     }
-  ), profile.knows?.map((friend) => /* @__PURE__ */ React58.createElement(
+  ), profile.knows?.map((friend) => /* @__PURE__ */ React63.createElement(
     AgentInformation,
     {
       key: friend["@id"],
       webId: friend["@id"],
-      accessoryRight: /* @__PURE__ */ React58.createElement(
+      accessoryRight: /* @__PURE__ */ React63.createElement(
         Button,
         {
           variant: "ghost",
@@ -7244,7 +7418,7 @@ var ProfileKnows = ({
     }
   )));
 };
-var styles47 = StyleSheet51.create({
+var styles50 = StyleSheet54.create({
   container: {
     gap: 16
     // gap-4 equivalent (4 * 4px = 16px)
@@ -7258,8 +7432,8 @@ var ProfileView = () => {
   const profileResource = useResource4(targetUri);
   const [profile, setProfile, commitProfile, transactionDataset] = useChangeSubject(SolidProfileShapeType, targetUri);
   if (!targetUri || !profileResource || !profile || profileResource.type === "InvalidIdentifierResource")
-    return /* @__PURE__ */ React59.createElement(React59.Fragment, null);
-  return /* @__PURE__ */ React59.createElement(ScrollView4, { contentContainerStyle: styles48.scrollContainer }, /* @__PURE__ */ React59.createElement(View31, { style: styles48.container }, /* @__PURE__ */ React59.createElement(Text2, { variant: "h1" }, "Profile"), /* @__PURE__ */ React59.createElement(
+    return /* @__PURE__ */ React64.createElement(React64.Fragment, null);
+  return /* @__PURE__ */ React64.createElement(ScrollView4, { contentContainerStyle: styles51.scrollContainer }, /* @__PURE__ */ React64.createElement(View34, { style: styles51.container }, /* @__PURE__ */ React64.createElement(Text2, { variant: "h1" }, "Profile"), /* @__PURE__ */ React64.createElement(
     Input,
     {
       placeholder: "John Doe",
@@ -7271,25 +7445,25 @@ var ProfileView = () => {
         });
       }
     }
-  ), /* @__PURE__ */ React59.createElement(Separator2, null), /* @__PURE__ */ React59.createElement(Text2, { variant: "h2" }, "Contacts"), /* @__PURE__ */ React59.createElement(
+  ), /* @__PURE__ */ React64.createElement(Separator2, null), /* @__PURE__ */ React64.createElement(Text2, { variant: "h2" }, "Contacts"), /* @__PURE__ */ React64.createElement(
     ProfileKnows,
     {
       profile,
       setProfile,
       resource: profileResource
     }
-  ), /* @__PURE__ */ React59.createElement(
+  ), /* @__PURE__ */ React64.createElement(
     Button,
     {
       disabled: !transactionDataset.hasChanges(),
       text: "Update Profile",
-      style: styles48.updateButton,
+      style: styles51.updateButton,
       onPress: commitProfile,
       isLoading: profileResource.isLoading()
     }
   )));
 };
-var styles48 = StyleSheet52.create({
+var styles51 = StyleSheet55.create({
   scrollContainer: {
     flexDirection: "row",
     justifyContent: "center",
@@ -7311,10 +7485,10 @@ var styles48 = StyleSheet52.create({
 var ProfileResourceView = {
   name: "profile",
   displayName: "Profile",
-  displayIcon: User2,
+  displayIcon: User3,
   view: ProfileView,
-  canDisplay: (targetUri, targetResource, dataset2) => {
-    const profile = dataset2.usingType(SolidProfileShapeType).fromSubject(targetUri);
+  canDisplay: (targetUri, targetResource, dataset) => {
+    const profile = dataset.usingType(SolidProfileShapeType).fromSubject(targetUri);
     return !!profile?.type?.some?.(
       (val) => val["@id"] === "Person" || val["@id"] === "Person2"
     );
@@ -7322,18 +7496,18 @@ var ProfileResourceView = {
 };
 
 // resourceViews/RawCode/RawCodeResourceView.tsx
-import { Code as Code4 } from "lucide-react-native";
+import { Code as Code3 } from "lucide-react-native";
 
 // resourceViews/RawCode/RawCodeView.tsx
-import { useSolidAuth as useSolidAuth8 } from "@ldo/solid-react";
-import React61, {
-  useCallback as useCallback12,
-  useEffect as useEffect8,
+import { useSolidAuth as useSolidAuth10 } from "@ldo/solid-react";
+import React66, {
+  useCallback as useCallback13,
+  useEffect as useEffect9,
   useState as useState13
 } from "react";
 
 // resourceViews/RawCode/RawCodeEditor.tsx
-import React60, { useRef as useRef3 } from "react";
+import React65, { useRef as useRef3 } from "react";
 import Editor from "@monaco-editor/react";
 var RawCodeEditor = ({
   value,
@@ -7347,7 +7521,7 @@ var RawCodeEditor = ({
   const handleEditorDidMount = (editor, monaco) => {
     monacoRef.current = monaco;
   };
-  return /* @__PURE__ */ React60.createElement(
+  return /* @__PURE__ */ React65.createElement(
     Editor,
     {
       className: "flex-1",
@@ -7362,13 +7536,13 @@ var RawCodeEditor = ({
 };
 
 // resourceViews/RawCode/RawCodeView.tsx
-import { View as View32, StyleSheet as StyleSheet53 } from "react-native";
-import { Notifier as Notifier2 } from "react-native-notifier";
+import { View as View35, StyleSheet as StyleSheet56 } from "react-native";
+import { Notifier as Notifier3 } from "react-native-notifier";
 import { Save } from "lucide-react-native";
-import { useTheme as useTheme35 } from "@react-navigation/native";
+import { useTheme as useTheme37 } from "@react-navigation/native";
 var RawCodeView = () => {
-  const { fetch: fetch2 } = useSolidAuth8();
-  const { colors } = useTheme35();
+  const { fetch: fetch2 } = useSolidAuth10();
+  const { colors } = useTheme37();
   const [content, setContent] = useState13("");
   const [contentType, setContentType] = useState13("");
   const [didEdit, setDidEdit] = useState13(false);
@@ -7376,12 +7550,12 @@ var RawCodeView = () => {
   const [isFetching, setIsFetching] = useState13(false);
   const [isSaving, setIsSaving] = useState13(false);
   const targetUri = targetResource?.uri;
-  const fetchContent = useCallback12(async () => {
+  const fetchContent = useCallback13(async () => {
     if (!targetUri || curViewConfig.name !== "rawCode") return;
     setIsFetching(true);
     const response = await fetch2(targetUri);
     if (response.status !== 200) {
-      Notifier2.showNotification({
+      Notifier3.showNotification({
         title: `Could not fetch document. Recieved ${response.status}`
       });
     }
@@ -7390,7 +7564,7 @@ var RawCodeView = () => {
     setDidEdit(false);
     setContentType(response.headers.get("content-type") ?? "");
   }, [curViewConfig.name, fetch2, targetUri]);
-  const submitChanges = useCallback12(async () => {
+  const submitChanges = useCallback13(async () => {
     if (!targetUri) return;
     setIsSaving(true);
     const response = await fetch2(targetUri, {
@@ -7401,23 +7575,23 @@ var RawCodeView = () => {
       body: content
     });
     if (response.status !== 205) {
-      Notifier2.showNotification({
+      Notifier3.showNotification({
         title: `Could save document. Recieved ${response.status}`
       });
       setIsSaving(false);
       return;
     }
-    Notifier2.showNotification({
+    Notifier3.showNotification({
       title: `Document Saved`
     });
     await fetchContent();
     setIsSaving(false);
     setDidEdit(false);
   }, [content, contentType, fetch2, fetchContent, targetUri]);
-  useEffect8(() => {
+  useEffect9(() => {
     fetchContent();
   }, [fetchContent]);
-  return /* @__PURE__ */ React61.createElement(View32, { style: [styles49.container, { backgroundColor: colors.background }] }, /* @__PURE__ */ React61.createElement(LoadingBar, { isLoading: isFetching || isSaving }), /* @__PURE__ */ React61.createElement(
+  return /* @__PURE__ */ React66.createElement(View35, { style: [styles52.container, { backgroundColor: colors.background }] }, /* @__PURE__ */ React66.createElement(LoadingBar, { isLoading: isFetching || isSaving }), /* @__PURE__ */ React66.createElement(
     RawCodeEditor,
     {
       value: content,
@@ -7426,10 +7600,10 @@ var RawCodeView = () => {
         setContent(value ?? "");
       }
     }
-  ), /* @__PURE__ */ React61.createElement(
+  ), /* @__PURE__ */ React66.createElement(
     Button,
     {
-      style: styles49.saveButton,
+      style: styles52.saveButton,
       onPress: submitChanges,
       text: "Save Changes",
       iconLeft: Save,
@@ -7438,7 +7612,7 @@ var RawCodeView = () => {
     }
   ));
 };
-var styles49 = StyleSheet53.create({
+var styles52 = StyleSheet56.create({
   container: {
     flex: 1,
     position: "relative"
@@ -7455,7 +7629,7 @@ var styles49 = StyleSheet53.create({
 var RawCodeResourceView = {
   name: "rawCode",
   displayName: "Raw Code",
-  displayIcon: Code4,
+  displayIcon: Code3,
   view: RawCodeView,
   canDisplay: () => true
 };
@@ -7464,8 +7638,8 @@ var RawCodeResourceView = {
 import { Image as ImageIcon } from "lucide-react-native";
 
 // resourceViews/Image/ImageView.tsx
-import React62, { useMemo as useMemo12, useEffect as useEffect9 } from "react";
-import { View as View33, Image as Image2, StyleSheet as StyleSheet54 } from "react-native";
+import React67, { useMemo as useMemo12, useEffect as useEffect10 } from "react";
+import { View as View36, Image as Image2, StyleSheet as StyleSheet57 } from "react-native";
 import { useResource as useResource5 } from "@ldo/solid-react";
 var ImageView = () => {
   const { targetUri } = useViewContext();
@@ -7476,39 +7650,39 @@ var ImageView = () => {
     if (!blob2 || !blob2.type.startsWith("image/")) return void 0;
     return URL.createObjectURL(blob2);
   }, [imageResource]);
-  useEffect9(() => {
+  useEffect10(() => {
     return () => {
       if (blobUrl) URL.revokeObjectURL(blobUrl);
     };
   }, [blobUrl]);
   if (!targetUri || !imageResource) return null;
   if (imageResource.isLoading?.() ?? imageResource.status?.type === "unfetched") {
-    return /* @__PURE__ */ React62.createElement(View33, { style: styles50.center }, /* @__PURE__ */ React62.createElement(LoadingBar, { isLoading: true }), /* @__PURE__ */ React62.createElement(Text2, null, "Loading image\u2026"));
+    return /* @__PURE__ */ React67.createElement(View36, { style: styles53.center }, /* @__PURE__ */ React67.createElement(LoadingBar, { isLoading: true }), /* @__PURE__ */ React67.createElement(Text2, null, "Loading image\u2026"));
   }
   if (imageResource.status?.isError) {
-    return /* @__PURE__ */ React62.createElement(View33, { style: styles50.center }, /* @__PURE__ */ React62.createElement(Text2, null, imageResource.status.message ?? "Failed to load image."));
+    return /* @__PURE__ */ React67.createElement(View36, { style: styles53.center }, /* @__PURE__ */ React67.createElement(Text2, null, imageResource.status.message ?? "Failed to load image."));
   }
   if (!imageResource.isBinary()) {
-    return /* @__PURE__ */ React62.createElement(View33, { style: styles50.center }, /* @__PURE__ */ React62.createElement(Text2, null, "This resource is not a binary image."));
+    return /* @__PURE__ */ React67.createElement(View36, { style: styles53.center }, /* @__PURE__ */ React67.createElement(Text2, null, "This resource is not a binary image."));
   }
   const blob = imageResource.getBlob();
   if (!blob || !blob.type.startsWith("image/")) {
-    return /* @__PURE__ */ React62.createElement(View33, { style: styles50.center }, /* @__PURE__ */ React62.createElement(Text2, null, "This binary resource is not an image (", blob?.type ?? "unknown type", ")."));
+    return /* @__PURE__ */ React67.createElement(View36, { style: styles53.center }, /* @__PURE__ */ React67.createElement(Text2, null, "This binary resource is not an image (", blob?.type ?? "unknown type", ")."));
   }
   if (!blobUrl) {
-    return /* @__PURE__ */ React62.createElement(View33, { style: styles50.center }, /* @__PURE__ */ React62.createElement(Text2, null, "Unable to display image."));
+    return /* @__PURE__ */ React67.createElement(View36, { style: styles53.center }, /* @__PURE__ */ React67.createElement(Text2, null, "Unable to display image."));
   }
-  return /* @__PURE__ */ React62.createElement(View33, { style: styles50.container }, /* @__PURE__ */ React62.createElement(
+  return /* @__PURE__ */ React67.createElement(View36, { style: styles53.container }, /* @__PURE__ */ React67.createElement(
     Image2,
     {
       source: { uri: blobUrl },
-      style: styles50.image,
+      style: styles53.image,
       resizeMode: "contain",
       accessibilityLabel: "Image resource"
     }
   ));
 };
-var styles50 = StyleSheet54.create({
+var styles53 = StyleSheet57.create({
   container: {
     flex: 1,
     padding: 16,
@@ -7598,6 +7772,11 @@ export {
   CopyLink,
   DataBrowser,
   DataBrowserConfigContext,
+  DefaultContainerContent,
+  DefaultContainerLayout,
+  DefaultContainerResourceItem,
+  DefaultContainerSideMenu,
+  DefaultContainerView,
   Dialog,
   DialogClose,
   DialogContent,