@ds-autonomie/web-components 2.2.0 → 2.3.1

package/cdn/chunks/{chunk.HNDRJ3LR.js → chunk.SE7W7XMK.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk.Z3VIP662.js";
 import {
   FilterBase
-} from "./chunk.SW4US4PJ.js";
+} from "./chunk.4AMHKT45.js";
 import {
   watch
 } from "./chunk.4FQJ3QJK.js";

package/cdn/chunks/{chunk.QVX3F6W3.js → chunk.T56ZOKTF.js}

@@ -1,6 +1,6 @@
 import {
   form_control_styles_default
-} from "./chunk.NC6BC5GU.js";
+} from "./chunk.W2B6WXUI.js";
 import {
   component_styles_default
 } from "./chunk.PSQJDSB2.js";

package/cdn/chunks/{chunk.D34ULVGO.js → chunk.TAKMMVMG.js}

@@ -1,6 +1,6 @@
 import {
   LocalizeController
-} from "./chunk.ZLWLHLBC.js";
+} from "./chunk.LICWCBKN.js";
 import {
   ShoelaceElement,
   n,

package/cdn/chunks/{chunk.FA2HQBM6.js → chunk.TENBZ64C.js}

@@ -13,7 +13,6 @@ var button_styles_default = i`
     display: inline-block;
     position: relative;
     width: auto;
-    cursor: pointer;
   }
 
   .button {
@@ -33,7 +32,7 @@ var button_styles_default = i`
       var(--dsa-wc-transition-x-fast) color,
       var(--dsa-wc-transition-x-fast) border,
       var(--dsa-wc-transition-x-fast) box-shadow;
-    cursor: inherit;
+    cursor: pointer;
   }
 
   .button::-moz-focus-inner {
@@ -375,29 +374,33 @@ var button_styles_default = i`
   }
 
   /* Tertiary */
-  .button--tertiary {
+  .button--tertiary:not(.button--tertiary-with-outline) {
     padding: 0;
+    border: none;
   }
   /* Tertiary/On Base */
   .button--on-base.button--tertiary {
     background-color: var(--dsa-wc-button-tertiary-on-base-color);
-    border: none;
+    border-color: var(--dsa-wc-button-tertiary-on-base-border-color);
     color: var(--dsa-wc-button-tertiary-on-base-font-color);
   }
   .button--on-base.button--tertiary:hover:not(.button--disabled):not(
       .button--loading
     ) {
     background-color: var(--dsa-wc-button-tertiary-on-base-hover-color);
+    border-color: var(--dsa-wc-button-tertiary-on-base-hover-border-color);
     color: var(--dsa-wc-button-tertiary-on-base-hover-font-color);
   }
   .button--on-base.button--tertiary:active:not(.button--disabled):not(
       .button--loading
     ) {
     background-color: var(--dsa-wc-button-tertiary-on-base-active-color);
+    border-color: var(--dsa-wc-button-tertiary-on-base-active-border-color);
     color: var(--dsa-wc-button-tertiary-on-base-active-font-color);
   }
   .button--on-base.button--tertiary.button--disabled {
     background-color: var(--dsa-wc-button-tertiary-on-base-disabled-color);
+    border-color: var(--dsa-wc-button-tertiary-on-base-disabled-border-color);
     color: var(--dsa-wc-button-tertiary-on-base-disabled-font-color);
   }
   .button--on-base.button--tertiary.button--loading {
@@ -415,7 +418,7 @@ var button_styles_default = i`
   /* Tertiary/On Floating Menu */
   .button--on-floating-menu.button--tertiary {
     background-color: var(--dsa-wc-button-tertiary-on-floating-menu-color);
-    border: none;
+    border-color: var(--dsa-wc-button-tertiary-on-floating-menu-border-color);
     color: var(--dsa-wc-button-tertiary-on-floating-menu-font-color);
   }
   .button--on-floating-menu.button--tertiary:hover:not(.button--disabled):not(
@@ -424,6 +427,9 @@ var button_styles_default = i`
     background-color: var(
       --dsa-wc-button-tertiary-on-floating-menu-hover-color
     );
+    border-color: var(
+      --dsa-wc-button-tertiary-on-floating-menu-hover-border-color
+    );
     color: var(--dsa-wc-button-tertiary-on-floating-menu-hover-font-color);
   }
   .button--on-floating-menu.button--tertiary:active:not(.button--disabled):not(
@@ -432,12 +438,18 @@ var button_styles_default = i`
     background-color: var(
       --dsa-wc-button-tertiary-on-floating-menu-active-color
     );
+    border-color: var(
+      --dsa-wc-button-tertiary-on-floating-menu-active-border-color
+    );
     color: var(--dsa-wc-button-tertiary-on-floating-menu-active-font-color);
   }
   .button--on-floating-menu.button--tertiary.button--disabled {
     background-color: var(
       --dsa-wc-button-tertiary-on-floating-menu-disabled-color
     );
+    border-color: var(
+      --dsa-wc-button-tertiary-on-floating-menu-disabled-border-color
+    );
     color: var(--dsa-wc-button-tertiary-on-floating-menu-disabled-font-color);
   }
   .button--on-floating-menu.button--tertiary.button--loading {
@@ -458,7 +470,7 @@ var button_styles_default = i`
   /* Tertiary/On Contrasted Menu */
   .button--on-contrasted-menu.button--tertiary {
     background-color: var(--dsa-wc-button-tertiary-on-contrasted-menu-color);
-    border: none;
+    border-color: var(--dsa-wc-button-tertiary-on-contrasted-menu-border-color);
     color: var(--dsa-wc-button-tertiary-on-contrasted-menu-font-color);
   }
   .button--on-contrasted-menu.button--tertiary:hover:not(.button--disabled):not(
@@ -467,6 +479,9 @@ var button_styles_default = i`
     background-color: var(
       --dsa-wc-button-tertiary-on-contrasted-menu-hover-color
     );
+    border-color: var(
+      --dsa-wc-button-tertiary-on-contrasted-menu-hover-border-color
+    );
     color: var(--dsa-wc-button-tertiary-on-contrasted-menu-hover-font-color);
   }
   .button--on-contrasted-menu.button--tertiary:active:not(
@@ -475,12 +490,18 @@ var button_styles_default = i`
     background-color: var(
       --dsa-wc-button-tertiary-on-contrasted-menu-active-color
     );
+    border-color: var(
+      --dsa-wc-button-tertiary-on-contrasted-menu-active-border-color
+    );
     color: var(--dsa-wc-button-tertiary-on-contrasted-menu-active-font-color);
   }
   .button--on-contrasted-menu.button--tertiary.button--disabled {
     background-color: var(
       --dsa-wc-button-tertiary-on-contrasted-menu-disabled-color
     );
+    border-color: var(
+      --dsa-wc-button-tertiary-on-contrasted-menu-disabled-border-color
+    );
     color: var(--dsa-wc-button-tertiary-on-contrasted-menu-disabled-font-color);
   }
   .button--on-contrasted-menu.button--tertiary.button--loading {

package/cdn/chunks/chunk.TGMW5D2F.js

@@ -0,0 +1,93 @@
+import {
+  input_styles_default
+} from "./chunk.T56ZOKTF.js";
+import {
+  i
+} from "./chunk.4KHZQZ3M.js";
+
+// src/components/input-time/input-time.styles.ts
+var input_time_styles_default = i`
+  ${input_styles_default}
+
+  .input--time {
+    overflow: visible;
+  }
+
+  .icon-button--time {
+    --padding: var(--dsa-spacing-4);
+    margin-right: var(--dsa-wc-input-padding-x);
+  }
+
+  .icon-button--time::part(base) {
+    color: inherit;
+  }
+
+  .time-popup::part(popup) {
+    z-index: var(--dsa-wc-z-index-dropdown);
+    overflow: hidden;
+  }
+
+  .time-popup--panel {
+    border: 1px solid var(--dsa-wc-input-time-panel-border-color);
+    border-radius: var(--dsa-wc-input-time-panel-border-radius);
+    background: var(--dsa-color-background-base);
+    box-shadow: var(--dsa-wc-shadow-small);
+    display: grid;
+    grid-auto-flow: column;
+  }
+
+  .time-popup--unit-container {
+    width: var(--dsa-wc-input-time-picker-unit-size);
+    max-height: calc(var(--dsa-wc-input-time-picker-unit-size) * 6);
+    margin: 0;
+    padding: var(--dsa-spacing-4);
+    overflow: auto;
+    scrollbar-width: none;
+    list-style: none;
+  }
+
+  .time-popup--unit {
+    cursor: pointer;
+    border-radius: var(--dsa-wc-input-time-picker-unit-radius);
+    font: var(--dsa-wc-input-time-picker-unit-font);
+    color: var(--dsa-wc-input-time-picker-unit-color);
+  }
+
+  .time-popup--unit:hover {
+    background-color: var(--dsa-wc-input-time-picker-unit-hover-color);
+  }
+
+  .time-popup--unit.time-popup--unit-selected {
+    border: 1px solid var(--dsa-wc-input-time-picker-unit-current-color);
+    color: var(--dsa-color-text-on-contrasted-primary);
+    background-color: var(--dsa-wc-input-time-picker-unit-selected-color);
+  }
+
+  .time-popup--unit.time-popup--unit-selected:hover {
+    background-color: var(--dsa-color-primitive-colors-identity-purple-800);
+  }
+
+  .time-popup--unit > * {
+    aspect-ratio: 1;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+
+  .time-anchor {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: space-between;
+  }
+
+  /* Focus */
+  .time-popup--unit:focus-visible {
+    outline: var(--dsa-wc-focus-ring);
+    outline-offset: var(--dsa-wc-focus-ring-offset);
+  }
+`;
+
+export {
+  input_time_styles_default
+};

package/cdn/chunks/{chunk.P5N74W74.js → chunk.THMGZ3JS.js}

@@ -1,6 +1,6 @@
 import {
   form_control_styles_default
-} from "./chunk.NC6BC5GU.js";
+} from "./chunk.W2B6WXUI.js";
 import {
   component_styles_default
 } from "./chunk.PSQJDSB2.js";

package/cdn/chunks/{chunk.YQQNMFZF.js → chunk.TO65OMN5.js}

@@ -1,6 +1,6 @@
 import {
   checkbox_group_styles_default
-} from "./chunk.5LXQ3RKQ.js";
+} from "./chunk.O577BA4U.js";
 import {
   a11yWarning
 } from "./chunk.PWL7QCVG.js";
@@ -48,6 +48,7 @@ var DSACheckboxGroup = class extends ShoelaceElement {
     );
     this.customValidityMessage = "";
     this.hasCheckboxButtons = false;
+    this.hasCheckboxCards = false;
     this.defaultValue = [];
     this.label = "";
     this.helpText = "";
@@ -92,19 +93,18 @@ var DSACheckboxGroup = class extends ShoelaceElement {
     this.formControlController.updateValidity();
   }
   getAllCheckboxes() {
-    return [...this.defaultSlot.assignedElements({ flatten: true })];
+    return [
+      ...this.querySelectorAll("dsa-checkbox, dsa-checkbox-button, dsa-checkbox-card")
+    ];
   }
   handleCheckboxClick(event) {
     if (event.target.tagName.toLowerCase() === "a") {
       return;
     }
-    const target = event.target.closest("dsa-checkbox, dsa-checkbox-button");
+    const target = event.target.closest("dsa-checkbox, dsa-checkbox-button, dsa-checkbox-card");
     event.preventDefault();
     event.stopPropagation();
-    if (!target) {
-      return;
-    }
-    if (target.disabled || target.readonly) {
+    if (!target || target.disabled || target.readonly || this.disabled || this.readonly) {
       return;
     }
     const oldValue = this.value;
@@ -128,7 +128,7 @@ var DSACheckboxGroup = class extends ShoelaceElement {
     const target = event.target;
     if (event.key === " ") {
       event.preventDefault();
-      if (target.disabled || target.readonly) {
+      if (this.disabled || this.readonly || target.disabled || target.readonly) {
         return;
       }
       target.checked = !target.checked;
@@ -139,6 +139,9 @@ var DSACheckboxGroup = class extends ShoelaceElement {
       this.emit("dsa-input");
       this.emit("dsa-change");
     }
+    if (event.key === "Enter" && (this.disabled || this.readonly || target.disabled || target.readonly)) {
+      event.preventDefault();
+    }
   }
   handleLabelClick() {
     const availableCheckboxes = this.getAllCheckboxes().filter(
@@ -149,28 +152,19 @@ var DSACheckboxGroup = class extends ShoelaceElement {
       checkboxToFocus.focus();
     }
   }
-  handleSlottedElementChange() {
+  handleSlotChange() {
     const allCheckboxes = this.getAllCheckboxes();
     allCheckboxes.forEach((checkbox) => {
-      if (this.disabled) {
-        checkbox.disabled = true;
-      }
-      if (this.readonly) {
-        checkbox.readonly = true;
-      }
       checkbox.checked = this.value.includes(checkbox.value);
+      checkbox.parentDisabled = this.disabled;
+      checkbox.parentReadonly = this.readonly;
     });
     this.hasCheckboxButtons = allCheckboxes.some(
       (checkbox) => checkbox.tagName.toLowerCase() === "dsa-checkbox-button"
     );
-  }
-  handleSlotChange() {
-    if (customElements.get("dsa-checkbox") || customElements.get("dsa-checkbox-button")) {
-      this.handleSlottedElementChange();
-    } else {
-      customElements.whenDefined("dsa-checkbox").then(() => this.handleSlotChange());
-      customElements.whenDefined("dsa-checkbox-button").then(() => this.handleSlotChange());
-    }
+    this.hasCheckboxCards = allCheckboxes.some(
+      (checkbox) => checkbox.tagName.toLowerCase() === "dsa-checkbox-card"
+    );
   }
   handleInvalid(event) {
     this.formControlController.setValidity(false);
@@ -182,6 +176,16 @@ var DSACheckboxGroup = class extends ShoelaceElement {
     );
     this.formControlController.setValidity(this.validity.valid);
   }
+  handleDisabledChange() {
+    this.getAllCheckboxes().forEach(
+      (checkbox) => checkbox.parentDisabled = this.disabled
+    );
+  }
+  handleReadonlyChange() {
+    this.getAllCheckboxes().forEach(
+      (checkbox) => checkbox.parentReadonly = this.readonly
+    );
+  }
   handleErrorChange() {
     if (this.error) {
       this.setAttribute("aria-invalid", "true");
@@ -245,7 +249,8 @@ var DSACheckboxGroup = class extends ShoelaceElement {
       "form-control--checkbox-group": true,
       "form-control--has-label": hasLabel,
       "form-control--has-help-text": hasHelpText,
-      "form-control--has-button-group": this.hasCheckboxButtons,
+      "form-control--has-buttons": this.hasCheckboxButtons,
+      "form-control--has-cards": this.hasCheckboxCards,
       "form-control--options-horizontal": !!this.horizontal
     })}
         role="group"
@@ -286,18 +291,13 @@ var DSACheckboxGroup = class extends ShoelaceElement {
             </label>
           </dsa-visually-hidden>
 
-          <div class="checkbox-group__list-container">
-            <div
-              role="list"
-              class=${e2({
-      "form-control__options": true,
-      "checkbox-group__list--checkbox-buttons": this.hasCheckboxButtons
-    })}
-              @click=${this.handleCheckboxClick}
-              @keydown=${this.handleKeyDown}
-            >
-              <slot @slotchange=${this.handleSlotChange}></slot>
-            </div>
+          <div
+            role="list"
+            class="form-control__options"
+            @click=${this.handleCheckboxClick}
+            @keydown=${this.handleKeyDown}
+          >
+            <slot @slotchange=${this.handleSlotChange}></slot>
           </div>
         </div>
         <slot
@@ -325,6 +325,9 @@ __decorateClass([
 __decorateClass([
   r()
 ], DSACheckboxGroup.prototype, "hasCheckboxButtons", 2);
+__decorateClass([
+  r()
+], DSACheckboxGroup.prototype, "hasCheckboxCards", 2);
 __decorateClass([
   r()
 ], DSACheckboxGroup.prototype, "defaultValue", 2);
@@ -390,6 +393,12 @@ __decorateClass([
 __decorateClass([
   watch("value", { waitUntilFirstUpdate: true })
 ], DSACheckboxGroup.prototype, "handleValueChange", 1);
+__decorateClass([
+  watch("disabled")
+], DSACheckboxGroup.prototype, "handleDisabledChange", 1);
+__decorateClass([
+  watch("readonly")
+], DSACheckboxGroup.prototype, "handleReadonlyChange", 1);
 __decorateClass([
   watch("error")
 ], DSACheckboxGroup.prototype, "handleErrorChange", 1);

package/cdn/chunks/{chunk.XQAKSW3W.js → chunk.TOWWOPMH.js}

@@ -56,6 +56,8 @@ var FormControlLayout = class extends ShoelaceElement {
   renderCounter() {
     return x``;
   }
+  handleLabelClick() {
+  }
   render() {
     const hasLabelSlot = this.hasSlotController.test("label");
     const hasHelpTextSlot = this.hasSlotController.test("help-text");
@@ -85,6 +87,7 @@ var FormControlLayout = class extends ShoelaceElement {
             class='form-control__label'
             for="input"
             aria-hidden=${o(hasLabel ? void 0 : "true")}
+            @click=${this.handleLabelClick}
           >
             ${this.required ? x`<span class="form-control__label-required">*</span>` : ""}
             <slot name="label">${this.label}</slot>
@@ -134,9 +137,6 @@ __decorateClass([
 __decorateClass([
   n({ type: Boolean, reflect: true })
 ], FormControlLayout.prototype, "disabled", 2);
-__decorateClass([
-  n()
-], FormControlLayout.prototype, "lang", 2);
 __decorateClass([
   n()
 ], FormControlLayout.prototype, "placeholder", 2);

package/cdn/chunks/{chunk.6CF6SXDF.js → chunk.U5Q3HCRP.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk.4HCR3FZE.js";
 import {
   LocalizeController
-} from "./chunk.ZLWLHLBC.js";
+} from "./chunk.LICWCBKN.js";
 import {
   watch
 } from "./chunk.4FQJ3QJK.js";

package/cdn/chunks/{chunk.RPF6UDR4.js → chunk.US6UTTN5.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk.O4RRXVX2.js";
 import {
   LocalizeController
-} from "./chunk.ZLWLHLBC.js";
+} from "./chunk.LICWCBKN.js";
 import {
   e
 } from "./chunk.IKHG7XGO.js";

package/cdn/chunks/{chunk.3CJGMKTJ.js → chunk.V5TMX44U.js}

@@ -1,6 +1,6 @@
 import {
   form_control_styles_default
-} from "./chunk.NC6BC5GU.js";
+} from "./chunk.W2B6WXUI.js";
 import {
   component_styles_default
 } from "./chunk.PSQJDSB2.js";

package/cdn/chunks/{chunk.3OPTPDM7.js → chunk.VGXDHXD4.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk.LBT6FNPI.js";
 import {
   LocalizeController
-} from "./chunk.ZLWLHLBC.js";
+} from "./chunk.LICWCBKN.js";
 import {
   ShoelaceElement,
   t

package/cdn/chunks/{chunk.XLX7QTXT.js → chunk.VZJGVIXG.js}

@@ -40,6 +40,7 @@ var header_styles_default = i`
   [part~='external-links'],
   [part~='main'] {
     width: 100%;
+    /* stylelint-disable-next-line */
     max-width: var(--header-max-width);
   }
 

package/cdn/chunks/{chunk.WCF4VYWI.js → chunk.VZPL3NCB.js}

@@ -2,12 +2,12 @@ import {
   __glob
 } from "./chunk.4ZGVANML.js";
 
-// import("./**/*.entry.js") in ../../node_modules/.pnpm/wc-datepicker@0.6.0/node_modules/wc-datepicker/dist/esm/index-2c898150.js
+// import("./**/*.entry.js") in ../../node_modules/.pnpm/wc-datepicker@0.7.0/node_modules/wc-datepicker/dist/esm/index-2c898150.js
 var globImport_entry_js = __glob({
-  "./wc-datepicker.entry.js": () => import("./wc-datepicker.entry.XBA7YLCU.js")
+  "./wc-datepicker.entry.js": () => import("./wc-datepicker.entry.Y6YDPVTT.js")
 });
 
-// ../../node_modules/.pnpm/wc-datepicker@0.6.0/node_modules/wc-datepicker/dist/esm/index-2c898150.js
+// ../../node_modules/.pnpm/wc-datepicker@0.7.0/node_modules/wc-datepicker/dist/esm/index-2c898150.js
 var NAMESPACE = "wc-datepicker";
 var scopeId;
 var isSvgMode = false;

package/cdn/chunks/{chunk.NC6BC5GU.js → chunk.W2B6WXUI.js}

@@ -35,11 +35,27 @@ var form_control_styles_default = i`
   }
 
   .form-control .form-control__options {
-    display: flex;
+    display: inline-flex;
     flex-direction: column;
     gap: var(--dsa-wc-toggle-group-spacing);
   }
 
+  .form-control.form-control--has-buttons .form-control__options,
+  .form-control.form-control--has-cards .form-control__options {
+    gap: var(--dsa-spacing-8);
+  }
+  .form-control:not(.form-control--options-horizontal).form-control--has-buttons
+    .form-control__options {
+    min-width: 120px;
+    max-width: 400px;
+  }
+  .form-control:not(.form-control--options-horizontal).form-control--has-cards
+    .form-control__options {
+    display: flex;
+    min-width: 204px;
+    max-width: 660px;
+  }
+
   .form-control--options-horizontal .form-control__options {
     flex-direction: row;
     flex-wrap: wrap;

package/cdn/chunks/{chunk.XWKSA3TQ.js → chunk.W547AC5O.js}

@@ -1,6 +1,6 @@
 import {
   pagination_button_styles_default
-} from "./chunk.YD6XEMWC.js";
+} from "./chunk.2Q6V7LT2.js";
 import {
   HasSlotController
 } from "./chunk.YIY5RM53.js";