pixel-react 1.13.43 → 1.13.44

package/lib/styles/NLPInput.scss

@@ -1,313 +0,0 @@
-@use '../../assets/styles/fonts';
-
-@mixin transition-all($time: 0.3s) {
-  transition: opacity $time ease-out, transform $time ease-out,
-    font-size $time ease-out, padding $time ease-out;
-}
-
-@mixin absolute-position($top: auto, $right: auto, $bottom: auto, $left: auto) {
-  position: absolute;
-  top: $top;
-  right: $right;
-  bottom: $bottom;
-  left: $left + 2px;
-}
-
-@mixin opacity-style($opacity: 1, $color: null, $border-color-arg: null) {
-  opacity: $opacity;
-  @if $color {
-    color: var(--nlp-input-placeholder-color);
-  }
-  @if $border-color-arg {
-    border-color: var(--nlp-border-color);
-  }
-}
-
-.ff-nlp-input-wrapper {
-  position: relative;
-
-  .ff-nlp-input {
-    margin: 0;
-    padding: 0;
-    box-sizing: border-box;
-    min-height: 32px;
-    min-width: 482px;
-    display: flex;
-    align-items: end;
-    position: relative;
-    &-fieldset {
-      margin: 0;
-      padding: 25px 0px 0px 8px;
-      border: 1px solid transparent;
-      box-sizing: border-box;
-      height: 32px;
-      width: 100%;
-      border-radius: 4px;
-      display: block;
-
-      &--border-radius {
-        border-radius: 0px 4px 4px 0px;
-      }
-
-      &--no-label {
-        padding: 30px 0px 0px 8px;
-      }
-
-      &--default {
-        @include opacity-style(0, null, var(--ff-nlp-input-border-color));
-      }
-
-      &--active {
-        @include opacity-style(1, null, var(--ff-nlp-input-brand-color));
-      }
-
-      &--option {
-        opacity: 1;
-      }
-
-      &--no-border {
-        border-color: transparent;
-      }
-
-      &--error {
-        border-color: var(--error-light);
-      }
-
-      .ff-nlp-input-legend {
-        @extend .font-size-8;
-        padding: 0 2px;
-        letter-spacing: 0.5px;
-        &--default {
-          @include transition-all(0.3s);
-          opacity: 0;
-        }
-
-        &--active {
-          @include transition-all(0.25s);
-          @include opacity-style(1, var(--ff-nlp-input-brand-color));
-        }
-
-        &--option {
-          @include opacity-style(1, var(--ff-nlp-input-default-color));
-        }
-
-        &--error {
-          color: var(--error-light);
-        }
-
-        &--required {
-          margin-right: 2px;
-        }
-      }
-    }
-
-    &-container {
-      @extend .fontSm;
-      @include absolute-position(6px, auto, auto, auto);
-      width: 482px;
-      height: 32px;
-      padding: 0 28px 0 8px;
-      border-radius: 4px;
-      border: 1px solid transparent;
-      z-index: 100;
-      background: transparent;
-      outline: none;
-      color: var(--nlp-option-color);
-      text-indent: 22px;
-
-      &:hover {
-        ~ .ff-nlp-input-label {
-          color: var(--nlp-input-placeholder-color);
-          padding-left: 26px;
-        }
-      }
-
-      &--border-radius {
-        border-radius: 0px 4px 4px 0px;
-      }
-
-      &--default {
-        @include opacity-style(1, null, var(--ff-nlp-input-border-color));
-
-        &:hover {
-          border-color: var(--nlp-input-placeholder-color);
-
-          ~ .ff-nlp-input-fieldset--option {
-            border-color: var(--ff-nlp-input-text-color);
-
-            .ff-nlp-input-legend--option {
-              color: var(--ff-nlp-input-text-color);
-            }
-          }
-        }
-      }
-
-      &--no-label {
-        min-height: calc(100% - 2px);
-        margin-top: 0px;
-        top: 0px;
-      }
-
-      &--active {
-        border-color: transparent;
-
-        &:hover {
-          border-color: transparent;
-        }
-      }
-
-      &--no-border {
-        border: none;
-        border-color: transparent;
-
-        &:hover {
-          border-color: transparent;
-
-          ~ .ff-nlp-input-fieldset--no-border {
-            border-color: transparent;
-          }
-        }
-      }
-
-      &--disable {
-        border-color: var(--ff-nlp-input-border-color);
-
-        &:hover {
-          border-color: var(--ff-nlp-input-border-color);
-
-          ~ .ff-nlp-input-label--default {
-            color: var(--ff-nlp-input-default-color);
-          }
-        }
-      }
-
-      &--error {
-        border-color: var(--error-light);
-
-        &:hover {
-          border-color: var(--error-light);
-        }
-      }
-    }
-
-    &-label {
-      @include absolute-position(13px, auto, auto, 8px);
-      z-index: 1;
-      font-size: 12px;
-      top: 60%;
-      padding-left: 8px;
-
-      &--default {
-        @include transition-all;
-        @include opacity-style(1, var(--ff-nlp-input-default-color));
-        transform: translateY(-50%);
-      }
-
-      &--active {
-        @include transition-all;
-        opacity: 0;
-        transform: translateY(-150%);
-        padding: 0 6px;
-      }
-
-      &--required {
-        margin-right: 2px;
-      }
-    }
-
-    &-arrow {
-      position: absolute;
-      top: 60%;
-      height: 100%;
-      right: 10px;
-      transform: rotateX(0deg) translateY(-50%);
-      cursor: pointer;
-      z-index: 10000;
-
-      &--no-label {
-        top: 50%;
-      }
-    }
-  }
-
-  &-error-text {
-    @include absolute-position(auto, auto, -14px, 12px);
-    white-space: nowrap;
-  }
-  .ff-nlp-input-label {
-    display: flex;
-    align-items: center;
-    padding-left: 26px;
-    gap: 4px;
-  }
-  .ff-nlp-help_icon {
-    position: absolute;
-    bottom: 4px;
-    left: 8px;
-    width: 30px;
-    height: 30px;
-    z-index: 100;
-    cursor: pointer;
-  }
-}
-.ff-nlp-input-arrow {
-  z-index: 111;
-}
-.ff-nlp-icon-container {
-  position: relative;
-  display: inline-block;
-}
-
-.icon-label {
-  position: absolute;
-  bottom: 100%;
-  left: 50%;
-  transform: translateX(-55%);
-  transform: translateY(-145%);
-  margin-bottom: 5px;
-  visibility: hidden;
-  opacity: 0;
-  transition: opacity 0.3s ease, visibility 0s linear 0.3s;
-  background-color: var(--tooltip-bg-color);
-  color: var(--tooltip-text-color);
-  padding: 2px 5px;
-  border-radius: 3px;
-  white-space: nowrap;
-}
-
-.ff-nlp-icon-container:hover .icon-label {
-  visibility: visible;
-  opacity: 1;
-  transition-delay: 0s;
-}
-
-.help-icon-label {
-  position: absolute;
-  bottom: 80%;
-  left: 96%;
-  transform: translateX(-50%);
-  margin-bottom: 5px;
-  visibility: hidden;
-  opacity: 0;
-  transition: opacity 0.3s ease, visibility 0s linear 0.3s;
-  background-color: var(--tooltip-bg-color);
-  color: var(--tooltip-text-color);
-  padding: 2px 5px;
-  border-radius: 3px;
-  white-space: nowrap;
-}
-.help-icon-container:hover .help-icon-label {
-  visibility: visible;
-  opacity: 1;
-  transition-delay: 0s;
-}
-
-.main-section {
-  display: flex;
-  padding-left: 8px;
-
-  .chips-accordion-content {
-    padding-top: 6px;
-    padding-right: 8px;
-  }
-}

package/lib/styles/NlpDropdown.scss

@@ -1,146 +0,0 @@
-@use '../../../../assets/styles/fonts';
-
-@mixin absolute-position($top: auto, $right: auto, $bottom: auto, $left: auto) {
-  position: absolute;
-  top: $top;
-  right: $right;
-  bottom: $bottom;
-  left: $left;
-}
-.ff-nlp-option {
-  color: var(--nlp-option-color);
-  display: flex;
-  gap: 4px;
-  align-items: center;
-}
-.ff-nlp-dropdown-wrapper {
-  .ff-nlp-options-wrapper {
-    max-height: 256px;
-    z-index: 999;
-    position: absolute;
-    border: 1px solid var(--nlp-border-color);
-    box-sizing: border-box;
-    margin-top: 4px;
-    border-radius: 4px;
-    background-color: var(--primary-icon-color);
-    overflow: hidden auto;
-    display: flex;
-    justify-content: space-between;
-    overflow: hidden;
-    // transition: all 0.3s ease-in-out;
-    .ff-nlp-options-primary-wrapper {
-      max-height: 240px;
-      z-index: 100;
-      min-width: 290px;
-      box-sizing: border-box;
-      overflow: scroll;
-      scrollbar-width: none;
-      flex-grow: 1;
-      transition: max-height 0.3s ease-in-out;
-    }
-    .ff-nlp-options-primary-wrapper::-webkit-scrollbar {
-      display: none;
-    }
-
-    .ff-nlp-option {
-      width: calc(100% - 10px);
-      border: 1px solid transparent;
-      padding: 0 4px;
-      overflow: hidden;
-      white-space: nowrap;
-      height: 32px;
-      text-overflow: ellipsis;
-      cursor: pointer;
-      &:hover,
-      &.ff-nlp-option--selected {
-        background-color: var(--nlp-hover-color);
-      }
-      &:focus {
-        outline: none;
-        background-color: var(--nlp-hover-color);
-      }
-    }
-
-    .ff-nlp-no-option {
-      width: calc(100% - 16px);
-      margin: 0;
-      overflow: hidden;
-      padding: 0 8px;
-      white-space: nowrap;
-      text-overflow: ellipsis;
-      cursor: not-allowed;
-    }
-  }
-  .ff-nlp-data-show {
-    width: 380px;
-    height: 255px;
-    border: 1px solid transparent;
-    overflow: scroll;
-    scrollbar-width: none;
-    padding: 8px;
-    border: 1px solid var(--nlp-border-color);
-    position: relative;
-    border-radius: 4px;
-  }
-  .ff-nlp-data-hide {
-    display: none;
-  }
-  .nlp-categories {
-    padding: 0px 2px;
-    gap: 10px;
-    border-radius: 2px;
-  }
-
-  .ff-nlp-data-side-menu {
-    display: flex;
-    flex-direction: column;
-    row-gap: 8px;
-    color: var(--nlp-option-color);
-  }
-  .ff-nlp-data-show::-webkit-scrollbar {
-    display: none;
-  }
-
-  .nlp-details-header {
-    color: var(--status-skipped-text-color);
-    display: flex;
-    flex-direction: column;
-  }
-  .nlp-details {
-    color: var(--status-skipped-text-color);
-  }
-  .ff-nlp-options-wrapper-main {
-    display: flex;
-    flex-direction: column;
-    width: 302px;
-    justify-content: space-between;
-    flex-grow: 1;
-  }
-}
-.ff-nlp {
-  color: var(--nlp-color);
-  background-color: var(--nlp-background-color);
-}
-
-.ff-sg {
-  color: var(--nlp-step-group-color);
-  background-color: var(--nlp-step-group-background);
-}
-
-.ff-pe {
-  color: var(--nlp-pe-color);
-  background-color: var(--nlp-pe-background);
-}
-
-.ff-nlp-web-service-div {
-  display: flex;
-  justify-content: flex-end;
-  align-items: center;
-  height: 32px;
-}
-.ff-nlp-primary-web-service-div {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  height: 32px;
-}

package/lib/styles/NoDataContent.scss

@@ -1,10 +0,0 @@
-.no_data_message {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  flex-direction: column;
-}
-
-.flex-row{
-  flex-direction: row;
-}

package/lib/styles/NotFoundPage.scss

@@ -1,5 +0,0 @@
-@use '../../assets/styles/mixins' as *;
-.ff-not-found-page {
-  flex-direction: column;
-  @include center-content;
-}

package/lib/styles/NumberCounter.scss

@@ -1,16 +0,0 @@
-.ff-counter-item {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  flex-direction: column;
-
-  .ff-counter-value {
-    align-self: center;
-    line-height: 26px;
-  }
-
-  .ff-counter-label {
-    align-self: center;
-    line-height: 22px;
-  }
-}

package/lib/styles/OsTree.scss

@@ -1,182 +0,0 @@
-.ff-os-tree {
-  display: flex;
-  flex-direction: column;
-  width: 100%;
-
-  &--left {
-    align-items: flex-start;
-  }
-
-  &--center {
-    align-items: center;
-  }
-
-  &--right {
-    align-items: flex-end;
-  }
-
-  &__root-wrapper {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    width: 80%;
-    margin: 0 auto;
-  }
-
-  &__root-label {
-    font-weight: bold;
-    font-size: 16px;
-    white-space: nowrap;
-    text-align: center;
-    width: 60px;
-    display: inline-block;
-  }
-
-  &__vertical-root {
-    width: 2px;
-    height: 20px;
-    background-color: var(--tooltip-bg-color);
-    margin: 5px 0 0 0px;
-  }
-
-  &--center &__root-label,
-  &--center &__vertical-root {
-    align-self: center;
-  }
-
-  &--left &__root-label,
-  &--left &__vertical-root {
-    align-self: flex-start;
-    margin-left: 90px;
-    transform: translateX(calc((50% / var(--child-count)) - 80%));
-  }
-
-  &--right &__root-label,
-  &--right &__vertical-root {
-    align-self: flex-end;
-    margin-right: 90px;
-    transform: translateX(calc(-1 * (50% / var(--child-count)) + 50%));
-  }
-
-  &__horizontal-connector {
-    display: grid;
-    grid-template-columns: repeat(var(--child-count), 1fr);
-    align-items: flex-start;
-    height: 20px;
-    position: relative;
-    margin: 0 auto;
-    width: 100%;
-    box-sizing: border-box;
-  }
-
-  &__horizontal-connector::before {
-    content: "";
-    position: absolute;
-    top: 0;
-    left: calc(50% / var(--child-count));
-    right: calc(50% / var(--child-count));
-    height: 2px;
-    background-color: var(--tooltip-bg-color) ;
-  }
-
-  &__vertical-child {
-    width: 2px;
-    height: 20px;
-    background-color: var(--tooltip-bg-color);
-    position: relative;
-    top: -1px;
-    margin: 1px auto;
-  }
-
-  &__children {
-    display: grid;
-    grid-template-columns: repeat(var(--child-count), 1fr);
-    margin: 0 auto;
-    width: 100%;
-  }
-
-  &__child-container {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    min-width: 60px;
-  }
-
-  &__child-label {
-    font-size: 14px;
-    text-align: center;
-    white-space: nowrap;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    width: 60px;
-  }
-}
-
-.ff-os-tree-vertical {
-  display: flex;
-  padding: 20px;
-
-  &__row {
-    display: flex;
-    align-items: flex-start;
-
-    &--top {
-      margin-top: 0;
-    }
-
-    &--center {
-      margin-top: calc(((var(--child-count) - 1) * 40px) / 2.43);
-    }
-
-    &--bottom {
-      margin-top: calc(((var(--child-count) - 1) * 40px) / 1.23);
-    }
-  }
-
-  &__root-label {
-    font-weight: bold;
-    margin-right: 10px;
-    white-space: nowrap;
-    margin-top: 20px;
-  }
-
-  &__horizontal-line {
-    width: 30px;
-    height: 2px;
-    background-color:  var(--tooltip-bg-color);
-    margin-top: 33px;
-  }
-
-  &__vertical-line-wrapper {
-    display: flex;
-    flex-direction: column;
-    position: relative;
-  }
-
-  &__vertical-line {
-    position: absolute;
-    top: 20px;
-    height: calc(40px * var(--child-count) - 40px);
-    width: 2px;
-    background-color:  var(--tooltip-bg-color);
-  }
-
-  &__child {
-    display: flex;
-    align-items: center;
-    height: 40px;
-    position: relative;
-  }
-
-  &__child-connector {
-    width: 30px;
-    height: 2px;
-    background-color:  var(--tooltip-bg-color);
-    flex-shrink: 0;
-  }
-
-  &__child-label {
-    margin-left: 10px;
-    white-space: nowrap;
-  }
-}