primereact 7.0.0-rc.1 → 7.1.0

package/resources/primereact.css

@@ -314,6 +314,15 @@
     cursor: pointer;
 }
 
+.p-avatar-group .p-avatar + .p-avatar {
+    margin-left: -1rem;
+}
+
+.p-avatar-group {
+    display: flex;
+    align-items: center;
+}
+
 .p-badge {
     display: inline-block;
     border-radius: 10px;
@@ -471,15 +480,6 @@
     transition: all .2s;
 }
 
-.p-avatar-group .p-avatar + .p-avatar {
-    margin-left: -1rem;
-}
-
-.p-avatar-group {
-    display: flex;
-    align-items: center;
-}
-
 .p-calendar {
     position: relative;
     display: inline-flex;
@@ -490,16 +490,26 @@
     width: 1%;
 }
 
-.p-calendar-w-btn .p-inputtext {
+.p-calendar-w-btn-right .p-inputtext {
     border-top-right-radius: 0;
     border-bottom-right-radius: 0;
 }
 
-.p-calendar-w-btn .p-datepicker-trigger {
+.p-calendar-w-btn-right .p-datepicker-trigger {
+    border-top-left-radius: 0;
+    border-bottom-left-radius: 0;
+}
+
+.p-calendar-w-btn-left .p-inputtext {
     border-top-left-radius: 0;
     border-bottom-left-radius: 0;
 }
 
+.p-calendar-w-btn-left .p-datepicker-trigger {
+    border-top-right-radius: 0;
+    border-bottom-right-radius: 0;
+}
+
 /* Fluid */
 .p-fluid .p-calendar {
     display: flex;
@@ -693,9 +703,6 @@
 	visibility: visible;
 }
 
-.p-chart {
-    position: relative
-}
 .p-cascadeselect {
     display: inline-flex;
     cursor: pointer;
@@ -784,6 +791,9 @@
     top: 0;
 }
 
+.p-chart {
+    position: relative
+}
 .p-checkbox {
     display: inline-flex;
     cursor: pointer;
@@ -1006,52 +1016,6 @@
     align-items: center;
 }
 
-.p-contextmenu {
-    position: absolute;
-}
-
-.p-contextmenu ul {
-    margin: 0;
-    padding: 0;
-    list-style: none;
-}
-
-.p-contextmenu .p-submenu-list {
-    position: absolute;
-    min-width: 100%;
-    z-index: 1;
-}
-
-.p-contextmenu .p-menuitem-link {
-    cursor: pointer;
-    display: flex;
-    align-items: center;
-    text-decoration: none;
-    overflow: hidden;
-    position: relative;
-}
-
-.p-contextmenu .p-menuitem-text {
-    line-height: 1;
-}
-
-.p-contextmenu .p-menuitem {
-    position: relative;
-}
-
-.p-contextmenu .p-menuitem-link .p-submenu-icon {
-    margin-left: auto;
-}
-
-.p-contextmenu-enter {
-    opacity: 0;
-}
-
-.p-contextmenu-enter-active {
-    opacity: 1;
-    transition: opacity 250ms;
-}
-
 .p-datascroller {
 }
 
@@ -1409,6 +1373,52 @@
     justify-content: center;
 }
 
+.p-contextmenu {
+    position: absolute;
+}
+
+.p-contextmenu ul {
+    margin: 0;
+    padding: 0;
+    list-style: none;
+}
+
+.p-contextmenu .p-submenu-list {
+    position: absolute;
+    min-width: 100%;
+    z-index: 1;
+}
+
+.p-contextmenu .p-menuitem-link {
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    text-decoration: none;
+    overflow: hidden;
+    position: relative;
+}
+
+.p-contextmenu .p-menuitem-text {
+    line-height: 1;
+}
+
+.p-contextmenu .p-menuitem {
+    position: relative;
+}
+
+.p-contextmenu .p-menuitem-link .p-submenu-icon {
+    margin-left: auto;
+}
+
+.p-contextmenu-enter {
+    opacity: 0;
+}
+
+.p-contextmenu-enter-active {
+    opacity: 1;
+    transition: opacity 250ms;
+}
+
 .p-dialog-mask {
     position: fixed;
     top: 0;
@@ -1638,90 +1648,6 @@
     cursor: move;
 }
 
-.p-divider-horizontal {
-    display: flex;
-    width: 100%;
-    position: relative;
-    align-items: center;
-}
-
-.p-divider-horizontal:before {
-    position: absolute;
-    display: block;
-    top: 50%;
-    left: 0;
-    width: 100%;
-    content: "";
-}
-
-.p-divider-horizontal.p-divider-left {
-    justify-content: flex-start;
-}
-
-.p-divider-horizontal.p-divider-right {
-    justify-content: flex-end;
-}
-
-.p-divider-horizontal.p-divider-center {
-    justify-content: center;
-}
-
-.p-divider-content {
-    z-index: 1;
-}
-
-.p-divider-vertical {
-    min-height: 100%;
-    margin: 0 1rem;
-    display: flex;
-    position: relative;
-    justify-content: center;
-}
-
-.p-divider-vertical:before {
-    position: absolute;
-    display: block;
-    top: 0;
-    left: 50%;
-    height: 100%;
-    content: "";
-}
-
-.p-divider-vertical.p-divider-top {
-    align-items: flex-start;
-}
-
-.p-divider-vertical.p-divider-center {
-    align-items: center;
-}
-
-.p-divider-vertical.p-divider-bottom {
-    align-items: flex-end;
-}
-
-.p-divider-solid.p-divider-horizontal:before {
-    border-top-style: solid;
-}
-
-.p-divider-solid.p-divider-vertical:before {
-    border-left-style: solid;
-}
-
-.p-divider-dashed.p-divider-horizontal:before {
-    border-top-style: dashed;
-}
-
-.p-divider-dashed.p-divider-vertical:before {
-    border-left-style: dashed;
-}
-
-.p-divider-dotted.p-divider-horizontal:before {
-    border-top-style: dotted;
-}
-
-.p-divider-dotted.p-divider-horizontal:before {
-    border-left-style: dotted;
-}
 .p-dock {
     position: absolute;
     z-index: 1;
@@ -1731,7 +1657,7 @@
     pointer-events: none;
 }
 
-.p-dock-list-container {
+.p-dock-container {
     display: flex;
     pointer-events: auto;
 }
@@ -1746,7 +1672,7 @@
     pointer-events: auto;
 }
 
-.p-dock-item {
+.p-dock-magnification .p-dock-item {
     transition: all .2s cubic-bezier(0.4, 0, 0.2, 1);
     will-change: transform;
 }
@@ -1761,17 +1687,17 @@
     cursor: default;
 }
 
-.p-dock-item-second-prev,
-.p-dock-item-second-next {
+.p-dock-magnification .p-dock-item-second-prev,
+.p-dock-magnification .p-dock-item-second-next {
     transform: scale(1.2);
 }
 
-.p-dock-item-prev,
-.p-dock-item-next {
+.p-dock-magnification .p-dock-item-prev,
+.p-dock-magnification .p-dock-item-next {
     transform: scale(1.4);
 }
 
-.p-dock-item-current {
+.p-dock-magnification .p-dock-item-current {
     transform: scale(1.6);
     z-index: 1;
 }
@@ -1784,10 +1710,14 @@
     width: 100%;
 }
 
-.p-dock-top .p-dock-item {
+.p-dock-top.p-dock-magnification .p-dock-item {
     transform-origin: center top;
 }
 
+.p-dock-top .p-dock-container {
+    flex-direction: column-reverse;
+}
+
 /* bottom */
 .p-dock-bottom {
     left: 0;
@@ -1795,10 +1725,14 @@
     width: 100%;
 }
 
-.p-dock-bottom .p-dock-item {
+.p-dock-bottom.p-dock-magnification .p-dock-item {
     transform-origin: center bottom;
 }
 
+.p-dock-bottom .p-dock-container {
+    flex-direction: column;
+}
+
 /* right */
 .p-dock-right {
     right: 0;
@@ -1806,7 +1740,7 @@
     height: 100%;
 }
 
-.p-dock-right .p-dock-item {
+.p-dock-right.p-dock-magnification .p-dock-item {
     transform-origin: center right;
 }
 
@@ -1821,7 +1755,7 @@
     height: 100%;
 }
 
-.p-dock-left .p-dock-item {
+.p-dock-left.p-dock-magnification .p-dock-item {
     transform-origin: center left;
 }
 
@@ -1829,47 +1763,135 @@
     flex-direction: column;
 }
 
-.p-dropdown {
-    display: inline-flex;
-    cursor: pointer;
-    position: relative;
-    user-select: none;
-}
-
-.p-dropdown-clear-icon {
-    position: absolute;
-    top: 50%;
-    margin-top: -.5rem;
+.p-dock-left .p-dock-container {
+    flex-direction: row-reverse;
 }
 
-.p-dropdown-trigger {
+.p-divider-horizontal {
     display: flex;
+    width: 100%;
+    position: relative;
     align-items: center;
-    justify-content: center;
-    flex-shrink: 0;
 }
 
-.p-dropdown-label {
+.p-divider-horizontal:before {
+    position: absolute;
     display: block;
-    white-space: nowrap;
-    overflow: hidden;
-    flex: 1 1 auto;
-    width: 1%;
-    text-overflow: ellipsis;
-    cursor: pointer;
+    top: 50%;
+    left: 0;
+    width: 100%;
+    content: "";
 }
 
-.p-dropdown-label-empty {
-    overflow: hidden;
-    visibility: hidden;
+.p-divider-horizontal.p-divider-left {
+    justify-content: flex-start;
 }
 
-input.p-dropdown-label  {
-    cursor: default;
+.p-divider-horizontal.p-divider-right {
+    justify-content: flex-end;
 }
 
-.p-dropdown .p-dropdown-panel {
-    min-width: 100%;
+.p-divider-horizontal.p-divider-center {
+    justify-content: center;
+}
+
+.p-divider-content {
+    z-index: 1;
+}
+
+.p-divider-vertical {
+    min-height: 100%;
+    margin: 0 1rem;
+    display: flex;
+    position: relative;
+    justify-content: center;
+}
+
+.p-divider-vertical:before {
+    position: absolute;
+    display: block;
+    top: 0;
+    left: 50%;
+    height: 100%;
+    content: "";
+}
+
+.p-divider-vertical.p-divider-top {
+    align-items: flex-start;
+}
+
+.p-divider-vertical.p-divider-center {
+    align-items: center;
+}
+
+.p-divider-vertical.p-divider-bottom {
+    align-items: flex-end;
+}
+
+.p-divider-solid.p-divider-horizontal:before {
+    border-top-style: solid;
+}
+
+.p-divider-solid.p-divider-vertical:before {
+    border-left-style: solid;
+}
+
+.p-divider-dashed.p-divider-horizontal:before {
+    border-top-style: dashed;
+}
+
+.p-divider-dashed.p-divider-vertical:before {
+    border-left-style: dashed;
+}
+
+.p-divider-dotted.p-divider-horizontal:before {
+    border-top-style: dotted;
+}
+
+.p-divider-dotted.p-divider-horizontal:before {
+    border-left-style: dotted;
+}
+.p-dropdown {
+    display: inline-flex;
+    cursor: pointer;
+    position: relative;
+    user-select: none;
+}
+
+.p-dropdown-clear-icon {
+    position: absolute;
+    top: 50%;
+    margin-top: -.5rem;
+}
+
+.p-dropdown-trigger {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-shrink: 0;
+}
+
+.p-dropdown-label {
+    display: block;
+    white-space: nowrap;
+    overflow: hidden;
+    flex: 1 1 auto;
+    width: 1%;
+    text-overflow: ellipsis;
+    cursor: pointer;
+}
+
+.p-dropdown-label-empty {
+    overflow: hidden;
+    visibility: hidden;
+}
+
+input.p-dropdown-label  {
+    cursor: default;
+}
+
+.p-dropdown .p-dropdown-panel {
+    min-width: 100%;
 }
 
 .p-dropdown-panel {
@@ -3518,7 +3540,7 @@ input.p-dropdown-label  {
     font-size: 12px;
 }
 
-.p-float-label .input:-webkit-autofill ~ label {
+.p-float-label input:-webkit-autofill ~ label {
     top: -20px;
     font-size: 12px;
 }
@@ -3829,6 +3851,7 @@ input.p-dropdown-label  {
     cursor: pointer;
     align-items: center;
     justify-content: center;
+    text-decoration: none;
 }
 
 .p-inline-message {
@@ -3890,121 +3913,6 @@ input.p-dropdown-label  {
     display: none;
 }
 
-.p-multiselect {
-    display: inline-flex;
-    position: relative;
-    user-select: none;
-}
-
-.p-multiselect-trigger {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    flex-shrink: 0;
-    cursor: pointer;
-}
-
-.p-multiselect-label-container {
-    overflow: hidden;
-    flex: 1 1 auto;
-    cursor: pointer;
-}
-
-.p-multiselect-label  {
-    display: block;
-    white-space: nowrap;
-    cursor: pointer;
-    overflow: hidden;
-    text-overflow: ellipsis;
-}
-
-.p-multiselect-label-empty {
-    overflow: hidden;
-    visibility: hidden;
-}
-
-.p-multiselect-token {
-    cursor: default;
-    display: inline-flex;
-    align-items: center;
-    flex: 0 0 auto;
-}
-
-.p-multiselect-token-icon {
-    cursor: pointer;
-}
-
-.p-multiselect .p-multiselect-panel {
-    min-width: 100%;
-}
-
-.p-multiselect-panel {
-    position: absolute;
-    top: 0;
-    left: 0;
-}
-
-.p-multiselect-items-wrapper {
-    overflow: auto;
-}
-
-.p-multiselect-items {
-    margin: 0;
-    padding: 0;
-    list-style-type: none;
-}
-
-.p-multiselect-item {
-    cursor: pointer;
-    display: flex;
-    align-items: center;
-    font-weight: normal;
-    white-space: nowrap;
-    position: relative;
-    overflow: hidden;
-}
-
-.p-multiselect-header {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-}
-
-.p-multiselect-filter-container {
-    position: relative;
-    flex: 1 1 auto;
-}
-
-.p-multiselect-filter-icon {
-    position: absolute;
-    top: 50%;
-    margin-top: -.5rem;
-}
-
-.p-multiselect-filter-container .p-inputtext {
-    width: 100%;
-}
-
-.p-multiselect-close {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    flex-shrink: 0;
-    overflow: hidden;
-    position: relative;
-    margin-left: auto;
-}
-
-.p-multiselect-clear-icon {
-    position: absolute;
-    top: 50%;
-    margin-top: -.5rem;
-}
-
-.p-fluid .p-multiselect {
-    display: flex;
-}
-
 .p-orderlist {
     display: flex;
 }
@@ -4070,6 +3978,7 @@ input.p-dropdown-label  {
     cursor: pointer;
     width: 1.5rem;
     height: 1.5rem;
+    text-decoration: none;
 }
 
 .p-organizationchart-node-content .p-node-toggler .p-node-toggler-icon {
@@ -4227,35 +4136,119 @@ input.p-dropdown-label  {
     position: relative;
 }
 
-.p-panelmenu .p-panelmenu-header-link {
+.p-multiselect {
+    display: inline-flex;
+    position: relative;
+    user-select: none;
+}
+
+.p-multiselect-trigger {
     display: flex;
     align-items: center;
-    user-select: none;
+    justify-content: center;
+    flex-shrink: 0;
     cursor: pointer;
-    position: relative;
-    text-decoration: none;
 }
 
-.p-panelmenu .p-panelmenu-header-link:focus {
-    z-index: 1;
+.p-multiselect-label-container {
+    overflow: hidden;
+    flex: 1 1 auto;
+    cursor: pointer;
 }
 
-.p-panelmenu .p-submenu-list {
+.p-multiselect-label  {
+    display: block;
+    white-space: nowrap;
+    cursor: pointer;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+.p-multiselect-label-empty {
+    overflow: hidden;
+    visibility: hidden;
+}
+
+.p-multiselect-token {
+    cursor: default;
+    display: inline-flex;
+    align-items: center;
+    flex: 0 0 auto;
+}
+
+.p-multiselect-token-icon {
+    cursor: pointer;
+}
+
+.p-multiselect .p-multiselect-panel {
+    min-width: 100%;
+}
+
+.p-multiselect-panel {
+    position: absolute;
+    top: 0;
+    left: 0;
+}
+
+.p-multiselect-items-wrapper {
+    overflow: auto;
+}
+
+.p-multiselect-items {
     margin: 0;
     padding: 0;
-    list-style: none;
+    list-style-type: none;
 }
 
-.p-panelmenu .p-menuitem-link {
+.p-multiselect-item {
+    cursor: pointer;
     display: flex;
     align-items: center;
-    user-select: none;
-    cursor: pointer;
-    text-decoration: none;
+    font-weight: normal;
+    white-space: nowrap;
+    position: relative;
+    overflow: hidden;
 }
 
-.p-panelmenu .p-menuitem-text {
-    line-height: 1;
+.p-multiselect-header {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+}
+
+.p-multiselect-filter-container {
+    position: relative;
+    flex: 1 1 auto;
+}
+
+.p-multiselect-filter-icon {
+    position: absolute;
+    top: 50%;
+    margin-top: -.5rem;
+}
+
+.p-multiselect-filter-container .p-inputtext {
+    width: 100%;
+}
+
+.p-multiselect-close {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-shrink: 0;
+    overflow: hidden;
+    position: relative;
+    margin-left: auto;
+}
+
+.p-multiselect-clear-icon {
+    position: absolute;
+    top: 50%;
+    margin-top: -.5rem;
+}
+
+.p-fluid .p-multiselect {
+    display: flex;
 }
 
 .p-password {
@@ -4287,6 +4280,37 @@ input.p-dropdown-label  {
     display: flex;
 }
 
+.p-panelmenu .p-panelmenu-header-link {
+    display: flex;
+    align-items: center;
+    user-select: none;
+    cursor: pointer;
+    position: relative;
+    text-decoration: none;
+}
+
+.p-panelmenu .p-panelmenu-header-link:focus {
+    z-index: 1;
+}
+
+.p-panelmenu .p-submenu-list {
+    margin: 0;
+    padding: 0;
+    list-style: none;
+}
+
+.p-panelmenu .p-menuitem-link {
+    display: flex;
+    align-items: center;
+    user-select: none;
+    cursor: pointer;
+    text-decoration: none;
+}
+
+.p-panelmenu .p-menuitem-text {
+    line-height: 1;
+}
+
 .p-picklist {
     display: flex;
 }
@@ -4486,6 +4510,14 @@ input.p-dropdown-label  {
     }
 }
 
+.p-rating-icon {
+    cursor: pointer;
+}
+
+.p-rating.p-rating-readonly .p-rating-icon {
+    cursor: default;
+}
+
 .p-radiobutton {
     display: inline-flex;
     cursor: pointer;
@@ -4512,14 +4544,6 @@ input.p-dropdown-label  {
     visibility: visible;
 }
 
-.p-rating-icon {
-    cursor: pointer;
-}
-
-.p-rating.p-rating-readonly .p-rating-icon {
-    cursor: default;
-}
-
 .p-ripple {
     overflow: hidden;
     position: relative;
@@ -4638,21 +4662,46 @@ input.p-dropdown-label  {
     transition: opacity .15s;
 }
 
-.p-sidebar {
+.p-sidebar-mask {
     position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    display: none;
+    justify-content: center;
+    align-items: center;
+    pointer-events: none;
+    background-color: transparent;
+    transition-property: background-color;
+}
+
+.p-sidebar-visible {
+    display: flex;
+}
+
+.p-sidebar-mask.p-component-overlay {
+    pointer-events: auto;
+}
+
+.p-sidebar {
     display: flex;
     flex-direction: column;
+    pointer-events: auto;
+    transform: translate3d(0px, 0px, 0px);
+    position: relative;
 }
 
 .p-sidebar-content {
-    position: relative;
     overflow-y: auto;
+    flex-grow: 1;
 }
 
 .p-sidebar-header {
     display: flex;
     align-items: center;
     justify-content: flex-end;
+    flex-shrink: 0;
 }
 
 .p-sidebar-icon {
@@ -4663,170 +4712,171 @@ input.p-dropdown-label  {
     position: relative;
 }
 
-.p-sidebar-left {
-    top: 0;
-    left: 0;
-    width: 20rem;
-    height: 100%;
+.p-sidebar-full .p-sidebar {
+    transition: none;
+    transform: none;
+    width: 100vw !important;
+    height: 100vh !important;
+    max-height: 100%;
+    top: 0px !important;
+    left: 0px !important;
 }
 
-.p-sidebar-right {
-    top: 0;
-    right: 0;
-    width: 20rem;
-    height: 100%;
+/* Animation */
+/* Top, Bottom, Left and Right */
+.p-sidebar-top .p-sidebar-enter,
+.p-sidebar-top .p-sidebar-exit-active  {
+    transform: translate3d(0px, -100%, 0px);
 }
 
-.p-sidebar-top {
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 10rem;
+.p-sidebar-bottom .p-sidebar-enter,
+.p-sidebar-bottom .p-sidebar-exit-active {
+    transform: translate3d(0px, 100%, 0px);
 }
 
-.p-sidebar-bottom {
-    bottom: 0;
-    left: 0;
-    width: 100%;
-    height: 10rem;
+.p-sidebar-left .p-sidebar-enter,
+.p-sidebar-left .p-sidebar-exit-active {
+    transform: translate3d(-100%, 0px, 0px);
 }
 
-.p-sidebar-full {
-    width: 100%;
-    height: 100%;
-    top: 0;
-    left: 0;
-    -webkit-transition: none;
-    transition: none;
+.p-sidebar-right .p-sidebar-enter,
+.p-sidebar-right .p-sidebar-exit-active {
+    transform: translate3d(100%, 0px, 0px);
 }
 
-.p-sidebar-left.p-sidebar-enter {
-    transform: translateX(-100%);
-}
-.p-sidebar-left.p-sidebar-enter-active {
-    transform: translateX(0);
-    transition: transform .3s;
-}
-.p-sidebar-left.p-sidebar-exit {
-    transform: translateX(0);
-}
-.p-sidebar-left.p-sidebar-exit-active {
-    transform: translateX(-100%);
-    transition: transform .3s;
+.p-sidebar-top .p-sidebar-enter-active,
+.p-sidebar-bottom .p-sidebar-enter-active,
+.p-sidebar-left .p-sidebar-enter-active,
+.p-sidebar-right .p-sidebar-enter-active {
+    transform: translate3d(0px, 0px, 0px);
+    transition: all .3s;
 }
 
-.p-sidebar-right.p-sidebar-enter {
-    transform: translateX(100%);
-}
-.p-sidebar-right.p-sidebar-enter-active {
-    transform: translateX(0);
-    transition: transform .3s;
-}
-.p-sidebar-right.p-sidebar-exit {
-    transform: translateX(0);
+.p-sidebar-top .p-sidebar-enter-done,
+.p-sidebar-bottom .p-sidebar-enter-done,
+.p-sidebar-left .p-sidebar-enter-done,
+.p-sidebar-right .p-sidebar-enter-done {
+    transform: none;
 }
-.p-sidebar-right.p-sidebar-exit-active {
-    transform: translateX(100%);
-    transition: transform .3s;
+
+.p-sidebar-top .p-sidebar-exit-active,
+.p-sidebar-bottom .p-sidebar-exit-active,
+.p-sidebar-left .p-sidebar-exit-active,
+.p-sidebar-right .p-sidebar-exit-active {
+    transition: all .3s;
 }
 
-.p-sidebar-top.p-sidebar-enter {
-    transform: translateY(-100%);
+/* Full */
+.p-sidebar-full .p-sidebar-enter {
+    opacity: 0;
+    transform: scale(0.5);
 }
-.p-sidebar-top.p-sidebar-enter-active {
-    transform: translateY(0);
-    transition: transform .3s;
+
+.p-sidebar-full .p-sidebar-enter-active {
+    opacity: 1;
+    transform: scale(1);
+    transition: all .15s cubic-bezier(0, 0, 0.2, 1);
 }
-.p-sidebar-top.p-sidebar-exit {
-    transform: translateY(0);
+
+.p-sidebar-full .p-sidebar-enter-done {
+    transform: none;
 }
-.p-sidebar-top.p-sidebar-exit-active {
-    transform: translateY(-100%);
-    transition: transform .3s;
+
+.p-sidebar-full .p-sidebar-exit-active {
+    opacity: 0;
+    transform: scale(0.5);
+    transition: all .15s cubic-bezier(0.4, 0.0, 0.2, 1);
 }
 
-.p-sidebar-bottom.p-sidebar-enter {
-    transform: translateY(100%);
+/* Position */
+.p-sidebar-left {
+    justify-content: flex-start;
 }
-.p-sidebar-bottom.p-sidebar-enter-active {
-    transform: translateY(0);
-    transition: transform .3s;
+
+.p-sidebar-right {
+    justify-content: flex-end;
 }
-.p-sidebar-bottom.p-sidebar-exit {
-    transform: translateY(0);
+
+.p-sidebar-top {
+    align-items: flex-start;
 }
-.p-sidebar-bottom.p-sidebar-exit-active {
-    transform: translateY(100%);
-    transition: transform .3s;
+
+.p-sidebar-bottom {
+    align-items: flex-end;
 }
 
-.p-sidebar-full.p-sidebar-enter {
-    opacity: 0;
+/* Size */
+.p-sidebar-left .p-sidebar {
+    width: 20rem;
+    height: 100%;
 }
-.p-sidebar-full.p-sidebar-enter-active {
-    opacity: 1;
-    transition: opacity 400ms cubic-bezier(0.25, 0.8, 0.25, 1);
+
+.p-sidebar-right .p-sidebar {
+    width: 20rem;
+    height: 100%;
 }
-.p-sidebar-full.p-sidebar-exit {
-    opacity: 1;
+
+.p-sidebar-top .p-sidebar {
+    height: 10rem;
+    width: 100%;
 }
-.p-sidebar-full.p-sidebar-exit-active {
-    opacity: 0;
-    transition: opacity 400ms cubic-bezier(0.25, 0.8, 0.25, 1);
+
+.p-sidebar-bottom .p-sidebar {
+    height: 10rem;
+    width: 100%;
 }
 
-.p-sidebar-left.p-sidebar-sm,
-.p-sidebar-right.p-sidebar-sm {
+.p-sidebar-left .p-sidebar-sm,
+.p-sidebar-right .p-sidebar-sm {
     width: 20rem;
 }
 
-.p-sidebar-left.p-sidebar-md,
-.p-sidebar-right.p-sidebar-md {
+.p-sidebar-left .p-sidebar-md,
+.p-sidebar-right .p-sidebar-md {
     width: 40rem;
 }
 
-.p-sidebar-left.p-sidebar-lg,
-.p-sidebar-right.p-sidebar-lg {
+.p-sidebar-left .p-sidebar-lg,
+.p-sidebar-right .p-sidebar-lg {
     width: 60rem;
 }
 
-.p-sidebar-top.p-sidebar-sm,
-.p-sidebar-bottom.p-sidebar-sm {
+.p-sidebar-top .p-sidebar-sm,
+.p-sidebar-bottom .p-sidebar-sm {
     height: 10rem;
 }
 
-.p-sidebar-top.p-sidebar-md,
-.p-sidebar-bottom.p-sidebar-md {
+.p-sidebar-top .p-sidebar-md,
+.p-sidebar-bottom .p-sidebar-md {
     height: 20rem;
 }
 
-.p-sidebar-top.p-sidebar-lg,
-.p-sidebar-bottom.p-sidebar-lg {
+.p-sidebar-top .p-sidebar-lg,
+.p-sidebar-bottom .p-sidebar-lg {
     height: 30rem;
 }
 
-.p-sidebar-left.p-sidebar-view,
-.p-sidebar-right.p-sidebar-view,
-.p-sidebar-top.p-sidebar-view,
-.p-sidebar-bottom.p-sidebar-view {
+.p-sidebar-left .p-sidebar-view,
+.p-sidebar-right .p-sidebar-view,
+.p-sidebar-top .p-sidebar-view,
+.p-sidebar-bottom .p-sidebar-view {
     width: 100%;
     height: 100%;
 }
 
-.p-sidebar-left.p-sidebar-content,
-.p-sidebar-right.p-sidebar-content,
-.p-sidebar-top.p-sidebar-content,
-.p-sidebar-bottom.p-sidebar-content {
-    position: absolute;
+.p-sidebar-left .p-sidebar-content,
+.p-sidebar-right .p-sidebar-content,
+.p-sidebar-top .p-sidebar-content,
+.p-sidebar-bottom .p-sidebar-content {
     width: 100%;
     height: 100%;
 }
 
 @media screen and (max-width: 64em) {
-    .p-sidebar-left.p-sidebar-lg,
-    .p-sidebar-left.p-sidebar-md,
-    .p-sidebar-right.p-sidebar-lg,
-    .p-sidebar-right.p-sidebar-md {
+    .p-sidebar-left .p-sidebar-lg,
+    .p-sidebar-left .p-sidebar-md,
+    .p-sidebar-right .p-sidebar-lg,
+    .p-sidebar-right .p-sidebar-md {
         width: 20rem;
     }
 }
@@ -5327,6 +5377,10 @@ input.p-dropdown-label  {
     z-index: 1;
 }
 
+.p-tabview-close {
+    z-index: 1;
+}
+
 .p-tabview-title {
     line-height: 1;
     white-space: nowrap;
@@ -5660,7 +5714,6 @@ input.p-dropdown-label  {
 .p-tooltip {
     position:absolute;
     padding: .25em .5rem;
-    max-width: 12.5rem;
 }
 
 .p-tooltip.p-tooltip-right,