@ds-autonomie/web-components 1.0.1

package/dist/components/mutation-observer/mutation-observer.d.ts

@@ -0,0 +1,44 @@
+import type { CSSResultGroup } from 'lit';
+import { ShoelaceElement } from '../../internal/shoelace-element';
+/**
+ * @summary The Mutation Observer component offers a thin, declarative interface to the [`MutationObserver API`](https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver).
+ * @documentation https://shoelace.style/components/mutation-observer
+ * @status stable
+ * @since 2.0
+ *
+ * @event {{ mutationList: MutationRecord[] }} dsa-mutation - Emitted when a mutation occurs.
+ *
+ * @slot - The content to watch for mutations.
+ */
+export default class DSAMutationObserver extends ShoelaceElement {
+    static styles: CSSResultGroup;
+    private mutationObserver;
+    /**
+     * Watches for changes to attributes. To watch only specific attributes, separate them by a space, e.g.
+     * `attr="class id title"`. To watch all attributes, use `*`.
+     */
+    attr: string;
+    /** Indicates whether or not the attribute's previous value should be recorded when monitoring changes. */
+    attrOldValue: boolean;
+    /** Watches for changes to the character data contained within the node. */
+    charData: boolean;
+    /** Indicates whether or not the previous value of the node's text should be recorded. */
+    charDataOldValue: boolean;
+    /** Watches for the addition or removal of new child nodes. */
+    childList: boolean;
+    /** Disables the observer. */
+    disabled: boolean;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    private handleMutation;
+    private startObserver;
+    private stopObserver;
+    handleDisabledChange(): void;
+    handleChange(): void;
+    render(): import("lit").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'dsa-mutation-observer': DSAMutationObserver;
+    }
+}

package/dist/components/mutation-observer/mutation-observer.js

@@ -0,0 +1,11 @@
+import {
+  DSAMutationObserver
+} from "../../chunks/chunk.AR5HJD7F.js";
+import "../../chunks/chunk.YZHDFJWJ.js";
+import "../../chunks/chunk.D7CATJYB.js";
+import "../../chunks/chunk.YCXTCVAZ.js";
+import "../../chunks/chunk.TUVJKY7S.js";
+import "../../chunks/chunk.6M63UXML.js";
+export {
+  DSAMutationObserver as default
+};

package/dist/components/mutation-observer/mutation-observer.styles.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("lit").CSSResult;
+export default _default;

package/dist/components/mutation-observer/mutation-observer.styles.js

@@ -0,0 +1,8 @@
+import {
+  mutation_observer_styles_default
+} from "../../chunks/chunk.YZHDFJWJ.js";
+import "../../chunks/chunk.TUVJKY7S.js";
+import "../../chunks/chunk.6M63UXML.js";
+export {
+  mutation_observer_styles_default as default
+};

package/dist/components/option/option.d.ts

@@ -0,0 +1,50 @@
+import type { CSSResultGroup } from 'lit';
+import { ShoelaceElement } from '../../internal/shoelace-element';
+import '../icon/icon';
+/**
+ * @summary Options define the selectable items within various form controls such as [select](/components/select).
+ * @documentation https://dsa.service-public-autonomie.fr/062dac5f6/p/268fe4-option
+ *
+ * @dependency dsa-icon
+ *
+ * @slot - The option's label.
+ * @slot prefix - Used to prepend an icon or similar element to the menu item.
+ * @slot suffix - Used to append an icon or similar element to the menu item.
+ */
+export default class DSAOption extends ShoelaceElement {
+    static styles: CSSResultGroup;
+    private cachedTextLabel;
+    private readonly localize;
+    defaultSlot: HTMLSlotElement;
+    current: boolean;
+    selected: boolean;
+    hasHover: boolean;
+    /**
+     * The option's value. When selected, the containing form control will receive this value. The value must be unique
+     * from other options in the same group. Values may not contain spaces, as spaces are used as delimiters when listing
+     * multiple values.
+     */
+    value: string;
+    /** Draws the option in a disabled state, preventing selection. */
+    disabled: boolean;
+    /** The option's size. */
+    size: 'small' | 'medium' | 'large';
+    /** Indicates whether the input should be in error state */
+    error: boolean;
+    connectedCallback(): void;
+    private handleDefaultSlotChange;
+    private handleMouseEnter;
+    private handleMouseLeave;
+    handleDisabledChange(): void;
+    handleSelectedChange(): void;
+    handleErrorChange(): void;
+    handleValueChange(): void;
+    /** Returns a plain text label based on the option's content. */
+    getTextLabel(): string;
+    render(): import("lit").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'dsa-option': DSAOption;
+    }
+}

package/dist/components/option/option.js

@@ -0,0 +1,20 @@
+import {
+  DSAOption
+} from "../../chunks/chunk.7NWAYDYI.js";
+import "../../chunks/chunk.HH63FIEF.js";
+import "../../chunks/chunk.5XL2LZLC.js";
+import "../../chunks/chunk.G7AELPSO.js";
+import "../../chunks/chunk.LMJPQPQT.js";
+import "../../chunks/chunk.7J7CS3BK.js";
+import "../../chunks/chunk.RDGMZ5XB.js";
+import "../../chunks/chunk.I33L3NO6.js";
+import "../../chunks/chunk.23TOS4ZE.js";
+import "../../chunks/chunk.XNEONNEJ.js";
+import "../../chunks/chunk.FDYFSRSX.js";
+import "../../chunks/chunk.D7CATJYB.js";
+import "../../chunks/chunk.YCXTCVAZ.js";
+import "../../chunks/chunk.TUVJKY7S.js";
+import "../../chunks/chunk.6M63UXML.js";
+export {
+  DSAOption as default
+};

package/dist/components/option/option.styles.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("lit").CSSResult;
+export default _default;

package/dist/components/option/option.styles.js

@@ -0,0 +1,8 @@
+import {
+  option_styles_default
+} from "../../chunks/chunk.HH63FIEF.js";
+import "../../chunks/chunk.TUVJKY7S.js";
+import "../../chunks/chunk.6M63UXML.js";
+export {
+  option_styles_default as default
+};

package/dist/components/popup/popup.d.ts

@@ -0,0 +1,123 @@
+import type { CSSResultGroup } from 'lit';
+import { ShoelaceElement } from '../../internal/shoelace-element';
+/**
+ * @summary Popup is a utility that lets you declaratively anchor "popup" containers to another element.
+ * @documentation https://shoelace.style/components/popup
+ *
+ * @event dsa-reposition - Emitted when the popup is repositioned. This event can fire a lot, so avoid putting expensive
+ *  operations in your listener or consider debouncing it.
+ *
+ * @slot - The popup's content.
+ * @slot anchor - The element the popup will be anchored to. If the anchor lives outside of the popup, you can use the
+ *  `anchor` attribute or property instead.
+ */
+export default class DSAPopup extends ShoelaceElement {
+    static styles: CSSResultGroup;
+    private anchorEl;
+    private cleanup;
+    /** A reference to the internal popup container. Useful for animating and styling the popup with JavaScript. */
+    popup: HTMLElement;
+    private arrowEl;
+    /**
+     * The element the popup will be anchored to. If the anchor lives outside of the popup, you can provide its `id` or a
+     * reference to it here. If the anchor lives inside the popup, use the `anchor` slot instead.
+     */
+    anchor: Element | string;
+    /**
+     * Activates the positioning logic and shows the popup. When this attribute is removed, the positioning logic is torn
+     * down and the popup will be hidden.
+     */
+    active: boolean;
+    /**
+     * The preferred placement of the popup. Note that the actual placement will vary as configured to keep the
+     * panel inside of the viewport.
+     */
+    placement: 'top' | 'top-start' | 'top-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'right' | 'right-start' | 'right-end' | 'left' | 'left-start' | 'left-end';
+    /**
+     * Determines how the popup is positioned. The `absolute` strategy works well in most cases, but if overflow is
+     * clipped, using a `fixed` position strategy can often workaround it.
+     */
+    strategy: 'absolute' | 'fixed';
+    /** The distance in pixels from which to offset the panel away from its anchor. */
+    distance: number;
+    /** The distance in pixels from which to offset the panel along its anchor. */
+    skidding: number;
+    /**
+     * Attaches an arrow to the popup. The arrow's size and color can be customized using the `--arrow-size` and
+     * `--arrow-color` custom properties. For additional customizations, you can also target the arrow using
+     * `::part(arrow)` in your stylesheet.
+     */
+    arrow: boolean;
+    /**
+     * The placement of the arrow. The default is `anchor`, which will align the arrow as close to the center of the
+     * anchor as possible, considering available space and `arrow-padding`. A value of `start`, `end`, or `center` will
+     * align the arrow to the start, end, or center of the popover instead.
+     */
+    arrowPlacement: 'start' | 'end' | 'center' | 'anchor';
+    /**
+     * The amount of padding between the arrow and the edges of the popup. If the popup has a border-radius, for example,
+     * this will prevent it from overflowing the corners.
+     */
+    arrowPadding: number;
+    /**
+     * When set, placement of the popup will flip to the opposite site to keep it in view. You can use
+     * `flipFallbackPlacements` to further configure how the fallback placement is determined.
+     */
+    flip: boolean;
+    /**
+     * If the preferred placement doesn't fit, popup will be tested in these fallback placements until one fits. Must be a
+     * string of any number of placements separated by a space, e.g. "top bottom left". If no placement fits, the flip
+     * fallback strategy will be used instead.
+     * */
+    flipFallbackPlacements: string;
+    /**
+     * When neither the preferred placement nor the fallback placements fit, this value will be used to determine whether
+     * the popup should be positioned using the best available fit based on available space or as it was initially
+     * preferred.
+     */
+    flipFallbackStrategy: 'best-fit' | 'initial';
+    /**
+     * The flip boundary describes clipping element(s) that overflow will be checked relative to when flipping. By
+     * default, the boundary includes overflow ancestors that will cause the element to be clipped. If needed, you can
+     * change the boundary by passing a reference to one or more elements to this property.
+     */
+    flipBoundary: Element | Element[];
+    /** The amount of padding, in pixels, to exceed before the flip behavior will occur. */
+    flipPadding: number;
+    /** Moves the popup along the axis to keep it in view when clipped. */
+    shift: boolean;
+    /**
+     * The shift boundary describes clipping element(s) that overflow will be checked relative to when shifting. By
+     * default, the boundary includes overflow ancestors that will cause the element to be clipped. If needed, you can
+     * change the boundary by passing a reference to one or more elements to this property.
+     */
+    shiftBoundary: Element | Element[];
+    /** The amount of padding, in pixels, to exceed before the shift behavior will occur. */
+    shiftPadding: number;
+    /** When set, this will cause the popup to automatically resize itself to prevent it from overflowing. */
+    autoSize: 'horizontal' | 'vertical' | 'both';
+    /** Syncs the popup's width or height to that of the anchor element. */
+    sync: 'width' | 'height' | 'both';
+    /**
+     * The auto-size boundary describes clipping element(s) that overflow will be checked relative to when resizing. By
+     * default, the boundary includes overflow ancestors that will cause the element to be clipped. If needed, you can
+     * change the boundary by passing a reference to one or more elements to this property.
+     */
+    autoSizeBoundary: Element | Element[];
+    /** The amount of padding, in pixels, to exceed before the auto-size behavior will occur. */
+    autoSizePadding: number;
+    connectedCallback(): Promise<void>;
+    disconnectedCallback(): void;
+    updated(changedProps: Map<string, unknown>): Promise<void>;
+    private handleAnchorChange;
+    private start;
+    private stop;
+    /** Forces the popup to recalculate and reposition itself. */
+    reposition(): void;
+    render(): import("lit").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'dsa-popup': DSAPopup;
+    }
+}

package/dist/components/popup/popup.js

@@ -0,0 +1,10 @@
+import {
+  DSAPopup
+} from "../../chunks/chunk.ENKP2IFW.js";
+import "../../chunks/chunk.6PS5KB3O.js";
+import "../../chunks/chunk.YCXTCVAZ.js";
+import "../../chunks/chunk.TUVJKY7S.js";
+import "../../chunks/chunk.6M63UXML.js";
+export {
+  DSAPopup as default
+};

package/dist/components/popup/popup.styles.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("lit").CSSResult;
+export default _default;

package/dist/components/popup/popup.styles.js

@@ -0,0 +1,8 @@
+import {
+  popup_styles_default
+} from "../../chunks/chunk.6PS5KB3O.js";
+import "../../chunks/chunk.TUVJKY7S.js";
+import "../../chunks/chunk.6M63UXML.js";
+export {
+  popup_styles_default as default
+};

package/dist/components/progress-bar/progress-bar.d.ts

@@ -0,0 +1,23 @@
+import type { CSSResultGroup } from 'lit';
+import { ShoelaceElement } from '../../internal/shoelace-element';
+/**
+ * @summary Progress bars are used to show the status of an ongoing operation.
+ * @documentation https://shoelace.style/components/progress-bar
+ *
+ */
+export default class DSAProgressBar extends ShoelaceElement {
+    static styles: CSSResultGroup;
+    private readonly localize;
+    /** The current progress as a percentage, 0 to 100. */
+    value: number;
+    /** When true, percentage is ignored, the label is hidden, and the progress bar is drawn in an indeterminate state. */
+    indeterminate: boolean;
+    /** A custom label for assistive devices. */
+    label: string;
+    render(): import("lit").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'dsa-progress-bar': DSAProgressBar;
+    }
+}

package/dist/components/progress-bar/progress-bar.js

@@ -0,0 +1,11 @@
+import {
+  DSAProgressBar
+} from "../../chunks/chunk.4XT2OJD2.js";
+import "../../chunks/chunk.SGIGGO5M.js";
+import "../../chunks/chunk.5XL2LZLC.js";
+import "../../chunks/chunk.YCXTCVAZ.js";
+import "../../chunks/chunk.TUVJKY7S.js";
+import "../../chunks/chunk.6M63UXML.js";
+export {
+  DSAProgressBar as default
+};

package/dist/components/progress-bar/progress-bar.styles.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("lit").CSSResult;
+export default _default;

package/dist/components/progress-bar/progress-bar.styles.js

@@ -0,0 +1,8 @@
+import {
+  progress_bar_styles_default
+} from "../../chunks/chunk.SGIGGO5M.js";
+import "../../chunks/chunk.TUVJKY7S.js";
+import "../../chunks/chunk.6M63UXML.js";
+export {
+  progress_bar_styles_default as default
+};

package/dist/components/progress-ring/progress-ring.d.ts

@@ -0,0 +1,25 @@
+import type { CSSResultGroup } from 'lit';
+import { ShoelaceElement } from '../../internal/shoelace-element';
+/**
+ * @summary Progress rings are used to show the progress of a determinate operation in a circular fashion.
+ * @documentation https://shoelace.style/components/progress-ring
+ */
+export default class DSAProgressRing extends ShoelaceElement {
+    static styles: CSSResultGroup;
+    private readonly localize;
+    indicator: SVGCircleElement;
+    indicatorOffset: string;
+    /** The current progress as a percentage, 0 to 100. */
+    value: number;
+    /** A custom label for assistive devices. */
+    label: string;
+    /** The progress-ring's size. */
+    size: 'small' | 'medium';
+    updated(changedProps: Map<string, unknown>): void;
+    render(): import("lit").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'dsa-progress-ring': DSAProgressRing;
+    }
+}

package/dist/components/progress-ring/progress-ring.js

@@ -0,0 +1,11 @@
+import {
+  DSAProgressRing
+} from "../../chunks/chunk.ODSCDJDO.js";
+import "../../chunks/chunk.EU56EW33.js";
+import "../../chunks/chunk.5XL2LZLC.js";
+import "../../chunks/chunk.YCXTCVAZ.js";
+import "../../chunks/chunk.TUVJKY7S.js";
+import "../../chunks/chunk.6M63UXML.js";
+export {
+  DSAProgressRing as default
+};

package/dist/components/progress-ring/progress-ring.styles.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("lit").CSSResult;
+export default _default;

package/dist/components/progress-ring/progress-ring.styles.js

@@ -0,0 +1,8 @@
+import {
+  progress_ring_styles_default
+} from "../../chunks/chunk.EU56EW33.js";
+import "../../chunks/chunk.TUVJKY7S.js";
+import "../../chunks/chunk.6M63UXML.js";
+export {
+  progress_ring_styles_default as default
+};

package/dist/components/radio/radio.d.ts

@@ -0,0 +1,46 @@
+import type { CSSResultGroup } from 'lit';
+import { ShoelaceElement } from '../../internal/shoelace-element';
+import '../icon/icon';
+/**
+ * @summary Radios allow the user to select a single option from a group.
+ * @documentation https://dsa.service-public-autonomie.fr/062dac5f6/p/648e96-radio
+ *
+ * @dependency dsa-icon
+ *
+ * @slot - The radio's label.
+ *
+ * @event dsa-blur - Emitted when the control loses focus.
+ * @event dsa-focus - Emitted when the control gains focus.
+ *
+
+ */
+export default class DSARadio extends ShoelaceElement {
+    static styles: CSSResultGroup;
+    checked: boolean;
+    protected hasFocus: boolean;
+    /** The radio's value. When selected, the radio group will receive this value. */
+    value: string;
+    /** The radio's size. */
+    size: 'small' | 'medium' | 'large';
+    /** Disables the radio. */
+    disabled: boolean;
+    /** Indicates whether the radio should be in error state */
+    error: boolean;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    private addEventListeners;
+    private removeEventListeners;
+    private handleBlur;
+    private handleClick;
+    private handleFocus;
+    private setInitialAttributes;
+    handleCheckedChange(): void;
+    handleDisabledChange(): void;
+    handleErrorChange(): void;
+    render(): import("lit").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'dsa-radio': DSARadio;
+    }
+}

package/dist/components/radio/radio.js

@@ -0,0 +1,19 @@
+import {
+  DSARadio
+} from "../../chunks/chunk.JETXIC4F.js";
+import "../../chunks/chunk.VFYKLPN2.js";
+import "../../chunks/chunk.G7AELPSO.js";
+import "../../chunks/chunk.LMJPQPQT.js";
+import "../../chunks/chunk.7J7CS3BK.js";
+import "../../chunks/chunk.RDGMZ5XB.js";
+import "../../chunks/chunk.I33L3NO6.js";
+import "../../chunks/chunk.23TOS4ZE.js";
+import "../../chunks/chunk.XNEONNEJ.js";
+import "../../chunks/chunk.FDYFSRSX.js";
+import "../../chunks/chunk.D7CATJYB.js";
+import "../../chunks/chunk.YCXTCVAZ.js";
+import "../../chunks/chunk.TUVJKY7S.js";
+import "../../chunks/chunk.6M63UXML.js";
+export {
+  DSARadio as default
+};

package/dist/components/radio/radio.styles.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("lit").CSSResult;
+export default _default;

package/dist/components/radio/radio.styles.js

@@ -0,0 +1,8 @@
+import {
+  radio_styles_default
+} from "../../chunks/chunk.VFYKLPN2.js";
+import "../../chunks/chunk.TUVJKY7S.js";
+import "../../chunks/chunk.6M63UXML.js";
+export {
+  radio_styles_default as default
+};

package/dist/components/radio-button/radio-button.d.ts

@@ -0,0 +1,47 @@
+import type { CSSResultGroup } from 'lit';
+import { ShoelaceElement } from '../../internal/shoelace-element';
+/**
+ * @summary Radios buttons allow the user to select a single option from a group using a button-like control.
+ * @documentation https://dsa.service-public-autonomie.fr/062dac5f6/p/886fd5-radio-button
+ *
+ * @slot - The radio button's label.
+ *
+ * @event dsa-blur - Emitted when the button loses focus.
+ * @event dsa-focus - Emitted when the button gains focus.
+ */
+export default class DSARadioButton extends ShoelaceElement {
+    static styles: CSSResultGroup;
+    private readonly hasSlotController;
+    button: HTMLInputElement;
+    hiddenInput: HTMLInputElement;
+    protected hasFocus: boolean;
+    /**
+     * @internal The radio button's checked state. This is exposed as an "internal" attribute so we can reflect it, making
+     * it easier to style in button groups.
+     */
+    checked: boolean;
+    /** The radio's value. When selected, the radio group will receive this value. */
+    value: string;
+    /** Disables the radio button. */
+    disabled: boolean;
+    /** The radio button's size. */
+    size: 'small' | 'medium' | 'large';
+    /** Sets the radio button in readonly. */
+    readonly: false;
+    connectedCallback(): void;
+    private handleBlur;
+    private handleClick;
+    private handleFocus;
+    handleDisabledChange(): void;
+    handleReadonlyChange(): void;
+    /** Sets focus on the radio button. */
+    focus(options?: FocusOptions): void;
+    /** Removes focus from the radio button. */
+    blur(): void;
+    render(): import("lit").TemplateResult<1 | 2>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'dsa-radio-button': DSARadioButton;
+    }
+}

package/dist/components/radio-button/radio-button.js

@@ -0,0 +1,13 @@
+import {
+  DSARadioButton
+} from "../../chunks/chunk.42W4S2HN.js";
+import "../../chunks/chunk.DC6CT5PU.js";
+import "../../chunks/chunk.J2XNYTTZ.js";
+import "../../chunks/chunk.YIY5RM53.js";
+import "../../chunks/chunk.D7CATJYB.js";
+import "../../chunks/chunk.YCXTCVAZ.js";
+import "../../chunks/chunk.TUVJKY7S.js";
+import "../../chunks/chunk.6M63UXML.js";
+export {
+  DSARadioButton as default
+};

package/dist/components/radio-button/radio-button.styles.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("lit").CSSResult;
+export default _default;

package/dist/components/radio-button/radio-button.styles.js

@@ -0,0 +1,9 @@
+import {
+  radio_button_styles_default
+} from "../../chunks/chunk.DC6CT5PU.js";
+import "../../chunks/chunk.J2XNYTTZ.js";
+import "../../chunks/chunk.TUVJKY7S.js";
+import "../../chunks/chunk.6M63UXML.js";
+export {
+  radio_button_styles_default as default
+};