@lobb-js/studio 0.1.37 → 0.1.39

package/src/lib/components/routes/data_model/utils.ts

@@ -1,35 +0,0 @@
-import Dagre from '@dagrejs/dagre';
-
-export function getLayoutedElements(nodes: any[], edges: any[]) {
-    const g = new Dagre.graphlib.Graph().setDefaultEdgeLabel(() => ({}));
-    g.setGraph({ rankdir: "LR" });
-
-    edges.forEach((edge) => g.setEdge(edge.source, edge.target));
-    nodes.forEach((node) => {
-        return g.setNode(node.id, {
-            ...node,
-            width: node.measured?.width ?? 0,
-            height: node.measured?.height ?? 0,
-        });
-    });
-
-    Dagre.layout(g);
-
-    return {
-        nodes: nodes.map((node) => {
-            const position = g.node(node.id);
-            // We are shifting the dagre node position (anchor=center center) to the top left
-            // so it matches the Svelte Flow node anchor point (top left).
-            const x = position.x - (node.measured?.width ?? 0) / 2;
-            const y = position.y - (node.measured?.height ?? 0) / 2;
-
-            return {
-                ...node,
-                position: { x, y },
-                targetPosition: "left",
-                sourcePosition: "right",
-            };
-        }),
-        edges,
-    };
-}

package/src/lib/components/ui/alert-dialog/index.ts

@@ -1,40 +0,0 @@
-import { AlertDialog as AlertDialogPrimitive } from "bits-ui";
-
-import Title from "./alert-dialog-title.svelte";
-import Action from "./alert-dialog-action.svelte";
-import Cancel from "./alert-dialog-cancel.svelte";
-import Footer from "./alert-dialog-footer.svelte";
-import Header from "./alert-dialog-header.svelte";
-import Overlay from "./alert-dialog-overlay.svelte";
-import Content from "./alert-dialog-content.svelte";
-import Description from "./alert-dialog-description.svelte";
-
-const Root = AlertDialogPrimitive.Root;
-const Trigger = AlertDialogPrimitive.Trigger;
-const Portal = AlertDialogPrimitive.Portal;
-
-export {
-	Root,
-	Title,
-	Action,
-	Cancel,
-	Portal,
-	Footer,
-	Header,
-	Trigger,
-	Overlay,
-	Content,
-	Description,
-	//
-	Root as AlertDialog,
-	Title as AlertDialogTitle,
-	Action as AlertDialogAction,
-	Cancel as AlertDialogCancel,
-	Portal as AlertDialogPortal,
-	Footer as AlertDialogFooter,
-	Header as AlertDialogHeader,
-	Trigger as AlertDialogTrigger,
-	Overlay as AlertDialogOverlay,
-	Content as AlertDialogContent,
-	Description as AlertDialogDescription,
-};

package/src/lib/components/ui/button/index.ts

@@ -1,17 +0,0 @@
-import Root, {
-	type ButtonProps,
-	type ButtonSize,
-	type ButtonVariant,
-	buttonVariants,
-} from "./button.svelte";
-
-export {
-	Root,
-	type ButtonProps as Props,
-	//
-	Root as Button,
-	buttonVariants,
-	type ButtonProps,
-	type ButtonSize,
-	type ButtonVariant,
-};

package/src/lib/components/ui/checkbox/index.ts

@@ -1,6 +0,0 @@
-import Root from "./checkbox.svelte";
-export {
-	Root,
-	//
-	Root as Checkbox,
-};

package/src/lib/components/ui/dialog/index.ts

@@ -1,37 +0,0 @@
-import { Dialog as DialogPrimitive } from "bits-ui";
-
-import Title from "./dialog-title.svelte";
-import Footer from "./dialog-footer.svelte";
-import Header from "./dialog-header.svelte";
-import Overlay from "./dialog-overlay.svelte";
-import Content from "./dialog-content.svelte";
-import Description from "./dialog-description.svelte";
-
-const Root: typeof DialogPrimitive.Root = DialogPrimitive.Root;
-const Trigger: typeof DialogPrimitive.Trigger = DialogPrimitive.Trigger;
-const Close: typeof DialogPrimitive.Close = DialogPrimitive.Close;
-const Portal: typeof DialogPrimitive.Portal = DialogPrimitive.Portal;
-
-export {
-	Root,
-	Title,
-	Portal,
-	Footer,
-	Header,
-	Trigger,
-	Overlay,
-	Content,
-	Description,
-	Close,
-	//
-	Root as Dialog,
-	Title as DialogTitle,
-	Portal as DialogPortal,
-	Footer as DialogFooter,
-	Header as DialogHeader,
-	Trigger as DialogTrigger,
-	Overlay as DialogOverlay,
-	Content as DialogContent,
-	Description as DialogDescription,
-	Close as DialogClose,
-};

package/src/lib/components/ui/input/index.ts

@@ -1,7 +0,0 @@
-import Root from "./input.svelte";
-
-export {
-	Root,
-	//
-	Root as Input,
-};

package/src/lib/components/ui/label/index.ts

@@ -1,7 +0,0 @@
-import Root from "./label.svelte";
-
-export {
-	Root,
-	//
-	Root as Label,
-};

package/src/lib/components/ui/popover/index.ts

@@ -1,17 +0,0 @@
-import { Popover as PopoverPrimitive } from "bits-ui";
-import Content from "./popover-content.svelte";
-const Root = PopoverPrimitive.Root;
-const Trigger = PopoverPrimitive.Trigger;
-const Close = PopoverPrimitive.Close;
-
-export {
-	Root,
-	Content,
-	Trigger,
-	Close,
-	//
-	Root as Popover,
-	Content as PopoverContent,
-	Trigger as PopoverTrigger,
-	Close as PopoverClose,
-};

package/src/lib/components/ui/select/index.ts

@@ -1,34 +0,0 @@
-import { Select as SelectPrimitive } from "bits-ui";
-
-import GroupHeading from "./select-group-heading.svelte";
-import Item from "./select-item.svelte";
-import Content from "./select-content.svelte";
-import Trigger from "./select-trigger.svelte";
-import Separator from "./select-separator.svelte";
-import ScrollDownButton from "./select-scroll-down-button.svelte";
-import ScrollUpButton from "./select-scroll-up-button.svelte";
-
-const Root = SelectPrimitive.Root;
-const Group = SelectPrimitive.Group;
-
-export {
-	Root,
-	Item,
-	Group,
-	GroupHeading,
-	Content,
-	Trigger,
-	Separator,
-	ScrollDownButton,
-	ScrollUpButton,
-	//
-	Root as Select,
-	Item as SelectItem,
-	Group as SelectGroup,
-	GroupHeading as SelectGroupHeading,
-	Content as SelectContent,
-	Trigger as SelectTrigger,
-	Separator as SelectSeparator,
-	ScrollDownButton as SelectScrollDownButton,
-	ScrollUpButton as SelectScrollUpButton,
-};

package/src/lib/components/ui/separator/index.ts

@@ -1,7 +0,0 @@
-import Root from "./separator.svelte";
-
-export {
-	Root,
-	//
-	Root as Separator,
-};

package/src/lib/components/ui/skeleton/index.ts

@@ -1,7 +0,0 @@
-import Root from "./skeleton.svelte";
-
-export {
-	Root,
-	//
-	Root as Skeleton,
-};

package/src/lib/components/ui/switch/index.ts

@@ -1,7 +0,0 @@
-import Root from "./switch.svelte";
-
-export {
-	Root,
-	//
-	Root as Switch,
-};

package/src/lib/components/ui/textarea/index.ts

@@ -1,7 +0,0 @@
-import Root from "./textarea.svelte";
-
-export {
-	Root,
-	//
-	Root as Textarea,
-};

package/src/lib/components/ui/tooltip/index.ts

@@ -1,18 +0,0 @@
-import { Tooltip as TooltipPrimitive } from "bits-ui";
-import Content from "./tooltip-content.svelte";
-
-const Root = TooltipPrimitive.Root;
-const Trigger = TooltipPrimitive.Trigger;
-const Provider = TooltipPrimitive.Provider;
-
-export {
-	Root,
-	Trigger,
-	Content,
-	Provider,
-	//
-	Root as Tooltip,
-	Content as TooltipContent,
-	Trigger as TooltipTrigger,
-	Provider as TooltipProvider,
-};

package/src/lib/eventSystem.ts

@@ -1,38 +0,0 @@
-import { toast } from "svelte-sonner";
-import { ctx } from "./store.svelte";
-import { openCreateDetailView, openUpdateDetailView } from "./components/detailView/store.svelte";
-
-export async function emitEvent(eventName: string, input: Record<string, any>) {
-    const workflows = ctx.meta.studio_workflows.filter(
-        (workflow) => {
-            return eventName.startsWith(workflow.eventName);
-        },
-    );
-
-    for (let index = 0; index < workflows.length; index++) {
-      const workflow = workflows[index];
-      try {
-        const localOutput = await workflow.handler(
-            input,
-            await getEventContext(),
-        );
-
-        if (localOutput) {
-            input = localOutput;
-        }
-      } catch (error) {
-        toast.error((error as any).message);
-        throw error;
-      }
-    }
-
-    return input;
-}
-
-async function getEventContext() {
-    return {
-        toast,
-        openCreateDetailView,
-        openUpdateDetailView,
-    };
-}

package/src/lib/extensions/extension.types.ts

@@ -1,92 +0,0 @@
-import type { Lobb } from "$lib/Lobb";
-import type { CTX } from "../lib/store.types";
-import type { Button } from "$lib/components/ui/button";
-import type { Input } from "$lib/components/ui/input";
-import type { Separator } from "$lib/components/ui/separator";
-import type { Skeleton } from "$lib/components/ui/skeleton";
-import type LlmButton from "$lib/components/LlmButton.svelte";
-import type Sidebar from "$lib/components/sidebar/sidebar.svelte";
-import type SidebarTrigger from "$lib/components/sidebar/sidebarTrigger.svelte";
-import type CreateDetailViewButton from "$lib/components/detailView/create/createDetailViewButton.svelte";
-import type UpdateDetailViewButton from "$lib/components/detailView/update/updateDetailViewButton.svelte";
-import type { mediaQueries } from "$lib/utils";
-import type Table from "$lib/components/dataTable/table.svelte";
-import type { Location } from "@wjfe/n-savant";
-import type RangeCalendarButton from "$lib/components/rangeCalendarButton.svelte";
-import type DataTable from "$lib/components/dataTable/dataTable.svelte";
-import type Drawer from "$lib/components/drawer.svelte";
-import type SelectRecord from "$lib/components/selectRecord.svelte";
-import * as Popover from "$lib/components/ui/popover";
-import * as intlDate from "@internationalized/date";
-import * as Icons from "lucide-svelte"
-import { ContextMenu } from "bits-ui";
-import * as Tooltip from "$lib/components/ui/tooltip";
-import * as Breadcrumb from "$lib/components/ui/breadcrumb";
-import { showDialog } from "$lib/components/confirmationDialog/store.svelte";
-import { toast } from "svelte-sonner";
-import type Drawer from "$lib/components/drawer.svelte";
-import { Switch } from "$lib/components/ui/switch";
-
-// extensions utils
-export interface Components {
-    Button: typeof Button;
-    Input: typeof Input;
-    Separator: typeof Separator;
-    Skeleton: typeof Skeleton;
-    LlmButton: typeof LlmButton;
-    Sidebar: typeof Sidebar;
-    SidebarTrigger: typeof SidebarTrigger;
-    CreateDetailViewButton: typeof CreateDetailViewButton;
-    UpdateDetailViewButton: typeof UpdateDetailViewButton;
-    Tooltip: typeof Tooltip;
-    Breadcrumb: typeof Breadcrumb;
-    ContextMenu: typeof ContextMenu;
-    Popover: typeof Popover;
-    Icons: typeof Icons;
-    Table: typeof Table;
-    RangeCalendarButton: typeof RangeCalendarButton;
-    DataTable: typeof DataTable;
-    Drawer: typeof Drawer;
-    SelectRecord: typeof SelectRecord,
-    Switch: typeof Switch,
-}
-
-export interface ExtensionUtils {
-    ctx: CTX;
-    lobb: Lobb;
-    location: Location;
-    toast: typeof toast;
-    showDialog: typeof showDialog;
-    components: Components;
-    mediaQueries: typeof mediaQueries;
-    intlDate: typeof intlDate;
-}
-
-// dashboard nav
-interface DashboardNav {
-    label: string;
-    icon: any;
-    href?: string;
-    onclick?: () => void;
-    navs?: DashboardNav[];
-}
-
-export interface DashboardNavs {
-    top?: DashboardNav[];
-    middle?: DashboardNav[];
-    bottom?: DashboardNav[];
-}
-
-// extension components base Props
-export interface ExtensionProps {
-    utils: ExtensionUtils;
-    [key: string]: any;
-}
-
-// extension exported object
-export interface Extension {
-    name: string;
-    onStartup?: (utils: ExtensionUtils) => Promise<void>;
-    components?: Record<string, any>;
-    dashboardNavs?: DashboardNavs;
-}

package/src/lib/extensions/extensionUtils.ts

@@ -1,191 +0,0 @@
-import type {
-  Components,
-  DashboardNavs,
-  Extension,
-  ExtensionUtils,
-} from "./extension.types";
-import { lobb } from "$lib";
-import { ctx } from "$lib/store.svelte";
-import { toast } from "svelte-sonner";
-import { showDialog } from "$lib/components/confirmationDialog/store.svelte";
-import { Button } from "$lib/components/ui/button";
-import { Input } from "$lib/components/ui/input";
-import { Separator } from "$lib/components/ui/separator";
-import { Skeleton } from "$lib/components/ui/skeleton";
-import Table from "$lib/components/dataTable/table.svelte";
-import { mediaQueries } from "$lib/utils";
-import LlmButton from "$lib/components/LlmButton.svelte";
-import Sidebar from "$lib/components/sidebar/sidebar.svelte";
-import SidebarTrigger from "$lib/components/sidebar/sidebarTrigger.svelte";
-import CreateDetailViewButton from "$lib/components/detailView/create/createDetailViewButton.svelte";
-import UpdateDetailViewButton from "$lib/components/detailView/update/updateDetailViewButton.svelte";
-import * as intlDate from "@internationalized/date";
-import * as Tooltip from "$lib/components/ui/tooltip";
-import * as Breadcrumb from "$lib/components/ui/breadcrumb";
-import { ContextMenu } from "bits-ui";
-import * as Popover from "$lib/components/ui/popover";
-import * as Icons from "lucide-svelte";
-import { location } from "@wjfe/n-savant";
-import RangeCalendarButton from "$lib/components/rangeCalendarButton.svelte";
-import DataTable from "$lib/components/dataTable/dataTable.svelte";
-import Drawer from "$lib/components/drawer.svelte";
-import SelectRecord from "$lib/components/selectRecord.svelte";
-import { Switch } from "$lib/components/ui/switch";
-
-export function getComponents(): Components {
-  return {
-    Button: Button,
-    Input: Input,
-    Separator: Separator,
-    Skeleton: Skeleton,
-    LlmButton: LlmButton,
-    Sidebar: Sidebar,
-    SidebarTrigger: SidebarTrigger,
-    CreateDetailViewButton: CreateDetailViewButton,
-    UpdateDetailViewButton: UpdateDetailViewButton,
-    Tooltip: Tooltip,
-    Breadcrumb: Breadcrumb,
-    ContextMenu: ContextMenu,
-    Popover: Popover,
-    Icons: Icons,
-    Table: Table,
-    RangeCalendarButton: RangeCalendarButton,
-    DataTable: DataTable,
-    Drawer: Drawer,
-    SelectRecord: SelectRecord,
-    Switch: Switch,
-  };
-}
-
-export function getExtensionUtils(): ExtensionUtils {
-  return {
-    ctx: ctx,
-    lobb: lobb,
-    location: location,
-    toast: toast,
-    showDialog: showDialog,
-    components: getComponents(),
-    mediaQueries: mediaQueries,
-    intlDate: intlDate,
-  };
-}
-
-export function getExtensionsThatHasDash(): string[] {
-  const extensionNames = Object.keys(ctx.meta.extensions);
-
-  const extensionsWithDashExt = [];
-  for (let index = 0; index < extensionNames.length; index++) {
-    const extensionName = extensionNames[index];
-    const extensionMeta = ctx.meta.extensions[extensionName];
-    if (extensionMeta.hasDashboardExtension) {
-      extensionsWithDashExt.push(extensionName);
-    }
-  }
-
-  return extensionsWithDashExt;
-}
-
-export async function loadExtensions(studioExtensions?: any[]): Promise<Record<string, Extension>> {
-  const extensions: Record<string, Extension> = {};
-
-
-  if (studioExtensions) {
-    for (let index = 0; index < studioExtensions.length; index++) {
-      const studioExtension = studioExtensions[index](getExtensionUtils());
-      extensions[studioExtension.name] = studioExtension;
-    }
-  }
-
-  const extensionsThatHasDash = getExtensionsThatHasDash();
-  for (let index = 0; index < extensionsThatHasDash.length; index++) {
-    const extensionName = extensionsThatHasDash[index];
-
-    // Try to import locally-installed extension by name first
-    if (extensionName && extensions[extensionName]) {
-      continue;
-    }
-
-    // Fall back to remote import
-    try {
-      extensions[extensionName] = (
-        await import(
-          /* @vite-ignore */ `${ctx.lobbUrl}/api/extensions/${extensionName}/dashboard?v=${ctx.meta.extensions[extensionName]?.version}`
-        )
-      ).extension(getExtensionUtils());
-    } catch (error) {
-      console.warn(`Failed to load remote extension ${extensionName}`, error);
-    }
-  }
-
-  return extensions;
-}
-
-export function loadExtensionComponents(
-  name: string,
-  filterByExtensions?: string[],
-): any[] {
-  const components = [];
-  for (const [extensionName, extensionValue] of Object.entries(
-    ctx.extensions,
-  )) {
-    if (filterByExtensions && !filterByExtensions.includes(extensionName)) {
-      continue;
-    }
-    if (extensionValue.components) {
-      for (const [componentName, componentValue] of Object.entries(
-        extensionValue.components,
-      )) {
-        if (name.startsWith(componentName)) {
-          components.push(componentValue);
-        }
-      }
-    }
-  }
-  return components;
-}
-
-export async function executeExtensionsOnStartup() {
-  const extensionNames: string[] = Object.keys(ctx.extensions);
-  for (let index = 0; index < extensionNames.length; index++) {
-    const extensionName = extensionNames[index];
-    const extension = ctx.extensions[extensionName];
-    if (extension) {
-      if (extension.onStartup) {
-        await extension.onStartup(getExtensionUtils());
-      }
-    }
-  }
-}
-
-export function getDashboardNavs(): DashboardNavs {
-  let navs: DashboardNavs = {
-    top: [],
-    middle: [],
-    bottom: [],
-  };
-  const extensionNames: string[] = Object.keys(ctx.extensions);
-  for (let index = 0; index < extensionNames.length; index++) {
-    const extensionName = extensionNames[index];
-    const extension = ctx.extensions[extensionName];
-    if (extension) {
-      if (extension.dashboardNavs && extension.dashboardNavs.top && navs.top) {
-        navs.top = [...navs.top, ...extension.dashboardNavs.top];
-      }
-      if (
-        extension.dashboardNavs &&
-        extension.dashboardNavs.middle &&
-        navs.middle
-      ) {
-        navs.middle = [...navs.middle, ...extension.dashboardNavs.middle];
-      }
-      if (
-        extension.dashboardNavs &&
-        extension.dashboardNavs.bottom &&
-        navs.bottom
-      ) {
-        navs.bottom = [...navs.bottom, ...extension.dashboardNavs.bottom];
-      }
-    }
-  }
-  return navs;
-}

package/src/lib/index.ts

@@ -1,36 +0,0 @@
-// Main Studio component
-export { default as Studio } from "./components/Studio.svelte";
-
-// Lobb client and utilities
-export { Lobb } from "./Lobb";
-export * from "./utils";
-export * from "./eventSystem";
-export { ctx, lobb } from "./store.svelte";
-export type * from "./store.types";
-
-export function createSet(lastNumber: number): Set<number> {
-	const set = new Set() as Set<number>;
-	for (let i = 0; i <= lastNumber; i++) {
-		set.add(i);
-	}
-	return set;
-}
-
-export function moveElement<T>(array: T[], fromIndex: number, toIndex: number) {
-	if (
-		fromIndex < 0 || fromIndex >= array.length || toIndex < 0 ||
-		toIndex >= array.length
-	) {
-		throw new Error("Index out of bounds");
-	}
-	const [element] = array.splice(fromIndex, 1);
-	array.splice(toIndex, 0, element);
-	return array;
-}
-
-export function pxToRem(px: number) {
-	const rootFontSize = parseFloat(
-		getComputedStyle(document.documentElement).fontSize,
-	);
-	return px / rootFontSize;
-}

package/src/lib/store.svelte.ts

@@ -1,33 +0,0 @@
-import type { CTX } from './store.types';
-import { Lobb } from './Lobb';
-import { toast } from 'svelte-sonner';
-import pkg from '../../package.json';
-
-if (!window.APP_ENV) {
-  window.APP_ENV = {};
-}
-
-if (window.APP_ENV.LOBB_URL === '%LOBB_URL%') {
-  window.APP_ENV.LOBB_URL = null;
-}
-
-export const ctx: CTX = $state.raw({
-  studioVersion: pkg.version,
-  lobbUrl: window.APP_ENV.LOBB_URL || localStorage.getItem("lobb_url"),
-  extensions: {},
-  meta: {
-    collections: null,
-    extensions: null,
-    filter: null
-  },
-});
-
-export const lobb = new Lobb(ctx.lobbUrl);
-
-// logging the message if got any bad responses
-lobb.onResponse(async (response) => {
-  if (response.status >= 400) {
-    const body = await response.json();
-    toast.error(body.message);
-  }
-});

package/src/lib/store.types.ts

@@ -1,28 +0,0 @@
-import type { Extension } from "../extensions/extension.types";
-
-interface Collection {
-    category: string;
-    owner: string;
-    fields: Record<string, any>;
-    singleton: boolean;
-}
-type Collections = Record<string, Collection>;
-
-interface Meta {
-    version: string;
-    relations: Array<any>;
-    collections: Collections;
-    extensions: Record<string, any>;
-    filter: any;
-    events: any[];
-    event_context_type: string;
-    studio_workflows: any[];
-}
-
-export interface CTX {
-    studioVersion: string;
-    lobbUrl: string | null;
-    extensions: Record<string, Extension>;
-    meta: Meta;
-    currentUrl: URL;
-}