@integration-app/react 2.0.3-beta.1 → 2.0.3-beta.2

package/dist/styles.css

@@ -13,7 +13,7 @@
     font-family: var(--global-font-body, var(--font-fallback));
 }
 
-  [class^="iap"] *,[class^="iap"] ::before,[class^="iap"] ::after,[class^="iap"] ::backdrop,[class^="iap"] ::file-selector-button {
+  *[class^="iap"],::before[class^="iap"],::after[class^="iap"],::backdrop[class^="iap"],::file-selector-button[class^="iap"] {
     margin: 0px;
     padding: 0px;
     box-sizing: border-box;
@@ -22,47 +22,51 @@
     border-color: var(--global-color-border, currentColor);
 }
 
-  [class^="iap"] hr {
+  hr[class^="iap"] {
     height: 0px;
     color: inherit;
     border-top-width: 1px;
 }
 
-  [class^="iap"] body {
+  body[class^="iap"] {
     height: 100%;
     line-height: inherit;
 }
 
-  [class^="iap"] img,[class^="iap"] svg,[class^="iap"] video,[class^="iap"] canvas,[class^="iap"] audio,[class^="iap"] iframe,[class^="iap"] embed,[class^="iap"] object {
+  img[class^="iap"] {
+    border-style: none;
+}
+
+  img[class^="iap"],svg[class^="iap"],video[class^="iap"],canvas[class^="iap"],audio[class^="iap"],iframe[class^="iap"],embed[class^="iap"],object[class^="iap"] {
     display: block;
     vertical-align: middle;
 }
 
-  [class^="iap"] img,[class^="iap"] video {
+  img[class^="iap"],video[class^="iap"] {
     max-width: 100%;
     height: auto;
 }
 
-  [class^="iap"] h1,[class^="iap"] h2,[class^="iap"] h3,[class^="iap"] h4,[class^="iap"] h5,[class^="iap"] h6 {
+  h1[class^="iap"],h2[class^="iap"],h3[class^="iap"],h4[class^="iap"],h5[class^="iap"],h6[class^="iap"] {
     text-wrap: balance;
     font-size: inherit;
     font-weight: inherit;
 }
 
-  [class^="iap"] p,[class^="iap"] h1,[class^="iap"] h2,[class^="iap"] h3,[class^="iap"] h4,[class^="iap"] h5,[class^="iap"] h6 {
+  p[class^="iap"],h1[class^="iap"],h2[class^="iap"],h3[class^="iap"],h4[class^="iap"],h5[class^="iap"],h6[class^="iap"] {
     overflow-wrap: break-word;
 }
 
-  [class^="iap"] ol,[class^="iap"] ul,[class^="iap"] menu {
+  ol[class^="iap"],ul[class^="iap"],menu[class^="iap"] {
     list-style: none;
 }
 
-  [class^="iap"] button,[class^="iap"] input:where([type='button'], [type='reset'], [type='submit']),[class^="iap"] ::file-selector-button {
+  button[class^="iap"],input:where([type='button'], [type='reset'], [type='submit'])[class^="iap"],::file-selector-button[class^="iap"] {
     appearance: button;
     -webkit-appearance: button;
 }
 
-  [class^="iap"] button,[class^="iap"] input,[class^="iap"] optgroup,[class^="iap"] select,[class^="iap"] textarea,[class^="iap"] ::file-selector-button {
+  button[class^="iap"],input[class^="iap"],optgroup[class^="iap"],select[class^="iap"],textarea[class^="iap"],::file-selector-button[class^="iap"] {
     font: inherit;
     font-feature-settings: inherit;
     font-variation-settings: inherit;
@@ -71,47 +75,63 @@
     background: var(--iap-colors-transparent);
 }
 
-  [class^="iap"] ::placeholder {
+  ::placeholder[class^="iap"] {
     opacity: 1;
     --placeholder-fallback: color-mix(in srgb, currentColor 50%, transparent);
     color: var(--global-color-placeholder, var(--placeholder-fallback));
 }
 
-  [class^="iap"] textarea {
+  textarea[class^="iap"] {
     resize: vertical;
 }
 
-  [class^="iap"] table {
+  table[class^="iap"] {
     text-indent: 0px;
     border-collapse: collapse;
     border-color: inherit;
 }
 
-  [class^="iap"] summary {
+  summary[class^="iap"] {
     display: list-item;
 }
 
-  [class^="iap"] sub,[class^="iap"] sup {
+  small[class^="iap"] {
+    font-size: 80%;
+}
+
+  sub[class^="iap"],sup[class^="iap"] {
     position: relative;
     vertical-align: baseline;
     font-size: 75%;
     line-height: 0;
 }
 
-  [class^="iap"] dialog {
+  sub[class^="iap"] {
+    bottom: -0.25em;
+}
+
+  sup[class^="iap"] {
+    top: -0.5em;
+}
+
+  dialog[class^="iap"] {
     padding: 0px;
 }
 
-  [class^="iap"] a {
+  a[class^="iap"] {
     color: inherit;
     text-decoration: inherit;
 }
 
-  [class^="iap"] abbr:where([title]) {
+  abbr:where([title])[class^="iap"] {
     text-decoration: underline dotted;
 }
 
-  [class^="iap"] code,[class^="iap"] kbd,[class^="iap"] samp,[class^="iap"] pre {
+  b[class^="iap"],strong[class^="iap"] {
+    font-weight: bolder;
+}
+
+  code[class^="iap"],kbd[class^="iap"],samp[class^="iap"],pre[class^="iap"] {
     --font-mono-fallback: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New';
     font-feature-settings: normal;
     font-variation-settings: normal;
@@ -119,49 +139,29 @@
     font-size: 1em;
 }
 
-  [class^="iap"] progress {
+  progress[class^="iap"] {
     vertical-align: baseline;
 }
 
-  [class^="iap"] ::-webkit-search-decoration,[class^="iap"] ::-webkit-search-cancel-button {
+  ::-webkit-search-decoration[class^="iap"],::-webkit-search-cancel-button[class^="iap"] {
     -webkit-appearance: none;
 }
 
-  [class^="iap"] ::-webkit-inner-spin-button,[class^="iap"] ::-webkit-outer-spin-button {
+  ::-webkit-inner-spin-button[class^="iap"],::-webkit-outer-spin-button[class^="iap"] {
     height: auto;
 }
 
-  [class^="iap"] :-moz-ui-invalid {
+  :-moz-ui-invalid[class^="iap"] {
     box-shadow: none;
 }
 
-  [class^="iap"] :-moz-focusring {
+  :-moz-focusring[class^="iap"] {
     outline: auto;
 }
 
-  [class^="iap"] [hidden] {
+  [hidden][class^="iap"] {
     display: none !important;
 }
-
-  [class^="iap"] img {
-    border-style: none;
-}
-
-  [class^="iap"] small {
-    font-size: 80%;
-}
-
-  [class^="iap"] sub {
-    bottom: -0.25em;
-}
-
-  [class^="iap"] sup {
-    top: -0.5em;
-}
-
-  [class^="iap"] b,[class^="iap"] strong {
-    font-weight: bolder;
-}
 }
 
 @layer iap_base{
@@ -186,12 +186,6 @@
     color-scheme: dark;
 }
 
-  *,*::before,*::after {
-    box-sizing: border-box;
-    border-color: var(--iap-colors-border-subtle);
-    border-style: solid;
-}
-
   *::placeholder {
     opacity: 1;
     color: var(--iap-colors-fg-subtle);
@@ -201,6 +195,12 @@
     background: var(--iap-colors-accent-a4);
 }
 
+  [class^="iap"],[class^="iap"]::before,[class^="iap"]::after {
+    box-sizing: border-box;
+    border-color: var(--iap-colors-border-subtle);
+    border-style: solid;
+}
+
   *,::before,::after,::backdrop {
     --blur: /*-*/ /*-*/;
     --brightness: /*-*/ /*-*/;
@@ -1992,6 +1992,8 @@
     --iap-breakpoints-lg: 1024px;
     --iap-breakpoints-xl: 1280px;
     --iap-breakpoints-2xl: 1536px;
+    --iap-colors-surface-default: var(--iap-colors-neutral-2);
+    --iap-colors-touchable-hover: var(--iap-colors-neutral-3);
     --iap-radii-l1: var(--iap-radii-none);
     --iap-radii-l2: var(--iap-radii-none);
     --iap-radii-l3: var(--iap-radii-none);
@@ -4045,74 +4047,6 @@
 @layer iap_recipes{
   @layer _base{
 
-    .iap-spinner {
-      --iap-colors-color-palette-1: var(--iap-colors-accent-1);
-      --iap-colors-color-palette-2: var(--iap-colors-accent-2);
-      --iap-colors-color-palette-3: var(--iap-colors-accent-3);
-      --iap-colors-color-palette-4: var(--iap-colors-accent-4);
-      --iap-colors-color-palette-5: var(--iap-colors-accent-5);
-      --iap-colors-color-palette-6: var(--iap-colors-accent-6);
-      --iap-colors-color-palette-7: var(--iap-colors-accent-7);
-      --iap-colors-color-palette-8: var(--iap-colors-accent-8);
-      --iap-colors-color-palette-9: var(--iap-colors-accent-9);
-      --iap-colors-color-palette-10: var(--iap-colors-accent-10);
-      --iap-colors-color-palette-11: var(--iap-colors-accent-11);
-      --iap-colors-color-palette-12: var(--iap-colors-accent-12);
-      --iap-colors-color-palette-a1: var(--iap-colors-accent-a1);
-      --iap-colors-color-palette-a2: var(--iap-colors-accent-a2);
-      --iap-colors-color-palette-a3: var(--iap-colors-accent-a3);
-      --iap-colors-color-palette-a4: var(--iap-colors-accent-a4);
-      --iap-colors-color-palette-a5: var(--iap-colors-accent-a5);
-      --iap-colors-color-palette-a6: var(--iap-colors-accent-a6);
-      --iap-colors-color-palette-a7: var(--iap-colors-accent-a7);
-      --iap-colors-color-palette-a8: var(--iap-colors-accent-a8);
-      --iap-colors-color-palette-a9: var(--iap-colors-accent-a9);
-      --iap-colors-color-palette-a10: var(--iap-colors-accent-a10);
-      --iap-colors-color-palette-a11: var(--iap-colors-accent-a11);
-      --iap-colors-color-palette-a12: var(--iap-colors-accent-a12);
-      --iap-colors-color-palette-default: var(--iap-colors-accent-default);
-      --iap-colors-color-palette-emphasized: var(--iap-colors-accent-emphasized);
-      --iap-colors-color-palette-fg: var(--iap-colors-accent-fg);
-      --iap-colors-color-palette-text: var(--iap-colors-accent-text);
-      display: inline-block;
-      border-radius: var(--iap-radii-full);
-      width: var(--size);
-      height: var(--size);
-      animation: var(--iap-animations-spin);
-      border-width: 2px;
-      border-color: var(--iap-colors-color-palette-default);
-      border-style: solid;
-      animation-duration: var(--iap-durations-slowest);
-}
-
-    .iap-skeleton {
-      animation: var(--iap-animations-skeleton-pulse);
-      border-radius: var(--iap-radii-l3);
-      color: var(--iap-colors-transparent);
-      cursor: default;
-      pointer-events: none;
-      -webkit-user-select: none;
-      user-select: none;
-      background-clip: padding-box;
-      -webkit-background-clip: padding-box;
-      background-color: var(--iap-colors-gray-a4);
-}
-
-    .iap-skeleton::before,.iap-skeleton::after,.iap-skeleton * {
-      visibility: hidden;
-}
-
-    .iap-icon {
-      color: currentcolor;
-      display: inline-block;
-      flex-shrink: 0;
-      line-height: 1em;
-}
-
-    .iap-icon,.iap-button {
-      vertical-align: middle;
-}
-
     .iap-button {
       appearance: none;
       -webkit-appearance: none;
@@ -4124,6 +4058,7 @@
       position: relative;
       -webkit-user-select: none;
       user-select: none;
+      vertical-align: middle;
       white-space: nowrap;
       align-items: center;
       font-weight: var(--iap-font-weights-semibold);
@@ -4140,8 +4075,19 @@
       display: none;
 }
 
-    .iap-badge {
+    .iap-spinner {
+      display: inline-block;
       border-radius: var(--iap-radii-full);
+      width: var(--size);
+      height: var(--size);
+      animation: var(--iap-animations-spin);
+      border-width: 2px;
+      border-color: var(--iap-colors-color-palette-default);
+      border-style: solid;
+      animation-duration: var(--iap-durations-slowest);
+}
+
+    .iap-spinner,.iap-input {
       --iap-colors-color-palette-1: var(--iap-colors-accent-1);
       --iap-colors-color-palette-2: var(--iap-colors-accent-2);
       --iap-colors-color-palette-3: var(--iap-colors-accent-3);
@@ -4170,31 +4116,6 @@
       --iap-colors-color-palette-emphasized: var(--iap-colors-accent-emphasized);
       --iap-colors-color-palette-fg: var(--iap-colors-accent-fg);
       --iap-colors-color-palette-text: var(--iap-colors-accent-text);
-      -webkit-user-select: none;
-      user-select: none;
-      white-space: nowrap;
-      font-weight: var(--iap-font-weights-medium);
-}
-
-    .iap-badge,.iap-code {
-      display: inline-flex;
-      align-items: center;
-}
-
-    .iap-code {
-      background: var(--iap-colors-bg-subtle);
-      border-radius: var(--iap-radii-l2);
-      white-space: pre;
-      font-weight: var(--iap-font-weights-medium) !important;
-      font-family: var(--fonts-code);
-}
-
-    .iap-code,.iap-formLabel {
-      color: var(--iap-colors-fg-default);
-}
-
-    .iap-formLabel {
-      font-weight: var(--iap-font-weights-medium);
 }
 
     .iap-input {
@@ -4202,34 +4123,6 @@
       -webkit-appearance: none;
       background: none;
       border-radius: var(--iap-radii-l2);
-      --iap-colors-color-palette-1: var(--iap-colors-accent-1);
-      --iap-colors-color-palette-2: var(--iap-colors-accent-2);
-      --iap-colors-color-palette-3: var(--iap-colors-accent-3);
-      --iap-colors-color-palette-4: var(--iap-colors-accent-4);
-      --iap-colors-color-palette-5: var(--iap-colors-accent-5);
-      --iap-colors-color-palette-6: var(--iap-colors-accent-6);
-      --iap-colors-color-palette-7: var(--iap-colors-accent-7);
-      --iap-colors-color-palette-8: var(--iap-colors-accent-8);
-      --iap-colors-color-palette-9: var(--iap-colors-accent-9);
-      --iap-colors-color-palette-10: var(--iap-colors-accent-10);
-      --iap-colors-color-palette-11: var(--iap-colors-accent-11);
-      --iap-colors-color-palette-12: var(--iap-colors-accent-12);
-      --iap-colors-color-palette-a1: var(--iap-colors-accent-a1);
-      --iap-colors-color-palette-a2: var(--iap-colors-accent-a2);
-      --iap-colors-color-palette-a3: var(--iap-colors-accent-a3);
-      --iap-colors-color-palette-a4: var(--iap-colors-accent-a4);
-      --iap-colors-color-palette-a5: var(--iap-colors-accent-a5);
-      --iap-colors-color-palette-a6: var(--iap-colors-accent-a6);
-      --iap-colors-color-palette-a7: var(--iap-colors-accent-a7);
-      --iap-colors-color-palette-a8: var(--iap-colors-accent-a8);
-      --iap-colors-color-palette-a9: var(--iap-colors-accent-a9);
-      --iap-colors-color-palette-a10: var(--iap-colors-accent-a10);
-      --iap-colors-color-palette-a11: var(--iap-colors-accent-a11);
-      --iap-colors-color-palette-a12: var(--iap-colors-accent-a12);
-      --iap-colors-color-palette-default: var(--iap-colors-accent-default);
-      --iap-colors-color-palette-emphasized: var(--iap-colors-accent-emphasized);
-      --iap-colors-color-palette-fg: var(--iap-colors-accent-fg);
-      --iap-colors-color-palette-text: var(--iap-colors-accent-text);
       color: var(--iap-colors-fg-default);
       outline: 0;
       position: relative;
@@ -4263,65 +4156,21 @@
       border-color: var(--iap-colors-color-palette-default);
 }
 
-    .iap-kbd {
-      background: var(--iap-colors-bg-subtle);
-      border-radius: var(--iap-radii-l2);
-      box-shadow: 0 -2px 0 0 inset var(--colors-border-muted), 0 0 0 1px inset var(--colors-border-muted);
-      white-space: pre;
-      font-family: var(--fonts-code);
-}
-
-    .iap-kbd,.iap-link {
-      color: var(--iap-colors-fg-default);
-      display: inline-flex;
-      align-items: center;
-      font-weight: var(--iap-font-weights-medium);
-}
-
-    .iap-link {
-      --iap-colors-color-palette-1: var(--iap-colors-accent-1);
-      --iap-colors-color-palette-2: var(--iap-colors-accent-2);
-      --iap-colors-color-palette-3: var(--iap-colors-accent-3);
-      --iap-colors-color-palette-4: var(--iap-colors-accent-4);
-      --iap-colors-color-palette-5: var(--iap-colors-accent-5);
-      --iap-colors-color-palette-6: var(--iap-colors-accent-6);
-      --iap-colors-color-palette-7: var(--iap-colors-accent-7);
-      --iap-colors-color-palette-8: var(--iap-colors-accent-8);
-      --iap-colors-color-palette-9: var(--iap-colors-accent-9);
-      --iap-colors-color-palette-10: var(--iap-colors-accent-10);
-      --iap-colors-color-palette-11: var(--iap-colors-accent-11);
-      --iap-colors-color-palette-12: var(--iap-colors-accent-12);
-      --iap-colors-color-palette-a1: var(--iap-colors-accent-a1);
-      --iap-colors-color-palette-a2: var(--iap-colors-accent-a2);
-      --iap-colors-color-palette-a3: var(--iap-colors-accent-a3);
-      --iap-colors-color-palette-a4: var(--iap-colors-accent-a4);
-      --iap-colors-color-palette-a5: var(--iap-colors-accent-a5);
-      --iap-colors-color-palette-a6: var(--iap-colors-accent-a6);
-      --iap-colors-color-palette-a7: var(--iap-colors-accent-a7);
-      --iap-colors-color-palette-a8: var(--iap-colors-accent-a8);
-      --iap-colors-color-palette-a9: var(--iap-colors-accent-a9);
-      --iap-colors-color-palette-a10: var(--iap-colors-accent-a10);
-      --iap-colors-color-palette-a11: var(--iap-colors-accent-a11);
-      --iap-colors-color-palette-a12: var(--iap-colors-accent-a12);
-      --iap-colors-color-palette-default: var(--iap-colors-accent-default);
-      --iap-colors-color-palette-emphasized: var(--iap-colors-accent-emphasized);
-      --iap-colors-color-palette-fg: var(--iap-colors-accent-fg);
-      --iap-colors-color-palette-text: var(--iap-colors-accent-text);
-      cursor: pointer;
-      gap: var(--iap-spacing-2);
-      text-decoration: underline 0.1em transparent;
-      text-underline-offset: 0.125em;
-      --transition-duration: var(--iap-durations-normal);
-      transition-duration: var(--iap-durations-normal);
-      --transition-prop: text-decoration-color;
-      transition-property: text-decoration-color;
-      --transition-easing: var(--iap-easings-default);
-      transition-timing-function: var(--iap-easings-default);
+    .iap-skeleton {
+      animation: var(--iap-animations-skeleton-pulse);
+      border-radius: var(--iap-radii-l3);
+      color: var(--iap-colors-transparent);
+      cursor: default;
+      pointer-events: none;
+      -webkit-user-select: none;
+      user-select: none;
+      background-clip: padding-box;
+      -webkit-background-clip: padding-box;
+      background-color: var(--iap-colors-gray-a4);
 }
 
-    .iap-link svg {
-      width: 1em;
-      height: 1em;
+    .iap-skeleton::before,.iap-skeleton::after,.iap-skeleton * {
+      visibility: hidden;
 }
 
     .iap-textarea {
@@ -4388,61 +4237,149 @@
       border-color: var(--iap-colors-color-palette-default);
 }
 
-    @media (hover: hover) and (pointer: fine) {
-      .iap-link:is(:hover, [data-hover]) {
-        text-decoration-color: var(--iap-colors-color-palette-default);
-}
-}
-}
-
-  .iap-spinner--size_md {
-    --size: var(--iap-sizes-6);
+    .iap-icon {
+      color: currentcolor;
+      display: inline-block;
+      vertical-align: middle;
+      flex-shrink: 0;
+      line-height: 1em;
 }
 
-  .iap-spinner--size_xs {
-    --size: var(--iap-sizes-3);
+    .iap-badge {
+      border-radius: var(--iap-radii-full);
+      --iap-colors-color-palette-1: var(--iap-colors-accent-1);
+      --iap-colors-color-palette-2: var(--iap-colors-accent-2);
+      --iap-colors-color-palette-3: var(--iap-colors-accent-3);
+      --iap-colors-color-palette-4: var(--iap-colors-accent-4);
+      --iap-colors-color-palette-5: var(--iap-colors-accent-5);
+      --iap-colors-color-palette-6: var(--iap-colors-accent-6);
+      --iap-colors-color-palette-7: var(--iap-colors-accent-7);
+      --iap-colors-color-palette-8: var(--iap-colors-accent-8);
+      --iap-colors-color-palette-9: var(--iap-colors-accent-9);
+      --iap-colors-color-palette-10: var(--iap-colors-accent-10);
+      --iap-colors-color-palette-11: var(--iap-colors-accent-11);
+      --iap-colors-color-palette-12: var(--iap-colors-accent-12);
+      --iap-colors-color-palette-a1: var(--iap-colors-accent-a1);
+      --iap-colors-color-palette-a2: var(--iap-colors-accent-a2);
+      --iap-colors-color-palette-a3: var(--iap-colors-accent-a3);
+      --iap-colors-color-palette-a4: var(--iap-colors-accent-a4);
+      --iap-colors-color-palette-a5: var(--iap-colors-accent-a5);
+      --iap-colors-color-palette-a6: var(--iap-colors-accent-a6);
+      --iap-colors-color-palette-a7: var(--iap-colors-accent-a7);
+      --iap-colors-color-palette-a8: var(--iap-colors-accent-a8);
+      --iap-colors-color-palette-a9: var(--iap-colors-accent-a9);
+      --iap-colors-color-palette-a10: var(--iap-colors-accent-a10);
+      --iap-colors-color-palette-a11: var(--iap-colors-accent-a11);
+      --iap-colors-color-palette-a12: var(--iap-colors-accent-a12);
+      --iap-colors-color-palette-default: var(--iap-colors-accent-default);
+      --iap-colors-color-palette-emphasized: var(--iap-colors-accent-emphasized);
+      --iap-colors-color-palette-fg: var(--iap-colors-accent-fg);
+      --iap-colors-color-palette-text: var(--iap-colors-accent-text);
+      -webkit-user-select: none;
+      user-select: none;
+      white-space: nowrap;
+      font-weight: var(--iap-font-weights-medium);
 }
 
-  .iap-spinner--size_sm {
-    --size: var(--iap-sizes-4);
+    .iap-badge,.iap-code {
+      display: inline-flex;
+      align-items: center;
 }
 
-  .iap-spinner--size_lg {
-    --size: var(--iap-sizes-8);
+    .iap-code {
+      background: var(--iap-colors-bg-subtle);
+      border-radius: var(--iap-radii-l2);
+      color: var(--iap-colors-fg-default);
+      white-space: pre;
+      font-weight: var(--iap-font-weights-medium) !important;
+      font-family: var(--fonts-code);
 }
 
-  .iap-spinner--size_xl {
-    --size: var(--iap-sizes-12);
+    .iap-formLabel,.iap-kbd {
+      color: var(--iap-colors-fg-default);
+      font-weight: var(--iap-font-weights-medium);
 }
 
-  .iap-icon--size_md {
-    width: var(--iap-sizes-5);
-    height: var(--iap-sizes-5);
+    .iap-kbd {
+      background: var(--iap-colors-bg-subtle);
+      border-radius: var(--iap-radii-l2);
+      box-shadow: 0 -2px 0 0 inset var(--colors-border-muted), 0 0 0 1px inset var(--colors-border-muted);
+      white-space: pre;
+      font-family: var(--fonts-code);
 }
 
-  .iap-icon--size_xs {
-    width: var(--iap-sizes-3);
-    height: var(--iap-sizes-3);
+    .iap-kbd,.iap-link {
+      display: inline-flex;
+      align-items: center;
 }
 
-  .iap-icon--size_sm {
-    width: var(--iap-sizes-4);
-    height: var(--iap-sizes-4);
+    .iap-link {
+      color: var(--iap-colors-fg-default);
+      --iap-colors-color-palette-1: var(--iap-colors-accent-1);
+      --iap-colors-color-palette-2: var(--iap-colors-accent-2);
+      --iap-colors-color-palette-3: var(--iap-colors-accent-3);
+      --iap-colors-color-palette-4: var(--iap-colors-accent-4);
+      --iap-colors-color-palette-5: var(--iap-colors-accent-5);
+      --iap-colors-color-palette-6: var(--iap-colors-accent-6);
+      --iap-colors-color-palette-7: var(--iap-colors-accent-7);
+      --iap-colors-color-palette-8: var(--iap-colors-accent-8);
+      --iap-colors-color-palette-9: var(--iap-colors-accent-9);
+      --iap-colors-color-palette-10: var(--iap-colors-accent-10);
+      --iap-colors-color-palette-11: var(--iap-colors-accent-11);
+      --iap-colors-color-palette-12: var(--iap-colors-accent-12);
+      --iap-colors-color-palette-a1: var(--iap-colors-accent-a1);
+      --iap-colors-color-palette-a2: var(--iap-colors-accent-a2);
+      --iap-colors-color-palette-a3: var(--iap-colors-accent-a3);
+      --iap-colors-color-palette-a4: var(--iap-colors-accent-a4);
+      --iap-colors-color-palette-a5: var(--iap-colors-accent-a5);
+      --iap-colors-color-palette-a6: var(--iap-colors-accent-a6);
+      --iap-colors-color-palette-a7: var(--iap-colors-accent-a7);
+      --iap-colors-color-palette-a8: var(--iap-colors-accent-a8);
+      --iap-colors-color-palette-a9: var(--iap-colors-accent-a9);
+      --iap-colors-color-palette-a10: var(--iap-colors-accent-a10);
+      --iap-colors-color-palette-a11: var(--iap-colors-accent-a11);
+      --iap-colors-color-palette-a12: var(--iap-colors-accent-a12);
+      --iap-colors-color-palette-default: var(--iap-colors-accent-default);
+      --iap-colors-color-palette-emphasized: var(--iap-colors-accent-emphasized);
+      --iap-colors-color-palette-fg: var(--iap-colors-accent-fg);
+      --iap-colors-color-palette-text: var(--iap-colors-accent-text);
+      cursor: pointer;
+      gap: var(--iap-spacing-2);
+      text-decoration: underline 0.1em transparent;
+      text-underline-offset: 0.125em;
+      font-weight: var(--iap-font-weights-medium);
+      --transition-duration: var(--iap-durations-normal);
+      transition-duration: var(--iap-durations-normal);
+      --transition-prop: text-decoration-color;
+      transition-property: text-decoration-color;
+      --transition-easing: var(--iap-easings-default);
+      transition-timing-function: var(--iap-easings-default);
 }
 
-  .iap-icon--size_lg {
-    width: var(--iap-sizes-6);
-    height: var(--iap-sizes-6);
+    .iap-link svg {
+      width: 1em;
+      height: 1em;
 }
 
-  .iap-icon--size_xl {
-    width: var(--iap-sizes-7);
-    height: var(--iap-sizes-7);
+    @media (hover: hover) and (pointer: fine) {
+      .iap-link:is(:hover, [data-hover]) {
+        text-decoration-color: var(--iap-colors-color-palette-default);
+}
+}
 }
 
-  .iap-icon--size_2xl {
-    width: var(--iap-sizes-8);
-    height: var(--iap-sizes-8);
+  .iap-button--size_md {
+    height: var(--iap-sizes-10);
+    min-width: var(--iap-sizes-10);
+    font-size: var(--iap-font-sizes-sm);
+    line-height: 1.25rem;
+    padding-inline: var(--iap-spacing-4);
+    gap: var(--iap-spacing-2);
+}
+
+  .iap-button--size_md svg {
+    width: var(--iap-sizes-5);
+    height: var(--iap-sizes-5);
 }
 
   .iap-button--variant_subtle {
@@ -4538,20 +4475,6 @@
     outline-color: var(--iap-colors-color-palette-default);
 }
 
-  .iap-button--size_md {
-    height: var(--iap-sizes-10);
-    min-width: var(--iap-sizes-10);
-    font-size: var(--iap-font-sizes-sm);
-    line-height: 1.25rem;
-    padding-inline: var(--iap-spacing-4);
-    gap: var(--iap-spacing-2);
-}
-
-  .iap-button--size_md svg {
-    width: var(--iap-sizes-5);
-    height: var(--iap-sizes-5);
-}
-
   .iap-button--variant_solid {
     background: var(--iap-colors-color-palette-default);
     color: var(--iap-colors-color-palette-fg);
@@ -4875,6 +4798,26 @@
     height: var(--iap-sizes-6);
 }
 
+  .iap-spinner--size_md {
+    --size: var(--iap-sizes-6);
+}
+
+  .iap-spinner--size_xs {
+    --size: var(--iap-sizes-3);
+}
+
+  .iap-spinner--size_sm {
+    --size: var(--iap-sizes-4);
+}
+
+  .iap-spinner--size_lg {
+    --size: var(--iap-sizes-8);
+}
+
+  .iap-spinner--size_xl {
+    --size: var(--iap-sizes-12);
+}
+
   .iap-text--size_xs {
     font-size: var(--iap-font-sizes-xs);
     line-height: 1.125rem;
@@ -4939,66 +4882,166 @@
     line-height: 5.75rem;
 }
 
-  .iap-badge--variant_subtle {
-    background: var(--iap-colors-bg-subtle);
-    color: var(--iap-colors-fg-default);
-    border-color: var(--iap-colors-border-subtle);
-    border-width: 1px;
+  .iap-input--size_md {
+    padding-inline: var(--iap-spacing-3);
+    height: var(--iap-sizes-10);
+    min-width: var(--iap-sizes-10);
+    font-size: var(--iap-font-sizes-md);
 }
 
-  .iap-badge--variant_subtle svg {
-    color: var(--iap-colors-fg-muted);
+  .iap-input--size_2xs {
+    padding-inline: var(--iap-spacing-1\.5);
+    height: var(--iap-sizes-7);
+    min-width: var(--iap-sizes-7);
+    font-size: var(--iap-font-sizes-xs);
 }
 
-  .iap-badge--size_md {
+  .iap-input--size_xs {
+    padding-inline: var(--iap-spacing-2);
+    height: var(--iap-sizes-8);
+    min-width: var(--iap-sizes-8);
     font-size: var(--iap-font-sizes-xs);
-    line-height: 1.125rem;
-    padding-inline: var(--iap-spacing-2\.5);
-    height: var(--iap-sizes-6);
-    gap: var(--iap-spacing-1\.5);
 }
 
-  .iap-badge--size_md svg {
-    width: var(--iap-sizes-4);
-    height: var(--iap-sizes-4);
+  .iap-input--size_sm {
+    padding-inline: var(--iap-spacing-2\.5);
+    height: var(--iap-sizes-9);
+    min-width: var(--iap-sizes-9);
+    font-size: var(--iap-font-sizes-sm);
 }
 
-  .iap-badge--variant_solid {
-    background: var(--iap-colors-color-palette-default);
-    color: var(--iap-colors-color-palette-fg);
+  .iap-input--size_lg {
+    padding-inline: var(--iap-spacing-3\.5);
+    height: var(--iap-sizes-11);
+    min-width: var(--iap-sizes-11);
+    font-size: var(--iap-font-sizes-md);
 }
 
-  .iap-badge--variant_outline {
-    color: var(--iap-colors-fg-default);
-    border-width: 2px;
-    border-color: var(--iap-colors-border-default);
+  .iap-input--size_xl {
+    padding-inline: var(--iap-spacing-4);
+    height: var(--iap-sizes-12);
+    min-width: var(--iap-sizes-12);
+    font-size: var(--iap-font-sizes-lg);
 }
 
-  .iap-badge--size_sm {
-    font-size: var(--iap-font-sizes-xs);
-    line-height: 1.125rem;
-    padding-inline: var(--iap-spacing-2);
-    height: var(--iap-sizes-5);
-    gap: var(--iap-spacing-1);
+  .iap-input--size_2xl {
+    padding-inline: var(--iap-spacing-4\.5);
+    height: var(--iap-sizes-16);
+    min-width: var(--iap-sizes-16);
+    font-size: var(--iap-font-sizes-3xl);
+    line-height: 2.375rem;
 }
 
-  .iap-badge--size_sm svg {
-    width: var(--iap-sizes-3);
-    height: var(--iap-sizes-3);
+  .iap-textarea--size_md {
+    padding: var(--iap-spacing-3);
+    font-size: var(--iap-font-sizes-md);
 }
 
-  .iap-badge--size_lg {
+  .iap-textarea--size_sm {
+    padding: var(--iap-spacing-2\.5);
     font-size: var(--iap-font-sizes-sm);
-    line-height: 1.25rem;
-    padding-inline: var(--iap-spacing-3);
-    height: var(--iap-sizes-7);
-    gap: var(--iap-spacing-1\.5);
 }
 
-  .iap-badge--size_lg svg {
-    width: var(--iap-sizes-4);
-    height: var(--iap-sizes-4);
-}
+  .iap-textarea--size_lg {
+    padding: var(--iap-spacing-3\.5);
+    font-size: var(--iap-font-sizes-md);
+}
+
+  .iap-textarea--size_xl {
+    padding: var(--iap-spacing-4);
+    font-size: var(--iap-font-sizes-md);
+}
+
+  .iap-icon--size_md {
+    width: var(--iap-sizes-5);
+    height: var(--iap-sizes-5);
+}
+
+  .iap-icon--size_xs {
+    width: var(--iap-sizes-3);
+    height: var(--iap-sizes-3);
+}
+
+  .iap-icon--size_sm {
+    width: var(--iap-sizes-4);
+    height: var(--iap-sizes-4);
+}
+
+  .iap-icon--size_lg {
+    width: var(--iap-sizes-6);
+    height: var(--iap-sizes-6);
+}
+
+  .iap-icon--size_xl {
+    width: var(--iap-sizes-7);
+    height: var(--iap-sizes-7);
+}
+
+  .iap-icon--size_2xl {
+    width: var(--iap-sizes-8);
+    height: var(--iap-sizes-8);
+}
+
+  .iap-badge--variant_subtle {
+    background: var(--iap-colors-bg-subtle);
+    color: var(--iap-colors-fg-default);
+    border-color: var(--iap-colors-border-subtle);
+    border-width: 1px;
+}
+
+  .iap-badge--variant_subtle svg {
+    color: var(--iap-colors-fg-muted);
+}
+
+  .iap-badge--size_md {
+    font-size: var(--iap-font-sizes-xs);
+    line-height: 1.125rem;
+    padding-inline: var(--iap-spacing-2\.5);
+    height: var(--iap-sizes-6);
+    gap: var(--iap-spacing-1\.5);
+}
+
+  .iap-badge--size_md svg {
+    width: var(--iap-sizes-4);
+    height: var(--iap-sizes-4);
+}
+
+  .iap-badge--variant_solid {
+    background: var(--iap-colors-color-palette-default);
+    color: var(--iap-colors-color-palette-fg);
+}
+
+  .iap-badge--variant_outline {
+    color: var(--iap-colors-fg-default);
+    border-width: 2px;
+    border-color: var(--iap-colors-border-default);
+}
+
+  .iap-badge--size_sm {
+    font-size: var(--iap-font-sizes-xs);
+    line-height: 1.125rem;
+    padding-inline: var(--iap-spacing-2);
+    height: var(--iap-sizes-5);
+    gap: var(--iap-spacing-1);
+}
+
+  .iap-badge--size_sm svg {
+    width: var(--iap-sizes-3);
+    height: var(--iap-sizes-3);
+}
+
+  .iap-badge--size_lg {
+    font-size: var(--iap-font-sizes-sm);
+    line-height: 1.25rem;
+    padding-inline: var(--iap-spacing-3);
+    height: var(--iap-sizes-7);
+    gap: var(--iap-spacing-1\.5);
+}
+
+  .iap-badge--size_lg svg {
+    width: var(--iap-sizes-4);
+    height: var(--iap-sizes-4);
+}
 
   .iap-code--size_md {
     min-height: var(--iap-sizes-6);
@@ -5037,56 +5080,6 @@
     line-height: 1.5rem;
 }
 
-  .iap-input--size_md {
-    padding-inline: var(--iap-spacing-3);
-    height: var(--iap-sizes-10);
-    min-width: var(--iap-sizes-10);
-    font-size: var(--iap-font-sizes-md);
-}
-
-  .iap-input--size_2xs {
-    padding-inline: var(--iap-spacing-1\.5);
-    height: var(--iap-sizes-7);
-    min-width: var(--iap-sizes-7);
-    font-size: var(--iap-font-sizes-xs);
-}
-
-  .iap-input--size_xs {
-    padding-inline: var(--iap-spacing-2);
-    height: var(--iap-sizes-8);
-    min-width: var(--iap-sizes-8);
-    font-size: var(--iap-font-sizes-xs);
-}
-
-  .iap-input--size_sm {
-    padding-inline: var(--iap-spacing-2\.5);
-    height: var(--iap-sizes-9);
-    min-width: var(--iap-sizes-9);
-    font-size: var(--iap-font-sizes-sm);
-}
-
-  .iap-input--size_lg {
-    padding-inline: var(--iap-spacing-3\.5);
-    height: var(--iap-sizes-11);
-    min-width: var(--iap-sizes-11);
-    font-size: var(--iap-font-sizes-md);
-}
-
-  .iap-input--size_xl {
-    padding-inline: var(--iap-spacing-4);
-    height: var(--iap-sizes-12);
-    min-width: var(--iap-sizes-12);
-    font-size: var(--iap-font-sizes-lg);
-}
-
-  .iap-input--size_2xl {
-    padding-inline: var(--iap-spacing-4\.5);
-    height: var(--iap-sizes-16);
-    min-width: var(--iap-sizes-16);
-    font-size: var(--iap-font-sizes-3xl);
-    line-height: 2.375rem;
-}
-
   .iap-kbd--size_md {
     min-height: var(--iap-sizes-6);
     font-size: var(--iap-font-sizes-sm);
@@ -5110,26 +5103,6 @@
     line-height: 1.5rem;
 }
 
-  .iap-textarea--size_md {
-    padding: var(--iap-spacing-3);
-    font-size: var(--iap-font-sizes-md);
-}
-
-  .iap-textarea--size_sm {
-    padding: var(--iap-spacing-2\.5);
-    font-size: var(--iap-font-sizes-sm);
-}
-
-  .iap-textarea--size_lg {
-    padding: var(--iap-spacing-3\.5);
-    font-size: var(--iap-font-sizes-md);
-}
-
-  .iap-textarea--size_xl {
-    padding: var(--iap-spacing-4);
-    font-size: var(--iap-font-sizes-md);
-}
-
   @media (hover: hover) and (pointer: fine) {
     .iap-button--variant_subtle:is(:hover, [data-hover]) {
       background: var(--iap-colors-color-palette-a4);
@@ -5190,6 +5163,286 @@
 @layer iap_recipes.slots{
   @layer _base{
 
+    .iap-tooltip__content {
+      background: var(--iap-colors-gray-a12);
+      border-radius: var(--iap-radii-l2);
+      box-shadow: var(--iap-shadows-sm);
+      color: var(--iap-colors-bg-default);
+      padding-inline: var(--iap-spacing-3);
+      padding-block: var(--iap-spacing-2);
+      font-size: var(--iap-font-sizes-xs);
+      line-height: 1.125rem;
+      max-width: var(--iap-sizes-2xs);
+      z-index: var(--iap-z-index-tooltip);
+      font-weight: var(--iap-font-weights-semibold);
+}
+
+    .iap-tooltip__content:is([open], [data-open], [data-state="open"]) {
+      animation: fadeIn 0.25s ease-out;
+}
+
+    .iap-tooltip__content:is([closed], [data-closed], [data-state="closed"]) {
+      animation: fadeOut 0.2s ease-out;
+}
+
+    .iap-popover__arrow {
+      --arrow-size: var(--sizes-3);
+      --arrow-background: var(--colors-bg-default);
+}
+
+    .iap-popover__arrowTip {
+      border-top-width: 1px;
+      border-left-width: 1px;
+}
+
+    .iap-popover__positioner {
+      position: relative;
+}
+
+    .iap-popover__content {
+      background: var(--iap-colors-bg-default);
+      border-radius: var(--iap-radii-l3);
+      box-shadow: var(--iap-shadows-lg);
+      display: flex;
+      max-width: var(--iap-sizes-sm);
+      z-index: var(--iap-z-index-popover);
+      padding: var(--iap-spacing-4);
+      flex-direction: column;
+}
+
+    .iap-popover__content:is([open], [data-open], [data-state="open"]) {
+      animation: fadeIn 0.25s ease-out;
+}
+
+    .iap-popover__content:is([closed], [data-closed], [data-state="closed"]) {
+      animation: fadeOut 0.2s ease-out;
+}
+
+    .iap-popover__content:is([hidden]) {
+      display: none;
+}
+
+    .iap-popover__title {
+      font-weight: var(--iap-font-weights-medium);
+}
+
+    .iap-popover__title,.iap-popover__description {
+      font-size: var(--iap-font-sizes-sm);
+      line-height: 1.25rem;
+}
+
+    .iap-popover__description,.iap-popover__closeTrigger {
+      color: var(--iap-colors-fg-muted);
+}
+
+    .iap-menu__content {
+      background: var(--iap-colors-bg-default);
+      border-radius: var(--iap-radii-l2);
+      box-shadow: var(--iap-shadows-lg);
+      display: flex;
+      outline: var(--iap-borders-none);
+      width: calc(100% + 2rem);
+      z-index: var(--iap-z-index-dropdown);
+      flex-direction: column;
+}
+
+    .iap-menu__content:is([hidden]) {
+      display: none;
+}
+
+    .iap-menu__content:is([open], [data-open], [data-state="open"]) {
+      animation: fadeIn 0.25s ease-out;
+}
+
+    .iap-menu__content:is([closed], [data-closed], [data-state="closed"]) {
+      animation: fadeOut 0.2s ease-out;
+}
+
+    .iap-menu__item {
+      border-radius: var(--iap-radii-l1);
+      cursor: pointer;
+      display: flex;
+      font-size: var(--iap-font-sizes-sm);
+      line-height: 1.25rem;
+      align-items: center;
+      font-weight: var(--iap-font-weights-medium);
+      --transition-duration: var(--iap-durations-fast);
+      transition-duration: var(--iap-durations-fast);
+      --transition-prop: background, color;
+      transition-property: background, color;
+      --transition-easing: var(--iap-easings-default);
+      transition-timing-function: var(--iap-easings-default);
+}
+
+    .iap-menu__item[data-highlighted] {
+      background: var(--iap-colors-bg-muted);
+}
+
+    .iap-menu__item :where(svg) {
+      color: var(--iap-colors-fg-muted);
+}
+
+    .iap-menu__itemGroup {
+      display: flex;
+      flex-direction: column;
+}
+
+    .iap-menu__itemGroupLabel {
+      font-size: var(--iap-font-sizes-sm);
+      line-height: 1.25rem;
+      font-weight: var(--iap-font-weights-semibold);
+}
+
+    .iap-menu__positioner {
+      z-index: var(--iap-z-index-dropdown);
+}
+
+    .iap-menu__triggerItem {
+      border-radius: var(--iap-radii-l1);
+      cursor: pointer;
+      display: flex;
+      font-size: var(--iap-font-sizes-sm);
+      line-height: 1.25rem;
+      align-items: center;
+      font-weight: var(--iap-font-weights-medium);
+      --transition-duration: var(--iap-durations-fast);
+      transition-duration: var(--iap-durations-fast);
+      --transition-prop: background, color;
+      transition-property: background, color;
+      --transition-easing: var(--iap-easings-default);
+      transition-timing-function: var(--iap-easings-default);
+}
+
+    .iap-menu__triggerItem[data-highlighted] {
+      background: var(--iap-colors-bg-muted);
+}
+
+    .iap-menu__triggerItem :where(svg) {
+      color: var(--iap-colors-fg-muted);
+}
+
+    .iap-switchRecipe__root {
+      --iap-colors-color-palette-1: var(--iap-colors-accent-1);
+      --iap-colors-color-palette-2: var(--iap-colors-accent-2);
+      --iap-colors-color-palette-3: var(--iap-colors-accent-3);
+      --iap-colors-color-palette-4: var(--iap-colors-accent-4);
+      --iap-colors-color-palette-5: var(--iap-colors-accent-5);
+      --iap-colors-color-palette-6: var(--iap-colors-accent-6);
+      --iap-colors-color-palette-7: var(--iap-colors-accent-7);
+      --iap-colors-color-palette-8: var(--iap-colors-accent-8);
+      --iap-colors-color-palette-9: var(--iap-colors-accent-9);
+      --iap-colors-color-palette-10: var(--iap-colors-accent-10);
+      --iap-colors-color-palette-11: var(--iap-colors-accent-11);
+      --iap-colors-color-palette-12: var(--iap-colors-accent-12);
+      --iap-colors-color-palette-a1: var(--iap-colors-accent-a1);
+      --iap-colors-color-palette-a2: var(--iap-colors-accent-a2);
+      --iap-colors-color-palette-a3: var(--iap-colors-accent-a3);
+      --iap-colors-color-palette-a4: var(--iap-colors-accent-a4);
+      --iap-colors-color-palette-a5: var(--iap-colors-accent-a5);
+      --iap-colors-color-palette-a6: var(--iap-colors-accent-a6);
+      --iap-colors-color-palette-a7: var(--iap-colors-accent-a7);
+      --iap-colors-color-palette-a8: var(--iap-colors-accent-a8);
+      --iap-colors-color-palette-a9: var(--iap-colors-accent-a9);
+      --iap-colors-color-palette-a10: var(--iap-colors-accent-a10);
+      --iap-colors-color-palette-a11: var(--iap-colors-accent-a11);
+      --iap-colors-color-palette-a12: var(--iap-colors-accent-a12);
+      --iap-colors-color-palette-default: var(--iap-colors-accent-default);
+      --iap-colors-color-palette-emphasized: var(--iap-colors-accent-emphasized);
+      --iap-colors-color-palette-fg: var(--iap-colors-accent-fg);
+      --iap-colors-color-palette-text: var(--iap-colors-accent-text);
+      display: flex;
+      position: relative;
+      align-items: center;
+}
+
+    .iap-switchRecipe__label {
+      color: var(--iap-colors-fg-default);
+      font-weight: var(--iap-font-weights-medium);
+}
+
+    .iap-switchRecipe__control {
+      background: var(--iap-colors-bg-emphasized);
+      border-radius: var(--iap-radii-full);
+      cursor: pointer;
+      display: inline-flex;
+      align-items: center;
+      flex-shrink: 0;
+      --transition-duration: var(--iap-durations-normal);
+      transition-duration: var(--iap-durations-normal);
+      --transition-prop: background;
+      transition-property: background;
+      --transition-easing: var(--iap-easings-default);
+      transition-timing-function: var(--iap-easings-default);
+}
+
+    .iap-switchRecipe__control:is(:checked, [data-checked], [aria-checked=true], [data-state="checked"]) {
+      background: var(--iap-colors-color-palette-default);
+}
+
+    .iap-switchRecipe__thumb {
+      background: var(--iap-colors-bg-default);
+      border-radius: var(--iap-radii-full);
+      box-shadow: var(--iap-shadows-xs);
+      --transition-duration: var(--iap-durations-normal);
+      transition-duration: var(--iap-durations-normal);
+      --transition-prop: transform, background;
+      transition-property: transform, background;
+      --transition-easing: var(--iap-easings-default);
+      transition-timing-function: var(--iap-easings-default);
+}
+
+    .iap-switchRecipe__thumb:is(:checked, [data-checked], [aria-checked=true], [data-state="checked"]) {
+      transform: translateX(100%);
+}
+
+    :root .iap-switchRecipe__thumb:is(:checked, [data-checked], [aria-checked=true], [data-state="checked"]),.light .iap-switchRecipe__thumb:is(:checked, [data-checked], [aria-checked=true], [data-state="checked"]) {
+      background: var(--iap-colors-bg-default);
+}
+
+    .dark .iap-switchRecipe__thumb:is(:checked, [data-checked], [aria-checked=true], [data-state="checked"]) {
+      background: var(--iap-colors-color-palette-fg);
+}
+
+    .iap-field__root {
+      display: flex;
+      gap: var(--iap-spacing-1\.5);
+      flex-direction: column;
+}
+
+    .iap-field__errorText {
+      color: var(--iap-colors-fg-error);
+      display: inline-flex;
+      gap: var(--iap-spacing-2);
+      font-size: var(--iap-font-sizes-sm);
+      line-height: 1.25rem;
+      align-items: center;
+}
+
+    .iap-field__errorText:is(:disabled, [disabled], [data-disabled]) {
+      color: var(--iap-colors-fg-disabled);
+}
+
+    .iap-field__helperText {
+      color: var(--iap-colors-fg-muted);
+      font-size: var(--iap-font-sizes-sm);
+      line-height: 1.25rem;
+}
+
+    .iap-field__helperText:is(:disabled, [disabled], [data-disabled]) {
+      color: var(--iap-colors-fg-disabled);
+}
+
+    .iap-field__label {
+      color: var(--iap-colors-fg-default);
+      font-size: var(--iap-font-sizes-sm);
+      line-height: 1.25rem;
+      font-weight: var(--iap-font-weights-medium);
+}
+
+    .iap-field__label:is(:disabled, [disabled], [data-disabled]) {
+      color: var(--iap-colors-fg-disabled);
+}
+
     .iap-avatar__root {
       border-radius: var(--iap-radii-full);
       overflow: hidden;
@@ -5999,78 +6252,38 @@
       grid-area: header;
       padding-inline: var(--iap-spacing-4);
       padding-top: var(--iap-spacing-4);
-      padding-bottom: var(--iap-spacing-4);
-}
-
-    .iap-drawer__header,.iap-drawer__body {
-      display: flex;
-      flex-direction: column;
-}
-
-    .iap-drawer__body {
-      grid-area: body;
-      overflow: auto;
-      padding: var(--iap-spacing-4);
-}
-
-    .iap-drawer__footer {
-      display: flex;
-      grid-area: footer;
-      padding-block: var(--iap-spacing-4);
-      padding-inline: var(--iap-spacing-4);
-      justify-content: flex-end;
-}
-
-    .iap-editable__root {
-      display: flex;
-      gap: var(--iap-spacing-1\.5);
-      width: 100%;
-      flex-direction: column;
-}
-
-    .iap-editable__control {
-      display: flex;
-      gap: var(--iap-spacing-2);
-}
-
-    .iap-field__root {
-      display: flex;
-      gap: var(--iap-spacing-1\.5);
-      flex-direction: column;
-}
-
-    .iap-field__errorText {
-      color: var(--iap-colors-fg-error);
-      display: inline-flex;
-      gap: var(--iap-spacing-2);
-      font-size: var(--iap-font-sizes-sm);
-      line-height: 1.25rem;
-      align-items: center;
+      padding-bottom: var(--iap-spacing-4);
 }
 
-    .iap-field__errorText:is(:disabled, [disabled], [data-disabled]) {
-      color: var(--iap-colors-fg-disabled);
+    .iap-drawer__header,.iap-drawer__body {
+      display: flex;
+      flex-direction: column;
 }
 
-    .iap-field__helperText {
-      color: var(--iap-colors-fg-muted);
-      font-size: var(--iap-font-sizes-sm);
-      line-height: 1.25rem;
+    .iap-drawer__body {
+      grid-area: body;
+      overflow: auto;
+      padding: var(--iap-spacing-4);
 }
 
-    .iap-field__helperText:is(:disabled, [disabled], [data-disabled]) {
-      color: var(--iap-colors-fg-disabled);
+    .iap-drawer__footer {
+      display: flex;
+      grid-area: footer;
+      padding-block: var(--iap-spacing-4);
+      padding-inline: var(--iap-spacing-4);
+      justify-content: flex-end;
 }
 
-    .iap-field__label {
-      color: var(--iap-colors-fg-default);
-      font-size: var(--iap-font-sizes-sm);
-      line-height: 1.25rem;
-      font-weight: var(--iap-font-weights-medium);
+    .iap-editable__root {
+      display: flex;
+      gap: var(--iap-spacing-1\.5);
+      width: 100%;
+      flex-direction: column;
 }
 
-    .iap-field__label:is(:disabled, [disabled], [data-disabled]) {
-      color: var(--iap-colors-fg-disabled);
+    .iap-editable__control {
+      display: flex;
+      gap: var(--iap-spacing-2);
 }
 
     .iap-fieldset__root {
@@ -6240,92 +6453,6 @@
       animation: fadeOut 0.2s ease-out;
 }
 
-    .iap-menu__content {
-      background: var(--iap-colors-bg-default);
-      border-radius: var(--iap-radii-l2);
-      box-shadow: var(--iap-shadows-lg);
-      display: flex;
-      outline: var(--iap-borders-none);
-      width: calc(100% + 2rem);
-      z-index: var(--iap-z-index-dropdown);
-      flex-direction: column;
-}
-
-    .iap-menu__content:is([hidden]) {
-      display: none;
-}
-
-    .iap-menu__content:is([open], [data-open], [data-state="open"]) {
-      animation: fadeIn 0.25s ease-out;
-}
-
-    .iap-menu__content:is([closed], [data-closed], [data-state="closed"]) {
-      animation: fadeOut 0.2s ease-out;
-}
-
-    .iap-menu__item {
-      border-radius: var(--iap-radii-l1);
-      cursor: pointer;
-      display: flex;
-      font-size: var(--iap-font-sizes-sm);
-      line-height: 1.25rem;
-      align-items: center;
-      font-weight: var(--iap-font-weights-medium);
-      --transition-duration: var(--iap-durations-fast);
-      transition-duration: var(--iap-durations-fast);
-      --transition-prop: background, color;
-      transition-property: background, color;
-      --transition-easing: var(--iap-easings-default);
-      transition-timing-function: var(--iap-easings-default);
-}
-
-    .iap-menu__item[data-highlighted] {
-      background: var(--iap-colors-bg-muted);
-}
-
-    .iap-menu__item :where(svg) {
-      color: var(--iap-colors-fg-muted);
-}
-
-    .iap-menu__itemGroup {
-      display: flex;
-      flex-direction: column;
-}
-
-    .iap-menu__itemGroupLabel {
-      font-size: var(--iap-font-sizes-sm);
-      line-height: 1.25rem;
-      font-weight: var(--iap-font-weights-semibold);
-}
-
-    .iap-menu__positioner {
-      z-index: var(--iap-z-index-dropdown);
-}
-
-    .iap-menu__triggerItem {
-      border-radius: var(--iap-radii-l1);
-      cursor: pointer;
-      display: flex;
-      font-size: var(--iap-font-sizes-sm);
-      line-height: 1.25rem;
-      align-items: center;
-      font-weight: var(--iap-font-weights-medium);
-      --transition-duration: var(--iap-durations-fast);
-      transition-duration: var(--iap-durations-fast);
-      --transition-prop: background, color;
-      transition-property: background, color;
-      --transition-easing: var(--iap-easings-default);
-      transition-timing-function: var(--iap-easings-default);
-}
-
-    .iap-menu__triggerItem[data-highlighted] {
-      background: var(--iap-colors-bg-muted);
-}
-
-    .iap-menu__triggerItem :where(svg) {
-      color: var(--iap-colors-fg-muted);
-}
-
     .iap-numberInput__root {
       --iap-colors-color-palette-1: var(--iap-colors-accent-1);
       --iap-colors-color-palette-2: var(--iap-colors-accent-2);
@@ -6491,56 +6618,6 @@
       gap: var(--iap-spacing-2);
 }
 
-    .iap-popover__arrow {
-      --arrow-size: var(--sizes-3);
-      --arrow-background: var(--colors-bg-default);
-}
-
-    .iap-popover__arrowTip {
-      border-top-width: 1px;
-      border-left-width: 1px;
-}
-
-    .iap-popover__positioner {
-      position: relative;
-}
-
-    .iap-popover__content {
-      background: var(--iap-colors-bg-default);
-      border-radius: var(--iap-radii-l3);
-      box-shadow: var(--iap-shadows-lg);
-      display: flex;
-      max-width: var(--iap-sizes-sm);
-      z-index: var(--iap-z-index-popover);
-      padding: var(--iap-spacing-4);
-      flex-direction: column;
-}
-
-    .iap-popover__content:is([open], [data-open], [data-state="open"]) {
-      animation: fadeIn 0.25s ease-out;
-}
-
-    .iap-popover__content:is([closed], [data-closed], [data-state="closed"]) {
-      animation: fadeOut 0.2s ease-out;
-}
-
-    .iap-popover__content:is([hidden]) {
-      display: none;
-}
-
-    .iap-popover__title {
-      font-weight: var(--iap-font-weights-medium);
-}
-
-    .iap-popover__title,.iap-popover__description {
-      font-size: var(--iap-font-sizes-sm);
-      line-height: 1.25rem;
-}
-
-    .iap-popover__description,.iap-popover__closeTrigger {
-      color: var(--iap-colors-fg-muted);
-}
-
     .iap-progress__root {
       --iap-colors-color-palette-1: var(--iap-colors-accent-1);
       --iap-colors-color-palette-2: var(--iap-colors-accent-2);
@@ -7173,95 +7250,13 @@
       margin: min(1rem, 20%) 0;
 }
 
-    .iap-splitter__resizeTrigger[data-orientation=vertical] {
-      min-height: var(--iap-sizes-1\.5);
-      margin: 0 min(1rem, 20%);
-}
-
-    .iap-splitter__resizeTrigger:is(:active, [data-active]) {
-      background: var(--iap-colors-gray-8);
-}
-
-    .iap-switchRecipe__root {
-      --iap-colors-color-palette-1: var(--iap-colors-accent-1);
-      --iap-colors-color-palette-2: var(--iap-colors-accent-2);
-      --iap-colors-color-palette-3: var(--iap-colors-accent-3);
-      --iap-colors-color-palette-4: var(--iap-colors-accent-4);
-      --iap-colors-color-palette-5: var(--iap-colors-accent-5);
-      --iap-colors-color-palette-6: var(--iap-colors-accent-6);
-      --iap-colors-color-palette-7: var(--iap-colors-accent-7);
-      --iap-colors-color-palette-8: var(--iap-colors-accent-8);
-      --iap-colors-color-palette-9: var(--iap-colors-accent-9);
-      --iap-colors-color-palette-10: var(--iap-colors-accent-10);
-      --iap-colors-color-palette-11: var(--iap-colors-accent-11);
-      --iap-colors-color-palette-12: var(--iap-colors-accent-12);
-      --iap-colors-color-palette-a1: var(--iap-colors-accent-a1);
-      --iap-colors-color-palette-a2: var(--iap-colors-accent-a2);
-      --iap-colors-color-palette-a3: var(--iap-colors-accent-a3);
-      --iap-colors-color-palette-a4: var(--iap-colors-accent-a4);
-      --iap-colors-color-palette-a5: var(--iap-colors-accent-a5);
-      --iap-colors-color-palette-a6: var(--iap-colors-accent-a6);
-      --iap-colors-color-palette-a7: var(--iap-colors-accent-a7);
-      --iap-colors-color-palette-a8: var(--iap-colors-accent-a8);
-      --iap-colors-color-palette-a9: var(--iap-colors-accent-a9);
-      --iap-colors-color-palette-a10: var(--iap-colors-accent-a10);
-      --iap-colors-color-palette-a11: var(--iap-colors-accent-a11);
-      --iap-colors-color-palette-a12: var(--iap-colors-accent-a12);
-      --iap-colors-color-palette-default: var(--iap-colors-accent-default);
-      --iap-colors-color-palette-emphasized: var(--iap-colors-accent-emphasized);
-      --iap-colors-color-palette-fg: var(--iap-colors-accent-fg);
-      --iap-colors-color-palette-text: var(--iap-colors-accent-text);
-      display: flex;
-      position: relative;
-      align-items: center;
-}
-
-    .iap-switchRecipe__label {
-      color: var(--iap-colors-fg-default);
-      font-weight: var(--iap-font-weights-medium);
-}
-
-    .iap-switchRecipe__control {
-      background: var(--iap-colors-bg-emphasized);
-      border-radius: var(--iap-radii-full);
-      cursor: pointer;
-      display: inline-flex;
-      align-items: center;
-      flex-shrink: 0;
-      --transition-duration: var(--iap-durations-normal);
-      transition-duration: var(--iap-durations-normal);
-      --transition-prop: background;
-      transition-property: background;
-      --transition-easing: var(--iap-easings-default);
-      transition-timing-function: var(--iap-easings-default);
-}
-
-    .iap-switchRecipe__control:is(:checked, [data-checked], [aria-checked=true], [data-state="checked"]) {
-      background: var(--iap-colors-color-palette-default);
-}
-
-    .iap-switchRecipe__thumb {
-      background: var(--iap-colors-bg-default);
-      border-radius: var(--iap-radii-full);
-      box-shadow: var(--iap-shadows-xs);
-      --transition-duration: var(--iap-durations-normal);
-      transition-duration: var(--iap-durations-normal);
-      --transition-prop: transform, background;
-      transition-property: transform, background;
-      --transition-easing: var(--iap-easings-default);
-      transition-timing-function: var(--iap-easings-default);
-}
-
-    .iap-switchRecipe__thumb:is(:checked, [data-checked], [aria-checked=true], [data-state="checked"]) {
-      transform: translateX(100%);
-}
-
-    :root .iap-switchRecipe__thumb:is(:checked, [data-checked], [aria-checked=true], [data-state="checked"]),.light .iap-switchRecipe__thumb:is(:checked, [data-checked], [aria-checked=true], [data-state="checked"]) {
-      background: var(--iap-colors-bg-default);
+    .iap-splitter__resizeTrigger[data-orientation=vertical] {
+      min-height: var(--iap-sizes-1\.5);
+      margin: 0 min(1rem, 20%);
 }
 
-    .dark .iap-switchRecipe__thumb:is(:checked, [data-checked], [aria-checked=true], [data-state="checked"]) {
-      background: var(--iap-colors-color-palette-fg);
+    .iap-splitter__resizeTrigger:is(:active, [data-active]) {
+      background: var(--iap-colors-gray-8);
 }
 
     .iap-table__root {
@@ -7585,28 +7580,6 @@
       border-color: var(--iap-colors-border-disabled);
 }
 
-    .iap-tooltip__content {
-      background: var(--iap-colors-gray-a12);
-      border-radius: var(--iap-radii-l2);
-      box-shadow: var(--iap-shadows-sm);
-      color: var(--iap-colors-bg-default);
-      padding-inline: var(--iap-spacing-3);
-      padding-block: var(--iap-spacing-2);
-      font-size: var(--iap-font-sizes-xs);
-      line-height: 1.125rem;
-      max-width: var(--iap-sizes-2xs);
-      z-index: var(--iap-z-index-tooltip);
-      font-weight: var(--iap-font-weights-semibold);
-}
-
-    .iap-tooltip__content:is([open], [data-open], [data-state="open"]) {
-      animation: fadeIn 0.25s ease-out;
-}
-
-    .iap-tooltip__content:is([closed], [data-closed], [data-state="closed"]) {
-      animation: fadeOut 0.2s ease-out;
-}
-
     .iap-treeView__root {
       width: var(--iap-sizes-full);
 }
@@ -7749,46 +7722,46 @@
 }
 
     @media (hover: hover) and (pointer: fine) {
-      .iap-checkbox__control:is(:hover, [data-hover]) {
-        background: var(--iap-colors-bg-subtle);
-}
-
-      .iap-checkbox__control:is(:hover, [data-hover]):is(:checked, [data-checked], [aria-checked=true], [data-state="checked"]) {
-        background: var(--iap-colors-color-palette-default);
+      .iap-menu__item:is(:hover, [data-hover]) {
+        background: var(--iap-colors-bg-muted);
 }
 
-      .iap-checkbox__control:is(:hover, [data-hover]):is(:indeterminate, [data-indeterminate], [aria-checked=mixed], [data-state=indeterminate]) {
-        background: var(--iap-colors-color-palette-default);
+      .iap-menu__item:is(:hover, [data-hover]) :where(svg) {
+        color: var(--iap-colors-fg-default);
 }
 }
 
     @media (hover: hover) and (pointer: fine) {
-      .iap-combobox__item:is(:hover, [data-hover]) {
+      .iap-menu__triggerItem:is(:hover, [data-hover]) {
         background: var(--iap-colors-bg-muted);
 }
 
-      .iap-combobox__item:is(:hover, [data-hover]):is(:disabled, [disabled], [data-disabled]) {
-        background: var(--iap-colors-transparent);
+      .iap-menu__triggerItem:is(:hover, [data-hover]) :where(svg) {
+        color: var(--iap-colors-fg-default);
 }
 }
 
     @media (hover: hover) and (pointer: fine) {
-      .iap-menu__item:is(:hover, [data-hover]) {
-        background: var(--iap-colors-bg-muted);
+      .iap-checkbox__control:is(:hover, [data-hover]) {
+        background: var(--iap-colors-bg-subtle);
 }
 
-      .iap-menu__item:is(:hover, [data-hover]) :where(svg) {
-        color: var(--iap-colors-fg-default);
+      .iap-checkbox__control:is(:hover, [data-hover]):is(:checked, [data-checked], [aria-checked=true], [data-state="checked"]) {
+        background: var(--iap-colors-color-palette-default);
+}
+
+      .iap-checkbox__control:is(:hover, [data-hover]):is(:indeterminate, [data-indeterminate], [aria-checked=mixed], [data-state=indeterminate]) {
+        background: var(--iap-colors-color-palette-default);
 }
 }
 
     @media (hover: hover) and (pointer: fine) {
-      .iap-menu__triggerItem:is(:hover, [data-hover]) {
+      .iap-combobox__item:is(:hover, [data-hover]) {
         background: var(--iap-colors-bg-muted);
 }
 
-      .iap-menu__triggerItem:is(:hover, [data-hover]) :where(svg) {
-        color: var(--iap-colors-fg-default);
+      .iap-combobox__item:is(:hover, [data-hover]):is(:disabled, [disabled], [data-disabled]) {
+        background: var(--iap-colors-transparent);
 }
 }
 
@@ -7843,86 +7816,292 @@
 }
 }
 
-    @media (hover: hover) and (pointer: fine) {
-      .iap-segmentGroup__item:is(:hover, [data-hover]) {
-        color: var(--iap-colors-fg-default);
+    @media (hover: hover) and (pointer: fine) {
+      .iap-segmentGroup__item:is(:hover, [data-hover]) {
+        color: var(--iap-colors-fg-default);
+}
+
+      .iap-segmentGroup__item:is(:hover, [data-hover]):is(:checked, [data-checked], [aria-checked=true], [data-state="checked"]) {
+        color: var(--iap-colors-fg-default);
+}
+
+      .iap-segmentGroup__item:is(:hover, [data-hover]):is(:disabled, [disabled], [data-disabled]) {
+        color: var(--iap-colors-fg-disabled);
+}
+}
+
+    @media (hover: hover) and (pointer: fine) {
+      .iap-select__item:is(:hover, [data-hover]) {
+        background: var(--iap-colors-gray-a3);
+        color: var(--iap-colors-fg-default);
+}
+
+      .iap-select__item:is(:hover, [data-hover]):is(:disabled, [disabled], [data-disabled]) {
+        background: var(--iap-colors-transparent);
+        color: var(--iap-colors-fg-disabled);
+}
+}
+
+    @media (hover: hover) and (pointer: fine) {
+      .iap-splitter__resizeTrigger:is(:hover, [data-hover]) {
+        background: var(--iap-colors-gray-8);
+}
+}
+
+    @media (hover: hover) and (pointer: fine) {
+      .iap-tabs__trigger:is(:hover, [data-hover]) {
+        color: var(--iap-colors-fg-muted);
+}
+
+      .iap-tabs__trigger:is(:hover, [data-hover]):is(:disabled, [disabled], [data-disabled]) {
+        color: var(--iap-colors-fg-disabled);
+}
+
+      .iap-tabs__trigger:is(:hover, [data-hover]):is([aria-selected=true], [data-selected]) {
+        color: var(--iap-colors-fg-default);
+}
+}
+
+    @media (hover: hover) and (pointer: fine) {
+      .iap-toggleGroup__item:is(:hover, [data-hover]) {
+        background: var(--iap-colors-gray-a2);
+}
+
+      .iap-toggleGroup__item:is(:hover, [data-hover]):is([data-state="on"]) {
+        background: var(--iap-colors-gray-a3);
+}
+
+      .iap-toggleGroup__item:is(:hover, [data-hover]):is(:disabled, [disabled], [data-disabled]) {
+        background: var(--iap-colors-transparent);
+        color: var(--iap-colors-fg-disabled);
+        border-color: var(--iap-colors-border-disabled);
+}
+}
+
+    @media (hover: hover) and (pointer: fine) {
+      .iap-treeView__item:is(:hover, [data-hover]) {
+        background: var(--iap-colors-gray-a2);
+        color: var(--iap-colors-fg-default);
+}
+
+      .iap-treeView__item:is(:hover, [data-hover]):is([aria-selected=true], [data-selected]) {
+        background: var(--iap-colors-accent-a2);
+        color: var(--iap-colors-accent-text);
+}
+}
+
+    @media (hover: hover) and (pointer: fine) {
+      .iap-treeView__branchControl:is(:hover, [data-hover]) {
+        background: var(--iap-colors-gray-a2);
+        color: var(--iap-colors-fg-default);
+}
+}
+}
+
+  .iap-menu__content--size_md {
+    padding-block: var(--iap-spacing-1);
+    gap: var(--iap-spacing-1);
+}
+
+  .iap-menu__item--size_md {
+    height: var(--iap-sizes-10);
+    padding-inline: var(--iap-spacing-2\.5);
+    margin-inline: var(--iap-spacing-1);
+}
+
+  .iap-menu__item--size_md :where(svg) {
+    width: var(--iap-sizes-4);
+    height: var(--iap-sizes-4);
+}
+
+  .iap-menu__itemGroup--size_md {
+    gap: var(--iap-spacing-1);
+}
+
+  .iap-menu__itemGroupLabel--size_md {
+    padding-block: var(--iap-spacing-2\.5);
+    padding-inline: var(--iap-spacing-2\.5);
+    margin-inline: var(--iap-spacing-1);
+}
+
+  .iap-menu__triggerItem--size_md {
+    height: var(--iap-sizes-10);
+    padding-inline: var(--iap-spacing-2\.5);
+    margin-inline: var(--iap-spacing-1\.5);
+}
+
+  .iap-menu__triggerItem--size_md :where(svg) {
+    width: var(--iap-sizes-4);
+    height: var(--iap-sizes-4);
+}
+
+  .iap-menu__content--size_xs {
+    padding-block: var(--iap-spacing-1);
+    gap: var(--iap-spacing-1);
+}
+
+  .iap-menu__item--size_xs {
+    height: var(--iap-sizes-8);
+    padding-inline: var(--iap-spacing-1\.5);
+    margin-inline: var(--iap-spacing-1);
+}
+
+  .iap-menu__item--size_xs :where(svg) {
+    width: var(--iap-sizes-4);
+    height: var(--iap-sizes-4);
+}
+
+  .iap-menu__itemGroup--size_xs {
+    gap: var(--iap-spacing-1);
+}
+
+  .iap-menu__itemGroupLabel--size_xs {
+    padding-block: var(--iap-spacing-1\.5);
+}
+
+  .iap-menu__itemGroupLabel--size_xs,.iap-menu__triggerItem--size_xs {
+    padding-inline: var(--iap-spacing-1\.5);
+    margin-inline: var(--iap-spacing-1);
+}
+
+  .iap-menu__triggerItem--size_xs {
+    height: var(--iap-sizes-8);
+}
+
+  .iap-menu__triggerItem--size_xs :where(svg) {
+    width: var(--iap-sizes-4);
+    height: var(--iap-sizes-4);
+}
+
+  .iap-menu__content--size_sm {
+    padding-block: var(--iap-spacing-1);
+    gap: var(--iap-spacing-1);
+}
+
+  .iap-menu__item--size_sm {
+    height: var(--iap-sizes-9);
+    padding-inline: var(--iap-spacing-2);
+    margin-inline: var(--iap-spacing-1);
+}
+
+  .iap-menu__item--size_sm :where(svg) {
+    width: var(--iap-sizes-4);
+    height: var(--iap-sizes-4);
+}
+
+  .iap-menu__itemGroup--size_sm {
+    gap: var(--iap-spacing-1);
+}
+
+  .iap-menu__itemGroupLabel--size_sm {
+    padding-block: var(--iap-spacing-2);
+    padding-inline: var(--iap-spacing-2);
+    margin-inline: var(--iap-spacing-1);
+}
+
+  .iap-menu__triggerItem--size_sm {
+    height: var(--iap-sizes-9);
+    padding-inline: var(--iap-spacing-2);
+    margin-inline: var(--iap-spacing-1\.5);
+}
+
+  .iap-menu__triggerItem--size_sm :where(svg) {
+    width: var(--iap-sizes-4);
+    height: var(--iap-sizes-4);
 }
 
-      .iap-segmentGroup__item:is(:hover, [data-hover]):is(:checked, [data-checked], [aria-checked=true], [data-state="checked"]) {
-        color: var(--iap-colors-fg-default);
+  .iap-menu__content--size_lg {
+    padding-block: var(--iap-spacing-1);
+    gap: var(--iap-spacing-1);
 }
 
-      .iap-segmentGroup__item:is(:hover, [data-hover]):is(:disabled, [disabled], [data-disabled]) {
-        color: var(--iap-colors-fg-disabled);
-}
+  .iap-menu__item--size_lg {
+    height: var(--iap-sizes-11);
+    padding-inline: var(--iap-spacing-2\.5);
+    margin-inline: var(--iap-spacing-1);
 }
 
-    @media (hover: hover) and (pointer: fine) {
-      .iap-select__item:is(:hover, [data-hover]) {
-        background: var(--iap-colors-gray-a3);
-        color: var(--iap-colors-fg-default);
+  .iap-menu__item--size_lg :where(svg) {
+    width: var(--iap-sizes-5);
+    height: var(--iap-sizes-5);
 }
 
-      .iap-select__item:is(:hover, [data-hover]):is(:disabled, [disabled], [data-disabled]) {
-        background: var(--iap-colors-transparent);
-        color: var(--iap-colors-fg-disabled);
-}
+  .iap-menu__itemGroup--size_lg {
+    gap: var(--iap-spacing-1);
 }
 
-    @media (hover: hover) and (pointer: fine) {
-      .iap-splitter__resizeTrigger:is(:hover, [data-hover]) {
-        background: var(--iap-colors-gray-8);
-}
+  .iap-menu__itemGroupLabel--size_lg {
+    padding-block: var(--iap-spacing-2\.5);
+    padding-inline: var(--iap-spacing-2\.5);
+    margin-inline: var(--iap-spacing-1);
 }
 
-    @media (hover: hover) and (pointer: fine) {
-      .iap-tabs__trigger:is(:hover, [data-hover]) {
-        color: var(--iap-colors-fg-muted);
+  .iap-menu__triggerItem--size_lg {
+    height: var(--iap-sizes-11);
+    padding-inline: var(--iap-spacing-2\.5);
+    margin-inline: var(--iap-spacing-1\.5);
 }
 
-      .iap-tabs__trigger:is(:hover, [data-hover]):is(:disabled, [disabled], [data-disabled]) {
-        color: var(--iap-colors-fg-disabled);
+  .iap-menu__triggerItem--size_lg :where(svg) {
+    width: var(--iap-sizes-5);
+    height: var(--iap-sizes-5);
 }
 
-      .iap-tabs__trigger:is(:hover, [data-hover]):is([aria-selected=true], [data-selected]) {
-        color: var(--iap-colors-fg-default);
+  .iap-switchRecipe__root--size_md {
+    gap: var(--iap-spacing-3);
 }
+
+  .iap-switchRecipe__label--size_md {
+    font-size: var(--iap-font-sizes-md);
+    line-height: 1.5rem;
 }
 
-    @media (hover: hover) and (pointer: fine) {
-      .iap-toggleGroup__item:is(:hover, [data-hover]) {
-        background: var(--iap-colors-gray-a2);
+  .iap-switchRecipe__control--size_md {
+    width: var(--iap-sizes-9);
+    padding: var(--iap-spacing-0\.5);
 }
 
-      .iap-toggleGroup__item:is(:hover, [data-hover]):is([data-state="on"]) {
-        background: var(--iap-colors-gray-a3);
+  .iap-switchRecipe__thumb--size_md {
+    width: var(--iap-sizes-4);
+    height: var(--iap-sizes-4);
 }
 
-      .iap-toggleGroup__item:is(:hover, [data-hover]):is(:disabled, [disabled], [data-disabled]) {
-        background: var(--iap-colors-transparent);
-        color: var(--iap-colors-fg-disabled);
-        border-color: var(--iap-colors-border-disabled);
+  .iap-switchRecipe__root--size_sm {
+    gap: var(--iap-spacing-2);
 }
+
+  .iap-switchRecipe__label--size_sm {
+    font-size: var(--iap-font-sizes-sm);
+    line-height: 1.25rem;
 }
 
-    @media (hover: hover) and (pointer: fine) {
-      .iap-treeView__item:is(:hover, [data-hover]) {
-        background: var(--iap-colors-gray-a2);
-        color: var(--iap-colors-fg-default);
+  .iap-switchRecipe__control--size_sm {
+    width: var(--iap-sizes-7);
+    padding: var(--iap-spacing-0\.5);
 }
 
-      .iap-treeView__item:is(:hover, [data-hover]):is([aria-selected=true], [data-selected]) {
-        background: var(--iap-colors-accent-a2);
-        color: var(--iap-colors-accent-text);
+  .iap-switchRecipe__thumb--size_sm {
+    width: var(--iap-sizes-3);
+    height: var(--iap-sizes-3);
 }
+
+  .iap-switchRecipe__root--size_lg {
+    gap: var(--iap-spacing-4);
 }
 
-    @media (hover: hover) and (pointer: fine) {
-      .iap-treeView__branchControl:is(:hover, [data-hover]) {
-        background: var(--iap-colors-gray-a2);
-        color: var(--iap-colors-fg-default);
+  .iap-switchRecipe__label--size_lg {
+    font-size: var(--iap-font-sizes-lg);
+    line-height: 1.75rem;
 }
+
+  .iap-switchRecipe__control--size_lg {
+    width: var(--iap-sizes-11);
+    padding: var(--iap-spacing-0\.5);
 }
+
+  .iap-switchRecipe__thumb--size_lg {
+    width: var(--iap-sizes-5);
+    height: var(--iap-sizes-5);
 }
 
   .iap-avatar__root--size_md,.iap-avatar__image--size_md {
@@ -8214,172 +8393,23 @@
 }
 
   .iap-drawer__content--variant_right:is([open], [data-open], [data-state="open"]) {
-    animation: var(--iap-animations-drawer-in-right);
-}
-
-  .iap-drawer__content--variant_right:is([closed], [data-closed], [data-state="closed"]) {
-    animation: var(--iap-animations-drawer-out-right);
-}
-
-  .iap-drawer__positioner--variant_left {
-    left: var(--iap-spacing-0);
-}
-
-  .iap-drawer__content--variant_left:is([open], [data-open], [data-state="open"]) {
-    animation: var(--iap-animations-drawer-in-left);
-}
-
-  .iap-drawer__content--variant_left:is([closed], [data-closed], [data-state="closed"]) {
-    animation: var(--iap-animations-drawer-out-left);
-}
-
-  .iap-menu__content--size_md {
-    padding-block: var(--iap-spacing-1);
-    gap: var(--iap-spacing-1);
-}
-
-  .iap-menu__item--size_md {
-    height: var(--iap-sizes-10);
-    padding-inline: var(--iap-spacing-2\.5);
-    margin-inline: var(--iap-spacing-1);
-}
-
-  .iap-menu__item--size_md :where(svg) {
-    width: var(--iap-sizes-4);
-    height: var(--iap-sizes-4);
-}
-
-  .iap-menu__itemGroup--size_md {
-    gap: var(--iap-spacing-1);
-}
-
-  .iap-menu__itemGroupLabel--size_md {
-    padding-block: var(--iap-spacing-2\.5);
-    padding-inline: var(--iap-spacing-2\.5);
-    margin-inline: var(--iap-spacing-1);
-}
-
-  .iap-menu__triggerItem--size_md {
-    height: var(--iap-sizes-10);
-    padding-inline: var(--iap-spacing-2\.5);
-    margin-inline: var(--iap-spacing-1\.5);
-}
-
-  .iap-menu__triggerItem--size_md :where(svg) {
-    width: var(--iap-sizes-4);
-    height: var(--iap-sizes-4);
-}
-
-  .iap-menu__content--size_xs {
-    padding-block: var(--iap-spacing-1);
-    gap: var(--iap-spacing-1);
-}
-
-  .iap-menu__item--size_xs {
-    height: var(--iap-sizes-8);
-    padding-inline: var(--iap-spacing-1\.5);
-    margin-inline: var(--iap-spacing-1);
-}
-
-  .iap-menu__item--size_xs :where(svg) {
-    width: var(--iap-sizes-4);
-    height: var(--iap-sizes-4);
-}
-
-  .iap-menu__itemGroup--size_xs {
-    gap: var(--iap-spacing-1);
-}
-
-  .iap-menu__itemGroupLabel--size_xs {
-    padding-block: var(--iap-spacing-1\.5);
-}
-
-  .iap-menu__itemGroupLabel--size_xs,.iap-menu__triggerItem--size_xs {
-    padding-inline: var(--iap-spacing-1\.5);
-    margin-inline: var(--iap-spacing-1);
-}
-
-  .iap-menu__triggerItem--size_xs {
-    height: var(--iap-sizes-8);
-}
-
-  .iap-menu__triggerItem--size_xs :where(svg) {
-    width: var(--iap-sizes-4);
-    height: var(--iap-sizes-4);
-}
-
-  .iap-menu__content--size_sm {
-    padding-block: var(--iap-spacing-1);
-    gap: var(--iap-spacing-1);
-}
-
-  .iap-menu__item--size_sm {
-    height: var(--iap-sizes-9);
-    padding-inline: var(--iap-spacing-2);
-    margin-inline: var(--iap-spacing-1);
-}
-
-  .iap-menu__item--size_sm :where(svg) {
-    width: var(--iap-sizes-4);
-    height: var(--iap-sizes-4);
-}
-
-  .iap-menu__itemGroup--size_sm {
-    gap: var(--iap-spacing-1);
-}
-
-  .iap-menu__itemGroupLabel--size_sm {
-    padding-block: var(--iap-spacing-2);
-    padding-inline: var(--iap-spacing-2);
-    margin-inline: var(--iap-spacing-1);
-}
-
-  .iap-menu__triggerItem--size_sm {
-    height: var(--iap-sizes-9);
-    padding-inline: var(--iap-spacing-2);
-    margin-inline: var(--iap-spacing-1\.5);
-}
-
-  .iap-menu__triggerItem--size_sm :where(svg) {
-    width: var(--iap-sizes-4);
-    height: var(--iap-sizes-4);
-}
-
-  .iap-menu__content--size_lg {
-    padding-block: var(--iap-spacing-1);
-    gap: var(--iap-spacing-1);
-}
-
-  .iap-menu__item--size_lg {
-    height: var(--iap-sizes-11);
-    padding-inline: var(--iap-spacing-2\.5);
-    margin-inline: var(--iap-spacing-1);
-}
-
-  .iap-menu__item--size_lg :where(svg) {
-    width: var(--iap-sizes-5);
-    height: var(--iap-sizes-5);
+    animation: var(--iap-animations-drawer-in-right);
 }
 
-  .iap-menu__itemGroup--size_lg {
-    gap: var(--iap-spacing-1);
+  .iap-drawer__content--variant_right:is([closed], [data-closed], [data-state="closed"]) {
+    animation: var(--iap-animations-drawer-out-right);
 }
 
-  .iap-menu__itemGroupLabel--size_lg {
-    padding-block: var(--iap-spacing-2\.5);
-    padding-inline: var(--iap-spacing-2\.5);
-    margin-inline: var(--iap-spacing-1);
+  .iap-drawer__positioner--variant_left {
+    left: var(--iap-spacing-0);
 }
 
-  .iap-menu__triggerItem--size_lg {
-    height: var(--iap-sizes-11);
-    padding-inline: var(--iap-spacing-2\.5);
-    margin-inline: var(--iap-spacing-1\.5);
+  .iap-drawer__content--variant_left:is([open], [data-open], [data-state="open"]) {
+    animation: var(--iap-animations-drawer-in-left);
 }
 
-  .iap-menu__triggerItem--size_lg :where(svg) {
-    width: var(--iap-sizes-5);
-    height: var(--iap-sizes-5);
+  .iap-drawer__content--variant_left:is([closed], [data-closed], [data-state="closed"]) {
+    animation: var(--iap-animations-drawer-out-left);
 }
 
   .iap-numberInput__label--size_md {
@@ -8942,63 +8972,6 @@
     top: -15px;
 }
 
-  .iap-switchRecipe__root--size_md {
-    gap: var(--iap-spacing-3);
-}
-
-  .iap-switchRecipe__label--size_md {
-    font-size: var(--iap-font-sizes-md);
-    line-height: 1.5rem;
-}
-
-  .iap-switchRecipe__control--size_md {
-    width: var(--iap-sizes-9);
-    padding: var(--iap-spacing-0\.5);
-}
-
-  .iap-switchRecipe__thumb--size_md {
-    width: var(--iap-sizes-4);
-    height: var(--iap-sizes-4);
-}
-
-  .iap-switchRecipe__root--size_sm {
-    gap: var(--iap-spacing-2);
-}
-
-  .iap-switchRecipe__label--size_sm {
-    font-size: var(--iap-font-sizes-sm);
-    line-height: 1.25rem;
-}
-
-  .iap-switchRecipe__control--size_sm {
-    width: var(--iap-sizes-7);
-    padding: var(--iap-spacing-0\.5);
-}
-
-  .iap-switchRecipe__thumb--size_sm {
-    width: var(--iap-sizes-3);
-    height: var(--iap-sizes-3);
-}
-
-  .iap-switchRecipe__root--size_lg {
-    gap: var(--iap-spacing-4);
-}
-
-  .iap-switchRecipe__label--size_lg {
-    font-size: var(--iap-font-sizes-lg);
-    line-height: 1.75rem;
-}
-
-  .iap-switchRecipe__control--size_lg {
-    width: var(--iap-sizes-11);
-    padding: var(--iap-spacing-0\.5);
-}
-
-  .iap-switchRecipe__thumb--size_lg {
-    width: var(--iap-sizes-5);
-    height: var(--iap-sizes-5);
-}
-
   .iap-table__root--size_md {
     font-size: var(--iap-font-sizes-sm);
     line-height: 1.25rem;
@@ -9424,6 +9397,42 @@
     border-width: 0;
 }
 
+  .iap-offset_0 {
+    offset: 0;
+}
+
+  .iap-d_inline-block {
+    display: inline-block;
+}
+
+  .iap-px_1 {
+    padding-inline: var(--iap-spacing-1);
+}
+
+  .iap-cursor_help {
+    cursor: help;
+}
+
+  .iap-bg_neutral\.2 {
+    background: var(--iap-colors-neutral-2);
+}
+
+  .iap-bdr_xs {
+    border-radius: var(--iap-radii-xs);
+}
+
+  .iap-c_neutral\.11 {
+    color: var(--iap-colors-neutral-11);
+}
+
+  .iap-ta_center {
+    text-align: center;
+}
+
+  .iap-min-w_5 {
+    min-width: var(--iap-sizes-5);
+}
+
   .iap-d_flex {
     display: flex;
 }
@@ -9480,10 +9489,139 @@
     border-radius: 9999px;
 }
 
+  .iap-offset_-4 {
+    offset: -4px;
+}
+
+  .iap-z_600 {
+    z-index: 600;
+}
+
+  .iap-px_4 {
+    padding-inline: var(--iap-spacing-4);
+}
+
+  .iap-py_2 {
+    padding-block: var(--iap-spacing-2);
+}
+
+  .iap-bdr_sm {
+    border-radius: var(--iap-radii-sm);
+}
+
+  .iap-min-w_28 {
+    min-width: var(--iap-sizes-28);
+}
+
+  .iap-bx-sh_none {
+    box-shadow: none;
+}
+
+  .iap-z_1 {
+    z-index: 1;
+}
+
+  .iap-p_0 {
+    padding: var(--iap-spacing-0);
+}
+
+  .iap-w_auto {
+    width: auto;
+}
+
+  .iap-gap_0 {
+    gap: var(--iap-spacing-0);
+}
+
+  .iap-m_0 {
+    margin: var(--iap-spacing-0);
+}
+
+  .iap-px_3 {
+    padding-inline: var(--iap-spacing-3);
+}
+
+  .iap-bg_neutral\.3 {
+    background: var(--iap-colors-neutral-3);
+}
+
+  .iap-c_black {
+    color: var(--iap-colors-black);
+}
+
+  .iap-trunc_true {
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}
+
+  .iap-trunc_true,.iap-ov_hidden {
+    overflow: hidden;
+}
+
+  .iap-max-w_full {
+    max-width: var(--iap-sizes-full);
+}
+
+  .iap-w_fit-content {
+    width: fit-content;
+}
+
   .iap-anim_fade-in {
     animation: var(--iap-animations-fade-in);
 }
 
+  .iap-gap_0\.5 {
+    gap: var(--iap-spacing-0\.5);
+}
+
+  .iap-bg_surface\.default {
+    background: var(--iap-colors-surface-default);
+}
+
+  .iap-py_2\.5 {
+    padding-block: var(--iap-spacing-2\.5);
+}
+
+  .iap-min-w_48 {
+    min-width: var(--iap-sizes-48);
+}
+
+  .iap-gap_5 {
+    gap: var(--iap-spacing-5);
+}
+
+  .iap-px_2\.5 {
+    padding-inline: var(--iap-spacing-2\.5);
+}
+
+  .iap-w_full {
+    width: var(--iap-sizes-full);
+}
+
+  .iap-h_auto {
+    height: auto;
+}
+
+  .iap-c_neutral\.9 {
+    color: var(--iap-colors-neutral-9);
+}
+
+  .iap-w_3 {
+    width: var(--iap-sizes-3);
+}
+
+  .iap-w_5 {
+    width: var(--iap-sizes-5);
+}
+
+  .iap-h_5 {
+    height: var(--iap-sizes-5);
+}
+
+  .iap-w_49\% {
+    width: 49%;
+}
+
   .iap-fill_tomato\.11 {
     fill: var(--iap-colors-tomato-11);
 }
@@ -9591,6 +9729,10 @@
     color: var(--iap-colors-gray-12);
 }
 
+  .iap-w_14rem {
+    width: 14rem;
+}
+
   .iap-color-palette_current {
     --iap-colors-color-palette: var(--iap-colors-current);
 }
@@ -13729,6 +13871,14 @@
     --iap-colors-color-palette-a12: var(--iap-colors-neutral-dark-a12);
 }
 
+  .iap-color-palette_surface {
+    --iap-colors-color-palette-default: var(--iap-colors-surface-default);
+}
+
+  .iap-color-palette_touchable {
+    --iap-colors-color-palette-hover: var(--iap-colors-touchable-hover);
+}
+
   .iap-color-palette_accent {
     --iap-colors-color-palette-1: var(--iap-colors-accent-1);
     --iap-colors-color-palette-2: var(--iap-colors-accent-2);
@@ -13794,10 +13944,6 @@
     min-width: var(--iap-sizes-8);
 }
 
-  .iap-px_3 {
-    padding-inline: var(--iap-spacing-3);
-}
-
   .iap-p_3\.5 {
     padding: var(--iap-spacing-3\.5);
 }
@@ -13830,10 +13976,6 @@
     min-width: var(--iap-sizes-10);
 }
 
-  .iap-px_4 {
-    padding-inline: var(--iap-spacing-4);
-}
-
   .iap-p_4\.5 {
     padding: var(--iap-spacing-4\.5);
 }
@@ -13846,10 +13988,6 @@
     padding-inline: var(--iap-spacing-4\.5);
 }
 
-  .iap-px_2\.5 {
-    padding-inline: var(--iap-spacing-2\.5);
-}
-
   .iap-ai_center {
     align-items: center;
 }
@@ -13870,6 +14008,14 @@
     border-left-color: var(--iap-colors-transparent);
 }
 
+  .iap-ml_2 {
+    margin-left: var(--iap-spacing-2);
+}
+
+  .iap-lh_1\.2 {
+    line-height: 1.2;
+}
+
   .iap-flex-d_column {
     flex-direction: column;
 }
@@ -13882,6 +14028,62 @@
     padding-top: var(--iap-spacing-5);
 }
 
+  .iap-bd-w_thin {
+    border-width: thin;
+}
+
+  .iap-bd-c_neutral\.5 {
+    border-color: var(--iap-colors-neutral-5);
+}
+
+  .iap-bd-t-w_thin {
+    border-top-width: thin;
+}
+
+  .iap-bd-c_neutral\.6 {
+    border-color: var(--iap-colors-neutral-6);
+}
+
+  .iap-fw_normal {
+    font-weight: var(--iap-font-weights-normal);
+}
+
+  .iap-flex-g_1 {
+    flex-grow: 1;
+}
+
+  .iap-flex-sh_0 {
+    flex-shrink: 0;
+}
+
+  .iap-flex-g_0 {
+    flex-grow: 0;
+}
+
+  .iap-flex-d_row {
+    flex-direction: row;
+}
+
+  .iap-flex-wrap_nowrap {
+    flex-wrap: nowrap;
+}
+
+  .iap-ai_start {
+    align-items: start;
+}
+
+  .iap-fs_xs {
+    font-size: var(--iap-font-sizes-xs);
+}
+
+  .iap-fw_bold {
+    font-weight: var(--iap-font-weights-bold);
+}
+
+  .iap-pt_1px {
+    padding-top: 1px;
+}
+
   .iap-top_-1\.5 {
     top: calc(var(--iap-spacing-1\.5) * -1);
 }
@@ -13910,6 +14112,49 @@
     padding-top: var(--iap-spacing-4);
 }
 
+  .\[\&\[data-highlighted\]\]\:iap-bg_touchable\.hover[data-highlighted] {
+    background: var(--iap-colors-touchable-hover);
+}
+
+  .first\:iap-bd-t-w_0:first-child {
+    border-top-width: 0;
+}
+
+  .\[\&\[data-selected\=\"true\"\]\]\:iap-fw_bold[data-selected="true"] {
+    font-weight: var(--iap-font-weights-bold);
+}
+
+  .focusVisible\:iap-bg_neutral\.2:is(:focus-visible, [data-focus-visible]) {
+    background: var(--iap-colors-neutral-2);
+}
+
+  @media screen and (min-width: 40rem) {
+    .sm\:iap-offset_4 {
+      offset: 4px;
+}
+    .sm\:iap-offset_8 {
+      offset: 8px;
+}
+}
+
+  @media (hover: hover) and (pointer: fine) {
+    .hover\:iap-bg_neutral\.3:is(:hover, [data-hover]) {
+      background: var(--iap-colors-neutral-3);
+}
+}
+
+  @media (hover: hover) and (pointer: fine) {
+    .hover\:iap-bg_neutral\.2:is(:hover, [data-hover]) {
+      background: var(--iap-colors-neutral-2);
+}
+}
+
+  @media (hover: hover) and (pointer: fine) {
+    .hover\:iap-bg_touchable\.hover:is(:hover, [data-hover]) {
+      background: var(--iap-colors-touchable-hover);
+}
+}
+
   @media (hover: hover) and (pointer: fine) {
     .hover\:iap-bg_revert-layer:is(:hover, [data-hover]) {
       background: revert-layer;