dap-design-system 0.60.2 → 0.61.0

package/dist/components/file-input/file-input-list.component.js

@@ -0,0 +1,143 @@
+import "../../node_modules/@lit/reactive-element/reactive-element.js";
+import { nothing as d, html as p } from "../../node_modules/lit-html/lit-html.js";
+import "../../node_modules/lit-element/lit-element.js";
+import { property as l } from "../../node_modules/@lit/reactive-element/decorators/property.js";
+import { state as u } from "../../node_modules/@lit/reactive-element/decorators/state.js";
+import { ifDefined as c } from "../../node_modules/lit-html/directives/if-defined.js";
+import { DdsElement as b } from "../../internal/dds-hu-element.js";
+import { SizedMixin as y } from "../../internal/mixin/sizedMixin.js";
+import "../../localization/localization.js";
+import S from "../form/form-label/form-label.component.js";
+import $ from "../icon/icon.component.js";
+import k from "./file-input-list.scss.js";
+import v from "./file-input-list-item.component.js";
+import { t as w } from "../../node_modules/i18next/dist/esm/i18next.js";
+import { unsafeCSS as L } from "../../node_modules/@lit/reactive-element/css-tag.js";
+var E = Object.defineProperty, i = (m, e, s, h) => {
+  for (var o = void 0, n = m.length - 1, r; n >= 0; n--)
+    (r = m[n]) && (o = r(e, s, o) || o);
+  return o && E(e, s, o), o;
+};
+const a = class a extends y(b) {
+  constructor() {
+    super(...arguments), this.disabled = !1, this.showDeleteButton = "true", this.showFileLink = "true", this.emitLinkEvent = !1, this.showFileSize = "true", this.showThumbnail = "false", this.thumbnailSize = "sm", this._files = [], this.fileInputElement = null;
+  }
+  get files() {
+    return this.querySelectorAll("dap-ds-file-input-list-item");
+  }
+  getFileByName(e) {
+    return this.shadowRoot.querySelector(
+      `dap-ds-file-input-list-item[filename="${e}"]`
+    );
+  }
+  handleFileClick(e) {
+    e.preventDefault(), e.stopPropagation(), this.emit("dds-file-click", { data: e.detail.data });
+  }
+  _handleFilesAccepted(e) {
+    const o = e.detail.files.map((n) => {
+      const r = this.querySelector('[slot="link"]'), f = r && r.innerHTML.trim() !== "";
+      return p`<dap-ds-file-input-list-item
+        size=${this.size}
+        .fileData=${n}
+        fileName=${n.name}
+        showDeleteButton=${this.showDeleteButton}
+        showFileLink=${this.showFileLink}
+        fileLinkLabel=${this.fileLinkLabel}
+        showFileSize=${this.showFileSize}
+        showThumbnail=${this.showThumbnail}
+        thumbnailSize=${this.thumbnailSize}
+        ?emitLinkEvent=${this.emitLinkEvent}
+        .fileItemTemplate=${this.fileItemTemplate}
+        @dds-file-click=${this.handleFileClick}
+        ?disabled=${this.disabled}>
+        <slot name="delete-button" slot="delete-button">
+          <dap-ds-icon
+            class="content__remove-button-icon"
+            name="delete-bin-line"></dap-ds-icon>
+        </slot>
+        ${f ? p`<slot name="link" slot="link"></slot>` : d}
+      </dap-ds-file-input-list-item>`;
+    });
+    this._files = o;
+  }
+  firstUpdated(e) {
+    var s;
+    super.firstUpdated(e), this.for && (this.fileInputElement = document.querySelector(`#${this.for}`), this.fileInputElement && (this.fileInputElement.fileList = this, (s = this.fileInputElement) == null || s.addEventListener(
+      "dds-files-accepted",
+      this._handleFilesAccepted.bind(this)
+    )));
+  }
+  removeFile(e) {
+    var s;
+    (s = this.fileInputElement) == null || s.dispatchEvent(
+      new CustomEvent("dds-file-remove", {
+        bubbles: !1,
+        composed: !0,
+        detail: e.detail
+      })
+    );
+  }
+  render() {
+    var e;
+    return p`${this._files.length > 0 ? p`<dap-ds-form-label
+            part="label"
+            id="label"
+            .size=${this.size}
+            label=${c(this.label)}>
+          </dap-ds-form-label>` : d}
+      <ul
+        class="file-input-list"
+        part="base"
+        role="list"
+        aria-label=${(e = this.ariaLabel) != null ? e : w("fileInput.fileList")}
+        @dds-file-remove=${this.removeFile}>
+        ${this._files}
+      </ul>`;
+  }
+};
+a.tagName = "dap-ds-file-input-list", a.dependencies = {
+  "dap-ds-file-input-list-item": v,
+  "dap-ds-icon": $,
+  "dap-ds-form-label": S
+}, a.styles = L(k);
+let t = a;
+i([
+  l({ type: String })
+], t.prototype, "for");
+i([
+  l({ type: Boolean, reflect: !0 })
+], t.prototype, "disabled");
+i([
+  l()
+], t.prototype, "label");
+i([
+  l({ type: String })
+], t.prototype, "showDeleteButton");
+i([
+  l({ type: String })
+], t.prototype, "showFileLink");
+i([
+  l({ attribute: !1 })
+], t.prototype, "fileItemTemplate");
+i([
+  l({ type: String })
+], t.prototype, "fileLinkLabel");
+i([
+  l({ type: Boolean })
+], t.prototype, "emitLinkEvent");
+i([
+  l({ type: String })
+], t.prototype, "showFileSize");
+i([
+  l({ type: String })
+], t.prototype, "showThumbnail");
+i([
+  l({ type: String })
+], t.prototype, "thumbnailSize");
+i([
+  u()
+], t.prototype, "_files");
+export {
+  t as default
+};
+//# sourceMappingURL=file-input-list.component.js.map

package/dist/components/file-input/file-input-list.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"file-input-list.component.js","sources":["../../../src/components/file-input/file-input-list.component.ts"],"sourcesContent":["import { html, nothing, PropertyValueMap, TemplateResult, unsafeCSS } from 'lit'\nimport { property, state } from 'lit/decorators.js'\nimport { ifDefined } from 'lit/directives/if-defined.js'\n\nimport { FileItemTemplate } from '@/common/types'\nimport { DdsElement } from '@/internal/dds-hu-element'\nimport { SizedMixin } from '@/internal/mixin/sizedMixin'\nimport { t } from '@/localization/localization'\n\nimport DapDSFormLabel from '../form/form-label/form-label.component'\nimport DapDSIcon from '../icon/icon.component'\nimport DapDSFileInput from './file-input.component'\nimport styles from './file-input-list.scss?inline'\nimport DapDSFileInputListItem from './file-input-list-item.component'\n\n/**\n * `dap-ds-file-input-list`\n * @summary A file input list is a container for file input items.\n * @element dap-ds-file-input-list\n * @title - File input list\n * @group file-input\n *\n * @slot delete-button - The delete button.\n *\n * @event {{ file: FileListElement }} dds-file-click - Dispatched when a file is clicked.\n *\n * @csspart base - The main file input list container.\n *\n * @cssproperty --dds-file-list-display - Controls the display property (default: flex)\n * @cssproperty --dds-file-list-flex-direction - Controls the flex-direction property (default: column)\n * @cssproperty --dds-file-list-padding - Controls the padding property (default: 0)\n * @cssproperty --dds-file-list-list-style - Controls the list-style-type property (default: none)\n * @cssproperty --dds-file-list-gap - Controls the row-gap property (default: var(--dds-spacing-200))\n */\nexport default class DapDSFileInputList extends SizedMixin(DdsElement) {\n  static tagName = 'dap-ds-file-input-list'\n\n  static dependencies = {\n    'dap-ds-file-input-list-item': DapDSFileInputListItem,\n    'dap-ds-icon': DapDSIcon,\n    'dap-ds-form-label': DapDSFormLabel,\n  }\n\n  /** The aria label for the file input list. */\n  /** The id of the file input element to bind to. */\n  @property({ type: String }) for: string\n\n  /** Disables the file input list. */\n  @property({ type: Boolean, reflect: true }) disabled = false\n\n  /** The label for the file input list. */\n  @property() label?: string\n\n  /** Whether to show the delete button in the file input list item. */\n  @property({ type: String }) showDeleteButton = 'true'\n\n  /** Whether to show the file link in the file input list item. */\n  @property({ type: String }) showFileLink = 'true'\n\n  /** File item template function\n   * @type {(fileItemTemplate: FileItemTemplate) => TemplateResult}\n   */\n  @property({ attribute: false }) fileItemTemplate?: (\n    fileItemTemplate: FileItemTemplate,\n  ) => TemplateResult\n\n  /** The label of the file link. */\n  @property({ type: String }) fileLinkLabel: string\n\n  /** Whether to emit a custom event with the file data when the file is clicked. */\n  @property({ type: Boolean }) emitLinkEvent: boolean = false\n\n  /** Whether to show the file size in the file input list item */\n  @property({ type: String }) showFileSize = 'true'\n\n  /** Whether to show thumbnail preview for supported file types\n   * @ignore\n   */\n  @property({ type: String }) showThumbnail = 'false'\n\n  /** Size of the thumbnail preview\n   * @ignore\n   */\n  @property({ type: String })\n  thumbnailSize: 'xxs' | 'xs' | 'sm' | 'md' | 'lg' = 'sm'\n\n  @state()\n  private _files: TemplateResult[] = []\n\n  static readonly styles = unsafeCSS(styles)\n\n  private fileInputElement: DapDSFileInput | null = null\n\n  get files() {\n    return this.querySelectorAll('dap-ds-file-input-list-item')\n  }\n\n  getFileByName(name: string) {\n    return this.shadowRoot!.querySelector(\n      `dap-ds-file-input-list-item[filename=\"${name}\"]`,\n    )\n  }\n\n  private handleFileClick(event: Event) {\n    event.preventDefault()\n    event.stopPropagation()\n    this.emit('dds-file-click', { data: (event as CustomEvent).detail.data })\n  }\n\n  private _handleFilesAccepted(event: Event) {\n    const customEvent = event as CustomEvent<{ files: File[] }>\n    const files = customEvent.detail.files\n\n    const fileComponents = files.map((file: File) => {\n      const linkSlot = this.querySelector('[slot=\"link\"]')\n      const hasLinkSlot = linkSlot && linkSlot.innerHTML.trim() !== ''\n\n      return html`<dap-ds-file-input-list-item\n        size=${this.size}\n        .fileData=${file}\n        fileName=${file.name}\n        showDeleteButton=${this.showDeleteButton}\n        showFileLink=${this.showFileLink}\n        fileLinkLabel=${this.fileLinkLabel}\n        showFileSize=${this.showFileSize}\n        showThumbnail=${this.showThumbnail}\n        thumbnailSize=${this.thumbnailSize}\n        ?emitLinkEvent=${this.emitLinkEvent}\n        .fileItemTemplate=${this.fileItemTemplate}\n        @dds-file-click=${this.handleFileClick}\n        ?disabled=${this.disabled}>\n        <slot name=\"delete-button\" slot=\"delete-button\">\n          <dap-ds-icon\n            class=\"content__remove-button-icon\"\n            name=\"delete-bin-line\"></dap-ds-icon>\n        </slot>\n        ${hasLinkSlot ? html`<slot name=\"link\" slot=\"link\"></slot>` : nothing}\n      </dap-ds-file-input-list-item>`\n    })\n\n    this._files = fileComponents\n  }\n\n  protected firstUpdated(\n    _changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>,\n  ): void {\n    super.firstUpdated(_changedProperties)\n    if (this.for) {\n      this.fileInputElement = document.querySelector(`#${this.for}`)\n      if (this.fileInputElement) {\n        this.fileInputElement.fileList = this\n        this.fileInputElement?.addEventListener(\n          'dds-files-accepted',\n          this._handleFilesAccepted.bind(this),\n        )\n      }\n    }\n  }\n\n  removeFile(event: CustomEvent) {\n    this.fileInputElement?.dispatchEvent(\n      new CustomEvent('dds-file-remove', {\n        bubbles: false,\n        composed: true,\n        detail: event.detail,\n      }),\n    )\n  }\n\n  render() {\n    return html`${this._files.length > 0\n        ? html`<dap-ds-form-label\n            part=\"label\"\n            id=\"label\"\n            .size=${this.size}\n            label=${ifDefined(this.label)}>\n          </dap-ds-form-label>`\n        : nothing}\n      <ul\n        class=\"file-input-list\"\n        part=\"base\"\n        role=\"list\"\n        aria-label=${this.ariaLabel ?? t('fileInput.fileList')}\n        @dds-file-remove=${this.removeFile}>\n        ${this._files}\n      </ul>`\n  }\n}\n"],"names":["_DapDSFileInputList","SizedMixin","DdsElement","name","event","fileComponents","file","linkSlot","hasLinkSlot","html","nothing","_changedProperties","_a","ifDefined","t","DapDSFileInputListItem","DapDSIcon","DapDSFormLabel","unsafeCSS","styles","DapDSFileInputList","__decorateClass","property","state"],"mappings":";;;;;;;;;;;;;;;;;;;;AAkCqB,MAAAA,IAAA,MAAAA,UAA2BC,EAAWC,CAAU,EAAE;AAAA,EAAvE,cAAA;AAAA,UAAA,GAAA,SAAA,GAcyD,KAAA,WAAA,IAMR,KAAA,mBAAA,QAGJ,KAAA,eAAA,QAaW,KAAA,gBAAA,IAGX,KAAA,eAAA,QAKC,KAAA,gBAAA,SAMO,KAAA,gBAAA,MAGnD,KAAQ,SAA2B,CAAC,GAIpC,KAAQ,mBAA0C;AAAA,EAAA;AAAA,EAElD,IAAI,QAAQ;AACH,WAAA,KAAK,iBAAiB,6BAA6B;AAAA,EAAA;AAAA,EAG5D,cAAcC,GAAc;AAC1B,WAAO,KAAK,WAAY;AAAA,MACtB,yCAAyCA,CAAI;AAAA,IAC/C;AAAA,EAAA;AAAA,EAGM,gBAAgBC,GAAc;AACpC,IAAAA,EAAM,eAAe,GACrBA,EAAM,gBAAgB,GACtB,KAAK,KAAK,kBAAkB,EAAE,MAAOA,EAAsB,OAAO,MAAM;AAAA,EAAA;AAAA,EAGlE,qBAAqBA,GAAc;AAIzC,UAAMC,IAHcD,EACM,OAAO,MAEJ,IAAI,CAACE,MAAe;AACzC,YAAAC,IAAW,KAAK,cAAc,eAAe,GAC7CC,IAAcD,KAAYA,EAAS,UAAU,KAAW,MAAA;AAEvD,aAAAE;AAAAA,eACE,KAAK,IAAI;AAAA,oBACJH,CAAI;AAAA,mBACLA,EAAK,IAAI;AAAA,2BACD,KAAK,gBAAgB;AAAA,uBACzB,KAAK,YAAY;AAAA,wBAChB,KAAK,aAAa;AAAA,uBACnB,KAAK,YAAY;AAAA,wBAChB,KAAK,aAAa;AAAA,wBAClB,KAAK,aAAa;AAAA,yBACjB,KAAK,aAAa;AAAA,4BACf,KAAK,gBAAgB;AAAA,0BACvB,KAAK,eAAe;AAAA,oBAC1B,KAAK,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAMvBE,IAAcC,2CAA8CC,CAAO;AAAA;AAAA,IAAA,CAExE;AAED,SAAK,SAASL;AAAA,EAAA;AAAA,EAGN,aACRM,GACM;;AACN,UAAM,aAAaA,CAAkB,GACjC,KAAK,QACP,KAAK,mBAAmB,SAAS,cAAc,IAAI,KAAK,GAAG,EAAE,GACzD,KAAK,qBACP,KAAK,iBAAiB,WAAW,OACjCC,IAAA,KAAK,qBAAL,QAAAA,EAAuB;AAAA,MACrB;AAAA,MACA,KAAK,qBAAqB,KAAK,IAAI;AAAA;AAAA,EAGzC;AAAA,EAGF,WAAWR,GAAoB;;AAC7B,KAAAQ,IAAA,KAAK,qBAAL,QAAAA,EAAuB;AAAA,MACrB,IAAI,YAAY,mBAAmB;AAAA,QACjC,SAAS;AAAA,QACT,UAAU;AAAA,QACV,QAAQR,EAAM;AAAA,MACf,CAAA;AAAA;AAAA,EACH;AAAA,EAGF,SAAS;;AACP,WAAOK,IAAO,KAAK,OAAO,SAAS,IAC7BA;AAAAA;AAAAA;AAAAA,oBAGU,KAAK,IAAI;AAAA,oBACTI,EAAU,KAAK,KAAK,CAAC;AAAA,kCAE/BH,CAAO;AAAA;AAAA;AAAA;AAAA;AAAA,sBAKIE,IAAA,KAAK,cAAL,OAAAA,IAAkBE,EAAE,oBAAoB,CAAC;AAAA,2BACnC,KAAK,UAAU;AAAA,UAChC,KAAK,MAAM;AAAA;AAAA,EAAA;AAGrB;AAxJEd,EAAO,UAAU,0BAEjBA,EAAO,eAAe;AAAA,EACpB,+BAA+Be;AAAA,EAC/B,eAAeC;AAAA,EACf,qBAAqBC;AACvB,GAgDgBjB,EAAA,SAASkB,EAAUC,CAAM;AAvDtB,IAAAC,IAAApB;AAWSqB,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAQ,CAAA;AAAA,GAXPF,EAWS,WAAA,KAAA;AAGgBC,EAAA;AAAA,EAA3CC,EAAS,EAAE,MAAM,SAAS,SAAS,GAAM,CAAA;AAAA,GAdvBF,EAcyB,WAAA,UAAA;AAGhCC,EAAA;AAAA,EAAXC,EAAS;AAAA,GAjBSF,EAiBP,WAAA,OAAA;AAGgBC,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAQ,CAAA;AAAA,GApBPF,EAoBS,WAAA,kBAAA;AAGAC,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAQ,CAAA;AAAA,GAvBPF,EAuBS,WAAA,cAAA;AAKIC,EAAA;AAAA,EAA/BC,EAAS,EAAE,WAAW,GAAO,CAAA;AAAA,GA5BXF,EA4Ba,WAAA,kBAAA;AAKJC,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAQ,CAAA;AAAA,GAjCPF,EAiCS,WAAA,eAAA;AAGCC,EAAA;AAAA,EAA5BC,EAAS,EAAE,MAAM,QAAS,CAAA;AAAA,GApCRF,EAoCU,WAAA,eAAA;AAGDC,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAQ,CAAA;AAAA,GAvCPF,EAuCS,WAAA,cAAA;AAKAC,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAQ,CAAA;AAAA,GA5CPF,EA4CS,WAAA,eAAA;AAM5BC,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,OAAQ,CAAA;AAAA,GAjDPF,EAkDnB,WAAA,eAAA;AAGQC,EAAA;AAAA,EADPE,EAAM;AAAA,GApDYH,EAqDX,WAAA,QAAA;"}

package/dist/components/file-input/file-input-list.d.ts

@@ -1,5 +1,5 @@
-import { default as DapDSFileInputList } from './file-input-list.component.js';
-export * from './file-input-list.component.js';
+import { default as DapDSFileInputList } from './file-input-list.component';
+export * from './file-input-list.component';
 export default DapDSFileInputList;
 declare global {
     interface HTMLElementTagNameMap {

package/dist/components/file-input/file-input-list.js

@@ -0,0 +1,6 @@
+import e from "./file-input-list.component.js";
+e.define();
+export {
+  e as default
+};
+//# sourceMappingURL=file-input-list.js.map

package/dist/components/file-input/file-input-list.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"file-input-list.js","sources":["../../../src/components/file-input/file-input-list.ts"],"sourcesContent":["import DapDSFileInputList from './file-input-list.component'\n\nexport * from './file-input-list.component'\nexport default DapDSFileInputList\n\nDapDSFileInputList.define()\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'dap-ds-file-input-list': DapDSFileInputList\n  }\n}\n"],"names":["DapDSFileInputList"],"mappings":";AAKAA,EAAmB,OAAO;"}

package/dist/components/file-input/file-input-list.scss.js

@@ -0,0 +1,5 @@
+const t = "*,*:before,*:after{box-sizing:border-box;outline:none}* :not(dap-ds-table-cell,dap-ds-table-header){margin:0;padding:0}html:focus-within{scroll-behavior:smooth}a:not([class]){text-decoration-skip-ink:auto}img,picture,svg,video,canvas{max-width:100%;height:auto;background-repeat:no-repeat;background-size:cover;font-style:italic;vertical-align:middle}input,button,textarea,select{font:inherit}[hidden]{display:none!important}@media (prefers-reduced-motion: reduce){html:focus-within{scroll-behavior:auto}*,*:before,*:after{transition:none;transition-duration:.01ms!important;transition-delay:1ms!important;animation-duration:1ms!important;animation-delay:-1ms!important;animation-iteration-count:1!important;background-attachment:initial!important;scroll-behavior:auto!important}}body,html{height:100%;scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}input[type=number]{appearance:textfield}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{appearance:none}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);border-width:0;white-space:nowrap}.input-description{display:block;margin-bottom:var(--dds-spacing-200)}@keyframes dds-spin{to{transform:rotate(360deg)}}@keyframes dds-fade{0%,to{opacity:.3}50%{opacity:1}}:host{--dds-file-list-display: flex;--dds-file-list-flex-direction: column;--dds-file-list-padding: 0;--dds-file-list-list-style: none;--dds-file-list-gap: var(--dds-spacing-200)}.file-input-list{display:var(--dds-file-list-display);flex-direction:var(--dds-file-list-flex-direction);padding:var(--dds-file-list-padding);list-style-type:var(--dds-file-list-list-style);row-gap:var(--dds-file-list-gap)}";
+export {
+  t as default
+};
+//# sourceMappingURL=file-input-list.scss.js.map

package/dist/components/file-input/file-input-list.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"file-input-list.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/components/file-input/file-input.component.d.ts

@@ -1,5 +1,13 @@
 import { FileListElement, default as DapDSFileInputListItem } from './file-input-list-item.component';
 import { GenericFormElement } from '../../internal/mixin/genericFormElement';
+import { default as DapDSButton } from '../button/button.component';
+import { default as DapDSFeedback } from '../feedback/feedback.component';
+import { default as DapDSFormLabel } from '../form/form-label/form-label.component';
+import { default as DapDSIcon } from '../icon/icon.component';
+import { default as DapDSIconButton } from '../icon-button/icon-button.component';
+import { default as DapDSModal } from '../modal/modal.component';
+import { default as DapDSTooltip } from '../tooltip/tooltip.component';
+import { default as DapDSTypography } from '../typography/typography.component';
 import { default as DapDSFileInputList } from './file-input-list.component';
 /**
  * `dap-ds-file-input`
@@ -88,6 +96,17 @@ import { default as DapDSFileInputList } from './file-input-list.component';
  * @cssproperty --dds-file-input-dropzone-accept-color - The text color of the accepted file types in the dropzone (default: var(--dds-color-text-secondary))
  */
 export default class DapDSFileInput extends GenericFormElement {
+    static tagName: string;
+    static dependencies: {
+        'dap-ds-form-label': typeof DapDSFormLabel;
+        'dap-ds-tooltip': typeof DapDSTooltip;
+        'dap-ds-icon-button': typeof DapDSIconButton;
+        'dap-ds-icon': typeof DapDSIcon;
+        'dap-ds-typography': typeof DapDSTypography;
+        'dap-ds-button': typeof DapDSButton;
+        'dap-ds-modal': typeof DapDSModal;
+        'dap-ds-feedback': typeof DapDSFeedback;
+    };
     private readonly input;
     /** Label for the upload button */
     uploadButtonLabel: string;