@infonomic/uikit 6.1.0 → 6.2.0

package/dist/components/inputs/input.module.css

@@ -160,6 +160,13 @@ infonomic-components;
     border-bottom: 1px solid var(--input-variant-underlined-hover-border);
   }
 
+  .underlined:focus,
+  .underlined:active,
+  :global(.infonomic-input-underlined):focus,
+  :global(.infonomic-input-underlined):active {
+    outline: none;
+  }
+
   .filled,
   :global(.infonomic-input-filled) {
     background-color: var(--input-variant-filled);

package/dist/components/inputs/input_module.css

@@ -137,6 +137,10 @@
     border-bottom: 1px solid var(--input-variant-underlined-hover-border);
   }
 
+  :is(.underlined-CSLRKX:focus, .underlined-CSLRKX:active, .infonomic-input-underlined:focus, .infonomic-input-underlined:active) {
+    outline: none;
+  }
+
   :is(.filled-zNQ9B3, .infonomic-input-filled) {
     background-color: var(--input-variant-filled);
   }

package/dist/components/inputs/text-area.module.css

@@ -1,11 +1,12 @@
 @layer infonomic-base,
-  infonomic-functional,
-  infonomic-utilities,
-  infonomic-theme,
-  infonomic-typography,
-  infonomic-components;
+infonomic-functional,
+infonomic-utilities,
+infonomic-theme,
+infonomic-typography,
+infonomic-components;
 
 @layer infonomic-components {
+
   .text-area,
   :global(.infonomic-text-area) {
     font-size: 1rem;
@@ -19,9 +20,14 @@
     padding-right: 0;
   }
 
-  .outlined {
+  .underlined:focus,
+  .underlined:active,
+  :global(.infonomic-text-area--underlined):focus,
+  :global(.infonomic-text-area--underlined):active {
+    outline: none;
   }
 
-  .filled {
-  }
-}
+  .outlined {}
+
+  .filled {}
+}

package/dist/components/inputs/text-area_module.css

@@ -11,5 +11,9 @@
     padding-left: 0;
     padding-right: 0;
   }
+
+  :is(.underlined-TE6gDa:focus, .underlined-TE6gDa:active, .infonomic-text-area--underlined:focus, .infonomic-text-area--underlined:active) {
+    outline: none;
+  }
 }
 

package/dist/styles/components-vanilla.css

@@ -1 +1 @@
-@layer infonomic-base,infonomic-functional,infonomic-utilities,infonomic-theme,infonomic-typography;@layer infonomic-components{:is(.card-mqJaiW,.infonomic-card){width:100%;max-width:100%;color:var(--foreground);background:var(--canvas-25);border-width:var(--border-width-thin);border-color:var(--border-color);border-style:var(--border-style-solid);border-radius:var(--border-radius-md);box-shadow:var(--shadow-sm);flex-direction:column;text-decoration:none;display:flex}:is(:is(.dark,[data-theme=dark]) .card-mqJaiW,:is(.dark,[data-theme=dark]) .infonomic-card){background:var(--canvas-800)}:is(.card-hover-hvT4d6,.infonomic-card-hover){transition:background .2s ease-in-out}:is(.card-hover-hvT4d6:hover,.infonomic-card-hover:hover){background:oklch(from var(--theme-50) 1 .03 h)}:is(:is(.dark,[data-theme=dark]) .card-hover-hvT4d6:hover,:is(.dark,[data-theme=dark]) .infonomic-card-hover:hover){background:oklch(from var(--canvas-800) .2 c h)}:is(.card-header-XnoBkP,.infonomic-card-header){flex-direction:column;gap:.5rem;padding:1rem;display:flex}:is(.card-title-JI7Lu3,.infonomic-card-title){color:var(--headings);letter-spacing:-.015em;font-size:1.8rem;font-weight:700;line-height:1}:is(.card-description-fwu7HE,.infonomic-card-description){color:var(--muted);font-size:.875rem}:is(.card-content-uhoZYJ,.infonomic-card-content){flex:1;padding:0 1rem 1rem}:is(.card-footer-BxTa4b,.infonomic-card-footer){align-items:center;padding:0 1rem 1rem;display:flex}:is(.container-tSpizY,.infonomic-container){width:100%;max-width:60rem;margin:0 auto;padding:0 1rem}@media (width>=66rem){:is(.container-tSpizY,.infonomic-container){max-width:64rem}}@media (width>=77rem){:is(.container-tSpizY,.infonomic-container){max-width:74.375rem}}@media (width>=94rem){:is(.container-tSpizY,.infonomic-container){max-width:87.5rem}}:is(.badge-8xVidp,.infonomic-badge){font-size:var(--font-size-sm);text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:var(--border-radius-sm);padding:.25em .4em;font-weight:400;line-height:1;display:inline-block}:is(.primary-oZyR_M,.infonomic-badge-primary){color:var(--text-on-primary-strong);background-color:var(--fill-primary-strong)}:is(.secondary-VsqJTm,.infonomic-badge-secondary){color:var(--text-on-secondary-strong);background-color:var(--fill-secondary-strong)}:is(.noeffect-R8eJtO,.infonomic-badge-noeffect){color:var(--text-on-noeffect-strong);background-color:var(--fill-noeffect-strong)}:is(.success-h2otET,.infonomic-badge-success){color:var(--text-on-success-strong);background-color:var(--fill-success-strong)}:is(.info-OG3F3u,.infonomic-badge-info){color:var(--text-on-info-strong);background-color:var(--fill-info-strong)}:is(.warning-zTXksZ,.infonomic-badge-warning){color:var(--text-on-warning-strong);background-color:var(--fill-warning-strong)}:is(.danger-hKF7l_,.infonomic-badge-danger){color:var(--text-on-danger-strong);background-color:var(--fill-danger-strong)}:is(.button-IjDhC0,.infonomic-button){cursor:pointer;text-align:center;gap:var(--gap-2);white-space:nowrap;outline-offset:2px;transition:background-color var(--transition-normal), outline-color var(--transition-normal);border-radius:var(--border-radius-sm);border:none;outline:1px solid #0000;justify-content:center;align-items:center;font-weight:400;line-height:0;display:inline-flex}:is(.button-IjDhC0:disabled,.button-IjDhC0[disabled],.infonomic-button:disabled,.infonomic-button[disabled]){pointer-events:none}:is(.button-IjDhC0:focus,.button-IjDhC0:active,.infonomic-button:focus,.infonomic-button:active){outline-color:var(--ring-color)}.button-IjDhC0.square-P_6yde,.infonomic-button-square{aspect-ratio:1;border-radius:var(--border-radius-sm);padding:0}.button-IjDhC0.round-uqus3n,.infonomic-button-round{aspect-ratio:1;border-radius:var(--border-radius-full);padding:0}:is(.xs-jxTd5R,.infonomic-button-xs){min-height:26px;padding:.2rem .4rem;font-size:.7rem}:is(.sm-uD_Ugt,.infonomic-button-sm){min-height:32px;padding:.25rem .5rem;font-size:.775rem}:is(.md-Qp9ad6,.infonomic-button-md){min-height:38px;padding:.625rem 1.25rem;font-size:.95rem}:is(.lg-FAYTen,.infonomic-button-lg){min-height:46px;padding:.75rem 1.5rem;font-size:1.1rem}:is(.xl-Gwvhl4,.infonomic-button-xl){min-height:54px;padding:.75rem 1.5rem;font-size:1.2rem}:is(.filled-CwGsrO,.infonomic-button-filled){color:var(--button-variant-filled-foreground);background-color:var(--button-variant-filled)}:is(.filled-CwGsrO:hover,.infonomic-button-filled:hover){background-color:var(--button-variant-filled-hover)}:is(.filled-CwGsrO:focus,.filled-CwGsrO:active,.infonomic-button-filled:focus,.infonomic-button-filled:active){--ring-color:var(--button-ring-color)}:is(.filled-CwGsrO:disabled,.filled-CwGsrO[disabled],.infonomic-button-filled:disabled,.infonomic-button-filled[disabled]){background-color:var(--button-variant-filled-disabled,oklch(from var(--button-variant-filled) calc(l * 1.1) calc(c * .85) h));color:var(--button-variant-filled-foreground-disabled,oklch(from var(--button-variant-filled-foreground) calc(l * .9) calc(c * .85) h))}:is(.filled-weak-QLU8bA,.infonomic-button-filled-weak){color:var(--button-variant-filled-weak-foreground);background-color:var(--button-variant-filled-weak)}:is(.filled-weak-QLU8bA:hover,.infonomic-button-filled-weak:hover){background-color:var(--button-variant-filled-weak-hover)}:is(.filled-weak-QLU8bA:focus,.filled-weak-QLU8bA:active,.infonomic-button-filled-weak:focus,.infonomic-button-filled-weak:active){--ring-color:var(--button-ring-color)}:is(.filled-weak-QLU8bA:disabled,.filled-weak-QLU8bA[disabled],.infonomic-button-filled-weak:disabled,.infonomic-button-filled-weak[disabled]){background-color:var(--button-variant-filled-weak-disabled,oklch(from var(--button-variant-filled-weak) calc(l * 1.1) calc(c * .85) h));color:var(--button-variant-filled-weak-foreground-disabled,oklch(from var(--button-variant-filled-weak-foreground) calc(l * .9) calc(c * .85) h))}:is(.outlined-nZGbxu,.infonomic-button-outlined){border:1px solid var(--button-variant-outlined-border);color:var(--button-variant-outlined-foreground);background-color:var(--button-variant-outlined)}:is(.outlined-nZGbxu:disabled,.outlined-nZGbxu[disabled],.infonomic-button-outlined:disabled,.infonomic-button-outlined[disabled]){border-color:var(--button-variant-outlined-border-disabled,oklch(from var(--button-variant-outlined-border) calc(l * 1.5) calc(c * .8) h));color:var(--button-variant-outlined-foreground-disabled,oklch(from var(--button-variant-outlined-foreground) calc(l * 1.1) calc(c * .7) h))}:is(.outlined-nZGbxu:hover,.infonomic-button-outlined:hover){background-color:var(--button-variant-outlined-hover)}:is(.outlined-nZGbxu:focus,.outlined-nZGbxu:active,.infonomic-button-outlined:focus,.infonomic-button-outlined:active){--ring-color:var(--button-ring-color)}:is(.gradient-ySC3O3,.infonomic-button-gradient){color:var(--button-variant-gradient-foreground);background:linear-gradient(45deg, var(--button-variant-gradient-start), var(--button-variant-gradient-end))}:is(.gradient-ySC3O3:disabled,.gradient-ySC3O3[disabled],.infonomic-button-gradient:disabled,.infonomic-button-gradient[disabled]){background:unset;background-color:var(--button-variant-gradient-disabled,oklch(from var(--button-variant-gradient-end) calc(l * 1.2) calc(c * .85) h));color:var(--button-variant-gradient-foreground-disabled,oklch(from var(--button-variant-gradient-foreground) calc(l * .9) calc(c * .85) h))}:is(.gradient-ySC3O3:hover,.infonomic-button-gradient:hover){color:var(--button-variant-gradient-foreground);background:linear-gradient(45deg, var(--button-variant-gradient-start), var(--button-variant-gradient-end))}:is(.gradient-ySC3O3:focus,.gradient-ySC3O3:active,.infonomic-button-gradient:focus,.infonomic-button-gradient:active){--ring-color:var(--button-ring-color)}:is(.text-GaxlcE,.infonomic-button-text){background-color:var(--button-variant-text);color:var(--button-variant-text-foreground)}:is(.text-GaxlcE:disabled,.text-GaxlcE[disabled],.infonomic-button-text:disabled,.infonomic-button-text[disabled]){color:oklch(from var(--button-variant-text-foreground) calc(l * 1.5) calc(c * .5) h)}:is(.text-GaxlcE:hover,.infonomic-button-text:hover){background-color:var(--button-variant-text-hover)}:is(.text-GaxlcE:focus,.text-GaxlcE:active,.infonomic-button-text:focus,.infonomic-button-text:active){--ring-color:var(--button-ring-color)}:is(.primary-tUmczz,.infonomic-button-primary){--button-ring-color:var(--ring-primary);--button-variant-filled:var(--fill-primary-strong);--button-variant-filled-hover:var(--fill-primary-strong-hover);--button-variant-filled-disabled:var(--fill-primary-strong-disabled);--button-variant-filled-foreground:var(--text-on-primary-strong);--button-variant-filled-foreground-disabled:var(--text-on-primary-strong-disabled);--button-variant-filled-weak:var(--fill-primary-weak);--button-variant-filled-weak-hover:var(--fill-primary-weak-hover);--button-variant-filled-weak-disabled:var(--fill-primary-weak-disabled);--button-variant-filled-weak-foreground:var(--text-on-primary-weak);--button-variant-filled-weak-foreground-disabled:var(--text-on-primary-weak-disabled);--button-variant-outlined:var(--fill-primary-outlined);--button-variant-outlined-hover:var(--fill-primary-outlined-hover);--button-variant-outlined-border:var(--stroke-primary);--button-variant-outlined-border-disabled:var(--stroke-primary-disabled);--button-variant-outlined-foreground:var(--text-on-primary-outlined);--button-variant-outlined-foreground-disabled:var(--text-on-primary-outlined-disabled);--button-variant-text:var(--fill-primary-text);--button-variant-text-hover:var(--fill-primary-text-hover);--button-variant-text-foreground:var(--text-primary);--button-variant-gradient-start:var(--gradient-primary-start);--button-variant-gradient-end:var(--gradient-primary-end);--button-variant-gradient-foreground:var(--gradient-primary-foreground);--button-variant-gradient-disabled:var(--gradient-primary-disabled);--button-variant-gradient-foreground-disabled:var(--text-on-primary-disabled)}:is(.secondary-UqT2AY,.infonomic-button-secondary){--button-ring-color:var(--ring-secondary);--button-variant-filled:var(--fill-secondary-strong);--button-variant-filled-hover:var(--fill-secondary-strong-hover);--button-variant-filled-disabled:var(--fill-secondary-strong-disabled);--button-variant-filled-foreground:var(--text-on-secondary-strong);--button-variant-filled-foreground-disabled:var(--text-on-secondary-strong-disabled);--button-variant-filled-weak:var(--fill-secondary-weak);--button-variant-filled-weak-hover:var(--fill-secondary-weak-hover);--button-variant-filled-weak-disabled:var(--fill-secondary-weak-disabled);--button-variant-filled-weak-foreground:var(--text-on-secondary-weak);--button-variant-filled-weak-foreground-disabled:var(--text-on-secondary-weak-disabled);--button-variant-outlined:var(--fill-secondary-outlined);--button-variant-outlined-border:var(--stroke-secondary);--button-variant-outlined-border-disabled:var(--stroke-secondary-disabled);--button-variant-outlined-hover:var(--fill-secondary-outlined-hover);--button-variant-outlined-foreground:var(--text-on-secondary-outlined);--button-variant-outlined-foreground-disabled:var(--text-on-secondary-outlined-disabled);--button-variant-text:var(--fill-secondary-text);--button-variant-text-hover:var(--fill-secondary-text-hover);--button-variant-text-foreground:var(--text-secondary);--button-variant-gradient-start:var(--gradient-secondary-start);--button-variant-gradient-end:var(--gradient-secondary-end);--button-variant-gradient-foreground:var(--gradient-secondary-foreground);--button-variant-gradient-disabled:var(--gradient-secondary-disabled);--button-variant-gradient-foreground-disabled:var(--text-on-secondary-disabled)}:is(.noeffect-fpxSgg,.infonomic-button-noeffect){--button-ring-color:var(--ring-noeffect);--button-variant-filled:var(--fill-noeffect-strong);--button-variant-filled-hover:var(--fill-noeffect-strong-hover);--button-variant-filled-disabled:var(--fill-noeffect-strong-disabled);--button-variant-filled-foreground:var(--text-on-noeffect-strong);--button-variant-filled-foreground-disabled:var(--text-on-noeffect-strong-disabled);--button-variant-filled-weak:var(--fill-noeffect-weak);--button-variant-filled-weak-hover:var(--fill-noeffect-weak-hover);--button-variant-filled-weak-disabled:var(--fill-noeffect-weak-disabled);--button-variant-filled-weak-foreground:var(--text-on-noeffect-weak);--button-variant-filled-weak-foreground-disabled:var(--text-on-noeffect-weak-disabled);--button-variant-outlined:var(--fill-noeffect-outlined);--button-variant-outlined-hover:var(--fill-noeffect-outlined-hover);--button-variant-outlined-disabled:var(--fill-noeffect-outlined-disabled);--button-variant-outlined-border:var(--stroke-noeffect);--button-variant-outlined-border-disabled:var(--stroke-noeffect-disabled);--button-variant-outlined-foreground:var(--text-on-noeffect-outlined);--button-variant-outlined-foreground-disabled:var(--text-on-noeffect-disabled);--button-variant-text:var(--fill-noeffect-text);--button-variant-text-hover:var(--fill-noeffect-text-hover);--button-variant-text-foreground:var(--text-noeffect);--button-variant-gradient-start:var(--gradient-noeffect-start);--button-variant-gradient-end:var(--gradient-noeffect-end);--button-variant-gradient-foreground:var(--gradient-noeffect-foreground);--button-variant-gradient-disabled:var(--gradient-noeffect-disabled);--button-variant-gradient-foreground-disabled:var(--text-on-noeffect-disabled)}:is(.success-fTNDEn,.infonomic-button-success){--button-ring-color:var(--ring-success);--button-variant-filled:var(--fill-success-strong);--button-variant-filled-hover:var(--fill-success-strong-hover);--button-variant-filled-disabled:var(--fill-success-strong-disabled);--button-variant-filled-foreground:var(--text-on-success-strong);--button-variant-filled-foreground-disabled:var(--text-on-success-strong-disabled);--button-variant-filled-weak:var(--fill-success-weak);--button-variant-filled-weak-hover:var(--fill-success-weak-hover);--button-variant-filled-weak-disabled:var(--fill-success-weak-disabled);--button-variant-filled-weak-foreground:var(--text-on-success-weak);--button-variant-filled-weak-foreground-disabled:var(--text-on-success-weak-disabled);--button-variant-outlined:var(--fill-success-outlined);--button-variant-outlined-hover:var(--fill-success-outlined-hover);--button-variant-outlined-border:var(--stroke-success);--button-variant-outlined-border-disabled:var(--stroke-success-disabled);--button-variant-outlined-foreground:var(--text-on-success-outlined);--button-variant-outlined-foreground-disabled:var(--text-on-success-outlined-disabled);--button-variant-text:transparent;--button-variant-text-hover:var(--fill-success-text-hover);--button-variant-text-foreground:var(--text-success);--button-variant-gradient-start:var(--gradient-success-start);--button-variant-gradient-end:var(--gradient-success-end);--button-variant-gradient-foreground:var(--gradient-success-foreground);--button-variant-gradient-disabled:var(--gradient-success-disabled);--button-variant-gradient-foreground-disabled:var(--text-on-success-disabled)}:is(.info-qrdXQD,.infonomic-button-info){--button-ring-color:var(--ring-info);--button-variant-filled:var(--fill-info-strong);--button-variant-filled-hover:var(--fill-info-strong-hover);--button-variant-filled-disabled:var(--fill-info-strong-disabled);--button-variant-filled-foreground:var(--text-on-info-strong);--button-variant-filled-foreground-disabled:var(--text-on-info-strong-disabled);--button-variant-filled-weak:var(--fill-info-weak);--button-variant-filled-weak-hover:var(--fill-info-weak-hover);--button-variant-filled-weak-disabled:var(--fill-info-weak-disabled);--button-variant-filled-weak-foreground:var(--text-on-info-weak);--button-variant-filled-weak-foreground-disabled:var(--text-on-info-weak-disabled);--button-variant-outlined:transparent;--button-variant-outlined-hover:var(--fill-info-outlined-hover);--button-variant-outlined-border:var(--stroke-info);--button-variant-outlined-border-disabled:var(--stroke-info-disabled);--button-variant-outlined-foreground:var(--text-on-info-outlined);--button-variant-outlined-foreground-disabled:var(--text-on-info-outlined-disabled);--button-variant-text:transparent;--button-variant-text-hover:var(--fill-info-text-hover);--button-variant-text-foreground:var(--text-info);--button-variant-gradient-start:var(--gradient-info-start);--button-variant-gradient-end:var(--gradient-info-end);--button-variant-gradient-foreground:var(--gradient-info-foreground);--button-variant-gradient-disabled:var(--gradient-info-disabled);--button-variant-gradient-foreground-disabled:var(--text-on-info-disabled)}:is(.warning-a00T3A,.infonomic-button-warning){--button-ring-color:var(--ring-warning);--button-variant-filled:var(--fill-warning-strong);--button-variant-filled-hover:var(--fill-warning-strong-hover);--button-variant-filled-disabled:var(--fill-warning-strong-disabled);--button-variant-filled-foreground:var(--text-on-warning-strong);--button-variant-filled-foreground-disabled:var(--text-on-warning-strong-disabled);--button-variant-filled-weak:var(--fill-warning-weak);--button-variant-filled-weak-hover:var(--fill-warning-weak-hover);--button-variant-filled-weak-disabled:var(--fill-warning-weak-disabled);--button-variant-filled-weak-foreground:var(--text-on-warning-weak);--button-variant-filled-weak-foreground-disabled:var(--text-on-warning-weak-disabled);--button-variant-outlined:var(--fill-warning-outlined);--button-variant-outlined-hover:var(--fill-warning-outlined-hover);--button-variant-outlined-border:var(--stroke-warning);--button-variant-outlined-border-disabled:var(--stroke-warning-disabled);--button-variant-outlined-foreground:var(--text-on-warning-outlined);--button-variant-outlined-foreground-disabled:var(--text-on-warning-outlined-disabled);--button-variant-text:transparent;--button-variant-text-hover:var(--fill-warning-text-hover);--button-variant-text-foreground:var(--text-warning);--button-variant-gradient-start:var(--gradient-warning-start);--button-variant-gradient-end:var(--gradient-warning-end);--button-variant-gradient-foreground:var(--gradient-warning-foreground);--button-variant-gradient-disabled:var(--gradient-warning-disabled);--button-variant-gradient-foreground-disabled:var(--text-on-warning-disabled)}:is(.danger-rwIV_i,.infonomic-button-danger){--button-ring-color:var(--ring-danger);--button-variant-filled:var(--fill-danger-strong);--button-variant-filled-hover:var(--fill-danger-strong-hover);--button-variant-filled-disabled:var(--fill-danger-strong-disabled);--button-variant-filled-foreground:var(--text-on-danger-strong);--button-variant-filled-foreground-disabled:var(--text-on-danger-strong-disabled);--button-variant-filled-weak:var(--fill-danger-weak);--button-variant-filled-weak-hover:var(--fill-danger-weak-hover);--button-variant-filled-weak-disabled:var(--fill-danger-weak-disabled);--button-variant-filled-weak-foreground:var(--text-on-danger-weak);--button-variant-filled-weak-foreground-disabled:var(--text-on-danger-weak-disabled);--button-variant-outlined:transparent;--button-variant-outlined-hover:var(--fill-danger-outlined-hover);--button-variant-outlined-border:var(--stroke-danger);--button-variant-outlined-border-disabled:var(--stroke-danger-disabled);--button-variant-outlined-foreground:var(--text-on-danger-outlined);--button-variant-outlined-foreground-disabled:var(--text-on-danger-outlined-disabled);--button-variant-text:transparent;--button-variant-text-hover:var(--fill-danger-text-hover);--button-variant-text-foreground:var(--text-danger);--button-variant-gradient-start:var(--gradient-danger-start);--button-variant-gradient-end:var(--gradient-danger-end);--button-variant-gradient-foreground:var(--gradient-danger-foreground);--button-variant-gradient-disabled:var(--gradient-danger-disabled);--button-variant-gradient-foreground-disabled:var(--text-on-danger-disabled)}:is(.fullWidth-wXvP0v,.infonomic-button-full-width){width:100%;display:flex}:is(.button-group-uqvOi8,.infonomic-button-group){place-items:center;gap:var(--gap-2);flex-direction:column;display:flex}@media screen and (width>=40rem){:is(.button-group-uqvOi8,.infonomic-button-group){flex-direction:row}}:is(.copy-button-container-vCNz8o,.infonomic-copy-button-container){display:inline-block}:is(.copy-button-oa4bdj svg,.infonomic-copy-button svg){width:90%;height:90%;display:block}:is(.xs-lZmf78,.infonomic-copy-button-xs){width:26px;height:26px;min-height:26px;padding:.25rem}:is(.sm-KNN1e5,.infonomic-copy-button-sm){width:32px;height:32px;min-height:32px;padding:.35rem}:is(.md-OoH0l4,.infonomic-copy-button-md){width:38px;height:38px;min-height:38px;padding:.45rem}:is(.lg-uu5ujz,.infonomic-copy-button-lg){width:46px;height:46px;min-height:46px;padding:.55rem}:is(.xl-pFYyrS,.infonomic-copy-button-xl){width:54px;height:54px;min-height:54px;padding:.65rem}:is(.input-wrapper-OJAKML,.infonomic-input-wrapper){gap:var(--gap-1);flex-direction:column;display:flex}:is(.input-container-bU4yD2,.infonomic-input-container){align-items:center;gap:var(--gap-2);width:100%;padding:0;display:flex;position:relative}:is(.input-IWjcip,.infonomic-input){outline-offset:2px;gap:var(--gap-2);width:100%;transition:all var(--transition-normal);border-radius:var(--border-radius-sm);border:none;outline:1px solid #0000;align-items:center;font-weight:400;display:inline-flex}:is(.input-IWjcip:focus,.input-IWjcip:active,.infonomic-input:focus,.infonomic-input:active){outline-color:var(--ring-color)}:is(.input-IWjcip:disabled,.input-IWjcip[disabled],.infonomic-input:disabled,.infonomic-input[disabled]){pointer-events:none}:is(.label-zIFfZp,.infonomic-input-label){color:var(--label-color);font-size:.875rem;font-weight:500}:is(.sm-ZFjgnI,.infonomic-input-sm){min-height:32px;padding:.25rem .5rem;font-size:.875rem;line-height:0}:is(.md-unbc45,.infonomic-input-md){min-height:36px;padding:.3rem .5rem;font-size:1rem;line-height:0}:is(.lg-gpW386,.infonomic-input-lg){min-height:40px;padding:.4rem .5rem;font-size:1.175rem;line-height:0}:is(.start-adornment-PjWsd5,.end-adornment-xFqztV,.infonomic-input-start-adornment,.infonomic-input-end-adornment){align-items:center;display:flex;position:absolute}:is(.start-adornment-PjWsd5,.infonomic-input-start-adornment){left:5px}:is(.end-adornment-xFqztV,.infonomic-input-end-adornment){right:5px}:is(.help-text-aFXa9e,.infonomic-input-help-text){color:var(--help-text-color);font-size:.75rem}:is(.outlined-jwv7LI,.infonomic-input-outlined){border:1px solid var(--input-variant-outlined-border);background-color:#0000}:is(.outlined-jwv7LI:hover,.infonomic-input-outlined:hover){border:1px solid var(--input-variant-outlined-hover-border)}:is(.outlined-jwv7LI:focus,.outlined-jwv7LI:active,.infonomic-input-outlined:focus,.infonomic-input-outlined:active){--ring-color:var(--input-variant-outline-ring-color)}:is(.underlined-CSLRKX,.infonomic-input-underlined){border-bottom:1px solid var(--input-variant-underlined-border);gap:var(--gap-1);background-color:var(--input-variant-underlined);border-radius:0}.underlined-CSLRKX.sm-ZFjgnI,.infonomic-input-underlined.input-sm{min-height:26px;padding:.25rem .1rem}.underlined-CSLRKX.md-unbc45,.infonomic-input-underlined.input-md{min-height:30px;padding:.25rem .1rem}.underlined-CSLRKX.lg-gpW386,.infonomic-input-underlined.input-lg{min-height:34px;padding:0 .1rem}:is(.underlined-CSLRKX:hover,.infonomic-input-underlined:hover){border-bottom:1px solid var(--input-variant-underlined-hover-border)}:is(.filled-zNQ9B3,.infonomic-input-filled){background-color:var(--input-variant-filled)}:is(.error-FQ2_hh,.infonomic-input-error),:is(.error-FQ2_hh:hover,.infonomic-input-error:hover){border:1px solid var(--red-400)}:is(.error-FQ2_hh:focus,.error-FQ2_hh:active,.infonomic-input-error:focus,.infonomic-input-error:active){--ring-color:var(--red-300)}.underlined-CSLRKX.start-adornment-padding-ya34Ht,.start-adornment-padding-ya34Ht,.infonomic-input-underlined.input-start-adornment-padding,.infonomic-input-start-adornment-padding{padding-left:2rem}.underlined-CSLRKX.end-adornment-padding-dYaxaB,.end-adornment-padding-dYaxaB,.infonomic-input-underlined.input-end-adornment-padding,.infonomic-input-end-adornment-padding{padding-right:2rem}.underlined-CSLRKX.start-adornment-PjWsd5,.infonomic-input-underlined.input-start-adornment{left:0}.underlined-CSLRKX.end-adornment-xFqztV,.infonomic-input-underlined.input-end-adornment{right:0}:is(.primary-SHCX1n,.infonomic-input-primary){--input-variant-outlined-border:var(--stroke-primary);--input-variant-outlined-hover-border:var(--stroke-primary-hover);--input-variant-outline-ring-color:var(--ring-primary);--input-variant-underlined-border:var(--stroke-primary);--input-variant-underlined-hover-border:var(--stroke-primary-hover);--input-variant-filled:var(--fill-primary-weak)}:is(.secondary-ykH7ET,.infonomic-input-secondary){--input-variant-outlined-border:var(--stroke-secondary);--input-variant-outlined-hover-border:var(--stroke-secondary-hover);--input-variant-outline-ring-color:var(--ring-secondary);--input-variant-underlined-border:var(--stroke-secondary);--input-variant-underlined-hover-border:var(--stroke-secondary-hover);--input-variant-filled:var(--fill-secondary-weak)}:is(.noeffect-aujnaG,.infonomic-input-noeffect){--input-variant-outlined-border:var(--stroke-noeffect);--input-variant-outlined-hover-border:var(--stroke-noeffect-hover);--input-variant-outline-ring-color:var(--ring-noeffect);--input-variant-underlined-border:var(--stroke-noeffect);--input-variant-underlined-hover-border:var(--stroke-noeffect-hover);--input-variant-filled:var(--fill-noeffect-weak)}:is(.success-VsDfv9,.infonomic-input-success){--input-variant-outlined-border:var(--stroke-success);--input-variant-outlined-hover-border:var(--stroke-success-hover);--input-variant-outline-ring-color:var(--ring-success);--input-variant-underlined-border:var(--stroke-success);--input-variant-underlined-hover-border:var(--stroke-success-hover);--input-variant-filled:var(--fill-success-weak)}:is(.info-ogHmno,.infonomic-input-info){--input-variant-outlined-border:var(--stroke-info);--input-variant-outlined-hover-border:var(--stroke-info-hover);--input-variant-outline-ring-color:var(--ring-info);--input-variant-underlined-border:var(--stroke-info);--input-variant-underlined-hover-border:var(--stroke-info-hover);--input-variant-filled:var(--fill-info-weak)}:is(.warning-FQYlHl,.infonomic-input-warning){--input-variant-outlined-border:var(--stroke-warning);--input-variant-outlined-hover-border:var(--stroke-warning-hover);--input-variant-outline-ring-color:var(--ring-warning);--input-variant-underlined-border:var(--stroke-warning);--input-variant-underlined-hover-border:var(--stroke-warning-hover);--input-variant-filled:var(--fill-warning-weak)}:is(.danger-patit2,.infonomic-input-danger){--input-variant-outlined-border:var(--stroke-danger);--input-variant-outlined-hover-border:var(--stroke-danger-hover);--input-variant-outline-ring-color:var(--ring-danger);--input-variant-underlined-border:var(--stroke-danger);--input-variant-underlined-hover-border:var(--stroke-danger-hover);--input-variant-filled:var(--fill-danger-weak)}:is(.adornment-JKPOkF,.infonomic-input-adornment){white-space:nowrap;align-items:center;line-height:0;display:flex}:is(.start-dXXMnl,.infonomic-input-adornment-start){justify-content:flex-start}:is(.end-dUE8qM,.infonomic-input-adornment-end){justify-content:flex-end}:is(.text-area-TY2VVE,.infonomic-text-area){width:100%;padding:.5rem;font-size:1rem}:is(.underlined-TE6gDa,.infonomic-text-area--underlined){padding-left:0;padding-right:0}:is(.label-pYbboO,.infonomic-label){color:var(--text);font-weight:500;display:block}:is(.required-UDJyfk,.infonomic-label-required){color:var(--error)}:is(.text-DoybHX,.infonomic-error-text){color:var(--error);font-size:.875rem}:is(.sm-qLUSGk,.infonomic-error-text-sm){font-size:.85rem}:is(.md-Ov9z3C,.infonomic-error-text-md){font-size:.875rem}:is(.lg-JCKzCI,.infonomic-error-text-lg){font-size:.9rem}:is(.text-tefb0a,.infonomic-help-text){color:var(--muted);font-size:.875rem}:is(.sm-nWkN9c,.infonomic-help-text-sm){font-size:.85rem}:is(.md-hbw9In,.infonomic-help-text-md){font-size:.875rem}:is(.lg-awNcfh,.infonomic-help-text-lg){font-size:.9rem}:is(.section-CEcZOp,.infonomic-section){width:100%;position:relative}:is(.scroll-to-top-WYqAAl,.infonomic-scroll-to-top){opacity:0;visibility:hidden;z-index:20;width:0;height:0;color:var(--text-on-primary);background-color:var(--fill-primary-strong);cursor:pointer;border-style:none;outline:none;justify-content:center;align-items:center;margin:0;padding:0;text-decoration:none;transition:all .3s cubic-bezier(.25,.8,.5,1),color 1ms;display:flex;position:fixed;bottom:45px;right:30px}.scroll-to-top-WYqAAl span,.infonomic-scroll-to-top span{width:18px;padding-bottom:3px}.scroll-to-top-WYqAAl span svg path,.infonomic-scroll-to-top span svg path{stroke:none;fill:var(--text-on-primary)}.scroll-to-top-WYqAAl:hover,.scroll-to-top-WYqAAl:focus,.infonomic-scroll-to-top:hover,.infonomic-scroll-to-top:focus{color:var(--text-on-primary);background-color:var(--fill-primary-strong-hover);transform:translateY(-5px)}:is(.scroll-to-top-shown-Wemu5m,.infonomic-scroll-to-top-shown){opacity:1;visibility:visible;border-radius:20px;width:40px;min-width:0;height:40px;padding:0;bottom:20px;right:10px}@media screen and (width>=587px){:is(.scroll-to-top-WYqAAl,.infonomic-scroll-to-top){bottom:45px;right:45px}.scroll-to-top-WYqAAl span,.infonomic-scroll-to-top span{width:18px}:is(.scroll-to-top-shown-Wemu5m,.infonomic-scroll-to-top-shown){border-radius:21px;width:42px;height:42px;bottom:22px;right:22px}}}
+@layer infonomic-base,infonomic-functional,infonomic-utilities,infonomic-theme,infonomic-typography;@layer infonomic-components{:is(.card-mqJaiW,.infonomic-card){width:100%;max-width:100%;color:var(--foreground);background:var(--canvas-25);border-width:var(--border-width-thin);border-color:var(--border-color);border-style:var(--border-style-solid);border-radius:var(--border-radius-md);box-shadow:var(--shadow-sm);flex-direction:column;text-decoration:none;display:flex}:is(:is(.dark,[data-theme=dark]) .card-mqJaiW,:is(.dark,[data-theme=dark]) .infonomic-card){background:var(--canvas-800)}:is(.card-hover-hvT4d6,.infonomic-card-hover){transition:background .2s ease-in-out}:is(.card-hover-hvT4d6:hover,.infonomic-card-hover:hover){background:oklch(from var(--theme-50) 1 .03 h)}:is(:is(.dark,[data-theme=dark]) .card-hover-hvT4d6:hover,:is(.dark,[data-theme=dark]) .infonomic-card-hover:hover){background:oklch(from var(--canvas-800) .2 c h)}:is(.card-header-XnoBkP,.infonomic-card-header){flex-direction:column;gap:.5rem;padding:1rem;display:flex}:is(.card-title-JI7Lu3,.infonomic-card-title){color:var(--headings);letter-spacing:-.015em;font-size:1.8rem;font-weight:700;line-height:1}:is(.card-description-fwu7HE,.infonomic-card-description){color:var(--muted);font-size:.875rem}:is(.card-content-uhoZYJ,.infonomic-card-content){flex:1;padding:0 1rem 1rem}:is(.card-footer-BxTa4b,.infonomic-card-footer){align-items:center;padding:0 1rem 1rem;display:flex}:is(.container-tSpizY,.infonomic-container){width:100%;max-width:60rem;margin:0 auto;padding:0 1rem}@media (width>=66rem){:is(.container-tSpizY,.infonomic-container){max-width:64rem}}@media (width>=77rem){:is(.container-tSpizY,.infonomic-container){max-width:74.375rem}}@media (width>=94rem){:is(.container-tSpizY,.infonomic-container){max-width:87.5rem}}:is(.badge-8xVidp,.infonomic-badge){font-size:var(--font-size-sm);text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:var(--border-radius-sm);padding:.25em .4em;font-weight:400;line-height:1;display:inline-block}:is(.primary-oZyR_M,.infonomic-badge-primary){color:var(--text-on-primary-strong);background-color:var(--fill-primary-strong)}:is(.secondary-VsqJTm,.infonomic-badge-secondary){color:var(--text-on-secondary-strong);background-color:var(--fill-secondary-strong)}:is(.noeffect-R8eJtO,.infonomic-badge-noeffect){color:var(--text-on-noeffect-strong);background-color:var(--fill-noeffect-strong)}:is(.success-h2otET,.infonomic-badge-success){color:var(--text-on-success-strong);background-color:var(--fill-success-strong)}:is(.info-OG3F3u,.infonomic-badge-info){color:var(--text-on-info-strong);background-color:var(--fill-info-strong)}:is(.warning-zTXksZ,.infonomic-badge-warning){color:var(--text-on-warning-strong);background-color:var(--fill-warning-strong)}:is(.danger-hKF7l_,.infonomic-badge-danger){color:var(--text-on-danger-strong);background-color:var(--fill-danger-strong)}:is(.button-IjDhC0,.infonomic-button){cursor:pointer;text-align:center;gap:var(--gap-2);white-space:nowrap;outline-offset:2px;transition:background-color var(--transition-normal), outline-color var(--transition-normal);border-radius:var(--border-radius-sm);border:none;outline:1px solid #0000;justify-content:center;align-items:center;font-weight:400;line-height:0;display:inline-flex}:is(.button-IjDhC0:disabled,.button-IjDhC0[disabled],.infonomic-button:disabled,.infonomic-button[disabled]){pointer-events:none}:is(.button-IjDhC0:focus,.button-IjDhC0:active,.infonomic-button:focus,.infonomic-button:active){outline-color:var(--ring-color)}.button-IjDhC0.square-P_6yde,.infonomic-button-square{aspect-ratio:1;border-radius:var(--border-radius-sm);padding:0}.button-IjDhC0.round-uqus3n,.infonomic-button-round{aspect-ratio:1;border-radius:var(--border-radius-full);padding:0}:is(.xs-jxTd5R,.infonomic-button-xs){min-height:26px;padding:.2rem .4rem;font-size:.7rem}:is(.sm-uD_Ugt,.infonomic-button-sm){min-height:32px;padding:.25rem .5rem;font-size:.775rem}:is(.md-Qp9ad6,.infonomic-button-md){min-height:38px;padding:.625rem 1.25rem;font-size:.95rem}:is(.lg-FAYTen,.infonomic-button-lg){min-height:46px;padding:.75rem 1.5rem;font-size:1.1rem}:is(.xl-Gwvhl4,.infonomic-button-xl){min-height:54px;padding:.75rem 1.5rem;font-size:1.2rem}:is(.filled-CwGsrO,.infonomic-button-filled){color:var(--button-variant-filled-foreground);background-color:var(--button-variant-filled)}:is(.filled-CwGsrO:hover,.infonomic-button-filled:hover){background-color:var(--button-variant-filled-hover)}:is(.filled-CwGsrO:focus,.filled-CwGsrO:active,.infonomic-button-filled:focus,.infonomic-button-filled:active){--ring-color:var(--button-ring-color)}:is(.filled-CwGsrO:disabled,.filled-CwGsrO[disabled],.infonomic-button-filled:disabled,.infonomic-button-filled[disabled]){background-color:var(--button-variant-filled-disabled,oklch(from var(--button-variant-filled) calc(l * 1.1) calc(c * .85) h));color:var(--button-variant-filled-foreground-disabled,oklch(from var(--button-variant-filled-foreground) calc(l * .9) calc(c * .85) h))}:is(.filled-weak-QLU8bA,.infonomic-button-filled-weak){color:var(--button-variant-filled-weak-foreground);background-color:var(--button-variant-filled-weak)}:is(.filled-weak-QLU8bA:hover,.infonomic-button-filled-weak:hover){background-color:var(--button-variant-filled-weak-hover)}:is(.filled-weak-QLU8bA:focus,.filled-weak-QLU8bA:active,.infonomic-button-filled-weak:focus,.infonomic-button-filled-weak:active){--ring-color:var(--button-ring-color)}:is(.filled-weak-QLU8bA:disabled,.filled-weak-QLU8bA[disabled],.infonomic-button-filled-weak:disabled,.infonomic-button-filled-weak[disabled]){background-color:var(--button-variant-filled-weak-disabled,oklch(from var(--button-variant-filled-weak) calc(l * 1.1) calc(c * .85) h));color:var(--button-variant-filled-weak-foreground-disabled,oklch(from var(--button-variant-filled-weak-foreground) calc(l * .9) calc(c * .85) h))}:is(.outlined-nZGbxu,.infonomic-button-outlined){border:1px solid var(--button-variant-outlined-border);color:var(--button-variant-outlined-foreground);background-color:var(--button-variant-outlined)}:is(.outlined-nZGbxu:disabled,.outlined-nZGbxu[disabled],.infonomic-button-outlined:disabled,.infonomic-button-outlined[disabled]){border-color:var(--button-variant-outlined-border-disabled,oklch(from var(--button-variant-outlined-border) calc(l * 1.5) calc(c * .8) h));color:var(--button-variant-outlined-foreground-disabled,oklch(from var(--button-variant-outlined-foreground) calc(l * 1.1) calc(c * .7) h))}:is(.outlined-nZGbxu:hover,.infonomic-button-outlined:hover){background-color:var(--button-variant-outlined-hover)}:is(.outlined-nZGbxu:focus,.outlined-nZGbxu:active,.infonomic-button-outlined:focus,.infonomic-button-outlined:active){--ring-color:var(--button-ring-color)}:is(.gradient-ySC3O3,.infonomic-button-gradient){color:var(--button-variant-gradient-foreground);background:linear-gradient(45deg, var(--button-variant-gradient-start), var(--button-variant-gradient-end))}:is(.gradient-ySC3O3:disabled,.gradient-ySC3O3[disabled],.infonomic-button-gradient:disabled,.infonomic-button-gradient[disabled]){background:unset;background-color:var(--button-variant-gradient-disabled,oklch(from var(--button-variant-gradient-end) calc(l * 1.2) calc(c * .85) h));color:var(--button-variant-gradient-foreground-disabled,oklch(from var(--button-variant-gradient-foreground) calc(l * .9) calc(c * .85) h))}:is(.gradient-ySC3O3:hover,.infonomic-button-gradient:hover){color:var(--button-variant-gradient-foreground);background:linear-gradient(45deg, var(--button-variant-gradient-start), var(--button-variant-gradient-end))}:is(.gradient-ySC3O3:focus,.gradient-ySC3O3:active,.infonomic-button-gradient:focus,.infonomic-button-gradient:active){--ring-color:var(--button-ring-color)}:is(.text-GaxlcE,.infonomic-button-text){background-color:var(--button-variant-text);color:var(--button-variant-text-foreground)}:is(.text-GaxlcE:disabled,.text-GaxlcE[disabled],.infonomic-button-text:disabled,.infonomic-button-text[disabled]){color:oklch(from var(--button-variant-text-foreground) calc(l * 1.5) calc(c * .5) h)}:is(.text-GaxlcE:hover,.infonomic-button-text:hover){background-color:var(--button-variant-text-hover)}:is(.text-GaxlcE:focus,.text-GaxlcE:active,.infonomic-button-text:focus,.infonomic-button-text:active){--ring-color:var(--button-ring-color)}:is(.primary-tUmczz,.infonomic-button-primary){--button-ring-color:var(--ring-primary);--button-variant-filled:var(--fill-primary-strong);--button-variant-filled-hover:var(--fill-primary-strong-hover);--button-variant-filled-disabled:var(--fill-primary-strong-disabled);--button-variant-filled-foreground:var(--text-on-primary-strong);--button-variant-filled-foreground-disabled:var(--text-on-primary-strong-disabled);--button-variant-filled-weak:var(--fill-primary-weak);--button-variant-filled-weak-hover:var(--fill-primary-weak-hover);--button-variant-filled-weak-disabled:var(--fill-primary-weak-disabled);--button-variant-filled-weak-foreground:var(--text-on-primary-weak);--button-variant-filled-weak-foreground-disabled:var(--text-on-primary-weak-disabled);--button-variant-outlined:var(--fill-primary-outlined);--button-variant-outlined-hover:var(--fill-primary-outlined-hover);--button-variant-outlined-border:var(--stroke-primary);--button-variant-outlined-border-disabled:var(--stroke-primary-disabled);--button-variant-outlined-foreground:var(--text-on-primary-outlined);--button-variant-outlined-foreground-disabled:var(--text-on-primary-outlined-disabled);--button-variant-text:var(--fill-primary-text);--button-variant-text-hover:var(--fill-primary-text-hover);--button-variant-text-foreground:var(--text-primary);--button-variant-gradient-start:var(--gradient-primary-start);--button-variant-gradient-end:var(--gradient-primary-end);--button-variant-gradient-foreground:var(--gradient-primary-foreground);--button-variant-gradient-disabled:var(--gradient-primary-disabled);--button-variant-gradient-foreground-disabled:var(--text-on-primary-disabled)}:is(.secondary-UqT2AY,.infonomic-button-secondary){--button-ring-color:var(--ring-secondary);--button-variant-filled:var(--fill-secondary-strong);--button-variant-filled-hover:var(--fill-secondary-strong-hover);--button-variant-filled-disabled:var(--fill-secondary-strong-disabled);--button-variant-filled-foreground:var(--text-on-secondary-strong);--button-variant-filled-foreground-disabled:var(--text-on-secondary-strong-disabled);--button-variant-filled-weak:var(--fill-secondary-weak);--button-variant-filled-weak-hover:var(--fill-secondary-weak-hover);--button-variant-filled-weak-disabled:var(--fill-secondary-weak-disabled);--button-variant-filled-weak-foreground:var(--text-on-secondary-weak);--button-variant-filled-weak-foreground-disabled:var(--text-on-secondary-weak-disabled);--button-variant-outlined:var(--fill-secondary-outlined);--button-variant-outlined-border:var(--stroke-secondary);--button-variant-outlined-border-disabled:var(--stroke-secondary-disabled);--button-variant-outlined-hover:var(--fill-secondary-outlined-hover);--button-variant-outlined-foreground:var(--text-on-secondary-outlined);--button-variant-outlined-foreground-disabled:var(--text-on-secondary-outlined-disabled);--button-variant-text:var(--fill-secondary-text);--button-variant-text-hover:var(--fill-secondary-text-hover);--button-variant-text-foreground:var(--text-secondary);--button-variant-gradient-start:var(--gradient-secondary-start);--button-variant-gradient-end:var(--gradient-secondary-end);--button-variant-gradient-foreground:var(--gradient-secondary-foreground);--button-variant-gradient-disabled:var(--gradient-secondary-disabled);--button-variant-gradient-foreground-disabled:var(--text-on-secondary-disabled)}:is(.noeffect-fpxSgg,.infonomic-button-noeffect){--button-ring-color:var(--ring-noeffect);--button-variant-filled:var(--fill-noeffect-strong);--button-variant-filled-hover:var(--fill-noeffect-strong-hover);--button-variant-filled-disabled:var(--fill-noeffect-strong-disabled);--button-variant-filled-foreground:var(--text-on-noeffect-strong);--button-variant-filled-foreground-disabled:var(--text-on-noeffect-strong-disabled);--button-variant-filled-weak:var(--fill-noeffect-weak);--button-variant-filled-weak-hover:var(--fill-noeffect-weak-hover);--button-variant-filled-weak-disabled:var(--fill-noeffect-weak-disabled);--button-variant-filled-weak-foreground:var(--text-on-noeffect-weak);--button-variant-filled-weak-foreground-disabled:var(--text-on-noeffect-weak-disabled);--button-variant-outlined:var(--fill-noeffect-outlined);--button-variant-outlined-hover:var(--fill-noeffect-outlined-hover);--button-variant-outlined-disabled:var(--fill-noeffect-outlined-disabled);--button-variant-outlined-border:var(--stroke-noeffect);--button-variant-outlined-border-disabled:var(--stroke-noeffect-disabled);--button-variant-outlined-foreground:var(--text-on-noeffect-outlined);--button-variant-outlined-foreground-disabled:var(--text-on-noeffect-disabled);--button-variant-text:var(--fill-noeffect-text);--button-variant-text-hover:var(--fill-noeffect-text-hover);--button-variant-text-foreground:var(--text-noeffect);--button-variant-gradient-start:var(--gradient-noeffect-start);--button-variant-gradient-end:var(--gradient-noeffect-end);--button-variant-gradient-foreground:var(--gradient-noeffect-foreground);--button-variant-gradient-disabled:var(--gradient-noeffect-disabled);--button-variant-gradient-foreground-disabled:var(--text-on-noeffect-disabled)}:is(.success-fTNDEn,.infonomic-button-success){--button-ring-color:var(--ring-success);--button-variant-filled:var(--fill-success-strong);--button-variant-filled-hover:var(--fill-success-strong-hover);--button-variant-filled-disabled:var(--fill-success-strong-disabled);--button-variant-filled-foreground:var(--text-on-success-strong);--button-variant-filled-foreground-disabled:var(--text-on-success-strong-disabled);--button-variant-filled-weak:var(--fill-success-weak);--button-variant-filled-weak-hover:var(--fill-success-weak-hover);--button-variant-filled-weak-disabled:var(--fill-success-weak-disabled);--button-variant-filled-weak-foreground:var(--text-on-success-weak);--button-variant-filled-weak-foreground-disabled:var(--text-on-success-weak-disabled);--button-variant-outlined:var(--fill-success-outlined);--button-variant-outlined-hover:var(--fill-success-outlined-hover);--button-variant-outlined-border:var(--stroke-success);--button-variant-outlined-border-disabled:var(--stroke-success-disabled);--button-variant-outlined-foreground:var(--text-on-success-outlined);--button-variant-outlined-foreground-disabled:var(--text-on-success-outlined-disabled);--button-variant-text:transparent;--button-variant-text-hover:var(--fill-success-text-hover);--button-variant-text-foreground:var(--text-success);--button-variant-gradient-start:var(--gradient-success-start);--button-variant-gradient-end:var(--gradient-success-end);--button-variant-gradient-foreground:var(--gradient-success-foreground);--button-variant-gradient-disabled:var(--gradient-success-disabled);--button-variant-gradient-foreground-disabled:var(--text-on-success-disabled)}:is(.info-qrdXQD,.infonomic-button-info){--button-ring-color:var(--ring-info);--button-variant-filled:var(--fill-info-strong);--button-variant-filled-hover:var(--fill-info-strong-hover);--button-variant-filled-disabled:var(--fill-info-strong-disabled);--button-variant-filled-foreground:var(--text-on-info-strong);--button-variant-filled-foreground-disabled:var(--text-on-info-strong-disabled);--button-variant-filled-weak:var(--fill-info-weak);--button-variant-filled-weak-hover:var(--fill-info-weak-hover);--button-variant-filled-weak-disabled:var(--fill-info-weak-disabled);--button-variant-filled-weak-foreground:var(--text-on-info-weak);--button-variant-filled-weak-foreground-disabled:var(--text-on-info-weak-disabled);--button-variant-outlined:transparent;--button-variant-outlined-hover:var(--fill-info-outlined-hover);--button-variant-outlined-border:var(--stroke-info);--button-variant-outlined-border-disabled:var(--stroke-info-disabled);--button-variant-outlined-foreground:var(--text-on-info-outlined);--button-variant-outlined-foreground-disabled:var(--text-on-info-outlined-disabled);--button-variant-text:transparent;--button-variant-text-hover:var(--fill-info-text-hover);--button-variant-text-foreground:var(--text-info);--button-variant-gradient-start:var(--gradient-info-start);--button-variant-gradient-end:var(--gradient-info-end);--button-variant-gradient-foreground:var(--gradient-info-foreground);--button-variant-gradient-disabled:var(--gradient-info-disabled);--button-variant-gradient-foreground-disabled:var(--text-on-info-disabled)}:is(.warning-a00T3A,.infonomic-button-warning){--button-ring-color:var(--ring-warning);--button-variant-filled:var(--fill-warning-strong);--button-variant-filled-hover:var(--fill-warning-strong-hover);--button-variant-filled-disabled:var(--fill-warning-strong-disabled);--button-variant-filled-foreground:var(--text-on-warning-strong);--button-variant-filled-foreground-disabled:var(--text-on-warning-strong-disabled);--button-variant-filled-weak:var(--fill-warning-weak);--button-variant-filled-weak-hover:var(--fill-warning-weak-hover);--button-variant-filled-weak-disabled:var(--fill-warning-weak-disabled);--button-variant-filled-weak-foreground:var(--text-on-warning-weak);--button-variant-filled-weak-foreground-disabled:var(--text-on-warning-weak-disabled);--button-variant-outlined:var(--fill-warning-outlined);--button-variant-outlined-hover:var(--fill-warning-outlined-hover);--button-variant-outlined-border:var(--stroke-warning);--button-variant-outlined-border-disabled:var(--stroke-warning-disabled);--button-variant-outlined-foreground:var(--text-on-warning-outlined);--button-variant-outlined-foreground-disabled:var(--text-on-warning-outlined-disabled);--button-variant-text:transparent;--button-variant-text-hover:var(--fill-warning-text-hover);--button-variant-text-foreground:var(--text-warning);--button-variant-gradient-start:var(--gradient-warning-start);--button-variant-gradient-end:var(--gradient-warning-end);--button-variant-gradient-foreground:var(--gradient-warning-foreground);--button-variant-gradient-disabled:var(--gradient-warning-disabled);--button-variant-gradient-foreground-disabled:var(--text-on-warning-disabled)}:is(.danger-rwIV_i,.infonomic-button-danger){--button-ring-color:var(--ring-danger);--button-variant-filled:var(--fill-danger-strong);--button-variant-filled-hover:var(--fill-danger-strong-hover);--button-variant-filled-disabled:var(--fill-danger-strong-disabled);--button-variant-filled-foreground:var(--text-on-danger-strong);--button-variant-filled-foreground-disabled:var(--text-on-danger-strong-disabled);--button-variant-filled-weak:var(--fill-danger-weak);--button-variant-filled-weak-hover:var(--fill-danger-weak-hover);--button-variant-filled-weak-disabled:var(--fill-danger-weak-disabled);--button-variant-filled-weak-foreground:var(--text-on-danger-weak);--button-variant-filled-weak-foreground-disabled:var(--text-on-danger-weak-disabled);--button-variant-outlined:transparent;--button-variant-outlined-hover:var(--fill-danger-outlined-hover);--button-variant-outlined-border:var(--stroke-danger);--button-variant-outlined-border-disabled:var(--stroke-danger-disabled);--button-variant-outlined-foreground:var(--text-on-danger-outlined);--button-variant-outlined-foreground-disabled:var(--text-on-danger-outlined-disabled);--button-variant-text:transparent;--button-variant-text-hover:var(--fill-danger-text-hover);--button-variant-text-foreground:var(--text-danger);--button-variant-gradient-start:var(--gradient-danger-start);--button-variant-gradient-end:var(--gradient-danger-end);--button-variant-gradient-foreground:var(--gradient-danger-foreground);--button-variant-gradient-disabled:var(--gradient-danger-disabled);--button-variant-gradient-foreground-disabled:var(--text-on-danger-disabled)}:is(.fullWidth-wXvP0v,.infonomic-button-full-width){width:100%;display:flex}:is(.button-group-uqvOi8,.infonomic-button-group){place-items:center;gap:var(--gap-2);flex-direction:column;display:flex}@media screen and (width>=40rem){:is(.button-group-uqvOi8,.infonomic-button-group){flex-direction:row}}:is(.copy-button-container-vCNz8o,.infonomic-copy-button-container){display:inline-block}:is(.copy-button-oa4bdj svg,.infonomic-copy-button svg){width:90%;height:90%;display:block}:is(.xs-lZmf78,.infonomic-copy-button-xs){width:26px;height:26px;min-height:26px;padding:.25rem}:is(.sm-KNN1e5,.infonomic-copy-button-sm){width:32px;height:32px;min-height:32px;padding:.35rem}:is(.md-OoH0l4,.infonomic-copy-button-md){width:38px;height:38px;min-height:38px;padding:.45rem}:is(.lg-uu5ujz,.infonomic-copy-button-lg){width:46px;height:46px;min-height:46px;padding:.55rem}:is(.xl-pFYyrS,.infonomic-copy-button-xl){width:54px;height:54px;min-height:54px;padding:.65rem}:is(.input-wrapper-OJAKML,.infonomic-input-wrapper){gap:var(--gap-1);flex-direction:column;display:flex}:is(.input-container-bU4yD2,.infonomic-input-container){align-items:center;gap:var(--gap-2);width:100%;padding:0;display:flex;position:relative}:is(.input-IWjcip,.infonomic-input){outline-offset:2px;gap:var(--gap-2);width:100%;transition:all var(--transition-normal);border-radius:var(--border-radius-sm);border:none;outline:1px solid #0000;align-items:center;font-weight:400;display:inline-flex}:is(.input-IWjcip:focus,.input-IWjcip:active,.infonomic-input:focus,.infonomic-input:active){outline-color:var(--ring-color)}:is(.input-IWjcip:disabled,.input-IWjcip[disabled],.infonomic-input:disabled,.infonomic-input[disabled]){pointer-events:none}:is(.label-zIFfZp,.infonomic-input-label){color:var(--label-color);font-size:.875rem;font-weight:500}:is(.sm-ZFjgnI,.infonomic-input-sm){min-height:32px;padding:.25rem .5rem;font-size:.875rem;line-height:0}:is(.md-unbc45,.infonomic-input-md){min-height:36px;padding:.3rem .5rem;font-size:1rem;line-height:0}:is(.lg-gpW386,.infonomic-input-lg){min-height:40px;padding:.4rem .5rem;font-size:1.175rem;line-height:0}:is(.start-adornment-PjWsd5,.end-adornment-xFqztV,.infonomic-input-start-adornment,.infonomic-input-end-adornment){align-items:center;display:flex;position:absolute}:is(.start-adornment-PjWsd5,.infonomic-input-start-adornment){left:5px}:is(.end-adornment-xFqztV,.infonomic-input-end-adornment){right:5px}:is(.help-text-aFXa9e,.infonomic-input-help-text){color:var(--help-text-color);font-size:.75rem}:is(.outlined-jwv7LI,.infonomic-input-outlined){border:1px solid var(--input-variant-outlined-border);background-color:#0000}:is(.outlined-jwv7LI:hover,.infonomic-input-outlined:hover){border:1px solid var(--input-variant-outlined-hover-border)}:is(.outlined-jwv7LI:focus,.outlined-jwv7LI:active,.infonomic-input-outlined:focus,.infonomic-input-outlined:active){--ring-color:var(--input-variant-outline-ring-color)}:is(.underlined-CSLRKX,.infonomic-input-underlined){border-bottom:1px solid var(--input-variant-underlined-border);gap:var(--gap-1);background-color:var(--input-variant-underlined);border-radius:0}.underlined-CSLRKX.sm-ZFjgnI,.infonomic-input-underlined.input-sm{min-height:26px;padding:.25rem .1rem}.underlined-CSLRKX.md-unbc45,.infonomic-input-underlined.input-md{min-height:30px;padding:.25rem .1rem}.underlined-CSLRKX.lg-gpW386,.infonomic-input-underlined.input-lg{min-height:34px;padding:0 .1rem}:is(.underlined-CSLRKX:hover,.infonomic-input-underlined:hover){border-bottom:1px solid var(--input-variant-underlined-hover-border)}:is(.underlined-CSLRKX:focus,.underlined-CSLRKX:active,.infonomic-input-underlined:focus,.infonomic-input-underlined:active){outline:none}:is(.filled-zNQ9B3,.infonomic-input-filled){background-color:var(--input-variant-filled)}:is(.error-FQ2_hh,.infonomic-input-error),:is(.error-FQ2_hh:hover,.infonomic-input-error:hover){border:1px solid var(--red-400)}:is(.error-FQ2_hh:focus,.error-FQ2_hh:active,.infonomic-input-error:focus,.infonomic-input-error:active){--ring-color:var(--red-300)}.underlined-CSLRKX.start-adornment-padding-ya34Ht,.start-adornment-padding-ya34Ht,.infonomic-input-underlined.input-start-adornment-padding,.infonomic-input-start-adornment-padding{padding-left:2rem}.underlined-CSLRKX.end-adornment-padding-dYaxaB,.end-adornment-padding-dYaxaB,.infonomic-input-underlined.input-end-adornment-padding,.infonomic-input-end-adornment-padding{padding-right:2rem}.underlined-CSLRKX.start-adornment-PjWsd5,.infonomic-input-underlined.input-start-adornment{left:0}.underlined-CSLRKX.end-adornment-xFqztV,.infonomic-input-underlined.input-end-adornment{right:0}:is(.primary-SHCX1n,.infonomic-input-primary){--input-variant-outlined-border:var(--stroke-primary);--input-variant-outlined-hover-border:var(--stroke-primary-hover);--input-variant-outline-ring-color:var(--ring-primary);--input-variant-underlined-border:var(--stroke-primary);--input-variant-underlined-hover-border:var(--stroke-primary-hover);--input-variant-filled:var(--fill-primary-weak)}:is(.secondary-ykH7ET,.infonomic-input-secondary){--input-variant-outlined-border:var(--stroke-secondary);--input-variant-outlined-hover-border:var(--stroke-secondary-hover);--input-variant-outline-ring-color:var(--ring-secondary);--input-variant-underlined-border:var(--stroke-secondary);--input-variant-underlined-hover-border:var(--stroke-secondary-hover);--input-variant-filled:var(--fill-secondary-weak)}:is(.noeffect-aujnaG,.infonomic-input-noeffect){--input-variant-outlined-border:var(--stroke-noeffect);--input-variant-outlined-hover-border:var(--stroke-noeffect-hover);--input-variant-outline-ring-color:var(--ring-noeffect);--input-variant-underlined-border:var(--stroke-noeffect);--input-variant-underlined-hover-border:var(--stroke-noeffect-hover);--input-variant-filled:var(--fill-noeffect-weak)}:is(.success-VsDfv9,.infonomic-input-success){--input-variant-outlined-border:var(--stroke-success);--input-variant-outlined-hover-border:var(--stroke-success-hover);--input-variant-outline-ring-color:var(--ring-success);--input-variant-underlined-border:var(--stroke-success);--input-variant-underlined-hover-border:var(--stroke-success-hover);--input-variant-filled:var(--fill-success-weak)}:is(.info-ogHmno,.infonomic-input-info){--input-variant-outlined-border:var(--stroke-info);--input-variant-outlined-hover-border:var(--stroke-info-hover);--input-variant-outline-ring-color:var(--ring-info);--input-variant-underlined-border:var(--stroke-info);--input-variant-underlined-hover-border:var(--stroke-info-hover);--input-variant-filled:var(--fill-info-weak)}:is(.warning-FQYlHl,.infonomic-input-warning){--input-variant-outlined-border:var(--stroke-warning);--input-variant-outlined-hover-border:var(--stroke-warning-hover);--input-variant-outline-ring-color:var(--ring-warning);--input-variant-underlined-border:var(--stroke-warning);--input-variant-underlined-hover-border:var(--stroke-warning-hover);--input-variant-filled:var(--fill-warning-weak)}:is(.danger-patit2,.infonomic-input-danger){--input-variant-outlined-border:var(--stroke-danger);--input-variant-outlined-hover-border:var(--stroke-danger-hover);--input-variant-outline-ring-color:var(--ring-danger);--input-variant-underlined-border:var(--stroke-danger);--input-variant-underlined-hover-border:var(--stroke-danger-hover);--input-variant-filled:var(--fill-danger-weak)}:is(.adornment-JKPOkF,.infonomic-input-adornment){white-space:nowrap;align-items:center;line-height:0;display:flex}:is(.start-dXXMnl,.infonomic-input-adornment-start){justify-content:flex-start}:is(.end-dUE8qM,.infonomic-input-adornment-end){justify-content:flex-end}:is(.text-area-TY2VVE,.infonomic-text-area){width:100%;padding:.5rem;font-size:1rem}:is(.underlined-TE6gDa,.infonomic-text-area--underlined){padding-left:0;padding-right:0}:is(.underlined-TE6gDa:focus,.underlined-TE6gDa:active,.infonomic-text-area--underlined:focus,.infonomic-text-area--underlined:active){outline:none}:is(.label-pYbboO,.infonomic-label){color:var(--text);font-weight:500;display:block}:is(.required-UDJyfk,.infonomic-label-required){color:var(--error)}:is(.text-DoybHX,.infonomic-error-text){color:var(--error);font-size:.875rem}:is(.sm-qLUSGk,.infonomic-error-text-sm){font-size:.85rem}:is(.md-Ov9z3C,.infonomic-error-text-md){font-size:.875rem}:is(.lg-JCKzCI,.infonomic-error-text-lg){font-size:.9rem}:is(.text-tefb0a,.infonomic-help-text){color:var(--muted);font-size:.875rem}:is(.sm-nWkN9c,.infonomic-help-text-sm){font-size:.85rem}:is(.md-hbw9In,.infonomic-help-text-md){font-size:.875rem}:is(.lg-awNcfh,.infonomic-help-text-lg){font-size:.9rem}:is(.section-CEcZOp,.infonomic-section){width:100%;position:relative}:is(.scroll-to-top-WYqAAl,.infonomic-scroll-to-top){opacity:0;visibility:hidden;z-index:20;width:0;height:0;color:var(--text-on-primary);background-color:var(--fill-primary-strong);cursor:pointer;border-style:none;outline:none;justify-content:center;align-items:center;margin:0;padding:0;text-decoration:none;transition:all .3s cubic-bezier(.25,.8,.5,1),color 1ms;display:flex;position:fixed;bottom:45px;right:30px}.scroll-to-top-WYqAAl span,.infonomic-scroll-to-top span{width:18px;padding-bottom:3px}.scroll-to-top-WYqAAl span svg path,.infonomic-scroll-to-top span svg path{stroke:none;fill:var(--text-on-primary)}.scroll-to-top-WYqAAl:hover,.scroll-to-top-WYqAAl:focus,.infonomic-scroll-to-top:hover,.infonomic-scroll-to-top:focus{color:var(--text-on-primary);background-color:var(--fill-primary-strong-hover);transform:translateY(-5px)}:is(.scroll-to-top-shown-Wemu5m,.infonomic-scroll-to-top-shown){opacity:1;visibility:visible;border-radius:20px;width:40px;min-width:0;height:40px;padding:0;bottom:20px;right:10px}@media screen and (width>=587px){:is(.scroll-to-top-WYqAAl,.infonomic-scroll-to-top){bottom:45px;right:45px}.scroll-to-top-WYqAAl span,.infonomic-scroll-to-top span{width:18px}:is(.scroll-to-top-shown-Wemu5m,.infonomic-scroll-to-top-shown){border-radius:21px;width:42px;height:42px;bottom:22px;right:22px}}}

package/dist/widgets/drawer/drawer-container.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"drawer-container.d.ts","sourceRoot":"","sources":["../../../src/widgets/drawer/drawer-container.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAA;AAMnC,KAAK,6BAA6B,GAAG,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,KAAK,CAAC,CAAA;AACvE,MAAM,WAAW,oBAAqB,SAAQ,6BAA6B;IACzE,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,wBAAgB,eAAe,CAAC,EAC9B,GAAG,EACH,QAAQ,EACR,SAAS,EACT,GAAG,IAAI,EACR,EAAE,oBAAoB,GAAG;IACxB,GAAG,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAA;CACtC,qBAWA"}
+{"version":3,"file":"drawer-container.d.ts","sourceRoot":"","sources":["../../../src/widgets/drawer/drawer-container.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAA;AAMnC,KAAK,6BAA6B,GAAG,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,KAAK,CAAC,CAAA;AACvE,MAAM,WAAW,oBAAqB,SAAQ,6BAA6B;IACzE,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,wBAAgB,eAAe,CAAC,EAC9B,GAAG,EACH,QAAQ,EACR,SAAS,EACT,GAAG,IAAI,EACR,EAAE,oBAAoB,GAAG;IACxB,GAAG,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAA;CACtC,qBAUA"}

package/dist/widgets/drawer/drawer-container.js

@@ -5,7 +5,6 @@ import drawer_module from "./drawer.module.js";
 function DrawerContainer({ ref, children, className, ...rest }) {
     return /*#__PURE__*/ jsx("div", {
         ref: ref,
-        role: "dialog",
         className: classnames('infonomic-drawer-container', drawer_module["drawer-container"], className),
         ...rest,
         children: children

package/dist/widgets/drawer/drawer.d.ts

@@ -11,7 +11,7 @@ export interface DrawerProps {
     topOffset?: string;
 }
 declare const Drawer: {
-    ({ id, isOpen, onDismiss, closeOnOverlayClick, children, width, topOffset, ...rest }: DrawerProps): import("react").ReactPortal | null;
+    ({ id, isOpen, onDismiss, closeOnOverlayClick, children, width, topOffset, }: DrawerProps): import("react").JSX.Element;
     displayName: string;
     Container: typeof DrawerContainer;
     Content: typeof DrawerContent;

package/dist/widgets/drawer/drawer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"drawer.d.ts","sourceRoot":"","sources":["../../../src/widgets/drawer/drawer.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAWtC,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAA;AACpD,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAA;AAiBhD,MAAM,WAAW,WAAW;IAC1B,EAAE,EAAE,MAAM,CAAA;IACV,MAAM,EAAE,OAAO,CAAA;IACf,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAC7B,SAAS,EAAE,MAAM,IAAI,CAAA;IACrB,QAAQ,EAAE,SAAS,CAAA;IACnB,KAAK,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,MAAM,CAAA;IACpC,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,QAAA,MAAM,MAAM;0FAST,WAAW;;;;;WAtCT,CAAC;;;WAAe,CAAC;;CA0FrB,CAAA;AASD,OAAO,EAAE,MAAM,EAAE,CAAA"}
+{"version":3,"file":"drawer.d.ts","sourceRoot":"","sources":["../../../src/widgets/drawer/drawer.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAOtC,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAA;AACpD,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAA;AAWhD,MAAM,WAAW,WAAW;IAC1B,EAAE,EAAE,MAAM,CAAA;IACV,MAAM,EAAE,OAAO,CAAA;IACf,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAC7B,SAAS,EAAE,MAAM,IAAI,CAAA;IACrB,QAAQ,EAAE,SAAS,CAAA;IACnB,KAAK,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,MAAM,CAAA;IACpC,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,QAAA,MAAM,MAAM;kFAQT,WAAW;;;;;WA3B+B,CAAC;;;WAChC,CAAC;;CAwEd,CAAA;AASD,OAAO,EAAE,MAAM,EAAE,CAAA"}

package/dist/widgets/drawer/drawer.js

@@ -1,31 +1,18 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useEffect } from "react";
+import { Drawer } from "@base-ui/react/drawer";
 import classnames from "classnames";
-import { AnimatePresence, LazyMotion } from "motion/react";
-import { createPortal } from "react-dom";
-import { Overlay } from "../../components/overlay/index.js";
-import { useMediaQuery } from "../../hooks/use-media-query.js";
-import { getPortalRoot } from "../../utils/getPortalRoot.js";
 import drawer_module from "./drawer.module.js";
 import { DrawerContainer } from "./drawer-container.js";
 import { DrawerContent } from "./drawer-content.js";
 import { useDrawer } from "./drawer-context.js";
 import { DrawerHeader } from "./drawer-header.js";
 import { DrawerTopActions } from "./drawer-top-actions.js";
-import { DrawerWrapper } from "./drawer-wrapper.js";
 const typedStyles = drawer_module;
-const DomMax = async ()=>await import("./motionDomMax.js").then((mod)=>mod.default);
-const DomAnimation = async ()=>await import("./motionDomAnimation.js").then((mod)=>mod.default);
-const Drawer = ({ id, isOpen, onDismiss, closeOnOverlayClick, children, width = 'narrow', topOffset = '0', ...rest })=>{
-    const isMobile = useMediaQuery('(max-width: 768px)') ?? false;
+const drawer_Drawer = ({ id, isOpen, onDismiss, closeOnOverlayClick, children, width = 'narrow', topOffset = '0' })=>{
     const { addDrawer, removeDrawer, drawers } = useDrawer();
     const depth = drawers.indexOf(id);
-    const handleOverlayDismiss = (e)=>{
-        e.stopPropagation();
-        e.preventDefault();
-        if (true === closeOnOverlayClick) onDismiss?.();
-    };
     useEffect(()=>{
         if (isOpen) addDrawer(id);
         else removeDrawer(id);
@@ -36,39 +23,37 @@ const Drawer = ({ id, isOpen, onDismiss, closeOnOverlayClick, children, width =
         addDrawer,
         removeDrawer
     ]);
-    const portal = getPortalRoot();
-    if (false === portal) return null;
-    return /*#__PURE__*/ createPortal(/*#__PURE__*/ jsx(LazyMotion, {
-        features: isMobile ? DomMax : DomAnimation,
-        children: /*#__PURE__*/ jsx(AnimatePresence, {
-            children: true === isOpen && /*#__PURE__*/ jsxs(DrawerWrapper, {
-                style: {
-                    zIndex: 20 + depth,
-                    top: topOffset
-                },
-                transition: {
-                    duration: 0.2
-                },
-                onEscapeKey: handleOverlayDismiss,
-                className: classnames(typedStyles[`drawer-${width}`], typedStyles[`drawer-depth-${depth.toString()}`]),
-                ...rest,
-                children: [
-                    /*#__PURE__*/ jsx(Overlay, {
-                        onClick: handleOverlayDismiss,
-                        style: {
-                            top: topOffset
-                        },
-                        isUnmounting: !(isOpen ?? false)
-                    }),
-                    children
-                ]
-            })
+    const hasTopOffset = '0' !== topOffset;
+    return /*#__PURE__*/ jsx(Drawer.Root, {
+        open: isOpen,
+        onOpenChange: (open)=>{
+            if (!open) onDismiss();
+        },
+        modal: hasTopOffset ? 'trap-focus' : true,
+        swipeDirection: "right",
+        disablePointerDismissal: true !== closeOnOverlayClick,
+        children: /*#__PURE__*/ jsxs(Drawer.Portal, {
+            children: [
+                /*#__PURE__*/ jsx(Drawer.Backdrop, {
+                    className: classnames('infonomic-drawer-backdrop', drawer_module.backdrop),
+                    style: hasTopOffset ? {
+                        top: topOffset
+                    } : void 0
+                }),
+                /*#__PURE__*/ jsx(Drawer.Popup, {
+                    className: classnames('infonomic-drawer-wrapper', drawer_module["drawer-wrapper"], typedStyles[`drawer-${width}`], typedStyles[`drawer-depth-${depth.toString()}`]),
+                    style: hasTopOffset ? {
+                        top: topOffset
+                    } : void 0,
+                    children: children
+                })
+            ]
         })
-    }), portal);
+    });
 };
-Drawer.displayName = 'Drawer';
-Drawer.Container = DrawerContainer;
-Drawer.Content = DrawerContent;
-Drawer.Header = DrawerHeader;
-Drawer.TopActions = DrawerTopActions;
-export { Drawer };
+drawer_Drawer.displayName = 'Drawer';
+drawer_Drawer.Container = DrawerContainer;
+drawer_Drawer.Content = DrawerContent;
+drawer_Drawer.Header = DrawerHeader;
+drawer_Drawer.TopActions = DrawerTopActions;
+export { drawer_Drawer as Drawer };

package/dist/widgets/drawer/drawer.module.css

@@ -1,84 +1,108 @@
 @layer infonomic-base, infonomic-utilities, infonomic-theme, infonomic-components;
 
 @layer infonomic-components {
+
+  /* Backdrop overlay (replaces previous Overlay component) */
+
+  .backdrop,
+  :global(.infonomic-drawer-backdrop) {
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background-color: rgba(245, 245, 245, 0.35);
+    transition: opacity 200ms ease;
+  }
+
+  .backdrop[data-starting-style],
+  .backdrop[data-ending-style] {
+    opacity: 0;
+  }
+
+  :global(.dark) .backdrop,
+  :global([data-theme="dark"]) .backdrop,
+  :global(.dark .infonomic-drawer-backdrop),
+  :global([data-theme="dark"] .infonomic-drawer-backdrop) {
+    background-color: rgba(0, 0, 0, 0.5);
+  }
+
+  /* Drawer wrapper / popup — the sliding panel itself */
+
   .drawer-wrapper,
   :global(.infonomic-drawer-wrapper) {
     position: fixed;
     display: flex;
     flex-direction: column;
-    justify-content: end;
     top: 0;
-    left: 0;
     right: 0;
     bottom: 0;
-    z-index: 30;
-    opacity: 1;
+    background-color: var(--surface-panel);
+    box-shadow: var(--shadow-md);
+    overflow: hidden;
+    transition: transform 200ms cubic-bezier(0.16, 1, 0.3, 1);
+  }
+
+  .drawer-wrapper[data-open] {
+    transform: translateX(var(--drawer-swipe-movement-x, 0px));
+  }
+
+  .drawer-wrapper[data-closed],
+  .drawer-wrapper[data-starting-style] {
+    transform: translateX(100%);
   }
 
+  .drawer-wrapper[data-swiping] {
+    transition: none;
+  }
+
+  /* Container (inner wrapper, no longer needs positioning) */
+
   .drawer-container,
   :global(.infonomic-drawer-container) {
-    position: absolute;
-    right: 0;
     height: 100%;
-    background-color: var(--surface-panel);
-    box-shadow: var(--shadow-md);
-    z-index: inherit;
   }
 
-  .drawer-container[aria-hidden="false"],
-  :global(.infonomic-drawer-container[aria-hidden="false"]) {
-    animation: slideIn 150ms cubic-bezier(0.16, 1, 0.3, 1);
+  /* Width variant: narrow */
+
+  .drawer-narrow,
+  :global(.infonomic-drawer-narrow) {
+    width: calc(100% - 32px);
+    max-width: 400px;
   }
 
-  .drawer-depth-0.drawer-medium .drawer-container,
-  .drawer-depth-0.drawer-wide .drawer-container,
-  :global(.infonomic-drawer-depth-0.drawer-medium .drawer-container),
-  :global(.infonomic-drawer-depth-0.drawer-wide .drawer-container) {
+  /* Width variants: medium/wide at different depths */
+
+  .drawer-depth-0.drawer-medium,
+  .drawer-depth-0.drawer-wide {
     width: 90%;
   }
 
-  .drawer-depth-1.drawer-medium .drawer-container,
-  .drawer-depth-1.drawer-wide .drawer-container,
-  :global(.infonomic-drawer-depth-1.drawer-medium .drawer-container),
-  :global(.infonomic-drawer-depth-1.drawer-wide .drawer-container) {
+  .drawer-depth-1.drawer-medium,
+  .drawer-depth-1.drawer-wide {
     width: 88%;
   }
 
-  .drawer-depth-2.drawer- .drawer-container,
-  .drawer-depth-2.drawer-wide .drawer-container,
-  :global(.infonomic-drawer-depth-2.drawer-medium .drawer-container),
-  :global(.infonomic-drawer-depth-2.drawer-wide .drawer-container) {
+  .drawer-depth-2.drawer-medium,
+  .drawer-depth-2.drawer-wide {
     width: 86%;
   }
 
   @media (min-width: 48rem) {
-    .drawer-depth-0.drawer-medium .drawer-container,
-    :global(.infonomic-drawer-depth-0.drawer-medium .drawer-container) {
+    .drawer-depth-0.drawer-medium {
       width: 600px;
     }
 
-    .drawer-depth-1.drawer-medium .drawer-container,
-    :global(.infonomic-drawer-depth-1.drawer-medium .drawer-container) {
+    .drawer-depth-1.drawer-medium {
       width: 580px;
     }
 
-    .drawer-depth-2.drawer- .drawer-container,
-    :global(.infonomic-drawer-depth-2.drawer-medium .drawer-container) {
+    .drawer-depth-2.drawer-medium {
       width: 560px;
     }
   }
 
-  .drawer-narrow .drawer-container,
-  :global(.infonomic-drawer-narrow .infonomic-drawer-container) {
-    width: calc(100% - 32px);
-    max-width: 400px;
-  }
-
-  .drawer-container[aria-hidden="true"],
-  :global(.infonomic-drawer-container[aria-hidden="true"]) {
-    transform: translateX(100%);
-    opacity: 0;
-  }
+  /* Sub-component styles */
 
   .drawer-top-actions,
   :global(.infonomic-drawer-top-actions) {
@@ -115,16 +139,4 @@
   :global(.infonomic-drawer-content) {
     padding: var(--spacing-12);
   }
-
-  @keyframes slideIn {
-    from {
-      transform: translateX(100%);
-      opacity: 0;
-    }
-
-    to {
-      transform: translateX(0);
-      opacity: 1;
-    }
-  }
-}
+}

package/dist/widgets/drawer/drawer.module.js

@@ -1,10 +1,12 @@
 import "./drawer_module.css";
 const drawer_module = {
+    backdrop: "backdrop-Ga1s55",
     "drawer-wrapper": "drawer-wrapper-q0hBzd",
     drawerWrapper: "drawer-wrapper-q0hBzd",
     "drawer-container": "drawer-container-ssf1qn",
     drawerContainer: "drawer-container-ssf1qn",
-    slideIn: "slideIn-dDQJvD",
+    "drawer-narrow": "drawer-narrow-lsLgHp",
+    drawerNarrow: "drawer-narrow-lsLgHp",
     "drawer-depth-0": "drawer-depth-0-VYE9YM",
     drawerDepth0: "drawer-depth-0-VYE9YM",
     "drawer-medium": "drawer-medium-ZFbdby",
@@ -15,10 +17,6 @@ const drawer_module = {
     drawerDepth1: "drawer-depth-1-2CzoWM",
     "drawer-depth-2": "drawer-depth-2-eR43PT",
     drawerDepth2: "drawer-depth-2-eR43PT",
-    "drawer-": "drawer--tSM0mV",
-    drawer: "drawer--tSM0mV",
-    "drawer-narrow": "drawer-narrow-lsLgHp",
-    drawerNarrow: "drawer-narrow-lsLgHp",
     "drawer-top-actions": "drawer-top-actions-FiHu4U",
     drawerTopActions: "drawer-top-actions-FiHu4U",
     "drawer-header": "drawer-header-BtfxvF",