fix tooltip reconnection; closes #1595

packages/webawesome/docs/_includes/sidebar.njk

@@ -18,12 +18,6 @@
 <ul>
   <li><a href="https://github.com/shoelace-style/webawesome/discussions" target="_blank">Help &amp; Support</a></li>
   <li><a href="https://github.com/shoelace-style/webawesome/">Source Code</a></li>
-  <li>
-    <span class="wa-split">
-      <a href="/docs/resources/figma">Figma Design Kit</a></li>
-      {{ proBadge() }}
-    </span>
-  </li>
   <li><a href="/docs/resources/community">Community</a></li>
   <li><a href="/docs/resources/accessibility">Accessibility</a></li>
   <li><a href="/docs/resources/browser-support">Browser Support</a></li>

packages/webawesome/docs/_layouts/component.njk

@@ -297,11 +297,11 @@
   <div class="component-help">
     <strong>Need a hand?</strong>
     <wa-button size="small" appearance="filled" variant="neutral" href="https://github.com/shoelace-style/webawesome/issues" target="_blank">
-      <wa-icon slot="start" variant="regular" name="bug"></wa-icon>
+      <wa-icon slot="prefix" name="bug"></wa-icon>
       Report a bug
     </wa-button>
     <wa-button size="small" appearance="filled" variant="neutral" href="https://github.com/shoelace-style/webawesome/discussions" target="_blank">
-      <wa-icon slot="start" variant="regular" name="message-question"></wa-icon>
+      <wa-icon slot="prefix" name="message-question"></wa-icon>
       Ask for help
     </wa-button>
   </div>

packages/webawesome/docs/assets/styles/docs.css

@@ -386,27 +386,6 @@ h1.title {
   }
 }
 
-/* Images & Figures */
-
-figure.signpost {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: flex-start;
-  gap: var(--wa-space-s);
-
-  img {
-    border: var(--wa-border-style) var(--wa-border-width-m) var(--wa-color-surface-border);
-  }
-
-  figcaption {
-    color: var(--wa-color-text-quiet);
-    font-size: var(--wa-font-size-xs);
-    line-height: var(--wa-line-height-condensed);
-    text-align: center;
-  }
-}
-
 /* Search list pages */
 wa-page > main:has(> .search-list) {
   max-width: var(--content-width-l);

packages/webawesome/docs/assets/styles/utils.css

@@ -109,15 +109,6 @@
     line-height: var(--wa-form-control-value-line-height);
     padding-inline: 0.33em;
   }
-
-  /* step icons for ordered instructions */
-  .step-icon {
-    --primary-color: var(--wa-color-neutral-on-normal);
-    --secondary-color: var(--wa-color-neutral-fill-normal);
-    --secondary-opacity: 1;
-    font-size: 2em;
-  }
-
   /* #endregion */
 
   /* #region funsies + cosmetics */

packages/webawesome/docs/docs/resources/changelog.md

@@ -34,8 +34,6 @@ Components with the <wa-badge variant="warning">Experimental</wa-badge> badge sh
 - Fixed an overflow style that was causing tab group content to be unnecessarily truncated [issue:1401]
 - Fixed a bug in `<wa-icon>` that caused icon buttons to render when non-text nodes were slotted in [issue:1475]
 - Fixed a bug in `<wa-tooltip>` that prevented tooltips from showing when disconnecting and then reconnecting to the DOM [issue:1595]
-- Fixed a bug that caused the required `*` in form labels to have incorrect spacing in `<wa-checkbox>` and `<wa-switch>` [issue:1472]
-- Improved autofill styles in `<wa-input>` so they span the entire width of the visual input [issue:1439]
 - Modified `<wa-slider>` to only show the tooltip on the handle being dragged when in range mode [issue:1320]
 
 ## 3.0.0-beta.6

packages/webawesome/src/components/input/input.css

@@ -63,40 +63,22 @@
   border-radius: var(--wa-border-radius-pill) !important;
 }
 
-.text-field {
-  /* Show autofill styles over the entire text field, not just the native <input> */
-  &:has(:autofill),
-  &:has(:-webkit-autofill) {
-    background-color: var(--wa-color-brand-fill-quiet) !important;
-  }
-
-  input,
-  textarea {
-    /*
+.text-field input,
+.text-field textarea {
+  /*
     Fixes an alignment issue with placeholders.
     https://github.com/shoelace-style/webawesome/issues/342
   */
-    height: 100%;
+  height: 100%;
 
-    padding: 0;
-    border: none;
-    outline: none;
-    box-shadow: none;
-    margin: 0;
-    cursor: inherit;
-    -webkit-appearance: none;
-    font: inherit;
-
-    /* Turn off Safari's autofill styles */
-    &:-webkit-autofill,
-    &:-webkit-autofill:hover,
-    &:-webkit-autofill:focus,
-    &:-webkit-autofill:active {
-      -webkit-background-clip: text;
-      background-color: transparent;
-      -webkit-text-fill-color: inherit;
-    }
-  }
+  padding: 0;
+  border: none;
+  outline: none;
+  box-shadow: none;
+  margin: 0;
+  cursor: inherit;
+  -webkit-appearance: none;
+  font: inherit;
 }
 
 input {

packages/webawesome/src/styles/component/form-control.css

@@ -10,12 +10,12 @@
   font-weight: var(--wa-form-control-label-font-weight);
   line-height: var(--wa-form-control-label-line-height);
   margin-block-end: 0.5em;
-}
 
-:host([required]) slot:is([name='label'], [part='label'])::after {
-  content: var(--wa-form-control-required-content);
-  margin-inline-start: var(--wa-form-control-required-content-offset);
-  color: var(--wa-form-control-required-content-color);
+  :host([required]) &::after {
+    content: var(--wa-form-control-required-content);
+    margin-inline-start: var(--wa-form-control-required-content-offset);
+    color: var(--wa-form-control-required-content-color);
+  }
 }
 
 /* Help text */

packages/webawesome/src/styles/themes/awesome.css

@@ -332,7 +332,7 @@
 
     --wa-form-control-required-content: '*';
     --wa-form-control-required-content-color: inherit;
-    --wa-form-control-required-content-offset: 0.1em;
+    --wa-form-control-required-content-offset: -0.1em;
 
     --wa-form-control-padding-block: 1em;
     --wa-form-control-padding-inline: 1.25em;

packages/webawesome/src/styles/themes/default.css

@@ -326,7 +326,7 @@
 
     --wa-form-control-required-content: '*';
     --wa-form-control-required-content-color: inherit;
-    --wa-form-control-required-content-offset: 0.1em;
+    --wa-form-control-required-content-offset: -0.1em;
 
     --wa-form-control-padding-block: 0.75em;
     --wa-form-control-padding-inline: 1em;

packages/webawesome/src/styles/themes/shoelace.css

@@ -332,7 +332,7 @@
 
     --wa-form-control-required-content: '*';
     --wa-form-control-required-content-color: inherit;
-    --wa-form-control-required-content-offset: 0.1em;
+    --wa-form-control-required-content-offset: -0.1em;
 
     --wa-form-control-padding-block: 0.75em;
     --wa-form-control-padding-inline: 1em;