std-inventory

Level: Molecule | Entity: InventoryItem | Persistence: persistent

1 states, 7 events, 4 transitions

Live Preview

orbital InventoryItemOrbital {
  entity InventoryItem [persistent: inventoryitems] {
    id : string
    name : string
    description : string
    status : string
    createdAt : string
    pendingId : string
  }
  trait InventoryItemBrowse -> InventoryItem [interaction] {
    state browsing {
      INIT -> browsing
        (fetch InventoryItem)
        (render-ui main { type: "stack", direction: "vertical", gap: "lg", className: "max-w-5xl mx-auto w-full", children: [{ type: "stack", direction: "horizontal", gap: "md", justify: "space-between", align: "center", children: [{ type: "stack", direction: "horizontal", gap: "sm", align: "center", children: [{ type: "icon", name: "package", size: "lg" }, { type: "typography", content: "InventoryItems Inventory", variant: "h2" }] }, { type: "stack", direction: "horizontal", gap: "sm", children: [{ type: "button", label: "Add InventoryItem", event: "ADD_ITEM", variant: "primary", icon: "plus" }] }] }, { type: "divider" }, { type: "data-grid", entity: "InventoryItem", emptyIcon: "inbox", emptyTitle: "No items yet", emptyDescription: "Add your first item to get started.", itemActions: [{ label: "Use", event: "USE_ITEM", variant: "ghost", size: "sm" }, { label: "Drop", event: "DROP", variant: "danger", size: "sm" }], columns: [{ name: "name", label: "Name", variant: "h4", icon: "package" }, { name: "description", label: "Description", variant: "badge", colorMap: { active: "success", completed: "success", done: "success", pending: "warning", draft: "warning", scheduled: "warning", inactive: "neutral", archived: "neutral", disabled: "neutral", error: "destructive", cancelled: "destructive", failed: "destructive" } }, { name: "status", label: "Status", variant: "caption" }] }] })
      ITEM_ADDED -> browsing
        (fetch InventoryItem)
      ITEM_USED -> browsing
        (fetch InventoryItem)
      CONFIRM_DROP -> browsing
        (fetch InventoryItem)
    }
    listens {
      * ITEM_ADDED -> ITEM_ADDED
      * ITEM_USED -> ITEM_USED
      * CONFIRM_DROP -> CONFIRM_DROP
    }
  }
  trait InventoryItemAdd -> InventoryItem [interaction] {
    initial: closed
    state closed {
      INIT -> closed
        (fetch InventoryItem)
      ADD_ITEM -> open
        (fetch InventoryItem)
        (render-ui modal { type: "stack", direction: "vertical", gap: "md", children: [{ type: "stack", direction: "horizontal", gap: "sm", children: [{ type: "icon", name: "plus-circle", size: "md" }, { type: "typography", content: "Add InventoryItem", variant: "h3" }] }, { type: "divider" }, { type: "form-section", entity: "InventoryItem", mode: "create", submitEvent: "SAVE", cancelEvent: "CLOSE", fields: ["name", "description", "status"] }] })
    }
    state open {
      CLOSE -> closed
        (render-ui modal null)
        (notify Cancelled info)
      SAVE -> closed
        (persist create InventoryItem @payload.data)
        (fetch InventoryItem)
        (render-ui modal null)
        (emit ITEM_ADDED)
        (notify "InventoryItem created successfully")
    }
    emits {
      ITEM_ADDED
    }
  }
  trait InventoryItemUse -> InventoryItem [interaction] {
    initial: closed
    state closed {
      INIT -> closed
        (fetch InventoryItem)
      USE_ITEM -> open
        (fetch InventoryItem { id: "@payload.id" })
        (render-ui modal { type: "stack", direction: "vertical", gap: "md", align: "center", children: [{ type: "stack", direction: "horizontal", gap: "sm", align: "center", children: [{ type: "icon", name: "zap", size: "md" }, { type: "typography", content: "Use InventoryItem", variant: "h3" }] }, { type: "divider" }, { type: "typography", content: "@entity.name", variant: "body" }, { type: "stack", direction: "horizontal", gap: "sm", justify: "center", children: [{ type: "button", label: "Cancel", event: "CLOSE", variant: "ghost" }, { type: "button", label: "Confirm Use", event: "SAVE", variant: "primary", icon: "check" }] }] })
    }
    state open {
      CLOSE -> closed
        (render-ui modal null)
        (notify Cancelled info)
      SAVE -> closed
        (persist update InventoryItem @payload.data)
        (fetch InventoryItem)
        (render-ui modal null)
        (emit ITEM_USED)
        (notify "InventoryItem updated successfully")
    }
    emits {
      ITEM_USED
    }
  }
  trait InventoryItemDrop -> InventoryItem [interaction] {
    initial: idle
    state idle {
      INIT -> idle
        (fetch InventoryItem)
      DROP -> confirming
        (set @entity.pendingId @payload.id)
        (fetch InventoryItem { id: "@payload.id" })
        (render-ui modal { type: "stack", direction: "vertical", gap: "md", children: [{ type: "stack", direction: "horizontal", gap: "sm", align: "center", children: [{ type: "icon", name: "alert-triangle", size: "md" }, { type: "typography", content: "Drop InventoryItem", variant: "h3" }] }, { type: "divider" }, { type: "alert", variant: "danger", message: "Are you sure you want to drop this inventoryitem?" }, { type: "stack", direction: "horizontal", gap: "sm", justify: "end", children: [{ type: "button", label: "Cancel", event: "CANCEL", variant: "ghost" }, { type: "button", label: "Drop", event: "CONFIRM_DROP", variant: "danger", icon: "check" }] }] })
    }
    state confirming {
      CONFIRM_DROP -> idle
        (persist delete InventoryItem @payload.id)
        (fetch InventoryItem)
        (render-ui modal null)
        (fetch InventoryItem)
        (emit CONFIRM_DROP)
        (notify "InventoryItem deleted successfully")
      CANCEL -> idle
        (render-ui modal null)
        (fetch InventoryItem)
      CLOSE -> idle
        (render-ui modal null)
        (fetch InventoryItem)
    }
    emits {
      CONFIRM_DROP
    }
  }
  page "/inventoryitems" -> InventoryItemBrowse, InventoryItemAdd, InventoryItemUse, InventoryItemDrop
}

Loading preview...

Orbital Visualization

Loading visualization...

Entity Fields

Field	Type	Default
id	string	-
name	string	-
description	string	-
status	string	"active"
createdAt	string	-
pendingId	string	""

States

State	Type
browsing	Initial

Events

Event	Payload
INIT	-
ADD_ITEM	-
USE_ITEM	id: string
DROP	id: string
ITEM_ADDED	data: object
ITEM_USED	data: object
CONFIRM_DROP	data: object

Transitions

From	Event	To	Effects
browsing	INIT	browsing	2 effects
browsing	ITEM_ADDED	browsing	1 effect
browsing	ITEM_USED	browsing	1 effect
browsing	CONFIRM_DROP	browsing	1 effect

Listens

• [object Object]
• [object Object]
• [object Object]