From b20b0dc3479c319547e15f65d7e556dcd2cb4713 Mon Sep 17 00:00:00 2001
From: Maxim Balaganskiy <m.balaganskiy@gmail.com>
Date: Wed, 3 Jul 2019 09:48:26 +1000
Subject: [PATCH] feat(settings-editor): allow setting the input width

---
 src/elements/settings-editor/i-setting-info.ts         | 1 +
 src/elements/settings-editor/settings-editor.html      | 2 +-
 src/elements/variant-viewer/variant-viewer.select.html | 2 +-
 src/elements/variant-viewer/variant-viewer.ts          | 3 +++
 4 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/elements/settings-editor/i-setting-info.ts b/src/elements/settings-editor/i-setting-info.ts
index df11b60..041d01a 100644
--- a/src/elements/settings-editor/i-setting-info.ts
+++ b/src/elements/settings-editor/i-setting-info.ts
@@ -9,4 +9,5 @@ export interface ISettingInfo {
 	description?: string | undefined;
 	clientEditor: ClientEditor;
 	children?: ISettingInfo[] | undefined;
+	width?: string;
 }
diff --git a/src/elements/settings-editor/settings-editor.html b/src/elements/settings-editor/settings-editor.html
index d989a69..4a403cd 100644
--- a/src/elements/settings-editor/settings-editor.html
+++ b/src/elements/settings-editor/settings-editor.html
@@ -21,7 +21,7 @@ <h6 class="primary-text" click.delegate="s.toggleExpanded()">${s.info.name}</h6>
 						<button md-button="flat: true;" class="error-text" click.delegate="cancel(s)"><i class="material-icons">clear</i></button>
 						<button if.bind="showHistory" md-button="flat: true;" class="blue-text" click.delegate="history(s)"><i class="material-icons">history</i></button>
 					</div>
-					<variant-viewer else value.bind="s.value" options.bind="s.info.options" data-type.bind="s.info.clientEditor" edit.delegate="edit(s)" change.delegate="save(s)"></variant-viewer>
+					<variant-viewer else value.bind="s.value" options.bind="s.info.options" data-type.bind="s.info.clientEditor" edit.delegate="edit(s)" change.delegate="save(s)" width.bind="s.info.width"></variant-viewer>
 				</div>
 			</div>
 		</li>
diff --git a/src/elements/variant-viewer/variant-viewer.select.html b/src/elements/variant-viewer/variant-viewer.select.html
index 4d7b029..fd29287 100644
--- a/src/elements/variant-viewer/variant-viewer.select.html
+++ b/src/elements/variant-viewer/variant-viewer.select.html
@@ -1,5 +1,5 @@
 <template>
-	<div style="width: 120px">
+	<div style="width: ${selectWidth || '120px'}">
 		<select md-select value.bind="value" change.delegate="change($event)">
 			<option repeat.for="o of options" model.bind="o.key">${o.value}</option>
 		</select>
diff --git a/src/elements/variant-viewer/variant-viewer.ts b/src/elements/variant-viewer/variant-viewer.ts
index 5549d09..05df4de 100644
--- a/src/elements/variant-viewer/variant-viewer.ts
+++ b/src/elements/variant-viewer/variant-viewer.ts
@@ -12,6 +12,9 @@ export class VariantViewer {
 	@au.bindable
 	dataType: ClientEditor;
 
+	@au.bindable
+	selectWidth: string = "120px";
+
 	@au.bindable
 	options: ISelectOption[];