@ds-autonomie/web-components 2.4.0 → 2.5.0

package/cdn/chunks/{chunk.EVFY55H5.js → chunk.HG4TPK7J.js}

@@ -5,10 +5,10 @@ import {
 } from "./chunk.IONY2GZF.js";
 import {
   input_time_styles_default
-} from "./chunk.OSJ5I4FK.js";
+} from "./chunk.2FF44G4Y.js";
 import {
   FormControlLayout
-} from "./chunk.JZOEQBF7.js";
+} from "./chunk.E73QKLNL.js";
 import {
   scrollIntoView
 } from "./chunk.EMIT7S33.js";
@@ -34,7 +34,7 @@ import {
 } from "./chunk.2WRFDMKN.js";
 import {
   LocalizeController
-} from "./chunk.VARBZAJP.js";
+} from "./chunk.BMQ5WSY7.js";
 import {
   watch
 } from "./chunk.4FQJ3QJK.js";
@@ -75,6 +75,7 @@ var DSAInputTime = class extends FormControlLayout {
     this.clearable = false;
     this.min = "00:00";
     this.max = "23:59";
+    this.step = 60;
   }
   /** Gets the validity state object */
   get validity() {
@@ -271,6 +272,16 @@ var DSAInputTime = class extends FormControlLayout {
     this.isTimePickerOpen = false;
     return await waitForEvent(this, "dsa-after-hide");
   }
+  /** Passes the stepUp method to the native input element */
+  stepUp(stepNumber) {
+    this.nativeInput.stepUp(stepNumber);
+    this.value = this.nativeInput.value;
+  }
+  /** Passes the stepDown method to the native input element */
+  stepDown(stepNumber) {
+    this.nativeInput.stepDown(stepNumber);
+    this.value = this.nativeInput.value;
+  }
   /** Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid. */
   checkValidity() {
     return this.nativeInput.checkValidity();
@@ -378,20 +389,18 @@ var DSAInputTime = class extends FormControlLayout {
     var _a;
     const minTimeValues = timeStringToObject(this.min);
     const maxTimeValues = timeStringToObject(this.max);
-    const timeStepValue = this.step ? this.step : 60;
     if (!minTimeValues || !maxTimeValues) {
       throw new Error("Invalid min or max time values");
     }
     const selectedTimeObject = (_a = timeStringToObject(this.value)) != null ? _a : minTimeValues;
-    const hoursStep = timeStepValue > 3600 ? Math.floor(timeStepValue / 3600) : 1;
-    const minutesStep = timeStepValue > 60 ? Math.floor(timeStepValue % 3600 / 60) : 1;
-    const secondsStep = timeStepValue % 60;
+    const hoursStep = this.step > 3600 ? Math.floor(this.step / 3600) : 1;
     const displayedHours = Array.from(
       { length: 24 },
       (_, index) => index
     ).filter((index) => {
       return index >= minTimeValues.hours && index <= maxTimeValues.hours && index % hoursStep === 0;
     });
+    const minutesStep = this.step > 60 ? Math.floor(this.step % 3600 / 60) : 1;
     const displayedMinutes = Array.from(
       { length: 60 },
       (_, index) => index
@@ -402,8 +411,10 @@ var DSAInputTime = class extends FormControlLayout {
       if (selectedTimeObject.hours === (maxTimeValues == null ? void 0 : maxTimeValues.hours)) {
         return index <= (maxTimeValues == null ? void 0 : maxTimeValues.minutes) && index % minutesStep === 0;
       }
-      return timeStepValue > 60 ? index % minutesStep === 0 : true;
+      return this.step > 60 ? index % minutesStep === 0 : true;
     });
+    if (displayedMinutes.length === 0) displayedMinutes[0] = 0;
+    const secondsStep = this.step % 60;
     const displayedSeconds = Array.from(
       { length: 60 },
       (_, index) => index
@@ -468,12 +479,12 @@ var DSAInputTime = class extends FormControlLayout {
     `;
   }
   renderInput() {
+    var _a;
     const hasLabelSlot = this.hasSlotController.test("label");
     const hasPrefixIcon = this.hasSlotController.test("prefix");
     const hasSuffixIcon = this.hasSlotController.test("suffix");
     const hasLabel = this.label ? true : !!hasLabelSlot;
     const hasClearIcon = this.clearable && !this.disabled && !this.readonly && this.value.length > 0;
-    const hasSeconds = this.step < 60;
     const { displayedHours, displayedMinutes, displayedSeconds } = this.generateTimeUnitArrays();
     const hoursElement = this.generateTimeUnitList("hours", displayedHours);
     const minutesElement = this.generateTimeUnitList(
@@ -484,6 +495,7 @@ var DSAInputTime = class extends FormControlLayout {
       "seconds",
       displayedSeconds
     );
+    const selectedTimeLabel = `${this.localize.term("selectedTime")}${this.value}`;
     return x`
       <div
         part="base"
@@ -524,7 +536,7 @@ var DSAInputTime = class extends FormControlLayout {
           ?required=${this.required}
           min=${o(this.min)}
           max=${o(this.max)}
-          step=${o(this.step)}
+          step=${this.step}
           .value=${l(this.value)}
           autocomplete=${o(this.autocomplete)}
           ?autofocus=${this.autofocus}
@@ -573,11 +585,14 @@ var DSAInputTime = class extends FormControlLayout {
               part="picker-button"
               class="input__action-button icon-button--time"
               name="schedule"
-              label=${this.localize.term("selectATime")}
+              label=${`${this.localize.term("selectATime")} - ${(_a = this.label) != null ? _a : this.title}`}
               @click=${this.toggleTimePicker}
               library="system"
               size=${this.size}
               ?disabled=${this.disabled || this.readonly}
+              description=${o(
+      this.value !== "" ? selectedTimeLabel : void 0
+    )}
             ></dsa-icon-button>
           </div>
 
@@ -587,11 +602,13 @@ var DSAInputTime = class extends FormControlLayout {
             @keydown=${this.handlePanelKeydown}
             @click=${this.handlePanelClick}
           >
-            ${hoursElement} ${minutesElement}
-            ${hasSeconds ? secondsElement : ""}
+            ${hoursElement} ${minutesElement} ${secondsElement}
           </div>
         </dsa-popup>
       </div>
+      <p id="selected-value" class="input--time-description">
+        ${this.localize.term("selectedTime")}${this.value}
+      </p>
     `;
   }
 };
@@ -627,7 +644,14 @@ __decorateClass([
   n()
 ], DSAInputTime.prototype, "max", 2);
 __decorateClass([
-  n()
+  n({
+    converter: {
+      fromAttribute: (value) => {
+        if (value === "any") return 60;
+        else return Number(value);
+      }
+    }
+  })
 ], DSAInputTime.prototype, "step", 2);
 __decorateClass([
   n()

package/cdn/chunks/{chunk.GBGDDTEL.js → chunk.HOIWGDVX.js}

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

package/cdn/chunks/chunk.I6WQAXU3.js

@@ -0,0 +1,85 @@
+import {
+  card_nav_item_styles_default
+} from "./chunk.YGZ44MNV.js";
+import {
+  HasSlotController
+} from "./chunk.YIY5RM53.js";
+import {
+  i,
+  u
+} from "./chunk.VIVOXZF6.js";
+import {
+  a11yWarning
+} from "./chunk.PWL7QCVG.js";
+import {
+  o
+} from "./chunk.YQLIIKLI.js";
+import {
+  ShoelaceElement,
+  n,
+  t
+} from "./chunk.DZB6XUZ7.js";
+import {
+  __decorateClass
+} from "./chunk.4ZGVANML.js";
+
+// src/components/card-nav-item/card-nav-item.ts
+var DSACardNavItem = class extends ShoelaceElement {
+  constructor() {
+    super(...arguments);
+    this.hasSlotController = new HasSlotController(this, "[default]");
+    this.href = "";
+    this.rel = "noreferrer noopener";
+    this.role = "listitem";
+  }
+  isLink() {
+    return this.href ? true : false;
+  }
+  render() {
+    const isLink = this.isLink();
+    const tag = isLink ? i`a` : i`button`;
+    if (!this.hasSlotController.test("[default]")) {
+      a11yWarning(
+        "<dsa-card-nav-item> requires slotted content for accessibility"
+      );
+    }
+    return u`
+      <${tag}
+        part="base"
+        class="card-nav-item"
+        href=${o(isLink ? this.href : void 0)}
+        target=${o(isLink ? this.target : void 0)}
+        download=${o(isLink ? this.download : void 0)}
+        rel=${o(isLink ? this.rel : void 0)}
+      >
+        <div class="card-nav-item__body">
+          <slot></slot>
+          <dsa-icon name="arrow_forward" class="card-nav-item__icon"></dsa-icon>
+      </div>
+      </${tag}>
+    `;
+  }
+};
+DSACardNavItem.styles = card_nav_item_styles_default;
+__decorateClass([
+  n()
+], DSACardNavItem.prototype, "href", 2);
+__decorateClass([
+  n()
+], DSACardNavItem.prototype, "target", 2);
+__decorateClass([
+  n()
+], DSACardNavItem.prototype, "rel", 2);
+__decorateClass([
+  n()
+], DSACardNavItem.prototype, "download", 2);
+__decorateClass([
+  n({ reflect: true })
+], DSACardNavItem.prototype, "role", 2);
+DSACardNavItem = __decorateClass([
+  t("dsa-card-nav-item")
+], DSACardNavItem);
+
+export {
+  DSACardNavItem
+};

package/cdn/chunks/{chunk.75VU5MNL.js → chunk.J5KWVZHL.js}

@@ -1,6 +1,6 @@
 import {
   DSASelect
-} from "./chunk.WD2ZD2TZ.js";
+} from "./chunk.SS3GSU3M.js";
 import {
   getPhoneConfig
 } from "./chunk.YKKP7YAT.js";
@@ -18,7 +18,7 @@ import {
 } from "./chunk.7OLEA3GQ.js";
 import {
   FormControlLayout
-} from "./chunk.JZOEQBF7.js";
+} from "./chunk.E73QKLNL.js";
 import {
   l
 } from "./chunk.7PPSHHT2.js";

package/cdn/chunks/{chunk.BEKIGEWZ.js → chunk.JEOLRBU6.js}

@@ -9,7 +9,7 @@ import {
 } from "./chunk.YIY5RM53.js";
 import {
   LocalizeController
-} from "./chunk.VARBZAJP.js";
+} from "./chunk.BMQ5WSY7.js";
 import {
   watch
 } from "./chunk.4FQJ3QJK.js";
@@ -72,6 +72,21 @@ var DSATableContainer = class extends LoadingStateElement {
       this.showTableActions = true;
     }
   }
+  handleCaptionSlotChange() {
+    this.linkCaptionAndTable();
+  }
+  handleTableSlotChange() {
+    this.linkCaptionAndTable();
+  }
+  linkCaptionAndTable() {
+    const tableCaption = this.querySelector("dsa-table-caption");
+    const tableElement = this.querySelector("dsa-table");
+    if (!tableCaption || !tableElement || tableCaption.id || tableElement.getAttribute("aria-labelledby"))
+      return;
+    const randomId = Math.floor(Math.random() * 999999999).toString();
+    tableCaption.id = randomId;
+    tableElement.setAttribute("aria-labelledby", randomId);
+  }
   handleShowTableActions() {
     const actionBar = this.querySelector("dsa-table-action");
     const toolbar = this.querySelector("dsa-table-toolbar");
@@ -127,7 +142,11 @@ var DSATableContainer = class extends LoadingStateElement {
     const hasToolbar = this.hasSlotController.test("toolbar");
     const hasAction = this.hasSlotController.test("action");
     return x`
-      <slot part="caption" name="caption"></slot>
+      <slot
+        part="caption"
+        name="caption"
+        @slotchange=${this.handleCaptionSlotChange}
+      ></slot>
       <slot part="export" name="export"></slot>
       <div
         part="bar-container"
@@ -139,7 +158,11 @@ var DSATableContainer = class extends LoadingStateElement {
         <slot part="toolbar" name="toolbar"></slot>
         <slot part="action" name="action"></slot>
       </div>
-      <slot part="table" name="table"></slot>
+      <slot
+        part="table"
+        name="table"
+        @slotchange=${this.handleTableSlotChange}
+      ></slot>
       <slot part="pagination" name="pagination"></slot>
       <dsa-visually-hidden aria-live="polite" aria-atomic="true">
         ${this.showTableActions ? x`<span

package/cdn/chunks/{chunk.NV5OLVPR.js → chunk.JG2GJKT5.js}

@@ -1,6 +1,6 @@
 import {
   DSARadioGroup
-} from "./chunk.HE5SI4A5.js";
+} from "./chunk.F6BCRVNV.js";
 import {
   FormToggleButton
 } from "./chunk.QHU2DUDS.js";

package/cdn/chunks/{chunk.6FWACI3G.js → chunk.JOVZPGCQ.js}

@@ -18,7 +18,7 @@ import {
 } from "./chunk.2WRFDMKN.js";
 import {
   LocalizeController
-} from "./chunk.VARBZAJP.js";
+} from "./chunk.BMQ5WSY7.js";
 import {
   watch
 } from "./chunk.4FQJ3QJK.js";

package/cdn/chunks/{chunk.N6Z3FRHY.js → chunk.JVTWZUNG.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk.QHU2DUDS.js";
 import {
   DSACheckboxGroup
-} from "./chunk.TZ4FLP4S.js";
+} from "./chunk.5UVKMYSG.js";
 import {
   watch
 } from "./chunk.4FQJ3QJK.js";

package/cdn/chunks/{chunk.4ZEHBLJR.js → chunk.KNKNPTGU.js}

@@ -15,7 +15,7 @@ import {
 } from "./chunk.2WRFDMKN.js";
 import {
   LocalizeController
-} from "./chunk.VARBZAJP.js";
+} from "./chunk.BMQ5WSY7.js";
 import {
   watch
 } from "./chunk.4FQJ3QJK.js";

package/cdn/chunks/{chunk.WQ3NUYLG.js → chunk.KQJPZZKZ.js}

@@ -26,6 +26,13 @@ var menu_item_styles_default = i`
     user-select: none;
     cursor: pointer;
   }
+  .menu-item[aria-current] {
+    color: var(--dsa-wc-menu-navigation-item-current-color);
+    background-color: var(
+      --dsa-wc-menu-navigation-item-current-background-color
+    );
+    font-weight: 700 !important;
+  }
   .menu-item--button {
     background: none;
     border: none;
@@ -35,14 +42,6 @@ var menu_item_styles_default = i`
   .menu-item--link {
     text-decoration: none;
   }
-  .menu-item--link[aria-current='page'] {
-    color: var(--dsa-wc-menu-navigation-item-current-color);
-    background-color: var(
-      --dsa-wc-menu-navigation-item-current-background-color
-    );
-    font-weight: 700 !important;
-  }
-
   .menu-item.menu-item--small {
     font: var(--dsa-wc-menu-item-small-font);
     padding: var(--dsa-wc-menu-item-small-padding);

package/cdn/chunks/{chunk.WYTP4TFA.js → chunk.LEW43Y6P.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk.TUB5XL3J.js";
 import {
   LocalizeController
-} from "./chunk.VARBZAJP.js";
+} from "./chunk.BMQ5WSY7.js";
 import {
   watch
 } from "./chunk.4FQJ3QJK.js";

package/cdn/chunks/{chunk.PK4XXM66.js → chunk.LIJWOM2P.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk.V7CLIMYE.js";
 import {
   LocalizeController
-} from "./chunk.VARBZAJP.js";
+} from "./chunk.BMQ5WSY7.js";
 import {
   watch
 } from "./chunk.4FQJ3QJK.js";

package/cdn/chunks/chunk.LPB2VMCT.js

@@ -0,0 +1,74 @@
+import {
+  card_nav_styles_default
+} from "./chunk.4OAG5UWA.js";
+import {
+  HasSlotController
+} from "./chunk.YIY5RM53.js";
+import {
+  ifDefinedAndNotEmpty
+} from "./chunk.B6GVVW66.js";
+import {
+  ShoelaceElement,
+  t
+} from "./chunk.DZB6XUZ7.js";
+import {
+  x
+} from "./chunk.7HUC6BF3.js";
+import {
+  __decorateClass
+} from "./chunk.4ZGVANML.js";
+
+// src/components/card-nav/card-nav.ts
+var DSACardNav = class extends ShoelaceElement {
+  constructor() {
+    super(...arguments);
+    this.hasSlotController = new HasSlotController(
+      this,
+      "[default]",
+      "media",
+      "title-icon",
+      "title",
+      "subtitle"
+    );
+  }
+  render() {
+    return x`
+      <div part="base" class="card-nav">
+        <slot name="media" part="media" class="card-nav__media"></slot>
+        <div class="card-nav__title-block">
+          <slot
+            name="title-icon"
+            class=${ifDefinedAndNotEmpty(
+      this.hasSlotController.test("title-icon") ? "card-nav__title_icon" : void 0
+    )}
+          ></slot>
+          <div class="title-block-text">
+            <slot
+              name="title"
+              class=${ifDefinedAndNotEmpty(
+      this.hasSlotController.test("title") ? "title" : void 0
+    )}
+            ></slot>
+            <slot
+              name="subtitle"
+              class=${ifDefinedAndNotEmpty(
+      this.hasSlotController.test("subtitle") ? "subtitle" : void 0
+    )}
+            ></slot>
+          </div>
+        </div>
+        <div class="card-nav__content" role="list">
+          <slot></slot>
+        </div>
+      </div>
+    `;
+  }
+};
+DSACardNav.styles = card_nav_styles_default;
+DSACardNav = __decorateClass([
+  t("dsa-card-nav")
+], DSACardNav);
+
+export {
+  DSACardNav
+};

package/cdn/chunks/{chunk.FULHOODX.js → chunk.LZCR7P7U.js}

@@ -8,7 +8,7 @@ import {
 } from "./chunk.7OLEA3GQ.js";
 import {
   FormControlLayout
-} from "./chunk.JZOEQBF7.js";
+} from "./chunk.E73QKLNL.js";
 import {
   l
 } from "./chunk.7PPSHHT2.js";
@@ -20,7 +20,7 @@ import {
 } from "./chunk.3NWILHZZ.js";
 import {
   LocalizeController
-} from "./chunk.VARBZAJP.js";
+} from "./chunk.BMQ5WSY7.js";
 import {
   watch
 } from "./chunk.4FQJ3QJK.js";

package/cdn/chunks/{chunk.KLIZYLWG.js → chunk.M4YRRHEL.js}

@@ -6,7 +6,7 @@ import {
 } from "./chunk.6OFBSNBH.js";
 import {
   LocalizeController
-} from "./chunk.VARBZAJP.js";
+} from "./chunk.BMQ5WSY7.js";
 import {
   ifDefinedAndNotEmpty
 } from "./chunk.B6GVVW66.js";

package/cdn/chunks/{chunk.OFWHWMUH.js → chunk.MJMSFEEL.js}

@@ -15,7 +15,7 @@ import {
 } from "./chunk.2WRFDMKN.js";
 import {
   LocalizeController
-} from "./chunk.VARBZAJP.js";
+} from "./chunk.BMQ5WSY7.js";
 import {
   watch
 } from "./chunk.4FQJ3QJK.js";

package/cdn/chunks/{chunk.VI5JEKGK.js → chunk.N74GMZQD.js}

@@ -24,7 +24,7 @@ import {
 } from "./chunk.2WRFDMKN.js";
 import {
   LocalizeController
-} from "./chunk.VARBZAJP.js";
+} from "./chunk.BMQ5WSY7.js";
 import {
   watch
 } from "./chunk.4FQJ3QJK.js";

package/cdn/chunks/{chunk.2FOGPUI3.js → chunk.NMVBZ537.js}

@@ -6,7 +6,7 @@ import {
 } from "./chunk.YIY5RM53.js";
 import {
   LocalizeController
-} from "./chunk.VARBZAJP.js";
+} from "./chunk.BMQ5WSY7.js";
 import {
   o
 } from "./chunk.YQLIIKLI.js";

package/cdn/chunks/{chunk.CTMJ2DNZ.js → chunk.NOI6NFVL.js}

@@ -1,6 +1,6 @@
 import {
   DSARadioGroup
-} from "./chunk.HE5SI4A5.js";
+} from "./chunk.F6BCRVNV.js";
 import {
   FormSelectableCard
 } from "./chunk.6BPVPY42.js";

package/cdn/chunks/{chunk.E7IRWRZH.js → chunk.NUMKSKYJ.js}

@@ -9,7 +9,7 @@ import {
 } from "./chunk.YIY5RM53.js";
 import {
   LocalizeController
-} from "./chunk.VARBZAJP.js";
+} from "./chunk.BMQ5WSY7.js";
 import {
   e
 } from "./chunk.IKHG7XGO.js";

package/cdn/chunks/{chunk.FTI4C7U6.js → chunk.NYK3GS67.js}

@@ -6,7 +6,7 @@ import {
 } from "./chunk.7PPSHHT2.js";
 import {
   LocalizeController
-} from "./chunk.VARBZAJP.js";
+} from "./chunk.BMQ5WSY7.js";
 import {
   e as e2
 } from "./chunk.IKHG7XGO.js";

package/cdn/chunks/{chunk.6HLUBEKO.js → chunk.PQNNELEM.js}

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

package/cdn/chunks/{chunk.OVBLP5E4.js → chunk.PRP4B2TV.js}

@@ -18,7 +18,7 @@ import {
 } from "./chunk.2WRFDMKN.js";
 import {
   LocalizeController
-} from "./chunk.VARBZAJP.js";
+} from "./chunk.BMQ5WSY7.js";
 import {
   watch
 } from "./chunk.4FQJ3QJK.js";

package/cdn/chunks/{chunk.KYZIL6TB.js → chunk.PZQUQ6DG.js}

@@ -1,6 +1,6 @@
 import {
   DSATableRow
-} from "./chunk.GBGDDTEL.js";
+} from "./chunk.HOIWGDVX.js";
 import {
   table_header_row_styles_default
 } from "./chunk.3AD4AURN.js";

package/cdn/chunks/chunk.QCPGBCQ3.js

@@ -0,0 +1,72 @@
+import {
+  component_styles_default
+} from "./chunk.PSQJDSB2.js";
+import {
+  i
+} from "./chunk.4KHZQZ3M.js";
+
+// src/components/fieldset/fieldset.styles.ts
+var fieldset_styles_default = i`
+  ${component_styles_default}
+
+  :host {
+    display: block;
+  }
+
+  .fieldset {
+    display: flex;
+    flex-direction: column;
+    gap: var(--dsa-spacing-24);
+
+    background-color: var(--dsa-wc-fieldset-background);
+    padding: var(--dsa-spacing-24);
+    border-radius: var(--dsa-radius-8);
+    border-width: 1px;
+    border-style: solid;
+  }
+  .fieldset--on-base {
+    border-color: var(--dsa-wc-fieldset-border-color);
+  }
+  .fieldset--on-layer {
+    border-color: transparent;
+  }
+
+  .fieldset__legend {
+    display: flex;
+    flex-direction: column;
+    gap: var(--dsa-spacing-12);
+    color: var(--dsa-wc-fieldset-legend-color);
+    padding: 0;
+  }
+
+  .fieldset__first-line {
+    display: flex;
+    gap: var(--dsa-spacing-4);
+    align-items: center;
+  }
+  .fieldset__legend-title {
+    font: var(--dsa-wc-fieldset-title-font);
+  }
+  .fieldset__tooltip {
+    --dsa-wc-internal-icon-button-padding: var(--dsa-spacing-2);
+  }
+  .fieldset__legend-subtitle {
+    font: var(--dsa-font-small-normal);
+  }
+
+  .fieldset__content {
+    display: flex;
+    gap: var(--dsa-spacing-16);
+    flex-wrap: wrap;
+  }
+  .fieldset--vertical .fieldset__content {
+    flex-direction: column;
+  }
+  .fieldset--horizontal .fieldset__content {
+    flex-direction: row;
+  }
+`;
+
+export {
+  fieldset_styles_default
+};