@syncfusion/ej2-angular-inplace-editor 20.3.56 → 20.4.38-ngcc

package/styles/inplace-editor/_layout.scss

@@ -1,658 +0,0 @@
-@include export-module('inplaceeditor-layout') {
-
-  /*! inplaceeditor layout */
-
-  .e-bigger .e-inplaceeditor,
-  .e-inplaceeditor.e-bigger {
-
-    .e-editable-value-wrapper {
-      padding: $editor-big-value-container-padding;
-
-      .e-editable-value {
-        font-size: $editor-big-value-text-font-size;
-        margin: $editor-big-value-margin;
-      }
-
-      .e-editable-overlay-icon {
-        right: $editor-big-overlay-icon-left-right;
-        width: $editor-big-overlay-icon-container-size;
-
-        &::before {
-          font-size: $editor-big-overlay-icon-size;
-        }
-      }
-
-      .e-spinner-pane .e-spinner-inner {
-        right: $editor-big-value-container-spin-padding;
-      }
-    }
-
-    .e-editable-value-container {
-      padding: $editor-big-value-container-padding;
-
-      .e-editable-value {
-        font-size: $editor-big-value-text-font-size;
-        margin: $editor-big-value-margin;
-      }
-
-      .e-editable-overlay-icon {
-        right: $editor-big-overlay-icon-left-right;
-        width: $editor-big-overlay-icon-container-size;
-
-        &::before {
-          font-size: $editor-big-overlay-icon-size;
-        }
-      }
-
-      .e-spinner-pane .e-spinner-inner {
-        right: $editor-big-value-container-spin-padding;
-      }
-    }
-
-    .e-editable-action-buttons {
-
-      .e-btn-save {
-        margin: $editor-big-btn-save-margin;
-      }
-
-      .e-btn-cancel {
-        margin: $editor-big-btn-cancel-margin;
-      }
-    }
-
-    &.e-rtl {
-
-      .e-editable-value-wrapper {
-
-        .e-editable-value {
-          margin: $editor-rtl-big-value-margin;
-        }
-
-        .e-editable-overlay-icon {
-          left: $editor-big-overlay-icon-left-right;
-          right: auto;
-        }
-
-        .e-spinner-pane,
-        .e-spinner-pane .e-spinner-inner {
-          left: $editor-big-value-container-spin-padding;
-        }
-      }
-
-      .e-editable-value-container {
-
-        .e-editable-value {
-          margin: $editor-rtl-big-value-margin;
-        }
-
-        .e-editable-overlay-icon {
-          left: $editor-big-overlay-icon-left-right;
-          right: auto;
-        }
-
-        .e-spinner-pane,
-        .e-spinner-pane .e-spinner-inner {
-          left: $editor-big-value-container-spin-padding;
-        }
-      }
-
-      .e-editable-action-buttons {
-
-        .e-btn-save {
-          margin: $editor-rtl-big-btn-save-margin;
-        }
-
-        .e-btn-cancel {
-          margin: $editor-rtl-big-btn-cancel-margin;
-        }
-      }
-    }
-  }
-
-  .e-inplaceeditor {
-    display: inline-block;
-    position: relative;
-    width: auto;
-
-    .e-input-group.e-numeric.e-control-wrapper .e-clear-icon.e-clear-icon-hide {
-      display: block;
-      visibility: hidden;
-    }
-
-    .e-input-group.e-numeric.e-control-container .e-clear-icon.e-clear-icon-hide {
-      display: block;
-      visibility: hidden;
-    }
-
-    .e-editable-value-wrapper {
-      display: inline-block;
-      padding: $editor-nrml-value-container-padding;
-      position: relative;
-      width: auto;
-      word-break: break-word;
-
-      .e-editable-value {
-        display: inline-block;
-        font-family: $font-family;
-        font-size: $editor-nrml-value-text-font-size;
-        margin: $editor-nrml-value-margin;
-
-        @if $inplace-skin == 'bootstrap4' {
-          line-height: 24px;
-        }
-      }
-
-      .e-editable-overlay-icon {
-        bottom: 0;
-        cursor: pointer;
-        display: inline-flex;
-        height: $editable-overlay-icon-height;
-        position: absolute;
-        right: $editor-nrml-overlay-icon-left-right;
-        top: $editable-overlay-icon;
-        visibility: hidden;
-        width: $editor-nrml-overlay-icon-container-size;
-
-        &::before {
-          align-items: center;
-          display: flex;
-          font-size: $editor-nrml-overlay-icon-size;
-        }
-      }
-
-      &.e-hide {
-        display: none;
-      }
-
-      &.e-editable-open {
-        user-select: none;
-      }
-
-      &.e-loading {
-        pointer-events: none;
-      }
-
-      .e-spinner-pane .e-spinner-inner {
-        left: unset;
-        right: $editor-nrml-value-container-spin-padding;
-      }
-
-      &:hover {
-
-        .e-editable-overlay-icon {
-          visibility: visible;
-        }
-
-        &.e-editable-open {
-
-          .e-editable-overlay-icon {
-            visibility: hidden;
-          }
-        }
-      }
-    }
-
-    .e-editable-value-container {
-      display: inline-block;
-      padding: $editor-nrml-value-container-padding;
-      position: relative;
-      width: auto;
-      word-break: break-word;
-
-      .e-editable-value {
-        display: inline-block;
-        font-family: $font-family;
-        font-size: $editor-nrml-value-text-font-size;
-        margin: $editor-nrml-value-margin;
-
-        @if $inplace-skin == 'bootstrap4' {
-          line-height: 24px;
-        }
-      }
-
-      .e-editable-overlay-icon {
-        bottom: 0;
-        cursor: pointer;
-        display: inline-flex;
-        height: inherit;
-        position: absolute;
-        right: $editor-nrml-overlay-icon-left-right;
-        top: 0;
-        visibility: hidden;
-        width: $editor-nrml-overlay-icon-container-size;
-
-        &::before {
-          align-items: center;
-          display: flex;
-          font-size: $editor-nrml-overlay-icon-size;
-        }
-      }
-
-      &.e-hide {
-        display: none;
-      }
-
-      &.e-editable-open {
-        user-select: none;
-      }
-
-      &.e-loading {
-        pointer-events: none;
-      }
-
-      .e-spinner-pane .e-spinner-inner {
-        left: unset;
-        right: $editor-nrml-value-container-spin-padding;
-      }
-
-      &:hover {
-
-        .e-editable-overlay-icon {
-          visibility: visible;
-        }
-
-        &.e-editable-open {
-
-          .e-editable-overlay-icon {
-            visibility: hidden;
-          }
-        }
-      }
-    }
-
-    .e-editable-action-buttons {
-      margin-top: $editor-buttons-top-margin;
-      position: absolute;
-      right: 0;
-      z-index: 100;
-    }
-
-    &.e-overlay {
-      user-select: none;
-    }
-
-    &.e-rtl {
-
-      .e-editable-value-wrapper {
-
-        .e-editable-value {
-          margin: $editor-rtl-nrml-value-margin;
-        }
-
-        .e-editable-overlay-icon {
-          left: $editor-nrml-overlay-icon-left-right;
-          right: auto;
-        }
-
-        .e-spinner-pane {
-          right: unset;
-        }
-
-        .e-spinner-pane,
-        .e-spinner-pane .e-spinner-inner {
-          left: $editor-nrml-value-container-spin-padding;
-        }
-      }
-
-      .e-editable-value-container {
-
-        .e-editable-value {
-          margin: $editor-rtl-nrml-value-margin;
-        }
-
-        .e-editable-overlay-icon {
-          left: $editor-nrml-overlay-icon-left-right;
-          right: auto;
-        }
-
-        .e-spinner-pane {
-          right: unset;
-        }
-
-        .e-spinner-pane,
-        .e-spinner-pane .e-spinner-inner {
-          left: $editor-nrml-value-container-spin-padding;
-        }
-      }
-
-      .e-editable-action-buttons {
-        left: 0;
-        right: auto;
-      }
-    }
-  }
-
-  .e-bigger .e-inplaceeditor,
-  .e-inplaceeditor.e-bigger,
-  .e-bigger .e-inplaceeditor-tip,
-  .e-inplaceeditor-tip.e-bigger {
-    width: auto;
-
-    .e-input-group + .e-editable-loading {
-
-      @if $inplace-skin == 'material' {
-        .e-spinner-inner {
-          top: 45%;
-        }
-      }
-    }
-
-    .e-editable-action-buttons {
-
-      .e-btn-save,
-      .e-btn-cancel {
-
-        .e-btn-icon.e-icons {
-
-          @if $inplace-skin == 'bootstrap4' {
-            font-size: 16px;
-          }
-        }
-      }
-    }
-  }
-
-  .e-inplaceeditor,
-  .e-inplaceeditor-tip {
-
-    .e-input-group + .e-editable-loading {
-
-      @if $inplace-skin == 'material' {
-        .e-spinner-inner {
-          top: 35%;
-        }
-      }
-    }
-
-    .e-editable-elements:not(.e-richtexteditor) + .e-editable-loading {
-
-      .e-spinner-pane .e-spinner-inner .e-spin-bootstrap4 .e-path-circle {
-        stroke-width: inherit;
-      }
-    }
-
-    .e-input-group + .e-editable-loading {
-
-      @if $inplace-skin == 'material' {
-        .e-spinner-inner {
-          top: 35%;
-        }
-      }
-    }
-
-    .e-editable-elements:not(.e-richtexteditor) + .e-editable-loading {
-
-      .e-spinner-pane .e-spinner-inner .e-spin-bootstrap4 .e-path-circle {
-        stroke-width: inherit;
-      }
-    }
-
-    .e-editable-loading {
-      display: none;
-      min-height: 100%;
-      position: absolute;
-      top: 0;
-
-      &.e-show {
-        display: block;
-
-        &:not(.e-rte-spin-wrap) .e-spinner-inner {
-          left: auto;
-          right: 5px;
-          transform: translateX(-30%) translateY(-50%);
-        }
-      }
-    }
-
-    .e-editable-form {
-      width: 100%;
-
-      &.e-loading {
-
-        .e-input-group-icon {
-          visibility: hidden;
-        }
-      }
-    }
-
-    .e-component-group {
-      margin-bottom: $editor-component-bottom-margin;
-
-      .e-editable-component {
-        min-width: 150px;
-        position: relative;
-      }
-    }
-
-    .e-control-overlay {
-      visibility: hidden;
-
-      &.e-richtexteditor {
-        opacity: .5;
-        pointer-events: none;
-        user-select: none;
-        visibility: visible;
-      }
-    }
-
-    .e-editable-action-buttons {
-
-      .e-btn-save {
-        margin: $editor-nrml-btn-save-margin;
-
-        .e-btn-icon.e-icons {
-          font-size: $editor-btn-save-icon-size;
-        }
-      }
-
-      .e-btn-cancel {
-        margin: $editor-nrml-btn-cancel-margin;
-
-        .e-btn-icon.e-icons {
-          font-size: $editor-btn-cancel-icon-size;
-        }
-      }
-
-      &.e-hide {
-        visibility: hidden;
-      }
-    }
-
-    &.e-rtl {
-
-      .e-editable-action-buttons {
-
-        .e-btn-save {
-          margin: $editor-rtl-nrml-btn-save-margin;
-        }
-
-        .e-btn-cancel {
-          margin: $editor-rtl-nrml-btn-cancel-margin;
-        }
-      }
-
-      .e-editable-loading.e-show:not(.e-rte-spin-wrap) .e-spinner-inner {
-        left: 5px;
-        right: auto;
-        transform: translateX(30%) translateY(-50%);
-      }
-    }
-  }
-
-  .e-bigger .e-inplaceeditor-tip,
-  .e-inplaceeditor-tip.e-bigger {
-
-    &.e-tooltip-wrap {
-
-      .e-tip-content {
-        @if $inplace-skin == 'tailwind' or $inplace-skin == 'bootstrap5' $inplace-skin == 'FluentUI' {
-          padding: 0;
-        }
-
-        .e-editable-wrapper {
-          padding: $editor-big-tip-wrapper-padding;
-        }
-
-        .e-editable-container {
-          padding: $editor-big-tip-wrapper-padding;
-        }
-
-        .e-editable-title + .e-editable-wrapper {
-          padding: $editor-big-wrapper-title-with-padding;
-        }
-
-        .e-editable-title + .e-editable-container {
-          padding: $editor-big-wrapper-title-with-padding;
-        }
-      }
-    }
-
-    .e-editable-title {
-      font-size: $editor-big-tip-title-font-size;
-      min-height: $editor-big-tip-title-container-size;
-      padding: $editor-big-tip-title-padding;
-    }
-
-    &.e-rtl {
-
-      &.e-tooltip-wrap .e-tip-content {
-
-        .e-editable-title {
-          padding: $editor-rtl-big-tip-title-padding;
-        }
-      }
-    }
-  }
-
-  .e-inplaceeditor-tip {
-    opacity: 1;
-    width: auto;
-
-    &.e-tooltip-wrap {
-      max-width: 100%;
-
-      .e-input-group.e-numeric.e-control-wrapper .e-clear-icon.e-clear-icon-hide,
-      .e-input-group.e-numeric.e-control-container .e-clear-icon.e-clear-icon-hide {
-        display: block;
-        visibility: hidden;
-      }
-
-      .e-tip-content {
-        padding: 0;
-
-        .e-editable-title {
-          align-content: center;
-          display: flex;
-          flex-direction: column;
-          font-family: $font-family;
-          font-size: $editor-nrml-tip-title-font-size;
-          font-weight: $editor-tip-title-font-weight;
-          height: $editor-nrml-tip-title-container-size;
-          justify-content: center;
-          padding: $editor-nrml-tip-title-padding;
-        }
-
-        .e-editable-wrapper {
-          display: flex;
-          padding: $editor-nrml-tip-wrapper-padding;
-
-          .e-editable-action-buttons {
-            float: right;
-            margin-top: $editor-buttons-top-margin;
-            position: relative;
-            right: auto;
-            top: auto;
-          }
-        }
-
-        .e-editable-container {
-          display: flex;
-          padding: $editor-nrml-tip-wrapper-padding;
-
-          .e-editable-action-buttons {
-            float: right;
-            margin-top: $editor-buttons-top-margin;
-            position: relative;
-            right: auto;
-            top: auto;
-          }
-        }
-
-        .e-editable-title + .e-editable-wrapper {
-          padding: $editor-nrml-wrapper-title-with-padding;
-        }
-
-        .e-editable-title + .e-editable-container {
-          padding: $editor-nrml-wrapper-title-with-padding;
-        }
-      }
-    }
-
-    &.e-hide {
-      visibility: hidden;
-    }
-
-    &.e-rtl {
-
-      &.e-tooltip-wrap .e-tip-content {
-
-        .e-editable-title {
-          padding: $editor-rtl-nrml-tip-title-padding;
-        }
-
-        .e-editable-wrapper {
-
-          .e-editable-action-buttons {
-            float: left;
-          }
-        }
-
-        .e-editable-container {
-
-          .e-editable-action-buttons {
-            float: left;
-          }
-        }
-      }
-    }
-  }
-
-  .e-content-placeholder.e-inplaceeditor.e-placeholder-inplaceeditor {
-    background-size: 150px 60px;
-    min-height: 60px;
-  }
-
-  .e-bigger .e-content-placeholder.e-inplaceeditor.e-placeholder-inplaceeditor,
-  .e-bigger.e-content-placeholder.e-inplaceeditor.e-placeholder-inplaceeditor {
-    background-size: 150px 70px;
-    min-height: 70px;
-  }
-
-  @if $inplace-skin == 'tailwind' or $inplace-skin == 'bootstrap5' {
-    .e-control .e-inplaceeditor,
-    .e-tooltip-wrap.e-popup.e-inplaceeditor-tip.e-popup-open,
-    .e-inplaceeditor .e-input-group.e-control-wrapper.e-editable-elements {
-      border-radius: 4px;
-    }
-  }
-
-  @if $inplace-skin == 'tailwind' or $inplace-skin == 'bootstrap5' {
-    .e-control.e-inplaceeditor .e-editable-value-wrapper {
-      min-height: 30px;
-    }
-
-    .e-bigger .e-inplaceeditor .e-editable-value-wrapper,
-    .e-inplaceeditor.e-bigger .e-editable-value-wrapper {
-      min-height: 38px;
-    }
-
-    .e-bigger .e-inplaceeditor-tip.e-tooltip-wrap.e-popup .e-editable-title,
-    .e-bigger.e-inplaceeditor-tip.e-tooltip-wrap.e-popup .e-editable-title {
-      font-size: $editor-big-tip-title-font-size;
-    }
-
-    .e-bigger .e-inplaceeditor .e-editable-action-buttons .e-btn-icon.e-icons .e-bigger.e-inplaceeditor .e-editable-action-buttons .e-btn-icon.e-icons {
-      font-size: 22px;
-    }
-  }
-}

package/styles/inplace-editor/_material-dark-definition.scss

@@ -1,76 +0,0 @@
-/*! Material dark theme definitions and variables */
-
-/*! Value element styles */
-$inplace-skin: 'material-dark' !default;
-$editor-big-value-text-font-size: 14px !default;
-$editor-nrml-value-text-font-size: 13px !default;
-$editor-big-value-container-padding: 8px !default;
-$editor-nrml-value-container-padding: 6px 8px !default;
-$editor-big-value-container-spin-padding: 8px !default;
-$editor-nrml-value-container-spin-padding: 8px !default;
-$editor-big-value-margin: 0 30px 0 0 !default;
-$editor-nrml-value-margin: 0 28px 0 0 !default;
-$editor-rtl-big-value-margin: 0 0 0 30px !default;
-$editor-rtl-nrml-value-margin: 0 0 0 28px !default;
-$editor-big-overlay-icon-size: 16px !default;
-$editor-nrml-overlay-icon-size: 14px !default;
-$editor-big-overlay-icon-container-size: 20px !default;
-$editor-nrml-overlay-icon-container-size: 18px !default;
-$editor-big-overlay-icon-left-right: 8px !default;
-$editor-nrml-overlay-icon-left-right: 8px !default;
-$editor-value-hover-bg: $grey-700 !default;
-$editor-value-text-color: $grey-dark-font !default;
-$editor-overlay-icon-color: $grey-dark-font !default;
-$editor-value-text-border: 1px dashed $editor-value-text-color !default;
-$editable-overlay-icon-height: inherit !default;
-$editable-overlay-icon: 0 !default;
-
-/*! Tooltip styles */
-$editor-tip-border: 0 !default;
-$editor-tip-bg: $grey-800 !default;
-$editor-tip-arrow-icon-color: $grey-800 !default;
-$editor-tip-title-arrow-icon-color: $grey-600 !default;
-$editor-tip-arrow-bdr-color: $grey-800 !default;
-$editor-tip-title-arrow-bdr-color: $grey-600 !default;
-$editor-tip-box-shadow: none !default;
-
-/*! Tip Content styles */
-$editor-tip-content-bdr-radius: 2px !default;
-$editor-popup-tip-content-bdr-radius: 2px !default;
-
-/*! Title styles */
-$editor-tip-title-font-weight: 500 !default;
-$editor-big-tip-title-font-size: 14px !default;
-$editor-nrml-tip-title-font-size: 13px !default;
-$editor-big-tip-title-padding: 0 0 0 12px !default;
-$editor-nrml-tip-title-padding: 0 0 0 10px !default;
-$editor-rtl-big-tip-title-padding: 0 12px 0 0 !default;
-$editor-rtl-nrml-tip-title-padding: 0 10px 0 0 !default;
-$editor-big-tip-title-container-size: 36px !default;
-$editor-nrml-tip-title-container-size: 30px !default;
-$editor-tip-title-bg: $grey-600 !default;
-$editor-tio-title-border-bottom: 0 !default;
-$editor-tip-title-color: $grey-dark-font !default;
-
-/*! Wrapper styles */
-$editor-big-tip-wrapper-padding: 16px !default;
-$editor-nrml-tip-wrapper-padding: 16px !default;
-$editor-big-wrapper-title-with-padding: 10px 16px 16px 16px !default;
-$editor-nrml-wrapper-title-with-padding: 10px 16px 16px 16px !default;
-
-/*! Component group styles */
-$editor-component-bottom-margin: 4px !default;
-
-/*! Button styles */
-$editor-buttons-top-margin: 4px !default;
-$editor-btn-save-icon-size: 16px !default;
-$editor-btn-cancel-icon-size: 16px !default;
-$editor-big-btn-save-margin: 0 4px 0 0 !default;
-$editor-nrml-btn-save-margin: 0 4px 0 0 !default;
-$editor-big-btn-cancel-margin: 0 0 0 4px !default;
-$editor-nrml-btn-cancel-margin: 0 0 0 4px !default;
-$editor-rtl-big-btn-save-margin: 0 0 0 4px !default;
-$editor-rtl-nrml-btn-save-margin: 0 0 0 4px !default;
-$editor-rtl-big-btn-cancel-margin: 0 4px 0 0 !default;
-$editor-rtl-nrml-btn-cancel-margin: 0 4px 0 0 !default;
-$editor-btn-icon-color: $grey-dark-font !default;