npm - @infineon/infineon-design-system-stencil - Versions diffs - 33.4.1--canary.1855.83055532e24827965eebebc371d8d9f314f098a7.0 → 33.4.1--canary.1855.420b7862d699aa915f9b73ca7df50510dc35789a.0 - Mend

@infineon/infineon-design-system-stencil 33.4.1--canary.1855.83055532e24827965eebebc371d8d9f314f098a7.0 → 33.4.1--canary.1855.420b7862d699aa915f9b73ca7df50510dc35789a.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (403) hide show

package/dist/infineon-design-system-stencil/p-e5df823b.entry.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{r as e,h as c,g as a}from"./p-e6edf72d.js";const d='*{font-family:"Source Sans 3";box-sizing:border-box}body{margin:0;padding:0;overflow-x:hidden}header{margin-bottom:15px;display:flex;justify-content:center}.header__info-wrapper{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:10px}.infoboard__wrapper{display:flex;gap:15px;background-color:#f1f1f1;padding:5px 10px;border-radius:10px}.title{font-size:30px;font-weight:bold}.view{margin:auto}.wrapper{position:relative;width:100%;height:calc(100vh - var(--header-height) - 15px);overflow:auto}table{width:100%;table-layout:fixed;border-spacing:0}thead tr th{border-top:1px solid #dddddd}td,th{padding:10px;background-color:white;border:none;box-shadow:0 0 0 1px #dddddd;box-sizing:border-box}table th:nth-child(1){width:150px}table th:not(:nth-child(1)){width:240px}th{position:sticky;top:0;background-color:white}.sticky-col{position:sticky;z-index:1}th.sticky-col{z-index:2}.second-col{left:0;border-left:1px solid #ddd}.wrapped-content{width:250px;white-space:normal}a{text-decoration:none;color:black}.basic__info{display:flex;gap:5px}ul{padding:0 5px;margin:0 15px;list-style-type:none}tr:nth-child(even) td{background-color:#f1f1f1}ul li{font-size:12px;display:flex;gap:5px;line-height:13px}li.planned__component-wrapper{align-items:center;line-height:16px}.version__wrapper{display:flex;flex-direction:column}ifx-icon{color:rgb(10, 130, 118)}.check__icon{width:10px;height:10px}.planned__icon{width:12px;height:12px;vertical-align:sub}';const f=d;const b=class{constructor(c){e(this,c);this.getPlannedComponents=()=>{const e=this.el.shadowRoot.querySelectorAll(".planned__component");return e.length};this.setPlannedComponentsNumber=()=>{const e=this.getPlannedComponents();const c=this.el.shadowRoot.getElementById("number__indicator-planned");c.innerHTML=e};this.getCompletedComponents=()=>{const e=this.el.shadowRoot.querySelectorAll(".completed__component");return e.length};this.setCompletedComponentsNumber=()=>{const e=this.getCompletedComponents();const c=this.el.shadowRoot.getElementById("number__indicator-completed");c.innerHTML=e};this.setTotalComponentsNumber=()=>{const e=this.getPlannedComponents();const c=this.getCompletedComponents();const a=this.el.shadowRoot.getElementById("number__indicator-total");const d=e+c;a.innerHTML=d}}componentWillLoad(){let e=this.el.parentElement;if(e){e=e.parentElement;e.style.padding="0px"}}componentDidLoad(){const e=this.el.shadowRoot.querySelector("header");const c=e.offsetHeight;const a=this.el.shadowRoot.querySelector(".wrapper");a.style.setProperty("--header-height",`${c}px`);this.setPlannedComponentsNumber();this.setCompletedComponentsNumber();this.setTotalComponentsNumber()}render(){return c("div",{key:"b2ef9e902181e62732a7aa0697dfd99725cdd242",class:"container"},c("header",{key:"8f2d770011091b35944e38e96da9cac0ac0f79f2",class:"header"},c("div",{key:"43c4b4af8f8d2c0dd8b99521a815d36b0ae36b6b",class:"header__info-wrapper"},c("div",{key:"f22deaff6496955c72fc1a7e0e7f13c394739a2e",class:"title"},"DDS Components Overview"),c("div",{key:"b0aa19421b8d11cd1bd4c4e3a1e3575abc690270",class:"infoboard__wrapper"},c("div",{key:"3fcf9e5955a016da44989620ea5417e70dd6bee4",class:"basic__info"},c("div",{key:"449e1f180e1050478b407783d8034fa7f7e16e35"},"Total Number:"),c("div",{key:"f86842a702b78d1da3d02fe7170268a14053a2ac"},c("ifx-number-indicator",{key:"f8e2bf6e7d5cca73582392dda856b4440487cc17",id:"number__indicator-total"}))),c("div",{key:"5bbb1d6af41e14bc0fb24765deb6545568252d5a",class:"basic__info"},c("div",{key:"3c9a6acf47794ad1987654542c029d477e200911"},"Completed:"),c("div",{key:"c7e48622184d9899dfcccc40762a32f92349e30c"},c("ifx-number-indicator",{key:"5a20d0b2fb61e2c366100dd07d482fd6fbefb80d",id:"number__indicator-completed"}))),c("div",{key:"61743eafc886ce7cf9fbdb0c78fd99b63db03126",class:"basic__info"},c("div",{key:"68117538143c672d4011bfdc2447a84bbb5a1a72"},"In Progress:"),c("div",{key:"2ecbca816b57b2d721b47c1fdcb3abdcd0bd445a"},c("ifx-number-indicator",{key:"1e6b37002becdee12be13cfb9e3741c724b348b5",id:"number__indicator-planned"})))))),c("div",{key:"12d70e2b15d8f4bb56f97d4560150beb0b3ba898",class:"view"},c("div",{key:"fa0af528b2ba725a5f0ba131412b312c254003e7",class:"wrapper"},c("table",{key:"57a126dddd97807ae461a71616acbfbf2e6e8e36"},c("thead",{key:"5a0e88f4296324314b8b50a514e42c6fa711d2d9"},c("tr",{key:"025b3be37c57402951fe3b134d74d2f4fecfea5c"},c("th",{key:"84b3deaf3cc2895e7671300cde6446ad2a9c7519",class:"sticky-col second-col"},"Component"),c("th",{key:"166b942c39191767298dd600195f8d92488f35f7"},c("div",{key:"573a113b8d39e782a850e9adbeaf60ea32b5b8b2",class:"version__wrapper"},c("span",{key:"0bfb5b33fafbad1a39d6c03b38c8afe878903206"},"Version 1"))),c("th",{key:"f0e533661e1618b3924fba2a553baa3b47e038c1"},c("div",{key:"c851e0d269e890db275ce247171403a707f33765",class:"version__wrapper"},c("span",{key:"10b24650f9570fa861d46bcf4511ba2efb1c2c9a"},"Version 2"))),c("th",{key:"b53c6b92bbc437925d9e67110c34e2f3b21405cf"},"Version 3"))),c("tbody",{key:"1a067f776fa3fab5cca2b494770fb5b8f0f80704"},c("tr",{key:"c8e40f739f27fa22b21b3f6b62ea7d348ffbe9a9"},c("td",{key:"e83a981ea8bb900977645b57d11c3b6a2ed74476",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"d666afdfc6eeda51e6991307bda6511179a839af",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-accordion--development",size:"s",variant:"bold"},"Accordion")),c("td",{key:"543f17a920c155a5d0bc80787547696547136425"},c("ul",{key:"be1de8d25357db15884eba62b43006b40a7d9c0c"},c("li",{key:"5e7a47a6a69529a03e8e33209a83cb63da95ced4"},c("span",{key:"e349efbe7bbe4ca6cd6bec52fac5b20253130195"},c("ifx-icon",{key:"8ce456949cb7fe23ec0233d171f50aa15c2c0b1b",class:"check__icon",icon:"check12"})),c("span",{key:"12181714205c83fd5403388f0ce7bd91b674d14b"},"Includes essential functionality such as expand/collapse behavior and minimal customization options")),c("li",{key:"9e05adb2e1ff2da544accc1a46fa883e58b5e2c8"},c("span",{key:"fdd34205e815e37a0da7e98e53bd17fa5486b1da"},c("ifx-icon",{key:"2aa8e5588ec63cbf8c8fd03f0615c572f5670e61",class:"check__icon",icon:"check12"})),c("span",{key:"f788fc28ed5a7473de86818574de6b7db7c0e9e9"},"Adheres to web standards")),c("li",{key:"f27fed47db722b6d7c4d9bf76bed21f05548856f"},c("span",{key:"f5dbe17c7cf8aa89755c8639740b2f08ca082aee"},c("ifx-icon",{key:"44d67fd104c529abbd726fc18de9e7678a144c67",class:"check__icon",icon:"check12"})),c("span",{key:"96f356532c75b31fad8e66c659f3bd114b6b0b6e"},"Provides a simple and lightweight way to organize and display collapsible content")))),c("td",{key:"a6a0024aaba96350b4d882a20697a17e1c469f7c"},c("ul",{key:"ecaf9c73a9bf4914c5c7a7a6b345b13e84ae1076"},c("li",{key:"53813984d383b7e7f1dcc4cb3f12400d2295c143"},c("span",{key:"fc2b897ddd7a807c16fc1d274c03cb0759ae4b5e"},c("ifx-icon",{key:"023a0de4a2ceded946da0e27df8a6162713ff5a2",class:"check__icon",icon:"check12"})),c("span",{key:"723a9553f2ac2bb11de3f8c315b36457c35b35ad"},"Auto collapse feature")),c("li",{key:"e79184e6c8d25347fec26032dbf759c1c4ba4c76"},c("span",{key:"cb77a2bcdde692b7d144fd1c450c388bca6478da"},c("ifx-icon",{key:"f4dd49084000a5e6505668f906a4dd4dc9523287",class:"check__icon",icon:"check12"})),c("span",{key:"c899257a7e38ac9b5e7e3c9b3bfb1ea5fe714adb"},"Initial collapse feature")),c("li",{key:"68a0a3c0944b438023ee9a76c77cb9a912d70b9e"},c("span",{key:"a41874193c7251feeabfa262d1416cfec00c4f56"},c("ifx-icon",{key:"307e4c44008a8c7ca9a5bb75575587b1be0c2cb9",class:"check__icon",icon:"check12"})),c("span",{key:"c095ba7224e4c2bee7cf87a834fc591ceccad277"},"React, Vue and Angular wrapper integration")))),c("td",{key:"81514412d66d5dd2ac1c06685290407f36509f50"})),c("tr",{key:"b6d9198c1dcb4e4ea4341d16d7e1f483bc7b441e"},c("td",{key:"a8b46a0f23c2895dac20eb7a98db6913dccd957e",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"bd0faf9cadcfc532bf176f4c7d96a51a4f735719",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-alert--development",size:"s",variant:"bold"},"Alert")),c("td",{key:"d6815628e3c52c7b19d1ec0ab0b95ba6ca7974da"},c("ul",{key:"bc6f51e824b26c119266aa4b845ea8e8da692910"},c("li",{key:"20df8d97df793d20747359fab6886561f41fc868"},c("span",{key:"db9e05ad637cc48e8ee21f42fc9ed0be7d162744"},c("ifx-icon",{key:"56338c6d453195de4395304481bc94d5852545ea",class:"check__icon",icon:"check12"})),c("span",{key:"0490fbf8153ff395597e89dd7bf839238dab3673"},"Provides a lightweight and customizable interface for presenting alerts, including options for different alert types (e.g., primary, success, danger, warning) and basic styling configurations")),c("li",{key:"145c599eb47dfd7e68e1cfc96d03993f7a44476e"},c("span",{key:"78e227555cd73a10f7a188d88b29fd50096fe40f"},c("ifx-icon",{key:"3aaf2746c7ec3e8adb3b8f26717ce5b39f13f882",class:"check__icon",icon:"check12"})),c("span",{key:"ca8738de25840045a950658c290010a81fe65e26"},"Adheres to web standards")))),c("td",{key:"8c1cfa7fa11a4958cd9626d86bfb146030e86cc7"},c("ul",{key:"44bced7d21d9d81f7bd78e8b5c03df2cc394a6d9"},c("li",{key:"c8d9ecc3135c5610d496e6d4df807e9e212915a6"},c("span",{key:"0a9931ce7d7ba7ac821a7c80caeefcc614aec414"},c("ifx-icon",{key:"f307e3df4c36e41c58f1807ac24ffb4e0d4f6ff8",class:"check__icon",icon:"check12"})),c("span",{key:"190f037263cf3df09e6e45f53ddfa9fd6f0f7665"},"Configurable close button")),c("li",{key:"663fce76a83e6db5ddc2b2d783929636c319fac7"},c("span",{key:"5b2f7dafcda174cf3e0517c88905801ce753be98"},c("ifx-icon",{key:"639dde1ab1587ec3c5396a5a6cb4aece382a6633",class:"check__icon",icon:"check12"})),c("span",{key:"5f9ae04d2685bbd797dbfc1b9fdcd515c2d29014"},"Additional Info variant")),c("li",{key:"ab5d99140648d8d909c57b91c809f89cd084ea96"},c("span",{key:"330c4719fee84750e5a8a73a0ad55dcd17a55461"},c("ifx-icon",{key:"6860d8c74dffb81f89eb8664241c8fd86855521f",class:"check__icon",icon:"check12"})),c("span",{key:"d2a68bece8e98ac17af2a0017b80bd016fb37d5e"},"React, Vue and Angular wrapper integration")))),c("td",{key:"ea3522157632809fa3aacfa6584e625fa1f20d18"})),c("tr",{key:"ff7dd4c8f33d4d14252e4c15ac17a57da8d5c227"},c("td",{key:"2e3e89ab7e2fc5ea5201020fec04f8b3597c4a5c",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"aeb03c178bc8ce24e1cb4c5e479ed32400d9d582",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-badge--development",size:"s",variant:"bold"},"Badge")),c("td",{key:"ef24884a487d54c2314e2175e956c1595108022b"},c("ul",{key:"58dd7d8f7a29467b4bde1d43de04618742a89cf0"},c("li",{key:"74ea98a2d3daf29d2916d12a7a0ab0076662daf9"},c("span",{key:"d2a557df2f6a8f3b6af1813fe0fe991d737f442b"},c("ifx-icon",{key:"183e1045d986be0b5604f16e08b9c6e465527f19",class:"check__icon",icon:"check12"})),c("span",{key:"084d696a486f2970d1713ec8a7bcdc3a462cb411"},"Offers simple customization options for displaying badges, allowing developers to indicate specific actions, statuses, or categories with visual cues")),c("li",{key:"95bc9ed770e5e67a56aca5220c8620a8731e4268"},c("span",{key:"927e4b3914f9a63170580f70fef14948021ac474"},c("ifx-icon",{key:"eab9bd9f09423050b27c92d2f43f5c124b3466c1",class:"check__icon",icon:"check12"})),c("span",{key:"50aa265b6a89841cc3578a8dd8e1f75ee437f6c2"},"Designed to seamlessly integrate with existing UI elements and adhere to web standards")))),c("td",{key:"2b7165d076a32e7bde12f39ae94c151309a814c7"},c("ul",{key:"34ff9b08e702a52a267963e60dab94456a95322d"},c("li",{key:"21fcc3b4601f7a95543e064342adcf0466750c09"},c("span",{key:"3085483d70e77a66e2f8ca92ff4a42fd3a23421e"},c("ifx-icon",{key:"ac440ea1ab661f6ed36d3ec7312e95ed939d6c1d",class:"check__icon",icon:"check12"})),c("span",{key:"e69c4158015c72651684ea64720b4f23b2c82cbd"},"React, Vue and Angular wrapper integration")))),c("td",{key:"691ff9a831e1fae22c26013f6b59c34394397a8a"})),c("tr",{key:"d70b2be6820cbfb0f7eb606ef2b629baad853391"},c("td",{key:"47db2f27f47f3663d083db5802184a6a0cf4b3b6",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"35b436481031553dbb268222847d7639827da5f2",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-breadcrumb--development",size:"s",variant:"bold"},"Breadcrumb")),c("td",{key:"8dc3c8fda8a37108e61d817ad25f9114a94c57c0"},c("ul",{key:"aedfc621a98c8c6b63bb5b7db72856349ba50d63"},c("li",{key:"51a7cd8b15accd5e4599b060be31386c63d8b852"},c("span",{key:"b8c57cd7cce564f8d80914c6cc42da34568c0f4d"},c("ifx-icon",{key:"ecd93ff99c45f13d8ee5aabc14b2f6af81bde022",class:"check__icon",icon:"check12"})),c("span",{key:"2e58c27610d1dffe9ac6727e8b833aaff5fd1980"},"Provides a simple and customizable way to display a sequential trail of links or indicators, representing the user's current location within a hierarchy of content")),c("li",{key:"1e1a7e3510f30cbed0d3cabed8bdc219f856af2c"},c("span",{key:"6fe5b7e34d3f73532d26d71aede8ac4bf1b1a35c"},c("ifx-icon",{key:"7aff4fae9174ba26db7b68b44ae6723e9d8d7794",class:"check__icon",icon:"check12"})),c("span",{key:"10701170130618ad2e38dbc75a7ea1034f887bb3"},"Adheres to web standards")))),c("td",{key:"d885fe5b0ad84e8726fcfbb2088a1866c3b6ecc9"},c("ul",{key:"4ca1d4eaa623f3811eb752d954f09827e7eb1dce"},c("li",{key:"10ef90a1ca4cc309960ffba673b3a0dd56da6da1"},c("span",{key:"22a3e4c6e50e8733967c7876bcdfe2abcf5c3c58"},c("ifx-icon",{key:"b162c6fc3720329867ef9e3884ca61764aead00f",class:"check__icon",icon:"check12"})),c("span",{key:"83a0ba63c4c2f4c6f72fce67979ff09a304affd9"},"Possibility to add an icon")),c("li",{key:"6ebf7e5cee671056009066a2e60b024c46f13eb9"},c("span",{key:"15415f1c177cfe26fe2a24efc20515e80ce242a5"},c("ifx-icon",{key:"d721ba736624580342d3f4433642250309a9d288",class:"check__icon",icon:"check12"})),c("span",{key:"af779a4cb8c788db8bd14c0a1dba873e5962b3b8"},"Incorporated dropdown-menu for individual items")),c("li",{key:"3f425e24ca26ea7b5bf4d991f7b80d2fab0b7be5"},c("span",{key:"3ac38ec90f91d964d8716ec546f8caa79cd16307"},c("ifx-icon",{key:"78eb006bbde81bc4756a6a9bdbe4eaca3ef13e1a",class:"check__icon",icon:"check12"})),c("span",{key:"8531c1c09800a263c71ac47a28180448fea825aa"},"React, Vue and Angular wrapper integration")))),c("td",{key:"fdcbba3fcad4377556436447a513d2c962c6d1d2"})),c("tr",{key:"abe8e4cdb54da5fc5b131038dd6f84183986a956"},c("td",{key:"e38f17e387f4da9ba340cae1eaeb9642667203bd",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"60c57fb27b430525bfab81f6a772b43ee213af6b",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-button--development",size:"s",variant:"bold"},"Button")),c("td",{key:"c5f33778ffb9717950ccc18979bbbc02adfb6ec5"},c("ul",{key:"0f98a4d3e3fa1e0376159d15df6987c9a4039ffb"},c("li",{key:"7ebb7f63419f0b590cef5a9dc0579184cf55bd22"},c("span",{key:"1a04572a8436221bb477b79c38fd50549cf011e7"},c("ifx-icon",{key:"84e04849e6fe400245db8d28359e9a43c2ad1689",class:"check__icon",icon:"check12"})),c("span",{key:"a1ebf657fc99b71d39dce889e00b128c7bb57b00"},"Includes basic styling options such as colors, sizes, and states, providing essential functionality for initiating actions")),c("li",{key:"efcc6d683b54ea9af65c924ce9bb50ca086b28f3"},c("span",{key:"407dbf3cc38f5193dd199bf0e97d25434a1718f9"},c("ifx-icon",{key:"6f0d15d023fbd017f673b96dbffcf0ef797b83e6",class:"check__icon",icon:"check12"})),c("span",{key:"49a53406388b0e7b45ee75b80e8bf7f8c18d9048"},"Adheres to web standards")))),c("td",{key:"5b9b54b21d29d3a1267d55d4f0c698562d159820"},c("ul",{key:"c240a3515196f5eb540e92748f25998fb7f0a94f"},c("li",{key:"15ffa0d9475fc1e13a12d9dc96feeca5b9f6083f"},c("span",{key:"4641236dd5ae71d75b6ef6cca77a254994d637fa"},c("ifx-icon",{key:"7a12fc4690b85430212e7a946516670b0ea91ce6",class:"check__icon",icon:"check12"})),c("span",{key:"795316f584f2d667624f00532fad7ddaadb4e595"},"fullWidth feature")),c("li",{key:"1112e16a7450fcce351f9c6719fe72f9d19a0c5c"},c("span",{key:"d8b0ef2ca343aab3716e747c6fd6bfcdde797a0f"},c("ifx-icon",{key:"6e558b4c503665a4f4830bbc0fe013bc14d85615",class:"check__icon",icon:"check12"})),c("span",{key:"a5d404bc71bd4591a12237ed2a3c69dee8291dda"},"Icon integration")),c("li",{key:"81dbe8d403898edad20a172167f47e3b4caee78d"},c("span",{key:"76c0883b8fbc9d1eea52f1b6040af0c757ccd1de"},c("ifx-icon",{key:"2d1f1472a9b66d013ecde405648ce13ebd7c404f",class:"check__icon",icon:"check12"})),c("span",{key:"17d035cc16005985e621e625fb633545d60e00d4"},"Link integration")),c("li",{key:"b8d68b8b99e067dc76b0b7cdd4a8a5bd588a6fd5"},c("span",{key:"3f3af3d3c82a59638580c5db02d50df432f3b206"},c("ifx-icon",{key:"8628f60a78191563a2472e371c15ce4363115b05",class:"check__icon",icon:"check12"})),c("span",{key:"8ca0797fb289071c415a19338c4df6b3b1a99875"},"React, Vue and Angular wrapper integration")))),c("td",{key:"052273f3fc1d4f86160c641942cb1b7008faaafb"},c("ul",{key:"b4b0bd13d4af4c0eaebb6a3e5231c4cd983cc16d"},c("li",{key:"4a02cd8b308b4b8542a3fe2669e471c35d2dfac3"},c("span",{key:"e5313a01d743a33a2c1e0904f811b88544e695fd"},c("ifx-icon",{key:"3f37966fb59ebcdc8d8f6c6192dff0c9acd97036",class:"check__icon",icon:"check12"})),c("span",{key:"bd2f3fb5f2d3d7ecdcccfb25b63c2949127d1bf2"},"Form integration"))))),c("tr",{key:"2f64fdcf05a71c11ed3bd42220156d06b5928a9f"},c("td",{key:"78da6e699db78581e2de0cc83419902d64eec40e",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"465dd6c1575160a363070d68a785957f0976b001",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-card--development",size:"s",variant:"bold"},"Card")),c("td",{key:"10e7ecf1ed974509aa0f379f9f3319c3921c44e3"},c("ul",{key:"b8d0584acd9ef37ea03e2933e78563874e5d5065"},c("li",{key:"bebd9ea990f44335a23fac0c2a2f5029cfc57b26"},c("span",{key:"8e886745288f53fa4c165bad30ec331c4356f605"},c("ifx-icon",{key:"18ed4acc797e4e2a56cffa692c63a3f62f2465f1",class:"check__icon",icon:"check12"})),c("span",{key:"43109f338fac4f4f5a1f69323bdc251780b41298"},"Provides a structured and customizable layout, featuring elements such as headings, images, text, and buttons")),c("li",{key:"c64f069e7154e624e2c46b55ca9c2378be7df605"},c("span",{key:"525b928fef8b1a8aae562a92f9d2bcb2b477a230"},c("ifx-icon",{key:"1a1515d1bfa0f2d9e76770317af3108bbb17472d",class:"check__icon",icon:"check12"})),c("span",{key:"a9fe2e4b3e262b8d30e942d739da0c00fb726445"},"Adheres to web standards")),c("li",{key:"224ce7e8fd8a95ab89315bb969ac6f2a1e10a1a7"},c("span",{key:"a1d212c444d03766f9d8a2e4c29668206d654477"},c("ifx-icon",{key:"0af9dbc5f7d1f3256f856adf478ab9dbea4a365a",class:"check__icon",icon:"check12"})),c("span",{key:"125472f6c87facf1640dd69a4c926bad53cdea71"},"Horizontal and Vertical layout")))),c("td",{key:"3caf552a626e1759c77a55ceacb585c3c995dd20"},c("ul",{key:"34ffab194dadd23896a147f3bdd560a54611f66b"},c("li",{key:"85b77937faae6c55ba09380411bfad7962fc8dfa"},c("span",{key:"34192ed035b15e34854a3d3f28425c99d52397d0"},c("ifx-icon",{key:"a4bf15869c5027fb053a91d11831fb9e3fe3a8b0",class:"check__icon",icon:"check12"})),c("span",{key:"f1d8513fd7a606e168ec679f8e049cb060e10310"},"Possibility to embed multiple buttons")),c("li",{key:"d3fc8fa06ebad784ba4685eb1db8102c6f9cd9d3"},c("span",{key:"17f2f5ce423085b5d38fab1aedb1eeed40fce4e8"},c("ifx-icon",{key:"7d3c492a17e5cacb9ba7b14df60c88d2e9bb1ed8",class:"check__icon",icon:"check12"})),c("span",{key:"42e7e04a64d2f9dbb7fbe719254f1131a9b497fa"},"A switch between a Link and a Button")),c("li",{key:"67c91f2d81608aeba3aa2847657ecc22e36a0f92"},c("span",{key:"abb9e49fbf1940379c5fa5f062e6922150cf419f"},c("ifx-icon",{key:"c3257ae4e45bbd68b68000eae8eeeaeed5ea8263",class:"check__icon",icon:"check12"})),c("span",{key:"c4593a5c309fd66c45db0fd1ae488f1e2e5ec08f"},"Enhanced stylying behavior")),c("li",{key:"0892d2840d7e6e452f0483d80da56ce0ba05af57"},c("span",{key:"ea12f921d8c11d1a377e7593ad15f1a7e3b4c240"},c("ifx-icon",{key:"642c054f52096c931f6d94faddb8f516179afebf",class:"check__icon",icon:"check12"})),c("span",{key:"eddef6e79329c77c8c8e4b3e8eeb7ed2284cd7ff"},"React, Vue and Angular wrapper integration")))),c("td",{key:"743bb548d29440712e581110da56c4980373c1c8"})),c("tr",{key:"d94e4dd0009715978eeb74f904bf25181f7feed6"},c("td",{key:"a07cb6903dc7846f63af950614014cc9b105d69a",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"63717a27050b5a2b3269b8328656793f119a8e64",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-checkbox--development",size:"s",variant:"bold"},"Checkbox")),c("td",{key:"2a6675ce8b4bedde0a50f80f05958c57790442a6"},c("ul",{key:"af28cee2e422300ada0db5ee375f3ac132f2d059"},c("li",{key:"053042b1b8ac5a58c78167e45dd7f286cd02209d"},c("span",{key:"57c7e341370876a53094a5f371e166e5f8e72a1f"},c("ifx-icon",{key:"16780870ac494fb630ef6315e9b3cca6d41604e4",class:"check__icon",icon:"check12"})),c("span",{key:"eb23e5ad9cd638e2c8243dd09eceb170c8f77260"},"Offers a simple and customizable checkbox input, allowing users to toggle between checked and unchecked states")),c("li",{key:"6f9863261743de72cfc8dc81f2dc5b6c88e53dca"},c("span",{key:"8832d36fb0a3e22a9afd3a89e4a6cb2791218ffe"},c("ifx-icon",{key:"705d9f6906f83d912b311559860737d42db5e2c4",class:"check__icon",icon:"check12"})),c("span",{key:"3daec7c96d42d6915a7d9e1da311f0ecd7ca0fe4"},"Adheres to web standards")))),c("td",{key:"399c254b6aaa8d64a263fcff5662cb118b03ec80"},c("ul",{key:"301bbacc5942b1197d98d0d8f99900f4b5c92e3f"},c("li",{key:"6a699f0642fc34d8e35c1ef968b0b7ab68a84916"},c("span",{key:"eec9c1959d6073319ef24ec5fafd9b26c6120aeb"},c("ifx-icon",{key:"e8504f2b3efe67b9072acb0f1848cb62cf5f68e4",class:"check__icon",icon:"check12"})),c("span",{key:"9b7538b5e6380ceddd73a5c63d1cae9120cefd65"},"Indeterminate state variant")),c("li",{key:"40e0a8f11993bb6155a708fb13dea799a4589b15"},c("span",{key:"bc2de235c3f8ba692a6a164c1aef7fe6893f1ee9"},c("ifx-icon",{key:"efdf0a858fdbba787f0a7b034d87270bfc1ea725",class:"check__icon",icon:"check12"})),c("span",{key:"3a32ba9215619f4959274b6198c84fe18cd4fefa"},"React, Vue and Angular wrapper integration")))),c("td",{key:"cdf9762cdcfea9d9e70c36ffa0705d7049ecafbd"})),c("tr",{key:"b0275bed20397242feae7957d1596c33bff3c2a1"},c("td",{key:"dd7780da66fbce249491ecb963995f7c34a747a6",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"3d1baafd3309dde5b32df0fa62b2cbdd220d41de",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-checkbox-group--development",size:"s",variant:"bold"},"Checkbox Group")),c("td",{key:"6e588c90b15730e3f6b161512f8f4ba24066b273"},c("ul",{key:"a37faa89f97cf7a14b2c9baa9aa09fbffc454bbd"},c("li",{key:"e8a3598423a748b7ef7737e781f42173cf987581"},c("span",{key:"7f395f4bb6eb210f4b47785ad2e39eee32900959"},c("ifx-icon",{key:"d4b1d26723ca357c937f7dc339d4a0f9aceb9959",class:"check__icon",icon:"check12"})),c("span",{key:"68e8ac7b975d0f2dcee7a0be78e4a17401cb71ca"},"Provides a simple and customizable interface for grouping multiple checkbox inputs")),c("li",{key:"f17ee2090122c41363e60a0b8b10fb74462e962d"},c("span",{key:"a88a706d470114a4d44defe704462284511f6be1"},c("ifx-icon",{key:"d651c4304c0b32078579a060c8cbc391cb691418",class:"check__icon",icon:"check12"})),c("span",{key:"5c5ae3152e76e79e73a6a95e0ec2e255b88c1975"},"Allows users to set and display group label, caption text and caption icon")),c("li",{key:"285ad79a74fee93305e44842659093a43f323a0b"},c("span",{key:"710ccb9542082db1849f776140b2dd0b05470323"},c("ifx-icon",{key:"4e86bda98b6116d6ecb25e2f152de630cf48f077",class:"check__icon",icon:"check12"})),c("span",{key:"e5bfd57ee818ca2f592caf1789ca73bb3eab15d5"},"Allows to display individual or group error")),c("li",{key:"73a5f4dedbaefbdee3716d474af96b6ad6a84fd0"},c("span",{key:"d19a84786fa80a8b8d29300583e0c949eadf7a0a"},c("ifx-icon",{key:"7369062cd6ca39e52300977ef22728dc7e46ac05",class:"check__icon",icon:"check12"})),c("span",{key:"22c56812db317719c597b3f4f570e4fa53a7576f"},"React, Vue and Angular wrapper integration")),c("li",{key:"6eaf2ca6ed7a676f87e1e2a31ed935839deeba44"},c("span",{key:"f654f1738a4549666db7d894e3c14e5395a03cd3"},c("ifx-icon",{key:"e155b661a463fd3305bd67bcefe88e19aede726c",class:"check__icon",icon:"check12"})),c("span",{key:"79c2fd6c9f2ac77bbf2d17ce56efe42ae9383b62"},"Adheres to web standards")))),c("td",{key:"6b301538799dfc131e331d7c5f8443d4150b80a8"}),c("td",{key:"9b9a18286f7c00c19a387bf28bcf48186fb1b498"})),c("tr",{key:"f3436c8e060f0135af08f7a9962ac1f17ce67e2d"},c("td",{key:"5f09170a2d133c4ddec296ef141b147a0b6ad769",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"4b1d346aa63978ff034bd870b89cba03a22a827d",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-chip--development",size:"s",variant:"bold"},"Chip")),c("td",{key:"17591a3cd57c743ecee007096b7ee43e39e09b76"},c("ul",{key:"8223e97c788823abf8e1dcd69f5d9787cd96c11e"},c("li",{key:"7c1a1b24b852e92d585226a7880ca37780a0c3c9"},c("span",{key:"7142ef5529cfbe8b14a8d8d25a7dbafeacb71df8"},c("ifx-icon",{key:"c9767ca3366cf31393310fcd74b0dbd79c87e375",class:"check__icon",icon:"check12"})),c("span",{key:"c4a988d77157ed0540e2a468ce16bfbfacb8c0fe"},"Provides a simple and customizable interface, representing discrete units of information or user interactions, such as labels, categories, or removable entities")),c("li",{key:"a74c028aa6f28972619d5bc92af58eb5fb1a13ab"},c("span",{key:"d52fb19fed44c89b6f16ea6b6dc64139260aa95d"},c("ifx-icon",{key:"75cd7bf6729a74a010cd747a76958aa30c8c25d0",class:"check__icon",icon:"check12"})),c("span",{key:"d2cfc85a677d5ae2bfbff356765d04ce4b29d567"},"Adheres to web standards")))),c("td",{key:"37126b457b06eeb02b523003184734e27318535e"},c("ul",{key:"61bc060aab3dd6f2f8c37f1c7272a5c05df9a9d1"},c("li",{key:"cfb8a56ba3a9a7f267a551d256ddfac752fd90d3"},c("span",{key:"aef43a83b2f57a4f808f10f28ec42c722fffd10c"},c("ifx-icon",{key:"b304a980d084ffe18a6fced7853fd33823b516ba",class:"check__icon",icon:"check12"})),c("span",{key:"c42279f1f9e4d7911f370dd45567aa30b8614cc2"},"Incorporated dropdown-menu for individual item selection")),c("li",{key:"d79dcbfddece493971a69d79cad131c1ff614605"},c("span",{key:"cb05626f5fbc9d02b27febaf29c44a80c47d654e"},c("ifx-icon",{key:"a363abed710fe856de7a658a18d876f047aed592",class:"check__icon",icon:"check12"})),c("span",{key:"ae31668d92410b31e71ff8a75ee0f671a0f22718"},"React, Vue and Angular wrapper integration")))),c("td",{key:"5919a68c4ee00d5bb7f78b1fcbe94cc700013bf1"})),c("tr",{key:"3812ff4b3ad0add187bf4bcaa9925fe7d55fb750"},c("td",{key:"bbc26f7b8e4c980cad2cbeef34393fa14028b8dd",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"a62813288ff0ca1c32b67b67a579477b98501ffd",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-chip--development",size:"s",variant:"bold"},"Date Picker")),c("td",{key:"7ce6ff5503fdfe9bce879c2cb2699080cfcd9b94"},c("ul",{key:"7089c9cf683f6dffdaaa0f06cdde443b390bb135"},c("li",{key:"d09598ce2b4e402976c5c9d55595a223716a2dde"},c("span",{key:"3c72f4744aff5bbaa65f31ef218634fdbc7d9b63"},c("ifx-icon",{key:"504e45904f7a97d0040189194e14e73f1e075412",class:"check__icon",icon:"check12"})),c("span",{key:"73b0e2093e83b99149c9488c98440fecb14125f2"},"Provides a customized wrapper and theming for the standard date picker element, enhancing its appearance and user interaction")),c("li",{key:"9cf09019048f80f4648b2bd959a3820289ed52ff"},c("span",{key:"f7aa9bd8c118c0efe59bb54da6d100cf77c0ee81"},c("ifx-icon",{key:"5069360ccba9492c40184f1bce92c06e4ca592c6",class:"check__icon",icon:"check12"})),c("span",{key:"cae0de8fa41e18da4f51494756a88d89b12b2337"},"Cross browser compatibility")),c("li",{key:"57b7ba0e9d8343fba472647ca0d8f09406aa0acd"},c("span",{key:"78cc126affe320be03e047fdfb82c4aac9a1e5c8"},c("ifx-icon",{key:"eba837d4b2eaad355b3bf36a718d13fd5e333241",class:"check__icon",icon:"check12"})),c("span",{key:"be8c4473d5956e3fe4e2d4146b2485d598b91ae3"},"Form integration")),c("li",{key:"1533448a601be6400c8ee90ec625eccb436e2c9f"},c("span",{key:"3d5b6850649b815a9d15f9c9a166140118373f3d"},c("ifx-icon",{key:"ee1b4db7228a420b126b1c1f2f84761db1e746ad",class:"check__icon",icon:"check12"})),c("span",{key:"70c13cf75bb4115b916c6eb834886e6b94dc4f7c"},"Adheres to web standards")))),c("td",{key:"c373f9f145e27807409de67fb432e5902d85f71c"},c("ul",{key:"2cc748d125d55e1d0c2345b1a49f6b619219d6ef"},c("li",{key:"03d643a5262d12cab3e02c682b71485f4f006182"},c("span",{key:"3c42e9fdb7de3417c41489db90796bc5401abdb1"},c("ifx-icon",{key:"69ed0bc264ae5df86fa0cd27e97015197d6653df",class:"check__icon",icon:"check12"})),c("span",{key:"7d69b5eca15d3140e23f08ff5b11e8a64c0aaad5"},"Range")),c("li",{key:"e93353689dbf852f102c588863a6ebe5a7739ac9"},c("span",{key:"7612ab348a416772a0859bdd94b5bdf468d6b34d"},c("ifx-icon",{key:"6ef7af1f240edccd4a6e2ce2a280b665074b04f1",class:"check__icon",icon:"check12"})),c("span",{key:"7332e9a99cfc24fa89efac2ec59af99e34932506"},"Default value")))),c("td",{key:"772198e2dd23a48be721bf088749ec6765bca57b"})),c("tr",{key:"47118689b94c6568540444e5c081ce7514906b58"},c("td",{key:"80181b88c2e3658be0a5fba4286cd461ad7d4cc3",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"7997617fe093e520f010c2c7efa7bd55569eca21",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-dropdown--development",size:"s",variant:"bold"},"Dropdown")),c("td",{key:"d1d3110e7455e04145ea7a615fcdc5e11ea86c03"},c("ul",{key:"7326746db9adc3a09f35df64317898e735fe8809"},c("li",{key:"d5944c5142bdfe15311998adda421164ed1d081b"},c("span",{key:"ccc78f1cb82934d4ccd0d77c1ca88fc25eb84a71"},c("ifx-icon",{key:"1e890648c4547bf6ca1aa509a9e3556f068f9d8f",class:"check__icon",icon:"check12"})),c("span",{key:"4ed38652929a20a6886c707992665c1ed8760d9e"},"Offers a versatile and interactive user interface element for presenting a list of options or actions")),c("li",{key:"dd09ab28ffeb24f1b5c047013c0043f21d216825"},c("span",{key:"67c2e7521e2b7245f0acc446a6bdee5d0aa67d02"},c("ifx-icon",{key:"266b480331b4f13e9972952d6b0ba8dc4dc245c2",class:"check__icon",icon:"check12"})),c("span",{key:"808a3488f3eac9420dbe42f5b243d7f902c1f8e4"},"Ensures consistent behavior and compatibility with web standards for a reliable user experience, while intentionally limiting customization options to emphasize a standardized appearance and behavior")))),c("td",{key:"7332d127835c2bb17aabee28ecb32b82149fdb84"},c("ul",{key:"f330ae322aa525e9388920193f0c9d85cbe03241"},c("li",{key:"2388a328be40636cdcc7c48a5b8392d6f9fd755a"},c("span",{key:"b8e1f8dd7391cb8da9313b41ba92a0475729c19c"},c("ifx-icon",{key:"064f296336b576f37cf7736f4db536e1bfd0bb5a",class:"check__icon",icon:"check12"})),c("span",{key:"0a38d4b73b28f0a9509de8ecab296d2a0b9c24c5"},"Search filter")),c("li",{key:"64de0718b648cd8a6be35fd60e53c4163dac6ab4"},c("span",{key:"164631048678c7f585b3fe5ef1228ad205ea2f35"},c("ifx-icon",{key:"8f8dece8e2080747904c18a8bb530b093cc6f0b7",class:"check__icon",icon:"check12"})),c("span",{key:"6d20341099989ee2d1090a4d00e5650f7df0b72d"},"Header section")),c("li",{key:"a361eeca2520641d3ab39a13210dad62e2c213e0"},c("span",{key:"7dddded09944a4ac185930cb20cea76c4916540a"},c("ifx-icon",{key:"5df229205cccd41722569937f901a8ad4d7e2809",class:"check__icon",icon:"check12"})),c("span",{key:"19991481af3cc28676a0dd3e55eecc181d16c27c"},"Menu Item Divider")),c("li",{key:"f9685ddf94b276721e7628285f8d527db77efa86"},c("span",{key:"53ea56eb4c4aa3accb5fc5a65b97527a782b7c3c"},c("ifx-icon",{key:"89aff575a9617e33d104fb49f0dd30f397035798",class:"check__icon",icon:"check12"})),c("span",{key:"a1e35e890a132388269045c36f5f18c148fb3702"},"Icon incorporated")),c("li",{key:"75bef338c4258a9d5cb3b52700ae4d5b84db25ef"},c("span",{key:"2f4406f08fb541bc9cd4a12f618a0e2f20f47748"},c("ifx-icon",{key:"1b32c523ec65edfd113a6c89c9503ea3c8813115",class:"check__icon",icon:"check12"})),c("span",{key:"7c0d82901a9c5283f108d7c5a6aa6d7aa6a8e085"},"Extended customization and configurations")),c("li",{key:"73572f08b4944888efc2c9c97a027576ccabd0ff"},c("span",{key:"3e0adef28b2730d5b52df6e34bd1c348085ab25c"},c("ifx-icon",{key:"7df961dd64b8db51e73ec4a48aa7f07d84a9cecd",class:"check__icon",icon:"check12"})),c("span",{key:"05b250b59f3827fdaebe5902056bb08f97a3e9e9"},"Separate label trigger")),c("li",{key:"e55474f0445fb49693af512ded4b3498571d4aee"},c("span",{key:"f0f62f36e4377a4b041cab9cd21d9c966777845b"},c("ifx-icon",{key:"a4c7fab11e22d603f80d405442b9f1b70412d5ea",class:"check__icon",icon:"check12"})),c("span",{key:"67a4a17f84b001fb26029d36d5c2d079ba812115"},"React, Vue and Angular wrapper integration")))),c("td",{key:"a6957ab6e8c0753790c5283d447322e33540193c"})),c("tr",{key:"d34cea8630500810342efeeecff9fb8315d0abbc"},c("td",{key:"523664f40c8d3b3fa68fba79d0c2f7dcd3c5fc47",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"aa5897f0e6b6aa67c6d3a35c873bd603e26f13a4",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-footer--development",size:"s",variant:"bold"},"Footer")),c("td",{key:"a2f7f4ff3446fc10b69d9d638f4ba887561771f6"},c("ul",{key:"0c560224195dccab6c6bd3d064bb019864e7c4d1"},c("li",{key:"9c47315df8226f68d070b5fa4effd016a9566f49"},c("span",{key:"3f476593e8f315eba30ed97bcb6c0a8dded92b48"},c("ifx-icon",{key:"f05f5b56b00d96c0eb63fb50df2ad68bdda84206",class:"check__icon",icon:"check12"})),c("span",{key:"abe5b3f37140af491a49a30b24e5393b002322b8"},"Provides a standardized and customizable way to display essential information, navigation links, and branding at the bottom of web pages or application interfaces")),c("li",{key:"fe1f2a1b7d09ca0d5e42b4cc1595452b49817206"},c("span",{key:"85871dfa3f471d90a0dab6e83b92e7708df74384"},c("ifx-icon",{key:"f364bde061fd38d96fc03b8e31bf8ecb369c4251",class:"check__icon",icon:"check12"})),c("span",{key:"db92da631e06e95b951dd71aae2385b87fc0778e"},"Offers a flexible and configurable layout for organizing copyright notices, contact details, sitemap links, and other pertinent information")),c("li",{key:"8cc5060658e01908d46a0efe6a9d9c80ffcc21c2"},c("span",{key:"1c1fda2c29f4fde8a434410a723a1b518cd74405"},c("ifx-icon",{key:"c053506ebe22f4d70ca306e72d5a3c2cb578aad6",class:"check__icon",icon:"check12"})),c("span",{key:"2bc6d6dcadb623a01a83480ac2e029fac8fcc0b6"},"Adheres to web standards")))),c("td",{key:"43c36cd0ae460d94139199761c2520af6f6d12bb"},c("ul",{key:"e64ef0fbc29b3f4457086705fcbc54b443190206"},c("li",{key:"8cbfd314478724933b762539130257ed7ab0af83"},c("span",{key:"f381cc79fcbea2ea40f96ced6826432b40b85787"},c("ifx-icon",{key:"87b8c8bfabcf19eda203fe50629bfb4d37ea9ec2",class:"check__icon",icon:"check12"})),c("span",{key:"14b0b16602cfdf9e99bd8162f540f58b2b8b2d57"},"Small, Medium and Large variants")),c("li",{key:"5742bcd3dc45b8c84934bb104676e16ecbc2f254"},c("span",{key:"7c605ebf46eecc81c05bd687f1e379e78284d37b"},c("ifx-icon",{key:"27c16b540cd3df911aeeebfe78c47ddfb18e38fc",class:"check__icon",icon:"check12"})),c("span",{key:"db07dde7fc28f789b9597c03c188a06ce9d5be2b"},"React, Vue and Angular wrapper integration")))),c("td",{key:"ffe015d698833b1671d636c4d653adb155d74f7b"},c("ul",{key:"374df4d86df8ba3253b2ae87b0eee044e4b30115"},c("li",{key:"4922287c997036e03d083d63a8e486d1901ebb42"},c("span",{key:"bf2e36b0f1978286e6806a82b6aec47f01ff9435"},c("ifx-icon",{key:"47dc39f6ecc744efd90c20955683b6bbfbab915b",class:"check__icon",icon:"check12"})),c("span",{key:"cc63b33330239772c57dd997716d6b18c6f4b3ea"},"Customizable and removable links"))))),c("tr",{key:"c4ed5d348093dd09b7ddade4a2b91ce10b23a447"},c("td",{key:"f5443a333aa993ad07ad9d41303768dc89bd4daa",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"f0f7c7ad33ab1b5fbcacc68f16ad449b8ee7df65",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-icon-button--development",size:"s",variant:"bold"},"Icon Button")),c("td",{key:"7ae70db1a301f7c1aac77d0c7bd471c62e2e3f1d"},c("ul",{key:"12f705a91c07479ef5fe79cc0948751f6318337a"},c("li",{key:"04ba7f92569ff9e6ac2384fc3b6931a21ef76dbc"},c("span",{key:"632b1ec8aad8ac6ec0d94511ffc4607c58db16b0"},c("ifx-icon",{key:"ea62125b77654fb0deaa26829b7cce2c02fe6623",class:"check__icon",icon:"check12"})),c("span",{key:"c4a97d93d8d3d1f7da287c581858ca8f3bc8487d"},"Offers a compact and interactive icon-based button element")),c("li",{key:"5d45c8142d9d4f539b3f9a3319c90a85795e83ff"},c("span",{key:"d22a79219b98ed50e005d996aed5fefa56d1a725"},c("ifx-icon",{key:"58d95c61d8eb0549535196d04aa1e67298122136",class:"check__icon",icon:"check12"})),c("span",{key:"7f901ebfd8b5dae837b3c0bca56b415e1606c4fe"},"Provides a limited scope of customization")),c("li",{key:"fdff09b84258e31648ede31095085bc88b1b635d"},c("span",{key:"6a0912b8c67eac507aacaf1b7e088f2732eaeeef"},c("ifx-icon",{key:"3df4d8e397f6d7351b7840a134c63c1210d94f09",class:"check__icon",icon:"check12"})),c("span",{key:"2ed3bf7d892663caae88c5284d3959fbae213213"},"Adheres to web standards")))),c("td",{key:"fa96e3f82ea44baed6f897bfa39b00716b9b5c88"},c("ul",{key:"d7b585ef11d67c0f1b50adfc19a1d9f2b63931c1"},c("li",{key:"b686130c5f1b35314950650881efacbd02acb1c7"},c("span",{key:"824c3b13f39eb9ad034e93366351aff116249fab"},c("ifx-icon",{key:"e8602e4b40d97dc8c3f74b91a4666e437b52d5ef",class:"check__icon",icon:"check12"})),c("span",{key:"7089a9b92f89a0d4e1dc431ce92de6a0a873f7d4"},"Additional Round and Square shape variants")),c("li",{key:"8179e6d25334db61322c305d34da7d45b389976a"},c("span",{key:"2bd40c268681cb71c23c9d7ba36db6d1aa615ad3"},c("ifx-icon",{key:"b8f196f2e37a99ef2dbec32cac6f48a445464df8",class:"check__icon",icon:"check12"})),c("span",{key:"bb8cc74917d9ff0d3768e06868a68320ab0fbfa3"},"Small, Medium and Large size")),c("li",{key:"496a2e22e38c912d4d7ca896eda831a0ef806c56"},c("span",{key:"ecc92a8747844397d8545510b57be984b890bf78"},c("ifx-icon",{key:"79c8a8f8c5b08853f4b40be42ea7412e43c83402",class:"check__icon",icon:"check12"})),c("span",{key:"3b6c8f7d31bf093f12bfd0fbcc364aafef0e1374"},"React, Vue and Angular wrapper integration")))),c("td",{key:"dfc415c0a4d804d80a3beaa95547e0ddcd4ddc38"})),c("tr",{key:"1d7b3b9254aa3ffaf117383c56e0d333432c4c9b"},c("td",{key:"9dc5f3b95d02c5ccd1d4d4bcc150e3c37e1e62af",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"69ba75ceab6ed86a1d6c6916f5888adc1ce61cff",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-icon--development",size:"s",variant:"bold"},"Icon")),c("td",{key:"d8c42524f2a51cb22d59c682138c9e765afde4a3"},c("ul",{key:"583969e5f9ede611f9450b894ab6832c4a5bfb84"},c("li",{key:"323c43e711f64392a2f54d5a174403727e272a93"},c("span",{key:"92da309dc7065fbffa2fa70dd7a695edbcd5fee7"},c("ifx-icon",{key:"d7726fa805b08ba9f2b5ab08267526f080fd4b7e",class:"check__icon",icon:"check12"})),c("span",{key:"e536352376ca41c3e3f69fa81998de5ab2d83982"},"Offers a wide range of iconography options, allowing developers to easily incorporate symbols, glyphs, or visual indicators to enhance the user interface and convey information or actions effectively")))),c("td",{key:"43205fceefc1cc60a4bb6585f36f89c0440d039a"},c("ul",{key:"a71555e84c03f4537c43f99a6f63acae592ef661"},c("li",{key:"0e7f9c62b6bb5f58988829ec948c865a7bc0bca5"},c("span",{key:"f60f0c21c599263def88809f41a320bc6ac12f85"},c("ifx-icon",{key:"4d6b358a6734ea76f91f74bff9ea1f2c135b23d6",class:"check__icon",icon:"check12"})),c("span",{key:"f2db362d6455880c7e7e800142f9ccd78e499678"},"React, Vue and Angular wrapper integration")))),c("td",{key:"d791ecf0fbd1ba23d81726c31420185ebe51503a"})),c("tr",{key:"c4787de103fec54b1424947b659fda7cedb7ac14"},c("td",{key:"fa7533e7f5a1e9708984d8035ad7432ce9ac3805",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"a4d377581177c62cf13e31d12d38c31858320e4c",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-link--development",size:"s",variant:"bold"},"Link")),c("td",{key:"eab54c483fb0ee3e061be002c6e1356e4b8ec10c"},c("ul",{key:"b7b428033c1b155d0c8189127455985a2fdb0a94"},c("li",{key:"cfa3090450c164cb1e6e51dae9f043916de131c2"},c("span",{key:"3253af8e1527de40762c8af86b8f804c1d7aa293"},c("ifx-icon",{key:"c133b4b731a59979d173dd4190915c3d7b2719cd",class:"check__icon",icon:"check12"})),c("span",{key:"7b64533f298aa43943f87bebe067fc54aeae0720"},"Provides a flexible and customizable element for creating hyperlinks within a web application")),c("li",{key:"b9763e150a968eaa2e4ad7c8dfd29eb1d12f266b"},c("span",{key:"319de14aeda46fa0c7cc2264e5a4e70e31309894"},c("ifx-icon",{key:"b3ebdb554fab4404d7c31e4349f3459380c099f4",class:"check__icon",icon:"check12"})),c("span",{key:"0f434cb65176ddc874c2dce7d2e686065d20fd7b"},"Offers essential functionality for defining clickable text or elements")),c("li",{key:"aaf6cbe816000359b784657697aba94561b5e523"},c("span",{key:"3868dfa3a14e47ffde6a38d141b798c07a9a6861"},c("ifx-icon",{key:"f19c10172276b1a44f3fc9013155a928786e782d",class:"check__icon",icon:"check12"})),c("span",{key:"cfdf64173b13d9c94c3dc0fe0edd2c30cceb624e"},"Adheres to web standards")))),c("td",{key:"e3fa93d34206d4c17aa215002fea353afe1fe6c0"},c("ul",{key:"679d1df2f723d86e6d174255956e4ad6f87507ae"},c("li",{key:"1c7ead268a2dd47eede616c7b63f2ba01e5057a2"},c("span",{key:"19f9b207df2876af70372917de76ab3820df75c4"},c("ifx-icon",{key:"06ffc6b77bd96ca2b683640d1cad6fac30adaa86",class:"check__icon",icon:"check12"})),c("span",{key:"9d36a0655f9fffeac95e765255e614f71a69e15a"},"Small, Medium, Large, Extra Large size variants")),c("li",{key:"2504188be88afc3a18bd230969756ee0277c40d6"},c("span",{key:"fffa9ac813bb8d6b60bd483f488bf6132e892f31"},c("ifx-icon",{key:"45f185557c1c16a2f323bf1c48ce801666c04022",class:"check__icon",icon:"check12"})),c("span",{key:"f42c74d4a96270126e3d9893517ac7ca42be49d1"},"Icon incorporated")),c("li",{key:"082b26eda4e9790e2231ad8e3005239b0cea7a64"},c("span",{key:"dc14295c2d7d62e0d1b5e86b7c6e5e3ff8081e55"},c("ifx-icon",{key:"24f4e2945332f22b2f1fa21edd96cee9d7f2e264",class:"check__icon",icon:"check12"})),c("span",{key:"f975dae2b8918978f7f57b32dabf8e891ad94f32"},"React, Vue and Angular wrapper integration")))),c("td",{key:"dc48bf9249faeabb781cc06cea25771132049ab7"},c("ul",{key:"6f142fa4aca73ec837ee91b03656800dae05dbfd"},c("li",{key:"4604bafc36bcba9409d7c37891cb307a847c9db0"},c("span",{key:"1daf9deec6b52f818b23fec158372b7144be00ba"},c("ifx-icon",{key:"882710ed95b72c18e40988de940f25934e4803db",class:"check__icon",icon:"check12"})),c("span",{key:"a3909909b1d886f050188e3ec25ba988f24d9697"},"Bold, Underlined, Title, Menu state variants"))))),c("tr",{key:"8ecfaf907d44e3dd8ff3eb32255d6253297ab127"},c("td",{key:"3b0f3cb98b346325c8c30fb0bd6025c7d540d844",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"a39830a58549c896dff09f37a834ed3803c9b7aa",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-modal--development",size:"s",variant:"bold"},"Modal")),c("td",{key:"c978a73460c7bdd67427679b63b34b2cb20d1fcf"},c("ul",{key:"1e79e6822cc3fa53d51023e52ad4571186bad694"},c("li",{key:"4c256069c3db777a7ff15a2dfb61d31db5aad3ce"},c("span",{key:"c9eed2a5a032a40a4aa643bc9bb28ede16546a46"},c("ifx-icon",{key:"e1fccf7f56ae7b10e4360e1c4ccac75ffc03eb07",class:"check__icon",icon:"check12"})),c("span",{key:"64007f817b72d0e9986c42ac7196c99df54618d9"},"Provides a customizable modal window, typically used for displaying contextual information, user interactions, or additional content without navigating away from the current context")),c("li",{key:"75ea28fd379af4017208d1bf6d3c440e5e06ff39"},c("span",{key:"baff672c7d926205a716181a0c2e445aded715c1"},c("ifx-icon",{key:"58cdd7d7d6d333c1d42e5773a5692c60e663a2bb",class:"check__icon",icon:"check12"})),c("span",{key:"46717a1beb887320cb0b8c3a17f0e341a0cfd4dc"},"Adheres to webstandards")))),c("td",{key:"37eb55d6ff4ebffef7d61a5f9f09856ef17b7658"},c("ul",{key:"302d7779c7ef73dc6992e7249ad541d1e6a6c263"},c("li",{key:"43b1b1703ffe0fc37c2ddae8fa2cb2e9f8891973"},c("span",{key:"e275501ef634c8843d0510681b31cfa8424d33ce"},c("ifx-icon",{key:"9326242e9c1019f0fbf0b549b9967d6153f397a2",class:"check__icon",icon:"check12"})),c("span",{key:"9702d6d7cbc04cfcc154b4fe24312c2d1b414410"},"Alert-brand and Alert-danger theme variants")),c("li",{key:"2e4bea3956ce42c3ece76e9cd39381b6bb042b3a"},c("span",{key:"97438ba5e36d723d03c6c2b894a8cc54c7704747"},c("ifx-icon",{key:"892e183c3c9aa3a5f8231fb9662952976f71ac08",class:"check__icon",icon:"check12"})),c("span",{key:"0a30fe6bf7b86d05b0c87dd4521ea611e34f4705"},"Extended customization")),c("li",{key:"05f1716bf746a83acdead3b51a18025aa5bbf70b"},c("span",{key:"dcb5cd73876e1f521a0a1c4dcf44afa06d8d81ee"},c("ifx-icon",{key:"a8725734085b18e30045cdc241ab923a23e494e1",class:"check__icon",icon:"check12"})),c("span",{key:"0d9a97f5e4630ee675dfad8cb62554da56db9afd"},"React, Vue and Angular wrapper integration")))),c("td",{key:"3be5b0a0729d2f0e2e90f41f093bab8c62dbab29"},c("ul",{key:"f9bb509ba8304fcc5f24b7ed8bb4c8728aed0db6"},c("li",{key:"26041a756d1f17927825c560ca85f7c5349ee86e"},c("span",{key:"616f0cad8b43206fdc1a666dd1e7f14c344b45f9"},c("ifx-icon",{key:"665a889e7c733d45d3fb6256a53829b8c094b48a",class:"check__icon",icon:"check12"})),c("span",{key:"20d3cc2c036c6ff96166e6ac56bbdf084283fbdb"},"Removable close button"))))),c("tr",{key:"77922eb7985f6c47eb2e4bb0e1e0db801ccb46e2"},c("td",{key:"d5ae750cb62f2511a352e421e9f748dc8b4a16a0",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"89993df8cd66da8208b4bae7983b27d0d9f3e36f",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-navigation-navbar--development",size:"s",variant:"bold"},"Navbar")),c("td",{key:"c1f440035b1513a5c3a05341a834d4e9f3257b4f"},c("ul",{key:"516a8edd5ebf4374bedbd2abe69cfa6bcfcf46c7"},c("li",{key:"72983656c2fc28a488bceb8740ceeafb1047fc7b"},c("span",{key:"f4d2fc85a5806c68a144f82b120a1635b305dd2a"},c("ifx-icon",{key:"da9170b74a29b37a3c3f53ff4deb94a3b930fbdc",class:"check__icon",icon:"check12"})),c("span",{key:"e19df30e784dd48471c8ae94928fb0f21fce96c3"},"Provides a standardized and customizable navigation bar for organizing and presenting essential links, menus, branding, and interactive elements within a web application")),c("li",{key:"66710c5f9b37f9c8cc7563529e96b5fffb773bd5"},c("span",{key:"ea3c351dfa039c6e07b67a88728a92efc7014239"},c("ifx-icon",{key:"d879d3600a043a57046b3227cb9f8005348a34f5",class:"check__icon",icon:"check12"})),c("span",{key:"16de757eadda21c563d28dd73bf3eb8e6012f4bb"},"Adheres to web stadards")))),c("td",{key:"76ebfa9b2ebbd979144abee1a4a386a4bf9aed1f"},c("ul",{key:"f645972b8ad90b3c97c7f5993b7a178b32fe184d"},c("li",{key:"962ff4a703b193ba6002161f5b1b4435b4550c2e"},c("span",{key:"f334d0895caa2fe960711dcc5fc646f86d575bcb"},c("ifx-icon",{key:"34e50e50099333449aa5f2454fd2c62b160c28f2",class:"check__icon",icon:"check12"})),c("span",{key:"4ad308e0653b226bae10ea2fd1711746b5dad879"},"Navbar-profile component")),c("li",{key:"b15b8f245fb8ee4ae84f39948806bba21acbd1d9"},c("span",{key:"5c709b03067679008e0a54a79ebb03e3b1009877"},c("ifx-icon",{key:"cd3159a37ce18aaafa270447e9ff454c3af8cc0e",class:"check__icon",icon:"check12"})),c("span",{key:"bdd457d6b04b18b51f387c7cb6408a10c24b4816"},"Mobile Responsiveness")),c("li",{key:"f2a96a1f378efe960f95445debf3697d76644df4"},c("span",{key:"8e88624072127c6817056052c5df6cba0ff1861d"},c("ifx-icon",{key:"63fcf870fce983a545b571e3d8be7f2483a9c9d6",class:"check__icon",icon:"check12"})),c("span",{key:"2a54a382d3f717a9a3412cb52035f04641ddf18c"},"Mobile Sidebar")),c("li",{key:"6ec42d165fc12922dc48ed573ac1b16b42ffd008"},c("span",{key:"87f27df53fc6a4178d54a30ce2054947ac29df21"},c("ifx-icon",{key:"52c2d280949bf9cb8f422726c7cebe6c0b6b72da",class:"check__icon",icon:"check12"})),c("span",{key:"9608ad2129de4813b5324d9e1dd2ccd67e50bd12"},"Extended customization")),c("li",{key:"0c163f2ccc801b5712fc582e96433105b302553e"},c("span",{key:"2862360d3cfad4672bc88f13db9b3aeb8c51fdce"},c("ifx-icon",{key:"d2233e0cc49251e3e6abfc8095cefdf5057e5264",class:"check__icon",icon:"check12"})),c("span",{key:"3a3169682a04c798fc69d079225ab7ae65569b7c"},"React, Vue and Angular wrapper integration")))),c("td",{key:"b5962e6b2c79d6104d4774e13aee29a68bf4d1cf"})),c("tr",{key:"274d9e85ef301c6e530e838abd012617a4c8a149"},c("td",{key:"79a962a0017934b514a0e0d501641a8120c8b592",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"2163cc4d5471fc248eec0a306181dc5f5b87c567",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-number-indicator--development",size:"s",variant:"bold"},"Number Indicator")),c("td",{key:"6c0ed3435d4789d589f2c75a1941d241b7404cd2"},c("ul",{key:"4583a62f9860f009aec24cf44b2f985ef137da57"},c("li",{key:"853d75964c3bd20780bc70b3ef51de83ccb279f4"},c("span",{key:"499c4b75039d040824cc106fd9d678cf79a08b8f"},c("ifx-icon",{key:"b228c1589bbd299329bdebbbd22e4a61b98cb581",class:"check__icon",icon:"check12"})),c("span",{key:"2da98239a691b56ff57b60de830c1d077a7c0376"},"Provides a compact and configurable display for showcasing numeric data")),c("li",{key:"953d724cc26fe4950252fb34b999eb1626f56177"},c("span",{key:"6c6845790201852f0fe891452ce72a3823e97364"},c("ifx-icon",{key:"7fc14dc93c92eefd3f7c82d85eb2d40954dccba7",class:"check__icon",icon:"check12"})),c("span",{key:"dbb236eafbabf3b65edef08d1c5c7f8ff40b1dd2"},"Adheres to web standards")))),c("td",{key:"8d9d8abada552324a001a53047921f058f084f58"},c("ul",{key:"85cc537576d74310be55d7c8bfd0887acda202be"},c("li",{key:"80c56b822f7d0a91b9d5ec240db1d95f0743e3a0"},c("span",{key:"18b279251654441442d0e4ab1ba2fb677176e05f"},c("ifx-icon",{key:"057f3e986d67ab62cf87741c37ec3ce754719e31",class:"check__icon",icon:"check12"})),c("span",{key:"88515988476644c43ccccc23b20ebf133e2017a1"},"Inverted option")),c("li",{key:"3f6da21d731e47b4ff9f4ba4e9829a6e852054e7"},c("span",{key:"809b4045cb3de4e60dc7a087db6c595b639a9ea5"},c("ifx-icon",{key:"c1f398ccc8d8540462f171feec293f66726fbac6",class:"check__icon",icon:"check12"})),c("span",{key:"0e05cb12c587020218db5e242d75b207eb1f9321"},"React, Vue and Angular wrapper integration")))),c("td",{key:"9d0dd2f293aac006bf435db1b35c744f1a77a4ba"})),c("tr",{key:"55491b96d758ff16260d4f560e08a4b2beebd204"},c("td",{key:"e539ab8b1d78878869c672113fbf7d0c7e2b91a5",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"5b4299028e4e82296211ac8a593bcb8b12c9209c",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-pagination--development",size:"s",variant:"bold"},"Pagination")),c("td",{key:"e207e2ef002fbcac5d2a388065e0b1ea4e1b7dd9"},c("ul",{key:"3f7e181c47fe10bea92543d16ec5ce0381ab2798"},c("li",{key:"7cf3e2ad0ddd5fe34bdbb62c56d7cb94e81b9f16"},c("span",{key:"d3ffbf08f3e8d3a142c8efad66f7674182e5560e"},c("ifx-icon",{key:"484b77c8a0b2f9ff10fc33cba929127ebb104cab",class:"check__icon",icon:"check12"})),c("span",{key:"d8b16503395906e09ad4056b6b2885f0c408b976"},"Offers a configurable set of controls for navigating through sequential pages of content, typically used for displaying large datasets or segmented information")),c("li",{key:"ba04c8ed762946787b8eb7825acdffa19a3fb3cb"},c("span",{key:"49e53672823058ad3c2352c09963f3b48cee4b87"},c("ifx-icon",{key:"fa12853736b1f25cdd218c981321f350f3e09a8f",class:"check__icon",icon:"check12"})),c("span",{key:"4b60dd7e3da6bd676f05666fb384254b8e2004b0"},"Adheres to web standards")))),c("td",{key:"c97fad6119d08f87dec87d73aca44dde008343e2"},c("ul",{key:"8726387836f28b1a0ad5d62cef70d9d261beea38"},c("li",{key:"385b61043ff5e393cc87798f7d7784ff20a9cc49"},c("span",{key:"46d03f5f0ffd0718c98dd8fe86b2c36f0edfbb97"},c("ifx-icon",{key:"ebefd33a6c6d23298c8b8d07f793afae13a035b6",class:"check__icon",icon:"check12"})),c("span",{key:"c55f317ed1111eb2c9c260d94501eb1ec287eb19"},"Extended customization")),c("li",{key:"4dbe2e79483c900cd43100b56e93da88c9a117c9"},c("span",{key:"69080e5c576b3e6b9da31a109fe7c3b5249ab829"},c("ifx-icon",{key:"8854b662f785ccb3f52d73a64427e7106c9cb4aa",class:"check__icon",icon:"check12"})),c("span",{key:"86fc573be206a91ccd932087522b03dd0a5e487c"},"Configurable Results Per Page option")),c("li",{key:"98005b2cca074370090606b1e589bf24cb40c726"},c("span",{key:"8adcad73eab43f082c9bb8acd4d8e42977fa40b6"},c("ifx-icon",{key:"a90b9ffea25882e0e08adcc09a2cf14dc4014e61",class:"check__icon",icon:"check12"})),c("span",{key:"f6bc2bc73e6abaced473755738295b23577e7542"},"React, Vue and Angular wrapper integration")))),c("td",{key:"36ddc1687fc55d2df3949c49fac7e428b74b77f8"})),c("tr",{key:"f2e75e07e1b9f7bc7c35f189a6ac51542d449d9d"},c("td",{key:"c0a548aca49b424d5bc308a405d4783f349fe893",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"e5071f377d9ce4ebb2478b1b339c866b4269c3f5",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-progress-bar--development",size:"s",variant:"bold"},"Progress Bar")),c("td",{key:"e65c61cbb9bac14b96754adf497ad252d24662c4"},c("ul",{key:"ee3d248e49047aaf5ef8604392eaa31b4830eb3a"},c("li",{key:"3b753ef99aeb5dcae0d85961219a7a670385166d"},c("span",{key:"f15b037d8f19b224ebc70ddf625f7edc3d760282"},c("ifx-icon",{key:"b833f2341fbe3bb7edd3334a9826bb87b096bdf9",class:"check__icon",icon:"check12"})),c("span",{key:"872a815fb6e7aa7998467a860a45405059fb00ab"},"Offers a customizable and dynamic bar that visually represents the advancement of a process, typically used to convey loading status, or task completion")),c("li",{key:"db83f015276e14065a205d3758c87c4f44611fa4"},c("span",{key:"83be1320969d96f0401210f69cf18cfc9ce5d32e"},c("ifx-icon",{key:"89d00ff65b160127b17cc5bb6269b7ad2040de69",class:"check__icon",icon:"check12"})),c("span",{key:"925e6e7fff51962981b2f1a2fb6ec182899642da"},"Adheres to web standards")))),c("td",{key:"ddefa94a3520c144e136254683b3cd77b21da9f3"},c("ul",{key:"58fb1e8948c166d48553906eb12c4a23f5ca4e85"},c("li",{key:"4121064e4e80cd060d3dbea0b168cf7e49760b57"},c("span",{key:"b0d0c89903c6bc05578ad367040ec2a2c38b0fd7"},c("ifx-icon",{key:"7d62decf22864deb7ec5961a90ffbf1510472586",class:"check__icon",icon:"check12"})),c("span",{key:"9080e4dd47c3920ce04ddfa8ccd6af8dfcf70e37"},"Extended customization")),c("li",{key:"2b24d28a93d4f0a23e2cd2e22fdd4f93d1182b55"},c("span",{key:"a88d81f19d73dad6969acc57ec55af6d24983e85"},c("ifx-icon",{key:"c95cf809c7fa9f9846f781596f6fd1e6151cb366",class:"check__icon",icon:"check12"})),c("span",{key:"1ad1d9014fc894787f709986491ae50087ecc02c"},"Show percentage option")),c("li",{key:"3592c09ed86cbfd9077e731f4f7670c83c85934a"},c("span",{key:"2fc79fa96ae7e639d65700e8c91dc43296a66d19"},c("ifx-icon",{key:"032663b2b94928695873c3c866a7f1626b7486e1",class:"check__icon",icon:"check12"})),c("span",{key:"fb75cbe33a774267b11e108a6f7e5128171d6359"},"Small and With Label variants included")),c("li",{key:"5adbc7da18616a394b376f84df3ad907fd1bb024"},c("span",{key:"a61e3ab0d5a9303723107c761b56ed8f2f4ea8fd"},c("ifx-icon",{key:"4a55804da8a9f2f77593f2c4e42e08fd04dd703a",class:"check__icon",icon:"check12"})),c("span",{key:"51f2f4f8f29c98236ec5ff800cdf4b6015f37cad"},"React, Vue and Angular wrapper integration")))),c("td",{key:"2e318c030cf90b54eee86315f2677eba8364eced"})),c("tr",{key:"d75632d187b9b66e833c3fdfb223cdba13bb9a11"},c("td",{key:"b3b486429d93f36e36509685a1ad9ffd7c599c02",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"421377400cee67ceb272da9b58871417cf590ded",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-radio-button--development",size:"s",variant:"bold"},"Radio Button")),c("td",{key:"f102482a82bca3fc38b7bea1c43576193c725d2f"},c("ul",{key:"79c1b3307469ae45ed92d2457144b79bd3264482"},c("li",{key:"773b3188eff3255e0423ba358bdf4136ae2f09dc"},c("span",{key:"29308ffefa6cdcb957e9d2f769fd0acfced47309"},c("ifx-icon",{key:"9dd3a6cb2e11da9dc403440b6525193d60aae3fb",class:"check__icon",icon:"check12"})),c("span",{key:"c80cc6143919f9b56c432ccb06ccadb6ddd5603a"},"Offers a customizable radio input, allowing users to make a single selection from a predefined list of options, typically used for multiple-choice selection or exclusive input")),c("li",{key:"56f4d6651a1f960dd0cba8faed329dc92a0d099b"},c("span",{key:"2bb4636d196de4ef28c2ff881b5b37b214a7f4b1"},c("ifx-icon",{key:"c9a631fc897285c1ce6634bbd098f910c42a2597",class:"check__icon",icon:"check12"})),c("span",{key:"8cde059f5729bbf5371c85b3f40e81d94a6973f4"},"Adheres to web standards")))),c("td",{key:"073bfa710c098337e08f1c47c06ccf852669bbc2"},c("ul",{key:"eb309a894a35236f2b3cc15c716202fbd67ce709"},c("li",{key:"98cd273a18724e784ade1ad6c19e6b4bdf7cb169"},c("span",{key:"c6ad94ae24fb31a4497c89913ad0f6a3a7d74696"},c("ifx-icon",{key:"f3baa6dc0f7d7f3bcdc9aa7fe9f5c21c47b05886",class:"check__icon",icon:"check12"})),c("span",{key:"e091d887d98317b1040a5c895a3b7154f7cd4295"},"React, Vue and Angular wrapper integration")))),c("td",{key:"73ac3e8a3da5a314a23d336f2dca60b4c17a531e"})),c("tr",{key:"4ecd51f6ede42b87f13e7ce935f7db5e5a77d610"},c("td",{key:"fb88fd487798d74823b438402efdf0a4dab11219",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"43fecc1ac4cad93ca11612029e64a6e680f67a8a",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-radio-button-group--development",size:"s",variant:"bold"},"Radio Button Group")),c("td",{key:"b776661212934980f6fd4cfa24539f317f1eed6d"},c("ul",{key:"47cbd79b80b6ab7186b9beebe0071d9e59133b63"},c("li",{key:"0638fc5e49523960d6646765f22a88953da11859"},c("span",{key:"170f46e5af6d23a22fdd70bb96f565dec057d213"},c("ifx-icon",{key:"aefdac4b8d548559fdc25f1482d752f877f768a7",class:"check__icon",icon:"check12"})),c("span",{key:"4c900d5a7d5563a19343259205c32d8e6ccfc4e3"},"Provides a customizable interface for grouping multiple radio-button inputs")),c("li",{key:"0d7e48e3ee82580687a786f0b79d28abb92753a6"},c("span",{key:"1686e4f495c99d5487c5196e6a280ef14caac7c0"},c("ifx-icon",{key:"cf6d889bf3ff14fa8798c43f9b8204bd8c428c44",class:"check__icon",icon:"check12"})),c("span",{key:"a0053dc62a9e13511c265c8f5277394510c365df"},"Allows users to set and display group label, caption text and caption icon")),c("li",{key:"842da3133d8f2979c47499aa1401d57d8931ee82"},c("span",{key:"b07187b0ba76b68b3450c3e11f10144fb63af7c5"},c("ifx-icon",{key:"95f186f9d4494b6cb2f6a3818e5080f6f4b8e0b1",class:"check__icon",icon:"check12"})),c("span",{key:"74edb773cef1edd3356d4c571c704ee3acbff846"},"Allows to display individual or group error")),c("li",{key:"7c7501915b7bd2710f6732471630474efd227488"},c("span",{key:"60220dacc8e6a6c155964a28081ff70b05dd0f1d"},c("ifx-icon",{key:"483ba9a8ca29faba9a28abef83d600ba36e3ab5b",class:"check__icon",icon:"check12"})),c("span",{key:"472a38ac96ebb576ca424298e2d07153e5611a1e"},"React, Vue and Angular wrapper integration")),c("li",{key:"891cba2bb4fa57b6b05936d282448cff45987c1b"},c("span",{key:"0148847bf31ba6e4e9e234314c1a1bb9f1d4d6c1"},c("ifx-icon",{key:"221245d3558f1160a2193d583ae6b9601e154d68",class:"check__icon",icon:"check12"})),c("span",{key:"100e8566ee407ccba236879c2f2fa5e0b153d84c"},"Adheres to web standards")))),c("td",{key:"b9e79f02202e143ddf98392214ccdbba9f56acc0"}),c("td",{key:"512e502b36a1027236af7dc65900a5e3fc8ac135"})),c("tr",{key:"0d0ae84670653826fc5d60f78f6ece3536afcb67"},c("td",{key:"f662c8bedb5c18de56ea5858e9428e46eb254261",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"73c686725dae9f6549ea52dcc182983f0e474e79",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-search-bar--development",size:"s",variant:"bold"},"Search Bar")),c("td",{key:"5064b14ac727f73435d698353b55e6159099ee00"},c("ul",{key:"a01e420fb02742815fff91c9305512956a83dac2"},c("li",{key:"c7013dbe7a2063fd57a14d5febdf9bdc6ca012ed"},c("span",{key:"8d8f8f402f0319cabdf92008f5b591b1c744e3a0"},c("ifx-icon",{key:"b81dbeac7d7248c3fd9bc3a8e4d0efcb4a667750",class:"check__icon",icon:"check12"})),c("span",{key:"06d08c5607530c0249f2b095bb1f6900cec02da5"},"Offers a dynamic and customizable input area that allows users to input search terms and trigger search actions, typically used for querying and filtering content within the application")),c("li",{key:"f2aa60e986bcc1d118cb302b6cbd49a06833ca2b"},c("span",{key:"0dad85c90fa102c77b809a71598634ca0268e0f1"},c("ifx-icon",{key:"41c7fc80d866969a15972bcc111d611ba678fa31",class:"check__icon",icon:"check12"})),c("span",{key:"6ff028c91a8afb8b0ac2d3381a9e3c381fb4a987"},"Adheres to web standards")))),c("td",{key:"a997e9acccd515c210b6c9909f20c795beb12f6c"},c("ul",{key:"f75edd49951cf31a303778fff34b5cc549f5b500"},c("li",{key:"0b9bdacad5f161ac60c23c57b60f671345e4b7ba"},c("span",{key:"302aee24bf81cc34b3cf9c9f8ae2cbd0a4e1b70b"},c("ifx-icon",{key:"cad0d18bfd2dfd7207534d4b9c710505e35b168d",class:"check__icon",icon:"check12"})),c("span",{key:"ced77d6aa5523c8312615d247fbcc306315f7284"},"Collapsable option")),c("li",{key:"83f37c1648a759dd2bdbdec9924743e8cff3af58"},c("span",{key:"b973898c98bc95b31d29dff91dd654480dec2445"},c("ifx-icon",{key:"2be90a94ae7adbabb2a7ed9b39230abf14b260ad",class:"check__icon",icon:"check12"})),c("span",{key:"459e33286bd69f1df7dfef350e4d0061dea15569"},"React, Vue and Angular wrapper integration")))),c("td",{key:"fee91f97ba59b63d160b8c6b3889e9ab2c14b9aa"})),c("tr",{key:"721eac174619fd02c74849544c7c3a4fd7151894"},c("td",{key:"5b59de4c9ad419793caf20565b87f39e1240420b",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"c25f31e33548079d385712386dd09c5ebc1515b1",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-search-field--development",size:"s",variant:"bold"},"Search Field")),c("td",{key:"28e3b6d8224ac34c6103be838f6cf79519244084"},c("ul",{key:"53423f71c9ecb9ae53397b3db837a1d30202102c"},c("li",{key:"8f212e93d485ec2855fe16f248bef9354d386d73"},c("span",{key:"616b25ce30f58b3ffd79f03238c8eb3110fd89b9"},c("ifx-icon",{key:"72c65f22e3d2fca147c9d081c8225a7f322186f8",class:"check__icon",icon:"check12"})),c("span",{key:"93b366235428d02fc0348c4c5458221ec99dd123"},"Offers an interactive and adaptable input area that allows users to enter search terms and trigger search actions, facilitating efficient querying and filtering of content within the application")),c("li",{key:"c421281a99fd397a8af30424c928c734f1ecc771"},c("span",{key:"dd7349a7de23d22095ee0ef8c47b8ccd472ba438"},c("ifx-icon",{key:"f1cef8ad08fbbfc42b86f708060fbfaca47356cb",class:"check__icon",icon:"check12"})),c("span",{key:"443918f2f016fe444f692dca916c79beebc06797"},"Adheres to web standards")))),c("td",{key:"6d715fb746c140220f6c2c952e966bb3439b315b"},c("ul",{key:"4fddec078a250a32cf1ffb303514c81ceff89320"},c("li",{key:"222bc6adc6698f203d2a6b506c34ea86401b3f6b"},c("span",{key:"670cd87240242ea21381148a90596fd682584be6"},c("ifx-icon",{key:"e72c714e71631734acc5587ae81e191afac13e54",class:"check__icon",icon:"check12"})),c("span",{key:"3a52d10397ba30510603f6822190a3083a631765"},"Show Delete Icon option")),c("li",{key:"c41d6b88e1c31883d0877c4d313a9bc65da6ba04"},c("span",{key:"33b546e8bc7eeb1da50feb61c049ac59ede7d713"},c("ifx-icon",{key:"4d2c479853d4fbab1192499149261bd6207c9b74",class:"check__icon",icon:"check12"})),c("span",{key:"fdf38d6df0423c8d10342f4960df79323b6e1c78"},"React, Vue and Angular wrapper integration")))),c("td",{key:"05db4b698400bd4aaaa500aecd6e9df8d205ccea"})),c("tr",{key:"03a60ac9825019795d9e37f7579f9d6e7c7ce501"},c("td",{key:"c1067dc3fdc9f0b996e201e9d0e714249cba28cf",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"22e36f5ed3cf9733d77b737f64eed29982d2e975",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-select-single-select--development",size:"s",variant:"bold"},"Single Select")),c("td",{key:"bda7e9211e65daf207164277afb97e5f21927acc"},c("ul",{key:"de8d836c94ea3db3bb23d5098c58e84d692e4f9b"},c("li",{key:"c966dafae8034ed199d8689ce414f5b5cf04370a"},c("span",{key:"e75f2e4dd80ced66518ab504d0a131a77fa016c5"},c("ifx-icon",{key:"13947a0eac549fe0f335b746b1172ebe2e7d0ac2",class:"check__icon",icon:"check12"})),c("span",{key:"8fef577afaf5fee2e693e0869f0b403763f31dab"},"Provides a user-friendly and interactive dropdown list for selecting a single option from a set of choices within a web application")))),c("td",{key:"1381d19d81bb019d1d83b267d02458b20a32e422"},c("ul",{key:"14dd4618c0b65cb0730834ca1beebfe04de9a0c6"},c("li",{key:"df05cc39ed8edabb17d052ceec401d685db7d6d2"},c("span",{key:"9e4c8578a2b37bd370accfda3f04bb82ef870cfe"},c("ifx-icon",{key:"65fd24efba892e3afc125b2f0b981d745df25d83",class:"check__icon",icon:"check12"})),c("span",{key:"d75c4440a3ab062889380bc9d6224064eed51dd1"},"Extended customization")),c("li",{key:"e9d753b094e8aba530da4becc0cfd998a2d045d4"},c("span",{key:"0dca599113a517bfe4266f1c405ae7765b933341"},c("ifx-icon",{key:"ceac46868398de208b67e00d4f26b2ce51a0c536",class:"check__icon",icon:"check12"})),c("span",{key:"cb337a9006a6519807abd2b09a04c2bf321fdd0c"},"Option to enable and disable the search")),c("li",{key:"843bf6ac6f966dfee1ce00fb203ffe26a42fb2a5"},c("span",{key:"434c1fb92407e066e59b56324694f7211ab6e34f"},c("ifx-icon",{key:"4bda1dde87ec90f81e2c15e6de7bdcf2e6b6c05a",class:"check__icon",icon:"check12"})),c("span",{key:"faad74141f04b6afa0bdab67067928cb1b53d126"},"React, Vue and Angular wrapper integration")))),c("td",{key:"d056f0ad66301a173a1fb6728522144727fffbdb"})),c("tr",{key:"5b068ccdf4ab3c4ffc395c70148516073f3386c0"},c("td",{key:"362192efceacf29b7e6390d7789c70c98320b753",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"2f9f3ef055f183853746343446155f927fd3c0b5",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-select-multi-select--development",size:"s",variant:"bold"},"Multi Select")),c("td",{key:"6ee4a6799c16469de6964e6d87413eb5c7980e17"},c("ul",{key:"10fa16c6d278ca066232e6332bc1b2aa0b43107d"},c("li",{key:"a981738ade758149b5d259d3783f1b28e653d0d9"},c("span",{key:"8bf462937c46bdc87ad490e0dad6c37866f14414"},c("ifx-icon",{key:"55aec49c7dce65e50fc8ba57bf816cc3b7af52be",class:"check__icon",icon:"check12"})),c("span",{key:"f153d0600f1d52d125422f797279f8d60d9691f7"},"Provides a dynamic and customizable dropdown list that allows users to make multiple selections from a list of options")),c("li",{key:"93bb67440cb14f5de4d143e2b82602eff962eb45"},c("span",{key:"b2a1cbe4003a4c44af6d50d3a18bba57ff3bf18e"},c("ifx-icon",{key:"5db951493a6d1decd3f83aeda1f581bfc930b785",class:"check__icon",icon:"check12"})),c("span",{key:"fc7806fbde9e2b1815dc8eab25649ee066d60d6f"},"Adheres to web standards")))),c("td",{key:"280bdb096bff2d5d7ad17505d60293da9fb8d455"},c("ul",{key:"da784884d4a96b8df9a68c249b79dffc9b975db5"},c("li",{key:"a003dc4646fa27dd6fe46ef684494be05b8ab63d"},c("span",{key:"59eb781d9af3fddfabe59cd7c6c5e8442f76c1f2"},c("ifx-icon",{key:"29c4da012bf47055f0e4a233c2ccf0a7dee8251f",class:"check__icon",icon:"check12"})),c("span",{key:"eb0906159e3bc866927a289f76d11fc6696dce82"},"Extended customization")),c("li",{key:"1d38170534a4f8cdbfc37e6df6df86b54eb97cc7"},c("span",{key:"bb94e43fab46a5fe7f2f4640675095abfbabfdb7"},c("ifx-icon",{key:"f455412514a013cd68bffa87018431d0440529f8",class:"check__icon",icon:"check12"})),c("span",{key:"f65c0fefed9c11c5b1c458e1acf0716c9ad3f186"},"Nestable options")),c("li",{key:"5740f278db7ac8490efe103e618f531b0f109870"},c("span",{key:"7d1705d59c74432c22e4ea5ff09fd80f9de8c74c"},c("ifx-icon",{key:"3d132f3e64f9674e3ab869d5c4a4c974cf61d709",class:"check__icon",icon:"check12"})),c("span",{key:"7d2e73d36e409f6dd39e100044f86806d40f0bba"},"React, Vue and Angular wrapper integration")))),c("td",{key:"3b752cb7004c88a33fc721e527a6f1a5dbe09e88"},c("ul",{key:"ee99ec3eb30fb02cc06a3dde4a97ff330eb2c4c7"},c("li",{key:"222aba76cbfcc93c8b2856387a5559ab99657540"},c("span",{key:"cb423913dc9db501ba9084fe5527d7df66247d2f"},c("ifx-icon",{key:"d36ecd2728e5e9d23c99b99ac15e6b7ed1653c2c",class:"check__icon",icon:"check12"})),c("span",{key:"9f6ef600c8ff4954f03214a2847970fe26667fd7"},"Option to enable and disable the search"))))),c("tr",{key:"96a30685742c1706bc2222f87e0fed28f53a7be5"},c("td",{key:"190d9442ea1f91534d7507360f989cc353c7825d",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"b5ed4508b83b2551a153be8326a0f43b939b059a",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-navigation-sidebar--development",size:"s",variant:"bold"},"Sidebar")),c("td",{key:"9963338d4ea2fe19497fa75a8c67591be9676979"},c("ul",{key:"c2f05479bb7ea3047deca4bb851406d00ebf88d2"},c("li",{key:"3f8bc28f0fe2b7bfbaf199103dc5f23ff96b18c3"},c("span",{key:"778a63e8adebdd9d54209fe4b0a80d3707fb07d1"},c("ifx-icon",{key:"318d6152acc166953555424c2296403da3eed7de",class:"check__icon",icon:"check12"})),c("span",{key:"b7a6541a855ea3d5f13781898e0f7c971947a7e1"},"Offers a configurable and collapsible panel that typically occupies the side of the screen, allowing users to access additional sections, or menus while maintaining the main content area")),c("li",{key:"553eb5fb60ca267c45f54f526128350442df2dc5"},c("span",{key:"abd45212cf17e7dcf13bac80bbf8ae3420923a25"},c("ifx-icon",{key:"44952e29ab3172f96c4b3a8135c64580dbd09de4",class:"check__icon",icon:"check12"})),c("span",{key:"0e29c705ec7cb3dd1c766d3f505836260b0f8011"},"Adheres to web standards")))),c("td",{key:"b61d60a146f9071de33c6ac93959f644fa5b8913"},c("ul",{key:"f35f0f736cd7483af09ea2585dbfce3b78af02a7"},c("li",{key:"d89dd00ed08c1f0ded1b348951e4dfdd61318656"},c("span",{key:"93cf7339e4d4e2fae8b22e5afd2897658344d53d"},c("ifx-icon",{key:"46459f2ace660fc4c1435caa6422a13d5842ce5f",class:"check__icon",icon:"check12"})),c("span",{key:"3a9e22819a384c6d108374cda257af6db0915902"},"Extended customization")),c("li",{key:"afd340c2358e042ba5bbbe37ed272cc21b855f38"},c("span",{key:"e8c01d42bd4ac8a3c254707408a8354979250480"},c("ifx-icon",{key:"495265a00ed22c3f7a7db14d282d3c45405b8f4d",class:"check__icon",icon:"check12"})),c("span",{key:"e80af0d302cc19fd2830ab184cc3d85963f9fa57"},"Multi-layer nestable items and menu")),c("li",{key:"bfc03a340fb6e7a39bbb13c39160a914dc173809"},c("span",{key:"1a5abde3358e5e3dd8dad9b721cbe2e06c8844a6"},c("ifx-icon",{key:"67c56bbe495cba76c480bdb8995a05f9fcec0132",class:"check__icon",icon:"check12"})),c("span",{key:"a5324381869d722be92dc3e84dcff41973813579"},"Initial collapse option")),c("li",{key:"88e9e60379ebdd0a943ca9dbddf8e54b0e622a31"},c("span",{key:"7a2c04b298c86f6048c0eddcebb28ee87cf48ac7"},c("ifx-icon",{key:"f6bcb8f60ea7d2845366958513e55c5fe47d3865",class:"check__icon",icon:"check12"})),c("span",{key:"d124cc197d5a751634b2eb0cdb9060e6fe9e85e6"},"Active and action item feature")),c("li",{key:"1adc6a653d28679c4148455bd994d22537bcf73d"},c("span",{key:"a75bb8b5b7af4b6afa101f26447b0c5bd34124b4"},c("ifx-icon",{key:"03a52ee6951ef859c44b7a5c92e4f3e7c87d3910",class:"check__icon",icon:"check12"})),c("span",{key:"db50920c3d3099383351c21cc597f98373d2d43a"},"Number indicator integration")),c("li",{key:"16b45c2ac9311287f2b5d0e369f31da175e29513"},c("span",{key:"32552bb6fe66c3024100826b4fa77484744eba48"},c("ifx-icon",{key:"d0cfaae6fbac61c1729d3a6f4e0aaa9d6a4a4366",class:"check__icon",icon:"check12"})),c("span",{key:"bb6a65bfad02bec310fb41b366c2480f515aaca8"},"React, Vue and Angular wrapper integration")))),c("td",{key:"8f8cd94e445c663741f7c8e2bc0cb43a3a6168db"},c("ul",{key:"71ce287497ecbb84eb200a0e5cbb5febe8988227"},c("li",{key:"c8acd496bc8571ed4eb2932e98e9fb5a835a55a0"},c("span",{key:"4e03c325d457da8ca20febcfd74407884094c60b"},c("ifx-icon",{key:"729197c5fbcbfe6122f6170989ef1df8217e3dc7",class:"check__icon",icon:"check12"})),c("span",{key:"17d0cf0d7fa9d8bb127d0df0d52038d122a0d35d"},"Removable Footer, Header and Logo")),c("li",{key:"2866d0738ba1e2819b708aabea5db2f369652f02"},c("span",{key:"a15ae234506b103a2b1263fbb96375800d93d6a1"},c("ifx-icon",{key:"37b949e6b1b5be1a362ae2a52744d5a2f870273d",class:"check__icon",icon:"check12"})),c("span",{key:"e36ca3d16781e7ce56c25a96163317033b4d53c2"},"Removable and customizable Links"))))),c("tr",{key:"6b79adbbd855e59b107f5efe7a0a6ef4fcf4bd33"},c("td",{key:"9cd77d4b2a46c10f9d9dd0f3570c1b997d8a40b1",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"9a75fda26aa9100211b26c330d31a4eb9cf580bf",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-slider--development",size:"s",variant:"bold"},"Slider")),c("td",{key:"ae62e936c73aa131a4bd18d4c1bfca1de537515e"},c("ul",{key:"d2a55b2a2d3c067b513abb1502cb8f4c75d5cb3e"},c("li",{key:"025d41c990d1bae249d54bb737c24781199784b8"},c("span",{key:"80a26ca7b6a5d3c2df0487dc8628f17b5e9b6fe8"},c("ifx-icon",{key:"dcfbff2a183b3602ea31d2084d60e8216ed9d163",class:"check__icon",icon:"check12"})),c("span",{key:"6ea71bf868fc6dd856ae26db2cc337cd97792223"},"Provides an interactive and customizable input control for selecting a value within a defined range, often used for settings such as volume control, data selection, or numerical input")),c("li",{key:"68202705f64c0be537eee9dc85392b5b54a997ca"},c("span",{key:"68245dc67c8c1f2c4442098f74d2e3959ce3427c"},c("ifx-icon",{key:"7857ef2974403980a5aa4c1f34e12107b8d56bf3",class:"check__icon",icon:"check12"})),c("span",{key:"e358ac8c2a1d2f79d1fbf733588798a9960c880c"},"Adheres to web standards")))),c("td",{key:"4b1929558286a230d882c783dfe76b022eec18e4"},c("ul",{key:"49a296d8aa3632da1022071bc583dac152e6a7e5"},c("li",{key:"30c2fd9f262b10690abf4c4c95e6516c06c71402"},c("span",{key:"2bb9a751689e32d65c9df3978c097fecd1b309b2"},c("ifx-icon",{key:"05b3ec488faf0b46ff846e5e40901b4f49770191",class:"check__icon",icon:"check12"})),c("span",{key:"56f204f3283b42e496bad2c12c230382b4c8fc2f"},"Icon incorporated")),c("li",{key:"a6f403849d4530418ef9021e4b6f3a7a19b84e95"},c("span",{key:"00bb57291c696176aa8608007fa9405265f4d51e"},c("ifx-icon",{key:"035b8c19e5198ea8f8c43fc2c20ca787b5a9ac0a",class:"check__icon",icon:"check12"})),c("span",{key:"3f38bcef06bdf6b1769db7f1931539ccad754925"},"Percentage variant")),c("li",{key:"581348e533aecf8b25142f82a77721645e29ff9c"},c("span",{key:"1c060c9632dfb3c81ede7ef0d317fdae7447b0f0"},c("ifx-icon",{key:"91abc8600cc49314fba73de9e89c77c60ab67218",class:"check__icon",icon:"check12"})),c("span",{key:"26ea91dfc135f7908cdabc91dbb6adc994f0d602"},"Text variant")),c("li",{key:"ec9e71741a8030a2318de92d7c354cc5058f6f98"},c("span",{key:"49e3f027ce344140232c638fd4b37b244a945f58"},c("ifx-icon",{key:"96bcbb0bfc9c8df192ee5f0d1a638174a47c1aad",class:"check__icon",icon:"check12"})),c("span",{key:"b650cec972a4e01357997cfafa009867d9444030"},"React, Vue and Angular wrapper integration")))),c("td",{key:"0dab3182ae56850ed06692d1097e0bc871466aad"})),c("tr",{key:"0e5ac2bfb7f7b8b17d66e825aa97a9b3a5ad6b0b"},c("td",{key:"2da0e47b3449f36b9ddadbceff2f9a774711a2f6",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"59a3c7311f3366cfd47600036a3a47889a7197dc",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-spinner--development",size:"s",variant:"bold"},"Spinner")),c("td",{key:"88a8e4a1404b656ced27f8aff15637392d1b6c71"},c("ul",{key:"c054ba1c1fa6d4448242407851ca12e859e70f43"},c("li",{key:"e2be71a60f3c3fea54549433c0b74e436a756119"},c("span",{key:"d9bff5be0f053d8b2f3745f917f60ab49249af43"},c("ifx-icon",{key:"75078c1815326d29108ffbc979b974fdf4d1a5f3",class:"check__icon",icon:"check12"})),c("span",{key:"2e6802fb0156940200d143ceffe46aefb792c75f"},"Offers a customizable and animated symbol that conveys to users that a task is in progress, typically used to signify loading content, data retrieval, or pending operations")),c("li",{key:"542e1ca10227a0242a62270784c62152cf974b3c"},c("span",{key:"97c4f8b37d9366eb73386a40d622c0f965bff47f"},c("ifx-icon",{key:"06b67463b2ef0073f46241858d7be6ecc008f631",class:"check__icon",icon:"check12"})),c("span",{key:"9cb9edc8078f0d15ff19765d99f5daae3b9394e0"},"Adheres to web standards")))),c("td",{key:"667c1469d73eef70de9f65064b9e20934ecbf658"},c("ul",{key:"3ce99c6609889fa188c4b31e790d9b673ee6a538"},c("li",{key:"58673ad0ed6250eacbe74b4952793ac072b81b68"},c("span",{key:"cd6d1adacfa3486f2ba4946de730f5bd9fd1d97c"},c("ifx-icon",{key:"1ed899df6831e5cf6d0838c3f05ae578e3155980",class:"check__icon",icon:"check12"})),c("span",{key:"7719ca2115d79a9df4b9a3df30647a1392440532"},"Brand variant")),c("li",{key:"4b253dff6e9fc0ffbe5d8d5edc6631d86b72a8e6"},c("span",{key:"752e1990723ee28ca66d949d29ca0ab526c3ff62"},c("ifx-icon",{key:"83c3467bb5661650b0def0427e4d651997eaf505",class:"check__icon",icon:"check12"})),c("span",{key:"ccc2a09b1cc427b997d965f92e79bc7ebdce18e5"},"React, Vue and Angular wrapper integration")))),c("td",{key:"896e6087153bd93fb0342cf82df87c495ea255eb"})),c("tr",{key:"9f8753e99a3aed807f440943b46dba170c6a7c4a"},c("td",{key:"9199164e5e265316b58c4c133d8adf2ab4652fa0",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"a2a0f8c344dae4a852110cccde41a758df2e7159",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-status--development",size:"s",variant:"bold"},"Status")),c("td",{key:"09cc43a66c0032b811ac75b3575ee59904c1cf96"},c("ul",{key:"851c8fa746827619fa7fec0d49ec1fde48c37d82"},c("li",{key:"180abc9226ae8b68e8d7deecc1db2e381213ddbd"},c("span",{key:"d659ba581bb2d96b19ae627e7d9792f35e16477e"},c("ifx-icon",{key:"b6087863d206a46cf96cc3b5baadac0e242d7265",class:"check__icon",icon:"check12"})),c("span",{key:"b06666dfe8e6947b178887ea8d281be3fbaabea9"},"Provides a visual indicator for conveying the state, status, or condition of an item, process, or entity within a web application")))),c("td",{key:"938b283f70c925889f3e655156a390b53d03c704"},c("ul",{key:"e4de3a5407ffa0e6c8b8d9c20e5b96a8c876b4af"},c("li",{key:"a62f0ab866dafa96b1828180a3cb4f3d01e217be"},c("span",{key:"fa633115af7d4fc8274b0f82ad1e6eb6395b8f67"},c("ifx-icon",{key:"907aa3087d7d4ae98d8482159b549e69f82849d2",class:"check__icon",icon:"check12"})),c("span",{key:"8c061b7947278574340c12a91bf0f56b857e5e56"},"Ocean, Orange, Grey, Light-grey, Red, Green and Berry color variants")),c("li",{key:"75d921223cedd1afebf2a469b17a360850c85031"},c("span",{key:"8cd7aac8f10d4884c5ecbd6876de00da1ae3577b"},c("ifx-icon",{key:"8d06be502d6e2046a9216afd9a71d42597a6a169",class:"check__icon",icon:"check12"})),c("span",{key:"6e86d7bf89f574e175f1111cf8f66bc64bb010c7"},"Removable border")),c("li",{key:"130b1516dacf4fc59d788faab5b63a9c073b0986"},c("span",{key:"6bb9532cf13ecf1de33b4d05e8d3fa6dd1e8b8e5"},c("ifx-icon",{key:"97b76e3488e696f671c74482073b5d272d48bd07",class:"check__icon",icon:"check12"})),c("span",{key:"a924ee11c1542d42235dfa04ef533ff4bcd3efc2"},"React, Vue and Angular wrapper integration")))),c("td",{key:"0ae8faf373a361f3607cb2711a4fc1171f7464a1"})),c("tr",{key:"82616642f6efd97106f404f2a093068f5a33bcf7"},c("td",{key:"56d25c64381201f8a185c6c643515de1868f5b6d",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"da76b41f93becc9a6a6539bcb85700c84d5b5926",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-stepper--development",size:"s",variant:"bold"},"Stepper")),c("td",{key:"ab806e9e904488a59576fb374bf554c9c3a24d0e"},c("ul",{key:"b1a52db50d44aafc34f107641c95ffcf800eafcb"},c("li",{key:"c062be53f04ec403a9b0c25c805b19fe53a39513"},c("span",{key:"5db5a9933077abc6327d79be0f6474c61b8cfaea"},c("ifx-icon",{key:"ad82b8ee66b727c3ca1c05b6b50490eef0962d14",class:"check__icon",icon:"check12"})),c("span",{key:"b0cfce9889fb58d907a3a5f2d2eb9bc9e2d52625"},"Offers a customizable and intuitive control that allows users to navigate through sequential steps")),c("li",{key:"f698c7a061e403eb0e20d15435a53f4be1e458e2"},c("span",{key:"79a7bafc2ebefbe4ac40033cbcb9a5b2612bf395"},c("ifx-icon",{key:"5b8ef7b86caa9e81736ca3d503b2afd18627a01a",class:"check__icon",icon:"check12"})),c("span",{key:"7922da4d9d87d716e070e94e0e8e680406b11ec8"},"Default and Compact variants")),c("li",{key:"af9ac0743638179d35f32c551dd9f3918a663fde"},c("span",{key:"9a3950546f079b51016811e335978603b5b6df8a"},c("ifx-icon",{key:"0ff5c54568b43e9e4a5f65850c4d2547f4ff90bc",class:"check__icon",icon:"check12"})),c("span",{key:"39cb7d478935d153a28611c7f8a543e398c3181d"},"React, Vue and Angular wrapper integration")))),c("td",{key:"f8fbc354a8c4f0c8b0e4ac31d4d71a3d49f9bbbd"},c("ul",{key:"bec8afa72553be80a9c80ae009a4aa1d41b68607"},c("li",{key:"7aa84123d2f9c2596d0df5dde8b92285740c0419"},c("span",{key:"5524e3ca5e3b381718d9447b11c3a1faddeaa7d3"},c("ifx-icon",{key:"6e0e6944b80001b35a87093d146062fad0d71792",class:"check__icon",icon:"check12"})),c("span",{key:"86672a0401090d664709988de644595ec4666625"},"Vertical variant")))),c("td",{key:"f37ad00442ddb1142bb060eba98d217485fa16b7"})),c("tr",{key:"c854c2cf7af5584c2e2d4d869bae3533d2deaf95"},c("td",{key:"bdcad6cdfc75e072ce98f600423c28fdd9767e04",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"c0801761d1b9ccf00b7038ad7172b53c33b9aa51",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-switch--development",size:"s",variant:"bold"},"Switch")),c("td",{key:"d0ec0a31cc9d602bdb779693fe5cb119955f810b"},c("ul",{key:"eaeed923bfe595dbd3ea88151a02816a84613876"},c("li",{key:"3d218c0bf3bd053800051a59a152ee23b6f0bdef"},c("span",{key:"cc9c116e60f95d6456773f2c41f2815061bd114d"},c("ifx-icon",{key:"3831d3bc5d3af715e96db2707c5e9ae2877fd8c7",class:"check__icon",icon:"check12"})),c("span",{key:"a9cd3377a1801ae9b814a2e4fe2326437a401335"},"Provides an interactive and customizable interface for toggling between two states, typically representing an on/off or active/inactive status within a web application")),c("li",{key:"d11d656c85921b7302566bba75c851c4b5fcdd56"},c("span",{key:"946426a0ac6033d44a60979fb727a947eb428245"},c("ifx-icon",{key:"5f7082573a3c9883d20644e40d246011bd523313",class:"check__icon",icon:"check12"})),c("span",{key:"ca6d9399e6a600c3f47f0cc9b4ceb78ecf4b26d5"},"Adheres to web standards")))),c("td",{key:"576a8671bd7900f45c36e8db4f04a53de0e73570"},c("ul",{key:"e9a89c981ea99dbcb360f659b6a70f47d0598ac2"},c("li",{key:"434984c55661d87f7caf6d77ed8bc5e88f2177ee"},c("span",{key:"028385a48809b20be4d5fd6f1c30011009e2dfd2"},c("ifx-icon",{key:"73bc55034f4d7e9826b8e03d4e5ff022bed1c9a8",class:"check__icon",icon:"check12"})),c("span",{key:"b06f3cc2da1a6b68baee67c6b676297c017366ab"},"Incorporated label feature")),c("li",{key:"2150cb7827a9ae829691a13856363572dbd988d0"},c("span",{key:"3d86f821bb9c00a95111bacd2d0c71930dd7429d"},c("ifx-icon",{key:"2b7bcfc741293e1908dd2a7ea6224a3baf187c3a",class:"check__icon",icon:"check12"})),c("span",{key:"8ac6bcf39fc8c680b9d2a3a6a2c5eab600f47acb"},"React, Vue and Angular wrapper integration")))),c("td",{key:"414c8cf128343598cba44f574cf67d017aa90c4a"})),c("tr",{key:"5577405af23bc03b1986ffc275115656076181b9"},c("td",{key:"9b5f6045837145f1a4b0316cab8b964cad0cf2b7",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"5b50568e09f88ff74bee2353a3f8c693628719db",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-table-basic--development",size:"s",variant:"bold"},"Basic Table")),c("td",{key:"130dbeaad4b89b4b262950906c51969ce6fcb3e9"},c("ul",{key:"ea8c07e3096997610fc6b4b4ae0894bf0b89f259"},c("li",{key:"c83e9a2125300c7bdf1370caecc521cda6c06499"},c("span",{key:"b7a9f6f13a799b521bc10c3d6e078ff4ceb87674"},c("ifx-icon",{key:"7b5225ffdc4c65f7966dffd5fd6b864a94af10bb",class:"check__icon",icon:"check12"})),c("span",{key:"352d543c6a25ccc61c5d0f6a76c8732fd25d42c5"},"Offers essential functionality for organizing data into rows and columns, allowing users to view, sort, and interact with structured information efficiently")),c("li",{key:"2eab39bcaa2b9078ec773d2b2800ee37db341180"},c("span",{key:"130a375a50f6de9dcad0eda8eeee1c1816725261"},c("ifx-icon",{key:"41a801291b77184275e91399091726aeefc4297d",class:"check__icon",icon:"check12"})),c("span",{key:"c5a9cb4f7cd481e725878eb3371e152a22df9ca6"},"Includes basic features such as column sorting")))),c("td",{key:"a45075bf282edd494d62a39cd4b21ceffefe64b7"},c("ul",{key:"2b03903381b273a6c140391d76c435afb0035100"},c("li",{key:"75bed56d8f177b82d610d6a95651dafd1b2a1ef4"},c("span",{key:"177f09e31ab274b92ee0826be272c54bcf8e0a8e"},c("ifx-icon",{key:"bd3566bbff4bc39bb4986350f9dc31ae0f1ef256",class:"check__icon",icon:"check12"})),c("span",{key:"da58ced6583665a5b064d3a4892bed158cef5bc8"},"Compact and Default variant")),c("li",{key:"6ed557a39a63dbb7ea9f58b51dcc92f653d18dd7"},c("span",{key:"752034e2c02ffdaae2d68ab85690e02523a85a63"},c("ifx-icon",{key:"ca75eb3202d1fd81c8aadb977cbf73f354671313",class:"check__icon",icon:"check12"})),c("span",{key:"ecd4fc3e3d9e47b10ed83097896e25c0f3427d56"},"React, Vue and Angular wrapper integration")))),c("td",{key:"023445ccd0068710f26bcbf142bf3b0562ecdf99"})),c("tr",{key:"d6795dd447d41c1524ffe5f3f5c35c3ccd3f6879"},c("td",{key:"c765d65958dc388496c92c357b749767406e0a7b",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"ffd82290b24b2046895bfbcc31467c098fd5949b",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-table-advanced--development",size:"s",variant:"bold"},"Advanced Table")),c("td",{key:"7d9078179a1d218ee3a3df0d1bacc5f4fe6303b0"},c("ul",{key:"37e0afa054ae9df106a16826953ac3217055039e"},c("li",{key:"c02a6ee03716693875b0aeef20e9e9f0029179ff"},c("span",{key:"e8ba515cf48b2dc752d731769ee19855485c66c8"},c("ifx-icon",{key:"8af6cc2ef6a7369e63ac5db76f05e4d1e2ebc1c1",class:"check__icon",icon:"check12"})),c("span",{key:"5f74307e41d8eafac71e387728faf82dd4a34a8f"},"Pagination")),c("li",{key:"64bcc1b64ac3a1aecc1c6520d73c4bb9b9904f17"},c("span",{key:"c64750c376d1750823c08658e3460993854909ba"},c("ifx-icon",{key:"56e449d8dfc9b50bf29c5a3bce6bb3c9cb5dfb59",class:"check__icon",icon:"check12"})),c("span",{key:"5936990f5828f854c24e39c78276bc0780c59034"},"Sidebar filter")),c("li",{key:"ffa183db89693843839edab2835a9a065dbab39e"},c("span",{key:"c3e3cb27f8020aa4f5241e9c2ce52eae515746c7"},c("ifx-icon",{key:"7b0df578d0d0304a3041b80eb97a27e7dddd7ed6",class:"check__icon",icon:"check12"})),c("span",{key:"c79b4cb3fbe01dba06dee5214b8daa07313fc168"},"Topbar filter")),c("li",{key:"590887c0e4501d39b2419e8f3dab11656bb5c03e"},c("span",{key:"696546d89cab96d3b8611e58076ca97f410a6cd3"},c("ifx-icon",{key:"ece1eedfb2f7f116064dee7ad79551ea8fa432c6",class:"check__icon",icon:"check12"})),c("span",{key:"af213500b1f5b81506156c9d9fd95e98dc60bb94"},"Nestable buttons")))),c("td",{key:"1abbb6aeb45a2131e1dcbad4cfdd24603d153394"}),c("td",{key:"94b0fd9226bfcb3f5221d4d164df85abc9bace8e"})),c("tr",{key:"6037bea3aba53b4ddcb2469b9018c06fdd5f038d"},c("td",{key:"8e6979bb6e07ab0a8b6a6b7691cb55d5590c27c5",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"b864f989d729287778e65e05bf5b5192a2034458",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-tabs--development",size:"s",variant:"bold"},"Tabs")),c("td",{key:"60ffcebe0f2c43df48810f404131934edd0ed8b9"},c("ul",{key:"bde60c3e68ffb3efeb475f7c9f935580f35f1fdd"},c("li",{key:"709033d502408a63ecd3780eb9cb8006e46d9416"},c("span",{key:"371d03ac53a0b77cac7380d9587fb26f93c81053"},c("ifx-icon",{key:"65b065141a7c8b819a7b4c72c210170945509859",class:"check__icon",icon:"check12"})),c("span",{key:"e8c6bb5f1d65aa8ce022f962c4a79ff89defafbf"},"Offers a customizable and interactive layout that allows users to switch between different content panels, typically used for organizing related information or functional sections")),c("li",{key:"57f849901dce32893d42f1ffa6e47b2701d297fd"},c("span",{key:"9b0dfdb1fc3a6d587de7370bcb0a59f9453a7fef"},c("ifx-icon",{key:"6560693fd5209490df03aafa16cefbd9bb31063d",class:"check__icon",icon:"check12"})),c("span",{key:"d537e5a82b2588ed08599fcedfa45e522768121c"},"Adheres to web standards")))),c("td",{key:"99319ee2b42b17dd8ff8ce46c66ee8cc6bfc0495"},c("ul",{key:"798336bc6a7fa6bba10051bea8611f5f317705e9"},c("li",{key:"f2c4bcad40946f1e187d6dc8b963c6a82b43cb8d"},c("span",{key:"3f61e889585f98fdb91e925e62079d9b598aa212"},c("ifx-icon",{key:"7ab75db083e5831e63b89b90942ebd421b6955ea",class:"check__icon",icon:"check12"})),c("span",{key:"c64d76b2c997097d94a26c13c6a194e3156c9aa4"},"Horizontal and Vertical orientation")),c("li",{key:"919f734c63d53409d5133a18d450b5cb91ba57d7"},c("span",{key:"f229a6593803bfcd07129f839b4cae93e2c2e825"},c("ifx-icon",{key:"b8df5577c7480d631b0e7480f599333c0ca8b3e5",class:"check__icon",icon:"check12"})),c("span",{key:"53855ab3762fa0639198c336e061057efa61ae4e"},"Extended customization")),c("li",{key:"104b8b489b0405b4c6fd0618e788c5e3526e0df9"},c("span",{key:"9e4c14dca18188a9106265001eb7229f0a9f0965"},c("ifx-icon",{key:"d4cf815952360d462f13899086164e60426ec917",class:"check__icon",icon:"check12"})),c("span",{key:"e871a8a6501133e3af96df5b17d84784b8e6876e"},"React, Vue and Angular wrapper integration")))),c("td",{key:"420f75bf21804e1df8adb8a6ce11f79ea4678c31"})),c("tr",{key:"7b7fd310c0dcb1ff12ad7b56cd80d0b7f6ac9565"},c("td",{key:"d4f9d8444ebbca7a3a3e81294f0dfd0473438d56",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"83fe049092cef9da8c0596b62b2c7b57355475ca",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-tag--development",size:"s",variant:"bold"},"Tag")),c("td",{key:"d6acdb5d257186fa1f34e59dae7d84596cf5a754"},c("ul",{key:"b0938539ff21d318057c9973ec2d4f951bd06193"},c("li",{key:"e5a8bdccfaa3d6f0c1e2d499e387e79e55fdbcb2"},c("span",{key:"7cdab617879cbcaeff2d213e72d878f565b5018c"},c("ifx-icon",{key:"7add7676d3d132345e860d7db181833c3def14f1",class:"check__icon",icon:"check12"})),c("span",{key:"b8b7066da7b23290f7ba9d5e8a57d55a9e0443c6"},"Offers a customizable and stylized marker that allows users to quickly identify and associate specific items or content with descriptive labels or categories")))),c("td",{key:"164ff81777cfae74daf2a44436d541db291058d5"},c("ul",{key:"859865bec5008106fa1ce0cd0e99472a1a6323d5"},c("li",{key:"92b40cceeda3a778d0f2ab3d6a5fbdca34b2e1b7"},c("span",{key:"fcf42e39e70564767d439dfcd9f31b57edb092ea"},c("ifx-icon",{key:"b48e8c49554c0c97738ae8320b737cb187e58ab6",class:"check__icon",icon:"check12"})),c("span",{key:"5b87a7ebfa68af76d08925c405b3dba0f332d46c"},"Icon incorporated")),c("li",{key:"c4bd930aa514a537886deda7b7170c5737fee65f"},c("span",{key:"d65917e0a900ce65ef01b4ae51c288a08636a296"},c("ifx-icon",{key:"eb4c54b4d2cdf8b1cb638ab5bc52429f54d54e71",class:"check__icon",icon:"check12"})),c("span",{key:"7aa8af6ebb46daac3aeeca6acbdf6209cb4940a6"},"React, Vue and Angular wrapper integration")))),c("td",{key:"f1014ede531280d1dc4a5ec6a656034cb9b5e76e"})),c("tr",{key:"c7ad083fefd395c5a2819b2fea454f063f3a1d1d"},c("td",{key:"de8b820856801d5542ff1c3321b897817fabbabc",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"aa5c7daf99584d2a867c01bc750d39bd50b8b079",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-text-field--development",size:"s",variant:"bold"},"Text Field")),c("td",{key:"cc98f4aa1d5684e92533e79479ee59fc26ff8b05"},c("ul",{key:"13d729cc7e522b308d67b1d435ff7f18e61c1a43"},c("li",{key:"7c85903d84ccb9b302e104eba742dabcc7710c4f"},c("span",{key:"336aaca5f9bccf98ee2ecc443d73c1d1b4456547"},c("ifx-icon",{key:"2c6363098f4d76e274d05755a8f5b286809a6cc9",class:"check__icon",icon:"check12"})),c("span",{key:"551036cd8e7646853dc80d45ef917f65a2f618d9"},"Offers a customizable and accessible interface that allows users to input and modify text, facilitating various data entry and form submission tasks")),c("li",{key:"5ae6e84a3bd208e420445daa8bf4db3aee090ae4"},c("span",{key:"46f9e6cc7e23aaf1f3fbab9e5a90938fc4a75b4d"},c("ifx-icon",{key:"ec02f5f5103fdc301d95035bcf64ef46faea6e1c",class:"check__icon",icon:"check12"})),c("span",{key:"01c587772d3082141c23fff8733c65a3ab6a766e"},"Adheres to web standards")))),c("td",{key:"9281cd9ab2516a72edda2b05e9e0fa0babd99301"},c("ul",{key:"08ef59d7b062a110547d9220bbcd43575aff22a8"},c("li",{key:"5c5fac2ac3c9c3c78ef1f71ea273030c368e615e"},c("span",{key:"16a01e71f65616c4685fd9ae5fd967d00c53b12d"},c("ifx-icon",{key:"4b29c4b99ab8cd60922e919ea8d4aa86633d6522",class:"check__icon",icon:"check12"})),c("span",{key:"54e795e060090d48f9848349e130b28140e5ffec"},"Extended customization")),c("li",{key:"75d31c58f83acbd8dcfffc4fc39028fb8bf9ea2a"},c("span",{key:"a0acf1a47e2e1d32d7c66d8feb2924ce122f599b"},c("ifx-icon",{key:"b31dfac52b1d29cb75afd63efb15c88d263e0ead",class:"check__icon",icon:"check12"})),c("span",{key:"1cf7a8f2379e57ec53ccb4c4647db833d6d61cf5"},"Possibility for icon configuration")),c("li",{key:"fad3e7c93fdc262137704d94d4b550759cdff505"},c("span",{key:"f98f7b218fb4c5df1778f0b30199e19df766a9eb"},c("ifx-icon",{key:"d9ce4f7fca2bef9a3f4b70d26e8758a347604598",class:"check__icon",icon:"check12"})),c("span",{key:"9857c1990fde989b1389c09a5328d3c588417d09"},"React, Vue and Angular wrapper integration")))),c("td",{key:"de9d91006c346f02c568d5777190bf99c03a2a44"},c("ul",{key:"db620f65c9ff6d2525d8ee87a8c8377e78922217"},c("li",{key:"78da3a18c7a558da3d824cf31e14d79fd150ee8b"},c("span",{key:"83c5a0e51d3c56389e4ee99fcf8dac87cf55f0a0"},c("ifx-icon",{key:"9ea48dd96c5df9b80eff3f0a67d555e42d653fd1",class:"check__icon",icon:"check12"})),c("span",{key:"6bd695ba25b4c5b57a47db0e8717c2fdc1a69638"},"Form integration"))))),c("tr",{key:"a119cf3402a2ac1fdae4e6e85ae076428c30fc5d"},c("td",{key:"8f6eae73537a7bf84982b8e693f7ed2d96d3d576",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"c6dcec57e278eb7ab1e06b6ce4da75fb31432532",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-tooltip--development",size:"s",variant:"bold"},"Tooltip")),c("td",{key:"33f63a205c37c146957803cdb97acf69b97cfc0f"},c("ul",{key:"0188b3821177d2e4b6639a6ee55f2f749720b5b4"},c("li",{key:"86b9f9d62861ac1eb364b8691492f8254f029c15"},c("span",{key:"d9494669166cace0f9a80d8d12b05cb24350a4fa"},c("ifx-icon",{key:"fbd4e6329b8dd2797a79e8e10b9ce23fcea16ae8",class:"check__icon",icon:"check12"})),c("span",{key:"973d4535f4150fe91488c0a084bc726d2b6cdb2b"},"Provides a simple and informative interface for displaying supplementary text or contextual information when users interact with specific elements within a web application")),c("li",{key:"1172f32df156e6092e0b0458de9fb16b15704371"},c("span",{key:"61cfe9b401d5e4da21f4dfc77c73b3d9d439b63d"},c("ifx-icon",{key:"e05970f4c15fde733194c94d68e01c7bd87915bc",class:"check__icon",icon:"check12"})),c("span",{key:"e428fd522392030cbf20725ae59f999eced0d2cb"},"Adheres to web standards")))),c("td",{key:"75f271fef1dda4792ac2c0c206dda539149ef996"},c("ul",{key:"6549fe1caf113b89e92ec252279fbaa2ac41daf5"},c("li",{key:"9a8d503cc7865bbd5a691c11899b3cc9688add7a"},c("span",{key:"58240e5d9fe88fe6340481e6ce1668a10db2dd46"},c("ifx-icon",{key:"32b915a906b5547fde9651e633ac939643905d1d",class:"check__icon",icon:"check12"})),c("span",{key:"f10cda73b8ddf4f4389643072a1482f6f323a451"},"Compact, dismissible and Extended variants")),c("li",{key:"a86efb3c48e9b6e0417a87c9179f6a829828353f"},c("span",{key:"82ead8c3e293e4bec4db6039c4a2a39b67596ca2"},c("ifx-icon",{key:"ce5f82f66aac83fd635dc5b8b833d78cb29009f2",class:"check__icon",icon:"check12"})),c("span",{key:"c24586833955612d184ee24fb7ec4f27dfbc13cf"},"Auto-adjusting position")),c("li",{key:"591c6ec5eaea0f9df71bc8cd1491a5c6b4f81afa"},c("span",{key:"e13c907d2d9c33046d463b775200065402e72179"},c("ifx-icon",{key:"49b2d80623cbd02c2f013cf443e56b6f8287dc15",class:"check__icon",icon:"check12"})),c("span",{key:"53dc9bbd73c85e2e257e4a6c1d8a2b6d793072a7"},"Icon incorporated")),c("li",{key:"d3a17c3acdb208a3ef407edac81177b82b974a98"},c("span",{key:"3cf338365353a5ae09903e43c295cd2527425bba"},c("ifx-icon",{key:"a1f1f856e1de90dd5e6ea6a2561930cec971ea5e",class:"check__icon",icon:"check12"})),c("span",{key:"355a26140fe267420ada5d996c87b49de00e2cd2"},"React, Vue and Angular wrapper integration")))),c("td",{key:"0401a01bcaddefc8bd7b9bf0b7e26ee15ede4001"})),c("tr",{key:"5972169f45fa8d574ebed0ef7d9a9b95d0510458"},c("td",{key:"0a2123ad117bc16d87b7703fb260503a40df2fdb",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"6f6ca512442a3e6f01607f5bc6fb9bc9245d0cce",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-notification--development",size:"s",variant:"bold"},"Notification")),c("td",{key:"1c82585ce9e918830c6ee8e220694db93e4f12c3"},c("ul",{key:"30d96e208d1ae73cd5093c349c1d3d27c5f731cc"},c("li",{key:"094b574d87fd957009b4c0d478e068a4736df148"},c("span",{key:"b353bd58d236c45c6c356726c5b615d78bbf99c3"},c("ifx-icon",{key:"39b2aacbc23b054441d9a220a7bb7f53fd67670c",class:"check__icon",icon:"check12"})),c("span",{key:"01a5d64d940a73e7bbed3c659043a0f72fca5501"},"Offers a flexible and visually distinct container for presenting informative, warning, or error messages to users, enhancing the overall user experience with timely and relevant feedback")),c("li",{key:"21098b0a446309f057d435b2580033aefc32003b"},c("span",{key:"096cc0c5fb80c9ebdf4fa1c3ff22e83bfbe865b4"},c("ifx-icon",{key:"747a2a2ec76e9b227698c5c2fad4580bc5d298c7",class:"check__icon",icon:"check12"})),c("span",{key:"be577eee7e65825436b8e468ff8ada77c85932cf"},"Adheres to web standards")))),c("td",{key:"50c1ef282d5adc5eca60a5ccf4657a63d5aa1a04"}),c("td",{key:"5565c0b9cb6098e18e43a99f99b80fd8c8320531"})),c("tr",{key:"76f2c81e46580d4330ccaf94f399a36d52cbb69e"},c("td",{key:"b36f8de26135c3131da96e9fdeffc785d08c9a2c",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"83ace9cb3415c9bf0a09ea9938b42e5fc0c18b76",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-content-switcher--development",size:"s",variant:"bold"},"Content Switcher")),c("td",{key:"a92545a9b4c6a4120d2409f51db4abb0df83282f"},c("ul",{key:"02d0252d22526b15a8cf32f133e575f9fed4d3d7"},c("li",{key:"7b76fe760a142775e747c007b4d6b0e2b9827f67"},c("span",{key:"d4b01ae815ac2f0a07bb32757cb4c6d02f53a2a1"},c("ifx-icon",{key:"78e8dba3d72373ccc04c1b2cc00fd66e563117f7",class:"check__icon",icon:"check12"})),c("span",{key:"f8def2c1f50a87f84b64eb069a35642054e763c0"},"Provides a flexible and intuitive interface for dynamically switching between different content sections or views within a web application")),c("li",{key:"55e665bad6b966d94562708eaad9d1ee13cc779a"},c("span",{key:"772d9217f945500657455dc02e9ba5ea0d2cc2e1"},c("ifx-icon",{key:"68bc16b60646fa5c57a4d0a1b886c1ebdd50160b",class:"check__icon",icon:"check12"})),c("span",{key:"815a5c9b91ed177a0e1b3813a3f55917b5be2fa6"},"Offers a customizable mechanism for users to toggle and display diverse content panels, facilitating seamless navigation and interaction with varying information or functional contexts")),c("li",{key:"ed8829e7737b896af1917867e7069bd8a65aff39"},c("span",{key:"77226e2d1a1d72d73ee4fb945c4989ee7d3d796e"},c("ifx-icon",{key:"9efa54cd32791a416162b2a6e9a2a2d1c337d61f",class:"check__icon",icon:"check12"})),c("span",{key:"4184af854f0729eabfd368d19828a71e51bc1c15"},"Adheres to web standards")))),c("td",{key:"098eaa7b9e45a0a3474491fb1b884b86bd493de6"}),c("td",{key:"d1b186dc23dd538ca9c7069e91ba9e649cc6a167"})),c("tr",{key:"e3925d4cb085507dae8eb5f98179f9be8702443e"},c("td",{key:"4f68f375a839e9c3b17f98357718e62ebf1cfa93",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"cf88ae0a57a9477f21d6223bbcdb5dfac0ffbfbd",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-segmented-control--development",size:"s",variant:"bold"},"Segmented Control")),c("td",{key:"d5e14da858bedbdaaf5cd4c3f817197b6e89a9a5"},c("ul",{key:"a3584e8372611bb56b26aa9d0554d8744c235a71"},c("li",{key:"3047a815f2989c0513b9f5fe7dbb3f50776cd6c5"},c("span",{key:"2b82d5fe30c7f767b96a92d72cc10c1c56e247e7"},c("ifx-icon",{key:"77b3cdeadde1a2ecaa3cc7dc25087714d3dd13ca",class:"check__icon",icon:"check12"})),c("span",{key:"734c30936b3adf898227e1bfaaea9442ba9ac569"},"Provides a clear and interactive interface for users to make mutually exclusive selections among multiple options within a web application")),c("li",{key:"12580afae38d990bde2e48c0a0d35d453cf5ddac"},c("span",{key:"1e35cfe791ab871ffb5983789613a419dc584ad3"},c("ifx-icon",{key:"374a6bd9cd1dcaae02acfd6ebf3b5dc9e92bd246",class:"check__icon",icon:"check12"})),c("span",{key:"2bf052074c01225fd4c3aff96cde71dae4fb6bb0"},"Offers a customizable set of segmented buttons or tabs, allowing users to toggle between different choices or views, typically used for filtering, categorization, or navigation purposes")),c("li",{key:"66a110606793850d4d94c208242fc3e46f3872eb"},c("span",{key:"73ca30837a8863e06497ce8287ca80a896e0d471"},c("ifx-icon",{key:"99c4b8386259c0b9347ea582c25b02d7794ec3c8",class:"check__icon",icon:"check12"})),c("span",{key:"1f75c64fd519ed0481c261b9fef3fb8e0045f359"},"Adheres to web standards")))),c("td",{key:"5063c70f7a6bca28387147d6da92ba985ddf5077"}),c("td",{key:"3e0060e04b1772f9db6d95aea7b498c4c2b5d382"})),c("tr",{key:"1e1c126152577e14c069863b50ec7ce68a416679"},c("td",{key:"ca62208e37b4f12bfd4fefb03675e2c215d58ee6",class:"completed__component sticky-col second-col"},c("ifx-link",{key:"95c5d4b17e1377d851c195b05889fac4dc740764",target:"_blank",href:"https://infineon.github.io/infineon-design-system-stencil/?path=/docs/components-segmented-controls--development",size:"s",variant:"bold"},"Textarea")),c("td",{key:"1b3c19d40e8a494f2390c995aa565c08ab891d2b"},c("ul",{key:"67ae61302ed0052e4c4e4193516e6ab345203a23"},c("li",{key:"aa073a6beba3b5d55b12bec5fb75c0501f0c4a2a"},c("span",{key:"cffc2bbaf710dd4caedc3b841dd8be078cc1dd1e"},c("ifx-icon",{key:"6c8ab5407f90ff38029f3a5bf6c882c376b752b2",class:"check__icon",icon:"check12"})),c("span",{key:"772d6f0162849ee15ac3324893a924f43f9fb1de"},"Provides a customizable multi-line text input interface, enabling users to input, edit, and view large amounts of text, while adhering to web standards for accessibility and usability.")),c("li",{key:"b19223c7bc50fb2b27fa4f600dce099e77cddb46"},c("span",{key:"5c2ba716b173db78e236fa8ff34a35ffc6a173dd"},c("ifx-icon",{key:"ce4a9e071ae44c6203231e75bd4834a9b7f83168",class:"check__icon",icon:"check12"})),c("span",{key:"39b0b78b2e7ff971de21639aa2917de32d1080f5"},"Form integration")))),c("td",{key:"1750acd19444eb935a94bf56e0782161b48f13a2"}),c("td",{key:"7cae46e6582f6001805711b1edb00d313eff9c15"})),c("tr",{key:"760f2e15ec63465d476726ca275368f65f3b282a"},c("td",{key:"e76a3ff320a9b6cb978a16b3f756e5dcab67ecaa",class:"planned__component sticky-col second-col"},c("ifx-link",{key:"add90ec114e83d9d14016e8de7006d4ca5d2656c",href:"",size:"s",variant:"bold"},"Card Group")),c("td",{key:"0e2c650e94bd509aef74ebfb4bd68482cf053428"},c("ul",{key:"62aee4a99c30ae834d3b5f00ff61ed00fe6de4f2"},c("li",{key:"b13070c6000981574a69510c5094fd966d38e8fc",class:"planned__component-wrapper"},c("span",{key:"7eb5a3a116cbdedc4d6b95f3ff9e55242182a3db"},c("ifx-icon",{key:"c0bfbbe97c9011c797376563216b98f99721b6f2",class:"planned__icon",icon:"clock24"})),c("span",{key:"6c82d5b352e465e44d56ffe393fdc9874aa70ac9"},"On Hold")))),c("td",{key:"11f8003e8e7423fe6c236973ae732d7354926ed9"}),c("td",{key:"e2167caf12450748002c98a903dd9213e944b024"})),c("tr",{key:"7b3307bfe11bfc6813bf891e10862fd24bc31202"},c("td",{key:"fe4710b5a7f7c80e45c2336618bf6dbb28f97533",class:"planned__component sticky-col second-col"},c("ifx-link",{key:"981c465003963334ae95f4b23a4bd70e4ad2a0b8",href:"",size:"s",variant:"bold"},"Upload")),c("td",{key:"3381176cc658d1194047a184839a8f7e40455e52"},c("ul",{key:"5d201f967ce881d3e8294913152e36cb59bc2376"},c("li",{key:"f4231efa9132f45efea05f385aee78db2cca3e3d",class:"planned__component-wrapper"},c("span",{key:"1084a5ec2c28ad2c054f78366de1235d45d0ce07"},c("ifx-icon",{key:"e760ce17c1dc14744b852d419206292dafd53cd3",class:"planned__icon",icon:"roboticarm24"})),c("span",{key:"a86b01f32e700462292ac80389009b5de64013af"},"In Progress")))),c("td",{key:"11be2f7babcc93d498483248381f08b9ba188291"}),c("td",{key:"e029a3645fe117f761ff197c17e17fd21543f9d1"})),c("tr",{key:"036ba3a3ac2a6051c6e1b71c41793f0827c076fa"},c("td",{key:"97edffb7cf7bf1038a951fbe15029a4d66ee5689",class:"planned__component sticky-col second-col"},c("ifx-link",{key:"80a5b92c0d8ea1b89197151cf7cf7bbd4013b5ed",href:"",size:"s",variant:"bold"},"Tree View")),c("td",{key:"7869967bf14c13778e0f38d0043dbd75a937fc58"},c("ul",{key:"03810fba21ed570e12db322a3412212d7040d68f"},c("li",{key:"8e068ddbe72729ad06320546506c00ee376ab328",class:"planned__component-wrapper"},c("span",{key:"347a3ca0c30026935c54b4b05b54502fb3da2d70"},c("ifx-icon",{key:"eca0103d419485ede095994de52d6273f36b7d60",class:"planned__icon",icon:"roboticarm24"})),c("span",{key:"ad90875bc3489f3f5c586b5a584665a1bed81863"},"In Progress")))),c("td",{key:"1f901b12ab94e0b0bfb8a31a0c2c709b192204bd"}),c("td",{key:"5480853a5a8b9fb9bd16093c987439780e3d1f59"})),c("tr",{key:"d47765e668ce1cb73e843c615b52cf846412e0dd"},c("td",{key:"505093b9a0acb031777288a053963e61714bc5ea",class:"planned__component sticky-col second-col"},c("ifx-link",{key:"43311b673fed8ecd48e5f26fc452607ce4cf34cc",href:"",size:"s",variant:"bold"},"Popover")),c("td",{key:"6b12f20c79e9706d248300e1d47d51a9cdfd1dc9"},c("ul",{key:"138aa3572058d62943a0e3ede2cb9ef8a355b928"},c("li",{key:"b0fc370e5c2888b1a0cb98375678b5aaecdd9cdf",class:"planned__component-wrapper"},c("span",{key:"a853019dd53cab59497c12d51b5b8227427f1dc2"},c("ifx-icon",{key:"e42fa1d57090ae050a0aa978efb4a906791514f2",class:"planned__icon",icon:"roboticarm24"})),c("span",{key:"791ce1b29dee77a401cf53d060ae5f505df782eb"},"In Progress")))),c("td",{key:"8452b0fc32ff5a7c30ec16ecf56cbf2146bf32a2"}),c("td",{key:"2730a1b1cc85d98756d3267bb164d2ac4aad5857"})))))))}get el(){return a(this)}};b.style=f;export{b as ifx_overview_table};
2	+ //# sourceMappingURL=p-e5df823b.entry.js.map

package/dist/infineon-design-system-stencil/{p-3ad9c66a.entry.js → p-edc77e53.entry.js} RENAMED Viewed

@@ -1,2 +1,2 @@
-import{r as e,c as i,h as t,g as s}from"./p-e6edf72d.js";const a=':root{font-family:"Source Sans 3", sans-serif}:host{display:inline-block}.chip{position:relative}.chip__wrapper{display:inline-flex;align-items:center;justify-content:center;gap:8px;box-sizing:border-box;border:1px solid #BFBBBB;border-radius:9999px;background:#FFFFFF;cursor:pointer;transition:border 100ms ease;font:400 0.875rem/1.25rem "Source Sans 3"}.chip__wrapper:hover,.chip__wrapper:focus-visible{outline:none;border:1px solid #575352}.chip__wrapper:focus{border:1px solid #0A8276}.chip__wrapper.chip__wrapper--small{padding:4px 12px}.chip__wrapper.chip__wrapper--large{padding:8px 16px}.chip__wrapper.chip__wrapper--opened{border:1px solid #0A8276}.chip__wrapper.chip__wrapper--opened .wrapper__open-button{transform:rotate(-180deg)}.chip__wrapper.chip__wrapper--selected{outline:3px solid #0A8276;outline-offset:-3px;color:#0A8276}.chip__wrapper.chip__wrapper--selected:hover,.chip__wrapper.chip__wrapper--selected:focus-visible{outline:3px solid #08665C;color:#08665C}.wrapper__label{display:inline-flex;align-items:center;gap:4px;font:400 0.875rem/1.25rem "Source Sans 3"}.wrapper__label .label__selected-options{font:600 0.875rem/1.25rem "Source Sans 3"}.wrapper__open-button{display:flex;align-items:center;transition:all 300ms ease}.wrapper__unselect-button{display:flex;align-items:center}.chip__dropdown{position:absolute;z-index:1;box-shadow:0px 6px 9px 0px rgba(29, 29, 29, 0.1019607843);border:1px solid #EEEDED;border-radius:1px;padding:8px 0;min-width:222px;background-color:#FFFFFF}';const n=a;const l=class{constructor(t){e(this,t);this.ifxChange=i(this,"ifxChange",7);this.placeholder="";this.size="large";this.value=undefined;this.variant="single";this.readOnly=false;this.opened=false;this.selectedOptions=[]}handleValueChange(e){this.syncSelectedOptionsWithProp(e)}handleReadOnlyChange(e){if(e){this.opened=false}}closeDropdownOnOutsideClick(e){const i=e.composedPath();const t=this.chip.shadowRoot.querySelector(".chip__wrapper");const s=this.chip.shadowRoot.querySelector(".chip__dropdown");if(!i.includes(s)&&!i.includes(t)&&this.opened){this.toggleDropdownMenu()}}handleKeyDown(e){if(e.code!=="Tab"){e.preventDefault()}if(e.target.tagName==="IFX-CHIP"){this.handleWrapperKeyDown(e)}else if(e.target.tagName==="IFX-CHIP-ITEM"){this.handleDropdownKeyDown(e)}}updateSelectedOptions(e){const i=e.detail;const t=[...this.selectedOptions];if(this.variant!=="multi"){if(i.selected){this.opened=false;const t=this.getChipItems();t.forEach((i=>{if(i.selected&&i!==e.target){i.chipState=Object.assign(Object.assign({},i.chipState),{emitIfxChipItemSelect:false});i.selected=false}}));this.selectedOptions=[i]}else{this.selectedOptions=[]}this.value=this.selectedOptions[0]?this.selectedOptions[0].value:undefined}else{if(i.selected){if(!this.selectedOptions.find((e=>e.value===i.value))){this.selectedOptions=[...this.selectedOptions,i]}}else{this.selectedOptions=this.selectedOptions.filter((e=>e.value!==i.value))}this.value=this.selectedOptions.map((e=>e.value))}if(i.emitIfxChange){this.ifxChange.emit({previousSelection:t,currentSelection:this.selectedOptions,name:this.placeholder})}}getChipItems(){return this.chip.querySelectorAll("ifx-chip-item")}getSelectedOptions(){if(this.variant!=="multi"){return this.selectedOptions.map((e=>e.label)).join("")}return this.selectedOptions.slice(0,2).map((e=>e.label)).join(", ")}toggleDropdownMenu(){if(this.readOnly)return;this.opened=!this.opened}focusChipItemAt(e=0){this.opened=true;const i=this.getChipItems();let t;if(e===-1){t=i.item(i.length-1)}else if(e>=0&&e<i.length){t=i.item(e)}else{console.error(`Invalid index: ${e}`);return}const s=t.shadowRoot.querySelector(".chip-item");if(s){setTimeout((()=>{s.focus()}),1)}}focusChip(){const e=this.chip.shadowRoot.querySelector(".chip__wrapper");e.focus()}handleUnselectButtonClick(e){e.stopPropagation();this.opened=false;let i=false;const t=this.getChipItems();t.forEach((e=>{if(e.selected){i=true;e.chipState=Object.assign(Object.assign({},e.chipState),{emitIfxChipItemSelect:false});e.selected=false}}));if(i){const e=this.selectedOptions;this.selectedOptions=[];this.value=[];this.ifxChange.emit({previousSelection:e,currentSelection:[],name:this.placeholder})}}handleWrapperClick(){if(!this.readOnly){this.toggleDropdownMenu()}}handleWrapperKeyDown(e){if(this.readOnly)return;if(!this.opened){switch(e.code){case"Space":case"Enter":case"ArrowDown":this.focusChipItemAt(0);break;case"ArrowUp":this.focusChipItemAt(-1);break}}else{switch(e.code){case"Escape":this.opened=false;this.focusChip();break}}}handleDropdownKeyDown(e){let i=this.getChipItems();let t=Array.from(i).indexOf(e.target);if(t===-1){console.error("Target not found in chip items");return}switch(e.code){case"ArrowDown":if(t===i.length-1)break;this.focusChipItemAt(t+1);break;case"ArrowUp":if(t===0)break;this.focusChipItemAt(t-1);break;case"Escape":this.opened=false;this.focusChip();break;case"Space":if(this.variant==="single"){this.opened=false;this.focusChip()}break;case"Enter":this.opened=false;this.focusChip();break}}syncChipState(){const e=this.getChipItems();let i=0;e.forEach((e=>{e.chipState={emitIfxChipItemSelect:true,size:this.size==="small"?"small":"large",variant:this.variant==="multi"?"multi":"single",key:i++}}))}syncSelectedOptionsWithProp(e){this.selectedOptions=[];const i=(()=>{let e=0;return()=>e++})();if(Array.isArray(e)){this.selectedOptions=e.map((e=>({value:e,label:e,selected:true,key:i(),emitIfxChange:true})))}else if(typeof e==="string"){this.selectedOptions=[{value:e,label:e,selected:true,key:i(),emitIfxChange:true}]}this.syncChipState()}componentWillLoad(){this.syncSelectedOptionsWithProp(this.value)}render(){return t("div",{key:"e14109cde5a4d4a9ed84c98ec91f12061c870fd7",class:"chip"},t("div",{key:"c53a4141e3c632b7b191c473af84fcea0f1734c6",class:`chip__wrapper chip__wrapper--${this.size==="small"?"small":"large"}\n                  chip__wrapper--${this.variant==="multi"?"multi":"single"}\n                  ${this.opened&&!this.readOnly?"chip__wrapper--opened":""}\n                  ${this.selectedOptions.length?"chip__wrapper--selected":""}`,tabIndex:0,onClick:!this.readOnly?()=>{this.handleWrapperClick()}:undefined,role:"combobox","aria-label":this.ariaLabel,"aria-value":this.getSelectedOptions(),"aria-haspopup":!this.readOnly?"listbox":undefined,"aria-expanded":!this.readOnly?this.opened.toString():undefined,"aria-controls":!this.readOnly?"dropdown":undefined,"aria-readonly":this.readOnly?"true":undefined,"aria-multiselectable":this.variant==="multi"?"true":undefined},t("div",{key:"2dd2d3efa423414c1b2f1d4bb14439ac5f79b6e3",class:"wrapper__label"},this.selectedOptions.length===0&&`${this.placeholder}`,this.selectedOptions.length!==0&&(this.variant==="multi"||this.readOnly)&&this.placeholder!==""&&`${this.placeholder}:`,this.selectedOptions.length!==0&&t("div",{key:"fa10908eb3780826670e4d571a64803d54022d6e",class:"label__selected-options"},this.getSelectedOptions()),this.selectedOptions.length>2&&this.variant==="multi"&&t("ifx-number-indicator",{key:"7de64d7145f96027ff8de66ce394a2fb2dfbab45"},"  ",`+${this.selectedOptions.length-2}`," ")),!this.readOnly&&(this.variant!=="multi"||this.variant==="multi"&&this.selectedOptions.length===0)&&t("div",{key:"9f97e748f9b680c40883509f48ee706551f3f9e0",class:"wrapper__open-button"},t("ifx-icon",{key:1,icon:`chevrondown16`})),this.variant!=="multi"&&this.readOnly!==false&&this.selectedOptions.length>0&&t("div",{key:"92920883a4f7e377e6ea38d1ca21812ffcf5e3f2",class:"wrapper__unselect-button",onClick:e=>{this.handleUnselectButtonClick(e)}},t("ifx-icon",{key:2,icon:`cross16`})),this.selectedOptions.length>=1&&this.variant==="multi"&&t("div",{key:"bd0073d8045c8dbd1afaa0fa966f16cf478cbe9e",class:"wrapper__unselect-button",onClick:e=>{this.handleUnselectButtonClick(e)}},t("ifx-icon",{key:2,icon:`cross16`}))),this.opened&&!this.readOnly&&t("div",{key:"2fa0cb466c2f713c33e1e3985b0ec98649864487",id:"dropdown",role:"listbox",class:"chip__dropdown"},t("slot",{key:"498c6ccd6738b4538375ea5eddb08196676dd2c0"})))}get chip(){return s(this)}static get watchers(){return{value:["handleValueChange"],readOnly:["handleReadOnlyChange"]}}};l.style=n;const r=':root{font-family:"Source Sans 3", sans-serif}.chip-item{display:flex;align-items:center;gap:8px;padding:8px 16px;user-select:none;transition:all 100ms ease;transition-property:background, color}.chip-item:hover{cursor:pointer;background-color:#EEEDED}.chip-item:active{background-color:#BFBBBB}.chip-item:focus{outline:2px solid #0A8276}.chip-item.chip-item--large{font:400 1rem/1.5rem "Source Sans 3"}.chip-item.chip-item--small{font:400 0.875rem/1.25rem "Source Sans 3"}.chip-item.chip-item--selected{color:#0A8276}.chip-item.chip-item--selected .chip-item__selected-indicator{display:block}.chip-item__selected-indicator{display:none;margin-left:auto}';const c=r;const h=class{constructor(t){e(this,t);this.ifxChipItemSelect=i(this,"ifxChipItemSelect",5);this.value=undefined;this.chipState={emitIfxChipItemSelect:true,variant:"multi",size:"large"};this.selected=false}updateItemSelection(e){if(this.chipState.variant==="single"){const i=e.target;if(this.chipItem!==i&&this.chipItem.parentElement===i.parentElement){this.selected=false}}}validateSelected(e,i){if(e!==i){if(this.chipState.emitIfxChipItemSelect){this.emitIfxChipItemSelectEvent()}else{this.chipState.emitIfxChipItemSelect=true}}}getItemLabel(){return this.chipItem.innerText}toggleItemSelection(){this.selected=!this.selected}emitIfxChipItemSelectEvent(e=true){this.ifxChipItemSelect.emit({emitIfxChange:e,key:this.chipState.key,label:this.getItemLabel(),selected:this.selected,value:this.value})}handleItemClick(){this.toggleItemSelection()}handleItemKeyDown(e){if(e.code==="Enter"||e.code==="Space"){this.toggleItemSelection()}}handleSelectedState(){if(this.selected){this.emitIfxChipItemSelectEvent(false)}}componentWillLoad(){this.handleSelectedState()}render(){return t("div",{key:"7ceff18d0a41b419a188d925fd854cc97d7a9ecd",class:`chip-item chip-item--${this.chipState.size} \n                    chip-item--${(this.selected&&this.chipState.variant)==="single"?"selected":""}`,tabIndex:0,onClick:()=>{this.handleItemClick()},onKeyDown:e=>{this.handleItemKeyDown(e)},role:"option","aria-selected":this.selected.toString()},this.chipState.variant==="multi"&&t("ifx-checkbox",{key:"d2f717951d288aa0863081e54cabf7edd1c6f7e6",checked:this.selected,tabIndex:-1,size:"s"}),t("div",{key:"fff335d9009c93863012f6a4307ed4322413c4f7",class:"chip-item__label"}," ",t("slot",{key:"a093e9caf2eecba28c58674dde3f788be1f5849b"})," "),t("div",{key:"ea76c6b3d0bdd2a687acfbe323ebd9e6d6034a40",class:"chip-item__selected-indicator"},t("ifx-icon",{key:"b581de80777bbfe5a39bc393ec90af46276b7ae9",icon:`check${this.chipState.size==="small"?"12":"16"}`}," ")))}get chipItem(){return s(this)}static get watchers(){return{selected:["validateSelected"]}}};h.style=c;const o='@charset "UTF-8";:root{font-family:"Source Sans 3", sans-serif}:host{display:inline-flex}.container{display:inline-flex;justify-content:center;align-items:center;gap:32px;font-family:"Source Sans 3"}.container .items__per-page-wrapper{display:flex;align-items:center;gap:16px}.container .items__per-page-wrapper .items__per-page-label{color:#1D1D1D;font-size:14px;font-style:normal;font-weight:600;line-height:20px}.container .items__per-page-wrapper .items__per-page-field{display:flex;flex-direction:column;align-items:flex-start}.container .items__per-page-wrapper .items__per-page-field ifx-select{width:92px}.container .items__total-wrapper{display:flex;justify-content:center;align-items:center;gap:12px}.container .items__total-wrapper .items__total-button{display:flex;width:40px;height:40px;justify-content:center;align-items:center;border-radius:100px;border:1px solid #BFBBBB;background:#FFF}.container .items__total-wrapper .page__numbers-wrapper{display:flex;justify-content:center;align-items:center;gap:12px}.container .items__total-wrapper .page__numbers-wrapper .page__number-item{display:flex;padding:6px;flex-direction:column;justify-content:center;align-items:center;gap:10px;border-radius:100px}.container .items__total-wrapper .page__numbers-wrapper .page__number-item.active{background-color:#0A8276}.container .items__total-wrapper .page__numbers-wrapper .page__number-item.active span{color:#fff}.container .items__total-wrapper .page__numbers-wrapper .page__number-item:hover{cursor:pointer}.container .items__total-wrapper .page__numbers-wrapper .page__number-item:hover:not(.active){background-color:#ddd}.container .items__total-wrapper .page__numbers-wrapper .page__number-item:active:not(.active){background-color:#575352}.container .items__total-wrapper .page__numbers-wrapper .page__number-item span{display:flex;width:16px;height:16px;flex-direction:column;justify-content:center;color:#1D1D1D;text-align:center;font-size:13px;font-style:normal;font-weight:400;line-height:20px}.pagination{display:flex}.pagination ifx-icon-button:first-of-type{margin-right:12px}.pagination ifx-icon-button:last-of-type{margin-left:12px}a{padding:8px;border-radius:100px}ol{list-style-type:none;padding:0;margin:0;display:inline-flex;align-items:center;gap:12px}li{display:flex;flex-direction:column;justify-content:center;align-items:center;border-radius:100px}li:hover:not(.active) a{background-color:#EEEDED}li:active:not(.active) a{background-color:#575352;color:#fff}li.active{background-color:#0A8276}li.active a{color:#fff}li:hover{cursor:pointer}li a{text-decoration:none;display:flex;width:16px;height:16px;flex-direction:column;justify-content:center;color:#1D1D1D;text-align:center;font-size:13px;font-style:normal;font-weight:400;line-height:20px;align-items:center}.prev.disabled,.next.disabled{cursor:default}.prev.disabled:hover,.next.disabled:hover{cursor:default;text-decoration:none}.prev{margin-right:2.5px}.next{margin-left:2.5px}@media (min-width: 400px){li:first-child,li.active-sibling,li.active,li.active+li,li:last-child{display:inline-flex !important;flex-direction:row}li:first-child:nth-last-child(n+8)~li{display:none}li:first-child:nth-last-child(n+8)~li.active-sibling:before{content:"…";font-size:13px;display:inline-block;margin-right:6px}li:first-child:nth-last-child(n+8)~li.active+li:after{content:"…";font-size:13px;display:inline-block;margin-left:6px}li:first-child:nth-last-child(n+8)~li:nth-last-child(-n+5){display:inline-flex;flex-direction:row}li:first-child:nth-last-child(n+8)~li:nth-last-child(5):before{content:"…";font-size:13px;display:inline-block;margin-right:6px}li:first-child:nth-last-child(n+8)~li:nth-child(-n+2):before,li:first-child:nth-last-child(n+8)~li:nth-child(-n+2):after,li:first-child:nth-last-child(n+8)~li:nth-last-child(-n+2):before,li:first-child:nth-last-child(n+8)~li:nth-last-child(-n+2):after,li:first-child:nth-last-child(n+8)~li.active-sibling:nth-last-child(-n+4):before,li:first-child:nth-last-child(n+8)~li.active-sibling:nth-last-child(-n+4):after{display:none !important}li:first-child:nth-last-child(n+8).active~li:nth-last-child(-n+5),li:first-child:nth-last-child(n+8)~li.active~li:nth-last-child(-n+5){display:none}li:first-child:nth-last-child(n+8).active~li:nth-last-child(-n+5):before,li:first-child:nth-last-child(n+8)~li.active~li:nth-last-child(-n+5):before{display:none}li:first-child:nth-last-child(n+8).active~li:nth-child(-n+5),li:first-child:nth-last-child(n+8)~li.active~li:nth-child(-n+5){display:inline-flex !important;flex-direction:row}li:first-child:nth-last-child(n+8).active~li:nth-child(-n+4):after,li:first-child:nth-last-child(n+8)~li.active~li:nth-child(-n+4):after{display:none}li:first-child:nth-last-child(n+8).active~li:nth-child(5):after,li:first-child:nth-last-child(n+8)~li.active~li:nth-child(5):after{content:"…";font-size:13px;display:inline-block;margin-left:6px}li:first-child:nth-last-child(n+8).active:before,li:first-child:nth-last-child(n+8).active:after,li:first-child:nth-last-child(n+8)~li.active:before,li:first-child:nth-last-child(n+8)~li.active:after{display:none}}';const p=o;const d=class{constructor(t){e(this,t);this.ifxPageChange=i(this,"ifxPageChange",7);this.currentPage=1;this.internalPage=1;this.internalItemsPerPage=10;this.numberOfPages=[];this.total=1;this.filteredItemsPerPage=[];this.visiblePages=[];this.CLASS_DISABLED="disabled";this.CLASS_ACTIVE="active";this.handlePageClick=e=>{const i=e.currentTarget;const t=parseInt(i.dataset.page);if(!isNaN(t))this.changePage(t)}}setItemsPerPage(e){var i,t;const s=((i=e.detail)===null||i===void 0?void 0:i.value)||((t=e.detail)===null||t===void 0?void 0:t.label);const a=parseInt(s)||10;if(a===this.internalItemsPerPage){return}this.internalItemsPerPage=a;this.internalPage=1;this.calculateNumberOfPages();this.updateVisiblePages();this.handleEventEmission()}componentDidLoad(){this.initPagination()}updateVisiblePages(){const e=2;const i=this.numberOfPages.length;const t=this.internalPage;let s=[];if(i<=5){s=[...this.numberOfPages]}else{s.push(1);if(t>e+1)s.push("...");let a=Math.max(2,t-e);let n=Math.min(i-1,t+e);if(t<=e+1)n=e*2+1;if(t>=i-e)a=i-e*2;for(let e=a;e<=n;e++)s.push(e);if(t<i-e)s.push("...");s.push(i)}this.visiblePages=[...new Set(s)]}calculateNumberOfPages(){const e=Math.ceil(this.total/this.internalItemsPerPage);this.numberOfPages=Array.from({length:e},((e,i)=>i+1));this.internalPage=Math.max(1,Math.min(this.currentPage,e))}filterOptionsArray(){const e=typeof this.itemsPerPage==="string"?JSON.parse(this.itemsPerPage):this.itemsPerPage;this.filteredItemsPerPage=e.map((e=>Object.assign(Object.assign({},e),{label:e.label||e.value})))}componentWillLoad(){this.calculateNumberOfPages();this.filterOptionsArray();this.updateVisiblePages()}componentWillUpdate(){if(this.prevInternalPage!==this.internalPage){this.updateVisiblePages();this.prevInternalPage=this.internalPage}}componentDidUpdate(){this.initPagination()}handleEventEmission(){this.ifxPageChange.emit({currentPage:this.internalPage,totalPages:this.numberOfPages.length,itemsPerPage:this.internalItemsPerPage})}initPagination(){const e=this.el.shadowRoot.querySelector(".pagination");if(!e)return;const i=()=>{const i=e.querySelector(".prev");const t=e.querySelector(".next");if(i){i.disabled=this.internalPage===1;i.classList.toggle(this.CLASS_DISABLED,this.internalPage===1)}if(t){t.disabled=this.internalPage===this.numberOfPages.length;t.classList.toggle(this.CLASS_DISABLED,this.internalPage===this.numberOfPages.length)}};e.querySelectorAll("li").forEach((e=>{e.removeEventListener("click",this.handlePageClick);e.addEventListener("click",this.handlePageClick)}));i()}changePage(e){e=Math.max(1,Math.min(e,this.numberOfPages.length));if(e===this.internalPage)return;this.internalPage=e;this.handleEventEmission();this.initPagination()}render(){return t("div",{key:"f698a31b53410da1c2e13fcf96b86369033c4342",class:"container"},t("div",{key:"71542655e2e76337e866c2266ca32fd56fa041af",class:"items__per-page-wrapper"},t("div",{key:"b71fc0a3945051dfa321fe56bdf74424d0f4032e",class:"items__per-page-label"},"Results per Page"),t("div",{key:"75afae25208d194f1f8ebcc9b0f462115ccb21ba",class:"items__per-page-field"},t("ifx-select",{key:"21524346259b19f24ab3daef379acecd519cfd28",placeholder:"false","show-search":"false",value:undefined,disabled:false,error:false,size:"s",options:this.filteredItemsPerPage,"placeholder-value":"Select"}))),t("div",{key:"076eb08f4117de8b8fca19c809778e247b4dae18",class:"items__total-wrapper"},t("div",{key:"0e13cab91e2dcbc84643a405ae34fdbe6c5ae35b",class:"pagination"},t("ifx-icon-button",{key:"1e898b6189eac137ea9e420d4a5982afcfb35cac",class:"prev",icon:"arrow-left-24",onClick:()=>this.changePage(this.internalPage-1)}),t("ol",{key:"c336abf1b7d28c83f9b0176468da44f36b902daf"},this.visiblePages.map(((e,i)=>typeof e==="number"?t("li",{key:`page-${e}`,class:{[this.CLASS_ACTIVE]:e===this.internalPage},"data-page":e},t("a",{href:"javascript:void(0)"},e)):t("li",{class:"ellipsis",key:`ellipsis-${i}`},t("span",null,"..."))))),t("ifx-icon-button",{key:"7e8ad73143c1b4c2c5ccd9cfc60a2549291467b8",class:"next",icon:"arrow-right-24",onClick:()=>this.changePage(this.internalPage+1)}))))}get el(){return s(this)}};d.style=p;export{l as ifx_chip,h as ifx_chip_item,d as ifx_pagination};
-//# sourceMappingURL=p-3ad9c66a.entry.js.map
+import{r as e,c as i,h as t,g as s}from"./p-e6edf72d.js";const a=':root{font-family:"Source Sans 3", sans-serif}:host{display:inline-block}.chip{position:relative}.chip__wrapper{display:inline-flex;align-items:center;justify-content:center;gap:8px;box-sizing:border-box;border:1px solid #BFBBBB;border-radius:9999px;background:#FFFFFF;cursor:pointer;transition:border 100ms ease;font:400 0.875rem/1.25rem "Source Sans 3"}.chip__wrapper:hover,.chip__wrapper:focus-visible{outline:none;border:1px solid #575352}.chip__wrapper:focus{border:1px solid #0A8276}.chip__wrapper.chip__wrapper--small{padding:4px 12px}.chip__wrapper.chip__wrapper--large{padding:8px 16px}.chip__wrapper.chip__wrapper--opened{border:1px solid #0A8276}.chip__wrapper.chip__wrapper--opened .wrapper__open-button{transform:rotate(-180deg)}.chip__wrapper.chip__wrapper--selected{outline:3px solid #0A8276;outline-offset:-3px;color:#0A8276}.chip__wrapper.chip__wrapper--selected:hover,.chip__wrapper.chip__wrapper--selected:focus-visible{outline:3px solid #08665C;color:#08665C}.wrapper__label{display:inline-flex;align-items:center;gap:4px;font:400 0.875rem/1.25rem "Source Sans 3"}.wrapper__label .label__selected-options{font:600 0.875rem/1.25rem "Source Sans 3"}.wrapper__open-button{display:flex;align-items:center;transition:all 300ms ease}.wrapper__unselect-button{display:flex;align-items:center}.chip__dropdown{position:absolute;z-index:1;box-shadow:0px 6px 9px 0px rgba(29, 29, 29, 0.1019607843);border:1px solid #EEEDED;border-radius:1px;padding:8px 0;min-width:222px;background-color:#FFFFFF}';const n=a;const l=class{constructor(t){e(this,t);this.ifxChange=i(this,"ifxChange",7);this.placeholder="";this.size="large";this.value=undefined;this.variant="single";this.readOnly=false;this.opened=false;this.selectedOptions=[]}handleValueChange(e){this.syncSelectedOptionsWithProp(e)}handleReadOnlyChange(e){if(e){this.opened=false}}closeDropdownOnOutsideClick(e){const i=e.composedPath();const t=this.chip.shadowRoot.querySelector(".chip__wrapper");const s=this.chip.shadowRoot.querySelector(".chip__dropdown");if(!i.includes(s)&&!i.includes(t)&&this.opened){this.toggleDropdownMenu()}}handleKeyDown(e){if(e.code!=="Tab"){e.preventDefault()}if(e.target.tagName==="IFX-CHIP"){this.handleWrapperKeyDown(e)}else if(e.target.tagName==="IFX-CHIP-ITEM"){this.handleDropdownKeyDown(e)}}updateSelectedOptions(e){const i=e.detail;const t=[...this.selectedOptions];if(this.variant!=="multi"){if(i.selected){this.opened=false;const t=this.getChipItems();t.forEach((i=>{if(i.selected&&i!==e.target){i.chipState=Object.assign(Object.assign({},i.chipState),{emitIfxChipItemSelect:false});i.selected=false}}));this.selectedOptions=[i]}else{this.selectedOptions=[]}this.value=this.selectedOptions[0]?this.selectedOptions[0].value:undefined}else{if(i.selected){if(!this.selectedOptions.find((e=>e.value===i.value))){this.selectedOptions=[...this.selectedOptions,i]}}else{this.selectedOptions=this.selectedOptions.filter((e=>e.value!==i.value))}this.value=this.selectedOptions.map((e=>e.value))}if(i.emitIfxChange){this.ifxChange.emit({previousSelection:t,currentSelection:this.selectedOptions,name:this.placeholder})}}getChipItems(){return this.chip.querySelectorAll("ifx-chip-item")}getSelectedOptions(){if(this.variant!=="multi"){return this.selectedOptions.map((e=>e.label)).join("")}return this.selectedOptions.slice(0,2).map((e=>e.label)).join(", ")}toggleDropdownMenu(){if(this.readOnly)return;this.opened=!this.opened}focusChipItemAt(e=0){this.opened=true;const i=this.getChipItems();let t;if(e===-1){t=i.item(i.length-1)}else if(e>=0&&e<i.length){t=i.item(e)}else{console.error(`Invalid index: ${e}`);return}const s=t.shadowRoot.querySelector(".chip-item");if(s){setTimeout((()=>{s.focus()}),1)}}focusChip(){const e=this.chip.shadowRoot.querySelector(".chip__wrapper");e.focus()}handleUnselectButtonClick(e){e.stopPropagation();this.opened=false;let i=false;const t=this.getChipItems();t.forEach((e=>{if(e.selected){i=true;e.chipState=Object.assign(Object.assign({},e.chipState),{emitIfxChipItemSelect:false});e.selected=false}}));if(i){const e=this.selectedOptions;this.selectedOptions=[];this.value=[];this.ifxChange.emit({previousSelection:e,currentSelection:[],name:this.placeholder})}}handleWrapperClick(){if(!this.readOnly){this.toggleDropdownMenu()}}handleWrapperKeyDown(e){if(this.readOnly)return;if(!this.opened){switch(e.code){case"Space":case"Enter":case"ArrowDown":this.focusChipItemAt(0);break;case"ArrowUp":this.focusChipItemAt(-1);break}}else{switch(e.code){case"Escape":this.opened=false;this.focusChip();break}}}handleDropdownKeyDown(e){let i=this.getChipItems();let t=Array.from(i).indexOf(e.target);if(t===-1){console.error("Target not found in chip items");return}switch(e.code){case"ArrowDown":if(t===i.length-1)break;this.focusChipItemAt(t+1);break;case"ArrowUp":if(t===0)break;this.focusChipItemAt(t-1);break;case"Escape":this.opened=false;this.focusChip();break;case"Space":if(this.variant==="single"){this.opened=false;this.focusChip()}break;case"Enter":this.opened=false;this.focusChip();break}}syncChipState(){const e=this.getChipItems();let i=0;e.forEach((e=>{e.chipState={emitIfxChipItemSelect:true,size:this.size==="small"?"small":"large",variant:this.variant==="multi"?"multi":"single",key:i++}}))}syncSelectedOptionsWithProp(e){this.selectedOptions=[];const i=(()=>{let e=0;return()=>e++})();if(Array.isArray(e)){this.selectedOptions=e.map((e=>({value:e,label:e,selected:true,key:i(),emitIfxChange:true})))}else if(typeof e==="string"){this.selectedOptions=[{value:e,label:e,selected:true,key:i(),emitIfxChange:true}]}this.syncChipState()}componentWillLoad(){this.syncSelectedOptionsWithProp(this.value)}render(){return t("div",{key:"e14109cde5a4d4a9ed84c98ec91f12061c870fd7",class:"chip"},t("div",{key:"c53a4141e3c632b7b191c473af84fcea0f1734c6",class:`chip__wrapper chip__wrapper--${this.size==="small"?"small":"large"}\n                  chip__wrapper--${this.variant==="multi"?"multi":"single"}\n                  ${this.opened&&!this.readOnly?"chip__wrapper--opened":""}\n                  ${this.selectedOptions.length?"chip__wrapper--selected":""}`,tabIndex:0,onClick:!this.readOnly?()=>{this.handleWrapperClick()}:undefined,role:"combobox","aria-label":this.ariaLabel,"aria-value":this.getSelectedOptions(),"aria-haspopup":!this.readOnly?"listbox":undefined,"aria-expanded":!this.readOnly?this.opened.toString():undefined,"aria-controls":!this.readOnly?"dropdown":undefined,"aria-readonly":this.readOnly?"true":undefined,"aria-multiselectable":this.variant==="multi"?"true":undefined},t("div",{key:"2dd2d3efa423414c1b2f1d4bb14439ac5f79b6e3",class:"wrapper__label"},this.selectedOptions.length===0&&`${this.placeholder}`,this.selectedOptions.length!==0&&(this.variant==="multi"||this.readOnly)&&this.placeholder!==""&&`${this.placeholder}:`,this.selectedOptions.length!==0&&t("div",{key:"fa10908eb3780826670e4d571a64803d54022d6e",class:"label__selected-options"},this.getSelectedOptions()),this.selectedOptions.length>2&&this.variant==="multi"&&t("ifx-number-indicator",{key:"7de64d7145f96027ff8de66ce394a2fb2dfbab45"},"  ",`+${this.selectedOptions.length-2}`," ")),!this.readOnly&&(this.variant!=="multi"||this.variant==="multi"&&this.selectedOptions.length===0)&&t("div",{key:"9f97e748f9b680c40883509f48ee706551f3f9e0",class:"wrapper__open-button"},t("ifx-icon",{key:1,icon:`chevrondown16`})),this.variant!=="multi"&&this.readOnly!==false&&this.selectedOptions.length>0&&t("div",{key:"92920883a4f7e377e6ea38d1ca21812ffcf5e3f2",class:"wrapper__unselect-button",onClick:e=>{this.handleUnselectButtonClick(e)}},t("ifx-icon",{key:2,icon:`cross16`})),this.selectedOptions.length>=1&&this.variant==="multi"&&t("div",{key:"bd0073d8045c8dbd1afaa0fa966f16cf478cbe9e",class:"wrapper__unselect-button",onClick:e=>{this.handleUnselectButtonClick(e)}},t("ifx-icon",{key:2,icon:`cross16`}))),this.opened&&!this.readOnly&&t("div",{key:"2fa0cb466c2f713c33e1e3985b0ec98649864487",id:"dropdown",role:"listbox",class:"chip__dropdown"},t("slot",{key:"498c6ccd6738b4538375ea5eddb08196676dd2c0"})))}get chip(){return s(this)}static get watchers(){return{value:["handleValueChange"],readOnly:["handleReadOnlyChange"]}}};l.style=n;const r=':root{font-family:"Source Sans 3", sans-serif}.chip-item{display:flex;align-items:center;gap:8px;padding:8px 16px;user-select:none;transition:all 100ms ease;transition-property:background, color}.chip-item:hover{cursor:pointer;background-color:#EEEDED}.chip-item:active{background-color:#BFBBBB}.chip-item:focus{outline:2px solid #0A8276}.chip-item.chip-item--large{font:400 1rem/1.5rem "Source Sans 3"}.chip-item.chip-item--small{font:400 0.875rem/1.25rem "Source Sans 3"}.chip-item.chip-item--selected{color:#0A8276}.chip-item.chip-item--selected .chip-item__selected-indicator{display:block}.chip-item__selected-indicator{display:none;margin-left:auto}';const c=r;const h=class{constructor(t){e(this,t);this.ifxChipItemSelect=i(this,"ifxChipItemSelect",5);this.value=undefined;this.chipState={emitIfxChipItemSelect:true,variant:"multi",size:"large"};this.selected=false}updateItemSelection(e){if(this.chipState.variant==="single"){const i=e.target;if(this.chipItem!==i&&this.chipItem.parentElement===i.parentElement){this.selected=false}}}validateSelected(e,i){if(e!==i){if(this.chipState.emitIfxChipItemSelect){this.emitIfxChipItemSelectEvent()}else{this.chipState.emitIfxChipItemSelect=true}}}getItemLabel(){return this.chipItem.innerText}toggleItemSelection(){this.selected=!this.selected}emitIfxChipItemSelectEvent(e=true){this.ifxChipItemSelect.emit({emitIfxChange:e,key:this.chipState.key,label:this.getItemLabel(),selected:this.selected,value:this.value})}handleItemClick(){this.toggleItemSelection()}handleItemKeyDown(e){if(e.code==="Enter"||e.code==="Space"){this.toggleItemSelection()}}handleSelectedState(){if(this.selected){this.emitIfxChipItemSelectEvent(false)}}componentWillLoad(){this.handleSelectedState()}render(){return t("div",{key:"7ceff18d0a41b419a188d925fd854cc97d7a9ecd",class:`chip-item chip-item--${this.chipState.size} \n                    chip-item--${(this.selected&&this.chipState.variant)==="single"?"selected":""}`,tabIndex:0,onClick:()=>{this.handleItemClick()},onKeyDown:e=>{this.handleItemKeyDown(e)},role:"option","aria-selected":this.selected.toString()},this.chipState.variant==="multi"&&t("ifx-checkbox",{key:"d2f717951d288aa0863081e54cabf7edd1c6f7e6",checked:this.selected,tabIndex:-1,size:"s"}),t("div",{key:"fff335d9009c93863012f6a4307ed4322413c4f7",class:"chip-item__label"}," ",t("slot",{key:"a093e9caf2eecba28c58674dde3f788be1f5849b"})," "),t("div",{key:"ea76c6b3d0bdd2a687acfbe323ebd9e6d6034a40",class:"chip-item__selected-indicator"},t("ifx-icon",{key:"b581de80777bbfe5a39bc393ec90af46276b7ae9",icon:`check${this.chipState.size==="small"?"12":"16"}`}," ")))}get chipItem(){return s(this)}static get watchers(){return{selected:["validateSelected"]}}};h.style=c;const o='@charset "UTF-8";:root{font-family:"Source Sans 3", sans-serif}:host{display:inline-flex}.container{display:inline-flex;justify-content:center;align-items:center;gap:32px;font-family:"Source Sans 3"}.container .items__per-page-wrapper{display:flex;align-items:center;gap:16px}.container .items__per-page-wrapper .items__per-page-label{color:#1D1D1D;font-size:14px;font-style:normal;font-weight:600;line-height:20px}.container .items__per-page-wrapper .items__per-page-field{display:flex;flex-direction:column;align-items:flex-start}.container .items__per-page-wrapper .items__per-page-field ifx-select{width:92px}.container .items__total-wrapper{display:flex;justify-content:center;align-items:center;gap:12px}.container .items__total-wrapper .items__total-button{display:flex;width:40px;height:40px;justify-content:center;align-items:center;border-radius:100px;border:1px solid #BFBBBB;background:#FFF}.container .items__total-wrapper .page__numbers-wrapper{display:flex;justify-content:center;align-items:center;gap:12px}.container .items__total-wrapper .page__numbers-wrapper .page__number-item{display:flex;padding:6px;flex-direction:column;justify-content:center;align-items:center;gap:10px;border-radius:100px}.container .items__total-wrapper .page__numbers-wrapper .page__number-item.active{background-color:#0A8276}.container .items__total-wrapper .page__numbers-wrapper .page__number-item.active span{color:#fff}.container .items__total-wrapper .page__numbers-wrapper .page__number-item:hover{cursor:pointer}.container .items__total-wrapper .page__numbers-wrapper .page__number-item:hover:not(.active){background-color:#ddd}.container .items__total-wrapper .page__numbers-wrapper .page__number-item:active:not(.active){background-color:#575352}.container .items__total-wrapper .page__numbers-wrapper .page__number-item span{display:flex;width:16px;height:16px;flex-direction:column;justify-content:center;color:#1D1D1D;text-align:center;font-size:13px;font-style:normal;font-weight:400;line-height:20px}.pagination{display:flex}.pagination ifx-icon-button:first-of-type{margin-right:12px}.pagination ifx-icon-button:last-of-type{margin-left:12px}a{padding:8px;border-radius:100px}ol{list-style-type:none;padding:0;margin:0;display:inline-flex;align-items:center;gap:12px}li{display:flex;flex-direction:column;justify-content:center;align-items:center;border-radius:100px}li:hover:not(.active) a{background-color:#EEEDED}li:active:not(.active) a{background-color:#575352;color:#fff}li.active{background-color:#0A8276}li.active a{color:#fff}li:hover{cursor:pointer}li a{text-decoration:none;display:flex;width:16px;height:16px;flex-direction:column;justify-content:center;color:#1D1D1D;text-align:center;font-size:13px;font-style:normal;font-weight:400;line-height:20px;align-items:center}.prev.disabled,.next.disabled{cursor:default}.prev.disabled:hover,.next.disabled:hover{cursor:default;text-decoration:none}.prev{margin-right:2.5px}.next{margin-left:2.5px}@media (min-width: 400px){li:first-child,li.active-sibling,li.active,li.active+li,li:last-child{display:inline-flex !important;flex-direction:row}li:first-child:nth-last-child(n+8)~li{display:none}li:first-child:nth-last-child(n+8)~li.active-sibling:before{content:"…";font-size:13px;display:inline-block;margin-right:6px}li:first-child:nth-last-child(n+8)~li.active+li:after{content:"…";font-size:13px;display:inline-block;margin-left:6px}li:first-child:nth-last-child(n+8)~li:nth-last-child(-n+5){display:inline-flex;flex-direction:row}li:first-child:nth-last-child(n+8)~li:nth-last-child(5):before{content:"…";font-size:13px;display:inline-block;margin-right:6px}li:first-child:nth-last-child(n+8)~li:nth-child(-n+2):before,li:first-child:nth-last-child(n+8)~li:nth-child(-n+2):after,li:first-child:nth-last-child(n+8)~li:nth-last-child(-n+2):before,li:first-child:nth-last-child(n+8)~li:nth-last-child(-n+2):after,li:first-child:nth-last-child(n+8)~li.active-sibling:nth-last-child(-n+4):before,li:first-child:nth-last-child(n+8)~li.active-sibling:nth-last-child(-n+4):after{display:none !important}li:first-child:nth-last-child(n+8).active~li:nth-last-child(-n+5),li:first-child:nth-last-child(n+8)~li.active~li:nth-last-child(-n+5){display:none}li:first-child:nth-last-child(n+8).active~li:nth-last-child(-n+5):before,li:first-child:nth-last-child(n+8)~li.active~li:nth-last-child(-n+5):before{display:none}li:first-child:nth-last-child(n+8).active~li:nth-child(-n+5),li:first-child:nth-last-child(n+8)~li.active~li:nth-child(-n+5){display:inline-flex !important;flex-direction:row}li:first-child:nth-last-child(n+8).active~li:nth-child(-n+4):after,li:first-child:nth-last-child(n+8)~li.active~li:nth-child(-n+4):after{display:none}li:first-child:nth-last-child(n+8).active~li:nth-child(5):after,li:first-child:nth-last-child(n+8)~li.active~li:nth-child(5):after{content:"…";font-size:13px;display:inline-block;margin-left:6px}li:first-child:nth-last-child(n+8).active:before,li:first-child:nth-last-child(n+8).active:after,li:first-child:nth-last-child(n+8)~li.active:before,li:first-child:nth-last-child(n+8)~li.active:after{display:none}}';const p=o;const d=class{constructor(t){e(this,t);this.ifxPageChange=i(this,"ifxPageChange",7);this.currentPage=1;this.internalPage=1;this.internalItemsPerPage=10;this.numberOfPages=[];this.total=1;this.filteredItemsPerPage=[];this.visiblePages=[];this.CLASS_DISABLED="disabled";this.CLASS_ACTIVE="active";this.handlePageClick=e=>{const i=e.currentTarget;const t=parseInt(i.dataset.page);if(!isNaN(t))this.changePage(t)}}setItemsPerPage(e){var i,t;const s=((i=e.detail)===null||i===void 0?void 0:i.value)||((t=e.detail)===null||t===void 0?void 0:t.label);const a=parseInt(s)||10;if(a===this.internalItemsPerPage){return}this.internalItemsPerPage=a;this.internalPage=1;this.calculateNumberOfPages();this.updateVisiblePages();this.handleEventEmission()}componentDidLoad(){this.initPagination()}updateVisiblePages(){const e=2;const i=this.numberOfPages.length;const t=this.internalPage;let s=[];if(i<=5){s=[...this.numberOfPages]}else{s.push(1);if(t>e+1)s.push("...");let a=Math.max(2,t-e);let n=Math.min(i-1,t+e);if(t<=e+1)n=e*2+1;if(t>=i-e)a=i-e*2;for(let e=a;e<=n;e++)s.push(e);if(t<i-e)s.push("...");s.push(i)}this.visiblePages=[...new Set(s)]}calculateNumberOfPages(){const e=Math.ceil(this.total/this.internalItemsPerPage);this.numberOfPages=Array.from({length:e},((e,i)=>i+1));this.internalPage=Math.max(1,Math.min(this.currentPage,e))}filterOptionsArray(){const e=typeof this.itemsPerPage==="string"?JSON.parse(this.itemsPerPage):this.itemsPerPage;this.filteredItemsPerPage=e.map((e=>Object.assign(Object.assign({},e),{label:e.label||e.value})))}componentWillLoad(){this.calculateNumberOfPages();this.filterOptionsArray();this.updateVisiblePages()}componentWillUpdate(){if(this.prevInternalPage!==this.internalPage){this.updateVisiblePages();this.prevInternalPage=this.internalPage}}componentDidUpdate(){this.initPagination()}handleEventEmission(){this.ifxPageChange.emit({currentPage:this.internalPage,totalPages:this.numberOfPages.length,itemsPerPage:this.internalItemsPerPage})}initPagination(){const e=this.el.shadowRoot.querySelector(".pagination");if(!e)return;const i=()=>{const i=e.querySelector(".prev");const t=e.querySelector(".next");if(i){i.disabled=this.internalPage===1;i.classList.toggle(this.CLASS_DISABLED,this.internalPage===1)}if(t){t.disabled=this.internalPage===this.numberOfPages.length;t.classList.toggle(this.CLASS_DISABLED,this.internalPage===this.numberOfPages.length)}};e.querySelectorAll("li").forEach((e=>{e.removeEventListener("click",this.handlePageClick);e.addEventListener("click",this.handlePageClick)}));i()}changePage(e){e=Math.max(1,Math.min(e,this.numberOfPages.length));if(e===this.internalPage)return;this.internalPage=e;this.handleEventEmission();this.initPagination()}render(){return t("div",{key:"2db22cea600f9d93a048dbfa6748f6c0a12aa5f5",class:"container"},t("div",{key:"33a7bf4cc2178bd8777264177411ba19cf944a78",class:"items__per-page-wrapper"},t("div",{key:"9d6bcb6005180b6cd06c6b619317283d047b2f68",class:"items__per-page-label"},"Results per Page"),t("div",{key:"d468243b87792d9543481022c7a4f0c5b3fdd805",class:"items__per-page-field"},t("ifx-select",{key:"48b87e0a1dbfcff4b9468b134f0f3a609c7b2aca",placeholder:"false","show-search":"false",value:undefined,disabled:false,error:false,size:"s",options:this.filteredItemsPerPage,"placeholder-value":"Select"}))),t("div",{key:"11c0559524ac4239d4239e97088c7b8f7dee813e",class:"items__total-wrapper"},t("div",{key:"a0c52f73524aec6c33b4af18010e8783e1cea524",class:"pagination"},t("ifx-icon-button",{key:"40a755dce92de2dd8d14846bcf2269a0e74ff6db",class:"prev",icon:"arrow-left-24",onClick:()=>this.changePage(this.internalPage-1)}),t("ol",{key:"24cd5cb3dfc5b33d809099efd1b979c24e19d676"},this.visiblePages.map(((e,i)=>typeof e==="number"?t("li",{key:`page-${e}`,class:{[this.CLASS_ACTIVE]:e===this.internalPage},"data-page":e},t("a",{href:"javascript:void(0)"},e)):t("li",{class:"ellipsis",key:`ellipsis-${i}`},t("span",null,"..."))))),t("ifx-icon-button",{key:"4c8276b66ff84a6280543066c48e6eb88310de83",class:"next",icon:"arrow-right-24",onClick:()=>this.changePage(this.internalPage+1)}))))}get el(){return s(this)}};d.style=p;export{l as ifx_chip,h as ifx_chip_item,d as ifx_pagination};
+//# sourceMappingURL=p-edc77e53.entry.js.map

package/dist/infineon-design-system-stencil/{p-f5bc6488.entry.js → p-f22dad77.entry.js} RENAMED Viewed

@@ -1,2 +1,2 @@
-import{r as t,h as n,a as o,g as e}from"./p-e6edf72d.js";import{c as i}from"./p-5cdc6210.js";const r=':host{display:inline-flex}.btn{box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:8px;gap:8px;color:#FFFFFF;flex-direction:row;font-weight:600;border-radius:1px;line-height:1.5rem;outline:none;font-family:"Source Sans 3";text-decoration:none;user-select:none;border:1px solid rgba(0, 0, 0, 0);font-size:1rem;transition:color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out}.btn:not(.disabled){cursor:pointer}.btn-primary{color:#FFFFFF;background-color:#0A8276}.btn-primary:disabled,.btn-primary.disabled{background-color:#BFBBBB;color:#FFFFFF;pointer-events:none}.btn-secondary{color:#0A8276;background-color:#FFFFFF;border-color:#0A8276}.btn-secondary:disabled,.btn-secondary.disabled{background-color:#FFFFFF;border:1px solid #BFBBBB;color:#BFBBBB;pointer-events:none}.btn-tertiary{background-color:transparent;color:#1D1D1D}.btn-tertiary:disabled,.btn-tertiary.disabled{color:#BFBBBB;pointer-events:none}.btn.icon-button{min-width:initial;min-height:initial;width:40px;height:40px;padding:0;justify-content:center}.btn.icon-button.btn-round{border-radius:100px}.btn.icon-button.btn-square{border-radius:1px}.btn.icon-button.btn-s{width:32px;height:32px;padding:8px}.btn.icon-button.btn-l{width:48px;height:48px;padding:8px}.btn.btn-primary:not(:disabled,.disabled):focus:not(:active,.active){outline:none;box-shadow:0 0 0 2px #FFFFFF, 0 0 0 4px #0A8276}.btn.btn-primary:not(:disabled,.disabled):hover{background-color:#08665C;border-color:#08665C}.btn.btn-primary:not(:disabled,.disabled):active,.btn.btn-primary:not(:disabled,.disabled).active{background-color:#06534B;border-color:#06534B}.btn.btn-secondary:not(:disabled,.disabled):focus:not(:active,.active){outline:none;box-shadow:0 0 0 2px #FFFFFF, 0 0 0 4px #0A8276}.btn.btn-secondary:not(:disabled,.disabled):hover{background-color:#08665C;border-color:#08665C;color:#FFFFFF}.btn.btn-secondary:not(:disabled,.disabled):active,.btn.btn-secondary:not(:disabled,.disabled).active{background-color:#06534B;border-color:#06534B}.btn.btn-tertiary:not(:disabled,.disabled):focus:not(:active,.active){outline:none;color:#1D1D1D;box-shadow:0 0 0 0px #FFFFFF, 0 0 0 2px #0A8276}.btn.btn-tertiary:not(:disabled,.disabled):hover{color:#0A8276}.btn.btn-tertiary:not(:disabled,.disabled):active,.btn.btn-tertiary:not(:disabled,.disabled).active{color:#08665C}';const s=r;const a=class{constructor(n){t(this,n);this.target="_self";this.shape="round"}handleClick(t){if(this.disabled){t.stopImmediatePropagation()}}async setFocus(){this.focusableElement.focus()}componentWillLoad(){if(this.shape===""){this.shape="round"}}render(){return n(o,{key:"8547f0042ef683c1b29057e849f500fb35c14a9c","aria-disabled":this.disabled,"aria-label":this.ariaLabel},this.href?n("a",{ref:t=>this.focusableElement=t,class:this.getClassNames(),href:!this.disabled?this.href:undefined,target:this.target,rel:this.target==="_blank"?"noopener noreferrer":undefined},n("ifx-icon",{icon:this.icon})):n("button",{class:this.getClassNames(),type:"button",disabled:this.disabled},n("ifx-icon",{icon:this.icon})))}getVariantClass(){return`${this.variant}`==="secondary"?`secondary`:`${this.variant}`==="tertiary"?`tertiary`:`primary`}getSizeClass(){if(`${this.size}`==="xs"){return"xs"}else if(`${this.size}`==="s"){return"s"}else if(`${this.size}`==="l"){return"l"}else return""}getClassNames(){return i("btn icon-button",`btn-${this.shape}`,this.size&&`btn-${this.getSizeClass()}`,`btn-${this.getVariantClass()}`,this.disabled?"disabled":"")}get el(){return e(this)}};a.style=s;export{a as ifx_icon_button};
-//# sourceMappingURL=p-f5bc6488.entry.js.map
+import{r as t,h as n,a as o,g as e}from"./p-e6edf72d.js";import{c as i}from"./p-5cdc6210.js";const r=':host{display:inline-flex}.btn{box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:8px;gap:8px;color:#FFFFFF;flex-direction:row;font-weight:600;border-radius:1px;line-height:1.5rem;outline:none;font-family:"Source Sans 3";text-decoration:none;user-select:none;border:1px solid rgba(0, 0, 0, 0);font-size:1rem;transition:color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out}.btn:not(.disabled){cursor:pointer}.btn-primary{color:#FFFFFF;background-color:#0A8276}.btn-primary:disabled,.btn-primary.disabled{background-color:#BFBBBB;color:#FFFFFF;pointer-events:none}.btn-secondary{color:#0A8276;background-color:#FFFFFF;border-color:#0A8276}.btn-secondary:disabled,.btn-secondary.disabled{background-color:#FFFFFF;border:1px solid #BFBBBB;color:#BFBBBB;pointer-events:none}.btn-tertiary{background-color:transparent;color:#1D1D1D}.btn-tertiary:disabled,.btn-tertiary.disabled{color:#BFBBBB;pointer-events:none}.btn.icon-button{min-width:initial;min-height:initial;width:40px;height:40px;padding:0;justify-content:center}.btn.icon-button.btn-round{border-radius:100px}.btn.icon-button.btn-square{border-radius:1px}.btn.icon-button.btn-s{width:32px;height:32px;padding:8px}.btn.icon-button.btn-l{width:48px;height:48px;padding:8px}.btn.btn-primary:not(:disabled,.disabled):focus:not(:active,.active){outline:none;box-shadow:0 0 0 2px #FFFFFF, 0 0 0 4px #0A8276}.btn.btn-primary:not(:disabled,.disabled):hover{background-color:#08665C;border-color:#08665C}.btn.btn-primary:not(:disabled,.disabled):active,.btn.btn-primary:not(:disabled,.disabled).active{background-color:#06534B;border-color:#06534B}.btn.btn-secondary:not(:disabled,.disabled):focus:not(:active,.active){outline:none;box-shadow:0 0 0 2px #FFFFFF, 0 0 0 4px #0A8276}.btn.btn-secondary:not(:disabled,.disabled):hover{background-color:#08665C;border-color:#08665C;color:#FFFFFF}.btn.btn-secondary:not(:disabled,.disabled):active,.btn.btn-secondary:not(:disabled,.disabled).active{background-color:#06534B;border-color:#06534B}.btn.btn-tertiary:not(:disabled,.disabled):focus:not(:active,.active){outline:none;color:#1D1D1D;box-shadow:0 0 0 0px #FFFFFF, 0 0 0 2px #0A8276}.btn.btn-tertiary:not(:disabled,.disabled):hover{color:#0A8276}.btn.btn-tertiary:not(:disabled,.disabled):active,.btn.btn-tertiary:not(:disabled,.disabled).active{color:#08665C}';const s=r;const a=class{constructor(n){t(this,n);this.target="_self";this.shape="round"}handleClick(t){if(this.disabled){t.stopImmediatePropagation()}}async setFocus(){this.focusableElement.focus()}componentWillLoad(){if(this.shape===""){this.shape="round"}}render(){return n(o,{key:"76ee6d778296f5334121e83a5a15a15025c3dd13","aria-disabled":this.disabled,"aria-label":this.ariaLabel},this.href?n("a",{ref:t=>this.focusableElement=t,class:this.getClassNames(),href:!this.disabled?this.href:undefined,target:this.target,rel:this.target==="_blank"?"noopener noreferrer":undefined},n("ifx-icon",{icon:this.icon})):n("button",{class:this.getClassNames(),type:"button",disabled:this.disabled},n("ifx-icon",{icon:this.icon})))}getVariantClass(){return`${this.variant}`==="secondary"?`secondary`:`${this.variant}`==="tertiary"?`tertiary`:`primary`}getSizeClass(){if(`${this.size}`==="xs"){return"xs"}else if(`${this.size}`==="s"){return"s"}else if(`${this.size}`==="l"){return"l"}else return""}getClassNames(){return i("btn icon-button",`btn-${this.shape}`,this.size&&`btn-${this.getSizeClass()}`,`btn-${this.getVariantClass()}`,this.disabled?"disabled":"")}get el(){return e(this)}};a.style=s;export{a as ifx_icon_button};
+//# sourceMappingURL=p-f22dad77.entry.js.map

package/dist/infineon-design-system-stencil/{p-db9bdd7d.entry.js → p-f4866ad9.entry.js} RENAMED Viewed

@@ -1,2 +1,2 @@
-import{r as e,c as t,h as o,g as i}from"./p-e6edf72d.js";const s=':root{font-family:"Source Sans 3", sans-serif}.dropdown-item{text-decoration:none;color:#1D1D1D;display:flex;align-items:center;padding:8px 16px;gap:8px;font-family:"Source Sans 3"}.dropdown-item.hide{display:none}.dropdown-item span{color:#1D1D1D;font-size:16px;font-style:normal;font-weight:400;line-height:24px;}.dropdown-item.small span{font-size:14px}.dropdown-item:hover{cursor:pointer;background-color:#EEEDED}.dropdown-item:active{background-color:#BFBBBB}.icon{margin-right:4px}';const n=s;const d=class{constructor(o){e(this,o);this.ifxDropdownItem=t(this,"ifxDropdownItem",7);this.href="";this.target="_self";this.hide=false;this.size="l"}handleMenuSize(e){this.size=e.detail}handleEventEmission(){this.ifxDropdownItem.emit(this.el.textContent)}render(){let e=this.href?{href:this.href,target:this.target}:{};return o("a",Object.assign({key:"5ec61a932268bd6bc279546d2718347deec616f7"},e,{onClick:()=>this.handleEventEmission(),class:`dropdown-item ${this.size==="s"?"small":""} ${this.hide?"hide":""}`}),this.icon&&o("ifx-icon",{key:"f8644bd37348ec718f54657faaf912d48b2b696d",class:"icon",icon:this.icon}),o("span",{key:"c3643953f6fcf084a3d033df50b79bc8de562640"},o("slot",{key:"624c93095768745e9af06b60f7a7f5fcdbe0d05e"})))}get el(){return i(this)}};d.style=n;export{d as ifx_dropdown_item};
-//# sourceMappingURL=p-db9bdd7d.entry.js.map
+import{r as e,c as t,h as o,g as i}from"./p-e6edf72d.js";const s=':root{font-family:"Source Sans 3", sans-serif}.dropdown-item{text-decoration:none;color:#1D1D1D;display:flex;align-items:center;padding:8px 16px;gap:8px;font-family:"Source Sans 3"}.dropdown-item.hide{display:none}.dropdown-item span{color:#1D1D1D;font-size:16px;font-style:normal;font-weight:400;line-height:24px;}.dropdown-item.small span{font-size:14px}.dropdown-item:hover{cursor:pointer;background-color:#EEEDED}.dropdown-item:active{background-color:#BFBBBB}.icon{margin-right:4px}';const n=s;const d=class{constructor(o){e(this,o);this.ifxDropdownItem=t(this,"ifxDropdownItem",7);this.href="";this.target="_self";this.hide=false;this.size="l"}handleMenuSize(e){this.size=e.detail}handleEventEmission(){this.ifxDropdownItem.emit(this.el.textContent)}render(){let e=this.href?{href:this.href,target:this.target}:{};return o("a",Object.assign({key:"7308bd850dbc2dff472b8c045d166730bcec0af3"},e,{onClick:()=>this.handleEventEmission(),class:`dropdown-item ${this.size==="s"?"small":""} ${this.hide?"hide":""}`}),this.icon&&o("ifx-icon",{key:"575dad93fe45d15c155e812eaed3f922a0137c18",class:"icon",icon:this.icon}),o("span",{key:"93497cc96543367e73f5dcb48f17c54156b71546"},o("slot",{key:"1a2011575806ff7250d51bd72edacabbb64e075c"})))}get el(){return i(this)}};d.style=n;export{d as ifx_dropdown_item};
+//# sourceMappingURL=p-f4866ad9.entry.js.map

package/dist/infineon-design-system-stencil/{p-685f1e5d.entry.js → p-fdad4729.entry.js} RENAMED Viewed

@@ -1,2 +1,2 @@
-import{r as e,c as s,h as i}from"./p-e6edf72d.js";import{c as r}from"./p-5cdc6210.js";const t=':root{font-family:"Source Sans 3", sans-serif}:host{display:flex}.search-field{box-sizing:border-box;background-color:#FFFFFF;width:100%;font-family:"Source Sans 3"}.search-field .search-field__wrapper{box-sizing:border-box;height:40px;display:flex;align-items:center;border:1px solid #8D8786;border-radius:1px;padding:8px 16px;gap:12px;flex:none;order:0;align-self:stretch;flex-grow:0;position:relative;width:100%;outline:none;color:#8D8786}.search-field .search-field__wrapper.focused{border:1px solid #0A8276}.search-field .search-field__wrapper.focused ifx-icon{color:#575352}.search-field .search-field__wrapper.search-field__wrapper-s{height:36px}.search-field .search-field__wrapper:hover:not(.focused,:focus){border:1px solid #3C3A39}.search-field .search-field__wrapper:focus{outline:none;border:1px solid #0A8276}.search-field .search-field__wrapper .delete-icon{right:12px;cursor:pointer}.search-field .search-field__wrapper input[type=text]{font-style:normal;font-weight:400;font-size:16px;color:#8D8786;border:none;width:100%;outline:none;height:16px}.search-field .search-field__wrapper input[type=text]:focus{outline:none;color:#1d1d1d}.search-field .search-field__wrapper input[type=text]:disabled{background-color:#EEEDED}.search-field .search-field__wrapper:has(input[disabled]){background-color:#EEEDED}';const a=t;const h=class{constructor(i){e(this,i);this.ifxInput=s(this,"ifxInput",7);this.value="";this.insideDropdown=false;this.showDeleteIcon=false;this.showDeleteIconInternalState=false;this.disabled=false;this.size="l";this.isFocused=false;this.placeholder="Search...";this.autocomplete="on";this.maxlength=null;this.handleInput=()=>{const e=this.inputElement.value;this.value=e;this.ifxInput.emit(this.value)};this.handleDelete=()=>{this.inputElement.value="";this.value="";this.ifxInput.emit(this.value)}}handleOutsideClick(e){const s=e.composedPath();if(!s.includes(this.inputElement)){this.isFocused=false}}valueWatcher(e){if(e!==this.inputElement.value){this.inputElement.value=e}}focusInput(){this.inputElement.focus();this.isFocused=true}componentWillUpdate(){if(this.value!==""){this.showDeleteIconInternalState=true}else this.showDeleteIconInternalState=false}render(){return i("div",{key:"3e0e6d6a5488e87de12e20f4db82457923e48832","aria-label":"a search field for user input","aria-disabled":this.disabled,"aria-value":this.value,class:"search-field"},i("div",{key:"2703ba47c7cf088baa3fec9260f08a94ba6f5010",class:this.getWrapperClassNames(),tabindex:1,onFocus:()=>this.focusInput(),onClick:()=>this.focusInput()},i("ifx-icon",{key:"2330ded6b0dce2861a0103cf8ba449dd9d270bb2",icon:"search-16",class:"search-icon"}),i("input",{key:"e5a37f1b246f2a8e488b979aaca1e6c0dcd9b442",ref:e=>this.inputElement=e,type:"text",autocomplete:this.autocomplete,onInput:()=>this.handleInput(),placeholder:this.placeholder,disabled:this.disabled,maxlength:this.maxlength,value:this.value}),this.showDeleteIcon&&this.showDeleteIconInternalState?i("ifx-icon",{icon:"cremove16",class:"delete-icon",onClick:this.handleDelete}):null))}getSizeClass(){return`${this.size}`==="s"?"search-field__wrapper-s":""}getWrapperClassNames(){return r(`search-field__wrapper`,`search-field__wrapper ${this.getSizeClass()}`,`${this.isFocused?"focused":""}`)}static get watchers(){return{value:["valueWatcher"]}}};h.style=a;export{h as ifx_search_field};
-//# sourceMappingURL=p-685f1e5d.entry.js.map
+import{r as e,c as s,h as i}from"./p-e6edf72d.js";import{c as r}from"./p-5cdc6210.js";const t=':root{font-family:"Source Sans 3", sans-serif}:host{display:flex}.search-field{box-sizing:border-box;background-color:#FFFFFF;width:100%;font-family:"Source Sans 3"}.search-field .search-field__wrapper{box-sizing:border-box;height:40px;display:flex;align-items:center;border:1px solid #8D8786;border-radius:1px;padding:8px 16px;gap:12px;flex:none;order:0;align-self:stretch;flex-grow:0;position:relative;width:100%;outline:none;color:#8D8786}.search-field .search-field__wrapper.focused{border:1px solid #0A8276}.search-field .search-field__wrapper.focused ifx-icon{color:#575352}.search-field .search-field__wrapper.search-field__wrapper-s{height:36px}.search-field .search-field__wrapper:hover:not(.focused,:focus){border:1px solid #3C3A39}.search-field .search-field__wrapper:focus{outline:none;border:1px solid #0A8276}.search-field .search-field__wrapper .delete-icon{right:12px;cursor:pointer}.search-field .search-field__wrapper input[type=text]{font-style:normal;font-weight:400;font-size:16px;color:#8D8786;border:none;width:100%;outline:none;height:16px}.search-field .search-field__wrapper input[type=text]:focus{outline:none;color:#1d1d1d}.search-field .search-field__wrapper input[type=text]:disabled{background-color:#EEEDED}.search-field .search-field__wrapper:has(input[disabled]){background-color:#EEEDED}';const a=t;const h=class{constructor(i){e(this,i);this.ifxInput=s(this,"ifxInput",7);this.value="";this.insideDropdown=false;this.showDeleteIcon=false;this.showDeleteIconInternalState=false;this.disabled=false;this.size="l";this.isFocused=false;this.placeholder="Search...";this.autocomplete="on";this.maxlength=null;this.handleInput=()=>{const e=this.inputElement.value;this.value=e;this.ifxInput.emit(this.value)};this.handleDelete=()=>{this.inputElement.value="";this.value="";this.ifxInput.emit(this.value)}}handleOutsideClick(e){const s=e.composedPath();if(!s.includes(this.inputElement)){this.isFocused=false}}valueWatcher(e){if(e!==this.inputElement.value){this.inputElement.value=e}}focusInput(){this.inputElement.focus();this.isFocused=true}componentWillUpdate(){if(this.value!==""){this.showDeleteIconInternalState=true}else this.showDeleteIconInternalState=false}render(){return i("div",{key:"ab26f0cfe5f6ac53e721556b8c5541da19fb1795","aria-label":"a search field for user input","aria-disabled":this.disabled,"aria-value":this.value,class:"search-field"},i("div",{key:"36c3dd4d8c104c5ff50468e2af722e2a3518b014",class:this.getWrapperClassNames(),tabindex:1,onFocus:()=>this.focusInput(),onClick:()=>this.focusInput()},i("ifx-icon",{key:"5c39c1ef5966879ec8943500acf2eed059048f4f",icon:"search-16",class:"search-icon"}),i("input",{key:"0d960e2d3f9724583337d772fc0d941e05df1449",ref:e=>this.inputElement=e,type:"text",autocomplete:this.autocomplete,onInput:()=>this.handleInput(),placeholder:this.placeholder,disabled:this.disabled,maxlength:this.maxlength,value:this.value}),this.showDeleteIcon&&this.showDeleteIconInternalState?i("ifx-icon",{icon:"cremove16",class:"delete-icon",onClick:this.handleDelete}):null))}getSizeClass(){return`${this.size}`==="s"?"search-field__wrapper-s":""}getWrapperClassNames(){return r(`search-field__wrapper`,`search-field__wrapper ${this.getSizeClass()}`,`${this.isFocused?"focused":""}`)}static get watchers(){return{value:["valueWatcher"]}}};h.style=a;export{h as ifx_search_field};
+//# sourceMappingURL=p-fdad4729.entry.js.map

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@infineon/infineon-design-system-stencil",
-  "version": "33.4.1--canary.1855.83055532e24827965eebebc371d8d9f314f098a7.0",
+  "version": "33.4.1--canary.1855.420b7862d699aa915f9b73ca7df50510dc35789a.0",
   "private": false,
   "description": "Infineon design system Stencil web components",
   "homepage": "https://infineon.github.io/infineon-design-system-stencil",

package/dist/infineon-design-system-stencil/p-0bb8aad7.entry.js DELETED Viewed

	@@ -1,2 +0,0 @@
1	- import{r as s,h as c}from"./p-e6edf72d.js";const n="";const o=n;const t=class{constructor(c){s(this,c);this.tokens="css"}render(){const s={css:"css-variables.css",scss:"scss-variables.scss"};const n=`infineon-tokens.${this.tokens}`;const o=s[this.tokens];const t=`https://raw.githubusercontent.com/Infineon/public-assets/main/ifx-tokens/${o}`;return c("ifx-link",{key:"5e9bc1ea1239ccbe37d695b8252081c77915da3b",onClick:s=>{s.preventDefault();fetch(t).then((s=>s.blob())).then((s=>{const c=document.createElement("a");c.href=URL.createObjectURL(s);c.download=n;c.click()}))},href:t,download:n,class:"download__wrapper",size:"m",variant:"bold"},c("slot",{key:"659d2b21259f9772e81835072f9059d876dee794"}))}};t.style=o;export{t as ifx_download};
2	- //# sourceMappingURL=p-0bb8aad7.entry.js.map

package/dist/infineon-design-system-stencil/p-1599e9f6.entry.js DELETED Viewed

	@@ -1,2 +0,0 @@
1	- import{r,h as o}from"./p-e6edf72d.js";const s=".dropdown-separator{height:1px;background-color:#EEEDED;margin:8px 16px}";const a=s;const d=class{constructor(o){r(this,o)}render(){return o("div",{key:"4909b1b593f932f2a9492f06f699731c69d6dc0a",class:"dropdown-separator"})}};d.style=a;export{d as ifx_dropdown_separator};
2	- //# sourceMappingURL=p-1599e9f6.entry.js.map

package/dist/infineon-design-system-stencil/p-78039fa0.entry.js DELETED Viewed

	@@ -1,2 +0,0 @@
1	- import{r as e,h as t,g as r}from"./p-e6edf72d.js";const s=':root{font-family:"Source Sans 3", sans-serif}:host{position:relative}.sidebar__title{width:100%;height:fit-content;border-top:1px solid #EEEDED;padding:12px 0}.sidebar__title.no-top-border{border-top:none}.sidebar__title-label{height:20px;font:600 0.875rem/1.25rem "Source Sans 3";text-transform:uppercase;color:#575352;letter-spacing:3px}';const d=s;const o=class{constructor(t){e(this,t)}render(){return t("div",{key:"2f7ed24fa3db2ae8535dd7ebd38898bfd0f03010",class:"sidebar__title"},t("div",{key:"8d2f70f31e9ddf00cdf89d6493eeac8d820c0891",class:"sidebar__title-label"},t("slot",{key:"79d58912b427b633394363a5858e4848c8cbffd6"})))}get el(){return r(this)}};o.style=d;export{o as ifx_sidebar_title};
2	- //# sourceMappingURL=p-78039fa0.entry.js.map

package/dist/infineon-design-system-stencil/p-86d63cdc.entry.js DELETED Viewed

	@@ -1,2 +0,0 @@
1	- import{r as e,c as t,h as i,g as r}from"./p-e6edf72d.js";const a='.date__picker-container{display:flex;flex-direction:column}.date__picker-container .label__wrapper{color:#1D1D1D;font:400 1rem/1.5rem "Source Sans 3"}.date__picker-container.disabled .label__wrapper{color:#575352}.date__picker-container.error .caption__wrapper{color:#CD002F}.date__picker-container.disabled .caption__wrapper{color:#575352}.date__picker-container .caption__wrapper{margin-top:4px;color:#1D1D1D;font:400 0.75rem/1rem "Source Sans 3"}.date__picker-input{font-family:"Source Sans 3";outline:none;width:100%;cursor:pointer;border-radius:1px;border:1px solid #8D8786;height:100%}.date__picker-input.firefox__classes{padding:8px 16px;color:#8D8786;font-size:16px;text-transform:uppercase;font-style:normal;font-weight:400;line-height:24px;cursor:pointer}.date__picker-input:focus:not(.error,.success){border-color:#0A8276}.date__picker-input:hover:not(:disabled,:focus,.error,.success){border-color:#575352}.date__picker-input:disabled{border-color:#575352;background-color:#EEEDED}.date__picker-input.error{border-color:#CD002F}.date__picker-input.success:not(.error){border-color:#4CA460}.date__picker-input::-webkit-datetime-edit-text{color:#8D8786;font-size:16px;font-style:normal;font-weight:400;line-height:24px}.date__picker-input.has-value::-webkit-datetime-edit-text{color:#1D1D1D}.date__picker-input.has-value::-webkit-datetime-edit{color:#1D1D1D}::-webkit-datetime-edit{color:#8D8786;font-size:16px;text-transform:uppercase;font-style:normal;font-weight:400;line-height:24px}::-webkit-datetime-edit-fields-wrapper{padding:8px 16px;padding-bottom:9px;transform:translateY(1px)}::-webkit-inner-spin-button{display:none}::-webkit-calendar-picker-indicator{position:absolute;right:15px;font-size:19px;cursor:pointer;border-radius:1px}::-webkit-calendar-picker-indicator:focus-within{outline:2px solid #0A8276;outline-offset:2px}.input__wrapper{display:flex;justify-content:space-between;align-items:center;align-self:stretch;background:#FFFFFF;position:relative}.input__wrapper.large{height:40px}.input__wrapper.small{height:36px}.input__wrapper.disabled .icon__wrapper{background-color:#EEEDED}.icon__wrapper{position:absolute;right:17px;padding:2px;display:flex;justify-content:flex-end;align-items:center;pointer-events:none;z-index:100;background-color:#FFFFFF;line-height:16px}.icon__wrapper ifx-icon{vertical-align:middle}';const o=a;const s=class{constructor(i){e(this,i);this.ifxDate=t(this,"ifxDate",7);if(i.$hostElement$["s-ei"]){this.internals=i.$hostElement$["s-ei"]}else{this.internals=i.$hostElement$.attachInternals();i.$hostElement$["s-ei"]=this.internals}this.inputId=`ifx-date-picker-${++n}`;this.size="s";this.error=false;this.success=false;this.disabled=false;this.type="date";this.required=false;this.autocomplete="on"}getDate(e){const t=e.target.value;const i=new Date(t);const r=i.getDate();const a=i.getMonth()+1;const o=i.getFullYear();if(!t){this.internals.setFormValue(null);if(this.type==="datetime-local"){const e=i.getHours();const t=i.getMinutes();this.ifxDate.emit({day:r,month:a,year:o,hours:e,minutes:t})}else{this.ifxDate.emit({day:r,month:a,year:o})}return}const s=this.el.shadowRoot.querySelector(".date__picker-input");s.classList.add("has-value");this.internals.setFormValue(i.toISOString().substring(0,10));if(this.type==="datetime-local"){const e=i.getHours();const t=i.getMinutes();this.ifxDate.emit({day:r,month:a,year:o,hours:e,minutes:t})}else{this.ifxDate.emit({day:r,month:a,year:o})}}handleInputFocusOnIconClick(){const e=this.el.shadowRoot.querySelector(".date__picker-input");if(e){e.focus()}}getBrowser(){if(navigator.userAgent.indexOf("Chrome")!=-1){return"Chrome"}else if(navigator.userAgent.indexOf("Opera")!=-1){return"Opera"}else if(navigator.userAgent.indexOf("MSIE")!=-1){return"IE"}else if(navigator.userAgent.indexOf("Firefox")!=-1){return"Firefox"}else{return"unknown"}}setFireFoxClasses(){const e=this.getBrowser();const t=this.el.shadowRoot.querySelector(".date__picker-input");if(e==="Firefox"){t.classList.add("firefox__classes")}else if(t.classList.contains("firefox__classes")){t.classList.remove("firefox__classes")}}componentDidLoad(){this.setFireFoxClasses()}componentWillUpdate(){if(this.value){this.getDate({target:{value:this.value}})}}formResetCallback(){this.internals.setFormValue(null)}render(){var e,t;return i("div",{key:"4fd623e58f74d41cc7871b4971b4bd3806f310b2",class:`date__picker-container ${this.error?"error":""} ${this.disabled?"disabled":""}`},i("label",{key:"75f325296e0733fbe2021718b580ed1049248ffa",class:"label__wrapper",htmlFor:this.inputId},(e=this.label)===null\|\|e===void 0?void 0:e.trim()),i("div",{key:"43e52b2156387303230889497077157e656b768b",class:`input__wrapper ${this.size==="l"?"large":"small"} ${this.disabled?"disabled":""}`},i("input",{key:"71640d09119dabe2e7ea1b7ccb0fc8ac390ac6ab",type:this.type,autocomplete:this.autocomplete,class:`date__picker-input ${this.error?"error":""} ${this.success?"success":""}`,disabled:this.disabled?true:undefined,"aria-invalid":this.error?true:undefined,"aria-label":this.ariaLabel,max:this.max,min:this.min,value:this.value,required:this.required,onChange:e=>this.getDate(e)}),i("div",{key:"0d4a5b12c0a5d291fc3c5ccba6573e747cbb3c01",class:"icon__wrapper",role:"button",onClick:()=>this.handleInputFocusOnIconClick()},i("ifx-icon",{key:"e245293baf0bddd3cd7fda93f74ab3296f99f997",icon:"calendar16","aria-hidden":"true"}))),((t=this.caption)===null\|\|t===void 0?void 0:t.trim())&&i("div",{key:"01f85fda0e038619a806eca7a04ca778a656f87b",class:"caption__wrapper"},this.caption.trim()))}static get formAssociated(){return true}get el(){return r(this)}};let n=0;s.style=o;export{s as ifx_date_picker};
2	- //# sourceMappingURL=p-86d63cdc.entry.js.map

package/dist/infineon-design-system-stencil/p-86d63cdc.entry.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"names":["datePickerCss","IfxDatePickerStyle0","DatePicker","constructor","hostRef","this","inputId","datePickerId","size","error","success","disabled","type","required","autocomplete","getDate","e","inputValue","target","value","selectedDate","Date","day","month","getMonth","year","getFullYear","internals","setFormValue","hours","getHours","minutes","getMinutes","ifxDate","emit","input","el","shadowRoot","querySelector","classList","add","toISOString","substring","handleInputFocusOnIconClick","focus","getBrowser","navigator","userAgent","indexOf","setFireFoxClasses","browser","contains","remove","componentDidLoad","componentWillUpdate","formResetCallback","render","h","key","class","htmlFor","_a","label","trim","undefined","ariaLabel","max","min","onChange","role","onClick","icon","_b","caption"],"sources":["src/components/date-picker/date-picker.scss?tag=ifx-date-picker&encapsulation=shadow","src/components/date-picker/date-picker.tsx"],"sourcesContent":["@use '~@infineon/design-system-tokens/dist/tokens';\n\n.date__picker-container {\n display: flex;\n flex-direction: column;\n\n & .label__wrapper {\n color: tokens.$ifxColorBaseBlack;\n font: tokens.$ifxBodyBody03;\n }\n\n &.disabled {\n .label__wrapper {\n color: tokens.$ifxColorEngineering500;\n }\n }\n\n &.error {\n .caption__wrapper {\n color: tokens.$ifxColorRed500;\n }\n }\n\n &.disabled {\n .caption__wrapper {\n color: tokens.$ifxColorEngineering500;\n }\n }\n\n & .caption__wrapper {\n margin-top: tokens.$ifxSpace50;\n color: tokens.$ifxColorBaseBlack;\n font: tokens.$ifxBodyBody05;\n }\n}\n\n.date__picker-input {\n font-family: 'Source Sans 3';\n outline: none;\n width: 100%;\n cursor: pointer;\n border-radius: 1px;\n border: 1px solid tokens.$ifxColorEngineering400;\n height: 100%;\n\n &.firefox__classes {\n padding: 8px 16px;\n color: tokens.$ifxColorEngineering400;\n font-size: 16px;\n text-transform: uppercase;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n cursor: pointer;\n }\n\n &:focus:not(.error, .success) {\n border-color: tokens.$ifxColorOcean500;\n }\n\n &:hover:not(:disabled, :focus, .error, .success) {\n border-color: tokens.$ifxColorEngineering500;\n }\n\n &:disabled {\n border-color: tokens.$ifxColorEngineering500;\n background-color: tokens.$ifxColorEngineering200;\n }\n\n &.error {\n border-color: tokens.$ifxColorRed500;\n }\n\n &.success:not(.error) {\n border-color: tokens.$ifxColorGreen500;\n }\n\n &::-webkit-datetime-edit-text {\n color: tokens.$ifxColorEngineering400;\n font-size: 16px;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n }\n\n &.has-value::-webkit-datetime-edit-text {\n color: tokens.$ifxColorBaseBlack;\n }\n\n &.has-value::-webkit-datetime-edit {\n color: tokens.$ifxColorBaseBlack;\n }\n}\n\n::-webkit-datetime-edit {\n color: tokens.$ifxColorEngineering400;\n font-size: 16px;\n text-transform: uppercase;\n font-style: normal;\n font-weight: 400;\n line-height: 24px;\n}\n\n::-webkit-datetime-edit-fields-wrapper {\n padding: 8px 16px;\n padding-bottom: 9px;\n transform: translateY(1px);\n}\n\n::-webkit-inner-spin-button {\n display: none;\n}\n\n::-webkit-calendar-picker-indicator {\n position: absolute;\n right: 15px;\n font-size: 19px;\n cursor: pointer;\n border-radius: 1px;\n &:focus-within {\n outline: 2px solid tokens.$ifxColorOcean500;\n outline-offset: 2px;\n }\n}\n\n.input__wrapper {\n display: flex;\n justify-content: space-between;\n align-items: center;\n align-self: stretch;\n background: tokens.$ifxColorBaseWhite;\n position: relative;\n &.large {\n height: 40px;\n }\n\n &.small {\n height: 36px;\n }\n\n &.disabled {\n & .icon__wrapper {\n background-color: tokens.$ifxColorEngineering200;\n }\n }\n}\n\n.icon__wrapper {\n position: absolute;\n right: 17px;\n padding: 2px;\n display: flex;\n justify-content: flex-end;\n align-items: center;\n pointer-events: none;\n z-index: 100;\n background-color: tokens.$ifxColorBaseWhite;\n line-height: 16px;\n\n & ifx-icon {\n vertical-align: middle;\n }\n}\n","import { AttachInternals } from '@stencil/core';\nimport { Component, Prop, h, Element, Event, EventEmitter } from '@stencil/core';\n \n\n@Component({\n tag: 'ifx-date-picker',\n styleUrl: 'date-picker.scss',\n shadow: true,\n formAssociated: true,\n})\n\nexport class DatePicker {\n private inputId: string = `ifx-date-picker-${++datePickerId}`;\n\n @Element() el: HTMLElement;\n @Prop() size: string = 's';\n @Prop() error: boolean = false;\n @Prop() success: boolean = false;\n @Prop() disabled: boolean = false;\n @Prop() ariaLabel: string | null;\n @Prop() value: string;\n @Prop() type: string = 'date'\n @Prop() max: string;\n @Prop() min: string;\n @Prop() required: boolean = false;\n @Prop() label: string;\n @Prop() caption: string;\n @Prop() autocomplete: string = 'on';\n\n @AttachInternals() internals: ElementInternals;\n\n @Event() ifxDate: EventEmitter;\n\n getDate(e) { \n const inputValue = e.target.value;\n const selectedDate = new Date(inputValue);\n const day = selectedDate.getDate();\n const month = selectedDate.getMonth() + 1; \n const year = selectedDate.getFullYear();\n\n \n \n if (!inputValue) {\n this.internals.setFormValue(null);\n\n if(this.type === 'datetime-local') { \n const hours = selectedDate.getHours();\n const minutes = selectedDate.getMinutes();\n this.ifxDate.emit({day, month, year, hours, minutes});\n } else { \n this.ifxDate.emit({day, month, year});\n }\n return;\n }\n\n const input = this.el.shadowRoot.querySelector('.date__picker-input') as HTMLInputElement;\n input.classList.add('has-value');\n\n this.internals.setFormValue(selectedDate.toISOString().substring(0,10))\n if(this.type === 'datetime-local') { \n const hours = selectedDate.getHours();\n const minutes = selectedDate.getMinutes();\n this.ifxDate.emit({day, month, year, hours, minutes});\n } else { \n this.ifxDate.emit({day, month, year})\n }\n }\n\n handleInputFocusOnIconClick() { \n const input = this.el.shadowRoot.querySelector('.date__picker-input') as HTMLInputElement;\n if(input) { \n input.focus()\n }\n }\n\n getBrowser() {\n if( navigator.userAgent.indexOf(\"Chrome\") != -1 ) {\n return \"Chrome\";\n } else if( navigator.userAgent.indexOf(\"Opera\") != -1 ) {\n return \"Opera\";\n } else if( navigator.userAgent.indexOf(\"MSIE\") != -1 ) {\n return \"IE\";\n } else if( navigator.userAgent.indexOf(\"Firefox\") != -1 ) {\n return \"Firefox\";\n } else {\n return \"unknown\";\n }\n }\n\n setFireFoxClasses() { \n const browser = this.getBrowser()\n const input = this.el.shadowRoot.querySelector('.date__picker-input');\n\n if(browser === 'Firefox') { \n input.classList.add('firefox__classes')\n } else if(input.classList.contains('firefox__classes')) { \n input.classList.remove('firefox__classes')\n }\n }\n\n componentDidLoad() { \n this.setFireFoxClasses()\n }\n\n componentWillUpdate() { \n if (this.value) {\n this.getDate({ target: { value: this.value } });\n }\n }\n\n formResetCallback() {\n this.internals.setFormValue(null);\n }\n\n render() {\n return (\n <div class={`date__picker-container ${this.error ? 'error' : ''} ${this.disabled ? 'disabled': ''}`}>\n\n <label class='label__wrapper' htmlFor={ this.inputId }>\n { this.label?.trim() }\n </label>\n\n <div class={`input__wrapper ${this.size === 'l' ? 'large' : 'small'} ${this.disabled ? 'disabled' : ''}`}>\n <input\n type={this.type}\n autocomplete={this.autocomplete}\n class={`date__picker-input ${this.error ? 'error' : \"\"} ${this.success ? \"success\" : \"\"}`}\n disabled={this.disabled ? true : undefined}\n aria-invalid={this.error ? true : undefined}\n aria-label={this.ariaLabel}\n max={this.max}\n min={this.min}\n value={this.value}\n required={this.required}\n onChange={(e) => this.getDate(e)} />\n <div class=\"icon__wrapper\" role=\"button\" onClick={() => this.handleInputFocusOnIconClick()}>\n <ifx-icon icon='calendar16' aria-hidden=\"true\"></ifx-icon>\n </div>\n </div>\n\n { this.caption?.trim() && (\n <div class='caption__wrapper'>\n { this.caption.trim() }\n </div> \n )}\n </div>\n )\n }\n}\n\nlet datePickerId = 0;"],"mappings":"yDAAA,MAAMA,EAAgB,6yEACtB,MAAAC,EAAeD,E,MCUFE,EAAU,MAPvB,WAAAC,CAAAC,G,2MAQUC,KAAAC,QAAkB,qBAAqBC,IAGvCF,KAAAG,KAAe,IACfH,KAAAI,MAAiB,MACjBJ,KAAAK,QAAmB,MACnBL,KAAAM,SAAoB,MAGpBN,KAAAO,KAAe,OAGfP,KAAAQ,SAAoB,MAGpBR,KAAAS,aAAuB,I,CAM/B,OAAAC,CAAQC,GACN,MAAMC,EAAaD,EAAEE,OAAOC,MAC5B,MAAMC,EAAe,IAAIC,KAAKJ,GAC9B,MAAMK,EAAMF,EAAaL,UACzB,MAAMQ,EAAQH,EAAaI,WAAa,EACxC,MAAMC,EAAOL,EAAaM,cAI1B,IAAKT,EAAY,CACfZ,KAAKsB,UAAUC,aAAa,MAE5B,GAAGvB,KAAKO,OAAS,iBAAkB,CACjC,MAAMiB,EAAQT,EAAaU,WAC3B,MAAMC,EAAUX,EAAaY,aAC7B3B,KAAK4B,QAAQC,KAAK,CAACZ,MAAKC,QAAOE,OAAMI,QAAOE,W,KACvC,CACL1B,KAAK4B,QAAQC,KAAK,CAACZ,MAAKC,QAAOE,Q,CAEjC,M,CAGF,MAAMU,EAAQ9B,KAAK+B,GAAGC,WAAWC,cAAc,uBAC/CH,EAAMI,UAAUC,IAAI,aAEpBnC,KAAKsB,UAAUC,aAAaR,EAAaqB,cAAcC,UAAU,EAAE,KACnE,GAAGrC,KAAKO,OAAS,iBAAkB,CACjC,MAAMiB,EAAQT,EAAaU,WAC3B,MAAMC,EAAUX,EAAaY,aAC7B3B,KAAK4B,QAAQC,KAAK,CAACZ,MAAKC,QAAOE,OAAMI,QAAOE,W,KACvC,CACL1B,KAAK4B,QAAQC,KAAK,CAACZ,MAAKC,QAAOE,Q,EAInC,2BAAAkB,GACE,MAAMR,EAAQ9B,KAAK+B,GAAGC,WAAWC,cAAc,uBAC/C,GAAGH,EAAO,CACRA,EAAMS,O,EAIX,UAAAC,GACG,GAAIC,UAAUC,UAAUC,QAAQ,YAAc,EAAI,CAChD,MAAO,Q,MACF,GAAIF,UAAUC,UAAUC,QAAQ,WAAa,EAAI,CACtD,MAAO,O,MACF,GAAIF,UAAUC,UAAUC,QAAQ,UAAY,EAAI,CACrD,MAAO,I,MACF,GAAIF,UAAUC,UAAUC,QAAQ,aAAe,EAAI,CACxD,MAAO,S,KACF,CACL,MAAO,S,EAIX,iBAAAC,GACE,MAAMC,EAAU7C,KAAKwC,aACrB,MAAMV,EAAQ9B,KAAK+B,GAAGC,WAAWC,cAAc,uBAE/C,GAAGY,IAAY,UAAW,CACxBf,EAAMI,UAAUC,IAAI,mB,MACf,GAAGL,EAAMI,UAAUY,SAAS,oBAAqB,CACtDhB,EAAMI,UAAUa,OAAO,mB,EAI3B,gBAAAC,GACEhD,KAAK4C,mB,CAGP,mBAAAK,GACE,GAAIjD,KAAKc,MAAO,CACdd,KAAKU,QAAQ,CAAEG,OAAQ,CAAEC,MAAOd,KAAKc,Q,EAIzC,iBAAAoC,GACElD,KAAKsB,UAAUC,aAAa,K,CAG9B,MAAA4B,G,QACE,OACEC,EAAA,OAAAC,IAAA,2CAAKC,MAAO,0BAA0BtD,KAAKI,MAAQ,QAAU,MAAMJ,KAAKM,SAAW,WAAY,MAE7F8C,EAAA,SAAAC,IAAA,2CAAOC,MAAM,iBAAiBC,QAAUvD,KAAKC,UAC3CuD,EAAAxD,KAAKyD,SAAK,MAAAD,SAAA,SAAAA,EAAEE,QAGdN,EAAA,OAAAC,IAAA,2CAAKC,MAAO,kBAAkBtD,KAAKG,OAAS,IAAM,QAAU,WAAWH,KAAKM,SAAW,WAAa,MAClG8C,EAAA,SAAAC,IAAA,2CACA9C,KAAMP,KAAKO,KACXE,aAAcT,KAAKS,aACnB6C,MAAO,sBAAsBtD,KAAKI,MAAQ,QAAU,MAAMJ,KAAKK,QAAU,UAAY,KACrFC,SAAUN,KAAKM,SAAW,KAAOqD,UAAS,eAC5B3D,KAAKI,MAAQ,KAAOuD,UAAS,aAC/B3D,KAAK4D,UACjBC,IAAK7D,KAAK6D,IACVC,IAAK9D,KAAK8D,IACVhD,MAAOd,KAAKc,MACZN,SAAUR,KAAKQ,SACfuD,SAAWpD,GAAMX,KAAKU,QAAQC,KAC9ByC,EAAA,OAAAC,IAAA,2CAAKC,MAAM,gBAAgBU,KAAK,SAASC,QAAS,IAAMjE,KAAKsC,+BAC3Dc,EAAA,YAAAC,IAAA,2CAAUa,KAAK,aAAY,cAAa,aAI1CC,EAAAnE,KAAKoE,WAAO,MAAAD,SAAA,SAAAA,EAAET,SACZN,EAAA,OAAAC,IAAA,2CAAKC,MAAM,oBACPtD,KAAKoE,QAAQV,Q,mEAQ7B,IAAIxD,EAAe,E","ignoreList":[]}

package/dist/infineon-design-system-stencil/p-8e774a2e.entry.js DELETED Viewed

	@@ -1,2 +0,0 @@
1	- import{r,h as s}from"./p-e6edf72d.js";const o=":host{display:inline-block;cursor:pointer}";const e=o;const t=class{constructor(s){r(this,s);this.isOpen=false}render(){return s("slot",{key:"89bd5e8f427fea2329e032469132190fd71acd54"})}};t.style=e;export{t as ifx_dropdown_trigger};
2	- //# sourceMappingURL=p-8e774a2e.entry.js.map

package/dist/infineon-design-system-stencil/p-91ffb683.entry.js DELETED Viewed

	@@ -1,2 +0,0 @@
1	- import{r as t,c as s,h as e,g as a}from"./p-e6edf72d.js";const o=":host{display:block}";const r=o;const c=class{constructor(e){t(this,e);this.tabHeaderChange=s(this,"tabHeaderChange",7);this.icon="";this.iconPosition="left"}componentWillUpdate(){this.tabHeaderChange.emit(this.header)}render(){return e("slot",{key:"e52aed707a99319c9ad18c84e62e0c4b39d1128e"})}get el(){return a(this)}};c.style=r;export{c as ifx_tab};
2	- //# sourceMappingURL=p-91ffb683.entry.js.map