@zakkzhang/tw5-graph 1.6.4

package/plugins/graph/ui/Buttons/settings.tid

@@ -0,0 +1,28 @@
+description: Open graph settings
+caption: {{$:/core/images/options-button}} settings
+
+\procedure settingsActions()
+\whitespace trim
+<$action-navigate $to="$:/plugins/flibbles/graph/settings"/>
+<$action-setfield
+  $tiddler="$:/state/flibbles/graph/settings"
+  text="$:/plugins/flibbles/graph/ui/Settings/Graphs" />
+<$action-setfield
+  $tiddler="$:/state/flibbles/graph/settings/graphs"
+  text=<<currentTiddler>> />
+\end
+
+\whitespace trim
+<$button
+    tooltip="Open graph settings"
+    class="graph-settings-button"
+    actions=<<settingsActions>> >
+  <%if [<tv-config-toolbar-icons>match[yes]] %>
+    {{$:/core/images/options-button}}
+  <%endif%>
+  <%if [<tv-config-toolbar-text>match[yes]] %>
+    <span class="tc-btn-text">
+      <$text text="settings" />
+    </span>
+  <%endif%>
+</$button>

package/plugins/graph/ui/Buttons/tiddlywiki.files

@@ -0,0 +1,16 @@
+{
+	"directories": [
+		{
+			"path": ".",
+			"filesRegExp": "^.*\\.tid$",
+			"isTiddlerFile": true,
+			"fields": {
+				"title": {
+					"source": "basename",
+					"prefix": "$:/plugins/flibbles/graph/ui/Buttons/"
+				},
+				"tags": "$:/tags/flibbles/graph/GraphToolbar"
+			}
+		}
+	]
+}

package/plugins/graph/ui/EditTemplate/Edges.tid

@@ -0,0 +1,22 @@
+caption: Edge Types
+
+\procedure edgelist(category, default, customAllowed)
+\whitespace trim
+<$vars fieldName=`edges.$(category)$` subfilterName=`edgetypes.$(category)$`>
+  <$edit-text field=<<fieldName>> placeholder=<<default>> />
+  <br>
+  <span class="graph-tiddlers-edgelist">
+    <$vars masterFilter="[[$:/plugins/flibbles/graph/subfilters]getindex<subfilterName>] :map:flat[subfilter{!!title}sort[]]"
+           customFilter={{{ [{!!title}get<fieldName>!is[blank]else<default>]}}}>
+      <$list filter="[<customAllowed>match[yes]] :map:flat[subfilter<masterFilter>subfilter<customFilter>] [subfilter<masterFilter>]" join=", ">
+        <span class={{{ [subfilter<masterFilter>subfilter<customFilter>match{!!title}] :then[[active]] ~inactive }}}>
+          <$text text={{!!title}} />
+\end
+
+\whitespace trim
+
+Decide which of the preconfigured edge types will connect your nodes
+
+|tc-max-width tc-edit-max-width tc-table-no-border |k
+|Fields |<<edgelist fields "[all[]]" yes>> |
+|Functions |<<edgelist functions "[all[]]" no>> |

package/plugins/graph/ui/EditTemplate/Neighbors.tid

@@ -0,0 +1,35 @@
+caption: Neighbors
+
+\whitespace trim
+
+You can display all the neighbor nodes associated with the nodes in your graph.
+
+<!-- This uses 1 and 0 as values instead of yes and no, because someday, I
+     may allow for deeper depth of neighbors. Those would use 2+ -->
+
+<!-- It sets two fields, `neighbors.incoming` and `neighbors.outgoing` for
+     the same reason. Some day, we may configure those separately, and if so,
+     this will be better for backward compatibility. -->
+
+<$checkbox field="neighbors.incoming"
+	checked=1
+	unchecked=0
+	default=0
+	checkactions="""<$action-setfield $field="neighbors.outgoing" $value=1 />"""
+	uncheckactions="""<$action-setfield $field="neighbors.outgoing" />"""
+>
+&#32;Enable neighbors
+</$checkbox>
+
+<$reveal type="match"
+	text="1"
+	stateTitle={{!!title}}
+	stateField="neighbors.incoming"
+	retain="yes"
+	animate="yes">
+
+|tc-table-no-border |k
+|Allowed neighbors |<$edit-text field="neighbors.whitelist" placeholder="[!is[system]]" /> |
+|Edges between neighbors |<$checkbox field="neighbors.interedges" checked=yes unchecked=no default=no /> |
+
+</$reveal>

package/plugins/graph/ui/EditTemplate/Nodes.tid

@@ -0,0 +1,12 @@
+caption: Nodes filter
+
+\whitespace trim
+
+Configure a filter describing what nodes this graph shows
+
+<$fieldtranscriber type="application/x-tiddler-filter" field=filter>
+
+|tc-table-no-border |k
+|Nodes |<$edit-text tiddler=<<state>> /> |
+
+</$fieldtranscriber>

package/plugins/graph/ui/EditTemplate/Popups.tid

@@ -0,0 +1,27 @@
+caption: Popups
+
+\whitespace trim
+
+You can enable popups when hovering over a node.
+
+<$checkbox field="popup"
+	checked=yes
+	unchecked=no
+	default=no>
+&#32;Enable node popups
+</$checkbox>
+
+<$reveal type="match"
+	text="yes"
+	stateTitle={{!!title}}
+	stateField="popup"
+	retain="yes"
+	animate="yes">
+
+|tc-table-no-border |k
+|Popup template |<$edit-text field="popup.template" placeholder="{{!!text}}" inputActions="<%if [<actionValue>match[]] %><$action-setfield $field='popup.template' />" /> |
+|Popup delay (ms) |<$edit-text field="popup.ms" placeholder="600" type="number" /> |
+|Popup maximum width |<$edit-text field="popup.width" placeholder="300px"/> |
+|Popup maximum height |<$edit-text field="popup.height" placeholder="200px" /> |
+
+</$reveal>

package/plugins/graph/ui/EditTemplate/Properties.tid

@@ -0,0 +1,21 @@
+caption: Graph Engine Defaults
+list-after: 
+
+\whitespace trim
+
+<$transclude $tiddler="$:/plugins/flibbles/graph/ui/grouped-tabs"
+	tabsList="graph nodes edges"
+	default=graph
+	class=""
+	state= "$:/state/flibbles/graph/editTemplate/properties">
+
+<$fill $name=body>
+
+<$fieldtranscriber
+	type="application/json"
+	field=`graph.$(currentTab)$`>
+
+<$vars currentTiddler=<<state>>>
+
+<$transclude $tiddler="$:/plugins/flibbles/graph/ui/ViewTemplate/properties"
+	type=<<currentTab>> />

package/plugins/graph/ui/EditTemplate/tiddlywiki.files

@@ -0,0 +1,16 @@
+{
+	"directories": [
+		{
+			"path": ".",
+			"filesRegExp": "^.*\\.tid$",
+			"isTiddlerFile": true,
+			"fields": {
+				"title": {
+					"source": "basename",
+					"prefix": "$:/plugins/flibbles/graph/ui/EditTemplate/"
+				},
+				"tags": "$:/tags/flibbles/graph/EditTemplate"
+			}
+		}
+	]
+}

package/plugins/graph/ui/Modals/NewPropertySet.tid

@@ -0,0 +1,20 @@
+title: $:/plugins/flibbles/graph/ui/Modals/NewPropertySet
+subtitle: New Property Set
+footer: {{$:/plugins/flibbles/graph/ui/Modals/Select!!footer}}
+mask-closable: yes
+
+<p class="tc-edit-field-add">
+
+<em class="tc-edit tc-small-gap-right">
+
+<$text text="Type in the name for a new set."/>
+
+</em></p>
+
+<$transclude $tiddler="$:/plugins/flibbles/graph/ui/Modals/Select">
+
+<$fill $name=list-item>
+
+<div class="tc-menu-list-item">
+
+<$link overrideClass="tc-tiddlylink" />

package/plugins/graph/ui/Modals/NewView.tid

@@ -0,0 +1,20 @@
+title: $:/plugins/flibbles/graph/ui/Modals/NewGraph
+subtitle: New Graph
+footer: {{$:/plugins/flibbles/graph/ui/Modals/Select!!footer}}
+mask-closable: yes
+
+<p class="tc-edit-field-add">
+
+<em class="tc-edit tc-small-gap-right">
+
+<$text text="Type in the name for a new graph."/>
+
+</em></p>
+
+<$transclude $tiddler="$:/plugins/flibbles/graph/ui/Modals/Select">
+
+<$fill $name=list-item>
+
+<div class="tc-menu-list-item">
+
+<$link overrideClass="tc-tiddlylink" />

package/plugins/graph/ui/Modals/Select.tid

@@ -0,0 +1,72 @@
+title: $:/plugins/flibbles/graph/ui/Modals/Select
+footer: <$importvariables filter="[all[current]]"><$button actions=<<select-accept-actions>> >Okay</$button> <$button actions=<<select-close-actions>>>Close</$button>
+
+\procedure select-accept-actions()
+\whitespace trim
+<$action-sendmessage $message="tm-modal-finish" $param={{$:/temp/graph/select/tiddler}} />
+<$action-sendmessage $message="tm-close-tiddler" />
+<$action-deletetiddler $filter="[[$:/temp/graph/select]] [[$:/temp/graph/select/tiddler]] [[$:/temp/graph/select/selected-item]] [[$:/temp/graph/select/refresh]]" />
+\end
+
+\procedure select-click-actions()
+<$action-setfield $tiddler="$:/temp/graph/select/tiddler" text=<<navigateTo>> />
+<<select-accept-actions>>
+\end
+
+\procedure select-close-actions()
+\whitespace trim
+<$action-sendmessage $message="tm-close-tiddler" />
+<$action-deletetiddler $filter="[[$:/temp/graph/select]] [[$:/temp/graph/select/tiddler]] [[$:/temp/graph/select/selected-item]] [[$:/temp/graph/select/refresh]]" />
+\end
+
+\procedure select-cancel-actions()
+\whitespace trim
+<% if [{$:/temp/graph/select}match[]] %>
+	<<select-close-actions>>
+<% elseif [{$:/temp/graph/select}!match{$:/temp/graph/select/tiddler}] %>
+	<$action-setfield $tiddler="$:/temp/graph/select/tiddler" text={{$:/temp/graph/select}}/>
+	<$action-deletetiddler $filter="$:/temp/graph/select/selected-item" />
+	<$action-setfield $tiddler="$:/temp/graph/select/refresh" text="yes"/>
+<% else %>
+	<$action-deletetiddler $filter="[[$:/temp/graph/select]] [[$:/temp/graph/select/tiddler]] [[$:/temp/graph/select/selected-item]] [[$:/temp/graph/select/refresh]]" />
+<% endif %>
+\end
+
+\whitespace trim
+
+<div class="tc-edit-field-add-name-wrapper">
+
+<$transclude
+	$variable="keyboard-driven-input"
+	storeTitle="$:/temp/graph/select"
+	tiddler="$:/temp/graph/select/tiddler"
+	refreshTitle="$:/temp/graph/select/refresh"
+	selectionStateTitle="$:/temp/graph/select/selected-item"
+	configTiddlerFilter="[all[current]]"
+	tag="input"
+	placeholder="Type something"
+	class="tc-edit-texteditor graph-select"
+	focus=yes
+	inputCancelActions=<<select-cancel-actions>>
+	inputAcceptActions=<<select-accept-actions>>
+	$mode=inline
+/>
+
+<p>
+
+<$linkcatcher actions=<<select-click-actions>> >
+
+<$list filter={{!!first-search-filter}} >
+
+<$list-empty>
+
+<$text text="New result" />
+
+</$list-empty>
+<$list-template>
+
+<span class={{{[{$:/temp/graph/select/tiddler}match<currentTiddler>then[tc-list-item-selected]] }}}>
+
+<$slot $name=list-item>
+
+<$transclude tiddler="$:/core/ui/ListItemTemplate" mode=inline/>

package/plugins/graph/ui/Modals/SelectField.tid

@@ -0,0 +1,21 @@
+title: $:/plugins/flibbles/graph/ui/Modals/SelectField
+subtitle: Select field
+first-search-filter: [subfilter{$:/plugins/flibbles/graph/subfilters##edgetypes.fields}search:title{$:/temp/graph/select}sort[title]limit[10]]
+footer: {{$:/plugins/flibbles/graph/ui/Modals/Select!!footer}}
+mask-closable: yes
+
+<p class="tc-edit-field-add">
+
+<em class="tc-edit tc-small-gap-right">
+
+<$text text="Select an existing field, or type in the name for a new one."/>
+
+</em></p>
+
+<$transclude $tiddler="$:/plugins/flibbles/graph/ui/Modals/Select">
+
+<$fill $name=list-item>
+
+<div class="tc-menu-list-item">
+
+<$link overrideClass="tc-tiddlylink" />

package/plugins/graph/ui/Modals/SelectTiddler.tid

@@ -0,0 +1,15 @@
+title: $:/plugins/flibbles/graph/ui/Modals/SelectTiddler
+subtitle: Select tiddler
+first-search-filter: [!is[system]!is[draft]search:title{$:/temp/graph/select}sort[title]limit[10]]
+footer: {{$:/plugins/flibbles/graph/ui/Modals/Select!!footer}}
+mask-closable: yes
+
+<p class="tc-edit-field-add">
+
+<em class="tc-edit tc-small-gap-right">
+
+<$text text="Select an existing tiddler, or type in the name for a new one."/>
+
+</em></p>
+
+<$transclude $tiddler="$:/plugins/flibbles/graph/ui/Modals/Select" />

package/plugins/graph/ui/Modals/Tiddler.tid

@@ -0,0 +1,22 @@
+title: $:/plugins/flibbles/graph/ui/Modals/Tiddler
+subtitle: {{$:/plugins/flibbles/graph/ui/Modals/TiddlerHeader}}
+mask-closable: yes
+code-body: yes
+
+<$vars
+  tv-config-toolbar-icons={{$:/config/Toolbar/Icons}}
+  tv-config-toolbar-text={{$:/config/Toolbar/Text}}
+  tv-config-toolbar-class={{$:/config/Toolbar/ButtonClass}}>
+
+<div class=graph-modal-tiddler>
+
+<$linkcatcher actions="""\whitespace trim
+<%if [list[$:/state/flibbles/graph/modal]match<navigateTo>] %>
+  <$action-listops $tiddler='$:/state/flibbles/graph/modal' $subfilter='+[allafter:include<navigateTo>]' />
+<%else%>
+  <$action-navigate $to=<<navigateTo>> />
+""" >
+
+<$tiddler tiddler={{{ [list[$:/state/flibbles/graph/modal]] }}}>
+
+<$transclude $tiddler="$:/core/ui/StoryTiddlerTemplate" $mode=inline />

package/plugins/graph/ui/Modals/TiddlerHeader.tid

@@ -0,0 +1,15 @@
+title: $:/plugins/flibbles/graph/ui/Modals/TiddlerHeader
+
+\whitespace trim
+
+<div class=graph-modal-tiddler-breadcrumbs>
+  <$linkcatcher actions="<$action-listops $tiddler='$:/state/flibbles/graph/modal' $subfilter='+[allafter:include<navigateTo>]' />" >
+    <$list filter="[list[$:/state/flibbles/graph/modal]]" join="{{$:/core/images/left-arrow}}">
+      <%if [list[$:/state/flibbles/graph/modal]first[]match{!!title}] %>
+        ''<$text text={{!!title}} />''
+      <%else%>
+        <$link />
+      <%endif%>
+    </$list>
+  </$linkcatcher>
+</div>

package/plugins/graph/ui/PropertyTypes/boolean.tid

@@ -0,0 +1,11 @@
+title: $:/plugins/flibbles/graph/ui/PropertyTypes/boolean
+
+\whitespace trim
+
+<$checkbox index=<<property>>
+	checked=yes
+	unchecked=no
+	default={{{ [<jsonEntry>jsonget[default]match[true]then[yes]else[no]] }}}
+/>
+&#32;
+<$text text={{{ [<jsonEntry>jsonget[label]] }}} />

package/plugins/graph/ui/PropertyTypes/color.tid

@@ -0,0 +1,5 @@
+title: $:/plugins/flibbles/graph/ui/PropertyTypes/color
+
+\whitespace trim
+
+<$edit-text class="tc-edit-texteditor tc-edit-fieldeditor" tag=input index=<<property>> type=color />

package/plugins/graph/ui/PropertyTypes/enum.tid

@@ -0,0 +1,15 @@
+title: $:/plugins/flibbles/graph/ui/PropertyTypes/enum
+
+\whitespace trim
+
+<$select
+	multiple={{{ [<jsonEntry>jsonget[multiple]match[true]else[]] }}}
+	actions="<%if [all[current]getindex<property>match[]] %><$action-setfield $index=<<property>> $value=' '/>"
+	index=<<property>>
+	default={{{ [<jsonEntry>jsonget[multiple]match[true]then<jsonEntry>jsonget[default]format:titlelist[]join[ ]] ~[<jsonEntry>jsonget[default]] }}} >
+  <$list variable=enum filter="[<jsonEntry>jsonget[values]] -[<jsonEntry>jsonget[hidden]]">
+    <option value=<<enum>> >
+      <$text text=<<enum>> />
+    </option>
+  </$list>
+</$select>

package/plugins/graph/ui/PropertyTypes/number.tid

@@ -0,0 +1,17 @@
+title: $:/plugins/flibbles/graph/ui/PropertyTypes/number
+
+\whitespace trim
+
+<$let
+	increment={{{ [<jsonEntry>jsonget[increment]else[1]] }}}
+	default={{{ [<jsonEntry>jsonget[default]else[0]] }}}
+	min={{{ [<jsonEntry>jsonget[min]] ~[<increment>multiply[-25]add<default>] }}}
+	max={{{ [<jsonEntry>jsonget[max]] ~[<increment>multiply[50]add<min>] }}}
+>
+<$range index=<<property>>
+	min=<<min>>
+	max=<<max>>
+	increment=<<increment>>
+	default=<<default>>
+/>
+<span><$text text={{{ [{!!title}getindex<property>else<default>] }}} />

package/plugins/graph/ui/Settings/Engine.tid

@@ -0,0 +1,23 @@
+title: $:/plugins/flibbles/graph/ui/Settings/Engine
+filter: [[graphengine]modules[]count[]compare:number:gt[1]]
+tags: $:/tags/flibbles/graph/SettingsTab
+caption: Engine
+
+\parameters (prompt: "Select a default engine for your TiddlyWiki to use.")
+
+<$transclude $variable=prompt />
+
+<div class=graph-engine-button-list>
+
+<$list filter="[subfilter{$:/plugins/flibbles/graph/subfilters##engine.list}]">
+
+<$let name={{{ [all[current]moduleproperty[name]] }}} >
+
+<$button class=graph-engine-button selectedClass=active set="$:/config/flibbles/graph/engine" setTo=<<name>> >
+
+<div class=graph-icon>
+
+<$transclude $tiddler={{{ [all[current]shadowsource[]addsuffix[/icon]is[shadow]] }}} />
+
+</div>
+<$text text=<<name>> />

package/plugins/graph/ui/Settings/Graphs/EditTemplate.tid

@@ -0,0 +1,52 @@
+title: $:/plugins/flibbles/graph/ui/Settings/Graphs/EditTemplate
+
+\procedure engineSelector()
+\whitespace trim
+<$select field=engine
+	actions="<%if [{!!engine}match[]] %><$action-deletefield $field=engine/>">
+  <option />
+  <$list filter="[{!!engine}!match[]] [subfilter{$:/plugins/flibbles/graph/subfilters##engine.list}moduleproperty[name]]">
+    <%if [{!!title}match[]] ~[subfilter{$:/plugins/flibbles/graph/subfilters##engine.list}moduleproperty[name]match{!!title}] %>
+      <option>
+        <$text text={{!!title}} />
+      </option>
+    <%else%>
+      <option disabled value={{!!title}} class="graph-tiddler-select-warning" >
+        <$text text=`$(currentTiddler)$ (not installed!)` />
+      </option>
+    <%endif%>
+  </$list>
+</$select>
+\end
+
+\procedure templateSelector()
+\whitespace trim
+<$select field=template default={{{ [[$:/tags/flibbles/graph/Template]tagging[]] }}} >
+  <$list filter="[[$:/tags/flibbles/graph/Template]tagging[]]">
+    <option value={{!!title}}>
+      <$view field=caption>
+        <$view field=title />
+      </$view>
+    </option>
+  </$list>
+</$select>
+\end
+
+! <$link><$transclude field=caption><$text text={{{ [{!!title}removeprefix[$:/graph/]] }}} /></$transclude></$link>
+
+<%if [[graphengine]modules[]count[]compare:number:gt[1]] %>
+
+Engine: <<engineSelector>>
+<%endif%>
+
+Template: <<templateSelector>>
+
+<$list variable="segment" filter="[[$:/tags/flibbles/graph/EditTemplate]tagging[]]">
+
+<div class="graph-tiddler-edit-template">
+
+!! <$transclude $tiddler=<<segment>> $field="caption"/>
+
+<$transclude $tiddler=<<segment>> />
+
+</div></$list>

package/plugins/graph/ui/Settings/Graphs.tid

@@ -0,0 +1,49 @@
+title: $:/plugins/flibbles/graph/ui/Settings/Graphs
+tags: $:/tags/flibbles/graph/SettingsTab
+caption: Graphs
+
+\whitespace trim
+\procedure graphList() :cache[all[shadows+tiddlers]insertafter{$:/config/flibbles/graph/sidebar}prefix[$:/graph/]else[$:/graph/Default]sort[]]
+
+<$transclude $tiddler="$:/plugins/flibbles/graph/ui/grouped-tabs"
+	tabsList=<<graphList>>
+	default={{{ [subfilter<graphList>] }}}
+	explicitState="$:/state/flibbles/graph/settings/graphs"
+>
+  <$fill $name=addButton>
+    <$button class="group-tab-new">
+      {{$:/core/images/new-button}}
+      <$action-modal $tiddler="$:/plugins/flibbles/graph/ui/Modals/NewGraph">
+        <$vars newTitle=`$:/graph/$(selection)$`>
+          <$action-createtiddler $basetitle=<<newTitle>> type="application/json" />
+          <$action-setfield $tiddler=<<qualifiedState>> text=<<newTitle>> />
+        </$vars>
+      </$action-modal>
+      <$action-sendmessage $message=tm-focus-selector $param="input.graph-select" />
+    </$button>
+  </$fill>
+  <$fill $name=button>
+    <$view tiddler=<<currentTab>> field=caption>
+      <$text text={{{ [<currentTab>removeprefix[$:/graph/]] }}} />
+    </$view>
+  </$fill>
+  <$fill $name=body>
+    <$let currentTiddler=<<currentTab>> >
+      <$transclude $tiddler="$:/plugins/flibbles/graph/ui/Settings/Graphs/EditTemplate" $mode=block />
+    </$let>
+
+    <$button>
+
+      <$vars graphName={{{ [<currentTab>removeprefix[$:/graph/]] }}}>
+        <$action-confirm $message=`Are you sure you wish to delete '$(graphName)$'`>
+          <%if [{$:/config/flibbles/graph/sidebar}match<currentTab>] %>
+            <$action-deletetiddler $tiddler="$:/config/flibbles/graph/sidebar"/>
+          <%endif%>
+          <$action-deletetiddler $tiddler=<<currentTab>>/>
+        </$action-confirm>
+      </$vars>
+
+      Delete Graph
+    </$button>
+  </$fill>
+</$transclude>

package/plugins/graph/ui/Settings/Properties/ObjectsTypeTemplate.tid

@@ -0,0 +1,44 @@
+title: $:/plugins/flibbles/graph/ui/Settings/Properties/ObjectsTypeTemplate
+
+\define groupPrefix() $:/config/flibbles/graph/$(currentType)$/$(currentGroup)$/
+\whitespace trim
+
+<$let
+	currentType=<<currentTab>>
+	presetPrefix=`$:/plugins/flibbles/graph/presettypes/$(currentType)$/`
+	configPrefix=`$:/config/flibbles/graph/$(currentTab)$/`>
+
+
+<$transclude $tiddler="$:/plugins/flibbles/graph/ui/grouped-tabs"
+	groupsList="[all[shadows+tiddlers]removeprefix<presetPrefix>]"
+	tabsList="[all[shadows+tiddlers]prefix<groupPrefix>]"
+	default={{{ [all[shadows+tiddlers]prefix[$:/graph/]else[$:/graph/core/Default]] }}}
+	state=`$:/state/flibbles/graph/settings/$(currentType)$`
+	orderFilter="[<currentGroup>addprefix<presetPrefix>get[orderable]match[yes]then<currentGroup>addprefix<configPrefix>]"
+>
+  <$fill $name=addButton>
+    <$button class="group-tab-new">
+      {{$:/core/images/new-button}}
+      <$action-modal $tiddler="$:/plugins/flibbles/graph/ui/Modals/NewPropertySet">
+        <$vars newTitle=`$(groupPrefix)$$(selection)$`>
+          <$action-createtiddler $basetitle=<<newTitle>> type="application/json" />
+          <$action-setfield $tiddler=<<tabsState>> text=<<newTitle>> />
+        </$vars>
+      </$action-modal>
+      <$action-sendmessage $message=tm-focus-selector $param="input.graph-select" />
+    </$button>
+  </$fill>
+  <$fill $name=button>
+    <$text text={{{ [<currentTab>removeprefix<groupPrefix>] }}} />
+  </$fill>
+  <$fill $name=body>
+
+<$let currentTiddler=<<currentTab>>
+      currentCategory={{{ [all[current]removeprefix<configPrefix>split[/]nth[]] }}} >
+
+! <$link><$text text={{{ [all[current]removeprefix<configPrefix>removeprefix<currentCategory>removeprefix[/]] }}} /></$link>
+
+{{||$:/core/ui/ViewTemplate/body}}
+</$let>
+  </$fill>
+</$transclude>

package/plugins/graph/ui/Settings/Properties.tid

@@ -0,0 +1,14 @@
+title: $:/plugins/flibbles/graph/ui/Settings/Properties
+tags: $:/tags/flibbles/graph/SettingsTab
+caption: Properties
+
+\function .tabs() :cache[all[shadows+tiddlers]removeprefix[$:/plugins/flibbles/graph/presettypes/]splitbefore[/]removesuffix[/]unique[]sort[]]
+
+<$parameters default=<<.tabs>> >
+
+<$transclude $variable=tabs
+	tabsList="[function[.tabs]]"
+	default=<<default>>
+	state="$:/state/graph/settings/"
+	template="$:/plugins/flibbles/graph/ui/Settings/Properties/ObjectsTypeTemplate"
+/>

package/plugins/graph/ui/Settings/Toolbar.tid

@@ -0,0 +1,5 @@
+title: $:/plugins/flibbles/graph/ui/Settings/Toolbar
+tags: $:/tags/flibbles/graph/SettingsTab
+caption: Toolbar
+
+{{$:/plugins/flibbles/graph/ui/Toolbars/GraphToolbar}}