@morscherlab/mint-sdk 1.0.0-alpha.8 → 1.0.0-alpha.9

package/src/styles/components/alert-box.css

@@ -1,6 +1,6 @@
 /* AlertBox Component Styles */
 
-.mld-alert {
+.mint-alert {
   display: flex;
   align-items: center;
   gap: 0.75rem;
@@ -9,43 +9,43 @@
   border-radius: var(--radius-md);
 }
 
-.mld-alert--success {
+.mint-alert--success {
   background-color: var(--mint-success-bg);
   border-color: var(--mint-success-border);
 }
 
-.mld-alert--error {
+.mint-alert--error {
   background-color: var(--mint-error-bg);
   border-color: var(--mint-error-border);
 }
 
-.mld-alert--warning {
+.mint-alert--warning {
   background-color: var(--mint-warning-bg);
   border-color: var(--mint-warning-border);
 }
 
-.mld-alert--info {
+.mint-alert--info {
   background-color: var(--mint-info-bg);
   border-color: var(--mint-info-border);
 }
 
-.mld-alert__icon {
+.mint-alert__icon {
   width: 1.125rem;
   height: 1.125rem;
   flex-shrink: 0;
 }
 
-.mld-alert__icon--success { color: var(--mint-success-hover); }
-.mld-alert__icon--error   { color: var(--mint-error-hover); }
-.mld-alert__icon--warning { color: var(--mint-warning-hover); }
-.mld-alert__icon--info    { color: var(--color-primary-hover); }
+.mint-alert__icon--success { color: var(--mint-success-hover); }
+.mint-alert__icon--error   { color: var(--mint-error-hover); }
+.mint-alert__icon--warning { color: var(--mint-warning-hover); }
+.mint-alert__icon--info    { color: var(--color-primary-hover); }
 
-.mld-alert__content {
+.mint-alert__content {
   flex: 1;
   min-width: 0;
 }
 
-.mld-alert__title {
+.mint-alert__title {
   font-size: 0.875rem;
   font-weight: 600;
   color: var(--text-primary);
@@ -55,12 +55,12 @@
   padding: 0 !important;
 }
 
-.mld-alert--success .mld-alert__title { color: var(--mint-success-hover); }
-.mld-alert--error   .mld-alert__title { color: var(--mint-error-hover); }
-.mld-alert--warning .mld-alert__title { color: var(--mint-warning-hover); }
-.mld-alert--info    .mld-alert__title { color: var(--color-primary-hover); }
+.mint-alert--success .mint-alert__title { color: var(--mint-success-hover); }
+.mint-alert--error   .mint-alert__title { color: var(--mint-error-hover); }
+.mint-alert--warning .mint-alert__title { color: var(--mint-warning-hover); }
+.mint-alert--info    .mint-alert__title { color: var(--color-primary-hover); }
 
-.mld-alert__message {
+.mint-alert__message {
   font-size: 0.8125rem;
   line-height: 1.5;
   color: var(--text-secondary);
@@ -69,7 +69,7 @@
   padding: 0 !important;
 }
 
-.mld-alert__actions {
+.mint-alert__actions {
   display: flex;
   align-items: center;
   gap: 0.5rem;
@@ -77,7 +77,7 @@
   flex-shrink: 0;
 }
 
-.mld-alert__action-btn {
+.mint-alert__action-btn {
   padding: 0.25rem 0.625rem;
   font-size: 0.75rem;
   font-weight: 500;
@@ -89,47 +89,47 @@
   white-space: nowrap;
 }
 
-.mld-alert__action-btn--success {
+.mint-alert__action-btn--success {
   color: var(--mint-success);
   border-color: var(--mint-success);
 }
 
-.mld-alert__action-btn--success:hover {
+.mint-alert__action-btn--success:hover {
   background-color: var(--mint-success);
   color: white;
 }
 
-.mld-alert__action-btn--error {
+.mint-alert__action-btn--error {
   color: var(--mint-error);
   border-color: var(--mint-error);
 }
 
-.mld-alert__action-btn--error:hover {
+.mint-alert__action-btn--error:hover {
   background-color: var(--mint-error);
   color: white;
 }
 
-.mld-alert__action-btn--warning {
+.mint-alert__action-btn--warning {
   color: var(--mint-warning);
   border-color: var(--mint-warning);
 }
 
-.mld-alert__action-btn--warning:hover {
+.mint-alert__action-btn--warning:hover {
   background-color: var(--mint-warning);
   color: white;
 }
 
-.mld-alert__action-btn--info {
+.mint-alert__action-btn--info {
   color: var(--color-primary);
   border-color: var(--color-primary);
 }
 
-.mld-alert__action-btn--info:hover {
+.mint-alert__action-btn--info:hover {
   background-color: var(--color-primary);
   color: white;
 }
 
-.mld-alert__dismiss {
+.mint-alert__dismiss {
   padding: 0.25rem;
   border-radius: var(--radius-sm);
   color: var(--text-muted);
@@ -139,12 +139,12 @@
   transition: color 0.15s ease, background-color 0.15s ease;
 }
 
-.mld-alert__dismiss:hover {
+.mint-alert__dismiss:hover {
   color: var(--text-primary);
   background-color: var(--bg-tertiary);
 }
 
-.mld-alert__dismiss-icon {
+.mint-alert__dismiss-icon {
   width: 0.875rem;
   height: 0.875rem;
 }

package/src/styles/components/app-avatar-menu.css

@@ -1,13 +1,13 @@
 /* AppAvatarMenu — avatar button + dropdown */
 
-.mld-avatar-menu {
+.mint-avatar-menu {
   position: relative;
   flex-shrink: 0;
 }
 
 /* Pill trigger — avatar circle + username text on the right. Matches the
-   legacy `.mld-topbar__profile-btn` convention (GitHub/Linear-style). */
-.mld-avatar-menu__trigger {
+   legacy `.mint-topbar__profile-btn` convention (GitHub/Linear-style). */
+.mint-avatar-menu__trigger {
   display: inline-flex;
   align-items: center;
   gap: 0.5rem;
@@ -20,18 +20,18 @@
   transition: background-color 0.15s ease;
 }
 
-.mld-avatar-menu__trigger:hover,
-.mld-avatar-menu__trigger--open {
+.mint-avatar-menu__trigger:hover,
+.mint-avatar-menu__trigger--open {
   background: var(--bg-hover);
 }
 
-.mld-avatar-menu__trigger:focus-visible {
+.mint-avatar-menu__trigger:focus-visible {
   outline: none;
   box-shadow: var(--focus-ring);
 }
 
 /* Gradient avatar chip inside the trigger */
-.mld-avatar-menu__avatar {
+.mint-avatar-menu__avatar {
   width: 1.75rem;
   height: 1.75rem;
   border-radius: 9999px;
@@ -46,7 +46,7 @@
 }
 
 /* Username next to the avatar — hidden below 640px to preserve space */
-.mld-avatar-menu__name {
+.mint-avatar-menu__name {
   font-size: 0.875rem;
   font-weight: 500;
   color: var(--text-primary);
@@ -54,16 +54,16 @@
 }
 
 @media (max-width: 640px) {
-  .mld-avatar-menu__name {
+  .mint-avatar-menu__name {
     display: none;
   }
 
-  .mld-avatar-menu__trigger {
+  .mint-avatar-menu__trigger {
     padding: 0.25rem;
   }
 }
 
-.mld-avatar-menu__panel {
+.mint-avatar-menu__panel {
   position: absolute;
   top: calc(100% + 0.5rem);
   right: 0;
@@ -76,20 +76,20 @@
   z-index: 60;
 }
 
-.mld-avatar-menu__header {
+.mint-avatar-menu__header {
   padding: 0.5rem 0.625rem 0.625rem;
   border-bottom: 1px solid var(--border-light);
   margin-bottom: 0.25rem;
 }
 
-.mld-avatar-menu__user-name {
+.mint-avatar-menu__user-name {
   font-size: 0.78125rem;
   font-weight: 600;
   color: var(--text-primary);
   line-height: 1.25;
 }
 
-.mld-avatar-menu__user-email {
+.mint-avatar-menu__user-email {
   font-size: 0.6875rem;
   color: var(--text-secondary);
   margin-top: 0.0625rem;
@@ -97,7 +97,7 @@
   word-break: break-all;
 }
 
-.mld-avatar-menu__item {
+.mint-avatar-menu__item {
   display: flex;
   align-items: center;
   gap: 0.625rem;
@@ -115,40 +115,40 @@
   transition: background-color var(--mint-transition);
 }
 
-.mld-avatar-menu__item:hover {
+.mint-avatar-menu__item:hover {
   background: var(--bg-hover);
 }
 
-.mld-avatar-menu__item--danger {
+.mint-avatar-menu__item--danger {
   color: var(--mint-error);
 }
 
-.mld-avatar-menu__item-icon {
+.mint-avatar-menu__item-icon {
   display: grid;
   place-items: center;
   color: var(--text-secondary);
   flex-shrink: 0;
 }
 
-.mld-avatar-menu__item-icon svg {
+.mint-avatar-menu__item-icon svg {
   width: 0.8125rem;
   height: 0.8125rem;
 }
 
-.mld-avatar-menu__item--danger .mld-avatar-menu__item-icon {
+.mint-avatar-menu__item--danger .mint-avatar-menu__item-icon {
   color: var(--mint-error);
 }
 
-.mld-avatar-menu__item-label {
+.mint-avatar-menu__item-label {
   flex: 1;
 }
 
-.mld-avatar-menu__item-right {
+.mint-avatar-menu__item-right {
   font-size: 0.6875rem;
   color: var(--text-muted);
 }
 
-.mld-avatar-menu__divider {
+.mint-avatar-menu__divider {
   height: 1px;
   background: var(--border-light);
   margin: 0.25rem 0;

package/src/styles/components/app-container.css

@@ -1,5 +1,5 @@
 /* Base: shared by both roles */
-.mld-container {
+.mint-container {
   flex: 1;
   min-height: 0;
   min-width: 0;
@@ -7,7 +7,7 @@
 }
 
 /* Card role (default — no direction prop) */
-.mld-container--card {
+.mint-container--card {
   border-radius: var(--radius-lg, 0.75rem);
   box-shadow: var(--shadow-sm, 0 1px 2px rgba(0, 0, 0, 0.05));
   border: 1px solid var(--border-color, var(--mint-border, #e5e7eb));
@@ -15,19 +15,19 @@
   padding: 1rem;
 }
 
-.mld-container--scrollable {
+.mint-container--scrollable {
   overflow-y: auto;
 }
 
 /* Layout role (direction prop set) */
-.mld-container--layout {
+.mint-container--layout {
   display: flex;
 }
 
-.mld-container--row {
+.mint-container--row {
   flex-direction: row;
 }
 
-.mld-container--column {
+.mint-container--column {
   flex-direction: column;
 }

package/src/styles/components/app-layout.css

@@ -1,27 +1,27 @@
 /* AppLayout Component Styles */
 
-.mld-layout {
+.mint-layout {
   display: flex;
   flex-direction: column;
   height: 100vh;
   overflow: hidden;
 }
 
-.mld-layout__topbar {
+.mint-layout__topbar {
   flex-shrink: 0;
 }
 
-.mld-layout__body {
+.mint-layout__body {
   display: flex;
   flex: 1;
   min-height: 0;
 }
 
-.mld-layout--sidebar-right .mld-layout__body {
+.mint-layout--sidebar-right .mint-layout__body {
   flex-direction: row-reverse;
 }
 
-.mld-layout__sidebar {
+.mint-layout__sidebar {
   flex-shrink: 0;
   overflow: hidden;
   max-width: 24rem;
@@ -30,11 +30,11 @@
 }
 
 /* Hide layout wrapper when inner sidebar is hidden (no panels for active view) */
-.mld-layout__sidebar:has(.mld-sidebar--hidden) {
+.mint-layout__sidebar:has(.mint-sidebar--hidden) {
   display: none;
 }
 
-.mld-layout__main {
+.mint-layout__main {
   flex: 1;
   min-width: 0;
   min-height: 0;
@@ -44,7 +44,7 @@
 }
 
 /* Strip topbar card variant inside layout — layout handles containment */
-.mld-layout .mld-topbar--card {
+.mint-layout .mint-topbar--card {
   margin: 0;
   width: 100%;
   border-radius: 0;
@@ -54,23 +54,23 @@
 }
 
 /* Floating variant: all sections appear as separate cards on a background */
-.mld-layout--floating {
+.mint-layout--floating {
   background-color: var(--bg-primary, var(--mint-bg-primary, #f8fafc));
   padding: 1rem;
   gap: 1rem;
 }
 
-.mld-layout--floating .mld-layout__topbar {
+.mint-layout--floating .mint-layout__topbar {
   border-radius: var(--radius-lg, 0.75rem);
   box-shadow: var(--shadow-sm, 0 1px 2px rgba(0, 0, 0, 0.05));
   border: 1px solid var(--border-color, var(--mint-border, #e5e7eb));
 }
 
-.mld-layout--floating .mld-layout__body {
+.mint-layout--floating .mint-layout__body {
   gap: 1rem;
 }
 
-.mld-layout--floating .mld-layout__sidebar {
+.mint-layout--floating .mint-layout__sidebar {
   border-radius: var(--radius-lg, 0.75rem);
   overflow: hidden;
   box-shadow: var(--shadow-sm, 0 1px 2px rgba(0, 0, 0, 0.05));
@@ -78,17 +78,17 @@
   background-color: var(--bg-secondary, var(--mint-bg-secondary, #f8f9fb));
 }
 
-.mld-layout--floating .mld-layout__main {
+.mint-layout--floating .mint-layout__main {
   gap: 1rem;
 }
 
 /* In floating mode, inner components don't need borders since the wrapper provides them */
-.mld-layout--floating .mld-sidebar {
+.mint-layout--floating .mint-sidebar {
   border-right: none;
   border-left: none;
 }
 
-.mld-layout--floating .mld-topbar {
+.mint-layout--floating .mint-topbar {
   border: none;
   border-bottom: none;
   margin: 0;

package/src/styles/components/app-page-selector.css

@@ -1,11 +1,11 @@
 /* AppPageSelector — left-side page dropdown */
 
-.mld-page-selector {
+.mint-page-selector {
   position: relative;
   flex-shrink: 0;
 }
 
-.mld-page-selector__trigger {
+.mint-page-selector__trigger {
   display: inline-flex;
   align-items: center;
   gap: 0.625rem;
@@ -28,32 +28,32 @@
   transform: translateY(0);
 }
 
-.mld-page-selector__trigger:hover:not(.mld-page-selector__trigger--open) {
+.mint-page-selector__trigger:hover:not(.mint-page-selector__trigger--open) {
   background: var(--bg-hover);
   box-shadow: var(--shadow-sm);
   transform: translateY(-1px);
 }
 
-.mld-page-selector__trigger:active:not(.mld-page-selector__trigger--open) {
+.mint-page-selector__trigger:active:not(.mint-page-selector__trigger--open) {
   transform: translateY(0);
   box-shadow: none;
   transition-duration: 0.05s;
 }
 
 @media (prefers-reduced-motion: reduce) {
-  .mld-page-selector__trigger,
-  .mld-page-selector__trigger:hover,
-  .mld-page-selector__trigger:active {
+  .mint-page-selector__trigger,
+  .mint-page-selector__trigger:hover,
+  .mint-page-selector__trigger:active {
     transform: none;
   }
 }
 
-.mld-page-selector__trigger--open {
+.mint-page-selector__trigger--open {
   border-color: var(--color-primary);
   box-shadow: 0 0 0 3px var(--color-primary-soft);
 }
 
-.mld-page-selector__icon {
+.mint-page-selector__icon {
   width: 1.5rem;
   height: 1.5rem;
   border-radius: 0.375rem;
@@ -64,18 +64,18 @@
   flex-shrink: 0;
 }
 
-.mld-page-selector__icon svg {
+.mint-page-selector__icon svg {
   width: 0.875rem;
   height: 0.875rem;
 }
 
-.mld-page-selector__icon-fallback {
+.mint-page-selector__icon-fallback {
   font-size: 0.6875rem;
   font-weight: 600;
   font-family: var(--font-mono, ui-monospace, monospace);
 }
 
-.mld-page-selector__label {
+.mint-page-selector__label {
   flex: 1;
   text-align: left;
   white-space: nowrap;
@@ -83,7 +83,7 @@
   text-overflow: ellipsis;
 }
 
-.mld-page-selector__chevron-wrap {
+.mint-page-selector__chevron-wrap {
   width: 1.625rem;
   height: 1.625rem;
   border-radius: 0.375rem;
@@ -94,17 +94,17 @@
   flex-shrink: 0;
 }
 
-.mld-page-selector__chevron {
+.mint-page-selector__chevron {
   width: 0.8125rem;
   height: 0.8125rem;
   transition: transform var(--mint-transition);
 }
 
-.mld-page-selector__chevron--open {
+.mint-page-selector__chevron--open {
   transform: rotate(180deg);
 }
 
-.mld-page-selector__menu {
+.mint-page-selector__menu {
   position: absolute;
   top: calc(100% + 0.375rem);
   left: 0;
@@ -117,7 +117,7 @@
   z-index: 50;
 }
 
-.mld-page-selector__menu-title {
+.mint-page-selector__menu-title {
   padding: 0.375rem 0.625rem 0.5rem;
   font-size: 0.625rem;
   font-weight: 600;
@@ -126,7 +126,7 @@
   color: var(--text-muted);
 }
 
-.mld-page-selector__item {
+.mint-page-selector__item {
   display: flex;
   align-items: center;
   gap: 0.625rem;
@@ -145,21 +145,21 @@
   transition: background-color var(--mint-transition);
 }
 
-.mld-page-selector__item:hover:not(.mld-page-selector__item--disabled) {
+.mint-page-selector__item:hover:not(.mint-page-selector__item--disabled) {
   background: var(--bg-hover);
 }
 
-.mld-page-selector__item--active {
+.mint-page-selector__item--active {
   background: var(--bg-tertiary);
   font-weight: 600;
 }
 
-.mld-page-selector__item--disabled {
+.mint-page-selector__item--disabled {
   opacity: var(--mint-disabled-opacity);
   cursor: not-allowed;
 }
 
-.mld-page-selector__item-icon {
+.mint-page-selector__item-icon {
   width: 1.375rem;
   height: 1.375rem;
   border-radius: 0.3125rem;
@@ -170,21 +170,21 @@
   flex-shrink: 0;
 }
 
-.mld-page-selector__item--active .mld-page-selector__item-icon {
+.mint-page-selector__item--active .mint-page-selector__item-icon {
   background: var(--color-primary-soft);
   color: var(--color-primary);
 }
 
-.mld-page-selector__item-icon svg {
+.mint-page-selector__item-icon svg {
   width: 0.8125rem;
   height: 0.8125rem;
 }
 
-.mld-page-selector__item-label {
+.mint-page-selector__item-label {
   flex: 1;
 }
 
-.mld-page-selector__item-hint {
+.mint-page-selector__item-hint {
   font-size: 0.65625rem;
   color: var(--text-muted);
   white-space: nowrap;

package/src/styles/components/app-pill-nav.css

@@ -1,6 +1,6 @@
 /* AppPillNav — centered top-level navigation pills */
 
-.mld-pill-nav {
+.mint-pill-nav {
   display: inline-flex;
   padding: 0.1875rem;
   border-radius: 9999px;
@@ -9,7 +9,7 @@
   flex-shrink: 0;
 }
 
-.mld-pill-nav__item {
+.mint-pill-nav__item {
   display: inline-flex;
   align-items: center;
   border: 0;
@@ -30,28 +30,28 @@
 }
 
 @media (prefers-reduced-motion: reduce) {
-  .mld-pill-nav__item {
+  .mint-pill-nav__item {
     transition: none;
   }
 }
 
-.mld-pill-nav__item:hover:not(.mld-pill-nav__item--active):not(.mld-pill-nav__item--disabled) {
+.mint-pill-nav__item:hover:not(.mint-pill-nav__item--active):not(.mint-pill-nav__item--disabled) {
   color: var(--text-primary);
 }
 
-.mld-pill-nav__item--active {
+.mint-pill-nav__item--active {
   color: var(--text-primary);
   background: var(--bg-card);
   box-shadow: var(--shadow-sm);
   font-weight: 600;
 }
 
-.mld-pill-nav__item--disabled {
+.mint-pill-nav__item--disabled {
   opacity: var(--mint-disabled-opacity);
   cursor: not-allowed;
 }
 
-.mld-pill-nav__item:focus-visible {
+.mint-pill-nav__item:focus-visible {
   outline: none;
   box-shadow: var(--focus-ring);
 }