@designsystem-se/af 38.0.1-beta.2 → 38.1.0

package/dist/collection/components/_form/form-file-upload/form-file-upload.js

@@ -112,6 +112,7 @@ export class FormFileUpload {
      * @en Import array with files without triggering upload event. A file object needs to contain an id, status and the file itself.
      */
     async afMImportFiles(files) {
+        this.resetErrors();
         if (files && files.length > 0) {
             for (const importedFile of files) {
                 this.validateFile(importedFile);
@@ -126,6 +127,14 @@ export class FormFileUpload {
     async afMGetFormControlElement() {
         return this._input;
     }
+    /**
+     * Rensar komponentens fillista och eventuella felmeddelanden.
+     * @en Clears the component's file list and any error messages.
+     */
+    async afMClearFiles() {
+        this.files = [];
+        this.resetErrors();
+    }
     /**
      * Lyssnar på om fokus sätts på custom-elementet och propagerar ner det till själva input-elementet.
      * @en Listens for when focus is set on the custom element and propagates it down to the actual input element.
@@ -173,7 +182,11 @@ export class FormFileUpload {
         let exist = false;
         if (this.files.length > 0) {
             this.files.forEach((file) => {
-                if (file.name === fileToCheck.name) {
+                if (file['id'] === fileToCheck['id']) {
+                    exist = true;
+                    return;
+                }
+                else if (file.name === fileToCheck.name) {
                     exist = true;
                 }
             });
@@ -557,22 +570,22 @@ export class FormFileUpload {
             } }, this.renderFiles())));
     }
     render() {
-        return (h(Fragment, { key: '1104991979216e10bd2e137de392134a9dd970f3' }, h("digi-util-breakpoint-observer", { key: '645a8f2849a39c068b77fa7c6ddfd726e834b3b2', onAfOnChange: (e) => this.breakpointHandler(e) }), h("div", { key: 'c6b2785961f0e0b0cb2b2ccb7da42d663b9e9e3b', class: Object.assign({ 'digi-form-file-upload': true }, this.cssModifiers) }, h("digi-form-label", { key: 'd51e788ee53461e075b0f73b600608646c70032f', afFor: this.afId, afLabel: this.afLabel, afDescription: this.afLabelDescription, afRequired: this.afRequired, afAnnounceIfOptional: this.afAnnounceIfOptional, afRequiredText: this.afRequiredText, afAnnounceIfOptionalText: this.afAnnounceIfOptionalText }), h("div", { key: '9df4b7deaca899f1c06bf615065a2fce7eea4bc0', class: {
+        return (h(Fragment, { key: 'bec280d44d534a720927ab737b34335600c3fe80' }, h("digi-util-breakpoint-observer", { key: '93983b718eda1869ff95f7a0abe8c6704395a1e0', onAfOnChange: (e) => this.breakpointHandler(e) }), h("div", { key: '23f30473aa0dd681c6c4ea20138d3f13391bb070', class: Object.assign({ 'digi-form-file-upload': true }, this.cssModifiers) }, h("digi-form-label", { key: 'c42a873187b3bf30ddfdb71561d6902a8b2f98fe', afFor: this.afId, afLabel: this.afLabel, afDescription: this.afLabelDescription, afRequired: this.afRequired, afAnnounceIfOptional: this.afAnnounceIfOptional, afRequiredText: this.afRequiredText, afAnnounceIfOptionalText: this.afAnnounceIfOptionalText }), h("div", { key: 'db1082e11bafb320c13a790d639d37ca821617ac', class: {
                 'digi-form-file-upload__upload-area': true,
                 'digi-form-file-upload__upload-area--hover': this.fileHover
             }, onDrop: (e) => this.handleDrop(e), onDragOver: (e) => this.handleAllowDrop(e), onDragEnter: (e) => this.handleOnDragEnterLeave(e), onDragLeave: (e) => this.handleOnDragEnterLeave(e), onClick: (e) => this.handleInputClick(e) }, this.fileHover &&
-            this.afVariation != FormFileUploadVariation.SMALL && (h("div", { key: '8c35b4e2523db4f4f892d2f615caedb8bb3a9ebe', class: "digi-form-file-upload__upload-area-overlay" })), h("div", { key: '096b05c159ce7722687cdc0b1a0ff4889a5485e2', class: "digi-form-file-upload__text-area" }, h("button", { key: '97504d954e2f3a0e76d99fb4d5049ddea108a32f', type: "button", id: this.afId + '-button', ref: (el) => {
+            this.afVariation != FormFileUploadVariation.SMALL && (h("div", { key: 'f58d5f61b5568263e9b60b255f47e6ef418c78e5', class: "digi-form-file-upload__upload-area-overlay" })), h("div", { key: 'c58c52f7e2c8aa8d17fe510ef90435d488844237', class: "digi-form-file-upload__text-area" }, h("button", { key: '1bb7fa84e0778702d0e77008f7d468d560ac8e17', type: "button", id: this.afId + '-button', ref: (el) => {
                 this._uploadButton = el;
             }, onClick: (e) => this.handleInputClick(e), class: "digi-form-file-upload__button hidden_mobile", style: {
                 margin: '0'
-            } }, h("digi-icon-paperclip", { key: 'e47597d6988db6a71c22fb9ab4cfa877be4a48fa', "aria-hidden": "true", class: "digi-form-file-upload__button-icon paper-clip", slot: "icon" }), this.afUploadBtnText
+            } }, h("digi-icon-paperclip", { key: 'a84b67ad055682b1c1b013ec948af0935c35ed0c', "aria-hidden": "true", class: "digi-form-file-upload__button-icon paper-clip", slot: "icon" }), this.afUploadBtnText
             ? this.afUploadBtnText
-            : _t.form.file_choose), h("input", { key: 'b21162f7873e21a8b3ed2d286ef154b66b95c8ec', ref: (el) => {
+            : _t.form.file_choose), h("input", { key: 'd0babe3bcbc5d03f2436c0f4a7ee23a93ecb0474', ref: (el) => {
                 this._input = el;
-            }, onChange: (e) => this.onButtonUploadFileHandler(e), class: "digi-form-file-upload__input", multiple: true, type: "file", id: this.afId, accept: this.afFileTypes, name: this.afName ? this.afName : null, required: this.afRequired ? this.afRequired : null, onDrop: (e) => this.handleDrop(e), onDragOver: (e) => this.handleAllowDrop(e), "aria-errormessage": "digi-form-file-upload__error", "aria-describedBy": "digi-form-file-upload__error" }), h("span", { key: 'c8e448ef96e9d4f292ec88606526e06935192308' }, this.afVariation !== FormFileUploadVariation.SMALL &&
-            _t.form.file_dropzone))), h("p", { key: '8c6f1b6190eb4f87bbcd9d50f4c4929cdcf4c026', class: "visually-hidden", role: this.errorMessageIsAlert ? 'alert' : null, "aria-atomic": "true", ref: (el) => {
+            }, onChange: (e) => this.onButtonUploadFileHandler(e), class: "digi-form-file-upload__input", multiple: true, type: "file", id: this.afId, accept: this.afFileTypes, name: this.afName ? this.afName : null, required: this.afRequired ? this.afRequired : null, onDrop: (e) => this.handleDrop(e), onDragOver: (e) => this.handleAllowDrop(e), "aria-errormessage": "digi-form-file-upload__error", "aria-describedBy": "digi-form-file-upload__error" }), h("span", { key: '20a4158d0462ee2f871bddb57b9e168d356573ed' }, this.afVariation !== FormFileUploadVariation.SMALL &&
+            _t.form.file_dropzone))), h("p", { key: 'ade6d22fde218536ce42daff285a1605ac16bdb1', class: "visually-hidden", role: this.errorMessageIsAlert ? 'alert' : null, "aria-atomic": "true", ref: (el) => {
                 this._srTextContainer = el;
-            } }), (this.files.length > 0 || this.error) && (h("div", { key: '7faefe886463ce493824665375b3b4ab0aec5753', class: "digi-form-file-upload__files" }, this.renderErrorMessage(), this.renderFileContainer())))));
+            } }), (this.files.length > 0 || this.error) && (h("div", { key: '06044ba8e2a5d7e76374af1dfa479c891554ab45', class: "digi-form-file-upload__files" }, this.renderErrorMessage(), this.renderFileContainer())))));
     }
     static get is() { return "digi-form-file-upload"; }
     static get encapsulation() { return "scoped"; }
@@ -1317,6 +1330,26 @@ export class FormFileUpload {
                     "text": "",
                     "tags": []
                 }
+            },
+            "afMClearFiles": {
+                "complexType": {
+                    "signature": "() => Promise<void>",
+                    "parameters": [],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<void>"
+                },
+                "docs": {
+                    "text": "Rensar komponentens fillista och eventuella felmeddelanden.",
+                    "tags": [{
+                            "name": "en",
+                            "text": "Clears the component's file list and any error messages."
+                        }]
+                }
             }
         };
     }

package/dist/collection/design-tokens/components/_logo.variables.scss

@@ -1,18 +1,16 @@
-@use '../../../../../../styles/src/digi-styles.utils' as *;
-
-@mixin digi-logo--variables() {
-  --digi--logo--img--min-width: #{rem(256)};
-  --digi--logo--img--max-width:#{rem(292)};
-  --digi--logo--img--max-width--large: #{rem(368)};
-  --digi--logo--img--max-width--system: #{rem(44)};
-
-  --digi--logo--padding: 1.375rem;
-  --digi--logo--padding--wide: var(--digi--gutter--larger);
-  --digi--logo--padding--large: var(--digi--gutter--medium);
-  --digi--logo--padding--large--wide: var(--digi--gutter--larger);
-
-  --digi--logo--primary--symbol: var(--digi--color--logotype--primary--symbol);
-  --digi--logo--secondary--symbol: var(--digi--color--logotype--secondary--symbol);
-  --digi--logo--primary--text: var(--digi--color--logotype--primary--text);
-  --digi--logo--secondary--text: var(--digi--color--logotype--secondary--text);
+@mixin digi-title-logo--variables() {
+  --digi--title-logo-text-color: var(--digi--color--text--primary);
+  --digi--title-logo-font-weight: var(--digi--global--typography--font-weight--bold);
+  --digi--title-logo-font-size: var(--digi--typography--title-logo--font-size--mobile);
+  --digi--title-logo-font-size-small: var(--digi--global--typography--font-size--large);
+  --digi--title-logo-line-height-small: 1.25rem;
+  --digi--title-logo-symbol-color: var(--digi--color--logotype--primary--symbol);
+  --digi--title-logo-symbol-width: 36px;
+  --digi--title-logo-symbol-height: 36px;
+  --digi--title-logo-symbol-width-mobile: 44px;
+  --digi--title-logo-symbol-height-mobile: 44px;
+  --digi--title-logo-text-height: 40px;
+  --digi--title-logo-border-width: var(--digi--global--border-width--base);
+  --digi--title-logo-vertical-padding: 1.375rem;
+  --digi--title-logo-gap: 9px;
 }