@ds-autonomie/web-components 2.0.1 → 2.2.0

package/cdn/chunks/chunk.PS4PM6DJ.js

@@ -1,164 +0,0 @@
-import {
-  ifDefinedAndNotEmpty
-} from "./chunk.B6GVVW66.js";
-import {
-  e as e2
-} from "./chunk.IKHG7XGO.js";
-import {
-  ShoelaceElement,
-  e,
-  n,
-  r,
-  t
-} from "./chunk.DZB6XUZ7.js";
-import {
-  component_styles_default
-} from "./chunk.PSQJDSB2.js";
-import {
-  i
-} from "./chunk.4KHZQZ3M.js";
-import {
-  x
-} from "./chunk.7HUC6BF3.js";
-import {
-  __decorateClass
-} from "./chunk.4ZGVANML.js";
-
-// src/internal/components/button-group/button-group.styles.ts
-var button_group_styles_default = i`
-  ${component_styles_default}
-
-  :host {
-    display: inline-block;
-  }
-
-  .button-group {
-    display: flex;
-    flex-wrap: wrap;
-    gap: var(--dsa-spacing-8);
-  }
-
-  .button-group--squeezed {
-    gap: 0;
-  }
-
-  .button-group--vertical {
-    flex-direction: column;
-    min-width: 120px;
-    max-width: 400px;
-  }
-
-  .button-group--horizontal {
-    flex-direction: row;
-  }
-`;
-
-// src/internal/components/button-group/button-group.ts
-var DSAInternalButtonGroup = class extends ShoelaceElement {
-  constructor() {
-    super(...arguments);
-    this.disableRole = false;
-    this.label = "";
-    this.squeezed = false;
-    this.horizontal = false;
-  }
-  handleFocus(event) {
-    const button = findButton(event.target);
-    button == null ? void 0 : button.classList.add("dsa-button-group__button--focus");
-  }
-  handleBlur(event) {
-    const button = findButton(event.target);
-    button == null ? void 0 : button.classList.remove("dsa-button-group__button--focus");
-  }
-  handleMouseOver(event) {
-    const button = findButton(event.target);
-    button == null ? void 0 : button.classList.add("dsa-button-group__button--hover");
-  }
-  handleMouseOut(event) {
-    const button = findButton(event.target);
-    button == null ? void 0 : button.classList.remove("dsa-button-group__button--hover");
-  }
-  handleSlotChange() {
-    const slottedElements = [
-      ...this.defaultSlot.assignedElements({ flatten: true })
-    ];
-    slottedElements.forEach((el) => {
-      const index = slottedElements.indexOf(el);
-      const button = findButton(el);
-      if (button !== null) {
-        button.classList.add("dsa-button-group__button");
-        if (this.squeezed) {
-          button.classList.toggle(
-            "dsa-button-group__button--first",
-            index === 0
-          );
-          button.classList.toggle(
-            "dsa-button-group__button--inner",
-            index > 0 && index < slottedElements.length - 1
-          );
-          button.classList.toggle(
-            "dsa-button-group__button--last",
-            index === slottedElements.length - 1
-          );
-        }
-        button.classList.toggle(
-          "dsa-button-group__button--radio",
-          button.tagName.toLowerCase() === "dsa-radio-button"
-        );
-        button.classList.toggle(
-          "dsa-button-group__button--checkbox",
-          button.tagName.toLowerCase() === "dsa-checkbox-button"
-        );
-        button.classList.toggle(
-          "dsa-button-group__button--vertical",
-          !this.horizontal
-        );
-      }
-    });
-  }
-  render() {
-    return x`
-      <div
-        part="base"
-        class=${e2({
-      "button-group": true,
-      "button-group--squeezed": this.squeezed,
-      "button-group--vertical": !this.horizontal,
-      "button-group--horizontal": this.horizontal
-    })}
-        role="${this.disableRole ? "presentation" : "group"}"
-        aria-label=${ifDefinedAndNotEmpty(this.label)}
-        @focusout=${this.handleBlur}
-        @focusin=${this.handleFocus}
-        @mouseover=${this.handleMouseOver}
-        @mouseout=${this.handleMouseOut}
-      >
-        <slot @slotchange=${this.handleSlotChange}></slot>
-      </div>
-    `;
-  }
-};
-DSAInternalButtonGroup.styles = button_group_styles_default;
-__decorateClass([
-  e("slot")
-], DSAInternalButtonGroup.prototype, "defaultSlot", 2);
-__decorateClass([
-  r()
-], DSAInternalButtonGroup.prototype, "disableRole", 2);
-__decorateClass([
-  n()
-], DSAInternalButtonGroup.prototype, "label", 2);
-__decorateClass([
-  n({ type: Boolean })
-], DSAInternalButtonGroup.prototype, "squeezed", 2);
-__decorateClass([
-  n({ type: Boolean })
-], DSAInternalButtonGroup.prototype, "horizontal", 2);
-DSAInternalButtonGroup = __decorateClass([
-  t("dsa-internal-button-group")
-], DSAInternalButtonGroup);
-function findButton(el) {
-  var _a;
-  const selector = "dsa-button, dsa-radio-button, dsa-checkbox-button, dsa-pagination-button";
-  return (_a = el.closest(selector)) != null ? _a : el.querySelector(selector);
-}

package/dist/chunks/chunk.2T66U3QC.js

@@ -1,270 +0,0 @@
-import {
-  component_styles_default
-} from "./chunk.TUVJKY7S.js";
-
-// src/components/header-search/header-search.styles.ts
-import { css } from "lit";
-var header_search_styles_default = css`
-  ${component_styles_default}
-
-  :host {
-    display: flex;
-    align-items: center;
-    justify-content: flex-end;
-    gap: var(--dsa-spacing-8);
-    flex: 1;
-    width: 100%;
-  }
-
-  .mobile {
-    display: block;
-  }
-  .desktop {
-    display: none;
-  }
-
-  /* Input */
-  .input {
-    position: relative;
-    display: inline-flex;
-    flex-direction: row;
-    align-items: center;
-    vertical-align: middle;
-    width: 100%;
-    min-width: 0;
-    font: var(--dsa-wc-input-text-field-font);
-    border-bottom: 1px solid var(--dsa-wc-header-search-input-color);
-  }
-
-  .input--focused {
-    outline: var(--dsa-wc-focus-ring);
-    outline-offset: var(--dsa-wc-focus-ring-offset);
-  }
-
-  .input__control {
-    display: inline-flex;
-    flex-direction: row;
-    flex: 1 1 auto;
-    font-family: inherit;
-    font-weight: inherit;
-    min-width: 0;
-    height: 100%;
-    border: none;
-    background: none;
-    box-shadow: none;
-    margin: 0;
-    cursor: inherit;
-    -webkit-appearance: none;
-    color: var(--dsa-wc-header-search-input-color);
-
-    font-size: 14px;
-    padding: 8px 0 8px 8px;
-    height: 34px;
-  }
-
-  .input__control::placeholder {
-    color: var(--dsa-wc-input-on-layer-text-field-placeholder-color);
-    opacity: 1;
-  }
-
-  .input__control::-webkit-search-decoration,
-  .input__control::-webkit-search-cancel-button,
-  .input__control::-webkit-search-results-button,
-  .input__control::-webkit-search-results-decoration {
-    -webkit-appearance: none;
-  }
-  .input__control:focus {
-    outline: none;
-  }
-
-  /* Buttons */
-  .button {
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    border-style: solid;
-    border-width: var(--dsa-wc-button-border-width);
-    border-radius: var(--dsa-wc-button-border-radius);
-    text-decoration: none;
-    user-select: none;
-    white-space: nowrap;
-    vertical-align: middle;
-    padding: 0 var(--dsa-wc-button-padding-horizontal);
-    transition: var(--dsa-wc-transition-x-fast) background-color,
-      var(--dsa-wc-transition-x-fast) color,
-      var(--dsa-wc-transition-x-fast) border,
-      var(--dsa-wc-transition-x-fast) box-shadow;
-    cursor: pointer;
-  }
-  .button::-moz-focus-inner {
-    border: 0;
-  }
-  .button:focus {
-    outline: none;
-  }
-  .button:focus-visible {
-    outline: var(--dsa-wc-focus-ring);
-    outline-offset: var(--dsa-wc-focus-ring-offset);
-  }
-
-  .button--tertiary {
-    padding: 0;
-  }
-  .button--tertiary {
-    background-color: var(--dsa-wc-button-tertiary-on-base-color);
-    border: none;
-    color: var(--dsa-wc-button-tertiary-on-base-font-color);
-  }
-  .button--tertiary:hover {
-    background-color: var(--dsa-wc-button-tertiary-on-base-hover-color);
-    color: var(--dsa-wc-button-tertiary-on-base-hover-font-color);
-  }
-  .button--tertiary:active {
-    background-color: var(--dsa-wc-button-tertiary-on-base-active-color);
-    color: var(--dsa-wc-button-tertiary-on-base-active-font-color);
-  }
-  .button--navigation {
-    padding: 0;
-  }
-  .button--navigation {
-    background-color: var(--dsa-wc-button-navigation-on-base-color);
-    border-color: transparent;
-    color: var(--dsa-wc-button-navigation-on-base-font-color);
-  }
-  .button--navigation:hover {
-    background-color: var(--dsa-wc-button-navigation-on-base-hover-color);
-    border-color: transparent;
-    color: var(--dsa-wc-button-navigation-on-base-hover-font-color);
-  }
-  .button--navigation:active {
-    background-color: var(--dsa-wc-button-navigation-on-base-active-color);
-    border-color: transparent;
-    color: var(--dsa-wc-button-navigation-on-base-active-font-color);
-  }
-
-  .icon-button {
-    flex: 0 0 auto;
-    display: flex;
-    align-items: center;
-    border: none;
-    border-radius: var(--dsa-wc-icon-button-border-radius);
-    font-size: inherit;
-    padding: var(
-      --dsa-wc-internal-icon-button-padding,
-      var(--dsa-wc-icon-button-padding)
-    );
-    cursor: pointer;
-    transition: var(--dsa-wc-transition-x-fast) color;
-    -webkit-appearance: none;
-  }
-  .icon-button:focus {
-    outline: none;
-  }
-  .icon-button:focus-visible {
-    outline: var(--dsa-wc-focus-ring);
-    outline-offset: var(--dsa-wc-focus-ring-offset);
-    border-radius: var(--dsa-wc-focus-ring-radius);
-  }
-
-  .icon-button--primary {
-    background-color: var(--dsa-wc-button-primary-on-base-color);
-    border-color: var(--dsa-wc-button-primary-on-base-color);
-    color: var(--dsa-wc-button-primary-on-base-font-color);
-  }
-  .icon-button--primary:hover:not(.icon-button--disabled) {
-    background-color: var(--dsa-wc-button-primary-on-base-hover-color);
-    border-color: var(--dsa-wc-button-primary-on-base-hover-color);
-    color: var(--dsa-wc-button-primary-on-base-hover-font-color);
-  }
-  .icon-button--primary:active:not(.icon-button--disabled) {
-    background-color: var(--dsa-wc-button-primary-on-base-active-color);
-    border-color: var(--dsa-wc-button-primary-on-base-active-color);
-    color: var(--dsa-wc-button-primary-on-base-active-font-color);
-  }
-
-  #expand-button {
-    font: var(--dsa-wc-button-font);
-    height: var(--dsa-wc-form-input-height);
-    line-height: calc(
-      var(--dsa-wc-form-input-height) - var(--dsa-wc-button-border-width) * 2
-    );
-    padding: var(
-      --dsa-wc-internal-icon-button-padding,
-      var(--dsa-wc-icon-button-padding)
-    );
-  }
-  #expand-button dsa-icon {
-    width: 20px;
-    height: 20px;
-    pointer-events: none;
-  }
-  .expand-button__label {
-    display: none;
-  }
-
-  #submit-button dsa-icon {
-    width: 20px;
-    height: 20px;
-    pointer-events: none;
-  }
-
-  #cancel-button {
-    font: var(--dsa-wc-button-font-small);
-    height: var(--dsa-wc-form-input-height-small);
-    line-height: calc(
-      var(--dsa-wc-form-input-height-small) - var(--dsa-wc-button-border-width) *
-        2
-    );
-    border-radius: var(--dsa-wc-button-border-radius);
-    margin-inline-start: var(--dsa-spacing-8);
-  }
-
-  @media screen and (min-width: 720px) {
-    :host {
-      gap: var(--dsa-spacing-16);
-    }
-
-    .mobile {
-      display: none;
-    }
-    .desktop {
-      display: block;
-    }
-
-    .input__control {
-      font: var(--dsa-wc-header-search-input-font);
-      height: 40px;
-    }
-
-    #expand-button {
-      padding: unset;
-    }
-    #expand-button dsa-icon {
-      width: 1em;
-      height: 1em;
-      margin-inline-end: var(--dsa-wc-button-icon-spacing);
-    }
-    .expand-button__label {
-      display: unset;
-    }
-
-    #submit-button dsa-icon {
-      width: 24px;
-      height: 24px;
-    }
-
-    #cancel-button {
-      font: var(--dsa-wc-button-font);
-      height: var(--dsa-wc-form-input-height);
-      line-height: calc(
-        var(--dsa-wc-form-input-height) - var(--dsa-wc-button-border-width) * 2
-      );
-      border-radius: var(--dsa-wc-button-border-radius);
-      margin-inline-start: 0;
-    }
-  }
-`;
-
-export {
-  header_search_styles_default
-};

package/dist/chunks/chunk.AYDVF4T3.js

@@ -1,157 +0,0 @@
-import {
-  ifDefinedAndNotEmpty
-} from "./chunk.ZQJVCRB2.js";
-import {
-  ShoelaceElement
-} from "./chunk.XZ5FE34T.js";
-import {
-  component_styles_default
-} from "./chunk.TUVJKY7S.js";
-import {
-  __decorateClass
-} from "./chunk.S3NI7NKU.js";
-
-// src/internal/components/button-group/button-group.ts
-import { html } from "lit";
-import { customElement, property, query, state } from "lit/decorators.js";
-import { classMap } from "lit/directives/class-map.js";
-
-// src/internal/components/button-group/button-group.styles.ts
-import { css } from "lit";
-var button_group_styles_default = css`
-  ${component_styles_default}
-
-  :host {
-    display: inline-block;
-  }
-
-  .button-group {
-    display: flex;
-    flex-wrap: wrap;
-    gap: var(--dsa-spacing-8);
-  }
-
-  .button-group--squeezed {
-    gap: 0;
-  }
-
-  .button-group--vertical {
-    flex-direction: column;
-    min-width: 120px;
-    max-width: 400px;
-  }
-
-  .button-group--horizontal {
-    flex-direction: row;
-  }
-`;
-
-// src/internal/components/button-group/button-group.ts
-var DSAInternalButtonGroup = class extends ShoelaceElement {
-  constructor() {
-    super(...arguments);
-    this.disableRole = false;
-    this.label = "";
-    this.squeezed = false;
-    this.horizontal = false;
-  }
-  handleFocus(event) {
-    const button = findButton(event.target);
-    button == null ? void 0 : button.classList.add("dsa-button-group__button--focus");
-  }
-  handleBlur(event) {
-    const button = findButton(event.target);
-    button == null ? void 0 : button.classList.remove("dsa-button-group__button--focus");
-  }
-  handleMouseOver(event) {
-    const button = findButton(event.target);
-    button == null ? void 0 : button.classList.add("dsa-button-group__button--hover");
-  }
-  handleMouseOut(event) {
-    const button = findButton(event.target);
-    button == null ? void 0 : button.classList.remove("dsa-button-group__button--hover");
-  }
-  handleSlotChange() {
-    const slottedElements = [
-      ...this.defaultSlot.assignedElements({ flatten: true })
-    ];
-    slottedElements.forEach((el) => {
-      const index = slottedElements.indexOf(el);
-      const button = findButton(el);
-      if (button !== null) {
-        button.classList.add("dsa-button-group__button");
-        if (this.squeezed) {
-          button.classList.toggle(
-            "dsa-button-group__button--first",
-            index === 0
-          );
-          button.classList.toggle(
-            "dsa-button-group__button--inner",
-            index > 0 && index < slottedElements.length - 1
-          );
-          button.classList.toggle(
-            "dsa-button-group__button--last",
-            index === slottedElements.length - 1
-          );
-        }
-        button.classList.toggle(
-          "dsa-button-group__button--radio",
-          button.tagName.toLowerCase() === "dsa-radio-button"
-        );
-        button.classList.toggle(
-          "dsa-button-group__button--checkbox",
-          button.tagName.toLowerCase() === "dsa-checkbox-button"
-        );
-        button.classList.toggle(
-          "dsa-button-group__button--vertical",
-          !this.horizontal
-        );
-      }
-    });
-  }
-  render() {
-    return html`
-      <div
-        part="base"
-        class=${classMap({
-      "button-group": true,
-      "button-group--squeezed": this.squeezed,
-      "button-group--vertical": !this.horizontal,
-      "button-group--horizontal": this.horizontal
-    })}
-        role="${this.disableRole ? "presentation" : "group"}"
-        aria-label=${ifDefinedAndNotEmpty(this.label)}
-        @focusout=${this.handleBlur}
-        @focusin=${this.handleFocus}
-        @mouseover=${this.handleMouseOver}
-        @mouseout=${this.handleMouseOut}
-      >
-        <slot @slotchange=${this.handleSlotChange}></slot>
-      </div>
-    `;
-  }
-};
-DSAInternalButtonGroup.styles = button_group_styles_default;
-__decorateClass([
-  query("slot")
-], DSAInternalButtonGroup.prototype, "defaultSlot", 2);
-__decorateClass([
-  state()
-], DSAInternalButtonGroup.prototype, "disableRole", 2);
-__decorateClass([
-  property()
-], DSAInternalButtonGroup.prototype, "label", 2);
-__decorateClass([
-  property({ type: Boolean })
-], DSAInternalButtonGroup.prototype, "squeezed", 2);
-__decorateClass([
-  property({ type: Boolean })
-], DSAInternalButtonGroup.prototype, "horizontal", 2);
-DSAInternalButtonGroup = __decorateClass([
-  customElement("dsa-internal-button-group")
-], DSAInternalButtonGroup);
-function findButton(el) {
-  var _a;
-  const selector = "dsa-button, dsa-radio-button, dsa-checkbox-button, dsa-pagination-button";
-  return (_a = el.closest(selector)) != null ? _a : el.querySelector(selector);
-}

package/dist/chunks/chunk.ESYJVRG3.js

@@ -1,129 +0,0 @@
-// src/components/input-phone/input-phone.utils.ts
-import { html } from "lit";
-var frenchNumberPrefix = [
-  "+33",
-  "+262",
-  "+508",
-  "+590",
-  "+594",
-  "+596",
-  "+681",
-  "+687",
-  "+689"
-];
-var phonePrefixOptions = [
-  { value: "+33", label: "fr_FR" },
-  { value: "+590", label: "fr_GP" },
-  { value: "+594", label: "fr_GF" },
-  { value: "+596", label: "fr_MQ" },
-  { value: "+687", label: "fr_NC" },
-  { value: "+689", label: "fr_PF" },
-  { value: "+508", label: "fr_PM" },
-  { value: "+262", label: "fr_RE" },
-  { value: "+681", label: "fr_WF" }
-];
-var frenchFlagSelect = html`<svg
-  slot="prefix"
-  xmlns="http://www.w3.org/2000/svg"
-  width="28"
-  height="20"
-  fill="none"
-  aria-hidden="true"
->
-  <rect
-    width="27.5"
-    height="19.5"
-    x=".25"
-    y=".25"
-    fill="#fff"
-    stroke="#F5F5F5"
-    stroke-width=".5"
-    rx="1.75"
-  />
-  <mask
-    id="mask0_16382_21057"
-    width="28"
-    height="20"
-    x="0"
-    y="0"
-    maskUnits="userSpaceOnUse"
-    style="mask-type:luminance"
-  >
-    <rect
-      width="27.5"
-      height="19.5"
-      x=".25"
-      y=".25"
-      fill="#fff"
-      stroke="#fff"
-      stroke-width=".5"
-      rx="1.75"
-    />
-  </mask>
-  <g mask="url(#mask0_16382_21057)">
-    <path fill="#F44653" d="M18.666 0h9.333v20h-9.333z" />
-    <path
-      fill="#1035BB"
-      fill-rule="evenodd"
-      d="M0 20h9.333V0H0v20Z"
-      clip-rule="evenodd"
-    />
-  </g>
-</svg>`;
-var frenchFlagOption = (id) => html`<svg
-  slot="prefix"
-  xmlns="http://www.w3.org/2000/svg"
-  width="14"
-  height="15"
-  fill="none"
-  aria-hidden="true"
->
-  <g clip-path=${`url(#clip${id})`}>
-    <rect
-      width="13.5"
-      height="13.5"
-      x=".25"
-      y=".75"
-      fill="#fff"
-      stroke="#F5F5F5"
-      stroke-width=".5"
-      rx="1.75"
-    />
-    <mask
-      id=${`mask${id}`}
-      width="14"
-      height="15"
-      x="0"
-      y="0"
-      maskUnits="userSpaceOnUse"
-      style="mask-type:luminance"
-    >
-      <rect
-        width="13.5"
-        height="13.5"
-        x=".25"
-        y=".75"
-        fill="#fff"
-        stroke="#fff"
-        stroke-width=".5"
-        rx="1.75"
-      />
-    </mask>
-    <g mask=${`url(#mask${id})`}>
-      <path fill="#F44653" d="M9.334.5h4.667v14H9.334z" />
-      <path
-        fill="#1035BB"
-        fill-rule="evenodd"
-        d="M0 14.5h4.667V.5H0v14Z"
-        clip-rule="evenodd"
-      />
-    </g>
-  </g>
-</svg>`;
-
-export {
-  frenchNumberPrefix,
-  phonePrefixOptions,
-  frenchFlagSelect,
-  frenchFlagOption
-};