Add propertySelect jquery widget

editor/sass/colors.scss

@@ -43,3 +43,7 @@ $workspace-button-color-disabled: #ccc;
 $workspace-button-color-focus: #999;
 $workspace-button-color-hover: #666;
 $workspace-button-color-active: #666;
+
+$propertySelect-button-background: #efefef;
+$propertySelect-button-background-hover: #ddd;
+$propertySelect-button-background-active: #e3e3e3;

editor/sass/jquery.scss

@@ -22,6 +22,9 @@
     font-size: 14px !important;
     font-family: 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
 }
+.ui-widget input {
+    box-shadow: none;
+}
 
 /* jQuery Theme overrides */
 .ui-tabs .ui-tabs-panel {

editor/sass/propertySelect.scss

@@ -0,0 +1,99 @@
+/**
+ * Copyright 2015 IBM Corp.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ **/
+
+.red-ui-propertySelect-container {
+    border: 1px solid $form-input-border-color;
+    border-radius: 4px;
+    height: 34px;
+    display: inline-block;
+    padding: 0;
+    margin: 0;
+    vertical-align: middle;
+    box-sizing: border-box;
+    overflow:hidden;
+
+    input {
+        padding: 0 0 0 1px;
+        margin:0;
+        height: 32px;
+        border:none;
+        border-top-left-radius: 0;
+        border-bottom-left-radius: 0;
+        box-shadow: none;
+        vertical-align: middle;
+    }
+
+    &.red-ui-propertySelect-focus {
+        border-color: $form-input-focus-color !important;
+    }
+
+    a {
+        border-top-left-radius: 4px;
+        border-bottom-left-radius: 4px;
+        padding: 0 1px 0 5px;
+        display:inline-block;
+        background: $propertySelect-button-background;
+        height: 32px;
+        line-height: 32px;
+        vertical-align: middle;
+        color: #555;
+        i {
+            position:relative;
+            top:-3px;
+            margin-right:4px;
+            margin-top: 1px;
+            vertical-align: middle;
+        }
+
+        &:hover {
+            text-decoration: none;
+            background: $propertySelect-button-background-hover;
+        }
+        &:focus {
+            text-decoration: none;
+        }
+        &:active {
+            background: $propertySelect-button-background-active;
+            text-decoration: none;
+        }
+    }
+}
+.red-ui-propertySelect-options {
+    @include component-shadow;
+    position: absolute;
+    border: 1px solid $primary-border-color;
+    background: #fff;
+    z-index: 2000;
+    a {
+        padding: 6px 18px 6px 6px;
+        display: block;
+        border-bottom: 1px solid $secondary-border-color;
+        color: #333;
+        &:hover {
+            text-decoration: none;
+            background: $propertySelect-button-background-hover;
+        }
+        &:focus {
+            text-decoration: none;
+        }
+        &:active {
+            background: $propertySelect-button-background-active;
+            text-decoration: none;
+        }
+
+
+    }
+}

editor/sass/style.scss

@@ -41,6 +41,8 @@
 @import "popover";
 @import "flow";
 
+@import "propertySelect";
+
 @import "dragdrop";
 
 @import "keyboard";