@cayuse-test/react 1.0.0

package/dist/styles-T5QJAAUY.css

@@ -0,0 +1,184 @@
+.cayuse-toggle,
+.cayuse-toggle * {
+  box-sizing: border-box;
+}
+
+.cayuse-toggle {
+  display: flex;
+  cursor: pointer;
+}
+
+.cayuse-toggle[data-loading='true'] {
+  cursor: wait;
+}
+.cayuse-toggle[data-loading='true']
+  .cayuse-toggle__input
+  ~ .cayuse-toggle__state
+  > .cayuse-toggle__container {
+  opacity: 0.65;
+}
+
+.cayuse-toggle .cayuse-toggle__input {
+  -webkit-appearance: none;
+     -moz-appearance: none;
+          appearance: none;
+  opacity: 0;
+}
+
+.cayuse-toggle .cayuse-toggle__input ~ .cayuse-toggle__state {
+  display: flex;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+          user-select: none;
+}
+
+.cayuse-toggle
+  .cayuse-toggle__input
+  ~ .cayuse-toggle__state
+  > .cayuse-toggle__container {
+  position: relative;
+  display: inline-block;
+  width: 48px;
+  height: 24px;
+  padding: 2px;
+  border-radius: 12px;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+          user-select: none;
+  background-color: #5e5e5e;
+  opacity: 1;
+  transition:
+    background-color 250ms ease,
+    opacity 250ms ease;
+}
+
+.cayuse-toggle
+  .cayuse-toggle__input:checked
+  ~ .cayuse-toggle__state
+  > .cayuse-toggle__container {
+  background-color: var(--color-cayuse-blue, #0076b6);
+}
+
+.cayuse-toggle
+  .cayuse-toggle__input:focus-visible
+  ~ .cayuse-toggle__state
+  > .cayuse-toggle__container {
+  outline: 2px solid var(--color-focus);
+  outline-offset: 2px;
+}
+
+.cayuse-toggle
+  .cayuse-toggle__input
+  ~ .cayuse-toggle__state
+  > .cayuse-toggle__container
+  > .cayuse-toggle__position {
+  position: relative;
+  display: inline-block;
+  width: 20px;
+  height: 20px;
+  background-color: #ffffff;
+  border-radius: 50%;
+  transition: transform 250ms ease;
+}
+
+.cayuse-toggle
+  .cayuse-toggle__input:checked
+  ~ .cayuse-toggle__state
+  > .cayuse-toggle__container
+  > .cayuse-toggle__position {
+  transform: translateX(calc(100% + 4px));
+}
+
+.cayuse-toggle
+  .cayuse-toggle__input
+  ~ .cayuse-toggle__state
+  > .cayuse-toggle__container
+  > .cayuse-toggle__position
+  > .cayuse-toggle__position__on,
+.cayuse-toggle
+  .cayuse-toggle__input
+  ~ .cayuse-toggle__state
+  > .cayuse-toggle__container
+  > .cayuse-toggle__position
+  > .cayuse-toggle__position__off {
+  position: absolute;
+  top: 0;
+  left: 0;
+}
+
+.cayuse-toggle
+  .cayuse-toggle__input:checked
+  ~ .cayuse-toggle__state
+  > .cayuse-toggle__container
+  > .cayuse-toggle__position
+  > .cayuse-toggle__position__on {
+  display: block;
+  transform: translate(calc(50% - 4px), calc(50% - 0px));
+}
+
+.cayuse-toggle
+  .cayuse-toggle__input:not(:checked)
+  ~ .cayuse-toggle__state
+  > .cayuse-toggle__container
+  > .cayuse-toggle__position
+  > .cayuse-toggle__position__on {
+  display: none;
+}
+
+.cayuse-toggle
+  .cayuse-toggle__input:checked
+  ~ .cayuse-toggle__state
+  > .cayuse-toggle__container
+  > .cayuse-toggle__position
+  > .cayuse-toggle__position__off {
+  display: none;
+}
+
+.cayuse-toggle
+  .cayuse-toggle__input:not(:checked)
+  ~ .cayuse-toggle__state
+  > .cayuse-toggle__container
+  > .cayuse-toggle__position
+  > .cayuse-toggle__position__off {
+  display: block;
+  transform: translate(calc(50% - 1px), calc(50% - 0px));
+}
+
+.cayuse-toggle
+  .cayuse-toggle__input:disabled
+  ~ .cayuse-toggle__state
+  > .cayuse-toggle__container {
+  background-color: var(--color-disabled-text, #adadad);
+}
+.cayuse-toggle
+  .cayuse-toggle__input:disabled
+  ~ .cayuse-toggle__state
+  > .cayuse-toggle__container
+  > .cayuse-toggle__position
+  > .cayuse-toggle__position__on
+  path,
+.cayuse-toggle
+  .cayuse-toggle__input:disabled
+  ~ .cayuse-toggle__state
+  > .cayuse-toggle__container
+  > .cayuse-toggle__position
+  > .cayuse-toggle__position__off
+  path {
+  transition: fill 250ms ease;
+}
+.cayuse-toggle
+  .cayuse-toggle__input:disabled
+  ~ .cayuse-toggle__state
+  > .cayuse-toggle__container
+  > .cayuse-toggle__position
+  > .cayuse-toggle__position__on
+  path,
+.cayuse-toggle
+  .cayuse-toggle__input:disabled
+  ~ .cayuse-toggle__state
+  > .cayuse-toggle__container
+  > .cayuse-toggle__position
+  > .cayuse-toggle__position__off
+  path {
+  fill: var(--color-disabled-text, #adadad);
+}

package/dist/styles-VBXWGFCK.css

@@ -0,0 +1,96 @@
+.ui.table.table-file-list {
+  margin: 0;
+  border-color: #ccc;
+}
+
+.ui.table.table-file-list th.desc:after {
+  content: '\f0d7' !important;
+}
+
+.ui.table.table-file-list th.asc:after {
+  content: '\f0d8' !important;
+}
+
+.ui.table.table-file-list th.desc:after {
+  content: '\f0d7' !important;
+}
+
+.ui.table.table-file-list th.asc:after {
+  content: '\f0d8' !important;
+}
+
+.ui.table.table-file-list th {
+  padding: 12px;
+
+  background-color: #f5f5f5;
+
+  font-size: 14px;
+  font-style: normal;
+  font-weight: 700;
+  line-height: 16px;
+  color: #111;
+}
+
+.ui.table.table-file-list th:first-child,
+.ui.table.table-file-list td:first-child {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.table-file-list__download-link,
+.table-file-list__download-link__preview {
+  display: flex;
+  align-items: center;
+  gap: 5px;
+
+  min-width: 0;
+
+  color: var(--color-cayuse-blue, #0076b6);
+  font-size: 14px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: 16px;
+  text-decoration: underline;
+
+  cursor: pointer;
+}
+
+.table-file-list__download-link:focus-visible {
+  outline: 2px solid #5092f7;
+  outline-offset: 1px;
+}
+
+.table-file-list__download-link__preview {
+  color: #111;
+  cursor: default;
+  text-decoration: none;
+}
+
+.table-file-list__download-link span,
+.table-file-list__download-link__preview span {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.table-file-list__download-link svg,
+.table-file-list__download-link__preview svg {
+  font-size: 16px;
+}
+
+.table-file-list__remove-file-button {
+  all: unset;
+  color: var(--color-cayuse-blue, #0076b6);
+  cursor: pointer;
+  font-size: 16px;
+}
+
+.table-file-list__remove-file-button:focus-visible {
+  outline: 2px solid #5092f7;
+  outline-offset: 1px;
+}
+
+.table-file-list__remove-file-button.disabled {
+  display: none;
+}

package/dist/styles-VE76CGRO.css

@@ -0,0 +1,6 @@
+.divider {
+  height: 1px;
+  width: 100%;
+  background-color: var(--color-dark-grey);
+  border: none;
+}

package/dist/styles-VLCZ7JYV.css

@@ -0,0 +1,140 @@
+.cayuse-date {
+}
+
+.cayuse-date .cayuse-date__input {
+  border: 1px solid var(--color-border-default);
+  border-radius: var(--border-radius-inputs);
+  padding: 11px 11px 11px 38px;
+  min-width: 200px;
+  outline: none;
+  font-size: 14px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: 16px;
+}
+
+.cayuse-date .cayuse-date__input:focus {
+  border-color: var(--color-focus);
+}
+
+.cayuse-date .cayuse-date__icon {
+  padding: 0 11px;
+  top: 50%;
+  transform: translateY(-50%);
+}
+.cayuse-date .cayuse-date__icon.disabled {
+  color: #888c8c;
+}
+
+.cayuse-date .cayuse-date__description {
+  color: #5e5e5e;
+  font-size: 12px;
+  margin-top: 8px;
+}
+
+.cayuse-date.invalid .cayuse-date__description {
+  all: unset;
+  font-weight: 400;
+  font-size: 12px;
+  line-height: 12px;
+  color: var(--color-error, #b31200);
+}
+
+.cayuse-date__label {
+  display: flex;
+  font-weight: 700;
+  font-size: 14px;
+  line-height: 16px;
+  color: #111;
+  margin-bottom: 8px;
+}
+
+.cayuse-date__required {
+  font-weight: 700;
+  font-size: 24px;
+  line-height: 16px;
+  color: var(--color-error, #b31200);
+  margin-right: 2px;
+}
+
+.cayuse-date .react-datepicker {
+  border: none;
+  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08);
+}
+
+.cayuse-date .react-datepicker__current-month {
+  color: var(--color-lightest);
+}
+
+.cayuse-date .react-datepicker__day {
+  line-height: 1.6rem;
+  border: solid 1px transparent;
+  border-radius: 50%;
+}
+
+.cayuse-date .react-datepicker__day:hover {
+  background-color: #1e87f0;
+  border-color: #1e87f0;
+  color: var(--color-lightest);
+}
+
+.cayuse-date .react-datepicker__day--selected,
+.cayuse-date .react-datepicker__day--keyboard-selected {
+  background-color: var(--color-lightest);
+  border-color: #1e87f0;
+  color: var(--color-darkest);
+}
+
+.cayuse-date .react-datepicker__day-name {
+  color: var(--color-lightest);
+}
+
+.cayuse-date .react-datepicker__header {
+  background-color: #1e87f0;
+  border: none;
+}
+
+.cayuse-date .react-datepicker__navigation--next {
+  border-left-color: var(--color-lightest);
+}
+.cayuse-date .react-datepicker__navigation--previous {
+  border-right-color: var(--color-lightest);
+}
+
+.cayuse-date .react-datepicker__triangle {
+  display: none;
+}
+.cayuse-date .react-datepicker-popper {
+  margin: var(--spacing-v-0-5x) 0;
+  z-index: 100;
+}
+
+.cayuse-date .react-datepicker__input-container > input::-moz-placeholder {
+  color: var(--color-dark-grey, #5e5e5e);
+  font-size: 14px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: 16px;
+}
+
+.cayuse-date .react-datepicker__input-container > input::placeholder {
+  color: var(--color-dark-grey, #5e5e5e);
+  font-size: 14px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: 16px;
+}
+
+.cayuse-date .cayuse-date__input:disabled {
+  color: #888c8c;
+  background-color: var(--color-very-light-grey, #f5f5f5);
+}
+
+.dateSelectorInvalid .dateSelectorInput {
+  /*border: 1px #b31200 solid;*/
+  /*background-color: #ffe8e6;*/
+}
+
+.dateSelectorInvalid .description {
+  color: #b31200;
+}

package/dist/styles-W5HDD3YQ.css

@@ -0,0 +1,71 @@
+.react-aria-ModalOverlay {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100vw;
+  height: 100vh;
+  background-color: rgba(0, 0, 0, 0.85);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 1000;
+
+  &[data-entering] {
+    animation: modal-fade 200ms;
+  }
+
+  &[data-exiting] {
+    animation: modal-fade 150ms reverse ease-in;
+  }
+}
+
+.confirmation-modal {
+  color: white;
+  outline: none;
+  width: 100%;
+  max-width: 50%;
+}
+
+.confirmation-modal > .react-aria-Dialog {
+  outline: none;
+  display: flex;
+  flex-direction: column;
+  gap: 21px;
+}
+
+@keyframes modal-fade {
+  from {
+    opacity: 0;
+  }
+
+  to {
+    opacity: 1;
+  }
+}
+
+@keyframes modal-zoom {
+  from {
+    transform: scale(0.8);
+  }
+
+  to {
+    transform: scale(1);
+  }
+}
+
+.confirmation-modal__content {
+  display: flex;
+  gap: 24px;
+}
+
+.confirmation-modal__content svg {
+  width: 42px;
+  height: 42px;
+}
+
+.confirmation-modal__actions {
+  display: flex;
+  gap: 16px;
+  align-items: center;
+  justify-content: flex-end;
+}

package/dist/styles-X7BJCSFV.css

@@ -0,0 +1,86 @@
+.popup {
+  padding: 14px;
+  border: 1px solid var(--color-border-default);
+  box-shadow: 0 8px 20px rgba(0 0 0 / 0.1);
+  border-radius: 6px;
+  background-color: #fff;
+  color: black;
+  outline: none;
+  max-width: 250px;
+  transition:
+    transform 200ms,
+    opacity 200ms;
+}
+
+.react-aria-Dialog {
+  outline: none;
+  display: flex;
+  flex-direction: column;
+}
+
+.popup .react-aria-OverlayArrow svg {
+  display: block;
+  fill: #fff;
+  stroke: var(--color-border-default);
+  stroke-width: 1px;
+}
+
+.popup[data-entering='true'],
+.popup[data-exiting='true'] {
+  transform: var(--origin);
+  opacity: 0;
+}
+
+.popup[data-placement='top'] {
+  --origin: translateY(8px);
+
+  &:has(.react-aria-OverlayArrow) {
+    margin-bottom: 6px;
+  }
+}
+
+.popup[data-placement='bottom'] {
+  --origin: translateY(-8px);
+
+  &:has(.react-aria-OverlayArrow) {
+    margin-top: 6px;
+  }
+
+  .react-aria-OverlayArrow svg {
+    transform: rotate(180deg);
+  }
+}
+
+.popup[data-placement='right'] {
+  --origin: translateX(-8px);
+
+  &:has(.react-aria-OverlayArrow) {
+    margin-left: 6px;
+  }
+
+  .react-aria-OverlayArrow svg {
+    transform: rotate(90deg);
+  }
+}
+
+.popup[data-placement='left'] {
+  --origin: translateX(8px);
+
+  &:has(.react-aria-OverlayArrow) {
+    margin-right: 6px;
+  }
+
+  .react-aria-OverlayArrow svg {
+    transform: rotate(-90deg);
+  }
+}
+
+.popup > .react-aria-Dialog > .button-wrapper {
+  margin-left: auto;
+  cursor: pointer;
+  margin-bottom: 3px;
+}
+
+.popup > .react-aria-Dialog > .button-wrapper button > svg {
+  color: black;
+}

package/dist/styles-XVRR5GIG.css

@@ -0,0 +1,42 @@
+.dd-menu {
+  max-height: inherit;
+  min-width: var(--trigger-width); /* defined by react-aria */
+  outline: none;
+  background-color: white;
+  filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
+}
+
+.dd-menu-item {
+  position: relative;
+  display: grid;
+  grid-template-areas:
+    'label kbd'
+    'desc  kbd';
+  align-items: center;
+  padding: 8px 16px;
+  font-family: inherit;
+  color: #111;
+  font-size: 14px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: 16px;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+          user-select: none;
+  cursor: pointer;
+  outline: none;
+}
+
+.dd-menu-item:focus-visible {
+  background-color: var(--color-busy);
+  outline: var(--color-focus) solid 2px;
+}
+
+.dd-menu-item:hover {
+  background-color: var(--color-busy);
+}
+
+.dd-menu-item[data-disabled='true'] {
+  pointer-events: none;
+  color: var(--color-disabled-text, #adadad);
+}

package/dist/styles-YBC6BJBD.css

@@ -0,0 +1,83 @@
+.breadcrumbs__container {
+  display: flex;
+}
+
+.breadcrumbs__container > .breadcrumbs {
+  all: unset;
+}
+
+.breadcrumbs__container > .breadcrumbs > .breadcrumb-item {
+  margin: 0;
+  float: left;
+  list-style: none;
+  display: flex;
+}
+
+.breadcrumb-item__skeleton {
+  width: 120px;
+  height: 20px;
+  border-radius: 2px;
+  background-color: var(--color-very-light-grey, #f5f5f5);
+  position: relative;
+  overflow: hidden;
+}
+
+.breadcrumb-item__skeleton::before {
+  content: '';
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background: linear-gradient(90deg,
+      rgba(255, 255, 255, 0) 0%,
+      rgba(200, 200, 200, 0.4) 50%,
+      rgba(255, 255, 255, 0) 100%);
+  animation: shimmer 1.5s infinite;
+  transform: translateX(-100%);
+}
+
+@keyframes shimmer {
+  0% {
+    transform: translateX(-100%);
+  }
+
+  100% {
+    transform: translateX(100%);
+  }
+}
+
+.breadcrumbs__container
+  > .breadcrumbs
+  > .breadcrumb-item:not(:last-of-type)::after {
+  content: ' / ';
+
+  display: inline-block;
+  padding-right: 10px;
+  padding-left: 10px;
+
+  text-align: center;
+  font-family: Lato;
+  font-size: 14px;
+  font-weight: 700;
+  line-height: 140.625%;
+  color: #888c8c;
+}
+
+.breadcrumbs__container > .breadcrumbs > .breadcrumb-item > a,
+.breadcrumbs__container > .breadcrumbs > .breadcrumb-item > span {
+  padding: 2px;
+
+  color: var(--color-primary);
+  font-family: Lato;
+  font-size: 14px;
+  line-height: 140.625%;
+  text-decoration-line: underline;
+
+  outline-color: var(--color-focus);
+}
+
+.breadcrumbs__container > .breadcrumbs > .breadcrumb-item > span {
+  color: #111111;
+  text-decoration: none;
+}