@crowdfarming/oliva-ds 1.18.0 → 1.19.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,7 +1,7 @@
1
1
  import * as i0 from '@angular/core';
2
- import { Input, Component, EventEmitter, Output, input, computed, output, signal, effect, forwardRef, ViewChild, model, HostListener, ViewChildren, Directive, HostBinding, viewChild, inject, ApplicationRef, Injector, createComponent, Injectable } from '@angular/core';
2
+ import { Input, Component, EventEmitter, Output, input, computed, output, signal, effect, forwardRef, inject, ElementRef, HostListener, ViewChild, Directive, model, ViewChildren, HostBinding, viewChild, ApplicationRef, Injector, createComponent, Injectable } from '@angular/core';
3
3
  import * as i1$1 from '@angular/common';
4
- import { CommonModule, NgClass } from '@angular/common';
4
+ import { CommonModule, NgClass, NgTemplateOutlet, NgStyle } from '@angular/common';
5
5
  import * as i1 from '@angular/platform-browser';
6
6
  import * as i2 from '@angular/forms';
7
7
  import { NG_VALUE_ACCESSOR, ReactiveFormsModule, FormsModule } from '@angular/forms';
@@ -1701,6 +1701,10 @@ const weatherNatureIcons = {
1701
1701
  'plant-regular': `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
1702
1702
  <path d="M30.9537 5.98625C30.9395 5.74161 30.8358 5.51073 30.6626 5.33744C30.4893 5.16416 30.2584 5.06054 30.0137 5.04625C23.5437 4.67125 18.3487 6.63875 16.1162 10.3237C14.6412 12.76 14.6437 15.7188 16.0962 18.5413C15.2695 19.5254 14.6653 20.6767 14.325 21.9163L12.2912 19.875C13.2687 17.8337 13.2312 15.7063 12.1662 13.9388C10.5162 11.215 6.7075 9.755 1.97875 10.0325C1.7341 10.0468 1.50322 10.1504 1.32994 10.3237C1.15666 10.497 1.05303 10.7279 1.03875 10.9725C0.759996 15.7013 2.22125 19.51 4.945 21.16C5.84383 21.7092 6.87669 21.9998 7.93 22C8.95237 21.9874 9.95884 21.7452 10.875 21.2913L14 24.4163V28C14 28.2652 14.1054 28.5196 14.2929 28.7071C14.4804 28.8946 14.7348 29 15 29C15.2652 29 15.5196 28.8946 15.7071 28.7071C15.8946 28.5196 16 28.2652 16 28V24.3137C15.9955 22.7229 16.5369 21.1786 17.5337 19.9387C18.8199 20.6109 20.2464 20.9706 21.6975 20.9888C23.1005 20.9933 24.4774 20.61 25.6762 19.8813C29.3612 17.6513 31.3337 12.4562 30.9537 5.98625ZM5.97625 19.45C4.05875 18.2888 2.97375 15.54 3 12C6.54 11.97 9.28875 13.0588 10.45 14.9762C11.0562 15.9762 11.155 17.1425 10.7575 18.3438L7.70625 15.2925C7.51718 15.1129 7.26543 15.0142 7.00467 15.0176C6.74391 15.0209 6.49477 15.126 6.31037 15.3104C6.12597 15.4948 6.0209 15.7439 6.01756 16.0047C6.01422 16.2654 6.11288 16.5172 6.2925 16.7062L9.34375 19.7575C8.1425 20.155 6.9775 20.0563 5.97625 19.45ZM24.64 18.1725C22.965 19.1863 20.9962 19.2638 18.9962 18.4225L25.7075 11.71C25.8871 11.5209 25.9858 11.2692 25.9824 11.0084C25.9791 10.7477 25.874 10.4985 25.6896 10.3141C25.5052 10.1297 25.2561 10.0246 24.9953 10.0213C24.7346 10.018 24.4828 10.1166 24.2937 10.2963L17.5812 17C16.7362 15 16.8125 13.03 17.8312 11.3562C19.5737 8.48125 23.7062 6.87875 28.9975 7.0025C29.1175 12.2925 27.5175 16.43 24.64 18.1725Z" fill="#070707"/>
1703
1703
  </svg>
1704
+ `,
1705
+ 'plant-fill': `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
1706
+ <path d="M25.6762 19.8837C24.4774 20.6125 23.1005 20.9958 21.6975 20.9912C20.5221 20.9819 19.3601 20.7415 18.2775 20.2837C17.4431 21.4616 16.9966 22.8703 17 24.3137V28C17.0003 28.1371 16.9724 28.2728 16.9181 28.3986C16.8637 28.5245 16.7841 28.6378 16.6841 28.7316C16.5841 28.8254 16.4659 28.8976 16.3368 28.9438C16.2077 28.9899 16.0705 29.0091 15.9337 29C15.6767 28.9776 15.4376 28.8589 15.2644 28.6676C15.0913 28.4764 14.9968 28.2267 15 27.9687V26.4137L10.1725 21.5862C9.45486 21.854 8.6959 21.994 7.92999 22C6.87557 22.0026 5.84091 21.7141 4.93999 21.1662C2.21624 19.5112 0.749985 15.7025 1.03374 10.9737C1.04802 10.7291 1.15164 10.4982 1.32493 10.3249C1.49821 10.1517 1.72909 10.048 1.97374 10.0337C6.70249 9.755 10.5112 11.2162 12.1612 13.94C12.8095 15.0076 13.0925 16.2573 12.9675 17.5C12.9597 17.5963 12.9242 17.6883 12.8653 17.7648C12.8064 17.8413 12.7265 17.8992 12.6354 17.9313C12.5443 17.9634 12.4459 17.9685 12.3519 17.9458C12.258 17.9232 12.1727 17.8739 12.1062 17.8037L9.70624 15.2912C9.51717 15.1116 9.26542 15.013 9.00466 15.0163C8.7439 15.0196 8.49476 15.1247 8.31036 15.3091C8.12596 15.4935 8.02088 15.7427 8.01755 16.0034C8.01421 16.2642 8.11286 16.5159 8.29248 16.705L15.0275 23.6112C15.035 23.5137 15.0437 23.4162 15.0537 23.32C15.2724 21.4659 16.0905 19.734 17.3837 18.3875L23.7075 11.705C23.8951 11.5175 24.0006 11.2632 24.0007 10.9979C24.0008 10.7327 23.8956 10.4783 23.7081 10.2906C23.5206 10.103 23.2663 9.9975 23.0011 9.99738C22.7358 9.99727 22.4814 10.1025 22.2937 10.29L16.1687 16.7675C16.1074 16.8324 16.0298 16.8798 15.944 16.9046C15.8583 16.9294 15.7674 16.9308 15.6809 16.9086C15.5944 16.8864 15.5154 16.8414 15.4521 16.7783C15.3889 16.7153 15.3437 16.6364 15.3212 16.55C14.7287 14.365 14.99 12.19 16.1212 10.3225C18.3537 6.6375 23.5487 4.665 30.0187 5.045C30.2634 5.05928 30.4943 5.16291 30.6675 5.33619C30.8408 5.50947 30.9444 5.74035 30.9587 5.985C31.3337 12.4562 29.3612 17.6512 25.6762 19.8837Z" fill="#070707"/>
1707
+ </svg>
1704
1708
  `
1705
1709
  };
1706
1710
 
@@ -1715,6 +1719,10 @@ const communicationIcons = {
1715
1719
  'megaphone-regular': `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
1716
1720
  <path d="M31 15C30.9983 13.4092 30.3657 11.884 29.2408 10.7592C28.116 9.63432 26.5908 9.00165 25 9H20.025C19.6612 8.97875 13.3225 8.5325 7.28625 3.47C6.99476 3.22519 6.63946 3.06865 6.26208 3.01877C5.88471 2.96888 5.50094 3.02773 5.15585 3.1884C4.81076 3.34906 4.51869 3.60487 4.31395 3.92577C4.1092 4.24667 4.00029 4.61934 4 5V25C4.00005 25.3808 4.10879 25.7536 4.31345 26.0747C4.5181 26.3958 4.81015 26.6518 5.15529 26.8126C5.50042 26.9734 5.88429 27.0324 6.26178 26.9825C6.63926 26.9327 6.99468 26.7761 7.28625 26.5312C12.0075 22.5712 16.9113 21.4362 19 21.1187V25.0837C18.9996 25.4133 19.0806 25.7379 19.2359 26.0286C19.3912 26.3193 19.6159 26.5671 19.89 26.75L21.265 27.6662C21.5308 27.8436 21.8352 27.9548 22.1527 27.9903C22.4703 28.0259 22.7917 27.9848 23.0901 27.8706C23.3885 27.7564 23.6553 27.5724 23.8679 27.3339C24.0806 27.0954 24.2331 26.8095 24.3125 26.5L25.7838 20.955C27.2272 20.7629 28.5517 20.0533 29.5112 18.9579C30.4706 17.8626 30.9997 16.4561 31 15ZM6 24.9912V5C11.3513 9.48875 16.8287 10.625 19 10.905V19.09C16.8313 19.375 11.355 20.5087 6 24.9912ZM22.375 25.9912V26.005L21 25.0887V21H23.7L22.375 25.9912ZM25 19H21V11H25C26.0609 11 27.0783 11.4214 27.8284 12.1716C28.5786 12.9217 29 13.9391 29 15C29 16.0609 28.5786 17.0783 27.8284 17.8284C27.0783 18.5786 26.0609 19 25 19Z" fill="#070707"/>
1717
1721
  </svg>
1722
+ `,
1723
+ 'megaphone-fill': `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
1724
+ <path d="M25 9.00001H20.025C19.6612 8.97876 13.3225 8.53251 7.28625 3.47001C6.99476 3.2252 6.63946 3.06866 6.26208 3.01877C5.88471 2.96889 5.50094 3.02774 5.15585 3.1884C4.81076 3.34907 4.51869 3.60488 4.31395 3.92578C4.1092 4.24668 4.00029 4.61935 4 5.00001V25C4.00005 25.3808 4.10879 25.7536 4.31345 26.0747C4.5181 26.3958 4.81015 26.6518 5.15529 26.8126C5.50042 26.9734 5.88429 27.0324 6.26178 26.9825C6.63926 26.9327 6.99468 26.7761 7.28625 26.5313C12.0075 22.5713 16.9113 21.4363 19 21.1188V25.0838C18.9996 25.4133 19.0806 25.7379 19.2359 26.0286C19.3912 26.3193 19.6159 26.5671 19.89 26.75L21.265 27.6663C21.5308 27.8436 21.8352 27.9548 22.1527 27.9903C22.4703 28.0259 22.7917 27.9849 23.0901 27.8706C23.3885 27.7564 23.6553 27.5724 23.8679 27.3339C24.0806 27.0955 24.2331 26.8095 24.3125 26.5L25.7838 20.955C27.3047 20.7682 28.6965 20.0065 29.6737 18.8261C30.6509 17.6458 31.1395 16.1363 31.0393 14.6073C30.939 13.0782 30.2575 11.6454 29.1346 10.6028C28.0116 9.56016 26.5323 8.98669 25 9.00001ZM22.375 25.9863V26L21 25.0838V21H23.7L22.375 25.9863ZM25 19H21V11H25C26.0609 11 27.0783 11.4214 27.8284 12.1716C28.5786 12.9217 29 13.9391 29 15C29 16.0609 28.5786 17.0783 27.8284 17.8284C27.0783 18.5786 26.0609 19 25 19Z" fill="#070707"/>
1725
+ </svg>
1718
1726
  `
1719
1727
  };
1720
1728
 
@@ -1729,6 +1737,18 @@ const mapsTravelIcons = {
1729
1737
  'mappin-regular': `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
1730
1738
  <path d="M16 8C15.0111 8 14.0444 8.29325 13.2221 8.84265C12.3999 9.39206 11.759 10.173 11.3806 11.0866C11.0022 12.0002 10.9031 13.0055 11.0961 13.9755C11.289 14.9454 11.7652 15.8363 12.4645 16.5355C13.1637 17.2348 14.0546 17.711 15.0245 17.9039C15.9945 18.0969 16.9998 17.9978 17.9134 17.6194C18.827 17.241 19.6079 16.6001 20.1573 15.7779C20.7068 14.9556 21 13.9889 21 13C21 11.6739 20.4732 10.4021 19.5355 9.46447C18.5979 8.52678 17.3261 8 16 8ZM16 16C15.4067 16 14.8266 15.8241 14.3333 15.4944C13.8399 15.1648 13.4554 14.6962 13.2284 14.1481C13.0013 13.5999 12.9419 12.9967 13.0576 12.4147C13.1734 11.8328 13.4591 11.2982 13.8787 10.8787C14.2982 10.4591 14.8328 10.1734 15.4147 10.0576C15.9967 9.94189 16.5999 10.0013 17.1481 10.2284C17.6962 10.4554 18.1648 10.8399 18.4944 11.3333C18.8241 11.8266 19 12.4067 19 13C19 13.7956 18.6839 14.5587 18.1213 15.1213C17.5587 15.6839 16.7956 16 16 16ZM16 2C13.0836 2.00331 10.2877 3.1633 8.22548 5.22548C6.1633 7.28766 5.00331 10.0836 5 13C5 16.925 6.81375 21.085 10.25 25.0312C11.794 26.8145 13.5318 28.4202 15.4312 29.8188C15.5994 29.9365 15.7997 29.9997 16.005 29.9997C16.2103 29.9997 16.4106 29.9365 16.5788 29.8188C18.4747 28.4196 20.2091 26.8139 21.75 25.0312C25.1812 21.085 27 16.925 27 13C26.9967 10.0836 25.8367 7.28766 23.7745 5.22548C21.7123 3.1633 18.9164 2.00331 16 2ZM16 27.75C13.9338 26.125 7 20.1562 7 13C7 10.6131 7.94821 8.32387 9.63604 6.63604C11.3239 4.94821 13.6131 4 16 4C18.3869 4 20.6761 4.94821 22.364 6.63604C24.0518 8.32387 25 10.6131 25 13C25 20.1537 18.0662 26.125 16 27.75Z" fill="#070707"/>
1731
1739
  </svg>
1740
+ `,
1741
+ 'mappin-fill': `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
1742
+ <path d="M16 2C13.0836 2.00331 10.2877 3.1633 8.22548 5.22548C6.1633 7.28766 5.00331 10.0836 5 13C5 22.4125 15 29.5212 15.4263 29.8188C15.5944 29.9365 15.7947 29.9997 16 29.9997C16.2053 29.9997 16.4056 29.9365 16.5737 29.8188C17 29.5212 27 22.4125 27 13C26.9967 10.0836 25.8367 7.28766 23.7745 5.22548C21.7123 3.1633 18.9164 2.00331 16 2ZM16 9C16.7911 9 17.5645 9.2346 18.2223 9.67412C18.8801 10.1136 19.3928 10.7384 19.6955 11.4693C19.9983 12.2002 20.0775 13.0044 19.9231 13.7804C19.7688 14.5563 19.3878 15.269 18.8284 15.8284C18.269 16.3878 17.5563 16.7688 16.7804 16.9231C16.0044 17.0775 15.2002 16.9983 14.4693 16.6955C13.7384 16.3928 13.1136 15.8801 12.6741 15.2223C12.2346 14.5645 12 13.7911 12 13C12 11.9391 12.4214 10.9217 13.1716 10.1716C13.9217 9.42143 14.9391 9 16 9Z" fill="#070707"/>
1743
+ </svg>
1744
+ `,
1745
+ 'house-regular': `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
1746
+ <path d="M27.4138 13.585L17.4138 3.585C17.0387 3.21021 16.5302 2.99968 16 2.99968C15.4698 2.99968 14.9613 3.21021 14.5863 3.585L4.58626 13.585C4.39964 13.7702 4.25171 13.9907 4.15107 14.2336C4.05042 14.4766 3.99908 14.7371 4.00001 15V27C4.00001 27.2652 4.10537 27.5196 4.29291 27.7071C4.48044 27.8946 4.7348 28 5.00001 28H13C13.2652 28 13.5196 27.8946 13.7071 27.7071C13.8947 27.5196 14 27.2652 14 27V20H18V27C18 27.2652 18.1054 27.5196 18.2929 27.7071C18.4804 27.8946 18.7348 28 19 28H27C27.2652 28 27.5196 27.8946 27.7071 27.7071C27.8947 27.5196 28 27.2652 28 27V15C28.0009 14.7371 27.9496 14.4766 27.849 14.2336C27.7483 13.9907 27.6004 13.7702 27.4138 13.585ZM26 26H20V19C20 18.7348 19.8947 18.4804 19.7071 18.2929C19.5196 18.1054 19.2652 18 19 18H13C12.7348 18 12.4804 18.1054 12.2929 18.2929C12.1054 18.4804 12 18.7348 12 19V26H6.00001V15L16 5L26 15V26Z" fill="#070707"/>
1747
+ </svg>
1748
+ `,
1749
+ 'house-fill': `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
1750
+ <path d="M28 15V27C28 27.2652 27.8946 27.5196 27.7071 27.7071C27.5196 27.8946 27.2652 28 27 28H20C19.7348 28 19.4804 27.8946 19.2929 27.7071C19.1054 27.5196 19 27.2652 19 27V20.5C19 20.3674 18.9473 20.2402 18.8536 20.1465C18.7598 20.0527 18.6326 20 18.5 20H13.5C13.3674 20 13.2402 20.0527 13.1464 20.1465C13.0527 20.2402 13 20.3674 13 20.5V27C13 27.2652 12.8946 27.5196 12.7071 27.7071C12.5196 27.8946 12.2652 28 12 28H5C4.73478 28 4.48043 27.8946 4.29289 27.7071C4.10536 27.5196 4 27.2652 4 27V15C4.00025 14.4697 4.21112 13.9611 4.58625 13.5863L14.5863 3.58625C14.9613 3.21146 15.4698 3.00093 16 3.00093C16.5302 3.00093 17.0387 3.21146 17.4137 3.58625L27.4137 13.5863C27.7889 13.9611 27.9998 14.4697 28 15Z" fill="#070707"/>
1751
+ </svg>
1732
1752
  `
1733
1753
  };
1734
1754
 
@@ -1807,7 +1827,24 @@ const designIcons = {
1807
1827
  // Auto-generated icons from Figma
1808
1828
  // This file is automatically generated by the icons.js script
1809
1829
  // Do not edit manually
1810
- const brandsIcons = {};
1830
+ const brandsIcons = {
1831
+ 'facebooklogo': `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
1832
+ <path d="M16 3C13.4288 3 10.9154 3.76244 8.77759 5.1909C6.63975 6.61935 4.97351 8.64968 3.98957 11.0251C3.00563 13.4006 2.74819 16.0144 3.2498 18.5362C3.75141 21.0579 4.98953 23.3743 6.80762 25.1924C8.6257 27.0105 10.9421 28.2486 13.4638 28.7502C15.9856 29.2518 18.5995 28.9944 20.9749 28.0104C23.3503 27.0265 25.3807 25.3603 26.8091 23.2224C28.2376 21.0846 29 18.5712 29 16C28.9964 12.5533 27.6256 9.24882 25.1884 6.81163C22.7512 4.37445 19.4467 3.00364 16 3ZM17 26.9538V19H20C20.2652 19 20.5196 18.8946 20.7071 18.7071C20.8946 18.5196 21 18.2652 21 18C21 17.7348 20.8946 17.4804 20.7071 17.2929C20.5196 17.1054 20.2652 17 20 17H17V14C17 13.4696 17.2107 12.9609 17.5858 12.5858C17.9609 12.2107 18.4696 12 19 12H21C21.2652 12 21.5196 11.8946 21.7071 11.7071C21.8946 11.5196 22 11.2652 22 11C22 10.7348 21.8946 10.4804 21.7071 10.2929C21.5196 10.1054 21.2652 10 21 10H19C17.9391 10 16.9217 10.4214 16.1716 11.1716C15.4214 11.9217 15 12.9391 15 14V17H12C11.7348 17 11.4804 17.1054 11.2929 17.2929C11.1054 17.4804 11 17.7348 11 18C11 18.2652 11.1054 18.5196 11.2929 18.7071C11.4804 18.8946 11.7348 19 12 19H15V26.9538C12.181 26.6964 9.56971 25.3622 7.7093 23.2287C5.8489 21.0952 4.8826 18.3266 5.0114 15.4988C5.1402 12.671 6.35419 10.0017 8.40085 8.04613C10.4475 6.09057 13.1693 4.9993 16 4.9993C18.8307 4.9993 21.5525 6.09057 23.5992 8.04613C25.6458 10.0017 26.8598 12.671 26.9886 15.4988C27.1174 18.3266 26.1511 21.0952 24.2907 23.2287C22.4303 25.3622 19.819 26.6964 17 26.9538Z" fill="#070707"/>
1833
+ </svg>
1834
+ `,
1835
+ 'instagramlogo': `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
1836
+ <path d="M16 10C14.8133 10 13.6533 10.3519 12.6666 11.0112C11.6799 11.6705 10.9108 12.6075 10.4567 13.7039C10.0026 14.8003 9.88378 16.0067 10.1153 17.1705C10.3468 18.3344 10.9182 19.4035 11.7574 20.2426C12.5965 21.0818 13.6656 21.6532 14.8295 21.8847C15.9933 22.1162 17.1997 21.9974 18.2961 21.5433C19.3925 21.0892 20.3295 20.3201 20.9888 19.3334C21.6481 18.3467 22 17.1867 22 16C21.9983 14.4092 21.3657 12.884 20.2408 11.7592C19.116 10.6343 17.5908 10.0017 16 10ZM16 20C15.2089 20 14.4355 19.7654 13.7777 19.3259C13.1199 18.8864 12.6072 18.2616 12.3045 17.5307C12.0017 16.7998 11.9225 15.9956 12.0769 15.2196C12.2312 14.4437 12.6122 13.731 13.1716 13.1716C13.731 12.6122 14.4437 12.2312 15.2196 12.0769C15.9956 11.9225 16.7998 12.0017 17.5307 12.3045C18.2616 12.6072 18.8864 13.1199 19.3259 13.7777C19.7654 14.4355 20 15.2089 20 16C20 17.0609 19.5786 18.0783 18.8284 18.8284C18.0783 19.5786 17.0609 20 16 20ZM22 3H10C8.14409 3.00199 6.36477 3.74012 5.05245 5.05245C3.74012 6.36477 3.00199 8.14409 3 10V22C3.00199 23.8559 3.74012 25.6352 5.05245 26.9476C6.36477 28.2599 8.14409 28.998 10 29H22C23.8559 28.998 25.6352 28.2599 26.9476 26.9476C28.2599 25.6352 28.998 23.8559 29 22V10C28.998 8.14409 28.2599 6.36477 26.9476 5.05245C25.6352 3.74012 23.8559 3.00199 22 3ZM27 22C27 23.3261 26.4732 24.5979 25.5355 25.5355C24.5979 26.4732 23.3261 27 22 27H10C8.67392 27 7.40215 26.4732 6.46447 25.5355C5.52678 24.5979 5 23.3261 5 22V10C5 8.67392 5.52678 7.40215 6.46447 6.46447C7.40215 5.52678 8.67392 5 10 5H22C23.3261 5 24.5979 5.52678 25.5355 6.46447C26.4732 7.40215 27 8.67392 27 10V22ZM24 9.5C24 9.79667 23.912 10.0867 23.7472 10.3334C23.5824 10.58 23.3481 10.7723 23.074 10.8858C22.7999 10.9994 22.4983 11.0291 22.2074 10.9712C21.9164 10.9133 21.6491 10.7704 21.4393 10.5607C21.2296 10.3509 21.0867 10.0836 21.0288 9.79264C20.9709 9.50166 21.0007 9.20006 21.1142 8.92597C21.2277 8.65189 21.42 8.41762 21.6666 8.2528C21.9133 8.08797 22.2033 8 22.5 8C22.8978 8 23.2794 8.15804 23.5607 8.43934C23.842 8.72064 24 9.10218 24 9.5Z" fill="#070707"/>
1837
+ </svg>
1838
+ `,
1839
+ 'xlogo': `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
1840
+ <path d="M26.8438 26.4638L19.0188 14.1663L26.74 5.6725C26.9146 5.47565 27.0046 5.21791 26.9905 4.95515C26.9764 4.69239 26.8592 4.44579 26.6645 4.26882C26.4698 4.09185 26.2131 3.99876 25.9502 4.00974C25.6873 4.02073 25.4393 4.1349 25.26 4.3275L17.905 12.4175L12.8438 4.46375C12.7535 4.32169 12.6289 4.20471 12.4814 4.12365C12.3339 4.04258 12.1683 4.00005 12 4H6.00001C5.82071 3.99991 5.64468 4.04803 5.49037 4.13932C5.33605 4.23062 5.20911 4.36172 5.12285 4.5189C5.03659 4.67609 4.99418 4.85357 5.00006 5.03278C5.00593 5.21198 5.05988 5.3863 5.15626 5.5375L12.9813 17.8337L5.26001 26.3337C5.16984 26.4306 5.09979 26.5444 5.05393 26.6685C5.00806 26.7927 4.98729 26.9247 4.99282 27.0569C4.99834 27.1891 5.03005 27.3189 5.08611 27.4388C5.14217 27.5586 5.22146 27.6662 5.3194 27.7552C5.41733 27.8442 5.53195 27.9129 5.65662 27.9572C5.78129 28.0016 5.91352 28.0208 6.04566 28.0137C6.1778 28.0066 6.30722 27.9733 6.42641 27.9158C6.5456 27.8583 6.65219 27.7777 6.74001 27.6787L14.095 19.5888L19.1563 27.5425C19.2472 27.6834 19.3722 27.7991 19.5197 27.8791C19.6671 27.959 19.8323 28.0006 20 28H26C26.1791 27.9999 26.3549 27.9518 26.509 27.8606C26.6632 27.7693 26.79 27.6384 26.8762 27.4814C26.9624 27.3244 27.0049 27.1472 26.9992 26.9681C26.9935 26.7891 26.9398 26.6149 26.8438 26.4638ZM20.5488 26L7.82126 6H11.4463L24.1788 26H20.5488Z" fill="#070707"/>
1841
+ </svg>
1842
+ `,
1843
+ 'youtubelogo': `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
1844
+ <path d="M20.555 15.1675L14.555 11.1675C14.4044 11.067 14.2293 11.0093 14.0484 11.0005C13.8675 10.9918 13.6877 11.0323 13.528 11.1177C13.3684 11.2032 13.2349 11.3304 13.1419 11.4858C13.0489 11.6412 12.9999 11.8189 13 12V20C12.9999 20.1811 13.0489 20.3588 13.1419 20.5142C13.2349 20.6696 13.3684 20.7968 13.528 20.8823C13.6877 20.9677 13.8675 21.0082 14.0484 20.9995C14.2293 20.9907 14.4044 20.933 14.555 20.8325L20.555 16.8325C20.6922 16.7412 20.8047 16.6175 20.8825 16.4722C20.9603 16.327 21.001 16.1648 21.001 16C21.001 15.8352 20.9603 15.673 20.8825 15.5278C20.8047 15.3826 20.6922 15.2588 20.555 15.1675ZM15 18.1313V13.875L18.1975 16L15 18.1313ZM29.2913 8.69C29.1735 8.22919 28.9478 7.80298 28.6329 7.44654C28.318 7.09011 27.9228 6.81366 27.48 6.64C23.195 4.985 16.375 5 16 5C15.625 5 8.805 4.985 4.52 6.64C4.0772 6.81366 3.68204 7.09011 3.36712 7.44654C3.05219 7.80298 2.82653 8.22919 2.70875 8.69C2.385 9.9375 2 12.2175 2 16C2 19.7825 2.385 22.0625 2.70875 23.31C2.82636 23.771 3.05194 24.1975 3.36687 24.5542C3.68181 24.9108 4.07706 25.1875 4.52 25.3613C8.625 26.945 15.05 27 15.9175 27H16.0825C16.95 27 23.3787 26.945 27.48 25.3613C27.9229 25.1875 28.3182 24.9108 28.6331 24.5542C28.9481 24.1975 29.1736 23.771 29.2913 23.31C29.615 22.06 30 19.7825 30 16C30 12.2175 29.615 9.9375 29.2913 8.69ZM27.355 22.815C27.3169 22.9684 27.243 23.1105 27.1394 23.2298C27.0357 23.3491 26.9053 23.4421 26.7588 23.5013C22.8025 25.0288 16.0738 25.0013 16.0088 25.0013H16C15.9325 25.0013 9.20875 25.0263 5.25 23.5013C5.10346 23.4421 4.97303 23.3491 4.86938 23.2298C4.76574 23.1105 4.69184 22.9684 4.65375 22.815C4.35 21.6738 4 19.5713 4 16C4 12.4288 4.35 10.3263 4.645 9.19125C4.68239 9.03698 4.75596 8.89382 4.85965 8.77362C4.96333 8.65342 5.09413 8.55963 5.24125 8.5C9.05625 7.02625 15.4487 7 15.9725 7H16.0063C16.0738 7 22.8038 6.9775 26.7563 8.5C26.9028 8.55915 27.0332 8.65217 27.1369 8.77146C27.2405 8.89074 27.3144 9.03289 27.3525 9.18625C27.65 10.3263 28 12.4288 28 16C28 19.5713 27.65 21.6738 27.355 22.8088V22.815Z" fill="#070707"/>
1845
+ </svg>
1846
+ `
1847
+ };
1811
1848
 
1812
1849
  // Auto-generated icons from Figma
1813
1850
  // This file is automatically generated by the icons.js script
@@ -1829,13 +1866,17 @@ const systemDevicesIcons = {
1829
1866
  'magnifyingglass-regular': `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
1830
1867
  <path d="M28.7075 27.2925L22.4488 21.035C24.2628 18.8571 25.1674 16.0637 24.9743 13.2359C24.7813 10.4081 23.5054 7.76357 21.4122 5.85246C19.319 3.94135 16.5696 2.91081 13.7359 2.97521C10.9023 3.03961 8.20249 4.194 6.19827 6.19822C4.19404 8.20245 3.03966 10.9022 2.97526 13.7359C2.91086 16.5695 3.9414 19.319 5.85251 21.4122C7.76361 23.5054 10.4081 24.7812 13.236 24.9743C16.0638 25.1674 18.8572 24.2628 21.035 22.4487L27.2925 28.7075C27.3855 28.8004 27.4958 28.8741 27.6171 28.9244C27.7385 28.9747 27.8686 29.0006 28 29.0006C28.1314 29.0006 28.2615 28.9747 28.3829 28.9244C28.5043 28.8741 28.6146 28.8004 28.7075 28.7075C28.8005 28.6146 28.8742 28.5043 28.9244 28.3829C28.9747 28.2615 29.0006 28.1314 29.0006 28C29.0006 27.8686 28.9747 27.7385 28.9244 27.6171C28.8742 27.4957 28.8005 27.3854 28.7075 27.2925ZM5.00004 14C5.00004 12.22 5.52788 10.4799 6.51681 8.99986C7.50575 7.51982 8.91136 6.36627 10.5559 5.68508C12.2004 5.00389 14.01 4.82566 15.7559 5.17293C17.5017 5.52019 19.1053 6.37736 20.364 7.63603C21.6227 8.89471 22.4798 10.4984 22.8271 12.2442C23.1744 13.99 22.9961 15.7996 22.315 17.4441C21.6338 19.0887 20.4802 20.4943 19.0002 21.4832C17.5201 22.4722 15.7801 23 14 23C11.6139 22.9973 9.32626 22.0483 7.639 20.361C5.95175 18.6738 5.00269 16.3861 5.00004 14Z" fill="#070707"/>
1831
1868
  </svg>
1869
+ `,
1870
+ 'magnifyingglass-fill': `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
1871
+ <path d="M21 14C21 15.3845 20.5895 16.7379 19.8203 17.889C19.0512 19.0401 17.9579 19.9373 16.6788 20.4672C15.3997 20.997 13.9923 21.1356 12.6344 20.8655C11.2765 20.5954 10.0293 19.9287 9.05029 18.9497C8.07132 17.9708 7.40464 16.7235 7.13454 15.3656C6.86444 14.0078 7.00307 12.6003 7.53288 11.3212C8.0627 10.0421 8.9599 8.94888 10.111 8.17971C11.2622 7.41054 12.6156 7 14 7C15.8566 7 17.637 7.7375 18.9498 9.05025C20.2625 10.363 21 12.1435 21 14ZM28.7075 28.7075C28.6147 28.8005 28.5044 28.8742 28.383 28.9246C28.2616 28.9749 28.1315 29.0008 28 29.0008C27.8686 29.0008 27.7385 28.9749 27.6171 28.9246C27.4957 28.8742 27.3854 28.8005 27.2925 28.7075L21.035 22.4488C18.8589 24.2591 16.0687 25.1609 13.2446 24.9665C10.4206 24.7721 7.78018 23.4965 5.87265 21.4051C3.96511 19.3136 2.93729 16.5672 3.00296 13.7373C3.06864 10.9073 4.22276 8.21162 6.22527 6.21088C8.22777 4.21015 10.9245 3.05841 13.7545 2.99524C16.5845 2.93206 19.33 3.96231 21.4197 5.8717C23.5095 7.78108 24.7828 10.4226 24.9747 13.2468C25.1666 16.071 24.2623 18.8605 22.45 21.035L28.7075 27.2925C28.8005 27.3854 28.8743 27.4957 28.9246 27.6171C28.9749 27.7385 29.0008 27.8686 29.0008 28C29.0008 28.1314 28.9749 28.2615 28.9246 28.3829C28.8743 28.5043 28.8005 28.6146 28.7075 28.7075ZM14 23C15.7801 23 17.5201 22.4722 19.0002 21.4832C20.4802 20.4943 21.6338 19.0887 22.315 17.4442C22.9961 15.7996 23.1744 13.99 22.8271 12.2442C22.4798 10.4984 21.6227 8.89471 20.364 7.63604C19.1053 6.37737 17.5017 5.5202 15.7559 5.17293C14.01 4.82567 12.2004 5.0039 10.5559 5.68509C8.91135 6.36628 7.50575 7.51983 6.51681 8.99987C5.52788 10.4799 5.00004 12.22 5.00004 14C5.00269 16.3861 5.95175 18.6738 7.639 20.361C9.32625 22.0483 11.6139 22.9974 14 23Z" fill="#070707"/>
1872
+ </svg>
1832
1873
  `,
1833
1874
  'uploadsimple-regular': `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
1834
1875
  <path d="M28 18V26C28 26.2652 27.8946 26.5196 27.7071 26.7071C27.5196 26.8946 27.2652 27 27 27H5C4.73478 27 4.48043 26.8946 4.29289 26.7071C4.10536 26.5196 4 26.2652 4 26V18C4 17.7348 4.10536 17.4804 4.29289 17.2929C4.48043 17.1053 4.73478 17 5 17C5.26522 17 5.51957 17.1053 5.70711 17.2929C5.89464 17.4804 6 17.7348 6 18V25H26V18C26 17.7348 26.1054 17.4804 26.2929 17.2929C26.4804 17.1053 26.7348 17 27 17C27.2652 17 27.5196 17.1053 27.7071 17.2929C27.8946 17.4804 28 17.7348 28 18ZM11.7075 9.70749L15 6.41374V18C15 18.2652 15.1054 18.5196 15.2929 18.7071C15.4804 18.8946 15.7348 19 16 19C16.2652 19 16.5196 18.8946 16.7071 18.7071C16.8946 18.5196 17 18.2652 17 18V6.41374L20.2925 9.70749C20.4801 9.89513 20.7346 10.0005 21 10.0005C21.2654 10.0005 21.5199 9.89513 21.7075 9.70749C21.8951 9.51985 22.0006 9.26536 22.0006 8.99999C22.0006 8.73463 21.8951 8.48013 21.7075 8.29249L16.7075 3.29249C16.6146 3.19952 16.5043 3.12576 16.3829 3.07543C16.2615 3.02511 16.1314 2.99921 16 2.99921C15.8686 2.99921 15.7385 3.02511 15.6171 3.07543C15.4957 3.12576 15.3854 3.19952 15.2925 3.29249L10.2925 8.29249C10.1049 8.48013 9.99944 8.73463 9.99944 8.99999C9.99944 9.26536 10.1049 9.51985 10.2925 9.70749C10.4801 9.89513 10.7346 10.0005 11 10.0005C11.2654 10.0005 11.5199 9.89513 11.7075 9.70749Z" fill="#070707"/>
1835
1876
  </svg>
1836
1877
  `,
1837
1878
  'dotsthree-regular': `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
1838
- <path d="M17.5 16C17.5 16.2967 17.412 16.5867 17.2472 16.8334C17.0824 17.08 16.8481 17.2723 16.574 17.3858C16.2999 17.4993 15.9983 17.5291 15.7074 17.4712C15.4164 17.4133 15.1491 17.2704 14.9393 17.0607C14.7296 16.8509 14.5867 16.5836 14.5288 16.2926C14.4709 16.0017 14.5007 15.7001 14.6142 15.426C14.7277 15.1519 14.92 14.9176 15.1666 14.7528C15.4133 14.588 15.7033 14.5 16 14.5C16.3978 14.5 16.7794 14.658 17.0607 14.9393C17.342 15.2206 17.5 15.6022 17.5 16ZM24.5 14.5C24.2033 14.5 23.9133 14.588 23.6666 14.7528C23.42 14.9176 23.2277 15.1519 23.1142 15.426C23.0007 15.7001 22.9709 16.0017 23.0288 16.2926C23.0867 16.5836 23.2296 16.8509 23.4393 17.0607C23.6491 17.2704 23.9164 17.4133 24.2074 17.4712C24.4983 17.5291 24.7999 17.4993 25.074 17.3858C25.3481 17.2723 25.5824 17.08 25.7472 16.8334C25.912 16.5867 26 16.2967 26 16C26 15.6022 25.842 15.2206 25.5607 14.9393C25.2794 14.658 24.8978 14.5 24.5 14.5ZM7.5 14.5C7.20333 14.5 6.91332 14.588 6.66665 14.7528C6.41997 14.9176 6.22771 15.1519 6.11418 15.426C6.00065 15.7001 5.97094 16.0017 6.02882 16.2926C6.0867 16.5836 6.22956 16.8509 6.43934 17.0607C6.64912 17.2704 6.91639 17.4133 7.20737 17.4712C7.49834 17.5291 7.79994 17.4993 8.07403 17.3858C8.34811 17.2723 8.58238 17.08 8.74721 16.8334C8.91203 16.5867 9 16.2967 9 16C9 15.6022 8.84197 15.2206 8.56066 14.9393C8.27936 14.658 7.89783 14.5 7.5 14.5Z" fill="#070707"/>
1879
+ <path d="M18 16C18 16.3956 17.8827 16.7822 17.6629 17.1111C17.4432 17.44 17.1308 17.6964 16.7654 17.8478C16.3999 17.9991 15.9978 18.0387 15.6098 17.9616C15.2219 17.8844 14.8655 17.6939 14.5858 17.4142C14.3061 17.1345 14.1156 16.7781 14.0384 16.3902C13.9613 16.0022 14.0009 15.6001 14.1522 15.2346C14.3036 14.8692 14.56 14.5568 14.8889 14.3371C15.2178 14.1173 15.6044 14 16 14C16.5304 14 17.0391 14.2107 17.4142 14.5858C17.7893 14.9609 18 15.4696 18 16ZM7.5 14C7.10444 14 6.71776 14.1173 6.38886 14.3371C6.05996 14.5568 5.80362 14.8692 5.65224 15.2346C5.50087 15.6001 5.46126 16.0022 5.53843 16.3902C5.6156 16.7781 5.80608 17.1345 6.08579 17.4142C6.36549 17.6939 6.72186 17.8844 7.10982 17.9616C7.49778 18.0387 7.89992 17.9991 8.26537 17.8478C8.63082 17.6964 8.94318 17.44 9.16294 17.1111C9.3827 16.7822 9.5 16.3956 9.5 16C9.5 15.4696 9.28929 14.9609 8.91421 14.5858C8.53914 14.2107 8.03043 14 7.5 14ZM24.5 14C24.1044 14 23.7178 14.1173 23.3889 14.3371C23.06 14.5568 22.8036 14.8692 22.6522 15.2346C22.5009 15.6001 22.4613 16.0022 22.5384 16.3902C22.6156 16.7781 22.8061 17.1345 23.0858 17.4142C23.3655 17.6939 23.7219 17.8844 24.1098 17.9616C24.4978 18.0387 24.8999 17.9991 25.2654 17.8478C25.6308 17.6964 25.9432 17.44 26.1629 17.1111C26.3827 16.7822 26.5 16.3956 26.5 16C26.5 15.4696 26.2893 14.9609 25.9142 14.5858C25.5391 14.2107 25.0304 14 24.5 14Z" fill="black"/>
1839
1880
  </svg>
1840
1881
  `,
1841
1882
  'signout-regular': `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
@@ -1901,6 +1942,14 @@ const officeEditingIcons = {
1901
1942
  'notepad-fill': `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
1902
1943
  <path d="M26 4H23V3C23 2.73478 22.8946 2.48043 22.7071 2.29289C22.5196 2.10536 22.2652 2 22 2C21.7348 2 21.4804 2.10536 21.2929 2.29289C21.1054 2.48043 21 2.73478 21 3V4H17V3C17 2.73478 16.8946 2.48043 16.7071 2.29289C16.5196 2.10536 16.2652 2 16 2C15.7348 2 15.4804 2.10536 15.2929 2.29289C15.1054 2.48043 15 2.73478 15 3V4H11V3C11 2.73478 10.8946 2.48043 10.7071 2.29289C10.5196 2.10536 10.2652 2 10 2C9.73478 2 9.48043 2.10536 9.29289 2.29289C9.10536 2.48043 9 2.73478 9 3V4H6C5.73478 4 5.48043 4.10536 5.29289 4.29289C5.10536 4.48043 5 4.73478 5 5V25C5 26.0609 5.42143 27.0783 6.17157 27.8284C6.92172 28.5786 7.93913 29 9 29H23C24.0609 29 25.0783 28.5786 25.8284 27.8284C26.5786 27.0783 27 26.0609 27 25V5C27 4.73478 26.8946 4.48043 26.7071 4.29289C26.5196 4.10536 26.2652 4 26 4ZM15 7C15 6.73478 15.1054 6.48043 15.2929 6.29289C15.4804 6.10536 15.7348 6 16 6C16.2652 6 16.5196 6.10536 16.7071 6.29289C16.8946 6.48043 17 6.73478 17 7V8C17 8.26522 16.8946 8.51957 16.7071 8.70711C16.5196 8.89464 16.2652 9 16 9C15.7348 9 15.4804 8.89464 15.2929 8.70711C15.1054 8.51957 15 8.26522 15 8V7ZM10 9C9.73478 9 9.48043 8.89464 9.29289 8.70711C9.10536 8.51957 9 8.26522 9 8V7C9 6.73478 9.10536 6.48043 9.29289 6.29289C9.48043 6.10536 9.73478 6 10 6C10.2652 6 10.5196 6.10536 10.7071 6.29289C10.8946 6.48043 11 6.73478 11 7V8C11 8.26522 10.8946 8.51957 10.7071 8.70711C10.5196 8.89464 10.2652 9 10 9ZM20 21H12C11.7348 21 11.4804 20.8946 11.2929 20.7071C11.1054 20.5196 11 20.2652 11 20C11 19.7348 11.1054 19.4804 11.2929 19.2929C11.4804 19.1054 11.7348 19 12 19H20C20.2652 19 20.5196 19.1054 20.7071 19.2929C20.8946 19.4804 21 19.7348 21 20C21 20.2652 20.8946 20.5196 20.7071 20.7071C20.5196 20.8946 20.2652 21 20 21ZM20 17H12C11.7348 17 11.4804 16.8946 11.2929 16.7071C11.1054 16.5196 11 16.2652 11 16C11 15.7348 11.1054 15.4804 11.2929 15.2929C11.4804 15.1054 11.7348 15 12 15H20C20.2652 15 20.5196 15.1054 20.7071 15.2929C20.8946 15.4804 21 15.7348 21 16C21 16.2652 20.8946 16.5196 20.7071 16.7071C20.5196 16.8946 20.2652 17 20 17ZM23 8C23 8.26522 22.8946 8.51957 22.7071 8.70711C22.5196 8.89464 22.2652 9 22 9C21.7348 9 21.4804 8.89464 21.2929 8.70711C21.1054 8.51957 21 8.26522 21 8V7C21 6.73478 21.1054 6.48043 21.2929 6.29289C21.4804 6.10536 21.7348 6 22 6C22.2652 6 22.5196 6.10536 22.7071 6.29289C22.8946 6.48043 23 6.73478 23 7V8Z" fill="#070707"/>
1903
1944
  </svg>
1945
+ `,
1946
+ 'list-regular': `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
1947
+ <path d="M28 16C28 16.2652 27.8946 16.5196 27.7071 16.7071C27.5196 16.8946 27.2652 17 27 17H5C4.73478 17 4.48043 16.8946 4.29289 16.7071C4.10536 16.5196 4 16.2652 4 16C4 15.7348 4.10536 15.4804 4.29289 15.2929C4.48043 15.1054 4.73478 15 5 15H27C27.2652 15 27.5196 15.1054 27.7071 15.2929C27.8946 15.4804 28 15.7348 28 16ZM5 9H27C27.2652 9 27.5196 8.89464 27.7071 8.70711C27.8946 8.51957 28 8.26522 28 8C28 7.73478 27.8946 7.48043 27.7071 7.29289C27.5196 7.10536 27.2652 7 27 7H5C4.73478 7 4.48043 7.10536 4.29289 7.29289C4.10536 7.48043 4 7.73478 4 8C4 8.26522 4.10536 8.51957 4.29289 8.70711C4.48043 8.89464 4.73478 9 5 9ZM27 23H5C4.73478 23 4.48043 23.1054 4.29289 23.2929C4.10536 23.4804 4 23.7348 4 24C4 24.2652 4.10536 24.5196 4.29289 24.7071C4.48043 24.8946 4.73478 25 5 25H27C27.2652 25 27.5196 24.8946 27.7071 24.7071C27.8946 24.5196 28 24.2652 28 24C28 23.7348 27.8946 23.4804 27.7071 23.2929C27.5196 23.1054 27.2652 23 27 23Z" fill="#070707"/>
1948
+ </svg>
1949
+ `,
1950
+ 'list-fill': `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
1951
+ <path d="M26 4H6C5.46957 4 4.96086 4.21071 4.58579 4.58579C4.21071 4.96086 4 5.46957 4 6V26C4 26.5304 4.21071 27.0391 4.58579 27.4142C4.96086 27.7893 5.46957 28 6 28H26C26.5304 28 27.0391 27.7893 27.4142 27.4142C27.7893 27.0391 28 26.5304 28 26V6C28 5.46957 27.7893 4.96086 27.4142 4.58579C27.0391 4.21071 26.5304 4 26 4ZM24 23H8C7.73478 23 7.48043 22.8946 7.29289 22.7071C7.10536 22.5196 7 22.2652 7 22C7 21.7348 7.10536 21.4804 7.29289 21.2929C7.48043 21.1054 7.73478 21 8 21H24C24.2652 21 24.5196 21.1054 24.7071 21.2929C24.8946 21.4804 25 21.7348 25 22C25 22.2652 24.8946 22.5196 24.7071 22.7071C24.5196 22.8946 24.2652 23 24 23ZM24 17H8C7.73478 17 7.48043 16.8946 7.29289 16.7071C7.10536 16.5196 7 16.2652 7 16C7 15.7348 7.10536 15.4804 7.29289 15.2929C7.48043 15.1054 7.73478 15 8 15H24C24.2652 15 24.5196 15.1054 24.7071 15.2929C24.8946 15.4804 25 15.7348 25 16C25 16.2652 24.8946 16.5196 24.7071 16.7071C24.5196 16.8946 24.2652 17 24 17ZM24 11H8C7.73478 11 7.48043 10.8946 7.29289 10.7071C7.10536 10.5196 7 10.2652 7 10C7 9.73478 7.10536 9.48043 7.29289 9.29289C7.48043 9.10536 7.73478 9 8 9H24C24.2652 9 24.5196 9.10536 24.7071 9.29289C24.8946 9.48043 25 9.73478 25 10C25 10.2652 24.8946 10.5196 24.7071 10.7071C24.5196 10.8946 24.2652 11 24 11Z" fill="#070707"/>
1952
+ </svg>
1904
1953
  `
1905
1954
  };
1906
1955
 
@@ -1911,14 +1960,26 @@ const commerceIcons = {
1911
1960
  'shoppingbagopen-regular': `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
1912
1961
  <path d="M27 5H5C4.46957 5 3.96086 5.21071 3.58579 5.58579C3.21071 5.96086 3 6.46957 3 7V25C3 25.5304 3.21071 26.0391 3.58579 26.4142C3.96086 26.7893 4.46957 27 5 27H27C27.5304 27 28.0391 26.7893 28.4142 26.4142C28.7893 26.0391 29 25.5304 29 25V7C29 6.46957 28.7893 5.96086 28.4142 5.58579C28.0391 5.21071 27.5304 5 27 5ZM27 7V9H5V7H27ZM27 25H5V11H27V25ZM22 14C22 15.5913 21.3679 17.1174 20.2426 18.2426C19.1174 19.3679 17.5913 20 16 20C14.4087 20 12.8826 19.3679 11.7574 18.2426C10.6321 17.1174 10 15.5913 10 14C10 13.7348 10.1054 13.4804 10.2929 13.2929C10.4804 13.1054 10.7348 13 11 13C11.2652 13 11.5196 13.1054 11.7071 13.2929C11.8946 13.4804 12 13.7348 12 14C12 15.0609 12.4214 16.0783 13.1716 16.8284C13.9217 17.5786 14.9391 18 16 18C17.0609 18 18.0783 17.5786 18.8284 16.8284C19.5786 16.0783 20 15.0609 20 14C20 13.7348 20.1054 13.4804 20.2929 13.2929C20.4804 13.1054 20.7348 13 21 13C21.2652 13 21.5196 13.1054 21.7071 13.2929C21.8946 13.4804 22 13.7348 22 14Z" fill="#070707"/>
1913
1962
  </svg>
1963
+ `,
1964
+ 'shoppingbagopen-fill': `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
1965
+ <path d="M27 5H5C4.46957 5 3.96086 5.21071 3.58579 5.58579C3.21071 5.96086 3 6.46957 3 7V25C3 25.5304 3.21071 26.0391 3.58579 26.4142C3.96086 26.7893 4.46957 27 5 27H27C27.5304 27 28.0391 26.7893 28.4142 26.4142C28.7893 26.0391 29 25.5304 29 25V7C29 6.46957 28.7893 5.96086 28.4142 5.58579C28.0391 5.21071 27.5304 5 27 5ZM16 20C14.4092 19.9983 12.884 19.3657 11.7592 18.2408C10.6343 17.116 10.0017 15.5908 10 14C10 13.7348 10.1054 13.4804 10.2929 13.2929C10.4804 13.1054 10.7348 13 11 13C11.2652 13 11.5196 13.1054 11.7071 13.2929C11.8946 13.4804 12 13.7348 12 14C12 15.0609 12.4214 16.0783 13.1716 16.8284C13.9217 17.5786 14.9391 18 16 18C17.0609 18 18.0783 17.5786 18.8284 16.8284C19.5786 16.0783 20 15.0609 20 14C20 13.7348 20.1054 13.4804 20.2929 13.2929C20.4804 13.1054 20.7348 13 21 13C21.2652 13 21.5196 13.1054 21.7071 13.2929C21.8946 13.4804 22 13.7348 22 14C21.9983 15.5908 21.3657 17.116 20.2408 18.2408C19.116 19.3657 17.5908 19.9983 16 20ZM5 9V7H27V9H5Z" fill="#070707"/>
1966
+ </svg>
1914
1967
  `,
1915
1968
  'package-regular': `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
1916
- <path d="M27.96 8.26875L16.96 2.25C16.6661 2.0876 16.3358 2.00242 16 2.00242C15.6642 2.00242 15.3339 2.0876 15.04 2.25L4.04 8.27125C3.72586 8.44313 3.46363 8.6962 3.28069 9.00403C3.09775 9.31186 3.00081 9.66316 3 10.0212V21.9762C3.00081 22.3343 3.09775 22.6856 3.28069 22.9935C3.46363 23.3013 3.72586 23.5544 4.04 23.7262L15.04 29.7475C15.3339 29.9099 15.6642 29.9951 16 29.9951C16.3358 29.9951 16.6661 29.9099 16.96 29.7475L27.96 23.7262C28.2741 23.5544 28.5364 23.3013 28.7193 22.9935C28.9023 22.6856 28.9992 22.3343 29 21.9762V10.0225C28.9999 9.66378 28.9032 9.31169 28.7203 9.00314C28.5373 8.69459 28.2747 8.44094 27.96 8.26875ZM16 4L26.0425 9.5L22.3213 11.5375L12.2775 6.0375L16 4ZM16 15L5.9575 9.5L10.195 7.18L20.2375 12.68L16 15ZM5 11.25L15 16.7225V27.4463L5 21.9775V11.25ZM27 21.9725L17 27.4463V16.7275L21 14.5387V19C21 19.2652 21.1054 19.5196 21.2929 19.7071C21.4804 19.8946 21.7348 20 22 20C22.2652 20 22.5196 19.8946 22.7071 19.7071C22.8946 19.5196 23 19.2652 23 19V13.4438L27 11.25V21.9713V21.9725Z" fill="#070707"/>
1969
+ <path d="M27.96 8.26876L16.96 2.25001C16.6661 2.08761 16.3358 2.00243 16 2.00243C15.6642 2.00243 15.3339 2.08761 15.04 2.25001L4.04 8.27126C3.72586 8.44314 3.46363 8.69621 3.28069 9.00404C3.09775 9.31187 3.00081 9.66317 3 10.0213V21.9763C3.00081 22.3343 3.09775 22.6856 3.28069 22.9935C3.46363 23.3013 3.72586 23.5544 4.04 23.7263L15.04 29.7475C15.3339 29.9099 15.6642 29.9951 16 29.9951C16.3358 29.9951 16.6661 29.9099 16.96 29.7475L27.96 23.7263C28.2741 23.5544 28.5364 23.3013 28.7193 22.9935C28.9023 22.6856 28.9992 22.3343 29 21.9763V10.0225C28.9999 9.66378 28.9032 9.3117 28.7203 9.00315C28.5373 8.6946 28.2747 8.44094 27.96 8.26876ZM16 4.00001L26.0425 9.50001L22.3213 11.5375L12.2775 6.03751L16 4.00001ZM16 15L5.9575 9.50001L10.195 7.18001L20.2375 12.68L16 15ZM5 11.25L15 16.7225V27.4463L5 21.9775V11.25ZM27 21.9725L17 27.4463V16.7275L21 14.5388V19C21 19.2652 21.1054 19.5196 21.2929 19.7071C21.4804 19.8947 21.7348 20 22 20C22.2652 20 22.5196 19.8947 22.7071 19.7071C22.8946 19.5196 23 19.2652 23 19V13.4438L27 11.25V21.9713V21.9725Z" fill="#070707"/>
1970
+ </svg>
1971
+ `,
1972
+ 'package-fill': `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
1973
+ <path d="M27.96 8.26876L16.96 2.25001C16.6661 2.08761 16.3358 2.00243 16 2.00243C15.6642 2.00243 15.3339 2.08761 15.04 2.25001L4.04 8.27126C3.72586 8.44314 3.46363 8.69621 3.28069 9.00404C3.09775 9.31187 3.00081 9.66317 3 10.0213V21.9763C3.00081 22.3343 3.09775 22.6856 3.28069 22.9935C3.46363 23.3013 3.72586 23.5544 4.04 23.7263L15.04 29.7475C15.3339 29.9099 15.6642 29.9951 16 29.9951C16.3358 29.9951 16.6661 29.9099 16.96 29.7475L27.96 23.7263C28.2741 23.5544 28.5364 23.3013 28.7193 22.9935C28.9023 22.6856 28.9992 22.3343 29 21.9763V10.0225C28.9999 9.66378 28.9032 9.3117 28.7203 9.00315C28.5373 8.6946 28.2747 8.44094 27.96 8.26876ZM16 4.00001L26.0438 9.50001L22.3213 11.5363L12.2775 6.03626L16 4.00001ZM16 15L5.95625 9.50001L10.195 7.17876L20.2388 12.6788L16 15ZM27 21.9813L17 27.455V16.7288L21 14.54V19C21 19.2652 21.1054 19.5196 21.2929 19.7071C21.4804 19.8947 21.7348 20 22 20C22.2652 20 22.5196 19.8947 22.7071 19.7071C22.8946 19.5196 23 19.2652 23 19V13.445L27 11.2563V21.9763V21.9813Z" fill="#070707"/>
1917
1974
  </svg>
1918
1975
  `,
1919
1976
  'creditcard-regular': `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
1920
1977
  <path d="M28 6H4C3.46957 6 2.96086 6.21071 2.58579 6.58579C2.21071 6.96086 2 7.46957 2 8V24C2 24.5304 2.21071 25.0391 2.58579 25.4142C2.96086 25.7893 3.46957 26 4 26H28C28.5304 26 29.0391 25.7893 29.4142 25.4142C29.7893 25.0391 30 24.5304 30 24V8C30 7.46957 29.7893 6.96086 29.4142 6.58579C29.0391 6.21071 28.5304 6 28 6ZM28 8V11H4V8H28ZM28 24H4V13H28V24ZM26 21C26 21.2652 25.8946 21.5196 25.7071 21.7071C25.5196 21.8946 25.2652 22 25 22H21C20.7348 22 20.4804 21.8946 20.2929 21.7071C20.1054 21.5196 20 21.2652 20 21C20 20.7348 20.1054 20.4804 20.2929 20.2929C20.4804 20.1054 20.7348 20 21 20H25C25.2652 20 25.5196 20.1054 25.7071 20.2929C25.8946 20.4804 26 20.7348 26 21ZM18 21C18 21.2652 17.8946 21.5196 17.7071 21.7071C17.5196 21.8946 17.2652 22 17 22H15C14.7348 22 14.4804 21.8946 14.2929 21.7071C14.1054 21.5196 14 21.2652 14 21C14 20.7348 14.1054 20.4804 14.2929 20.2929C14.4804 20.1054 14.7348 20 15 20H17C17.2652 20 17.5196 20.1054 17.7071 20.2929C17.8946 20.4804 18 20.7348 18 21Z" fill="#070707"/>
1921
1978
  </svg>
1979
+ `,
1980
+ 'creditcard-fill': `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
1981
+ <path d="M28 6H4C3.46957 6 2.96086 6.21071 2.58579 6.58579C2.21071 6.96086 2 7.46957 2 8V24C2 24.5304 2.21071 25.0391 2.58579 25.4142C2.96086 25.7893 3.46957 26 4 26H28C28.5304 26 29.0391 25.7893 29.4142 25.4142C29.7893 25.0391 30 24.5304 30 24V8C30 7.46957 29.7893 6.96086 29.4142 6.58579C29.0391 6.21071 28.5304 6 28 6ZM17 22H15C14.7348 22 14.4804 21.8946 14.2929 21.7071C14.1054 21.5196 14 21.2652 14 21C14 20.7348 14.1054 20.4804 14.2929 20.2929C14.4804 20.1054 14.7348 20 15 20H17C17.2652 20 17.5196 20.1054 17.7071 20.2929C17.8946 20.4804 18 20.7348 18 21C18 21.2652 17.8946 21.5196 17.7071 21.7071C17.5196 21.8946 17.2652 22 17 22ZM25 22H21C20.7348 22 20.4804 21.8946 20.2929 21.7071C20.1054 21.5196 20 21.2652 20 21C20 20.7348 20.1054 20.4804 20.2929 20.2929C20.4804 20.1054 20.7348 20 21 20H25C25.2652 20 25.5196 20.1054 25.7071 20.2929C25.8946 20.4804 26 20.7348 26 21C26 21.2652 25.8946 21.5196 25.7071 21.7071C25.5196 21.8946 25.2652 22 25 22ZM4 11V8H28V11H4Z" fill="#070707"/>
1982
+ </svg>
1922
1983
  `,
1923
1984
  'farm-regular': `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
1924
1985
  <path d="M17.1038 27.5537C16.9569 27.7745 16.7283 27.9279 16.4683 27.9802C16.2084 28.0324 15.9383 27.9793 15.7175 27.8325C11.9502 25.3263 7.52475 23.9927 3 24C2.73478 24 2.48043 23.8946 2.29289 23.7071C2.10536 23.5196 2 23.2652 2 23C2 22.7348 2.10536 22.4804 2.29289 22.2929C2.48043 22.1054 2.73478 22 3 22C7.91891 21.9925 12.7297 23.4427 16.825 26.1675C17.0458 26.3144 17.1991 26.5429 17.2514 26.8029C17.3037 27.0629 17.2506 27.3329 17.1038 27.5537ZM3 18C2.73478 18 2.48043 18.1054 2.29289 18.2929C2.10536 18.4804 2 18.7348 2 19C2 19.2652 2.10536 19.5196 2.29289 19.7071C2.48043 19.8946 2.73478 20 3 20C10.0685 19.9838 16.8583 22.7555 21.8962 27.7138C21.9892 27.8093 22.1003 27.8854 22.2231 27.9374C22.3458 27.9894 22.4777 28.0163 22.611 28.0166C22.7444 28.0169 22.8764 27.9905 22.9994 27.939C23.1223 27.8875 23.2338 27.812 23.3271 27.7168C23.4205 27.6216 23.4938 27.5087 23.5429 27.3848C23.592 27.2608 23.6158 27.1283 23.6129 26.995C23.6101 26.8617 23.5806 26.7304 23.5262 26.6087C23.4718 26.4869 23.3936 26.3773 23.2962 26.2862C17.8855 20.9599 10.5925 17.9824 3 18ZM29 20C26.956 19.9987 24.9184 20.2289 22.9263 20.6863C23.6129 21.2071 24.2796 21.7554 24.9263 22.3312C26.273 22.1107 27.6354 21.9999 29 22C29.2652 22 29.5196 22.1054 29.7071 22.2929C29.8946 22.4804 30 22.7348 30 23C30 23.2652 29.8946 23.5196 29.7071 23.7071C29.5196 23.8946 29.2652 24 29 24C28.25 24 27.5087 24.0362 26.7687 24.1075C27.4621 24.83 28.1262 25.5858 28.7612 26.375C28.8482 26.4769 28.9139 26.5952 28.9542 26.7229C28.9946 26.8506 29.0089 26.9851 28.9963 27.1185C28.9837 27.2518 28.9445 27.3813 28.8809 27.4992C28.8173 27.6171 28.7306 27.721 28.6261 27.8047C28.5215 27.8885 28.4013 27.9504 28.2723 27.9868C28.1434 28.0232 28.0085 28.0333 27.8756 28.0165C27.7427 27.9997 27.6145 27.9564 27.4987 27.8892C27.3829 27.8219 27.2817 27.7321 27.2013 27.625C24.3028 23.9903 20.6209 21.0571 16.4304 19.0442C12.2399 17.0313 7.64888 15.9907 3 16C2.73478 16 2.48043 15.8946 2.29289 15.7071C2.10536 15.5196 2 15.2652 2 15C2 14.7348 2.10536 14.4804 2.29289 14.2929C2.48043 14.1054 2.73478 14 3 14C5.0124 14.0004 7.02062 14.1832 9 14.5463V10C9 9.84475 9.03615 9.69164 9.10557 9.55279C9.175 9.41393 9.2758 9.29315 9.4 9.2L17.4 3.2C17.5731 3.07018 17.7836 3 18 3C18.2164 3 18.4269 3.07018 18.6 3.2L26.6 9.2C26.7242 9.29315 26.825 9.41393 26.8944 9.55279C26.9639 9.69164 27 9.84475 27 10V14.0612C27.6637 14.0225 28.33 14 29 14C29.2652 14 29.5196 14.1054 29.7071 14.2929C29.8946 14.4804 30 14.7348 30 15C30 15.2652 29.8946 15.5196 29.7071 15.7071C29.5196 15.8946 29.2652 16 29 16C25.4089 15.9931 21.8444 16.6146 18.4675 17.8363C19.2542 18.2529 20.0233 18.7021 20.775 19.1838C23.4457 18.3967 26.2157 17.998 29 18C29.2652 18 29.5196 18.1054 29.7071 18.2929C29.8946 18.4804 30 18.7348 30 19C30 19.2652 29.8946 19.5196 29.7071 19.7071C29.5196 19.8946 29.2652 20 29 20ZM15 11H21C21.2652 11 21.5196 11.1054 21.7071 11.2929C21.8946 11.4804 22 11.7348 22 12V14.7425C22.99 14.5292 23.99 14.3625 25 14.2425V10.5L18 5.25L11 10.5V14.9762C12.0158 15.2262 13.0158 15.5254 14 15.8737V12C14 11.7348 14.1054 11.4804 14.2929 11.2929C14.4804 11.1054 14.7348 11 15 11ZM16.0088 16.6588C17.3073 16.1012 18.6405 15.6281 20 15.2425V13H16V16.655L16.0088 16.6588Z" fill="#070707"/>
@@ -1965,6 +2026,10 @@ const arrowsIcons = {
1965
2026
  'arrowclockwise-regular': `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
1966
2027
  <path d="M29.9999 7V13C29.9999 13.2652 29.8946 13.5196 29.707 13.7071C29.5195 13.8946 29.2651 14 28.9999 14H22.9999C22.7347 14 22.4804 13.8946 22.2928 13.7071C22.1053 13.5196 21.9999 13.2652 21.9999 13C21.9999 12.7348 22.1053 12.4804 22.2928 12.2929C22.4804 12.1054 22.7347 12 22.9999 12H26.4249L23.1012 8.955L23.0699 8.925C21.68 7.53562 19.9115 6.58658 17.9854 6.19644C16.0592 5.8063 14.0608 5.99236 12.2398 6.73138C10.4188 7.4704 8.85588 8.72961 7.74635 10.3517C6.63682 11.9738 6.02985 13.8869 6.00126 15.8519C5.97267 17.817 6.52373 19.7469 7.58559 21.4006C8.64746 23.0543 10.1731 24.3584 11.9718 25.1501C13.7706 25.9418 15.7627 26.1859 17.6994 25.852C19.6361 25.5181 21.4314 24.6209 22.8612 23.2725C23.054 23.0902 23.3113 22.9919 23.5765 22.9993C23.8418 23.0066 24.0932 23.1191 24.2756 23.3119C24.4579 23.5047 24.5562 23.762 24.5488 24.0272C24.5414 24.2925 24.429 24.5439 24.2362 24.7263C22.013 26.8347 19.0639 28.0069 15.9999 28H15.8349C13.8696 27.9731 11.941 27.4638 10.2186 26.517C8.49613 25.5702 7.03266 24.2147 5.95675 22.5698C4.88085 20.9249 4.22545 19.0409 4.04818 17.0834C3.8709 15.1259 4.17717 13.1549 4.94007 11.3435C5.70296 9.53203 6.89912 7.93574 8.42342 6.69487C9.94771 5.454 11.7535 4.60655 13.682 4.227C15.6105 3.84744 17.6027 3.94741 19.4836 4.51811C21.3644 5.08881 23.0763 6.11278 24.4687 7.5L27.9999 10.725V7C27.9999 6.73479 28.1053 6.48043 28.2928 6.2929C28.4804 6.10536 28.7347 6 28.9999 6C29.2651 6 29.5195 6.10536 29.707 6.2929C29.8946 6.48043 29.9999 6.73479 29.9999 7Z" fill="#070707"/>
1967
2028
  </svg>
2029
+ `,
2030
+ 'arrowclockwise-fill': `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
2031
+ <path d="M29.9999 7V13C29.9999 13.2652 29.8946 13.5196 29.707 13.7071C29.5195 13.8946 29.2651 14 28.9999 14H22.9999C22.802 14.0002 22.6085 13.9416 22.4439 13.8317C22.2794 13.7219 22.1511 13.5656 22.0753 13.3828C21.9996 13.2 21.9797 12.9988 22.0184 12.8047C22.057 12.6106 22.1524 12.4324 22.2924 12.2925L24.4174 10.1675L23.0987 8.96125L23.0674 8.93125C21.6775 7.54187 19.909 6.59283 17.9829 6.20269C16.0567 5.81255 14.0583 5.99861 12.2373 6.73763C10.4163 7.47665 8.85338 8.73586 7.74385 10.358C6.63432 11.9801 6.02735 13.8931 5.99876 15.8582C5.97017 17.8232 6.52123 19.7532 7.58309 21.4068C8.64496 23.0605 10.1706 24.3647 11.9693 25.1564C13.7681 25.9481 15.7602 26.1922 17.6969 25.8582C19.6336 25.5243 21.4289 24.6271 22.8587 23.2788C22.9541 23.1885 23.0664 23.1179 23.1892 23.071C23.3119 23.0241 23.4427 23.0019 23.574 23.0055C23.7054 23.0092 23.8347 23.0387 23.9546 23.0923C24.0746 23.1459 24.1828 23.2227 24.2731 23.3181C24.3633 23.4136 24.4339 23.5259 24.4808 23.6486C24.5277 23.7714 24.5499 23.9021 24.5463 24.0335C24.5426 24.1648 24.5131 24.2941 24.4595 24.4141C24.4059 24.534 24.3291 24.6422 24.2337 24.7325C22.0102 26.838 19.0622 28.0079 15.9999 28H15.8349C13.8696 27.9731 11.941 27.4638 10.2186 26.517C8.49613 25.5702 7.03266 24.2147 5.95675 22.5698C4.88085 20.9249 4.22545 19.0409 4.04818 17.0834C3.8709 15.1259 4.17717 13.1549 4.94007 11.3435C5.70296 9.53203 6.89912 7.93574 8.42342 6.69487C9.94771 5.454 11.7535 4.60655 13.682 4.227C15.6105 3.84744 17.6027 3.94741 19.4836 4.51811C21.3644 5.08881 23.0763 6.11278 24.4687 7.5L25.8349 8.75L28.2924 6.2875C28.4326 6.14719 28.6113 6.05171 28.8059 6.01322C29.0004 5.97472 29.202 5.99495 29.385 6.07132C29.5681 6.1477 29.7243 6.27677 29.8337 6.44213C29.9432 6.6075 30.0011 6.80168 29.9999 7Z" fill="#070707"/>
2032
+ </svg>
1968
2033
  `,
1969
2034
  'arrowleft-regular': `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
1970
2035
  <path d="M28.0001 16C28.0001 16.2652 27.8947 16.5196 27.7072 16.7071C27.5196 16.8947 27.2653 17 27.0001 17H7.4138L14.7076 24.2925C14.8005 24.3854 14.8742 24.4957 14.9244 24.6171C14.9747 24.7385 15.0006 24.8686 15.0006 25C15.0006 25.1314 14.9747 25.2615 14.9244 25.3829C14.8742 25.5043 14.8005 25.6146 14.7076 25.7075C14.6146 25.8004 14.5043 25.8741 14.383 25.9244C14.2616 25.9747 14.1314 26.0006 14.0001 26.0006C13.8687 26.0006 13.7386 25.9747 13.6172 25.9244C13.4958 25.8741 13.3855 25.8004 13.2926 25.7075L4.29255 16.7075C4.19958 16.6146 4.12582 16.5043 4.07549 16.3829C4.02517 16.2615 3.99927 16.1314 3.99927 16C3.99927 15.8686 4.02517 15.7385 4.07549 15.6171C4.12582 15.4957 4.19958 15.3854 4.29255 15.2925L13.2926 6.29251C13.4802 6.10487 13.7347 5.99945 14.0001 5.99945C14.2654 5.99945 14.5199 6.10487 14.7076 6.29251C14.8952 6.48015 15.0006 6.73464 15.0006 7.00001C15.0006 7.26537 14.8952 7.51987 14.7076 7.70751L7.4138 15H27.0001C27.2653 15 27.5196 15.1054 27.7072 15.2929C27.8947 15.4804 28.0001 15.7348 28.0001 16Z" fill="#070707"/>
@@ -1979,14 +2044,26 @@ const peopleIcons = {
1979
2044
  'user-regular': `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
1980
2045
  <path d="M28.8651 26.5C26.9613 23.2087 24.0276 20.8487 20.6038 19.73C22.2974 18.7218 23.6132 17.1856 24.3491 15.3572C25.0851 13.5289 25.2005 11.5095 24.6777 9.6092C24.1548 7.70889 23.0227 6.03274 21.4551 4.83816C19.8874 3.64357 17.971 2.9966 16.0001 2.9966C14.0292 2.9966 12.1128 3.64357 10.5451 4.83816C8.9775 6.03274 7.84534 7.70889 7.32252 9.6092C6.7997 11.5095 6.91513 13.5289 7.65108 15.3572C8.38703 17.1856 9.7028 18.7218 11.3963 19.73C7.97259 20.8475 5.03884 23.2075 3.13509 26.5C3.06528 26.6138 3.01897 26.7405 2.99891 26.8725C2.97884 27.0045 2.98541 27.1392 3.01825 27.2687C3.05108 27.3981 3.10951 27.5197 3.19008 27.6262C3.27066 27.7327 3.37174 27.8219 3.48738 27.8887C3.60301 27.9555 3.73085 27.9985 3.86335 28.0151C3.99586 28.0316 4.13034 28.0215 4.25887 27.9853C4.3874 27.9491 4.50737 27.8875 4.6117 27.8041C4.71604 27.7208 4.80262 27.6174 4.86634 27.5C7.22134 23.43 11.3838 21 16.0001 21C20.6163 21 24.7788 23.43 27.1338 27.5C27.1976 27.6174 27.2842 27.7208 27.3885 27.8041C27.4928 27.8875 27.6128 27.9491 27.7413 27.9853C27.8698 28.0215 28.0043 28.0316 28.1368 28.0151C28.2693 27.9985 28.3972 27.9555 28.5128 27.8887C28.6284 27.8219 28.7295 27.7327 28.8101 27.6262C28.8907 27.5197 28.9491 27.3981 28.9819 27.2687C29.0148 27.1392 29.0213 27.0045 29.0013 26.8725C28.9812 26.7405 28.9349 26.6138 28.8651 26.5ZM9.00009 12C9.00009 10.6155 9.41064 9.26215 10.1798 8.11101C10.949 6.95986 12.0422 6.06266 13.3213 5.53284C14.6004 5.00303 16.0079 4.86441 17.3657 5.1345C18.7236 5.4046 19.9709 6.07128 20.9498 7.05025C21.9288 8.02922 22.5955 9.2765 22.8656 10.6344C23.1357 11.9922 22.9971 13.3997 22.4673 14.6788C21.9374 15.9579 21.0402 17.0511 19.8891 17.8203C18.7379 18.5895 17.3846 19 16.0001 19C14.1442 18.998 12.3649 18.2599 11.0525 16.9476C9.74022 15.6352 9.00208 13.8559 9.00009 12Z" fill="#070707"/>
1981
2046
  </svg>
2047
+ `,
2048
+ 'user-fill': `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
2049
+ <path d="M28.8662 27.5C28.7784 27.6521 28.6521 27.7783 28.5001 27.8661C28.348 27.9538 28.1755 28 28 28H3.99995C3.8245 27.9998 3.65219 27.9535 3.50031 27.8656C3.34843 27.7778 3.22234 27.6515 3.13469 27.4996C3.04705 27.3476 3.00093 27.1752 3.00098 26.9997C3.00102 26.8243 3.04723 26.6519 3.13495 26.5C5.0387 23.2087 7.97245 20.8487 11.3962 19.73C9.70266 18.7218 8.38688 17.1856 7.65094 15.3572C6.91499 13.5289 6.79956 11.5095 7.32238 9.60919C7.8452 7.70889 8.97735 6.03274 10.545 4.83815C12.1126 3.64357 14.029 2.9966 16 2.9966C17.9709 2.9966 19.8873 3.64357 21.4549 4.83815C23.0226 6.03274 24.1547 7.70889 24.6775 9.60919C25.2003 11.5095 25.0849 13.5289 24.349 15.3572C23.613 17.1856 22.2972 18.7218 20.6037 19.73C24.0275 20.8487 26.9612 23.2087 28.865 26.5C28.9529 26.6519 28.9993 26.8243 28.9996 26.9998C28.9998 27.1754 28.9538 27.3479 28.8662 27.5Z" fill="#070707"/>
2050
+ </svg>
1982
2051
  `,
1983
2052
  'usercirclecheck-regular': `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
1984
2053
  <path d="M27.6688 13.0137C27.4072 13.0575 27.1738 13.2034 27.0197 13.4193C26.8657 13.6352 26.8038 13.9034 26.8475 14.165C26.9491 14.7714 27.0001 15.3852 27 16C27.0024 18.6927 26.0127 21.292 24.22 23.3012C23.1047 21.6851 21.5365 20.4348 19.7125 19.7075C20.6923 18.9358 21.4072 17.878 21.7579 16.6811C22.1086 15.4843 22.0777 14.2079 21.6693 13.0294C21.2609 11.851 20.4955 10.8291 19.4795 10.1059C18.4634 9.38262 17.2472 8.99397 16 8.99397C14.7529 8.99397 13.5367 9.38262 12.5206 10.1059C11.5046 10.8291 10.7391 11.851 10.3308 13.0294C9.92241 14.2079 9.89143 15.4843 10.2421 16.6811C10.5928 17.878 11.3078 18.9358 12.2875 19.7075C10.4636 20.4348 8.89532 21.6851 7.78003 23.3012C6.37343 21.7162 5.45462 19.7586 5.13409 17.6638C4.81355 15.569 5.10494 13.4262 5.9732 11.4931C6.84147 9.55995 8.24965 7.91877 10.0284 6.76688C11.8072 5.615 13.8809 5.00144 16 5C16.6149 4.9999 17.2286 5.05091 17.835 5.1525C18.0954 5.19358 18.3615 5.13019 18.5754 4.97611C18.7893 4.82203 18.9337 4.58972 18.9772 4.32973C19.0207 4.06973 18.9598 3.80307 18.8077 3.58776C18.6556 3.37245 18.4246 3.22591 18.165 3.18C15.4493 2.72314 12.6587 3.14117 10.1961 4.37372C7.73344 5.60627 5.72624 7.58956 4.46426 10.0372C3.20229 12.4849 2.75085 15.2703 3.17513 17.9913C3.59941 20.7123 4.87744 23.228 6.82472 25.1753C8.77199 27.1226 11.2877 28.4006 14.0087 28.8249C16.7297 29.2492 19.5151 28.7977 21.9628 27.5358C24.4105 26.2738 26.3938 24.2666 27.6263 21.804C28.8589 19.3413 29.2769 16.5507 28.82 13.835C28.7763 13.5734 28.6304 13.34 28.4145 13.186C28.1986 13.0319 27.9304 12.97 27.6688 13.0137ZM12 15C12 14.2089 12.2346 13.4355 12.6742 12.7777C13.1137 12.1199 13.7384 11.6072 14.4693 11.3045C15.2002 11.0017 16.0045 10.9225 16.7804 11.0769C17.5563 11.2312 18.269 11.6122 18.8285 12.1716C19.3879 12.731 19.7688 13.4437 19.9232 14.2196C20.0775 14.9956 19.9983 15.7998 19.6956 16.5307C19.3928 17.2616 18.8801 17.8864 18.2223 18.3259C17.5645 18.7654 16.7912 19 16 19C14.9392 19 13.9218 18.5786 13.1716 17.8284C12.4215 17.0783 12 16.0609 12 15ZM9.26003 24.6875C9.98345 23.5561 10.98 22.625 12.1579 21.9801C13.3358 21.3351 14.6571 20.9971 16 20.9971C17.3429 20.9971 18.6642 21.3351 19.8421 21.9801C21.02 22.625 22.0166 23.5561 22.74 24.6875C20.813 26.1862 18.4413 26.9999 16 26.9999C13.5588 26.9999 11.1871 26.1862 9.26003 24.6875ZM29.7075 5.7075L25.7075 9.7075C25.6147 9.80048 25.5044 9.87423 25.383 9.92456C25.2616 9.97488 25.1314 10.0008 25 10.0008C24.8686 10.0008 24.7385 9.97488 24.6171 9.92456C24.4957 9.87423 24.3854 9.80048 24.2925 9.7075L22.2925 7.7075C22.1996 7.61459 22.1259 7.50429 22.0756 7.3829C22.0254 7.2615 21.9995 7.13139 21.9995 7C21.9995 6.8686 22.0254 6.7385 22.0756 6.6171C22.1259 6.49571 22.1996 6.38541 22.2925 6.2925C22.4802 6.10486 22.7347 5.99944 23 5.99944C23.1314 5.99944 23.2615 6.02532 23.3829 6.07561C23.5043 6.12589 23.6146 6.19959 23.7075 6.2925L25 7.58625L28.2925 4.2925C28.3854 4.19959 28.4957 4.12589 28.6171 4.07561C28.7385 4.02532 28.8686 3.99944 29 3.99944C29.1314 3.99944 29.2615 4.02532 29.3829 4.07561C29.5043 4.12589 29.6146 4.19959 29.7075 4.2925C29.8004 4.38541 29.8741 4.49571 29.9244 4.6171C29.9747 4.7385 30.0006 4.8686 30.0006 5C30.0006 5.13139 29.9747 5.2615 29.9244 5.3829C29.8741 5.50429 29.8004 5.61459 29.7075 5.7075Z" fill="#070707"/>
1985
2054
  </svg>
2055
+ `,
2056
+ 'usercirclecheck-fill': `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
2057
+ <path d="M28.82 13.835C29.2769 16.5507 28.8589 19.3413 27.6263 21.804C26.3938 24.2666 24.4105 26.2738 21.9628 27.5358C19.5151 28.7977 16.7297 29.2492 14.0087 28.8249C11.2877 28.4006 8.77199 27.1226 6.82472 25.1753C4.87744 23.228 3.59941 20.7123 3.17513 17.9913C2.75085 15.2703 3.20229 12.4849 4.46426 10.0372C5.72624 7.58956 7.73344 5.60627 10.1961 4.37372C12.6587 3.14117 15.4493 2.72314 18.165 3.18C18.4246 3.22591 18.6556 3.37245 18.8077 3.58776C18.9598 3.80307 19.0207 4.06973 18.9772 4.32973C18.9337 4.58972 18.7893 4.82203 18.5754 4.97611C18.3615 5.13019 18.0954 5.19358 17.835 5.1525C16.2577 4.88716 14.6415 4.96872 13.0989 5.39151C11.5563 5.8143 10.1243 6.56816 8.90268 7.60062C7.68104 8.63309 6.69906 9.91937 6.02508 11.3699C5.3511 12.8205 5.0013 14.4005 5.00003 16C4.99766 18.6927 5.98734 21.292 7.78003 23.3012C8.50706 22.2468 9.43058 21.3423 10.5 20.6375C10.5913 20.577 10.7 20.5481 10.8093 20.5553C10.9186 20.5626 11.0225 20.6055 11.105 20.6775C12.4635 21.853 14.1998 22.5 15.9963 22.5C17.7927 22.5 19.5291 21.853 20.8875 20.6775C20.9701 20.6055 21.074 20.5626 21.1833 20.5553C21.2926 20.5481 21.4012 20.577 21.4925 20.6375C22.563 21.3423 23.4878 22.2467 24.2163 23.3012C26.0103 21.2925 27.0014 18.6932 27 16C27.0001 15.3852 26.9491 14.7714 26.8475 14.165C26.8245 14.0349 26.8275 13.9016 26.8564 13.7726C26.8852 13.6437 26.9393 13.5218 27.0155 13.4139C27.0917 13.306 27.1885 13.2143 27.3004 13.144C27.4123 13.0738 27.537 13.0264 27.6672 13.0046C27.7975 12.9828 27.9309 12.987 28.0595 13.017C28.1881 13.047 28.3096 13.1023 28.4168 13.1795C28.5239 13.2567 28.6148 13.3544 28.684 13.4669C28.7532 13.5794 28.7994 13.7045 28.82 13.835ZM10.5 15C10.5 16.0878 10.8226 17.1512 11.427 18.0556C12.0313 18.9601 12.8903 19.6651 13.8953 20.0813C14.9003 20.4976 16.0061 20.6065 17.073 20.3943C18.1399 20.1821 19.1199 19.6583 19.8891 18.8891C20.6583 18.1199 21.1821 17.1399 21.3944 16.073C21.6066 15.0061 21.4977 13.9002 21.0814 12.8952C20.6651 11.8902 19.9601 11.0313 19.0557 10.4269C18.1512 9.82257 17.0878 9.5 16 9.5C14.5413 9.5 13.1424 10.0795 12.1109 11.1109C11.0795 12.1424 10.5 13.5413 10.5 15ZM29.7075 4.2925C29.6147 4.19952 29.5044 4.12576 29.383 4.07544C29.2616 4.02512 29.1314 3.99921 29 3.99921C28.8686 3.99921 28.7385 4.02512 28.6171 4.07544C28.4957 4.12576 28.3854 4.19952 28.2925 4.2925L25 7.58625L23.7075 6.2925C23.6146 6.19959 23.5043 6.12589 23.3829 6.07561C23.2615 6.02532 23.1314 5.99944 23 5.99944C22.8686 5.99944 22.7385 6.02532 22.6171 6.07561C22.4957 6.12589 22.3854 6.19959 22.2925 6.2925C22.1996 6.38541 22.1259 6.49571 22.0756 6.6171C22.0254 6.7385 21.9995 6.8686 21.9995 7C21.9995 7.13139 22.0254 7.2615 22.0756 7.3829C22.1259 7.50429 22.1996 7.61459 22.2925 7.7075L24.2925 9.7075C24.3854 9.80048 24.4957 9.87423 24.6171 9.92456C24.7385 9.97488 24.8686 10.0008 25 10.0008C25.1314 10.0008 25.2616 9.97488 25.383 9.92456C25.5044 9.87423 25.6147 9.80048 25.7075 9.7075L29.7075 5.7075C29.8005 5.61463 29.8743 5.50434 29.9246 5.38294C29.9749 5.26154 30.0008 5.13141 30.0008 5C30.0008 4.86858 29.9749 4.73846 29.9246 4.61706C29.8743 4.49566 29.8005 4.38537 29.7075 4.2925Z" fill="#070707"/>
2058
+ </svg>
1986
2059
  `,
1987
2060
  'users-regular': `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
1988
2061
  <path d="M14.6563 19.74C15.9966 18.8477 17.0141 17.5479 17.5584 16.0326C18.1028 14.5173 18.145 12.867 17.6789 11.3259C17.2129 9.78472 16.2632 8.43447 14.9703 7.47479C13.6775 6.51511 12.1102 5.99696 10.5001 5.99696C8.88997 5.99696 7.32261 6.51511 6.02978 7.47479C4.73694 8.43447 3.78726 9.78472 3.32118 11.3259C2.85509 12.867 2.89734 14.5173 3.44168 16.0326C3.98603 17.5479 5.00356 18.8477 6.34381 19.74C3.91943 20.6336 1.84894 22.287 0.441312 24.4538C0.367332 24.5637 0.315945 24.6873 0.290139 24.8173C0.264332 24.9473 0.264621 25.0811 0.290989 25.2109C0.317356 25.3408 0.369276 25.4642 0.44373 25.5738C0.518185 25.6834 0.613688 25.7772 0.72469 25.8496C0.835692 25.922 0.959977 25.9716 1.09032 25.9955C1.22067 26.0195 1.35447 26.0173 1.48396 25.9891C1.61344 25.9608 1.73603 25.9072 1.84458 25.8311C1.95314 25.7551 2.04551 25.6583 2.11631 25.5463C3.0243 24.1497 4.26676 23.0022 5.73086 22.2077C7.19496 21.4133 8.83432 20.9972 10.5001 20.9972C12.1658 20.9972 13.8052 21.4133 15.2693 22.2077C16.7334 23.0022 17.9758 24.1497 18.8838 25.5463C19.0305 25.7642 19.257 25.9158 19.5145 25.968C19.772 26.0203 20.0397 25.9691 20.2598 25.8256C20.4799 25.6821 20.6346 25.4577 20.6906 25.201C20.7465 24.9443 20.6992 24.6759 20.5588 24.4538C19.1512 22.287 17.0807 20.6336 14.6563 19.74ZM5.00006 13.5C5.00006 12.4122 5.32263 11.3488 5.92698 10.4444C6.53133 9.5399 7.39031 8.83495 8.3953 8.41867C9.4003 8.00239 10.5062 7.89347 11.5731 8.10569C12.64 8.31791 13.62 8.84173 14.3891 9.61092C15.1583 10.3801 15.6822 11.3601 15.8944 12.427C16.1066 13.4939 15.9977 14.5998 15.5814 15.6048C15.1651 16.6098 14.4602 17.4687 13.5557 18.0731C12.6512 18.6774 11.5879 19 10.5001 19C9.04188 18.9984 7.64389 18.4184 6.6128 17.3873C5.58171 16.3562 5.00172 14.9582 5.00006 13.5ZM31.2676 25.8375C31.0454 25.9824 30.7749 26.033 30.5154 25.9784C30.2559 25.9238 30.0287 25.7684 29.8838 25.5463C28.9769 24.1489 27.7346 23.0008 26.2702 22.2067C24.8058 21.4126 23.1659 20.9978 21.5001 21C21.2348 21 20.9805 20.8947 20.793 20.7071C20.6054 20.5196 20.5001 20.2652 20.5001 20C20.5001 19.7348 20.6054 19.4804 20.793 19.2929C20.9805 19.1054 21.2348 19 21.5001 19C22.31 18.9992 23.1098 18.8196 23.8423 18.4739C24.5748 18.1282 25.2219 17.625 25.7373 17.0002C26.2528 16.3755 26.6239 15.6445 26.8242 14.8597C27.0244 14.0749 27.0488 13.2555 26.8957 12.4602C26.7426 11.6648 26.4157 10.9131 25.9383 10.2588C25.461 9.60438 24.845 9.06352 24.1344 8.6748C23.4239 8.28608 22.6362 8.0591 21.8277 8.01009C21.0192 7.96107 20.2099 8.09123 19.4576 8.39126C19.3349 8.44428 19.2028 8.47219 19.0692 8.47332C18.9356 8.47445 18.8031 8.44878 18.6795 8.39783C18.556 8.34688 18.4439 8.27169 18.3499 8.17669C18.2559 8.0817 18.1819 7.96882 18.1323 7.84474C18.0827 7.72066 18.0584 7.58789 18.0609 7.45428C18.0635 7.32067 18.0928 7.18892 18.1471 7.06682C18.2015 6.94472 18.2797 6.83476 18.3772 6.74341C18.4748 6.65207 18.5897 6.5812 18.7151 6.53501C20.4369 5.84832 22.352 5.82361 24.091 6.46564C25.83 7.10767 27.2696 8.37095 28.1321 10.0118C28.9946 11.6526 29.2189 13.5547 28.7617 15.3512C28.3045 17.1476 27.1982 18.7111 25.6563 19.74C28.0807 20.6336 30.1512 22.287 31.5588 24.4538C31.7037 24.6759 31.7543 24.9464 31.6997 25.2059C31.6451 25.4654 31.4897 25.6926 31.2676 25.8375Z" fill="#070707"/>
1989
2062
  </svg>
2063
+ `,
2064
+ 'users-fill': `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
2065
+ <path d="M20.5587 24.4537C20.6571 24.6046 20.7129 24.7793 20.7202 24.9593C20.7276 25.1392 20.6862 25.3179 20.6004 25.4763C20.5146 25.6346 20.3876 25.7669 20.2328 25.8591C20.0781 25.9513 19.9013 26 19.7212 26H1.27869C1.09856 26 0.921776 25.9513 0.767024 25.8591C0.612272 25.7669 0.485293 25.6346 0.399504 25.4763C0.313715 25.3179 0.272302 25.1392 0.279639 24.9593C0.286975 24.7793 0.34279 24.6046 0.441187 24.4537C1.84882 22.287 3.9193 20.6335 6.34369 19.74C5.00343 18.8477 3.9859 17.5478 3.44156 16.0326C2.89722 14.5173 2.85496 12.867 3.32105 11.3259C3.78714 9.78471 4.73681 8.43445 6.02965 7.47478C7.32249 6.5151 8.88984 5.99695 10.4999 5.99695C12.11 5.99695 13.6774 6.5151 14.9702 7.47478C16.2631 8.43445 17.2127 9.78471 17.6788 11.3259C18.1449 12.867 18.1027 14.5173 17.5583 16.0326C17.014 17.5478 15.9964 18.8477 14.6562 19.74C17.0806 20.6335 19.1511 22.287 20.5587 24.4537ZM31.5474 24.435C30.1394 22.2774 28.0736 20.631 25.6562 19.74C27.2384 18.6742 28.355 17.0455 28.7788 15.1854C29.2025 13.3254 28.9015 11.3737 27.937 9.72777C26.9725 8.08183 25.417 6.86529 23.5871 6.32578C21.7573 5.78627 19.7906 5.96434 18.0874 6.82374C18.0223 6.85737 17.9654 6.9049 17.9207 6.96298C17.8759 7.02105 17.8445 7.08825 17.8287 7.15981C17.8128 7.23137 17.8129 7.30554 17.8289 7.37707C17.8449 7.4486 17.8764 7.51574 17.9212 7.57374C19.1876 9.1535 19.915 11.0973 19.9966 13.1204C20.0783 15.1435 19.51 17.1396 18.3749 18.8162C18.3016 18.9258 18.2745 19.0599 18.2995 19.1894C18.3246 19.3189 18.3997 19.4332 18.5087 19.5075C19.9886 20.5403 21.2554 21.8488 22.2399 23.3612C22.637 23.9693 22.7992 24.7011 22.6962 25.42C22.6846 25.4915 22.6887 25.5647 22.7082 25.6345C22.7276 25.7042 22.7621 25.7689 22.809 25.8241C22.856 25.8793 22.9144 25.9236 22.9801 25.9539C23.0459 25.9843 23.1175 26 23.1899 26H30.7274C30.9476 26.0001 31.1617 25.9274 31.3364 25.7934C31.5111 25.6594 31.6367 25.4714 31.6937 25.2587C31.7285 25.1189 31.7334 24.9732 31.7082 24.8313C31.683 24.6894 31.6282 24.5544 31.5474 24.435Z" fill="#070707"/>
2066
+ </svg>
1990
2067
  `
1991
2068
  };
1992
2069
 
@@ -2697,7 +2774,7 @@ class CheckboxComponent {
2697
2774
  useExisting: forwardRef(() => CheckboxComponent),
2698
2775
  multi: true,
2699
2776
  },
2700
- ], ngImport: i0, template: "<div [ngClass]=\"classes()\" class=\"c-checkbox\">\n <div class=\"c-checkbox__input-wrapper\">\n <input\n type=\"checkbox\"\n [id]=\"name()\"\n [ngClass]=\"inputClasses()\"\n [checked]=\"isChecked()\"\n [indeterminate]=\"isIndeterminate()\"\n [disabled]=\"isDisabled()\"\n [name]=\"name()\"\n [value]=\"value()\"\n [attr.aria-label]=\"computedAriaLabel()\"\n [attr.aria-checked]=\"ariaChecked()\"\n (change)=\"handleChange($event)\"\n (keydown)=\"handleKeyDown($event)\"\n />\n </div>\n @if(isSkeleton()) {\n <div class=\"c-checkbox__label__skeleton\">\n <span></span>\n </div>\n } @else {\n <lib-input-label\n [text]=\"label()\"\n [disabled]=\"disabled()\"\n [required]=\"true\"\n [for]=\"name()\"\n [innerHTML]=\"innerHTML()\"\n ></lib-input-label>\n }\n</div>\n", styles: [".c-checkbox{display:flex;align-items:flex-start;gap:var(--space-component-gap-sm)}.c-checkbox__input-wrapper{height:var(--typography-label-md-default-line-height);display:flex;align-items:center}.c-checkbox__label{cursor:pointer}.c-checkbox__label__skeleton{width:64px;height:24px;display:flex;align-items:center}.c-checkbox__label__skeleton span{width:100%;height:8px;background-color:var(--color-effect-skeleton-default);border-radius:var(--size-border-radius-sm, 4px)}.c-checkbox--skeleton .c-checkbox__label{cursor:default;pointer-events:none}.c-checkbox input[type=checkbox]{-webkit-appearance:none;appearance:none;width:18px;height:18px;border:var(--size-border-width-md, 2px) solid var(--color-textfield-border-default, #929a99);background-color:var(--color-textfield-background-default);border-radius:var(--size-border-radius-sm, 4px);display:grid;place-content:center;cursor:pointer}.c-checkbox input[type=checkbox]:hover{border:var(--size-border-width-md, 2px) solid var(--color-textfield-border-hover, #7d8483)}.c-checkbox input[type=checkbox]:not(:disabled):not(.c-checkbox__input--skeleton):focus-visible{box-shadow:var(--focus-outset);outline:none}.c-checkbox input[type=checkbox].c-checkbox__input--error{border-color:var(--color-feedback-danger-default, #ba2f1e)}.c-checkbox input[type=checkbox].c-checkbox__input--error:checked,.c-checkbox input[type=checkbox].c-checkbox__input--error:indeterminate,.c-checkbox input[type=checkbox].c-checkbox__input--error:checked:hover,.c-checkbox input[type=checkbox].c-checkbox__input--error:indeterminate:hover{background-color:var(--color-feedback-danger-default, #ba2f1e);border-color:var(--color-feedback-danger-default, #ba2f1e)}.c-checkbox input[type=checkbox]:checked,.c-checkbox input[type=checkbox]:indeterminate{border-color:var(--color-action-primary-selected-background-default, #217870);background-color:var(--color-action-primary-selected-background-default, #217870)}.c-checkbox input[type=checkbox]:checked:hover,.c-checkbox input[type=checkbox]:indeterminate:hover{background-color:var(--color-action-primary-selected-background-hover, #19625b);border-color:var(--color-action-primary-selected-background-hover, #19625b)}.c-checkbox input[type=checkbox]:disabled{border:var(--size-border-width-md, 2px) solid var(--color-textfield-border-disabled, #a6b0af);background:var(--color-textfield-background-disabled, rgba(0, 0, 0, .02));cursor:not-allowed}.c-checkbox input[type=checkbox]:disabled+.c-checkbox__label{pointer-events:none;cursor:not-allowed}.c-checkbox input[type=checkbox]:checked:disabled,.c-checkbox input[type=checkbox]:indeterminate:disabled{border:var(--size-border-width-md, 2px) solid var(--color-textfield-border-disabled, #a6b0af);background:var(--color-textfield-background-disabled, rgba(0, 0, 0, .02));cursor:not-allowed}.c-checkbox input[type=checkbox]:checked:before{content:\"\";width:10px;height:10px;transition:.12s transform ease-in-out;box-shadow:inset 1em 1em #fff;clip-path:polygon(14% 44%,0 65%,50% 100%,100% 16%,80% 0%,43% 62%)}.c-checkbox input[type=checkbox]:indeterminate:before{content:\"\";width:10px;height:10px;transition:.12s transform ease-in-out;box-shadow:inset 1em 1em #fff;clip-path:polygon(0% 38%,100% 38%,100% 62%,0 62%)}.c-checkbox input[type=checkbox]:checked:disabled:before,.c-checkbox input[type=checkbox]:indeterminate:disabled:before{box-shadow:inset 1em 1em #7d8483}.c-checkbox input[type=checkbox].c-checkbox__input--skeleton{border-color:var(--color-effect-skeleton-soft);background-color:var(--color-textfield-background-disabled);cursor:not-allowed;pointer-events:none}.c-checkbox input[type=checkbox].c-checkbox__input--skeleton:before{content:none!important}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: InputLabelComponent, selector: "lib-input-label", inputs: ["text", "required", "size", "disabled", "for", "innerHTML"] }] });
2777
+ ], ngImport: i0, template: "<div [ngClass]=\"classes()\" class=\"c-checkbox\">\n <div class=\"c-checkbox__input-wrapper\">\n <input\n type=\"checkbox\"\n [id]=\"name()\"\n [ngClass]=\"inputClasses()\"\n [checked]=\"isChecked()\"\n [indeterminate]=\"isIndeterminate()\"\n [disabled]=\"isDisabled()\"\n [name]=\"name()\"\n [value]=\"value()\"\n [attr.aria-label]=\"computedAriaLabel()\"\n [attr.aria-checked]=\"ariaChecked()\"\n (change)=\"handleChange($event)\"\n (keydown)=\"handleKeyDown($event)\"\n />\n </div>\n @if(isSkeleton()) {\n <div class=\"c-checkbox__label__skeleton\">\n <span></span>\n </div>\n } @else {\n <lib-input-label\n [text]=\"label()\"\n [disabled]=\"disabled()\"\n [required]=\"true\"\n [for]=\"name()\"\n [innerHTML]=\"innerHTML()\"\n ></lib-input-label>\n }\n</div>\n", styles: [".c-checkbox{display:inline-flex;align-items:center;vertical-align:middle;gap:var(--space-component-gap-sm)}.c-checkbox__input-wrapper{height:var(--typography-label-md-default-line-height);display:flex;align-items:center}.c-checkbox__label{cursor:pointer}.c-checkbox__label__skeleton{width:64px;height:24px;display:flex;align-items:center}.c-checkbox__label__skeleton span{width:100%;height:8px;background-color:var(--color-effect-skeleton-default);border-radius:var(--size-border-radius-sm, 4px)}.c-checkbox--skeleton .c-checkbox__label{cursor:default;pointer-events:none}.c-checkbox input[type=checkbox]{-webkit-appearance:none;appearance:none;width:18px;height:18px;border:var(--size-border-width-md, 2px) solid var(--color-textfield-border-default, #929a99);background-color:var(--color-textfield-background-default);border-radius:var(--size-border-radius-sm, 4px);display:grid;place-content:center;cursor:pointer}.c-checkbox input[type=checkbox]:hover{border:var(--size-border-width-md, 2px) solid var(--color-textfield-border-hover, #7d8483)}.c-checkbox input[type=checkbox]:not(:disabled):not(.c-checkbox__input--skeleton):focus-visible{box-shadow:var(--focus-outset);outline:none}.c-checkbox input[type=checkbox].c-checkbox__input--error{border-color:var(--color-feedback-danger-default, #ba2f1e)}.c-checkbox input[type=checkbox].c-checkbox__input--error:checked,.c-checkbox input[type=checkbox].c-checkbox__input--error:indeterminate,.c-checkbox input[type=checkbox].c-checkbox__input--error:checked:hover,.c-checkbox input[type=checkbox].c-checkbox__input--error:indeterminate:hover{background-color:var(--color-feedback-danger-default, #ba2f1e);border-color:var(--color-feedback-danger-default, #ba2f1e)}.c-checkbox input[type=checkbox]:checked,.c-checkbox input[type=checkbox]:indeterminate{border-color:var(--color-action-primary-selected-background-default, #217870);background-color:var(--color-action-primary-selected-background-default, #217870)}.c-checkbox input[type=checkbox]:checked:hover,.c-checkbox input[type=checkbox]:indeterminate:hover{background-color:var(--color-action-primary-selected-background-hover, #19625b);border-color:var(--color-action-primary-selected-background-hover, #19625b)}.c-checkbox input[type=checkbox]:disabled{border:var(--size-border-width-md, 2px) solid var(--color-textfield-border-disabled, #a6b0af);background:var(--color-textfield-background-disabled, rgba(0, 0, 0, .02));cursor:not-allowed}.c-checkbox input[type=checkbox]:disabled+.c-checkbox__label{pointer-events:none;cursor:not-allowed}.c-checkbox input[type=checkbox]:checked:disabled,.c-checkbox input[type=checkbox]:indeterminate:disabled{border:var(--size-border-width-md, 2px) solid var(--color-textfield-border-disabled, #a6b0af);background:var(--color-textfield-background-disabled, rgba(0, 0, 0, .02));cursor:not-allowed}.c-checkbox input[type=checkbox]:checked:before{content:\"\";width:10px;height:10px;transition:.12s transform ease-in-out;box-shadow:inset 1em 1em #fff;clip-path:polygon(14% 44%,0 65%,50% 100%,100% 16%,80% 0%,43% 62%)}.c-checkbox input[type=checkbox]:indeterminate:before{content:\"\";width:10px;height:10px;transition:.12s transform ease-in-out;box-shadow:inset 1em 1em #fff;clip-path:polygon(0% 38%,100% 38%,100% 62%,0 62%)}.c-checkbox input[type=checkbox]:checked:disabled:before,.c-checkbox input[type=checkbox]:indeterminate:disabled:before{box-shadow:inset 1em 1em #7d8483}.c-checkbox input[type=checkbox].c-checkbox__input--skeleton{border-color:var(--color-effect-skeleton-soft);background-color:var(--color-textfield-background-disabled);cursor:not-allowed;pointer-events:none}.c-checkbox input[type=checkbox].c-checkbox__input--skeleton:before{content:none!important}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: InputLabelComponent, selector: "lib-input-label", inputs: ["text", "required", "size", "disabled", "for", "innerHTML"] }] });
2701
2778
  }
2702
2779
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.7", ngImport: i0, type: CheckboxComponent, decorators: [{
2703
2780
  type: Component,
@@ -2707,7 +2784,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.7", ngImpor
2707
2784
  useExisting: forwardRef(() => CheckboxComponent),
2708
2785
  multi: true,
2709
2786
  },
2710
- ], template: "<div [ngClass]=\"classes()\" class=\"c-checkbox\">\n <div class=\"c-checkbox__input-wrapper\">\n <input\n type=\"checkbox\"\n [id]=\"name()\"\n [ngClass]=\"inputClasses()\"\n [checked]=\"isChecked()\"\n [indeterminate]=\"isIndeterminate()\"\n [disabled]=\"isDisabled()\"\n [name]=\"name()\"\n [value]=\"value()\"\n [attr.aria-label]=\"computedAriaLabel()\"\n [attr.aria-checked]=\"ariaChecked()\"\n (change)=\"handleChange($event)\"\n (keydown)=\"handleKeyDown($event)\"\n />\n </div>\n @if(isSkeleton()) {\n <div class=\"c-checkbox__label__skeleton\">\n <span></span>\n </div>\n } @else {\n <lib-input-label\n [text]=\"label()\"\n [disabled]=\"disabled()\"\n [required]=\"true\"\n [for]=\"name()\"\n [innerHTML]=\"innerHTML()\"\n ></lib-input-label>\n }\n</div>\n", styles: [".c-checkbox{display:flex;align-items:flex-start;gap:var(--space-component-gap-sm)}.c-checkbox__input-wrapper{height:var(--typography-label-md-default-line-height);display:flex;align-items:center}.c-checkbox__label{cursor:pointer}.c-checkbox__label__skeleton{width:64px;height:24px;display:flex;align-items:center}.c-checkbox__label__skeleton span{width:100%;height:8px;background-color:var(--color-effect-skeleton-default);border-radius:var(--size-border-radius-sm, 4px)}.c-checkbox--skeleton .c-checkbox__label{cursor:default;pointer-events:none}.c-checkbox input[type=checkbox]{-webkit-appearance:none;appearance:none;width:18px;height:18px;border:var(--size-border-width-md, 2px) solid var(--color-textfield-border-default, #929a99);background-color:var(--color-textfield-background-default);border-radius:var(--size-border-radius-sm, 4px);display:grid;place-content:center;cursor:pointer}.c-checkbox input[type=checkbox]:hover{border:var(--size-border-width-md, 2px) solid var(--color-textfield-border-hover, #7d8483)}.c-checkbox input[type=checkbox]:not(:disabled):not(.c-checkbox__input--skeleton):focus-visible{box-shadow:var(--focus-outset);outline:none}.c-checkbox input[type=checkbox].c-checkbox__input--error{border-color:var(--color-feedback-danger-default, #ba2f1e)}.c-checkbox input[type=checkbox].c-checkbox__input--error:checked,.c-checkbox input[type=checkbox].c-checkbox__input--error:indeterminate,.c-checkbox input[type=checkbox].c-checkbox__input--error:checked:hover,.c-checkbox input[type=checkbox].c-checkbox__input--error:indeterminate:hover{background-color:var(--color-feedback-danger-default, #ba2f1e);border-color:var(--color-feedback-danger-default, #ba2f1e)}.c-checkbox input[type=checkbox]:checked,.c-checkbox input[type=checkbox]:indeterminate{border-color:var(--color-action-primary-selected-background-default, #217870);background-color:var(--color-action-primary-selected-background-default, #217870)}.c-checkbox input[type=checkbox]:checked:hover,.c-checkbox input[type=checkbox]:indeterminate:hover{background-color:var(--color-action-primary-selected-background-hover, #19625b);border-color:var(--color-action-primary-selected-background-hover, #19625b)}.c-checkbox input[type=checkbox]:disabled{border:var(--size-border-width-md, 2px) solid var(--color-textfield-border-disabled, #a6b0af);background:var(--color-textfield-background-disabled, rgba(0, 0, 0, .02));cursor:not-allowed}.c-checkbox input[type=checkbox]:disabled+.c-checkbox__label{pointer-events:none;cursor:not-allowed}.c-checkbox input[type=checkbox]:checked:disabled,.c-checkbox input[type=checkbox]:indeterminate:disabled{border:var(--size-border-width-md, 2px) solid var(--color-textfield-border-disabled, #a6b0af);background:var(--color-textfield-background-disabled, rgba(0, 0, 0, .02));cursor:not-allowed}.c-checkbox input[type=checkbox]:checked:before{content:\"\";width:10px;height:10px;transition:.12s transform ease-in-out;box-shadow:inset 1em 1em #fff;clip-path:polygon(14% 44%,0 65%,50% 100%,100% 16%,80% 0%,43% 62%)}.c-checkbox input[type=checkbox]:indeterminate:before{content:\"\";width:10px;height:10px;transition:.12s transform ease-in-out;box-shadow:inset 1em 1em #fff;clip-path:polygon(0% 38%,100% 38%,100% 62%,0 62%)}.c-checkbox input[type=checkbox]:checked:disabled:before,.c-checkbox input[type=checkbox]:indeterminate:disabled:before{box-shadow:inset 1em 1em #7d8483}.c-checkbox input[type=checkbox].c-checkbox__input--skeleton{border-color:var(--color-effect-skeleton-soft);background-color:var(--color-textfield-background-disabled);cursor:not-allowed;pointer-events:none}.c-checkbox input[type=checkbox].c-checkbox__input--skeleton:before{content:none!important}\n"] }]
2787
+ ], template: "<div [ngClass]=\"classes()\" class=\"c-checkbox\">\n <div class=\"c-checkbox__input-wrapper\">\n <input\n type=\"checkbox\"\n [id]=\"name()\"\n [ngClass]=\"inputClasses()\"\n [checked]=\"isChecked()\"\n [indeterminate]=\"isIndeterminate()\"\n [disabled]=\"isDisabled()\"\n [name]=\"name()\"\n [value]=\"value()\"\n [attr.aria-label]=\"computedAriaLabel()\"\n [attr.aria-checked]=\"ariaChecked()\"\n (change)=\"handleChange($event)\"\n (keydown)=\"handleKeyDown($event)\"\n />\n </div>\n @if(isSkeleton()) {\n <div class=\"c-checkbox__label__skeleton\">\n <span></span>\n </div>\n } @else {\n <lib-input-label\n [text]=\"label()\"\n [disabled]=\"disabled()\"\n [required]=\"true\"\n [for]=\"name()\"\n [innerHTML]=\"innerHTML()\"\n ></lib-input-label>\n }\n</div>\n", styles: [".c-checkbox{display:inline-flex;align-items:center;vertical-align:middle;gap:var(--space-component-gap-sm)}.c-checkbox__input-wrapper{height:var(--typography-label-md-default-line-height);display:flex;align-items:center}.c-checkbox__label{cursor:pointer}.c-checkbox__label__skeleton{width:64px;height:24px;display:flex;align-items:center}.c-checkbox__label__skeleton span{width:100%;height:8px;background-color:var(--color-effect-skeleton-default);border-radius:var(--size-border-radius-sm, 4px)}.c-checkbox--skeleton .c-checkbox__label{cursor:default;pointer-events:none}.c-checkbox input[type=checkbox]{-webkit-appearance:none;appearance:none;width:18px;height:18px;border:var(--size-border-width-md, 2px) solid var(--color-textfield-border-default, #929a99);background-color:var(--color-textfield-background-default);border-radius:var(--size-border-radius-sm, 4px);display:grid;place-content:center;cursor:pointer}.c-checkbox input[type=checkbox]:hover{border:var(--size-border-width-md, 2px) solid var(--color-textfield-border-hover, #7d8483)}.c-checkbox input[type=checkbox]:not(:disabled):not(.c-checkbox__input--skeleton):focus-visible{box-shadow:var(--focus-outset);outline:none}.c-checkbox input[type=checkbox].c-checkbox__input--error{border-color:var(--color-feedback-danger-default, #ba2f1e)}.c-checkbox input[type=checkbox].c-checkbox__input--error:checked,.c-checkbox input[type=checkbox].c-checkbox__input--error:indeterminate,.c-checkbox input[type=checkbox].c-checkbox__input--error:checked:hover,.c-checkbox input[type=checkbox].c-checkbox__input--error:indeterminate:hover{background-color:var(--color-feedback-danger-default, #ba2f1e);border-color:var(--color-feedback-danger-default, #ba2f1e)}.c-checkbox input[type=checkbox]:checked,.c-checkbox input[type=checkbox]:indeterminate{border-color:var(--color-action-primary-selected-background-default, #217870);background-color:var(--color-action-primary-selected-background-default, #217870)}.c-checkbox input[type=checkbox]:checked:hover,.c-checkbox input[type=checkbox]:indeterminate:hover{background-color:var(--color-action-primary-selected-background-hover, #19625b);border-color:var(--color-action-primary-selected-background-hover, #19625b)}.c-checkbox input[type=checkbox]:disabled{border:var(--size-border-width-md, 2px) solid var(--color-textfield-border-disabled, #a6b0af);background:var(--color-textfield-background-disabled, rgba(0, 0, 0, .02));cursor:not-allowed}.c-checkbox input[type=checkbox]:disabled+.c-checkbox__label{pointer-events:none;cursor:not-allowed}.c-checkbox input[type=checkbox]:checked:disabled,.c-checkbox input[type=checkbox]:indeterminate:disabled{border:var(--size-border-width-md, 2px) solid var(--color-textfield-border-disabled, #a6b0af);background:var(--color-textfield-background-disabled, rgba(0, 0, 0, .02));cursor:not-allowed}.c-checkbox input[type=checkbox]:checked:before{content:\"\";width:10px;height:10px;transition:.12s transform ease-in-out;box-shadow:inset 1em 1em #fff;clip-path:polygon(14% 44%,0 65%,50% 100%,100% 16%,80% 0%,43% 62%)}.c-checkbox input[type=checkbox]:indeterminate:before{content:\"\";width:10px;height:10px;transition:.12s transform ease-in-out;box-shadow:inset 1em 1em #fff;clip-path:polygon(0% 38%,100% 38%,100% 62%,0 62%)}.c-checkbox input[type=checkbox]:checked:disabled:before,.c-checkbox input[type=checkbox]:indeterminate:disabled:before{box-shadow:inset 1em 1em #7d8483}.c-checkbox input[type=checkbox].c-checkbox__input--skeleton{border-color:var(--color-effect-skeleton-soft);background-color:var(--color-textfield-background-disabled);cursor:not-allowed;pointer-events:none}.c-checkbox input[type=checkbox].c-checkbox__input--skeleton:before{content:none!important}\n"] }]
2711
2788
  }], ctorParameters: () => [] });
2712
2789
 
2713
2790
  class HelperTextComponent {
@@ -2876,6 +2953,286 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.7", ngImpor
2876
2953
  args: [{ selector: 'lib-chips', template: "<div role=\"group\" class=\"c-chip\" aria-label=\"Opciones de filtro\">\n @for (option of options(); track option.value) {\n <label class=\"c-chip__label\" [for]=\"'chip-' + option.value\">\n <input\n type=\"checkbox\"\n [id]=\"'chip-' + option.value\"\n [disabled]=\"option.disabled\"\n [value]=\"option.value\"\n [checked]=\"option.selected\"\n (change)=\"toggle(option)\"\n class=\"c-chip__input\"\n />\n <span class=\"c-chip__text\">{{ option.label }}</span>\n </label>\n }\n</div>\n", styles: [".c-chip{display:inline-flex;align-items:center;gap:var(--space-container-stack-sm);cursor:pointer;-webkit-user-select:none;user-select:none;font-family:var(--typography-label-md-strong-family),sans-serif;font-weight:var(--typography-label-md-strong-weight);font-size:var(--typography-label-md-strong-size);line-height:var(--typography-label-md-strong-line-height);letter-spacing:var(--typography-label-md-strong-letter-spacing)}.c-chip__label{display:inline-block;padding:var(--space-component-padding-sm) var(--space-component-padding-md);background-color:var(--color-action-primary-background-default);border:var(--size-border-width-sm) solid var(--color-action-primary-border-default);border-radius:var(--size-border-radius-full);color:var(--color-action-primary-content-default);cursor:pointer}.c-chip__label:hover{background-color:var(--color-action-primary-background-hover);border-color:var(--color-action-primary-border-hover);color:var(--color-action-primary-content-hover)}.c-chip__label:has(.c-chip__input:focus-visible){box-shadow:var(--focus-outset);outline:none}.c-chip__label:active{background-color:var(--color-action-primary-background-pressed);border-color:var(--color-action-primary-border-pressed);color:var(--color-action-primary-content-pressed)}.c-chip__label:has(input:disabled){background-color:var(--color-action-primary-background-disabled);border-color:var(--color-action-primary-border-disabled);color:var(--color-action-primary-content-disabled);cursor:not-allowed}.c-chip__label:has(input:checked){background-color:var(--color-action-primary-selected-background-default);color:var(--color-button-primary-content-default);border-color:var(--color-action-primary-selected-border-default)}.c-chip__label:has(input:checked):hover{background-color:var(--color-action-primary-selected-background-hover);border-color:var(--color-action-primary-selected-border-hover)}.c-chip__label:has(input:checked):focus-visible{box-shadow:var(--focus-outset);outline:none}.c-chip__label:has(input:checked):active{background-color:var(--color-action-primary-selected-background-pressed);border-color:var(--color-action-primary-selected-border-pressed)}.c-chip__input{position:absolute;opacity:0}.c-chip__input:hover{cursor:pointer}\n"] }]
2877
2954
  }] });
2878
2955
 
2956
+ class DropdownComponent {
2957
+ dataSource = input.required();
2958
+ value = input();
2959
+ disabled = input(false);
2960
+ selectionChange = output();
2961
+ isOpen = signal(false);
2962
+ isClosing = signal(false);
2963
+ selectedOption = signal(null);
2964
+ dropdownId = 'c-dropdown';
2965
+ listboxId = `${this.dropdownId}-listbox`;
2966
+ elementRef = inject(ElementRef);
2967
+ triggerButtonRef;
2968
+ dropdownButton;
2969
+ dropdownMenu;
2970
+ onClickOutside(event) {
2971
+ if (this.isOpen() && !this.isClosing()) {
2972
+ const clickedElement = event.target;
2973
+ const isClickInsideDropdown = this.elementRef.nativeElement.contains(clickedElement);
2974
+ const isClickOnTrigger = this.triggerButtonRef?.contains(clickedElement);
2975
+ if (!isClickInsideDropdown && !isClickOnTrigger) {
2976
+ this.closeDropdown();
2977
+ }
2978
+ }
2979
+ }
2980
+ onWindowResize() {
2981
+ if (this.isOpen()) {
2982
+ setTimeout(() => {
2983
+ this.calculateOptimalPosition();
2984
+ }, 0);
2985
+ }
2986
+ }
2987
+ onWindowScroll() {
2988
+ if (this.isOpen()) {
2989
+ setTimeout(() => {
2990
+ this.calculateOptimalPosition();
2991
+ }, 0);
2992
+ }
2993
+ }
2994
+ classes = computed(() => {
2995
+ const c = [
2996
+ 'c-dropdown',
2997
+ this.disabled() ? 'c-dropdown--disabled' : '',
2998
+ this.isOpen() ? 'c-dropdown--open' : '',
2999
+ ];
3000
+ return c.filter(Boolean).join(' ');
3001
+ });
3002
+ menuStyles = computed(() => {
3003
+ const styles = {
3004
+ 'max-height': `${this.maxHeight()}px`,
3005
+ 'left': `${this.menuLeft()}px`,
3006
+ 'top': `${this.menuTop()}px`
3007
+ };
3008
+ if (this.isClosing()) {
3009
+ styles['animation'] = 'dropdown-exit 200ms ease-in forwards';
3010
+ }
3011
+ return styles;
3012
+ });
3013
+ maxHeight = signal(200);
3014
+ menuLeft = signal(0);
3015
+ menuTop = signal(0);
3016
+ get flatOptions() {
3017
+ return this.dataSource().type === 'default' ? this.dataSource()?.options || [] : this.dataSource().groups?.flatMap((group) => group.options) || [];
3018
+ }
3019
+ constructor() {
3020
+ effect(() => {
3021
+ const value = this.value();
3022
+ if (value !== undefined) {
3023
+ const option = this.flatOptions.find((opt) => opt.value === value);
3024
+ this.selectedOption.set(option || null);
3025
+ }
3026
+ });
3027
+ effect(() => {
3028
+ if (this.isOpen()) {
3029
+ setTimeout(() => {
3030
+ this.calculateOptimalPosition();
3031
+ }, 0);
3032
+ }
3033
+ });
3034
+ }
3035
+ setTriggerButton(element) {
3036
+ this.triggerButtonRef = element;
3037
+ }
3038
+ toggleDropdown() {
3039
+ if (this.disabled()) {
3040
+ return;
3041
+ }
3042
+ if (this.isOpen() && !this.isClosing()) {
3043
+ this.closeDropdown();
3044
+ }
3045
+ else if (!this.isOpen() && !this.isClosing()) {
3046
+ this.openAndFocusFirst();
3047
+ }
3048
+ }
3049
+ openAndFocusFirst() {
3050
+ this.isClosing.set(false);
3051
+ this.isOpen.set(true);
3052
+ setTimeout(() => this.focusFirst(), 10);
3053
+ }
3054
+ closeDropdown() {
3055
+ this.isClosing.set(true);
3056
+ setTimeout(() => {
3057
+ this.isOpen.set(false);
3058
+ this.isClosing.set(false);
3059
+ }, 150);
3060
+ }
3061
+ closeAndFocusButton() {
3062
+ this.closeDropdown();
3063
+ setTimeout(() => {
3064
+ this.dropdownButton.nativeElement.focus();
3065
+ }, 150);
3066
+ }
3067
+ selectOption(option) {
3068
+ if (option.disabled) {
3069
+ return;
3070
+ }
3071
+ this.selectedOption.set(option);
3072
+ this.closeDropdown();
3073
+ this.selectionChange.emit(option.value);
3074
+ }
3075
+ onKeydown(event) {
3076
+ if (this.disabled()) {
3077
+ return;
3078
+ }
3079
+ const { key } = event;
3080
+ switch (key) {
3081
+ case 'Enter':
3082
+ case ' ':
3083
+ event.preventDefault();
3084
+ this.toggleDropdown();
3085
+ break;
3086
+ case 'Escape':
3087
+ if (this.isOpen() && !this.isClosing()) {
3088
+ event.preventDefault();
3089
+ this.closeDropdown();
3090
+ }
3091
+ break;
3092
+ case 'ArrowDown':
3093
+ case 'ArrowUp':
3094
+ event.preventDefault();
3095
+ this.openAndFocusFirst();
3096
+ break;
3097
+ }
3098
+ }
3099
+ onOptionKeydown(event, option) {
3100
+ const { key } = event;
3101
+ switch (key) {
3102
+ case 'Enter':
3103
+ case ' ':
3104
+ event.preventDefault();
3105
+ this.selectOption(option);
3106
+ break;
3107
+ case 'ArrowDown':
3108
+ event.preventDefault();
3109
+ this.focusNext();
3110
+ break;
3111
+ case 'ArrowUp':
3112
+ event.preventDefault();
3113
+ this.focusPrevious();
3114
+ break;
3115
+ case 'Escape':
3116
+ event.preventDefault();
3117
+ this.closeAndFocusButton();
3118
+ break;
3119
+ }
3120
+ }
3121
+ isOptionSelected(option) {
3122
+ return this.selectedOption()?.value === option.value;
3123
+ }
3124
+ get availableOptions() {
3125
+ if (!this.dropdownMenu?.nativeElement) {
3126
+ return [];
3127
+ }
3128
+ return Array.from(this.dropdownMenu.nativeElement.querySelectorAll('[role="option"]:not([aria-disabled="true"])'));
3129
+ }
3130
+ focusFirst() {
3131
+ if (!this.dropdownMenu?.nativeElement) {
3132
+ setTimeout(() => this.focusFirst(), 10);
3133
+ return;
3134
+ }
3135
+ const firstOption = this.availableOptions[0];
3136
+ if (firstOption && firstOption.offsetParent !== null) {
3137
+ firstOption.focus();
3138
+ }
3139
+ }
3140
+ focusNext() {
3141
+ const options = this.availableOptions;
3142
+ if (options.length === 0) {
3143
+ return;
3144
+ }
3145
+ const currentIndex = options.indexOf(document.activeElement);
3146
+ const nextIndex = currentIndex === -1 ? 0 : (currentIndex + 1) % options.length;
3147
+ options[nextIndex]?.focus();
3148
+ }
3149
+ focusPrevious() {
3150
+ const options = this.availableOptions;
3151
+ if (options.length === 0) {
3152
+ return;
3153
+ }
3154
+ const currentIndex = options.indexOf(document.activeElement);
3155
+ const prevIndex = currentIndex === -1 ? options.length - 1 : currentIndex === 0 ? options.length - 1 : currentIndex - 1;
3156
+ options[prevIndex]?.focus();
3157
+ }
3158
+ calculateOptimalPosition() {
3159
+ const buttonElement = this.triggerButtonRef || this.dropdownButton?.nativeElement;
3160
+ if (!buttonElement) {
3161
+ return;
3162
+ }
3163
+ const buttonRect = buttonElement.getBoundingClientRect();
3164
+ const { innerWidth, innerHeight, scrollY, scrollX } = window;
3165
+ const MENU_WIDTH = 320;
3166
+ const MIN_HEIGHT = 120;
3167
+ const GAP = 8;
3168
+ const OPTION_HEIGHT = 40;
3169
+ const PADDING = 16;
3170
+ const spaceBelow = innerHeight - buttonRect.bottom - GAP;
3171
+ const spaceAbove = buttonRect.top - GAP;
3172
+ const spaceRight = innerWidth - buttonRect.left;
3173
+ const openUpward = spaceBelow < MIN_HEIGHT && spaceAbove > spaceBelow;
3174
+ const alignLeft = spaceRight < MENU_WIDTH;
3175
+ const availableSpace = openUpward ? spaceAbove : spaceBelow;
3176
+ const idealHeight = this.flatOptions.length * OPTION_HEIGHT + PADDING;
3177
+ const maxHeight = Math.min(idealHeight, Math.max(MIN_HEIGHT, availableSpace - 20));
3178
+ let left = buttonRect.left + scrollX;
3179
+ let top = buttonRect.bottom + scrollY + GAP;
3180
+ if (alignLeft) {
3181
+ left = buttonRect.right + scrollX - MENU_WIDTH;
3182
+ }
3183
+ if (openUpward) {
3184
+ top = buttonRect.top + scrollY - maxHeight - GAP;
3185
+ }
3186
+ this.maxHeight.set(maxHeight);
3187
+ this.menuLeft.set(left);
3188
+ this.menuTop.set(top);
3189
+ }
3190
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.7", ngImport: i0, type: DropdownComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
3191
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.7", type: DropdownComponent, isStandalone: true, selector: "lib-dropdown", inputs: { dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: true, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectionChange: "selectionChange" }, host: { listeners: { "document:click": "onClickOutside($event)", "window:resize": "onWindowResize()", "window:scroll": "onWindowScroll()" } }, viewQueries: [{ propertyName: "dropdownButton", first: true, predicate: ["dropdownButton"], descendants: true, static: true }, { propertyName: "dropdownMenu", first: true, predicate: ["dropdownMenu"], descendants: true }], ngImport: i0, template: "@if (isOpen() || isClosing()) {\n <div \n #dropdownMenu\n [id]=\"listboxId\"\n class=\"c-dropdown__menu\" \n [ngStyle]=\"menuStyles()\"\n role=\"listbox\"\n [attr.aria-labelledby]=\"dropdownId\"\n >\n\n @switch (dataSource().type) {\n @case ('default') {\n @for (option of dataSource().options; track option.value) {\n <ng-container *ngTemplateOutlet=\"optionTpl; context: { $implicit: option }\"></ng-container>\n }\n }\n\n @case ('group') {\n @for (group of dataSource().groups; track group.header) {\n <div class=\"c-dropdown__group\" role=\"group\" [attr.aria-labelledby]=\"'group-header-' + $index\">\n <div\n role=\"presentation\" \n class=\"c-dropdown__group-header\" \n [id]=\"'group-header-' + $index\"\n [attr.aria-hidden]=\"true\">\n {{ group.header }}\n </div>\n\n @for (option of group.options; track option.value) {\n <ng-container *ngTemplateOutlet=\"optionTpl; context: { $implicit: option }\"></ng-container>\n }\n </div>\n }\n }\n }\n </div>\n}\n\n<ng-template #optionTpl let-option>\n <div\n role=\"option\"\n class=\"c-dropdown__option\"\n [attr.tabindex]=\"option.disabled ? -1 : 0\"\n [attr.aria-selected]=\"isOptionSelected(option)\"\n [attr.aria-disabled]=\"option.disabled\"\n [class.c-dropdown__option--disabled]=\"option.disabled\"\n [class.c-dropdown__option--selected]=\"isOptionSelected(option)\"\n (click)=\"selectOption(option)\"\n (keydown)=\"onOptionKeydown($event, option)\">\n <div class=\"c-dropdown__option-content\">\n @if (option.icon) {\n <lib-icon [name]=\"option.icon\" [size]=\"'lg'\"></lib-icon>\n }\n \n <span class=\"c-dropdown__option-label\">{{ option.label }}</span>\n \n @if (option.detail) {\n <span class=\"c-dropdown__option-detail\">{{ option.detail }}</span>\n }\n </div>\n</div>\n</ng-template>", styles: [".c-dropdown{cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:var(--space-component-gap-sm);font-family:var(--typography-body-md-family),sans-serif;font-weight:var(--typography-body-md-weight);font-size:var(--typography-body-md-size);line-height:var(--typography-body-md-line-height);background-color:var(--color-background-primary);border:var(--size-border-width-sm) solid var(--color-border-neutral-default);border-radius:var(--size-border-radius-sm);padding:var(--space-component-padding-sm) var(--space-component-padding-md);min-width:200px;transition:all .2s ease-in-out;box-sizing:border-box}.c-dropdown:focus-visible{box-shadow:var(--focus-outset);outline:none}.c-dropdown:hover:not(.c-dropdown--disabled){border-color:var(--color-border-neutral-hover)}.c-dropdown--disabled{cursor:auto;background-color:var(--color-background-neutral-disabled);border-color:var(--color-border-neutral-disabled);color:var(--color-content-neutral-disabled)}.c-dropdown--open{border-color:var(--color-border-accent-default);box-shadow:0 0 0 1px var(--color-border-accent-default)}.c-dropdown__menu{position:fixed;overflow-y:auto;overflow-x:hidden;z-index:1000;width:320px;padding-top:var(--space-component-padding-sm);padding-bottom:var(--space-component-padding-sm);border-radius:var(--size-textfield-border-radius, 8px);border:var(--size-border-width-sm, 1px) solid var(--color-core-border-soft, #D6E0DF);background:var(--color-core-background-surface-raised, #FFF);box-shadow:0 0 4px 0 var(--color-effect-shadow-soft, rgba(4, 37, 34, .12)),0 2px 4px 0 var(--color-effect-shadow-strong, rgba(4, 37, 34, .16));scroll-behavior:smooth;opacity:0;transform:translateY(-8px) scale(.95);animation:dropdown-enter .2s ease-out forwards;transform-origin:top center}.c-dropdown__menu::-webkit-scrollbar{width:4px;padding:0 var(--space-component-padding-lg)}.c-dropdown__menu::-webkit-scrollbar-track{border-radius:4px;background:transparent}.c-dropdown__menu::-webkit-scrollbar-thumb{border-radius:4px;background:var(--color-core-border-soft)}.c-dropdown__menu::-webkit-scrollbar-thumb:hover{background:var(--color-core-border-default)}.c-dropdown__group{width:100%}.c-dropdown__group-header{display:flex;align-items:center;width:100%;padding:var(--space-component-padding-md) var(--space-component-padding-lg);min-height:calc(48px - var(--space-component-padding-md) * 2);gap:var(--space-component-gap-sm);color:var(--color-core-content-soft);font-family:var(--typography-label-sm-strong-family);font-size:var(--typography-label-sm-strong-size);font-style:normal;font-weight:var(--typography-label-sm-strong-weight);line-height:var(--typography-label-sm-strong-line-height);letter-spacing:var(--typography-label-sm-strong-letter-spacing)}.c-dropdown__option{cursor:pointer;display:flex;align-items:center;font-style:normal;border:none;background-color:transparent;text-align:left;min-height:calc(40px - var(--space-component-padding-sm) * 2);width:calc(100% - var(--space-component-padding-lg) * 2);padding:var(--space-component-padding-sm) var(--space-component-padding-lg);gap:var(--space-component-gap-sm);color:var(--color-core-content-default);transition:background-color .2s ease-in-out}.c-dropdown__option-content{display:flex;align-items:center;gap:var(--space-component-gap-sm)}.c-dropdown__option-label{word-wrap:break-word;overflow-wrap:break-word;white-space:normal;font-family:var(--typography-label-sm-default-family);font-size:var(--typography-label-sm-default-size);font-weight:var(--typography-label-sm-default-weight);line-height:var(--typography-label-sm-default-line-height);letter-spacing:var(--typography-label-sm-default-letter-spacing)}.c-dropdown__option-detail{font-style:normal;color:var(--color-core-content-soft);font-family:var(--typography-label-sm-default-family);font-size:var(--typography-label-sm-default-size);font-weight:var(--typography-label-sm-default-weight);line-height:var(--typography-label-sm-default-line-height);letter-spacing:var(--typography-label-sm-default-letter-spacing)}.c-dropdown__option:hover{background:var(--color-action-neutral-background-hover)}.c-dropdown__option:focus-visible{outline:none;background:var(--color-action-neutral-background-hover);box-shadow:0 0 0 2px var(--color-effect-focus-color) inset,0 0 0 4px var(--color-effect-focus-contrast) inset}.c-dropdown__option--disabled{pointer-events:none;color:var(--color-button-neutral-content-disabled)}.c-dropdown__option--disabled:hover{background-color:transparent}@keyframes dropdown-enter{0%{opacity:0;transform:translateY(-8px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes dropdown-exit{0%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(-4px) scale(.98)}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: IconComponent, selector: "lib-icon", inputs: ["size", "icon", "name", "color"] }] });
3192
+ }
3193
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.7", ngImport: i0, type: DropdownComponent, decorators: [{
3194
+ type: Component,
3195
+ args: [{ selector: 'lib-dropdown', imports: [NgTemplateOutlet, NgStyle, IconComponent], template: "@if (isOpen() || isClosing()) {\n <div \n #dropdownMenu\n [id]=\"listboxId\"\n class=\"c-dropdown__menu\" \n [ngStyle]=\"menuStyles()\"\n role=\"listbox\"\n [attr.aria-labelledby]=\"dropdownId\"\n >\n\n @switch (dataSource().type) {\n @case ('default') {\n @for (option of dataSource().options; track option.value) {\n <ng-container *ngTemplateOutlet=\"optionTpl; context: { $implicit: option }\"></ng-container>\n }\n }\n\n @case ('group') {\n @for (group of dataSource().groups; track group.header) {\n <div class=\"c-dropdown__group\" role=\"group\" [attr.aria-labelledby]=\"'group-header-' + $index\">\n <div\n role=\"presentation\" \n class=\"c-dropdown__group-header\" \n [id]=\"'group-header-' + $index\"\n [attr.aria-hidden]=\"true\">\n {{ group.header }}\n </div>\n\n @for (option of group.options; track option.value) {\n <ng-container *ngTemplateOutlet=\"optionTpl; context: { $implicit: option }\"></ng-container>\n }\n </div>\n }\n }\n }\n </div>\n}\n\n<ng-template #optionTpl let-option>\n <div\n role=\"option\"\n class=\"c-dropdown__option\"\n [attr.tabindex]=\"option.disabled ? -1 : 0\"\n [attr.aria-selected]=\"isOptionSelected(option)\"\n [attr.aria-disabled]=\"option.disabled\"\n [class.c-dropdown__option--disabled]=\"option.disabled\"\n [class.c-dropdown__option--selected]=\"isOptionSelected(option)\"\n (click)=\"selectOption(option)\"\n (keydown)=\"onOptionKeydown($event, option)\">\n <div class=\"c-dropdown__option-content\">\n @if (option.icon) {\n <lib-icon [name]=\"option.icon\" [size]=\"'lg'\"></lib-icon>\n }\n \n <span class=\"c-dropdown__option-label\">{{ option.label }}</span>\n \n @if (option.detail) {\n <span class=\"c-dropdown__option-detail\">{{ option.detail }}</span>\n }\n </div>\n</div>\n</ng-template>", styles: [".c-dropdown{cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:var(--space-component-gap-sm);font-family:var(--typography-body-md-family),sans-serif;font-weight:var(--typography-body-md-weight);font-size:var(--typography-body-md-size);line-height:var(--typography-body-md-line-height);background-color:var(--color-background-primary);border:var(--size-border-width-sm) solid var(--color-border-neutral-default);border-radius:var(--size-border-radius-sm);padding:var(--space-component-padding-sm) var(--space-component-padding-md);min-width:200px;transition:all .2s ease-in-out;box-sizing:border-box}.c-dropdown:focus-visible{box-shadow:var(--focus-outset);outline:none}.c-dropdown:hover:not(.c-dropdown--disabled){border-color:var(--color-border-neutral-hover)}.c-dropdown--disabled{cursor:auto;background-color:var(--color-background-neutral-disabled);border-color:var(--color-border-neutral-disabled);color:var(--color-content-neutral-disabled)}.c-dropdown--open{border-color:var(--color-border-accent-default);box-shadow:0 0 0 1px var(--color-border-accent-default)}.c-dropdown__menu{position:fixed;overflow-y:auto;overflow-x:hidden;z-index:1000;width:320px;padding-top:var(--space-component-padding-sm);padding-bottom:var(--space-component-padding-sm);border-radius:var(--size-textfield-border-radius, 8px);border:var(--size-border-width-sm, 1px) solid var(--color-core-border-soft, #D6E0DF);background:var(--color-core-background-surface-raised, #FFF);box-shadow:0 0 4px 0 var(--color-effect-shadow-soft, rgba(4, 37, 34, .12)),0 2px 4px 0 var(--color-effect-shadow-strong, rgba(4, 37, 34, .16));scroll-behavior:smooth;opacity:0;transform:translateY(-8px) scale(.95);animation:dropdown-enter .2s ease-out forwards;transform-origin:top center}.c-dropdown__menu::-webkit-scrollbar{width:4px;padding:0 var(--space-component-padding-lg)}.c-dropdown__menu::-webkit-scrollbar-track{border-radius:4px;background:transparent}.c-dropdown__menu::-webkit-scrollbar-thumb{border-radius:4px;background:var(--color-core-border-soft)}.c-dropdown__menu::-webkit-scrollbar-thumb:hover{background:var(--color-core-border-default)}.c-dropdown__group{width:100%}.c-dropdown__group-header{display:flex;align-items:center;width:100%;padding:var(--space-component-padding-md) var(--space-component-padding-lg);min-height:calc(48px - var(--space-component-padding-md) * 2);gap:var(--space-component-gap-sm);color:var(--color-core-content-soft);font-family:var(--typography-label-sm-strong-family);font-size:var(--typography-label-sm-strong-size);font-style:normal;font-weight:var(--typography-label-sm-strong-weight);line-height:var(--typography-label-sm-strong-line-height);letter-spacing:var(--typography-label-sm-strong-letter-spacing)}.c-dropdown__option{cursor:pointer;display:flex;align-items:center;font-style:normal;border:none;background-color:transparent;text-align:left;min-height:calc(40px - var(--space-component-padding-sm) * 2);width:calc(100% - var(--space-component-padding-lg) * 2);padding:var(--space-component-padding-sm) var(--space-component-padding-lg);gap:var(--space-component-gap-sm);color:var(--color-core-content-default);transition:background-color .2s ease-in-out}.c-dropdown__option-content{display:flex;align-items:center;gap:var(--space-component-gap-sm)}.c-dropdown__option-label{word-wrap:break-word;overflow-wrap:break-word;white-space:normal;font-family:var(--typography-label-sm-default-family);font-size:var(--typography-label-sm-default-size);font-weight:var(--typography-label-sm-default-weight);line-height:var(--typography-label-sm-default-line-height);letter-spacing:var(--typography-label-sm-default-letter-spacing)}.c-dropdown__option-detail{font-style:normal;color:var(--color-core-content-soft);font-family:var(--typography-label-sm-default-family);font-size:var(--typography-label-sm-default-size);font-weight:var(--typography-label-sm-default-weight);line-height:var(--typography-label-sm-default-line-height);letter-spacing:var(--typography-label-sm-default-letter-spacing)}.c-dropdown__option:hover{background:var(--color-action-neutral-background-hover)}.c-dropdown__option:focus-visible{outline:none;background:var(--color-action-neutral-background-hover);box-shadow:0 0 0 2px var(--color-effect-focus-color) inset,0 0 0 4px var(--color-effect-focus-contrast) inset}.c-dropdown__option--disabled{pointer-events:none;color:var(--color-button-neutral-content-disabled)}.c-dropdown__option--disabled:hover{background-color:transparent}@keyframes dropdown-enter{0%{opacity:0;transform:translateY(-8px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes dropdown-exit{0%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(-4px) scale(.98)}}\n"] }]
3196
+ }], ctorParameters: () => [], propDecorators: { dropdownButton: [{
3197
+ type: ViewChild,
3198
+ args: ['dropdownButton', { static: true }]
3199
+ }], dropdownMenu: [{
3200
+ type: ViewChild,
3201
+ args: ['dropdownMenu']
3202
+ }], onClickOutside: [{
3203
+ type: HostListener,
3204
+ args: ['document:click', ['$event']]
3205
+ }], onWindowResize: [{
3206
+ type: HostListener,
3207
+ args: ['window:resize']
3208
+ }], onWindowScroll: [{
3209
+ type: HostListener,
3210
+ args: ['window:scroll']
3211
+ }] } });
3212
+
3213
+ class DropdownTriggerDirective {
3214
+ libDropdownTriggerFor = input.required();
3215
+ elementRef = inject(ElementRef);
3216
+ onClick() {
3217
+ const dropdown = this.libDropdownTriggerFor();
3218
+ if (dropdown) {
3219
+ dropdown.setTriggerButton(this.elementRef.nativeElement);
3220
+ dropdown.toggleDropdown();
3221
+ }
3222
+ }
3223
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.7", ngImport: i0, type: DropdownTriggerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
3224
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.7", type: DropdownTriggerDirective, isStandalone: true, selector: "[libDropdownTriggerFor]", inputs: { libDropdownTriggerFor: { classPropertyName: "libDropdownTriggerFor", publicName: "libDropdownTriggerFor", isSignal: true, isRequired: true, transformFunction: null } }, host: { listeners: { "click": "onClick()" } }, ngImport: i0 });
3225
+ }
3226
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.7", ngImport: i0, type: DropdownTriggerDirective, decorators: [{
3227
+ type: Directive,
3228
+ args: [{
3229
+ selector: '[libDropdownTriggerFor]',
3230
+ }]
3231
+ }], propDecorators: { onClick: [{
3232
+ type: HostListener,
3233
+ args: ['click']
3234
+ }] } });
3235
+
2879
3236
  class DesignTokensComponent {
2880
3237
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.7", ngImport: i0, type: DesignTokensComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2881
3238
  static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.7", type: DesignTokensComponent, isStandalone: true, selector: "lib-styles", ngImport: i0, template: "<p>Styles works!</p>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
@@ -4327,6 +4684,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.7", ngImpor
4327
4684
  }] });
4328
4685
 
4329
4686
  class TagComponent {
4687
+ size = input('xs');
4330
4688
  variant = input('neutral');
4331
4689
  text = input('');
4332
4690
  extraClass = input('');
@@ -4339,11 +4697,11 @@ class TagComponent {
4339
4697
  this.closeEvent.emit();
4340
4698
  }
4341
4699
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.7", ngImport: i0, type: TagComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
4342
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.7", type: TagComponent, isStandalone: true, selector: "lib-tag", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null }, extraClass: { classPropertyName: "extraClass", publicName: "extraClass", isSignal: true, isRequired: false, transformFunction: null }, showBadge: { classPropertyName: "showBadge", publicName: "showBadge", isSignal: true, isRequired: false, transformFunction: null }, closeActive: { classPropertyName: "closeActive", publicName: "closeActive", isSignal: true, isRequired: false, transformFunction: null }, emphasis: { classPropertyName: "emphasis", publicName: "emphasis", isSignal: true, isRequired: false, transformFunction: null }, skeletonActive: { classPropertyName: "skeletonActive", publicName: "skeletonActive", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { closeEvent: "closeEvent" }, ngImport: i0, template: "@if (skeletonActive()) {\n<div class=\"skeleton\"></div>\n} @else {\n<span\n [ngClass]=\"[\n 'c-tag',\n variant() ? 'c-tag--' + variant() : '',\n extraClass() ? extraClass() : '',\n emphasis() ? 'c-tag--emphasis' : '',\n closeActive() ? 'c-tag--close-active' : '',\n emphasis() && closeActive() ? 'c-tag--emphasis-close-active' : ''\n ]\"\n>\n @if (showBadge()) {\n <span class=\"c-tag__dot\"></span>\n }\n {{ text() }}\n @if (closeActive()) {\n <lib-button-icon\n role=\"button\"\n [ariaLabel]=\"variant()\"\n [loading]=\"false\"\n [disabled]=\"variant() === 'disabled'\"\n [variant]=\"emphasis() ? 'inverse' : 'neutral'\"\n size=\"xs\"\n class=\"c-tag__close\"\n iconName=\"x-regular\"\n (click)=\"onClose()\"\n >\n </lib-button-icon>\n }\n</span>\n}\n", styles: [".c-tag{display:inline-flex;height:1.5rem;padding:0 var(--space-component-padding-sm);align-items:center;gap:var(--space-component-gap-sm);flex-shrink:0;border-radius:var(--size-border-radius-md);text-align:center;font-family:var(--typography-label-xs-strong-family);font-size:var(--typography-label-xs-strong-size);font-style:normal;font-weight:var(--typography-label-xs-strong-weight);line-height:var(--typography-label-xs-strong-line-height);letter-spacing:var(--typography-label-xs-strong-letter-spacing)}.c-tag__dot{width:.5rem;height:.5rem;border-radius:50%;flex-shrink:0}.c-tag--close-active{padding-right:0}.c-tag--emphasis-close-active{border-top-right-radius:10px;border-bottom-right-radius:10px}.c-tag--alert{background:var(--color-feedback-danger-surface-background);color:var(--color-feedback-danger-default)}.c-tag--alert .c-tag__dot{background:var(--color-feedback-danger-default)}.c-tag--warning{color:var(--color-feedback-warning-default);background:var(--color-feedback-warning-surface-background)}.c-tag--warning .c-tag__dot{background:var(--color-feedback-warning-default)}.c-tag--success{color:var(--color-feedback-success-default);background:var(--color-feedback-success-surface-background)}.c-tag--success .c-tag__dot{background:var(--color-feedback-success-default)}.c-tag--info{background:var(--color-feedback-info-surface-background);color:var(--color-feedback-info-default)}.c-tag--info .c-tag__dot{background:var(--color-feedback-info-default)}.c-tag--neutral{background:var(--color-feedback-neutral-surface-background);color:var(--color-feedback-neutral-default)}.c-tag--neutral .c-tag__dot{background:var(--color-feedback-neutral-default)}.c-tag--primary{background:var(--color-decorative-primary-soft);color:var(--color-decorative-primary-strong)}.c-tag--primary .c-tag__dot{background:var(--color-decorative-primary-default)}.c-tag--secondary{background:var(--color-decorative-secondary-soft);color:var(--color-decorative-secondary-strong)}.c-tag--secondary .c-tag__dot{background:var(--color-decorative-secondary-default)}.c-tag--disabled{background:var(--color-action-neutral-background-disabled);color:var(--color-action-neutral-content-disabled)}.c-tag--disabled .c-tag__dot{background:var(--color-action-neutral-content-disabled)}.c-tag--emphasis.c-tag--alert{color:var(--color-feedback-danger-on-default);background:var(--color-feedback-danger-default)}.c-tag--emphasis.c-tag--alert .c-tag__dot{background:var(--color-feedback-danger-on-default)}.c-tag--emphasis.c-tag--warning{color:var(--color-feedback-warning-on-default);background:var(--color-feedback-warning-default)}.c-tag--emphasis.c-tag--warning .c-tag__dot{background:var(--color-feedback-warning-on-default)}.c-tag--emphasis.c-tag--success{color:var(--color-feedback-success-on-default);background:var(--color-feedback-success-default)}.c-tag--emphasis.c-tag--success .c-tag__dot{background:var(--color-feedback-success-on-default)}.c-tag--emphasis.c-tag--info{color:var(--color-feedback-info-on-default);background:var(--color-feedback-info-default)}.c-tag--emphasis.c-tag--info .c-tag__dot{background:var(--color-feedback-info-on-default)}.c-tag--emphasis.c-tag--neutral{color:var(--color-feedback-neutral-on-default);background:var(--color-feedback-neutral-default)}.c-tag--emphasis.c-tag--neutral .c-tag__dot{background:var(--color-feedback-neutral-on-default)}.c-tag--emphasis.c-tag--primary{background:var(--color-decorative-primary-default);color:var(--color-core-content-inverse)}.c-tag--emphasis.c-tag--primary .c-tag__dot{background:var(--color-core-content-inverse)}.c-tag--emphasis.c-tag--secondary{background:var(--color-decorative-secondary-default);color:var(--color-core-content-inverse)}.c-tag--emphasis.c-tag--secondary .c-tag__dot{background:var(--color-core-content-inverse)}.c-tag--emphasis.c-tag--disabled{background:var(--color-action-neutral-background-disabled);color:var(--color-action-neutral-content-disabled)}.c-tag--emphasis.c-tag--disabled .c-tag__dot{background:var(--color-action-neutral-content-disabled)}.skeleton{width:4rem;height:1.5rem;background:var(--color-effect-skeleton-soft);border-radius:var(--size-border-radius-md)}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ButtonIconComponent, selector: "lib-button-icon", inputs: ["ariaLabel", "variant", "size", "iconName", "disabled", "loading", "skeletonActive"], outputs: ["clicked"] }] });
4700
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.7", type: TagComponent, isStandalone: true, selector: "lib-tag", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null }, extraClass: { classPropertyName: "extraClass", publicName: "extraClass", isSignal: true, isRequired: false, transformFunction: null }, showBadge: { classPropertyName: "showBadge", publicName: "showBadge", isSignal: true, isRequired: false, transformFunction: null }, closeActive: { classPropertyName: "closeActive", publicName: "closeActive", isSignal: true, isRequired: false, transformFunction: null }, emphasis: { classPropertyName: "emphasis", publicName: "emphasis", isSignal: true, isRequired: false, transformFunction: null }, skeletonActive: { classPropertyName: "skeletonActive", publicName: "skeletonActive", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { closeEvent: "closeEvent" }, ngImport: i0, template: "@if (skeletonActive()) {\n<div class=\"skeleton\"></div>\n} @else {\n<span\n [ngClass]=\"[\n 'c-tag',\n variant() ? 'c-tag--' + variant() : '',\n extraClass() ? extraClass() : '',\n emphasis() ? 'c-tag--emphasis' : '',\n closeActive() ? 'c-tag--close-active' : '',\n size() ? 'c-tag--' + size() : '',\n emphasis() && closeActive() ? 'c-tag--emphasis-close-active' : ''\n ]\"\n>\n @if (showBadge()) {\n <span class=\"c-tag__dot\"></span>\n }\n {{ text() }}\n @if (closeActive()) {\n <lib-button-icon\n role=\"button\"\n [ariaLabel]=\"variant()\"\n [loading]=\"false\"\n [disabled]=\"variant() === 'disabled'\"\n [variant]=\"emphasis() ? 'inverse' : 'neutral'\"\n [size]=\"size() === 'xs' ? 'xs' : 'sm'\"\n class=\"c-tag__close\"\n iconName=\"x-regular\"\n (click)=\"onClose()\"\n >\n </lib-button-icon>\n }\n</span>\n}\n", styles: [".c-tag{display:inline-flex;height:1.5rem;padding:0 var(--space-component-padding-sm);align-items:center;gap:var(--space-component-gap-sm);flex-shrink:0;border-radius:var(--size-border-radius-md);text-align:center;font-family:var(--typography-label-xs-strong-family);font-size:var(--typography-label-xs-strong-size);font-weight:var(--typography-label-xs-strong-weight);line-height:var(--typography-label-xs-strong-line-height);letter-spacing:var(--typography-label-xs-strong-letter-spacing)}.c-tag--sm{height:2rem;font-family:var(--typography-label-md-strong-family);font-size:var(--typography-label-md-strong-size);font-weight:var(--typography-label-md-strong-weight);line-height:var(--typography-label-md-strong-line-height);letter-spacing:var(--typography-label-md-strong-letter-spacing)}.c-tag__dot{width:.5rem;height:.5rem;border-radius:50%;flex-shrink:0}.c-tag--close-active{padding-right:0}.c-tag--emphasis-close-active{border-top-right-radius:10px;border-bottom-right-radius:10px}.c-tag--alert{background:var(--color-feedback-danger-surface-background);color:var(--color-feedback-danger-default)}.c-tag--alert .c-tag__dot{background:var(--color-feedback-danger-default)}.c-tag--warning{color:var(--color-feedback-warning-default);background:var(--color-feedback-warning-surface-background)}.c-tag--warning .c-tag__dot{background:var(--color-feedback-warning-default)}.c-tag--success{color:var(--color-feedback-success-default);background:var(--color-feedback-success-surface-background)}.c-tag--success .c-tag__dot{background:var(--color-feedback-success-default)}.c-tag--info{background:var(--color-feedback-info-surface-background);color:var(--color-feedback-info-default)}.c-tag--info .c-tag__dot{background:var(--color-feedback-info-default)}.c-tag--neutral{background:var(--color-feedback-neutral-surface-background);color:var(--color-feedback-neutral-default)}.c-tag--neutral .c-tag__dot{background:var(--color-feedback-neutral-default)}.c-tag--primary{background:var(--color-decorative-primary-soft);color:var(--color-decorative-primary-strong)}.c-tag--primary .c-tag__dot{background:var(--color-decorative-primary-default)}.c-tag--secondary{background:var(--color-decorative-secondary-soft);color:var(--color-decorative-secondary-strong)}.c-tag--secondary .c-tag__dot{background:var(--color-decorative-secondary-default)}.c-tag--disabled{background:var(--color-action-neutral-background-disabled);color:var(--color-action-neutral-content-disabled)}.c-tag--disabled .c-tag__dot{background:var(--color-action-neutral-content-disabled)}.c-tag--emphasis.c-tag--alert{color:var(--color-feedback-danger-on-default);background:var(--color-feedback-danger-default)}.c-tag--emphasis.c-tag--alert .c-tag__dot{background:var(--color-feedback-danger-on-default)}.c-tag--emphasis.c-tag--warning{color:var(--color-feedback-warning-on-default);background:var(--color-feedback-warning-default)}.c-tag--emphasis.c-tag--warning .c-tag__dot{background:var(--color-feedback-warning-on-default)}.c-tag--emphasis.c-tag--success{color:var(--color-feedback-success-on-default);background:var(--color-feedback-success-default)}.c-tag--emphasis.c-tag--success .c-tag__dot{background:var(--color-feedback-success-on-default)}.c-tag--emphasis.c-tag--info{color:var(--color-feedback-info-on-default);background:var(--color-feedback-info-default)}.c-tag--emphasis.c-tag--info .c-tag__dot{background:var(--color-feedback-info-on-default)}.c-tag--emphasis.c-tag--neutral{color:var(--color-feedback-neutral-on-default);background:var(--color-feedback-neutral-default)}.c-tag--emphasis.c-tag--neutral .c-tag__dot{background:var(--color-feedback-neutral-on-default)}.c-tag--emphasis.c-tag--primary{background:var(--color-decorative-primary-default);color:var(--color-core-content-inverse)}.c-tag--emphasis.c-tag--primary .c-tag__dot{background:var(--color-core-content-inverse)}.c-tag--emphasis.c-tag--secondary{background:var(--color-decorative-secondary-default);color:var(--color-core-content-inverse)}.c-tag--emphasis.c-tag--secondary .c-tag__dot{background:var(--color-core-content-inverse)}.c-tag--emphasis.c-tag--disabled{background:var(--color-action-neutral-background-disabled);color:var(--color-action-neutral-content-disabled)}.c-tag--emphasis.c-tag--disabled .c-tag__dot{background:var(--color-action-neutral-content-disabled)}.skeleton{width:4rem;height:1.5rem;background:var(--color-effect-skeleton-soft);border-radius:var(--size-border-radius-md)}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ButtonIconComponent, selector: "lib-button-icon", inputs: ["ariaLabel", "variant", "size", "iconName", "disabled", "loading", "skeletonActive"], outputs: ["clicked"] }] });
4343
4701
  }
4344
4702
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.7", ngImport: i0, type: TagComponent, decorators: [{
4345
4703
  type: Component,
4346
- args: [{ selector: 'lib-tag', imports: [NgClass, ButtonIconComponent], template: "@if (skeletonActive()) {\n<div class=\"skeleton\"></div>\n} @else {\n<span\n [ngClass]=\"[\n 'c-tag',\n variant() ? 'c-tag--' + variant() : '',\n extraClass() ? extraClass() : '',\n emphasis() ? 'c-tag--emphasis' : '',\n closeActive() ? 'c-tag--close-active' : '',\n emphasis() && closeActive() ? 'c-tag--emphasis-close-active' : ''\n ]\"\n>\n @if (showBadge()) {\n <span class=\"c-tag__dot\"></span>\n }\n {{ text() }}\n @if (closeActive()) {\n <lib-button-icon\n role=\"button\"\n [ariaLabel]=\"variant()\"\n [loading]=\"false\"\n [disabled]=\"variant() === 'disabled'\"\n [variant]=\"emphasis() ? 'inverse' : 'neutral'\"\n size=\"xs\"\n class=\"c-tag__close\"\n iconName=\"x-regular\"\n (click)=\"onClose()\"\n >\n </lib-button-icon>\n }\n</span>\n}\n", styles: [".c-tag{display:inline-flex;height:1.5rem;padding:0 var(--space-component-padding-sm);align-items:center;gap:var(--space-component-gap-sm);flex-shrink:0;border-radius:var(--size-border-radius-md);text-align:center;font-family:var(--typography-label-xs-strong-family);font-size:var(--typography-label-xs-strong-size);font-style:normal;font-weight:var(--typography-label-xs-strong-weight);line-height:var(--typography-label-xs-strong-line-height);letter-spacing:var(--typography-label-xs-strong-letter-spacing)}.c-tag__dot{width:.5rem;height:.5rem;border-radius:50%;flex-shrink:0}.c-tag--close-active{padding-right:0}.c-tag--emphasis-close-active{border-top-right-radius:10px;border-bottom-right-radius:10px}.c-tag--alert{background:var(--color-feedback-danger-surface-background);color:var(--color-feedback-danger-default)}.c-tag--alert .c-tag__dot{background:var(--color-feedback-danger-default)}.c-tag--warning{color:var(--color-feedback-warning-default);background:var(--color-feedback-warning-surface-background)}.c-tag--warning .c-tag__dot{background:var(--color-feedback-warning-default)}.c-tag--success{color:var(--color-feedback-success-default);background:var(--color-feedback-success-surface-background)}.c-tag--success .c-tag__dot{background:var(--color-feedback-success-default)}.c-tag--info{background:var(--color-feedback-info-surface-background);color:var(--color-feedback-info-default)}.c-tag--info .c-tag__dot{background:var(--color-feedback-info-default)}.c-tag--neutral{background:var(--color-feedback-neutral-surface-background);color:var(--color-feedback-neutral-default)}.c-tag--neutral .c-tag__dot{background:var(--color-feedback-neutral-default)}.c-tag--primary{background:var(--color-decorative-primary-soft);color:var(--color-decorative-primary-strong)}.c-tag--primary .c-tag__dot{background:var(--color-decorative-primary-default)}.c-tag--secondary{background:var(--color-decorative-secondary-soft);color:var(--color-decorative-secondary-strong)}.c-tag--secondary .c-tag__dot{background:var(--color-decorative-secondary-default)}.c-tag--disabled{background:var(--color-action-neutral-background-disabled);color:var(--color-action-neutral-content-disabled)}.c-tag--disabled .c-tag__dot{background:var(--color-action-neutral-content-disabled)}.c-tag--emphasis.c-tag--alert{color:var(--color-feedback-danger-on-default);background:var(--color-feedback-danger-default)}.c-tag--emphasis.c-tag--alert .c-tag__dot{background:var(--color-feedback-danger-on-default)}.c-tag--emphasis.c-tag--warning{color:var(--color-feedback-warning-on-default);background:var(--color-feedback-warning-default)}.c-tag--emphasis.c-tag--warning .c-tag__dot{background:var(--color-feedback-warning-on-default)}.c-tag--emphasis.c-tag--success{color:var(--color-feedback-success-on-default);background:var(--color-feedback-success-default)}.c-tag--emphasis.c-tag--success .c-tag__dot{background:var(--color-feedback-success-on-default)}.c-tag--emphasis.c-tag--info{color:var(--color-feedback-info-on-default);background:var(--color-feedback-info-default)}.c-tag--emphasis.c-tag--info .c-tag__dot{background:var(--color-feedback-info-on-default)}.c-tag--emphasis.c-tag--neutral{color:var(--color-feedback-neutral-on-default);background:var(--color-feedback-neutral-default)}.c-tag--emphasis.c-tag--neutral .c-tag__dot{background:var(--color-feedback-neutral-on-default)}.c-tag--emphasis.c-tag--primary{background:var(--color-decorative-primary-default);color:var(--color-core-content-inverse)}.c-tag--emphasis.c-tag--primary .c-tag__dot{background:var(--color-core-content-inverse)}.c-tag--emphasis.c-tag--secondary{background:var(--color-decorative-secondary-default);color:var(--color-core-content-inverse)}.c-tag--emphasis.c-tag--secondary .c-tag__dot{background:var(--color-core-content-inverse)}.c-tag--emphasis.c-tag--disabled{background:var(--color-action-neutral-background-disabled);color:var(--color-action-neutral-content-disabled)}.c-tag--emphasis.c-tag--disabled .c-tag__dot{background:var(--color-action-neutral-content-disabled)}.skeleton{width:4rem;height:1.5rem;background:var(--color-effect-skeleton-soft);border-radius:var(--size-border-radius-md)}\n"] }]
4704
+ args: [{ selector: 'lib-tag', imports: [NgClass, ButtonIconComponent], template: "@if (skeletonActive()) {\n<div class=\"skeleton\"></div>\n} @else {\n<span\n [ngClass]=\"[\n 'c-tag',\n variant() ? 'c-tag--' + variant() : '',\n extraClass() ? extraClass() : '',\n emphasis() ? 'c-tag--emphasis' : '',\n closeActive() ? 'c-tag--close-active' : '',\n size() ? 'c-tag--' + size() : '',\n emphasis() && closeActive() ? 'c-tag--emphasis-close-active' : ''\n ]\"\n>\n @if (showBadge()) {\n <span class=\"c-tag__dot\"></span>\n }\n {{ text() }}\n @if (closeActive()) {\n <lib-button-icon\n role=\"button\"\n [ariaLabel]=\"variant()\"\n [loading]=\"false\"\n [disabled]=\"variant() === 'disabled'\"\n [variant]=\"emphasis() ? 'inverse' : 'neutral'\"\n [size]=\"size() === 'xs' ? 'xs' : 'sm'\"\n class=\"c-tag__close\"\n iconName=\"x-regular\"\n (click)=\"onClose()\"\n >\n </lib-button-icon>\n }\n</span>\n}\n", styles: [".c-tag{display:inline-flex;height:1.5rem;padding:0 var(--space-component-padding-sm);align-items:center;gap:var(--space-component-gap-sm);flex-shrink:0;border-radius:var(--size-border-radius-md);text-align:center;font-family:var(--typography-label-xs-strong-family);font-size:var(--typography-label-xs-strong-size);font-weight:var(--typography-label-xs-strong-weight);line-height:var(--typography-label-xs-strong-line-height);letter-spacing:var(--typography-label-xs-strong-letter-spacing)}.c-tag--sm{height:2rem;font-family:var(--typography-label-md-strong-family);font-size:var(--typography-label-md-strong-size);font-weight:var(--typography-label-md-strong-weight);line-height:var(--typography-label-md-strong-line-height);letter-spacing:var(--typography-label-md-strong-letter-spacing)}.c-tag__dot{width:.5rem;height:.5rem;border-radius:50%;flex-shrink:0}.c-tag--close-active{padding-right:0}.c-tag--emphasis-close-active{border-top-right-radius:10px;border-bottom-right-radius:10px}.c-tag--alert{background:var(--color-feedback-danger-surface-background);color:var(--color-feedback-danger-default)}.c-tag--alert .c-tag__dot{background:var(--color-feedback-danger-default)}.c-tag--warning{color:var(--color-feedback-warning-default);background:var(--color-feedback-warning-surface-background)}.c-tag--warning .c-tag__dot{background:var(--color-feedback-warning-default)}.c-tag--success{color:var(--color-feedback-success-default);background:var(--color-feedback-success-surface-background)}.c-tag--success .c-tag__dot{background:var(--color-feedback-success-default)}.c-tag--info{background:var(--color-feedback-info-surface-background);color:var(--color-feedback-info-default)}.c-tag--info .c-tag__dot{background:var(--color-feedback-info-default)}.c-tag--neutral{background:var(--color-feedback-neutral-surface-background);color:var(--color-feedback-neutral-default)}.c-tag--neutral .c-tag__dot{background:var(--color-feedback-neutral-default)}.c-tag--primary{background:var(--color-decorative-primary-soft);color:var(--color-decorative-primary-strong)}.c-tag--primary .c-tag__dot{background:var(--color-decorative-primary-default)}.c-tag--secondary{background:var(--color-decorative-secondary-soft);color:var(--color-decorative-secondary-strong)}.c-tag--secondary .c-tag__dot{background:var(--color-decorative-secondary-default)}.c-tag--disabled{background:var(--color-action-neutral-background-disabled);color:var(--color-action-neutral-content-disabled)}.c-tag--disabled .c-tag__dot{background:var(--color-action-neutral-content-disabled)}.c-tag--emphasis.c-tag--alert{color:var(--color-feedback-danger-on-default);background:var(--color-feedback-danger-default)}.c-tag--emphasis.c-tag--alert .c-tag__dot{background:var(--color-feedback-danger-on-default)}.c-tag--emphasis.c-tag--warning{color:var(--color-feedback-warning-on-default);background:var(--color-feedback-warning-default)}.c-tag--emphasis.c-tag--warning .c-tag__dot{background:var(--color-feedback-warning-on-default)}.c-tag--emphasis.c-tag--success{color:var(--color-feedback-success-on-default);background:var(--color-feedback-success-default)}.c-tag--emphasis.c-tag--success .c-tag__dot{background:var(--color-feedback-success-on-default)}.c-tag--emphasis.c-tag--info{color:var(--color-feedback-info-on-default);background:var(--color-feedback-info-default)}.c-tag--emphasis.c-tag--info .c-tag__dot{background:var(--color-feedback-info-on-default)}.c-tag--emphasis.c-tag--neutral{color:var(--color-feedback-neutral-on-default);background:var(--color-feedback-neutral-default)}.c-tag--emphasis.c-tag--neutral .c-tag__dot{background:var(--color-feedback-neutral-on-default)}.c-tag--emphasis.c-tag--primary{background:var(--color-decorative-primary-default);color:var(--color-core-content-inverse)}.c-tag--emphasis.c-tag--primary .c-tag__dot{background:var(--color-core-content-inverse)}.c-tag--emphasis.c-tag--secondary{background:var(--color-decorative-secondary-default);color:var(--color-core-content-inverse)}.c-tag--emphasis.c-tag--secondary .c-tag__dot{background:var(--color-core-content-inverse)}.c-tag--emphasis.c-tag--disabled{background:var(--color-action-neutral-background-disabled);color:var(--color-action-neutral-content-disabled)}.c-tag--emphasis.c-tag--disabled .c-tag__dot{background:var(--color-action-neutral-content-disabled)}.skeleton{width:4rem;height:1.5rem;background:var(--color-effect-skeleton-soft);border-radius:var(--size-border-radius-md)}\n"] }]
4347
4705
  }] });
4348
4706
 
4349
4707
  class TextInputComponent {
@@ -4845,9 +5203,16 @@ class ModalComponent {
4845
5203
  effect(() => {
4846
5204
  if (this.isModalOpen()) {
4847
5205
  this.focusFirstElement();
5206
+ this.disableBodyScroll();
5207
+ }
5208
+ else {
5209
+ this.enableBodyScroll();
4848
5210
  }
4849
5211
  });
4850
5212
  }
5213
+ ngOnDestroy() {
5214
+ this.enableBodyScroll();
5215
+ }
4851
5216
  isModalOpen() {
4852
5217
  return this._isOpenSignal();
4853
5218
  }
@@ -4948,6 +5313,30 @@ class ModalComponent {
4948
5313
  }
4949
5314
  }, 20);
4950
5315
  }
5316
+ disableBodyScroll() {
5317
+ const body = document.body;
5318
+ const scrollY = window.scrollY;
5319
+ // Store current scroll position
5320
+ body.style.setProperty('--scroll-y', `${scrollY}px`);
5321
+ // Disable scroll
5322
+ body.style.position = 'fixed';
5323
+ body.style.top = `-${scrollY}px`;
5324
+ body.style.width = '100%';
5325
+ body.style.overflow = 'hidden';
5326
+ }
5327
+ enableBodyScroll() {
5328
+ const body = document.body;
5329
+ const scrollY = body.style.getPropertyValue('--scroll-y');
5330
+ // Re-enable scroll
5331
+ body.style.position = '';
5332
+ body.style.top = '';
5333
+ body.style.width = '';
5334
+ body.style.overflow = '';
5335
+ // Restore scroll position
5336
+ if (scrollY) {
5337
+ window.scrollTo(0, parseInt(scrollY));
5338
+ }
5339
+ }
4951
5340
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.7", ngImport: i0, type: ModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
4952
5341
  static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.7", type: ModalComponent, isStandalone: true, selector: "lib-modal", viewQueries: [{ propertyName: "modalContentRef", first: true, predicate: ["modalContent"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (isModalOpen()) {\n<div class=\"c-modal\" [ngClass]=\"getClasses()\">\n <!-- Backdrop -->\n <div\n class=\"c-modal__backdrop\"\n [ngClass]=\"getBackdropClasses()\"\n (click)=\"onBackdropClick()\"\n (keydown.escape)=\"onEscapeKey()\"\n tabindex=\"0\"\n role=\"button\"\n aria-label=\"Close modal\"\n ></div>\n\n <!-- Modal Content -->\n <div\n class=\"c-modal__content\"\n [ngClass]=\"getContentClasses()\"\n (keydown.escape)=\"onEscapeKey()\"\n role=\"dialog\"\n tabindex=\"-1\"\n [attr.aria-labelledby]=\"getTitle() ? 'modal-title' : null\"\n [attr.aria-describedby]=\"getDescription() ? 'modal-description' : null\"\n >\n <!-- Header -->\n @if (getTitle() || getShowCloseButton()) {\n <div class=\"c-modal__content__header\">\n <div class=\"c-modal__content__header__left\">\n @if (getTitle()) {\n <p id=\"modal-title\" class=\"c-modal__content__header__title\">\n {{ getTitle() }}\n </p>\n }\n </div>\n @if (getShowCloseButton()) {\n <div class=\"c-modal__content__header__right\">\n <lib-button-icon\n iconName=\"x-regular\"\n size=\"sm\"\n variant=\"neutral\"\n (click)=\"onCloseButtonClick()\"\n aria-label=\"Close modal\"\n ></lib-button-icon>\n </div>\n }\n </div>\n }\n\n <!-- Description -->\n <div class=\"c-modal__content__body\">\n @if (getDescription()) {\n <div id=\"modal-description\" class=\"c-modal__content__body__description\">\n <p>{{ getDescription() }}</p>\n </div>\n }\n\n <!-- Body Content -->\n <div #modalContent class=\"c-modal__content__body__content\">\n <ng-content></ng-content>\n </div>\n </div>\n\n <!-- Footer with Buttons -->\n @if (getPrimaryButton() || getSecondaryButton()) {\n <div class=\"c-modal__content__footer\">\n @if (getSecondaryButton()) {\n <lib-button\n class=\"c-modal__content__footer__button secondary\"\n [text]=\"getSecondaryButton()!.text\"\n [variant]=\"getSecondaryButton()!.variant\"\n [disabled]=\"getSecondaryButton()!.disabled ?? false\"\n [loading]=\"getSecondaryButton()!.loading ?? false\"\n [fullWidth]=\"true\"\n (clicked)=\"onSecondaryButtonClick()\"\n ></lib-button>\n } @if (getPrimaryButton()) {\n <lib-button\n class=\"c-modal__content__footer__button primary\"\n [text]=\"getPrimaryButton()!.text\"\n [variant]=\"getPrimaryButton()!.variant\"\n [disabled]=\"getPrimaryButton()!.disabled ?? false\"\n [loading]=\"getPrimaryButton()!.loading ?? false\"\n [fullWidth]=\"true\"\n (clicked)=\"onPrimaryButtonClick()\"\n ></lib-button>\n }\n </div>\n }\n </div>\n</div>\n}\n", styles: [".c-modal{position:fixed;top:0;left:0;width:100%;height:100%;z-index:100;display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .2s ease-in-out,visibility .2s ease-in-out}.c-modal--open{opacity:1;visibility:visible}.c-modal__content{background-color:var(--color-core-background-surface-floating);box-shadow:var(--elevation-floating);overflow:hidden;display:flex;flex-direction:column;width:100%}.c-modal__content--open{transform:scale(1)}.c-modal__content--sm{max-width:416px}.c-modal__content--md{max-width:636px}.c-modal__content--lg{max-width:856px}.c-modal__content__header{display:flex;align-items:center;padding:var(--space-container-padding-sm);border-bottom:1px solid var(--color-core-border-soft);gap:var(--space-container-gap-sm)}.c-modal__content__header__right{flex:1;display:flex;justify-content:flex-end}.c-modal__content__header__title{margin:0;font-family:var(--typography-label-lg-default-family),sans-serif;font-weight:var(--typography-label-lg-default-weight);font-size:var(--typography-label-lg-default-size);line-height:var(--typography-label-lg-default-line-height);letter-spacing:var(--typography-label-lg-default-letter-spacing);color:var(--color-core-content-default)}.c-modal__content__body{display:flex;flex-direction:column;flex:1;gap:var(--space-container-gap-md);padding:var(--space-container-padding-sm)}.c-modal__content__body__description p{margin:0;color:var(--color-core-content-soft);font-family:var(--typography-body-md-family),sans-serif;font-weight:var(--typography-body-md-weight);font-size:var(--typography-body-md-size);line-height:var(--typography-body-md-line-height);letter-spacing:var(--typography-body-md-letter-spacing)}.c-modal__content__body__content{overflow-y:auto}.c-modal__content--sm .c-modal__content__body__content{max-height:200px}.c-modal__content--md .c-modal__content__body__content{min-height:200px;max-height:600px}.c-modal__content--lg .c-modal__content__body__content{min-height:600px;max-height:800px}.c-modal__content__footer{display:flex;justify-content:flex-end;gap:var(--space-component-gap-md);padding:var(--space-container-padding-sm);border-top:1px solid var(--color-core-border-soft)}@media (max-width: 768px){.c-modal__content__footer{flex-direction:column;gap:var(--space-component-gap-md)}}@media (max-width: 768px){.c-modal__content__footer__button{width:100%}}.c-modal__content__footer__button.primary{order:2}.c-modal__content__footer__button.secondary{order:1}.c-modal__backdrop{position:absolute;top:0;left:0;width:100%;height:100%;background-color:var(--color-effect-overlay);opacity:0;transition:opacity .2s ease-in-out}.c-modal__backdrop--open{opacity:1}@media (max-width: 768px){.c-modal{align-items:flex-end}.c-modal--sm .c-modal__content,.c-modal--md .c-modal__content{position:fixed;bottom:0;left:0;right:0;width:100%;max-width:none;transform:translateY(100%);transition:transform .3s ease-in-out}.c-modal--sm.c-modal--open .c-modal__content,.c-modal--md.c-modal--open .c-modal__content{transform:translateY(0)}.c-modal--lg{align-items:stretch}.c-modal--lg .c-modal__content{position:fixed;inset:0;width:100%;height:100%;max-width:none;border-radius:0;transform:scale(.95);transition:transform .3s ease-in-out}.c-modal--lg.c-modal--open .c-modal__content{transform:scale(1)}}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ButtonComponent, selector: "lib-button", inputs: ["text", "ariaLabel", "disabled", "loading", "skeletonActive", "variant", "size", "loadingText", "fullWidth", "iconBefore", "iconAfter"], outputs: ["clicked"] }, { kind: "component", type: ButtonIconComponent, selector: "lib-button-icon", inputs: ["ariaLabel", "variant", "size", "iconName", "disabled", "loading", "skeletonActive"], outputs: ["clicked"] }] });
4953
5342
  }
@@ -5128,5 +5517,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.7", ngImpor
5128
5517
  * Generated bundle index. Do not edit.
5129
5518
  */
5130
5519
 
5131
- export { AccordionComponent, AlertComponent, ArrowsComponent, AvatarComponent, BadgeComponent, ButtonComponent, ButtonIconComponent, ButtonSetComponent, CheckboxComponent, CheckboxGroupComponent, ChipsComponent, DesignTokensComponent, HelperTextComponent, IconComponent, InputDateComponent, InputLabelComponent, InputNumberComponent, InputPaymentComponent, InputSearchComponent, InputUploadComponent, LinkComponent, ModalComponent, ModalService, PaginationComponent, PasswordInputComponent, RadioComponent, RadioGroupComponent, SegmentedControlComponent, SelectComponent, SocialLoginComponent, SpinnerComponent, SwitchComponent, TabsComponent, TagComponent, TextInputComponent, TextareaComponent, ThumbnailComponent, TileComponent, ToastComponent, TooltipComponent, TooltipDirective, TooltipPosition };
5520
+ export { AccordionComponent, AlertComponent, ArrowsComponent, AvatarComponent, BadgeComponent, ButtonComponent, ButtonIconComponent, ButtonSetComponent, CheckboxComponent, CheckboxGroupComponent, ChipsComponent, DesignTokensComponent, DropdownComponent, DropdownTriggerDirective, HelperTextComponent, IconComponent, InputDateComponent, InputLabelComponent, InputNumberComponent, InputPaymentComponent, InputSearchComponent, InputUploadComponent, LinkComponent, ModalComponent, ModalService, PaginationComponent, PasswordInputComponent, RadioComponent, RadioGroupComponent, SegmentedControlComponent, SelectComponent, SocialLoginComponent, SpinnerComponent, SwitchComponent, TabsComponent, TagComponent, TextInputComponent, TextareaComponent, ThumbnailComponent, TileComponent, ToastComponent, TooltipComponent, TooltipDirective, TooltipPosition };
5132
5521
  //# sourceMappingURL=crowdfarming-oliva-ds.mjs.map