@umbraco-ui/uui-input-file 1.7.1 → 1.8.0-rc.2

package/custom-elements.json

@@ -25,7 +25,7 @@
         },
         {
           "name": "value",
-          "description": "Value of this form control.",
+          "description": "Value of this form control.\nIf you dont want the setFormValue to be called on the ElementInternals, then prevent calling this method, by not calling super.value = newValue in your implementation of the value setter method.",
           "type": "string",
           "default": "\"''\""
         },
@@ -96,7 +96,7 @@
         {
           "name": "value",
           "attribute": "value",
-          "description": "Value of this form control.",
+          "description": "Value of this form control.\nIf you dont want the setFormValue to be called on the ElementInternals, then prevent calling this method, by not calling super.value = newValue in your implementation of the value setter method.",
           "type": "string",
           "default": "\"''\""
         },
@@ -140,7 +140,8 @@
           "type": "ValidityState"
         },
         {
-          "name": "validationMessage"
+          "name": "validationMessage",
+          "type": "string"
         }
       ]
     }

package/lib/index.js

@@ -1,7 +1,7 @@
 import { defineElement } from '@umbraco-ui/uui-base/lib/registration';
 import { query, property, state } from 'lit/decorators.js';
 import { LitElement, html, nothing, css } from 'lit';
-import { FormControlMixin } from '@umbraco-ui/uui-base/lib/mixins';
+import { UUIFormControlMixin } from '@umbraco-ui/uui-base/lib/mixins';
 import { demandCustomElement } from '@umbraco-ui/uui-base/lib/utils';
 import { iconDelete } from '@umbraco-ui/uui-icon-registry-essential/lib/svgs';
 import { repeat } from 'lit/directives/repeat.js';
@@ -17,7 +17,7 @@ var __decorateClass = (decorators, target, key, kind) => {
     __defProp(target, key, result);
   return result;
 };
-let UUIInputFileElement = class extends FormControlMixin(LitElement) {
+let UUIInputFileElement = class extends UUIFormControlMixin(LitElement, null) {
   constructor() {
     super();
     this.accept = "";
@@ -39,7 +39,7 @@ let UUIInputFileElement = class extends FormControlMixin(LitElement) {
     this.addEventListener("drop", () => this._setShowDropzone(false));
   }
   get value() {
-    return this._value;
+    return super.value;
   }
   set value(newValue) {
     super.value = newValue;
@@ -64,6 +64,24 @@ let UUIInputFileElement = class extends FormControlMixin(LitElement) {
   getFormElement() {
     return this._dropZone;
   }
+  /**
+   * Removes focus from the input.
+   */
+  async blur() {
+    await this.updateComplete;
+    this._dropzone.blur();
+  }
+  /**
+   * This method enables <label for="..."> to focus the input
+   */
+  async focus() {
+    await this.updateComplete;
+    this._dropzone.focus();
+  }
+  async click() {
+    await this.updateComplete;
+    this._dropzone.browse();
+  }
   _handleClick(e) {
     e.stopImmediatePropagation();
     this._dropzone.browse();

package/lib/uui-input-file.element.d.ts

@@ -1,9 +1,9 @@
 import { LitElement } from 'lit';
-declare const UUIInputFileElement_base: (new (...args: any[]) => import("@umbraco-ui/uui-base/lib/mixins").FormControlMixinInterface) & typeof LitElement;
+declare const UUIInputFileElement_base: (new (...args: any[]) => import("@umbraco-ui/uui-base/lib/mixins").UUIFormControlMixinInterface<FormDataEntryValue | FormData, null>) & typeof LitElement;
 /**
  * @element uui-input-file
  * @description - A form associated file input that supports multiple files.
- * @extends FormControlMixin
+ * @extends UUIFormControlMixin
  */
 export declare class UUIInputFileElement extends UUIInputFileElement_base {
     private _dropzone;
@@ -22,12 +22,21 @@ export declare class UUIInputFileElement extends UUIInputFileElement_base {
      * @default false
      */
     multiple: boolean;
-    get value(): FormDataEntryValue | FormData;
-    set value(newValue: FormDataEntryValue | FormData);
+    get value(): FormDataEntryValue | FormData | null;
+    set value(newValue: FormDataEntryValue | FormData | null);
     private _files;
     constructor();
     connectedCallback(): void;
     protected getFormElement(): HTMLElement;
+    /**
+     * Removes focus from the input.
+     */
+    blur(): Promise<void>;
+    /**
+     * This method enables <label for="..."> to focus the input
+     */
+    focus(): Promise<void>;
+    click(): Promise<void>;
     private _handleClick;
     private _updateFileWrappers;
     private _handleFilesChange;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umbraco-ui/uui-input-file",
-  "version": "1.7.1",
+  "version": "1.8.0-rc.2",
   "license": "MIT",
   "keywords": [
     "Umbraco",
@@ -30,12 +30,12 @@
     "custom-elements.json"
   ],
   "dependencies": {
-    "@umbraco-ui/uui-action-bar": "1.7.0",
-    "@umbraco-ui/uui-base": "1.7.0",
-    "@umbraco-ui/uui-button": "1.7.1",
-    "@umbraco-ui/uui-file-dropzone": "1.7.0",
-    "@umbraco-ui/uui-icon": "1.7.0",
-    "@umbraco-ui/uui-icon-registry-essential": "1.7.0"
+    "@umbraco-ui/uui-action-bar": "1.8.0-rc.0",
+    "@umbraco-ui/uui-base": "1.8.0-rc.0",
+    "@umbraco-ui/uui-button": "1.8.0-rc.2",
+    "@umbraco-ui/uui-file-dropzone": "1.8.0-rc.0",
+    "@umbraco-ui/uui-icon": "1.8.0-rc.0",
+    "@umbraco-ui/uui-icon-registry-essential": "1.8.0-rc.0"
   },
   "scripts": {
     "build": "npm run analyze && tsc --build && rollup -c rollup.config.js",
@@ -46,5 +46,5 @@
     "access": "public"
   },
   "homepage": "https://uui.umbraco.com/?path=/story/uui-input-file",
-  "gitHead": "48b40b1f5a550f89e731051c78f2c5aea9412c47"
+  "gitHead": "d37c2c4ba77397c7e3979f04dfc221f50ed421f1"
 }