@morscherlab/mint-sdk 1.2.0-beta.2 → 1.2.0-beta.3

package/src/styles/components/unit-input.css

@@ -1,123 +0,0 @@
-/* UnitInput Component Styles */
-
-.mint-unit-input {
-  display: flex;
-  flex-direction: column;
-  gap: 0.375rem;
-}
-
-/* ---------- Controls row (value input + unit chip) ---------- */
-
-.mint-unit-input__controls {
-  display: flex;
-  align-items: stretch;
-  background-color: var(--bg-secondary);
-  border: 1px solid var(--border-color);
-  border-radius: 0.5rem;
-  transition: border-color 0.15s ease, box-shadow 0.15s ease;
-  overflow: hidden;
-}
-
-.mint-unit-input__controls--sm { min-height: var(--form-height-sm); }
-.mint-unit-input__controls--md { min-height: var(--form-height-md); }
-.mint-unit-input__controls--lg { min-height: var(--form-height-lg); }
-
-.mint-unit-input__controls:hover:not(:has(:disabled)) {
-  border-color: var(--text-muted);
-}
-
-.mint-unit-input__controls:focus-within {
-  border-color: var(--color-primary);
-  box-shadow: var(--focus-ring-soft);
-}
-
-.mint-unit-input--error .mint-unit-input__controls {
-  border-color: var(--mint-error);
-}
-
-.mint-unit-input--error .mint-unit-input__controls:focus-within {
-  box-shadow: var(--focus-ring-soft-error);
-}
-
-.mint-unit-input--disabled .mint-unit-input__controls {
-  opacity: var(--mint-disabled-opacity);
-  background-color: var(--bg-secondary);
-}
-
-/* ---------- Value input — Fira Code, left-aligned ---------- */
-
-.mint-unit-input__value {
-  flex: 1;
-  min-width: 0;
-  text-align: left;
-  background-color: transparent;
-  color: var(--text-primary);
-  border: none;
-  outline: none;
-  font-family: var(--font-mono, 'Fira Code', monospace);
-  -webkit-appearance: textfield;
-  -moz-appearance: textfield;
-  appearance: textfield;
-}
-
-.mint-unit-input__value::-webkit-outer-spin-button,
-.mint-unit-input__value::-webkit-inner-spin-button {
-  -webkit-appearance: none;
-  margin: 0;
-}
-
-.mint-unit-input__value:disabled { cursor: not-allowed; }
-
-/* Horizontal padding matches BaseInput canonical scale (10/12/16) so FormField's
-   12px label indent aligns with the value text across all input types. */
-.mint-unit-input__value--sm { padding: 0.375rem 0.625rem; font-size: 0.875rem; }
-.mint-unit-input__value--md { padding: 0.5rem 0.75rem;    font-size: 0.875rem; }
-.mint-unit-input__value--lg { padding: 0.75rem 1rem;      font-size: 1rem; }
-
-/* ---------- Unit chip ---------- */
-
-.mint-unit-input__unit {
-  display: flex;
-  align-items: center;
-  padding: 0 0.25rem;
-  background-color: var(--color-primary-soft);
-  border-left: 1px solid var(--border-color);
-}
-
-.mint-unit-input__unit-select {
-  background: transparent;
-  border: none;
-  color: var(--color-primary-hover);
-  font-size: 0.75rem;
-  font-weight: 500;
-  padding: 0 0.375rem;
-  cursor: pointer;
-  outline: none;
-  text-transform: none;
-  font-family: var(--font-mono, 'Fira Code', monospace);
-  line-height: 1;
-}
-
-.mint-unit-input__unit-select--sm { font-size: 0.6875rem; }
-.mint-unit-input__unit-select--md { font-size: 0.75rem; }
-.mint-unit-input__unit-select--lg { font-size: 0.8125rem; }
-
-.mint-unit-input__unit-select:disabled {
-  cursor: not-allowed;
-  color: var(--text-muted);
-}
-
-/* ---------- Conversion hint ---------- */
-
-.mint-unit-input__conversion-hint {
-  font-size: 0.75rem;
-  color: var(--text-muted);
-  font-style: italic;
-  padding: 0 0.75rem;
-}
-
-.mint-unit-input__unit-group {
-  /* optgroup styling — browsers vary here; minimal override */
-  font-weight: 600;
-  font-style: normal;
-}

package/src/styles/components/well-edit-popup.css

@@ -1,258 +0,0 @@
-/* WellEditPopup Component Styles */
-
-.mint-well-edit-popup__backdrop {
-  position: fixed;
-  inset: 0;
-  z-index: 40;
-}
-
-.mint-well-edit-popup {
-  position: fixed;
-  z-index: 50;
-  width: 320px;
-  border-radius: var(--radius-md);
-  overflow: hidden;
-  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
-  background-color: var(--bg-secondary);
-  border: 1px solid var(--border-color);
-}
-
-.mint-well-edit-popup__header {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  padding: 0.5rem 1rem;
-  border-bottom: 1px solid var(--border-color);
-}
-
-.mint-well-edit-popup__header-left {
-  display: flex;
-  align-items: center;
-  gap: 0.625rem;
-}
-
-.mint-well-edit-popup__well-id {
-  width: 2rem;
-  height: 2rem;
-  border-radius: var(--radius-sm);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  font-size: 0.875rem;
-  font-family: monospace;
-  font-weight: 600;
-  background-color: var(--bg-tertiary);
-  color: var(--text-primary);
-  border: 1px solid var(--border-color);
-}
-
-.mint-well-edit-popup__title {
-  font-size: 0.875rem;
-  font-weight: 500;
-  color: var(--text-primary);
-}
-
-.mint-well-edit-popup__close {
-  width: 1.5rem;
-  height: 1.5rem;
-  border-radius: var(--radius-sm);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  cursor: pointer;
-  transition: background-color 0.15s;
-  background: none;
-  border: none;
-  color: var(--text-muted);
-}
-
-.mint-well-edit-popup__close:hover {
-  background-color: rgba(128, 128, 128, 0.1);
-}
-
-.mint-well-edit-popup__body {
-  padding: 0.75rem 1rem;
-  display: flex;
-  flex-direction: column;
-  gap: 0.75rem;
-}
-
-.mint-well-edit-popup__label {
-  display: block;
-  font-size: 0.75rem;
-  font-weight: 500;
-  color: var(--text-muted);
-  margin-bottom: 0.25rem;
-  text-transform: uppercase;
-  letter-spacing: 0.025em;
-}
-
-.mint-well-edit-popup__input {
-  width: 100%;
-  height: 2rem;
-  padding: 0 0.5rem;
-  font-size: 0.875rem;
-  border-radius: var(--radius);
-  background-color: var(--bg-tertiary);
-  border: 1px solid var(--border-color);
-  color: var(--text-primary);
-  outline: none;
-  transition: border-color 0.15s, box-shadow 0.15s;
-  box-sizing: border-box;
-}
-
-.mint-well-edit-popup__input:focus-visible {
-  border-color: #10b981;
-  box-shadow: 0 0 0 2px rgba(16, 185, 129, 0.2);
-}
-
-.mint-well-edit-popup__input--mono {
-  font-family: monospace;
-  font-size: 0.75rem;
-}
-
-.mint-well-edit-popup__row {
-  display: grid;
-  grid-template-columns: 1fr 1fr;
-  gap: 0.75rem;
-}
-
-/* Sample type buttons */
-.mint-well-edit-popup__type-grid {
-  display: grid;
-  grid-template-columns: repeat(4, 1fr);
-  gap: 0.25rem;
-}
-
-.mint-well-edit-popup__type-btn {
-  height: 2rem;
-  font-size: 0.75rem;
-  font-weight: 500;
-  border-radius: var(--radius-sm);
-  cursor: pointer;
-  transition: all 0.15s;
-  border: 1px solid var(--border-color);
-  background-color: var(--bg-tertiary);
-  color: var(--text-muted);
-}
-
-.mint-well-edit-popup__type-btn--sample {
-  background-color: rgba(16, 185, 129, 0.15);
-  border-color: rgba(16, 185, 129, 0.4);
-  color: #10b981;
-}
-
-.mint-well-edit-popup__type-btn--blank {
-  background-color: rgba(249, 115, 22, 0.15);
-  border-color: rgba(249, 115, 22, 0.4);
-  color: #f97316;
-}
-
-.mint-well-edit-popup__type-btn--qc {
-  background-color: rgba(139, 92, 246, 0.15);
-  border-color: rgba(139, 92, 246, 0.4);
-  color: #8b5cf6;
-}
-
-.mint-well-edit-popup__type-btn--iqc {
-  background-color: rgba(236, 72, 153, 0.15);
-  border-color: rgba(236, 72, 153, 0.4);
-  color: #ec4899;
-}
-
-/* Injection count buttons */
-.mint-well-edit-popup__count-grid {
-  display: grid;
-  grid-template-columns: repeat(5, 1fr) 2.5rem;
-  gap: 0.25rem;
-}
-
-.mint-well-edit-popup__count-btn {
-  height: 2rem;
-  font-size: 0.875rem;
-  font-weight: 500;
-  border-radius: var(--radius-sm);
-  cursor: pointer;
-  transition: all 0.15s;
-  border: 1px solid var(--border-color);
-  background-color: var(--bg-tertiary);
-  color: var(--text-secondary);
-}
-
-.mint-well-edit-popup__count-btn--active {
-  background-color: rgba(99, 102, 241, 0.15);
-  border-color: rgba(99, 102, 241, 0.4);
-  color: #6366f1;
-}
-
-.mint-well-edit-popup__count-input {
-  height: 2rem;
-  padding: 0 0.25rem;
-  font-size: 0.875rem;
-  text-align: center;
-  border-radius: var(--radius-sm);
-  background-color: var(--bg-tertiary);
-  border: 1px solid var(--border-color);
-  color: var(--text-primary);
-  outline: none;
-  box-sizing: border-box;
-}
-
-.mint-well-edit-popup__count-input:focus-visible {
-  border-color: #6366f1;
-  box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.2);
-}
-
-/* Advanced toggle */
-.mint-well-edit-popup__advanced-toggle {
-  display: flex;
-  align-items: center;
-  gap: 0.5rem;
-  cursor: pointer;
-  user-select: none;
-  padding-top: 0.25rem;
-}
-
-.mint-well-edit-popup__advanced-toggle span {
-  font-size: 0.875rem;
-  color: var(--text-primary);
-}
-
-/* Footer */
-.mint-well-edit-popup__footer {
-  display: flex;
-  gap: 0.5rem;
-  padding: 0.75rem 1rem;
-  border-top: 1px solid var(--border-color);
-}
-
-.mint-well-edit-popup__btn {
-  flex: 1;
-  height: 2.25rem;
-  font-size: 0.875rem;
-  font-weight: 500;
-  border-radius: var(--radius-md);
-  cursor: pointer;
-  transition: all 0.15s;
-  border: none;
-}
-
-.mint-well-edit-popup__btn--clear {
-  background-color: var(--bg-tertiary);
-  color: var(--text-secondary);
-  border: 1px solid var(--border-color);
-}
-
-.mint-well-edit-popup__btn--clear:hover {
-  background-color: rgba(239, 68, 68, 0.1);
-  color: #ef4444;
-}
-
-.mint-well-edit-popup__btn--save {
-  background-color: #10b981;
-  color: white;
-}
-
-.mint-well-edit-popup__btn--save:hover {
-  background-color: #059669;
-}

package/src/styles/components/well-plate.css

@@ -1,286 +0,0 @@
-/* WellPlate Component Styles */
-
-.mint-well-plate {
-  user-select: none;
-}
-
-.mint-well-plate--inline {
-  display: inline-block;
-}
-
-.mint-well-plate--fill {
-  width: 100%;
-}
-
-.mint-well-plate__scroll {
-  overflow-x: auto;
-}
-
-.mint-well-plate__content {
-  display: inline-block;
-}
-
-.mint-well-plate--fill .mint-well-plate__content {
-  display: block;
-  width: 100%;
-}
-
-/* Table - reset consumer/framework styles (VitePress, Tailwind preflight, etc.) */
-.mint-well-plate__table {
-  display: table !important;
-  overflow: visible !important;
-  border-collapse: separate;
-  border: none !important;
-  margin: 0 !important;
-  user-select: none;
-  -webkit-user-select: none;
-}
-
-.mint-well-plate__table thead {
-  display: table-header-group !important;
-}
-
-.mint-well-plate__table tbody {
-  display: table-row-group !important;
-}
-
-.mint-well-plate__table tr {
-  border: none !important;
-  background: transparent !important;
-}
-
-.mint-well-plate__table th,
-.mint-well-plate__table td {
-  padding: 0 !important;
-  border: none !important;
-  background: transparent !important;
-}
-
-/* Header cells */
-.mint-well-plate__col-header,
-.mint-well-plate__row-header {
-  font-weight: 500;
-  text-align: center;
-  color: var(--text-muted);
-}
-
-.mint-well-plate__row-header {
-  vertical-align: middle;
-}
-
-/* Well cell */
-.mint-well-plate__cell {
-  padding: 0;
-}
-
-/* Well */
-.mint-well-plate__well {
-  position: relative;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  font-weight: 500;
-  cursor: pointer;
-  transition: background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, opacity 0.15s ease;
-  background-color: var(--bg-tertiary);
-  border: 1px dashed var(--border-color);
-}
-
-.mint-well-plate__well--rounded {
-  border-radius: var(--radius-md);
-}
-
-.mint-well-plate__well--circle {
-  border-radius: 9999px;
-}
-
-.mint-well-plate__well--filled {
-  border-style: solid;
-}
-
-.mint-well-plate__well--disabled {
-  opacity: var(--mint-disabled-opacity);
-  cursor: not-allowed;
-}
-
-/* Well states */
-.mint-well-plate__well--selected {
-  box-shadow: 0 0 0 2px #10b981, 0 0 0 3px var(--bg-card);
-}
-
-.mint-well-plate__well--drag-over {
-  box-shadow: 0 0 0 2px #6366f1;
-  background-color: rgba(99, 102, 241, 0.2);
-}
-
-.mint-well-plate__well--hovered {
-  box-shadow: 0 0 0 2px rgba(16, 185, 129, 0.5);
-}
-
-.mint-well-plate__well--drag-source {
-  box-shadow: 0 0 0 2px #f59e0b;
-  opacity: 0.5;
-}
-
-.mint-well-plate__well--drag-target {
-  box-shadow: 0 0 0 2px #10b981, 0 0 0 3px var(--bg-card);
-  background-color: rgba(16, 185, 129, 0.2);
-}
-
-/* Draggable well — explicit -webkit-user-drag for Chrome inside <table> cells */
-.mint-well-plate__well--draggable {
-  cursor: grab;
-  -webkit-user-drag: element;
-}
-
-.mint-well-plate__well--draggable:active {
-  cursor: grabbing;
-}
-
-/* Well label */
-.mint-well-plate__label {
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  max-width: 100%;
-  padding: 0 2px;
-  pointer-events: none;
-  color: var(--text-primary);
-}
-
-/* Sample type indicator */
-.mint-well-plate__indicator {
-  font-weight: 700;
-  pointer-events: none;
-  color: var(--text-primary);
-}
-
-/* Well ID text */
-.mint-well-plate__well-id {
-  font-weight: 500;
-  pointer-events: none;
-  color: var(--text-primary);
-}
-
-/* Condition header - drug label row */
-.mint-well-plate__condition-label {
-  font-weight: 600;
-  text-align: center;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  letter-spacing: 0.01em;
-  padding: 2px 4px !important;
-}
-
-/* Condition cell - inner span with gradient bg (avoids table !important reset) */
-.mint-well-plate__condition-cell {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 100%;
-  height: 100%;
-  border-radius: 4px;
-  font-weight: 600;
-  transition: background-color 0.15s ease;
-}
-
-/* Row condition label cell (rotated text) */
-.mint-well-plate__row-condition-label {
-  text-align: center;
-  vertical-align: middle;
-  padding: 0 !important;
-  position: relative;
-  height: 1px; /* Trick: allows absolute child to use 100% height in rowspan cells */
-}
-
-.mint-well-plate__row-condition-wrap {
-  position: absolute;
-  inset: 0;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-
-.mint-well-plate__row-condition-text {
-  writing-mode: vertical-lr;
-  transform: rotate(180deg);
-  font-weight: 600;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  letter-spacing: 0.01em;
-}
-
-/* Heatmap legend */
-.mint-well-plate__legend {
-  margin-top: 0.5rem;
-  display: flex;
-  align-items: center;
-  gap: 0.5rem;
-  width: 100%;
-}
-
-.mint-well-plate__legend-label {
-  font-size: 0.75rem;
-  color: var(--text-muted);
-  flex-shrink: 0;
-}
-
-.mint-well-plate__legend-bar {
-  flex: 1;
-  height: 0.75rem;
-  border-radius: 0.125rem;
-  overflow: hidden;
-  display: flex;
-  min-width: 0;
-}
-
-.mint-well-plate__legend-segment {
-  flex: 1;
-}
-
-/* Badge (injection count / custom method indicator) */
-.mint-well-plate__badge {
-  position: absolute;
-  top: -4px;
-  right: -4px;
-  width: 16px;
-  height: 16px;
-  border-radius: 9999px;
-  font-size: 10px;
-  font-weight: 700;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: white;
-  pointer-events: none;
-  line-height: 1;
-}
-
-/* Sample type legend bar */
-.mint-well-plate__sample-legend {
-  margin-top: 0.5rem;
-  display: flex;
-  align-items: center;
-  gap: 1rem;
-  padding: 0 0.25rem;
-}
-
-.mint-well-plate__sample-legend-item {
-  display: flex;
-  align-items: center;
-  gap: 0.375rem;
-}
-
-.mint-well-plate__sample-legend-dot {
-  width: 0.875rem;
-  height: 0.875rem;
-  border-radius: var(--radius-sm);
-  flex-shrink: 0;
-}
-
-.mint-well-plate__sample-legend-text {
-  font-size: 0.75rem;
-  color: var(--text-muted);
-}