@payloadcms/ui 3.86.0-internal.ac46214 → 4.0.0-internal.1f9ae9a

package/dist/views/CollectionFolder/index.scss

@@ -1,162 +0,0 @@
-@import '../../scss/styles.scss';
-
-@layer payload-default {
-  .collection-folder-list {
-    width: 100%;
-
-    &__step-nav-icon-label,
-    &__step-nav-icon-label .btn__label {
-      margin: 0;
-      display: flex;
-      align-items: center;
-      gap: calc(var(--base) * 0.25);
-
-      .icon {
-        height: 18px;
-      }
-    }
-
-    &__step-nav-droppable.droppable-button {
-      &--hover {
-        opacity: 0.3;
-      }
-    }
-
-    &__wrap {
-      padding-bottom: var(--spacing-view-bottom);
-
-      & > *:not(:last-child) {
-        margin-bottom: var(--base);
-      }
-    }
-
-    .cell-with-icon {
-      display: flex;
-      align-items: center;
-      gap: calc(var(--base) * 0.5);
-    }
-
-    .list-header {
-      a {
-        text-decoration: none;
-      }
-    }
-
-    &__sub-header {
-      flex-basis: 100%;
-    }
-
-    .table {
-      table {
-        width: 100%;
-        overflow: auto;
-
-        [class^='cell'] > p,
-        [class^='cell'] > span,
-        [class^='cell'] > a {
-          line-clamp: 4;
-          -webkit-box-orient: vertical;
-          -webkit-line-clamp: 4;
-          overflow: hidden;
-          display: -webkit-box;
-          max-width: 100vw;
-        }
-      }
-    }
-
-    &__no-results {
-      display: flex;
-      flex-direction: column;
-      align-items: flex-start;
-      gap: var(--base);
-
-      & > * {
-        margin: 0;
-      }
-    }
-
-    &__page-controls {
-      width: 100%;
-      display: flex;
-      align-items: center;
-    }
-
-    .paginator {
-      margin-bottom: 0;
-    }
-
-    &__page-info {
-      [dir='ltr'] & {
-        margin-right: base(1);
-        margin-left: auto;
-      }
-      [dir='rtl'] & {
-        margin-left: base(1);
-        margin-right: auto;
-      }
-    }
-
-    &__shimmer {
-      margin-top: base(1.75);
-      width: 100%;
-      > div {
-        margin-top: 8px;
-      }
-    }
-
-    @include mid-break {
-      margin-top: base(0.25);
-
-      &__wrap {
-        padding-top: 0;
-        padding-bottom: 0;
-      }
-
-      &__header {
-        gap: base(0.5);
-      }
-
-      &__sub-header {
-        margin-top: 0;
-      }
-
-      &__search-input {
-        margin: 0;
-      }
-
-      // on mobile, extend the table all the way to the viewport edges
-      // this is to visually indicate overflowing content
-      .table {
-        display: flex;
-        width: calc(100% + calc(var(--gutter-h) * 2));
-        max-width: unset;
-        left: calc(var(--gutter-h) * -1);
-        position: relative;
-        padding-left: var(--gutter-h);
-
-        &::after {
-          content: '';
-          height: 1px;
-          padding-right: var(--gutter-h);
-        }
-      }
-
-      &__page-controls {
-        flex-wrap: wrap;
-      }
-
-      &__page-info {
-        margin-left: 0;
-      }
-
-      .paginator {
-        width: 100%;
-        margin-bottom: $baseline;
-      }
-    }
-
-    @include small-break {
-      margin-bottom: base(2.4);
-    }
-  }
-}

package/dist/views/Edit/Auth/index.scss

@@ -1,104 +0,0 @@
-@import '../../../scss/styles.scss';
-
-@layer payload-default {
-  .auth-fields {
-    padding: calc(var(--base) * 2);
-    background: var(--theme-elevation-50);
-    display: flex;
-    flex-direction: column;
-    gap: var(--base);
-
-    &__controls {
-      display: flex;
-      align-items: center;
-      gap: calc(var(--base) / 2);
-      flex-wrap: wrap;
-    }
-
-    &__changing-password {
-      display: flex;
-      flex-direction: column;
-      gap: var(--base);
-    }
-
-    .btn {
-      margin: 0;
-    }
-
-    &__api-key-label {
-      position: relative;
-    }
-
-    @include mid-break {
-      padding: var(--base);
-      gap: calc(var(--base) / 2);
-
-      &__changing-password {
-        gap: calc(var(--base) / 2);
-      }
-    }
-
-    .field-type.api-key {
-      margin-bottom: var(--base);
-
-      input {
-        @include formInput;
-        width: 100%;
-        border-top-right-radius: 0;
-        border-bottom-right-radius: 0;
-      }
-    }
-
-    .api-key {
-      &__input-wrap {
-        display: flex;
-        align-items: center;
-      }
-
-      &__toggle-button-wrap {
-        display: flex;
-        align-self: stretch;
-      }
-
-      &__toggle-button {
-        @include formInput;
-        background: var(--theme-elevation-100);
-        border-top-left-radius: 0;
-        border-bottom-left-radius: 0;
-        margin: 0 0 0 -1px;
-        padding: 0 calc(var(--base) / 2);
-        box-shadow: none;
-        --btn-icon-size: var(--base);
-      }
-    }
-  }
-
-  @keyframes highlight {
-    0% {
-      background: var(--theme-success-250);
-      border: 1px solid var(--theme-success-500);
-    }
-
-    20% {
-      background: var(--theme-input-bg);
-      border: 1px solid var(--theme-elevation-250);
-      color: var(--theme-text);
-    }
-
-    80% {
-      background: var(--theme-input-bg);
-      border: 1px solid var(--theme-elevation-250);
-      color: var(--theme-text);
-    }
-
-    100% {
-      background: var(--theme-elevation-200);
-      border: 1px solid transparent;
-      color: var(--theme-elevation-400);
-    }
-  }
-
-  .highlight {
-    animation: highlight 10s;
-  }
-}

package/dist/views/List/GroupByHeader/index.scss

@@ -1,17 +0,0 @@
-@import '../../../scss/styles.scss';
-
-@layer payload-default {
-  .group-by-header {
-    display: flex;
-    gap: var(--base);
-
-    &__heading {
-      margin: 0;
-      flex-grow: 1;
-    }
-
-    .list-selection__actions button {
-      margin: 0;
-    }
-  }
-}

package/dist/views/List/ListHeader/index.scss

@@ -1,63 +0,0 @@
-@import '../../../scss/styles.scss';
-
-@layer payload-default {
-  .list-drawer {
-    .list-header__title {
-      @extend %h2;
-    }
-
-    &__header {
-      margin-top: base(2.5);
-      width: 100%;
-
-      @include mid-break {
-        margin-top: base(1.5);
-      }
-    }
-
-    .doc-drawer__toggler.list-header__create-new-button {
-      background: transparent;
-      border: 0;
-      padding: 0;
-      cursor: pointer;
-      color: inherit;
-      border-radius: var(--style-radius-s);
-
-      &:hover .pill {
-        background: var(--theme-elevation-250);
-      }
-
-      &:focus:not(:focus-visible),
-      &:focus-within:not(:focus-visible) {
-        outline: none;
-      }
-
-      &:focus-visible {
-        outline: var(--accessibility-outline);
-        outline-offset: var(--accessibility-outline-offset);
-      }
-
-      &:disabled {
-        pointer-events: none;
-      }
-
-      .pill {
-        cursor: inherit;
-      }
-    }
-
-    &__select-collection-wrap {
-      margin-top: base(1);
-    }
-
-    @include mid-break {
-      .collection-list__header {
-        margin-bottom: base(0.5);
-      }
-
-      &__select-collection-wrap {
-        margin-top: calc(var(--base) / 2);
-      }
-    }
-  }
-}

package/dist/views/List/index.scss

@@ -1,145 +0,0 @@
-@import '../../scss/styles.scss';
-
-@layer payload-default {
-  .collection-list {
-    width: 100%;
-
-    &__wrap {
-      padding-bottom: var(--spacing-view-bottom);
-
-      & > *:not(:last-child) {
-        margin-bottom: var(--base);
-      }
-    }
-
-    .list-header {
-      a {
-        text-decoration: none;
-      }
-    }
-
-    &__sub-header {
-      flex-basis: 100%;
-      padding-top: calc(var(--base) * 0.75);
-    }
-
-    &__tables {
-      .table-wrap:not(:last-child) {
-        margin-bottom: calc(var(--base) * 2);
-      }
-
-      .table-wrap--group-by:first-child {
-        margin-top: calc(var(--base) * 2);
-      }
-    }
-
-    .table {
-      table {
-        width: 100%;
-        overflow: auto;
-
-        [class^='cell'] > p,
-        [class^='cell'] > span,
-        [class^='cell'] > a {
-          line-clamp: 4;
-          -webkit-box-orient: vertical;
-          -webkit-line-clamp: 4;
-          overflow: hidden;
-          display: -webkit-box;
-          max-width: 100vw;
-        }
-
-        #heading-_select,
-        .cell-_select {
-          min-width: unset;
-        }
-
-        #heading-_dragHandle,
-        .cell-_dragHandle {
-          width: 20px;
-          min-width: 0;
-        }
-      }
-    }
-
-    &__list-selection {
-      position: fixed;
-      bottom: 0;
-      z-index: 10;
-      padding: base(0.8) 0;
-      width: 100%;
-      background-color: var(--theme-bg);
-
-      .btn {
-        margin: 0 0 0 base(0.4);
-      }
-
-      .btn {
-        background-color: var(--theme-elevation-100);
-        cursor: pointer;
-        padding: 0 base(0.4);
-        border-radius: $style-radius-s;
-
-        &:hover {
-          background-color: var(--theme-elevation-200);
-        }
-      }
-    }
-
-    &__list-selection-actions {
-      display: flex;
-      gap: base(0.25);
-    }
-
-    &__shimmer {
-      margin-top: base(1.75);
-      width: 100%;
-      > div {
-        margin-top: 8px;
-      }
-    }
-
-    @include mid-break {
-      margin-top: base(0.25);
-
-      &__wrap {
-        padding-top: 0;
-        padding-bottom: 0;
-      }
-
-      &__header {
-        gap: base(0.5);
-      }
-
-      &__sub-header {
-        margin-top: 0;
-      }
-
-      &__search-input {
-        margin: 0;
-      }
-
-      // on mobile, extend the table all the way to the viewport edges
-      // this is to visually indicate overflowing content
-      .table {
-        display: flex;
-        flex-direction: column;
-        width: calc(100% + calc(var(--gutter-h) * 2));
-        max-width: unset;
-        left: calc(var(--gutter-h) * -1);
-        position: relative;
-        padding-left: var(--gutter-h);
-
-        &::after {
-          content: '';
-          height: 1px;
-          padding-right: var(--gutter-h);
-        }
-      }
-    }
-
-    @include small-break {
-      margin-bottom: base(4);
-    }
-  }
-}

package/dist/widgets/CollectionCards/index.scss

@@ -1,70 +0,0 @@
-@import '../../scss/styles';
-
-@layer payload-default {
-  .collections {
-    display: flex;
-    width: 100%;
-    --gap: var(--base);
-    --cols: 5;
-
-    &__wrap {
-      width: 100%;
-      display: flex;
-      flex-direction: column;
-      gap: var(--base);
-    }
-
-    &__group {
-      display: flex;
-      flex-direction: column;
-      gap: var(--gap);
-    }
-
-    &__label {
-      margin: 0;
-    }
-
-    &__card-list {
-      padding: 0;
-      margin: 0;
-      list-style: none;
-      gap: 12px;
-      display: grid;
-      grid-template-columns: repeat(var(--cols), 1fr);
-
-      .card {
-        height: 100%;
-      }
-    }
-
-    &__locked.locked {
-      align-items: unset;
-      justify-content: unset;
-    }
-
-    @include large-break {
-      --cols: 4;
-    }
-
-    @include mid-break {
-      --gap: var(--base);
-      --cols: 2;
-    }
-
-    @include small-break {
-      --cols: 2;
-
-      &__wrap {
-        gap: var(--base);
-      }
-
-      &__card-list {
-        gap: base(0.4);
-      }
-    }
-
-    @include extra-small-break {
-      --cols: 1;
-    }
-  }
-}