@designsystem-se/af 37.0.1 → 37.0.2-beta.0

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-7a477838.js');
-const randomIdGenerator_util = require('./randomIdGenerator.util-e7f4b6de.js');
-const logger_util = require('./logger.util-fdafc086.js');
-const text = require('./text-65b1b58c.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: '24ae333ab5edc928ce4d26e6e4da0f642617792a', class: "digi-form-label" }, index.h("div", { key: 'b1a5073a7c9883b13a86f741b865c3b368c1d02b', class: "digi-form-label__label-group" }, this.afFor && this.afLabel && (index.h("label", { key: '4dd98d11699d82e0e6b5f1127ca0e97382dc45d1', class: "digi-form-label__label", htmlFor: this.afFor, id: this.afId }, index.h("span", { key: 'a8c1b2cf89d24625e3c13a93bac5fd144d95a3cb', class: "digi-form-label__label--label" }, this.labelText), this.afDescription && (index.h("span", { key: '4a82c714e6b4f3189772d44bd5748c830252a8d5', class: "digi-form-label__label--description" }, this.afDescription)))), this.hasActionSlot && (index.h("div", { key: 'd07f90e8e0a8ba9061686bf7cc331480091fbb33', class: "digi-form-label__actions" }, index.h("slot", { key: '7c5f1750217d9666a6543044e6dbb29ee4839940', 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--icon--validation--success);--digi--form-validation-message--icon-color--warning:var(--digi--color--icon--validation--warning);--digi--form-validation-message--icon-color--error:var(--digi--color--icon--validation--error)}.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__icon.sc-digi-form-validation-message .warning.sc-digi-form-validation-message{top:3px;position:relative}.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", { class: "warning" });
-        }
-    }
-    render() {
-        return (index.h("div", { key: 'b15c3cca06f4e015c7006bae470876b246b6ce06', class: Object.assign({ 'digi-form-validation-message': true }, this.cssModifiers) }, index.h("div", { key: '1e9378eb8b193c35e24e700ef865fb44ae4fb28b', class: "digi-form-validation-message__icon", "aria-hidden": "true" }, this.icon), index.h("span", { key: '6e72b4f07b641d63603914a33720d6b09a5bd44f', class: "digi-form-validation-message__text" }, index.h("slot", { key: '74cfa597bf12b19fb2dbef039eac148358ff2635' }))));
-    }
-    get hostElement() { return index.getElement(this); }
-};
-FormValidationMessage.style = DigiFormValidationMessageStyle0;
-
-const iconValidationSuccessCss = ".sc-digi-icon-validation-success-h{--digi--icon--color:var(--digi--color--icon--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: '8e17bc8da17af20998fb67b64fc24b40461b176c', 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: '6f56caf229cfb9e2d8f6f54eaeaa4f86c9881eaf', id: this.titleId }, this.afTitle), this.afDesc && index.h("desc", { key: 'f7fa4c25a72c4ef312a8f6daedf31ce199979bc2' }, this.afDesc), index.h("path", { key: 'f90d6e4c93085c88e81ef6935289f437a6a26aa6', 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;

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

@@ -1,80 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-7a477838.js');
-const randomIdGenerator_util = require('./randomIdGenerator.util-e7f4b6de.js');
-const formRadiogroupValidation_enum = require('./form-radiogroup-validation.enum-03a17d4d.js');
-
-const formRadiogroupCss = "";
-const DigiFormRadiogroupStyle0 = formRadiogroupCss;
-
-const FormRadiogroup = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.afOnGroupChange = index.createEvent(this, "afOnGroupChange", 7);
-        this.radiobuttons = undefined;
-        this.afId = randomIdGenerator_util.randomIdGenerator('digi-form-radiogroup');
-        this.afValue = undefined;
-        this.value = undefined;
-        this.afName = randomIdGenerator_util.randomIdGenerator('digi-form-radiogroup');
-        this.afValidation = formRadiogroupValidation_enum.FormRadiogroupValidation.NEUTRAL;
-        this.afValidationText = undefined;
-        this.afErrorMessageIsAlert = true;
-    }
-    OnAfValueChange(value) {
-        this.value = value;
-    }
-    OnValueChange(value) {
-        this.afValue = value;
-        this.setRadiobuttons(value);
-    }
-    get errorMessageIsAlert() {
-        return (this.afErrorMessageIsAlert !== false &&
-            this.afErrorMessageIsAlert !== 'false');
-    }
-    /**
-     * Lyssnar på om fokus sätts på custom-elementet och propagerar ner det till den första radioknappen i gruppen
-     * @en Listens for when focus is set on the custom element and propagates it down to the first radionutton in the group.
-     */
-    focusOnGroup() {
-        const radioButtons = this.radiobuttons;
-        if (radioButtons.length > 0) {
-            radioButtons[0].focus();
-        }
-    }
-    radiobuttonChangeListener(e) {
-        if (Array.from(this.radiobuttons).includes(e.target)) {
-            e.preventDefault();
-            this.afValue = e.detail.target.value;
-            this.afOnGroupChange.emit(e.detail.target.value);
-        }
-    }
-    componentDidLoad() {
-        this.setRadiobuttons(this.value || this.afValue);
-        if (this.value)
-            this.afValue = this.value;
-    }
-    setRadiobuttons(value) {
-        this.radiobuttons = this.hostElement.querySelectorAll('digi-form-radiobutton');
-        this.radiobuttons.forEach((r) => {
-            r.afName = this.afName;
-            if (value && r.afValue == value) {
-                r.setAttribute('af-checked', 'true');
-            }
-        });
-    }
-    render() {
-        return (index.h(index.Host, { key: '0b03e0ccdc03d2f06466f9a2527f68b937637e6f', tabindex: -1 }, index.h("div", { key: '02b0862fc0645ba6c5b12480279078d0b796f5ef', id: this.afId, class: {
-                'digi-form-radiogroup': true
-            } }, index.h("digi-util-mutation-observer", { key: 'ed9e1a034e5d5221c4c004e12db780077277876e', onAfOnChange: (e) => this.radiobuttonChangeListener(e) }, index.h("slot", { key: '5572449dc6ad235472c92e8524d26688d56e1b10' }))), index.h("div", { key: 'b0696ddf7c218434fded2380f41bca17e407a797', class: "digi-form-input__validation", "aria-atomic": "true", role: this.errorMessageIsAlert ? 'alert' : null, id: `${this.afId}--validation-text` }, this.afValidation != formRadiogroupValidation_enum.FormRadiogroupValidation.NEUTRAL && (index.h("digi-form-validation-message", { key: '63cde6f36e3064bd421c7d162e72ab414f5584cf', class: "digi-form-input__validation-message", "af-variation": this.afValidation }, this.afValidationText)))));
-    }
-    get hostElement() { return index.getElement(this); }
-    static get watchers() { return {
-        "afValue": ["OnAfValueChange"],
-        "value": ["OnValueChange"]
-    }; }
-};
-FormRadiogroup.style = DigiFormRadiogroupStyle0;
-
-exports.digi_form_radiogroup = FormRadiogroup;