You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@royale.apache.org by ca...@apache.org on 2018/08/26 13:48:04 UTC

[royale-asjs] branch develop updated: Include all new jewel components styles in all the themes and update styles

This is an automated email from the ASF dual-hosted git repository.

carlosrovira pushed a commit to branch develop
in repository https://gitbox.apache.org/repos/asf/royale-asjs.git


The following commit(s) were added to refs/heads/develop by this push:
     new 7273506  Include all new jewel components styles in all the themes and update styles
7273506 is described below

commit 727350610fe9dbf91459929349dbdcc992ca3c75
Author: Carlos Rovira <ca...@apache.org>
AuthorDate: Sun Aug 26 15:47:58 2018 +0200

    Include all new jewel components styles in all the themes and update styles
---
 .../src/main/resources/defaults.css                | 270 +++++++++++++++++++++
 .../src/main/sass/defaults.sass                    |  10 +-
 .../src/main/resources/defaults.css                | 270 +++++++++++++++++++++
 .../src/main/sass/defaults.sass                    |  10 +-
 .../src/main/resources/defaults.css                | 270 +++++++++++++++++++++
 .../src/main/sass/defaults.sass                    |  10 +-
 .../src/main/resources/defaults.css                | 270 +++++++++++++++++++++
 .../src/main/sass/defaults.sass                    |  10 +-
 .../src/main/resources/defaults.css                | 270 +++++++++++++++++++++
 .../src/main/sass/defaults.sass                    |  10 +-
 .../src/main/resources/defaults.css                | 270 +++++++++++++++++++++
 .../src/main/sass/defaults.sass                    |  10 +-
 .../src/main/resources/defaults.css                | 270 +++++++++++++++++++++
 .../src/main/sass/defaults.sass                    |  10 +-
 .../src/main/resources/defaults.css                | 270 +++++++++++++++++++++
 .../src/main/sass/defaults.sass                    |  10 +-
 .../src/main/resources/defaults.css                | 270 +++++++++++++++++++++
 .../src/main/sass/defaults.sass                    |  10 +-
 .../src/main/resources/defaults.css                | 270 +++++++++++++++++++++
 .../src/main/sass/defaults.sass                    |  10 +-
 .../src/main/resources/defaults.css                | 270 +++++++++++++++++++++
 .../src/main/sass/defaults.sass                    |  10 +-
 .../src/main/resources/defaults.css                | 270 +++++++++++++++++++++
 .../src/main/sass/defaults.sass                    |  10 +-
 .../src/main/resources/defaults.css                | 269 ++++++++++++++++++++
 .../src/main/sass/defaults.sass                    |  10 +-
 .../src/main/resources/defaults.css                | 269 ++++++++++++++++++++
 .../src/main/sass/defaults.sass                    |  10 +-
 .../src/main/resources/defaults.css                | 269 ++++++++++++++++++++
 .../src/main/sass/defaults.sass                    |  10 +-
 .../src/main/resources/defaults.css                | 269 ++++++++++++++++++++
 .../src/main/sass/defaults.sass                    |  10 +-
 .../src/main/resources/defaults.css                | 269 ++++++++++++++++++++
 .../src/main/sass/defaults.sass                    |  10 +-
 .../src/main/resources/defaults.css                | 269 ++++++++++++++++++++
 .../src/main/sass/defaults.sass                    |  10 +-
 .../src/main/resources/defaults.css                | 269 ++++++++++++++++++++
 .../src/main/sass/defaults.sass                    |  10 +-
 .../src/main/resources/defaults.css                | 269 ++++++++++++++++++++
 .../src/main/sass/defaults.sass                    |  10 +-
 .../src/main/resources/defaults.css                | 269 ++++++++++++++++++++
 .../src/main/sass/defaults.sass                    |  10 +-
 .../src/main/resources/defaults.css                | 269 ++++++++++++++++++++
 .../src/main/sass/defaults.sass                    |  10 +-
 .../src/main/resources/defaults.css                | 269 ++++++++++++++++++++
 .../src/main/sass/defaults.sass                    |  10 +-
 .../src/main/resources/defaults.css                | 269 ++++++++++++++++++++
 .../src/main/sass/defaults.sass                    |  10 +-
 48 files changed, 6684 insertions(+), 24 deletions(-)

diff --git a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Amethyst-Theme/src/main/resources/defaults.css b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Amethyst-Theme/src/main/resources/defaults.css
index 824e500..5ea0ba9 100644
--- a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Amethyst-Theme/src/main/resources/defaults.css
+++ b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Amethyst-Theme/src/main/resources/defaults.css
@@ -234,6 +234,81 @@ j|Card {
   font-size: 16px;
 }
 
+.jewel.datechooser .jewel.table {
+  background: #8c8c8c;
+  border: 1px solid #595959;
+  border-radius: 0.25rem;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.button {
+  background: transparent;
+  border: none;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow {
+  border-bottom: 1px solid #595959;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton {
+  border-radius: 50%;
+  color: transparent;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:hover, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:hover {
+  background: #737373;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:active, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:active {
+  background: #666666;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background-size: 40%;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell {
+  background: #8c8c8c;
+  box-shadow: none;
+  border-left: 0px;
+}
+.jewel.datechooser .jewel.table .jewel.tablecell {
+  border-top: 0px;
+  border-left: 0px;
+  padding: 4px;
+}
+
+.calendar.item {
+  font-size: 1em;
+}
+.calendar.item.dayName {
+  font-weight: 600;
+}
+.calendar.item.date {
+  color: grey;
+}
+
+.jewel.datefield .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+.jewel.datefield .jewel.button {
+  color: transparent;
+  border-bottom-left-radius: 0px;
+  border-top-left-radius: 0px;
+  border-left: 0px;
+}
+.jewel.datefield .jewel.button::after {
+  background-size: 66%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 22 22' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M18.3333333,2.75 L17.4166667,2.75 L17.4166667,0.916666667 L15.5833333,0.916666667 L15.5833333,2.75 L6.41666667,2.75 L6.41666667,0.916666667 L4.58333333,0.916666667 L4.58333333,2.75 L3.66666667,2.75 C2.65833333,2.75 1.83333333,3.575 1.83333 [...]
+}
+
+.jewel.divider {
+  border-bottom-color: #595959;
+  border-bottom-width: 1px;
+  border-bottom-style: solid;
+}
+
 .jewel.drawer.float {
   color: rgba(0, 0, 0, 0.8);
 }
@@ -281,6 +356,62 @@ j|Card {
   padding: 16px;
 }
 
+.jewel.dropdownlist {
+  cursor: pointer;
+  display: inline-block;
+  margin: 0;
+  padding: 10px 16px;
+  min-width: 74px;
+  min-height: 34px;
+  background: linear-gradient(#666666, #4c4c4c);
+  border: 1px solid #333333;
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  border-radius: 3px;
+  font-family: "Lato", sans-serif;
+  font-size: 1em;
+  font-weight: bold;
+  color: #FFFFFF;
+  text-transform: uppercase;
+  text-decoration: none;
+  text-shadow: 0 -1px 0 rgba(13, 13, 13, 0.7);
+}
+.jewel.dropdownlist:hover, .jewel.dropdownlist:hover:focus {
+  background: linear-gradient(#595959, #404040);
+  border: 1px solid #262626;
+}
+.jewel.dropdownlist:active, .jewel.dropdownlist:active:focus {
+  background: linear-gradient(#404040, #262626);
+  border: 1px solid #0d0d0d;
+  box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+.jewel.dropdownlist:focus {
+  outline: none;
+  border: 1px solid #333333;
+  box-shadow: inset 0px 0px 0px 1px rgba(217, 217, 217, 0.5), inset 0 1px 0 rgba(229, 229, 229, 0.6);
+}
+.jewel.dropdownlist[disabled] {
+  cursor: unset;
+  background: #404040;
+  border: 1px solid #0d0d0d;
+  box-shadow: none;
+  color: #737373;
+  font-weight: 400;
+  text-shadow: unset;
+}
+
+.fonticon.dark {
+  color: #676767;
+}
+.fonticon.dark.inactive {
+  color: rgba(128, 128, 128, 0.3);
+}
+.fonticon.light {
+  color: white;
+}
+.fonticon.light.inactive {
+  color: rgba(255, 255, 255, 0.5);
+}
+
 .jewel.item {
   padding: 8px;
 }
@@ -320,6 +451,57 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.navigation {
+  background-color: #ffffff;
+}
+
+.jewel.numericstepper .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+
+@media (max-width: 992px) {
+  .jewel.numericstepper .jewel.textinput input {
+    border-radius: 0;
+  }
+}
+.jewel.spinner {
+  width: 34px;
+}
+.jewel.spinner .jewel.button {
+  padding: 0px;
+  height: 19px;
+  color: transparent;
+  border-radius: 0 0.25rem 0.25rem 0;
+  border-left: 0px;
+}
+.jewel.spinner .jewel.button.up {
+  border-bottom-right-radius: 0px;
+}
+.jewel.spinner .jewel.button.up::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23FFFFFF' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") no-repeat center center;
+}
+.jewel.spinner .jewel.button.down {
+  border-top-right-radius: 0px;
+  border-top-style: groove;
+}
+.jewel.spinner .jewel.button.down::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23FFFFFF' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon transform='translate(8.000000, 4.705000) scale(1, -1) translate(-8.000000, -4.705000) ' points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g [...]
+}
+
+@media (max-width: 992px) {
+  .jewel.spinner .jewel.button.up {
+    border: 1px solid #333333;
+    border-radius: 0.25rem 0 0 0.25rem;
+  }
+  .jewel.spinner .jewel.button.down {
+    border: 1px solid #333333;
+    border-radius: 0 0.25rem 0.25rem 0;
+    border-top-style: solid;
+  }
+}
 .jewel.radiobutton input + span::before {
   background: linear-gradient(#7f7f7f, #737373);
   border: 1px solid #333333;
@@ -435,6 +617,89 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.simpletable {
+  background: linear-gradient(#7f7f7f, #737373);
+  border: 1px solid #333333;
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  border-radius: 0.25rem;
+}
+.jewel.simpletable .jewel.thead tr {
+  border-bottom: 1px solid #595959;
+}
+.jewel.simpletable .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tableheadercell {
+  background: linear-gradient(#7f7f7f, #737373);
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #FFFFFF;
+  border-left: 1px solid #595959;
+}
+.jewel.simpletable .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tablecell {
+  border-top: 1px solid #595959;
+  border-left: 1px solid #595959;
+}
+.jewel.simpletable .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(#7f7f7f, #8c8c8c);
+  box-shadow: inset 0 1px 0 #a6a6a6;
+}
+
+.jewel.table {
+  background: linear-gradient(#7f7f7f, #737373);
+  border: 1px solid #333333;
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  border-radius: 0.25rem;
+}
+.jewel.table .jewel.thead tr {
+  border-bottom: 1px solid #595959;
+}
+.jewel.table .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tableheadercell {
+  background: linear-gradient(#7f7f7f, #737373);
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #FFFFFF;
+  border-left: 1px solid #595959;
+}
+.jewel.table .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tablecell {
+  border-top: 1px solid #595959;
+  border-left: 1px solid #595959;
+}
+.jewel.table .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(#7f7f7f, #8c8c8c);
+  box-shadow: inset 0 1px 0 #a6a6a6;
+}
+
+.jewel.tableitem {
+  cursor: auto;
+}
+.jewel.tableitem.selectable {
+  cursor: pointer;
+}
+.jewel.tableitem.hovered:hover {
+  color: #FFFFFF;
+  background: #C92CC6;
+}
+.jewel.tableitem.selected, .jewel.tableitem.selectable:active {
+  color: #FFFFFF;
+  background: #b427b1;
+}
+
 .jewel.textinput {
   font-weight: 400;
   color: #FFFFFF;
@@ -540,4 +805,9 @@ j|Card {
   padding-right: 0;
 }
 
+.jewel.togglebutton .fonticon {
+  margin-left: 0px;
+  margin-right: 8px;
+}
+
 /*# sourceMappingURL=defaults.css.map */
diff --git a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Amethyst-Theme/src/main/sass/defaults.sass b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Amethyst-Theme/src/main/sass/defaults.sass
index 94cebd3..c8f87c5 100644
--- a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Amethyst-Theme/src/main/sass/defaults.sass
+++ b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Amethyst-Theme/src/main/sass/defaults.sass
@@ -31,13 +31,21 @@
 @import "../../../../JewelTheme/src/main/sass/components-primary/card"
 @import "../../../../JewelTheme/src/main/sass/components-primary/checkbox"
 @import "../../../../JewelTheme/src/main/sass/components-primary/controlbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datechooser"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datefield"
+@import "../../../../JewelTheme/src/main/sass/components-primary/divider"
 @import "../../../../JewelTheme/src/main/sass/components-primary/drawer"
+@import "../../../../JewelTheme/src/main/sass/components-primary/dropdownlist"
+@import "../../../../JewelTheme/src/main/sass/components-primary/icons"
 @import "../../../../JewelTheme/src/main/sass/components-primary/itemRenderer"
 @import "../../../../JewelTheme/src/main/sass/components-primary/label"
 @import "../../../../JewelTheme/src/main/sass/components-primary/list"
+@import "../../../../JewelTheme/src/main/sass/components-primary/navigation"
+@import "../../../../JewelTheme/src/main/sass/components-primary/numericstepper"
 @import "../../../../JewelTheme/src/main/sass/components-primary/radiobutton"
 @import "../../../../JewelTheme/src/main/sass/components-primary/slider"
-
+@import "../../../../JewelTheme/src/main/sass/components-primary/table"
 @import "../../../../JewelTheme/src/main/sass/components-primary/textinput"
 @import "../../../../JewelTheme/src/main/sass/components-primary/titlebar"
 @import "../../../../JewelTheme/src/main/sass/components-primary/topappbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/togglebutton"
diff --git a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Blue-Theme/src/main/resources/defaults.css b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Blue-Theme/src/main/resources/defaults.css
index e2544fa..de7c552 100644
--- a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Blue-Theme/src/main/resources/defaults.css
+++ b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Blue-Theme/src/main/resources/defaults.css
@@ -234,6 +234,81 @@ j|Card {
   font-size: 16px;
 }
 
+.jewel.datechooser .jewel.table {
+  background: #8c8c8c;
+  border: 1px solid #595959;
+  border-radius: 0.25rem;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.button {
+  background: transparent;
+  border: none;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow {
+  border-bottom: 1px solid #595959;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton {
+  border-radius: 50%;
+  color: transparent;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:hover, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:hover {
+  background: #737373;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:active, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:active {
+  background: #666666;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background-size: 40%;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell {
+  background: #8c8c8c;
+  box-shadow: none;
+  border-left: 0px;
+}
+.jewel.datechooser .jewel.table .jewel.tablecell {
+  border-top: 0px;
+  border-left: 0px;
+  padding: 4px;
+}
+
+.calendar.item {
+  font-size: 1em;
+}
+.calendar.item.dayName {
+  font-weight: 600;
+}
+.calendar.item.date {
+  color: grey;
+}
+
+.jewel.datefield .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+.jewel.datefield .jewel.button {
+  color: transparent;
+  border-bottom-left-radius: 0px;
+  border-top-left-radius: 0px;
+  border-left: 0px;
+}
+.jewel.datefield .jewel.button::after {
+  background-size: 66%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 22 22' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M18.3333333,2.75 L17.4166667,2.75 L17.4166667,0.916666667 L15.5833333,0.916666667 L15.5833333,2.75 L6.41666667,2.75 L6.41666667,0.916666667 L4.58333333,0.916666667 L4.58333333,2.75 L3.66666667,2.75 C2.65833333,2.75 1.83333333,3.575 1.83333 [...]
+}
+
+.jewel.divider {
+  border-bottom-color: #595959;
+  border-bottom-width: 1px;
+  border-bottom-style: solid;
+}
+
 .jewel.drawer.float {
   color: rgba(0, 0, 0, 0.8);
 }
@@ -281,6 +356,62 @@ j|Card {
   padding: 16px;
 }
 
+.jewel.dropdownlist {
+  cursor: pointer;
+  display: inline-block;
+  margin: 0;
+  padding: 10px 16px;
+  min-width: 74px;
+  min-height: 34px;
+  background: linear-gradient(#666666, #4c4c4c);
+  border: 1px solid #333333;
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  border-radius: 3px;
+  font-family: "Lato", sans-serif;
+  font-size: 1em;
+  font-weight: bold;
+  color: #FFFFFF;
+  text-transform: uppercase;
+  text-decoration: none;
+  text-shadow: 0 -1px 0 rgba(13, 13, 13, 0.7);
+}
+.jewel.dropdownlist:hover, .jewel.dropdownlist:hover:focus {
+  background: linear-gradient(#595959, #404040);
+  border: 1px solid #262626;
+}
+.jewel.dropdownlist:active, .jewel.dropdownlist:active:focus {
+  background: linear-gradient(#404040, #262626);
+  border: 1px solid #0d0d0d;
+  box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+.jewel.dropdownlist:focus {
+  outline: none;
+  border: 1px solid #333333;
+  box-shadow: inset 0px 0px 0px 1px rgba(217, 217, 217, 0.5), inset 0 1px 0 rgba(229, 229, 229, 0.6);
+}
+.jewel.dropdownlist[disabled] {
+  cursor: unset;
+  background: #404040;
+  border: 1px solid #0d0d0d;
+  box-shadow: none;
+  color: #737373;
+  font-weight: 400;
+  text-shadow: unset;
+}
+
+.fonticon.dark {
+  color: #676767;
+}
+.fonticon.dark.inactive {
+  color: rgba(128, 128, 128, 0.3);
+}
+.fonticon.light {
+  color: white;
+}
+.fonticon.light.inactive {
+  color: rgba(255, 255, 255, 0.5);
+}
+
 .jewel.item {
   padding: 8px;
 }
@@ -320,6 +451,57 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.navigation {
+  background-color: #ffffff;
+}
+
+.jewel.numericstepper .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+
+@media (max-width: 992px) {
+  .jewel.numericstepper .jewel.textinput input {
+    border-radius: 0;
+  }
+}
+.jewel.spinner {
+  width: 34px;
+}
+.jewel.spinner .jewel.button {
+  padding: 0px;
+  height: 19px;
+  color: transparent;
+  border-radius: 0 0.25rem 0.25rem 0;
+  border-left: 0px;
+}
+.jewel.spinner .jewel.button.up {
+  border-bottom-right-radius: 0px;
+}
+.jewel.spinner .jewel.button.up::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23FFFFFF' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") no-repeat center center;
+}
+.jewel.spinner .jewel.button.down {
+  border-top-right-radius: 0px;
+  border-top-style: groove;
+}
+.jewel.spinner .jewel.button.down::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23FFFFFF' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon transform='translate(8.000000, 4.705000) scale(1, -1) translate(-8.000000, -4.705000) ' points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g [...]
+}
+
+@media (max-width: 992px) {
+  .jewel.spinner .jewel.button.up {
+    border: 1px solid #333333;
+    border-radius: 0.25rem 0 0 0.25rem;
+  }
+  .jewel.spinner .jewel.button.down {
+    border: 1px solid #333333;
+    border-radius: 0 0.25rem 0.25rem 0;
+    border-top-style: solid;
+  }
+}
 .jewel.radiobutton input + span::before {
   background: linear-gradient(#7f7f7f, #737373);
   border: 1px solid #333333;
@@ -435,6 +617,89 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.simpletable {
+  background: linear-gradient(#7f7f7f, #737373);
+  border: 1px solid #333333;
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  border-radius: 0.25rem;
+}
+.jewel.simpletable .jewel.thead tr {
+  border-bottom: 1px solid #595959;
+}
+.jewel.simpletable .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tableheadercell {
+  background: linear-gradient(#7f7f7f, #737373);
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #FFFFFF;
+  border-left: 1px solid #595959;
+}
+.jewel.simpletable .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tablecell {
+  border-top: 1px solid #595959;
+  border-left: 1px solid #595959;
+}
+.jewel.simpletable .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(#7f7f7f, #8c8c8c);
+  box-shadow: inset 0 1px 0 #a6a6a6;
+}
+
+.jewel.table {
+  background: linear-gradient(#7f7f7f, #737373);
+  border: 1px solid #333333;
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  border-radius: 0.25rem;
+}
+.jewel.table .jewel.thead tr {
+  border-bottom: 1px solid #595959;
+}
+.jewel.table .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tableheadercell {
+  background: linear-gradient(#7f7f7f, #737373);
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #FFFFFF;
+  border-left: 1px solid #595959;
+}
+.jewel.table .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tablecell {
+  border-top: 1px solid #595959;
+  border-left: 1px solid #595959;
+}
+.jewel.table .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(#7f7f7f, #8c8c8c);
+  box-shadow: inset 0 1px 0 #a6a6a6;
+}
+
+.jewel.tableitem {
+  cursor: auto;
+}
+.jewel.tableitem.selectable {
+  cursor: pointer;
+}
+.jewel.tableitem.hovered:hover {
+  color: #FFFFFF;
+  background: #3CADF1;
+}
+.jewel.tableitem.selected, .jewel.tableitem.selectable:active {
+  color: #FFFFFF;
+  background: #24a3ef;
+}
+
 .jewel.textinput {
   font-weight: 400;
   color: #FFFFFF;
@@ -540,4 +805,9 @@ j|Card {
   padding-right: 0;
 }
 
+.jewel.togglebutton .fonticon {
+  margin-left: 0px;
+  margin-right: 8px;
+}
+
 /*# sourceMappingURL=defaults.css.map */
diff --git a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Blue-Theme/src/main/sass/defaults.sass b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Blue-Theme/src/main/sass/defaults.sass
index 94cebd3..c8f87c5 100644
--- a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Blue-Theme/src/main/sass/defaults.sass
+++ b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Blue-Theme/src/main/sass/defaults.sass
@@ -31,13 +31,21 @@
 @import "../../../../JewelTheme/src/main/sass/components-primary/card"
 @import "../../../../JewelTheme/src/main/sass/components-primary/checkbox"
 @import "../../../../JewelTheme/src/main/sass/components-primary/controlbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datechooser"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datefield"
+@import "../../../../JewelTheme/src/main/sass/components-primary/divider"
 @import "../../../../JewelTheme/src/main/sass/components-primary/drawer"
+@import "../../../../JewelTheme/src/main/sass/components-primary/dropdownlist"
+@import "../../../../JewelTheme/src/main/sass/components-primary/icons"
 @import "../../../../JewelTheme/src/main/sass/components-primary/itemRenderer"
 @import "../../../../JewelTheme/src/main/sass/components-primary/label"
 @import "../../../../JewelTheme/src/main/sass/components-primary/list"
+@import "../../../../JewelTheme/src/main/sass/components-primary/navigation"
+@import "../../../../JewelTheme/src/main/sass/components-primary/numericstepper"
 @import "../../../../JewelTheme/src/main/sass/components-primary/radiobutton"
 @import "../../../../JewelTheme/src/main/sass/components-primary/slider"
-
+@import "../../../../JewelTheme/src/main/sass/components-primary/table"
 @import "../../../../JewelTheme/src/main/sass/components-primary/textinput"
 @import "../../../../JewelTheme/src/main/sass/components-primary/titlebar"
 @import "../../../../JewelTheme/src/main/sass/components-primary/topappbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/togglebutton"
diff --git a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Emerald-Theme/src/main/resources/defaults.css b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Emerald-Theme/src/main/resources/defaults.css
index cc9480a..23101a9 100644
--- a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Emerald-Theme/src/main/resources/defaults.css
+++ b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Emerald-Theme/src/main/resources/defaults.css
@@ -234,6 +234,81 @@ j|Card {
   font-size: 16px;
 }
 
+.jewel.datechooser .jewel.table {
+  background: #8c8c8c;
+  border: 1px solid #595959;
+  border-radius: 0.25rem;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.button {
+  background: transparent;
+  border: none;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow {
+  border-bottom: 1px solid #595959;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton {
+  border-radius: 50%;
+  color: transparent;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:hover, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:hover {
+  background: #737373;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:active, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:active {
+  background: #666666;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background-size: 40%;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell {
+  background: #8c8c8c;
+  box-shadow: none;
+  border-left: 0px;
+}
+.jewel.datechooser .jewel.table .jewel.tablecell {
+  border-top: 0px;
+  border-left: 0px;
+  padding: 4px;
+}
+
+.calendar.item {
+  font-size: 1em;
+}
+.calendar.item.dayName {
+  font-weight: 600;
+}
+.calendar.item.date {
+  color: grey;
+}
+
+.jewel.datefield .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+.jewel.datefield .jewel.button {
+  color: transparent;
+  border-bottom-left-radius: 0px;
+  border-top-left-radius: 0px;
+  border-left: 0px;
+}
+.jewel.datefield .jewel.button::after {
+  background-size: 66%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 22 22' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M18.3333333,2.75 L17.4166667,2.75 L17.4166667,0.916666667 L15.5833333,0.916666667 L15.5833333,2.75 L6.41666667,2.75 L6.41666667,0.916666667 L4.58333333,0.916666667 L4.58333333,2.75 L3.66666667,2.75 C2.65833333,2.75 1.83333333,3.575 1.83333 [...]
+}
+
+.jewel.divider {
+  border-bottom-color: #595959;
+  border-bottom-width: 1px;
+  border-bottom-style: solid;
+}
+
 .jewel.drawer.float {
   color: rgba(0, 0, 0, 0.8);
 }
@@ -281,6 +356,62 @@ j|Card {
   padding: 16px;
 }
 
+.jewel.dropdownlist {
+  cursor: pointer;
+  display: inline-block;
+  margin: 0;
+  padding: 10px 16px;
+  min-width: 74px;
+  min-height: 34px;
+  background: linear-gradient(#666666, #4c4c4c);
+  border: 1px solid #333333;
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  border-radius: 3px;
+  font-family: "Lato", sans-serif;
+  font-size: 1em;
+  font-weight: bold;
+  color: #FFFFFF;
+  text-transform: uppercase;
+  text-decoration: none;
+  text-shadow: 0 -1px 0 rgba(13, 13, 13, 0.7);
+}
+.jewel.dropdownlist:hover, .jewel.dropdownlist:hover:focus {
+  background: linear-gradient(#595959, #404040);
+  border: 1px solid #262626;
+}
+.jewel.dropdownlist:active, .jewel.dropdownlist:active:focus {
+  background: linear-gradient(#404040, #262626);
+  border: 1px solid #0d0d0d;
+  box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+.jewel.dropdownlist:focus {
+  outline: none;
+  border: 1px solid #333333;
+  box-shadow: inset 0px 0px 0px 1px rgba(217, 217, 217, 0.5), inset 0 1px 0 rgba(229, 229, 229, 0.6);
+}
+.jewel.dropdownlist[disabled] {
+  cursor: unset;
+  background: #404040;
+  border: 1px solid #0d0d0d;
+  box-shadow: none;
+  color: #737373;
+  font-weight: 400;
+  text-shadow: unset;
+}
+
+.fonticon.dark {
+  color: #676767;
+}
+.fonticon.dark.inactive {
+  color: rgba(128, 128, 128, 0.3);
+}
+.fonticon.light {
+  color: white;
+}
+.fonticon.light.inactive {
+  color: rgba(255, 255, 255, 0.5);
+}
+
 .jewel.item {
   padding: 8px;
 }
@@ -320,6 +451,57 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.navigation {
+  background-color: #ffffff;
+}
+
+.jewel.numericstepper .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+
+@media (max-width: 992px) {
+  .jewel.numericstepper .jewel.textinput input {
+    border-radius: 0;
+  }
+}
+.jewel.spinner {
+  width: 34px;
+}
+.jewel.spinner .jewel.button {
+  padding: 0px;
+  height: 19px;
+  color: transparent;
+  border-radius: 0 0.25rem 0.25rem 0;
+  border-left: 0px;
+}
+.jewel.spinner .jewel.button.up {
+  border-bottom-right-radius: 0px;
+}
+.jewel.spinner .jewel.button.up::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23FFFFFF' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") no-repeat center center;
+}
+.jewel.spinner .jewel.button.down {
+  border-top-right-radius: 0px;
+  border-top-style: groove;
+}
+.jewel.spinner .jewel.button.down::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23FFFFFF' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon transform='translate(8.000000, 4.705000) scale(1, -1) translate(-8.000000, -4.705000) ' points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g [...]
+}
+
+@media (max-width: 992px) {
+  .jewel.spinner .jewel.button.up {
+    border: 1px solid #333333;
+    border-radius: 0.25rem 0 0 0.25rem;
+  }
+  .jewel.spinner .jewel.button.down {
+    border: 1px solid #333333;
+    border-radius: 0 0.25rem 0.25rem 0;
+    border-top-style: solid;
+  }
+}
 .jewel.radiobutton input + span::before {
   background: linear-gradient(#7f7f7f, #737373);
   border: 1px solid #333333;
@@ -435,6 +617,89 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.simpletable {
+  background: linear-gradient(#7f7f7f, #737373);
+  border: 1px solid #333333;
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  border-radius: 0.25rem;
+}
+.jewel.simpletable .jewel.thead tr {
+  border-bottom: 1px solid #595959;
+}
+.jewel.simpletable .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tableheadercell {
+  background: linear-gradient(#7f7f7f, #737373);
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #FFFFFF;
+  border-left: 1px solid #595959;
+}
+.jewel.simpletable .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tablecell {
+  border-top: 1px solid #595959;
+  border-left: 1px solid #595959;
+}
+.jewel.simpletable .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(#7f7f7f, #8c8c8c);
+  box-shadow: inset 0 1px 0 #a6a6a6;
+}
+
+.jewel.table {
+  background: linear-gradient(#7f7f7f, #737373);
+  border: 1px solid #333333;
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  border-radius: 0.25rem;
+}
+.jewel.table .jewel.thead tr {
+  border-bottom: 1px solid #595959;
+}
+.jewel.table .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tableheadercell {
+  background: linear-gradient(#7f7f7f, #737373);
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #FFFFFF;
+  border-left: 1px solid #595959;
+}
+.jewel.table .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tablecell {
+  border-top: 1px solid #595959;
+  border-left: 1px solid #595959;
+}
+.jewel.table .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(#7f7f7f, #8c8c8c);
+  box-shadow: inset 0 1px 0 #a6a6a6;
+}
+
+.jewel.tableitem {
+  cursor: auto;
+}
+.jewel.tableitem.selectable {
+  cursor: pointer;
+}
+.jewel.tableitem.hovered:hover {
+  color: #FFFFFF;
+  background: #8CC63C;
+}
+.jewel.tableitem.selected, .jewel.tableitem.selectable:active {
+  color: #FFFFFF;
+  background: #7eb435;
+}
+
 .jewel.textinput {
   font-weight: 400;
   color: #FFFFFF;
@@ -540,4 +805,9 @@ j|Card {
   padding-right: 0;
 }
 
+.jewel.togglebutton .fonticon {
+  margin-left: 0px;
+  margin-right: 8px;
+}
+
 /*# sourceMappingURL=defaults.css.map */
diff --git a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Emerald-Theme/src/main/sass/defaults.sass b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Emerald-Theme/src/main/sass/defaults.sass
index 94cebd3..c8f87c5 100644
--- a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Emerald-Theme/src/main/sass/defaults.sass
+++ b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Emerald-Theme/src/main/sass/defaults.sass
@@ -31,13 +31,21 @@
 @import "../../../../JewelTheme/src/main/sass/components-primary/card"
 @import "../../../../JewelTheme/src/main/sass/components-primary/checkbox"
 @import "../../../../JewelTheme/src/main/sass/components-primary/controlbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datechooser"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datefield"
+@import "../../../../JewelTheme/src/main/sass/components-primary/divider"
 @import "../../../../JewelTheme/src/main/sass/components-primary/drawer"
+@import "../../../../JewelTheme/src/main/sass/components-primary/dropdownlist"
+@import "../../../../JewelTheme/src/main/sass/components-primary/icons"
 @import "../../../../JewelTheme/src/main/sass/components-primary/itemRenderer"
 @import "../../../../JewelTheme/src/main/sass/components-primary/label"
 @import "../../../../JewelTheme/src/main/sass/components-primary/list"
+@import "../../../../JewelTheme/src/main/sass/components-primary/navigation"
+@import "../../../../JewelTheme/src/main/sass/components-primary/numericstepper"
 @import "../../../../JewelTheme/src/main/sass/components-primary/radiobutton"
 @import "../../../../JewelTheme/src/main/sass/components-primary/slider"
-
+@import "../../../../JewelTheme/src/main/sass/components-primary/table"
 @import "../../../../JewelTheme/src/main/sass/components-primary/textinput"
 @import "../../../../JewelTheme/src/main/sass/components-primary/titlebar"
 @import "../../../../JewelTheme/src/main/sass/components-primary/topappbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/togglebutton"
diff --git a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Green-Theme/src/main/resources/defaults.css b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Green-Theme/src/main/resources/defaults.css
index 58ebdfb..245ec6b 100644
--- a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Green-Theme/src/main/resources/defaults.css
+++ b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Green-Theme/src/main/resources/defaults.css
@@ -234,6 +234,81 @@ j|Card {
   font-size: 16px;
 }
 
+.jewel.datechooser .jewel.table {
+  background: #8c8c8c;
+  border: 1px solid #595959;
+  border-radius: 0.25rem;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.button {
+  background: transparent;
+  border: none;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow {
+  border-bottom: 1px solid #595959;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton {
+  border-radius: 50%;
+  color: transparent;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:hover, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:hover {
+  background: #737373;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:active, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:active {
+  background: #666666;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background-size: 40%;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell {
+  background: #8c8c8c;
+  box-shadow: none;
+  border-left: 0px;
+}
+.jewel.datechooser .jewel.table .jewel.tablecell {
+  border-top: 0px;
+  border-left: 0px;
+  padding: 4px;
+}
+
+.calendar.item {
+  font-size: 1em;
+}
+.calendar.item.dayName {
+  font-weight: 600;
+}
+.calendar.item.date {
+  color: grey;
+}
+
+.jewel.datefield .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+.jewel.datefield .jewel.button {
+  color: transparent;
+  border-bottom-left-radius: 0px;
+  border-top-left-radius: 0px;
+  border-left: 0px;
+}
+.jewel.datefield .jewel.button::after {
+  background-size: 66%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 22 22' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M18.3333333,2.75 L17.4166667,2.75 L17.4166667,0.916666667 L15.5833333,0.916666667 L15.5833333,2.75 L6.41666667,2.75 L6.41666667,0.916666667 L4.58333333,0.916666667 L4.58333333,2.75 L3.66666667,2.75 C2.65833333,2.75 1.83333333,3.575 1.83333 [...]
+}
+
+.jewel.divider {
+  border-bottom-color: #595959;
+  border-bottom-width: 1px;
+  border-bottom-style: solid;
+}
+
 .jewel.drawer.float {
   color: rgba(0, 0, 0, 0.8);
 }
@@ -281,6 +356,62 @@ j|Card {
   padding: 16px;
 }
 
+.jewel.dropdownlist {
+  cursor: pointer;
+  display: inline-block;
+  margin: 0;
+  padding: 10px 16px;
+  min-width: 74px;
+  min-height: 34px;
+  background: linear-gradient(#666666, #4c4c4c);
+  border: 1px solid #333333;
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  border-radius: 3px;
+  font-family: "Lato", sans-serif;
+  font-size: 1em;
+  font-weight: bold;
+  color: #FFFFFF;
+  text-transform: uppercase;
+  text-decoration: none;
+  text-shadow: 0 -1px 0 rgba(13, 13, 13, 0.7);
+}
+.jewel.dropdownlist:hover, .jewel.dropdownlist:hover:focus {
+  background: linear-gradient(#595959, #404040);
+  border: 1px solid #262626;
+}
+.jewel.dropdownlist:active, .jewel.dropdownlist:active:focus {
+  background: linear-gradient(#404040, #262626);
+  border: 1px solid #0d0d0d;
+  box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+.jewel.dropdownlist:focus {
+  outline: none;
+  border: 1px solid #333333;
+  box-shadow: inset 0px 0px 0px 1px rgba(217, 217, 217, 0.5), inset 0 1px 0 rgba(229, 229, 229, 0.6);
+}
+.jewel.dropdownlist[disabled] {
+  cursor: unset;
+  background: #404040;
+  border: 1px solid #0d0d0d;
+  box-shadow: none;
+  color: #737373;
+  font-weight: 400;
+  text-shadow: unset;
+}
+
+.fonticon.dark {
+  color: #676767;
+}
+.fonticon.dark.inactive {
+  color: rgba(128, 128, 128, 0.3);
+}
+.fonticon.light {
+  color: white;
+}
+.fonticon.light.inactive {
+  color: rgba(255, 255, 255, 0.5);
+}
+
 .jewel.item {
   padding: 8px;
 }
@@ -320,6 +451,57 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.navigation {
+  background-color: #ffffff;
+}
+
+.jewel.numericstepper .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+
+@media (max-width: 992px) {
+  .jewel.numericstepper .jewel.textinput input {
+    border-radius: 0;
+  }
+}
+.jewel.spinner {
+  width: 34px;
+}
+.jewel.spinner .jewel.button {
+  padding: 0px;
+  height: 19px;
+  color: transparent;
+  border-radius: 0 0.25rem 0.25rem 0;
+  border-left: 0px;
+}
+.jewel.spinner .jewel.button.up {
+  border-bottom-right-radius: 0px;
+}
+.jewel.spinner .jewel.button.up::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23FFFFFF' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") no-repeat center center;
+}
+.jewel.spinner .jewel.button.down {
+  border-top-right-radius: 0px;
+  border-top-style: groove;
+}
+.jewel.spinner .jewel.button.down::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23FFFFFF' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon transform='translate(8.000000, 4.705000) scale(1, -1) translate(-8.000000, -4.705000) ' points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g [...]
+}
+
+@media (max-width: 992px) {
+  .jewel.spinner .jewel.button.up {
+    border: 1px solid #333333;
+    border-radius: 0.25rem 0 0 0.25rem;
+  }
+  .jewel.spinner .jewel.button.down {
+    border: 1px solid #333333;
+    border-radius: 0 0.25rem 0.25rem 0;
+    border-top-style: solid;
+  }
+}
 .jewel.radiobutton input + span::before {
   background: linear-gradient(#7f7f7f, #737373);
   border: 1px solid #333333;
@@ -435,6 +617,89 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.simpletable {
+  background: linear-gradient(#7f7f7f, #737373);
+  border: 1px solid #333333;
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  border-radius: 0.25rem;
+}
+.jewel.simpletable .jewel.thead tr {
+  border-bottom: 1px solid #595959;
+}
+.jewel.simpletable .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tableheadercell {
+  background: linear-gradient(#7f7f7f, #737373);
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #FFFFFF;
+  border-left: 1px solid #595959;
+}
+.jewel.simpletable .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tablecell {
+  border-top: 1px solid #595959;
+  border-left: 1px solid #595959;
+}
+.jewel.simpletable .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(#7f7f7f, #8c8c8c);
+  box-shadow: inset 0 1px 0 #a6a6a6;
+}
+
+.jewel.table {
+  background: linear-gradient(#7f7f7f, #737373);
+  border: 1px solid #333333;
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  border-radius: 0.25rem;
+}
+.jewel.table .jewel.thead tr {
+  border-bottom: 1px solid #595959;
+}
+.jewel.table .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tableheadercell {
+  background: linear-gradient(#7f7f7f, #737373);
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #FFFFFF;
+  border-left: 1px solid #595959;
+}
+.jewel.table .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tablecell {
+  border-top: 1px solid #595959;
+  border-left: 1px solid #595959;
+}
+.jewel.table .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(#7f7f7f, #8c8c8c);
+  box-shadow: inset 0 1px 0 #a6a6a6;
+}
+
+.jewel.tableitem {
+  cursor: auto;
+}
+.jewel.tableitem.selectable {
+  cursor: pointer;
+}
+.jewel.tableitem.hovered:hover {
+  color: #FFFFFF;
+  background: #3AB549;
+}
+.jewel.tableitem.selected, .jewel.tableitem.selectable:active {
+  color: #FFFFFF;
+  background: #34a241;
+}
+
 .jewel.textinput {
   font-weight: 400;
   color: #FFFFFF;
@@ -540,4 +805,9 @@ j|Card {
   padding-right: 0;
 }
 
+.jewel.togglebutton .fonticon {
+  margin-left: 0px;
+  margin-right: 8px;
+}
+
 /*# sourceMappingURL=defaults.css.map */
diff --git a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Green-Theme/src/main/sass/defaults.sass b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Green-Theme/src/main/sass/defaults.sass
index 94cebd3..c8f87c5 100644
--- a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Green-Theme/src/main/sass/defaults.sass
+++ b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Green-Theme/src/main/sass/defaults.sass
@@ -31,13 +31,21 @@
 @import "../../../../JewelTheme/src/main/sass/components-primary/card"
 @import "../../../../JewelTheme/src/main/sass/components-primary/checkbox"
 @import "../../../../JewelTheme/src/main/sass/components-primary/controlbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datechooser"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datefield"
+@import "../../../../JewelTheme/src/main/sass/components-primary/divider"
 @import "../../../../JewelTheme/src/main/sass/components-primary/drawer"
+@import "../../../../JewelTheme/src/main/sass/components-primary/dropdownlist"
+@import "../../../../JewelTheme/src/main/sass/components-primary/icons"
 @import "../../../../JewelTheme/src/main/sass/components-primary/itemRenderer"
 @import "../../../../JewelTheme/src/main/sass/components-primary/label"
 @import "../../../../JewelTheme/src/main/sass/components-primary/list"
+@import "../../../../JewelTheme/src/main/sass/components-primary/navigation"
+@import "../../../../JewelTheme/src/main/sass/components-primary/numericstepper"
 @import "../../../../JewelTheme/src/main/sass/components-primary/radiobutton"
 @import "../../../../JewelTheme/src/main/sass/components-primary/slider"
-
+@import "../../../../JewelTheme/src/main/sass/components-primary/table"
 @import "../../../../JewelTheme/src/main/sass/components-primary/textinput"
 @import "../../../../JewelTheme/src/main/sass/components-primary/titlebar"
 @import "../../../../JewelTheme/src/main/sass/components-primary/topappbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/togglebutton"
diff --git a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Orange-Theme/src/main/resources/defaults.css b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Orange-Theme/src/main/resources/defaults.css
index d6ef9e2..3c96d2c 100644
--- a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Orange-Theme/src/main/resources/defaults.css
+++ b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Orange-Theme/src/main/resources/defaults.css
@@ -234,6 +234,81 @@ j|Card {
   font-size: 16px;
 }
 
+.jewel.datechooser .jewel.table {
+  background: #8c8c8c;
+  border: 1px solid #595959;
+  border-radius: 0.25rem;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.button {
+  background: transparent;
+  border: none;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow {
+  border-bottom: 1px solid #595959;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton {
+  border-radius: 50%;
+  color: transparent;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:hover, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:hover {
+  background: #737373;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:active, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:active {
+  background: #666666;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background-size: 40%;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell {
+  background: #8c8c8c;
+  box-shadow: none;
+  border-left: 0px;
+}
+.jewel.datechooser .jewel.table .jewel.tablecell {
+  border-top: 0px;
+  border-left: 0px;
+  padding: 4px;
+}
+
+.calendar.item {
+  font-size: 1em;
+}
+.calendar.item.dayName {
+  font-weight: 600;
+}
+.calendar.item.date {
+  color: grey;
+}
+
+.jewel.datefield .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+.jewel.datefield .jewel.button {
+  color: transparent;
+  border-bottom-left-radius: 0px;
+  border-top-left-radius: 0px;
+  border-left: 0px;
+}
+.jewel.datefield .jewel.button::after {
+  background-size: 66%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 22 22' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M18.3333333,2.75 L17.4166667,2.75 L17.4166667,0.916666667 L15.5833333,0.916666667 L15.5833333,2.75 L6.41666667,2.75 L6.41666667,0.916666667 L4.58333333,0.916666667 L4.58333333,2.75 L3.66666667,2.75 C2.65833333,2.75 1.83333333,3.575 1.83333 [...]
+}
+
+.jewel.divider {
+  border-bottom-color: #595959;
+  border-bottom-width: 1px;
+  border-bottom-style: solid;
+}
+
 .jewel.drawer.float {
   color: rgba(0, 0, 0, 0.8);
 }
@@ -281,6 +356,62 @@ j|Card {
   padding: 16px;
 }
 
+.jewel.dropdownlist {
+  cursor: pointer;
+  display: inline-block;
+  margin: 0;
+  padding: 10px 16px;
+  min-width: 74px;
+  min-height: 34px;
+  background: linear-gradient(#666666, #4c4c4c);
+  border: 1px solid #333333;
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  border-radius: 3px;
+  font-family: "Lato", sans-serif;
+  font-size: 1em;
+  font-weight: bold;
+  color: #FFFFFF;
+  text-transform: uppercase;
+  text-decoration: none;
+  text-shadow: 0 -1px 0 rgba(13, 13, 13, 0.7);
+}
+.jewel.dropdownlist:hover, .jewel.dropdownlist:hover:focus {
+  background: linear-gradient(#595959, #404040);
+  border: 1px solid #262626;
+}
+.jewel.dropdownlist:active, .jewel.dropdownlist:active:focus {
+  background: linear-gradient(#404040, #262626);
+  border: 1px solid #0d0d0d;
+  box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+.jewel.dropdownlist:focus {
+  outline: none;
+  border: 1px solid #333333;
+  box-shadow: inset 0px 0px 0px 1px rgba(217, 217, 217, 0.5), inset 0 1px 0 rgba(229, 229, 229, 0.6);
+}
+.jewel.dropdownlist[disabled] {
+  cursor: unset;
+  background: #404040;
+  border: 1px solid #0d0d0d;
+  box-shadow: none;
+  color: #737373;
+  font-weight: 400;
+  text-shadow: unset;
+}
+
+.fonticon.dark {
+  color: #676767;
+}
+.fonticon.dark.inactive {
+  color: rgba(128, 128, 128, 0.3);
+}
+.fonticon.light {
+  color: white;
+}
+.fonticon.light.inactive {
+  color: rgba(255, 255, 255, 0.5);
+}
+
 .jewel.item {
   padding: 8px;
 }
@@ -320,6 +451,57 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.navigation {
+  background-color: #ffffff;
+}
+
+.jewel.numericstepper .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+
+@media (max-width: 992px) {
+  .jewel.numericstepper .jewel.textinput input {
+    border-radius: 0;
+  }
+}
+.jewel.spinner {
+  width: 34px;
+}
+.jewel.spinner .jewel.button {
+  padding: 0px;
+  height: 19px;
+  color: transparent;
+  border-radius: 0 0.25rem 0.25rem 0;
+  border-left: 0px;
+}
+.jewel.spinner .jewel.button.up {
+  border-bottom-right-radius: 0px;
+}
+.jewel.spinner .jewel.button.up::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23FFFFFF' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") no-repeat center center;
+}
+.jewel.spinner .jewel.button.down {
+  border-top-right-radius: 0px;
+  border-top-style: groove;
+}
+.jewel.spinner .jewel.button.down::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23FFFFFF' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon transform='translate(8.000000, 4.705000) scale(1, -1) translate(-8.000000, -4.705000) ' points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g [...]
+}
+
+@media (max-width: 992px) {
+  .jewel.spinner .jewel.button.up {
+    border: 1px solid #333333;
+    border-radius: 0.25rem 0 0 0.25rem;
+  }
+  .jewel.spinner .jewel.button.down {
+    border: 1px solid #333333;
+    border-radius: 0 0.25rem 0.25rem 0;
+    border-top-style: solid;
+  }
+}
 .jewel.radiobutton input + span::before {
   background: linear-gradient(#7f7f7f, #737373);
   border: 1px solid #333333;
@@ -435,6 +617,89 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.simpletable {
+  background: linear-gradient(#7f7f7f, #737373);
+  border: 1px solid #333333;
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  border-radius: 0.25rem;
+}
+.jewel.simpletable .jewel.thead tr {
+  border-bottom: 1px solid #595959;
+}
+.jewel.simpletable .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tableheadercell {
+  background: linear-gradient(#7f7f7f, #737373);
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #FFFFFF;
+  border-left: 1px solid #595959;
+}
+.jewel.simpletable .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tablecell {
+  border-top: 1px solid #595959;
+  border-left: 1px solid #595959;
+}
+.jewel.simpletable .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(#7f7f7f, #8c8c8c);
+  box-shadow: inset 0 1px 0 #a6a6a6;
+}
+
+.jewel.table {
+  background: linear-gradient(#7f7f7f, #737373);
+  border: 1px solid #333333;
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  border-radius: 0.25rem;
+}
+.jewel.table .jewel.thead tr {
+  border-bottom: 1px solid #595959;
+}
+.jewel.table .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tableheadercell {
+  background: linear-gradient(#7f7f7f, #737373);
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #FFFFFF;
+  border-left: 1px solid #595959;
+}
+.jewel.table .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tablecell {
+  border-top: 1px solid #595959;
+  border-left: 1px solid #595959;
+}
+.jewel.table .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(#7f7f7f, #8c8c8c);
+  box-shadow: inset 0 1px 0 #a6a6a6;
+}
+
+.jewel.tableitem {
+  cursor: auto;
+}
+.jewel.tableitem.selectable {
+  cursor: pointer;
+}
+.jewel.tableitem.hovered:hover {
+  color: #FFFFFF;
+  background: #F7941D;
+}
+.jewel.tableitem.selected, .jewel.tableitem.selectable:active {
+  color: #FFFFFF;
+  background: #f28809;
+}
+
 .jewel.textinput {
   font-weight: 400;
   color: #FFFFFF;
@@ -540,4 +805,9 @@ j|Card {
   padding-right: 0;
 }
 
+.jewel.togglebutton .fonticon {
+  margin-left: 0px;
+  margin-right: 8px;
+}
+
 /*# sourceMappingURL=defaults.css.map */
diff --git a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Orange-Theme/src/main/sass/defaults.sass b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Orange-Theme/src/main/sass/defaults.sass
index 94cebd3..c8f87c5 100644
--- a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Orange-Theme/src/main/sass/defaults.sass
+++ b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Orange-Theme/src/main/sass/defaults.sass
@@ -31,13 +31,21 @@
 @import "../../../../JewelTheme/src/main/sass/components-primary/card"
 @import "../../../../JewelTheme/src/main/sass/components-primary/checkbox"
 @import "../../../../JewelTheme/src/main/sass/components-primary/controlbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datechooser"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datefield"
+@import "../../../../JewelTheme/src/main/sass/components-primary/divider"
 @import "../../../../JewelTheme/src/main/sass/components-primary/drawer"
+@import "../../../../JewelTheme/src/main/sass/components-primary/dropdownlist"
+@import "../../../../JewelTheme/src/main/sass/components-primary/icons"
 @import "../../../../JewelTheme/src/main/sass/components-primary/itemRenderer"
 @import "../../../../JewelTheme/src/main/sass/components-primary/label"
 @import "../../../../JewelTheme/src/main/sass/components-primary/list"
+@import "../../../../JewelTheme/src/main/sass/components-primary/navigation"
+@import "../../../../JewelTheme/src/main/sass/components-primary/numericstepper"
 @import "../../../../JewelTheme/src/main/sass/components-primary/radiobutton"
 @import "../../../../JewelTheme/src/main/sass/components-primary/slider"
-
+@import "../../../../JewelTheme/src/main/sass/components-primary/table"
 @import "../../../../JewelTheme/src/main/sass/components-primary/textinput"
 @import "../../../../JewelTheme/src/main/sass/components-primary/titlebar"
 @import "../../../../JewelTheme/src/main/sass/components-primary/topappbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/togglebutton"
diff --git a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Red-Theme/src/main/resources/defaults.css b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Red-Theme/src/main/resources/defaults.css
index bf1eca7..94a4c54 100644
--- a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Red-Theme/src/main/resources/defaults.css
+++ b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Red-Theme/src/main/resources/defaults.css
@@ -234,6 +234,81 @@ j|Card {
   font-size: 16px;
 }
 
+.jewel.datechooser .jewel.table {
+  background: #8c8c8c;
+  border: 1px solid #595959;
+  border-radius: 0.25rem;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.button {
+  background: transparent;
+  border: none;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow {
+  border-bottom: 1px solid #595959;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton {
+  border-radius: 50%;
+  color: transparent;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:hover, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:hover {
+  background: #737373;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:active, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:active {
+  background: #666666;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background-size: 40%;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell {
+  background: #8c8c8c;
+  box-shadow: none;
+  border-left: 0px;
+}
+.jewel.datechooser .jewel.table .jewel.tablecell {
+  border-top: 0px;
+  border-left: 0px;
+  padding: 4px;
+}
+
+.calendar.item {
+  font-size: 1em;
+}
+.calendar.item.dayName {
+  font-weight: 600;
+}
+.calendar.item.date {
+  color: grey;
+}
+
+.jewel.datefield .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+.jewel.datefield .jewel.button {
+  color: transparent;
+  border-bottom-left-radius: 0px;
+  border-top-left-radius: 0px;
+  border-left: 0px;
+}
+.jewel.datefield .jewel.button::after {
+  background-size: 66%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 22 22' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M18.3333333,2.75 L17.4166667,2.75 L17.4166667,0.916666667 L15.5833333,0.916666667 L15.5833333,2.75 L6.41666667,2.75 L6.41666667,0.916666667 L4.58333333,0.916666667 L4.58333333,2.75 L3.66666667,2.75 C2.65833333,2.75 1.83333333,3.575 1.83333 [...]
+}
+
+.jewel.divider {
+  border-bottom-color: #595959;
+  border-bottom-width: 1px;
+  border-bottom-style: solid;
+}
+
 .jewel.drawer.float {
   color: rgba(0, 0, 0, 0.8);
 }
@@ -281,6 +356,62 @@ j|Card {
   padding: 16px;
 }
 
+.jewel.dropdownlist {
+  cursor: pointer;
+  display: inline-block;
+  margin: 0;
+  padding: 10px 16px;
+  min-width: 74px;
+  min-height: 34px;
+  background: linear-gradient(#666666, #4c4c4c);
+  border: 1px solid #333333;
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  border-radius: 3px;
+  font-family: "Lato", sans-serif;
+  font-size: 1em;
+  font-weight: bold;
+  color: #FFFFFF;
+  text-transform: uppercase;
+  text-decoration: none;
+  text-shadow: 0 -1px 0 rgba(13, 13, 13, 0.7);
+}
+.jewel.dropdownlist:hover, .jewel.dropdownlist:hover:focus {
+  background: linear-gradient(#595959, #404040);
+  border: 1px solid #262626;
+}
+.jewel.dropdownlist:active, .jewel.dropdownlist:active:focus {
+  background: linear-gradient(#404040, #262626);
+  border: 1px solid #0d0d0d;
+  box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+.jewel.dropdownlist:focus {
+  outline: none;
+  border: 1px solid #333333;
+  box-shadow: inset 0px 0px 0px 1px rgba(217, 217, 217, 0.5), inset 0 1px 0 rgba(229, 229, 229, 0.6);
+}
+.jewel.dropdownlist[disabled] {
+  cursor: unset;
+  background: #404040;
+  border: 1px solid #0d0d0d;
+  box-shadow: none;
+  color: #737373;
+  font-weight: 400;
+  text-shadow: unset;
+}
+
+.fonticon.dark {
+  color: #676767;
+}
+.fonticon.dark.inactive {
+  color: rgba(128, 128, 128, 0.3);
+}
+.fonticon.light {
+  color: white;
+}
+.fonticon.light.inactive {
+  color: rgba(255, 255, 255, 0.5);
+}
+
 .jewel.item {
   padding: 8px;
 }
@@ -320,6 +451,57 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.navigation {
+  background-color: #ffffff;
+}
+
+.jewel.numericstepper .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+
+@media (max-width: 992px) {
+  .jewel.numericstepper .jewel.textinput input {
+    border-radius: 0;
+  }
+}
+.jewel.spinner {
+  width: 34px;
+}
+.jewel.spinner .jewel.button {
+  padding: 0px;
+  height: 19px;
+  color: transparent;
+  border-radius: 0 0.25rem 0.25rem 0;
+  border-left: 0px;
+}
+.jewel.spinner .jewel.button.up {
+  border-bottom-right-radius: 0px;
+}
+.jewel.spinner .jewel.button.up::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23FFFFFF' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") no-repeat center center;
+}
+.jewel.spinner .jewel.button.down {
+  border-top-right-radius: 0px;
+  border-top-style: groove;
+}
+.jewel.spinner .jewel.button.down::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23FFFFFF' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon transform='translate(8.000000, 4.705000) scale(1, -1) translate(-8.000000, -4.705000) ' points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g [...]
+}
+
+@media (max-width: 992px) {
+  .jewel.spinner .jewel.button.up {
+    border: 1px solid #333333;
+    border-radius: 0.25rem 0 0 0.25rem;
+  }
+  .jewel.spinner .jewel.button.down {
+    border: 1px solid #333333;
+    border-radius: 0 0.25rem 0.25rem 0;
+    border-top-style: solid;
+  }
+}
 .jewel.radiobutton input + span::before {
   background: linear-gradient(#7f7f7f, #737373);
   border: 1px solid #333333;
@@ -435,6 +617,89 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.simpletable {
+  background: linear-gradient(#7f7f7f, #737373);
+  border: 1px solid #333333;
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  border-radius: 0.25rem;
+}
+.jewel.simpletable .jewel.thead tr {
+  border-bottom: 1px solid #595959;
+}
+.jewel.simpletable .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tableheadercell {
+  background: linear-gradient(#7f7f7f, #737373);
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #FFFFFF;
+  border-left: 1px solid #595959;
+}
+.jewel.simpletable .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tablecell {
+  border-top: 1px solid #595959;
+  border-left: 1px solid #595959;
+}
+.jewel.simpletable .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(#7f7f7f, #8c8c8c);
+  box-shadow: inset 0 1px 0 #a6a6a6;
+}
+
+.jewel.table {
+  background: linear-gradient(#7f7f7f, #737373);
+  border: 1px solid #333333;
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  border-radius: 0.25rem;
+}
+.jewel.table .jewel.thead tr {
+  border-bottom: 1px solid #595959;
+}
+.jewel.table .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tableheadercell {
+  background: linear-gradient(#7f7f7f, #737373);
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #FFFFFF;
+  border-left: 1px solid #595959;
+}
+.jewel.table .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tablecell {
+  border-top: 1px solid #595959;
+  border-left: 1px solid #595959;
+}
+.jewel.table .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(#7f7f7f, #8c8c8c);
+  box-shadow: inset 0 1px 0 #a6a6a6;
+}
+
+.jewel.tableitem {
+  cursor: auto;
+}
+.jewel.tableitem.selectable {
+  cursor: pointer;
+}
+.jewel.tableitem.hovered:hover {
+  color: #FFFFFF;
+  background: #EC1C24;
+}
+.jewel.tableitem.selected, .jewel.tableitem.selectable:active {
+  color: #FFFFFF;
+  background: #dc121a;
+}
+
 .jewel.textinput {
   font-weight: 400;
   color: #FFFFFF;
@@ -540,4 +805,9 @@ j|Card {
   padding-right: 0;
 }
 
+.jewel.togglebutton .fonticon {
+  margin-left: 0px;
+  margin-right: 8px;
+}
+
 /*# sourceMappingURL=defaults.css.map */
diff --git a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Red-Theme/src/main/sass/defaults.sass b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Red-Theme/src/main/sass/defaults.sass
index 94cebd3..c8f87c5 100644
--- a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Red-Theme/src/main/sass/defaults.sass
+++ b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Red-Theme/src/main/sass/defaults.sass
@@ -31,13 +31,21 @@
 @import "../../../../JewelTheme/src/main/sass/components-primary/card"
 @import "../../../../JewelTheme/src/main/sass/components-primary/checkbox"
 @import "../../../../JewelTheme/src/main/sass/components-primary/controlbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datechooser"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datefield"
+@import "../../../../JewelTheme/src/main/sass/components-primary/divider"
 @import "../../../../JewelTheme/src/main/sass/components-primary/drawer"
+@import "../../../../JewelTheme/src/main/sass/components-primary/dropdownlist"
+@import "../../../../JewelTheme/src/main/sass/components-primary/icons"
 @import "../../../../JewelTheme/src/main/sass/components-primary/itemRenderer"
 @import "../../../../JewelTheme/src/main/sass/components-primary/label"
 @import "../../../../JewelTheme/src/main/sass/components-primary/list"
+@import "../../../../JewelTheme/src/main/sass/components-primary/navigation"
+@import "../../../../JewelTheme/src/main/sass/components-primary/numericstepper"
 @import "../../../../JewelTheme/src/main/sass/components-primary/radiobutton"
 @import "../../../../JewelTheme/src/main/sass/components-primary/slider"
-
+@import "../../../../JewelTheme/src/main/sass/components-primary/table"
 @import "../../../../JewelTheme/src/main/sass/components-primary/textinput"
 @import "../../../../JewelTheme/src/main/sass/components-primary/titlebar"
 @import "../../../../JewelTheme/src/main/sass/components-primary/topappbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/togglebutton"
diff --git a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Sapphire-Theme/src/main/resources/defaults.css b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Sapphire-Theme/src/main/resources/defaults.css
index d4fc8de..b756924 100644
--- a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Sapphire-Theme/src/main/resources/defaults.css
+++ b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Sapphire-Theme/src/main/resources/defaults.css
@@ -234,6 +234,81 @@ j|Card {
   font-size: 16px;
 }
 
+.jewel.datechooser .jewel.table {
+  background: #8c8c8c;
+  border: 1px solid #595959;
+  border-radius: 0.25rem;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.button {
+  background: transparent;
+  border: none;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow {
+  border-bottom: 1px solid #595959;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton {
+  border-radius: 50%;
+  color: transparent;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:hover, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:hover {
+  background: #737373;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:active, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:active {
+  background: #666666;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background-size: 40%;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell {
+  background: #8c8c8c;
+  box-shadow: none;
+  border-left: 0px;
+}
+.jewel.datechooser .jewel.table .jewel.tablecell {
+  border-top: 0px;
+  border-left: 0px;
+  padding: 4px;
+}
+
+.calendar.item {
+  font-size: 1em;
+}
+.calendar.item.dayName {
+  font-weight: 600;
+}
+.calendar.item.date {
+  color: grey;
+}
+
+.jewel.datefield .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+.jewel.datefield .jewel.button {
+  color: transparent;
+  border-bottom-left-radius: 0px;
+  border-top-left-radius: 0px;
+  border-left: 0px;
+}
+.jewel.datefield .jewel.button::after {
+  background-size: 66%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 22 22' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M18.3333333,2.75 L17.4166667,2.75 L17.4166667,0.916666667 L15.5833333,0.916666667 L15.5833333,2.75 L6.41666667,2.75 L6.41666667,0.916666667 L4.58333333,0.916666667 L4.58333333,2.75 L3.66666667,2.75 C2.65833333,2.75 1.83333333,3.575 1.83333 [...]
+}
+
+.jewel.divider {
+  border-bottom-color: #595959;
+  border-bottom-width: 1px;
+  border-bottom-style: solid;
+}
+
 .jewel.drawer.float {
   color: rgba(0, 0, 0, 0.8);
 }
@@ -281,6 +356,62 @@ j|Card {
   padding: 16px;
 }
 
+.jewel.dropdownlist {
+  cursor: pointer;
+  display: inline-block;
+  margin: 0;
+  padding: 10px 16px;
+  min-width: 74px;
+  min-height: 34px;
+  background: linear-gradient(#666666, #4c4c4c);
+  border: 1px solid #333333;
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  border-radius: 3px;
+  font-family: "Lato", sans-serif;
+  font-size: 1em;
+  font-weight: bold;
+  color: #FFFFFF;
+  text-transform: uppercase;
+  text-decoration: none;
+  text-shadow: 0 -1px 0 rgba(13, 13, 13, 0.7);
+}
+.jewel.dropdownlist:hover, .jewel.dropdownlist:hover:focus {
+  background: linear-gradient(#595959, #404040);
+  border: 1px solid #262626;
+}
+.jewel.dropdownlist:active, .jewel.dropdownlist:active:focus {
+  background: linear-gradient(#404040, #262626);
+  border: 1px solid #0d0d0d;
+  box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+.jewel.dropdownlist:focus {
+  outline: none;
+  border: 1px solid #333333;
+  box-shadow: inset 0px 0px 0px 1px rgba(217, 217, 217, 0.5), inset 0 1px 0 rgba(229, 229, 229, 0.6);
+}
+.jewel.dropdownlist[disabled] {
+  cursor: unset;
+  background: #404040;
+  border: 1px solid #0d0d0d;
+  box-shadow: none;
+  color: #737373;
+  font-weight: 400;
+  text-shadow: unset;
+}
+
+.fonticon.dark {
+  color: #676767;
+}
+.fonticon.dark.inactive {
+  color: rgba(128, 128, 128, 0.3);
+}
+.fonticon.light {
+  color: white;
+}
+.fonticon.light.inactive {
+  color: rgba(255, 255, 255, 0.5);
+}
+
 .jewel.item {
   padding: 8px;
 }
@@ -320,6 +451,57 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.navigation {
+  background-color: #ffffff;
+}
+
+.jewel.numericstepper .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+
+@media (max-width: 992px) {
+  .jewel.numericstepper .jewel.textinput input {
+    border-radius: 0;
+  }
+}
+.jewel.spinner {
+  width: 34px;
+}
+.jewel.spinner .jewel.button {
+  padding: 0px;
+  height: 19px;
+  color: transparent;
+  border-radius: 0 0.25rem 0.25rem 0;
+  border-left: 0px;
+}
+.jewel.spinner .jewel.button.up {
+  border-bottom-right-radius: 0px;
+}
+.jewel.spinner .jewel.button.up::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23FFFFFF' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") no-repeat center center;
+}
+.jewel.spinner .jewel.button.down {
+  border-top-right-radius: 0px;
+  border-top-style: groove;
+}
+.jewel.spinner .jewel.button.down::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23FFFFFF' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon transform='translate(8.000000, 4.705000) scale(1, -1) translate(-8.000000, -4.705000) ' points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g [...]
+}
+
+@media (max-width: 992px) {
+  .jewel.spinner .jewel.button.up {
+    border: 1px solid #333333;
+    border-radius: 0.25rem 0 0 0.25rem;
+  }
+  .jewel.spinner .jewel.button.down {
+    border: 1px solid #333333;
+    border-radius: 0 0.25rem 0.25rem 0;
+    border-top-style: solid;
+  }
+}
 .jewel.radiobutton input + span::before {
   background: linear-gradient(#7f7f7f, #737373);
   border: 1px solid #333333;
@@ -435,6 +617,89 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.simpletable {
+  background: linear-gradient(#7f7f7f, #737373);
+  border: 1px solid #333333;
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  border-radius: 0.25rem;
+}
+.jewel.simpletable .jewel.thead tr {
+  border-bottom: 1px solid #595959;
+}
+.jewel.simpletable .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tableheadercell {
+  background: linear-gradient(#7f7f7f, #737373);
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #FFFFFF;
+  border-left: 1px solid #595959;
+}
+.jewel.simpletable .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tablecell {
+  border-top: 1px solid #595959;
+  border-left: 1px solid #595959;
+}
+.jewel.simpletable .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(#7f7f7f, #8c8c8c);
+  box-shadow: inset 0 1px 0 #a6a6a6;
+}
+
+.jewel.table {
+  background: linear-gradient(#7f7f7f, #737373);
+  border: 1px solid #333333;
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  border-radius: 0.25rem;
+}
+.jewel.table .jewel.thead tr {
+  border-bottom: 1px solid #595959;
+}
+.jewel.table .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tableheadercell {
+  background: linear-gradient(#7f7f7f, #737373);
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #FFFFFF;
+  border-left: 1px solid #595959;
+}
+.jewel.table .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tablecell {
+  border-top: 1px solid #595959;
+  border-left: 1px solid #595959;
+}
+.jewel.table .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(#7f7f7f, #8c8c8c);
+  box-shadow: inset 0 1px 0 #a6a6a6;
+}
+
+.jewel.tableitem {
+  cursor: auto;
+}
+.jewel.tableitem.selectable {
+  cursor: pointer;
+}
+.jewel.tableitem.hovered:hover {
+  color: #FFFFFF;
+  background: #2C74BE;
+}
+.jewel.tableitem.selected, .jewel.tableitem.selectable:active {
+  color: #FFFFFF;
+  background: #2767a9;
+}
+
 .jewel.textinput {
   font-weight: 400;
   color: #FFFFFF;
@@ -540,4 +805,9 @@ j|Card {
   padding-right: 0;
 }
 
+.jewel.togglebutton .fonticon {
+  margin-left: 0px;
+  margin-right: 8px;
+}
+
 /*# sourceMappingURL=defaults.css.map */
diff --git a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Sapphire-Theme/src/main/sass/defaults.sass b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Sapphire-Theme/src/main/sass/defaults.sass
index 94cebd3..c8f87c5 100644
--- a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Sapphire-Theme/src/main/sass/defaults.sass
+++ b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Sapphire-Theme/src/main/sass/defaults.sass
@@ -31,13 +31,21 @@
 @import "../../../../JewelTheme/src/main/sass/components-primary/card"
 @import "../../../../JewelTheme/src/main/sass/components-primary/checkbox"
 @import "../../../../JewelTheme/src/main/sass/components-primary/controlbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datechooser"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datefield"
+@import "../../../../JewelTheme/src/main/sass/components-primary/divider"
 @import "../../../../JewelTheme/src/main/sass/components-primary/drawer"
+@import "../../../../JewelTheme/src/main/sass/components-primary/dropdownlist"
+@import "../../../../JewelTheme/src/main/sass/components-primary/icons"
 @import "../../../../JewelTheme/src/main/sass/components-primary/itemRenderer"
 @import "../../../../JewelTheme/src/main/sass/components-primary/label"
 @import "../../../../JewelTheme/src/main/sass/components-primary/list"
+@import "../../../../JewelTheme/src/main/sass/components-primary/navigation"
+@import "../../../../JewelTheme/src/main/sass/components-primary/numericstepper"
 @import "../../../../JewelTheme/src/main/sass/components-primary/radiobutton"
 @import "../../../../JewelTheme/src/main/sass/components-primary/slider"
-
+@import "../../../../JewelTheme/src/main/sass/components-primary/table"
 @import "../../../../JewelTheme/src/main/sass/components-primary/textinput"
 @import "../../../../JewelTheme/src/main/sass/components-primary/titlebar"
 @import "../../../../JewelTheme/src/main/sass/components-primary/topappbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/togglebutton"
diff --git a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Sunflower-Theme/src/main/resources/defaults.css b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Sunflower-Theme/src/main/resources/defaults.css
index 77170bf..f7ab3e8 100644
--- a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Sunflower-Theme/src/main/resources/defaults.css
+++ b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Sunflower-Theme/src/main/resources/defaults.css
@@ -234,6 +234,81 @@ j|Card {
   font-size: 16px;
 }
 
+.jewel.datechooser .jewel.table {
+  background: #8c8c8c;
+  border: 1px solid #595959;
+  border-radius: 0.25rem;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.button {
+  background: transparent;
+  border: none;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow {
+  border-bottom: 1px solid #595959;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton {
+  border-radius: 50%;
+  color: transparent;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:hover, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:hover {
+  background: #737373;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:active, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:active {
+  background: #666666;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background-size: 40%;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell {
+  background: #8c8c8c;
+  box-shadow: none;
+  border-left: 0px;
+}
+.jewel.datechooser .jewel.table .jewel.tablecell {
+  border-top: 0px;
+  border-left: 0px;
+  padding: 4px;
+}
+
+.calendar.item {
+  font-size: 1em;
+}
+.calendar.item.dayName {
+  font-weight: 600;
+}
+.calendar.item.date {
+  color: grey;
+}
+
+.jewel.datefield .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+.jewel.datefield .jewel.button {
+  color: transparent;
+  border-bottom-left-radius: 0px;
+  border-top-left-radius: 0px;
+  border-left: 0px;
+}
+.jewel.datefield .jewel.button::after {
+  background-size: 66%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 22 22' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M18.3333333,2.75 L17.4166667,2.75 L17.4166667,0.916666667 L15.5833333,0.916666667 L15.5833333,2.75 L6.41666667,2.75 L6.41666667,0.916666667 L4.58333333,0.916666667 L4.58333333,2.75 L3.66666667,2.75 C2.65833333,2.75 1.83333333,3.575 1.83333 [...]
+}
+
+.jewel.divider {
+  border-bottom-color: #595959;
+  border-bottom-width: 1px;
+  border-bottom-style: solid;
+}
+
 .jewel.drawer.float {
   color: rgba(0, 0, 0, 0.8);
 }
@@ -281,6 +356,62 @@ j|Card {
   padding: 16px;
 }
 
+.jewel.dropdownlist {
+  cursor: pointer;
+  display: inline-block;
+  margin: 0;
+  padding: 10px 16px;
+  min-width: 74px;
+  min-height: 34px;
+  background: linear-gradient(#666666, #4c4c4c);
+  border: 1px solid #333333;
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  border-radius: 3px;
+  font-family: "Lato", sans-serif;
+  font-size: 1em;
+  font-weight: bold;
+  color: #FFFFFF;
+  text-transform: uppercase;
+  text-decoration: none;
+  text-shadow: 0 -1px 0 rgba(13, 13, 13, 0.7);
+}
+.jewel.dropdownlist:hover, .jewel.dropdownlist:hover:focus {
+  background: linear-gradient(#595959, #404040);
+  border: 1px solid #262626;
+}
+.jewel.dropdownlist:active, .jewel.dropdownlist:active:focus {
+  background: linear-gradient(#404040, #262626);
+  border: 1px solid #0d0d0d;
+  box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+.jewel.dropdownlist:focus {
+  outline: none;
+  border: 1px solid #333333;
+  box-shadow: inset 0px 0px 0px 1px rgba(217, 217, 217, 0.5), inset 0 1px 0 rgba(229, 229, 229, 0.6);
+}
+.jewel.dropdownlist[disabled] {
+  cursor: unset;
+  background: #404040;
+  border: 1px solid #0d0d0d;
+  box-shadow: none;
+  color: #737373;
+  font-weight: 400;
+  text-shadow: unset;
+}
+
+.fonticon.dark {
+  color: #676767;
+}
+.fonticon.dark.inactive {
+  color: rgba(128, 128, 128, 0.3);
+}
+.fonticon.light {
+  color: white;
+}
+.fonticon.light.inactive {
+  color: rgba(255, 255, 255, 0.5);
+}
+
 .jewel.item {
   padding: 8px;
 }
@@ -320,6 +451,57 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.navigation {
+  background-color: #ffffff;
+}
+
+.jewel.numericstepper .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+
+@media (max-width: 992px) {
+  .jewel.numericstepper .jewel.textinput input {
+    border-radius: 0;
+  }
+}
+.jewel.spinner {
+  width: 34px;
+}
+.jewel.spinner .jewel.button {
+  padding: 0px;
+  height: 19px;
+  color: transparent;
+  border-radius: 0 0.25rem 0.25rem 0;
+  border-left: 0px;
+}
+.jewel.spinner .jewel.button.up {
+  border-bottom-right-radius: 0px;
+}
+.jewel.spinner .jewel.button.up::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23FFFFFF' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") no-repeat center center;
+}
+.jewel.spinner .jewel.button.down {
+  border-top-right-radius: 0px;
+  border-top-style: groove;
+}
+.jewel.spinner .jewel.button.down::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23FFFFFF' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon transform='translate(8.000000, 4.705000) scale(1, -1) translate(-8.000000, -4.705000) ' points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g [...]
+}
+
+@media (max-width: 992px) {
+  .jewel.spinner .jewel.button.up {
+    border: 1px solid #333333;
+    border-radius: 0.25rem 0 0 0.25rem;
+  }
+  .jewel.spinner .jewel.button.down {
+    border: 1px solid #333333;
+    border-radius: 0 0.25rem 0.25rem 0;
+    border-top-style: solid;
+  }
+}
 .jewel.radiobutton input + span::before {
   background: linear-gradient(#7f7f7f, #737373);
   border: 1px solid #333333;
@@ -435,6 +617,89 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.simpletable {
+  background: linear-gradient(#7f7f7f, #737373);
+  border: 1px solid #333333;
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  border-radius: 0.25rem;
+}
+.jewel.simpletable .jewel.thead tr {
+  border-bottom: 1px solid #595959;
+}
+.jewel.simpletable .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tableheadercell {
+  background: linear-gradient(#7f7f7f, #737373);
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #FFFFFF;
+  border-left: 1px solid #595959;
+}
+.jewel.simpletable .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tablecell {
+  border-top: 1px solid #595959;
+  border-left: 1px solid #595959;
+}
+.jewel.simpletable .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(#7f7f7f, #8c8c8c);
+  box-shadow: inset 0 1px 0 #a6a6a6;
+}
+
+.jewel.table {
+  background: linear-gradient(#7f7f7f, #737373);
+  border: 1px solid #333333;
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  border-radius: 0.25rem;
+}
+.jewel.table .jewel.thead tr {
+  border-bottom: 1px solid #595959;
+}
+.jewel.table .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tableheadercell {
+  background: linear-gradient(#7f7f7f, #737373);
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #FFFFFF;
+  border-left: 1px solid #595959;
+}
+.jewel.table .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tablecell {
+  border-top: 1px solid #595959;
+  border-left: 1px solid #595959;
+}
+.jewel.table .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(#7f7f7f, #8c8c8c);
+  box-shadow: inset 0 1px 0 #a6a6a6;
+}
+
+.jewel.tableitem {
+  cursor: auto;
+}
+.jewel.tableitem.selectable {
+  cursor: pointer;
+}
+.jewel.tableitem.hovered:hover {
+  color: #FFFFFF;
+  background: #F8B13F;
+}
+.jewel.tableitem.selected, .jewel.tableitem.selectable:active {
+  color: #FFFFFF;
+  background: #f7a726;
+}
+
 .jewel.textinput {
   font-weight: 400;
   color: #FFFFFF;
@@ -540,4 +805,9 @@ j|Card {
   padding-right: 0;
 }
 
+.jewel.togglebutton .fonticon {
+  margin-left: 0px;
+  margin-right: 8px;
+}
+
 /*# sourceMappingURL=defaults.css.map */
diff --git a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Sunflower-Theme/src/main/sass/defaults.sass b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Sunflower-Theme/src/main/sass/defaults.sass
index 94cebd3..c8f87c5 100644
--- a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Sunflower-Theme/src/main/sass/defaults.sass
+++ b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Sunflower-Theme/src/main/sass/defaults.sass
@@ -31,13 +31,21 @@
 @import "../../../../JewelTheme/src/main/sass/components-primary/card"
 @import "../../../../JewelTheme/src/main/sass/components-primary/checkbox"
 @import "../../../../JewelTheme/src/main/sass/components-primary/controlbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datechooser"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datefield"
+@import "../../../../JewelTheme/src/main/sass/components-primary/divider"
 @import "../../../../JewelTheme/src/main/sass/components-primary/drawer"
+@import "../../../../JewelTheme/src/main/sass/components-primary/dropdownlist"
+@import "../../../../JewelTheme/src/main/sass/components-primary/icons"
 @import "../../../../JewelTheme/src/main/sass/components-primary/itemRenderer"
 @import "../../../../JewelTheme/src/main/sass/components-primary/label"
 @import "../../../../JewelTheme/src/main/sass/components-primary/list"
+@import "../../../../JewelTheme/src/main/sass/components-primary/navigation"
+@import "../../../../JewelTheme/src/main/sass/components-primary/numericstepper"
 @import "../../../../JewelTheme/src/main/sass/components-primary/radiobutton"
 @import "../../../../JewelTheme/src/main/sass/components-primary/slider"
-
+@import "../../../../JewelTheme/src/main/sass/components-primary/table"
 @import "../../../../JewelTheme/src/main/sass/components-primary/textinput"
 @import "../../../../JewelTheme/src/main/sass/components-primary/titlebar"
 @import "../../../../JewelTheme/src/main/sass/components-primary/topappbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/togglebutton"
diff --git a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Topaz-Theme/src/main/resources/defaults.css b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Topaz-Theme/src/main/resources/defaults.css
index 6f43bea..54ea336 100644
--- a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Topaz-Theme/src/main/resources/defaults.css
+++ b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Topaz-Theme/src/main/resources/defaults.css
@@ -234,6 +234,81 @@ j|Card {
   font-size: 16px;
 }
 
+.jewel.datechooser .jewel.table {
+  background: #8c8c8c;
+  border: 1px solid #595959;
+  border-radius: 0.25rem;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.button {
+  background: transparent;
+  border: none;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow {
+  border-bottom: 1px solid #595959;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton {
+  border-radius: 50%;
+  color: transparent;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:hover, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:hover {
+  background: #737373;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:active, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:active {
+  background: #666666;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background-size: 40%;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell {
+  background: #8c8c8c;
+  box-shadow: none;
+  border-left: 0px;
+}
+.jewel.datechooser .jewel.table .jewel.tablecell {
+  border-top: 0px;
+  border-left: 0px;
+  padding: 4px;
+}
+
+.calendar.item {
+  font-size: 1em;
+}
+.calendar.item.dayName {
+  font-weight: 600;
+}
+.calendar.item.date {
+  color: grey;
+}
+
+.jewel.datefield .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+.jewel.datefield .jewel.button {
+  color: transparent;
+  border-bottom-left-radius: 0px;
+  border-top-left-radius: 0px;
+  border-left: 0px;
+}
+.jewel.datefield .jewel.button::after {
+  background-size: 66%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 22 22' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M18.3333333,2.75 L17.4166667,2.75 L17.4166667,0.916666667 L15.5833333,0.916666667 L15.5833333,2.75 L6.41666667,2.75 L6.41666667,0.916666667 L4.58333333,0.916666667 L4.58333333,2.75 L3.66666667,2.75 C2.65833333,2.75 1.83333333,3.575 1.83333 [...]
+}
+
+.jewel.divider {
+  border-bottom-color: #595959;
+  border-bottom-width: 1px;
+  border-bottom-style: solid;
+}
+
 .jewel.drawer.float {
   color: rgba(0, 0, 0, 0.8);
 }
@@ -281,6 +356,62 @@ j|Card {
   padding: 16px;
 }
 
+.jewel.dropdownlist {
+  cursor: pointer;
+  display: inline-block;
+  margin: 0;
+  padding: 10px 16px;
+  min-width: 74px;
+  min-height: 34px;
+  background: linear-gradient(#666666, #4c4c4c);
+  border: 1px solid #333333;
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  border-radius: 3px;
+  font-family: "Lato", sans-serif;
+  font-size: 1em;
+  font-weight: bold;
+  color: #FFFFFF;
+  text-transform: uppercase;
+  text-decoration: none;
+  text-shadow: 0 -1px 0 rgba(13, 13, 13, 0.7);
+}
+.jewel.dropdownlist:hover, .jewel.dropdownlist:hover:focus {
+  background: linear-gradient(#595959, #404040);
+  border: 1px solid #262626;
+}
+.jewel.dropdownlist:active, .jewel.dropdownlist:active:focus {
+  background: linear-gradient(#404040, #262626);
+  border: 1px solid #0d0d0d;
+  box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+.jewel.dropdownlist:focus {
+  outline: none;
+  border: 1px solid #333333;
+  box-shadow: inset 0px 0px 0px 1px rgba(217, 217, 217, 0.5), inset 0 1px 0 rgba(229, 229, 229, 0.6);
+}
+.jewel.dropdownlist[disabled] {
+  cursor: unset;
+  background: #404040;
+  border: 1px solid #0d0d0d;
+  box-shadow: none;
+  color: #737373;
+  font-weight: 400;
+  text-shadow: unset;
+}
+
+.fonticon.dark {
+  color: #676767;
+}
+.fonticon.dark.inactive {
+  color: rgba(128, 128, 128, 0.3);
+}
+.fonticon.light {
+  color: white;
+}
+.fonticon.light.inactive {
+  color: rgba(255, 255, 255, 0.5);
+}
+
 .jewel.item {
   padding: 8px;
 }
@@ -320,6 +451,57 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.navigation {
+  background-color: #ffffff;
+}
+
+.jewel.numericstepper .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+
+@media (max-width: 992px) {
+  .jewel.numericstepper .jewel.textinput input {
+    border-radius: 0;
+  }
+}
+.jewel.spinner {
+  width: 34px;
+}
+.jewel.spinner .jewel.button {
+  padding: 0px;
+  height: 19px;
+  color: transparent;
+  border-radius: 0 0.25rem 0.25rem 0;
+  border-left: 0px;
+}
+.jewel.spinner .jewel.button.up {
+  border-bottom-right-radius: 0px;
+}
+.jewel.spinner .jewel.button.up::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23FFFFFF' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") no-repeat center center;
+}
+.jewel.spinner .jewel.button.down {
+  border-top-right-radius: 0px;
+  border-top-style: groove;
+}
+.jewel.spinner .jewel.button.down::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23FFFFFF' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon transform='translate(8.000000, 4.705000) scale(1, -1) translate(-8.000000, -4.705000) ' points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g [...]
+}
+
+@media (max-width: 992px) {
+  .jewel.spinner .jewel.button.up {
+    border: 1px solid #333333;
+    border-radius: 0.25rem 0 0 0.25rem;
+  }
+  .jewel.spinner .jewel.button.down {
+    border: 1px solid #333333;
+    border-radius: 0 0.25rem 0.25rem 0;
+    border-top-style: solid;
+  }
+}
 .jewel.radiobutton input + span::before {
   background: linear-gradient(#7f7f7f, #737373);
   border: 1px solid #333333;
@@ -435,6 +617,89 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.simpletable {
+  background: linear-gradient(#7f7f7f, #737373);
+  border: 1px solid #333333;
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  border-radius: 0.25rem;
+}
+.jewel.simpletable .jewel.thead tr {
+  border-bottom: 1px solid #595959;
+}
+.jewel.simpletable .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tableheadercell {
+  background: linear-gradient(#7f7f7f, #737373);
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #FFFFFF;
+  border-left: 1px solid #595959;
+}
+.jewel.simpletable .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tablecell {
+  border-top: 1px solid #595959;
+  border-left: 1px solid #595959;
+}
+.jewel.simpletable .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(#7f7f7f, #8c8c8c);
+  box-shadow: inset 0 1px 0 #a6a6a6;
+}
+
+.jewel.table {
+  background: linear-gradient(#7f7f7f, #737373);
+  border: 1px solid #333333;
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  border-radius: 0.25rem;
+}
+.jewel.table .jewel.thead tr {
+  border-bottom: 1px solid #595959;
+}
+.jewel.table .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tableheadercell {
+  background: linear-gradient(#7f7f7f, #737373);
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #FFFFFF;
+  border-left: 1px solid #595959;
+}
+.jewel.table .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tablecell {
+  border-top: 1px solid #595959;
+  border-left: 1px solid #595959;
+}
+.jewel.table .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(#7f7f7f, #8c8c8c);
+  box-shadow: inset 0 1px 0 #a6a6a6;
+}
+
+.jewel.tableitem {
+  cursor: auto;
+}
+.jewel.tableitem.selectable {
+  cursor: pointer;
+}
+.jewel.tableitem.hovered:hover {
+  color: #FFFFFF;
+  background: #EF5A2A;
+}
+.jewel.tableitem.selected, .jewel.tableitem.selectable:active {
+  color: #FFFFFF;
+  background: #ed4812;
+}
+
 .jewel.textinput {
   font-weight: 400;
   color: #FFFFFF;
@@ -540,4 +805,9 @@ j|Card {
   padding-right: 0;
 }
 
+.jewel.togglebutton .fonticon {
+  margin-left: 0px;
+  margin-right: 8px;
+}
+
 /*# sourceMappingURL=defaults.css.map */
diff --git a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Topaz-Theme/src/main/sass/defaults.sass b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Topaz-Theme/src/main/sass/defaults.sass
index 94cebd3..c8f87c5 100644
--- a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Topaz-Theme/src/main/sass/defaults.sass
+++ b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Topaz-Theme/src/main/sass/defaults.sass
@@ -31,13 +31,21 @@
 @import "../../../../JewelTheme/src/main/sass/components-primary/card"
 @import "../../../../JewelTheme/src/main/sass/components-primary/checkbox"
 @import "../../../../JewelTheme/src/main/sass/components-primary/controlbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datechooser"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datefield"
+@import "../../../../JewelTheme/src/main/sass/components-primary/divider"
 @import "../../../../JewelTheme/src/main/sass/components-primary/drawer"
+@import "../../../../JewelTheme/src/main/sass/components-primary/dropdownlist"
+@import "../../../../JewelTheme/src/main/sass/components-primary/icons"
 @import "../../../../JewelTheme/src/main/sass/components-primary/itemRenderer"
 @import "../../../../JewelTheme/src/main/sass/components-primary/label"
 @import "../../../../JewelTheme/src/main/sass/components-primary/list"
+@import "../../../../JewelTheme/src/main/sass/components-primary/navigation"
+@import "../../../../JewelTheme/src/main/sass/components-primary/numericstepper"
 @import "../../../../JewelTheme/src/main/sass/components-primary/radiobutton"
 @import "../../../../JewelTheme/src/main/sass/components-primary/slider"
-
+@import "../../../../JewelTheme/src/main/sass/components-primary/table"
 @import "../../../../JewelTheme/src/main/sass/components-primary/textinput"
 @import "../../../../JewelTheme/src/main/sass/components-primary/titlebar"
 @import "../../../../JewelTheme/src/main/sass/components-primary/topappbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/togglebutton"
diff --git a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Turquoise-Theme/src/main/resources/defaults.css b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Turquoise-Theme/src/main/resources/defaults.css
index 6464aa4..27ecca6 100644
--- a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Turquoise-Theme/src/main/resources/defaults.css
+++ b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Turquoise-Theme/src/main/resources/defaults.css
@@ -234,6 +234,81 @@ j|Card {
   font-size: 16px;
 }
 
+.jewel.datechooser .jewel.table {
+  background: #8c8c8c;
+  border: 1px solid #595959;
+  border-radius: 0.25rem;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.button {
+  background: transparent;
+  border: none;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow {
+  border-bottom: 1px solid #595959;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton {
+  border-radius: 50%;
+  color: transparent;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:hover, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:hover {
+  background: #737373;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:active, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:active {
+  background: #666666;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background-size: 40%;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell {
+  background: #8c8c8c;
+  box-shadow: none;
+  border-left: 0px;
+}
+.jewel.datechooser .jewel.table .jewel.tablecell {
+  border-top: 0px;
+  border-left: 0px;
+  padding: 4px;
+}
+
+.calendar.item {
+  font-size: 1em;
+}
+.calendar.item.dayName {
+  font-weight: 600;
+}
+.calendar.item.date {
+  color: grey;
+}
+
+.jewel.datefield .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+.jewel.datefield .jewel.button {
+  color: transparent;
+  border-bottom-left-radius: 0px;
+  border-top-left-radius: 0px;
+  border-left: 0px;
+}
+.jewel.datefield .jewel.button::after {
+  background-size: 66%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 22 22' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M18.3333333,2.75 L17.4166667,2.75 L17.4166667,0.916666667 L15.5833333,0.916666667 L15.5833333,2.75 L6.41666667,2.75 L6.41666667,0.916666667 L4.58333333,0.916666667 L4.58333333,2.75 L3.66666667,2.75 C2.65833333,2.75 1.83333333,3.575 1.83333 [...]
+}
+
+.jewel.divider {
+  border-bottom-color: #595959;
+  border-bottom-width: 1px;
+  border-bottom-style: solid;
+}
+
 .jewel.drawer.float {
   color: rgba(0, 0, 0, 0.8);
 }
@@ -281,6 +356,62 @@ j|Card {
   padding: 16px;
 }
 
+.jewel.dropdownlist {
+  cursor: pointer;
+  display: inline-block;
+  margin: 0;
+  padding: 10px 16px;
+  min-width: 74px;
+  min-height: 34px;
+  background: linear-gradient(#666666, #4c4c4c);
+  border: 1px solid #333333;
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  border-radius: 3px;
+  font-family: "Lato", sans-serif;
+  font-size: 1em;
+  font-weight: bold;
+  color: #FFFFFF;
+  text-transform: uppercase;
+  text-decoration: none;
+  text-shadow: 0 -1px 0 rgba(13, 13, 13, 0.7);
+}
+.jewel.dropdownlist:hover, .jewel.dropdownlist:hover:focus {
+  background: linear-gradient(#595959, #404040);
+  border: 1px solid #262626;
+}
+.jewel.dropdownlist:active, .jewel.dropdownlist:active:focus {
+  background: linear-gradient(#404040, #262626);
+  border: 1px solid #0d0d0d;
+  box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+.jewel.dropdownlist:focus {
+  outline: none;
+  border: 1px solid #333333;
+  box-shadow: inset 0px 0px 0px 1px rgba(217, 217, 217, 0.5), inset 0 1px 0 rgba(229, 229, 229, 0.6);
+}
+.jewel.dropdownlist[disabled] {
+  cursor: unset;
+  background: #404040;
+  border: 1px solid #0d0d0d;
+  box-shadow: none;
+  color: #737373;
+  font-weight: 400;
+  text-shadow: unset;
+}
+
+.fonticon.dark {
+  color: #676767;
+}
+.fonticon.dark.inactive {
+  color: rgba(128, 128, 128, 0.3);
+}
+.fonticon.light {
+  color: white;
+}
+.fonticon.light.inactive {
+  color: rgba(255, 255, 255, 0.5);
+}
+
 .jewel.item {
   padding: 8px;
 }
@@ -320,6 +451,57 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.navigation {
+  background-color: #ffffff;
+}
+
+.jewel.numericstepper .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+
+@media (max-width: 992px) {
+  .jewel.numericstepper .jewel.textinput input {
+    border-radius: 0;
+  }
+}
+.jewel.spinner {
+  width: 34px;
+}
+.jewel.spinner .jewel.button {
+  padding: 0px;
+  height: 19px;
+  color: transparent;
+  border-radius: 0 0.25rem 0.25rem 0;
+  border-left: 0px;
+}
+.jewel.spinner .jewel.button.up {
+  border-bottom-right-radius: 0px;
+}
+.jewel.spinner .jewel.button.up::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23FFFFFF' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") no-repeat center center;
+}
+.jewel.spinner .jewel.button.down {
+  border-top-right-radius: 0px;
+  border-top-style: groove;
+}
+.jewel.spinner .jewel.button.down::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23FFFFFF' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon transform='translate(8.000000, 4.705000) scale(1, -1) translate(-8.000000, -4.705000) ' points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g [...]
+}
+
+@media (max-width: 992px) {
+  .jewel.spinner .jewel.button.up {
+    border: 1px solid #333333;
+    border-radius: 0.25rem 0 0 0.25rem;
+  }
+  .jewel.spinner .jewel.button.down {
+    border: 1px solid #333333;
+    border-radius: 0 0.25rem 0.25rem 0;
+    border-top-style: solid;
+  }
+}
 .jewel.radiobutton input + span::before {
   background: linear-gradient(#7f7f7f, #737373);
   border: 1px solid #333333;
@@ -435,6 +617,89 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.simpletable {
+  background: linear-gradient(#7f7f7f, #737373);
+  border: 1px solid #333333;
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  border-radius: 0.25rem;
+}
+.jewel.simpletable .jewel.thead tr {
+  border-bottom: 1px solid #595959;
+}
+.jewel.simpletable .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tableheadercell {
+  background: linear-gradient(#7f7f7f, #737373);
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #FFFFFF;
+  border-left: 1px solid #595959;
+}
+.jewel.simpletable .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tablecell {
+  border-top: 1px solid #595959;
+  border-left: 1px solid #595959;
+}
+.jewel.simpletable .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(#7f7f7f, #8c8c8c);
+  box-shadow: inset 0 1px 0 #a6a6a6;
+}
+
+.jewel.table {
+  background: linear-gradient(#7f7f7f, #737373);
+  border: 1px solid #333333;
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  border-radius: 0.25rem;
+}
+.jewel.table .jewel.thead tr {
+  border-bottom: 1px solid #595959;
+}
+.jewel.table .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tableheadercell {
+  background: linear-gradient(#7f7f7f, #737373);
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #FFFFFF;
+  border-left: 1px solid #595959;
+}
+.jewel.table .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tablecell {
+  border-top: 1px solid #595959;
+  border-left: 1px solid #595959;
+}
+.jewel.table .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(#7f7f7f, #8c8c8c);
+  box-shadow: inset 0 1px 0 #a6a6a6;
+}
+
+.jewel.tableitem {
+  cursor: auto;
+}
+.jewel.tableitem.selectable {
+  cursor: pointer;
+}
+.jewel.tableitem.hovered:hover {
+  color: #FFFFFF;
+  background: #29A89F;
+}
+.jewel.tableitem.selected, .jewel.tableitem.selectable:active {
+  color: #FFFFFF;
+  background: #24948c;
+}
+
 .jewel.textinput {
   font-weight: 400;
   color: #FFFFFF;
@@ -540,4 +805,9 @@ j|Card {
   padding-right: 0;
 }
 
+.jewel.togglebutton .fonticon {
+  margin-left: 0px;
+  margin-right: 8px;
+}
+
 /*# sourceMappingURL=defaults.css.map */
diff --git a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Turquoise-Theme/src/main/sass/defaults.sass b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Turquoise-Theme/src/main/sass/defaults.sass
index 94cebd3..c8f87c5 100644
--- a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Turquoise-Theme/src/main/sass/defaults.sass
+++ b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Turquoise-Theme/src/main/sass/defaults.sass
@@ -31,13 +31,21 @@
 @import "../../../../JewelTheme/src/main/sass/components-primary/card"
 @import "../../../../JewelTheme/src/main/sass/components-primary/checkbox"
 @import "../../../../JewelTheme/src/main/sass/components-primary/controlbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datechooser"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datefield"
+@import "../../../../JewelTheme/src/main/sass/components-primary/divider"
 @import "../../../../JewelTheme/src/main/sass/components-primary/drawer"
+@import "../../../../JewelTheme/src/main/sass/components-primary/dropdownlist"
+@import "../../../../JewelTheme/src/main/sass/components-primary/icons"
 @import "../../../../JewelTheme/src/main/sass/components-primary/itemRenderer"
 @import "../../../../JewelTheme/src/main/sass/components-primary/label"
 @import "../../../../JewelTheme/src/main/sass/components-primary/list"
+@import "../../../../JewelTheme/src/main/sass/components-primary/navigation"
+@import "../../../../JewelTheme/src/main/sass/components-primary/numericstepper"
 @import "../../../../JewelTheme/src/main/sass/components-primary/radiobutton"
 @import "../../../../JewelTheme/src/main/sass/components-primary/slider"
-
+@import "../../../../JewelTheme/src/main/sass/components-primary/table"
 @import "../../../../JewelTheme/src/main/sass/components-primary/textinput"
 @import "../../../../JewelTheme/src/main/sass/components-primary/titlebar"
 @import "../../../../JewelTheme/src/main/sass/components-primary/topappbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/togglebutton"
diff --git a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Violet-Theme/src/main/resources/defaults.css b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Violet-Theme/src/main/resources/defaults.css
index c4e1b58..4528a86 100644
--- a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Violet-Theme/src/main/resources/defaults.css
+++ b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Violet-Theme/src/main/resources/defaults.css
@@ -234,6 +234,81 @@ j|Card {
   font-size: 16px;
 }
 
+.jewel.datechooser .jewel.table {
+  background: #8c8c8c;
+  border: 1px solid #595959;
+  border-radius: 0.25rem;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.button {
+  background: transparent;
+  border: none;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow {
+  border-bottom: 1px solid #595959;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton {
+  border-radius: 50%;
+  color: transparent;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:hover, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:hover {
+  background: #737373;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:active, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:active {
+  background: #666666;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background-size: 40%;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell {
+  background: #8c8c8c;
+  box-shadow: none;
+  border-left: 0px;
+}
+.jewel.datechooser .jewel.table .jewel.tablecell {
+  border-top: 0px;
+  border-left: 0px;
+  padding: 4px;
+}
+
+.calendar.item {
+  font-size: 1em;
+}
+.calendar.item.dayName {
+  font-weight: 600;
+}
+.calendar.item.date {
+  color: grey;
+}
+
+.jewel.datefield .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+.jewel.datefield .jewel.button {
+  color: transparent;
+  border-bottom-left-radius: 0px;
+  border-top-left-radius: 0px;
+  border-left: 0px;
+}
+.jewel.datefield .jewel.button::after {
+  background-size: 66%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 22 22' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M18.3333333,2.75 L17.4166667,2.75 L17.4166667,0.916666667 L15.5833333,0.916666667 L15.5833333,2.75 L6.41666667,2.75 L6.41666667,0.916666667 L4.58333333,0.916666667 L4.58333333,2.75 L3.66666667,2.75 C2.65833333,2.75 1.83333333,3.575 1.83333 [...]
+}
+
+.jewel.divider {
+  border-bottom-color: #595959;
+  border-bottom-width: 1px;
+  border-bottom-style: solid;
+}
+
 .jewel.drawer.float {
   color: rgba(0, 0, 0, 0.8);
 }
@@ -281,6 +356,62 @@ j|Card {
   padding: 16px;
 }
 
+.jewel.dropdownlist {
+  cursor: pointer;
+  display: inline-block;
+  margin: 0;
+  padding: 10px 16px;
+  min-width: 74px;
+  min-height: 34px;
+  background: linear-gradient(#666666, #4c4c4c);
+  border: 1px solid #333333;
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  border-radius: 3px;
+  font-family: "Lato", sans-serif;
+  font-size: 1em;
+  font-weight: bold;
+  color: #FFFFFF;
+  text-transform: uppercase;
+  text-decoration: none;
+  text-shadow: 0 -1px 0 rgba(13, 13, 13, 0.7);
+}
+.jewel.dropdownlist:hover, .jewel.dropdownlist:hover:focus {
+  background: linear-gradient(#595959, #404040);
+  border: 1px solid #262626;
+}
+.jewel.dropdownlist:active, .jewel.dropdownlist:active:focus {
+  background: linear-gradient(#404040, #262626);
+  border: 1px solid #0d0d0d;
+  box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+.jewel.dropdownlist:focus {
+  outline: none;
+  border: 1px solid #333333;
+  box-shadow: inset 0px 0px 0px 1px rgba(217, 217, 217, 0.5), inset 0 1px 0 rgba(229, 229, 229, 0.6);
+}
+.jewel.dropdownlist[disabled] {
+  cursor: unset;
+  background: #404040;
+  border: 1px solid #0d0d0d;
+  box-shadow: none;
+  color: #737373;
+  font-weight: 400;
+  text-shadow: unset;
+}
+
+.fonticon.dark {
+  color: #676767;
+}
+.fonticon.dark.inactive {
+  color: rgba(128, 128, 128, 0.3);
+}
+.fonticon.light {
+  color: white;
+}
+.fonticon.light.inactive {
+  color: rgba(255, 255, 255, 0.5);
+}
+
 .jewel.item {
   padding: 8px;
 }
@@ -320,6 +451,57 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.navigation {
+  background-color: #ffffff;
+}
+
+.jewel.numericstepper .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+
+@media (max-width: 992px) {
+  .jewel.numericstepper .jewel.textinput input {
+    border-radius: 0;
+  }
+}
+.jewel.spinner {
+  width: 34px;
+}
+.jewel.spinner .jewel.button {
+  padding: 0px;
+  height: 19px;
+  color: transparent;
+  border-radius: 0 0.25rem 0.25rem 0;
+  border-left: 0px;
+}
+.jewel.spinner .jewel.button.up {
+  border-bottom-right-radius: 0px;
+}
+.jewel.spinner .jewel.button.up::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23FFFFFF' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") no-repeat center center;
+}
+.jewel.spinner .jewel.button.down {
+  border-top-right-radius: 0px;
+  border-top-style: groove;
+}
+.jewel.spinner .jewel.button.down::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23FFFFFF' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon transform='translate(8.000000, 4.705000) scale(1, -1) translate(-8.000000, -4.705000) ' points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g [...]
+}
+
+@media (max-width: 992px) {
+  .jewel.spinner .jewel.button.up {
+    border: 1px solid #333333;
+    border-radius: 0.25rem 0 0 0.25rem;
+  }
+  .jewel.spinner .jewel.button.down {
+    border: 1px solid #333333;
+    border-radius: 0 0.25rem 0.25rem 0;
+    border-top-style: solid;
+  }
+}
 .jewel.radiobutton input + span::before {
   background: linear-gradient(#7f7f7f, #737373);
   border: 1px solid #333333;
@@ -435,6 +617,89 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.simpletable {
+  background: linear-gradient(#7f7f7f, #737373);
+  border: 1px solid #333333;
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  border-radius: 0.25rem;
+}
+.jewel.simpletable .jewel.thead tr {
+  border-bottom: 1px solid #595959;
+}
+.jewel.simpletable .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tableheadercell {
+  background: linear-gradient(#7f7f7f, #737373);
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #FFFFFF;
+  border-left: 1px solid #595959;
+}
+.jewel.simpletable .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tablecell {
+  border-top: 1px solid #595959;
+  border-left: 1px solid #595959;
+}
+.jewel.simpletable .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(#7f7f7f, #8c8c8c);
+  box-shadow: inset 0 1px 0 #a6a6a6;
+}
+
+.jewel.table {
+  background: linear-gradient(#7f7f7f, #737373);
+  border: 1px solid #333333;
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  border-radius: 0.25rem;
+}
+.jewel.table .jewel.thead tr {
+  border-bottom: 1px solid #595959;
+}
+.jewel.table .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tableheadercell {
+  background: linear-gradient(#7f7f7f, #737373);
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #FFFFFF;
+  border-left: 1px solid #595959;
+}
+.jewel.table .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tablecell {
+  border-top: 1px solid #595959;
+  border-left: 1px solid #595959;
+}
+.jewel.table .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(#7f7f7f, #8c8c8c);
+  box-shadow: inset 0 1px 0 #a6a6a6;
+}
+
+.jewel.tableitem {
+  cursor: auto;
+}
+.jewel.tableitem.selectable {
+  cursor: pointer;
+}
+.jewel.tableitem.hovered:hover {
+  color: #FFFFFF;
+  background: #662C90;
+}
+.jewel.tableitem.selected, .jewel.tableitem.selectable:active {
+  color: #FFFFFF;
+  background: #58267c;
+}
+
 .jewel.textinput {
   font-weight: 400;
   color: #FFFFFF;
@@ -540,4 +805,9 @@ j|Card {
   padding-right: 0;
 }
 
+.jewel.togglebutton .fonticon {
+  margin-left: 0px;
+  margin-right: 8px;
+}
+
 /*# sourceMappingURL=defaults.css.map */
diff --git a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Violet-Theme/src/main/sass/defaults.sass b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Violet-Theme/src/main/sass/defaults.sass
index 94cebd3..c8f87c5 100644
--- a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Violet-Theme/src/main/sass/defaults.sass
+++ b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Violet-Theme/src/main/sass/defaults.sass
@@ -31,13 +31,21 @@
 @import "../../../../JewelTheme/src/main/sass/components-primary/card"
 @import "../../../../JewelTheme/src/main/sass/components-primary/checkbox"
 @import "../../../../JewelTheme/src/main/sass/components-primary/controlbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datechooser"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datefield"
+@import "../../../../JewelTheme/src/main/sass/components-primary/divider"
 @import "../../../../JewelTheme/src/main/sass/components-primary/drawer"
+@import "../../../../JewelTheme/src/main/sass/components-primary/dropdownlist"
+@import "../../../../JewelTheme/src/main/sass/components-primary/icons"
 @import "../../../../JewelTheme/src/main/sass/components-primary/itemRenderer"
 @import "../../../../JewelTheme/src/main/sass/components-primary/label"
 @import "../../../../JewelTheme/src/main/sass/components-primary/list"
+@import "../../../../JewelTheme/src/main/sass/components-primary/navigation"
+@import "../../../../JewelTheme/src/main/sass/components-primary/numericstepper"
 @import "../../../../JewelTheme/src/main/sass/components-primary/radiobutton"
 @import "../../../../JewelTheme/src/main/sass/components-primary/slider"
-
+@import "../../../../JewelTheme/src/main/sass/components-primary/table"
 @import "../../../../JewelTheme/src/main/sass/components-primary/textinput"
 @import "../../../../JewelTheme/src/main/sass/components-primary/titlebar"
 @import "../../../../JewelTheme/src/main/sass/components-primary/topappbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/togglebutton"
diff --git a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Yellow-Theme/src/main/resources/defaults.css b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Yellow-Theme/src/main/resources/defaults.css
index 384e283..fe69c12 100644
--- a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Yellow-Theme/src/main/resources/defaults.css
+++ b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Yellow-Theme/src/main/resources/defaults.css
@@ -234,6 +234,81 @@ j|Card {
   font-size: 16px;
 }
 
+.jewel.datechooser .jewel.table {
+  background: #8c8c8c;
+  border: 1px solid #595959;
+  border-radius: 0.25rem;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.button {
+  background: transparent;
+  border: none;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow {
+  border-bottom: 1px solid #595959;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton {
+  border-radius: 50%;
+  color: transparent;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:hover, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:hover {
+  background: #737373;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:active, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:active {
+  background: #666666;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background-size: 40%;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell {
+  background: #8c8c8c;
+  box-shadow: none;
+  border-left: 0px;
+}
+.jewel.datechooser .jewel.table .jewel.tablecell {
+  border-top: 0px;
+  border-left: 0px;
+  padding: 4px;
+}
+
+.calendar.item {
+  font-size: 1em;
+}
+.calendar.item.dayName {
+  font-weight: 600;
+}
+.calendar.item.date {
+  color: grey;
+}
+
+.jewel.datefield .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+.jewel.datefield .jewel.button {
+  color: transparent;
+  border-bottom-left-radius: 0px;
+  border-top-left-radius: 0px;
+  border-left: 0px;
+}
+.jewel.datefield .jewel.button::after {
+  background-size: 66%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 22 22' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M18.3333333,2.75 L17.4166667,2.75 L17.4166667,0.916666667 L15.5833333,0.916666667 L15.5833333,2.75 L6.41666667,2.75 L6.41666667,0.916666667 L4.58333333,0.916666667 L4.58333333,2.75 L3.66666667,2.75 C2.65833333,2.75 1.83333333,3.575 1.83333 [...]
+}
+
+.jewel.divider {
+  border-bottom-color: #595959;
+  border-bottom-width: 1px;
+  border-bottom-style: solid;
+}
+
 .jewel.drawer.float {
   color: rgba(0, 0, 0, 0.8);
 }
@@ -281,6 +356,62 @@ j|Card {
   padding: 16px;
 }
 
+.jewel.dropdownlist {
+  cursor: pointer;
+  display: inline-block;
+  margin: 0;
+  padding: 10px 16px;
+  min-width: 74px;
+  min-height: 34px;
+  background: linear-gradient(#666666, #4c4c4c);
+  border: 1px solid #333333;
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  border-radius: 3px;
+  font-family: "Lato", sans-serif;
+  font-size: 1em;
+  font-weight: bold;
+  color: #FFFFFF;
+  text-transform: uppercase;
+  text-decoration: none;
+  text-shadow: 0 -1px 0 rgba(13, 13, 13, 0.7);
+}
+.jewel.dropdownlist:hover, .jewel.dropdownlist:hover:focus {
+  background: linear-gradient(#595959, #404040);
+  border: 1px solid #262626;
+}
+.jewel.dropdownlist:active, .jewel.dropdownlist:active:focus {
+  background: linear-gradient(#404040, #262626);
+  border: 1px solid #0d0d0d;
+  box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+.jewel.dropdownlist:focus {
+  outline: none;
+  border: 1px solid #333333;
+  box-shadow: inset 0px 0px 0px 1px rgba(217, 217, 217, 0.5), inset 0 1px 0 rgba(229, 229, 229, 0.6);
+}
+.jewel.dropdownlist[disabled] {
+  cursor: unset;
+  background: #404040;
+  border: 1px solid #0d0d0d;
+  box-shadow: none;
+  color: #737373;
+  font-weight: 400;
+  text-shadow: unset;
+}
+
+.fonticon.dark {
+  color: #676767;
+}
+.fonticon.dark.inactive {
+  color: rgba(128, 128, 128, 0.3);
+}
+.fonticon.light {
+  color: white;
+}
+.fonticon.light.inactive {
+  color: rgba(255, 255, 255, 0.5);
+}
+
 .jewel.item {
   padding: 8px;
 }
@@ -320,6 +451,57 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.navigation {
+  background-color: #ffffff;
+}
+
+.jewel.numericstepper .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+
+@media (max-width: 992px) {
+  .jewel.numericstepper .jewel.textinput input {
+    border-radius: 0;
+  }
+}
+.jewel.spinner {
+  width: 34px;
+}
+.jewel.spinner .jewel.button {
+  padding: 0px;
+  height: 19px;
+  color: transparent;
+  border-radius: 0 0.25rem 0.25rem 0;
+  border-left: 0px;
+}
+.jewel.spinner .jewel.button.up {
+  border-bottom-right-radius: 0px;
+}
+.jewel.spinner .jewel.button.up::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23FFFFFF' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") no-repeat center center;
+}
+.jewel.spinner .jewel.button.down {
+  border-top-right-radius: 0px;
+  border-top-style: groove;
+}
+.jewel.spinner .jewel.button.down::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23FFFFFF' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon transform='translate(8.000000, 4.705000) scale(1, -1) translate(-8.000000, -4.705000) ' points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g [...]
+}
+
+@media (max-width: 992px) {
+  .jewel.spinner .jewel.button.up {
+    border: 1px solid #333333;
+    border-radius: 0.25rem 0 0 0.25rem;
+  }
+  .jewel.spinner .jewel.button.down {
+    border: 1px solid #333333;
+    border-radius: 0 0.25rem 0.25rem 0;
+    border-top-style: solid;
+  }
+}
 .jewel.radiobutton input + span::before {
   background: linear-gradient(#7f7f7f, #737373);
   border: 1px solid #333333;
@@ -435,6 +617,89 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.simpletable {
+  background: linear-gradient(#7f7f7f, #737373);
+  border: 1px solid #333333;
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  border-radius: 0.25rem;
+}
+.jewel.simpletable .jewel.thead tr {
+  border-bottom: 1px solid #595959;
+}
+.jewel.simpletable .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tableheadercell {
+  background: linear-gradient(#7f7f7f, #737373);
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #FFFFFF;
+  border-left: 1px solid #595959;
+}
+.jewel.simpletable .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tablecell {
+  border-top: 1px solid #595959;
+  border-left: 1px solid #595959;
+}
+.jewel.simpletable .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(#7f7f7f, #8c8c8c);
+  box-shadow: inset 0 1px 0 #a6a6a6;
+}
+
+.jewel.table {
+  background: linear-gradient(#7f7f7f, #737373);
+  border: 1px solid #333333;
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  border-radius: 0.25rem;
+}
+.jewel.table .jewel.thead tr {
+  border-bottom: 1px solid #595959;
+}
+.jewel.table .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tableheadercell {
+  background: linear-gradient(#7f7f7f, #737373);
+  box-shadow: inset 0 1px 0 #8c8c8c;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #FFFFFF;
+  border-left: 1px solid #595959;
+}
+.jewel.table .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tablecell {
+  border-top: 1px solid #595959;
+  border-left: 1px solid #595959;
+}
+.jewel.table .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(#7f7f7f, #8c8c8c);
+  box-shadow: inset 0 1px 0 #a6a6a6;
+}
+
+.jewel.tableitem {
+  cursor: auto;
+}
+.jewel.tableitem.selectable {
+  cursor: pointer;
+}
+.jewel.tableitem.hovered:hover {
+  color: #FFFFFF;
+  background: #E2D70B;
+}
+.jewel.tableitem.selected, .jewel.tableitem.selectable:active {
+  color: #FFFFFF;
+  background: #cac00a;
+}
+
 .jewel.textinput {
   font-weight: 400;
   color: #FFFFFF;
@@ -540,4 +805,9 @@ j|Card {
   padding-right: 0;
 }
 
+.jewel.togglebutton .fonticon {
+  margin-left: 0px;
+  margin-right: 8px;
+}
+
 /*# sourceMappingURL=defaults.css.map */
diff --git a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Yellow-Theme/src/main/sass/defaults.sass b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Yellow-Theme/src/main/sass/defaults.sass
index 94cebd3..c8f87c5 100644
--- a/frameworks/themes/Jewel-Dark-NoFlat-Primary-Yellow-Theme/src/main/sass/defaults.sass
+++ b/frameworks/themes/Jewel-Dark-NoFlat-Primary-Yellow-Theme/src/main/sass/defaults.sass
@@ -31,13 +31,21 @@
 @import "../../../../JewelTheme/src/main/sass/components-primary/card"
 @import "../../../../JewelTheme/src/main/sass/components-primary/checkbox"
 @import "../../../../JewelTheme/src/main/sass/components-primary/controlbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datechooser"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datefield"
+@import "../../../../JewelTheme/src/main/sass/components-primary/divider"
 @import "../../../../JewelTheme/src/main/sass/components-primary/drawer"
+@import "../../../../JewelTheme/src/main/sass/components-primary/dropdownlist"
+@import "../../../../JewelTheme/src/main/sass/components-primary/icons"
 @import "../../../../JewelTheme/src/main/sass/components-primary/itemRenderer"
 @import "../../../../JewelTheme/src/main/sass/components-primary/label"
 @import "../../../../JewelTheme/src/main/sass/components-primary/list"
+@import "../../../../JewelTheme/src/main/sass/components-primary/navigation"
+@import "../../../../JewelTheme/src/main/sass/components-primary/numericstepper"
 @import "../../../../JewelTheme/src/main/sass/components-primary/radiobutton"
 @import "../../../../JewelTheme/src/main/sass/components-primary/slider"
-
+@import "../../../../JewelTheme/src/main/sass/components-primary/table"
 @import "../../../../JewelTheme/src/main/sass/components-primary/textinput"
 @import "../../../../JewelTheme/src/main/sass/components-primary/titlebar"
 @import "../../../../JewelTheme/src/main/sass/components-primary/topappbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/togglebutton"
diff --git a/frameworks/themes/Jewel-Light-NoFlat-Primary-Amethyst-Theme/src/main/resources/defaults.css b/frameworks/themes/Jewel-Light-NoFlat-Primary-Amethyst-Theme/src/main/resources/defaults.css
index d3a017d..0797288 100644
--- a/frameworks/themes/Jewel-Light-NoFlat-Primary-Amethyst-Theme/src/main/resources/defaults.css
+++ b/frameworks/themes/Jewel-Light-NoFlat-Primary-Amethyst-Theme/src/main/resources/defaults.css
@@ -233,6 +233,81 @@ j|Card {
   font-size: 16px;
 }
 
+.jewel.datechooser .jewel.table {
+  background: white;
+  border: 1px solid #d9d9d9;
+  border-radius: 0.25rem;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.button {
+  background: transparent;
+  border: none;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow {
+  border-bottom: 1px solid #d9d9d9;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton {
+  border-radius: 50%;
+  color: transparent;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:hover, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:hover {
+  background: #f3f3f3;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:active, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:active {
+  background: #e6e6e6;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background-size: 40%;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell {
+  background: white;
+  box-shadow: none;
+  border-left: 0px;
+}
+.jewel.datechooser .jewel.table .jewel.tablecell {
+  border-top: 0px;
+  border-left: 0px;
+  padding: 4px;
+}
+
+.calendar.item {
+  font-size: 1em;
+}
+.calendar.item.dayName {
+  font-weight: 600;
+}
+.calendar.item.date {
+  color: grey;
+}
+
+.jewel.datefield .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+.jewel.datefield .jewel.button {
+  color: transparent;
+  border-bottom-left-radius: 0px;
+  border-top-left-radius: 0px;
+  border-left: 0px;
+}
+.jewel.datefield .jewel.button::after {
+  background-size: 66%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 22 22' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M18.3333333,2.75 L17.4166667,2.75 L17.4166667,0.916666667 L15.5833333,0.916666667 L15.5833333,2.75 L6.41666667,2.75 L6.41666667,0.916666667 L4.58333333,0.916666667 L4.58333333,2.75 L3.66666667,2.75 C2.65833333,2.75 1.83333333,3.575 1.83333 [...]
+}
+
+.jewel.divider {
+  border-bottom-color: #d9d9d9;
+  border-bottom-width: 1px;
+  border-bottom-style: solid;
+}
+
 .jewel.drawer.float {
   color: rgba(0, 0, 0, 0.8);
 }
@@ -280,6 +355,61 @@ j|Card {
   padding: 16px;
 }
 
+.jewel.dropdownlist {
+  cursor: pointer;
+  display: inline-block;
+  margin: 0;
+  padding: 10px 16px;
+  min-width: 74px;
+  min-height: 34px;
+  background: linear-gradient(#e6e6e6, #cccccc);
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0 1px 0 white;
+  border-radius: 3px;
+  font-family: "Lato", sans-serif;
+  font-size: 1em;
+  font-weight: bold;
+  color: #808080;
+  text-transform: uppercase;
+  text-decoration: none;
+}
+.jewel.dropdownlist:hover, .jewel.dropdownlist:hover:focus {
+  background: linear-gradient(#d9d9d9, silver);
+  border: 1px solid #a6a6a6;
+}
+.jewel.dropdownlist:active, .jewel.dropdownlist:active:focus {
+  background: linear-gradient(silver, #a6a6a6);
+  border: 1px solid #8d8d8d;
+  box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+.jewel.dropdownlist:focus {
+  outline: none;
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0px 0px 0px 1px rgba(255, 255, 255, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.6);
+}
+.jewel.dropdownlist[disabled] {
+  cursor: unset;
+  background: #f3f3f3;
+  border: 1px solid #d9d9d9;
+  box-shadow: none;
+  color: silver;
+  font-weight: 400;
+  text-shadow: unset;
+}
+
+.fonticon.dark {
+  color: #676767;
+}
+.fonticon.dark.inactive {
+  color: rgba(128, 128, 128, 0.3);
+}
+.fonticon.light {
+  color: white;
+}
+.fonticon.light.inactive {
+  color: rgba(255, 255, 255, 0.5);
+}
+
 .jewel.item {
   padding: 8px;
 }
@@ -319,6 +449,57 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.navigation {
+  background-color: #ffffff;
+}
+
+.jewel.numericstepper .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+
+@media (max-width: 992px) {
+  .jewel.numericstepper .jewel.textinput input {
+    border-radius: 0;
+  }
+}
+.jewel.spinner {
+  width: 34px;
+}
+.jewel.spinner .jewel.button {
+  padding: 0px;
+  height: 19px;
+  color: transparent;
+  border-radius: 0 0.25rem 0.25rem 0;
+  border-left: 0px;
+}
+.jewel.spinner .jewel.button.up {
+  border-bottom-right-radius: 0px;
+}
+.jewel.spinner .jewel.button.up::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23808080' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") no-repeat center center;
+}
+.jewel.spinner .jewel.button.down {
+  border-top-right-radius: 0px;
+  border-top-style: groove;
+}
+.jewel.spinner .jewel.button.down::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23808080' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon transform='translate(8.000000, 4.705000) scale(1, -1) translate(-8.000000, -4.705000) ' points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g [...]
+}
+
+@media (max-width: 992px) {
+  .jewel.spinner .jewel.button.up {
+    border: 1px solid #b3b3b3;
+    border-radius: 0.25rem 0 0 0.25rem;
+  }
+  .jewel.spinner .jewel.button.down {
+    border: 1px solid #b3b3b3;
+    border-radius: 0 0.25rem 0.25rem 0;
+    border-top-style: solid;
+  }
+}
 .jewel.radiobutton input + span::before {
   background: linear-gradient(white, #f3f3f3);
   border: 1px solid #b3b3b3;
@@ -434,6 +615,89 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.simpletable {
+  background: linear-gradient(white, #f3f3f3);
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0 1px 0 white;
+  border-radius: 0.25rem;
+}
+.jewel.simpletable .jewel.thead tr {
+  border-bottom: 1px solid #d9d9d9;
+}
+.jewel.simpletable .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tableheadercell {
+  background: linear-gradient(white, #f3f3f3);
+  box-shadow: inset 0 1px 0 white;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #808080;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.simpletable .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tablecell {
+  border-top: 1px solid #d9d9d9;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.simpletable .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(white, white);
+  box-shadow: inset 0 1px 0 white;
+}
+
+.jewel.table {
+  background: linear-gradient(white, #f3f3f3);
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0 1px 0 white;
+  border-radius: 0.25rem;
+}
+.jewel.table .jewel.thead tr {
+  border-bottom: 1px solid #d9d9d9;
+}
+.jewel.table .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tableheadercell {
+  background: linear-gradient(white, #f3f3f3);
+  box-shadow: inset 0 1px 0 white;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #808080;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.table .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tablecell {
+  border-top: 1px solid #d9d9d9;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.table .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(white, white);
+  box-shadow: inset 0 1px 0 white;
+}
+
+.jewel.tableitem {
+  cursor: auto;
+}
+.jewel.tableitem.selectable {
+  cursor: pointer;
+}
+.jewel.tableitem.hovered:hover {
+  color: #FFFFFF;
+  background: #C92CC6;
+}
+.jewel.tableitem.selected, .jewel.tableitem.selectable:active {
+  color: #FFFFFF;
+  background: #b427b1;
+}
+
 .jewel.textinput {
   font-weight: 400;
   color: #808080;
@@ -539,4 +803,9 @@ j|Card {
   padding-right: 0;
 }
 
+.jewel.togglebutton .fonticon {
+  margin-left: 0px;
+  margin-right: 8px;
+}
+
 /*# sourceMappingURL=defaults.css.map */
diff --git a/frameworks/themes/Jewel-Light-NoFlat-Primary-Amethyst-Theme/src/main/sass/defaults.sass b/frameworks/themes/Jewel-Light-NoFlat-Primary-Amethyst-Theme/src/main/sass/defaults.sass
index 94cebd3..c8f87c5 100644
--- a/frameworks/themes/Jewel-Light-NoFlat-Primary-Amethyst-Theme/src/main/sass/defaults.sass
+++ b/frameworks/themes/Jewel-Light-NoFlat-Primary-Amethyst-Theme/src/main/sass/defaults.sass
@@ -31,13 +31,21 @@
 @import "../../../../JewelTheme/src/main/sass/components-primary/card"
 @import "../../../../JewelTheme/src/main/sass/components-primary/checkbox"
 @import "../../../../JewelTheme/src/main/sass/components-primary/controlbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datechooser"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datefield"
+@import "../../../../JewelTheme/src/main/sass/components-primary/divider"
 @import "../../../../JewelTheme/src/main/sass/components-primary/drawer"
+@import "../../../../JewelTheme/src/main/sass/components-primary/dropdownlist"
+@import "../../../../JewelTheme/src/main/sass/components-primary/icons"
 @import "../../../../JewelTheme/src/main/sass/components-primary/itemRenderer"
 @import "../../../../JewelTheme/src/main/sass/components-primary/label"
 @import "../../../../JewelTheme/src/main/sass/components-primary/list"
+@import "../../../../JewelTheme/src/main/sass/components-primary/navigation"
+@import "../../../../JewelTheme/src/main/sass/components-primary/numericstepper"
 @import "../../../../JewelTheme/src/main/sass/components-primary/radiobutton"
 @import "../../../../JewelTheme/src/main/sass/components-primary/slider"
-
+@import "../../../../JewelTheme/src/main/sass/components-primary/table"
 @import "../../../../JewelTheme/src/main/sass/components-primary/textinput"
 @import "../../../../JewelTheme/src/main/sass/components-primary/titlebar"
 @import "../../../../JewelTheme/src/main/sass/components-primary/topappbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/togglebutton"
diff --git a/frameworks/themes/Jewel-Light-NoFlat-Primary-Blue-Theme/src/main/resources/defaults.css b/frameworks/themes/Jewel-Light-NoFlat-Primary-Blue-Theme/src/main/resources/defaults.css
index d273884..4c77b0a 100644
--- a/frameworks/themes/Jewel-Light-NoFlat-Primary-Blue-Theme/src/main/resources/defaults.css
+++ b/frameworks/themes/Jewel-Light-NoFlat-Primary-Blue-Theme/src/main/resources/defaults.css
@@ -233,6 +233,81 @@ j|Card {
   font-size: 16px;
 }
 
+.jewel.datechooser .jewel.table {
+  background: white;
+  border: 1px solid #d9d9d9;
+  border-radius: 0.25rem;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.button {
+  background: transparent;
+  border: none;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow {
+  border-bottom: 1px solid #d9d9d9;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton {
+  border-radius: 50%;
+  color: transparent;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:hover, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:hover {
+  background: #f3f3f3;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:active, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:active {
+  background: #e6e6e6;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background-size: 40%;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell {
+  background: white;
+  box-shadow: none;
+  border-left: 0px;
+}
+.jewel.datechooser .jewel.table .jewel.tablecell {
+  border-top: 0px;
+  border-left: 0px;
+  padding: 4px;
+}
+
+.calendar.item {
+  font-size: 1em;
+}
+.calendar.item.dayName {
+  font-weight: 600;
+}
+.calendar.item.date {
+  color: grey;
+}
+
+.jewel.datefield .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+.jewel.datefield .jewel.button {
+  color: transparent;
+  border-bottom-left-radius: 0px;
+  border-top-left-radius: 0px;
+  border-left: 0px;
+}
+.jewel.datefield .jewel.button::after {
+  background-size: 66%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 22 22' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M18.3333333,2.75 L17.4166667,2.75 L17.4166667,0.916666667 L15.5833333,0.916666667 L15.5833333,2.75 L6.41666667,2.75 L6.41666667,0.916666667 L4.58333333,0.916666667 L4.58333333,2.75 L3.66666667,2.75 C2.65833333,2.75 1.83333333,3.575 1.83333 [...]
+}
+
+.jewel.divider {
+  border-bottom-color: #d9d9d9;
+  border-bottom-width: 1px;
+  border-bottom-style: solid;
+}
+
 .jewel.drawer.float {
   color: rgba(0, 0, 0, 0.8);
 }
@@ -280,6 +355,61 @@ j|Card {
   padding: 16px;
 }
 
+.jewel.dropdownlist {
+  cursor: pointer;
+  display: inline-block;
+  margin: 0;
+  padding: 10px 16px;
+  min-width: 74px;
+  min-height: 34px;
+  background: linear-gradient(#e6e6e6, #cccccc);
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0 1px 0 white;
+  border-radius: 3px;
+  font-family: "Lato", sans-serif;
+  font-size: 1em;
+  font-weight: bold;
+  color: #808080;
+  text-transform: uppercase;
+  text-decoration: none;
+}
+.jewel.dropdownlist:hover, .jewel.dropdownlist:hover:focus {
+  background: linear-gradient(#d9d9d9, silver);
+  border: 1px solid #a6a6a6;
+}
+.jewel.dropdownlist:active, .jewel.dropdownlist:active:focus {
+  background: linear-gradient(silver, #a6a6a6);
+  border: 1px solid #8d8d8d;
+  box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+.jewel.dropdownlist:focus {
+  outline: none;
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0px 0px 0px 1px rgba(255, 255, 255, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.6);
+}
+.jewel.dropdownlist[disabled] {
+  cursor: unset;
+  background: #f3f3f3;
+  border: 1px solid #d9d9d9;
+  box-shadow: none;
+  color: silver;
+  font-weight: 400;
+  text-shadow: unset;
+}
+
+.fonticon.dark {
+  color: #676767;
+}
+.fonticon.dark.inactive {
+  color: rgba(128, 128, 128, 0.3);
+}
+.fonticon.light {
+  color: white;
+}
+.fonticon.light.inactive {
+  color: rgba(255, 255, 255, 0.5);
+}
+
 .jewel.item {
   padding: 8px;
 }
@@ -319,6 +449,57 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.navigation {
+  background-color: #ffffff;
+}
+
+.jewel.numericstepper .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+
+@media (max-width: 992px) {
+  .jewel.numericstepper .jewel.textinput input {
+    border-radius: 0;
+  }
+}
+.jewel.spinner {
+  width: 34px;
+}
+.jewel.spinner .jewel.button {
+  padding: 0px;
+  height: 19px;
+  color: transparent;
+  border-radius: 0 0.25rem 0.25rem 0;
+  border-left: 0px;
+}
+.jewel.spinner .jewel.button.up {
+  border-bottom-right-radius: 0px;
+}
+.jewel.spinner .jewel.button.up::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23808080' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") no-repeat center center;
+}
+.jewel.spinner .jewel.button.down {
+  border-top-right-radius: 0px;
+  border-top-style: groove;
+}
+.jewel.spinner .jewel.button.down::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23808080' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon transform='translate(8.000000, 4.705000) scale(1, -1) translate(-8.000000, -4.705000) ' points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g [...]
+}
+
+@media (max-width: 992px) {
+  .jewel.spinner .jewel.button.up {
+    border: 1px solid #b3b3b3;
+    border-radius: 0.25rem 0 0 0.25rem;
+  }
+  .jewel.spinner .jewel.button.down {
+    border: 1px solid #b3b3b3;
+    border-radius: 0 0.25rem 0.25rem 0;
+    border-top-style: solid;
+  }
+}
 .jewel.radiobutton input + span::before {
   background: linear-gradient(white, #f3f3f3);
   border: 1px solid #b3b3b3;
@@ -434,6 +615,89 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.simpletable {
+  background: linear-gradient(white, #f3f3f3);
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0 1px 0 white;
+  border-radius: 0.25rem;
+}
+.jewel.simpletable .jewel.thead tr {
+  border-bottom: 1px solid #d9d9d9;
+}
+.jewel.simpletable .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tableheadercell {
+  background: linear-gradient(white, #f3f3f3);
+  box-shadow: inset 0 1px 0 white;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #808080;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.simpletable .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tablecell {
+  border-top: 1px solid #d9d9d9;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.simpletable .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(white, white);
+  box-shadow: inset 0 1px 0 white;
+}
+
+.jewel.table {
+  background: linear-gradient(white, #f3f3f3);
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0 1px 0 white;
+  border-radius: 0.25rem;
+}
+.jewel.table .jewel.thead tr {
+  border-bottom: 1px solid #d9d9d9;
+}
+.jewel.table .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tableheadercell {
+  background: linear-gradient(white, #f3f3f3);
+  box-shadow: inset 0 1px 0 white;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #808080;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.table .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tablecell {
+  border-top: 1px solid #d9d9d9;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.table .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(white, white);
+  box-shadow: inset 0 1px 0 white;
+}
+
+.jewel.tableitem {
+  cursor: auto;
+}
+.jewel.tableitem.selectable {
+  cursor: pointer;
+}
+.jewel.tableitem.hovered:hover {
+  color: #FFFFFF;
+  background: #3CADF1;
+}
+.jewel.tableitem.selected, .jewel.tableitem.selectable:active {
+  color: #FFFFFF;
+  background: #24a3ef;
+}
+
 .jewel.textinput {
   font-weight: 400;
   color: #808080;
@@ -539,4 +803,9 @@ j|Card {
   padding-right: 0;
 }
 
+.jewel.togglebutton .fonticon {
+  margin-left: 0px;
+  margin-right: 8px;
+}
+
 /*# sourceMappingURL=defaults.css.map */
diff --git a/frameworks/themes/Jewel-Light-NoFlat-Primary-Blue-Theme/src/main/sass/defaults.sass b/frameworks/themes/Jewel-Light-NoFlat-Primary-Blue-Theme/src/main/sass/defaults.sass
index 94cebd3..c8f87c5 100644
--- a/frameworks/themes/Jewel-Light-NoFlat-Primary-Blue-Theme/src/main/sass/defaults.sass
+++ b/frameworks/themes/Jewel-Light-NoFlat-Primary-Blue-Theme/src/main/sass/defaults.sass
@@ -31,13 +31,21 @@
 @import "../../../../JewelTheme/src/main/sass/components-primary/card"
 @import "../../../../JewelTheme/src/main/sass/components-primary/checkbox"
 @import "../../../../JewelTheme/src/main/sass/components-primary/controlbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datechooser"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datefield"
+@import "../../../../JewelTheme/src/main/sass/components-primary/divider"
 @import "../../../../JewelTheme/src/main/sass/components-primary/drawer"
+@import "../../../../JewelTheme/src/main/sass/components-primary/dropdownlist"
+@import "../../../../JewelTheme/src/main/sass/components-primary/icons"
 @import "../../../../JewelTheme/src/main/sass/components-primary/itemRenderer"
 @import "../../../../JewelTheme/src/main/sass/components-primary/label"
 @import "../../../../JewelTheme/src/main/sass/components-primary/list"
+@import "../../../../JewelTheme/src/main/sass/components-primary/navigation"
+@import "../../../../JewelTheme/src/main/sass/components-primary/numericstepper"
 @import "../../../../JewelTheme/src/main/sass/components-primary/radiobutton"
 @import "../../../../JewelTheme/src/main/sass/components-primary/slider"
-
+@import "../../../../JewelTheme/src/main/sass/components-primary/table"
 @import "../../../../JewelTheme/src/main/sass/components-primary/textinput"
 @import "../../../../JewelTheme/src/main/sass/components-primary/titlebar"
 @import "../../../../JewelTheme/src/main/sass/components-primary/topappbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/togglebutton"
diff --git a/frameworks/themes/Jewel-Light-NoFlat-Primary-Emerald-Theme/src/main/resources/defaults.css b/frameworks/themes/Jewel-Light-NoFlat-Primary-Emerald-Theme/src/main/resources/defaults.css
index 9018419..59592d8 100644
--- a/frameworks/themes/Jewel-Light-NoFlat-Primary-Emerald-Theme/src/main/resources/defaults.css
+++ b/frameworks/themes/Jewel-Light-NoFlat-Primary-Emerald-Theme/src/main/resources/defaults.css
@@ -233,6 +233,81 @@ j|Card {
   font-size: 16px;
 }
 
+.jewel.datechooser .jewel.table {
+  background: white;
+  border: 1px solid #d9d9d9;
+  border-radius: 0.25rem;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.button {
+  background: transparent;
+  border: none;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow {
+  border-bottom: 1px solid #d9d9d9;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton {
+  border-radius: 50%;
+  color: transparent;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:hover, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:hover {
+  background: #f3f3f3;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:active, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:active {
+  background: #e6e6e6;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background-size: 40%;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell {
+  background: white;
+  box-shadow: none;
+  border-left: 0px;
+}
+.jewel.datechooser .jewel.table .jewel.tablecell {
+  border-top: 0px;
+  border-left: 0px;
+  padding: 4px;
+}
+
+.calendar.item {
+  font-size: 1em;
+}
+.calendar.item.dayName {
+  font-weight: 600;
+}
+.calendar.item.date {
+  color: grey;
+}
+
+.jewel.datefield .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+.jewel.datefield .jewel.button {
+  color: transparent;
+  border-bottom-left-radius: 0px;
+  border-top-left-radius: 0px;
+  border-left: 0px;
+}
+.jewel.datefield .jewel.button::after {
+  background-size: 66%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 22 22' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M18.3333333,2.75 L17.4166667,2.75 L17.4166667,0.916666667 L15.5833333,0.916666667 L15.5833333,2.75 L6.41666667,2.75 L6.41666667,0.916666667 L4.58333333,0.916666667 L4.58333333,2.75 L3.66666667,2.75 C2.65833333,2.75 1.83333333,3.575 1.83333 [...]
+}
+
+.jewel.divider {
+  border-bottom-color: #d9d9d9;
+  border-bottom-width: 1px;
+  border-bottom-style: solid;
+}
+
 .jewel.drawer.float {
   color: rgba(0, 0, 0, 0.8);
 }
@@ -280,6 +355,61 @@ j|Card {
   padding: 16px;
 }
 
+.jewel.dropdownlist {
+  cursor: pointer;
+  display: inline-block;
+  margin: 0;
+  padding: 10px 16px;
+  min-width: 74px;
+  min-height: 34px;
+  background: linear-gradient(#e6e6e6, #cccccc);
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0 1px 0 white;
+  border-radius: 3px;
+  font-family: "Lato", sans-serif;
+  font-size: 1em;
+  font-weight: bold;
+  color: #808080;
+  text-transform: uppercase;
+  text-decoration: none;
+}
+.jewel.dropdownlist:hover, .jewel.dropdownlist:hover:focus {
+  background: linear-gradient(#d9d9d9, silver);
+  border: 1px solid #a6a6a6;
+}
+.jewel.dropdownlist:active, .jewel.dropdownlist:active:focus {
+  background: linear-gradient(silver, #a6a6a6);
+  border: 1px solid #8d8d8d;
+  box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+.jewel.dropdownlist:focus {
+  outline: none;
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0px 0px 0px 1px rgba(255, 255, 255, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.6);
+}
+.jewel.dropdownlist[disabled] {
+  cursor: unset;
+  background: #f3f3f3;
+  border: 1px solid #d9d9d9;
+  box-shadow: none;
+  color: silver;
+  font-weight: 400;
+  text-shadow: unset;
+}
+
+.fonticon.dark {
+  color: #676767;
+}
+.fonticon.dark.inactive {
+  color: rgba(128, 128, 128, 0.3);
+}
+.fonticon.light {
+  color: white;
+}
+.fonticon.light.inactive {
+  color: rgba(255, 255, 255, 0.5);
+}
+
 .jewel.item {
   padding: 8px;
 }
@@ -319,6 +449,57 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.navigation {
+  background-color: #ffffff;
+}
+
+.jewel.numericstepper .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+
+@media (max-width: 992px) {
+  .jewel.numericstepper .jewel.textinput input {
+    border-radius: 0;
+  }
+}
+.jewel.spinner {
+  width: 34px;
+}
+.jewel.spinner .jewel.button {
+  padding: 0px;
+  height: 19px;
+  color: transparent;
+  border-radius: 0 0.25rem 0.25rem 0;
+  border-left: 0px;
+}
+.jewel.spinner .jewel.button.up {
+  border-bottom-right-radius: 0px;
+}
+.jewel.spinner .jewel.button.up::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23808080' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") no-repeat center center;
+}
+.jewel.spinner .jewel.button.down {
+  border-top-right-radius: 0px;
+  border-top-style: groove;
+}
+.jewel.spinner .jewel.button.down::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23808080' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon transform='translate(8.000000, 4.705000) scale(1, -1) translate(-8.000000, -4.705000) ' points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g [...]
+}
+
+@media (max-width: 992px) {
+  .jewel.spinner .jewel.button.up {
+    border: 1px solid #b3b3b3;
+    border-radius: 0.25rem 0 0 0.25rem;
+  }
+  .jewel.spinner .jewel.button.down {
+    border: 1px solid #b3b3b3;
+    border-radius: 0 0.25rem 0.25rem 0;
+    border-top-style: solid;
+  }
+}
 .jewel.radiobutton input + span::before {
   background: linear-gradient(white, #f3f3f3);
   border: 1px solid #b3b3b3;
@@ -434,6 +615,89 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.simpletable {
+  background: linear-gradient(white, #f3f3f3);
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0 1px 0 white;
+  border-radius: 0.25rem;
+}
+.jewel.simpletable .jewel.thead tr {
+  border-bottom: 1px solid #d9d9d9;
+}
+.jewel.simpletable .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tableheadercell {
+  background: linear-gradient(white, #f3f3f3);
+  box-shadow: inset 0 1px 0 white;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #808080;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.simpletable .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tablecell {
+  border-top: 1px solid #d9d9d9;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.simpletable .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(white, white);
+  box-shadow: inset 0 1px 0 white;
+}
+
+.jewel.table {
+  background: linear-gradient(white, #f3f3f3);
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0 1px 0 white;
+  border-radius: 0.25rem;
+}
+.jewel.table .jewel.thead tr {
+  border-bottom: 1px solid #d9d9d9;
+}
+.jewel.table .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tableheadercell {
+  background: linear-gradient(white, #f3f3f3);
+  box-shadow: inset 0 1px 0 white;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #808080;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.table .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tablecell {
+  border-top: 1px solid #d9d9d9;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.table .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(white, white);
+  box-shadow: inset 0 1px 0 white;
+}
+
+.jewel.tableitem {
+  cursor: auto;
+}
+.jewel.tableitem.selectable {
+  cursor: pointer;
+}
+.jewel.tableitem.hovered:hover {
+  color: #FFFFFF;
+  background: #8CC63C;
+}
+.jewel.tableitem.selected, .jewel.tableitem.selectable:active {
+  color: #FFFFFF;
+  background: #7eb435;
+}
+
 .jewel.textinput {
   font-weight: 400;
   color: #808080;
@@ -539,4 +803,9 @@ j|Card {
   padding-right: 0;
 }
 
+.jewel.togglebutton .fonticon {
+  margin-left: 0px;
+  margin-right: 8px;
+}
+
 /*# sourceMappingURL=defaults.css.map */
diff --git a/frameworks/themes/Jewel-Light-NoFlat-Primary-Emerald-Theme/src/main/sass/defaults.sass b/frameworks/themes/Jewel-Light-NoFlat-Primary-Emerald-Theme/src/main/sass/defaults.sass
index 94cebd3..c8f87c5 100644
--- a/frameworks/themes/Jewel-Light-NoFlat-Primary-Emerald-Theme/src/main/sass/defaults.sass
+++ b/frameworks/themes/Jewel-Light-NoFlat-Primary-Emerald-Theme/src/main/sass/defaults.sass
@@ -31,13 +31,21 @@
 @import "../../../../JewelTheme/src/main/sass/components-primary/card"
 @import "../../../../JewelTheme/src/main/sass/components-primary/checkbox"
 @import "../../../../JewelTheme/src/main/sass/components-primary/controlbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datechooser"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datefield"
+@import "../../../../JewelTheme/src/main/sass/components-primary/divider"
 @import "../../../../JewelTheme/src/main/sass/components-primary/drawer"
+@import "../../../../JewelTheme/src/main/sass/components-primary/dropdownlist"
+@import "../../../../JewelTheme/src/main/sass/components-primary/icons"
 @import "../../../../JewelTheme/src/main/sass/components-primary/itemRenderer"
 @import "../../../../JewelTheme/src/main/sass/components-primary/label"
 @import "../../../../JewelTheme/src/main/sass/components-primary/list"
+@import "../../../../JewelTheme/src/main/sass/components-primary/navigation"
+@import "../../../../JewelTheme/src/main/sass/components-primary/numericstepper"
 @import "../../../../JewelTheme/src/main/sass/components-primary/radiobutton"
 @import "../../../../JewelTheme/src/main/sass/components-primary/slider"
-
+@import "../../../../JewelTheme/src/main/sass/components-primary/table"
 @import "../../../../JewelTheme/src/main/sass/components-primary/textinput"
 @import "../../../../JewelTheme/src/main/sass/components-primary/titlebar"
 @import "../../../../JewelTheme/src/main/sass/components-primary/topappbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/togglebutton"
diff --git a/frameworks/themes/Jewel-Light-NoFlat-Primary-Green-Theme/src/main/resources/defaults.css b/frameworks/themes/Jewel-Light-NoFlat-Primary-Green-Theme/src/main/resources/defaults.css
index 7754df6..e31a369 100644
--- a/frameworks/themes/Jewel-Light-NoFlat-Primary-Green-Theme/src/main/resources/defaults.css
+++ b/frameworks/themes/Jewel-Light-NoFlat-Primary-Green-Theme/src/main/resources/defaults.css
@@ -233,6 +233,81 @@ j|Card {
   font-size: 16px;
 }
 
+.jewel.datechooser .jewel.table {
+  background: white;
+  border: 1px solid #d9d9d9;
+  border-radius: 0.25rem;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.button {
+  background: transparent;
+  border: none;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow {
+  border-bottom: 1px solid #d9d9d9;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton {
+  border-radius: 50%;
+  color: transparent;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:hover, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:hover {
+  background: #f3f3f3;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:active, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:active {
+  background: #e6e6e6;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background-size: 40%;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell {
+  background: white;
+  box-shadow: none;
+  border-left: 0px;
+}
+.jewel.datechooser .jewel.table .jewel.tablecell {
+  border-top: 0px;
+  border-left: 0px;
+  padding: 4px;
+}
+
+.calendar.item {
+  font-size: 1em;
+}
+.calendar.item.dayName {
+  font-weight: 600;
+}
+.calendar.item.date {
+  color: grey;
+}
+
+.jewel.datefield .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+.jewel.datefield .jewel.button {
+  color: transparent;
+  border-bottom-left-radius: 0px;
+  border-top-left-radius: 0px;
+  border-left: 0px;
+}
+.jewel.datefield .jewel.button::after {
+  background-size: 66%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 22 22' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M18.3333333,2.75 L17.4166667,2.75 L17.4166667,0.916666667 L15.5833333,0.916666667 L15.5833333,2.75 L6.41666667,2.75 L6.41666667,0.916666667 L4.58333333,0.916666667 L4.58333333,2.75 L3.66666667,2.75 C2.65833333,2.75 1.83333333,3.575 1.83333 [...]
+}
+
+.jewel.divider {
+  border-bottom-color: #d9d9d9;
+  border-bottom-width: 1px;
+  border-bottom-style: solid;
+}
+
 .jewel.drawer.float {
   color: rgba(0, 0, 0, 0.8);
 }
@@ -280,6 +355,61 @@ j|Card {
   padding: 16px;
 }
 
+.jewel.dropdownlist {
+  cursor: pointer;
+  display: inline-block;
+  margin: 0;
+  padding: 10px 16px;
+  min-width: 74px;
+  min-height: 34px;
+  background: linear-gradient(#e6e6e6, #cccccc);
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0 1px 0 white;
+  border-radius: 3px;
+  font-family: "Lato", sans-serif;
+  font-size: 1em;
+  font-weight: bold;
+  color: #808080;
+  text-transform: uppercase;
+  text-decoration: none;
+}
+.jewel.dropdownlist:hover, .jewel.dropdownlist:hover:focus {
+  background: linear-gradient(#d9d9d9, silver);
+  border: 1px solid #a6a6a6;
+}
+.jewel.dropdownlist:active, .jewel.dropdownlist:active:focus {
+  background: linear-gradient(silver, #a6a6a6);
+  border: 1px solid #8d8d8d;
+  box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+.jewel.dropdownlist:focus {
+  outline: none;
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0px 0px 0px 1px rgba(255, 255, 255, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.6);
+}
+.jewel.dropdownlist[disabled] {
+  cursor: unset;
+  background: #f3f3f3;
+  border: 1px solid #d9d9d9;
+  box-shadow: none;
+  color: silver;
+  font-weight: 400;
+  text-shadow: unset;
+}
+
+.fonticon.dark {
+  color: #676767;
+}
+.fonticon.dark.inactive {
+  color: rgba(128, 128, 128, 0.3);
+}
+.fonticon.light {
+  color: white;
+}
+.fonticon.light.inactive {
+  color: rgba(255, 255, 255, 0.5);
+}
+
 .jewel.item {
   padding: 8px;
 }
@@ -319,6 +449,57 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.navigation {
+  background-color: #ffffff;
+}
+
+.jewel.numericstepper .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+
+@media (max-width: 992px) {
+  .jewel.numericstepper .jewel.textinput input {
+    border-radius: 0;
+  }
+}
+.jewel.spinner {
+  width: 34px;
+}
+.jewel.spinner .jewel.button {
+  padding: 0px;
+  height: 19px;
+  color: transparent;
+  border-radius: 0 0.25rem 0.25rem 0;
+  border-left: 0px;
+}
+.jewel.spinner .jewel.button.up {
+  border-bottom-right-radius: 0px;
+}
+.jewel.spinner .jewel.button.up::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23808080' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") no-repeat center center;
+}
+.jewel.spinner .jewel.button.down {
+  border-top-right-radius: 0px;
+  border-top-style: groove;
+}
+.jewel.spinner .jewel.button.down::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23808080' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon transform='translate(8.000000, 4.705000) scale(1, -1) translate(-8.000000, -4.705000) ' points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g [...]
+}
+
+@media (max-width: 992px) {
+  .jewel.spinner .jewel.button.up {
+    border: 1px solid #b3b3b3;
+    border-radius: 0.25rem 0 0 0.25rem;
+  }
+  .jewel.spinner .jewel.button.down {
+    border: 1px solid #b3b3b3;
+    border-radius: 0 0.25rem 0.25rem 0;
+    border-top-style: solid;
+  }
+}
 .jewel.radiobutton input + span::before {
   background: linear-gradient(white, #f3f3f3);
   border: 1px solid #b3b3b3;
@@ -434,6 +615,89 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.simpletable {
+  background: linear-gradient(white, #f3f3f3);
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0 1px 0 white;
+  border-radius: 0.25rem;
+}
+.jewel.simpletable .jewel.thead tr {
+  border-bottom: 1px solid #d9d9d9;
+}
+.jewel.simpletable .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tableheadercell {
+  background: linear-gradient(white, #f3f3f3);
+  box-shadow: inset 0 1px 0 white;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #808080;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.simpletable .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tablecell {
+  border-top: 1px solid #d9d9d9;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.simpletable .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(white, white);
+  box-shadow: inset 0 1px 0 white;
+}
+
+.jewel.table {
+  background: linear-gradient(white, #f3f3f3);
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0 1px 0 white;
+  border-radius: 0.25rem;
+}
+.jewel.table .jewel.thead tr {
+  border-bottom: 1px solid #d9d9d9;
+}
+.jewel.table .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tableheadercell {
+  background: linear-gradient(white, #f3f3f3);
+  box-shadow: inset 0 1px 0 white;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #808080;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.table .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tablecell {
+  border-top: 1px solid #d9d9d9;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.table .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(white, white);
+  box-shadow: inset 0 1px 0 white;
+}
+
+.jewel.tableitem {
+  cursor: auto;
+}
+.jewel.tableitem.selectable {
+  cursor: pointer;
+}
+.jewel.tableitem.hovered:hover {
+  color: #FFFFFF;
+  background: #3AB549;
+}
+.jewel.tableitem.selected, .jewel.tableitem.selectable:active {
+  color: #FFFFFF;
+  background: #34a241;
+}
+
 .jewel.textinput {
   font-weight: 400;
   color: #808080;
@@ -539,4 +803,9 @@ j|Card {
   padding-right: 0;
 }
 
+.jewel.togglebutton .fonticon {
+  margin-left: 0px;
+  margin-right: 8px;
+}
+
 /*# sourceMappingURL=defaults.css.map */
diff --git a/frameworks/themes/Jewel-Light-NoFlat-Primary-Green-Theme/src/main/sass/defaults.sass b/frameworks/themes/Jewel-Light-NoFlat-Primary-Green-Theme/src/main/sass/defaults.sass
index 94cebd3..c8f87c5 100644
--- a/frameworks/themes/Jewel-Light-NoFlat-Primary-Green-Theme/src/main/sass/defaults.sass
+++ b/frameworks/themes/Jewel-Light-NoFlat-Primary-Green-Theme/src/main/sass/defaults.sass
@@ -31,13 +31,21 @@
 @import "../../../../JewelTheme/src/main/sass/components-primary/card"
 @import "../../../../JewelTheme/src/main/sass/components-primary/checkbox"
 @import "../../../../JewelTheme/src/main/sass/components-primary/controlbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datechooser"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datefield"
+@import "../../../../JewelTheme/src/main/sass/components-primary/divider"
 @import "../../../../JewelTheme/src/main/sass/components-primary/drawer"
+@import "../../../../JewelTheme/src/main/sass/components-primary/dropdownlist"
+@import "../../../../JewelTheme/src/main/sass/components-primary/icons"
 @import "../../../../JewelTheme/src/main/sass/components-primary/itemRenderer"
 @import "../../../../JewelTheme/src/main/sass/components-primary/label"
 @import "../../../../JewelTheme/src/main/sass/components-primary/list"
+@import "../../../../JewelTheme/src/main/sass/components-primary/navigation"
+@import "../../../../JewelTheme/src/main/sass/components-primary/numericstepper"
 @import "../../../../JewelTheme/src/main/sass/components-primary/radiobutton"
 @import "../../../../JewelTheme/src/main/sass/components-primary/slider"
-
+@import "../../../../JewelTheme/src/main/sass/components-primary/table"
 @import "../../../../JewelTheme/src/main/sass/components-primary/textinput"
 @import "../../../../JewelTheme/src/main/sass/components-primary/titlebar"
 @import "../../../../JewelTheme/src/main/sass/components-primary/topappbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/togglebutton"
diff --git a/frameworks/themes/Jewel-Light-NoFlat-Primary-Orange-Theme/src/main/resources/defaults.css b/frameworks/themes/Jewel-Light-NoFlat-Primary-Orange-Theme/src/main/resources/defaults.css
index 2f4e72b..113f6db 100644
--- a/frameworks/themes/Jewel-Light-NoFlat-Primary-Orange-Theme/src/main/resources/defaults.css
+++ b/frameworks/themes/Jewel-Light-NoFlat-Primary-Orange-Theme/src/main/resources/defaults.css
@@ -233,6 +233,81 @@ j|Card {
   font-size: 16px;
 }
 
+.jewel.datechooser .jewel.table {
+  background: white;
+  border: 1px solid #d9d9d9;
+  border-radius: 0.25rem;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.button {
+  background: transparent;
+  border: none;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow {
+  border-bottom: 1px solid #d9d9d9;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton {
+  border-radius: 50%;
+  color: transparent;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:hover, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:hover {
+  background: #f3f3f3;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:active, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:active {
+  background: #e6e6e6;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background-size: 40%;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell {
+  background: white;
+  box-shadow: none;
+  border-left: 0px;
+}
+.jewel.datechooser .jewel.table .jewel.tablecell {
+  border-top: 0px;
+  border-left: 0px;
+  padding: 4px;
+}
+
+.calendar.item {
+  font-size: 1em;
+}
+.calendar.item.dayName {
+  font-weight: 600;
+}
+.calendar.item.date {
+  color: grey;
+}
+
+.jewel.datefield .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+.jewel.datefield .jewel.button {
+  color: transparent;
+  border-bottom-left-radius: 0px;
+  border-top-left-radius: 0px;
+  border-left: 0px;
+}
+.jewel.datefield .jewel.button::after {
+  background-size: 66%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 22 22' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M18.3333333,2.75 L17.4166667,2.75 L17.4166667,0.916666667 L15.5833333,0.916666667 L15.5833333,2.75 L6.41666667,2.75 L6.41666667,0.916666667 L4.58333333,0.916666667 L4.58333333,2.75 L3.66666667,2.75 C2.65833333,2.75 1.83333333,3.575 1.83333 [...]
+}
+
+.jewel.divider {
+  border-bottom-color: #d9d9d9;
+  border-bottom-width: 1px;
+  border-bottom-style: solid;
+}
+
 .jewel.drawer.float {
   color: rgba(0, 0, 0, 0.8);
 }
@@ -280,6 +355,61 @@ j|Card {
   padding: 16px;
 }
 
+.jewel.dropdownlist {
+  cursor: pointer;
+  display: inline-block;
+  margin: 0;
+  padding: 10px 16px;
+  min-width: 74px;
+  min-height: 34px;
+  background: linear-gradient(#e6e6e6, #cccccc);
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0 1px 0 white;
+  border-radius: 3px;
+  font-family: "Lato", sans-serif;
+  font-size: 1em;
+  font-weight: bold;
+  color: #808080;
+  text-transform: uppercase;
+  text-decoration: none;
+}
+.jewel.dropdownlist:hover, .jewel.dropdownlist:hover:focus {
+  background: linear-gradient(#d9d9d9, silver);
+  border: 1px solid #a6a6a6;
+}
+.jewel.dropdownlist:active, .jewel.dropdownlist:active:focus {
+  background: linear-gradient(silver, #a6a6a6);
+  border: 1px solid #8d8d8d;
+  box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+.jewel.dropdownlist:focus {
+  outline: none;
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0px 0px 0px 1px rgba(255, 255, 255, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.6);
+}
+.jewel.dropdownlist[disabled] {
+  cursor: unset;
+  background: #f3f3f3;
+  border: 1px solid #d9d9d9;
+  box-shadow: none;
+  color: silver;
+  font-weight: 400;
+  text-shadow: unset;
+}
+
+.fonticon.dark {
+  color: #676767;
+}
+.fonticon.dark.inactive {
+  color: rgba(128, 128, 128, 0.3);
+}
+.fonticon.light {
+  color: white;
+}
+.fonticon.light.inactive {
+  color: rgba(255, 255, 255, 0.5);
+}
+
 .jewel.item {
   padding: 8px;
 }
@@ -319,6 +449,57 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.navigation {
+  background-color: #ffffff;
+}
+
+.jewel.numericstepper .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+
+@media (max-width: 992px) {
+  .jewel.numericstepper .jewel.textinput input {
+    border-radius: 0;
+  }
+}
+.jewel.spinner {
+  width: 34px;
+}
+.jewel.spinner .jewel.button {
+  padding: 0px;
+  height: 19px;
+  color: transparent;
+  border-radius: 0 0.25rem 0.25rem 0;
+  border-left: 0px;
+}
+.jewel.spinner .jewel.button.up {
+  border-bottom-right-radius: 0px;
+}
+.jewel.spinner .jewel.button.up::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23808080' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") no-repeat center center;
+}
+.jewel.spinner .jewel.button.down {
+  border-top-right-radius: 0px;
+  border-top-style: groove;
+}
+.jewel.spinner .jewel.button.down::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23808080' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon transform='translate(8.000000, 4.705000) scale(1, -1) translate(-8.000000, -4.705000) ' points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g [...]
+}
+
+@media (max-width: 992px) {
+  .jewel.spinner .jewel.button.up {
+    border: 1px solid #b3b3b3;
+    border-radius: 0.25rem 0 0 0.25rem;
+  }
+  .jewel.spinner .jewel.button.down {
+    border: 1px solid #b3b3b3;
+    border-radius: 0 0.25rem 0.25rem 0;
+    border-top-style: solid;
+  }
+}
 .jewel.radiobutton input + span::before {
   background: linear-gradient(white, #f3f3f3);
   border: 1px solid #b3b3b3;
@@ -434,6 +615,89 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.simpletable {
+  background: linear-gradient(white, #f3f3f3);
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0 1px 0 white;
+  border-radius: 0.25rem;
+}
+.jewel.simpletable .jewel.thead tr {
+  border-bottom: 1px solid #d9d9d9;
+}
+.jewel.simpletable .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tableheadercell {
+  background: linear-gradient(white, #f3f3f3);
+  box-shadow: inset 0 1px 0 white;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #808080;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.simpletable .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tablecell {
+  border-top: 1px solid #d9d9d9;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.simpletable .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(white, white);
+  box-shadow: inset 0 1px 0 white;
+}
+
+.jewel.table {
+  background: linear-gradient(white, #f3f3f3);
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0 1px 0 white;
+  border-radius: 0.25rem;
+}
+.jewel.table .jewel.thead tr {
+  border-bottom: 1px solid #d9d9d9;
+}
+.jewel.table .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tableheadercell {
+  background: linear-gradient(white, #f3f3f3);
+  box-shadow: inset 0 1px 0 white;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #808080;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.table .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tablecell {
+  border-top: 1px solid #d9d9d9;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.table .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(white, white);
+  box-shadow: inset 0 1px 0 white;
+}
+
+.jewel.tableitem {
+  cursor: auto;
+}
+.jewel.tableitem.selectable {
+  cursor: pointer;
+}
+.jewel.tableitem.hovered:hover {
+  color: #FFFFFF;
+  background: #F7941D;
+}
+.jewel.tableitem.selected, .jewel.tableitem.selectable:active {
+  color: #FFFFFF;
+  background: #f28809;
+}
+
 .jewel.textinput {
   font-weight: 400;
   color: #808080;
@@ -539,4 +803,9 @@ j|Card {
   padding-right: 0;
 }
 
+.jewel.togglebutton .fonticon {
+  margin-left: 0px;
+  margin-right: 8px;
+}
+
 /*# sourceMappingURL=defaults.css.map */
diff --git a/frameworks/themes/Jewel-Light-NoFlat-Primary-Orange-Theme/src/main/sass/defaults.sass b/frameworks/themes/Jewel-Light-NoFlat-Primary-Orange-Theme/src/main/sass/defaults.sass
index 94cebd3..c8f87c5 100644
--- a/frameworks/themes/Jewel-Light-NoFlat-Primary-Orange-Theme/src/main/sass/defaults.sass
+++ b/frameworks/themes/Jewel-Light-NoFlat-Primary-Orange-Theme/src/main/sass/defaults.sass
@@ -31,13 +31,21 @@
 @import "../../../../JewelTheme/src/main/sass/components-primary/card"
 @import "../../../../JewelTheme/src/main/sass/components-primary/checkbox"
 @import "../../../../JewelTheme/src/main/sass/components-primary/controlbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datechooser"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datefield"
+@import "../../../../JewelTheme/src/main/sass/components-primary/divider"
 @import "../../../../JewelTheme/src/main/sass/components-primary/drawer"
+@import "../../../../JewelTheme/src/main/sass/components-primary/dropdownlist"
+@import "../../../../JewelTheme/src/main/sass/components-primary/icons"
 @import "../../../../JewelTheme/src/main/sass/components-primary/itemRenderer"
 @import "../../../../JewelTheme/src/main/sass/components-primary/label"
 @import "../../../../JewelTheme/src/main/sass/components-primary/list"
+@import "../../../../JewelTheme/src/main/sass/components-primary/navigation"
+@import "../../../../JewelTheme/src/main/sass/components-primary/numericstepper"
 @import "../../../../JewelTheme/src/main/sass/components-primary/radiobutton"
 @import "../../../../JewelTheme/src/main/sass/components-primary/slider"
-
+@import "../../../../JewelTheme/src/main/sass/components-primary/table"
 @import "../../../../JewelTheme/src/main/sass/components-primary/textinput"
 @import "../../../../JewelTheme/src/main/sass/components-primary/titlebar"
 @import "../../../../JewelTheme/src/main/sass/components-primary/topappbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/togglebutton"
diff --git a/frameworks/themes/Jewel-Light-NoFlat-Primary-Red-Theme/src/main/resources/defaults.css b/frameworks/themes/Jewel-Light-NoFlat-Primary-Red-Theme/src/main/resources/defaults.css
index 966989f..2075bde 100644
--- a/frameworks/themes/Jewel-Light-NoFlat-Primary-Red-Theme/src/main/resources/defaults.css
+++ b/frameworks/themes/Jewel-Light-NoFlat-Primary-Red-Theme/src/main/resources/defaults.css
@@ -233,6 +233,81 @@ j|Card {
   font-size: 16px;
 }
 
+.jewel.datechooser .jewel.table {
+  background: white;
+  border: 1px solid #d9d9d9;
+  border-radius: 0.25rem;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.button {
+  background: transparent;
+  border: none;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow {
+  border-bottom: 1px solid #d9d9d9;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton {
+  border-radius: 50%;
+  color: transparent;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:hover, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:hover {
+  background: #f3f3f3;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:active, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:active {
+  background: #e6e6e6;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background-size: 40%;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell {
+  background: white;
+  box-shadow: none;
+  border-left: 0px;
+}
+.jewel.datechooser .jewel.table .jewel.tablecell {
+  border-top: 0px;
+  border-left: 0px;
+  padding: 4px;
+}
+
+.calendar.item {
+  font-size: 1em;
+}
+.calendar.item.dayName {
+  font-weight: 600;
+}
+.calendar.item.date {
+  color: grey;
+}
+
+.jewel.datefield .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+.jewel.datefield .jewel.button {
+  color: transparent;
+  border-bottom-left-radius: 0px;
+  border-top-left-radius: 0px;
+  border-left: 0px;
+}
+.jewel.datefield .jewel.button::after {
+  background-size: 66%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 22 22' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M18.3333333,2.75 L17.4166667,2.75 L17.4166667,0.916666667 L15.5833333,0.916666667 L15.5833333,2.75 L6.41666667,2.75 L6.41666667,0.916666667 L4.58333333,0.916666667 L4.58333333,2.75 L3.66666667,2.75 C2.65833333,2.75 1.83333333,3.575 1.83333 [...]
+}
+
+.jewel.divider {
+  border-bottom-color: #d9d9d9;
+  border-bottom-width: 1px;
+  border-bottom-style: solid;
+}
+
 .jewel.drawer.float {
   color: rgba(0, 0, 0, 0.8);
 }
@@ -280,6 +355,61 @@ j|Card {
   padding: 16px;
 }
 
+.jewel.dropdownlist {
+  cursor: pointer;
+  display: inline-block;
+  margin: 0;
+  padding: 10px 16px;
+  min-width: 74px;
+  min-height: 34px;
+  background: linear-gradient(#e6e6e6, #cccccc);
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0 1px 0 white;
+  border-radius: 3px;
+  font-family: "Lato", sans-serif;
+  font-size: 1em;
+  font-weight: bold;
+  color: #808080;
+  text-transform: uppercase;
+  text-decoration: none;
+}
+.jewel.dropdownlist:hover, .jewel.dropdownlist:hover:focus {
+  background: linear-gradient(#d9d9d9, silver);
+  border: 1px solid #a6a6a6;
+}
+.jewel.dropdownlist:active, .jewel.dropdownlist:active:focus {
+  background: linear-gradient(silver, #a6a6a6);
+  border: 1px solid #8d8d8d;
+  box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+.jewel.dropdownlist:focus {
+  outline: none;
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0px 0px 0px 1px rgba(255, 255, 255, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.6);
+}
+.jewel.dropdownlist[disabled] {
+  cursor: unset;
+  background: #f3f3f3;
+  border: 1px solid #d9d9d9;
+  box-shadow: none;
+  color: silver;
+  font-weight: 400;
+  text-shadow: unset;
+}
+
+.fonticon.dark {
+  color: #676767;
+}
+.fonticon.dark.inactive {
+  color: rgba(128, 128, 128, 0.3);
+}
+.fonticon.light {
+  color: white;
+}
+.fonticon.light.inactive {
+  color: rgba(255, 255, 255, 0.5);
+}
+
 .jewel.item {
   padding: 8px;
 }
@@ -319,6 +449,57 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.navigation {
+  background-color: #ffffff;
+}
+
+.jewel.numericstepper .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+
+@media (max-width: 992px) {
+  .jewel.numericstepper .jewel.textinput input {
+    border-radius: 0;
+  }
+}
+.jewel.spinner {
+  width: 34px;
+}
+.jewel.spinner .jewel.button {
+  padding: 0px;
+  height: 19px;
+  color: transparent;
+  border-radius: 0 0.25rem 0.25rem 0;
+  border-left: 0px;
+}
+.jewel.spinner .jewel.button.up {
+  border-bottom-right-radius: 0px;
+}
+.jewel.spinner .jewel.button.up::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23808080' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") no-repeat center center;
+}
+.jewel.spinner .jewel.button.down {
+  border-top-right-radius: 0px;
+  border-top-style: groove;
+}
+.jewel.spinner .jewel.button.down::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23808080' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon transform='translate(8.000000, 4.705000) scale(1, -1) translate(-8.000000, -4.705000) ' points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g [...]
+}
+
+@media (max-width: 992px) {
+  .jewel.spinner .jewel.button.up {
+    border: 1px solid #b3b3b3;
+    border-radius: 0.25rem 0 0 0.25rem;
+  }
+  .jewel.spinner .jewel.button.down {
+    border: 1px solid #b3b3b3;
+    border-radius: 0 0.25rem 0.25rem 0;
+    border-top-style: solid;
+  }
+}
 .jewel.radiobutton input + span::before {
   background: linear-gradient(white, #f3f3f3);
   border: 1px solid #b3b3b3;
@@ -434,6 +615,89 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.simpletable {
+  background: linear-gradient(white, #f3f3f3);
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0 1px 0 white;
+  border-radius: 0.25rem;
+}
+.jewel.simpletable .jewel.thead tr {
+  border-bottom: 1px solid #d9d9d9;
+}
+.jewel.simpletable .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tableheadercell {
+  background: linear-gradient(white, #f3f3f3);
+  box-shadow: inset 0 1px 0 white;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #808080;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.simpletable .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tablecell {
+  border-top: 1px solid #d9d9d9;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.simpletable .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(white, white);
+  box-shadow: inset 0 1px 0 white;
+}
+
+.jewel.table {
+  background: linear-gradient(white, #f3f3f3);
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0 1px 0 white;
+  border-radius: 0.25rem;
+}
+.jewel.table .jewel.thead tr {
+  border-bottom: 1px solid #d9d9d9;
+}
+.jewel.table .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tableheadercell {
+  background: linear-gradient(white, #f3f3f3);
+  box-shadow: inset 0 1px 0 white;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #808080;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.table .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tablecell {
+  border-top: 1px solid #d9d9d9;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.table .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(white, white);
+  box-shadow: inset 0 1px 0 white;
+}
+
+.jewel.tableitem {
+  cursor: auto;
+}
+.jewel.tableitem.selectable {
+  cursor: pointer;
+}
+.jewel.tableitem.hovered:hover {
+  color: #FFFFFF;
+  background: #EC1C24;
+}
+.jewel.tableitem.selected, .jewel.tableitem.selectable:active {
+  color: #FFFFFF;
+  background: #dc121a;
+}
+
 .jewel.textinput {
   font-weight: 400;
   color: #808080;
@@ -539,4 +803,9 @@ j|Card {
   padding-right: 0;
 }
 
+.jewel.togglebutton .fonticon {
+  margin-left: 0px;
+  margin-right: 8px;
+}
+
 /*# sourceMappingURL=defaults.css.map */
diff --git a/frameworks/themes/Jewel-Light-NoFlat-Primary-Red-Theme/src/main/sass/defaults.sass b/frameworks/themes/Jewel-Light-NoFlat-Primary-Red-Theme/src/main/sass/defaults.sass
index 94cebd3..c8f87c5 100644
--- a/frameworks/themes/Jewel-Light-NoFlat-Primary-Red-Theme/src/main/sass/defaults.sass
+++ b/frameworks/themes/Jewel-Light-NoFlat-Primary-Red-Theme/src/main/sass/defaults.sass
@@ -31,13 +31,21 @@
 @import "../../../../JewelTheme/src/main/sass/components-primary/card"
 @import "../../../../JewelTheme/src/main/sass/components-primary/checkbox"
 @import "../../../../JewelTheme/src/main/sass/components-primary/controlbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datechooser"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datefield"
+@import "../../../../JewelTheme/src/main/sass/components-primary/divider"
 @import "../../../../JewelTheme/src/main/sass/components-primary/drawer"
+@import "../../../../JewelTheme/src/main/sass/components-primary/dropdownlist"
+@import "../../../../JewelTheme/src/main/sass/components-primary/icons"
 @import "../../../../JewelTheme/src/main/sass/components-primary/itemRenderer"
 @import "../../../../JewelTheme/src/main/sass/components-primary/label"
 @import "../../../../JewelTheme/src/main/sass/components-primary/list"
+@import "../../../../JewelTheme/src/main/sass/components-primary/navigation"
+@import "../../../../JewelTheme/src/main/sass/components-primary/numericstepper"
 @import "../../../../JewelTheme/src/main/sass/components-primary/radiobutton"
 @import "../../../../JewelTheme/src/main/sass/components-primary/slider"
-
+@import "../../../../JewelTheme/src/main/sass/components-primary/table"
 @import "../../../../JewelTheme/src/main/sass/components-primary/textinput"
 @import "../../../../JewelTheme/src/main/sass/components-primary/titlebar"
 @import "../../../../JewelTheme/src/main/sass/components-primary/topappbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/togglebutton"
diff --git a/frameworks/themes/Jewel-Light-NoFlat-Primary-Sapphire-Theme/src/main/resources/defaults.css b/frameworks/themes/Jewel-Light-NoFlat-Primary-Sapphire-Theme/src/main/resources/defaults.css
index 7a1456f..d401166 100644
--- a/frameworks/themes/Jewel-Light-NoFlat-Primary-Sapphire-Theme/src/main/resources/defaults.css
+++ b/frameworks/themes/Jewel-Light-NoFlat-Primary-Sapphire-Theme/src/main/resources/defaults.css
@@ -233,6 +233,81 @@ j|Card {
   font-size: 16px;
 }
 
+.jewel.datechooser .jewel.table {
+  background: white;
+  border: 1px solid #d9d9d9;
+  border-radius: 0.25rem;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.button {
+  background: transparent;
+  border: none;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow {
+  border-bottom: 1px solid #d9d9d9;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton {
+  border-radius: 50%;
+  color: transparent;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:hover, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:hover {
+  background: #f3f3f3;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:active, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:active {
+  background: #e6e6e6;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background-size: 40%;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell {
+  background: white;
+  box-shadow: none;
+  border-left: 0px;
+}
+.jewel.datechooser .jewel.table .jewel.tablecell {
+  border-top: 0px;
+  border-left: 0px;
+  padding: 4px;
+}
+
+.calendar.item {
+  font-size: 1em;
+}
+.calendar.item.dayName {
+  font-weight: 600;
+}
+.calendar.item.date {
+  color: grey;
+}
+
+.jewel.datefield .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+.jewel.datefield .jewel.button {
+  color: transparent;
+  border-bottom-left-radius: 0px;
+  border-top-left-radius: 0px;
+  border-left: 0px;
+}
+.jewel.datefield .jewel.button::after {
+  background-size: 66%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 22 22' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M18.3333333,2.75 L17.4166667,2.75 L17.4166667,0.916666667 L15.5833333,0.916666667 L15.5833333,2.75 L6.41666667,2.75 L6.41666667,0.916666667 L4.58333333,0.916666667 L4.58333333,2.75 L3.66666667,2.75 C2.65833333,2.75 1.83333333,3.575 1.83333 [...]
+}
+
+.jewel.divider {
+  border-bottom-color: #d9d9d9;
+  border-bottom-width: 1px;
+  border-bottom-style: solid;
+}
+
 .jewel.drawer.float {
   color: rgba(0, 0, 0, 0.8);
 }
@@ -280,6 +355,61 @@ j|Card {
   padding: 16px;
 }
 
+.jewel.dropdownlist {
+  cursor: pointer;
+  display: inline-block;
+  margin: 0;
+  padding: 10px 16px;
+  min-width: 74px;
+  min-height: 34px;
+  background: linear-gradient(#e6e6e6, #cccccc);
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0 1px 0 white;
+  border-radius: 3px;
+  font-family: "Lato", sans-serif;
+  font-size: 1em;
+  font-weight: bold;
+  color: #808080;
+  text-transform: uppercase;
+  text-decoration: none;
+}
+.jewel.dropdownlist:hover, .jewel.dropdownlist:hover:focus {
+  background: linear-gradient(#d9d9d9, silver);
+  border: 1px solid #a6a6a6;
+}
+.jewel.dropdownlist:active, .jewel.dropdownlist:active:focus {
+  background: linear-gradient(silver, #a6a6a6);
+  border: 1px solid #8d8d8d;
+  box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+.jewel.dropdownlist:focus {
+  outline: none;
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0px 0px 0px 1px rgba(255, 255, 255, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.6);
+}
+.jewel.dropdownlist[disabled] {
+  cursor: unset;
+  background: #f3f3f3;
+  border: 1px solid #d9d9d9;
+  box-shadow: none;
+  color: silver;
+  font-weight: 400;
+  text-shadow: unset;
+}
+
+.fonticon.dark {
+  color: #676767;
+}
+.fonticon.dark.inactive {
+  color: rgba(128, 128, 128, 0.3);
+}
+.fonticon.light {
+  color: white;
+}
+.fonticon.light.inactive {
+  color: rgba(255, 255, 255, 0.5);
+}
+
 .jewel.item {
   padding: 8px;
 }
@@ -319,6 +449,57 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.navigation {
+  background-color: #ffffff;
+}
+
+.jewel.numericstepper .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+
+@media (max-width: 992px) {
+  .jewel.numericstepper .jewel.textinput input {
+    border-radius: 0;
+  }
+}
+.jewel.spinner {
+  width: 34px;
+}
+.jewel.spinner .jewel.button {
+  padding: 0px;
+  height: 19px;
+  color: transparent;
+  border-radius: 0 0.25rem 0.25rem 0;
+  border-left: 0px;
+}
+.jewel.spinner .jewel.button.up {
+  border-bottom-right-radius: 0px;
+}
+.jewel.spinner .jewel.button.up::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23808080' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") no-repeat center center;
+}
+.jewel.spinner .jewel.button.down {
+  border-top-right-radius: 0px;
+  border-top-style: groove;
+}
+.jewel.spinner .jewel.button.down::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23808080' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon transform='translate(8.000000, 4.705000) scale(1, -1) translate(-8.000000, -4.705000) ' points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g [...]
+}
+
+@media (max-width: 992px) {
+  .jewel.spinner .jewel.button.up {
+    border: 1px solid #b3b3b3;
+    border-radius: 0.25rem 0 0 0.25rem;
+  }
+  .jewel.spinner .jewel.button.down {
+    border: 1px solid #b3b3b3;
+    border-radius: 0 0.25rem 0.25rem 0;
+    border-top-style: solid;
+  }
+}
 .jewel.radiobutton input + span::before {
   background: linear-gradient(white, #f3f3f3);
   border: 1px solid #b3b3b3;
@@ -434,6 +615,89 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.simpletable {
+  background: linear-gradient(white, #f3f3f3);
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0 1px 0 white;
+  border-radius: 0.25rem;
+}
+.jewel.simpletable .jewel.thead tr {
+  border-bottom: 1px solid #d9d9d9;
+}
+.jewel.simpletable .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tableheadercell {
+  background: linear-gradient(white, #f3f3f3);
+  box-shadow: inset 0 1px 0 white;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #808080;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.simpletable .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tablecell {
+  border-top: 1px solid #d9d9d9;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.simpletable .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(white, white);
+  box-shadow: inset 0 1px 0 white;
+}
+
+.jewel.table {
+  background: linear-gradient(white, #f3f3f3);
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0 1px 0 white;
+  border-radius: 0.25rem;
+}
+.jewel.table .jewel.thead tr {
+  border-bottom: 1px solid #d9d9d9;
+}
+.jewel.table .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tableheadercell {
+  background: linear-gradient(white, #f3f3f3);
+  box-shadow: inset 0 1px 0 white;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #808080;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.table .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tablecell {
+  border-top: 1px solid #d9d9d9;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.table .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(white, white);
+  box-shadow: inset 0 1px 0 white;
+}
+
+.jewel.tableitem {
+  cursor: auto;
+}
+.jewel.tableitem.selectable {
+  cursor: pointer;
+}
+.jewel.tableitem.hovered:hover {
+  color: #FFFFFF;
+  background: #2C74BE;
+}
+.jewel.tableitem.selected, .jewel.tableitem.selectable:active {
+  color: #FFFFFF;
+  background: #2767a9;
+}
+
 .jewel.textinput {
   font-weight: 400;
   color: #808080;
@@ -539,4 +803,9 @@ j|Card {
   padding-right: 0;
 }
 
+.jewel.togglebutton .fonticon {
+  margin-left: 0px;
+  margin-right: 8px;
+}
+
 /*# sourceMappingURL=defaults.css.map */
diff --git a/frameworks/themes/Jewel-Light-NoFlat-Primary-Sapphire-Theme/src/main/sass/defaults.sass b/frameworks/themes/Jewel-Light-NoFlat-Primary-Sapphire-Theme/src/main/sass/defaults.sass
index 94cebd3..c8f87c5 100644
--- a/frameworks/themes/Jewel-Light-NoFlat-Primary-Sapphire-Theme/src/main/sass/defaults.sass
+++ b/frameworks/themes/Jewel-Light-NoFlat-Primary-Sapphire-Theme/src/main/sass/defaults.sass
@@ -31,13 +31,21 @@
 @import "../../../../JewelTheme/src/main/sass/components-primary/card"
 @import "../../../../JewelTheme/src/main/sass/components-primary/checkbox"
 @import "../../../../JewelTheme/src/main/sass/components-primary/controlbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datechooser"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datefield"
+@import "../../../../JewelTheme/src/main/sass/components-primary/divider"
 @import "../../../../JewelTheme/src/main/sass/components-primary/drawer"
+@import "../../../../JewelTheme/src/main/sass/components-primary/dropdownlist"
+@import "../../../../JewelTheme/src/main/sass/components-primary/icons"
 @import "../../../../JewelTheme/src/main/sass/components-primary/itemRenderer"
 @import "../../../../JewelTheme/src/main/sass/components-primary/label"
 @import "../../../../JewelTheme/src/main/sass/components-primary/list"
+@import "../../../../JewelTheme/src/main/sass/components-primary/navigation"
+@import "../../../../JewelTheme/src/main/sass/components-primary/numericstepper"
 @import "../../../../JewelTheme/src/main/sass/components-primary/radiobutton"
 @import "../../../../JewelTheme/src/main/sass/components-primary/slider"
-
+@import "../../../../JewelTheme/src/main/sass/components-primary/table"
 @import "../../../../JewelTheme/src/main/sass/components-primary/textinput"
 @import "../../../../JewelTheme/src/main/sass/components-primary/titlebar"
 @import "../../../../JewelTheme/src/main/sass/components-primary/topappbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/togglebutton"
diff --git a/frameworks/themes/Jewel-Light-NoFlat-Primary-Sunflower-Theme/src/main/resources/defaults.css b/frameworks/themes/Jewel-Light-NoFlat-Primary-Sunflower-Theme/src/main/resources/defaults.css
index c4f3c66..1f8f12c 100644
--- a/frameworks/themes/Jewel-Light-NoFlat-Primary-Sunflower-Theme/src/main/resources/defaults.css
+++ b/frameworks/themes/Jewel-Light-NoFlat-Primary-Sunflower-Theme/src/main/resources/defaults.css
@@ -233,6 +233,81 @@ j|Card {
   font-size: 16px;
 }
 
+.jewel.datechooser .jewel.table {
+  background: white;
+  border: 1px solid #d9d9d9;
+  border-radius: 0.25rem;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.button {
+  background: transparent;
+  border: none;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow {
+  border-bottom: 1px solid #d9d9d9;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton {
+  border-radius: 50%;
+  color: transparent;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:hover, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:hover {
+  background: #f3f3f3;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:active, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:active {
+  background: #e6e6e6;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background-size: 40%;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell {
+  background: white;
+  box-shadow: none;
+  border-left: 0px;
+}
+.jewel.datechooser .jewel.table .jewel.tablecell {
+  border-top: 0px;
+  border-left: 0px;
+  padding: 4px;
+}
+
+.calendar.item {
+  font-size: 1em;
+}
+.calendar.item.dayName {
+  font-weight: 600;
+}
+.calendar.item.date {
+  color: grey;
+}
+
+.jewel.datefield .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+.jewel.datefield .jewel.button {
+  color: transparent;
+  border-bottom-left-radius: 0px;
+  border-top-left-radius: 0px;
+  border-left: 0px;
+}
+.jewel.datefield .jewel.button::after {
+  background-size: 66%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 22 22' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M18.3333333,2.75 L17.4166667,2.75 L17.4166667,0.916666667 L15.5833333,0.916666667 L15.5833333,2.75 L6.41666667,2.75 L6.41666667,0.916666667 L4.58333333,0.916666667 L4.58333333,2.75 L3.66666667,2.75 C2.65833333,2.75 1.83333333,3.575 1.83333 [...]
+}
+
+.jewel.divider {
+  border-bottom-color: #d9d9d9;
+  border-bottom-width: 1px;
+  border-bottom-style: solid;
+}
+
 .jewel.drawer.float {
   color: rgba(0, 0, 0, 0.8);
 }
@@ -280,6 +355,61 @@ j|Card {
   padding: 16px;
 }
 
+.jewel.dropdownlist {
+  cursor: pointer;
+  display: inline-block;
+  margin: 0;
+  padding: 10px 16px;
+  min-width: 74px;
+  min-height: 34px;
+  background: linear-gradient(#e6e6e6, #cccccc);
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0 1px 0 white;
+  border-radius: 3px;
+  font-family: "Lato", sans-serif;
+  font-size: 1em;
+  font-weight: bold;
+  color: #808080;
+  text-transform: uppercase;
+  text-decoration: none;
+}
+.jewel.dropdownlist:hover, .jewel.dropdownlist:hover:focus {
+  background: linear-gradient(#d9d9d9, silver);
+  border: 1px solid #a6a6a6;
+}
+.jewel.dropdownlist:active, .jewel.dropdownlist:active:focus {
+  background: linear-gradient(silver, #a6a6a6);
+  border: 1px solid #8d8d8d;
+  box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+.jewel.dropdownlist:focus {
+  outline: none;
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0px 0px 0px 1px rgba(255, 255, 255, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.6);
+}
+.jewel.dropdownlist[disabled] {
+  cursor: unset;
+  background: #f3f3f3;
+  border: 1px solid #d9d9d9;
+  box-shadow: none;
+  color: silver;
+  font-weight: 400;
+  text-shadow: unset;
+}
+
+.fonticon.dark {
+  color: #676767;
+}
+.fonticon.dark.inactive {
+  color: rgba(128, 128, 128, 0.3);
+}
+.fonticon.light {
+  color: white;
+}
+.fonticon.light.inactive {
+  color: rgba(255, 255, 255, 0.5);
+}
+
 .jewel.item {
   padding: 8px;
 }
@@ -319,6 +449,57 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.navigation {
+  background-color: #ffffff;
+}
+
+.jewel.numericstepper .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+
+@media (max-width: 992px) {
+  .jewel.numericstepper .jewel.textinput input {
+    border-radius: 0;
+  }
+}
+.jewel.spinner {
+  width: 34px;
+}
+.jewel.spinner .jewel.button {
+  padding: 0px;
+  height: 19px;
+  color: transparent;
+  border-radius: 0 0.25rem 0.25rem 0;
+  border-left: 0px;
+}
+.jewel.spinner .jewel.button.up {
+  border-bottom-right-radius: 0px;
+}
+.jewel.spinner .jewel.button.up::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23808080' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") no-repeat center center;
+}
+.jewel.spinner .jewel.button.down {
+  border-top-right-radius: 0px;
+  border-top-style: groove;
+}
+.jewel.spinner .jewel.button.down::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23808080' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon transform='translate(8.000000, 4.705000) scale(1, -1) translate(-8.000000, -4.705000) ' points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g [...]
+}
+
+@media (max-width: 992px) {
+  .jewel.spinner .jewel.button.up {
+    border: 1px solid #b3b3b3;
+    border-radius: 0.25rem 0 0 0.25rem;
+  }
+  .jewel.spinner .jewel.button.down {
+    border: 1px solid #b3b3b3;
+    border-radius: 0 0.25rem 0.25rem 0;
+    border-top-style: solid;
+  }
+}
 .jewel.radiobutton input + span::before {
   background: linear-gradient(white, #f3f3f3);
   border: 1px solid #b3b3b3;
@@ -434,6 +615,89 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.simpletable {
+  background: linear-gradient(white, #f3f3f3);
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0 1px 0 white;
+  border-radius: 0.25rem;
+}
+.jewel.simpletable .jewel.thead tr {
+  border-bottom: 1px solid #d9d9d9;
+}
+.jewel.simpletable .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tableheadercell {
+  background: linear-gradient(white, #f3f3f3);
+  box-shadow: inset 0 1px 0 white;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #808080;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.simpletable .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tablecell {
+  border-top: 1px solid #d9d9d9;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.simpletable .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(white, white);
+  box-shadow: inset 0 1px 0 white;
+}
+
+.jewel.table {
+  background: linear-gradient(white, #f3f3f3);
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0 1px 0 white;
+  border-radius: 0.25rem;
+}
+.jewel.table .jewel.thead tr {
+  border-bottom: 1px solid #d9d9d9;
+}
+.jewel.table .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tableheadercell {
+  background: linear-gradient(white, #f3f3f3);
+  box-shadow: inset 0 1px 0 white;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #808080;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.table .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tablecell {
+  border-top: 1px solid #d9d9d9;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.table .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(white, white);
+  box-shadow: inset 0 1px 0 white;
+}
+
+.jewel.tableitem {
+  cursor: auto;
+}
+.jewel.tableitem.selectable {
+  cursor: pointer;
+}
+.jewel.tableitem.hovered:hover {
+  color: #FFFFFF;
+  background: #F8B13F;
+}
+.jewel.tableitem.selected, .jewel.tableitem.selectable:active {
+  color: #FFFFFF;
+  background: #f7a726;
+}
+
 .jewel.textinput {
   font-weight: 400;
   color: #808080;
@@ -539,4 +803,9 @@ j|Card {
   padding-right: 0;
 }
 
+.jewel.togglebutton .fonticon {
+  margin-left: 0px;
+  margin-right: 8px;
+}
+
 /*# sourceMappingURL=defaults.css.map */
diff --git a/frameworks/themes/Jewel-Light-NoFlat-Primary-Sunflower-Theme/src/main/sass/defaults.sass b/frameworks/themes/Jewel-Light-NoFlat-Primary-Sunflower-Theme/src/main/sass/defaults.sass
index 94cebd3..c8f87c5 100644
--- a/frameworks/themes/Jewel-Light-NoFlat-Primary-Sunflower-Theme/src/main/sass/defaults.sass
+++ b/frameworks/themes/Jewel-Light-NoFlat-Primary-Sunflower-Theme/src/main/sass/defaults.sass
@@ -31,13 +31,21 @@
 @import "../../../../JewelTheme/src/main/sass/components-primary/card"
 @import "../../../../JewelTheme/src/main/sass/components-primary/checkbox"
 @import "../../../../JewelTheme/src/main/sass/components-primary/controlbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datechooser"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datefield"
+@import "../../../../JewelTheme/src/main/sass/components-primary/divider"
 @import "../../../../JewelTheme/src/main/sass/components-primary/drawer"
+@import "../../../../JewelTheme/src/main/sass/components-primary/dropdownlist"
+@import "../../../../JewelTheme/src/main/sass/components-primary/icons"
 @import "../../../../JewelTheme/src/main/sass/components-primary/itemRenderer"
 @import "../../../../JewelTheme/src/main/sass/components-primary/label"
 @import "../../../../JewelTheme/src/main/sass/components-primary/list"
+@import "../../../../JewelTheme/src/main/sass/components-primary/navigation"
+@import "../../../../JewelTheme/src/main/sass/components-primary/numericstepper"
 @import "../../../../JewelTheme/src/main/sass/components-primary/radiobutton"
 @import "../../../../JewelTheme/src/main/sass/components-primary/slider"
-
+@import "../../../../JewelTheme/src/main/sass/components-primary/table"
 @import "../../../../JewelTheme/src/main/sass/components-primary/textinput"
 @import "../../../../JewelTheme/src/main/sass/components-primary/titlebar"
 @import "../../../../JewelTheme/src/main/sass/components-primary/topappbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/togglebutton"
diff --git a/frameworks/themes/Jewel-Light-NoFlat-Primary-Topaz-Theme/src/main/resources/defaults.css b/frameworks/themes/Jewel-Light-NoFlat-Primary-Topaz-Theme/src/main/resources/defaults.css
index d7b5b57..90ea3bf 100644
--- a/frameworks/themes/Jewel-Light-NoFlat-Primary-Topaz-Theme/src/main/resources/defaults.css
+++ b/frameworks/themes/Jewel-Light-NoFlat-Primary-Topaz-Theme/src/main/resources/defaults.css
@@ -233,6 +233,81 @@ j|Card {
   font-size: 16px;
 }
 
+.jewel.datechooser .jewel.table {
+  background: white;
+  border: 1px solid #d9d9d9;
+  border-radius: 0.25rem;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.button {
+  background: transparent;
+  border: none;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow {
+  border-bottom: 1px solid #d9d9d9;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton {
+  border-radius: 50%;
+  color: transparent;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:hover, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:hover {
+  background: #f3f3f3;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:active, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:active {
+  background: #e6e6e6;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background-size: 40%;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell {
+  background: white;
+  box-shadow: none;
+  border-left: 0px;
+}
+.jewel.datechooser .jewel.table .jewel.tablecell {
+  border-top: 0px;
+  border-left: 0px;
+  padding: 4px;
+}
+
+.calendar.item {
+  font-size: 1em;
+}
+.calendar.item.dayName {
+  font-weight: 600;
+}
+.calendar.item.date {
+  color: grey;
+}
+
+.jewel.datefield .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+.jewel.datefield .jewel.button {
+  color: transparent;
+  border-bottom-left-radius: 0px;
+  border-top-left-radius: 0px;
+  border-left: 0px;
+}
+.jewel.datefield .jewel.button::after {
+  background-size: 66%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 22 22' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M18.3333333,2.75 L17.4166667,2.75 L17.4166667,0.916666667 L15.5833333,0.916666667 L15.5833333,2.75 L6.41666667,2.75 L6.41666667,0.916666667 L4.58333333,0.916666667 L4.58333333,2.75 L3.66666667,2.75 C2.65833333,2.75 1.83333333,3.575 1.83333 [...]
+}
+
+.jewel.divider {
+  border-bottom-color: #d9d9d9;
+  border-bottom-width: 1px;
+  border-bottom-style: solid;
+}
+
 .jewel.drawer.float {
   color: rgba(0, 0, 0, 0.8);
 }
@@ -280,6 +355,61 @@ j|Card {
   padding: 16px;
 }
 
+.jewel.dropdownlist {
+  cursor: pointer;
+  display: inline-block;
+  margin: 0;
+  padding: 10px 16px;
+  min-width: 74px;
+  min-height: 34px;
+  background: linear-gradient(#e6e6e6, #cccccc);
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0 1px 0 white;
+  border-radius: 3px;
+  font-family: "Lato", sans-serif;
+  font-size: 1em;
+  font-weight: bold;
+  color: #808080;
+  text-transform: uppercase;
+  text-decoration: none;
+}
+.jewel.dropdownlist:hover, .jewel.dropdownlist:hover:focus {
+  background: linear-gradient(#d9d9d9, silver);
+  border: 1px solid #a6a6a6;
+}
+.jewel.dropdownlist:active, .jewel.dropdownlist:active:focus {
+  background: linear-gradient(silver, #a6a6a6);
+  border: 1px solid #8d8d8d;
+  box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+.jewel.dropdownlist:focus {
+  outline: none;
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0px 0px 0px 1px rgba(255, 255, 255, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.6);
+}
+.jewel.dropdownlist[disabled] {
+  cursor: unset;
+  background: #f3f3f3;
+  border: 1px solid #d9d9d9;
+  box-shadow: none;
+  color: silver;
+  font-weight: 400;
+  text-shadow: unset;
+}
+
+.fonticon.dark {
+  color: #676767;
+}
+.fonticon.dark.inactive {
+  color: rgba(128, 128, 128, 0.3);
+}
+.fonticon.light {
+  color: white;
+}
+.fonticon.light.inactive {
+  color: rgba(255, 255, 255, 0.5);
+}
+
 .jewel.item {
   padding: 8px;
 }
@@ -319,6 +449,57 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.navigation {
+  background-color: #ffffff;
+}
+
+.jewel.numericstepper .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+
+@media (max-width: 992px) {
+  .jewel.numericstepper .jewel.textinput input {
+    border-radius: 0;
+  }
+}
+.jewel.spinner {
+  width: 34px;
+}
+.jewel.spinner .jewel.button {
+  padding: 0px;
+  height: 19px;
+  color: transparent;
+  border-radius: 0 0.25rem 0.25rem 0;
+  border-left: 0px;
+}
+.jewel.spinner .jewel.button.up {
+  border-bottom-right-radius: 0px;
+}
+.jewel.spinner .jewel.button.up::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23808080' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") no-repeat center center;
+}
+.jewel.spinner .jewel.button.down {
+  border-top-right-radius: 0px;
+  border-top-style: groove;
+}
+.jewel.spinner .jewel.button.down::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23808080' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon transform='translate(8.000000, 4.705000) scale(1, -1) translate(-8.000000, -4.705000) ' points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g [...]
+}
+
+@media (max-width: 992px) {
+  .jewel.spinner .jewel.button.up {
+    border: 1px solid #b3b3b3;
+    border-radius: 0.25rem 0 0 0.25rem;
+  }
+  .jewel.spinner .jewel.button.down {
+    border: 1px solid #b3b3b3;
+    border-radius: 0 0.25rem 0.25rem 0;
+    border-top-style: solid;
+  }
+}
 .jewel.radiobutton input + span::before {
   background: linear-gradient(white, #f3f3f3);
   border: 1px solid #b3b3b3;
@@ -434,6 +615,89 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.simpletable {
+  background: linear-gradient(white, #f3f3f3);
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0 1px 0 white;
+  border-radius: 0.25rem;
+}
+.jewel.simpletable .jewel.thead tr {
+  border-bottom: 1px solid #d9d9d9;
+}
+.jewel.simpletable .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tableheadercell {
+  background: linear-gradient(white, #f3f3f3);
+  box-shadow: inset 0 1px 0 white;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #808080;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.simpletable .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tablecell {
+  border-top: 1px solid #d9d9d9;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.simpletable .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(white, white);
+  box-shadow: inset 0 1px 0 white;
+}
+
+.jewel.table {
+  background: linear-gradient(white, #f3f3f3);
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0 1px 0 white;
+  border-radius: 0.25rem;
+}
+.jewel.table .jewel.thead tr {
+  border-bottom: 1px solid #d9d9d9;
+}
+.jewel.table .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tableheadercell {
+  background: linear-gradient(white, #f3f3f3);
+  box-shadow: inset 0 1px 0 white;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #808080;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.table .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tablecell {
+  border-top: 1px solid #d9d9d9;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.table .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(white, white);
+  box-shadow: inset 0 1px 0 white;
+}
+
+.jewel.tableitem {
+  cursor: auto;
+}
+.jewel.tableitem.selectable {
+  cursor: pointer;
+}
+.jewel.tableitem.hovered:hover {
+  color: #FFFFFF;
+  background: #EF5A2A;
+}
+.jewel.tableitem.selected, .jewel.tableitem.selectable:active {
+  color: #FFFFFF;
+  background: #ed4812;
+}
+
 .jewel.textinput {
   font-weight: 400;
   color: #808080;
@@ -539,4 +803,9 @@ j|Card {
   padding-right: 0;
 }
 
+.jewel.togglebutton .fonticon {
+  margin-left: 0px;
+  margin-right: 8px;
+}
+
 /*# sourceMappingURL=defaults.css.map */
diff --git a/frameworks/themes/Jewel-Light-NoFlat-Primary-Topaz-Theme/src/main/sass/defaults.sass b/frameworks/themes/Jewel-Light-NoFlat-Primary-Topaz-Theme/src/main/sass/defaults.sass
index 94cebd3..c8f87c5 100644
--- a/frameworks/themes/Jewel-Light-NoFlat-Primary-Topaz-Theme/src/main/sass/defaults.sass
+++ b/frameworks/themes/Jewel-Light-NoFlat-Primary-Topaz-Theme/src/main/sass/defaults.sass
@@ -31,13 +31,21 @@
 @import "../../../../JewelTheme/src/main/sass/components-primary/card"
 @import "../../../../JewelTheme/src/main/sass/components-primary/checkbox"
 @import "../../../../JewelTheme/src/main/sass/components-primary/controlbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datechooser"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datefield"
+@import "../../../../JewelTheme/src/main/sass/components-primary/divider"
 @import "../../../../JewelTheme/src/main/sass/components-primary/drawer"
+@import "../../../../JewelTheme/src/main/sass/components-primary/dropdownlist"
+@import "../../../../JewelTheme/src/main/sass/components-primary/icons"
 @import "../../../../JewelTheme/src/main/sass/components-primary/itemRenderer"
 @import "../../../../JewelTheme/src/main/sass/components-primary/label"
 @import "../../../../JewelTheme/src/main/sass/components-primary/list"
+@import "../../../../JewelTheme/src/main/sass/components-primary/navigation"
+@import "../../../../JewelTheme/src/main/sass/components-primary/numericstepper"
 @import "../../../../JewelTheme/src/main/sass/components-primary/radiobutton"
 @import "../../../../JewelTheme/src/main/sass/components-primary/slider"
-
+@import "../../../../JewelTheme/src/main/sass/components-primary/table"
 @import "../../../../JewelTheme/src/main/sass/components-primary/textinput"
 @import "../../../../JewelTheme/src/main/sass/components-primary/titlebar"
 @import "../../../../JewelTheme/src/main/sass/components-primary/topappbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/togglebutton"
diff --git a/frameworks/themes/Jewel-Light-NoFlat-Primary-Turquoise-Theme/src/main/resources/defaults.css b/frameworks/themes/Jewel-Light-NoFlat-Primary-Turquoise-Theme/src/main/resources/defaults.css
index 3f28cf8..9411b80 100644
--- a/frameworks/themes/Jewel-Light-NoFlat-Primary-Turquoise-Theme/src/main/resources/defaults.css
+++ b/frameworks/themes/Jewel-Light-NoFlat-Primary-Turquoise-Theme/src/main/resources/defaults.css
@@ -233,6 +233,81 @@ j|Card {
   font-size: 16px;
 }
 
+.jewel.datechooser .jewel.table {
+  background: white;
+  border: 1px solid #d9d9d9;
+  border-radius: 0.25rem;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.button {
+  background: transparent;
+  border: none;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow {
+  border-bottom: 1px solid #d9d9d9;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton {
+  border-radius: 50%;
+  color: transparent;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:hover, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:hover {
+  background: #f3f3f3;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:active, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:active {
+  background: #e6e6e6;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background-size: 40%;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell {
+  background: white;
+  box-shadow: none;
+  border-left: 0px;
+}
+.jewel.datechooser .jewel.table .jewel.tablecell {
+  border-top: 0px;
+  border-left: 0px;
+  padding: 4px;
+}
+
+.calendar.item {
+  font-size: 1em;
+}
+.calendar.item.dayName {
+  font-weight: 600;
+}
+.calendar.item.date {
+  color: grey;
+}
+
+.jewel.datefield .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+.jewel.datefield .jewel.button {
+  color: transparent;
+  border-bottom-left-radius: 0px;
+  border-top-left-radius: 0px;
+  border-left: 0px;
+}
+.jewel.datefield .jewel.button::after {
+  background-size: 66%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 22 22' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M18.3333333,2.75 L17.4166667,2.75 L17.4166667,0.916666667 L15.5833333,0.916666667 L15.5833333,2.75 L6.41666667,2.75 L6.41666667,0.916666667 L4.58333333,0.916666667 L4.58333333,2.75 L3.66666667,2.75 C2.65833333,2.75 1.83333333,3.575 1.83333 [...]
+}
+
+.jewel.divider {
+  border-bottom-color: #d9d9d9;
+  border-bottom-width: 1px;
+  border-bottom-style: solid;
+}
+
 .jewel.drawer.float {
   color: rgba(0, 0, 0, 0.8);
 }
@@ -280,6 +355,61 @@ j|Card {
   padding: 16px;
 }
 
+.jewel.dropdownlist {
+  cursor: pointer;
+  display: inline-block;
+  margin: 0;
+  padding: 10px 16px;
+  min-width: 74px;
+  min-height: 34px;
+  background: linear-gradient(#e6e6e6, #cccccc);
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0 1px 0 white;
+  border-radius: 3px;
+  font-family: "Lato", sans-serif;
+  font-size: 1em;
+  font-weight: bold;
+  color: #808080;
+  text-transform: uppercase;
+  text-decoration: none;
+}
+.jewel.dropdownlist:hover, .jewel.dropdownlist:hover:focus {
+  background: linear-gradient(#d9d9d9, silver);
+  border: 1px solid #a6a6a6;
+}
+.jewel.dropdownlist:active, .jewel.dropdownlist:active:focus {
+  background: linear-gradient(silver, #a6a6a6);
+  border: 1px solid #8d8d8d;
+  box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+.jewel.dropdownlist:focus {
+  outline: none;
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0px 0px 0px 1px rgba(255, 255, 255, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.6);
+}
+.jewel.dropdownlist[disabled] {
+  cursor: unset;
+  background: #f3f3f3;
+  border: 1px solid #d9d9d9;
+  box-shadow: none;
+  color: silver;
+  font-weight: 400;
+  text-shadow: unset;
+}
+
+.fonticon.dark {
+  color: #676767;
+}
+.fonticon.dark.inactive {
+  color: rgba(128, 128, 128, 0.3);
+}
+.fonticon.light {
+  color: white;
+}
+.fonticon.light.inactive {
+  color: rgba(255, 255, 255, 0.5);
+}
+
 .jewel.item {
   padding: 8px;
 }
@@ -319,6 +449,57 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.navigation {
+  background-color: #ffffff;
+}
+
+.jewel.numericstepper .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+
+@media (max-width: 992px) {
+  .jewel.numericstepper .jewel.textinput input {
+    border-radius: 0;
+  }
+}
+.jewel.spinner {
+  width: 34px;
+}
+.jewel.spinner .jewel.button {
+  padding: 0px;
+  height: 19px;
+  color: transparent;
+  border-radius: 0 0.25rem 0.25rem 0;
+  border-left: 0px;
+}
+.jewel.spinner .jewel.button.up {
+  border-bottom-right-radius: 0px;
+}
+.jewel.spinner .jewel.button.up::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23808080' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") no-repeat center center;
+}
+.jewel.spinner .jewel.button.down {
+  border-top-right-radius: 0px;
+  border-top-style: groove;
+}
+.jewel.spinner .jewel.button.down::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23808080' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon transform='translate(8.000000, 4.705000) scale(1, -1) translate(-8.000000, -4.705000) ' points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g [...]
+}
+
+@media (max-width: 992px) {
+  .jewel.spinner .jewel.button.up {
+    border: 1px solid #b3b3b3;
+    border-radius: 0.25rem 0 0 0.25rem;
+  }
+  .jewel.spinner .jewel.button.down {
+    border: 1px solid #b3b3b3;
+    border-radius: 0 0.25rem 0.25rem 0;
+    border-top-style: solid;
+  }
+}
 .jewel.radiobutton input + span::before {
   background: linear-gradient(white, #f3f3f3);
   border: 1px solid #b3b3b3;
@@ -434,6 +615,89 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.simpletable {
+  background: linear-gradient(white, #f3f3f3);
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0 1px 0 white;
+  border-radius: 0.25rem;
+}
+.jewel.simpletable .jewel.thead tr {
+  border-bottom: 1px solid #d9d9d9;
+}
+.jewel.simpletable .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tableheadercell {
+  background: linear-gradient(white, #f3f3f3);
+  box-shadow: inset 0 1px 0 white;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #808080;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.simpletable .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tablecell {
+  border-top: 1px solid #d9d9d9;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.simpletable .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(white, white);
+  box-shadow: inset 0 1px 0 white;
+}
+
+.jewel.table {
+  background: linear-gradient(white, #f3f3f3);
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0 1px 0 white;
+  border-radius: 0.25rem;
+}
+.jewel.table .jewel.thead tr {
+  border-bottom: 1px solid #d9d9d9;
+}
+.jewel.table .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tableheadercell {
+  background: linear-gradient(white, #f3f3f3);
+  box-shadow: inset 0 1px 0 white;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #808080;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.table .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tablecell {
+  border-top: 1px solid #d9d9d9;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.table .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(white, white);
+  box-shadow: inset 0 1px 0 white;
+}
+
+.jewel.tableitem {
+  cursor: auto;
+}
+.jewel.tableitem.selectable {
+  cursor: pointer;
+}
+.jewel.tableitem.hovered:hover {
+  color: #FFFFFF;
+  background: #29A89F;
+}
+.jewel.tableitem.selected, .jewel.tableitem.selectable:active {
+  color: #FFFFFF;
+  background: #24948c;
+}
+
 .jewel.textinput {
   font-weight: 400;
   color: #808080;
@@ -539,4 +803,9 @@ j|Card {
   padding-right: 0;
 }
 
+.jewel.togglebutton .fonticon {
+  margin-left: 0px;
+  margin-right: 8px;
+}
+
 /*# sourceMappingURL=defaults.css.map */
diff --git a/frameworks/themes/Jewel-Light-NoFlat-Primary-Turquoise-Theme/src/main/sass/defaults.sass b/frameworks/themes/Jewel-Light-NoFlat-Primary-Turquoise-Theme/src/main/sass/defaults.sass
index 94cebd3..c8f87c5 100644
--- a/frameworks/themes/Jewel-Light-NoFlat-Primary-Turquoise-Theme/src/main/sass/defaults.sass
+++ b/frameworks/themes/Jewel-Light-NoFlat-Primary-Turquoise-Theme/src/main/sass/defaults.sass
@@ -31,13 +31,21 @@
 @import "../../../../JewelTheme/src/main/sass/components-primary/card"
 @import "../../../../JewelTheme/src/main/sass/components-primary/checkbox"
 @import "../../../../JewelTheme/src/main/sass/components-primary/controlbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datechooser"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datefield"
+@import "../../../../JewelTheme/src/main/sass/components-primary/divider"
 @import "../../../../JewelTheme/src/main/sass/components-primary/drawer"
+@import "../../../../JewelTheme/src/main/sass/components-primary/dropdownlist"
+@import "../../../../JewelTheme/src/main/sass/components-primary/icons"
 @import "../../../../JewelTheme/src/main/sass/components-primary/itemRenderer"
 @import "../../../../JewelTheme/src/main/sass/components-primary/label"
 @import "../../../../JewelTheme/src/main/sass/components-primary/list"
+@import "../../../../JewelTheme/src/main/sass/components-primary/navigation"
+@import "../../../../JewelTheme/src/main/sass/components-primary/numericstepper"
 @import "../../../../JewelTheme/src/main/sass/components-primary/radiobutton"
 @import "../../../../JewelTheme/src/main/sass/components-primary/slider"
-
+@import "../../../../JewelTheme/src/main/sass/components-primary/table"
 @import "../../../../JewelTheme/src/main/sass/components-primary/textinput"
 @import "../../../../JewelTheme/src/main/sass/components-primary/titlebar"
 @import "../../../../JewelTheme/src/main/sass/components-primary/topappbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/togglebutton"
diff --git a/frameworks/themes/Jewel-Light-NoFlat-Primary-Violet-Theme/src/main/resources/defaults.css b/frameworks/themes/Jewel-Light-NoFlat-Primary-Violet-Theme/src/main/resources/defaults.css
index de83bdf..cb1580a 100644
--- a/frameworks/themes/Jewel-Light-NoFlat-Primary-Violet-Theme/src/main/resources/defaults.css
+++ b/frameworks/themes/Jewel-Light-NoFlat-Primary-Violet-Theme/src/main/resources/defaults.css
@@ -233,6 +233,81 @@ j|Card {
   font-size: 16px;
 }
 
+.jewel.datechooser .jewel.table {
+  background: white;
+  border: 1px solid #d9d9d9;
+  border-radius: 0.25rem;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.button {
+  background: transparent;
+  border: none;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow {
+  border-bottom: 1px solid #d9d9d9;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton {
+  border-radius: 50%;
+  color: transparent;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:hover, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:hover {
+  background: #f3f3f3;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:active, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:active {
+  background: #e6e6e6;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background-size: 40%;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell {
+  background: white;
+  box-shadow: none;
+  border-left: 0px;
+}
+.jewel.datechooser .jewel.table .jewel.tablecell {
+  border-top: 0px;
+  border-left: 0px;
+  padding: 4px;
+}
+
+.calendar.item {
+  font-size: 1em;
+}
+.calendar.item.dayName {
+  font-weight: 600;
+}
+.calendar.item.date {
+  color: grey;
+}
+
+.jewel.datefield .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+.jewel.datefield .jewel.button {
+  color: transparent;
+  border-bottom-left-radius: 0px;
+  border-top-left-radius: 0px;
+  border-left: 0px;
+}
+.jewel.datefield .jewel.button::after {
+  background-size: 66%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 22 22' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M18.3333333,2.75 L17.4166667,2.75 L17.4166667,0.916666667 L15.5833333,0.916666667 L15.5833333,2.75 L6.41666667,2.75 L6.41666667,0.916666667 L4.58333333,0.916666667 L4.58333333,2.75 L3.66666667,2.75 C2.65833333,2.75 1.83333333,3.575 1.83333 [...]
+}
+
+.jewel.divider {
+  border-bottom-color: #d9d9d9;
+  border-bottom-width: 1px;
+  border-bottom-style: solid;
+}
+
 .jewel.drawer.float {
   color: rgba(0, 0, 0, 0.8);
 }
@@ -280,6 +355,61 @@ j|Card {
   padding: 16px;
 }
 
+.jewel.dropdownlist {
+  cursor: pointer;
+  display: inline-block;
+  margin: 0;
+  padding: 10px 16px;
+  min-width: 74px;
+  min-height: 34px;
+  background: linear-gradient(#e6e6e6, #cccccc);
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0 1px 0 white;
+  border-radius: 3px;
+  font-family: "Lato", sans-serif;
+  font-size: 1em;
+  font-weight: bold;
+  color: #808080;
+  text-transform: uppercase;
+  text-decoration: none;
+}
+.jewel.dropdownlist:hover, .jewel.dropdownlist:hover:focus {
+  background: linear-gradient(#d9d9d9, silver);
+  border: 1px solid #a6a6a6;
+}
+.jewel.dropdownlist:active, .jewel.dropdownlist:active:focus {
+  background: linear-gradient(silver, #a6a6a6);
+  border: 1px solid #8d8d8d;
+  box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+.jewel.dropdownlist:focus {
+  outline: none;
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0px 0px 0px 1px rgba(255, 255, 255, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.6);
+}
+.jewel.dropdownlist[disabled] {
+  cursor: unset;
+  background: #f3f3f3;
+  border: 1px solid #d9d9d9;
+  box-shadow: none;
+  color: silver;
+  font-weight: 400;
+  text-shadow: unset;
+}
+
+.fonticon.dark {
+  color: #676767;
+}
+.fonticon.dark.inactive {
+  color: rgba(128, 128, 128, 0.3);
+}
+.fonticon.light {
+  color: white;
+}
+.fonticon.light.inactive {
+  color: rgba(255, 255, 255, 0.5);
+}
+
 .jewel.item {
   padding: 8px;
 }
@@ -319,6 +449,57 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.navigation {
+  background-color: #ffffff;
+}
+
+.jewel.numericstepper .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+
+@media (max-width: 992px) {
+  .jewel.numericstepper .jewel.textinput input {
+    border-radius: 0;
+  }
+}
+.jewel.spinner {
+  width: 34px;
+}
+.jewel.spinner .jewel.button {
+  padding: 0px;
+  height: 19px;
+  color: transparent;
+  border-radius: 0 0.25rem 0.25rem 0;
+  border-left: 0px;
+}
+.jewel.spinner .jewel.button.up {
+  border-bottom-right-radius: 0px;
+}
+.jewel.spinner .jewel.button.up::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23808080' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") no-repeat center center;
+}
+.jewel.spinner .jewel.button.down {
+  border-top-right-radius: 0px;
+  border-top-style: groove;
+}
+.jewel.spinner .jewel.button.down::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23808080' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon transform='translate(8.000000, 4.705000) scale(1, -1) translate(-8.000000, -4.705000) ' points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g [...]
+}
+
+@media (max-width: 992px) {
+  .jewel.spinner .jewel.button.up {
+    border: 1px solid #b3b3b3;
+    border-radius: 0.25rem 0 0 0.25rem;
+  }
+  .jewel.spinner .jewel.button.down {
+    border: 1px solid #b3b3b3;
+    border-radius: 0 0.25rem 0.25rem 0;
+    border-top-style: solid;
+  }
+}
 .jewel.radiobutton input + span::before {
   background: linear-gradient(white, #f3f3f3);
   border: 1px solid #b3b3b3;
@@ -434,6 +615,89 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.simpletable {
+  background: linear-gradient(white, #f3f3f3);
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0 1px 0 white;
+  border-radius: 0.25rem;
+}
+.jewel.simpletable .jewel.thead tr {
+  border-bottom: 1px solid #d9d9d9;
+}
+.jewel.simpletable .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tableheadercell {
+  background: linear-gradient(white, #f3f3f3);
+  box-shadow: inset 0 1px 0 white;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #808080;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.simpletable .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tablecell {
+  border-top: 1px solid #d9d9d9;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.simpletable .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(white, white);
+  box-shadow: inset 0 1px 0 white;
+}
+
+.jewel.table {
+  background: linear-gradient(white, #f3f3f3);
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0 1px 0 white;
+  border-radius: 0.25rem;
+}
+.jewel.table .jewel.thead tr {
+  border-bottom: 1px solid #d9d9d9;
+}
+.jewel.table .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tableheadercell {
+  background: linear-gradient(white, #f3f3f3);
+  box-shadow: inset 0 1px 0 white;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #808080;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.table .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tablecell {
+  border-top: 1px solid #d9d9d9;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.table .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(white, white);
+  box-shadow: inset 0 1px 0 white;
+}
+
+.jewel.tableitem {
+  cursor: auto;
+}
+.jewel.tableitem.selectable {
+  cursor: pointer;
+}
+.jewel.tableitem.hovered:hover {
+  color: #FFFFFF;
+  background: #662C90;
+}
+.jewel.tableitem.selected, .jewel.tableitem.selectable:active {
+  color: #FFFFFF;
+  background: #58267c;
+}
+
 .jewel.textinput {
   font-weight: 400;
   color: #808080;
@@ -539,4 +803,9 @@ j|Card {
   padding-right: 0;
 }
 
+.jewel.togglebutton .fonticon {
+  margin-left: 0px;
+  margin-right: 8px;
+}
+
 /*# sourceMappingURL=defaults.css.map */
diff --git a/frameworks/themes/Jewel-Light-NoFlat-Primary-Violet-Theme/src/main/sass/defaults.sass b/frameworks/themes/Jewel-Light-NoFlat-Primary-Violet-Theme/src/main/sass/defaults.sass
index 94cebd3..c8f87c5 100644
--- a/frameworks/themes/Jewel-Light-NoFlat-Primary-Violet-Theme/src/main/sass/defaults.sass
+++ b/frameworks/themes/Jewel-Light-NoFlat-Primary-Violet-Theme/src/main/sass/defaults.sass
@@ -31,13 +31,21 @@
 @import "../../../../JewelTheme/src/main/sass/components-primary/card"
 @import "../../../../JewelTheme/src/main/sass/components-primary/checkbox"
 @import "../../../../JewelTheme/src/main/sass/components-primary/controlbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datechooser"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datefield"
+@import "../../../../JewelTheme/src/main/sass/components-primary/divider"
 @import "../../../../JewelTheme/src/main/sass/components-primary/drawer"
+@import "../../../../JewelTheme/src/main/sass/components-primary/dropdownlist"
+@import "../../../../JewelTheme/src/main/sass/components-primary/icons"
 @import "../../../../JewelTheme/src/main/sass/components-primary/itemRenderer"
 @import "../../../../JewelTheme/src/main/sass/components-primary/label"
 @import "../../../../JewelTheme/src/main/sass/components-primary/list"
+@import "../../../../JewelTheme/src/main/sass/components-primary/navigation"
+@import "../../../../JewelTheme/src/main/sass/components-primary/numericstepper"
 @import "../../../../JewelTheme/src/main/sass/components-primary/radiobutton"
 @import "../../../../JewelTheme/src/main/sass/components-primary/slider"
-
+@import "../../../../JewelTheme/src/main/sass/components-primary/table"
 @import "../../../../JewelTheme/src/main/sass/components-primary/textinput"
 @import "../../../../JewelTheme/src/main/sass/components-primary/titlebar"
 @import "../../../../JewelTheme/src/main/sass/components-primary/topappbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/togglebutton"
diff --git a/frameworks/themes/Jewel-Light-NoFlat-Primary-Yellow-Theme/src/main/resources/defaults.css b/frameworks/themes/Jewel-Light-NoFlat-Primary-Yellow-Theme/src/main/resources/defaults.css
index a04aeea..d4bbc19 100644
--- a/frameworks/themes/Jewel-Light-NoFlat-Primary-Yellow-Theme/src/main/resources/defaults.css
+++ b/frameworks/themes/Jewel-Light-NoFlat-Primary-Yellow-Theme/src/main/resources/defaults.css
@@ -233,6 +233,81 @@ j|Card {
   font-size: 16px;
 }
 
+.jewel.datechooser .jewel.table {
+  background: white;
+  border: 1px solid #d9d9d9;
+  border-radius: 0.25rem;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.button {
+  background: transparent;
+  border: none;
+  box-shadow: none;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow {
+  border-bottom: 1px solid #d9d9d9;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton {
+  border-radius: 50%;
+  color: transparent;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:hover, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:hover {
+  background: #f3f3f3;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton:active, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton:active {
+  background: #e6e6e6;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after, .jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background-size: 40%;
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .prevMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell.buttonsRow .nextMonthButton::after {
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-7.000000, -5.000000)'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M14.9911518,6.4116803 C14.9876664,5.88503401 14.7746504,5.53560917 14.5762939,5.35284424 C14.3779375,5.17007931 14.0808684,5.04951371 13.4608967,5.00170898 L7.01066011,11.0034834 L13.482210 [...]
+}
+.jewel.datechooser .jewel.table .jewel.tableheadercell {
+  background: white;
+  box-shadow: none;
+  border-left: 0px;
+}
+.jewel.datechooser .jewel.table .jewel.tablecell {
+  border-top: 0px;
+  border-left: 0px;
+  padding: 4px;
+}
+
+.calendar.item {
+  font-size: 1em;
+}
+.calendar.item.dayName {
+  font-weight: 600;
+}
+.calendar.item.date {
+  color: grey;
+}
+
+.jewel.datefield .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+.jewel.datefield .jewel.button {
+  color: transparent;
+  border-bottom-left-radius: 0px;
+  border-top-left-radius: 0px;
+  border-left: 0px;
+}
+.jewel.datefield .jewel.button::after {
+  background-size: 66%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 22 22' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Crect x='0' y='0' width='22' height='22'%3E%3C/rect%3E%3Cpath d='M18.3333333,2.75 L17.4166667,2.75 L17.4166667,0.916666667 L15.5833333,0.916666667 L15.5833333,2.75 L6.41666667,2.75 L6.41666667,0.916666667 L4.58333333,0.916666667 L4.58333333,2.75 L3.66666667,2.75 C2.65833333,2.75 1.83333333,3.575 1.83333 [...]
+}
+
+.jewel.divider {
+  border-bottom-color: #d9d9d9;
+  border-bottom-width: 1px;
+  border-bottom-style: solid;
+}
+
 .jewel.drawer.float {
   color: rgba(0, 0, 0, 0.8);
 }
@@ -280,6 +355,61 @@ j|Card {
   padding: 16px;
 }
 
+.jewel.dropdownlist {
+  cursor: pointer;
+  display: inline-block;
+  margin: 0;
+  padding: 10px 16px;
+  min-width: 74px;
+  min-height: 34px;
+  background: linear-gradient(#e6e6e6, #cccccc);
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0 1px 0 white;
+  border-radius: 3px;
+  font-family: "Lato", sans-serif;
+  font-size: 1em;
+  font-weight: bold;
+  color: #808080;
+  text-transform: uppercase;
+  text-decoration: none;
+}
+.jewel.dropdownlist:hover, .jewel.dropdownlist:hover:focus {
+  background: linear-gradient(#d9d9d9, silver);
+  border: 1px solid #a6a6a6;
+}
+.jewel.dropdownlist:active, .jewel.dropdownlist:active:focus {
+  background: linear-gradient(silver, #a6a6a6);
+  border: 1px solid #8d8d8d;
+  box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+.jewel.dropdownlist:focus {
+  outline: none;
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0px 0px 0px 1px rgba(255, 255, 255, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.6);
+}
+.jewel.dropdownlist[disabled] {
+  cursor: unset;
+  background: #f3f3f3;
+  border: 1px solid #d9d9d9;
+  box-shadow: none;
+  color: silver;
+  font-weight: 400;
+  text-shadow: unset;
+}
+
+.fonticon.dark {
+  color: #676767;
+}
+.fonticon.dark.inactive {
+  color: rgba(128, 128, 128, 0.3);
+}
+.fonticon.light {
+  color: white;
+}
+.fonticon.light.inactive {
+  color: rgba(255, 255, 255, 0.5);
+}
+
 .jewel.item {
   padding: 8px;
 }
@@ -319,6 +449,57 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.navigation {
+  background-color: #ffffff;
+}
+
+.jewel.numericstepper .jewel.textinput input {
+  width: 8em;
+  border-radius: 0.25rem 0px 0px 0.25rem;
+}
+
+@media (max-width: 992px) {
+  .jewel.numericstepper .jewel.textinput input {
+    border-radius: 0;
+  }
+}
+.jewel.spinner {
+  width: 34px;
+}
+.jewel.spinner .jewel.button {
+  padding: 0px;
+  height: 19px;
+  color: transparent;
+  border-radius: 0 0.25rem 0.25rem 0;
+  border-left: 0px;
+}
+.jewel.spinner .jewel.button.up {
+  border-bottom-right-radius: 0px;
+}
+.jewel.spinner .jewel.button.up::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23808080' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") no-repeat center center;
+}
+.jewel.spinner .jewel.button.down {
+  border-top-right-radius: 0px;
+  border-top-style: groove;
+}
+.jewel.spinner .jewel.button.down::after {
+  background-size: 46%;
+  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23808080' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon transform='translate(8.000000, 4.705000) scale(1, -1) translate(-8.000000, -4.705000) ' points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3E%3C/g [...]
+}
+
+@media (max-width: 992px) {
+  .jewel.spinner .jewel.button.up {
+    border: 1px solid #b3b3b3;
+    border-radius: 0.25rem 0 0 0.25rem;
+  }
+  .jewel.spinner .jewel.button.down {
+    border: 1px solid #b3b3b3;
+    border-radius: 0 0.25rem 0.25rem 0;
+    border-top-style: solid;
+  }
+}
 .jewel.radiobutton input + span::before {
   background: linear-gradient(white, #f3f3f3);
   border: 1px solid #b3b3b3;
@@ -434,6 +615,89 @@ j|Card {
   border-radius: 3px;
 }
 
+.jewel.simpletable {
+  background: linear-gradient(white, #f3f3f3);
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0 1px 0 white;
+  border-radius: 0.25rem;
+}
+.jewel.simpletable .jewel.thead tr {
+  border-bottom: 1px solid #d9d9d9;
+}
+.jewel.simpletable .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tableheadercell {
+  background: linear-gradient(white, #f3f3f3);
+  box-shadow: inset 0 1px 0 white;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #808080;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.simpletable .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.simpletable .jewel.tablecell {
+  border-top: 1px solid #d9d9d9;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.simpletable .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(white, white);
+  box-shadow: inset 0 1px 0 white;
+}
+
+.jewel.table {
+  background: linear-gradient(white, #f3f3f3);
+  border: 1px solid #b3b3b3;
+  box-shadow: inset 0 1px 0 white;
+  border-radius: 0.25rem;
+}
+.jewel.table .jewel.thead tr {
+  border-bottom: 1px solid #d9d9d9;
+}
+.jewel.table .jewel.tableheadercell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tableheadercell {
+  background: linear-gradient(white, #f3f3f3);
+  box-shadow: inset 0 1px 0 white;
+  font-weight: 700;
+  line-height: normal !important;
+  font-size: 1em;
+  color: #808080;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.table .jewel.tablecell:first-of-type {
+  border-left: 0px;
+}
+.jewel.table .jewel.tablecell {
+  border-top: 1px solid #d9d9d9;
+  border-left: 1px solid #d9d9d9;
+}
+.jewel.table .jewel.tfoot .jewel.tablecell {
+  border-left: 0px;
+  background: linear-gradient(white, white);
+  box-shadow: inset 0 1px 0 white;
+}
+
+.jewel.tableitem {
+  cursor: auto;
+}
+.jewel.tableitem.selectable {
+  cursor: pointer;
+}
+.jewel.tableitem.hovered:hover {
+  color: #FFFFFF;
+  background: #E2D70B;
+}
+.jewel.tableitem.selected, .jewel.tableitem.selectable:active {
+  color: #FFFFFF;
+  background: #cac00a;
+}
+
 .jewel.textinput {
   font-weight: 400;
   color: #808080;
@@ -539,4 +803,9 @@ j|Card {
   padding-right: 0;
 }
 
+.jewel.togglebutton .fonticon {
+  margin-left: 0px;
+  margin-right: 8px;
+}
+
 /*# sourceMappingURL=defaults.css.map */
diff --git a/frameworks/themes/Jewel-Light-NoFlat-Primary-Yellow-Theme/src/main/sass/defaults.sass b/frameworks/themes/Jewel-Light-NoFlat-Primary-Yellow-Theme/src/main/sass/defaults.sass
index 94cebd3..c8f87c5 100644
--- a/frameworks/themes/Jewel-Light-NoFlat-Primary-Yellow-Theme/src/main/sass/defaults.sass
+++ b/frameworks/themes/Jewel-Light-NoFlat-Primary-Yellow-Theme/src/main/sass/defaults.sass
@@ -31,13 +31,21 @@
 @import "../../../../JewelTheme/src/main/sass/components-primary/card"
 @import "../../../../JewelTheme/src/main/sass/components-primary/checkbox"
 @import "../../../../JewelTheme/src/main/sass/components-primary/controlbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datechooser"
+@import "../../../../JewelTheme/src/main/sass/components-primary/datefield"
+@import "../../../../JewelTheme/src/main/sass/components-primary/divider"
 @import "../../../../JewelTheme/src/main/sass/components-primary/drawer"
+@import "../../../../JewelTheme/src/main/sass/components-primary/dropdownlist"
+@import "../../../../JewelTheme/src/main/sass/components-primary/icons"
 @import "../../../../JewelTheme/src/main/sass/components-primary/itemRenderer"
 @import "../../../../JewelTheme/src/main/sass/components-primary/label"
 @import "../../../../JewelTheme/src/main/sass/components-primary/list"
+@import "../../../../JewelTheme/src/main/sass/components-primary/navigation"
+@import "../../../../JewelTheme/src/main/sass/components-primary/numericstepper"
 @import "../../../../JewelTheme/src/main/sass/components-primary/radiobutton"
 @import "../../../../JewelTheme/src/main/sass/components-primary/slider"
-
+@import "../../../../JewelTheme/src/main/sass/components-primary/table"
 @import "../../../../JewelTheme/src/main/sass/components-primary/textinput"
 @import "../../../../JewelTheme/src/main/sass/components-primary/titlebar"
 @import "../../../../JewelTheme/src/main/sass/components-primary/topappbar"
+@import "../../../../JewelTheme/src/main/sass/components-primary/togglebutton"