@getmicdrop/svelte-components 5.3.3 → 5.3.6

package/dist/recipes/SuperLogin/SuperLogin.svelte

@@ -690,15 +690,14 @@
 
                 <!-- Password field - slides between slot 2 and slot 3 -->
                 <div class="password-field-container">
-                  <div class="mb-2">
+                  <div class="mb-2 password-field-wrapper">
                     <div class="flex justify-between items-center mb-2">
                       <label
                         for="password"
                         class="block text-sm font-medium text-gray-900 dark:text-white"
                       >Password</label>
-                      <Button variant="link" onclick={() => { view = "reset"; }}>
-                        Forgot your password?
-                      </Button>
+                      <!-- Placeholder to maintain layout - actual button is after input for tab order -->
+                      <span class="forgot-password-placeholder"></span>
                     </div>
                     <Input
                       id="password"
@@ -707,6 +706,10 @@
                       type="password"
                       autocomplete="current-password"
                     />
+                    <!-- Forgot password button: after input in DOM for correct tab order, positioned visually in label row -->
+                    <Button variant="link" type="button" class="forgot-password-btn" onclick={() => { view = "reset"; }}>
+                      Forgot your password?
+                    </Button>
                   </div>
                 </div>
 
@@ -788,8 +791,10 @@
 
             <div class="space-y-3">
               {#each accounts as account}
-                <button
-                  class="w-full flex items-center p-4 border border-gray-300 dark:border-gray-600 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-700 transition-colors text-left group"
+                <Button
+                  variant="card"
+                  size="md"
+                  class="group"
                   onclick={() => handleAccountSelectInternal(account)}
                 >
                   <div
@@ -837,7 +842,7 @@
                       />
                     </svg>
                   </div>
-                </button>
+                </Button>
               {/each}
             </div>
 
@@ -1088,12 +1093,10 @@
                   > if it is an email on file.
                 </p>
                 <p class="text-sm text-gray-600 dark:text-gray-300 leading-relaxed text-left">
-                  Please check again. If you still haven't received an email, <button
-                    type="button"
-                    class="text-blue-600 font-medium dark:text-blue-400"
+                  Please check again. If you still haven't received an email, <Button
+                    variant="link"
                     onclick={handleTryDifferentEmail}
-                    >try a different email</button
-                  >.
+                  >try a different email</Button>.
                 </p>
               {:else}
                 <p class="text-sm text-gray-600 dark:text-gray-300 leading-relaxed text-left">
@@ -1108,17 +1111,8 @@
                 </p>
                 <p class="text-sm text-gray-600 dark:text-gray-300 leading-relaxed text-left">
                   If you haven't received an email in 5 minutes, check your
-                  spam, <button
-                    type="button"
-                    class="text-blue-600 font-medium dark:text-blue-400"
-                    onclick={handleResend}>resend</button
-                  >, or
-                  <button
-                    type="button"
-                    class="text-blue-600 font-medium dark:text-blue-400"
-                    onclick={handleTryDifferentEmail}
-                    >try a different email</button
-                  >.
+                  spam, <Button variant="link" onclick={handleResend}>resend</Button>, or
+                  <Button variant="link" onclick={handleTryDifferentEmail}>try a different email</Button>.
                 </p>
               {/if}
             </div>
@@ -1211,6 +1205,23 @@
     margin-bottom: 0;
   }
 
+  /* Password field tab order fix: button after input in DOM, positioned visually in label row */
+  .password-field-wrapper {
+    position: relative;
+  }
+
+  .password-field-wrapper :global(.forgot-password-btn) {
+    position: absolute;
+    top: 0;
+    right: 0;
+  }
+
+  .forgot-password-placeholder {
+    /* Invisible placeholder to maintain label row height */
+    display: inline-block;
+    height: 1em;
+  }
+
   /* Card fade-in animation */
   .card-hidden {
     opacity: 0;

package/dist/recipes/SuperLogin/SuperLogin.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SuperLogin.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/recipes/SuperLogin/SuperLogin.svelte.js"],"names":[],"mappings":";;;;;AAy9BA;iBA76BkC,MAAM;cAAY,MAAM;cAAY,MAAM;kBAAgB,MAAM;kBAAgB,OAAO;gBAAc,MAAM;gBAAc,MAAM;iBAAe,MAAM;0BAAwB,MAAM;wBAAsB,MAAM;aAAW,MAAM;;;;;yBAAoI,OAAO;mBAAiB,MAAM;WA66B1W;wBA76BtC;IAAE,UAAU,CAAC,EAAE,MAAM,CAAC;IAAC,OAAO,CAAC,EAAE,MAAM,CAAC;IAAC,OAAO,CAAC,EAAE,MAAM,CAAC;IAAC,WAAW,CAAC,EAAE,MAAM,CAAC;IAAC,WAAW,CAAC,EAAE,OAAO,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAAC,UAAU,CAAC,EAAE,MAAM,CAAC;IAAC,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAAC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAAC,MAAM,CAAC,EAAE,MAAM,CAAC;IAAC,cAAc,CAAC,WAAW;IAAC,eAAe,CAAC,WAAW;IAAC,UAAU,CAAC,WAAW;IAAC,kBAAkB,CAAC,WAAW;IAAC,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAAC,YAAY,CAAC,EAAE,MAAM,CAAA;CAAE"}
+{"version":3,"file":"SuperLogin.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/recipes/SuperLogin/SuperLogin.svelte.js"],"names":[],"mappings":";;;;;AA49BA;iBAh7BkC,MAAM;cAAY,MAAM;cAAY,MAAM;kBAAgB,MAAM;kBAAgB,OAAO;gBAAc,MAAM;gBAAc,MAAM;iBAAe,MAAM;0BAAwB,MAAM;wBAAsB,MAAM;aAAW,MAAM;;;;;yBAAoI,OAAO;mBAAiB,MAAM;WAg7B1W;wBAh7BtC;IAAE,UAAU,CAAC,EAAE,MAAM,CAAC;IAAC,OAAO,CAAC,EAAE,MAAM,CAAC;IAAC,OAAO,CAAC,EAAE,MAAM,CAAC;IAAC,WAAW,CAAC,EAAE,MAAM,CAAC;IAAC,WAAW,CAAC,EAAE,OAAO,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAAC,UAAU,CAAC,EAAE,MAAM,CAAC;IAAC,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAAC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAAC,MAAM,CAAC,EAAE,MAAM,CAAC;IAAC,cAAc,CAAC,WAAW;IAAC,eAAe,CAAC,WAAW;IAAC,UAAU,CAAC,WAAW;IAAC,kBAAkB,CAAC,WAAW;IAAC,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAAC,YAAY,CAAC,EAAE,MAAM,CAAA;CAAE"}

package/dist/recipes/feedback/EmptyState/EmptyState.svelte

@@ -32,7 +32,8 @@
 <div class="flex flex-col items-center justify-center px-6 py-10 text-center {className}">
   {#if icon || imageSrc}
     {#if iconType === 'component' && icon}
-      <svelte:component this={icon} class="mb-3 text-gray-400 dark:text-gray-500 {iconSize}" />
+      {@const IconComponent = icon}
+      <IconComponent class="mb-3 text-gray-400 dark:text-gray-500 {iconSize}" />
     {:else if iconType === 'image' && imageSrc}
       <img src={imageSrc} alt="" class="mb-3 {iconSize}" />
     {/if}

package/dist/recipes/feedback/EmptyState/EmptyState.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EmptyState.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/recipes/feedback/EmptyState/EmptyState.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AAGtC,UAAU,KAAK;IACb,8BAA8B;IAC9B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,iCAAiC;IACjC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,iDAAiD;IACjD,IAAI,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC;IAC7B,yCAAyC;IACzC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,4BAA4B;IAC5B,QAAQ,CAAC,EAAE,WAAW,GAAG,OAAO,CAAC;IACjC,gCAAgC;IAChC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,6BAA6B;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAiCH,QAAA,MAAM,UAAU,0BAAwC,CAAC;AACzD,KAAK,UAAU,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;AAChD,eAAe,UAAU,CAAC"}
+{"version":3,"file":"EmptyState.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/recipes/feedback/EmptyState/EmptyState.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AAGtC,UAAU,KAAK;IACb,8BAA8B;IAC9B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,iCAAiC;IACjC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,iDAAiD;IACjD,IAAI,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC;IAC7B,yCAAyC;IACzC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,4BAA4B;IAC5B,QAAQ,CAAC,EAAE,WAAW,GAAG,OAAO,CAAC;IACjC,gCAAgC;IAChC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,6BAA6B;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAkCH,QAAA,MAAM,UAAU,0BAAwC,CAAC;AACzD,KAAK,UAAU,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;AAChD,eAAe,UAAU,CAAC"}

package/dist/recipes/inputs/MultiSelect.svelte

@@ -165,8 +165,8 @@
         {#if hasSelection}
           <div class="flex flex-wrap gap-1.5">
             {#each selectedItems as item}
-              <span class="inline-flex items-center px-2 py-1 text-sm font-medium text-blue-800 bg-blue-100 rounded dark:bg-blue-900 dark:text-blue-300">
-                <span class="overflow-hidden text-ellipsis whitespace-nowrap">{item.name}</span>
+              <span class="inline-flex items-center px-2 py-1 text-sm font-medium bg-blue-100 rounded dark:bg-blue-900">
+                <span class="overflow-hidden text-ellipsis whitespace-nowrap text-gray-900 dark:text-white" style="color-scheme: light dark;">{item.name}</span>
                 <button
                   type="button"
                   class="inline-flex items-center p-0.5 ms-1.5 text-sm text-blue-400 bg-transparent rounded-sm hover:bg-blue-200 hover:text-blue-900 dark:hover:bg-blue-800 dark:hover:text-blue-300"

package/dist/recipes/modals/InputModal.svelte

@@ -123,8 +123,9 @@
         {:else}
           <div class="relative">
             {#if inputIcon}
+              {@const InputIconComponent = inputIcon}
               <div class="absolute inset-y-0 left-0 flex items-center pl-3 pointer-events-none">
-                <svelte:component this={inputIcon} class="w-5 h-5 text-gray-500 dark:text-gray-400" />
+                <InputIconComponent class="w-5 h-5 text-gray-500 dark:text-gray-400" />
               </div>
             {/if}
             <input

package/dist/recipes/modals/InputModal.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"InputModal.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/recipes/modals/InputModal.svelte.js"],"names":[],"mappings":";;;;;AAkKA;WApJ4B,OAAO;WAAS,MAAM;YAAU,MAAM;kBAAgB,MAAM;eAAa,OAAO;iBAAe,OAAO;iBAAe,MAAM;uBAAqB,MAAM;gBAAc,MAAM;iBAAe,MAAM;oBAAkB,OAAO;gBAAc,MAAM;gBAAc,GAAG;eAAa,MAAM;mBAAiB,MAAM;gBAAc,OAAO;oBAAkB,OAAO;wBAAsB,MAAM;0BAAwB,MAAM;2BAAyB,MAAM;eAAa,OAAO;cAAY,OAAO;eAAa,GAAG;cAAY,GAAG;aAAW,GAAG;8BAoJre;wBApJtC;IAAE,IAAI,CAAC,EAAE,OAAO,CAAC;IAAC,IAAI,CAAC,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAC;IAAC,WAAW,CAAC,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAAC,UAAU,CAAC,EAAE,OAAO,CAAC;IAAC,UAAU,CAAC,EAAE,MAAM,CAAC;IAAC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAAC,UAAU,CAAC,EAAE,MAAM,CAAC;IAAC,aAAa,CAAC,EAAE,OAAO,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAAC,SAAS,CAAC,EAAE,GAAG,CAAC;IAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAAC,YAAY,CAAC,EAAE,MAAM,CAAC;IAAC,SAAS,CAAC,EAAE,OAAO,CAAC;IAAC,aAAa,CAAC,EAAE,OAAO,CAAC;IAAC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAAC,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAAC,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAAC,OAAO,CAAC,EAAE,OAAO,CAAC;IAAC,SAAS,EAAE,GAAG,CAAC;IAAC,QAAQ,EAAE,GAAG,CAAC;IAAC,OAAO,EAAE,GAAG,CAAA;CAAE"}
+{"version":3,"file":"InputModal.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/recipes/modals/InputModal.svelte.js"],"names":[],"mappings":";;;;;AAmKA;WArJ4B,OAAO;WAAS,MAAM;YAAU,MAAM;kBAAgB,MAAM;eAAa,OAAO;iBAAe,OAAO;iBAAe,MAAM;uBAAqB,MAAM;gBAAc,MAAM;iBAAe,MAAM;oBAAkB,OAAO;gBAAc,MAAM;gBAAc,GAAG;eAAa,MAAM;mBAAiB,MAAM;gBAAc,OAAO;oBAAkB,OAAO;wBAAsB,MAAM;0BAAwB,MAAM;2BAAyB,MAAM;eAAa,OAAO;cAAY,OAAO;eAAa,GAAG;cAAY,GAAG;aAAW,GAAG;8BAqJre;wBArJtC;IAAE,IAAI,CAAC,EAAE,OAAO,CAAC;IAAC,IAAI,CAAC,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAC;IAAC,WAAW,CAAC,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAAC,UAAU,CAAC,EAAE,OAAO,CAAC;IAAC,UAAU,CAAC,EAAE,MAAM,CAAC;IAAC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAAC,UAAU,CAAC,EAAE,MAAM,CAAC;IAAC,aAAa,CAAC,EAAE,OAAO,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAAC,SAAS,CAAC,EAAE,GAAG,CAAC;IAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAAC,YAAY,CAAC,EAAE,MAAM,CAAC;IAAC,SAAS,CAAC,EAAE,OAAO,CAAC;IAAC,aAAa,CAAC,EAAE,OAAO,CAAC;IAAC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAAC,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAAC,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAAC,OAAO,CAAC,EAAE,OAAO,CAAC;IAAC,SAAS,EAAE,GAAG,CAAC;IAAC,QAAQ,EAAE,GAAG,CAAC;IAAC,OAAO,EAAE,GAAG,CAAA;CAAE"}