@tekus/design-system 5.3.2 → 5.5.0

package/fesm2022/tekus-design-system-components-icon.mjs

@@ -0,0 +1,1206 @@
+import * as i0 from '@angular/core';
+import { model, signal, inject, computed, effect, Component } from '@angular/core';
+import { DomSanitizer } from '@angular/platform-browser';
+import * as i1 from '@fortawesome/angular-fontawesome';
+import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
+import { sanitizeSvgContent, retouchSvgForColor } from '@tekus/design-system/utils/sanitizer-utils';
+
+const angleIcons = {
+    'angle-left': {
+        name: 'faAngleLeft',
+        tags: ['basic', 'arrows'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faAngleLeft),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faAngleLeft),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faAngleLeft)
+        }
+    },
+    'angle-right': {
+        name: 'faAngleRight',
+        tags: ['basic', 'arrows'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faAngleRight),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faAngleRight),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faAngleRight)
+        }
+    },
+    'angle-down': {
+        name: 'faAngleDown',
+        tags: ['basic', 'arrows'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faAngleDown),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faAngleDown),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faAngleDown)
+        }
+    },
+    'angle-up': {
+        name: 'faAngleUp',
+        tags: ['basic', 'arrows'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faAngleUp),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faAngleUp),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faAngleUp)
+        }
+    }
+};
+
+const arrowIcons = {
+    'arrow-left': {
+        name: 'faArrowLeft',
+        tags: ['basic', 'arrows'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faArrowLeft),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faArrowLeft),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faArrowLeft)
+        }
+    },
+    'arrow-right': {
+        name: 'faArrowRight',
+        tags: ['basic', 'arrows'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faArrowRight),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faArrowRight),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faArrowRight)
+        }
+    },
+    'arrow-down': {
+        name: 'faArrowDown',
+        tags: ['basic', 'arrows'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faArrowDown),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faArrowDown),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faArrowDown)
+        }
+    },
+    'arrow-up': {
+        name: 'faArrowUp',
+        tags: ['basic', 'arrows'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faArrowUp),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faArrowUp),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faArrowUp)
+        }
+    },
+    'arrow-rotate-right': {
+        name: 'faArrowRotateRight',
+        tags: ['basic', 'arrows', 'reload'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faArrowRotateRight),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faArrowRotateRight),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faArrowRotateRight)
+        }
+    },
+    'clock-rotate-left': {
+        name: 'faClockRotateLeft',
+        tags: ['basic', 'arrows', 'reload', 'time'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faClockRotateLeft),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faClockRotateLeft),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faClockRotateLeft)
+        }
+    },
+    'rotate': {
+        name: 'faRotate',
+        tags: ['basic', 'arrows', 'reload'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faRotate),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faRotate),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faRotate)
+        }
+    },
+    'file-arrow-down': {
+        name: 'faFileArrowDown',
+        tags: ['global', 'download'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faFileArrowDown),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faFileArrowDown),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faFileArrowDown)
+        }
+    },
+    'cloud-arrow-down': {
+        name: 'faCloudArrowDown',
+        tags: ['global', 'download'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faCloudArrowDown),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faCloudArrowDown),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faCloudArrowDown)
+        }
+    }
+};
+
+const chevronIcons = {
+    'chevron-left': {
+        name: 'faChevronLeft',
+        tags: ['basic', 'arrows'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faChevronLeft),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faChevronLeft),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faChevronLeft)
+        }
+    },
+    'chevron-right': {
+        name: 'faChevronRight',
+        tags: ['basic', 'arrows'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faChevronRight),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faChevronRight),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faChevronRight)
+        }
+    },
+    'chevron-down': {
+        name: 'faChevronDown',
+        tags: ['basic', 'arrows'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faChevronDown),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faChevronDown),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faChevronDown)
+        }
+    },
+    'chevron-up': {
+        name: 'faChevronUp',
+        tags: ['basic', 'arrows'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faChevronUp),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faChevronUp),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faChevronUp)
+        }
+    }
+};
+
+const circleIcon = {
+    'circle': {
+        name: 'faCircle',
+        tags: ['basic'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faCircle),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faCircle),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faCircle)
+        }
+    },
+    'circle-info': {
+        name: 'faCircleInfo',
+        tags: ['basic', 'information'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faCircleInfo),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faCircleInfo),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faCircleInfo)
+        }
+    },
+    'circle-question': {
+        name: 'faCircleQuestion',
+        tags: ['basic'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faCircleQuestion),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faCircleQuestion),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faCircleQuestion)
+        }
+    },
+    'circle-xmark': {
+        name: 'faCircleXmark',
+        tags: ['basic', 'closed'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faCircleXmark),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faCircleXmark),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faCircleXmark)
+        }
+    },
+    'circle-check': {
+        name: 'faCircleCheck',
+        tags: ['basic'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faCircleCheck),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faCircleCheck),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faCircleCheck)
+        }
+    }
+};
+
+const adsIcons = {
+    ads: {
+        name: 'ads',
+        tags: ['screen', 'custom', 'money', 'advertisement'],
+        source: 'Custom',
+        styles: {
+            light: Promise.resolve().then(function () { return adsIcon_svg; }).then(m => m.default),
+            regular: Promise.resolve().then(function () { return adsIcon_svg; }).then(m => m.default),
+            solid: Promise.resolve().then(function () { return adsIcon_svg; }).then(m => m.default)
+        }
+    }
+};
+
+const triangleIcon = {
+    'triangle-exclamation': {
+        name: 'faTriangleExclamation',
+        tags: ['basic'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faTriangleExclamation),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faTriangleExclamation),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faTriangleExclamation)
+        }
+    }
+};
+
+const squareIcon = {
+    'square-poll-horizontal': {
+        name: 'faSquarePollHorizontal',
+        tags: ['basic'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faSquarePollHorizontal),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faSquarePollHorizontal),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faSquarePollHorizontal)
+        }
+    },
+    'vector-square': {
+        name: 'faVectorSquare',
+        tags: ['miscellanea'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faVectorSquare),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faVectorSquare),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faVectorSquare)
+        }
+    }
+};
+
+const penIcon = {
+    'pen-to-square': {
+        name: 'faPenToSquare',
+        tags: ['global'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faPenToSquare),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faPenToSquare),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faPenToSquare)
+        }
+    }
+};
+
+const pencilIcon = {
+    'pencil': {
+        name: 'faPencil',
+        tags: ['basic'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faPencil),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faPencil),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faPencil)
+        }
+    }
+};
+
+const trashIcon = {
+    'trash-can': {
+        name: 'faTrashCan',
+        tags: ['global'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faTrashCan),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faTrashCan),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faTrashCan)
+        }
+    }
+};
+
+const cloneIcon = {
+    'clone': {
+        name: 'faClone',
+        tags: ['global'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faClone),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faClone),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faClone)
+        }
+    }
+};
+
+const filterIcon = {
+    'filter': {
+        name: 'faFilter',
+        tags: ['global'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faFilter),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faFilter),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faFilter)
+        }
+    }
+};
+
+const foldersIcon = {
+    'folders': {
+        name: 'faFolders',
+        tags: ['global'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faFolders),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faFolders),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faFolders)
+        }
+    }
+};
+
+const magnifyingGlassIcon = {
+    'magnifying-glass': {
+        name: 'faMagnifyingGlass',
+        tags: ['global', 'search'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faMagnifyingGlass),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faMagnifyingGlass),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faMagnifyingGlass)
+        }
+    }
+};
+
+const shuffleIcon = {
+    'shuffle': {
+        name: 'faShuffle',
+        tags: ['basic'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faShuffle),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faShuffle),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faShuffle)
+        }
+    }
+};
+
+const eyeIcon = {
+    'eye': {
+        name: 'faEye',
+        tags: ['global'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faEye),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faEye),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faEye)
+        }
+    },
+    'eye-slash': {
+        name: 'faEyeSlash',
+        tags: ['global'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faEyeSlash),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faEyeSlash),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faEyeSlash)
+        }
+    }
+};
+
+const barsIcon = {
+    'bars': {
+        name: 'faBars',
+        tags: ['global'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faBars),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faBars),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faBars)
+        }
+    }
+};
+
+const ellipsisIcon = {
+    'ellipsis': {
+        name: 'faEllipsis',
+        tags: ['global'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faEllipsis),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faEllipsis),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faEllipsis)
+        }
+    },
+    'ellipsis-vertical': {
+        name: 'faEllipsisVertical',
+        tags: ['global'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faEllipsisVertical),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faEllipsisVertical),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faEllipsisVertical)
+        }
+    }
+};
+
+const gearsIcon = {
+    'gears': {
+        name: 'faGears',
+        tags: ['global'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faGears),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faGears),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faGears)
+        }
+    },
+    'gear': {
+        name: 'faGear',
+        tags: ['global'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faGear),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faGear),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faGear)
+        }
+    }
+};
+
+const downloadIcon = {
+    'download': {
+        name: 'faDownload',
+        tags: ['global'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faDownload),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faDownload),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faDownload)
+        }
+    }
+};
+
+const tagIcon = {
+    'tag': {
+        name: 'faTag',
+        tags: ['global'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faTag),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faTag),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faTag)
+        }
+    }
+};
+
+const languageIcon = {
+    'language': {
+        name: 'faLanguage',
+        tags: ['global', 'translate', 'traduction'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faLanguage),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faLanguage),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faLanguage)
+        }
+    }
+};
+
+const boltIcon = {
+    'bolt': {
+        name: 'faBolt',
+        tags: ['global'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faBolt),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faBolt),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faBolt)
+        }
+    }
+};
+
+const calendarIcon = {
+    'calendar-day': {
+        name: 'faCalendarDay',
+        tags: ['global'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faCalendarDay),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faCalendarDay),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faCalendarDay)
+        }
+    }
+};
+
+const clockIcon = {
+    'clock-three': {
+        name: 'faClockThree',
+        tags: ['global'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faClockThree),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faClockThree),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faClockThree)
+        }
+    }
+};
+
+const cameraIcon = {
+    'camera-cctv': {
+        name: 'faCameraCctv',
+        tags: ['global'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faCameraCctv),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faCameraCctv),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faCameraCctv)
+        }
+    }
+};
+
+const handIcon = {
+    'hand-back-point-up': {
+        name: 'faHandBackPointUp',
+        tags: ['global'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faHandBackPointUp),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faHandBackPointUp),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faHandBackPointUp)
+        }
+    }
+};
+
+const locationIcon = {
+    'location-dot': {
+        name: 'faLocationDot',
+        tags: ['global', 'place'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faLocationDot),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faLocationDot),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faLocationDot)
+        }
+    },
+    'street-view': {
+        name: 'faStreetView',
+        tags: ['location', 'place', 'user'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faStreetView),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faStreetView),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faStreetView)
+        }
+    },
+};
+
+const layerIcon = {
+    'layer-group': {
+        name: 'faLayerGroup',
+        tags: ['global'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faLayerGroup),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faLayerGroup),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faLayerGroup)
+        }
+    }
+};
+
+const plusIcon = {
+    'plus': {
+        name: 'faPlus',
+        tags: ['basic'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faPlus),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faPlus),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faPlus)
+        }
+    }
+};
+
+const linkIcon = {
+    'link': {
+        name: 'faLink',
+        tags: ['basic'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faLink),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faLink),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faLink)
+        }
+    },
+    'link-slash': {
+        name: 'faLinkSlash',
+        tags: ['basic'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faLinkSlash),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faLinkSlash),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faLinkSlash)
+        }
+    }
+};
+
+const checkIcon = {
+    'check': {
+        name: 'faCheck',
+        tags: ['global'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faCheck),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faCheck),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faCheck)
+        }
+    }
+};
+
+const xMarkIcon = {
+    'xmark': {
+        name: 'faXmark',
+        tags: ['global'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faXmark),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faXmark),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faXmark)
+        }
+    }
+};
+
+const screwdriverWrenchIcon = {
+    'screwdriver-wrench': {
+        name: 'faScrewdriverWrench',
+        tags: ['global'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faScrewdriverWrench),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faScrewdriverWrench),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faScrewdriverWrench)
+        }
+    }
+};
+
+const thumbsUpIcon = {
+    'thumbs-up': {
+        name: 'faThumbsUp',
+        tags: ['global', 'hand'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faThumbsUp),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faThumbsUp),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faThumbsUp)
+        }
+    }
+};
+
+const mediaIcon = {
+    'display': {
+        name: 'faDisplay',
+        tags: ['media', 'screen'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faDisplay),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faDisplay),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faDisplay)
+        }
+    },
+    'volume': {
+        name: 'faVolume',
+        tags: ['media', 'audio'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faVolume),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faVolume),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faVolume)
+        }
+    },
+    'image': {
+        name: 'faImage',
+        tags: ['media', 'audio'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faImage),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faImage),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faImage)
+        }
+    },
+    'video': {
+        name: 'faVideo',
+        tags: ['media', 'audio'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faVideo),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faVideo),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faVideo)
+        }
+    },
+    'panorama': {
+        name: 'faPanorama',
+        tags: ['media', 'photo'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faPanorama),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faPanorama),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faPanorama)
+        }
+    },
+    'photo-film-music': {
+        name: 'faPhotoFilmMusic',
+        tags: ['media'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faPhotoFilmMusic),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faPhotoFilmMusic),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faPhotoFilmMusic)
+        }
+    },
+    'list-music': {
+        name: 'faListMusic',
+        tags: ['media', 'audio'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faListMusic),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faListMusic),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faListMusic)
+        }
+    }
+};
+
+const userIcon = {
+    'user': {
+        name: 'faUser',
+        tags: [],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faUser),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faUser),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faUser)
+        }
+    },
+    'users': {
+        name: 'faUsers',
+        tags: [],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faUsers),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faUsers),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faUsers)
+        }
+    },
+    'graduation-cap': {
+        name: 'faGraduationCap',
+        tags: ['user'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faGraduationCap),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faGraduationCap),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faGraduationCap)
+        }
+    }
+};
+
+const bookIcon = {
+    'book-open': {
+        name: 'faBookOpen',
+        tags: ['user'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faBookOpen),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faBookOpen),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faBookOpen)
+        }
+    }
+};
+
+const listIcon = {
+    'list-check': {
+        name: 'faListCheck',
+        tags: ['chart'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faListCheck),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faListCheck),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faListCheck)
+        }
+    },
+    'poll-people': {
+        name: 'faPollPeople',
+        tags: ['chart', 'list'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faPollPeople),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faPollPeople),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faPollPeople)
+        }
+    },
+    'table-list': {
+        name: 'faTableList',
+        tags: ['chart'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faTableList),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faTableList),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faTableList)
+        }
+    }
+};
+
+const chartIcon = {
+    'chart-pie-simple': {
+        name: 'faChartPieSimple',
+        tags: [],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faChartPieSimple),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faChartPieSimple),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faChartPieSimple)
+        }
+    },
+    'chart-line-up': {
+        name: 'faChartLineUp',
+        tags: [],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faChartLineUp),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faChartLineUp),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faChartLineUp)
+        }
+    },
+    'chart-user': {
+        name: 'faChartUser',
+        tags: [],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faChartUser),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faChartUser),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faChartUser)
+        }
+    },
+    'file-chart-column': {
+        name: 'faFileChartColumn',
+        tags: [],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faFileChartColumn),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faFileChartColumn),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faFileChartColumn)
+        }
+    }
+};
+
+const megaphoneIcon = {
+    'megaphone': {
+        name: 'faMegaphone',
+        tags: ['miscellanea'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faMegaphone),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faMegaphone),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faMegaphone)
+        }
+    }
+};
+
+const moneyIcon = {
+    'money-bill': {
+        name: 'faMoneyBill',
+        tags: ['miscellanea'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faMoneyBill),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faMoneyBill),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faMoneyBill)
+        }
+    }
+};
+
+const lockIcon = {
+    'lock-keyhole': {
+        name: 'faLockKeyhole',
+        tags: ['miscellanea', 'safe'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faLockKeyhole),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faLockKeyhole),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faLockKeyhole)
+        }
+    }
+};
+
+const qrCodeIcon = {
+    'qr-code': {
+        name: 'faQrcode',
+        tags: ['miscellanea'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faQrcode),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faQrcode),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faQrcode)
+        }
+    }
+};
+
+const plugIcon = {
+    'plug': {
+        name: 'faPlug',
+        tags: ['miscellanea'],
+        source: 'Font awesome',
+        styles: {
+            light: import('@fortawesome/pro-light-svg-icons').then(m => m.faPlug),
+            regular: import('@fortawesome/pro-regular-svg-icons').then(m => m.faPlug),
+            solid: import('@fortawesome/pro-solid-svg-icons').then(m => m.faPlug)
+        }
+    }
+};
+
+/**
+ * iconsStylesLight is an array of available light styles for each icon in the IconCatalog.
+ * It allows for easy access and iteration over the light styles.
+ */
+const iconsStylesLight = [
+    'light', 'fal', 'fa-light', 'tkl'
+];
+/**
+ * iconsStylesSolid is an array of available solid styles for each icon in the IconCatalog.
+ * It allows for easy access and iteration over the solid styles.
+ */
+const iconsStylesSolid = [
+    'solid', 'fas', 'fa-solid', 'tks'
+];
+/**
+ * iconsStylesRegular is an array of available regular styles for each icon in the IconCatalog.
+ * It allows for easy access and iteration over the regular styles.
+ */
+const iconsStylesRegular = [
+    'regular', 'far', 'fa-regular', 'fa', 'fa-classic', 'tkr'
+];
+const IconCatalog = {
+    ...angleIcons,
+    ...arrowIcons,
+    ...chevronIcons,
+    ...circleIcon,
+    ...triangleIcon,
+    ...squareIcon,
+    ...pencilIcon,
+    ...penIcon,
+    ...trashIcon,
+    ...cloneIcon,
+    ...filterIcon,
+    ...downloadIcon,
+    ...magnifyingGlassIcon,
+    ...shuffleIcon,
+    ...eyeIcon,
+    ...barsIcon,
+    ...ellipsisIcon,
+    ...gearsIcon,
+    ...foldersIcon,
+    ...tagIcon,
+    ...languageIcon,
+    ...boltIcon,
+    ...calendarIcon,
+    ...clockIcon,
+    ...cameraIcon,
+    ...handIcon,
+    ...locationIcon,
+    ...layerIcon,
+    ...plusIcon,
+    ...linkIcon,
+    ...checkIcon,
+    ...xMarkIcon,
+    ...screwdriverWrenchIcon,
+    ...thumbsUpIcon,
+    ...mediaIcon,
+    ...userIcon,
+    ...bookIcon,
+    ...listIcon,
+    ...chartIcon,
+    ...megaphoneIcon,
+    ...moneyIcon,
+    ...lockIcon,
+    ...qrCodeIcon,
+    ...plugIcon,
+    ...adsIcons,
+};
+
+class IconComponent {
+    constructor() {
+        /**
+         * The name of the icon to display.
+         * This is a required field.
+         * It should match one of the icons in the *IconCatalog*.
+         */
+        this.icon = model('');
+        /**
+         * The style of the icon to display.
+         * This is an optional field.
+         * It defaults to 'regular'.
+         */
+        this.styleIcon = model('regular');
+        /**
+         * The color of the icon to display.
+         */
+        this.color = model();
+        /**
+         * The size of the icon to display.
+         */
+        this.size = model();
+        /**
+         * Whether the icon is disabled.
+         */
+        this.disabled = model(false);
+        /**
+         * The definition of the icon to display for Font Awesome.
+         */
+        this.iconDefinition = signal(null);
+        /**
+         * The SVG content of the icon to display for custom icons.
+         */
+        this.svgContent = signal(null);
+        /**
+         * The sanitizer service to use for sanitizing SVG content.
+         */
+        this.sanitizer = inject(DomSanitizer);
+        /**
+         * The size property to use for the icon.
+         */
+        this.sizeProp = computed(() => {
+            const size = this.size();
+            if (!size || size === 'md')
+                return null;
+            return size;
+        });
+        this.iconEffect = effect(() => {
+            const icon = this.icon();
+            this.styleIcon();
+            if (icon) {
+                this.getIcon();
+            }
+        }, {
+            allowSignalWrites: true
+        });
+    }
+    /**
+     * Destroy icon effect
+     */
+    ngOnDestroy() {
+        this.iconEffect?.destroy();
+    }
+    /**
+     * Gets the icon to display.
+     */
+    getIcon() {
+        const iconRef = IconCatalog?.[this.icon()];
+        if (iconRef?.source === 'Font awesome') {
+            this.loadIconFa();
+        }
+        else if (iconRef?.source === 'Custom') {
+            this.loadIconCustom();
+        }
+    }
+    /**
+     * Loads the icon from Font Awesome.
+     */
+    async loadIconFa() {
+        const iconRef = IconCatalog?.[this.icon()];
+        const styleIcon = this.getKeyStyle();
+        this.svgContent.set(null);
+        if (!iconRef || !styleIcon) {
+            this.iconDefinition.set(null);
+            return;
+        }
+        ;
+        const iconPromise = iconRef?.styles?.[styleIcon];
+        if (!iconPromise) {
+            this.iconDefinition.set(null);
+            return;
+        }
+        ;
+        iconPromise
+            ?.then(icon => this.iconDefinition.set(icon))
+            ?.catch(() => this.iconDefinition.set(null));
+    }
+    /**
+     * Gets the key style for the icon based on the current styleIcon model.
+     *
+    * @returns 'light' | 'regular' | 'solid' | null
+     */
+    getKeyStyle() {
+        const style = this.styleIcon();
+        if (style && iconsStylesLight.includes(style))
+            return 'light';
+        if (style && iconsStylesRegular.includes(style))
+            return 'regular';
+        if (style && iconsStylesSolid.includes(style))
+            return 'solid';
+        return null;
+    }
+    /**
+     * Loads a custom icon from the IconCatalog.
+     * Sanitize the SVG content and apply the appropriate color.
+     * @returns void
+     */
+    loadIconCustom() {
+        const iconRef = IconCatalog?.[this.icon()];
+        this.iconDefinition.set(null);
+        const iconPromise = iconRef?.styles?.regular;
+        if (!iconPromise) {
+            this.svgContent.set(null);
+            return;
+        }
+        iconPromise?.then(svgContent => {
+            const safeSvg = sanitizeSvgContent(svgContent);
+            const retouchSvg = retouchSvgForColor(safeSvg);
+            this.svgContent.set(this.sanitizer.bypassSecurityTrustHtml(retouchSvg));
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: IconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: IconComponent, isStandalone: true, selector: "tk-icon", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, styleIcon: { classPropertyName: "styleIcon", publicName: "styleIcon", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { icon: "iconChange", styleIcon: "styleIconChange", color: "colorChange", size: "sizeChange", disabled: "disabledChange" }, ngImport: i0, template: "<div>\n  @if(iconDefinition()){\n\n  <fa-icon\n    class=\"svg-icon svg-icon__fa\"\n    [icon]=\"iconDefinition() ?? ''\"\n    [attr.color]=\"color()\"\n    [size]=\"sizeProp() ?? '1x'\"\n    [attr.disabled]=\"disabled()\"\n    ></fa-icon>\n\n  } @else if(svgContent()){\n\n  <div\n    class=\"svg-icon svg-icon__cu\"\n    [innerHTML]=\"svgContent()\"\n    [style]=\"{\n      '--color': color(),\n      '--size': size()\n    }\"\n    [attr.disabled]=\"disabled()\"\n    [attr.size]=\"size()\"\n    [attr.color]=\"color()\"></div>\n\n  }\n</div>\n", styles: [".svg-icon{display:inline-block;width:fit-content}.svg-icon[color=primary]{color:var(--tk-color-primary-500)}.svg-icon[color=secondary]{color:var(--tk-color-secondary-500)}.svg-icon[color=danger]{color:var(--tk-color-danger-500)}.svg-icon[color=warning]{color:var(--tk-color-warning-700)}.svg-icon[color=info]{color:var(--tk-color-info-500)}.svg-icon[color=light]{color:var(--tk-color-full-white)}.svg-icon[disabled=true],.svg-icon[data-disabled=true]{color:var(--tk-color-neutral-500)!important}.svg-icon__cu[size=\"2xs\"],.svg-icon__cu[data-size=\"2xs\"]{font-size:.625em}.svg-icon__cu[size=xs],.svg-icon__cu[data-size=xs]{font-size:.75em}.svg-icon__cu[size=sm],.svg-icon__cu[data-size=sm]{font-size:.875em}.svg-icon__cu[size=lg],.svg-icon__cu[data-size=lg]{font-size:1.25em}.svg-icon__cu[size=xl],.svg-icon__cu[data-size=xl]{font-size:1.5em}.svg-icon__cu[size=\"2xl\"],.svg-icon__cu[data-size=\"2xl\"]{font-size:2em}.svg-icon__cu[size=\"1x\"],.svg-icon__cu[data-size=\"1x\"]{font-size:1em}.svg-icon__cu[size=\"2x\"],.svg-icon__cu[data-size=\"2x\"]{font-size:2em}.svg-icon__cu[size=\"3x\"],.svg-icon__cu[data-size=\"3x\"]{font-size:3em}.svg-icon__cu[size=\"4x\"],.svg-icon__cu[data-size=\"4x\"]{font-size:4em}.svg-icon__cu[size=\"5x\"],.svg-icon__cu[data-size=\"5x\"]{font-size:5em}svg{width:100%;height:100%}\n"], dependencies: [{ kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: i1.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: IconComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'tk-icon', standalone: true, imports: [
+                        FontAwesomeModule
+                    ], template: "<div>\n  @if(iconDefinition()){\n\n  <fa-icon\n    class=\"svg-icon svg-icon__fa\"\n    [icon]=\"iconDefinition() ?? ''\"\n    [attr.color]=\"color()\"\n    [size]=\"sizeProp() ?? '1x'\"\n    [attr.disabled]=\"disabled()\"\n    ></fa-icon>\n\n  } @else if(svgContent()){\n\n  <div\n    class=\"svg-icon svg-icon__cu\"\n    [innerHTML]=\"svgContent()\"\n    [style]=\"{\n      '--color': color(),\n      '--size': size()\n    }\"\n    [attr.disabled]=\"disabled()\"\n    [attr.size]=\"size()\"\n    [attr.color]=\"color()\"></div>\n\n  }\n</div>\n", styles: [".svg-icon{display:inline-block;width:fit-content}.svg-icon[color=primary]{color:var(--tk-color-primary-500)}.svg-icon[color=secondary]{color:var(--tk-color-secondary-500)}.svg-icon[color=danger]{color:var(--tk-color-danger-500)}.svg-icon[color=warning]{color:var(--tk-color-warning-700)}.svg-icon[color=info]{color:var(--tk-color-info-500)}.svg-icon[color=light]{color:var(--tk-color-full-white)}.svg-icon[disabled=true],.svg-icon[data-disabled=true]{color:var(--tk-color-neutral-500)!important}.svg-icon__cu[size=\"2xs\"],.svg-icon__cu[data-size=\"2xs\"]{font-size:.625em}.svg-icon__cu[size=xs],.svg-icon__cu[data-size=xs]{font-size:.75em}.svg-icon__cu[size=sm],.svg-icon__cu[data-size=sm]{font-size:.875em}.svg-icon__cu[size=lg],.svg-icon__cu[data-size=lg]{font-size:1.25em}.svg-icon__cu[size=xl],.svg-icon__cu[data-size=xl]{font-size:1.5em}.svg-icon__cu[size=\"2xl\"],.svg-icon__cu[data-size=\"2xl\"]{font-size:2em}.svg-icon__cu[size=\"1x\"],.svg-icon__cu[data-size=\"1x\"]{font-size:1em}.svg-icon__cu[size=\"2x\"],.svg-icon__cu[data-size=\"2x\"]{font-size:2em}.svg-icon__cu[size=\"3x\"],.svg-icon__cu[data-size=\"3x\"]{font-size:3em}.svg-icon__cu[size=\"4x\"],.svg-icon__cu[data-size=\"4x\"]{font-size:4em}.svg-icon__cu[size=\"5x\"],.svg-icon__cu[data-size=\"5x\"]{font-size:5em}svg{width:100%;height:100%}\n"] }]
+        }], ctorParameters: () => [] });
+
+const tkAdsIcon = `<svg
+   width="1em"
+   height="1em"
+   viewBox="0 0 576 512"
+   fill="none"
+   role="img"
+   focusable="false"
+   aria-hidden="true"
+   data-prefix="tk"
+   data-icon="ads"
+   class="svg-icon--tk tk-ads"
+   version="1.1"
+   xmlns="http://www.w3.org/2000/svg">
+  <path
+     d="M 547.2024,64.000003 H 28.800127 C 12.897026,64.000003 0,78.330005 0,96.000098 V 415.99909 C 0,433.67134 12.897026,448 28.800127,448 H 547.2024 C 563.10459,448 576,433.67134 576,415.99909 V 96.000098 C 576,78.330005 563.10459,64.000003 547.2024,64.000003 Z M 532.80108,336.0001 c -31.81701,0 -57.60024,28.64995 -57.60024,63.99991 H 100.80019 c 0,-35.34996 -25.785012,-63.99991 -57.6,-63.99991 V 175.99992 c 31.814988,0 57.6,-28.64997 57.6,-63.99992 h 374.40065 c 0,35.34995 25.78323,63.99992 57.60024,63.99992 z"
+     fill="currentColor"
+     />
+  <path
+     d="m 288.02306,145.91847 c -59.10788,0 -107.04037,49.27666 -107.04037,110.08152 0,60.80487 47.93249,110.08154 107.04037,110.08154 59.10788,0 106.99424,-49.27667 106.99424,-110.08154 0,-60.80486 -47.88638,-110.08152 -106.99424,-110.08152 z m 16.0814,62.15988 h 12.6255 v 68.79521 h -11.33533 l -0.64498,-5.16081 c -1.34548,1.79542 -2.90167,3.23232 -4.74609,4.28531 -2.08789,1.19478 -4.53783,1.79704 -7.32647,1.79704 -2.93016,0 -5.54017,-0.61875 -7.83335,-1.84316 -2.26487,-1.22439 -4.19329,-2.95064 -5.75981,-5.16075 -1.54057,-2.21012 -2.73658,-4.80074 -3.54814,-7.78727 -0.81629,-2.98677 -1.19802,-6.24444 -1.19802,-9.76864 v -0.96766 c 0,-3.7035 0.38165,-7.02862 1.19808,-10.04511 0.81152,-3.04623 2.02517,-5.69927 3.59411,-7.87943 1.56651,-2.18015 3.51038,-3.82784 5.80591,-5.02255 2.29316,-1.19448 4.90319,-1.79706 7.83334,-1.79706 2.76028,0 5.17469,0.6026 7.23431,1.79706 1.55797,0.88938 2.89945,2.04985 4.101,3.50196 z m -68.74913,3.59413 h 8.84706 3.31767 l 23.68433,65.20108 h -13.96178 l -4.37745,-13.7314 h -22.80887 l -4.37743,13.7314 h -13.86964 z m 6.08234,15.75884 -8.01764,25.15886 h 16.08139 z m 102.93938,0.0922 c 4.09324,0 7.57337,0.63731 10.50589,1.98136 2.96081,1.3438 5.2531,3.21604 6.81964,5.57549 1.59956,2.3295 2.39607,4.98505 2.39607,7.97159 h -12.53338 c 0,-1.2544 -0.30571,-2.37805 -0.82944,-3.36373 -0.49322,-1.01541 -1.27659,-1.78262 -2.35,-2.35 -1.04746,-0.59735 -2.3728,-0.92158 -4.05493,-0.92158 -1.39669,0 -2.62573,0.27563 -3.64019,0.78332 -1.01696,0.47774 -1.80032,1.09894 -2.35002,1.93529 -0.52373,0.80638 -0.78336,1.73295 -0.78336,2.71864 0,0.7467 0.17067,1.43012 0.46059,2.02743 0.31851,0.56738 0.82219,1.08868 1.52043,1.56668 0.69589,0.47774 1.56608,0.91823 2.67255,1.33627 1.13003,0.38834 2.53933,0.73118 4.19315,1.0598 3.39962,0.71674 6.45291,1.64606 9.12354,2.81079 2.67299,1.13478 4.74624,2.6828 6.31275,4.65393 1.56885,1.94116 2.3961,4.52927 2.3961,7.6951 0,2.1502 -0.49899,4.10599 -1.42848,5.89805 -0.92715,1.79183 -2.26533,3.35596 -4.00883,4.70001 -1.74102,1.31409 -3.82725,2.34057 -6.26667,3.08727 -2.40877,0.7167 -5.08766,1.10584 -8.10982,1.10584 -4.38342,0 -8.10287,-0.82946 -11.15099,-2.44213 -3.01954,-1.6124 -5.34499,-3.64949 -6.91151,-6.12832 -1.53823,-2.50879 -2.30403,-5.06694 -2.30403,-7.69511 h 11.88825 c 0.0597,1.76211 0.52224,3.16389 1.33632,4.23922 0.84224,1.0751 1.9008,1.87202 3.17942,2.35 1.3071,0.47774 2.68559,0.69118 4.19315,0.69118 1.62561,0 2.97909,-0.19734 4.05487,-0.6451 1.07328,-0.47797 1.89248,-1.11256 2.44219,-1.88922 0.58048,-0.80638 0.87552,-1.76542 0.87552,-2.81079 0,-0.92576 -0.25941,-1.74178 -0.78314,-2.48823 -0.52139,-0.74669 -1.48267,-1.44647 -2.90294,-2.07354 -1.39434,-0.65705 -3.44006,-1.25939 -6.08238,-1.79706 -2.38281,-0.53743 -4.57571,-1.17497 -6.63529,-1.98137 -2.03371,-0.8361 -3.8352,-1.87644 -5.34513,-3.04118 -1.4816,-1.16476 -2.616,-2.51795 -3.45587,-4.10099 -0.84459,-1.61278 -1.29024,-3.46864 -1.29024,-5.52942 0,-2.0308 0.44565,-3.9219 1.29024,-5.71373 0.86826,-1.79206 2.08682,-3.37231 3.68627,-4.74609 1.62325,-1.40373 3.62266,-2.49515 5.94413,-3.27157 2.35215,-0.80638 4.993,-1.19804 7.9255,-1.19804 z m -48.42851,10.09119 c -1.6256,0 -3.0324,0.42137 -4.19313,1.19804 -1.16309,0.74647 -2.13013,1.77316 -2.85687,3.08725 -0.69589,1.3141 -1.21749,2.86211 -1.56672,4.65393 -0.31851,1.76211 -0.46059,3.65296 -0.46059,5.71374 v 0.96763 c 0,2.00109 0.17067,3.84336 0.46059,5.5755 0.32085,1.73214 0.82453,3.26404 1.52043,4.60785 0.72661,1.31409 1.63242,2.38664 2.76473,3.13334 1.16075,0.71673 2.58539,1.0598 4.23919,1.0598 2.1469,0 3.90712,-0.48907 5.29905,-1.47452 1.26421,-0.92071 2.23559,-2.19773 2.94904,-3.73236 v -19.53716 c -0.30955,-0.66741 -0.6447,-1.29308 -1.05984,-1.84313 -0.78315,-1.0751 -1.80352,-1.89091 -2.99512,-2.48825 -1.16075,-0.59735 -2.50378,-0.92157 -4.10099,-0.92157 z"
+     fill="currentColor"
+     />
+</svg>`;
+
+var adsIcon_svg = /*#__PURE__*/Object.freeze({
+    __proto__: null,
+    default: tkAdsIcon
+});
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { IconComponent };
+//# sourceMappingURL=tekus-design-system-components-icon.mjs.map