@supersoniks/concorde 3.1.87 → 3.1.90

package/src/core/components/ui/pop/pop.ts

@@ -105,7 +105,7 @@ export class Pop extends LitElement {
 
   show() {
     this.setMaxZindex();
-    this.popContent.style.removeProperty("display");
+    this.popContent?.style?.removeProperty("display");
     this.open = true;
     this.popContent.setAttribute("tabindex", "0");
     if (this.popBtn && this.popContent && !this.positioningRuns) {

package/src/core/components/ui/tooltip/tooltip.ts

@@ -1,4 +1,4 @@
-import { html, LitElement, css } from "lit";
+import { html, LitElement, css, PropertyValues } from "lit";
 import { customElement, property } from "lit/decorators.js";
 const tagName = "sonic-tooltip";
 @customElement(tagName)
@@ -35,12 +35,20 @@ export class Tooltip extends LitElement {
         scale: 0.9;
         will-change: opacity, transform;
       }
-      :host(:focus-within) .tooltip:not(.disabled):before,
-      .tooltip:not(.disabled):hover:before {
+
+      /* désactive au focus-within cause persistance du tooltip au clic */
+      /* :host(:focus-within) .tooltip:before, */
+      :host(:focus-visible) .tooltip:before,
+      .tooltip:hover:before {
         opacity: 1;
         scale: 1;
       }
 
+      .disabled:before {
+        opacity: 0 !important;
+        scale: 0.9 !important;
+      }
+
       :host(:not([placement])) .tooltip:before,
       :host([placement="top"]) .tooltip:before {
         bottom: var(--sc-tooltip-position);
@@ -120,15 +128,22 @@ export class Tooltip extends LitElement {
     | "left"
     | "left-start"
     | "left-end";
+
   @property({ type: Boolean }) disabled = false;
   @property({ type: Boolean }) focusable = false;
 
-  connectedCallback(): void {
-    if (this.focusable) {
-      this.setAttribute("tabindex", "0");
+  protected willUpdate(_changedProperties: PropertyValues): void {
+    if (_changedProperties.has("disabled")) {
+      const wasDisabledBefore = _changedProperties.get("disabled") === true;
+      if (this.disabled) {
+        this.setAttribute("tabindex", "-1");
+      } else if (!this.disabled && wasDisabledBefore) {
+        this.removeAttribute("tabindex");
+      }
     }
-    super.connectedCallback();
+    super.willUpdate(_changedProperties);
   }
+
   render() {
     const disabledClass = this.disabled || this.label == "" ? "disabled" : "";
     return html`<div

package/src/core/mixins/FormElement.ts

@@ -308,7 +308,11 @@ const Form = <T extends Constructor<SubscriberInterface>>(superClass: T) => {
     focus() {
       const inputElement = this.shadowRoot?.querySelector(
         "[data-form-element], button"
-      ) as HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement;
+      ) as
+        | HTMLInputElement
+        | HTMLSelectElement
+        | HTMLTextAreaElement
+        | HTMLButtonElement;
       inputElement?.focus();
     }