Introduce modular UI framework

1. Modals wrapped
2. Toolbar icon actions: click and link-to navigation
3. Moved components into sub-folders
4. Replaced Bootstrap Tooltip and Dropdown libs with Ember specific add-ons

And more.

Co-Authored-By: Saul S <sauls8t@users.noreply.github.com>
Co-Authored-By: McMatts <matt@documize.com>

gui/app/templates/application.hbs

@@ -1,2 +1 @@
 {{outlet}}
-{{user-notification notification="message"}}

gui/app/templates/components/document/view-revision.hbs

@@ -5,7 +5,7 @@
 		<div class="row">
 			<div class="col-12">
 				<div class="form-group">
-					{{ui-select tagName="span" class="revision-picker" content=revisions action=(action "onSelectRevision") optionValuePath="id" optionLabelPath="label"}}
+					{{ui/ui-select tagName="span" class="revision-picker" content=revisions action=(action "onSelectRevision") optionValuePath="id" optionLabelPath="label"}}
 				</div>
 			</div>
 		</div>

gui/app/templates/components/folder/documents-list.hbs

@@ -59,9 +59,9 @@
 {{/ui/ui-dialog}}
 
 {{#if showAdd}}
-	{{empty-state icon="direct" message="Add documents via + DOCUMENT"}}
+	{{ui/empty-state icon="direct" message="Add documents via + DOCUMENT"}}
 {{/if}}
 
 {{#if showLockout}}
-	{{empty-state icon="visibility" message="Space permissions are preventing you from viewing and creating documents"}}
+	{{ui/empty-state icon="visibility" message="Space permissions are preventing you from viewing and creating documents"}}
 {{/if}}

gui/app/templates/components/folder/settings-general.hbs

@@ -8,7 +8,7 @@
 
 		<div class="form-group">
 			<label>Space Type</label>
-			{{ui-select id="spacetypes-dropdown" content=spaceTypeOptions optionValuePath="id" optionLabelPath="label" selection=spaceType action=(action "onSetSpaceType")}}
+			{{ui/ui-select id="spacetypes-dropdown" content=spaceTypeOptions optionValuePath="id" optionLabelPath="label" selection=spaceType action=(action "onSetSpaceType")}}
 			<small class="form-text text-muted">Who can see this space?</small>
 		</div>
 

gui/app/templates/components/layout/page-desc.hbs

@@ -0,0 +1 @@
+{{desc}}

gui/app/templates/components/layout/page-heading.hbs

@@ -0,0 +1 @@
+{{title}}

gui/app/templates/components/section/code/type-editor.hbs

@@ -1,7 +1,7 @@
 {{#section/base-editor-inline document=document folder=folder page=page tip="Concise name that describes code snippet" isDirty=(action "isDirty") onCancel=(action "onCancel") onAction=(action "onAction")}}
 	<div class="section-code-editor">
 		<div class="syntax-selector">
-			{{ui-select id=syntaxId
+			{{ui/ui-select id=syntaxId
 				content=syntaxOptions
 				action=(action "onSyntaxChange")
 				optionValuePath="mode"

gui/app/templates/components/section/github/type-editor.hbs

@@ -5,7 +5,7 @@
 			<div class="col-6">
 				<div class="form-group">
 					<label>Select Organization</label>
-					{{ui-select id="owners-dropdown" content=owners action=(action "onOwnerChange") optionValuePath="id" optionLabelPath="name" selection=config.owner}}
+					{{ui/ui-select id="owners-dropdown" content=owners action=(action "onOwnerChange") optionValuePath="id" optionLabelPath="name" selection=config.owner}}
 					<small class="form-text text-muted">Select organization or user whose repository you want to show</small>
 				</div>
 				<div class="form-group">

gui/app/templates/components/section/papertrail/type-editor.hbs

@@ -33,7 +33,7 @@
 				</div>
 				<div class="form-group">
 					<label for="group-dropdown">Group</label>
-					{{ui-select id="group-dropdown" prompt="<group>" content=options.groups action=(action "onGroupsChange") optionValuePath="id" optionLabelPath="name" selection=config.group}}
+					{{ui/ui-select id="group-dropdown" prompt="<group>" content=options.groups action=(action "onGroupsChange") optionValuePath="id" optionLabelPath="name" selection=config.group}}
 					<small class="form-text text-muted">Optional Papertrail group</small>
 				</div>
 			</form>

gui/app/templates/components/section/trello/type-editor.hbs

@@ -9,7 +9,7 @@
 			{{else}}
 				<div class="form-group">
 					<label>Select Board</label>
-					{{ui-select id="boards-dropdown" content=boards action=(action "onBoardChange") optionValuePath="id" optionLabelPath="name" selection=config.board}}
+					{{ui/ui-select id="boards-dropdown" content=boards action=(action "onBoardChange") optionValuePath="id" optionLabelPath="name" selection=config.board}}
 				</div>
 				<div class="form-group">
 					<label for="airtable-embed-cod">Select Lists</label>

gui/app/templates/components/ui/ui-modal-buttons.hbs

@@ -0,0 +1 @@
+{{yield}}

gui/app/templates/components/ui/ui-modal.hbs

@@ -0,0 +1,13 @@
+<div id={{contentId}} class="modal" tabindex="-1" role="dialog">
+	<div class="modal-dialog {{size}}" role="document">
+		<div class="modal-content">
+			<div class="modal-header">{{title}}</div>
+			<div class="modal-body">
+				{{yield}}
+			</div>
+			<div class="modal-footer">
+				{{outlet "buttons"}}
+			</div>
+		</div>
+	</div>
+</div>

gui/app/templates/components/ui/ui-toolbar-icon.hbs

@@ -0,0 +1,3 @@
+{{#if tooltip}}
+	{{#attach-tooltip showDelay=1000}}{{tooltip}}{{/attach-tooltip}}
+{{/if}}

gui/app/templates/components/ui/ui-tooltip.hbs

@@ -0,0 +1,3 @@
+{{#if tooltip}}
+	{{#attach-tooltip showDelay=1000}}{{tooltip}}{{/attach-tooltip}}
+{{/if}}

gui/app/templates/components/user-notification.hbs

@@ -1,5 +0,0 @@
-<div class="user-notification">
-    {{#each notifications as |msg|}}
-        <p class="message">{{msg}}</p>
-    {{/each}}
-</div>