@designsystem-se/af 34.0.3-beta.0 → 34.0.3

package/dist/cjs/digi-form-input.cjs.entry.js

@@ -1,157 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-cfa8e9be.js');
-const randomIdGenerator_util = require('./randomIdGenerator.util-e7f4b6de.js');
-const formInputType_enum = require('./form-input-type.enum-9c8ee12a.js');
-const formInputVariation_enum = require('./form-input-variation.enum-c750520c.js');
-
-const formInputCss = ".digi--util--fs--xs.sc-digi-form-input{font-size:var(--digi--global--typography--font-size--small) !important}.digi--util--fs--s.sc-digi-form-input{font-size:calc(var(--digi--global--typography--font-size--small) + 1px) !important}.digi--util--fs--m.sc-digi-form-input{font-size:var(--digi--global--typography--font-size--base) !important}.digi--util--fs--l.sc-digi-form-input{font-size:var(--digi--global--typography--font-size--large) !important}.digi--util--fw--sb.sc-digi-form-input{font-weight:var(--digi--global--typography--font-weight--semibold) !important}.digi--util--pt--1.sc-digi-form-input{padding-top:var(--digi--global--spacing--smallest-2) !important}.digi--util--pt--10.sc-digi-form-input{padding-top:var(--digi--global--spacing--smallest) !important}.digi--util--pt--20.sc-digi-form-input{padding-top:var(--digi--global--spacing--base) !important}.digi--util--pt--30.sc-digi-form-input{padding-top:var(--digi--global--spacing--largest-2) !important}.digi--util--pt--40.sc-digi-form-input{padding-top:var(--digi--global--spacing--largest-4) !important}.digi--util--pt--50.sc-digi-form-input{padding-top:2.5rem !important}.digi--util--pt--60.sc-digi-form-input{padding-top:var(--digi--global--spacing--largest-5) !important}.digi--util--pt--70.sc-digi-form-input{padding-top:var(--digi--global--spacing--largest-6) !important}.digi--util--pt--80.sc-digi-form-input{padding-top:4.5rem !important}.digi--util--pt--90.sc-digi-form-input{padding-top:5rem !important}.digi--util--pb--1.sc-digi-form-input{padding-bottom:var(--digi--global--spacing--smallest-2) !important}.digi--util--pb--10.sc-digi-form-input{padding-bottom:var(--digi--global--spacing--smallest) !important}.digi--util--pb--20.sc-digi-form-input{padding-bottom:var(--digi--global--spacing--base) !important}.digi--util--pb--30.sc-digi-form-input{padding-bottom:var(--digi--global--spacing--largest-2) !important}.digi--util--pb--40.sc-digi-form-input{padding-bottom:var(--digi--global--spacing--largest-4) !important}.digi--util--pb--50.sc-digi-form-input{padding-bottom:2.5rem !important}.digi--util--pb--60.sc-digi-form-input{padding-bottom:var(--digi--global--spacing--largest-5) !important}.digi--util--pb--70.sc-digi-form-input{padding-bottom:var(--digi--global--spacing--largest-6) !important}.digi--util--pb--80.sc-digi-form-input{padding-bottom:4.5rem !important}.digi--util--pb--90.sc-digi-form-input{padding-bottom:5rem !important}.digi--util--p--1.sc-digi-form-input{padding:var(--digi--global--spacing--smallest-2) !important}.digi--util--p--10.sc-digi-form-input{padding:var(--digi--global--spacing--smallest) !important}.digi--util--p--20.sc-digi-form-input{padding:var(--digi--global--spacing--base) !important}.digi--util--p--30.sc-digi-form-input{padding:var(--digi--global--spacing--largest-2) !important}.digi--util--p--40.sc-digi-form-input{padding:var(--digi--global--spacing--largest-4) !important}.digi--util--p--50.sc-digi-form-input{padding:2.5rem !important}.digi--util--p--60.sc-digi-form-input{padding:var(--digi--global--spacing--largest-5) !important}.digi--util--p--70.sc-digi-form-input{padding:var(--digi--global--spacing--largest-6) !important}.digi--util--p--80.sc-digi-form-input{padding:4.5rem !important}.digi--util--p--90.sc-digi-form-input{padding:5rem !important}.digi--util--ptb--1.sc-digi-form-input{padding-top:var(--digi--global--spacing--smallest-2) !important;padding-bottom:var(--digi--global--spacing--smallest-2) !important}.digi--util--ptb--10.sc-digi-form-input{padding-top:var(--digi--global--spacing--smallest) !important;padding-bottom:var(--digi--global--spacing--smallest) !important}.digi--util--ptb--20.sc-digi-form-input{padding-top:var(--digi--global--spacing--base) !important;padding-bottom:var(--digi--global--spacing--base) !important}.digi--util--ptb--30.sc-digi-form-input{padding-top:var(--digi--global--spacing--largest-2) !important;padding-bottom:var(--digi--global--spacing--largest-2) !important}.digi--util--ptb--40.sc-digi-form-input{padding-top:var(--digi--global--spacing--largest-4) !important;padding-bottom:var(--digi--global--spacing--largest-4) !important}.digi--util--ptb--50.sc-digi-form-input{padding-top:2.5rem !important;padding-bottom:2.5rem !important}.digi--util--ptb--60.sc-digi-form-input{padding-top:var(--digi--global--spacing--largest-5) !important;padding-bottom:var(--digi--global--spacing--largest-5) !important}.digi--util--ptb--70.sc-digi-form-input{padding-top:var(--digi--global--spacing--largest-6) !important;padding-bottom:var(--digi--global--spacing--largest-6) !important}.digi--util--ptb--80.sc-digi-form-input{padding-top:4.5rem !important;padding-bottom:4.5rem !important}.digi--util--ptb--90.sc-digi-form-input{padding-top:5rem !important;padding-bottom:5rem !important}.digi--util--plr--1.sc-digi-form-input{padding-left:var(--digi--global--spacing--smallest-2) !important;padding-right:var(--digi--global--spacing--smallest-2) !important}.digi--util--plr--10.sc-digi-form-input{padding-left:var(--digi--global--spacing--smallest) !important;padding-right:var(--digi--global--spacing--smallest) !important}.digi--util--plr--20.sc-digi-form-input{padding-left:var(--digi--global--spacing--base) !important;padding-right:var(--digi--global--spacing--base) !important}.digi--util--plr--30.sc-digi-form-input{padding-left:var(--digi--global--spacing--largest-2) !important;padding-right:var(--digi--global--spacing--largest-2) !important}.digi--util--plr--40.sc-digi-form-input{padding-left:var(--digi--global--spacing--largest-4) !important;padding-right:var(--digi--global--spacing--largest-4) !important}.digi--util--plr--50.sc-digi-form-input{padding-left:2.5rem !important;padding-right:2.5rem !important}.digi--util--plr--60.sc-digi-form-input{padding-left:var(--digi--global--spacing--largest-5) !important;padding-right:var(--digi--global--spacing--largest-5) !important}.digi--util--plr--70.sc-digi-form-input{padding-left:var(--digi--global--spacing--largest-6) !important;padding-right:var(--digi--global--spacing--largest-6) !important}.digi--util--plr--80.sc-digi-form-input{padding-left:4.5rem !important;padding-right:4.5rem !important}.digi--util--plr--90.sc-digi-form-input{padding-left:5rem !important;padding-right:5rem !important}.digi--util--sr-only.sc-digi-form-input{border:0;clip:rect(1px, 1px, 1px, 1px);-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.digi--util--hidden.sc-digi-form-input{display:none}.sc-digi-form-input-h{--digi--form-input--height--small:var(--digi--input-height--small);--digi--form-input--height--medium:var(--digi--input-height--medium);--digi--form-input--height--large:var(--digi--input-height--large);--digi--form-input--border-radius:var(--digi--border-radius--input);--digi--form-input--padding:0 var(--digi--gutter--medium);--digi--form-input--background--empty:var(--digi--color--background--input-empty);--digi--form-input--background--neutral:var(--digi--color--background--input);--digi--form-input--background--success:var(--digi--color--background--success-2);--digi--form-input--background--warning:var(--digi--color--background--warning-2);--digi--form-input--background--error:var(--digi--color--background--danger-2);--digi--form-input--border--neutral:var(--digi--border-width--input-regular) solid;--digi--form-input--border--error:var(--digi--border-width--input-validation) solid;--digi--form-input--border--success:var(--digi--border-width--input-validation) solid;--digi--form-input--border--warning:var(--digi--border-width--input-validation) solid;--digi--form-input--border-color--neutral:var(--digi--color--border--neutral-3);--digi--form-input--border-color--success:var(--digi--color--border--success);--digi--form-input--border-color--warning:var(--digi--color--border--warning-2);--digi--form-input--border-color--error:var(--digi--color--border--danger)}.sc-digi-form-input-h .digi-form-input.sc-digi-form-input{display:flex;flex-direction:column;gap:0.4em}.sc-digi-form-input-h .digi-form-input--small.sc-digi-form-input{--HEIGHT:var(--digi--form-input--height--small)}.sc-digi-form-input-h .digi-form-input--medium.sc-digi-form-input{--HEIGHT:var(--digi--form-input--height--medium)}.sc-digi-form-input-h .digi-form-input--large.sc-digi-form-input{--HEIGHT:var(--digi--form-input--height--large)}.sc-digi-form-input-h .digi-form-input--neutral.sc-digi-form-input{--BORDER:var(--digi--form-input--border--neutral);--BORDER-COLOR:var(--digi--form-input--border-color--neutral);--BACKGROUND:var(--digi--form-input--background--neutral)}.sc-digi-form-input-h .digi-form-input--empty.sc-digi-form-input:not(:focus-within){--BACKGROUND:var(--digi--form-input--background--empty)}.sc-digi-form-input-h .digi-form-input--success.sc-digi-form-input{--BORDER:var(--digi--form-input--border--success);--BORDER-COLOR:var(--digi--form-input--border-color--success);--BACKGROUND:var(--digi--form-input--background--success)}.sc-digi-form-input-h .digi-form-input--warning.sc-digi-form-input{--BORDER:var(--digi--form-input--border--warning);--BORDER-COLOR:var(--digi--form-input--border-color--warning);--BACKGROUND:var(--digi--form-input--background--warning)}.sc-digi-form-input-h .digi-form-input--error.sc-digi-form-input{--BORDER:var(--digi--form-input--border--error);--BORDER-COLOR:var(--digi--form-input--border-color--error);--BACKGROUND:var(--digi--form-input--background--error)}.digi-form-input__input-wrapper.sc-digi-form-input{position:relative;display:flex}.digi-form-input__input-wrapper.sc-digi-form-input-s>[slot^=button] button,.digi-form-input__input-wrapper .sc-digi-form-input-s>[slot^=button] button{--MIN-HEIGHT:100%}.digi-form-input--button-variation-primary .digi-form-input__input-wrapper.sc-digi-form-input-s>[slot^=button] button,.digi-form-input__input-wrapper .sc-digi-form-input-s>[slot^=button] button{border-start-start-radius:0;border-end-start-radius:0}.digi-form-input--button-variation-secondary.digi-form-input--has-button-true.sc-digi-form-input .digi-form-input__input-wrapper.sc-digi-form-input{gap:var(--digi--gutter--medium);flex-wrap:wrap}.digi-form-input__input.sc-digi-form-input{flex:1;height:var(--HEIGHT);font-family:var(--digi--global--typography--font-family--default);font-size:var(--digi--typography--body--font-size--desktop);padding:var(--digi--form-input--padding);color:var(--digi--color--text--primary);background:var(--BACKGROUND);border:var(--BORDER);border-color:var(--BORDER-COLOR);border-radius:var(--digi--form-input--border-radius);box-sizing:border-box}.digi-form-input__input.sc-digi-form-input:focus-visible{outline:2px solid black;outline-offset:2px;box-shadow:0px 0px 0px 5px white}.digi-form-input--button-variation-primary.digi-form-input--has-button-true.sc-digi-form-input .digi-form-input__input.sc-digi-form-input{border-end-end-radius:0;border-start-end-radius:0}";
-const DigiFormInputStyle0 = formInputCss;
-
-const FormInput = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.afOnChange = index.createEvent(this, "afOnChange", 7);
-        this.afOnBlur = index.createEvent(this, "afOnBlur", 7);
-        this.afOnKeyup = index.createEvent(this, "afOnKeyup", 7);
-        this.afOnFocus = index.createEvent(this, "afOnFocus", 7);
-        this.afOnFocusout = index.createEvent(this, "afOnFocusout", 7);
-        this.afOnInput = index.createEvent(this, "afOnInput", 7);
-        this.afOnDirty = index.createEvent(this, "afOnDirty", 7);
-        this.afOnTouched = index.createEvent(this, "afOnTouched", 7);
-        this.afOnReady = index.createEvent(this, "afOnReady", 3);
-        this.hasActiveValidationMessage = false;
-        this.hasButton = undefined;
-        this.dirty = false;
-        this.touched = false;
-        this.afLabel = undefined;
-        this.afLabelDescription = undefined;
-        this.afType = formInputType_enum.FormInputType.TEXT;
-        this.afInputmode = formInputVariation_enum.FormInputMode.DEFAULT;
-        this.afButtonVariation = formInputType_enum.FormInputButtonVariation.PRIMARY;
-        this.afAutofocus = undefined;
-        this.afVariation = formInputVariation_enum.FormInputVariation.MEDIUM;
-        this.afName = undefined;
-        this.afId = randomIdGenerator_util.randomIdGenerator('digi-form-input');
-        this.afMaxlength = undefined;
-        this.afMinlength = undefined;
-        this.afRequired = undefined;
-        this.afRequiredText = undefined;
-        this.afAnnounceIfOptional = false;
-        this.afAnnounceIfOptionalText = undefined;
-        this.value = undefined;
-        this.afValue = undefined;
-        this.afValidation = formInputVariation_enum.FormInputValidation.NEUTRAL;
-        this.afValidationText = undefined;
-        this.afRole = undefined;
-        this.afAutocomplete = undefined;
-        this.afMin = undefined;
-        this.afMax = undefined;
-        this.afList = undefined;
-        this.afStep = undefined;
-        this.afDirname = undefined;
-        this.afAriaAutocomplete = undefined;
-        this.afAriaActivedescendant = undefined;
-        this.afAriaLabelledby = undefined;
-        this.afAriaDescribedby = undefined;
-        this.afAriaControls = undefined;
-    }
-    onValueChanged(value) {
-        this.afValue = value;
-    }
-    onAfValueChanged(value) {
-        this.value = value;
-    }
-    afValidationTextWatch() {
-        this.setActiveValidationMessage();
-    }
-    /**
-     * Hämtar en referens till inputelementet. Bra för att t.ex. sätta fokus programmatiskt.
-     * @en Returns a reference to the input element. Handy for setting focus programmatically.
-     */
-    async afMGetFormControlElement() {
-        return this._input;
-    }
-    componentWillLoad() {
-        this.afValue ? (this.value = this.afValue) : (this.afValue = this.value);
-        this.setActiveValidationMessage();
-        this.setHasButton();
-    }
-    componentWillUpdate() {
-        this.setHasButton();
-    }
-    componentDidLoad() {
-        this.afOnReady.emit();
-    }
-    setActiveValidationMessage() {
-        this.hasActiveValidationMessage = !!this.afValidationText;
-    }
-    get cssModifiers() {
-        return {
-            'digi-form-input--small': this.afVariation === formInputVariation_enum.FormInputVariation.SMALL,
-            'digi-form-input--medium': this.afVariation === formInputVariation_enum.FormInputVariation.MEDIUM,
-            'digi-form-input--large': this.afVariation === formInputVariation_enum.FormInputVariation.LARGE,
-            'digi-form-input--neutral': this.afValidation === formInputVariation_enum.FormInputValidation.NEUTRAL,
-            'digi-form-input--success': this.afValidation === formInputVariation_enum.FormInputValidation.SUCCESS,
-            'digi-form-input--error': this.afValidation === formInputVariation_enum.FormInputValidation.ERROR,
-            'digi-form-input--warning': this.afValidation === formInputVariation_enum.FormInputValidation.WARNING,
-            [`digi-form-input--button-variation-${this.afButtonVariation}`]: !!this.afButtonVariation,
-            [`digi-form-input--has-button-${this.hasButton}`]: true,
-            'digi-form-input--empty': !this.afValue &&
-                (!this.afValidation ||
-                    this.afValidation === formInputVariation_enum.FormInputValidation.NEUTRAL)
-        };
-    }
-    blurHandler(e) {
-        if (!this.touched) {
-            this.afOnTouched.emit(e);
-            this.touched = true;
-        }
-        this.afOnBlur.emit(e);
-    }
-    changeHandler(e) {
-        this.setActiveValidationMessage();
-        this.afOnChange.emit(e);
-    }
-    focusHandler(e) {
-        this.afOnFocus.emit(e);
-    }
-    focusoutHandler(e) {
-        this.afOnFocusout.emit(e);
-    }
-    keyupHandler(e) {
-        this.afOnKeyup.emit(e);
-    }
-    inputHandler(e) {
-        this.afValue = this.value =
-            this.afType === formInputType_enum.FormInputType.NUMBER
-                ? parseFloat(e.target.value)
-                : e.target.value;
-        if (!this.dirty) {
-            this.afOnDirty.emit(e);
-            this.dirty = true;
-        }
-        this.setActiveValidationMessage();
-        this.afOnInput.emit(e);
-    }
-    setHasButton() {
-        this.hasButton = !!this.hostElement.querySelector('[slot="button"]');
-    }
-    render() {
-        return (index.h("div", { key: 'b2bd14e8a9e49dad598f00dc896729dfd31cffc5', class: Object.assign({ 'digi-form-input': true }, this.cssModifiers) }, index.h("digi-form-label", { key: '0f0ce35832740e632702ecd313d699c785a0084a', class: "digi-form-input__label", afFor: this.afId, afLabel: this.afLabel, afDescription: this.afLabelDescription, afRequired: this.afRequired, afAnnounceIfOptional: this.afAnnounceIfOptional, afRequiredText: this.afRequiredText, afAnnounceIfOptionalText: this.afAnnounceIfOptionalText }), index.h("div", { key: '96923f294d619338b9fd649280339bf39bdebbd5', class: "digi-form-input__input-wrapper" }, index.h("input", Object.assign({ key: 'd30e924087399be43ad644c1e53e1ad4c070503c', class: "digi-form-input__input", ref: (el) => (this._input = el), onBlur: (e) => this.blurHandler(e), onChange: (e) => this.changeHandler(e), onFocus: (e) => this.focusHandler(e), onFocusout: (e) => this.focusoutHandler(e), onKeyUp: (e) => this.keyupHandler(e), onInput: (e) => this.inputHandler(e), "aria-activedescendant": this.afAriaActivedescendant, "aria-describedby": this.afAriaDescribedby, "aria-labelledby": this.afAriaLabelledby, "aria-autocomplete": this.afAriaAutocomplete, "aria-invalid": this.afValidation === formInputVariation_enum.FormInputValidation.ERROR ? 'true' : 'false', "aria-controls": this.afAriaControls, autocomplete: this.afAutocomplete, autofocus: this.afAutofocus ? this.afAutofocus : null, maxLength: this.afMaxlength, minLength: this.afMinlength, max: this.afMax, min: this.afMin, step: this.afStep, list: this.afList, role: this.afRole, dirName: this.afDirname, required: this.afRequired, id: this.afId, name: this.afName, type: this.afType, value: this.afValue }, (this.afInputmode == formInputVariation_enum.FormInputMode.DEFAULT
-            ? {}
-            : { inputmode: this.afInputmode }))), index.h("slot", { key: 'b8fc45af3240a1be2493765df990825846ac8407', name: "button" })), index.h("div", { key: '47c6e7abf34f9cda6e11ab1a2f8b513c42fd22cf', class: "digi-form-input__footer" }, index.h("div", { key: '9c1f5483cc3ffab6d6bbf0874689597f02268244', class: "digi-form-input__validation", "aria-atomic": "true", role: "alert", id: `${this.afId}--validation-message` }, this.hasActiveValidationMessage &&
-            this.afValidation != formInputVariation_enum.FormInputValidation.NEUTRAL && (index.h("digi-form-validation-message", { key: '5f344935241a4696706fb72d79679c4f3db4355b', class: "digi-form-input__validation-message", "af-variation": this.afValidation }, this.afValidationText))))));
-    }
-    get hostElement() { return index.getElement(this); }
-    static get watchers() { return {
-        "value": ["onValueChanged"],
-        "afValue": ["onAfValueChanged"],
-        "afValidationText": ["afValidationTextWatch"]
-    }; }
-};
-FormInput.style = DigiFormInputStyle0;
-
-exports.digi_form_input = FormInput;

package/dist/cjs/digi-form-label_3.cjs.entry.js

@@ -1,129 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-cfa8e9be.js');
-const randomIdGenerator_util = require('./randomIdGenerator.util-e7f4b6de.js');
-const logger_util = require('./logger.util-fdafc086.js');
-const text = require('./text-ca7e238b.js');
-const formValidationMessageVariation_enum = require('./form-validation-message-variation.enum-855ae0be.js');
-
-const formLabelCss = ".sc-digi-form-label-h .digi-form-label.sc-digi-form-label{font-family:var(--digi--global--typography--font-family--default);font-size:var(--digi--typography--label--font-size--desktop);color:var(--digi--color--text--primary);display:flex;flex-direction:column}.sc-digi-form-label-h .digi-form-label__label--label.sc-digi-form-label{font-weight:var(--digi--typography--label--font-weight--desktop)}.sc-digi-form-label-h .digi-form-label__label--label.sc-digi-form-label,.sc-digi-form-label-h .digi-form-label__label--description.sc-digi-form-label{line-height:var(--digi--typography--label--line-height--desktop);cursor:pointer;display:block}.sc-digi-form-label-h .digi-form-label__label-group.sc-digi-form-label{display:inline-flex;align-items:center;gap:var(--digi--gutter--icon)}.sc-digi-form-label-h .digi-form-label__description.sc-digi-form-label{max-width:var(--digi--paragraph-width--medium);line-height:var(--digi--typography--label-description--line-height--desktop);font-size:var(--digi--typography--label-description--font-size--desktop)}";
-const DigiFormLabelStyle0 = formLabelCss;
-
-const FormLabel = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.labelText = undefined;
-        this.hasActionSlot = undefined;
-        this.afLabel = undefined;
-        this.afId = randomIdGenerator_util.randomIdGenerator('digi-form-label');
-        this.afFor = undefined;
-        this.afDescription = undefined;
-        this.afRequired = undefined;
-        this.afAnnounceIfOptional = false;
-        this.afRequiredText = text._t.required.toLowerCase();
-        this.afAnnounceIfOptionalText = text._t.optional.toLowerCase();
-    }
-    componentWillLoad() {
-        this.setLabelText();
-        this.validateFor();
-        this.handleSlotVisibility();
-    }
-    validateFor() {
-        if (this.afFor == null) {
-            logger_util.logger.warn(`digi-form-label must have a for attribute. Please add a for attribute using af-for`, this.hostElement);
-        }
-    }
-    setLabelText() {
-        this.labelText = `${this.afLabel} ${this.requiredText}`;
-        if (!this.afLabel) {
-            logger_util.logger.warn(`digi-form-label must have a label. Please add a label using af-label`, this.hostElement);
-        }
-    }
-    handleSlotVisibility() {
-        this.hasActionSlot = !!this.hostElement.querySelector('[slot="actions"]');
-    }
-    get requiredText() {
-        if (this.afRequired && !this.afAnnounceIfOptional) {
-            return this.afRequiredText ? ` (${this.afRequiredText})` : '';
-        }
-        else if (!this.afRequired && this.afAnnounceIfOptional) {
-            return this.afAnnounceIfOptionalText
-                ? ` (${this.afAnnounceIfOptionalText})`
-                : '';
-        }
-        else {
-            return '';
-        }
-    }
-    render() {
-        return (index.h("div", { key: 'e4a27fb5d0ce2eb12cee08acfe804f080486b805', class: "digi-form-label" }, index.h("div", { key: '9e06550d32519dc2bc89ff08e9025829275e959a', class: "digi-form-label__label-group" }, this.afFor && this.afLabel && (index.h("label", { key: '1408c2dcac2de2d64fe02bd371851bb557fae3dc', class: "digi-form-label__label", htmlFor: this.afFor, id: this.afId }, index.h("span", { key: '0dcab145adac7bb9d08d189ea317154adcb694d9', class: "digi-form-label__label--label" }, this.labelText), this.afDescription && (index.h("span", { key: 'eab65c9d6ed4b2026a14ab605468c906c52f8f33', class: "digi-form-label__label--description" }, this.afDescription)))), this.hasActionSlot && (index.h("div", { key: '8394c8f21653cfe5889b234f9f5d0f32dbc5e1de', class: "digi-form-label__actions" }, index.h("slot", { key: '4e465d67ab95a7c212a47dda824241511ff3314a', name: "actions" }))))));
-    }
-    get hostElement() { return index.getElement(this); }
-    static get watchers() { return {
-        "afFor": ["validateFor"],
-        "afLabel": ["setLabelText"],
-        "afRequired": ["setLabelText"],
-        "afAnnounceIfOptional": ["setLabelText"]
-    }; }
-};
-FormLabel.style = DigiFormLabelStyle0;
-
-const formValidationMessageCss = ".sc-digi-form-validation-message-h{--digi--form-validation-message--icon-color--success:var(--digi--color--icons--success);--digi--form-validation-message--icon-color--warning:var(--digi--color--icons--warning);--digi--form-validation-message--icon-color--error:var(--digi--color--icons--danger)}.sc-digi-form-validation-message-h .digi-form-validation-message.sc-digi-form-validation-message{display:flex;flex-wrap:wrap;align-items:center}.sc-digi-form-validation-message-h .digi-form-validation-message--success.sc-digi-form-validation-message{--ICON-COLOR:var(--digi--form-validation-message--icon-color--success)}.sc-digi-form-validation-message-h .digi-form-validation-message--warning.sc-digi-form-validation-message{--ICON-COLOR:var(--digi--form-validation-message--icon-color--warning)}.sc-digi-form-validation-message-h .digi-form-validation-message--error.sc-digi-form-validation-message{--ICON-COLOR:var(--digi--form-validation-message--icon-color--error)}.sc-digi-form-validation-message-h .digi-form-validation-message__icon.sc-digi-form-validation-message{color:var(--ICON-COLOR);margin-inline-end:var(--digi--gutter--icon)}.sc-digi-form-validation-message-h .digi-form-validation-message__icon.sc-digi-form-validation-message>*.sc-digi-form-validation-message{--digi--icon--width:1.25em;--digi--icon--height:1.25em;--digi--icon--color:var(--ICON-COLOR);display:flex}.sc-digi-form-validation-message-h .digi-form-validation-message__text.sc-digi-form-validation-message{flex:1;font-family:var(--digi--global--typography--font-family--default);font-size:var(--digi--typography--tag--font-size--desktop);color:var(--digi--color--text--primary)}";
-const DigiFormValidationMessageStyle0 = formValidationMessageCss;
-
-const FormValidationMessage = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.afVariation = formValidationMessageVariation_enum.FormValidationMessageVariation.SUCCESS;
-    }
-    get cssModifiers() {
-        return {
-            'digi-form-validation-message--success': this.afVariation === formValidationMessageVariation_enum.FormValidationMessageVariation.SUCCESS,
-            'digi-form-validation-message--error': this.afVariation === formValidationMessageVariation_enum.FormValidationMessageVariation.ERROR,
-            'digi-form-validation-message--warning': this.afVariation === formValidationMessageVariation_enum.FormValidationMessageVariation.WARNING
-        };
-    }
-    get icon() {
-        switch (this.afVariation) {
-            case formValidationMessageVariation_enum.FormValidationMessageVariation.SUCCESS:
-                return index.h("digi-icon-validation-success", null);
-            case formValidationMessageVariation_enum.FormValidationMessageVariation.ERROR:
-                return index.h("digi-icon-validation-error", null);
-            case formValidationMessageVariation_enum.FormValidationMessageVariation.WARNING:
-                return index.h("digi-icon-validation-warning", null);
-        }
-    }
-    render() {
-        return (index.h("div", { key: '476664be4624693d823227aab661bf0332f500a6', class: Object.assign({ 'digi-form-validation-message': true }, this.cssModifiers) }, index.h("div", { key: 'e5ce10d94d2c101e60b82b3b3808e320d24f20b5', class: "digi-form-validation-message__icon", "aria-hidden": "true" }, this.icon), index.h("span", { key: 'cdfbd680c9b56b2efc7a38034957434344d5724a', class: "digi-form-validation-message__text" }, index.h("slot", { key: 'c8c8320411478b72d1887974e177cdf3f7e49f49' }))));
-    }
-    get hostElement() { return index.getElement(this); }
-};
-FormValidationMessage.style = DigiFormValidationMessageStyle0;
-
-const iconValidationSuccessCss = ".sc-digi-icon-validation-success-h{--digi--icon--color:var(--digi--color--icons--primary);--digi--icon--width:initial;--digi--icon--height:auto;display:flex;min-height:1.4em;align-items:center}.sc-digi-icon-validation-success-h svg.sc-digi-icon-validation-success{color:var(--digi--icon--color);max-width:var(--digi--icon--width);max-height:var(--digi--icon--height);width:var(--digi--icon--width, auto);height:var(--digi--icon--height, auto)}";
-const DigiIconValidationSuccessStyle0 = iconValidationSuccessCss;
-
-const IconCheckCircle = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.afTitle = undefined;
-        this.afDesc = undefined;
-        this.afSvgAriaHidden = true;
-        this.afSvgAriaLabelledby = undefined;
-        this.titleId = randomIdGenerator_util.randomIdGenerator('icontitle');
-    }
-    render() {
-        return (index.h("svg", { key: 'fae0e31b57ea0c8967bcf5b7c9f455ae082f6ba6', class: "digi-icon-validation-success", width: "25", height: "25", viewBox: "0 0 25 25", "aria-hidden": this.afSvgAriaHidden ? 'true' : 'false', "aria-labelledby": this.afSvgAriaLabelledby
-                ? this.afSvgAriaLabelledby
-                : this.afTitle
-                    ? this.titleId
-                    : undefined, xmlns: "http://www.w3.org/2000/svg" }, this.afTitle && index.h("title", { key: '281f60b240130a37391aa3e7ac0a3d0c5e637bc3', id: this.titleId }, this.afTitle), this.afDesc && index.h("desc", { key: '2bbf50f8eb1f5a56bb3ccf14c24a7ec46e2c94fe' }, this.afDesc), index.h("path", { key: '94abbabd9bb3b886c0fc81b8100547366982b6a7', class: "digi-icon-validation-success__shape", d: "M25 12.5C25 19.404 19.404 25 12.5 25S0 19.404 0 12.5 5.596 0 12.5 0 25 5.596 25 12.5zm-13.946 6.619l9.274-9.275a.806.806 0 000-1.14l-1.14-1.14a.806.806 0 00-1.14 0l-7.564 7.563-3.531-3.531a.807.807 0 00-1.14 0l-1.141 1.14a.806.806 0 000 1.14l5.242 5.243a.806.806 0 001.14 0z", fill: "currentColor", "fill-rule": "nonzero" })));
-    }
-};
-IconCheckCircle.style = DigiIconValidationSuccessStyle0;
-
-exports.digi_form_label = FormLabel;
-exports.digi_form_validation_message = FormValidationMessage;
-exports.digi_icon_validation_success = IconCheckCircle;