@infineon/infineon-design-system-stencil 37.4.1--canary.1723.20aa14de714201b254aaf31a0daf8258349d096d.0 → 37.5.0--canary.1962.f72f59f6c9bcd23fa9f96fd2bfb23ef8d397d992.0

package/dist/infineon-design-system-stencil/p-13ae34b7.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["fileUploadCss","IfxFileUploadStyle0","FileUpload","constructor","hostRef","this","dragAndDrop","required","disabled","maxFileSizeMB","allowedFileTypes","additionalAllowedFileTypes","label","labelRequiredError","labelBrowseFiles","labelDragAndDrop","labelUploadedFilesHeading","labelFileTooLarge","labelUnsupportedFileType","labelUploaded","labelUploadFailed","labelSupportedFormatsTemplate","labelFileSingular","labelFilePlural","labelMaxFilesInfo","labelMaxFilesExceeded","ariaLabelBrowseFiles","ariaLabelDropzone","ariaLabelFileInput","ariaLabelRemoveFile","ariaLabelCancelUpload","ariaLabelRetryUpload","ariaLabelUploadingStatus","ariaLabelUploadedStatus","ariaLabelUploadFailedStatus","internalId","Math","random","toString","substr","isDragOver","files","uploadTasks","rejectedSizeFiles","rejectedTypeFiles","requiredError","statusMessage","fileInputEl","extensionToMimeMap","jpg","jpeg","png","gif","svg","webp","pdf","doc","docx","xls","xlsx","ppt","pptx","txt","csv","json","mp3","wav","mp4","mov","webm","zip","rar","tar","gz","xml","html","css","js","maxFiles","_maxFiles","value","console","warn","undefined","validateRequired","length","_a","text","type","ifxFileUploadValidation","emit","valid","_b","pluralize","count","getNormalizedFileTypes","Array","isArray","JSON","parse","split","map","t","trim","getLabelFromMimeType","mime","ext","knownMime","Object","entries","toUpperCase","handleFileChange","event","input","target","processFiles","handleDrop","preventDefault","stopPropagation","dataTransfer","droppedFiles","from","allowedMimes","toLowerCase","filter","Boolean","getAdditionalMimeTypes","acceptedFiles","rejectedFiles","forEach","file","isValidType","includes","isValidSize","size","push","ifxFileUploadDrop","handleDragOver","handleDragLeave","fileList","selectedFiles","validFiles","rejectedSize","rejectedType","isDuplicate","some","existing","name","ifxFileUploadInvalid","reason","ifxFileUploadError","errorType","message","availableSlots","limitedFiles","slice","max","overflowFiles","startUpload","ifxFileUploadAdd","addedFiles","ifxFileUploadChange","replace","ifxFileUploadMaxFilesExceeded","attempted","retryUpload","taskIndex","findIndex","splice","ifxFileUploadRetry","ifxFileUploadStart","task","progress","intervalId","completed","uploadHandler","percent","min","then","ifxFileUploadComplete","every","ifxFileUploadAllComplete","catch","error","totalSize","fakeUploadSpeed","uploaded","window","setInterval","round","clearInterval","cancelUpload","_","i","f","ifxFileUploadAbort","removeFile","ifxFileUploadRemove","removedFile","clearRejectedFile","fileName","splitFileNameParts","dotIndex","lastIndexOf","base","substring","getFileIcon","extension","pop","formatSize","bytes","toFixed","getAcceptAttribute","extensionTypes","mimeTypes","join","getFormattedProgressText","uploadedSize","uploadedText","totalText","getSupportedFileText","extensions","allTypes","typesLabel","fileWord","maxFilesText","getFormattedFileTooLargeText","renderStatusMessage","h","class","icon","isInputDisabled","componentWillLoad","isNestedInIfxComponent","hostElement","framework","detectFramework","trackComponent","componentDidLoad","hasAttribute","showDemoStates","injectDemoState","dummyContent","fill","bigContent","uploading","File","failed","tooLarge","unsupported","triggerDemoValidation","render","key","htmlFor","renderDragAndDropArea","renderUploadArea","shape","variant","onClick","find","isUploading","isError","itemClass","uniqueKey","style","display","handleInputRef","el","click","id","ref","accept","multiple","onChange","e","triggerInputClick","onDragOver","onDragLeave","onDrop","role","tabIndex","height","overflow"],"sources":["src/components/file-upload/file-upload.scss?tag=ifx-file-upload&encapsulation=shadow","src/components/file-upload/file-upload.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n  // TODO remove\n  font-family: var(--ifx-font-family, sans-serif);\n}\n\n.file-upload-wrapper {\n  display: flex;\n  flex-direction: column;\n\n  &.disabled {\n    pointer-events: none;\n\n    label,\n    .file-upload-info {\n      color: tokens.$ifxColorEngineering500;\n    }\n  }\n}\n\n.file-upload-label {\n  font-style: normal;\n  font-weight: 400;\n  font-size: tokens.$ifxFontSizeM;\n  line-height: tokens.$ifxLineHeightM;\n  color: tokens.$ifxColorBaseBlack;\n\n  .required {\n    display: inline-block;\n    margin-left: 4px;\n\n    &.error {\n      color: tokens.$ifxColorRed500;\n    }\n  }\n}\n\n.upload-dropzone {\n  border: 1px dashed tokens.$ifxColorEngineering300;\n  padding: tokens.$ifxSpace500;\n  text-align: center;\n  cursor: pointer;\n  color: tokens.$ifxColorBaseBlack;\n  transition: border-color 0.3s ease;\n  border-radius: tokens.$ifxBorderRadius12;\n  background: tokens.$ifxColorBaseWhite;\n\n  ifx-icon {\n    color: tokens.$ifxColorOcean500;\n  }\n\n  &:hover {\n    border: 1px dashed tokens.$ifxColorEngineering400;\n  }\n\n  &.drag-over {\n    border: 1px solid tokens.$ifxColorOcean500;\n    background: tokens.$ifxColorEngineering100;\n\n    &.error {\n      border: 1px solid tokens.$ifxColorOcean500;\n    }\n  }\n\n  &.error {\n    border-color: tokens.$ifxColorRed500;\n  }\n\n  .disabled & {\n    pointer-events: none;\n    border-color: tokens.$ifxColorEngineering300;\n    color: tokens.$ifxColorEngineering300;\n\n    ifx-icon {\n      color: tokens.$ifxColorEngineering300;\n    }\n  }\n}\n\n.upload-dropzone input {\n  display: none;\n}\n\n.file-upload-info {\n  font-style: normal;\n  font-weight: tokens.$ifxFontWeightRegular;\n  font-size: tokens.$ifxFontSizeXs;\n  line-height: tokens.$ifxLineHeightXs;\n  letter-spacing: tokens.$ifxLetterSpacingDefault;\n  color: tokens.$ifxColorBaseBlack;\n  margin: 0;\n  margin-top: tokens.$ifxSpace50;\n}\n\n.file-upload-status {\n  font-style: normal;\n  font-weight: 400;\n  font-size: tokens.$ifxFontSizeXs;\n  line-height: tokens.$ifxLineHeightXs;\n  letter-spacing: 0.2px;\n  margin-top: tokens.$ifxSpace100;\n\n  &.file-upload-status__error {\n    display: flex;\n    align-items: center;\n    color: tokens.$ifxColorRed500;\n\n    ifx-icon {\n      position: relative;\n      top: - tokens.$ifxSpace12;\n      color: tokens.$ifxColorRed500;\n      margin-right: tokens.$ifxSpace100;\n    }\n  }\n}\n\n.upload-heading {\n  font: tokens.$ifxHeadingHeading06;\n  margin-bottom: tokens.$ifxSpace100;\n}\n\n.file-list-wrapper {\n  margin-top: tokens.$ifxSpace200;\n}\n\n.file-list {\n  list-style: none;\n  padding: 0;\n  margin: 0;\n  display: flex;\n  flex-direction: column;\n  gap: tokens.$ifxSpace200;\n}\n\n.file-item {\n  border: 1px solid tokens.$ifxColorEngineering300;\n  padding-top: tokens.$ifxSpace150;\n  padding-right: tokens.$ifxSpace200;\n  padding-bottom: tokens.$ifxSpace100;\n  padding-left: tokens.$ifxSpace200;\n  display: flex;\n  gap: tokens.$ifxSpace100;\n}\n\n.file-info {\n  width: 100%;\n  min-width: 0;\n}\n\n.file-top-row {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: tokens.$ifxSpace200;\n  margin-top: - tokens.$ifxSpace100;\n}\n\n.file-top-row ifx-icon {\n  flex-shrink: 0;\n}\n\n.file-name-wrapper {\n  display: flex;\n  min-width: 0;\n  max-width: 100%;\n  white-space: nowrap;\n  overflow: hidden;\n  font-weight: tokens.$ifxFontWeightRegular;\n  font-size: tokens.$ifxFontSizeS;\n}\n\n.file-name-base {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  flex-shrink: 1;\n  min-width: 0;\n}\n\n.file-name-ext {\n  flex-shrink: 0;\n  margin-left: 0;\n}\n\n.file-middle-row {\n  display: flex;\n  align-items: center;\n  font-size: tokens.$ifxFontSizeXs;\n  line-height: tokens.$ifxLineHeightXs;\n  flex-wrap: wrap;\n  color: tokens.$ifxColorEngineering500;\n\n  .file-status {\n    margin-left: tokens.$ifxSpace150;\n\n    ifx-icon {\n      margin-right: tokens.$ifxSpace100;\n    }\n  }\n}\n\n.file-progress-row {\n  margin-top: tokens.$ifxSpace50;\n}\n\n.file-progress-row ifx-progress-bar {\n  width: 100%;\n}\n\n.upload-success {\n  border-color: tokens.$ifxColorOcean500;\n\n  .file-status {\n    ifx-icon {\n      position: relative;\n      top: tokens.$ifxSpace12;\n      color: tokens.$ifxColorGreen500;\n    }\n  }\n}\n\n.upload-failed {\n  border-color: tokens.$ifxColorRed500;\n\n  .file-status {\n    color: tokens.$ifxColorRed500;\n    margin-left: 0;\n  }\n}\n","import { Component, h, State, Event, EventEmitter, Prop, Method, Element } from '@stencil/core';\nimport { trackComponent } from '../../global/utils/tracking';\nimport { isNestedInIfxComponent } from '../../global/utils/dom-utils';\nimport { detectFramework } from '../../global/utils/framework-detection';\n\ninterface UploadTask {\n  file: File;\n  progress: number;\n  intervalId: number | null;\n  completed: boolean;\n  error?: boolean;\n}\n\nexport type FileUploadErrorReason =\n  | 'network-error'\n  | 'timeout'\n  | 'file-too-large'\n  | 'unsupported-type'\n  | 'invalid-type'\n  | 'custom'\n  | (string & {});\n\n@Component({\n  tag: 'ifx-file-upload',\n  styleUrl: 'file-upload.scss',\n  shadow: true\n})\nexport class FileUpload {\n  @Element() hostElement: HTMLElement;\n\n  @Prop() dragAndDrop: boolean = false;\n  @Prop() required: boolean = false;\n  @Prop() disabled: boolean = false;\n  @Prop() maxFileSizeMB: number = 7;\n  /** Default set of allowed file extensions (used internally). Can be extended using `additionalAllowedFileTypes`. */\n  @Prop() allowedFileTypes: string | string[] = ['jpg', 'jpeg', 'png', 'pdf', 'mov', 'mp3', 'mp4'];\n  @Prop() additionalAllowedFileTypes?: string | string[] = [];\n  @Prop() uploadHandler?: (file: File, onProgress?: (progress: number) => void) => Promise<void>;\n\n  private _maxFiles?: number;\n  @Prop()\n  get maxFiles(): number | undefined {\n    return this._maxFiles;\n  }\n  set maxFiles(value: number | undefined) {\n    if (typeof value === 'number' && value < 1) {\n      console.warn('Invalid `maxFiles` value. Must be >= 1. Value ignored.');\n      this._maxFiles = undefined;\n    } else {\n      this._maxFiles = value;\n    }\n  }\n\n  @Prop() label: string = 'Label';\n  @Prop() labelRequiredError: string = 'At least one file must be uploaded';\n  @Prop() labelBrowseFiles: string = 'Browse files';\n  @Prop() labelDragAndDrop: string = 'Drag & Drop or browse files to upload';\n  @Prop() labelUploadedFilesHeading: string = 'Uploaded files';\n  @Prop() labelFileTooLarge: string = 'Upload failed. Max file size: {{size}}MB.';\n  @Prop() labelUnsupportedFileType: string = 'Unsupported file type.';\n  @Prop() labelUploaded: string = 'Successfully uploaded';\n  @Prop() labelUploadFailed: string = 'Upload failed. Please try again.';\n  @Prop() labelSupportedFormatsTemplate: string = 'Supported file formats: {{types}}. Max file size: {{size}}MB.';\n  @Prop() labelFileSingular: string = 'file';\n  @Prop() labelFilePlural: string = 'files';\n  @Prop() labelMaxFilesInfo?: string = 'Up to {{count}} {{files}}.';\n  @Prop() labelMaxFilesExceeded: string = 'Upload limit exceeded. Only {{count}} {{files}} allowed.';\n\n  @Prop() ariaLabelBrowseFiles: string = 'Browse files';\n  @Prop() ariaLabelDropzone: string = 'Upload area. Click to browse or drag and drop files.';\n  @Prop() ariaLabelFileInput: string = 'Upload file';\n  @Prop() ariaLabelRemoveFile: string = 'Remove file';\n  @Prop() ariaLabelCancelUpload: string = 'Cancel upload';\n  @Prop() ariaLabelRetryUpload: string = 'Retry upload';\n  @Prop() ariaLabelUploadingStatus: string = 'Upload in progress';\n  @Prop() ariaLabelUploadedStatus: string = 'Upload completed';\n  @Prop() ariaLabelUploadFailedStatus: string = 'Upload failed';\n\n  private showDemoStates?: boolean;\n  private internalId = `ifx-file-upload-${Math.random().toString(36).substr(2, 9)}`;\n\n  @State() isDragOver: boolean = false;\n  @State() files: File[] = [];\n  @State() uploadTasks: UploadTask[] = [];\n  @State() rejectedSizeFiles: string[] = [];\n  @State() rejectedTypeFiles: string[] = [];\n  @State() requiredError: boolean = false;\n  @State() statusMessage: { type: 'error' | 'info' | 'success'; text: string } | null = null;\n\n\n  @Event() ifxFileUploadAdd: EventEmitter<{ addedFiles: File[]; files: File[] }>;\n  @Event() ifxFileUploadRemove: EventEmitter<{ removedFile: File; files: File[] }>;\n  @Event() ifxFileUploadChange: EventEmitter<{ files: File[] }>;\n  @Event() ifxFileUploadError: EventEmitter<{ errorType: string; file: File; message: string; reason?: string; }>;\n  @Event() ifxFileUploadInvalid: EventEmitter<{ file: File; reason: string }>;\n  @Event() ifxFileUploadStart: EventEmitter<{ file: File }>;\n  @Event() ifxFileUploadComplete: EventEmitter<{ file: File }>;\n  @Event() ifxFileUploadAllComplete: EventEmitter<{ files: File[] }>;\n  @Event() ifxFileUploadAbort: EventEmitter<{ file: File }>;\n  @Event() ifxFileUploadDrop: EventEmitter<{ droppedFiles: File[]; acceptedFiles: File[]; rejectedFiles: File[] }>;\n  @Event() ifxFileUploadClick: EventEmitter<void>;\n  @Event() ifxFileUploadMaxFilesExceeded: EventEmitter<{ maxFiles: number; attempted: number }>;\n  @Event() ifxFileUploadValidation: EventEmitter<{ valid: boolean }>;\n  @Event() ifxFileUploadRetry: EventEmitter<{ file: File }>;\n\n  private fileInputEl: HTMLInputElement | null = null;\n\n  private extensionToMimeMap: Record<string, string> = {\n    /**\n     * Maps file extensions to MIME types.\n     * This is only used for translating `allowedFileTypes` (extensions) into MIME types,\n     * and for labeling in the UI. It does NOT define which files are globally allowed.\n     */\n\n    // Images\n    jpg: 'image/jpeg',\n    jpeg: 'image/jpeg',\n    png: 'image/png',\n    gif: 'image/gif',\n    svg: 'image/svg+xml',\n    webp: 'image/webp',\n\n    // Documents\n    pdf: 'application/pdf',\n    doc: 'application/msword',\n    docx: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document',\n    xls: 'application/vnd.ms-excel',\n    xlsx: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',\n    ppt: 'application/vnd.ms-powerpoint',\n    pptx: 'application/vnd.openxmlformats-officedocument.presentationml.presentation',\n    txt: 'text/plain',\n    csv: 'text/csv',\n    json: 'application/json',\n\n    // Audio/Video\n    mp3: 'audio/mpeg',\n    wav: 'audio/wav',\n    mp4: 'video/mp4',\n    mov: 'video/quicktime',\n    webm: 'video/webm',\n\n    // Archive / Code\n    zip: 'application/zip',\n    rar: 'application/vnd.rar',\n    tar: 'application/x-tar',\n    gz: 'application/gzip',\n\n    // Sonstiges\n    xml: 'application/xml',\n    html: 'text/html',\n    css: 'text/css',\n    js: 'application/javascript'\n  };\n\n  private validateRequired(): void {\n    if (this.required && this.files.length === 0) {\n      this.requiredError = true;\n\n      if (this.statusMessage?.text !== this.labelRequiredError) {\n        this.statusMessage = {\n          type: 'error',\n          text: this.labelRequiredError\n        };\n      }\n\n      this.ifxFileUploadValidation.emit({ valid: false });\n    } else {\n      this.requiredError = false;\n\n      if (this.statusMessage?.text === this.labelRequiredError) {\n        this.statusMessage = null;\n      }\n\n      this.ifxFileUploadValidation.emit({ valid: true });\n    }\n  }\n\n  private pluralize(count: number): string {\n    return count === 1 ? this.labelFileSingular : this.labelFilePlural;\n  }\n\n  private getNormalizedFileTypes(): string[] {\n    if (Array.isArray(this.allowedFileTypes)) {\n      return this.allowedFileTypes;\n    }\n    try {\n      return JSON.parse(this.allowedFileTypes);\n    } catch {\n      return this.allowedFileTypes.split(',').map(t => t.trim());\n    }\n  }\n\n  private getLabelFromMimeType(mime: string): string {\n    for (const [ext, knownMime] of Object.entries(this.extensionToMimeMap)) {\n      if (knownMime === mime) {\n        return ext.toUpperCase();\n      }\n    }\n    return mime; // fallback: show raw MIME\n  }\n\n  handleFileChange(event: Event) {\n    const input = event.target as HTMLInputElement;\n    if (!input.files) return;\n    this.processFiles(input.files);\n  }\n\n  handleDrop(event: DragEvent) {\n    if (this.disabled) return;\n    event.preventDefault();\n    event.stopPropagation();\n    this.isDragOver = false;\n    if (event.dataTransfer?.files) {\n      const droppedFiles = Array.from(event.dataTransfer.files);\n      const allowedMimes = [\n        ...this.getNormalizedFileTypes()\n          .map(ext => this.extensionToMimeMap[ext.toLowerCase()])\n          .filter(Boolean),\n        ...this.getAdditionalMimeTypes()\n      ];\n\n      const acceptedFiles: File[] = [];\n      const rejectedFiles: File[] = [];\n\n      droppedFiles.forEach(file => {\n        const isValidType = allowedMimes.includes(file.type);\n        const isValidSize = file.size <= this.maxFileSizeMB * 1024 * 1024;\n        if (isValidType && isValidSize) acceptedFiles.push(file);\n        else rejectedFiles.push(file);\n      });\n\n      this.ifxFileUploadDrop.emit({\n        droppedFiles,\n        acceptedFiles,\n        rejectedFiles\n      });\n\n      this.processFiles(event.dataTransfer.files);\n    }\n  }\n\n  handleDragOver(event: DragEvent) {\n    if (this.disabled) return;\n    event.preventDefault();\n    this.isDragOver = true;\n  }\n\n  handleDragLeave(event: DragEvent) {\n    if (this.disabled) return;\n    event.preventDefault();\n    this.isDragOver = false;\n  }\n\n  processFiles(fileList: FileList) {\n    const selectedFiles = Array.from(fileList);\n    const allowedMimes = [\n      ...this.getNormalizedFileTypes()\n        .map(ext => this.extensionToMimeMap[ext.toLowerCase()])\n        .filter(Boolean),\n      ...this.getAdditionalMimeTypes()\n    ];\n\n    const validFiles: File[] = [];\n    const rejectedSize: string[] = [];\n    const rejectedType: string[] = [];\n\n    selectedFiles.forEach(file => {\n      const isValidType = allowedMimes.includes(file.type);\n      const isValidSize = file.size <= this.maxFileSizeMB * 1024 * 1024;\n      const isDuplicate = this.files.some(existing =>\n        existing.name === file.name && existing.size === file.size\n      );\n\n      if (isDuplicate) {\n        this.ifxFileUploadInvalid.emit({ file, reason: 'duplicate' });\n        this.ifxFileUploadError.emit({\n          file,\n          errorType: 'duplicate',\n          message: `File \"${file.name}\" is already added`,\n          reason: 'duplicate'\n        });\n        return;\n      }\n\n      if (isValidType && isValidSize) {\n        validFiles.push(file);\n      } else {\n        if (!isValidType) {\n          rejectedType.push(file.name);\n          this.ifxFileUploadInvalid.emit({ file, reason: 'invalid-type' });\n        }\n        if (!isValidSize) {\n          rejectedSize.push(file.name);\n          this.ifxFileUploadInvalid.emit({ file, reason: 'invalid-size' });\n        }\n        this.ifxFileUploadError.emit({\n          file,\n          errorType: !isValidType ? 'invalid-type' : 'file-too-large',\n          message: 'Invalid file rejected',\n          reason: !isValidType ? 'unsupported-type' : 'file-too-large'\n        });\n      }\n    });\n\n    this.rejectedSizeFiles = [...this.rejectedSizeFiles, ...rejectedSize];\n    this.rejectedTypeFiles = [...this.rejectedTypeFiles, ...rejectedType];\n\n    if (this.maxFiles && this.files.length + validFiles.length > this.maxFiles) {\n      const availableSlots = this.maxFiles - this.files.length;\n      const limitedFiles = validFiles.slice(0, Math.max(availableSlots, 0));\n      const overflowFiles = validFiles.slice(availableSlots);\n\n      this.files = [...this.files, ...limitedFiles];\n\n      limitedFiles.forEach(file => this.startUpload(file));\n\n      if (limitedFiles.length > 0) {\n        this.ifxFileUploadAdd.emit({ addedFiles: limitedFiles, files: this.files });\n        this.ifxFileUploadChange.emit({ files: this.files });\n      }\n\n      overflowFiles.forEach(file => {\n        this.ifxFileUploadInvalid.emit({ file, reason: 'too-many-files' });\n        this.ifxFileUploadError.emit({\n          file,\n          errorType: 'too-many-files',\n          message: `Upload limit exceeded. Max ${this.maxFiles} files allowed.`,\n          reason: 'too-many-files'\n        });\n      });\n\n      if (overflowFiles.length > 0) {\n        this.statusMessage = {\n          type: 'error',\n          text: this.labelMaxFilesExceeded\n            .replace('{{count}}', this.maxFiles.toString())\n            .replace('{{files}}', this.pluralize(this.maxFiles))\n        };\n        this.ifxFileUploadMaxFilesExceeded.emit({\n          maxFiles: this.maxFiles,\n          attempted: this.files.length + validFiles.length\n        });\n      }\n\n      return;\n    }\n\n\n    validFiles.forEach(file => this.startUpload(file));\n    this.files = [...this.files, ...validFiles];\n\n    if (validFiles.length > 0) {\n      this.ifxFileUploadAdd.emit({ addedFiles: validFiles, files: this.files });\n      this.ifxFileUploadChange.emit({ files: this.files });\n    }\n\n    this.validateRequired();\n  }\n\n  retryUpload(file: File) {\n    const taskIndex = this.uploadTasks.findIndex(t => t.file.name === file.name);\n    if (taskIndex !== -1) {\n      this.uploadTasks.splice(taskIndex, 1);\n      this.uploadTasks = [...this.uploadTasks];\n    }\n    this.ifxFileUploadRetry.emit({ file });\n    this.startUpload(file);\n  }\n\n  startUpload(file: File) {\n    this.ifxFileUploadStart.emit({ file });\n\n    const task: UploadTask = {\n      file,\n      progress: 3, // Start with initial progress for better UX\n      intervalId: null,\n      completed: false,\n    };\n\n    this.uploadTasks = [...this.uploadTasks, task];\n\n    if (this.uploadHandler) {\n      this.uploadHandler(file, (percent: number) => {\n        if (percent > task.progress) {\n          task.progress = Math.min(100, percent);\n          this.uploadTasks = [...this.uploadTasks];\n        }\n      }).then(() => {\n        task.progress = 100;\n        task.completed = true;\n        this.uploadTasks = [...this.uploadTasks];\n        this.ifxFileUploadComplete.emit({ file });\n        this.ifxFileUploadChange.emit({ files: this.files });\n\n        if (this.uploadTasks.every(t => t.completed)) {\n          this.ifxFileUploadAllComplete.emit({ files: this.files });\n        }\n      }).catch(() => {\n        task.error = true;\n        this.uploadTasks = [...this.uploadTasks];\n        this.ifxFileUploadError.emit({\n          file,\n          errorType: 'upload-failed',\n          message: 'Upload handler rejected file',\n          reason: 'custom'\n        });\n      });\n    } else {\n      const totalSize = file.size;\n      const fakeUploadSpeed = 100000;\n      let uploaded = 0;\n\n      task.intervalId = window.setInterval(() => {\n        uploaded += fakeUploadSpeed / 5;\n        const progress = Math.min(100, Math.round((uploaded / totalSize) * 100));\n        task.progress = progress;\n        this.uploadTasks = [...this.uploadTasks];\n\n        if (progress >= 100) {\n          clearInterval(task.intervalId!);\n          task.completed = true;\n          task.intervalId = null;\n          this.uploadTasks = [...this.uploadTasks];\n          this.ifxFileUploadComplete.emit({ file });\n          this.ifxFileUploadChange.emit({ files: this.files });\n\n          if (this.uploadTasks.every(t => t.completed)) {\n            this.ifxFileUploadAllComplete.emit({ files: this.files });\n          }\n        }\n      }, 200);\n    }\n\n    this.uploadTasks = [...this.uploadTasks, task];\n  }\n\n  cancelUpload(file: File) {\n    const taskIndex = this.uploadTasks.findIndex(t => t.file.name === file.name);\n    if (taskIndex !== -1) {\n      const task = this.uploadTasks[taskIndex];\n      if (task?.intervalId !== null) {\n        clearInterval(task.intervalId);\n      }\n      this.uploadTasks = this.uploadTasks.filter((_, i) => i !== taskIndex);\n    }\n    this.files = this.files.filter(f => f.name !== file.name);\n    this.ifxFileUploadAbort.emit({ file });\n    this.ifxFileUploadChange.emit({ files: this.files });\n    if (this.fileInputEl) {\n      this.fileInputEl.value = '';\n    }\n    this.validateRequired();\n  }\n\n  removeFile(file: File) {\n    this.uploadTasks = this.uploadTasks.filter(task => task.file.name !== file.name);\n    this.files = this.files.filter(f => f.name !== file.name);\n    this.ifxFileUploadRemove.emit({ removedFile: file, files: this.files });\n    this.ifxFileUploadChange.emit({ files: this.files });\n    this.validateRequired();\n\n    if (this.fileInputEl) {\n      this.fileInputEl.value = '';\n    }\n\n    if (\n      this.maxFiles &&\n      this.files.length < this.maxFiles &&\n      this.statusMessage?.text !== this.labelRequiredError\n    ) {\n      this.statusMessage = null;\n    }\n  }\n\n\n  clearRejectedFile(fileName: string, type: 'size' | 'type') {\n    if (type === 'size') {\n      this.rejectedSizeFiles = this.rejectedSizeFiles.filter(f => f !== fileName);\n    } else {\n      this.rejectedTypeFiles = this.rejectedTypeFiles.filter(f => f !== fileName);\n    }\n\n    if (this.fileInputEl) {\n      this.fileInputEl.value = '';\n    }\n\n    if (this.maxFiles && this.files.length < this.maxFiles) {\n      this.statusMessage = null;\n    }\n\n    this.validateRequired();\n  }\n\n  splitFileNameParts(file: File): { base: string; ext: string } {\n    const name = file.name;\n    const dotIndex = name.lastIndexOf('.');\n    if (dotIndex === -1) return { base: name, ext: '' };\n    return {\n      base: name.substring(0, dotIndex),\n      ext: name.substring(dotIndex)\n    };\n  }\n\n  getFileIcon(file: File): string {\n    const extension = file.name.split('.').pop()?.toLowerCase();\n    switch (extension) {\n      case 'pdf': return 'file-pdf-16';\n      case 'jpg':\n      case 'jpeg': return 'file-jpg-16';\n      case 'png': return 'file-png-16';\n      case 'mov': return 'file-mov-16';\n      case 'mp3': return 'file-mp3-16';\n      case 'mp4': return 'file-mp4-16';\n      default: return 'file-16';\n    }\n  }\n\n  formatSize(bytes: number): string {\n    if (bytes >= 1024 * 1024 * 1024) {\n      return `${(bytes / (1024 * 1024 * 1024)).toFixed(1)} GB`;\n    } else if (bytes >= 1024 * 1024) {\n      return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;\n    } else if (bytes >= 1024) {\n      return `${(bytes / 1024).toFixed(0)} KB`;\n    } else {\n      return `${bytes} B`;\n    }\n  }\n\n  getAcceptAttribute(): string {\n    const extensionTypes = this.getNormalizedFileTypes().map(ext => '.' + ext.toLowerCase());\n    const mimeTypes = this.getAdditionalMimeTypes();\n\n    return [...extensionTypes, ...mimeTypes].join(',');\n  }\n\n  private getFormattedProgressText(task: UploadTask): string {\n    const uploadedSize = Math.round((task.progress / 100) * task.file.size);\n    const uploadedText = this.formatSize(uploadedSize);\n    const totalText = this.formatSize(task.file.size);\n    return `${uploadedText} / ${totalText} uploaded`;\n  }\n\n  private getAdditionalMimeTypes(): string[] {\n    if (!this.additionalAllowedFileTypes) return [];\n    if (Array.isArray(this.additionalAllowedFileTypes)) return this.additionalAllowedFileTypes;\n    return this.additionalAllowedFileTypes.split(',').map(t => t.trim());\n  }\n\n  private getSupportedFileText(): string {\n    const extensions = this.getNormalizedFileTypes().map(ext => ext.toUpperCase());\n    const mimeTypes = this.getAdditionalMimeTypes().map(mime => this.getLabelFromMimeType(mime));\n    const allTypes = [...extensions, ...mimeTypes];\n    const typesLabel = allTypes.join(', ');\n\n    let text = this.labelSupportedFormatsTemplate\n      .replace('{{types}}', typesLabel)\n      .replace('{{size}}', this.maxFileSizeMB.toString());\n\n    if (this.labelMaxFilesInfo && this.maxFiles) {\n      const fileWord = this.pluralize(this.maxFiles);\n      const maxFilesText = this.labelMaxFilesInfo\n        .replace('{{count}}', this.maxFiles.toString())\n        .replace('{{files}}', fileWord);\n      text += ` ${maxFilesText}`;\n    }\n\n    return text;\n  }\n\n  private getFormattedFileTooLargeText(): string {\n    return this.labelFileTooLarge.replace('{{size}}', this.maxFileSizeMB.toString());\n  }\n\n  private renderStatusMessage() {\n    if (!this.statusMessage) return null;\n\n    return (\n      <div class={`file-upload-status file-upload-status__${this.statusMessage.type}`}>\n        {this.statusMessage.type === 'error' && (\n          <ifx-icon icon=\"c-warning-16\"></ifx-icon>\n        )}\n        {this.statusMessage.text}\n      </div>\n    );\n  }\n\n  private isInputDisabled(): boolean {\n    return this.disabled || (this.maxFiles !== undefined && this.files.length >= this.maxFiles);\n  }\n\n  componentWillLoad() { \n    if(!isNestedInIfxComponent(this.hostElement)) { \n      const framework = detectFramework();\n      trackComponent('ifx-file-upload', framework)\n    }\n  }\n\n  componentDidLoad() {\n    if (this.hostElement.hasAttribute('show-demo-states')) {\n      this.showDemoStates = true;\n    }\n\n    if (this.showDemoStates) {\n      this.injectDemoState();\n    }\n  }\n\n  // Storybook Demo\n  @Method()\n  async injectDemoState() {\n    const dummyContent = new Array(50000).fill('a').join(''); // ~50 KB\n    const bigContent = dummyContent + dummyContent; // ~100 KB\n\n    const uploading = new File([dummyContent], 'Image.jpg', { type: 'image/jpeg' }); // ~50 KB\n    const uploaded = new File([bigContent], 'File.pdf', { type: 'application/pdf' }); // ~100 KB\n    const failed = new File([dummyContent], 'Text.docx', { type: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document' }); // ~50 KB\n    const tooLarge = new File([bigContent + bigContent + bigContent], 'Video.mp4', { type: 'video/mp4' }); // ~300 KB\n    const unsupported = new File(['demo'], 'Script.exe', { type: 'application/x-msdownload' }); // very small\n\n    this.files = [uploaded, uploading, failed];\n    this.uploadTasks = [\n      { file: uploaded, progress: 100, intervalId: null, completed: true },\n      { file: uploading, progress: 40, intervalId: null, completed: false },\n      { file: failed, progress: 80, intervalId: null, completed: false, error: true }\n    ];\n    this.rejectedSizeFiles = [tooLarge.name];\n    this.rejectedTypeFiles = [unsupported.name];\n  }\n\n\n\n  // Storybook Demo\n  @Method()\n    async triggerDemoValidation(): Promise<void> {\n      this.validateRequired();\n    }\n\n  render() {\n    return (\n      <div\n        class={{\n          'file-upload-wrapper': true,\n          'disabled': this.disabled\n        }}\n      >\n        {this.label && (\n          <label class=\"file-upload-label\" htmlFor={this.internalId}>\n            {this.label}\n            {this.required && (\n              <span class={`required ${this.requiredError ? 'error' : ''}`}>*</span>\n            )}\n          </label>\n        )}\n\n        {this.dragAndDrop ? this.renderDragAndDropArea() : this.renderUploadArea()}\n\n        {(this.files.length > 0 || this.rejectedSizeFiles.length > 0 || this.rejectedTypeFiles.length > 0) && (\n          <div class=\"file-list-wrapper\">\n            <div class=\"upload-heading\">{this.labelUploadedFilesHeading}</div>\n            <ul class=\"file-list\">\n              {this.rejectedSizeFiles.map(fileName => (\n                <li class=\"file-item upload-failed\" key={`rejected-size-${fileName}`}>\n                  <div class=\"file-icon\">\n                    <ifx-icon icon=\"file-16\"></ifx-icon>\n                  </div>\n                  <div class=\"file-info\">\n                    <div class=\"file-top-row\">\n                      <span class=\"file-name-wrapper\">\n                        <span class=\"file-name-base\">{this.splitFileNameParts({ name: fileName } as File).base}</span>\n                        <span class=\"file-name-ext\">{this.splitFileNameParts({ name: fileName } as File).ext}</span>\n                      </span>\n                      <div class=\"file-actions\">\n                        <ifx-icon-button\n                          shape=\"square\"\n                          variant=\"tertiary\"\n                          icon=\"delete-forever-16\"\n                          size=\"s\"\n                          aria-label={this.ariaLabelRemoveFile}\n                          onClick={() => this.clearRejectedFile(fileName, 'size')}\n                        ></ifx-icon-button>\n                      </div>\n                    </div>\n                    <div class=\"file-middle-row\">\n                      <span class=\"file-status\" aria-label={this.labelFileTooLarge.replace('{{size}}', this.maxFileSizeMB.toString())}>\n                        {this.getFormattedFileTooLargeText()}\n                      </span>\n                    </div>\n                  </div>\n                </li>\n              ))}\n\n              {this.rejectedTypeFiles.map(fileName => (\n                <li class=\"file-item upload-failed\" key={`rejected-type-${fileName}`}>\n                  <div class=\"file-icon\">\n                    <ifx-icon icon=\"file-16\"></ifx-icon>\n                  </div>\n                  <div class=\"file-info\">\n                    <div class=\"file-top-row\">\n                      <span class=\"file-name-wrapper\">\n                        <span class=\"file-name-base\">{this.splitFileNameParts({ name: fileName } as File).base}</span>\n                        <span class=\"file-name-ext\">{this.splitFileNameParts({ name: fileName } as File).ext}</span>\n                      </span>\n                      <div class=\"file-actions\">\n                        <ifx-icon-button\n                          shape=\"square\"\n                          variant=\"tertiary\"\n                          icon=\"delete-forever-16\"\n                          size=\"s\"\n                          aria-label={this.ariaLabelRemoveFile}\n                          onClick={() => this.clearRejectedFile(fileName, 'type')}\n                        ></ifx-icon-button>\n                      </div>\n                    </div>\n                    <div class=\"file-middle-row\">\n                      <span class=\"file-status\" aria-label={this.labelUnsupportedFileType}>\n                        {this.labelUnsupportedFileType}\n                      </span>\n                    </div>\n                  </div>\n                </li>\n              ))}\n\n              {this.files.map((file) => {\n                const task = this.uploadTasks.find(t => t.file.name === file.name);\n                const progress = task?.progress ?? 100;\n                const isUploading = task && !task.completed;\n                const isError = task?.error === true;\n                const itemClass = isError ? 'file-item upload-failed' : isUploading ? 'file-item uploading' : 'file-item upload-success';\n                const uniqueKey = `${file.name}-${file.size}`;\n                const { base, ext } = this.splitFileNameParts(file);\n\n                return (\n                  <li class={itemClass} key={uniqueKey}>\n                    <div class=\"file-icon\">\n                      <ifx-icon icon={this.getFileIcon(file)}></ifx-icon>\n                    </div>\n                    <div class=\"file-info\">\n                      <div class=\"file-top-row\">\n                        <span class=\"file-name-wrapper\">\n                          <span class=\"file-name-base\">{base}</span>\n                          <span class=\"file-name-ext\">{ext}</span>\n                        </span>\n                        <div class=\"file-actions\">\n                          <ifx-icon-button\n                            shape=\"square\"\n                            variant=\"tertiary\"\n                            icon=\"refresh-16\"\n                            size=\"s\"\n                            aria-label={this.ariaLabelRetryUpload}\n                            onClick={() => this.retryUpload(file)}\n                            style={{ display: isError ? 'inline-flex' : 'none' }}\n                          ></ifx-icon-button>\n                          <ifx-icon-button\n                            shape=\"square\"\n                            variant=\"tertiary\"\n                            icon=\"cross-16\"\n                            size=\"s\"\n                            aria-label={this.ariaLabelCancelUpload}\n                            onClick={() => this.cancelUpload(file)}\n                            style={{ display: isUploading ? 'inline-flex' : 'none' }}\n                          ></ifx-icon-button>\n                          <ifx-icon-button\n                            shape=\"square\"\n                            variant=\"tertiary\"\n                            icon=\"delete-forever-16\"\n                            size=\"s\"\n                            aria-label={this.ariaLabelRemoveFile}\n                            onClick={() => this.removeFile(file)}\n                            style={{ display: !isUploading ? 'inline-flex' : 'none' }}\n                          ></ifx-icon-button>\n                        </div>\n                      </div>\n\n                      <div class=\"file-middle-row\">\n                        {isUploading && task && !task.error && (\n                          <span class=\"file-uploading\" aria-label={this.ariaLabelUploadingStatus}>\n                            {this.getFormattedProgressText(task)}\n                          </span>\n                        )}\n                        {!isUploading && !isError && (\n                          <span>\n                            <span class=\"file-size\">{this.formatSize(file.size)}</span>\n                            <span class=\"file-status\" aria-label={this.ariaLabelUploadedStatus}>\n                              <ifx-icon icon=\"check-16\"></ifx-icon>\n                              {this.labelUploaded}\n                            </span>\n                          </span>\n                        )}\n                        {isError && (\n                          <span class=\"file-status\" aria-label={this.ariaLabelUploadFailedStatus}>\n                            {this.labelUploadFailed}\n                          </span>\n                        )}\n                      </div>\n\n                      {isUploading && task && !task.error && (\n                        <div class=\"file-progress-row\">\n                          <ifx-progress-bar\n                            size=\"s\"\n                            value={progress}\n                            show-label=\"true\"\n                          ></ifx-progress-bar>\n                        </div>\n                      )}\n                    </div>\n                  </li>\n                );\n              })}\n            </ul>\n          </div>\n        )}\n      </div>\n    );\n  }\n\n  renderUploadArea() {\n    const handleInputRef = (el: HTMLInputElement | null) => {\n      this.fileInputEl = el;\n    };\n\n    return (\n      <div class={{ 'upload-button': true }}>\n        <ifx-button\n          variant=\"secondary\"\n          onClick={() => this.fileInputEl?.click()}\n          disabled={this.isInputDisabled()}\n          aria-label={this.ariaLabelBrowseFiles}\n        >\n          <ifx-icon icon=\"upload-16\"></ifx-icon>\n          {this.labelBrowseFiles}\n        </ifx-button>\n        <input\n          id={this.internalId}\n          ref={handleInputRef}\n          type=\"file\"\n          accept={this.getAcceptAttribute()}\n          multiple\n          onChange={(e) => this.handleFileChange(e)}\n          style={{ display: 'none' }}\n          disabled={this.isInputDisabled()}\n          aria-label={this.ariaLabelFileInput}\n        />\n        <p class=\"file-upload-info\">\n          {this.getSupportedFileText()}\n        </p>\n        {this.renderStatusMessage()}\n      </div>\n    );\n  }\n\n\n  renderDragAndDropArea() {\n    const handleInputRef = (el: HTMLInputElement | null) => {\n      this.fileInputEl = el;\n    };\n\n    const triggerInputClick = () => {\n      if (this.fileInputEl) {\n        this.fileInputEl.click();\n      }\n    };\n\n    return (\n      <div class={{ 'disabled': this.isInputDisabled() }}>\n        <div\n          class={{ 'upload-dropzone': true, 'drag-over': this.isDragOver, 'error': this.requiredError }}\n          onClick={triggerInputClick}\n          onDragOver={(e) => this.handleDragOver(e)}\n          onDragLeave={(e) => this.handleDragLeave(e)}\n          onDrop={(e) => this.handleDrop(e)}\n          role=\"button\"\n          tabIndex={0}\n          aria-label={this.ariaLabelDropzone}\n        >\n          <ifx-icon icon=\"upload-16\" class=\"custom-icon\"></ifx-icon>\n          <p>{this.labelDragAndDrop}</p>\n          <p class=\"file-upload-info\">\n            {this.getSupportedFileText()}\n          </p>\n          <div style={{ height: '0px', overflow: 'hidden' }}>\n            <input\n              id={this.internalId}\n              ref={handleInputRef}\n              type=\"file\"\n              accept={this.getAcceptAttribute()}\n              multiple\n              onChange={(e) => this.handleFileChange(e)}\n              disabled={this.isInputDisabled()}\n              aria-label={this.ariaLabelFileInput}\n            />\n          </div>\n        </div>\n        {this.renderStatusMessage()}\n      </div>\n    );\n  }\n\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/infineon-design-system-stencil/p-218c8275.entry.js

@@ -1,2 +0,0 @@
-import{r as t,h as i,g as o}from"./p-b7a462e5.js";import{d as r,t as a}from"./p-e8504e6b.js";import{i as e}from"./p-1ecafb97.js";const n=':root{--ifx-font-family:"Source Sans 3", "Arial, sans-serif"}.radio-button-group-container{display:flex;flex-direction:column}.radio-button-group{display:flex;font-family:var(--ifx-font-family);gap:8px}.radio-button-group.horizontal{flex-direction:row;column-gap:12px}.radio-button-group.vertical{flex-direction:column;row-gap:12px}.group-label{font:400 0.75rem/1rem "Source Sans 3";margin-bottom:8px;text-align:left;text-underline-position:from-font;text-decoration-skip-ink:none}.caption{margin-top:8px;align-self:flex-start;display:flex;width:100%;column-gap:8px;justify-content:space-between;align-items:center}.caption.default{color:#1D1D1D}.caption.error{color:#CD002F}.caption-text{font:400 0.75rem/1rem "Source Sans 3";flex:1;text-align:left;text-underline-position:from-font;text-decoration-skip-ink:none}.caption-icon{flex:0;display:flex}';const s=n;const c=class{constructor(i){t(this,i);this.errorStates=new Map;this.alignment="vertical";this.groupLabelText="Group Label Text";this.hasErrors=false;this.handleSlotChange=()=>{this.initializeState()}}handleRadioButtonError(t){const i=t.target;if(i.tagName==="ifx-radio-button"){this.errorStates.set(i,t.detail);this.updateHasErrors()}}async setGroupError(t){const i=Array.from(this.el.querySelectorAll("ifx-radio-button"));i.forEach((i=>{i.error=t}))}componentWillLoad(){if(!e(this.el)){const t=r();a("ifx-radio-button-group",t)}this.initializeState()}initializeState(){this.errorStates.clear();const t=Array.from(this.el.querySelectorAll("ifx-radio-button"));t.forEach((t=>{if(!this.errorStates.has(t)){this.errorStates.set(t,t.error||false)}}));this.updateHasErrors()}updateHasErrors(){this.hasErrors=Array.from(this.errorStates.values()).some((t=>t))}render(){return i("div",{key:"1aadf70d79446d417d55f286267db42b192d9728",class:"radio-button-group-container"},this.showGroupLabel?i("div",{class:"group-label"},this.groupLabelText," *"):"",i("div",{key:"4dd5ce464afe4f28f644762046b797db63d1f296",class:`radio-button-group ${this.alignment} ${this.size}`},i("slot",{key:"4a65d2e56526f5dfb7967abd1c51a2c85afb8e4e",onSlotchange:this.handleSlotChange})),this.showCaption?i("div",{class:`caption ${this.hasErrors?"error":"default"}`},this.showCaptionIcon?i("div",{class:"caption-icon"},i("ifx-icon",{icon:"c-info-16"})):"",i("div",{class:"caption-text"},this.captionText)):"")}static get formAssociated(){return true}get el(){return o(this)}};c.style=s;export{c as ifx_radio_button_group};
-//# sourceMappingURL=p-218c8275.entry.js.map

package/dist/infineon-design-system-stencil/p-218c8275.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["radioButtonGroupCss","IfxRadioButtonGroupStyle0","RadioButtonGroup","constructor","hostRef","this","errorStates","Map","alignment","groupLabelText","hasErrors","handleSlotChange","initializeState","handleRadioButtonError","event","radioButton","target","tagName","set","detail","updateHasErrors","setGroupError","error","radioButtons","Array","from","el","querySelectorAll","forEach","componentWillLoad","isNestedInIfxComponent","framework","detectFramework","trackComponent","clear","has","values","some","render","h","key","class","showGroupLabel","size","onSlotchange","showCaption","showCaptionIcon","icon","captionText"],"sources":["src/components/radio-button-group/radio-button-group.scss?tag=ifx-radio-button-group&encapsulation=shadow","src/components/radio-button-group/radio-button-group.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n.radio-button-group-container {\n    display: flex;\n    flex-direction: column;\n}\n\n.radio-button-group {\n    display: flex;\n    font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\n\n\n    gap: tokens.$ifxSpace100;\n\n    &.horizontal {\n        flex-direction: row;\n        column-gap: tokens.$ifxSpace150;\n    }\n\n    &.vertical {\n        flex-direction: column;\n        row-gap: tokens.$ifxSpace150;\n    }\n}\n\n.group-label {\n    font: tokens.$ifxBodyBody05;\n    margin-bottom: tokens.$ifxSpace100;\n    text-align: left;\n    text-underline-position: from-font;\n    text-decoration-skip-ink: none;\n}\n\n.caption {\n    margin-top: tokens.$ifxSpace100;\n    align-self: flex-start;\n    display: flex;\n    width: 100%;\n    column-gap: tokens.$ifxSpace100;\n    justify-content: space-between;\n    align-items: center;\n\n    &.default {\n        color: tokens.$ifxColorBaseBlack;\n    }\n\n    &.error {\n        color: tokens.$ifxColorRed500;\n    }\n}\n\n.caption-text {\n    font: tokens.$ifxBodyBody05;\n    flex: 1;\n    text-align: left;\n    text-underline-position: from-font;\n    text-decoration-skip-ink: none;\n}\n\n.caption-icon {\n    flex:0;\n    display: flex;\n}","import { Component, State, Prop, h, Element, Listen, Method } from '@stencil/core';\nimport { trackComponent } from '../../global/utils/tracking';\nimport { isNestedInIfxComponent } from '../../global/utils/dom-utils';\nimport { detectFramework } from '../../global/utils/framework-detection';\n\n@Component({\n    tag: 'ifx-radio-button-group',\n    styleUrl: 'radio-button-group.scss',\n    shadow: true,\n    formAssociated: true\n})\n\nexport class RadioButtonGroup {\n    private errorStates: Map<HTMLElement, boolean> = new Map();\n\n    @Element() el: HTMLElement;\n    @Prop() alignment: 'horizontal' | 'vertical' = 'vertical';\n    @Prop() size: string;\n    @Prop() showGroupLabel: boolean;\n    @Prop() groupLabelText: string = 'Group Label Text';\n    @Prop() showCaption: boolean;\n    @Prop() captionText: string;\n    @Prop() showCaptionIcon: boolean;\n    @State() hasErrors: boolean = false;\n    \n    @Listen('ifxError')\n    handleRadioButtonError(event: CustomEvent) {\n        const radioButton = event.target as HTMLElement;\n        if (radioButton.tagName === 'ifx-radio-button') {\n            this.errorStates.set(radioButton, event.detail);\n            this.updateHasErrors();\n        }\n    }\n\n     // Method to set the error state of all radio-butttons in the group\n      @Method()\n      async setGroupError(error: boolean) {\n        const radioButtons = Array.from(this.el.querySelectorAll('ifx-radio-button'));\n        radioButtons.forEach((radioButton) => {\n          (radioButton as any).error = error;\n        });\n      }\n\n    componentWillLoad() {\n        if(!isNestedInIfxComponent(this.el)) { \n            const framework = detectFramework();\n            trackComponent('ifx-radio-button-group', framework)\n        }\n        this.initializeState();\n    }\n\n    handleSlotChange = () => {\n        this.initializeState();\n    };\n\n    private initializeState() {\n        this.errorStates.clear();\n        const radioButtons = Array.from(this.el.querySelectorAll('ifx-radio-button'));\n        radioButtons.forEach((radioButton) => {\n            if (!this.errorStates.has(radioButton)) {\n                this.errorStates.set(radioButton, (radioButton as any).error || false);\n            }\n        });\n        this.updateHasErrors();\n    }\n\n    private updateHasErrors() {\n        this.hasErrors = Array.from(this.errorStates.values()).some((error) => error);\n    }\n\n    render() {\n        return (\n            <div class='radio-button-group-container'>\n                {this.showGroupLabel ? <div class='group-label'>{this.groupLabelText} *</div> : ''}\n                <div class={`radio-button-group ${this.alignment} ${this.size}`}>\n                    <slot onSlotchange={this.handleSlotChange} ></slot>\n                </div>\n                {this.showCaption ? (\n                    <div class={`caption ${this.hasErrors ? 'error' : 'default'}`}>\n                        {this.showCaptionIcon ? <div class='caption-icon'><ifx-icon icon=\"c-info-16\">\n                        </ifx-icon></div> : ''}\n                        <div class='caption-text'>{this.captionText}</div>\n                    </div>) : ''}\n            </div>\n        );\n    }\n}"],"mappings":"iIAAA,MAAMA,EAAsB,m1BAC5B,MAAAC,EAAeD,E,MCWFE,EAAgB,MAP7B,WAAAC,CAAAC,G,UAQYC,KAAAC,YAAyC,IAAIC,IAG7CF,KAAAG,UAAuC,WAGvCH,KAAAI,eAAyB,mBAIxBJ,KAAAK,UAAqB,MA4B9BL,KAAAM,iBAAmB,KACfN,KAAKO,iBAAiB,C,CA1B1B,sBAAAC,CAAuBC,GACnB,MAAMC,EAAcD,EAAME,OAC1B,GAAID,EAAYE,UAAY,mBAAoB,CAC5CZ,KAAKC,YAAYY,IAAIH,EAAaD,EAAMK,QACxCd,KAAKe,iB,EAMX,mBAAMC,CAAcC,GAClB,MAAMC,EAAeC,MAAMC,KAAKpB,KAAKqB,GAAGC,iBAAiB,qBACzDJ,EAAaK,SAASb,IACnBA,EAAoBO,MAAQA,CAAK,G,CAIxC,iBAAAO,GACI,IAAIC,EAAuBzB,KAAKqB,IAAK,CACjC,MAAMK,EAAYC,IAClBC,EAAe,yBAA0BF,E,CAE7C1B,KAAKO,iB,CAOD,eAAAA,GACJP,KAAKC,YAAY4B,QACjB,MAAMX,EAAeC,MAAMC,KAAKpB,KAAKqB,GAAGC,iBAAiB,qBACzDJ,EAAaK,SAASb,IAClB,IAAKV,KAAKC,YAAY6B,IAAIpB,GAAc,CACpCV,KAAKC,YAAYY,IAAIH,EAAcA,EAAoBO,OAAS,M,KAGxEjB,KAAKe,iB,CAGD,eAAAA,GACJf,KAAKK,UAAYc,MAAMC,KAAKpB,KAAKC,YAAY8B,UAAUC,MAAMf,GAAUA,G,CAG3E,MAAAgB,GACI,OACIC,EAAA,OAAAC,IAAA,2CAAKC,MAAM,gCACNpC,KAAKqC,eAAiBH,EAAA,OAAKE,MAAM,eAAepC,KAAKI,eAAc,MAAY,GAChF8B,EAAA,OAAAC,IAAA,2CAAKC,MAAO,sBAAsBpC,KAAKG,aAAaH,KAAKsC,QACrDJ,EAAA,QAAAC,IAAA,2CAAMI,aAAcvC,KAAKM,oBAE5BN,KAAKwC,YACFN,EAAA,OAAKE,MAAO,WAAWpC,KAAKK,UAAY,QAAU,aAC7CL,KAAKyC,gBAAkBP,EAAA,OAAKE,MAAM,gBAAeF,EAAA,YAAUQ,KAAK,eAC7C,GACpBR,EAAA,OAAKE,MAAM,gBAAgBpC,KAAK2C,cAC1B,G","ignoreList":[]}

package/dist/infineon-design-system-stencil/p-24fa4b84.entry.js

@@ -1,2 +0,0 @@
-import{r as e,c as a,h as t,g as s}from"./p-b7a462e5.js";import{d as i,t as l}from"./p-e8504e6b.js";import{i as r}from"./p-1ecafb97.js";const f=':host{display:block}.tree-view{font-family:var(--ifx-font-family, sans-serif);font-size:14px;color:var(--ifx-color-text, #1a1a1a);display:flex;flex-wrap:wrap;flex-direction:column;overflow-x:auto;overflow-y:hidden}.tree-view__label{font:600 1.125rem/1.625rem "Source Sans 3";margin-bottom:8px}';const o=f;const d=class{constructor(t){e(this,t);this.ifxTreeViewExpandAllChange=a(this,"ifxTreeViewExpandAllChange",7);this.ifxTreeViewDisableAllChange=a(this,"ifxTreeViewDisableAllChange",7);this.disableAllItems=false;this.expandAllItems=false;this.handleSlotRef=e=>{if(e){if(this.disableAllItems){e.setAttribute("data-disable-all-items","true")}else{e.removeAttribute("data-disable-all-items")}if(this.expandAllItems){e.setAttribute("data-expand-all-items","true")}else{e.removeAttribute("data-expand-all-items")}}}}handleExpandAllItemsChange(e){this.ifxTreeViewExpandAllChange.emit(e)}handleDisableAllItemsChange(e){this.ifxTreeViewDisableAllChange.emit(e)}componentWillLoad(){if(!r(this.el)){const e=i();l("ifx-tree-view",e)}}render(){return t("div",{key:"b772123548cdbaeb1f94cb88bc63df755a413d65",class:`tree-view ${this.disableAllItems?" tree-view--disabled":""}`,role:"tree","aria-label":this.ariaLabel},this.label&&this.label.trim()!==""&&t("div",{key:"daeecd95d3ff4cfe998f5a5af8a75bb81edb6f02",class:"tree-view__label"},this.label),t("slot",{key:"029a8ff4dffb9c6cfcfbae4e5c02f1fc79f17cec",ref:this.handleSlotRef}))}get el(){return s(this)}static get watchers(){return{expandAllItems:["handleExpandAllItemsChange"],disableAllItems:["handleDisableAllItemsChange"]}}};d.style=o;export{d as ifx_tree_view};
-//# sourceMappingURL=p-24fa4b84.entry.js.map

package/dist/infineon-design-system-stencil/p-24fa4b84.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["treeViewCss","IfxTreeViewStyle0","TreeView","constructor","hostRef","this","disableAllItems","expandAllItems","handleSlotRef","el","setAttribute","removeAttribute","handleExpandAllItemsChange","newValue","ifxTreeViewExpandAllChange","emit","handleDisableAllItemsChange","ifxTreeViewDisableAllChange","componentWillLoad","isNestedInIfxComponent","framework","detectFramework","trackComponent","render","h","key","class","role","ariaLabel","label","trim","ref"],"sources":["src/components/tree-view/tree-view.scss?tag=ifx-tree-view&encapsulation=shadow","src/components/tree-view/tree-view.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n\n:host {\n  display: block;\n}\n\n.tree-view {\n  font-family: var(--ifx-font-family, sans-serif);\n  font-size: 14px;\n  color: var(--ifx-color-text, #1a1a1a);\n\n  display: flex;\n  flex-wrap: wrap;\n  flex-direction: column;\n  overflow-x: auto;\n  overflow-y: hidden;\n\n  &__label {\n    font: tokens.$ifxHeadingHeading06;\n    margin-bottom: tokens.$ifxSpace100;\n  }\n}\n","import { Component, h, Prop, Event, EventEmitter, Watch, Element } from '@stencil/core';\nimport { trackComponent } from '../../global/utils/tracking';\nimport { isNestedInIfxComponent } from '../../global/utils/dom-utils';\nimport { detectFramework } from '../../global/utils/framework-detection';\n\n@Component({\n  tag: 'ifx-tree-view',\n  styleUrl: 'tree-view.scss',\n  shadow: true,\n})\nexport class TreeView {\n  @Element() el: HTMLElement;\n  @Prop() label?: string;\n  @Prop() disableAllItems: boolean = false;\n  @Prop() expandAllItems: boolean = false;\n  @Prop() ariaLabel: string | null;\n\n  @Event() ifxTreeViewExpandAllChange: EventEmitter<boolean>;\n  @Event() ifxTreeViewDisableAllChange: EventEmitter<boolean>;\n\n  @Watch('expandAllItems')\n  handleExpandAllItemsChange(newValue: boolean) {\n    this.ifxTreeViewExpandAllChange.emit(newValue);\n  }\n\n  @Watch('disableAllItems')\n  handleDisableAllItemsChange(newValue: boolean) {\n    this.ifxTreeViewDisableAllChange.emit(newValue);\n  }\n\n  private handleSlotRef = (el: HTMLSlotElement | null) => {\n    if (el) {\n      if (this.disableAllItems) {\n        el.setAttribute('data-disable-all-items', 'true');\n      } else {\n        el.removeAttribute('data-disable-all-items');\n      }\n      if (this.expandAllItems) {\n        el.setAttribute('data-expand-all-items', 'true');\n      } else {\n        el.removeAttribute('data-expand-all-items');\n      }\n    }\n  };\n\n  componentWillLoad() { \n    if(!isNestedInIfxComponent(this.el)) { \n      const framework = detectFramework();\n      trackComponent('ifx-tree-view', framework)\n    }\n  }\n\n  render() {\n    return (\n      <div\n        class={`tree-view ${this.disableAllItems ? ' tree-view--disabled' : ''}`}\n        role=\"tree\"\n        aria-label={this.ariaLabel}\n      >\n        {this.label && this.label.trim() !== '' && <div class=\"tree-view__label\">{this.label}</div>}\n        <slot ref={this.handleSlotRef}></slot>\n      </div>\n    );\n  }\n}\n"],"mappings":"wIAAA,MAAMA,EAAc,wSACpB,MAAAC,EAAeD,E,MCSFE,EAAQ,MALrB,WAAAC,CAAAC,G,0JAQUC,KAAAC,gBAA2B,MAC3BD,KAAAE,eAA0B,MAgB1BF,KAAAG,cAAiBC,IACvB,GAAIA,EAAI,CACN,GAAIJ,KAAKC,gBAAiB,CACxBG,EAAGC,aAAa,yBAA0B,O,KACrC,CACLD,EAAGE,gBAAgB,yB,CAErB,GAAIN,KAAKE,eAAgB,CACvBE,EAAGC,aAAa,wBAAyB,O,KACpC,CACLD,EAAGE,gBAAgB,wB,IAnBzB,0BAAAC,CAA2BC,GACzBR,KAAKS,2BAA2BC,KAAKF,E,CAIvC,2BAAAG,CAA4BH,GAC1BR,KAAKY,4BAA4BF,KAAKF,E,CAkBxC,iBAAAK,GACE,IAAIC,EAAuBd,KAAKI,IAAK,CACnC,MAAMW,EAAYC,IAClBC,EAAe,gBAAiBF,E,EAIpC,MAAAG,GACE,OACEC,EAAA,OAAAC,IAAA,2CACEC,MAAO,aAAarB,KAAKC,gBAAkB,uBAAyB,KACpEqB,KAAK,OAAM,aACCtB,KAAKuB,WAEhBvB,KAAKwB,OAASxB,KAAKwB,MAAMC,SAAW,IAAMN,EAAA,OAAAC,IAAA,2CAAKC,MAAM,oBAAoBrB,KAAKwB,OAC/EL,EAAA,QAAAC,IAAA,2CAAMM,IAAK1B,KAAKG,gB","ignoreList":[]}

package/dist/infineon-design-system-stencil/p-29f36497.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["ButtonCellRenderer","init","params","this","createButton","getGui","eGui","refresh","updateButton","config","data","button","options","colDef","cellRendererParams","document","createElement","eButton","hasRequiredKeys","setButtonAttributes","appendChild","attachEventListener","innerHTML","detachEventListener","setAttribute","disabled","toString","variant","theme","type","size","fullWidth","target","href","textContent","text","eventListener","event","onButtonClick","addEventListener","removeEventListener","CustomNoRowsOverlay","noRowsMessageFunc","_params","CustomLoadingOverlay","tableCss","IfxTableStyle0","Table","constructor","hostRef","currentPage","rowData","colData","filterOptions","currentFilters","allRowData","rowHeight","tableHeight","pagination","paginationPageSize","filterOrientation","showSidebarFilters","matchingResultsCount","showLoading","originalRowData","handleChipChange","name","currentSelection","previousSelection","detail","updatedFilters","Object","assign","length","customEvent","CustomEvent","filterName","bubbles","composed","host","dispatchEvent","filterValues","map","selection","value","applyAllFilters","updateTableView","onButtonRendererOptionsChanged","getColData","gridApi","setColumnDefs","toggleSidebarFilters","updateFilterOptions","col","field","Set","row","handleSidebarFilterChange","filterGroups","forEach","filterGroup","filterGroupName","selectedItems","item","label","handleTopbarFilterChange","filters","filter","filterInfo","selectedValues","toLowerCase","textFilterMatched","property","hasOwnProperty","rowValue","String","some","filterValue","startsWith","includesUndefined","includes","startIndex","endIndex","visibleRowData","slice","setGridOption","clearAllFilters","onBtShowLoading","showLoadingOverlay","componentWillLoad","isNestedInIfxComponent","framework","detectFramework","trackComponent","uniqueKey","Math","floor","random","getRowData","gridOptions","headerHeight","defaultColDef","resizable","suppressDragLeaveHidesColumns","enableCellTextSelection","onFirstDataRendered","bind","columnDefs","loadingOverlayComponent","noRowsOverlayComponent","noRowsOverlayComponentParams","icons","sortAscending","sortDescending","sortUnSort","rowDragManaged","dndSource","animateRows","componentDidRender","componentDidLoad","container","createGrid","sizeColumnsToFit","defaultMinWidth","paginationElement","shadowRoot","querySelector","handlePageChange","sidebarFilterElements","querySelectorAll","sidebarFilterElement","topbarFilterElements","topbarFilterElement","componentWillUnmount","sidebarFilters","sidebarFilter","topbarFilters","topbarFilter","isJSONParseable","str","JSON","parse","e","rows","undefined","Array","isArray","console","error","cols","buttonColumn","find","column","cellRenderer","valueFormatter","buttonRendererOptions","api","handleResetButtonClick","resetEvent","window","disconnectedCallback","resetButton","getTableClassNames","classNames","render","style","height","filterClass","h","Host","key","class","onClick","icon","keys","isMultiSelect","placeholder","readOnly","selected","id","ref","el","total","hasButtonCol","onDragOver","dragSupported","dataTransfer","dropEffect","preventDefault","onDrop","jsonData","getData","eJsonRow","classList","add","innerText","eJsonDisplay"],"sources":["src/components/table-advanced-version/buttonCellRenderer.ts","src/components/table-advanced-version/customNoRowsOverlay.ts","src/components/table-advanced-version/customLoadingOverlay.ts","src/components/table-advanced-version/table.scss?tag=ifx-table&encapsulation=shadow","src/components/table-advanced-version/table.tsx"],"sourcesContent":["import { ICellRendererComp, ICellRendererParams } from 'ag-grid-community';\nimport { ButtonInterface } from './interfaces';\n\nexport class ButtonCellRenderer implements ICellRendererComp {\n  eGui!: HTMLDivElement;\n  eButton!: HTMLElement;  // Change to a generic HTMLElement to accommodate custom elements\n  eventListener!: (event: Event) => void;\n\n  init(params: ICellRendererParams) {\n    this.createButton(params);\n  }\n\n  getGui() {\n    return this.eGui;\n  }\n\n  refresh(params: ICellRendererParams) {\n    this.updateButton(params);\n    return true;\n  }\n\n  private createButton(params: ICellRendererParams) {\n    const config = params.data.button;\n    const options = params.colDef.cellRendererParams || {};\n    \n    this.eGui = document.createElement('div');\n    this.eButton = document.createElement('ifx-button') as HTMLElement;\n    \n    if (this.hasRequiredKeys(config)) {\n      this.setButtonAttributes(config);\n      this.eGui.appendChild(this.eButton);\n      this.attachEventListener(options, params);\n    } else {\n      this.eGui.innerHTML = `<span>${config}</span>`;\n    }\n  }\n\n  private updateButton(params: ICellRendererParams) {\n    const config = params.data.button;\n    const options = params.colDef.cellRendererParams || {};\n    \n    if (this.hasRequiredKeys(config)) {\n      this.setButtonAttributes(config);\n      this.detachEventListener();\n      this.attachEventListener(options, params);\n    } else {\n      this.eGui.innerHTML = `<span>${config}</span>`;\n    }\n  }\n\n  private setButtonAttributes(config: ButtonInterface) {\n    this.eButton.setAttribute('disabled', config.disabled.toString());\n    this.eButton.setAttribute('variant', config.variant);\n    this.eButton.setAttribute('theme', config.theme);\n    this.eButton.setAttribute('type', config.type);\n    this.eButton.setAttribute('size', config.size);\n    this.eButton.setAttribute('full-width', config.fullWidth.toString());\n    this.eButton.setAttribute('target', config.target);\n    this.eButton.setAttribute('href', config.href);\n    this.eButton.textContent = config.text;\n  }\n\n  private attachEventListener(options: any, params: ICellRendererParams) {\n    this.eventListener = (event: Event) => {\n      if (options.onButtonClick) {\n        options.onButtonClick(params, event);\n      }\n    };\n    this.eButton.addEventListener('click', this.eventListener);\n  }\n\n  private detachEventListener() {\n    if (this.eventListener) {\n      this.eButton.removeEventListener('click', this.eventListener);\n    }\n  }\n\n  private hasRequiredKeys(config: ButtonInterface): boolean {\n    return config && config.text !== '' && config.variant !== '' && config.size !== '' && config.type !== '';\n  }\n}\n","import { ICellRendererComp, ICellRendererParams } from 'ag-grid-community';\n\nexport class CustomNoRowsOverlay implements ICellRendererComp {\n  eGui!: HTMLElement;\n\n  init(params: ICellRendererParams & { noRowsMessageFunc: () => string }) {\n    this.eGui = document.createElement('div');\n    this.eGui.innerHTML = `\n            <div role=\"presentation\" class=\"ag-overlay-loading-center\" >\n               ${params.noRowsMessageFunc()}\n            </div>\n        `;\n  }\n\n  getGui() {\n    return this.eGui;\n  }\n\n  refresh(_params: ICellRendererParams): boolean {\n    return false;\n  }\n}","import { ICellRendererComp, ICellRendererParams } from 'ag-grid-community';\n\nexport class CustomLoadingOverlay implements ICellRendererComp {\n  eGui!: HTMLElement;\n\n  init(_params: ICellRendererParams & { loadingMessage: string }) {\n    this.eGui = document.createElement('div');\n    this.eGui.innerHTML = `<div class=\"ag-overlay-loading-center\" role=\"presentation\">\n<ifx-spinner></ifx-spinner>\n            </div>`;\n  }\n\n  getGui() {\n    return this.eGui;\n  }\n\n  refresh(_params: ICellRendererParams): boolean {\n    return false;\n  }\n}","@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n@import \"~ag-grid-community/styles/ag-grid.css\";\n\n.zebra { \n  & .ag-row-odd { \n    background-color: tokens.$ifxColorEngineering100!important;\n  }\n\n  & .ag-row { \n    border-bottom: none!important;\n  }\n}\n\n.ag-header-viewport { \n  background-color: tokens.$ifxColorEngineering200!important;\n}\n\n\n.table-container {\n  display: block;\n}\n\n.sidebar-btn {\n  margin-bottom: 24px;\n}\n\n.sidebar-container {\n  margin-right: 24px;\n}\n\n.sidebar-layout {\n  display: flex;\n  flex-direction: row;\n}\n\n.topbar-layout {\n  display: flex;\n  flex-direction: column;\n}\n\n.table-pagination-wrapper {\n  display: flex;\n  flex-direction: column;\n  align-items: stretch; // stretches items to fill the container horizontally\n  width: 100%; // ensures the wrapper takes up the full width of its parent\n}\n\n#table-wrapper {\n  flex: 1; // allows the table to take up the remaining space\n  padding-bottom: tokens.$ifxSpace100;\n}\n\n\n.table-wrapper .ag-root-wrapper-body {\n  height: auto !important;\n  min-height: 100px !important;\n  min-width: 100px;\n}\n\n.filter-chips { \n  display:flex;\n  gap:tokens.$ifxSpace100;\n  margin-bottom: 12px;\n}\n\n.filter-chips > ifx-button { // ifx-button with icon and text has a paddingof 16 px. This is to remove the padding to align with the filter-chips container definition\n  margin-left: -8px;\n}\n\n.set-filter-wrapper-sidebar {\n  display: flex;\n  flex-direction: column;\n  margin-bottom: tokens.$ifxSpace100;\n}\n\n.set-filter-wrapper-topbar {\n  display: flex;\n  flex-wrap: wrap;\n  flex-direction: row;\n  margin-bottom: tokens.$ifxSpace100;\n  background: tokens.$ifxColorEngineering100;\n  padding-top: 32px;\n  padding-bottom: 32px;\n  gap: 24px;\n }\n\n\n.ifx-ag-grid {\n  display: grid;\n  height: 100%;\n  width: 100%;\n  min-width: 100px;\n  //padding-bottom: tokens.$ifxSpace100;\n}\n\n\n.ifx-ag-grid .ag-header-cell::after {\n  outline: none !important;\n  border: none !important;\n  box-shadow: none !important;\n}\n\n.ifx-ag-grid .ag-header-cell:focus {\n  outline: none !important;\n}\n\n.ifx-ag-grid *:not(.ag-header-cell):focus {\n  outline: none;\n}\n\n\n.ifx-ag-grid .ag-header-cell:not(:last-child)::before {\n  content: '';\n  position: absolute;\n  right: 0;\n  top: calc(50% - 12px);\n  height: 24px; \n  width: 1px;\n  background-color: tokens.$ifxColorEngineering300; \n}\n\n\n.ag-overlay-loading-center {\n  border: none;\n  background: none;\n  border-radius: none;\n  box-shadow: none;\n}\n\n\n.ag-root-wrapper {\n  border: 1px solid tokens.$ifxColorEngineering200;\n}\n\n\n\n.ag-header {\n  background-color: tokens.$ifxColorEngineering100;\n  border-bottom: none;\n\n  &.ag-header-active {\n    outline: none !important;\n    border-color: #0A8276 !important;\n  }\n}\n\n.ag-header-cell {\n  padding-left: 16px;\n  padding-right: 16px;\n  gap: 4px;\n}\n\n\n.ag-header-cell-focus {\n  border: none !important;\n  outline: none !important;\n}\n\n.ag-header-cell-text {\n  font-size: 13px;\n  font-style: normal;\n  font-weight: 600;\n  line-height: 20px;\n  color: tokens.$ifxColorBaseBlack;\n  font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\n\n\n\n}\n\n.ag-row-focus {\n  background-color: inherit !important;\n  /* Reset the hover color to the row's original color */\n}\n\n.ag-row-hover {\n  background-color: tokens.$ifxColorBaseWhite !important; //inherit !important;\n  /* Reset the hover color to the row's original color */\n}\n\n\n.ag-cell-focus {\n  border: none !important;\n  outline: none !important;\n  background-color: inherit !important;\n}\n\n\n\n.ag-row {\n  background-color: tokens.$ifxColorBaseWhite;\n  border-bottom: 1px solid tokens.$ifxColorEngineering200;\n  font-size: 13px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 20px;\n  z-index: 1; //ensure the stacking order when used inside js frameworks\n}\n\n.ag-row-odd {\n  background-color: tokens.$ifxColorBaseWhite;\n}\n\n.ag-cell {\n  display: flex;\n  padding-left: 16px;\n  padding-right: 16px;\n  align-items: center;\n\n}\n\n.ag-ltr .ag-sort-indicator-icon {\n  padding-left: 0px;\n  vertical-align: bottom;\n  line-height: 12px;\n}\n\n.ag-sort-indicator-container .ag-sort-order { \n  display: none;\n}\n\n.unsort-icon-custom-color {\n  color: tokens.$ifxColorEngineering400;\n}\n\n\n// Table with set filters in sidebar orientation\n\n\n.filters-title {\n  font-size: 24px;\n  font-weight: 600;\n}\n\n\n.matching-results-container {\n  display: flex;\n  gap: 4px;\n  font-size: 14px;\n}\n\n.matching-results-count {\n  font-weight: 600;\n}\n\n.matching-results-text {\n  font-weight: 400;\n}","import { Component, h, Host, Method, Element, Prop, State, Listen, Watch } from '@stencil/core';\nimport classNames from 'classnames';\nimport { trackComponent } from '../../global/utils/tracking'; \nimport { isNestedInIfxComponent } from '../../global/utils/dom-utils';\nimport { detectFramework } from '../../global/utils/framework-detection';\nimport { createGrid, FirstDataRenderedEvent, GridApi, GridOptions } from 'ag-grid-community';\nimport { ButtonCellRenderer } from './buttonCellRenderer';\nimport { CustomNoRowsOverlay } from './customNoRowsOverlay';\nimport { CustomLoadingOverlay } from './customLoadingOverlay';\n\n\n@Component({\n  tag: 'ifx-table',\n  styleUrl: 'table.scss',\n  shadow: true\n})\nexport class Table {\n  gridOptions: GridOptions;\n  gridApi: GridApi;\n  @State() currentPage: number = 1;\n  @Prop() cols: any;\n  @Prop() rows: any;\n  @Prop() buttonRendererOptions?: { onButtonClick?: (params: any, event: Event) => void;}; \n  @State() rowData: any[] = [];\n  @State() colData: any[] = [];\n  @State() filterOptions: { [key: string]: string[] } = {};\n  @State() currentFilters = {};\n  @State() uniqueKey: string;\n  allRowData: any[] = [];\n  @Prop() rowHeight: string = 'default';\n  @Prop() tableHeight: string = 'auto';\n  @Prop() pagination: boolean = true;\n  @Prop() paginationPageSize: number = 10;\n  @Prop() filterOrientation: string = 'sidebar'; // topbar / none\n  @State() showSidebarFilters: boolean = true;\n  @State() matchingResultsCount: number = 0;\n  @Prop() variant: string = 'default'\n\n  @Prop() showLoading: boolean = false;\n  private container: HTMLDivElement;\n  @Element() host: HTMLElement;\n  originalRowData: any[] = [];\n\n  @Listen('ifxChange')\n  handleChipChange(event: CustomEvent<{ previousSelection: Array<any>, currentSelection: Array<any>, name: string }>) {\n    const { name, currentSelection, previousSelection } = event.detail;\n    if(currentSelection && previousSelection) { \n      // Clone the current filters state\n      const updatedFilters = { ...this.currentFilters };\n  \n      if (currentSelection.length === 0) {\n        // If there are no selections for this filter, delete the filter\n        delete updatedFilters[name];\n  \n        // Emit event with specific filter name\n        const customEvent = new CustomEvent('ifxUpdateSidebarFilter', { detail: { filterName: name }, bubbles: true, composed: true });\n        this.host.dispatchEvent(customEvent);\n      } else {\n        // Otherwise, update the filter values with the current selection\n        updatedFilters[name].filterValues = currentSelection.map(selection => selection.value);\n      }\n  \n      // Update the component's filters\n      this.currentFilters = updatedFilters;\n  \n      // Ensure table data is updated\n      this.allRowData = this.applyAllFilters(this.originalRowData, this.currentFilters);\n      this.updateTableView();\n    }\n  }\n\n  @Watch('buttonRendererOptions')\n  onButtonRendererOptionsChanged() {\n     this.colData = this.getColData();  // Re-fetch column data to apply new renderer options\n    if (this.gridApi) {\n      this.gridApi.setColumnDefs(this.colData);  // Update column definitions in the grid API\n    }\n  }\n\n  toggleSidebarFilters() {\n    this.showSidebarFilters = !this.showSidebarFilters;\n  }\n\n  updateFilterOptions() {\n    const options = {};\n    for (let col of this.colData) {\n      options[col.field] = [...new Set(this.rowData.map(row => row[col.field]))];\n    }\n    this.filterOptions = options;\n  }\n\n  handleSidebarFilterChange(event: CustomEvent) {\n    const filterGroups = event.detail;\n    const updatedFilters = {};\n\n    filterGroups.forEach(filterGroup => {\n      const filterName = filterGroup.filterGroupName;\n      let filterValues;\n      let type;\n\n      if (filterGroup.selectedItems && filterGroup.selectedItems.length > 0) {\n        filterValues = filterGroup.selectedItems.map(item => item.label);\n        type = 'multi-select';\n      } else if (filterGroup.value) {\n        filterValues = [filterGroup.value];\n        type = 'text';\n      } else {\n        filterValues = [];\n      }\n\n      if (!(filterValues.length === 0 || (filterValues.length === 1 && type === 'text' && filterValues[0] === ''))) {\n        updatedFilters[filterName] = { filterValues, type };\n      }\n    });\n\n    this.allRowData = this.applyAllFilters(this.originalRowData, updatedFilters);\n    this.updateTableView();\n    this.currentFilters = updatedFilters;\n  }\n\n\n  handleTopbarFilterChange(event: CustomEvent) {\n    const filters = event.detail;\n\n    // Start by resetting the filter conditions to a blank object\n    this.currentFilters = {};\n\n    // Loop through each filter group provided in the event detail\n    filters.forEach(filter => {\n      const filterName = filter.filterName;\n      let filterValues;\n\n      let type = filter.type;\n\n      if (type === 'text') {\n        // Search/Text filter\n        filterValues = filter.filterValues\n      } else {\n        // Multi-select/Single-Select\n        filterValues = filter.filterValues.map(item => item.label);\n      }\n\n      // If there are no filter values, or the filter is a text filter with an empty value, remove the filter\n      if (!(filterValues.length === 0 || (filterValues.length === 1 && type === 'text' && filterValues[0] === ''))) {\n        // Add or update the filter in the currentFilters object\n        this.currentFilters[filterName] = { filterValues, type };\n      }\n    });\n\n\n    // Now that the currentFilters object has been updated, apply all filters to the data\n    this.allRowData = this.applyAllFilters(this.originalRowData, this.currentFilters);\n\n    // After filtering, update the table view with the new filtered data\n    this.updateTableView();\n  }\n\n\n  applyAllFilters(data, filters) {\n    return data.filter(row => {\n      for (const filterName in filters) {\n        const filterInfo = filters[filterName];\n        let selectedValues = (filterInfo.filterValues || []).map(value => {\n          if (typeof value === 'string') {\n            return value.toLowerCase();\n          } else if (typeof value === 'number' || typeof value === 'boolean') {\n            return value.toString();\n          }\n          return '';\n        });\n\n        // For text filters, check if row values start with any of the selectedValues\n        if (filterInfo.type === 'text') {\n          let textFilterMatched = false;\n          for (let property in row) {\n            if (row.hasOwnProperty(property)) {\n              let rowValue = row[property] != null ? String(row[property]).toLowerCase() : '';\n              if (selectedValues.some(filterValue => rowValue.startsWith(filterValue))) {\n                textFilterMatched = true;\n                break;\n              }\n            }\n          }\n          if (!textFilterMatched) return false;\n        }\n        // For multi-select filters, this remains unchanged\n        else if (filterInfo.type === 'multi-select') {\n          let rowValue = row[filterName] != null ? String(row[filterName]).toLowerCase() : '';\n          // Check if 'undefined' is a selected value and include rows with empty values in that case\n          let includesUndefined = selectedValues.includes('undefined');\n          if (!selectedValues.includes(rowValue) && !(includesUndefined && rowValue === '')) {\n            return false;\n          }\n        }\n      }\n      return true;\n    });\n  }\n\n\n\n  updateTableView() {\n    // Calculate the slice of data to display based on pagination\n    const startIndex = (this.currentPage - 1) * this.paginationPageSize;\n    const endIndex = startIndex + this.paginationPageSize;\n    const visibleRowData = this.allRowData.slice(startIndex, endIndex);\n\n    // Update the row data in the table\n    this.rowData = visibleRowData;\n    this.gridApi.setGridOption('rowData', this.rowData);\n\n    // Update matching results count\n    this.matchingResultsCount = this.allRowData.length;\n  }\n\n\n  clearAllFilters() {\n    this.currentFilters = {};\n    this.allRowData = [...this.originalRowData];\n  }\n\n\n  @Method()\n  async onBtShowLoading() {\n    this.gridApi.showLoadingOverlay();\n  }\n\n  componentWillLoad() {\n    if(!isNestedInIfxComponent(this.host)) { \n      const framework = detectFramework();\n      trackComponent('ifx-table', framework)\n    }\n    this.uniqueKey = `unique-${Math.floor(Math.random() * 1000000)}`;\n\n    this.rowData = this.getRowData();\n    this.colData = this.getColData();\n    this.updateFilterOptions();\n\n    this.gridOptions = {\n\n      rowHeight: this.rowHeight === 'default' ? 40 : 32,\n      headerHeight: 40,\n      defaultColDef: {\n        resizable: true,\n      },\n      suppressDragLeaveHidesColumns: true,\n      enableCellTextSelection: true,\n      onFirstDataRendered: this.onFirstDataRendered.bind(this),\n      columnDefs: this.colData,\n      rowData: this.rowData,\n      loadingOverlayComponent: CustomLoadingOverlay,\n      noRowsOverlayComponent: CustomNoRowsOverlay,\n      noRowsOverlayComponentParams: {\n        noRowsMessageFunc: () =>\n          'No rows found' //at: ' + new Date().toLocaleTimeString(),\n      },\n      icons: {\n        sortAscending: '<ifx-icon icon=\"arrow-triangle-up-16\"></ifx-icon>',\n        sortDescending: '<ifx-icon icon=\"arrow-triangle-down-16\"></ifx-icon>',\n        sortUnSort: '<a class=\"unsort-icon-custom-color\"><ifx-icon icon=\"arrow-triangle-vertikal-16\"></ifx-icon></a>'\n      },\n      rowDragManaged: this.colData.some(col => col.dndSource === true) ? true : false,\n      animateRows: this.colData.some(col => col.dndSource === true) ? true : false,\n    };\n\n  }\n\n  componentDidRender() {\n    if (this.gridApi) {\n      this.gridApi.setGridOption('columnDefs', this.colData);\n    }\n  }\n\n\n\n  componentDidLoad() {\n    if (this.container) {\n      this.gridApi = createGrid(this.container, this.gridOptions);\n      if (this.gridApi) {\n        this.gridApi.sizeColumnsToFit({\n          defaultMinWidth: 100,\n        });\n        this.gridApi.setGridOption('columnDefs', this.colData);\n        this.gridApi.setGridOption('rowData', this.rowData);\n\n        if (this.pagination) {\n          const paginationElement = this.host.shadowRoot.querySelector('ifx-pagination');\n          if (paginationElement) {\n            paginationElement.addEventListener('ifxPageChange', this.handlePageChange.bind(this));\n          }\n        }\n        const sidebarFilterElements = this.host.querySelectorAll('ifx-filter-type-group');\n        // Add an event listener to each SetFilter component\n        sidebarFilterElements.forEach(sidebarFilterElement => {\n          sidebarFilterElement.addEventListener('ifxSidebarFilterChange', this.handleSidebarFilterChange.bind(this));\n        });\n        const topbarFilterElements = this.host.querySelectorAll('ifx-filter-bar');\n        // Add an event listener to each SetFilter component\n        topbarFilterElements.forEach(topbarFilterElement => {\n          topbarFilterElement.addEventListener('ifxTopbarFilterChange', this.handleTopbarFilterChange.bind(this));\n        });\n      }\n    }\n  }\n\n  componentWillUnmount() {\n    if (this.pagination) {\n      const paginationElement = this.host.shadowRoot.querySelector('ifx-pagination');\n      if (paginationElement) {\n        paginationElement.removeEventListener('ifxPageChange', this.handlePageChange.bind(this));\n      }\n    }\n    const sidebarFilters = this.host.shadowRoot.querySelectorAll('ifx-filter-type-group');\n    // Remove the event listener from each SetFilter component\n    sidebarFilters.forEach(sidebarFilter => {\n      sidebarFilter.removeEventListener('ifxSidebarFilterChange', this.handleSidebarFilterChange.bind(this));\n    });\n    const topbarFilters = this.host.shadowRoot.querySelectorAll('ifx-filter-type-group');\n    // Remove the event listener from each SetFilter component\n    topbarFilters.forEach(topbarFilter => {\n      topbarFilter.removeEventListener('ifxTopbarFilterChange', this.handleTopbarFilterChange.bind(this));\n    });\n  }\n\n  handlePageChange(event) {\n    this.currentPage = event.detail.currentPage;\n    const startIndex = (this.currentPage - 1) * this.paginationPageSize;\n    const endIndex = startIndex + this.paginationPageSize;\n    const visibleRowData = this.allRowData.slice(startIndex, endIndex);\n    // Update the data in the grid\n    if (this.gridApi) {\n      this.gridApi.setGridOption('rowData', visibleRowData);\n    }\n  }\n\n  isJSONParseable(str) {\n    try {\n      JSON.parse(str);\n      return true;\n    } catch (e) {\n      return false;\n    }\n  }\n\n\n  getRowData() {\n    let rows: any[] = [];\n    if (this.rows === undefined || this.rows === null) {\n      return rows;\n    }\n \n    if (this.isJSONParseable(this.rows)) {\n      rows = [...JSON.parse(this.rows)];\n    }\n    else if (Array.isArray(this.rows) || typeof this.rows === 'object') {\n       rows = [...this.rows];\n    }\n    else {\n      console.error('Unexpected value for rows: ', this.rows);\n    }\n\n    this.allRowData = rows;\n    this.originalRowData = [...rows]; // Deep copy the original data\n    this.matchingResultsCount = this.allRowData.length;\n\n    return rows.slice(0, this.paginationPageSize);\n  }\n\n\n  getColData() {\n    let cols: any[] = [];\n    if (this.cols === undefined || this.cols === null) {\n      return cols;\n    }\n  \n    if (this.isJSONParseable(this.cols)) {\n      cols = [...JSON.parse(this.cols)];\n    } else if (Array.isArray(this.cols) || typeof this.cols === 'object') {\n      cols = [...this.cols];\n    } else {\n      console.error('Unexpected value for cols: ', this.cols);\n    }\n  \n    const buttonColumn = cols.find(column => column.field === 'button');\n    if (buttonColumn) {\n      buttonColumn.cellRenderer = ButtonCellRenderer;\n      buttonColumn.valueFormatter = params => params.value.text;\n      \n      // No JSON.parse needed now\n      if (this.buttonRendererOptions && typeof this.buttonRendererOptions === 'object') {\n        if (this.buttonRendererOptions.onButtonClick) {\n          buttonColumn.cellRendererParams = {\n            onButtonClick: this.buttonRendererOptions.onButtonClick\n          };\n        }\n      }\n    }\n  \n    return cols;\n  }\n  \n\n  onFirstDataRendered(params: FirstDataRenderedEvent) {\n    params.api.sizeColumnsToFit();\n  }\n\n  handleResetButtonClick() {\n    const resetEvent = new CustomEvent('ifxResetFiltersEvent', { bubbles: true, composed: true });\n    window.dispatchEvent(resetEvent); // Dispatch from the window object\n\n    this.clearAllFilters();\n    this.updateTableView();  // Update table view with the original data\n  }\n\n\n  disconnectedCallback() {\n    if (this.pagination) {\n      const paginationElement = this.host.shadowRoot.querySelector('ifx-pagination');\n      if (paginationElement) {\n        paginationElement.removeEventListener('ifxPageChange', this.handlePageChange);\n      }\n    }\n\n    const resetButton = this.host.shadowRoot.querySelector('#reset-filters-button');\n    if (resetButton) {\n      resetButton.removeEventListener('click', this.handleResetButtonClick.bind(this));\n    }\n  }\n\n\n\n  getTableClassNames() {\n    return classNames(\n      this.tableHeight === 'auto' && 'table-wrapper ag-root-wrapper-body',\n      'table-wrapper',\n    );\n  }\n\n\n  render() {\n    let style = {};\n    if (this.tableHeight !== 'auto') {\n      style = {\n        'height': this.tableHeight\n      };\n    }\n    const filterClass = this.filterOrientation === 'topbar' ? 'topbar-layout' : 'sidebar-layout';\n    return (\n      <Host>\n        <div class=\"table-container\">\n          {this.filterOrientation === 'sidebar' && (\n            <div class=\"sidebar-btn\">\n              <ifx-button\n                type=\"button\"\n                disabled={false}\n                variant=\"secondary\"\n                size=\"m\"\n                target=\"_blank\"\n                theme=\"default\"\n                full-width=\"false\"\n                onClick={() => this.toggleSidebarFilters()}\n              >\n                <ifx-icon icon=\"cross-16\"></ifx-icon>{this.showSidebarFilters ? 'Hide Filters' : 'Show Filters'}\n              </ifx-button>\n            </div>\n          )}\n\n          <div class={filterClass}>\n            {this.filterOrientation === 'sidebar' && this.showSidebarFilters && (\n              <div class=\"sidebar-container\">\n                <div class=\"filters-title-container\">\n                  <span class=\"filters-title\">Filters</span>\n                </div>\n                <div class=\"set-filter-wrapper-sidebar\">\n                  {(this.filterOrientation !== 'sidebar' || this.showSidebarFilters) && (\n                    <slot name=\"sidebar-filter\"></slot>\n                  )}\n                </div>\n              </div>\n            )}\n\n            {this.filterOrientation !== 'none' && this.filterOrientation !== 'sidebar' && (\n              <div class=\"set-filter-wrapper-topbar\">\n                {(this.filterOrientation !== 'sidebar' || this.showSidebarFilters) && (\n                  <slot name=\"topbar-filter\"></slot>\n                )}\n              </div>\n            )}\n\n            <div class=\"table-pagination-wrapper\">\n              <div class=\"filter-chips\">\n                {this.filterOrientation !== 'none' && this.filterOrientation !== 'topbar' && this.showSidebarFilters && (\n                  Object.keys(this.currentFilters).map(name => {\n                    const filter = this.currentFilters[name];\n                    const filterValues = filter.filterValues;\n                    const isMultiSelect = filter.type !== 'text';\n\n                    return filterValues.length > 0 ? (\n                      <ifx-chip\n                        placeholder={name}\n                        size=\"large\"\n                        variant={isMultiSelect ? \"multi\" : \"single\"}\n                        readOnly={true}\n                        value={filterValues} // Ensure value prop is set\n                        key={name}\n                      >\n                        {filterValues.map(filterValue => (\n                          <ifx-chip-item value={filterValue} selected={true} key={filterValue}>\n                            {filterValue}\n                          </ifx-chip-item>\n                        ))}\n                      </ifx-chip>\n                    ) : null;\n                  })\n                )}\n\n                {this.filterOrientation !== 'none' && this.filterOrientation === 'sidebar' && this.showSidebarFilters && Object.keys(this.currentFilters).length > 0 && (\n                  <ifx-button type=\"button\" disabled={false} variant=\"tertiary\" size=\"m\" target=\"_blank\" theme=\"default\" full-width=\"false\" onClick={() => this.handleResetButtonClick()}\n                  >\n                    <ifx-icon icon=\"curved-arrow-left-16\"></ifx-icon>Reset all\n                  </ifx-button>\n                )}\n              </div>\n\n              {this.filterOrientation !== 'none' && (\n                <div class=\"matching-results-container\">\n                  <span class=\"matching-results-count\">\n                    {this.matchingResultsCount}\n                  </span>\n                  <span class=\"matching-results-text\">\n                    matching results\n                  </span>\n                </div>\n              )}\n\n              <div id=\"table-wrapper\" class={this.getTableClassNames()}>\n                <div id={`ifxTable-${this.uniqueKey}`} class={`ifx-ag-grid ${this.variant === 'zebra' ? 'zebra' : \"\"}`} style={style} ref={(el) => this.container = el}>\n                </div>\n              </div>\n              {this.pagination ? <ifx-pagination total={this.allRowData.length} current-page={this.currentPage} items-per-page='[{\"value\":\"ten\",\"label\":\"10\",\"selected\":true}, {\"value\":\"Twenty\",\"label\":\"20\",\"selected\":false}, {\"value\":\"Thirty\",\"label\":\"30\",\"selected\":false}]'></ifx-pagination> : null}\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n\n\n  hasButtonCol(): boolean {\n    return this.getColData().some(column => column.field === 'button');\n  }\n\n  onDragOver(event) {\n    var dragSupported = event.dataTransfer.length;\n\n    if (dragSupported) {\n      event.dataTransfer.dropEffect = 'move';\n    }\n\n    event.preventDefault();\n  }\n\n  onDrop(event) {\n    var jsonData = event.dataTransfer.getData('application/json');\n\n    var eJsonRow = document.createElement('div');\n    eJsonRow.classList.add('json-row');\n    eJsonRow.innerText = jsonData;\n\n    var eJsonDisplay = document.querySelector('#eJsonDisplay');\n\n    eJsonDisplay.appendChild(eJsonRow);\n    event.preventDefault();\n  }\n\n}\n"],"mappings":"iNAGaA,EAKX,IAAAC,CAAKC,GACHC,KAAKC,aAAaF,E,CAGpB,MAAAG,GACE,OAAOF,KAAKG,I,CAGd,OAAAC,CAAQL,GACNC,KAAKK,aAAaN,GAClB,OAAO,I,CAGD,YAAAE,CAAaF,GACnB,MAAMO,EAASP,EAAOQ,KAAKC,OAC3B,MAAMC,EAAUV,EAAOW,OAAOC,oBAAsB,GAEpDX,KAAKG,KAAOS,SAASC,cAAc,OACnCb,KAAKc,QAAUF,SAASC,cAAc,cAEtC,GAAIb,KAAKe,gBAAgBT,GAAS,CAChCN,KAAKgB,oBAAoBV,GACzBN,KAAKG,KAAKc,YAAYjB,KAAKc,SAC3Bd,KAAKkB,oBAAoBT,EAASV,E,KAC7B,CACLC,KAAKG,KAAKgB,UAAY,SAASb,U,EAI3B,YAAAD,CAAaN,GACnB,MAAMO,EAASP,EAAOQ,KAAKC,OAC3B,MAAMC,EAAUV,EAAOW,OAAOC,oBAAsB,GAEpD,GAAIX,KAAKe,gBAAgBT,GAAS,CAChCN,KAAKgB,oBAAoBV,GACzBN,KAAKoB,sBACLpB,KAAKkB,oBAAoBT,EAASV,E,KAC7B,CACLC,KAAKG,KAAKgB,UAAY,SAASb,U,EAI3B,mBAAAU,CAAoBV,GAC1BN,KAAKc,QAAQO,aAAa,WAAYf,EAAOgB,SAASC,YACtDvB,KAAKc,QAAQO,aAAa,UAAWf,EAAOkB,SAC5CxB,KAAKc,QAAQO,aAAa,QAASf,EAAOmB,OAC1CzB,KAAKc,QAAQO,aAAa,OAAQf,EAAOoB,MACzC1B,KAAKc,QAAQO,aAAa,OAAQf,EAAOqB,MACzC3B,KAAKc,QAAQO,aAAa,aAAcf,EAAOsB,UAAUL,YACzDvB,KAAKc,QAAQO,aAAa,SAAUf,EAAOuB,QAC3C7B,KAAKc,QAAQO,aAAa,OAAQf,EAAOwB,MACzC9B,KAAKc,QAAQiB,YAAczB,EAAO0B,I,CAG5B,mBAAAd,CAAoBT,EAAcV,GACxCC,KAAKiC,cAAiBC,IACpB,GAAIzB,EAAQ0B,cAAe,CACzB1B,EAAQ0B,cAAcpC,EAAQmC,E,GAGlClC,KAAKc,QAAQsB,iBAAiB,QAASpC,KAAKiC,c,CAGtC,mBAAAb,GACN,GAAIpB,KAAKiC,cAAe,CACtBjC,KAAKc,QAAQuB,oBAAoB,QAASrC,KAAKiC,c,EAI3C,eAAAlB,CAAgBT,GACtB,OAAOA,GAAUA,EAAO0B,OAAS,IAAM1B,EAAOkB,UAAY,IAAMlB,EAAOqB,OAAS,IAAMrB,EAAOoB,OAAS,E,QC5E7FY,EAGX,IAAAxC,CAAKC,GACHC,KAAKG,KAAOS,SAASC,cAAc,OACnCb,KAAKG,KAAKgB,UAAY,8FAETpB,EAAOwC,mD,CAKtB,MAAArC,GACE,OAAOF,KAAKG,I,CAGd,OAAAC,CAAQoC,GACN,OAAO,K,QCjBEC,EAGX,IAAA3C,CAAK0C,GACHxC,KAAKG,KAAOS,SAASC,cAAc,OACnCb,KAAKG,KAAKgB,UAAY,8G,CAKxB,MAAAjB,GACE,OAAOF,KAAKG,I,CAGd,OAAAC,CAAQoC,GACN,OAAO,K,ECjBX,MAAME,EAAW,8+kOACjB,MAAAC,EAAeD,E,MCeFE,EAAK,MALlB,WAAAC,CAAAC,G,UAQW9C,KAAA+C,YAAsB,EAItB/C,KAAAgD,QAAiB,GACjBhD,KAAAiD,QAAiB,GACjBjD,KAAAkD,cAA6C,GAC7ClD,KAAAmD,eAAiB,GAE1BnD,KAAAoD,WAAoB,GACZpD,KAAAqD,UAAoB,UACpBrD,KAAAsD,YAAsB,OACtBtD,KAAAuD,WAAsB,KACtBvD,KAAAwD,mBAA6B,GAC7BxD,KAAAyD,kBAA4B,UAC3BzD,KAAA0D,mBAA8B,KAC9B1D,KAAA2D,qBAA+B,EAChC3D,KAAAwB,QAAkB,UAElBxB,KAAA4D,YAAuB,MAG/B5D,KAAA6D,gBAAyB,E,CAGzB,gBAAAC,CAAiB5B,GACf,MAAM6B,KAAEA,EAAIC,iBAAEA,EAAgBC,kBAAEA,GAAsB/B,EAAMgC,OAC5D,GAAGF,GAAoBC,EAAmB,CAExC,MAAME,EAAcC,OAAAC,OAAA,GAAQrE,KAAKmD,gBAEjC,GAAIa,EAAiBM,SAAW,EAAG,QAE1BH,EAAeJ,GAGtB,MAAMQ,EAAc,IAAIC,YAAY,yBAA0B,CAAEN,OAAQ,CAAEO,WAAYV,GAAQW,QAAS,KAAMC,SAAU,OACvH3E,KAAK4E,KAAKC,cAAcN,E,KACnB,CAELJ,EAAeJ,GAAMe,aAAed,EAAiBe,KAAIC,GAAaA,EAAUC,O,CAIlFjF,KAAKmD,eAAiBgB,EAGtBnE,KAAKoD,WAAapD,KAAKkF,gBAAgBlF,KAAK6D,gBAAiB7D,KAAKmD,gBAClEnD,KAAKmF,iB,EAKT,8BAAAC,GACGpF,KAAKiD,QAAUjD,KAAKqF,aACrB,GAAIrF,KAAKsF,QAAS,CAChBtF,KAAKsF,QAAQC,cAAcvF,KAAKiD,Q,EAIpC,oBAAAuC,GACExF,KAAK0D,oBAAsB1D,KAAK0D,kB,CAGlC,mBAAA+B,GACE,MAAMhF,EAAU,GAChB,IAAK,IAAIiF,KAAO1F,KAAKiD,QAAS,CAC5BxC,EAAQiF,EAAIC,OAAS,IAAI,IAAIC,IAAI5F,KAAKgD,QAAQ+B,KAAIc,GAAOA,EAAIH,EAAIC,U,CAEnE3F,KAAKkD,cAAgBzC,C,CAGvB,yBAAAqF,CAA0B5D,GACxB,MAAM6D,EAAe7D,EAAMgC,OAC3B,MAAMC,EAAiB,GAEvB4B,EAAaC,SAAQC,IACnB,MAAMxB,EAAawB,EAAYC,gBAC/B,IAAIpB,EACJ,IAAIpD,EAEJ,GAAIuE,EAAYE,eAAiBF,EAAYE,cAAc7B,OAAS,EAAG,CACrEQ,EAAemB,EAAYE,cAAcpB,KAAIqB,GAAQA,EAAKC,QAC1D3E,EAAO,c,MACF,GAAIuE,EAAYhB,MAAO,CAC5BH,EAAe,CAACmB,EAAYhB,OAC5BvD,EAAO,M,KACF,CACLoD,EAAe,E,CAGjB,KAAMA,EAAaR,SAAW,GAAMQ,EAAaR,SAAW,GAAK5C,IAAS,QAAUoD,EAAa,KAAO,IAAM,CAC5GX,EAAeM,GAAc,CAAEK,eAAcpD,O,KAIjD1B,KAAKoD,WAAapD,KAAKkF,gBAAgBlF,KAAK6D,gBAAiBM,GAC7DnE,KAAKmF,kBACLnF,KAAKmD,eAAiBgB,C,CAIxB,wBAAAmC,CAAyBpE,GACvB,MAAMqE,EAAUrE,EAAMgC,OAGtBlE,KAAKmD,eAAiB,GAGtBoD,EAAQP,SAAQQ,IACd,MAAM/B,EAAa+B,EAAO/B,WAC1B,IAAIK,EAEJ,IAAIpD,EAAO8E,EAAO9E,KAElB,GAAIA,IAAS,OAAQ,CAEnBoD,EAAe0B,EAAO1B,Y,KACjB,CAELA,EAAe0B,EAAO1B,aAAaC,KAAIqB,GAAQA,EAAKC,O,CAItD,KAAMvB,EAAaR,SAAW,GAAMQ,EAAaR,SAAW,GAAK5C,IAAS,QAAUoD,EAAa,KAAO,IAAM,CAE5G9E,KAAKmD,eAAesB,GAAc,CAAEK,eAAcpD,O,KAMtD1B,KAAKoD,WAAapD,KAAKkF,gBAAgBlF,KAAK6D,gBAAiB7D,KAAKmD,gBAGlEnD,KAAKmF,iB,CAIP,eAAAD,CAAgB3E,EAAMgG,GACpB,OAAOhG,EAAKiG,QAAOX,IACjB,IAAK,MAAMpB,KAAc8B,EAAS,CAChC,MAAME,EAAaF,EAAQ9B,GAC3B,IAAIiC,GAAkBD,EAAW3B,cAAgB,IAAIC,KAAIE,IACvD,UAAWA,IAAU,SAAU,CAC7B,OAAOA,EAAM0B,a,MACR,UAAW1B,IAAU,iBAAmBA,IAAU,UAAW,CAClE,OAAOA,EAAM1D,U,CAEf,MAAO,EAAE,IAIX,GAAIkF,EAAW/E,OAAS,OAAQ,CAC9B,IAAIkF,EAAoB,MACxB,IAAK,IAAIC,KAAYhB,EAAK,CACxB,GAAIA,EAAIiB,eAAeD,GAAW,CAChC,IAAIE,EAAWlB,EAAIgB,IAAa,KAAOG,OAAOnB,EAAIgB,IAAWF,cAAgB,GAC7E,GAAID,EAAeO,MAAKC,GAAeH,EAASI,WAAWD,KAAe,CACxEN,EAAoB,KACpB,K,GAIN,IAAKA,EAAmB,OAAO,K,MAG5B,GAAIH,EAAW/E,OAAS,eAAgB,CAC3C,IAAIqF,EAAWlB,EAAIpB,IAAe,KAAOuC,OAAOnB,EAAIpB,IAAakC,cAAgB,GAEjF,IAAIS,EAAoBV,EAAeW,SAAS,aAChD,IAAKX,EAAeW,SAASN,MAAeK,GAAqBL,IAAa,IAAK,CACjF,OAAO,K,GAIb,OAAO,IAAI,G,CAMf,eAAA5B,GAEE,MAAMmC,GAActH,KAAK+C,YAAc,GAAK/C,KAAKwD,mBACjD,MAAM+D,EAAWD,EAAatH,KAAKwD,mBACnC,MAAMgE,EAAiBxH,KAAKoD,WAAWqE,MAAMH,EAAYC,GAGzDvH,KAAKgD,QAAUwE,EACfxH,KAAKsF,QAAQoC,cAAc,UAAW1H,KAAKgD,SAG3ChD,KAAK2D,qBAAuB3D,KAAKoD,WAAWkB,M,CAI9C,eAAAqD,GACE3H,KAAKmD,eAAiB,GACtBnD,KAAKoD,WAAa,IAAIpD,KAAK6D,gB,CAK7B,qBAAM+D,GACJ5H,KAAKsF,QAAQuC,oB,CAGf,iBAAAC,GACE,IAAIC,EAAuB/H,KAAK4E,MAAO,CACrC,MAAMoD,EAAYC,IAClBC,EAAe,YAAaF,E,CAE9BhI,KAAKmI,UAAY,UAAUC,KAAKC,MAAMD,KAAKE,SAAW,OAEtDtI,KAAKgD,QAAUhD,KAAKuI,aACpBvI,KAAKiD,QAAUjD,KAAKqF,aACpBrF,KAAKyF,sBAELzF,KAAKwI,YAAc,CAEjBnF,UAAWrD,KAAKqD,YAAc,UAAY,GAAK,GAC/CoF,aAAc,GACdC,cAAe,CACbC,UAAW,MAEbC,8BAA+B,KAC/BC,wBAAyB,KACzBC,oBAAqB9I,KAAK8I,oBAAoBC,KAAK/I,MACnDgJ,WAAYhJ,KAAKiD,QACjBD,QAAShD,KAAKgD,QACdiG,wBAAyBxG,EACzByG,uBAAwB5G,EACxB6G,6BAA8B,CAC5B5G,kBAAmB,IACjB,iBAEJ6G,MAAO,CACLC,cAAe,oDACfC,eAAgB,sDAChBC,WAAY,mGAEdC,eAAgBxJ,KAAKiD,QAAQgE,MAAKvB,GAAOA,EAAI+D,YAAc,OAAQ,KAAO,MAC1EC,YAAa1J,KAAKiD,QAAQgE,MAAKvB,GAAOA,EAAI+D,YAAc,OAAQ,KAAO,M,CAK3E,kBAAAE,GACE,GAAI3J,KAAKsF,QAAS,CAChBtF,KAAKsF,QAAQoC,cAAc,aAAc1H,KAAKiD,Q,EAMlD,gBAAA2G,GACE,GAAI5J,KAAK6J,UAAW,CAClB7J,KAAKsF,QAAUwE,EAAW9J,KAAK6J,UAAW7J,KAAKwI,aAC/C,GAAIxI,KAAKsF,QAAS,CAChBtF,KAAKsF,QAAQyE,iBAAiB,CAC5BC,gBAAiB,MAEnBhK,KAAKsF,QAAQoC,cAAc,aAAc1H,KAAKiD,SAC9CjD,KAAKsF,QAAQoC,cAAc,UAAW1H,KAAKgD,SAE3C,GAAIhD,KAAKuD,WAAY,CACnB,MAAM0G,EAAoBjK,KAAK4E,KAAKsF,WAAWC,cAAc,kBAC7D,GAAIF,EAAmB,CACrBA,EAAkB7H,iBAAiB,gBAAiBpC,KAAKoK,iBAAiBrB,KAAK/I,M,EAGnF,MAAMqK,EAAwBrK,KAAK4E,KAAK0F,iBAAiB,yBAEzDD,EAAsBrE,SAAQuE,IAC5BA,EAAqBnI,iBAAiB,yBAA0BpC,KAAK8F,0BAA0BiD,KAAK/I,MAAM,IAE5G,MAAMwK,EAAuBxK,KAAK4E,KAAK0F,iBAAiB,kBAExDE,EAAqBxE,SAAQyE,IAC3BA,EAAoBrI,iBAAiB,wBAAyBpC,KAAKsG,yBAAyByC,KAAK/I,MAAM,G,GAM/G,oBAAA0K,GACE,GAAI1K,KAAKuD,WAAY,CACnB,MAAM0G,EAAoBjK,KAAK4E,KAAKsF,WAAWC,cAAc,kBAC7D,GAAIF,EAAmB,CACrBA,EAAkB5H,oBAAoB,gBAAiBrC,KAAKoK,iBAAiBrB,KAAK/I,M,EAGtF,MAAM2K,EAAiB3K,KAAK4E,KAAKsF,WAAWI,iBAAiB,yBAE7DK,EAAe3E,SAAQ4E,IACrBA,EAAcvI,oBAAoB,yBAA0BrC,KAAK8F,0BAA0BiD,KAAK/I,MAAM,IAExG,MAAM6K,EAAgB7K,KAAK4E,KAAKsF,WAAWI,iBAAiB,yBAE5DO,EAAc7E,SAAQ8E,IACpBA,EAAazI,oBAAoB,wBAAyBrC,KAAKsG,yBAAyByC,KAAK/I,MAAM,G,CAIvG,gBAAAoK,CAAiBlI,GACflC,KAAK+C,YAAcb,EAAMgC,OAAOnB,YAChC,MAAMuE,GAActH,KAAK+C,YAAc,GAAK/C,KAAKwD,mBACjD,MAAM+D,EAAWD,EAAatH,KAAKwD,mBACnC,MAAMgE,EAAiBxH,KAAKoD,WAAWqE,MAAMH,EAAYC,GAEzD,GAAIvH,KAAKsF,QAAS,CAChBtF,KAAKsF,QAAQoC,cAAc,UAAWF,E,EAI1C,eAAAuD,CAAgBC,GACd,IACEC,KAAKC,MAAMF,GACX,OAAO,I,CACP,MAAOG,GACP,OAAO,K,EAKX,UAAA5C,GACE,IAAI6C,EAAc,GAClB,GAAIpL,KAAKoL,OAASC,WAAarL,KAAKoL,OAAS,KAAM,CACjD,OAAOA,C,CAGT,GAAIpL,KAAK+K,gBAAgB/K,KAAKoL,MAAO,CACnCA,EAAO,IAAIH,KAAKC,MAAMlL,KAAKoL,M,MAExB,GAAIE,MAAMC,QAAQvL,KAAKoL,cAAgBpL,KAAKoL,OAAS,SAAU,CACjEA,EAAO,IAAIpL,KAAKoL,K,KAEd,CACHI,QAAQC,MAAM,8BAA+BzL,KAAKoL,K,CAGpDpL,KAAKoD,WAAagI,EAClBpL,KAAK6D,gBAAkB,IAAIuH,GAC3BpL,KAAK2D,qBAAuB3D,KAAKoD,WAAWkB,OAE5C,OAAO8G,EAAK3D,MAAM,EAAGzH,KAAKwD,mB,CAI5B,UAAA6B,GACE,IAAIqG,EAAc,GAClB,GAAI1L,KAAK0L,OAASL,WAAarL,KAAK0L,OAAS,KAAM,CACjD,OAAOA,C,CAGT,GAAI1L,KAAK+K,gBAAgB/K,KAAK0L,MAAO,CACnCA,EAAO,IAAIT,KAAKC,MAAMlL,KAAK0L,M,MACtB,GAAIJ,MAAMC,QAAQvL,KAAK0L,cAAgB1L,KAAK0L,OAAS,SAAU,CACpEA,EAAO,IAAI1L,KAAK0L,K,KACX,CACLF,QAAQC,MAAM,8BAA+BzL,KAAK0L,K,CAGpD,MAAMC,EAAeD,EAAKE,MAAKC,GAAUA,EAAOlG,QAAU,WAC1D,GAAIgG,EAAc,CAChBA,EAAaG,aAAejM,EAC5B8L,EAAaI,eAAiBhM,GAAUA,EAAOkF,MAAMjD,KAGrD,GAAIhC,KAAKgM,8BAAgChM,KAAKgM,wBAA0B,SAAU,CAChF,GAAIhM,KAAKgM,sBAAsB7J,cAAe,CAC5CwJ,EAAahL,mBAAqB,CAChCwB,cAAenC,KAAKgM,sBAAsB7J,c,GAMlD,OAAOuJ,C,CAIT,mBAAA5C,CAAoB/I,GAClBA,EAAOkM,IAAIlC,kB,CAGb,sBAAAmC,GACE,MAAMC,EAAa,IAAI3H,YAAY,uBAAwB,CAAEE,QAAS,KAAMC,SAAU,OACtFyH,OAAOvH,cAAcsH,GAErBnM,KAAK2H,kBACL3H,KAAKmF,iB,CAIP,oBAAAkH,GACE,GAAIrM,KAAKuD,WAAY,CACnB,MAAM0G,EAAoBjK,KAAK4E,KAAKsF,WAAWC,cAAc,kBAC7D,GAAIF,EAAmB,CACrBA,EAAkB5H,oBAAoB,gBAAiBrC,KAAKoK,iB,EAIhE,MAAMkC,EAActM,KAAK4E,KAAKsF,WAAWC,cAAc,yBACvD,GAAImC,EAAa,CACfA,EAAYjK,oBAAoB,QAASrC,KAAKkM,uBAAuBnD,KAAK/I,M,EAM9E,kBAAAuM,GACE,OAAOC,EACLxM,KAAKsD,cAAgB,QAAU,qCAC/B,gB,CAKJ,MAAAmJ,GACE,IAAIC,EAAQ,GACZ,GAAI1M,KAAKsD,cAAgB,OAAQ,CAC/BoJ,EAAQ,CACNC,OAAU3M,KAAKsD,Y,CAGnB,MAAMsJ,EAAc5M,KAAKyD,oBAAsB,SAAW,gBAAkB,iBAC5E,OACEoJ,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,2CAAKC,MAAM,mBACRhN,KAAKyD,oBAAsB,WAC1BoJ,EAAA,OAAAE,IAAA,2CAAKC,MAAM,eACTH,EAAA,cAAAE,IAAA,2CACErL,KAAK,SACLJ,SAAU,MACVE,QAAQ,YACRG,KAAK,IACLE,OAAO,SACPJ,MAAM,UAAS,aACJ,QACXwL,QAAS,IAAMjN,KAAKwF,wBAEpBqH,EAAA,YAAAE,IAAA,2CAAUG,KAAK,aAAuBlN,KAAK0D,mBAAqB,eAAiB,iBAKvFmJ,EAAA,OAAAE,IAAA,2CAAKC,MAAOJ,GACT5M,KAAKyD,oBAAsB,WAAazD,KAAK0D,oBAC5CmJ,EAAA,OAAAE,IAAA,2CAAKC,MAAM,qBACTH,EAAA,OAAAE,IAAA,2CAAKC,MAAM,2BACTH,EAAA,QAAAE,IAAA,2CAAMC,MAAM,iBAAe,YAE7BH,EAAA,OAAAE,IAAA,2CAAKC,MAAM,+BACPhN,KAAKyD,oBAAsB,WAAazD,KAAK0D,qBAC7CmJ,EAAA,QAAAE,IAAA,2CAAMhJ,KAAK,qBAMlB/D,KAAKyD,oBAAsB,QAAUzD,KAAKyD,oBAAsB,WAC/DoJ,EAAA,OAAAE,IAAA,2CAAKC,MAAM,8BACPhN,KAAKyD,oBAAsB,WAAazD,KAAK0D,qBAC7CmJ,EAAA,QAAAE,IAAA,2CAAMhJ,KAAK,mBAKjB8I,EAAA,OAAAE,IAAA,2CAAKC,MAAM,4BACTH,EAAA,OAAAE,IAAA,2CAAKC,MAAM,gBACRhN,KAAKyD,oBAAsB,QAAUzD,KAAKyD,oBAAsB,UAAYzD,KAAK0D,oBAChFU,OAAO+I,KAAKnN,KAAKmD,gBAAgB4B,KAAIhB,IACnC,MAAMyC,EAASxG,KAAKmD,eAAeY,GACnC,MAAMe,EAAe0B,EAAO1B,aAC5B,MAAMsI,EAAgB5G,EAAO9E,OAAS,OAEtC,OAAOoD,EAAaR,OAAS,EAC3BuI,EAAA,YACEQ,YAAatJ,EACbpC,KAAK,QACLH,QAAS4L,EAAgB,QAAU,SACnCE,SAAU,KACVrI,MAAOH,EACPiI,IAAKhJ,GAEJe,EAAaC,KAAImC,GAChB2F,EAAA,iBAAe5H,MAAOiC,EAAaqG,SAAU,KAAMR,IAAK7F,GACrDA,MAIL,IAAI,IAIXlH,KAAKyD,oBAAsB,QAAUzD,KAAKyD,oBAAsB,WAAazD,KAAK0D,oBAAsBU,OAAO+I,KAAKnN,KAAKmD,gBAAgBmB,OAAS,GACjJuI,EAAA,cAAAE,IAAA,2CAAYrL,KAAK,SAASJ,SAAU,MAAOE,QAAQ,WAAWG,KAAK,IAAIE,OAAO,SAASJ,MAAM,UAAS,aAAY,QAAQwL,QAAS,IAAMjN,KAAKkM,0BAE5IW,EAAA,YAAAE,IAAA,2CAAUG,KAAK,yBAAkC,cAKtDlN,KAAKyD,oBAAsB,QAC1BoJ,EAAA,OAAAE,IAAA,2CAAKC,MAAM,8BACTH,EAAA,QAAAE,IAAA,2CAAMC,MAAM,0BACThN,KAAK2D,sBAERkJ,EAAA,QAAAE,IAAA,2CAAMC,MAAM,yBAAuB,qBAMvCH,EAAA,OAAAE,IAAA,2CAAKS,GAAG,gBAAgBR,MAAOhN,KAAKuM,sBAClCM,EAAA,OAAAE,IAAA,2CAAKS,GAAI,YAAYxN,KAAKmI,YAAa6E,MAAO,eAAehN,KAAKwB,UAAY,QAAU,QAAU,KAAMkL,MAAOA,EAAOe,IAAMC,GAAO1N,KAAK6J,UAAY6D,KAGrJ1N,KAAKuD,WAAasJ,EAAA,kBAAgBc,MAAO3N,KAAKoD,WAAWkB,OAAM,eAAgBtE,KAAK+C,YAAW,iBAAiB,uJAAyK,Q,CAStS,YAAA6K,GACE,OAAO5N,KAAKqF,aAAa4B,MAAK4E,GAAUA,EAAOlG,QAAU,U,CAG3D,UAAAkI,CAAW3L,GACT,IAAI4L,EAAgB5L,EAAM6L,aAAazJ,OAEvC,GAAIwJ,EAAe,CACjB5L,EAAM6L,aAAaC,WAAa,M,CAGlC9L,EAAM+L,gB,CAGR,MAAAC,CAAOhM,GACL,IAAIiM,EAAWjM,EAAM6L,aAAaK,QAAQ,oBAE1C,IAAIC,EAAWzN,SAASC,cAAc,OACtCwN,EAASC,UAAUC,IAAI,YACvBF,EAASG,UAAYL,EAErB,IAAIM,EAAe7N,SAASuJ,cAAc,iBAE1CsE,EAAaxN,YAAYoN,GACzBnM,EAAM+L,gB","ignoreList":[]}

package/dist/infineon-design-system-stencil/p-2a4642d0.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["textareaCss","IfxTextareaStyle0","TextArea","constructor","hostRef","this","inputId","textareaId","disabled","error","readOnly","resize","wrap","fullWidth","reset","resetTextarea","handleComponentWidth","textareaWrapper","el","shadowRoot","querySelector","isFullWidth","toLowerCase","classList","add","contains","remove","componentDidRender","formResetCallback","internals","setFormValue","handleOnInput","e","value","target","ifxInput","emit","setValidity","componentWillLoad","isNestedInIfxComponent","framework","detectFramework","trackComponent","render","h","Host","key","class","htmlFor","_a","label","trim","id","style","name","cols","rows","maxlength","readonly","placeholder","onInput","_b","caption"],"sources":["src/components/textarea/textarea.scss?tag=ifx-textarea&encapsulation=shadow","src/components/textarea/textarea.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n    display: flex;\n    flex-direction: column;\n    width: 100%;\n}\n\n.wrapper__label {\n    color: tokens.$ifxColorBaseBlack;\n    font: tokens.$ifxBodyBody03;\n}\n:host(.wrapper--disabled) .wrapper__label {\n    color: tokens.$ifxColorEngineering500;\n}\n\n.wrapper__textarea {\n    width: 100%;\n    &.fullWidth { \n        width: 100%;\n        & textarea { \n            width: 100%;\n            box-sizing: border-box; \n        }\n    }\n}\n\n.wrapper__textarea textarea {\n    border: 1px solid tokens.$ifxColorEngineering400;\n    border-radius: tokens.$ifxSpace12;\n    padding: tokens.$ifxSpace100 tokens.$ifxSpace200;\n    \n    background-color: tokens.$ifxColorBaseWhite;\n    color: tokens.$ifxColorBaseBlack;\n    font: tokens.$ifxBodyBody03;\n    \n    transition: all 100ms ease;\n    transition-property: border-color;\n\n    &:hover {\n        border: 1px solid tokens.$ifxColorEngineering500;\n    }\n    \n    &:focus-within {\n        outline: none;\n        border: 1px solid tokens.$ifxColorOcean500;\n    }\n}\n\n:host(.wrapper--error) .wrapper__textarea textarea {\n    border: 1px solid tokens.$ifxColorRed500;\n}\n:host(.wrapper--disabled) .wrapper__textarea textarea {\n    border: 1px solid tokens.$ifxColorEngineering500;\n\n    background-color: tokens.$ifxColorEngineering200;\n}\n\n.wrapper__caption {\n    color: tokens.$ifxColorBaseBlack;\n    font: tokens.$ifxBodyBody05;\n}\n:host(.wrapper--error) .wrapper__caption {\n    color: tokens.$ifxColorRed500;\n}\n:host(.wrapper--disabled) .wrapper__caption {\n    color: tokens.$ifxColorEngineering500;\n}","import { h, AttachInternals, Component, Event, EventEmitter, Host, Method, Prop, Element } from \"@stencil/core\"\nimport { trackComponent } from '../../global/utils/tracking'; \nimport { isNestedInIfxComponent } from '../../global/utils/dom-utils';\nimport { detectFramework } from '../../global/utils/framework-detection';\n\n@Component({\n\tformAssociated: true,\n\tshadow: true,\n\tstyleUrl: 'textarea.scss',\n\ttag: 'ifx-textarea'\n})\n\nexport class TextArea {\n\n\tprivate inputId: string = `ifx-textarea-${++textareaId}`;\n\n\t@AttachInternals() internals: ElementInternals;\n\n\t@Event() ifxInput: EventEmitter<String>;\n\t@Element() el;\n\t@Prop() caption: string;\n\t@Prop() cols: number;\n\t@Prop() disabled: boolean = false;\n\t@Prop() error: boolean = false;\n\t@Prop() label: string;\n\t@Prop() maxlength: number;\n\t@Prop() name: string;\n\t@Prop() placeholder: string;\n\t@Prop() readOnly: boolean = false;\n\t@Prop() resize: 'both' | 'horizontal' | 'vertical' | 'none' = 'both';\n\t@Prop() rows: number;\n\t@Prop({ mutable: true }) value: string;\n\t@Prop() wrap: 'hard' | 'soft' | 'off' = 'soft';\n\t@Prop({ reflect: true }) fullWidth: string = \"false\";\n\n\t@Method()\n\tasync reset() {\n\t\tthis.resetTextarea();\n\t}\n\n\thandleComponentWidth() {\n\t\tconst textareaWrapper = this.el.shadowRoot.querySelector('.wrapper__textarea')\n\t\tconst isFullWidth = this.fullWidth.toLowerCase() === \"true\";\n\t\t\n    if (isFullWidth) {\n\t\t\ttextareaWrapper.classList.add('fullWidth')\n    } else if(textareaWrapper.classList.contains('fullWidth')) {\n\t\t\ttextareaWrapper.classList.remove('fullWidth');\n    }\n  }\n\n\tcomponentDidRender() {\n    this.handleComponentWidth()\n  }\n\t\n\tformResetCallback(): void {\n\t\tthis.resetTextarea();\n\t\tthis.internals.setFormValue(\"\");\n\t}\n\t\n\thandleOnInput(e: InputEvent): void {\n\t\tthis.value = (e.target as HTMLTextAreaElement).value;\n\t\tthis.internals.setFormValue(this.value);\n\t\tthis.ifxInput.emit(this.value);\n\t}\n\n\tresetTextarea() {\n\t\tthis.value = '';\n\t\tthis.internals.setValidity({});\n\t\tthis.internals.setFormValue('');\n\t}\n\n\tcomponentWillLoad() {\n\t\tif(!isNestedInIfxComponent(this.el)) { \n\t\t\tconst framework = detectFramework();\n\t\t\ttrackComponent('ifx-textarea', framework)\n\t\t}\n\t\tthis.internals.setFormValue(this.value);\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={`wrapper--${this.error ? 'error' : ''} wrapper--${this.disabled ? 'disabled': ''}`}>\n\t\t\t\t<label class='wrapper__label' htmlFor={ this.inputId }>\n\t\t\t\t\t{ this.label?.trim() }\n\t\t\t\t</label>\n\n\t\t\t\t<div class='wrapper__textarea'>\n\t\t\t\t\t<textarea\n\t\t\t\t\t\taria-label='a textarea'\n\t\t\t\t\t\taria-value={ this.value }\n\t\t\t\t\t\taria-disabled={ this.disabled }\n\t\t\t\t\t\tid={ this.inputId }\n\t\t\t\t\t\tstyle={ {resize: this.resize} }\n\t\t\t\t\t\tname={ this.name ? this.name : this.inputId}\n\t\t\t\t\t\tcols={ this.cols }\n\t\t\t\t\t\trows={ this.rows }\n\t\t\t\t\t\tmaxlength={ this.maxlength }\n\t\t\t\t\t\twrap={ this.wrap }\n\t\t\t\t\t\tdisabled={ this.disabled }\n\t\t\t\t\t\treadonly={ this.readOnly }\n\t\t\t\t\t\tplaceholder={ this.placeholder }\n\t\t\t\t\t\tvalue={ this.value }\n\t\t\t\t\t\tonInput={ (e) => this.handleOnInput(e) }\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\n\t\t\t\t{ this.caption?.trim() && (\n\t\t\t\t\t<div class='wrapper__caption'>\n\t\t\t\t\t\t{ this.caption.trim() }\n\t\t\t\t\t</div> \n\t\t\t\t)}\n\t\t\t</Host>\n\t\t);\n\t}\n}\n\nlet textareaId = 0;"],"mappings":"0IAAA,MAAMA,EAAc,glCACpB,MAAAC,EAAeD,E,MCWFE,EAAQ,MAPrB,WAAAC,CAAAC,G,6MASSC,KAAAC,QAAkB,kBAAkBC,IAQpCF,KAAAG,SAAoB,MACpBH,KAAAI,MAAiB,MAKjBJ,KAAAK,SAAoB,MACpBL,KAAAM,OAAsD,OAGtDN,KAAAO,KAAgC,OACfP,KAAAQ,UAAoB,O,CAG7C,WAAMC,GACLT,KAAKU,e,CAGN,oBAAAC,GACC,MAAMC,EAAkBZ,KAAKa,GAAGC,WAAWC,cAAc,sBACzD,MAAMC,EAAchB,KAAKQ,UAAUS,gBAAkB,OAEnD,GAAID,EAAa,CAClBJ,EAAgBM,UAAUC,IAAI,Y,MACtB,GAAGP,EAAgBM,UAAUE,SAAS,aAAc,CAC5DR,EAAgBM,UAAUG,OAAO,Y,EAInC,kBAAAC,GACGtB,KAAKW,sB,CAGR,iBAAAY,GACCvB,KAAKU,gBACLV,KAAKwB,UAAUC,aAAa,G,CAG7B,aAAAC,CAAcC,GACb3B,KAAK4B,MAASD,EAAEE,OAA+BD,MAC/C5B,KAAKwB,UAAUC,aAAazB,KAAK4B,OACjC5B,KAAK8B,SAASC,KAAK/B,KAAK4B,M,CAGzB,aAAAlB,GACCV,KAAK4B,MAAQ,GACb5B,KAAKwB,UAAUQ,YAAY,IAC3BhC,KAAKwB,UAAUC,aAAa,G,CAG7B,iBAAAQ,GACC,IAAIC,EAAuBlC,KAAKa,IAAK,CACpC,MAAMsB,EAAYC,IAClBC,EAAe,eAAgBF,E,CAEhCnC,KAAKwB,UAAUC,aAAazB,KAAK4B,M,CAGlC,MAAAU,G,QACC,OACCC,EAACC,EAAI,CAAAC,IAAA,2CAACC,MAAO,YAAY1C,KAAKI,MAAQ,QAAU,eAAeJ,KAAKG,SAAW,WAAY,MAC1FoC,EAAA,SAAAE,IAAA,2CAAOC,MAAM,iBAAiBC,QAAU3C,KAAKC,UAC1C2C,EAAA5C,KAAK6C,SAAK,MAAAD,SAAA,SAAAA,EAAEE,QAGfP,EAAA,OAAAE,IAAA,2CAAKC,MAAM,qBACVH,EAAA,YAAAE,IAAA,wDACY,aAAY,aACVzC,KAAK4B,MAAK,gBACP5B,KAAKG,SACrB4C,GAAK/C,KAAKC,QACV+C,MAAQ,CAAC1C,OAAQN,KAAKM,QACtB2C,KAAOjD,KAAKiD,KAAOjD,KAAKiD,KAAOjD,KAAKC,QACpCiD,KAAOlD,KAAKkD,KACZC,KAAOnD,KAAKmD,KACZC,UAAYpD,KAAKoD,UACjB7C,KAAOP,KAAKO,KACZJ,SAAWH,KAAKG,SAChBkD,SAAWrD,KAAKK,SAChBiD,YAActD,KAAKsD,YACnB1B,MAAQ5B,KAAK4B,MACb2B,QAAW5B,GAAM3B,KAAK0B,cAAcC,QAIpC6B,EAAAxD,KAAKyD,WAAO,MAAAD,SAAA,SAAAA,EAAEV,SACfP,EAAA,OAAAE,IAAA,2CAAKC,MAAM,oBACR1C,KAAKyD,QAAQX,Q,mEAQrB,IAAI5C,EAAa,E","ignoreList":[]}

package/dist/infineon-design-system-stencil/p-2b6fa7ea.entry.js

@@ -1,2 +0,0 @@
-import{r as t,h as e,g as i,c as r}from"./p-b7a462e5.js";import{d as n,t as o}from"./p-e8504e6b.js";import{i as s}from"./p-1ecafb97.js";import{c as a}from"./p-5cdc6210.js";const p=":host{display:inline-block}.spinner{position:relative;width:40px;height:40px}.spinner.s{width:24px;height:24px}.border{box-sizing:border-box;position:absolute;width:100%;height:100%;border:4px solid transparent;border-top-color:#0A8276;border-left-color:#0A8276;border-right-color:#0A8276;border-top-left-radius:1px;border-top-right-radius:1px;border-radius:50%;animation:spin 2s linear infinite}.border.inverted{border-top-color:#FFFFFF;border-left-color:#FFFFFF;border-right-color:#FFFFFF}.semiconductor{width:100%;height:100%;animation:spin 2s linear infinite}.semiconductor svg{fill:#0A8276}.semiconductor.inverted svg{fill:#FFFFFF}.semiconductor.s svg{width:24px;height:24px}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}";const l=p;const c=class{constructor(e){t(this,e);this.inverted=false}componentWillLoad(){if(!s(this.el)){const t=n();o("ifx-spinner",t)}}render(){return e("div",{key:"d1308117223db979d7a4caf123bf0d1c017d3df2","aria-label":"spinner indicating a loading process",class:this.getClassNames()},e("div",{key:"890097f80a403f78cfdbad8d6393dbc8f994b1b3",class:`${this.variant!=="brand"?"border":""} ${this.inverted?"inverted":""}`}),this.variant==="brand"&&e("div",{key:"63d937d775e2071ab21c454aa2baf9609e06b372",class:`semiconductor ${this.inverted?"inverted":""} ${this.getSizeClass()}`},e("svg",{key:"2c28fb566992ed63ed10e7c2bb85a973e2217a21",width:"40",height:"40",viewBox:"0 0 40 40",fill:"none",xmlns:"http://www.w3.org/2000/svg"},e("g",{key:"bbca58748ad55d2040e4e7311205e5c010dcf719",id:"spinner/conductor"},e("path",{key:"88a524bfea6a5ea585ef9b3c9bcf715252a98f49",id:"Vector",d:"M38.75 18.75C39.4375 18.75 40 19.3125 40 20C40 20.6875 39.4409 21.25 38.75 21.25H35V26.25H38.75C39.4375 26.25 40 26.8125 40 27.5C40 28.1875 39.4409 28.75 38.75 28.75H35V30C35 32.7617 32.7617 35 30 35H28.75V38.75C28.75 39.4409 28.1875 40 27.5 40C26.8125 40 26.25 39.4409 26.25 38.75V35H21.25V38.75C21.25 39.4409 20.6875 40 20 40C19.3125 40 18.75 39.4409 18.75 38.75V35H13.75V38.75C13.75 39.4409 13.1875 40 12.5 40C11.8125 40 11.25 39.4409 11.25 38.75V35H10C7.23828 35 5 32.7617 5 30V28.75H1.25C0.559062 28.75 0 28.1875 0 27.5C0 26.8125 0.559062 26.25 1.25 26.25H5V21.25H1.25C0.559062 21.25 0 20.6875 0 20C0 19.3125 0.559062 18.75 1.25 18.75H5V13.75H1.25C0.559062 13.75 0 13.1875 0 12.5C0 11.8125 0.559062 11.25 1.25 11.25H5V10C5 7.23828 7.23828 5 10 5H11.25V1.25C11.25 0.5625 11.8125 0 12.5 0C13.1875 0 13.75 0.559063 13.75 1.25V5H18.75V1.25C18.75 0.559063 19.3091 0 20 0C20.6909 0 21.25 0.559063 21.25 1.25V5H26.25V1.25C26.25 0.559063 26.8091 0 27.5 0C28.1909 0 28.75 0.559063 28.75 1.25V5H30C32.7617 5 35 7.23828 35 10V11.25H38.75C39.4409 11.25 40 11.8091 40 12.5C40 13.1909 39.4409 13.75 38.75 13.75H35V18.75H38.75ZM32.5 10C32.5 8.62188 31.3781 7.5 30 7.5H10C8.62187 7.5 7.5 8.62188 7.5 10V30C7.5 31.3781 8.62187 32.5 10 32.5H30C31.3781 32.5 32.5 31.3781 32.5 30V10Z"})))))}getSizeClass(){return`${this.size}`==="s"?"s":""}getClassNames(){return a("spinner",this.size&&`spinner ${this.getSizeClass()}`)}get el(){return i(this)}};c.style=l;const d=':root{--ifx-font-family:"Source Sans 3", "Arial, sans-serif"}:host{display:flex}.textInput__container{display:flex;flex-direction:column;align-items:flex-start;padding:0px;width:100%;flex:none;order:0;align-self:stretch;flex-grow:0;font-family:var(--ifx-font-family)}.textInput__container.disabled .textInput__top-wrapper label{color:#575352}.textInput__container.disabled .textInput__bottom-wrapper input{border:1px solid #575352;background-color:#EEEDED}.textInput__container.disabled .textInput__bottom-wrapper input::placeholder{font-size:0.875rem;color:#575352}.textInput__container .textInput__top-wrapper{display:flex;flex-direction:row;align-items:flex-start;padding:0px;gap:4px;flex:none;order:0;align-self:stretch;flex-grow:0}.textInput__container .textInput__top-wrapper label{font-style:normal;font-weight:400;font-size:1rem;line-height:1.5rem;display:flex;align-items:center;color:#1D1D1D;flex:none;order:0;flex-grow:0}.textInput__container .textInput__top-wrapper label .optional-required{margin-left:4px}.textInput__container .textInput__top-wrapper label .optional{margin-left:4px}.textInput__container .textInput__top-wrapper label .required{margin-left:4px}.textInput__container .textInput__top-wrapper label .required.error{color:#CD002F}.textInput__container .input-container{position:relative;display:flex;align-items:center;width:100%}.textInput__container .textInput__bottom-wrapper{flex-grow:1;position:relative;display:flex;flex-direction:column;align-items:flex-start;padding:0px;gap:4px;flex:none;order:1;align-self:stretch;flex-grow:0}.textInput__container .textInput__bottom-wrapper input{width:100%;box-sizing:border-box;display:flex;flex-direction:row;align-items:center;padding:8px 16px;gap:8px;height:40px;background-color:#FFFFFF;color:#1D1D1D;font-family:var(--ifx-font-family);font-size:1rem;line-height:1.5rem;border:1px solid #8D8786;border-radius:1px;flex:none;order:0;align-self:stretch;flex-grow:0;text-overflow:ellipsis}.textInput__container .textInput__bottom-wrapper input.input-s{height:36px;font-size:0.875rem;line-height:1.25rem}.textInput__container .textInput__bottom-wrapper input.input-s::placeholder{font-size:0.875rem;line-height:1.25rem}.textInput__container .textInput__bottom-wrapper input.icon{padding-left:40px}.textInput__container .textInput__bottom-wrapper input.error{border:1px solid #CD002F}.textInput__container .textInput__bottom-wrapper input.error:focus{outline:none}.textInput__container .textInput__bottom-wrapper input.success{border:1px solid #4CA460}.textInput__container .textInput__bottom-wrapper input.success:focus{outline:none}.textInput__container .textInput__bottom-wrapper input:focus:not(.error,.success){outline:none;border:1px solid #0A8276}.textInput__container .textInput__bottom-wrapper input:hover:not(:disabled,:focus,.error,.success){border:1px solid #575352}.textInput__container .textInput__bottom-wrapper input::placeholder{font-style:normal;font-weight:400;font-size:1rem;line-height:1.5rem;color:#8D8786;flex:none;order:1;flex-grow:1}.textInput__container .textInput__bottom-wrapper .input-icon{position:absolute;top:50%;transform:translateY(-50%);left:16px;transition:0.3s;color:#8D8786}.textInput__container .textInput__bottom-wrapper .textInput__bottom-wrapper-caption{font-style:normal;font-weight:400;font-size:0.75rem;line-height:1rem;letter-spacing:0.2px;color:#1D1D1D;flex:none;order:1;align-self:stretch;flex-grow:0}.textInput__container .textInput__bottom-wrapper .textInput__bottom-wrapper-caption.error{color:#CD002F}.textInput__container .textInput__bottom-wrapper .textInput__bottom-wrapper-caption.disabled{color:#575352}.textInput__container .delete-icon{position:absolute;right:16px}.textInput__container .delete-icon :hover{cursor:pointer}';const f=d;const h=class{constructor(e){t(this,e);this.ifxInput=r(this,"ifxInput",7);if(e.$hostElement$["s-ei"]){this.internals=e.$hostElement$["s-ei"]}else{this.internals=e.$hostElement$.attachInternals();e.$hostElement$["s-ei"]=this.internals}this.placeholder="Placeholder";this.value="";this.error=false;this.label="";this.icon="";this.caption="";this.size="m";this.required=false;this.optional=false;this.success=false;this.disabled=false;this.showDeleteIcon=false;this.autocomplete="on";this.type="text";this.internalId="text-field"}valueWatcher(t){if(t!==this.inputElement.value){this.inputElement.value=t}}async reset(){this.value="";this.inputElement.value=""}handleDeleteContent(){this.reset();this.ifxInput.emit(this.value)}handleInput(){const t=this.inputElement.value;this.value=t;this.internals.setFormValue(t);this.ifxInput.emit(this.value)}handleTypeProp(){this.internalType=this.type==="text"||this.type==="password"?this.type:"text"}formResetCallback(){this.internals.setValidity({});this.internals.setFormValue("")}componentWillLoad(){if(!s(this.el)){const t=n();o("ifx-text-field",t)}this.handleTypeProp()}render(){return e("div",{key:"21151d737a91ff22b989db308da0e61660a36b45","aria-label":"a text field for user input","aria-value":this.value,"aria-disabled":this.disabled,class:`textInput__container ${this.disabled?"disabled":""}`},e("div",{key:"f7344422e6e242335955313810090034b2a2fca3",class:"textInput__top-wrapper"},e("label",{key:"10666f37b96b09057740b2672bb84faa8111ef6b",htmlFor:this.internalId},e("slot",{key:"c0b5335bcef3faaf59be3a7f3335579b4e912046"}),this.optional&&this.required?e("span",{class:"optional-required"},"(optional) *"):this.optional?e("span",{class:"optional"},"(optional)"):this.required?e("span",{class:`required ${this.error?"error":""}`},"*"):null)),e("div",{key:"ce1a93f45efae7b97b82760603ee12db0145039d",class:"textInput__bottom-wrapper"},e("div",{key:"d4a783a646a18ff4bf285503e8814bec4380f167",class:"input-container"},this.icon&&e("ifx-icon",{key:"57d065166763bdc54ffd1ea0ac8866de43543b6a",class:"input-icon",icon:this.icon}),e("input",{key:"de16ad0dbc0b55b1b129cc933c801ae1eaf23d3d",ref:t=>this.inputElement=t,disabled:this.disabled,autocomplete:this.autocomplete,type:this.internalType,id:this.internalId,value:this.value,onInput:()=>this.handleInput(),placeholder:this.placeholder,maxlength:this.maxlength,class:`${this.icon?"icon":""}\n                ${this.error?"error":""} \n              ${this.size==="s"?"input-s":""}\n              ${this.success?"success":""}`}),this.showDeleteIcon&&this.value&&e("ifx-icon",{key:"b21c3ff10ebcdb1feca9fd1f02b3a09f50727d99",class:"delete-icon",icon:"cRemove16",onClick:()=>this.handleDeleteContent()})),this.caption&&!this.error&&e("div",{key:"44d7d1c60b268fc2c71514e21544f702fc6ec2b6",class:`textInput__bottom-wrapper-caption ${this.disabled} ? disabled : ""`},this.caption),this.error&&e("div",{key:"a09e9cd9ec401ead9e9fde5b3ef113c87125a58b",class:"textInput__bottom-wrapper-caption error"},this.caption)))}static get formAssociated(){return true}get el(){return i(this)}static get watchers(){return{value:["valueWatcher"]}}};h.style=f;export{c as ifx_spinner,h as ifx_text_field};
-//# sourceMappingURL=p-2b6fa7ea.entry.js.map

package/dist/infineon-design-system-stencil/p-2b6fa7ea.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["spinnerCss","IfxSpinnerStyle0","Spinner","constructor","hostRef","this","inverted","componentWillLoad","isNestedInIfxComponent","el","framework","detectFramework","trackComponent","render","h","key","class","getClassNames","variant","getSizeClass","width","height","viewBox","fill","xmlns","id","d","size","classNames","textFieldCss","IfxTextFieldStyle0","TextField","placeholder","value","error","label","icon","caption","required","optional","success","disabled","showDeleteIcon","autocomplete","type","internalId","valueWatcher","newValue","inputElement","reset","handleDeleteContent","ifxInput","emit","handleInput","query","internals","setFormValue","handleTypeProp","internalType","formResetCallback","setValidity","htmlFor","ref","onInput","maxlength","onClick"],"sources":["src/components/spinner/spinner.scss?tag=ifx-spinner&encapsulation=shadow","src/components/spinner/spinner.tsx","src/components/text-field/text-field.scss?tag=ifx-text-field&encapsulation=shadow","src/components/text-field/text-field.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n\n:host {\n  display: inline-block;\n\n}\n\n.spinner {\n  position: relative;\n  width: tokens.$ifxSize500;\n  height: tokens.$ifxSize500;\n\n}\n\n.spinner.s {\n  width: tokens.$ifxSize300;\n  height: tokens.$ifxSize300;\n}\n\n.border {\n  box-sizing: border-box;\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  border: 4px solid transparent;\n  border-top-color: tokens.$ifxColorOcean500;\n  border-left-color: tokens.$ifxColorOcean500;\n  border-right-color: tokens.$ifxColorOcean500;\n  border-top-left-radius: 1px;\n  border-top-right-radius: 1px;\n  border-radius: 50%;\n  animation: spin 2s linear infinite;\n\n  &.inverted {\n    border-top-color: tokens.$ifxColorBaseWhite;\n    border-left-color: tokens.$ifxColorBaseWhite;\n    border-right-color: tokens.$ifxColorBaseWhite;\n  }\n}\n\n.semiconductor {\n  width: 100%;\n  height: 100%;\n  animation: spin 2s linear infinite;\n\n  & svg {\n    fill: tokens.$ifxColorOcean500;\n  }\n\n  &.inverted {\n    & svg {\n      fill: tokens.$ifxColorBaseWhite;\n    }\n  }\n\n  &.s {\n    & svg {\n      width: tokens.$ifxSize300;\n      height: tokens.$ifxSize300;\n    }\n  }\n}\n\n\n@keyframes spin {\n  0% {\n    transform: rotate(0deg);\n  }\n\n  100% {\n    transform: rotate(360deg);\n  }\n}","import { Component, h, Prop, Element } from '@stencil/core';\nimport { trackComponent } from '../../global/utils/tracking';\nimport { isNestedInIfxComponent } from '../../global/utils/dom-utils';\nimport { detectFramework } from '../../global/utils/framework-detection';\nimport classNames from 'classnames';\n \n@Component({\n  tag: 'ifx-spinner',\n  styleUrl: 'spinner.scss',\n  shadow: true,\n})\nexport class Spinner {\n  @Element() el;\n  @Prop() size: string;\n  @Prop() variant: string;\n  @Prop() inverted: boolean = false;\n\n  componentWillLoad() { \n    if(!isNestedInIfxComponent(this.el)) { \n      const framework = detectFramework();\n      trackComponent('ifx-spinner', framework)\n    }\n  }\n\n  render() {\n    return (\n      <div aria-label=\"spinner indicating a loading process\" class={this.getClassNames()}>\n        <div class={`${this.variant !== 'brand' ? 'border' : \"\"} ${this.inverted ? 'inverted' : \"\"}`}></div>\n        {this.variant === 'brand'\n          && <div class={`semiconductor ${this.inverted ? 'inverted' : \"\"} ${this.getSizeClass()}`}>\n            <svg width='40' height='40' viewBox=\"0 0 40 40\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n              <g id=\"spinner/conductor\">\n                <path id=\"Vector\" d=\"M38.75 18.75C39.4375 18.75 40 19.3125 40 20C40 20.6875 39.4409 21.25 38.75 21.25H35V26.25H38.75C39.4375 26.25 40 26.8125 40 27.5C40 28.1875 39.4409 28.75 38.75 28.75H35V30C35 32.7617 32.7617 35 30 35H28.75V38.75C28.75 39.4409 28.1875 40 27.5 40C26.8125 40 26.25 39.4409 26.25 38.75V35H21.25V38.75C21.25 39.4409 20.6875 40 20 40C19.3125 40 18.75 39.4409 18.75 38.75V35H13.75V38.75C13.75 39.4409 13.1875 40 12.5 40C11.8125 40 11.25 39.4409 11.25 38.75V35H10C7.23828 35 5 32.7617 5 30V28.75H1.25C0.559062 28.75 0 28.1875 0 27.5C0 26.8125 0.559062 26.25 1.25 26.25H5V21.25H1.25C0.559062 21.25 0 20.6875 0 20C0 19.3125 0.559062 18.75 1.25 18.75H5V13.75H1.25C0.559062 13.75 0 13.1875 0 12.5C0 11.8125 0.559062 11.25 1.25 11.25H5V10C5 7.23828 7.23828 5 10 5H11.25V1.25C11.25 0.5625 11.8125 0 12.5 0C13.1875 0 13.75 0.559063 13.75 1.25V5H18.75V1.25C18.75 0.559063 19.3091 0 20 0C20.6909 0 21.25 0.559063 21.25 1.25V5H26.25V1.25C26.25 0.559063 26.8091 0 27.5 0C28.1909 0 28.75 0.559063 28.75 1.25V5H30C32.7617 5 35 7.23828 35 10V11.25H38.75C39.4409 11.25 40 11.8091 40 12.5C40 13.1909 39.4409 13.75 38.75 13.75H35V18.75H38.75ZM32.5 10C32.5 8.62188 31.3781 7.5 30 7.5H10C8.62187 7.5 7.5 8.62188 7.5 10V30C7.5 31.3781 8.62187 32.5 10 32.5H30C31.3781 32.5 32.5 31.3781 32.5 30V10Z\" />\n              </g>\n            </svg>\n          </div>}\n      </div>\n    );\n  }\n\n  getSizeClass() {\n    return `${this.size}` === \"s\"\n      ? \"s\"\n      : \"\";\n  }\n\n  getClassNames() {\n    return classNames(\n      'spinner',\n      this.size && `spinner ${this.getSizeClass()}`\n    );\n  }\n}\n","@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n  display: flex;\n}\n\n.textInput__container {\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  padding: 0px;\n  width: 100%;\n  flex: none;\n  order: 0;\n  align-self: stretch;\n  flex-grow: 0;\n  font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\n\n\n\n\n  &.disabled {\n    & .textInput__top-wrapper {\n      & label {\n        color: tokens.$ifxColorEngineering500;\n      }\n    }\n\n    & .textInput__bottom-wrapper {\n      input {\n        border: 1px solid tokens.$ifxColorEngineering500;\n        background-color: tokens.$ifxColorEngineering200;\n\n        &::placeholder {\n          font-size: tokens.$ifxFontSizeS;\n          color: tokens.$ifxColorEngineering500;\n        }\n      }\n    }\n  }\n\n  & .textInput__top-wrapper {\n    display: flex;\n    flex-direction: row;\n    align-items: flex-start;\n    padding: 0px;\n    gap: 4px;\n    flex: none;\n    order: 0;\n    align-self: stretch;\n    flex-grow: 0;\n\n    & label {\n      font-style: normal;\n      font-weight: 400;\n      font-size: tokens.$ifxFontSizeM;\n      line-height: tokens.$ifxLineHeightM;\n      display: flex;\n      align-items: center;\n      color: tokens.$ifxColorBaseBlack;\n      flex: none;\n      order: 0;\n      flex-grow: 0;\n\n      & .optional-required {\n        margin-left: 4px;\n      }\n\n      & .optional {\n        margin-left: 4px;\n      }\n\n      & .required {\n        margin-left: 4px;\n        \n        &.error {\n          color: #CD002F;\n        }\n      }\n    }\n  }\n\n  .input-container {\n    position: relative;\n    display: flex;\n    align-items: center;\n    width: 100%;\n  }\n\n\n  & .textInput__bottom-wrapper {\n    flex-grow: 1;\n    position: relative;\n    display: flex;\n    flex-direction: column;\n    align-items: flex-start;\n    padding: 0px;\n    gap: 4px;\n    flex: none;\n    order: 1;\n    align-self: stretch;\n    flex-grow: 0;\n\n    & input {\n      width: 100%;\n      box-sizing: border-box;\n      display: flex;\n      flex-direction: row;\n      align-items: center;\n      padding: tokens.$ifxSpace100 tokens.$ifxSpace200;\n      gap: tokens.$ifxSpace100;\n      height: tokens.$ifxSize500;\n      background-color: tokens.$ifxColorBaseWhite;\n      color: tokens.$ifxColorBaseBlack;\n      font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\n\n\n      font-size: tokens.$ifxFontSizeM;\n      line-height: tokens.$ifxLineHeightM;\n      border: 1px solid tokens.$ifxColorEngineering400;\n      border-radius: tokens.$ifxBorderRadius12;\n      flex: none;\n      order: 0;\n      align-self: stretch;\n      flex-grow: 0;\n      text-overflow: ellipsis;\n\n      &.input-s {\n        height: tokens.$ifxSize450;\n        font-size: tokens.$ifxFontSizeS;\n        line-height: tokens.$ifxLineHeightS;\n\n        &::placeholder {\n          font-size: tokens.$ifxFontSizeS;\n          line-height: tokens.$ifxLineHeightS;\n        }\n\n      }\n\n      &.icon {\n        padding-left: tokens.$ifxSpace500;\n      }\n\n      &.error {\n        border: 1px solid #CD002F;\n\n        &:focus {\n          outline: none;\n        }\n      }\n\n      &.success {\n        border: 1px solid #4CA460;\n\n        &:focus {\n          outline: none;\n        }\n      }\n\n\n      &:focus:not(.error, .success) {\n        outline: none;\n        border: 1px solid tokens.$ifxColorOcean500;\n      }\n\n      &:hover:not(:disabled, :focus, .error, .success) {\n        border: 1px solid tokens.$ifxColorEngineering500;\n      }\n\n      &::placeholder {\n        font-style: normal;\n        font-weight: 400;\n        font-size: tokens.$ifxFontSizeM;\n        line-height: tokens.$ifxLineHeightM;\n        color: #8D8786;\n        flex: none;\n        order: 1;\n        flex-grow: 1;\n      }\n    }\n\n    & .input-icon {\n      // Position the icon within the icon container\n      // Adjust the positioning as needed\n      position: absolute;\n      top: 50%;\n      transform: translateY(-50%);\n      left: tokens.$ifxSpace200;\n      /* Adjust this value to control the icon's left offset */\n      transition: .3s;\n      color: tokens.$ifxColorEngineering400;\n    }\n\n    & .textInput__bottom-wrapper-caption {\n      font-style: normal;\n      font-weight: 400;\n      font-size: tokens.$ifxFontSizeXs;\n      line-height: tokens.$ifxLineHeightXs;\n      letter-spacing: 0.2px;\n      color: tokens.$ifxColorBaseBlack;\n      flex: none;\n      order: 1;\n      align-self: stretch;\n      flex-grow: 0;\n\n      &.error {\n        color: #CD002F;\n\n      }\n\n      &.disabled {\n        color: tokens.$ifxColorEngineering500;\n      }\n    }\n\n    \n  }\n  .delete-icon {\n    position: absolute;\n    right: tokens.$ifxSpace200;\n\n    :hover {\n      cursor: pointer;\n    }\n  }\n}","import { Component, h, Event, Element, Prop, EventEmitter, Watch, Method, AttachInternals, State } from '@stencil/core';\nimport { trackComponent } from '../../global/utils/tracking'; \nimport { isNestedInIfxComponent } from '../../global/utils/dom-utils';\nimport { detectFramework } from '../../global/utils/framework-detection';\n\n@Component({\n  tag: 'ifx-text-field',\n  styleUrl: 'text-field.scss',\n  shadow: true,\n  formAssociated: true\n})\n\nexport class TextField {\n  private inputElement: HTMLInputElement;\n  @Element() el;\n  @Prop() placeholder: string = \"Placeholder\"\n  @Prop({ mutable: true }) value: string = '';\n  @Prop() error: boolean = false;\n  @Prop() label: string = \"\";\n  @Prop() icon: string = \"\";\n  @Prop() caption: string = \"\";\n  @Prop() size: string = 'm';\n  @Prop() required: boolean = false;\n  @Prop() optional: boolean = false;\n  @Prop() success: boolean = false;\n  @Prop() disabled: boolean = false;\n  @Prop() maxlength?: number;\n  @Prop() showDeleteIcon: boolean = false;\n  @Prop() autocomplete: string = 'on'\n  @Prop() type: 'text' | 'password' = 'text';\n  @Prop() internalId: string = \"text-field\"\n  @State() internalType: string;\n  @Event() ifxInput: EventEmitter<String>;\n  // @Prop({ reflect: true })\n  // resetOnSubmit: boolean = false;\n\n  @AttachInternals() internals: ElementInternals;\n\n\n  @Watch('value')\n  valueWatcher(newValue: string) {\n    if (newValue !== this.inputElement.value) {\n      this.inputElement.value = newValue;\n    }\n  }\n\n  @Method()\n  async reset() {\n    this.value = '';\n    this.inputElement.value = '';\n  }\n\n  handleDeleteContent() {\n    this.reset();\n    this.ifxInput.emit(this.value);\n  }\n\n  handleInput() {\n    const query = this.inputElement.value;\n    this.value = query; // update the value property when input changes\n    this.internals.setFormValue(query) // update form value\n    this.ifxInput.emit(this.value);\n  }\n\n  handleTypeProp() { \n   this.internalType = this.type === 'text' || this.type === 'password' ? this.type : 'text'\n  }\n\n  formResetCallback() {\n    this.internals.setValidity({});\n    this.internals.setFormValue(\"\");\n  }\n\n  componentWillLoad() { \n    if(!isNestedInIfxComponent(this.el)) { \n      const framework = detectFramework();\n      trackComponent('ifx-text-field', framework)\n    }\n    this.handleTypeProp()\n  }\n\n  render() {\n    return (\n      <div aria-label=\"a text field for user input\" aria-value={this.value} aria-disabled={this.disabled} class={`textInput__container ${this.disabled ? 'disabled' : \"\"}`}>\n        <div class=\"textInput__top-wrapper\">\n          <label htmlFor={this.internalId}>\n            <slot></slot>\n            {this.optional && this.required ? (\n              <span class=\"optional-required\">(optional) *</span>\n            ) : this.optional ? (\n              <span class=\"optional\">(optional)</span>\n            ) : this.required ? (\n              <span class={`required ${this.error ? 'error' : \"\"}`}>*</span>\n            ) : null}\n          </label>\n        </div>\n\n        <div class=\"textInput__bottom-wrapper\">\n          <div class=\"input-container\">\n            {this.icon && (\n              <ifx-icon class='input-icon' icon={this.icon} />\n            )}\n            <input\n              ref={(el) => (this.inputElement = el)}\n              disabled={this.disabled}\n              autocomplete={this.autocomplete}\n              type={this.internalType}\n              id={this.internalId}\n              value={this.value}\n              onInput={() => this.handleInput()}\n              placeholder={this.placeholder}\n              maxlength={this.maxlength}\n              class={\n                `${this.icon ? 'icon' : \"\"}\n                ${this.error ? 'error' : \"\"} \n              ${this.size === \"s\" ? \"input-s\" : \"\"}\n              ${this.success ? \"success\" : \"\"}`} />\n\n              { (this.showDeleteIcon && this.value) && (\n                <ifx-icon class=\"delete-icon\" icon=\"cRemove16\" onClick={() => this.handleDeleteContent()}></ifx-icon> \n              )}\n          </div>\n          {this.caption && !this.error &&\n            <div class={`textInput__bottom-wrapper-caption ${this.disabled} ? disabled : \"\"`}>\n              {this.caption}\n            </div>}\n          {this.error &&\n            <div class=\"textInput__bottom-wrapper-caption error\">\n              {this.caption}\n            </div>}\n        </div>\n      </div>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/infineon-design-system-stencil/p-40be6362.entry.js

@@ -1,2 +0,0 @@
-import{r as i,h as o,g as t,c as e}from"./p-b7a462e5.js";import{d as n,t as s}from"./p-e8504e6b.js";import{i as a}from"./p-1ecafb97.js";const c=':root{--ifx-font-family:"Source Sans 3", "Arial, sans-serif"}:host{display:block}.accordion-wrapper{display:flex;flex-direction:column;gap:8px;font-family:var(--ifx-font-family)}';const r=c;const d=class{constructor(o){i(this,o);this.autoCollapse=false}componentWillLoad(){if(!a(this.el)){const i=n();s("ifx-accordion",i)}}async onItemOpen(i){if(this.autoCollapse){const o=Array.from(this.el.querySelectorAll("ifx-accordion-item"));for(const t of o){const o=t;if(o!==i.target&&await o.open){o.open=false}}}}render(){return o("div",{key:"f705006a731cd359e397e9db09fde5d679c4e593",class:"accordion-wrapper"},o("slot",{key:"0438290bc18da78b662c264697174ccf4334fe61"}))}static get delegatesFocus(){return true}get el(){return t(this)}};d.style=r;const f=':root{--ifx-font-family:"Source Sans 3", "Arial, sans-serif"}.accordion-item{border-radius:3px;transition:all 0.3s;font-family:var(--ifx-font-family)}.accordion-title:focus{outline:none}.accordion-title:focus::after{content:"";display:block;position:absolute;top:-4px;bottom:-4px;left:-4px;right:-4px;border-radius:5px;border:2px solid #0A8276;box-sizing:border-box}.accordion-title:hover{border:1px solid #EEEDED;color:#08665C}.accordion-title{display:flex;align-items:center;position:relative;padding:12px 16px;gap:12px;color:#0A8276;background-color:#FFFFFF;border:1px solid #EEEDED;cursor:pointer;margin:4px}.accordion-caption{font-weight:600;font-size:1.125rem}.accordion-content{gap:8px;line-height:24px;font-size:1rem;font-weight:400}.inner-content{background-color:#FFFFFF;padding:24px;word-wrap:break-word;overflow-wrap:anywhere;align-self:stretch;}.accordion-icon{font-weight:bold;display:flex;transition:transform 0.3s}.accordion-icon:hover{color:#08665C}.accordion-item.open .accordion-icon{transform:rotate(-180deg)}';const l=f;const h=class{constructor(o){i(this,o);this.ifxOpen=e(this,"ifxOpen",7);this.ifxClose=e(this,"ifxClose",7);this.open=false;this.AriaLevel=3;this.internalOpen=false}componentWillLoad(){this.internalOpen=this.open}componentDidLoad(){this.openAccordionItem();this.contentEl=this.el.shadowRoot.querySelector("#accordion-content");if(this.contentEl){this.attachResizeObserver()}}componentDidUpdate(){this.openAccordionItem()}openChanged(i){this.internalOpen=i}toggleOpen(){this.internalOpen=!this.internalOpen;this.open=this.internalOpen;if(this.internalOpen){this.ifxOpen.emit({isOpen:this.internalOpen})}else{this.ifxClose.emit({isClosed:!this.internalOpen})}}openAccordionItem(){if(this.contentEl){if(this.internalOpen){this.contentEl.style.height="auto";const i=this.contentEl.scrollHeight;this.contentEl.style.height=`${i}px`;this.contentEl.style.overflow="visible"}else{this.contentEl.style.height="0";this.contentEl.style.overflow="hidden"}}}attachResizeObserver(){const i=this.el.shadowRoot.querySelector(".inner-content");if(i){this.resizeObserver=new ResizeObserver((()=>{if(this.internalOpen){this.openAccordionItem()}}));this.resizeObserver.observe(i)}}handleKeydown(i){const o=i.composedPath();if(!o.includes(this.titleEl)){return}switch(i.key){case"Enter":case" ":i.preventDefault();this.toggleOpen();break}}render(){return o("div",{key:"6f314f7ff18566be1de5fb8c169405df296ba346",class:`accordion-item ${this.internalOpen?"open":""}`},o("div",{key:"0c20697cd02a7af28f481c7104a6b100ad478081",role:"button","aria-expanded":this.internalOpen,"aria-controls":"accordion-content",class:"accordion-title",onClick:()=>this.toggleOpen(),tabindex:"0",ref:i=>this.titleEl=i},o("span",{key:"d41d3016e5f967f361dea497486673d786ba3d83","aria-hidden":"true",role:"heading","aria-level":String(this.AriaLevel),class:"accordion-icon"},o("ifx-icon",{key:"27308dfb2a2cd73303705521a41f706482cb8da3",icon:"chevron-down-16"})),o("span",{key:"c71749876b23310d9d9037552dcb4800f3b16d13",id:"accordion-caption",class:"accordion-caption"},this.caption)),o("div",{key:"23d3f2ee657ff35edd3d341e883aadb6d1858c79",id:"accordion-content",class:"accordion-content",ref:i=>this.contentEl=i,role:"region","aria-labelledby":"accordion-caption"},o("div",{key:"3716d880d2c26471e515ba60a0b1227758130a09",class:"inner-content"},o("slot",{key:"0ae80ac1d41934a1e3a84e3d3a8bdc97b5cf1e2c"}))))}get el(){return t(this)}static get watchers(){return{open:["openChanged"]}}};h.style=l;export{d as ifx_accordion,h as ifx_accordion_item};
-//# sourceMappingURL=p-40be6362.entry.js.map

package/dist/infineon-design-system-stencil/p-40be6362.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["accordionCss","IfxAccordionStyle0","Accordion","constructor","hostRef","this","autoCollapse","componentWillLoad","isNestedInIfxComponent","el","framework","detectFramework","trackComponent","onItemOpen","event","items","Array","from","querySelectorAll","item","itemElement","target","open","render","h","key","class","accordionItemCss","IfxAccordionItemStyle0","IfxAccordionItem","AriaLevel","internalOpen","componentDidLoad","openAccordionItem","contentEl","shadowRoot","querySelector","attachResizeObserver","componentDidUpdate","openChanged","newValue","toggleOpen","ifxOpen","emit","isOpen","ifxClose","isClosed","style","height","updatedHeight","scrollHeight","overflow","innerContentEl","resizeObserver","ResizeObserver","observe","handleKeydown","ev","path","composedPath","includes","titleEl","preventDefault","role","onClick","tabindex","ref","String","icon","id","caption"],"sources":["src/components/accordion/accordion.scss?tag=ifx-accordion&encapsulation=shadow","src/components/accordion/accordion.tsx","src/components/accordion/accordionItem.scss?tag=ifx-accordion-item&encapsulation=shadow","src/components/accordion/accordionItem.tsx"],"sourcesContent":["// ifxAccordion.scss\n@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n  display: block;\n}\n\n.accordion-wrapper {\n  display: flex;\n  flex-direction: column;\n  gap: tokens.$ifxSpace100;\n  font-family:  var(--ifx-font-family) // tokens.$ifxFontFamilyBody;\n}","import { Component, h, Listen, Element, Prop } from '@stencil/core';\nimport { trackComponent } from '../../global/utils/tracking';\nimport { isNestedInIfxComponent } from '../../global/utils/dom-utils';\nimport { detectFramework } from '../../global/utils/framework-detection';\n\n@Component({\n  tag: 'ifx-accordion',\n  styleUrl: 'accordion.scss',\n  shadow: { delegatesFocus: true },\n})\nexport class Accordion {\n  @Element() el: HTMLElement;\n  @Prop() autoCollapse: boolean = false;\n\n  componentWillLoad() { \n    if(!isNestedInIfxComponent(this.el)) { \n      const framework = detectFramework();\n      trackComponent('ifx-accordion', framework)\n    }\n  }\n\n  @Listen('ifxOpen')\n  async onItemOpen(event: CustomEvent) {\n    if (this.autoCollapse) {\n      const items = Array.from(this.el.querySelectorAll('ifx-accordion-item'));\n      for (const item of items) {\n        const itemElement = item as HTMLIfxAccordionItemElement;\n        if (itemElement !== event.target && (await itemElement.open)) {\n          itemElement.open = false;\n        }\n      }\n    }\n  }\n\n  render() {\n    return (\n      <div class=\"accordion-wrapper\">\n        <slot />\n      </div>\n    );\n  }\n}\n","// ifxAccordionItem.scss\n@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n\n.accordion-item {\n  border-radius: 3px;\n  transition: all 0.3s;\n  font-family: var(--ifx-font-family) // tokens.$ifxFontFamilyBody;\n\n}\n\n.accordion-title:focus {\n  outline: none;\n}\n\n// workaround to add corner radius to outline\n.accordion-title:focus::after {\n  content: '';\n  display: block;\n  position: absolute;\n  top: -4px;\n  bottom: -4px;\n  left: -4px;\n  right: -4px;\n  border-radius: 5px;\n  border: 2px solid tokens.$ifxColorOcean500;\n  box-sizing: border-box;\n}\n\n.accordion-title:hover {\n  border: 1px solid tokens.$ifxColorEngineering200;\n  color: tokens.$ifxColorOcean600;\n}\n\n.accordion-title {\n  display: flex;\n  align-items: center;\n  position: relative;\n  padding: tokens.$ifxSpace150 tokens.$ifxSpace200;\n  gap: tokens.$ifxSpace150;\n  color: tokens.$ifxColorOcean500;\n  background-color: tokens.$ifxColorBaseWhite;\n  border: 1px solid tokens.$ifxColorEngineering200;\n  cursor: pointer;\n  margin: 4px;\n}\n\n.accordion-caption {\n  font-weight: tokens.$ifxFontWeightSemibold;\n  font-size: tokens.$ifxFontSizeL;\n}\n\n.accordion-content {\n  gap: tokens.$ifxSpace100;\n  //transition: max-height 0.3s ease-in-out;\n  line-height: 24px;\n  font-size: tokens.$ifxFontSizeM;\n  font-weight: 400;\n}\n\n.inner-content {\n  background-color: tokens.$ifxColorBaseWhite;\n  padding: tokens.$ifxSpace300;\n  // white-space: pre-wrap;\n  /* wraps text at spaces and within words */\n  word-wrap: break-word;\n  /* breaks text within a word if necessary */\n  overflow-wrap: anywhere;\n  align-self: stretch;\n\n  /* breaks text at arbitrary points when needed */\n}\n\n.accordion-icon {\n  font-weight: bold;\n  display: flex;\n  transition: transform 0.3s;\n\n  &:hover {\n    color: tokens.$ifxColorOcean600;\n\n  }\n}\n\n\n\n.accordion-item.open .accordion-icon {\n  transform: rotate(-180deg);\n}","//ifxAccordionItem\nimport { Component, Prop, h, State, Event, EventEmitter, Watch, Listen, Element } from '@stencil/core';\n\n@Component({\n  tag: 'ifx-accordion-item',\n  styleUrl: 'accordionItem.scss',\n  shadow: true,\n})\nexport class IfxAccordionItem {\n  @Element() el;\n  @Prop() caption: string;\n  @Prop({\n    mutable: true,\n  }) open: boolean = false;\n  @Prop() AriaLevel = 3;\n  @State() internalOpen: boolean = false;\n  @Event() ifxOpen: EventEmitter;\n  @Event() ifxClose: EventEmitter;\n  private contentEl!: HTMLElement;\n  private titleEl!: HTMLElement;\n  private resizeObserver!: ResizeObserver;\n\n  componentWillLoad() {\n    this.internalOpen = this.open;\n  }\n\n  componentDidLoad() {\n    this.openAccordionItem()\n\n     this.contentEl = this.el.shadowRoot.querySelector('#accordion-content');\n      if (this.contentEl) {\n        this.attachResizeObserver();\n      }\n  }\n\n  componentDidUpdate() {\n    this.openAccordionItem()\n  }\n\n  @Watch('open')\n  openChanged(newValue: boolean) {\n    this.internalOpen = newValue;\n  }\n\n  toggleOpen() {\n    this.internalOpen = !this.internalOpen;\n    this.open = this.internalOpen;\n\n    if (this.internalOpen) {\n      this.ifxOpen.emit({ isOpen: this.internalOpen });\n    } else {\n      this.ifxClose.emit({ isClosed: !this.internalOpen });\n    }\n  }\n\n  openAccordionItem() {\n    if (this.contentEl) {\n      if (this.internalOpen) {\n      this.contentEl.style.height = 'auto'; \n      const updatedHeight = this.contentEl.scrollHeight; \n      this.contentEl.style.height = `${updatedHeight}px`; \n        this.contentEl.style.overflow = 'visible';\n      } else {\n        this.contentEl.style.height = '0';\n        this.contentEl.style.overflow = 'hidden';\n      }\n    }\n  }\n\n  attachResizeObserver() { \n    const innerContentEl = this.el.shadowRoot.querySelector('.inner-content');\n\n    if (innerContentEl) {\n      this.resizeObserver = new ResizeObserver(() => {\n        if (this.internalOpen) {\n          this.openAccordionItem();\n        }\n      });\n\n      this.resizeObserver.observe(innerContentEl); \n    }\n  }\n\n  @Listen('keydown')\n  handleKeydown(ev: KeyboardEvent) {\n    const path = ev.composedPath();\n\n    if(!path.includes(this.titleEl)) { \n      return;\n    }\n\n    switch (ev.key) {\n      case 'Enter': // fallthrough\n      case ' ': // space\n        ev.preventDefault();\n        this.toggleOpen();\n        break;\n    }\n  }\n\n\n  render() {\n    return (\n      <div class={`accordion-item ${this.internalOpen ? 'open' : ''}`}>\n        <div role=\"button\" aria-expanded={this.internalOpen} aria-controls=\"accordion-content\" class=\"accordion-title\" onClick={() => this.toggleOpen()} tabindex='0' ref={(el) => (this.titleEl = el as HTMLElement)}>\n          <span aria-hidden=\"true\" role=\"heading\" aria-level={String(this.AriaLevel) as string} class=\"accordion-icon\">\n            <ifx-icon icon=\"chevron-down-16\"/>\n          </span>\n          <span id=\"accordion-caption\" class=\"accordion-caption\">{this.caption}</span>\n        </div>\n        <div id=\"accordion-content\" class=\"accordion-content\" ref={(el) => (this.contentEl = el as HTMLElement)} role=\"region\" aria-labelledby=\"accordion-caption\">\n          <div class=\"inner-content\">\n            <slot />\n          </div>\n        </div>\n      </div>\n    );\n  }\n}"],"mappings":"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","ignoreList":[]}

package/dist/infineon-design-system-stencil/p-431d50b8.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["radioButtonCss","IfxRadioButtonStyle0","RadioButton","constructor","hostRef","this","disabled","error","size","internalChecked","hasSlot","componentWillLoad","isNestedInIfxComponent","el","framework","detectFramework","trackComponent","fallbackInput","document","createElement","type","hidden","className","style","cssText","setAttribute","tabIndex","appendChild","HTMLElement","prototype","internals","attachInternals","e","console","warn","checked","querySelector","innerHTML","trim","handleCheckedChange","newValue","updateFormValue","_a","setFormValue","value","name","errorChanged","oldValue","ifxError","emit","handleRadioButtonClick","event","stopPropagation","inputElement","click","ifxChange","changeEvent","CustomEvent","bubbles","composed","detail","dispatchEvent","handleKeyDown","ev","includes","key","preventDefault","PointerEvent","handleExternalChange","target","tagName","toLowerCase","getAttribute","render","h","role","String","class","onClick","tabindex","ref"],"sources":["src/components/radio-button/radio-button.scss?tag=ifx-radio-button&encapsulation=shadow","src/components/radio-button/radio-button.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n    display: inline-flex;\n    --_ifx-fallback-display: none !important;\n}\n\n._ifx-radiobutton-fallback {\n    display: var(--_ifx-fallback-display);\n    position: absolute !important;\n    width: 1px !important;\n    height: 1px !important;\n    padding: 0 !important;\n    margin: -1px !important;\n    overflow: hidden !important;\n    clip: rect(0,0,0,0) !important;\n    border: 0 !important;\n  }\n\n.radioButton__container {\n    box-sizing: border-box;\n    display: inline-flex;\n    flex-direction: row;\n    align-items: center;\n    padding: 0px;\n    gap: tokens.$ifxSpace100;\n    cursor: pointer;\n    font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\n\n\n\n    &.m .radioButton__wrapper {\n        width: tokens.$ifxSize300;\n        height: tokens.$ifxSize300;\n    }\n\n    .radioButton__wrapper {\n        width: tokens.$ifxSize250;\n        height: tokens.$ifxSize250;\n        position: relative;\n        display: block;\n        border-radius: 50%;\n        background-color: tokens.$ifxColorBaseWhite;\n        border: 1px solid #575352;\n\n        &:focus {\n            outline: none;\n\n            &::before {\n                content: '';\n                position: absolute;\n                width: calc(100% + 4px);\n                height: calc(100% + 4px);\n                top: 50%;\n                left: 50%;\n                transform: translate(-50%, -50%);\n                border: 2px solid tokens.$ifxColorOcean500;\n                border-radius: 50%;\n            }\n        }\n\n        .radioButton__wrapper-mark {\n            position: absolute;\n            top: 50%;\n            left: 50%;\n            transform: translate(-50%, -50%);\n            background-color: #0A8276;\n            border-radius: 50%;\n            display: flex;\n            justify-content: center;\n            align-items: center;\n            border-color: tokens.$ifxColorBaseTransparent;\n        }\n\n        &:hover {\n            background-color: tokens.$ifxColorEngineering200;\n        }\n\n        &.disabled {\n            background-color: #BFBBBB;\n            border-color: #BFBBBB;\n\n            &.error {\n\n                &:hover,\n                &:focus-visible {\n                    border-color: #CD002F;\n                }\n            }\n        }\n\n        &.checked {\n            border-color: #0A8276;\n\n            &::after {\n                content: \"\";\n                position: absolute;\n                top: 50%;\n                left: 50%;\n                transform: translate(-50%, -50%);\n                width: 10px;\n                height: 10px;\n                background-color: #0A8276;\n                border-radius: 50%;\n            }\n\n            &.disabled::after {\n                background-color: #BFBBBB;\n            }\n\n\n            &:hover {\n                border-color: tokens.$ifxColorOcean600;\n\n                & .radioButton__wrapper-mark {\n                    background-color: tokens.$ifxColorOcean600;\n                }\n            }\n\n            &.disabled {\n                background-color: tokens.$ifxColorBaseWhite;\n                border-color: #BFBBBB;\n\n                &.disabled::after {\n                    background-color: #BFBBBB;\n                }\n\n                & .radioButton__wrapper-mark {\n                    background-color: #BFBBBB;\n                }\n            }\n            &.error::after {\n                border-color: #CD002F;\n                background-color: #CD002F;\n            }\n        }\n\n        &.error:not(.disabled) {\n            border-color: #CD002F;\n\n            &:hover,\n            &:focus-visible {\n                border-color: #CD002F;\n            }\n        }\n    }\n\n    .label {\n        display: flex;\n        align-items: center;\n        height: tokens.$ifxSize250;\n        font-style: normal;\n        font-weight: 400;\n        font-size: tokens.$ifxFontSizeS;\n        line-height: tokens.$ifxLineHeightS;\n        color: tokens.$ifxColorBaseBlack;\n        flex: none;\n        order: 1;\n        flex-grow: 0;\n\n        &.label-m {\n            height: tokens.$ifxSize300;\n            font-size: tokens.$ifxFontSizeM;\n            line-height: tokens.$ifxLineHeightM;\n        }\n\n        &.disabled {\n            color: #BFBBBB;\n        }\n\n\n\n        &:hover {\n            cursor: pointer;\n        }\n    }\n}\n\n","import { Component, h, Prop, Element, State, Event, EventEmitter, Listen, Watch } from '@stencil/core';\nimport { trackComponent } from '../../global/utils/tracking';\nimport { isNestedInIfxComponent } from '../../global/utils/dom-utils';\nimport { detectFramework } from '../../global/utils/framework-detection';\n\n@Component({\n  tag: 'ifx-radio-button',\n  styleUrl: 'radio-button.scss',\n  shadow: true,\n  formAssociated: true\n})\nexport class RadioButton {\n  @Element() el: HTMLElement;\n  @Prop() disabled: boolean = false;\n  @Prop() value: string;\n  @Prop() error: boolean = false;\n  @Prop({ reflect: true }) size: \"s\" | \"m\" = \"s\";\n  @Prop({ reflect: true }) name: string;\n  @Prop({ mutable: true }) checked: boolean;\n  @State() internalChecked: boolean = false;\n  @State() hasSlot: boolean = false;\n\n  private inputElement: HTMLInputElement;\n  private internals: ElementInternals;\n  private fallbackInput: HTMLInputElement;\n\n  @Event({ eventName: 'ifxChange' }) ifxChange: EventEmitter;\n  @Event({ eventName: 'ifxError' }) ifxError: EventEmitter;\n\n  componentWillLoad() {\n    if(!isNestedInIfxComponent(this.el)) { \n      const framework = detectFramework();\n      trackComponent('ifx-radio-button', framework)\n    }\n    // Fallback for form association\n    this.fallbackInput = document.createElement('input');\n    this.fallbackInput.type = 'radio';\n    this.fallbackInput.hidden = true;\n    this.fallbackInput.className = '_ifx-radiobutton-fallback';\n    this.fallbackInput.style.cssText = `\n      display: none !important;\n      position: absolute !important;\n      opacity: 0 !important;\n      pointer-events: none !important;\n      width: 0 !important;\n      height: 0 !important;\n    `;\n    this.fallbackInput.setAttribute('aria-hidden', 'true');\n    this.fallbackInput.tabIndex = -1;\n    this.el.appendChild(this.fallbackInput);\n\n    // Initialize ElementInternals if supported\n    if ('attachInternals' in HTMLElement.prototype) {\n      try {\n        this.internals = this.el.attachInternals();\n      } catch (e) {\n        console.warn('ElementInternals not supported');\n      }\n    }\n\n    // Initial state\n    this.internalChecked = this.checked || false;\n    this.hasSlot = !!this.el.querySelector('[slot]') || this.el.innerHTML.trim() !== '';\n  }\n\n  @Watch('checked')\n  handleCheckedChange(newValue: boolean) {\n    this.internalChecked = newValue;\n  }\n\n  @Watch('internalChecked')\n  updateFormValue() {\n    // Update both ElementInternals and fallback input\n    if (this.internals?.setFormValue) {\n      this.internals.setFormValue(this.internalChecked ? this.value : null);\n    }\n    this.fallbackInput.checked = this.internalChecked;\n    this.fallbackInput.name = this.name;\n    this.fallbackInput.value = this.value;\n    this.fallbackInput.disabled = this.disabled;\n  }\n\n  @Watch('error')\n    errorChanged(newValue: boolean, oldValue: boolean) {\n      if (newValue !== oldValue) {\n        this.ifxError.emit(newValue);\n      }\n    }\n\n  handleRadioButtonClick(event: Event) {\n    if (this.disabled) {\n      event.stopPropagation();\n      return;\n    }\n\n    this.inputElement.click();\n    this.internalChecked = this.inputElement.checked;\n    this.checked = this.internalChecked;\n    this.ifxChange.emit(this.internalChecked);\n\n    const changeEvent = new CustomEvent('change', {\n      bubbles: true,\n      composed: true,\n      detail: { checked: this.internalChecked }\n    });\n    this.el.dispatchEvent(changeEvent);\n  }\n\n  @Listen('keydown')\n  handleKeyDown(ev: KeyboardEvent) {\n    if ([' ', 'Enter'].includes(ev.key)) {\n      ev.preventDefault();\n      this.handleRadioButtonClick(new PointerEvent('click'));\n    }\n  }\n\n  @Listen('change', { target: 'document' })\n  handleExternalChange(event: Event) {\n    const target = event.target as HTMLElement;\n    if (target === this.el || target.tagName.toLowerCase() !== 'ifx-radio-button') return;\n    \n    if (target.getAttribute('name') === this.name) {\n      this.internalChecked = false;\n    }\n  }\n\n  render() {\n    return (\n      <div\n        role=\"radio\"\n        aria-checked={String(this.internalChecked)}\n        aria-disabled={String(this.disabled)}\n        class={`radioButton__container ${this.size} ${this.disabled ? 'disabled' : ''}`}\n        onClick={(e) => this.handleRadioButtonClick(e)}\n        tabindex={this.disabled ? -1 : 0}\n      >\n        <div\n          class={`radioButton__wrapper \n            ${this.internalChecked ? 'checked' : ''} \n            ${this.disabled ? 'disabled' : ''} \n            ${this.error ? 'error' : ''}`}\n        >\n          {this.internalChecked && <div class=\"radioButton__wrapper-mark\"></div>}\n        </div>\n\n        {this.hasSlot && (\n          <div class={`label ${this.size === \"m\" ? \"label-m\" : \"\"} ${this.disabled ? 'disabled' : ''}`}>\n            <slot />\n          </div>\n        )}\n\n        <input\n          type=\"radio\"\n          hidden\n          ref={el => this.inputElement = el}\n          name={this.name}\n          value={this.value}\n          checked={this.internalChecked}\n          disabled={this.disabled}\n          onClick={(e) => e.stopPropagation()}\n        />\n      </div>\n    );\n  }\n}"],"mappings":"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","ignoreList":[]}

package/dist/infineon-design-system-stencil/p-47e35811.entry.js

@@ -1,2 +0,0 @@
-import{r as i,h as o,a as t,g as f}from"./p-b7a462e5.js";import{d as a,t as n}from"./p-e8504e6b.js";import{i as e}from"./p-1ecafb97.js";const r=':root{--ifx-font-family:"Source Sans 3", "Arial, sans-serif"}.ifx-notification__wrapper{display:flex;flex-direction:row;align-items:center;padding:8px 16px;background-color:#FFFFFF;font-family:var(--ifx-font-family);color:#1D1D1D;border:1px solid #EEEDED}.ifx-notification__wrapper.ifx-notification__wrapper--success{border-left:4px solid #4CA460}.ifx-notification__wrapper.ifx-notification__wrapper--success .ifx-notification__icon{color:#4CA460}.ifx-notification__wrapper.ifx-notification__wrapper--locked{border-left:4px solid #E16B25}.ifx-notification__wrapper.ifx-notification__wrapper--locked .ifx-notification__icon{color:#E16B25}.ifx-notification__wrapper.ifx-notification__wrapper--error{border-left:4px solid #CD002F}.ifx-notification__wrapper.ifx-notification__wrapper--error .ifx-notification__icon{color:#CD002F}.ifx-notification__wrapper.ifx-notification__wrapper--neutral{border-left:4px solid #0A8276}.ifx-notification__wrapper.ifx-notification__wrapper--neutral .ifx-notification__icon{color:#0A8276}.ifx-notification__wrapper .ifx-notification__icon{margin-right:8px;display:flex;align-self:center}.ifx-notification__wrapper .ifx-notification__body{display:flex;flex-direction:row;flex-grow:1;font-size:0.875rem}.ifx-notification__wrapper .ifx-notification__body .ifx-notification__slot{flex-grow:1;display:inline-flex;align-items:center}.ifx-notification__wrapper .ifx-notification__link{font-size:0.875rem}@media (max-width: 576px){.ifx-notification__wrapper .ifx-notification__icon{align-self:flex-start}.ifx-notification__wrapper .ifx-notification__body{flex-direction:column}.ifx-notification__wrapper .ifx-notification__link{margin-top:8px}}';const c=r;const _=class{constructor(o){i(this,o);this.variant="success";this.linkTarget="_blank"}componentWillLoad(){if(!e(this.el)){const i=a();n("ifx-notification",i)}}getClassName(){switch(this.variant){case"success":return"ifx-notification__wrapper--success";case"locked":return"ifx-notification__wrapper--locked";case"error":return"ifx-notification__wrapper--error";case"neutral":return"ifx-notification__wrapper--neutral";default:return"ifx-notification__wrapper--success"}}render(){return o(t,{key:"c17bf027743a67188f8f2d5939c32d1291cd5d17"},o("div",{key:"5b94bafadb00ff880d921968aebabdc1dc4a046a",class:"ifx-notification__wrapper "+this.getClassName()},o("div",{key:"883a1fa61c49c3cb9851a76f0b6e6ab40e08a578",class:"ifx-notification__icon"},o("ifx-icon",{key:"966365d2eae1eaeaef8cdbd9c656d56cc6d09ee1",icon:this.icon})),o("div",{key:"50a4c1af8864397efd1cd7b7c04444fdb3860eaf",class:"ifx-notification__body"},o("div",{key:"587eddd49c9006fed4dcf588b0ba04f17ca88677",class:"ifx-notification__slot"},o("slot",{key:"83e4cac618bad6c4e0e52297214013cd8f6c268e"})),this.linkText&&this.linkHref&&o("div",{key:"5e477f0dbc503f0cff2fbe0c72673939e41f7222",class:"ifx-notification__link"},o("ifx-link",{key:"4609e684a086bacb401ba57f011f064679c5f094",href:this.linkHref,target:this.linkTarget},this.linkText,o("ifx-icon",{key:"2b9bce01568ad57abc570fbcfaf401380c97c8ba",icon:"arrow-right-16"}))))))}get el(){return f(this)}};_.style=c;export{_ as ifx_notification};
-//# sourceMappingURL=p-47e35811.entry.js.map

package/dist/infineon-design-system-stencil/p-47e35811.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["notificationCss","IfxNotificationStyle0","Notification","constructor","hostRef","this","variant","linkTarget","componentWillLoad","isNestedInIfxComponent","el","framework","detectFramework","trackComponent","getClassName","render","h","Host","key","class","icon","linkText","linkHref","href","target"],"sources":["src/components/notification/notification.scss?tag=ifx-notification&encapsulation=shadow","src/components/notification/notification.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n.ifx-notification__wrapper {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n\n  padding: tokens.$ifxSpace100 tokens.$ifxSpace200;\n\n  background-color: tokens.$ifxColorBaseWhite;\n  font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\n\n\n  color: tokens.$ifxColorBaseBlack;\n\n  border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorEngineering200;\n\n  &.ifx-notification__wrapper--success {\n    border-left: tokens.$ifxBorderWidth50 solid tokens.$ifxColorGreen500;\n\n    & .ifx-notification__icon {\n      color: tokens.$ifxColorGreen500;\n    }\n  }\n\n  &.ifx-notification__wrapper--locked {\n    border-left: tokens.$ifxBorderWidth50 solid tokens.$ifxColorOrange500;\n\n    & .ifx-notification__icon {\n      color: tokens.$ifxColorOrange500;\n    }\n  }\n\n  &.ifx-notification__wrapper--error {\n    border-left: tokens.$ifxBorderWidth50 solid tokens.$ifxColorRed500;\n\n    & .ifx-notification__icon {\n      color: tokens.$ifxColorRed500;\n    }\n  }\n\n  &.ifx-notification__wrapper--neutral{\n    border-left: tokens.$ifxBorderWidth50 solid tokens.$ifxColorOcean500;\n\n    & .ifx-notification__icon {\n      color: tokens.$ifxColorOcean500;\n    }\n  }\n\n  & .ifx-notification__icon {\n    margin-right: tokens.$ifxSpace100;\n    display: flex;\n    align-self: center;\n  }\n\n  & .ifx-notification__body {\n    display: flex;\n    flex-direction: row;\n    flex-grow: 1;\n    font-size: tokens.$ifxFontSizeS;\n\n    & .ifx-notification__slot {\n      flex-grow: 1;\n      display: inline-flex;\n      align-items: center;\n    }\n  }\n\n  & .ifx-notification__link {\n    font-size: tokens.$ifxFontSizeS;\n  }\n\n  @media (max-width: tokens.$ifxBreakpointXs) {\n    & .ifx-notification__icon {\n      align-self: flex-start;\n    }\n\n    & .ifx-notification__body {\n      flex-direction: column;\n    }\n\n    & .ifx-notification__link {\n      margin-top: tokens.$ifxSpace100;\n    }\n  }\n}","import { Component, h, Host, Prop, Element } from '@stencil/core';\nimport { trackComponent } from '../../global/utils/tracking';\nimport { isNestedInIfxComponent } from '../../global/utils/dom-utils';\nimport { detectFramework } from '../../global/utils/framework-detection';\nexport type NotificationVariant = 'success' | 'locked' | 'error' | 'neutral';\n\n@Component({\n  tag: 'ifx-notification',\n  styleUrl: 'notification.scss',\n  shadow: true\n})\nexport class Notification {\n  @Element() el;\n  @Prop() icon: string;\n  @Prop() variant: NotificationVariant = 'success';\n  @Prop() linkText: string; \n  @Prop() linkHref: string;\n  @Prop() linkTarget: string = '_blank';\n\n  componentWillLoad() { \n    if(!isNestedInIfxComponent(this.el)) { \n      const framework = detectFramework();\n      trackComponent('ifx-notification', framework)\n    }\n  }\n\n  private getClassName(): string {\n    switch (this.variant) {\n      case 'success':\n        return 'ifx-notification__wrapper--success';\n      case 'locked':\n        return 'ifx-notification__wrapper--locked';\n      case 'error':\n        return 'ifx-notification__wrapper--error';\n      case 'neutral':\n        return 'ifx-notification__wrapper--neutral';\n      default:\n        return 'ifx-notification__wrapper--success';\n    }\n  }\n\n  render() {\n    return (\n      <Host>\n        <div class={\"ifx-notification__wrapper \" + this.getClassName()}>\n          <div class=\"ifx-notification__icon\">\n            <ifx-icon icon={this.icon}></ifx-icon>\n          </div>\n          <div class=\"ifx-notification__body\">\n            <div class=\"ifx-notification__slot\">\n              <slot/>\n            </div>\n            { this.linkText && this.linkHref && \n            <div class=\"ifx-notification__link\">\n              <ifx-link href={this.linkHref} target={this.linkTarget}>\n                {this.linkText}<ifx-icon icon=\"arrow-right-16\">\n              </ifx-icon>\n              </ifx-link>\n            </div>\n          }\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}"],"mappings":"wIAAA,MAAMA,EAAkB,ooDACxB,MAAAC,EAAeD,E,MCUFE,EAAY,MALzB,WAAAC,CAAAC,G,UAQUC,KAAAC,QAA+B,UAG/BD,KAAAE,WAAqB,Q,CAE7B,iBAAAC,GACE,IAAIC,EAAuBJ,KAAKK,IAAK,CACnC,MAAMC,EAAYC,IAClBC,EAAe,mBAAoBF,E,EAI/B,YAAAG,GACN,OAAQT,KAAKC,SACX,IAAK,UACH,MAAO,qCACT,IAAK,SACH,MAAO,oCACT,IAAK,QACH,MAAO,mCACT,IAAK,UACH,MAAO,qCACT,QACE,MAAO,qC,CAIb,MAAAS,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,2CAAKC,MAAO,6BAA+Bd,KAAKS,gBAC9CE,EAAA,OAAAE,IAAA,2CAAKC,MAAM,0BACTH,EAAA,YAAAE,IAAA,2CAAUE,KAAMf,KAAKe,QAEvBJ,EAAA,OAAAE,IAAA,2CAAKC,MAAM,0BACTH,EAAA,OAAAE,IAAA,2CAAKC,MAAM,0BACTH,EAAA,QAAAE,IAAA,8CAEAb,KAAKgB,UAAYhB,KAAKiB,UACxBN,EAAA,OAAAE,IAAA,2CAAKC,MAAM,0BACTH,EAAA,YAAAE,IAAA,2CAAUK,KAAMlB,KAAKiB,SAAUE,OAAQnB,KAAKE,YACzCF,KAAKgB,SAASL,EAAA,YAAAE,IAAA,2CAAUE,KAAK,uB","ignoreList":[]}

package/dist/infineon-design-system-stencil/p-486f1f73.entry.js

@@ -1,2 +0,0 @@
-import{r as t,h as e,g as i}from"./p-b7a462e5.js";import{d as o,t as s}from"./p-e8504e6b.js";import{i as c}from"./p-1ecafb97.js";const a=':root{--ifx-font-family:"Source Sans 3", "Arial, sans-serif"}.checkbox-group-container{display:flex;flex-direction:column}.checkbox-group{display:flex;font-family:var(--ifx-font-family);gap:8px}.checkbox-group.horizontal{flex-direction:row;column-gap:12px}.checkbox-group.vertical{flex-direction:column;row-gap:12px}.group-label{font:400 0.75rem/1rem "Source Sans 3";margin-bottom:8px;text-align:left;text-underline-position:from-font;text-decoration-skip-ink:none}.caption{margin-top:8px;align-self:flex-start;display:flex;width:100%;column-gap:8px;justify-content:space-between;align-items:center}.caption.default{color:#1D1D1D}.caption.error{color:#CD002F}.caption-text{font:400 0.75rem/1rem "Source Sans 3";flex:1;text-align:left;text-underline-position:from-font;text-decoration-skip-ink:none}.caption-icon{flex:0;display:flex}';const r=a;const n=class{constructor(e){t(this,e);this.errorStates=new Map;this.alignment="vertical";this.groupLabelText="Group Label Text";this.hasErrors=false;this.handleSlotChange=()=>{this.initializeState()}}handleCheckboxError(t){const e=t.target;if(e.tagName==="ifx-checkbox"){this.errorStates.set(e,t.detail);this.updateHasErrors()}}async setGroupError(t){const e=Array.from(this.el.querySelectorAll("ifx-checkbox"));e.forEach((e=>{e.error=t}))}componentWillLoad(){this.initializeState();if(!c(this.el)){const t=o();s("ifx-checkbox-group",t)}}initializeState(){this.errorStates.clear();const t=Array.from(this.el.querySelectorAll("ifx-checkbox"));t.forEach((t=>{if(!this.errorStates.has(t)){this.errorStates.set(t,t.error||false)}}));this.updateHasErrors()}updateHasErrors(){this.hasErrors=Array.from(this.errorStates.values()).some((t=>t))}render(){return e("div",{key:"a742f576e3b460e9d4cabd88e1c8fe916c63924b",class:"checkbox-group-container"},this.showGroupLabel?e("div",{class:"group-label"},this.groupLabelText," *"):"",e("div",{key:"04212a0934b6b58b2ceafb43e6db99d00a9ad5e4",class:`checkbox-group ${this.alignment} ${this.size}`},e("slot",{key:"0cde5becb5aae1ac4130e96629692191cfe5c2aa",onSlotchange:this.handleSlotChange})),this.showCaption?e("div",{class:`caption ${this.hasErrors?"error":"default"}`},this.showCaptionIcon?e("div",{class:"caption-icon"},e("ifx-icon",{icon:"c-info-16"})):"",e("div",{class:"caption-text"},this.captionText)):"")}static get formAssociated(){return true}get el(){return i(this)}};n.style=r;export{n as ifx_checkbox_group};
-//# sourceMappingURL=p-486f1f73.entry.js.map

package/dist/infineon-design-system-stencil/p-486f1f73.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["checkboxGroupCss","IfxCheckboxGroupStyle0","CheckboxGroup","constructor","hostRef","this","errorStates","Map","alignment","groupLabelText","hasErrors","handleSlotChange","initializeState","handleCheckboxError","event","checkbox","target","tagName","set","detail","updateHasErrors","setGroupError","error","checkboxes","Array","from","el","querySelectorAll","forEach","componentWillLoad","isNestedInIfxComponent","framework","detectFramework","trackComponent","clear","has","values","some","render","h","key","class","showGroupLabel","size","onSlotchange","showCaption","showCaptionIcon","icon","captionText"],"sources":["src/components/checkbox-group/checkbox-group.scss?tag=ifx-checkbox-group&encapsulation=shadow","src/components/checkbox-group/checkbox-group.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n.checkbox-group-container {\n    display: flex;\n    flex-direction: column;\n}\n\n.checkbox-group {\n    display: flex;\n    font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\n\n\n    gap: tokens.$ifxSpace100;\n\n    &.horizontal {\n        flex-direction: row;\n        column-gap: tokens.$ifxSpace150;\n    }\n\n    &.vertical {\n        flex-direction: column;\n        row-gap: tokens.$ifxSpace150;\n    }\n}\n\n.group-label {\n    font: tokens.$ifxBodyBody05;\n    margin-bottom: tokens.$ifxSpace100;\n    text-align: left;\n    text-underline-position: from-font;\n    text-decoration-skip-ink: none;\n}\n\n.caption {\n    margin-top: tokens.$ifxSpace100;\n    align-self: flex-start;\n    display: flex;\n    width: 100%;\n    column-gap: tokens.$ifxSpace100;\n    justify-content: space-between;\n    align-items: center;\n\n    &.default {\n        color: tokens.$ifxColorBaseBlack;\n    }\n\n    &.error {\n        color: tokens.$ifxColorRed500;\n    }\n}\n\n.caption-text {\n    font: tokens.$ifxBodyBody05;\n    flex: 1;\n    text-align: left;\n    text-underline-position: from-font;\n    text-decoration-skip-ink: none;\n}\n\n.caption-icon {\n    flex:0;\n    display: flex;\n}","import { Component, State, Prop, h, Element, Listen, Method } from '@stencil/core';\nimport { trackComponent } from '../../global/utils/tracking';\nimport { isNestedInIfxComponent } from '../../global/utils/dom-utils';\nimport { detectFramework } from '../../global/utils/framework-detection';\n\n@Component({\n  tag: 'ifx-checkbox-group',\n  styleUrl: 'checkbox-group.scss',\n  shadow: true,\n  formAssociated: true\n})\n\nexport class CheckboxGroup {\n  private errorStates: Map<HTMLElement, boolean> = new Map();\n\n  @Element() el: HTMLElement;\n  @Prop() alignment: 'horizontal' | 'vertical' = 'vertical';\n  @Prop() size: string;\n  @Prop() showGroupLabel: boolean;\n  @Prop() groupLabelText: string = 'Group Label Text';\n  @Prop() showCaption: boolean;\n  @Prop() captionText: string;\n  @Prop() showCaptionIcon: boolean;\n  @State() hasErrors: boolean = false;\n\n  @Listen('ifxError')\n  handleCheckboxError(event: CustomEvent) {\n    const checkbox = event.target as HTMLElement;\n    if (checkbox.tagName === 'ifx-checkbox') {\n      this.errorStates.set(checkbox, event.detail);\n      this.updateHasErrors();\n    }\n  }\n\n  // Method to set the error state of all checkboxes in the group\n  @Method()\n  async setGroupError(error: boolean) {\n    const checkboxes = Array.from(this.el.querySelectorAll('ifx-checkbox'));\n    checkboxes.forEach((checkbox) => {\n      (checkbox as any).error = error;\n    });\n  }\n\n  componentWillLoad() {\n    this.initializeState();\n    if(!isNestedInIfxComponent(this.el)) { \n      const framework = detectFramework();\n      trackComponent('ifx-checkbox-group', framework)\n    }\n  }\n\n  handleSlotChange = () => {\n    this.initializeState();\n  };\n\n  private initializeState() {\n    this.errorStates.clear();\n    const checkboxes = Array.from(this.el.querySelectorAll('ifx-checkbox'));\n    checkboxes.forEach((checkbox) => {\n      if (!this.errorStates.has(checkbox)) {\n        this.errorStates.set(checkbox, (checkbox as any).error || false);\n      }\n    });\n    this.updateHasErrors();\n  }\n\n  private updateHasErrors() {\n    this.hasErrors = Array.from(this.errorStates.values()).some((error) => error);\n  }\n\n  render() {\n    return (\n      <div class='checkbox-group-container'>\n        {this.showGroupLabel ? <div class='group-label'>{this.groupLabelText} *</div> : ''}\n        <div class={`checkbox-group ${this.alignment} ${this.size}`}>\n          <slot onSlotchange={this.handleSlotChange}></slot>\n        </div>\n        {this.showCaption ? (\n          <div class={`caption ${this.hasErrors ? 'error' : 'default'}`}>\n            {this.showCaptionIcon ? <div class='caption-icon'><ifx-icon icon=\"c-info-16\">\n            </ifx-icon></div> : ''}\n            <div class='caption-text'>{this.captionText}</div>\n          </div>) : ''}\n      </div>\n    );\n  }\n}"],"mappings":"iIAAA,MAAMA,EAAmB,m0BACzB,MAAAC,EAAeD,E,MCWFE,EAAa,MAP1B,WAAAC,CAAAC,G,UAQUC,KAAAC,YAAyC,IAAIC,IAG7CF,KAAAG,UAAuC,WAGvCH,KAAAI,eAAyB,mBAIxBJ,KAAAK,UAAqB,MA4B9BL,KAAAM,iBAAmB,KACjBN,KAAKO,iBAAiB,C,CA1BxB,mBAAAC,CAAoBC,GAClB,MAAMC,EAAWD,EAAME,OACvB,GAAID,EAASE,UAAY,eAAgB,CACvCZ,KAAKC,YAAYY,IAAIH,EAAUD,EAAMK,QACrCd,KAAKe,iB,EAMT,mBAAMC,CAAcC,GAClB,MAAMC,EAAaC,MAAMC,KAAKpB,KAAKqB,GAAGC,iBAAiB,iBACvDJ,EAAWK,SAASb,IACjBA,EAAiBO,MAAQA,CAAK,G,CAInC,iBAAAO,GACExB,KAAKO,kBACL,IAAIkB,EAAuBzB,KAAKqB,IAAK,CACnC,MAAMK,EAAYC,IAClBC,EAAe,qBAAsBF,E,EAQjC,eAAAnB,GACNP,KAAKC,YAAY4B,QACjB,MAAMX,EAAaC,MAAMC,KAAKpB,KAAKqB,GAAGC,iBAAiB,iBACvDJ,EAAWK,SAASb,IAClB,IAAKV,KAAKC,YAAY6B,IAAIpB,GAAW,CACnCV,KAAKC,YAAYY,IAAIH,EAAWA,EAAiBO,OAAS,M,KAG9DjB,KAAKe,iB,CAGC,eAAAA,GACNf,KAAKK,UAAYc,MAAMC,KAAKpB,KAAKC,YAAY8B,UAAUC,MAAMf,GAAUA,G,CAGzE,MAAAgB,GACE,OACEC,EAAA,OAAAC,IAAA,2CAAKC,MAAM,4BACRpC,KAAKqC,eAAiBH,EAAA,OAAKE,MAAM,eAAepC,KAAKI,eAAc,MAAY,GAChF8B,EAAA,OAAAC,IAAA,2CAAKC,MAAO,kBAAkBpC,KAAKG,aAAaH,KAAKsC,QACnDJ,EAAA,QAAAC,IAAA,2CAAMI,aAAcvC,KAAKM,oBAE1BN,KAAKwC,YACJN,EAAA,OAAKE,MAAO,WAAWpC,KAAKK,UAAY,QAAU,aAC/CL,KAAKyC,gBAAkBP,EAAA,OAAKE,MAAM,gBAAeF,EAAA,YAAUQ,KAAK,eAC7C,GACpBR,EAAA,OAAKE,MAAM,gBAAgBpC,KAAK2C,cACxB,G","ignoreList":[]}