npm - @tedi-design-system/angular - Versions diffs - 7.1.0-rc.2 → 7.1.0-rc.4 - Mend

@tedi-design-system/angular 7.1.0-rc.2 → 7.1.0-rc.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (7) hide show

package/fesm2022/tedi-design-system-angular-community.mjs +1 -1
package/fesm2022/tedi-design-system-angular-community.mjs.map +1 -1
package/fesm2022/tedi-design-system-angular-tedi.mjs +310 -24
package/fesm2022/tedi-design-system-angular-tedi.mjs.map +1 -1
package/package.json +1 -1
package/tedi/index.d.ts +176 -7
package/tedi/index.d.ts.map +1 -1

package/fesm2022/tedi-design-system-angular-community.mjs CHANGED Viewed

@@ -2727,7 +2727,7 @@ class FileDropzoneComponent {
         this.disabled.set(isDisabled);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: FileDropzoneComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.24", type: FileDropzoneComponent, isStandalone: true, selector: "tedi-file-dropzone", inputs: { accept: { classPropertyName: "accept", publicName: "accept", isSignal: true, isRequired: false, transformFunction: null }, maxSize: { classPropertyName: "maxSize", publicName: "maxSize", isSignal: true, isRequired: false, transformFunction: null }, sizeDisplayStandard: { classPropertyName: "sizeDisplayStandard", publicName: "sizeDisplayStandard", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, validateIndividually: { classPropertyName: "validateIndividually", publicName: "validateIndividually", isSignal: true, isRequired: false, transformFunction: null }, defaultFiles: { classPropertyName: "defaultFiles", publicName: "defaultFiles", isSignal: true, isRequired: false, transformFunction: null }, inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, className: { classPropertyName: "className", publicName: "className", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, uploadFolder: { classPropertyName: "uploadFolder", publicName: "uploadFolder", isSignal: true, isRequired: false, transformFunction: null }, validators: { classPropertyName: "validators", publicName: "validators", isSignal: true, isRequired: false, transformFunction: null }, hasError: { classPropertyName: "hasError", publicName: "hasError", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { fileChange: "fileChange", fileDelete: "fileDelete" }, host: { listeners: { "blur": "onBlur()", "keydown.code.enter": "openFilePicker()", "dragover": "onDragOver($event)", "dragenter": "onDragEnter($event)", "dragleave": "onDragLeave($event)", "drop": "onDrop($event)" } }, providers: [FileService], viewQueries: [{ propertyName: "fileInputElement", first: true, predicate: ["fileInput"], descendants: true, isSignal: true }], ngImport: i0, template: "<input\n  #fileInput\n  class=\"tedi-file-dropzone__input\"\n  type=\"file\"\n  [disabled]=\"disabled()\"\n  [multiple]=\"multiple()\"\n  [id]=\"inputId()\"\n  [attr.webkitdirectory]=\"uploadFolder() ? '' : null\"\n  [accept]=\"accept()\"\n  (change)=\"selectionChange($event)\"\n/>\n\n<button [className]=\"classes()\" (click)=\"onContainerClick()\">\n  <div class=\"tedi-file-dropzone__label-wrapper\">\n    <tedi-icon\n      [name]=\"isDragActive() ? 'file_upload' : 'attach_file'\"\n      [color]=\"disabled() ? 'tertiary' : 'secondary'\"\n    />\n    <label tedi-label class=\"tedi-file-dropzone__label\">{{\n      (isDragActive() ? \"file-upload.drag-and-drop\" : label()) | tediTranslate\n    }}</label>\n  </div>\n</button>\n\n<ng-content select=\"[helper-text]\">\n  @if (helperText(); as message) {\n    <tedi-feedback-text\n      [text]=\"message.text\"\n      [type]=\"message.type || 'hint'\"\n      [position]=\"message.position || 'left'\"\n    />\n  }\n</ng-content>\n\n<ng-content select=\"[file-list]\">\n  @for (file of files(); track file.name) {\n    <div class=\"tedi-file-dropzone__file-list\" [tediVerticalSpacing]=\"0.5\">\n      <tedi-attachment\n        [name]=\"file.label ?? file.name\"\n        [fileSize]=\"formatBytes(file.size)\"\n        [invalid]=\"file.fileStatus === 'invalid'\"\n        [error]=\"\n          validateIndividually() && file.fileStatus === 'invalid'\n            ? file.helper?.text\n            : undefined\n        \"\n      >\n        <tedi-attachment-actions>\n          <tedi-tooltip>\n            <tedi-tooltip-trigger>\n              <button\n                tedi-button\n                type=\"button\"\n                variant=\"neutral\"\n                [attr.aria-label]=\"\n                  ('remove' | tediTranslate) + ' ' + (file.label ?? file.name)\n                \"\n                [disabled]=\"file.disabled\"\n                (click)=\"removeFile(file)\"\n              >\n                <tedi-icon name=\"delete\" [size]=\"18\" />\n              </button>\n            </tedi-tooltip-trigger>\n            <tedi-tooltip-content>\n              {{ (\"remove\" | tediTranslate) + \" \" + (file.label ?? file.name) }}\n            </tedi-tooltip-content>\n          </tedi-tooltip>\n        </tedi-attachment-actions>\n      </tedi-attachment>\n    </div>\n  }\n</ng-content>\n\n<ng-content select=\"[error-text]\">\n  @if (this.uploadError(); as message) {\n    <tedi-feedback-text [text]=\"message\" type=\"error\" position=\"left\" />\n  }\n</ng-content>\n", styles: [".tedi-file-dropzone{text-align:center;cursor:pointer;background-color:var(--file-dropzone-background-default);border:2px dotted var(--file-dropzone-border-default);transition:border-color .2s ease-in-out,background-color .2s ease-in-out;border-radius:var(--form-field-radius);padding:var(--file-dropzone-padding-y) var(--file-dropzone-padding-x);margin-bottom:var(--layout-grid-gutters-04)}.tedi-file-dropzone:hover{background-color:var(--file-dropzone-background-hover);border-color:var(--file-dropzone-border-hover)}.tedi-file-dropzone .tedi-file-dropzone__label-wrapper{display:flex;justify-content:center}.tedi-file-dropzone .tedi-file-dropzone__label-wrapper .tedi-file-dropzone__label{font-weight:500;color:var(--file-dropzone-text-default);font-size:var(--body-regular-size)}.tedi-file-dropzone .tedi-file-dropzone__label-wrapper .tedi-file-dropzone__label:hover{cursor:pointer}.tedi-file-dropzone--disabled{pointer-events:none;cursor:not-allowed;background-color:var(--file-dropzone-background-disabled);border-color:var(--file-dropzone-border-disabled)}.tedi-file-dropzone--disabled .tedi-file-dropzone__label-wrapper .tedi-file-dropzone__label{color:var(--general-text-disabled)}.tedi-file-dropzone--invalid{border-color:var(--form-general-feedback-error-border)}.tedi-file-dropzone--valid{border-color:var(--form-general-feedback-success-border)}.tedi-file-dropzone--drop-over{color:var(--file-dropzone-text-drop-over);background-color:var(--file-dropzone-background-drop-over);border-color:var(--file-dropzone-border-drop-over)}.tedi-file-dropzone:focus-visible{outline:2px solid var(--file-dropzone-border-hover);outline-offset:1px}.tedi-file-dropzone__input{display:none}.tedi-file-dropzone__file-list{width:100%;list-style:none;margin-top:var(--layout-grid-gutters-04)}.tedi-file-dropzone__file-name{overflow-wrap:anywhere}\n", ".tedi-file-dropzone{width:100%}.tedi-file-dropzone__label-wrapper{pointer-events:none}\n"], dependencies: [{ kind: "component", type: IconComponent, selector: "tedi-icon", inputs: ["name", "size", "color", "background", "variant", "type", "label"] }, { kind: "component", type: FeedbackTextComponent, selector: "tedi-feedback-text", inputs: ["text", "type", "position"] }, { kind: "component", type: AttachmentComponent, selector: "tedi-attachment", inputs: ["name", "fileSize", "icon", "error", "invalid", "direction", "verticalBelow"] }, { kind: "component", type: AttachmentActionsComponent, selector: "tedi-attachment-actions", inputs: ["padded"] }, { kind: "component", type: ButtonComponent, selector: "[tedi-button]", inputs: ["variant", "size"] }, { kind: "component", type: TooltipComponent, selector: "tedi-tooltip", inputs: ["position", "preventOverflow", "openWith", "timeoutDelay"] }, { kind: "component", type: TooltipTriggerComponent, selector: "tedi-tooltip-trigger" }, { kind: "component", type: TooltipContentComponent, selector: "tedi-tooltip-content", inputs: ["maxWidth"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: VerticalSpacingDirective, selector: "[tediVerticalSpacing]", inputs: ["tediVerticalSpacing"] }, { kind: "pipe", type: TediTranslationPipe, name: "tediTranslate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.24", type: FileDropzoneComponent, isStandalone: true, selector: "tedi-file-dropzone", inputs: { accept: { classPropertyName: "accept", publicName: "accept", isSignal: true, isRequired: false, transformFunction: null }, maxSize: { classPropertyName: "maxSize", publicName: "maxSize", isSignal: true, isRequired: false, transformFunction: null }, sizeDisplayStandard: { classPropertyName: "sizeDisplayStandard", publicName: "sizeDisplayStandard", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, validateIndividually: { classPropertyName: "validateIndividually", publicName: "validateIndividually", isSignal: true, isRequired: false, transformFunction: null }, defaultFiles: { classPropertyName: "defaultFiles", publicName: "defaultFiles", isSignal: true, isRequired: false, transformFunction: null }, inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, className: { classPropertyName: "className", publicName: "className", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, uploadFolder: { classPropertyName: "uploadFolder", publicName: "uploadFolder", isSignal: true, isRequired: false, transformFunction: null }, validators: { classPropertyName: "validators", publicName: "validators", isSignal: true, isRequired: false, transformFunction: null }, hasError: { classPropertyName: "hasError", publicName: "hasError", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { fileChange: "fileChange", fileDelete: "fileDelete" }, host: { listeners: { "blur": "onBlur()", "keydown.code.enter": "openFilePicker()", "dragover": "onDragOver($event)", "dragenter": "onDragEnter($event)", "dragleave": "onDragLeave($event)", "drop": "onDrop($event)" } }, providers: [FileService], viewQueries: [{ propertyName: "fileInputElement", first: true, predicate: ["fileInput"], descendants: true, isSignal: true }], ngImport: i0, template: "<input\n  #fileInput\n  class=\"tedi-file-dropzone__input\"\n  type=\"file\"\n  [disabled]=\"disabled()\"\n  [multiple]=\"multiple()\"\n  [id]=\"inputId()\"\n  [attr.webkitdirectory]=\"uploadFolder() ? '' : null\"\n  [accept]=\"accept()\"\n  (change)=\"selectionChange($event)\"\n/>\n\n<button [className]=\"classes()\" (click)=\"onContainerClick()\">\n  <div class=\"tedi-file-dropzone__label-wrapper\">\n    <tedi-icon\n      [name]=\"isDragActive() ? 'file_upload' : 'attach_file'\"\n      [color]=\"disabled() ? 'tertiary' : 'secondary'\"\n    />\n    <label tedi-label class=\"tedi-file-dropzone__label\">{{\n      (isDragActive() ? \"file-upload.drag-and-drop\" : label()) | tediTranslate\n    }}</label>\n  </div>\n</button>\n\n<ng-content select=\"[helper-text]\">\n  @if (helperText(); as message) {\n    <tedi-feedback-text\n      [text]=\"message.text\"\n      [type]=\"message.type || 'hint'\"\n      [position]=\"message.position || 'left'\"\n    />\n  }\n</ng-content>\n\n<ng-content select=\"[file-list]\">\n  @for (file of files(); track file.name) {\n    <div class=\"tedi-file-dropzone__file-list\" [tediVerticalSpacing]=\"0.5\">\n      <tedi-attachment\n        [name]=\"file.label ?? file.name\"\n        [fileSize]=\"formatBytes(file.size)\"\n        [invalid]=\"file.fileStatus === 'invalid'\"\n        [error]=\"\n          validateIndividually() && file.fileStatus === 'invalid'\n            ? file.helper?.text\n            : undefined\n        \"\n      >\n        <tedi-attachment-actions>\n          <tedi-tooltip>\n            <tedi-tooltip-trigger>\n              <button\n                tedi-button\n                type=\"button\"\n                variant=\"neutral\"\n                [attr.aria-label]=\"\n                  ('remove' | tediTranslate) + ' ' + (file.label ?? file.name)\n                \"\n                [disabled]=\"file.disabled\"\n                (click)=\"removeFile(file)\"\n              >\n                <tedi-icon name=\"delete\" [size]=\"18\" />\n              </button>\n            </tedi-tooltip-trigger>\n            <tedi-tooltip-content>\n              {{ (\"remove\" | tediTranslate) + \" \" + (file.label ?? file.name) }}\n            </tedi-tooltip-content>\n          </tedi-tooltip>\n        </tedi-attachment-actions>\n      </tedi-attachment>\n    </div>\n  }\n</ng-content>\n\n<ng-content select=\"[error-text]\">\n  @if (this.uploadError(); as message) {\n    <tedi-feedback-text [text]=\"message\" type=\"error\" position=\"left\" />\n  }\n</ng-content>\n", styles: [".tedi-file-dropzone{text-align:center;cursor:pointer;background-color:var(--file-dropzone-background-default);border:2px dotted var(--file-dropzone-border-default);transition:border-color .2s ease-in-out,background-color .2s ease-in-out;border-radius:var(--form-field-radius);padding:var(--file-dropzone-padding-y) var(--file-dropzone-padding-x);margin-bottom:var(--layout-grid-gutters-04)}.tedi-file-dropzone:hover{background-color:var(--file-dropzone-background-hover);border-color:var(--file-dropzone-border-hover)}.tedi-file-dropzone .tedi-file-dropzone__label-wrapper{display:flex;justify-content:center}.tedi-file-dropzone .tedi-file-dropzone__label-wrapper .tedi-file-dropzone__label{font-weight:500;color:var(--file-dropzone-text-default);font-size:var(--body-regular-size)}.tedi-file-dropzone .tedi-file-dropzone__label-wrapper .tedi-file-dropzone__label:hover{cursor:pointer}.tedi-file-dropzone--disabled{pointer-events:none;cursor:not-allowed;background-color:var(--file-dropzone-background-disabled);border-color:var(--file-dropzone-border-disabled)}.tedi-file-dropzone--disabled .tedi-file-dropzone__label-wrapper .tedi-file-dropzone__label{color:var(--general-text-disabled)}.tedi-file-dropzone--invalid{border-color:var(--form-general-feedback-error-border)}.tedi-file-dropzone--valid{border-color:var(--form-general-feedback-success-border)}.tedi-file-dropzone--drop-over{color:var(--file-dropzone-text-drop-over);background-color:var(--file-dropzone-background-drop-over);border-color:var(--file-dropzone-border-drop-over)}.tedi-file-dropzone:focus-visible{outline:2px solid var(--file-dropzone-border-hover);outline-offset:1px}.tedi-file-dropzone__input{display:none}.tedi-file-dropzone__file-list{width:100%;list-style:none;margin-top:var(--layout-grid-gutters-04)}.tedi-file-dropzone__file-name{overflow-wrap:anywhere}\n", ".tedi-file-dropzone{width:100%}.tedi-file-dropzone__label-wrapper{pointer-events:none}\n"], dependencies: [{ kind: "component", type: IconComponent, selector: "tedi-icon", inputs: ["name", "size", "color", "background", "variant", "type", "label"] }, { kind: "component", type: FeedbackTextComponent, selector: "tedi-feedback-text", inputs: ["text", "type", "position"] }, { kind: "component", type: AttachmentComponent, selector: "tedi-attachment", inputs: ["name", "fileSize", "icon", "error", "invalid", "direction", "verticalBelow"] }, { kind: "component", type: AttachmentActionsComponent, selector: "tedi-attachment-actions", inputs: ["padded"] }, { kind: "component", type: ButtonComponent, selector: "[tedi-button]", inputs: ["variant", "size"] }, { kind: "component", type: TooltipComponent, selector: "tedi-tooltip", inputs: ["position", "preventOverflow", "openWith", "open", "trackPosition", "timeoutDelay", "offset"], outputs: ["openChange"] }, { kind: "component", type: TooltipTriggerComponent, selector: "tedi-tooltip-trigger", inputs: ["interactive"] }, { kind: "component", type: TooltipContentComponent, selector: "tedi-tooltip-content", inputs: ["maxWidth"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: VerticalSpacingDirective, selector: "[tediVerticalSpacing]", inputs: ["tediVerticalSpacing"] }, { kind: "pipe", type: TediTranslationPipe, name: "tediTranslate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: FileDropzoneComponent, decorators: [{
             type: Component,