first load

styles/_split_button.scss

@@ -0,0 +1,54 @@
+/***** Split button *****/
+.split-button {
+  display: flex;
+}
+
+.split-button button:hover {
+  @extend .button-primary;
+}
+
+.split-button button {
+  @extend .button;
+  background-color: $brand_color;
+  border: 0;
+  color: $brand_text_color;
+  height: 32px;
+  line-height: 16px;
+  outline-color: $brand_color;
+}
+
+.split-button button:not(:only-child) {
+  &:first-child {
+    [dir="rtl"] & {
+      border-left: 1px solid $brand_text_color;
+      border-top-left-radius: unset;
+      border-bottom-left-radius: unset;
+    }
+
+    [dir="ltr"] & {
+      border-right: 1px solid $brand_text_color;
+      border-top-right-radius: unset;
+      border-bottom-right-radius: unset;
+    }
+  }
+
+  &:last-child {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    width: 26px;
+    min-width: 26px;
+    max-width: 26px;
+    padding: 0;
+
+    [dir="rtl"] & {
+      border-top-right-radius: unset;
+      border-bottom-right-radius: unset;
+    }
+
+    [dir="ltr"] & {
+      border-top-left-radius: unset;
+      border-bottom-left-radius: unset;
+    }
+  }
+}