@kyndryl-design-system/shidoka-applications 2.36.2 → 2.37.0

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 (10) hide show
  1. package/components/reusable/breadcrumbs/breadcrumbs.js +1 -1
  2. package/components/reusable/fileUploader/fileUploader.d.ts +1 -0
  3. package/components/reusable/fileUploader/fileUploader.d.ts.map +1 -1
  4. package/components/reusable/fileUploader/fileUploader.js +1 -1
  5. package/components/reusable/fileUploader/fileUploader.js.map +1 -1
  6. package/components/reusable/link/link.d.ts +2 -0
  7. package/components/reusable/link/link.d.ts.map +1 -1
  8. package/components/reusable/link/link.js +6 -3
  9. package/components/reusable/link/link.js.map +1 -1
  10. package/package.json +1 -1
package/components/reusable/breadcrumbs/breadcrumbs.js CHANGED
@@ -46,7 +46,7 @@ import{_ as t}from"../../../vendor/tslib-53a81efe.js";import{e}from"../../../ven
46
46
  line-height: var(--kd-line-height-utility-2-sm);
47
47
  font-weight: var(--kd-font-weight-regular);
48
48
  letter-spacing: var(--kd-letter-spacing-5);
49
- font-weight: 500;
49
+ font-weight: 400;
50
50
  }
51
51
  @media (min-width: 42rem) {
52
52
  .breadcrumbs ::slotted(strong) {
package/components/reusable/fileUploader/fileUploader.d.ts CHANGED
@@ -74,6 +74,7 @@ export declare class FileUploader extends FileUploader_base {
74
74
  id: string;
75
75
  file: File;
76
76
  status: 'sizeError' | 'typeError' | 'unknownError';
77
+ customErrorMsg?: string;
77
78
  }[];
78
79
  /**
79
80
  * Internal text strings.
package/components/reusable/fileUploader/fileUploader.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"fileUploader.d.ts","sourceRoot":"","sources":["../../../../src/components/reusable/fileUploader/fileUploader.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAYvC,OAAO,6BAA6B,CAAC;AACrC,OAAO,WAAW,CAAC;AACnB,OAAO,YAAY,CAAC;AACpB,OAAO,kBAAkB,CAAC;AAC1B,OAAO,iBAAiB,CAAC;;AAsBzB;;;;GAIG;AACH,qBACa,YAAa,SAAQ,iBAAqB;IACrD,OAAgB,MAAM,MAAoB;IAE1C;;;;;;;OAOG;IAEH,MAAM,EAAE,MAAM,EAAE,CAAM;IAEtB;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IAEH,WAAW;;;;;;;;;;;;;;;;;;MAAuB;IAElC;;;;;;OAMG;IAEH,WAAW,SAAW;IAEtB;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IAEH,UAAU,EAAE;QACV,EAAE,EAAE,MAAM,CAAC;QACX,IAAI,EAAE,IAAI,CAAC;QACX,MAAM,EAAE,KAAK,GAAG,WAAW,GAAG,UAAU,GAAG,OAAO,CAAC;KACpD,EAAE,CAAM;IAET;;OAEG;IAEH,YAAY,EAAE;QACZ,EAAE,EAAE,MAAM,CAAC;QACX,IAAI,EAAE,IAAI,CAAC;QACX,MAAM,EAAE,WAAW,GAAG,WAAW,GAAG,cAAc,CAAC;KACpD,EAAE,CAAM;IAET;;;OAGG;IAEH,YAAY;;;;;;;;;;;;;;;;;;MAAuB;IAEnC;;;OAGG;IAEH,SAAS,UAAS;IAElB;;;OAGG;IAEH,aAAa,EAAE,MAAM,EAAE,CAAM;IAE7B;;;OAGG;IAEH,WAAW,EAAE,MAAM,EAAE,CAAM;IAE3B;;;OAGG;IAEH,2BAA2B,UAAS;IAEpC;;;OAGG;IAEH,QAAQ,EAAG,gBAAgB,CAAC;IAEnB,UAAU,CAAC,YAAY,EAAE,GAAG;IAa5B,OAAO,CAAC,YAAY,EAAE,GAAG;IAUzB,MAAM;IAyJf,cAAc,CAAC,KAAK,EAAE,SAAS;IAM/B,UAAU,CAAC,KAAK,EAAE,SAAS;IAiB3B,OAAO,CAAC,kBAAkB;IAO1B,gBAAgB,CAAC,KAAK,EAAE,KAAK;IAa7B,OAAO,CAAC,aAAa;IAerB,OAAO,CAAC,kBAAkB;IAM1B,OAAO,CAAC,cAAc;IA2EtB,OAAO,CAAC,SAAS;IAuCjB,OAAO,CAAC,aAAa;IASrB,OAAO,CAAC,eAAe;IAuBvB,OAAO,CAAC,WAAW;IAYnB,OAAO,CAAC,oBAAoB;CAS7B;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,mBAAmB,EAAE,YAAY,CAAC;KACnC;CACF"}
1
+ {"version":3,"file":"fileUploader.d.ts","sourceRoot":"","sources":["../../../../src/components/reusable/fileUploader/fileUploader.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAYvC,OAAO,6BAA6B,CAAC;AACrC,OAAO,WAAW,CAAC;AACnB,OAAO,YAAY,CAAC;AACpB,OAAO,kBAAkB,CAAC;AAC1B,OAAO,iBAAiB,CAAC;;AAsBzB;;;;GAIG;AACH,qBACa,YAAa,SAAQ,iBAAqB;IACrD,OAAgB,MAAM,MAAoB;IAE1C;;;;;;;OAOG;IAEH,MAAM,EAAE,MAAM,EAAE,CAAM;IAEtB;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IAEH,WAAW;;;;;;;;;;;;;;;;;;MAAuB;IAElC;;;;;;OAMG;IAEH,WAAW,SAAW;IAEtB;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IAEH,UAAU,EAAE;QACV,EAAE,EAAE,MAAM,CAAC;QACX,IAAI,EAAE,IAAI,CAAC;QACX,MAAM,EAAE,KAAK,GAAG,WAAW,GAAG,UAAU,GAAG,OAAO,CAAC;KACpD,EAAE,CAAM;IAET;;OAEG;IAEH,YAAY,EAAE;QACZ,EAAE,EAAE,MAAM,CAAC;QACX,IAAI,EAAE,IAAI,CAAC;QACX,MAAM,EAAE,WAAW,GAAG,WAAW,GAAG,cAAc,CAAC;QACnD,cAAc,CAAC,EAAE,MAAM,CAAC;KACzB,EAAE,CAAM;IAET;;;OAGG;IAEH,YAAY;;;;;;;;;;;;;;;;;;MAAuB;IAEnC;;;OAGG;IAEH,SAAS,UAAS;IAElB;;;OAGG;IAEH,aAAa,EAAE,MAAM,EAAE,CAAM;IAE7B;;;OAGG;IAEH,WAAW,EAAE,MAAM,EAAE,CAAM;IAE3B;;;OAGG;IAEH,2BAA2B,UAAS;IAEpC;;;OAGG;IAEH,QAAQ,EAAG,gBAAgB,CAAC;IAEnB,UAAU,CAAC,YAAY,EAAE,GAAG;IAa5B,OAAO,CAAC,YAAY,EAAE,GAAG;IAUzB,MAAM;IA4Jf,cAAc,CAAC,KAAK,EAAE,SAAS;IAM/B,UAAU,CAAC,KAAK,EAAE,SAAS;IAiB3B,OAAO,CAAC,kBAAkB;IAO1B,gBAAgB,CAAC,KAAK,EAAE,KAAK;IAa7B,OAAO,CAAC,aAAa;IAerB,OAAO,CAAC,kBAAkB;IAM1B,OAAO,CAAC,cAAc;IA2EtB,OAAO,CAAC,SAAS;IAuCjB,OAAO,CAAC,aAAa;IASrB,OAAO,CAAC,eAAe;IAuBvB,OAAO,CAAC,WAAW;IAYnB,OAAO,CAAC,oBAAoB;CAS7B;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,mBAAmB,EAAE,YAAY,CAAC;KACnC;CACF"}
package/components/reusable/fileUploader/fileUploader.js CHANGED
@@ -365,7 +365,7 @@ import{_ as i}from"../../../vendor/tslib-53a81efe.js";import{o as e,c as t,n as
365
365
  </p>
366
366
  ·
367
367
  <p class="file-size error">
368
- ${"unknownError"===i.status?this._textStrings.customFileErrorText:"typeError"===i.status?this._textStrings.fileTypeErrorText:this._textStrings.fileSizeErrorText}
368
+ ${i.customErrorMsg&&""!==i.customErrorMsg?i.customErrorMsg:"unknownError"===i.status?this._textStrings.customFileErrorText:"typeError"===i.status?this._textStrings.fileTypeErrorText:this._textStrings.fileSizeErrorText}
369
369
  </p>
370
370
  </div>
371
371
  </div>
package/components/reusable/fileUploader/fileUploader.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"fileUploader.js","sources":["../../../../src/components/reusable/fileUploader/fileUploader.ts"],"sourcesContent":["import { LitElement, html } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { deepmerge } from 'deepmerge-ts';\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js';\nimport uploadIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/24/upload.svg';\nimport errorFilledIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/20/error-filled.svg';\nimport deleteIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/20/delete.svg';\nimport checkmarkIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/24/checkmark.svg';\nimport errorIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/24/error.svg';\nimport { FormMixin } from '../../../common/mixins/form-input';\nimport FileUploaderScss from './fileUploader.scss';\nimport './fileUploaderListContainer';\nimport '../button';\nimport '../loaders';\nimport '../inlineConfirm';\nimport '../notification';\n\nconst _defaultTextStrings = {\n dragAndDropText: 'Drag files here to upload',\n separatorText: 'or',\n buttonText: 'Browse files',\n maxFileSizeText: 'Max file size',\n supportedFileTypeText: 'Supported file type: ',\n fileTypeDisplyText: 'Any file type',\n invalidFileListLabel: 'Some files could not be added:',\n validFileListLabel: 'Files added:',\n clearListText: 'Clear list',\n fileTypeErrorText: 'Invaild file type',\n fileSizeErrorText: 'Max file size exceeded',\n customFileErrorText: 'Custom file error',\n inlineConfirmAnchorText: 'Delete',\n inlineConfirmConfirmText: 'Confirm',\n inlineConfirmCancelText: 'Cancel',\n validationNotificationTitle: 'Multiple files not allowed',\n validationNotificationMessage: 'Please select only one file.',\n};\n\n/**\n * File Uploader\n * @fires selected-files - Emits the uploaded files.\n * @slot upload-status - Slot for upload status/notification.\n */\n@customElement('kyn-file-uploader')\nexport class FileUploader extends FormMixin(LitElement) {\n static override styles = FileUploaderScss;\n\n /**\n * Set the file types that the component accepts. By default, it accepts all file types.\n * @example\n * ['image/jpeg', 'image/png']\n * ['image/*']\n * ['audio/*']\n * ['application/pdf', 'text/plain']\n */\n @property({ type: Array })\n accept: string[] = [];\n\n /**\n * Accept multiple files. Default value is `false`.\n */\n @property({ type: Boolean })\n multiple = false;\n\n /**\n * Customizable text strings.\n */\n @property({ type: Object })\n textStrings = _defaultTextStrings;\n\n /**\n * Set the maximum file size in bytes. Default value is `1048576` (1MB).\n * @example\n * 1048576 // 1MB\n * 5242880 // 5MB\n * 1073741824 // 1GB\n */\n @property({ type: Number })\n maxFileSize = 1048576; // 1MB\n\n /**\n * Disable the file uploader. Default value is `false`.\n */\n @property({ type: Boolean })\n disabled = false;\n\n /**\n * Valid files. This property is used to set the initial or updated state of the valid files.\n */\n @property({ type: Array })\n validFiles: {\n id: string;\n file: File;\n status: 'new' | 'uploading' | 'uploaded' | 'error';\n }[] = [];\n\n /**\n * Invalid files. This property is used to set the initial state of the invalid files.\n */\n @property({ type: Array })\n invalidFiles: {\n id: string;\n file: File;\n status: 'sizeError' | 'typeError' | 'unknownError';\n }[] = [];\n\n /**\n * Internal text strings.\n * @internal\n */\n @state()\n _textStrings = _defaultTextStrings;\n\n /**\n * Internal dragging state.\n * @internal\n */\n @state()\n _dragging = false;\n\n /**\n * Internal invalid files.\n * @internal\n */\n @state()\n _invalidFiles: Object[] = [];\n\n /**\n * Internal valid files.\n * @internal\n */\n @state()\n _validFiles: Object[] = [];\n\n /**\n * Internal notification message flag.\n * @internal\n */\n @state()\n _showValidationNotification = false;\n\n /**\n * Queries the <input> DOM element.\n * @ignore\n */\n @query('input')\n _inputEl!: HTMLInputElement;\n\n override willUpdate(changedProps: any) {\n if (changedProps.has('textStrings')) {\n this._textStrings = deepmerge(_defaultTextStrings, this.textStrings);\n }\n if (changedProps.has('validFiles')) {\n this._validFiles = this.validFiles;\n this._setFormValue();\n }\n if (changedProps.has('invalidFiles')) {\n this._invalidFiles = this.invalidFiles;\n }\n }\n\n override updated(changedProps: any) {\n if (changedProps.has('validFiles')) {\n this._validFiles = this.validFiles;\n this._setFormValue();\n }\n if (changedProps.has('invalidFiles')) {\n this._invalidFiles = this.invalidFiles;\n }\n }\n\n override render() {\n const dragDropContainerClasses = {\n 'drag-drop-container': true,\n dragging: this._dragging,\n disabled: this.disabled,\n };\n return html`\n <div class=\"file-uploader-container\">\n <!-- Drag and drop container -->\n <div class=\"drag-drop-container-wrapper\">\n <div\n class=${classMap(dragDropContainerClasses)}\n @dragover=\"${this.handleDragOver}\"\n @dragleave=\"${() => (this._dragging = false)}\"\n @drop=\"${this.handleDrop}\"\n >\n <div class=\"uploader-status-icon\">\n <span>${unsafeSVG(uploadIcon)}</span>\n </div>\n <p class=\"drag-drop-text\">${this._textStrings.dragAndDropText}</p>\n <p class=\"or-text\">${this._textStrings.separatorText}</p>\n <kyn-button\n kind=\"outline\"\n size=\"small\"\n ?disabled=${this.disabled}\n @on-click=\"${this._triggerFileSelect}\"\n >\n ${this._textStrings.buttonText}\n </kyn-button>\n <input\n class=\"file-input\"\n type=\"file\"\n @change=\"${(e: any) => this.handleFileChange(e)}\"\n id=\"fileInput\"\n accept=${this.accept.length > 0 ? this.accept.join(',') : '*/*'}\n ?multiple=${this.multiple}\n />\n </div>\n <div\n class=${classMap({\n 'upload-constraints': true,\n disabled: this.disabled,\n })}\n >\n <p>\n ${this._textStrings.maxFileSizeText}\n <strong>${this._getFilesSize(this.maxFileSize)}</strong>.\n ${this._textStrings.supportedFileTypeText}\n <strong>${this._textStrings.fileTypeDisplyText}</strong>.\n </p>\n </div>\n </div>\n <!-- File list -->\n <div\n class=${classMap({\n 'file-info-container': true,\n 'border-and-padding':\n this._validFiles.length > 0 || this._invalidFiles.length > 0,\n })}\n >\n <!-- Invalid files -->\n ${this._invalidFiles.length > 0\n ? html`\n <kyn-file-uploader-list-container\n id=\"invalidFiles\"\n .titleText=${this._textStrings.invalidFileListLabel}\n >\n ${this._invalidFiles.length > 0\n ? this._invalidFiles.map(\n (file: any) => html`\n <div class=\"file-uploader-item-container\">\n <span class=\"error-filled-icon\"\n >${unsafeSVG(errorFilledIcon)}</span\n >\n <div class=\"file-details-container\">\n <p class=\"file-name\">${file.file.name}</p>\n <div class=\"error-info-container\">\n <p class=\"file-size\">\n ${this._getFilesSize(file.file.size)}\n </p>\n ·\n <p class=\"file-size error\">\n ${file.status === 'unknownError'\n ? this._textStrings.customFileErrorText\n : file.status === 'typeError'\n ? this._textStrings.fileTypeErrorText\n : this._textStrings.fileSizeErrorText}\n </p>\n </div>\n </div>\n </div>\n `\n )\n : ''}\n <kyn-button\n slot=\"action-button\"\n kind=\"ghost\"\n size=\"small\"\n @on-click=${this._clearInvalidFiles}\n >\n ${this._textStrings.clearListText}\n </kyn-button>\n </kyn-file-uploader-list-container>\n `\n : ''}\n <!-- Valid files -->\n ${this._validFiles.length > 0\n ? html`\n <kyn-file-uploader-list-container\n .titleText=${this._textStrings.validFileListLabel}\n id=\"validFiles\"\n >\n ${this._validFiles.length > 0\n ? this._validFiles.map(\n (file: any) => html`\n <div class=\"file-uploader-item-container\">\n <div class=\"file-details-container\">\n <p class=\"file-name success\">${file.file.name}</p>\n <p class=\"file-size\">\n ${this._getFilesSize(file.file.size)}\n </p>\n </div>\n <div class=\"actions\">\n ${this._displayActions(file)}\n </div>\n </div>\n `\n )\n : ''}\n </kyn-file-uploader-list-container>\n `\n : ''}\n </div>\n ${this._showValidationNotification\n ? html` <kyn-notification\n .type=${'inline'}\n .tagStatus=${'error'}\n .notificationTitle=${this._textStrings\n .validationNotificationTitle}\n @on-close=${() => {\n this._showValidationNotification = false;\n }}\n >\n ${this._textStrings.validationNotificationMessage}\n </kyn-notification>`\n : ''}\n <div class=\"upload-status-container\">\n <slot name=\"upload-status\"></slot>\n </div>\n </div>\n `;\n }\n\n handleDragOver(event: DragEvent) {\n event.preventDefault();\n event.stopPropagation();\n this._dragging = true;\n }\n\n handleDrop(event: DragEvent) {\n event.preventDefault();\n event.stopPropagation();\n this._dragging = false;\n this._showValidationNotification = false;\n if (this.disabled) return;\n\n if (event.dataTransfer?.files) {\n const files = Array.from(event.dataTransfer.files);\n\n this._validateFiles(files);\n this._validate(true, false);\n this._setFormValue();\n this._emitFileUploadEvent();\n }\n }\n\n private _triggerFileSelect() {\n const fileInputElement = this.shadowRoot?.querySelector(\n '#fileInput'\n ) as HTMLInputElement;\n fileInputElement?.click();\n }\n\n handleFileChange(event: Event) {\n this._showValidationNotification = false;\n const target = event.target as HTMLInputElement;\n if (target.files) {\n const files = Array.from(target.files);\n\n this._validateFiles(files);\n this._validate(true, false);\n this._setFormValue();\n this._emitFileUploadEvent();\n }\n }\n\n private _getFilesSize(bytes: number) {\n if (bytes < 1024) {\n return `${bytes} Bytes`;\n } else if (bytes < 1024 * 1024) {\n const kb = bytes / 1024;\n return kb % 1 === 0 ? `${Math.floor(kb)} KB` : `${kb.toFixed(2)} KB`;\n } else if (bytes < 1024 * 1024 * 1024) {\n const mb = bytes / (1024 * 1024);\n return mb % 1 === 0 ? `${Math.floor(mb)} MB` : `${mb.toFixed(2)} MB`;\n } else {\n const gb = bytes / (1024 * 1024 * 1024);\n return gb % 1 === 0 ? `${Math.floor(gb)} GB` : `${gb.toFixed(2)} GB`;\n }\n }\n\n private _clearInvalidFiles() {\n this._invalidFiles = [];\n this._emitFileUploadEvent();\n }\n\n // Validate files\n private _validateFiles(files: File[]) {\n // Check if multiple files are uploaded\n if (!this.multiple && files.length > 1) {\n this._showValidationNotification = true;\n return;\n }\n\n const validFiles: Object[] = this.multiple ? [...this._validFiles] : [];\n const invalidFiles: Object[] = this.multiple ? [...this._invalidFiles] : [];\n\n files.forEach((file) => {\n const fileName = file.name;\n const fileType = file.type;\n const fileSize = file.size;\n\n // Check if the file type is valid\n const imageWildcard = this.accept.includes('image/*');\n const audioWildcard = this.accept.includes('audio/*');\n const videoWildcard = this.accept.includes('video/*');\n\n const fileExtension = (fileName.split('.').pop() || '').replace(/^/, '.');\n this.accept.includes(fileType);\n\n const isValidType =\n this.accept.length === 0 ||\n (imageWildcard && fileType.includes('image')) ||\n (audioWildcard && fileType.includes('audio')) ||\n (videoWildcard && fileType.includes('video')) ||\n this.accept.includes(fileType) ||\n this.accept.includes(fileExtension);\n\n // Check if the file size is valid\n const isValidSize = fileSize <= this.maxFileSize;\n\n const fileAlreadyValid = validFiles.some(\n (existingFile: any) => existingFile.file.name === file.name\n );\n const fileAlreadyInvalid = invalidFiles.some(\n (existingFile: any) => existingFile.file.name === file.name\n );\n\n if (isValidType && isValidSize && !fileAlreadyValid) {\n validFiles.push({\n file,\n id: fileName,\n status: 'new',\n });\n } else if ((!isValidType || !isValidSize) && !fileAlreadyInvalid) {\n let errorMsg = '';\n if (!isValidType) {\n errorMsg = 'typeError';\n } else if (!isValidSize) {\n errorMsg = 'sizeError';\n } else {\n errorMsg = 'unknownError';\n }\n invalidFiles.push({\n file,\n id: fileName,\n status: errorMsg,\n });\n }\n });\n\n // Update valid files\n if (validFiles.length > 0 || !this.multiple) {\n this._validFiles = validFiles;\n }\n\n // Update invalid files\n if (invalidFiles.length > 0 || !this.multiple) {\n this._invalidFiles = invalidFiles;\n }\n }\n\n private _validate(interacted: Boolean, report: Boolean) {\n const Validity =\n this.invalidText !== ''\n ? { ...this._inputEl.validity, customError: true }\n : this._inputEl.validity;\n\n let InternalMsg = '';\n if (this._invalidFiles.length > 0) {\n const hasTypeError = this._invalidFiles.some(\n (file: any) => file.status === 'typeError'\n );\n const hasSizeError = this._invalidFiles.some(\n (file: any) => file.status === 'sizeError'\n );\n InternalMsg =\n hasTypeError && hasSizeError\n ? 'Invalid file type and Exceeds maximum file size'\n : hasTypeError\n ? 'Invalid file type'\n : 'Exceeds maximum file size';\n }\n\n const ValidationMessage =\n this.invalidText !== '' ? this.invalidText : InternalMsg;\n\n if (interacted || this.invalidText !== '') {\n this._internals.setValidity(Validity, ValidationMessage);\n\n // set internal validation message if value was changed by user input\n if (interacted) {\n this._internalValidationMsg = InternalMsg;\n }\n }\n\n if (report) {\n this._internals.reportValidity();\n }\n }\n\n private _setFormValue() {\n const formData = new FormData();\n this._validFiles.forEach((fileObj: any) => {\n const { file } = fileObj;\n formData.append(this.name, file);\n });\n this._internals.setFormValue(formData);\n }\n\n private _displayActions(file: any) {\n if (file.status === 'uploading') {\n return html` <kyn-loader-inline></kyn-loader-inline> `;\n } else if (file.status === 'uploaded') {\n return html`\n <span class=\"success-icon\">${unsafeSVG(checkmarkIcon)}</span>\n `;\n } else if (file.status === 'error') {\n return html` <span class=\"error-icon\">${unsafeSVG(errorIcon)}</span> `;\n } else {\n return html` <kyn-inline-confirm\n ?destructive=${true}\n .anchorText=${this._textStrings.inlineConfirmAnchorText}\n .confirmText=${this._textStrings.inlineConfirmConfirmText}\n .cancelText=${this._textStrings.inlineConfirmCancelText}\n @on-confirm=${() => this._deleteFile(file.id)}\n >\n <span>${unsafeSVG(deleteIcon)}</span>\n <span slot=\"confirmIcon\">${unsafeSVG(deleteIcon)}</span>\n </kyn-inline-confirm>`;\n }\n }\n\n private _deleteFile(fileId: string) {\n this._validFiles = this._validFiles.filter(\n (file: any) => file.id !== fileId\n );\n const fileInputElement = this.shadowRoot?.querySelector(\n '#fileInput'\n ) as HTMLInputElement;\n fileInputElement.value = ''; // Clear the file input value\n this._setFormValue();\n this._emitFileUploadEvent();\n }\n\n private _emitFileUploadEvent() {\n const event = new CustomEvent('selected-files', {\n detail: {\n validFiles: this._validFiles,\n invalidFiles: this._invalidFiles,\n },\n });\n this.dispatchEvent(event);\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'kyn-file-uploader': FileUploader;\n }\n}\n"],"names":["_defaultTextStrings","dragAndDropText","separatorText","buttonText","maxFileSizeText","supportedFileTypeText","fileTypeDisplyText","invalidFileListLabel","validFileListLabel","clearListText","fileTypeErrorText","fileSizeErrorText","customFileErrorText","inlineConfirmAnchorText","inlineConfirmConfirmText","inlineConfirmCancelText","validationNotificationTitle","validationNotificationMessage","FileUploader","FormMixin","LitElement","constructor","this","accept","multiple","textStrings","maxFileSize","disabled","validFiles","invalidFiles","_textStrings","_dragging","_invalidFiles","_validFiles","_showValidationNotification","willUpdate","changedProps","has","deepmerge","_setFormValue","updated","render","dragDropContainerClasses","dragging","html","classMap","handleDragOver","handleDrop","unsafeSVG","uploadIcon","_triggerFileSelect","e","handleFileChange","length","join","_getFilesSize","map","file","errorFilledIcon","name","size","status","_clearInvalidFiles","_displayActions","event","preventDefault","stopPropagation","dataTransfer","_a","files","Array","from","_validateFiles","_validate","_emitFileUploadEvent","fileInputElement","shadowRoot","querySelector","click","target","bytes","kb","Math","floor","toFixed","mb","gb","forEach","fileName","fileType","type","fileSize","imageWildcard","includes","audioWildcard","videoWildcard","fileExtension","split","pop","replace","isValidType","isValidSize","fileAlreadyValid","some","existingFile","fileAlreadyInvalid","push","id","errorMsg","interacted","report","Validity","invalidText","_inputEl","validity","customError","InternalMsg","hasTypeError","hasSizeError","ValidationMessage","_internals","setValidity","_internalValidationMsg","reportValidity","formData","FormData","fileObj","append","setFormValue","checkmarkIcon","errorIcon","_deleteFile","deleteIcon","fileId","filter","value","CustomEvent","detail","dispatchEvent","styles","FileUploaderScss","__decorate","property","prototype","Boolean","Object","Number","state","query","customElement"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkBA,MAAMA,EAAsB,CAC1BC,gBAAiB,4BACjBC,cAAe,KACfC,WAAY,eACZC,gBAAiB,gBACjBC,sBAAuB,wBACvBC,mBAAoB,gBACpBC,qBAAsB,iCACtBC,mBAAoB,eACpBC,cAAe,aACfC,kBAAmB,oBACnBC,kBAAmB,yBACnBC,oBAAqB,oBACrBC,wBAAyB,SACzBC,yBAA0B,UAC1BC,wBAAyB,SACzBC,4BAA6B,6BAC7BC,8BAA+B,gCASpB,IAAAC,EAAN,cAA2BC,EAAUC,IAArC,WAAAC,uBAYLC,KAAMC,OAAa,GAMnBD,KAAQE,UAAG,EAMXF,KAAWG,YAAGzB,EAUdsB,KAAAI,YAAc,QAMdJ,KAAQK,UAAG,EAMXL,KAAUM,WAIJ,GAMNN,KAAYO,aAIN,GAONP,KAAYQ,aAAG9B,EAOfsB,KAASS,WAAG,EAOZT,KAAaU,cAAa,GAO1BV,KAAWW,YAAa,GAOxBX,KAA2BY,6BAAG,CAga/B,CAvZU,UAAAC,CAAWC,GACdA,EAAaC,IAAI,iBACnBf,KAAKQ,aAAeQ,EAAUtC,EAAqBsB,KAAKG,cAEtDW,EAAaC,IAAI,gBACnBf,KAAKW,YAAcX,KAAKM,WACxBN,KAAKiB,iBAEHH,EAAaC,IAAI,kBACnBf,KAAKU,cAAgBV,KAAKO,aAE7B,CAEQ,OAAAW,CAAQJ,GACXA,EAAaC,IAAI,gBACnBf,KAAKW,YAAcX,KAAKM,WACxBN,KAAKiB,iBAEHH,EAAaC,IAAI,kBACnBf,KAAKU,cAAgBV,KAAKO,aAE7B,CAEQ,MAAAY,GACP,MAAMC,EAA2B,CAC/B,uBAAuB,EACvBC,SAAUrB,KAAKS,UACfJ,SAAUL,KAAKK,UAEjB,OAAOiB,CAAI;;;;;oBAKKC,EAASH;yBACJpB,KAAKwB;0BACJ,IAAOxB,KAAKS,WAAY;qBAC7BT,KAAKyB;;;sBAGJC,EAAUC;;wCAEQ3B,KAAKQ,aAAa7B;iCACzBqB,KAAKQ,aAAa5B;;;;0BAIzBoB,KAAKK;2BACJL,KAAK4B;;gBAEhB5B,KAAKQ,aAAa3B;;;;;yBAKRgD,GAAW7B,KAAK8B,iBAAiBD;;uBAEpC7B,KAAKC,OAAO8B,OAAS,EAAI/B,KAAKC,OAAO+B,KAAK,KAAO;0BAC9ChC,KAAKE;;;;oBAIXqB,EAAS,CACf,sBAAsB,EACtBlB,SAAUL,KAAKK;;;gBAIbL,KAAKQ,aAAa1B;wBACVkB,KAAKiC,cAAcjC,KAAKI;gBAChCJ,KAAKQ,aAAazB;wBACViB,KAAKQ,aAAaxB;;;;;;kBAMxBuC,EAAS,CACf,uBAAuB,EACvB,qBACEvB,KAAKW,YAAYoB,OAAS,GAAK/B,KAAKU,cAAcqB,OAAS;;;YAI7D/B,KAAKU,cAAcqB,OAAS,EAC1BT,CAAI;;;+BAGatB,KAAKQ,aAAavB;;oBAE7Be,KAAKU,cAAcqB,OAAS,EAC1B/B,KAAKU,cAAcwB,KAChBC,GAAcb,CAAI;;;iCAGVI,EAAUU;;;qDAGUD,EAAKA,KAAKE;;;oCAG3BrC,KAAKiC,cAAcE,EAAKA,KAAKG;;;;oCAIb,iBAAhBH,EAAKI,OACHvC,KAAKQ,aAAalB,oBACF,cAAhB6C,EAAKI,OACLvC,KAAKQ,aAAapB,kBAClBY,KAAKQ,aAAanB;;;;;4BAOlC;;;;;gCAKUW,KAAKwC;;sBAEfxC,KAAKQ,aAAarB;;;gBAI1B;;YAEFa,KAAKW,YAAYoB,OAAS,EACxBT,CAAI;;+BAEatB,KAAKQ,aAAatB;;;oBAG7Bc,KAAKW,YAAYoB,OAAS,EACxB/B,KAAKW,YAAYuB,KACdC,GAAcb,CAAI;;;6DAGkBa,EAAKA,KAAKE;;kCAErCrC,KAAKiC,cAAcE,EAAKA,KAAKG;;;;gCAI/BtC,KAAKyC,gBAAgBN;;;4BAK/B;;gBAGR;;UAEJnC,KAAKY,4BACHU,CAAI;sBACM;2BACK;mCACQtB,KAAKQ,aACvBd;0BACS,KACVM,KAAKY,6BAA8B,CAAK;;gBAGxCZ,KAAKQ,aAAab;iCAEtB;;;;;KAMT,CAED,cAAA6B,CAAekB,GACbA,EAAMC,iBACND,EAAME,kBACN5C,KAAKS,WAAY,CAClB,CAED,UAAAgB,CAAWiB,SAKT,GAJAA,EAAMC,iBACND,EAAME,kBACN5C,KAAKS,WAAY,EACjBT,KAAKY,6BAA8B,GAC/BZ,KAAKK,WAEa,UAAlBqC,EAAMG,oBAAY,IAAAC,OAAA,EAAAA,EAAEC,OAAO,CAC7B,MAAMA,EAAQC,MAAMC,KAAKP,EAAMG,aAAaE,OAE5C/C,KAAKkD,eAAeH,GACpB/C,KAAKmD,WAAU,GAAM,GACrBnD,KAAKiB,gBACLjB,KAAKoD,sBACN,CACF,CAEO,kBAAAxB,SACN,MAAMyB,EAAkC,QAAfP,EAAA9C,KAAKsD,kBAAU,IAAAR,OAAA,EAAAA,EAAES,cACxC,cAEFF,SAAAA,EAAkBG,OACnB,CAED,gBAAA1B,CAAiBY,GACf1C,KAAKY,6BAA8B,EACnC,MAAM6C,EAASf,EAAMe,OACrB,GAAIA,EAAOV,MAAO,CAChB,MAAMA,EAAQC,MAAMC,KAAKQ,EAAOV,OAEhC/C,KAAKkD,eAAeH,GACpB/C,KAAKmD,WAAU,GAAM,GACrBnD,KAAKiB,gBACLjB,KAAKoD,sBACN,CACF,CAEO,aAAAnB,CAAcyB,GACpB,GAAIA,EAAQ,KACV,MAAO,GAAGA,UACL,GAAIA,EAAQ,QAAa,CAC9B,MAAMC,EAAKD,EAAQ,KACnB,OAAOC,EAAK,GAAM,EAAI,GAAGC,KAAKC,MAAMF,QAAW,GAAGA,EAAGG,QAAQ,OAC9D,CAAM,GAAIJ,EAAQ,WAAoB,CACrC,MAAMK,EAAKL,UACX,OAAOK,EAAK,GAAM,EAAI,GAAGH,KAAKC,MAAME,QAAW,GAAGA,EAAGD,QAAQ,OAC9D,CAAM,CACL,MAAME,EAAKN,EAAK,WAChB,OAAOM,EAAK,GAAM,EAAI,GAAGJ,KAAKC,MAAMG,QAAW,GAAGA,EAAGF,QAAQ,OAC9D,CACF,CAEO,kBAAAtB,GACNxC,KAAKU,cAAgB,GACrBV,KAAKoD,sBACN,CAGO,cAAAF,CAAeH,GAErB,IAAK/C,KAAKE,UAAY6C,EAAMhB,OAAS,EAEnC,YADA/B,KAAKY,6BAA8B,GAIrC,MAAMN,EAAuBN,KAAKE,SAAW,IAAIF,KAAKW,aAAe,GAC/DJ,EAAyBP,KAAKE,SAAW,IAAIF,KAAKU,eAAiB,GAEzEqC,EAAMkB,SAAS9B,IACb,MAAM+B,EAAW/B,EAAKE,KAChB8B,EAAWhC,EAAKiC,KAChBC,EAAWlC,EAAKG,KAGhBgC,EAAgBtE,KAAKC,OAAOsE,SAAS,WACrCC,EAAgBxE,KAAKC,OAAOsE,SAAS,WACrCE,EAAgBzE,KAAKC,OAAOsE,SAAS,WAErCG,GAAiBR,EAASS,MAAM,KAAKC,OAAS,IAAIC,QAAQ,IAAK,KACrE7E,KAAKC,OAAOsE,SAASJ,GAErB,MAAMW,EACmB,IAAvB9E,KAAKC,OAAO8B,QACXuC,GAAiBH,EAASI,SAAS,UACnCC,GAAiBL,EAASI,SAAS,UACnCE,GAAiBN,EAASI,SAAS,UACpCvE,KAAKC,OAAOsE,SAASJ,IACrBnE,KAAKC,OAAOsE,SAASG,GAGjBK,EAAcV,GAAYrE,KAAKI,YAE/B4E,EAAmB1E,EAAW2E,MACjCC,GAAsBA,EAAa/C,KAAKE,OAASF,EAAKE,OAEnD8C,EAAqB5E,EAAa0E,MACrCC,GAAsBA,EAAa/C,KAAKE,OAASF,EAAKE,OAGzD,GAAIyC,GAAeC,IAAgBC,EACjC1E,EAAW8E,KAAK,CACdjD,OACAkD,GAAInB,EACJ3B,OAAQ,aAEL,KAAMuC,GAAgBC,GAAiBI,GAAoB,CAChE,IAAIG,EAAW,GAMbA,EALGR,EAEOC,EAGC,eAFA,YAFA,YAMbxE,EAAa6E,KAAK,CAChBjD,OACAkD,GAAInB,EACJ3B,OAAQ+C,GAEX,MAIChF,EAAWyB,OAAS,IAAM/B,KAAKE,YACjCF,KAAKW,YAAcL,IAIjBC,EAAawB,OAAS,IAAM/B,KAAKE,YACnCF,KAAKU,cAAgBH,EAExB,CAEO,SAAA4C,CAAUoC,EAAqBC,GACrC,MAAMC,EACiB,KAArBzF,KAAK0F,YACD,IAAK1F,KAAK2F,SAASC,SAAUC,aAAa,GAC1C7F,KAAK2F,SAASC,SAEpB,IAAIE,EAAc,GAClB,GAAI9F,KAAKU,cAAcqB,OAAS,EAAG,CACjC,MAAMgE,EAAe/F,KAAKU,cAAcuE,MACrC9C,GAA8B,cAAhBA,EAAKI,SAEhByD,EAAehG,KAAKU,cAAcuE,MACrC9C,GAA8B,cAAhBA,EAAKI,SAEtBuD,EACEC,GAAgBC,EACZ,kDACAD,EACA,oBACA,2BACP,CAED,MAAME,EACiB,KAArBjG,KAAK0F,YAAqB1F,KAAK0F,YAAcI,GAE3CP,GAAmC,KAArBvF,KAAK0F,eACrB1F,KAAKkG,WAAWC,YAAYV,EAAUQ,GAGlCV,IACFvF,KAAKoG,uBAAyBN,IAI9BN,GACFxF,KAAKkG,WAAWG,gBAEnB,CAEO,aAAApF,GACN,MAAMqF,EAAW,IAAIC,SACrBvG,KAAKW,YAAYsD,SAASuC,IACxB,MAAMrE,KAAEA,GAASqE,EACjBF,EAASG,OAAOzG,KAAKqC,KAAMF,EAAK,IAElCnC,KAAKkG,WAAWQ,aAAaJ,EAC9B,CAEO,eAAA7D,CAAgBN,GACtB,MAAoB,cAAhBA,EAAKI,OACAjB,CAAI,4CACc,aAAhBa,EAAKI,OACPjB,CAAI;qCACoBI,EAAUiF;QAEhB,UAAhBxE,EAAKI,OACPjB,CAAI,6BAA6BI,EAAUkF,aAE3CtF,CAAI;wBACM;sBACDtB,KAAKQ,aAAajB;uBACjBS,KAAKQ,aAAahB;sBACnBQ,KAAKQ,aAAaf;sBAClB,IAAMO,KAAK6G,YAAY1E,EAAKkD;;gBAElC3D,EAAUoF;mCACSpF,EAAUoF;4BAG1C,CAEO,WAAAD,CAAYE,SAClB/G,KAAKW,YAAcX,KAAKW,YAAYqG,QACjC7E,GAAcA,EAAKkD,KAAO0B,KAEW,QAAfjE,EAAA9C,KAAKsD,kBAAU,IAAAR,OAAA,EAAAA,EAAES,cACxC,eAEe0D,MAAQ,GACzBjH,KAAKiB,gBACLjB,KAAKoD,sBACN,CAEO,oBAAAA,GACN,MAAMV,EAAQ,IAAIwE,YAAY,iBAAkB,CAC9CC,OAAQ,CACN7G,WAAYN,KAAKW,YACjBJ,aAAcP,KAAKU,iBAGvBV,KAAKoH,cAAc1E,EACpB,GA7fe9C,EAAMyH,OAAGC,EAWzBC,EAAA,CADCC,EAAS,CAAEpD,KAAMpB,SACIpD,EAAA6H,UAAA,cAAA,GAMtBF,EAAA,CADCC,EAAS,CAAEpD,KAAMsD,WACD9H,EAAA6H,UAAA,gBAAA,GAMjBF,EAAA,CADCC,EAAS,CAAEpD,KAAMuD,UACgB/H,EAAA6H,UAAA,mBAAA,GAUlCF,EAAA,CADCC,EAAS,CAAEpD,KAAMwD,UACIhI,EAAA6H,UAAA,mBAAA,GAMtBF,EAAA,CADCC,EAAS,CAAEpD,KAAMsD,WACD9H,EAAA6H,UAAA,gBAAA,GAMjBF,EAAA,CADCC,EAAS,CAAEpD,KAAMpB,SAKTpD,EAAA6H,UAAA,kBAAA,GAMTF,EAAA,CADCC,EAAS,CAAEpD,KAAMpB,SAKTpD,EAAA6H,UAAA,oBAAA,GAOTF,EAAA,CADCM,KACkCjI,EAAA6H,UAAA,oBAAA,GAOnCF,EAAA,CADCM,KACiBjI,EAAA6H,UAAA,iBAAA,GAOlBF,EAAA,CADCM,KAC4BjI,EAAA6H,UAAA,qBAAA,GAO7BF,EAAA,CADCM,KAC0BjI,EAAA6H,UAAA,mBAAA,GAO3BF,EAAA,CADCM,KACmCjI,EAAA6H,UAAA,mCAAA,GAOpCF,EAAA,CADCO,EAAM,UACqBlI,EAAA6H,UAAA,gBAAA,GAtGjB7H,EAAY2H,EAAA,CADxBQ,EAAc,sBACFnI"}
1
+ {"version":3,"file":"fileUploader.js","sources":["../../../../src/components/reusable/fileUploader/fileUploader.ts"],"sourcesContent":["import { LitElement, html } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { deepmerge } from 'deepmerge-ts';\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js';\nimport uploadIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/24/upload.svg';\nimport errorFilledIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/20/error-filled.svg';\nimport deleteIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/20/delete.svg';\nimport checkmarkIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/24/checkmark.svg';\nimport errorIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/24/error.svg';\nimport { FormMixin } from '../../../common/mixins/form-input';\nimport FileUploaderScss from './fileUploader.scss';\nimport './fileUploaderListContainer';\nimport '../button';\nimport '../loaders';\nimport '../inlineConfirm';\nimport '../notification';\n\nconst _defaultTextStrings = {\n dragAndDropText: 'Drag files here to upload',\n separatorText: 'or',\n buttonText: 'Browse files',\n maxFileSizeText: 'Max file size',\n supportedFileTypeText: 'Supported file type: ',\n fileTypeDisplyText: 'Any file type',\n invalidFileListLabel: 'Some files could not be added:',\n validFileListLabel: 'Files added:',\n clearListText: 'Clear list',\n fileTypeErrorText: 'Invaild file type',\n fileSizeErrorText: 'Max file size exceeded',\n customFileErrorText: 'Custom file error',\n inlineConfirmAnchorText: 'Delete',\n inlineConfirmConfirmText: 'Confirm',\n inlineConfirmCancelText: 'Cancel',\n validationNotificationTitle: 'Multiple files not allowed',\n validationNotificationMessage: 'Please select only one file.',\n};\n\n/**\n * File Uploader\n * @fires selected-files - Emits the uploaded files.\n * @slot upload-status - Slot for upload status/notification.\n */\n@customElement('kyn-file-uploader')\nexport class FileUploader extends FormMixin(LitElement) {\n static override styles = FileUploaderScss;\n\n /**\n * Set the file types that the component accepts. By default, it accepts all file types.\n * @example\n * ['image/jpeg', 'image/png']\n * ['image/*']\n * ['audio/*']\n * ['application/pdf', 'text/plain']\n */\n @property({ type: Array })\n accept: string[] = [];\n\n /**\n * Accept multiple files. Default value is `false`.\n */\n @property({ type: Boolean })\n multiple = false;\n\n /**\n * Customizable text strings.\n */\n @property({ type: Object })\n textStrings = _defaultTextStrings;\n\n /**\n * Set the maximum file size in bytes. Default value is `1048576` (1MB).\n * @example\n * 1048576 // 1MB\n * 5242880 // 5MB\n * 1073741824 // 1GB\n */\n @property({ type: Number })\n maxFileSize = 1048576; // 1MB\n\n /**\n * Disable the file uploader. Default value is `false`.\n */\n @property({ type: Boolean })\n disabled = false;\n\n /**\n * Valid files. This property is used to set the initial or updated state of the valid files.\n */\n @property({ type: Array })\n validFiles: {\n id: string;\n file: File;\n status: 'new' | 'uploading' | 'uploaded' | 'error';\n }[] = [];\n\n /**\n * Invalid files. This property is used to set the initial state of the invalid files.\n */\n @property({ type: Array })\n invalidFiles: {\n id: string;\n file: File;\n status: 'sizeError' | 'typeError' | 'unknownError';\n customErrorMsg?: string;\n }[] = [];\n\n /**\n * Internal text strings.\n * @internal\n */\n @state()\n _textStrings = _defaultTextStrings;\n\n /**\n * Internal dragging state.\n * @internal\n */\n @state()\n _dragging = false;\n\n /**\n * Internal invalid files.\n * @internal\n */\n @state()\n _invalidFiles: Object[] = [];\n\n /**\n * Internal valid files.\n * @internal\n */\n @state()\n _validFiles: Object[] = [];\n\n /**\n * Internal notification message flag.\n * @internal\n */\n @state()\n _showValidationNotification = false;\n\n /**\n * Queries the <input> DOM element.\n * @ignore\n */\n @query('input')\n _inputEl!: HTMLInputElement;\n\n override willUpdate(changedProps: any) {\n if (changedProps.has('textStrings')) {\n this._textStrings = deepmerge(_defaultTextStrings, this.textStrings);\n }\n if (changedProps.has('validFiles')) {\n this._validFiles = this.validFiles;\n this._setFormValue();\n }\n if (changedProps.has('invalidFiles')) {\n this._invalidFiles = this.invalidFiles;\n }\n }\n\n override updated(changedProps: any) {\n if (changedProps.has('validFiles')) {\n this._validFiles = this.validFiles;\n this._setFormValue();\n }\n if (changedProps.has('invalidFiles')) {\n this._invalidFiles = this.invalidFiles;\n }\n }\n\n override render() {\n const dragDropContainerClasses = {\n 'drag-drop-container': true,\n dragging: this._dragging,\n disabled: this.disabled,\n };\n return html`\n <div class=\"file-uploader-container\">\n <!-- Drag and drop container -->\n <div class=\"drag-drop-container-wrapper\">\n <div\n class=${classMap(dragDropContainerClasses)}\n @dragover=\"${this.handleDragOver}\"\n @dragleave=\"${() => (this._dragging = false)}\"\n @drop=\"${this.handleDrop}\"\n >\n <div class=\"uploader-status-icon\">\n <span>${unsafeSVG(uploadIcon)}</span>\n </div>\n <p class=\"drag-drop-text\">${this._textStrings.dragAndDropText}</p>\n <p class=\"or-text\">${this._textStrings.separatorText}</p>\n <kyn-button\n kind=\"outline\"\n size=\"small\"\n ?disabled=${this.disabled}\n @on-click=\"${this._triggerFileSelect}\"\n >\n ${this._textStrings.buttonText}\n </kyn-button>\n <input\n class=\"file-input\"\n type=\"file\"\n @change=\"${(e: any) => this.handleFileChange(e)}\"\n id=\"fileInput\"\n accept=${this.accept.length > 0 ? this.accept.join(',') : '*/*'}\n ?multiple=${this.multiple}\n />\n </div>\n <div\n class=${classMap({\n 'upload-constraints': true,\n disabled: this.disabled,\n })}\n >\n <p>\n ${this._textStrings.maxFileSizeText}\n <strong>${this._getFilesSize(this.maxFileSize)}</strong>.\n ${this._textStrings.supportedFileTypeText}\n <strong>${this._textStrings.fileTypeDisplyText}</strong>.\n </p>\n </div>\n </div>\n <!-- File list -->\n <div\n class=${classMap({\n 'file-info-container': true,\n 'border-and-padding':\n this._validFiles.length > 0 || this._invalidFiles.length > 0,\n })}\n >\n <!-- Invalid files -->\n ${this._invalidFiles.length > 0\n ? html`\n <kyn-file-uploader-list-container\n id=\"invalidFiles\"\n .titleText=${this._textStrings.invalidFileListLabel}\n >\n ${this._invalidFiles.length > 0\n ? this._invalidFiles.map(\n (file: any) => html`\n <div class=\"file-uploader-item-container\">\n <span class=\"error-filled-icon\"\n >${unsafeSVG(errorFilledIcon)}</span\n >\n <div class=\"file-details-container\">\n <p class=\"file-name\">${file.file.name}</p>\n <div class=\"error-info-container\">\n <p class=\"file-size\">\n ${this._getFilesSize(file.file.size)}\n </p>\n ·\n <p class=\"file-size error\">\n ${file.customErrorMsg &&\n file.customErrorMsg !== ''\n ? file.customErrorMsg\n : file.status === 'unknownError'\n ? this._textStrings.customFileErrorText\n : file.status === 'typeError'\n ? this._textStrings.fileTypeErrorText\n : this._textStrings.fileSizeErrorText}\n </p>\n </div>\n </div>\n </div>\n `\n )\n : ''}\n <kyn-button\n slot=\"action-button\"\n kind=\"ghost\"\n size=\"small\"\n @on-click=${this._clearInvalidFiles}\n >\n ${this._textStrings.clearListText}\n </kyn-button>\n </kyn-file-uploader-list-container>\n `\n : ''}\n <!-- Valid files -->\n ${this._validFiles.length > 0\n ? html`\n <kyn-file-uploader-list-container\n .titleText=${this._textStrings.validFileListLabel}\n id=\"validFiles\"\n >\n ${this._validFiles.length > 0\n ? this._validFiles.map(\n (file: any) => html`\n <div class=\"file-uploader-item-container\">\n <div class=\"file-details-container\">\n <p class=\"file-name success\">${file.file.name}</p>\n <p class=\"file-size\">\n ${this._getFilesSize(file.file.size)}\n </p>\n </div>\n <div class=\"actions\">\n ${this._displayActions(file)}\n </div>\n </div>\n `\n )\n : ''}\n </kyn-file-uploader-list-container>\n `\n : ''}\n </div>\n ${this._showValidationNotification\n ? html` <kyn-notification\n .type=${'inline'}\n .tagStatus=${'error'}\n .notificationTitle=${this._textStrings\n .validationNotificationTitle}\n @on-close=${() => {\n this._showValidationNotification = false;\n }}\n >\n ${this._textStrings.validationNotificationMessage}\n </kyn-notification>`\n : ''}\n <div class=\"upload-status-container\">\n <slot name=\"upload-status\"></slot>\n </div>\n </div>\n `;\n }\n\n handleDragOver(event: DragEvent) {\n event.preventDefault();\n event.stopPropagation();\n this._dragging = true;\n }\n\n handleDrop(event: DragEvent) {\n event.preventDefault();\n event.stopPropagation();\n this._dragging = false;\n this._showValidationNotification = false;\n if (this.disabled) return;\n\n if (event.dataTransfer?.files) {\n const files = Array.from(event.dataTransfer.files);\n\n this._validateFiles(files);\n this._validate(true, false);\n this._setFormValue();\n this._emitFileUploadEvent();\n }\n }\n\n private _triggerFileSelect() {\n const fileInputElement = this.shadowRoot?.querySelector(\n '#fileInput'\n ) as HTMLInputElement;\n fileInputElement?.click();\n }\n\n handleFileChange(event: Event) {\n this._showValidationNotification = false;\n const target = event.target as HTMLInputElement;\n if (target.files) {\n const files = Array.from(target.files);\n\n this._validateFiles(files);\n this._validate(true, false);\n this._setFormValue();\n this._emitFileUploadEvent();\n }\n }\n\n private _getFilesSize(bytes: number) {\n if (bytes < 1024) {\n return `${bytes} Bytes`;\n } else if (bytes < 1024 * 1024) {\n const kb = bytes / 1024;\n return kb % 1 === 0 ? `${Math.floor(kb)} KB` : `${kb.toFixed(2)} KB`;\n } else if (bytes < 1024 * 1024 * 1024) {\n const mb = bytes / (1024 * 1024);\n return mb % 1 === 0 ? `${Math.floor(mb)} MB` : `${mb.toFixed(2)} MB`;\n } else {\n const gb = bytes / (1024 * 1024 * 1024);\n return gb % 1 === 0 ? `${Math.floor(gb)} GB` : `${gb.toFixed(2)} GB`;\n }\n }\n\n private _clearInvalidFiles() {\n this._invalidFiles = [];\n this._emitFileUploadEvent();\n }\n\n // Validate files\n private _validateFiles(files: File[]) {\n // Check if multiple files are uploaded\n if (!this.multiple && files.length > 1) {\n this._showValidationNotification = true;\n return;\n }\n\n const validFiles: Object[] = this.multiple ? [...this._validFiles] : [];\n const invalidFiles: Object[] = this.multiple ? [...this._invalidFiles] : [];\n\n files.forEach((file) => {\n const fileName = file.name;\n const fileType = file.type;\n const fileSize = file.size;\n\n // Check if the file type is valid\n const imageWildcard = this.accept.includes('image/*');\n const audioWildcard = this.accept.includes('audio/*');\n const videoWildcard = this.accept.includes('video/*');\n\n const fileExtension = (fileName.split('.').pop() || '').replace(/^/, '.');\n this.accept.includes(fileType);\n\n const isValidType =\n this.accept.length === 0 ||\n (imageWildcard && fileType.includes('image')) ||\n (audioWildcard && fileType.includes('audio')) ||\n (videoWildcard && fileType.includes('video')) ||\n this.accept.includes(fileType) ||\n this.accept.includes(fileExtension);\n\n // Check if the file size is valid\n const isValidSize = fileSize <= this.maxFileSize;\n\n const fileAlreadyValid = validFiles.some(\n (existingFile: any) => existingFile.file.name === file.name\n );\n const fileAlreadyInvalid = invalidFiles.some(\n (existingFile: any) => existingFile.file.name === file.name\n );\n\n if (isValidType && isValidSize && !fileAlreadyValid) {\n validFiles.push({\n file,\n id: fileName,\n status: 'new',\n });\n } else if ((!isValidType || !isValidSize) && !fileAlreadyInvalid) {\n let errorMsg = '';\n if (!isValidType) {\n errorMsg = 'typeError';\n } else if (!isValidSize) {\n errorMsg = 'sizeError';\n } else {\n errorMsg = 'unknownError';\n }\n invalidFiles.push({\n file,\n id: fileName,\n status: errorMsg,\n });\n }\n });\n\n // Update valid files\n if (validFiles.length > 0 || !this.multiple) {\n this._validFiles = validFiles;\n }\n\n // Update invalid files\n if (invalidFiles.length > 0 || !this.multiple) {\n this._invalidFiles = invalidFiles;\n }\n }\n\n private _validate(interacted: Boolean, report: Boolean) {\n const Validity =\n this.invalidText !== ''\n ? { ...this._inputEl.validity, customError: true }\n : this._inputEl.validity;\n\n let InternalMsg = '';\n if (this._invalidFiles.length > 0) {\n const hasTypeError = this._invalidFiles.some(\n (file: any) => file.status === 'typeError'\n );\n const hasSizeError = this._invalidFiles.some(\n (file: any) => file.status === 'sizeError'\n );\n InternalMsg =\n hasTypeError && hasSizeError\n ? 'Invalid file type and Exceeds maximum file size'\n : hasTypeError\n ? 'Invalid file type'\n : 'Exceeds maximum file size';\n }\n\n const ValidationMessage =\n this.invalidText !== '' ? this.invalidText : InternalMsg;\n\n if (interacted || this.invalidText !== '') {\n this._internals.setValidity(Validity, ValidationMessage);\n\n // set internal validation message if value was changed by user input\n if (interacted) {\n this._internalValidationMsg = InternalMsg;\n }\n }\n\n if (report) {\n this._internals.reportValidity();\n }\n }\n\n private _setFormValue() {\n const formData = new FormData();\n this._validFiles.forEach((fileObj: any) => {\n const { file } = fileObj;\n formData.append(this.name, file);\n });\n this._internals.setFormValue(formData);\n }\n\n private _displayActions(file: any) {\n if (file.status === 'uploading') {\n return html` <kyn-loader-inline></kyn-loader-inline> `;\n } else if (file.status === 'uploaded') {\n return html`\n <span class=\"success-icon\">${unsafeSVG(checkmarkIcon)}</span>\n `;\n } else if (file.status === 'error') {\n return html` <span class=\"error-icon\">${unsafeSVG(errorIcon)}</span> `;\n } else {\n return html` <kyn-inline-confirm\n ?destructive=${true}\n .anchorText=${this._textStrings.inlineConfirmAnchorText}\n .confirmText=${this._textStrings.inlineConfirmConfirmText}\n .cancelText=${this._textStrings.inlineConfirmCancelText}\n @on-confirm=${() => this._deleteFile(file.id)}\n >\n <span>${unsafeSVG(deleteIcon)}</span>\n <span slot=\"confirmIcon\">${unsafeSVG(deleteIcon)}</span>\n </kyn-inline-confirm>`;\n }\n }\n\n private _deleteFile(fileId: string) {\n this._validFiles = this._validFiles.filter(\n (file: any) => file.id !== fileId\n );\n const fileInputElement = this.shadowRoot?.querySelector(\n '#fileInput'\n ) as HTMLInputElement;\n fileInputElement.value = ''; // Clear the file input value\n this._setFormValue();\n this._emitFileUploadEvent();\n }\n\n private _emitFileUploadEvent() {\n const event = new CustomEvent('selected-files', {\n detail: {\n validFiles: this._validFiles,\n invalidFiles: this._invalidFiles,\n },\n });\n this.dispatchEvent(event);\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'kyn-file-uploader': FileUploader;\n }\n}\n"],"names":["_defaultTextStrings","dragAndDropText","separatorText","buttonText","maxFileSizeText","supportedFileTypeText","fileTypeDisplyText","invalidFileListLabel","validFileListLabel","clearListText","fileTypeErrorText","fileSizeErrorText","customFileErrorText","inlineConfirmAnchorText","inlineConfirmConfirmText","inlineConfirmCancelText","validationNotificationTitle","validationNotificationMessage","FileUploader","FormMixin","LitElement","constructor","this","accept","multiple","textStrings","maxFileSize","disabled","validFiles","invalidFiles","_textStrings","_dragging","_invalidFiles","_validFiles","_showValidationNotification","willUpdate","changedProps","has","deepmerge","_setFormValue","updated","render","dragDropContainerClasses","dragging","html","classMap","handleDragOver","handleDrop","unsafeSVG","uploadIcon","_triggerFileSelect","e","handleFileChange","length","join","_getFilesSize","map","file","errorFilledIcon","name","size","customErrorMsg","status","_clearInvalidFiles","_displayActions","event","preventDefault","stopPropagation","dataTransfer","_a","files","Array","from","_validateFiles","_validate","_emitFileUploadEvent","fileInputElement","shadowRoot","querySelector","click","target","bytes","kb","Math","floor","toFixed","mb","gb","forEach","fileName","fileType","type","fileSize","imageWildcard","includes","audioWildcard","videoWildcard","fileExtension","split","pop","replace","isValidType","isValidSize","fileAlreadyValid","some","existingFile","fileAlreadyInvalid","push","id","errorMsg","interacted","report","Validity","invalidText","_inputEl","validity","customError","InternalMsg","hasTypeError","hasSizeError","ValidationMessage","_internals","setValidity","_internalValidationMsg","reportValidity","formData","FormData","fileObj","append","setFormValue","checkmarkIcon","errorIcon","_deleteFile","deleteIcon","fileId","filter","value","CustomEvent","detail","dispatchEvent","styles","FileUploaderScss","__decorate","property","prototype","Boolean","Object","Number","state","query","customElement"],"mappings":"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"}
package/components/reusable/link/link.d.ts CHANGED
@@ -22,6 +22,8 @@ export declare class Link extends LitElement {
22
22
  standalone: boolean;
23
23
  /** Positions icon on the left. */
24
24
  iconLeft: boolean;
25
+ /** Sets font-weight between default heavier and lighter font-weight. */
26
+ linkFontWeight: 'lighter' | 'default';
25
27
  render(): import("lit").TemplateResult<1>;
26
28
  private returnClassMap;
27
29
  private handleClick;
package/components/reusable/link/link.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"link.d.ts","sourceRoot":"","sources":["../../../../src/components/reusable/link/link.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAGvC,OAAO,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,QAAQ,CAAC;AAIlD;;;;;GAKG;AAEH,qBACa,IAAK,SAAQ,UAAU;IAClC,OAAgB,MAAM,QAAgB;IAEtC,gBAAgB;IAEhB,IAAI,SAAM;IAEV,oIAAoI;IAEpI,MAAM,EAAE,YAAY,CAAqB;IAEzC,oDAAoD;IAEpD,IAAI,EAAE,UAAU,CAAsB;IAEtC,oIAAoI;IAEpI,GAAG,SAAM;IAET,yCAAyC;IAIzC,QAAQ,UAAS;IAEjB,iHAAiH;IAEjH,UAAU,UAAS;IAEnB,kCAAkC;IAElC,QAAQ,UAAS;IAER,MAAM;IAsBf,OAAO,CAAC,cAAc;IAqBtB,OAAO,CAAC,WAAW;CAWpB;AACD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,IAAI,CAAC;KAClB;CACF"}
1
+ {"version":3,"file":"link.d.ts","sourceRoot":"","sources":["../../../../src/components/reusable/link/link.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAGvC,OAAO,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,QAAQ,CAAC;AAIlD;;;;;GAKG;AAEH,qBACa,IAAK,SAAQ,UAAU;IAClC,OAAgB,MAAM,QAAgB;IAEtC,gBAAgB;IAEhB,IAAI,SAAM;IAEV,oIAAoI;IAEpI,MAAM,EAAE,YAAY,CAAqB;IAEzC,oDAAoD;IAEpD,IAAI,EAAE,UAAU,CAAsB;IAEtC,oIAAoI;IAEpI,GAAG,SAAM;IAET,yCAAyC;IAIzC,QAAQ,UAAS;IAEjB,iHAAiH;IAEjH,UAAU,UAAS;IAEnB,kCAAkC;IAElC,QAAQ,UAAS;IAEjB,wEAAwE;IAExE,cAAc,EAAE,SAAS,GAAG,SAAS,CAAa;IAEzC,MAAM;IAsBf,OAAO,CAAC,cAAc;IAsBtB,OAAO,CAAC,WAAW;CAWpB;AACD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,IAAI,CAAC;KAClB;CACF"}
package/components/reusable/link/link.js CHANGED
@@ -1,4 +1,4 @@
1
- import{_ as t}from"../../../vendor/tslib-53a81efe.js";import{n as e,e as n}from"../../../vendor/lit-461e78e6.js";import{i as o,s as i,x as l}from"../../../vendor/lit-element-c6c02f24.js";import{e as r}from"../../../vendor/lit-html-29220869.js";import{LINK_TARGETS as a,LINK_TYPES as s}from"./defs.js";var d=o`*,
1
+ import{_ as t}from"../../../vendor/tslib-53a81efe.js";import{n as e,e as n}from"../../../vendor/lit-461e78e6.js";import{i as o,s as i,x as l}from"../../../vendor/lit-element-c6c02f24.js";import{e as r}from"../../../vendor/lit-html-29220869.js";import{LINK_TARGETS as a,LINK_TYPES as s}from"./defs.js";var k=o`*,
2
2
  *::before,
3
3
  *::after {
4
4
  box-sizing: border-box;
@@ -51,6 +51,9 @@ import{_ as t}from"../../../vendor/tslib-53a81efe.js";import{n as e,e as n}from"
51
51
  .kyn-link-text-secondary:active {
52
52
  color: var(--kd-color-text-link-level-pressed);
53
53
  }
54
+ .kyn-link-text-font-lighter {
55
+ font-weight: 400;
56
+ }
54
57
  .kyn-link-text-disabled {
55
58
  cursor: not-allowed;
56
59
  color: var(--kd-color-text-link-level-disabled);
@@ -111,7 +114,7 @@ import{_ as t}from"../../../vendor/tslib-53a81efe.js";import{n as e,e as n}from"
111
114
  }
112
115
  .kyn-link-text-secondary-ai.kyn-link-text-disabled {
113
116
  color: var(--kd-color-background-link-ai-disabled);
114
- }`;let k=class extends i{constructor(){super(...arguments),this.href="",this.target=a.SELF,this.kind=s.PRIMARY,this.rel="",this.disabled=!1,this.standalone=!1,this.iconLeft=!1}render(){const t=this.returnClassMap();return l`
117
+ }`;let d=class extends i{constructor(){super(...arguments),this.href="",this.target=a.SELF,this.kind=s.PRIMARY,this.rel="",this.disabled=!1,this.standalone=!1,this.iconLeft=!1,this.linkFontWeight="default"}render(){const t=this.returnClassMap();return l`
115
118
  <a
116
119
  class="kyn-link-text ${t}"
117
120
  target=${this.target}
@@ -127,5 +130,5 @@ import{_ as t}from"../../../vendor/tslib-53a81efe.js";import{n as e,e as n}from"
127
130
  <slot name="icon"></slot>
128
131
  </span>
129
132
  </a>
130
- `}returnClassMap(){const t={"kyn-link-text-disabled":this.disabled,"icon-left":this.iconLeft,"kyn-link-text-ai":this.kind===s.AI_CONNECTED};return this.disabled?r(t):r({...t,"kyn-link-text-primary":this.kind===s.PRIMARY||!this.kind,"kyn-link-text-secondary":this.kind===s.SECONDARY,"kyn-link-text-secondary-ai":this.kind===s.SECONDARY_AI,"kyn-link-text-inline":!this.standalone,"kyn-link-text-standalone":this.standalone})}handleClick(t){if(this.disabled)return void t.preventDefault();const e=new CustomEvent("on-click",{detail:{href:this.href,origEvent:t}});this.dispatchEvent(e)}};k.styles=[d],t([e({type:String})],k.prototype,"href",void 0),t([e({type:String})],k.prototype,"target",void 0),t([e({type:String})],k.prototype,"kind",void 0),t([e({type:String})],k.prototype,"rel",void 0),t([e({type:Boolean,reflect:!0})],k.prototype,"disabled",void 0),t([e({type:Boolean})],k.prototype,"standalone",void 0),t([e({type:Boolean})],k.prototype,"iconLeft",void 0),k=t([n("kyn-link")],k);export{k as Link};
133
+ `}returnClassMap(){const t={"kyn-link-text-disabled":this.disabled,"icon-left":this.iconLeft,"kyn-link-text-ai":this.kind===s.AI_CONNECTED,"kyn-link-text-font-lighter":"lighter"===this.linkFontWeight};return this.disabled?r(t):r({...t,"kyn-link-text-primary":this.kind===s.PRIMARY||!this.kind,"kyn-link-text-secondary":this.kind===s.SECONDARY,"kyn-link-text-secondary-ai":this.kind===s.SECONDARY_AI,"kyn-link-text-inline":!this.standalone,"kyn-link-text-standalone":this.standalone})}handleClick(t){if(this.disabled)return void t.preventDefault();const e=new CustomEvent("on-click",{detail:{href:this.href,origEvent:t}});this.dispatchEvent(e)}};d.styles=[k],t([e({type:String})],d.prototype,"href",void 0),t([e({type:String})],d.prototype,"target",void 0),t([e({type:String})],d.prototype,"kind",void 0),t([e({type:String})],d.prototype,"rel",void 0),t([e({type:Boolean,reflect:!0})],d.prototype,"disabled",void 0),t([e({type:Boolean})],d.prototype,"standalone",void 0),t([e({type:Boolean})],d.prototype,"iconLeft",void 0),t([e({type:String})],d.prototype,"linkFontWeight",void 0),d=t([n("kyn-link")],d);export{d as Link};
131
134
  //# sourceMappingURL=link.js.map
package/components/reusable/link/link.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"link.js","sources":["../../../../src/components/reusable/link/link.ts"],"sourcesContent":["import { LitElement, html } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { classMap } from 'lit-html/directives/class-map.js';\nimport { LINK_TYPES, LINK_TARGETS } from './defs';\n\nimport LinkStyles from './link.scss';\n\n/**\n * Component for navigation links.\n * @fires on-click - Captures the click event and emits the original event details.\n * @slot unnamed - Slot for link text.\n * @slot icon - Slot for an icon.\n */\n\n@customElement('kyn-link')\nexport class Link extends LitElement {\n static override styles = [LinkStyles];\n\n /** Link url. */\n @property({ type: String })\n href = '';\n\n /** Defines a target attribute for where to load the URL. Possible options include \"_self\" (default), \"_blank\", \"_parent\", \"_top\" */\n @property({ type: String })\n target: LINK_TARGETS = LINK_TARGETS.SELF;\n\n /** The Link type. Primary(App) or Secondary(Web).*/\n @property({ type: String })\n kind: LINK_TYPES = LINK_TYPES.PRIMARY;\n\n /** Defines a relationship between a linked resource and the document. An empty string (default) means no particular relationship */\n @property({ type: String })\n rel = '';\n\n /** Determines if the link is disabled.*/\n // Reference for disabled links:\n // https://www.scottohara.me/blog/2021/05/28/disabled-links.html\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n /** Whether you want the standalone Link. By default false. Use this prop. (true) with icon with link variant. */\n @property({ type: Boolean })\n standalone = false;\n\n /** Positions icon on the left. */\n @property({ type: Boolean })\n iconLeft = false;\n\n override render() {\n const classes = this.returnClassMap();\n\n return html`\n <a\n class=\"kyn-link-text ${classes}\"\n target=${this.target}\n part=\"link\"\n rel=${this.rel}\n href=${this.href ? this.href : 'javascript:void(0)'}\n ?disabled=${this.disabled}\n aria-disabled=${this.disabled}\n @click=${(e: Event) => this.handleClick(e)}\n >\n <span class=\"kyn-link-text-span-flex\">\n <slot></slot>\n <slot name=\"icon\"></slot>\n </span>\n </a>\n `;\n }\n // -- Apply classes according to states, kind etc. -- //\n private returnClassMap() {\n const baseClasses = {\n 'kyn-link-text-disabled': this.disabled,\n 'icon-left': this.iconLeft,\n 'kyn-link-text-ai': this.kind === LINK_TYPES.AI_CONNECTED,\n };\n\n if (this.disabled) {\n return classMap(baseClasses);\n } else {\n return classMap({\n ...baseClasses,\n 'kyn-link-text-primary': this.kind === LINK_TYPES.PRIMARY || !this.kind,\n 'kyn-link-text-secondary': this.kind === LINK_TYPES.SECONDARY,\n 'kyn-link-text-secondary-ai': this.kind === LINK_TYPES.SECONDARY_AI,\n 'kyn-link-text-inline': !this.standalone,\n 'kyn-link-text-standalone': this.standalone,\n });\n }\n }\n\n private handleClick(e: Event) {\n if (this.disabled) {\n e.preventDefault();\n return;\n }\n\n const event = new CustomEvent('on-click', {\n detail: { href: this.href, origEvent: e },\n });\n this.dispatchEvent(event);\n }\n}\ndeclare global {\n interface HTMLElementTagNameMap {\n 'kyn-link': Link;\n }\n}\n"],"names":["Link","LitElement","constructor","this","href","target","LINK_TARGETS","SELF","kind","LINK_TYPES","PRIMARY","rel","disabled","standalone","iconLeft","render","classes","returnClassMap","html","e","handleClick","baseClasses","AI_CONNECTED","classMap","SECONDARY","SECONDARY_AI","preventDefault","event","CustomEvent","detail","origEvent","dispatchEvent","styles","LinkStyles","__decorate","property","type","String","prototype","Boolean","reflect","customElement"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAeO,IAAMA,EAAN,cAAmBC,EAAnB,WAAAC,uBAKLC,KAAIC,KAAG,GAIPD,KAAAE,OAAuBC,EAAaC,KAIpCJ,KAAAK,KAAmBC,EAAWC,QAI9BP,KAAGQ,IAAG,GAMNR,KAAQS,UAAG,EAIXT,KAAUU,YAAG,EAIbV,KAAQW,UAAG,CAwDZ,CAtDU,MAAAC,GACP,MAAMC,EAAUb,KAAKc,iBAErB,OAAOC,CAAI;;+BAEgBF;iBACdb,KAAKE;;cAERF,KAAKQ;eACJR,KAAKC,KAAOD,KAAKC,KAAO;oBACnBD,KAAKS;wBACDT,KAAKS;iBACXO,GAAahB,KAAKiB,YAAYD;;;;;;;KAQ7C,CAEO,cAAAF,GACN,MAAMI,EAAc,CAClB,yBAA0BlB,KAAKS,SAC/B,YAAaT,KAAKW,SAClB,mBAAoBX,KAAKK,OAASC,EAAWa,cAG/C,OAAInB,KAAKS,SACAW,EAASF,GAETE,EAAS,IACXF,EACH,wBAAyBlB,KAAKK,OAASC,EAAWC,UAAYP,KAAKK,KACnE,0BAA2BL,KAAKK,OAASC,EAAWe,UACpD,6BAA8BrB,KAAKK,OAASC,EAAWgB,aACvD,wBAAyBtB,KAAKU,WAC9B,2BAA4BV,KAAKU,YAGtC,CAEO,WAAAO,CAAYD,GAClB,GAAIhB,KAAKS,SAEP,YADAO,EAAEO,iBAIJ,MAAMC,EAAQ,IAAIC,YAAY,WAAY,CACxCC,OAAQ,CAAEzB,KAAMD,KAAKC,KAAM0B,UAAWX,KAExChB,KAAK4B,cAAcJ,EACpB,GArFe3B,EAAAgC,OAAS,CAACC,GAI1BC,EAAA,CADCC,EAAS,CAAEC,KAAMC,UACRrC,EAAAsC,UAAA,YAAA,GAIVJ,EAAA,CADCC,EAAS,CAAEC,KAAMC,UACuBrC,EAAAsC,UAAA,cAAA,GAIzCJ,EAAA,CADCC,EAAS,CAAEC,KAAMC,UACoBrC,EAAAsC,UAAA,YAAA,GAItCJ,EAAA,CADCC,EAAS,CAAEC,KAAMC,UACTrC,EAAAsC,UAAA,WAAA,GAMTJ,EAAA,CADCC,EAAS,CAAEC,KAAMG,QAASC,SAAS,KACnBxC,EAAAsC,UAAA,gBAAA,GAIjBJ,EAAA,CADCC,EAAS,CAAEC,KAAMG,WACCvC,EAAAsC,UAAA,kBAAA,GAInBJ,EAAA,CADCC,EAAS,CAAEC,KAAMG,WACDvC,EAAAsC,UAAA,gBAAA,GA/BNtC,EAAIkC,EAAA,CADhBO,EAAc,aACFzC"}
1
+ {"version":3,"file":"link.js","sources":["../../../../src/components/reusable/link/link.ts"],"sourcesContent":["import { LitElement, html } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { classMap } from 'lit-html/directives/class-map.js';\nimport { LINK_TYPES, LINK_TARGETS } from './defs';\n\nimport LinkStyles from './link.scss';\n\n/**\n * Component for navigation links.\n * @fires on-click - Captures the click event and emits the original event details.\n * @slot unnamed - Slot for link text.\n * @slot icon - Slot for an icon.\n */\n\n@customElement('kyn-link')\nexport class Link extends LitElement {\n static override styles = [LinkStyles];\n\n /** Link url. */\n @property({ type: String })\n href = '';\n\n /** Defines a target attribute for where to load the URL. Possible options include \"_self\" (default), \"_blank\", \"_parent\", \"_top\" */\n @property({ type: String })\n target: LINK_TARGETS = LINK_TARGETS.SELF;\n\n /** The Link type. Primary(App) or Secondary(Web).*/\n @property({ type: String })\n kind: LINK_TYPES = LINK_TYPES.PRIMARY;\n\n /** Defines a relationship between a linked resource and the document. An empty string (default) means no particular relationship */\n @property({ type: String })\n rel = '';\n\n /** Determines if the link is disabled.*/\n // Reference for disabled links:\n // https://www.scottohara.me/blog/2021/05/28/disabled-links.html\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n /** Whether you want the standalone Link. By default false. Use this prop. (true) with icon with link variant. */\n @property({ type: Boolean })\n standalone = false;\n\n /** Positions icon on the left. */\n @property({ type: Boolean })\n iconLeft = false;\n\n /** Sets font-weight between default heavier and lighter font-weight. */\n @property({ type: String })\n linkFontWeight: 'lighter' | 'default' = 'default';\n\n override render() {\n const classes = this.returnClassMap();\n\n return html`\n <a\n class=\"kyn-link-text ${classes}\"\n target=${this.target}\n part=\"link\"\n rel=${this.rel}\n href=${this.href ? this.href : 'javascript:void(0)'}\n ?disabled=${this.disabled}\n aria-disabled=${this.disabled}\n @click=${(e: Event) => this.handleClick(e)}\n >\n <span class=\"kyn-link-text-span-flex\">\n <slot></slot>\n <slot name=\"icon\"></slot>\n </span>\n </a>\n `;\n }\n // -- Apply classes according to states, kind etc. -- //\n private returnClassMap() {\n const baseClasses = {\n 'kyn-link-text-disabled': this.disabled,\n 'icon-left': this.iconLeft,\n 'kyn-link-text-ai': this.kind === LINK_TYPES.AI_CONNECTED,\n 'kyn-link-text-font-lighter': this.linkFontWeight === 'lighter',\n };\n\n if (this.disabled) {\n return classMap(baseClasses);\n } else {\n return classMap({\n ...baseClasses,\n 'kyn-link-text-primary': this.kind === LINK_TYPES.PRIMARY || !this.kind,\n 'kyn-link-text-secondary': this.kind === LINK_TYPES.SECONDARY,\n 'kyn-link-text-secondary-ai': this.kind === LINK_TYPES.SECONDARY_AI,\n 'kyn-link-text-inline': !this.standalone,\n 'kyn-link-text-standalone': this.standalone,\n });\n }\n }\n\n private handleClick(e: Event) {\n if (this.disabled) {\n e.preventDefault();\n return;\n }\n\n const event = new CustomEvent('on-click', {\n detail: { href: this.href, origEvent: e },\n });\n this.dispatchEvent(event);\n }\n}\ndeclare global {\n interface HTMLElementTagNameMap {\n 'kyn-link': Link;\n }\n}\n"],"names":["Link","LitElement","constructor","this","href","target","LINK_TARGETS","SELF","kind","LINK_TYPES","PRIMARY","rel","disabled","standalone","iconLeft","linkFontWeight","render","classes","returnClassMap","html","e","handleClick","baseClasses","AI_CONNECTED","classMap","SECONDARY","SECONDARY_AI","preventDefault","event","CustomEvent","detail","origEvent","dispatchEvent","styles","LinkStyles","__decorate","property","type","String","prototype","Boolean","reflect","customElement"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAeO,IAAMA,EAAN,cAAmBC,EAAnB,WAAAC,uBAKLC,KAAIC,KAAG,GAIPD,KAAAE,OAAuBC,EAAaC,KAIpCJ,KAAAK,KAAmBC,EAAWC,QAI9BP,KAAGQ,IAAG,GAMNR,KAAQS,UAAG,EAIXT,KAAUU,YAAG,EAIbV,KAAQW,UAAG,EAIXX,KAAcY,eAA0B,SAyDzC,CAvDU,MAAAC,GACP,MAAMC,EAAUd,KAAKe,iBAErB,OAAOC,CAAI;;+BAEgBF;iBACdd,KAAKE;;cAERF,KAAKQ;eACJR,KAAKC,KAAOD,KAAKC,KAAO;oBACnBD,KAAKS;wBACDT,KAAKS;iBACXQ,GAAajB,KAAKkB,YAAYD;;;;;;;KAQ7C,CAEO,cAAAF,GACN,MAAMI,EAAc,CAClB,yBAA0BnB,KAAKS,SAC/B,YAAaT,KAAKW,SAClB,mBAAoBX,KAAKK,OAASC,EAAWc,aAC7C,6BAAsD,YAAxBpB,KAAKY,gBAGrC,OAAIZ,KAAKS,SACAY,EAASF,GAETE,EAAS,IACXF,EACH,wBAAyBnB,KAAKK,OAASC,EAAWC,UAAYP,KAAKK,KACnE,0BAA2BL,KAAKK,OAASC,EAAWgB,UACpD,6BAA8BtB,KAAKK,OAASC,EAAWiB,aACvD,wBAAyBvB,KAAKU,WAC9B,2BAA4BV,KAAKU,YAGtC,CAEO,WAAAQ,CAAYD,GAClB,GAAIjB,KAAKS,SAEP,YADAQ,EAAEO,iBAIJ,MAAMC,EAAQ,IAAIC,YAAY,WAAY,CACxCC,OAAQ,CAAE1B,KAAMD,KAAKC,KAAM2B,UAAWX,KAExCjB,KAAK6B,cAAcJ,EACpB,GA1Fe5B,EAAAiC,OAAS,CAACC,GAI1BC,EAAA,CADCC,EAAS,CAAEC,KAAMC,UACRtC,EAAAuC,UAAA,YAAA,GAIVJ,EAAA,CADCC,EAAS,CAAEC,KAAMC,UACuBtC,EAAAuC,UAAA,cAAA,GAIzCJ,EAAA,CADCC,EAAS,CAAEC,KAAMC,UACoBtC,EAAAuC,UAAA,YAAA,GAItCJ,EAAA,CADCC,EAAS,CAAEC,KAAMC,UACTtC,EAAAuC,UAAA,WAAA,GAMTJ,EAAA,CADCC,EAAS,CAAEC,KAAMG,QAASC,SAAS,KACnBzC,EAAAuC,UAAA,gBAAA,GAIjBJ,EAAA,CADCC,EAAS,CAAEC,KAAMG,WACCxC,EAAAuC,UAAA,kBAAA,GAInBJ,EAAA,CADCC,EAAS,CAAEC,KAAMG,WACDxC,EAAAuC,UAAA,gBAAA,GAIjBJ,EAAA,CADCC,EAAS,CAAEC,KAAMC,UACgCtC,EAAAuC,UAAA,sBAAA,GAnCvCvC,EAAImC,EAAA,CADhBO,EAAc,aACF1C"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kyndryl-design-system/shidoka-applications",
3
- "version": "2.36.2",
3
+ "version": "2.37.0",
4
4
  "description": "Shidoka Web Components for Applications",
5
5
  "license": "MIT",
6
6
  "main": "index.js",