@inspark/inspark-components 19.0.49 → 19.0.51

package/src/scss/patchPrimeng/treetable/_primeng.components.treetable.compat.scss

@@ -0,0 +1,355 @@
+//@import "~primeng/resources/components/treetable/treetable.css";
+
+.p-treetable {
+  position: relative;
+
+  table {
+    border-collapse: collapse;
+    width: 100%;
+    table-layout: fixed;
+  }
+
+  .p-treetable-thead > tr > th,
+  .p-treetable-tbody > tr > td,
+  .p-treetable-tfoot > tr > td {
+    padding: $pm-treetable-padding-vertical $pm-treetable-padding-horizontal;
+  }
+
+  .p-treetable-thead {
+    background: $pm-treetable-head-background;
+  }
+
+  .p-treetable-thead > tr > th {
+    height: 36px; // added for fix bug with scroll on panels.
+    padding: $pm-treetable-padding-vertical $pm-treetable-padding-horizontal;
+    border: 1px solid $pm-treetable-head-border;
+    text-align: left;
+    min-width: 100px;
+  }
+
+  .p-treetable-thead > tr > th > .p-treetable-thead-title {
+    height: 24px;
+    line-height: 24px;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    font-width: normal;
+    font-size: 13px;
+    white-space: nowrap;
+  }
+
+  .p-treetable-tbody > tr > td {
+    min-width: 100px;
+    vertical-align: middle;
+    white-space: nowrap;
+    border: 1px solid transparent;
+
+    &.p-editing-cell {
+      padding: 0;
+      p-celleditor > * {
+        width: 100%;
+      }
+    }
+  }
+
+  .p-treetable-tbody > tr > td .p-treetable-tbody-content {
+    display: inline-block;
+    width: 100%;
+    vertical-align: middle;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    font-width: normal;
+    font-size: 13px;
+    white-space: nowrap;
+  }
+
+  .p-treetable-tbody > tr:nth-child(even) > td {
+    background: rgba($text-color, 0.1);
+  }
+
+  .p-treetable-toggler {
+    cursor: pointer;
+    display: inline-block;
+    padding: 0 $unit-small;
+    padding-left: 0;
+    vertical-align: middle;
+    font-size: $font-size-xs;
+    color: $text-color;
+  }
+
+  .p-treetable-tbody > tr > td > .p-treetable-tbody-content_has-toggler {
+    width: calc(100% - 48px);
+  }
+
+  .p-sortable-column {
+    cursor: pointer;
+    position: relative;
+    padding-right: 18px !important;
+
+    .c-sorticon a {
+      align-self: center;
+    }
+  }
+}
+
+.p-treetable-auto-layout > .p-treetable-wrapper {
+  overflow-x: auto;
+}
+
+.p-treetable-auto-layout > .p-treetable-wrapper > table {
+  table-layout: auto;
+}
+
+.p-treetable .p-treetable-chkbox {
+  margin: 0;
+  vertical-align: middle;
+}
+
+/* Sections */
+.p-treetable-caption,
+.p-treetable-summary {
+  padding: $pm-treetable-padding-vertical 0; //$pm-treetable-padding-horizontal
+  text-align: left;
+  font-weight: bold;
+  border-bottom: 0 none;
+}
+
+.p-treetable-caption {
+  border-bottom: 0 none;
+}
+
+.p-treetable-summary {
+  border-top: 0 none;
+}
+
+/* Paginator */
+.p-treetable {
+  .p-paginator-top {
+    border-bottom: 0 none;
+  }
+
+  .p-paginator-bottom {
+    border-top: 0 none;
+  }
+}
+
+/* Scrollable */
+.p-treetable-scrollable-wrapper {
+  position: relative;
+  height: calc(100% - 72px);
+
+  > div, div[ng-reflect-columns] {
+    height: 100%;
+  }
+}
+
+.p-treetable-scrollable-header,
+.p-treetable-scrollable-footer {
+  overflow: hidden;
+  border: 0 none;
+}
+
+.p-treetable-scrollable-header-table {
+  margin-bottom: 0;
+}
+
+.p-treetable-scrollable-body {
+  overflow: auto;
+  position: relative;
+  height: calc(100% - 20px) !important;
+  max-height: 80vh !important;;
+  @include screen_large-and-up {
+    max-height: none !important;;
+  }
+
+  > table > .p-treetable-tbody > tr:first-child > td {
+    border-top: 0 none;
+  }
+}
+
+.p-treetable-scrollable-body > table > .p-treetable-tbody > tr:first-child > td {
+  border-top: 0 none;
+}
+
+.p-treetable-virtual-table {
+  position: absolute;
+}
+
+/* Frozen Columns */
+.p-treetable-frozen-view .p-treetable-scrollable-body {
+  overflow: hidden;
+}
+
+.p-treetable-frozen-view > .p-treetable-scrollable-body > table > .p-treetable-tbody > tr > td:last-child {
+  border-right: 0 none;
+}
+
+.p-treetable-unfrozen-view {
+  position: absolute;
+  top: 0;
+}
+
+/* Resizable */
+.p-treetable-resizable {
+  > .p-treetable-wrapper {
+    overflow-x: auto;
+  }
+  .p-treetable-thead > tr > th {
+    overflow: hidden;
+    &.p-resizable-column {
+      overflow: visible;
+    }
+  }
+  .p-treetable-tfoot > tr > td {
+    overflow: hidden;
+  }
+  .p-treetable-data > tr > td {
+    overflow: hidden;
+  }
+  .p-resizable-column {
+    background-clip: padding-box;
+    position: relative;
+  }
+}
+
+.p-treetable-resizable-fit .p-resizable-column:last-child .p-column-resizer {
+  display: none;
+}
+
+.p-treetable {
+  .p-column-resizer {
+    display: block;
+    position: absolute !important;
+    top: 0;
+    right: -8px;
+    margin: 0;
+    width: 16px;
+    height: 100%;
+    padding: 0;
+    z-index: 1;
+    cursor: ew-resize;
+    border: 1px solid transparent;
+
+    &:hover:before {
+      content: '';
+      position: absolute;
+      left: 7px;
+      top: 2px;
+      width: 2px;
+      height: calc(100% - 4px);;
+      background: var(--ids-theme-primary, $ids-theme-primary);
+    }
+  }
+
+  .p-treetable-header {
+    margin-bottom: 6px;
+  }
+
+  .p-treetable-header-chkbox {
+    margin-bottom: 0;
+  }
+
+  .p-column-resizer-helper {
+    width: 1px;
+    position: absolute;
+    z-index: 10;
+    display: none;
+  }
+}
+
+/* Edit */
+.p-treetable .p-treetable-tbody > tr > td.p-editing-cell {
+  padding-top: 0;
+  padding-bottom: 0;
+}
+
+.p-treetable .p-treetable-tbody > tr > td.p-editing-cell p-treetablecelleditor > * {
+  width: 100%;
+}
+
+/* Reorder */
+.p-treetable-reorder-indicator-up,
+.p-treetable-reorder-indicator-down {
+  position: absolute;
+  display: none;
+}
+
+/* Responsive */
+.p-treetable-responsive .p-treetable-tbody > tr > td .p-column-title {
+  display: none;
+}
+
+@media screen and (max-width: 40em) {
+  .p-treetable-responsive .p-treetable-thead > tr > th,
+  .p-treetable-responsive .p-treetable-tfoot > tr > td {
+    display: none !important;
+  }
+
+  .p-treetable-responsive .p-treetable-tbody > tr > td {
+    text-align: left;
+    display: block;
+    border: 0 none;
+    width: 100% !important;
+    -webkit-box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+    float: left;
+    clear: left;
+  }
+
+  .p-treetable-responsive .p-treetable-tbody > tr > td .p-column-title {
+    padding: .4em;
+    min-width: 30%;
+    display: inline-block;
+    margin: -.4em 1em -.4em -.4em;
+    font-weight: bold;
+  }
+}
+
+/* Loader */
+.p-treetable-loading {
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  opacity: 0.1;
+  z-index: 1;
+}
+
+.p-treetable-loading-content {
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  z-index: 2;
+  margin-top: -1em;
+  margin-left: -1em;
+}
+
+// new-dashboards styles
+
+.p-treetable-loading-icon {
+  font-size: 2em;
+}
+
+.p-treetable .p-treetable-t > tr {
+  background-color: transparent;
+}
+
+.p-treetable .p-treetable-t > tr > td {
+  border: none;
+}
+
+.p-treetable .p-treetable-thead > tr > th {
+  border-color: transparent;
+}
+
+
+//.pi-sort-amount-up-alt:before {
+//    content: "\e914";
+//}
+//
+//.pi-sort-amount-down:before {
+//    content: "\e913";
+//}
+//
+//.pi-sort-alt:before {
+//    content: "\e915";
+//}

package/src/scss/patchPrimeng/treetable/_primeng.components.treetable.scss

@@ -0,0 +1,343 @@
+//@import "~primeng/resources/components/treetable/treetable.css";
+//@import "primeng.components.treetable.compat";
+
+.p-treetable {
+  position: relative;
+
+  table {
+    border-collapse: collapse;
+    width: 100%;
+    table-layout: fixed;
+  }
+
+  .p-treetable-thead > tr > th,
+  .p-treetable-tbody > tr > td,
+  .p-treetable-tfoot > tr > td {
+    padding: $pm-treetable-padding-vertical $pm-treetable-padding-horizontal;
+  }
+
+  .p-treetable-thead {
+    background: $pm-treetable-head-background;
+  }
+
+  .p-treetable-thead > tr > th {
+    height: 36px; // added for fix bug with scroll on panels.
+    padding: $pm-treetable-padding-vertical $pm-treetable-padding-horizontal;
+    border: 1px solid $pm-treetable-head-border;
+    text-align: left;
+    min-width: 100px;
+  }
+
+  .p-treetable-thead > tr > th > .p-treetable-thead-title {
+    height: 24px;
+    line-height: 24px;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    font-width: normal;
+    font-size: 13px;
+    white-space: nowrap;
+  }
+
+  .p-treetable-tbody > tr > td {
+    min-width: 100px;
+    vertical-align: middle;
+    white-space: nowrap;
+    border: 1px solid transparent;
+
+    &.p-editing-cell {
+      padding: 0;
+      p-celleditor > * {
+        width: 100%;
+      }
+    }
+  }
+
+  .p-treetable-tbody > tr > td .p-treetable-tbody-content {
+    display: inline-block;
+    width: 100%;
+    vertical-align: middle;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    font-width: normal;
+    font-size: 13px;
+    white-space: nowrap;
+  }
+
+  .p-treetable-tbody > tr:nth-child(even) > td {
+    background: rgba($text-color, 0.1);
+  }
+
+  .p-treetable-toggler {
+    cursor: pointer;
+    display: inline-block;
+    padding: 0 $unit-small;
+    padding-left: 0;
+    vertical-align: middle;
+    font-size: $font-size-xs;
+    color: $text-color;
+  }
+
+  .p-treetable-tbody > tr > td > .p-treetable-tbody-content_has-toggler {
+    width: calc(100% - 48px);
+  }
+
+  .p-sortable-column {
+    cursor: pointer;
+    position: relative;
+    padding-right: 18px !important;
+
+    .c-sorticon a {
+      align-self: center;
+    }
+  }
+}
+
+.p-treetable-auto-layout > .p-treetable-wrapper {
+  overflow-x: auto;
+}
+
+.p-treetable-auto-layout > .p-treetable-wrapper > table {
+  table-layout: auto;
+}
+
+.p-treetable .p-treetable-chkbox {
+  margin: 0;
+  vertical-align: middle;
+}
+
+/* Sections */
+.p-treetable-caption,
+.p-treetable-header,
+.p-treetable-summary {
+  padding: $pm-treetable-padding-vertical 0; //$pm-treetable-padding-horizontal
+  text-align: left;
+  font-weight: bold;
+  border-bottom: 0 none;
+}
+
+.p-treetable-caption,
+.p-treetable-header {
+  border-bottom: 0 none;
+  margin-bottom: $pm-treetable-padding-vertical;
+}
+
+.p-treetable-summary {
+  border-top: 0 none;
+}
+
+/* Paginator */
+.p-treetable {
+  .p-paginator-top {
+    border-bottom: 0 none;
+  }
+
+  .p-paginator-bottom {
+    border-top: 0 none;
+  }
+}
+
+/* Scrollable */
+.p-treetable-scrollable-wrapper {
+  position: relative;
+  height: calc(100% - 72px);
+
+  > div, div[ng-reflect-columns] {
+    height: 100%;
+  }
+}
+
+.p-treetable-scrollable-header,
+.p-treetable-scrollable-footer {
+  overflow: hidden;
+  border: 0 none;
+}
+
+.p-treetable-scrollable-header-table {
+  margin-bottom: 0;
+}
+
+.p-treetable-scrollable-body {
+  overflow: auto;
+  position: relative;
+  height: calc(100% - 20px) !important;
+  max-height: 80vh !important;;
+  @include screen_large-and-up {
+    max-height: none !important;;
+  }
+
+  > table > .p-treetable-tbody > tr:first-child > td {
+    border-top: 0 none;
+  }
+}
+
+.p-treetable-scrollable-body > table > .p-treetable-tbody > tr:first-child > td {
+  border-top: 0 none;
+}
+
+.p-treetable-virtual-table {
+  position: absolute;
+}
+
+/* Frozen Columns */
+.p-treetable-frozen-view .p-treetable-scrollable-body {
+  overflow: hidden;
+}
+
+.p-treetable-frozen-view > .p-treetable-scrollable-body > table > .p-treetable-tbody > tr > td:last-child {
+  border-right: 0 none;
+}
+
+.p-treetable-unfrozen-view {
+  position: absolute;
+  top: 0;
+}
+
+/* Resizable */
+.p-treetable-resizable {
+  > .p-treetable-wrapper {
+    overflow-x: auto;
+  }
+  .p-treetable-thead > tr > th {
+    overflow: hidden;
+    &.p-resizable-column {
+      overflow: visible;
+    }
+  }
+  .p-treetable-tfoot > tr > td {
+    overflow: hidden;
+  }
+  .p-treetable-data > tr > td {
+    overflow: hidden;
+  }
+  .p-resizable-column {
+    background-clip: padding-box;
+    position: relative;
+  }
+}
+
+.p-treetable-resizable-fit .p-resizable-column:last-child .p-column-resizer {
+  display: none;
+}
+
+.p-treetable {
+  .p-column-resizer {
+    display: block;
+    position: absolute !important;
+    top: 0;
+    right: -8px;
+    margin: 0;
+    width: 16px;
+    height: 100%;
+    padding: 0;
+    z-index: 1;
+    cursor: ew-resize;
+    border: 1px solid transparent;
+
+    &:hover:before {
+      content: '';
+      position: absolute;
+      left: 7px;
+      top: 2px;
+      width: 2px;
+      height: calc(100% - 4px);;
+      background: var(--ids-theme-primary, $ids-theme-primary);
+    }
+  }
+
+  .p-treetable-header-chkbox {
+    margin-bottom: 0;
+  }
+
+  .p-column-resizer-helper {
+    width: 1px;
+    position: absolute;
+    z-index: 10;
+    display: none;
+    background: var(--colorBgPrimary);
+  }
+}
+
+/* Edit */
+.p-treetable .p-treetable-tbody > tr > td.p-editing-cell {
+  padding-top: 0;
+  padding-bottom: 0;
+}
+
+.p-treetable .p-treetable-tbody > tr > td.p-editing-cell p-treetablecelleditor > * {
+  width: 100%;
+}
+
+/* Reorder */
+.p-treetable-reorder-indicator-up,
+.p-treetable-reorder-indicator-down {
+  position: absolute;
+  display: none;
+}
+
+/* Responsive */
+.p-treetable-responsive .p-treetable-tbody > tr > td .p-column-title {
+  display: none;
+}
+
+@media screen and (max-width: 40em) {
+  .p-treetable-responsive .p-treetable-thead > tr > th,
+  .p-treetable-responsive .p-treetable-tfoot > tr > td {
+    display: none !important;
+  }
+
+  .p-treetable-responsive .p-treetable-tbody > tr > td {
+    text-align: left;
+    display: block;
+    border: 0 none;
+    width: 100% !important;
+    -webkit-box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+    float: left;
+    clear: left;
+  }
+
+  .p-treetable-responsive .p-treetable-tbody > tr > td .p-column-title {
+    padding: .4em;
+    min-width: 30%;
+    display: inline-block;
+    margin: -.4em 1em -.4em -.4em;
+    font-weight: bold;
+  }
+}
+
+/* Loader */
+.p-treetable-loading {
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  opacity: 0.1;
+  z-index: 1;
+}
+
+.p-treetable-loading-content {
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  z-index: 2;
+  margin-top: -1em;
+  margin-left: -1em;
+}
+
+// new-dashboards styles
+
+.p-treetable-loading-icon {
+  font-size: 2em;
+}
+
+.p-treetable .p-treetable-t > tr {
+  background-color: transparent;
+}
+
+.p-treetable .p-treetable-t > tr > td {
+  border: none;
+}
+
+.p-treetable .p-treetable-thead > tr > th {
+  border-color: transparent;
+}

package/src/scss/patchPrimeng/treetable/_primeng.components.treetable.theme-blue.scss

@@ -0,0 +1,31 @@
+.p-treetable {
+
+  .p-treetable-thead {
+    background: $pm-treetable-head-background;
+  }
+
+  .p-treetable-thead > tr > th {
+    border: 1px solid $pm-treetable-head-border;
+  }
+
+  .p-treetable-thead > tr > th.p-highlight {
+    background: transparent;
+    color: var(--ids-theme-text-color, $text-color);
+
+    .p-sortable-column-icon {
+      color: var(--ids-theme-primary, $ids-theme-primary);
+    }
+  }
+
+  .p-treetable-tbody > tr:nth-child(even) > td {
+    background: rgba($text-color, 0.1);
+  }
+
+  .p-treetable-toggler {
+    color: $text-color;
+  }
+
+  .p-highlight .p-treetable-toggler {
+    color: $text-color-on-dark;
+  }
+}