@itwin/itwinui-react 5.0.0-alpha.5 → 5.0.0-alpha.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (47) hide show
  1. package/CHANGELOG.md +17 -0
  2. package/dist/DEV/bricks/Avatar.js +24 -0
  3. package/dist/DEV/bricks/Badge.js +22 -0
  4. package/dist/DEV/bricks/Checkbox.js +1 -3
  5. package/dist/DEV/bricks/Description.js +13 -11
  6. package/dist/DEV/bricks/DropdownMenu.js +7 -2
  7. package/dist/DEV/bricks/Field.js +33 -56
  8. package/dist/DEV/bricks/Icon.js +5 -2
  9. package/dist/DEV/bricks/ListItem.js +14 -0
  10. package/dist/DEV/bricks/Radio.js +1 -3
  11. package/dist/DEV/bricks/Select.js +1 -3
  12. package/dist/DEV/bricks/Switch.js +1 -3
  13. package/dist/DEV/bricks/Table.js +114 -0
  14. package/dist/DEV/bricks/TextBox.js +1 -5
  15. package/dist/DEV/bricks/Tree.js +16 -10
  16. package/dist/DEV/bricks/index.js +4 -0
  17. package/dist/DEV/bricks/styles.css.js +1 -1
  18. package/dist/DEV/bricks/~hooks.js +9 -1
  19. package/dist/DEV/foundations/styles.css.js +1 -1
  20. package/dist/bricks/Avatar.d.ts +47 -0
  21. package/dist/bricks/Avatar.js +23 -0
  22. package/dist/bricks/Badge.d.ts +28 -0
  23. package/dist/bricks/Badge.js +21 -0
  24. package/dist/bricks/Checkbox.js +1 -3
  25. package/dist/bricks/Description.d.ts +1 -2
  26. package/dist/bricks/Description.js +13 -11
  27. package/dist/bricks/DropdownMenu.js +7 -2
  28. package/dist/bricks/Field.d.ts +4 -8
  29. package/dist/bricks/Field.js +33 -56
  30. package/dist/bricks/Icon.d.ts +28 -3
  31. package/dist/bricks/Icon.js +5 -2
  32. package/dist/bricks/ListItem.d.ts +5 -1
  33. package/dist/bricks/ListItem.js +13 -0
  34. package/dist/bricks/Radio.js +1 -3
  35. package/dist/bricks/Select.js +1 -3
  36. package/dist/bricks/Switch.js +1 -3
  37. package/dist/bricks/Table.d.ts +115 -0
  38. package/dist/bricks/Table.js +108 -0
  39. package/dist/bricks/TextBox.js +1 -5
  40. package/dist/bricks/Tree.js +16 -10
  41. package/dist/bricks/index.d.ts +2 -0
  42. package/dist/bricks/index.js +4 -0
  43. package/dist/bricks/styles.css.js +1 -1
  44. package/dist/bricks/~hooks.d.ts +9 -0
  45. package/dist/bricks/~hooks.js +9 -1
  46. package/dist/foundations/styles.css.js +1 -1
  47. package/package.json +4 -3
package/dist/DEV/bricks/styles.css.js CHANGED
@@ -1,5 +1,5 @@
1
1
  // inline-css:/home/runner/work/kiwi/kiwi/packages/kiwi-react/src/bricks/styles.css
2
- var styles_default = String.raw`@layer kiwi.components.base,kiwi.components.modifiers,kiwi.components.states;@layer kiwi.components{@layer base{.🥝-icon{width:var(--🥝icon-size);height:var(--🥝icon-size);color:var(--🥝icon-color);flex-shrink:0;transition:color .15s ease-out}}@layer modifiers{.🥝-icon:where([data-kiwi-size=regular]){--🥝icon-size:1rem}.🥝-icon:where([data-kiwi-size=large]){--🥝icon-size:1.5rem}}@layer base{.🥝-disclosure-arrow{rotate:var(--🥝disclosure-arrow-rotate);margin-inline-end:-8px}@media (prefers-reduced-motion:no-preference){.🥝-disclosure-arrow{transition:rotate .15s ease-in-out}}}@layer base{.🥝-anchor{cursor:pointer;font-size:var(--kiwi-font-size-12);text-underline-offset:.25ex;-webkit-text-decoration-color:inherit;text-decoration-color:inherit;color:var(--🥝anchor-color);border-radius:4px;font-weight:500;transition:color .15s ease-out,text-decoration-color .15s ease-out}.🥝-anchor:where(button){background:0 0;border:none}}@layer modifiers{.🥝-anchor:where([data-kiwi-tone=neutral]){--🥝anchor-color:var(--kiwi-color-text-neutral-primary)}.🥝-anchor:where([data-kiwi-tone=accent]){--🥝anchor-color:var(--kiwi-color-text-accent-strong)}.🥝-anchor:where([data-kiwi-tone=critical]){--🥝anchor-color:var(--kiwi-color-text-critical-base)}.🥝-anchor:where([data-kiwi-tone=critical]):focus-visible{outline-color:var(--🥝anchor-color)}}@layer states{@media (any-hover:hover){.🥝-anchor:where(:hover){text-decoration-color:#0000}}.🥝-anchor:where(:active){text-decoration-color:#0000}.🥝-anchor:where([disabled],:disabled,[aria-disabled=true]){--🥝anchor-color-text:var(--kiwi-color-text-neutral-disabled);cursor:not-allowed;text-decoration-color:#0000}}@layer base{.🥝-button{white-space:nowrap;-webkit-user-select:none;user-select:none;cursor:pointer;line-height:1.2;font-size:var(--kiwi-font-size-12);block-size:1.5rem;padding-inline:var(--🥝button-padding-inline,12px);background-color:var(--🥝button-background-color);color:var(--🥝button-color,var(--kiwi-color-text-neutral-primary));-webkit-tap-highlight-color:color-mix(in oklch,var(--🥝button-bg--solid-default)100.0%,var(--kiwi-color-glow-hue)var(--kiwi-color-bg-glow-base-pressed-\%));--🥝icon-color:var(--🌀button-state--default,var(--kiwi-color-icon-neutral-base))var(--🌀button-state--hover,var(--kiwi-color-icon-neutral-hover))var(--🌀button-state--pressed,var(--kiwi-color-icon-neutral-hover))var(--🌀button-state--active,var(--kiwi-color-icon-accent-strong))var(--🌀button-state--disabled,var(--kiwi-color-icon-neutral-disabled));border:none;border-radius:4px;flex-shrink:0;justify-content:center;align-items:center;gap:4px;font-weight:500;text-decoration:none;transition:background-color .15s ease-out;display:inline-flex}@media (forced-colors:active){.🥝-button{color:buttontext;--🥝icon-color:ButtonText;background-color:buttonface;border:1px solid buttonborder}}}@layer modifiers{.🥝-button:where([data-kiwi-variant=solid]){--🥝button-background-color:var(--🌀button-state--default,var(--🥝button-bg--solid-default))var(--🌀button-state--hover,color-mix(in oklch,var(--🥝button-bg--solid-default)100.0%,var(--kiwi-color-glow-hue)var(--kiwi-color-bg-glow-base-hover-\%)))var(--🌀button-state--pressed,color-mix(in oklch,var(--🥝button-bg--solid-default)100.0%,var(--kiwi-color-glow-hue)var(--kiwi-color-bg-glow-base-pressed-\%)))var(--🌀button-state--disabled,var(--kiwi-color-bg-glow-on-surface-disabled));box-shadow:var(--🌀button-state--default,var(--kiwi-shadow-button-base-inset),0px 0px 0px 1px var(--🥝button-border-color)inset,var(--kiwi-shadow-button-base-drop))var(--🌀button-state--hover,var(--kiwi-shadow-button-base-inset),0px 0px 0px 1px var(--🥝button-border-color)inset,var(--kiwi-shadow-button-base-drop))var(--🌀button-state--pressed,0px 0px 0px 1px var(--🥝button-border-color)inset)var(--🌀button-state--disabled,none)}.🥝-button:where([data-kiwi-variant=solid]):where([data-kiwi-tone=neutral]){--🥝button-bg--solid-default:var(--kiwi-color-bg-neutral-base);--🥝button-border-color:var(--🌀button-state--default,var(--kiwi-color-border-shadow-base))var(--🌀button-state--hover,color-mix(in oklch,var(--kiwi-color-border-shadow-base)100.0%,var(--kiwi-color-glow-hue)var(--kiwi-color-border-glow-base-hover-\%)))var(--🌀button-state--pressed,color-mix(in oklch,var(--kiwi-color-border-shadow-base)100.0%,var(--kiwi-color-glow-hue)var(--kiwi-color-border-glow-base-pressed-\%)))var(--🌀button-state--disabled,transparent)}.🥝-button:where([data-kiwi-variant=solid]):where([data-kiwi-tone=accent]){--🥝button-bg--solid-default:var(--kiwi-color-bg-accent-base);--🥝button-border-color:var(--🌀button-state--default,var(--kiwi-color-border-shadow-strong))var(--🌀button-state--hover,color-mix(in oklch,var(--kiwi-color-border-shadow-strong)100.0%,var(--kiwi-color-glow-hue)var(--kiwi-color-border-glow-strong-hover-\%)))var(--🌀button-state--pressed,color-mix(in oklch,var(--kiwi-color-border-shadow-strong)100.0%,var(--kiwi-color-glow-hue)var(--kiwi-color-border-glow-strong-pressed-\%)))var(--🌀button-state--disabled,transparent);--🥝button-color:var(--kiwi-color-text-neutral-emphasis);--🥝icon-color:var(--🌀button-state--default,var(--kiwi-color-icon-neutral-emphasis))var(--🌀button-state--hover,var(--kiwi-color-icon-strong-hover))var(--🌀button-state--pressed,var(--kiwi-color-icon-neutral-hover))var(--🌀button-state--disabled,var(--kiwi-color-icon-neutral-disabled))}@media (forced-colors:active){.🥝-button:where([data-kiwi-variant=solid]):where([data-kiwi-tone=accent]){--🥝icon-color:ButtonText}}.🥝-button:where([data-kiwi-variant=outline]){--🥝button-background-color:var(--🌀button-state--default,transparent)var(--🌀button-state--hover,color-mix(in oklch,transparent 100.0%,var(--kiwi-color-glow-hue)var(--kiwi-color-bg-glow-base-hover-\%)))var(--🌀button-state--pressed,color-mix(in oklch,transparent 100.0%,var(--kiwi-color-glow-hue)var(--kiwi-color-bg-glow-base-pressed-\%)))var(--🌀button-state--disabled,transparent);--🥝button-border-color:var(--🌀button-state--default,var(--kiwi-color-border-neutral-base))var(--🌀button-state--hover,color-mix(in oklch,var(--kiwi-color-border-neutral-base)100.0%,var(--kiwi-color-glow-hue)var(--kiwi-color-border-glow-base-hover-\%)))var(--🌀button-state--pressed,color-mix(in oklch,var(--kiwi-color-border-neutral-base)100.0%,var(--kiwi-color-glow-hue)var(--kiwi-color-border-glow-base-pressed-\%)))var(--🌀button-state--disabled,var(--kiwi-color-border-glow-on-surface-disabled));box-shadow:0px 0px 0px 1px var(--🥝button-border-color)inset}.🥝-button:where([data-kiwi-variant=ghost]){--🥝button-background-color:var(--🌀button-state--default,transparent)var(--🌀button-state--hover,color-mix(in oklch,transparent 100.0%,var(--kiwi-color-glow-hue)var(--kiwi-color-bg-glow-base-hover-\%)))var(--🌀button-state--pressed,color-mix(in oklch,transparent 100.0%,var(--kiwi-color-glow-hue)var(--kiwi-color-bg-glow-base-pressed-\%)))var(--🌀button-state--active,var(--kiwi-color-bg-glow-on-surface-accent-pressed))var(--🌀button-state--disabled,transparent)}}@layer states{@media (any-hover:hover){.🥝-button:where(:hover){--🌀button-state:var(--🌀button-state--hover)}}.🥝-button:where(:active){--🌀button-state:var(--🌀button-state--pressed)}.🥝-button:where([data-kiwi-variant=ghost][aria-pressed=true]){--🌀button-state:var(--🌀button-state--active)}@media (forced-colors:active){.🥝-button:where([data-kiwi-variant=ghost][aria-pressed=true]){color:selecteditemtext;--🥝icon-color:SelectedItemText;background-color:selecteditem}}.🥝-button:where([disabled],:disabled,[aria-disabled=true]){--🌀button-state:var(--🌀button-state--disabled);color:var(--kiwi-color-text-neutral-disabled);cursor:not-allowed}@media (forced-colors:active){.🥝-button:where([disabled],:disabled,[aria-disabled=true]){color:graytext;--🥝icon-color:GrayText;border-color:graytext}}}@layer base.🌀{.🥝-button{--🌀button-state:var(--🌀button-state--default);--🌀button-state--default:var(--🌀button-state, );--🌀button-state--hover:var(--🌀button-state, );--🌀button-state--pressed:var(--🌀button-state, );--🌀button-state--active:var(--🌀button-state, );--🌀button-state--disabled:var(--🌀button-state, )}}@layer base{.🥝-checkbox{--🥝checkbox-color-svg:var(--kiwi-color-icon-neutral-emphasis);--🥝checkbox-border-radius:4px;--🥝checkbox-unchecked-svg:url("data:image/svg+xml;utf8,<svg viewBox=\"0 0 16 16\"></svg>");--🥝checkbox-checkmark-svg:url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 16 16\"><path stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" d=\"M11.2 5.6 6.8 10l-2-2\"/></svg>");--🥝checkbox-indeterminate-svg:url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 16 16\"><path stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" d=\"M5 8h6.5\"/></svg>");appearance:none;cursor:pointer;background-color:var(--🌀checkbox-visual-state--default,var(--kiwi-color-bg-neutral-base))var(--🌀checkbox-visual-state--hover,color-mix(in oklch,var(--kiwi-color-bg-neutral-base)100.0%,var(--kiwi-color-glow-hue)var(--kiwi-color-bg-glow-base-hover-\%)))var(--🌀checkbox-visual-state--checked,var(--kiwi-color-bg-accent-base))var(--🌀checkbox-visual-state--checked-hover,color-mix(in oklch,var(--kiwi-color-bg-accent-base)100.0%,var(--kiwi-color-glow-hue)var(--kiwi-color-bg-glow-base-pressed-\%)))var(--🌀checkbox-visual-state--disabled,var(--kiwi-color-bg-glow-on-surface-disabled));border-radius:var(--🥝checkbox-border-radius);block-size:1rem;inline-size:1rem;color:var(--🌀checkbox-aria-state--unchecked,transparent)var(--🌀checkbox-aria-state--checked,var(--🥝checkbox-color-svg))var(--🌀checkbox-aria-state--indeterminate,var(--🥝checkbox-color-svg));box-shadow:var(--kiwi-shadow-button-base-inset),0px 0px 0px 1px var(--🥝checkbox-border-color)inset,var(--kiwi-shadow-button-base-drop);--🥝checkbox-border-color:var(--🌀checkbox-visual-state--default,var(--kiwi-color-border-shadow-base))var(--🌀checkbox-visual-state--hover,color-mix(in oklch,var(--kiwi-color-border-shadow-base)100.0%,var(--kiwi-color-glow-hue)var(--kiwi-color-border-glow-base-hover-\%)))var(--🌀checkbox-visual-state--checked,var(--kiwi-color-border-shadow-strong))var(--🌀checkbox-visual-state--checked-hover,color-mix(in oklch,var(--kiwi-color-border-shadow-strong)100.0%,var(--kiwi-color-glow-hue)var(--kiwi-color-border-glow-base-pressed-\%)))var(--🌀checkbox-visual-state--disabled,transparent);--🥝checkbox-mask-image:var(--🌀checkbox-aria-state--unchecked,var(--🥝checkbox-unchecked-svg))var(--🌀checkbox-aria-state--checked,var(--🥝checkbox-checkmark-svg))var(--🌀checkbox-aria-state--indeterminate,var(--🥝checkbox-indeterminate-svg));transition:background-color .15s ease-out,border-color .15s ease-out,box-shadow .15s ease-out,--🥝checkbox-border-color .15s ease-out;position:relative}.🥝-checkbox:before,.🥝-checkbox:after{content:"";position:absolute;inset:0}.🥝-checkbox:before{inset:calc(.5rem - 12px)}.🥝-checkbox:after{-webkit-mask-image:var(--🥝checkbox-mask-image,initial);mask-image:var(--🥝checkbox-mask-image,initial);background-color:currentColor;-webkit-mask-position:50%;mask-position:50%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}@media (forced-colors:active){.🥝-checkbox:after{background-color:canvastext}}}@layer states{@media (forced-colors:active){.🥝-checkbox{border:1px solid canvastext}}@media (any-hover:hover){.🥝-checkbox:where(:hover){--🌀checkbox-visual-state:var(--🌀checkbox-visual-state--hover)}}.🥝-checkbox:where(:checked,[aria-checked=true]){--🌀checkbox-visual-state:var(--🌀checkbox-visual-state--checked);--🌀checkbox-aria-state:var(--🌀checkbox-aria-state--checked)}@media (any-hover:hover){.🥝-checkbox:where(:checked,[aria-checked=true]):where(:hover){--🌀checkbox-visual-state:var(--🌀checkbox-visual-state--checked-hover)}}.🥝-checkbox:where(:indeterminate,[aria-checked=mixed]){--🌀checkbox-visual-state:var(--🌀checkbox-visual-state--checked);--🌀checkbox-aria-state:var(--🌀checkbox-aria-state--indeterminate)}.🥝-checkbox:where([disabled],:disabled,[aria-disabled=true]){--🌀checkbox-visual-state:var(--🌀checkbox-visual-state--disabled);--🥝checkbox-color-svg:var(--kiwi-color-icon-neutral-disabled);cursor:not-allowed;box-shadow:none}@media (forced-colors:active){.🥝-checkbox:where([disabled],:disabled,[aria-disabled=true]){border-color:graytext}.🥝-checkbox:where([disabled],:disabled,[aria-disabled=true]):after{background-color:graytext}}}@layer base.🌀{.🥝-checkbox{--🌀checkbox-visual-state:var(--🌀checkbox-visual-state--default);--🌀checkbox-visual-state--default:var(--🌀checkbox-visual-state, );--🌀checkbox-visual-state--hover:var(--🌀checkbox-visual-state, );--🌀checkbox-visual-state--checked:var(--🌀checkbox-visual-state, );--🌀checkbox-visual-state--checked-hover:var(--🌀checkbox-visual-state, );--🌀checkbox-visual-state--disabled:var(--🌀checkbox-visual-state, );--🌀checkbox-aria-state:var(--🌀checkbox-aria-state--unchecked);--🌀checkbox-aria-state--unchecked:var(--🌀checkbox-aria-state, );--🌀checkbox-aria-state--checked:var(--🌀checkbox-aria-state, );--🌀checkbox-aria-state--indeterminate:var(--🌀checkbox-aria-state, )}}@layer base{.🥝-chip{isolation:isolate;--🥝chip-padding-inline:.5rem;padding-inline:var(--🥝chip-padding-inline);border:none;border-radius:9999px;align-items:center;min-block-size:1.5rem;display:inline-flex;position:relative}}.🥝-chip:before{z-index:-1;content:"";border-radius:inherit;border:1px solid var(--kiwi-color-border-neutral-base);pointer-events:none;position:absolute;inset:0}@layer modifiers{.🥝-chip:where([data-kiwi-variant=solid]){background-color:var(--kiwi-color-bg-neutral-base)}.🥝-chip:where([data-kiwi-variant=outline]){background-color:var(--kiwi-color-bg-surface-primary)}}@layer base{.🥝-chip-dismiss-button.🥝-icon-button{border-radius:inherit;margin-inline-end:calc(-1*var(--🥝chip-padding-inline));position:relative}}@layer modifiers{.🥝-description.🥝-text:where([data-kiwi-tone=neutral]){color:var(--kiwi-color-text-neutral-tertiary)}.🥝-description.🥝-text:where([data-kiwi-tone=critical]){color:var(--kiwi-color-text-critical-base)}}.🥝-divider{background-color:var(--kiwi-color-border-neutral-muted);flex:none;align-self:stretch}@media (forced-colors:active){.🥝-divider{background-color:canvastext}}.🥝-divider:is(hr){border:none;margin:0}.🥝-divider:not([aria-orientation=vertical],[data-kiwi-orientation=vertical]){block-size:1px}.🥝-divider:is([aria-orientation=vertical],[data-kiwi-orientation=vertical]){min-block-size:100%;inline-size:1px}@layer base{.🥝-dropdown-menu{background-color:var(--kiwi-color-bg-surface-tertiary);min-inline-size:min(95vi,164px);box-shadow:var(--kiwi-shadow-surface-xl);border-radius:8px;flex-direction:column;padding:.5rem;display:flex}}@layer states{.🥝-dropdown-menu-button:where([aria-expanded=true]){--🥝disclosure-arrow-rotate:.5turn}}@layer base{.🥝-dropdown-menu-item.🥝-list-item{border-radius:4px}}@layer states{.🥝-dropdown-menu-item.🥝-list-item:where([role=menuitemcheckbox]:not([aria-checked=true])){--🥝dropdown-menu-checkmark-visibility:hidden}}@layer base{.🥝-dropdown-menu-checkmark{visibility:var(--🥝dropdown-menu-checkmark-visibility)}}@layer base{.🥝-dropdown-menu-item-shortcuts{margin-inline-start:.5rem}}@layer base{.🥝-icon-button.🥝-button{aspect-ratio:1;--🥝button-padding-inline:4px}}@layer base{.🥝-kbd{color:var(--kiwi-color-text-neutral-secondary);min-block-size:16px;font-family:inherit;font-weight:500;font-size:var(--kiwi-font-size-12);letter-spacing:0;flex-shrink:0;justify-content:center;align-items:center;line-height:1.3333;display:inline-flex}}@layer modifiers{.🥝-kbd:where([data-kiwi-variant=solid],[data-kiwi-variant=muted]){background-color:var(--kiwi-color-bg-neutral-base);border-radius:4px;padding-inline:4px}.🥝-kbd:where([data-kiwi-variant=solid]){box-shadow:var(--kiwi-shadow-button-base-inset),0px 0px 0px 1px var(--kiwi-color-border-shadow-base)inset,var(--kiwi-shadow-button-base-drop)}.🥝-kbd:where([data-kiwi-variant=ghost]){color:var(--kiwi-color-text-neutral-tertiary)}}@layer base{.🥝-label{color:var(--kiwi-color-text-neutral-secondary);cursor:default;font-size:var(--kiwi-font-size-12)}.🥝-label:is(label){cursor:pointer}}@layer states{.🥝-label:has(+:where(:disabled,[disabled],[aria-disabled=true])){color:var(--kiwi-color-text-neutral-disabled)}.🥝-label:has(+:where(:disabled,[disabled],[aria-disabled=true])):is(label){cursor:not-allowed}}.🥝-radio.🥝-checkbox{--🥝checkbox-border-radius:9999px;--🥝checkbox-checkmark-svg:url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 16 16\" ><circle cx=\"8\" cy=\"8\" r=\"4\" /></svg>");--🥝checkbox-indeterminate-svg:var(--🥝checkbox-unchecked-svg)}@layer states{.🥝-radio.🥝-checkbox:where(:indeterminate){--🌀checkbox-visual-state:var(--🌀checkbox-visual-state--default)}}@layer base{.🥝-list-item{cursor:pointer;line-height:1.2;font-size:var(--kiwi-font-size-12);background-color:var(--🥝list-item-background-color);--🥝list-item-background-color:var(--🌀list-item-state--default,transparent)var(--🌀list-item-state--hover,color-mix(in oklch,transparent 100.0%,var(--kiwi-color-glow-hue)var(--kiwi-color-bg-glow-on-surface-neutral-hover-\%)))var(--🌀list-item-state--pressed,color-mix(in oklch,transparent 100.0%,var(--kiwi-color-glow-hue)var(--kiwi-color-bg-glow-on-surface-neutral-pressed-\%)))var(--🌀list-item-state--active,var(--kiwi-color-bg-glow-on-surface-accent-pressed))var(--🌀list-item-state--active-hover,var(--kiwi-color-bg-glow-on-surface-accent-pressed))var(--🌀list-item-state--active-child,color-mix(in oklch,var(--kiwi-color-bg-glow-on-surface-accent-pressed),transparent 50.0%))var(--🌀list-item-state--active-child-hover,color-mix(in oklch,color-mix(in oklch,var(--kiwi-color-bg-glow-on-surface-accent-pressed),transparent 50.0%)100.0%,var(--kiwi-color-glow-hue)var(--kiwi-color-bg-glow-base-hover-\%)))var(--🌀list-item-state--disabled,transparent);min-block-size:1.75rem;color:var(--🌀list-item-state--default,var(--kiwi-color-text-neutral-primary))var(--🌀list-item-state--hover,var(--kiwi-color-text-neutral-primary))var(--🌀list-item-state--pressed,var(--kiwi-color-text-neutral-primary))var(--🌀list-item-state--active,var(--kiwi-color-text-accent-strong))var(--🌀list-item-state--active-hover,var(--kiwi-color-text-accent-strong))var(--🌀list-item-state--active-child,var(--kiwi-color-text-neutral-primary))var(--🌀list-item-state--active-child-hover,var(--kiwi-color-text-neutral-primary))var(--🌀list-item-state--disabled,var(--kiwi-color-text-neutral-disabled));--🥝icon-color:var(--🌀list-item-state--default,var(--kiwi-color-icon-neutral-base))var(--🌀list-item-state--hover,var(--kiwi-color-icon-neutral-hover))var(--🌀list-item-state--pressed,var(--kiwi-color-icon-neutral-hover))var(--🌀list-item-state--active,var(--kiwi-color-icon-accent-strong))var(--🌀list-item-state--active-hover,var(--kiwi-color-icon-accent-strong))var(--🌀list-item-state--active-child,var(--kiwi-color-icon-neutral-base))var(--🌀list-item-state--active-child-hover,var(--kiwi-color-icon-neutral-base))var(--🌀list-item-state--disabled,var(--kiwi-color-icon-neutral-disabled));align-items:center;gap:.25rem;padding-inline:.5rem;display:flex}}@layer states{@media (any-hover:hover){.🥝-list-item:where(:hover){--🌀list-item-state:var(--🌀list-item-state--hover)}}.🥝-list-item:where(:active){--🌀list-item-state:var(--🌀list-item-state--pressed)}.🥝-list-item:where([disabled],:disabled,[aria-disabled=true]){--🌀list-item-state:var(--🌀list-item-state--disabled);cursor:not-allowed}}@layer base.🌀{.🥝-list-item{--🌀list-item-state:var(--🌀list-item-state--default);--🌀list-item-state--default:var(--🌀list-item-state, );--🌀list-item-state--hover:var(--🌀list-item-state, );--🌀list-item-state--pressed:var(--🌀list-item-state, );--🌀list-item-state--active:var(--🌀list-item-state, );--🌀list-item-state--active-hover:var(--🌀list-item-state, );--🌀list-item-state--active-child:var(--🌀list-item-state, );--🌀list-item-state--active-child-hover:var(--🌀list-item-state, );--🌀list-item-state--disabled:var(--🌀list-item-state, )}}.🥝-list-item-content{flex-grow:1}@layer base{.🥝-spinner{color:var(--🥝spinner-color);block-size:var(--🥝spinner-size);inline-size:var(--🥝spinner-size);display:inline-block}}@layer modifiers{.🥝-spinner:where([data-kiwi-tone=neutral]){--🥝spinner-color:var(--kiwi-color-icon-neutral-base)}.🥝-spinner:where([data-kiwi-tone=accent]){--🥝spinner-color:var(--kiwi-color-icon-accent-strong)}.🥝-spinner:where([data-kiwi-size=small]){--🥝spinner-size:1rem}.🥝-spinner:where([data-kiwi-size=medium]){--🥝spinner-size:1.5rem}.🥝-spinner:where([data-kiwi-size=large]){--🥝spinner-size:2rem}.🥝-spinner:where([data-kiwi-size=xlarge]){--🥝spinner-size:3rem}}@layer base{.🥝-spinner-svg{block-size:inherit;inline-size:inherit;fill:none;animation:1s linear infinite both --🥝spinner-spin}@media (prefers-reduced-motion){.🥝-spinner-svg{animation-duration:4s;animation-timing-function:steps(4,end)}}}@keyframes --🥝spinner-spin{to{rotate:360deg}}@layer base{.🥝-select-root:where(:has(select.🥝-select),[data-kiwi-has-select=true]){--🥝button-padding-inline:8px calc(4px + 16px + 4px);align-items:center;display:inline-grid}.🥝-select-root:where(:has(select.🥝-select),[data-kiwi-has-select=true])>*{grid-area:1/1/-1/-1}}@layer base{.🥝-select.🥝-button:where(select:not([multiple])){appearance:none}}@layer base{.🥝-select-arrow.🥝-disclosure-arrow{pointer-events:none;--🥝icon-color:var(--🌀select-arrow-state--default,var(--kiwi-color-icon-neutral-base))var(--🌀select-arrow-state--hover,var(--kiwi-color-icon-neutral-hover))var(--🌀select-arrow-state--disabled,var(--kiwi-color-icon-neutral-disabled));justify-self:end;margin-inline-end:4px}}@layer states{@media (any-hover:hover){:where(.🥝-select:hover)+.🥝-select-arrow.🥝-disclosure-arrow{--🌀select-arrow-state:var(--🌀select-arrow-state--hover)}}:where(.🥝-select:disabled)+.🥝-select-arrow.🥝-disclosure-arrow{--🌀select-arrow-state:var(--🌀select-arrow-state--disabled)}}@layer base.🌀{.🥝-select-arrow.🥝-disclosure-arrow{--🌀select-arrow-state:var(--🌀select-arrow-state--default);--🌀select-arrow-state--default:var(--🌀select-arrow-state, );--🌀select-arrow-state--hover:var(--🌀select-arrow-state, );--🌀select-arrow-state--disabled:var(--🌀select-arrow-state, )}}@layer base{.🥝-switch{appearance:none;cursor:pointer;background-color:var(--🌀switch-state--default,var(--kiwi-color-bg-surface-primary))var(--🌀switch-state--hover,color-mix(in oklch,var(--kiwi-color-bg-surface-primary)100.0%,var(--kiwi-color-glow-hue)var(--kiwi-color-bg-glow-base-hover-\%)))var(--🌀switch-state--pressed,color-mix(in oklch,var(--kiwi-color-bg-surface-primary)100.0%,var(--kiwi-color-glow-hue)var(--kiwi-color-bg-glow-base-hover-\%)))var(--🌀switch-state--checked,var(--kiwi-color-bg-accent-base))var(--🌀switch-state--checked-hover,color-mix(in oklch,var(--kiwi-color-bg-accent-base)100.0%,var(--kiwi-color-glow-hue)var(--kiwi-color-bg-glow-strong-hover-\%)))var(--🌀switch-state--disabled,var(--kiwi-color-bg-surface-primary));border:1px solid #0000;border-color:var(--🌀switch-state--default,var(--kiwi-color-border-neutral-base))var(--🌀switch-state--hover,color-mix(in oklch,var(--kiwi-color-border-neutral-base)100.0%,var(--kiwi-color-glow-hue)var(--kiwi-color-border-glow-base-hover-\%)))var(--🌀switch-state--pressed,color-mix(in oklch,var(--kiwi-color-border-neutral-base)100.0%,var(--kiwi-color-glow-hue)var(--kiwi-color-border-glow-base-pressed-\%)))var(--🌀switch-state--checked,color-mix(in oklch,var(--kiwi-color-bg-accent-base)100.0%,var(--kiwi-color-glow-hue)var(--kiwi-color-border-glow-strong-hover-\%)))var(--🌀switch-state--checked-hover,color-mix(in oklch,var(--kiwi-color-bg-accent-base)100.0%,var(--kiwi-color-glow-hue)var(--kiwi-color-border-glow-strong-hover-\%)))var(--🌀switch-state--disabled,var(--kiwi-color-border-glow-on-surface-disabled));border-radius:9999px;align-items:center;inline-size:2rem;transition:background-color .15s ease-out,border-color .15s ease-out;display:inline-grid;position:relative}.🥝-switch:before,.🥝-switch:after{content:"";grid-area:1/1/-1/-1;display:block}.🥝-switch:before{block-size:24px;inline-size:2rem;margin:-1px;position:absolute}.🥝-switch:after{aspect-ratio:var(--🥝switch-thumb-aspect-ratio);background-color:var(--🥝switch-thumb-color);block-size:1rem;box-shadow:var(--kiwi-shadow-button-base-inset),0px 0px 0px 1px var(--kiwi-color-border-shadow-base)inset,var(--kiwi-shadow-button-base-drop);justify-self:var(--🥝switch-thumb-placement);border-radius:9999px;margin:calc(.125rem - 1px)}@media (prefers-reduced-motion:no-preference){.🥝-switch:after{will-change:aspect-ratio;transition:aspect-ratio .15s ease-out}}@media (forced-colors:active){.🥝-switch:after{background-color:canvastext}}}@layer states{.🥝-switch{--🥝switch-thumb-color:var(--kiwi-color-bg-neutral-inverse);--🥝switch-thumb-placement:start;--🥝switch-thumb-aspect-ratio:1/1}@media (any-hover:hover){.🥝-switch:where(:hover){--🌀switch-state:var(--🌀switch-state--hover)}}.🥝-switch:where(:checked,[aria-checked=true]){--🌀switch-state:var(--🌀switch-state--checked);--🥝switch-thumb-placement:end}@media (any-hover:hover){.🥝-switch:where(:checked,[aria-checked=true]):where(:hover){--🌀switch-state:var(--🌀switch-state--checked-hover)}}.🥝-switch:where(:active){--🌀switch-state:var(--🌀switch-state--pressed);--🥝switch-thumb-aspect-ratio:1.75}.🥝-switch:where([disabled],:disabled,[aria-disabled=true]){--🌀switch-state:var(--🌀switch-state--disabled);--🥝switch-thumb-color:var(--kiwi-color-icon-neutral-disabled);cursor:not-allowed}.🥝-switch:where([disabled],:disabled,[aria-disabled=true]):after{box-shadow:none}}@layer base.🌀{.🥝-switch{--🌀switch-state:var(--🌀switch-state--default);--🌀switch-state--default:var(--🌀switch-state, );--🌀switch-state--hover:var(--🌀switch-state, );--🌀switch-state--pressed:var(--🌀switch-state, );--🌀switch-state--checked:var(--🌀switch-state, );--🌀switch-state--checked-hover:var(--🌀switch-state, );--🌀switch-state--disabled:var(--🌀switch-state, )}}@layer base{.🥝-tab-list{--🥝tab-active-stripe-gap:6px;gap:8px;display:flex}}@layer modifiers{.🥝-tab-list[aria-orientation=horizontal]{padding-block-end:var(--🥝tab-active-stripe-gap)}}@layer base{.🥝-tab{font-size:var(--kiwi-font-size-12);color:var(--🥝tab-color);background-color:var(--🥝tab-bg);-webkit-user-select:none;user-select:none;white-space:nowrap;cursor:pointer;border:none;border-radius:4px;block-size:1.25rem;padding-inline:4px;transition:background-color .15s ease-out,color .15s ease-out;position:relative}@media (forced-colors:active){.🥝-tab{color:buttontext}}.🥝-tab:before{content:"";inset-inline:0;inset-block:0 calc(var(--🥝tab-active-stripe-gap)*-1);position:absolute}}@layer modifiers{:where(.🥝-tab-list[data-kiwi-tone=neutral]) .🥝-tab{--🥝tab-active-stripe-color:var(--kiwi-color-border-neutral-inverse);--🥝tab-bg:var(--🌀tab-state--default,transparent)var(--🌀tab-state--hover,color-mix(in oklch,transparent 100.0%,var(--kiwi-color-glow-hue)var(--kiwi-color-bg-glow-on-surface-neutral-hover-\%)))var(--🌀tab-state--selected,transparent)var(--🌀tab-state--disabled,transparent);--🥝tab-color:var(--🌀tab-state--default,var(--kiwi-color-text-neutral-tertiary))var(--🌀tab-state--hover,var(--kiwi-color-text-neutral-primary))var(--🌀tab-state--selected,var(--kiwi-color-text-neutral-primary))var(--🌀tab-state--disabled,var(--kiwi-color-text-neutral-disabled));-webkit-tap-highlight-color:color-mix(in oklch,transparent 100.0%,var(--kiwi-color-glow-hue)var(--kiwi-color-bg-glow-on-surface-neutral-hover-\%))}:where(.🥝-tab-list[data-kiwi-tone=accent]) .🥝-tab{--🥝tab-active-stripe-color:var(--kiwi-color-border-accent-strong);--🥝tab-bg:var(--🌀tab-state--default,transparent)var(--🌀tab-state--hover,var(--kiwi-color-bg-glow-on-surface-accent-hover))var(--🌀tab-state--selected,transparent)var(--🌀tab-state--disabled,transparent);--🥝tab-color:var(--🌀tab-state--default,var(--kiwi-color-text-neutral-tertiary))var(--🌀tab-state--hover,var(--kiwi-color-text-accent-strong))var(--🌀tab-state--selected,var(--kiwi-color-text-accent-strong))var(--🌀tab-state--disabled,var(--kiwi-color-text-neutral-disabled));-webkit-tap-highlight-color:var(--kiwi-color-bg-glow-on-surface-accent-hover)}}@layer states{.🥝-tab:where([aria-selected=true]){--🌀tab-state:var(--🌀tab-state--selected)}.🥝-tab:where([aria-selected=true]):after{content:"";background-color:var(--🥝tab-active-stripe-color);block-size:2px;inset-inline:4px;inset-block:auto calc(var(--🥝tab-active-stripe-gap)*-1);position:absolute}@media (prefers-reduced-motion:no-preference){.🥝-tab:where([aria-selected=true]):after{view-transition-name:var(--🥝tab-active-stripe-view-transition-name)}}@media (forced-colors:active){.🥝-tab:where([aria-selected=true]):after{background-color:selecteditem}}@media (any-hover:hover){.🥝-tab:where(:hover){--🌀tab-state:var(--🌀tab-state--hover)}}.🥝-tab:where([disabled],:disabled,[aria-disabled=true]){--🌀tab-state:var(--🌀tab-state--disabled);--🥝tab-active-stripe-color:var(--kiwi-color-border-neutral-disabled);cursor:not-allowed}@media (forced-colors:active){.🥝-tab:where([disabled],:disabled,[aria-disabled=true]){color:graytext}.🥝-tab:where([disabled],:disabled,[aria-disabled=true]):after{background-color:graytext}}}@layer base.🌀{.🥝-tab{--🌀tab-state:var(--🌀tab-state--default);--🌀tab-state--default:var(--🌀tab-state, );--🌀tab-state--hover:var(--🌀tab-state, );--🌀tab-state--selected:var(--🌀tab-state, );--🌀tab-state--disabled:var(--🌀tab-state, )}}@layer base{.🥝-tab-panel{outline-offset:-2px}.🥝-tab-panel:not([data-open]){display:none!important}}@layer modifiers{.🥝-text:where([data-kiwi-text-variant=display-lg]){font-size:var(--kiwi-font-size-48);letter-spacing:0;line-height:1.1667}.🥝-text:where([data-kiwi-text-variant=display-md]){font-size:var(--kiwi-font-size-40);letter-spacing:0;line-height:1.2}.🥝-text:where([data-kiwi-text-variant=display-sm]){font-size:var(--kiwi-font-size-32);letter-spacing:0;line-height:1.25}.🥝-text:where([data-kiwi-text-variant=headline-lg]){font-size:var(--kiwi-font-size-28);letter-spacing:0;line-height:1.2857}.🥝-text:where([data-kiwi-text-variant=headline-md]){font-size:var(--kiwi-font-size-24);letter-spacing:0;line-height:1.3333}.🥝-text:where([data-kiwi-text-variant=headline-sm]){font-size:var(--kiwi-font-size-20);letter-spacing:0;line-height:1.4}.🥝-text:where([data-kiwi-text-variant=body-lg]){font-size:var(--kiwi-font-size-16);letter-spacing:0;line-height:1.5}.🥝-text:where([data-kiwi-text-variant=body-md]){font-size:var(--kiwi-font-size-14);letter-spacing:0;line-height:1.4286}.🥝-text:where([data-kiwi-text-variant=body-sm]){font-size:var(--kiwi-font-size-12);letter-spacing:0;line-height:1.3333}.🥝-text:where([data-kiwi-text-variant=caption-lg]){font-size:var(--kiwi-font-size-11);letter-spacing:0;line-height:1.4545}.🥝-text:where([data-kiwi-text-variant=caption-md]){font-size:var(--kiwi-font-size-10);letter-spacing:0;line-height:1.2}.🥝-text:where([data-kiwi-text-variant=caption-sm]){font-size:var(--kiwi-font-size-8);letter-spacing:0;line-height:1.5}.🥝-text:where([data-kiwi-text-variant=mono-sm]){font-family:var(--kiwi-font-family-mono);font-size:var(--kiwi-font-size-12);letter-spacing:0;line-height:1.3333}}@layer base{.🥝-text-box{cursor:var(--🥝text-box-cursor);font-size:var(--kiwi-font-size-12);background-color:var(--🥝text-box-background-color);min-block-size:1.5rem;min-inline-size:0;box-shadow:var(--kiwi-shadow-input-base);color:var(--kiwi-color-text-neutral-primary);--🥝text-box-cursor:text;--🥝text-box-background-color:var(--🌀text-box-state--default,var(--kiwi-color-bg-surface-primary))var(--🌀text-box-state--hover,color-mix(in oklch,var(--kiwi-color-bg-surface-primary)100.0%,var(--kiwi-color-glow-hue)var(--kiwi-color-bg-glow-base-hover-\%)))var(--🌀text-box-state--disabled,var(--kiwi-color-bg-surface-base));--🥝text-box-border-color:var(--🌀text-box-state--default,var(--kiwi-color-border-neutral-base))var(--🌀text-box-state--hover,color-mix(in oklch,var(--kiwi-color-border-neutral-base)100.0%,var(--kiwi-color-glow-hue)var(--kiwi-color-border-glow-base-hover-\%)))var(--🌀text-box-state--disabled,var(--kiwi-color-border-glow-on-surface-disabled));border-radius:4px;padding-inline:8px;transition:background-color .15s ease-out,border-color .15s ease-out}.🥝-text-box:where(:not(input,textarea)){align-items:center;gap:4px;display:inline-flex;position:relative}.🥝-text-box:where(:not(input,textarea)):before{content:"";border-radius:inherit;pointer-events:none;border:1px solid var(--🥝text-box-border-color);transition:border-color .15s ease-out;position:absolute;inset:0}.🥝-text-box:where(input,textarea),.🥝-text-box :where(input,textarea){appearance:none;border:1px solid var(--🥝text-box-border-color);min-inline-size:0;cursor:var(--🥝text-box-cursor);padding-block:max(0px,.75rem - 1px - .5lh);line-height:1.3}:is(.🥝-text-box:where(input,textarea),.🥝-text-box :where(input,textarea))::placeholder{color:var(--kiwi-color-text-neutral-secondary);opacity:1;-webkit-user-select:none;user-select:none}.🥝-text-box:where(textarea),.🥝-text-box :where(textarea){resize:vertical;resize:block}.🥝-text-box :where(input,textarea){background-color:var(--🥝text-box-background-color);outline:unset;border:none;flex:999;align-self:stretch;transition:background-color .15s ease-out}}@layer states{@media (any-hover:hover){.🥝-text-box:where(:hover){--🌀text-box-state:var(--🌀text-box-state--hover)}}.🥝-text-box:where(:has(:is(input,textarea):focus-visible),:is(input,textarea):focus-visible){outline:2px solid var(--kiwi-color-border-accent-base);outline-offset:1px;--🥝text-box-border-color:var(--kiwi-color-border-accent-strong);--🥝icon-color:var(--kiwi-color-icon-accent-strong)}@supports not selector(:has(+ *)){.🥝-text-box:where(:not(input,textarea):focus-within){outline:2px solid var(--kiwi-color-border-accent-base);outline-offset:1px;--🥝text-box-border-color:var(--kiwi-color-border-accent-strong);--🥝icon-color:var(--kiwi-color-icon-accent-strong)}}.🥝-text-box:where([disabled],:disabled,[aria-disabled=true],[data-kiwi-disabled=true],:has(:is(input,textarea):disabled)){--🌀text-box-state:var(--🌀text-box-state--disabled);box-shadow:none;color:var(--kiwi-color-text-neutral-disabled);--🥝text-box-cursor:not-allowed}}@layer base.🌀{.🥝-text-box{--🌀text-box-state:var(--🌀text-box-state--default);--🌀text-box-state--default:var(--🌀text-box-state, );--🌀text-box-state--hover:var(--🌀text-box-state, );--🌀text-box-state--disabled:var(--🌀text-box-state, )}}@layer base{.🥝-text-box-decoration{flex-shrink:0}}@layer base{.🥝-tooltip{background-color:var(--kiwi-color-bg-surface-emphasis);box-shadow:var(--kiwi-shadow-tooltip-base);color:var(--kiwi-color-text-neutral-emphasis);border:1px solid var(--kiwi-color-border-surface-primary);min-block-size:1rem;max-inline-size:12.25rem;font-size:var(--kiwi-font-size-12);letter-spacing:0;border-radius:.25rem;justify-content:center;gap:.25rem;padding-block:calc(.25rem - 1px);padding-inline:calc(.625rem - 1px);line-height:1.3333;display:flex}}@layer base{.🥝-tree{background-color:var(--kiwi-color-bg-surface-primary);align-content:start;display:grid;overflow:auto}}@layer base{.🥝-tree-item{min-inline-size:max-content;position:relative}}@layer states{.🥝-tree-item:focus-visible{isolation:isolate;outline:none}.🥝-tree-item:focus-visible:before{content:"";z-index:1;pointer-events:none;outline:2px solid var(--kiwi-color-border-accent-strong);outline-offset:-1px;position:absolute;inset:0}@media (any-hover:hover){.🥝-tree-item:where(:not(:hover,:focus-within)){--🥝tree-item-action-visibility:hidden}}}@layer base{.🥝-tree-item-node.🥝-list-item{isolation:isolate;padding-inline-start:calc(8px + 6px*(var(--🥝tree-item-level) - 1));padding-inline-end:0;position:relative}}@layer states{.🥝-tree-item-node.🥝-list-item:where([data-kiwi-selected=true]){--🌀list-item-state:var(--🌀list-item-state--active)}.🥝-tree-item-node.🥝-list-item:where([data-kiwi-expanded=false]){--🥝tree-chevron-rotate:-.25turn}.🥝-tree-item-node.🥝-list-item:where(:not([data-kiwi-expanded])){--🥝tree-item-expander-visibility:hidden}}@layer base{.🥝-tree-item-content.🥝-list-item-content{white-space:nowrap}}@layer base{.🥝-tree-item-actions{background-color:var(--kiwi-color-bg-surface-primary);visibility:var(--🥝tree-item-actions-visibility,var(--🥝tree-item-action-visibility));padding-inline-end:4px;display:inline-flex;position:sticky;inset-inline-end:0}.🥝-tree-item-actions:before{content:"";background-color:var(--🥝list-item-background-color);z-index:-1;position:absolute;inset:0}}@layer modifiers{.🥝-tree-item-actions:where(:has(.🥝-tree-item-action[data-kiwi-visible=true])){--🥝tree-item-actions-visibility:visible}@supports not selector(:has(+ *)){.🥝-tree-item-actions{--🥝tree-item-actions-visibility:visible}}}@layer base{.🥝-tree-item-action.🥝-icon-button{visibility:var(--🥝tree-item-action-visibility)}}@layer modifiers{.🥝-tree-item-action.🥝-icon-button:where([data-kiwi-visible=false]){--🥝tree-item-action-visibility:hidden}.🥝-tree-item-action.🥝-icon-button:where([data-kiwi-visible=true]){--🥝tree-item-action-visibility:visible}}@layer base{.🥝-tree-item-expander.🥝-icon-button{visibility:var(--🥝tree-item-expander-visibility);z-index:1}}@layer base{.🥝-tree-chevron{rotate:var(--🥝tree-chevron-rotate)}@media (prefers-reduced-motion:no-preference){.🥝-tree-chevron{transition:rotate .15s ease-in-out}}}@layer base{.🥝-field{--🥝field-description-column:label-start/label-end;grid-template-columns:[label-start]auto[label-end control-start]auto[control-end];justify-content:start;align-items:center;gap:.5rem;display:grid}.🥝-field:where([data-kiwi-control-type=checkable][data-kiwi-label-placement=after]){grid-template-columns:[control-start]auto[control-end label-start]auto[label-end]}.🥝-field:where([data-kiwi-control-type=textlike]){--🥝field-description-column:control-start/control-end;align-items:baseline}.🥝-field:where([data-kiwi-control-type=textlike]):where(:not([data-kiwi-layout=inline])){grid-template-columns:[label-start control-start]auto[label-end control-end]}.🥝-field :where(.🥝-description){grid-column:var(--🥝field-description-column)}}}`;
2
+ var styles_default = String.raw`@layer itwinui.components.base,itwinui.components.modifiers,itwinui.components.states;@layer itwinui.components{@layer base{.🥝-icon{width:var(--🥝icon-size,1rem);height:var(--🥝icon-size,1rem);color:var(--🥝icon-color);flex-shrink:0;transition:color .15s ease-out}}@layer modifiers{.🥝-icon:where([data-kiwi-size=regular]){--🥝icon-size:1rem}.🥝-icon:where([data-kiwi-size=large]){--🥝icon-size:1.5rem}}@layer base{.🥝-disclosure-arrow{rotate:var(--🥝disclosure-arrow-rotate);margin-inline-end:-8px}@media (prefers-reduced-motion:no-preference){.🥝-disclosure-arrow{transition:rotate .15s ease-in-out}}}@layer base{.🥝-anchor{cursor:pointer;font-size:var(--ids-font-size-12);text-underline-offset:.25ex;-webkit-text-decoration-color:inherit;text-decoration-color:inherit;color:var(--🥝anchor-color);border-radius:4px;font-weight:500;transition:color .15s ease-out,text-decoration-color .15s ease-out}.🥝-anchor:where(button){background:0 0;border:none}}@layer modifiers{.🥝-anchor:where([data-kiwi-tone=neutral]){--🥝anchor-color:var(--ids-color-text-neutral-primary)}.🥝-anchor:where([data-kiwi-tone=accent]){--🥝anchor-color:var(--ids-color-text-accent-strong)}.🥝-anchor:where([data-kiwi-tone=critical]){--🥝anchor-color:var(--ids-color-text-critical-base)}.🥝-anchor:where([data-kiwi-tone=critical]):focus-visible{outline-color:var(--🥝anchor-color)}}@layer states{@media (any-hover:hover){.🥝-anchor:where(:hover){text-decoration-color:#0000}}.🥝-anchor:where(:active){text-decoration-color:#0000}.🥝-anchor:where([disabled],:disabled,[aria-disabled=true]){--🥝anchor-color-text:var(--ids-color-text-neutral-disabled);cursor:not-allowed;text-decoration-color:#0000}}@layer base{.🥝-avatar{--🥝avatar-background-color:var(--ids-color-bg-mono-base);block-size:var(--🥝avatar-size);inline-size:var(--🥝avatar-size);background-color:var(--🥝avatar-background-color);color:var(--ids-color-text-neutral-emphasis);-webkit-user-select:none;user-select:none;border-radius:50%;place-items:center;display:inline-grid;position:relative;overflow:hidden}@media (forced-colors:active){.🥝-avatar{border:1px solid canvastext}}.🥝-avatar:after{content:"";border-radius:inherit;box-shadow:0px 0px 0px 1px var(--ids-color-border-glow-strong-default)inset;position:absolute;inset:0}.🥝-avatar>img{background-color:inherit;block-size:inherit;inline-size:inherit;object-fit:cover;object-position:center}}@layer modifiers{.🥝-avatar:where([data-kiwi-size=small]){--🥝avatar-size:1rem;--🥝avatar-font-size:var(--ids-font-size-8);--🥝icon-size:.75rem}.🥝-avatar:where([data-kiwi-size=medium]){--🥝avatar-size:1.5rem;--🥝avatar-font-size:var(--ids-font-size-10);--🥝icon-size:1rem}.🥝-avatar:where([data-kiwi-size=large]){--🥝avatar-size:2rem;--🥝avatar-font-size:var(--ids-font-size-12);--🥝icon-size:1rem}.🥝-avatar:where([data-kiwi-size=xlarge]){--🥝avatar-size:3rem;--🥝avatar-font-size:var(--ids-font-size-16);--🥝icon-size:1.5rem}}@layer base{.🥝-avatar-initials{font-size:var(--🥝avatar-font-size);text-align:center;text-transform:uppercase;font-weight:600}}@layer base{.🥝-badge{white-space:nowrap;border:1px solid var(--🥝badge-border-color);background-color:var(--🥝badge-background-color);color:var(--🥝badge-text-color);block-size:1.25rem;font-weight:500;font-size:var(--ids-font-size-12);letter-spacing:0;border-radius:9999px;flex-shrink:0;justify-content:center;align-items:center;padding-inline:8px;line-height:1.3333;display:inline-flex}}@layer modifiers{.🥝-badge:where([data-kiwi-variant=solid]){--🥝badge-text-color:var(--ids-color-text-neutral-emphasis)}.🥝-badge:where([data-kiwi-variant=solid]):where([data-kiwi-tone=neutral]){--🥝badge-background-color:var(--ids-color-bg-mono-base);--🥝badge-border-color:var(--ids-color-bg-mono-base)}.🥝-badge:where([data-kiwi-variant=solid]):where([data-kiwi-tone=info]){--🥝badge-background-color:var(--ids-color-bg-info-base);--🥝badge-border-color:var(--ids-color-bg-info-base)}.🥝-badge:where([data-kiwi-variant=solid]):where([data-kiwi-tone=positive]){--🥝badge-background-color:var(--ids-color-bg-positive-base);--🥝badge-border-color:var(--ids-color-bg-positive-base)}.🥝-badge:where([data-kiwi-variant=solid]):where([data-kiwi-tone=attention]){--🥝badge-background-color:var(--ids-color-bg-attention-base);--🥝badge-border-color:var(--ids-color-bg-attention-base)}.🥝-badge:where([data-kiwi-variant=solid]):where([data-kiwi-tone=critical]){--🥝badge-background-color:var(--ids-color-bg-critical-base);--🥝badge-border-color:var(--ids-color-bg-critical-base)}.🥝-badge:where([data-kiwi-variant=muted]):where([data-kiwi-tone=neutral]){--🥝badge-background-color:var(--ids-color-bg-mono-muted);--🥝badge-border-color:var(--ids-color-bg-mono-muted);--🥝badge-text-color:var(--ids-color-text-mono-faded)}.🥝-badge:where([data-kiwi-variant=muted]):where([data-kiwi-tone=info]){--🥝badge-background-color:var(--ids-color-bg-info-muted);--🥝badge-border-color:var(--ids-color-bg-info-muted);--🥝badge-text-color:var(--ids-color-text-info-faded)}.🥝-badge:where([data-kiwi-variant=muted]):where([data-kiwi-tone=positive]){--🥝badge-background-color:var(--ids-color-bg-positive-muted);--🥝badge-border-color:var(--ids-color-bg-positive-muted);--🥝badge-text-color:var(--ids-color-text-positive-faded)}.🥝-badge:where([data-kiwi-variant=muted]):where([data-kiwi-tone=attention]){--🥝badge-background-color:var(--ids-color-bg-attention-muted);--🥝badge-border-color:var(--ids-color-bg-attention-muted);--🥝badge-text-color:var(--ids-color-text-attention-faded)}.🥝-badge:where([data-kiwi-variant=muted]):where([data-kiwi-tone=critical]){--🥝badge-background-color:var(--ids-color-bg-critical-muted);--🥝badge-border-color:var(--ids-color-bg-critical-muted);--🥝badge-text-color:var(--ids-color-text-critical-faded)}.🥝-badge:where([data-kiwi-variant=outline]){--🥝badge-background-color:transparent}.🥝-badge:where([data-kiwi-variant=outline]):where([data-kiwi-tone=neutral]){--🥝badge-text-color:var(--ids-color-text-mono-base);--🥝badge-border-color:var(--ids-color-border-mono-base)}.🥝-badge:where([data-kiwi-variant=outline]):where([data-kiwi-tone=info]){--🥝badge-text-color:var(--ids-color-text-info-base);--🥝badge-border-color:var(--ids-color-border-info-base)}.🥝-badge:where([data-kiwi-variant=outline]):where([data-kiwi-tone=positive]){--🥝badge-text-color:var(--ids-color-text-positive-base);--🥝badge-border-color:var(--ids-color-border-positive-base)}.🥝-badge:where([data-kiwi-variant=outline]):where([data-kiwi-tone=attention]){--🥝badge-text-color:var(--ids-color-text-attention-base);--🥝badge-border-color:var(--ids-color-border-attention-base)}.🥝-badge:where([data-kiwi-variant=outline]):where([data-kiwi-tone=critical]){--🥝badge-text-color:var(--ids-color-text-critical-base);--🥝badge-border-color:var(--ids-color-border-critical-base)}}@layer base{.🥝-button{white-space:nowrap;-webkit-user-select:none;user-select:none;cursor:pointer;line-height:1.2;font-size:var(--ids-font-size-12);block-size:1.5rem;padding-inline:var(--🥝button-padding-inline,12px);background-color:var(--🥝button-background-color);color:var(--🥝button-color,var(--ids-color-text-neutral-primary));-webkit-tap-highlight-color:color-mix(in oklch,var(--🥝button-bg--solid-default)100.0%,var(--ids-color-glow-hue)var(--ids-color-bg-glow-base-pressed-\%));--🥝icon-color:var(--🌀button-state--default,var(--ids-color-icon-neutral-base))var(--🌀button-state--hover,var(--ids-color-icon-neutral-hover))var(--🌀button-state--pressed,var(--ids-color-icon-neutral-hover))var(--🌀button-state--active,var(--ids-color-icon-accent-strong))var(--🌀button-state--disabled,var(--ids-color-icon-neutral-disabled));border:none;border-radius:4px;flex-shrink:0;justify-content:center;align-items:center;gap:4px;font-weight:500;text-decoration:none;transition:background-color .15s ease-out;display:inline-flex}@media (forced-colors:active){.🥝-button{color:buttontext;--🥝icon-color:ButtonText;background-color:buttonface;border:1px solid buttonborder}}}@layer modifiers{.🥝-button:where([data-kiwi-variant=solid]){--🥝button-background-color:var(--🌀button-state--default,var(--🥝button-bg--solid-default))var(--🌀button-state--hover,color-mix(in oklch,var(--🥝button-bg--solid-default)100.0%,var(--ids-color-glow-hue)var(--ids-color-bg-glow-base-hover-\%)))var(--🌀button-state--pressed,color-mix(in oklch,var(--🥝button-bg--solid-default)100.0%,var(--ids-color-glow-hue)var(--ids-color-bg-glow-base-pressed-\%)))var(--🌀button-state--disabled,var(--ids-color-bg-glow-on-surface-disabled));box-shadow:var(--🌀button-state--default,var(--ids-shadow-button-base-inset),0px 0px 0px 1px var(--🥝button-border-color)inset,var(--ids-shadow-button-base-drop))var(--🌀button-state--hover,var(--ids-shadow-button-base-inset),0px 0px 0px 1px var(--🥝button-border-color)inset,var(--ids-shadow-button-base-drop))var(--🌀button-state--pressed,0px 0px 0px 1px var(--🥝button-border-color)inset)var(--🌀button-state--disabled,none)}.🥝-button:where([data-kiwi-variant=solid]):where([data-kiwi-tone=neutral]){--🥝button-bg--solid-default:var(--ids-color-bg-neutral-base);--🥝button-border-color:var(--🌀button-state--default,var(--ids-color-border-shadow-base))var(--🌀button-state--hover,color-mix(in oklch,var(--ids-color-border-shadow-base)100.0%,var(--ids-color-glow-hue)var(--ids-color-border-glow-base-hover-\%)))var(--🌀button-state--pressed,color-mix(in oklch,var(--ids-color-border-shadow-base)100.0%,var(--ids-color-glow-hue)var(--ids-color-border-glow-base-pressed-\%)))var(--🌀button-state--disabled,transparent)}.🥝-button:where([data-kiwi-variant=solid]):where([data-kiwi-tone=accent]){--🥝button-bg--solid-default:var(--ids-color-bg-accent-base);--🥝button-border-color:var(--🌀button-state--default,var(--ids-color-border-shadow-strong))var(--🌀button-state--hover,color-mix(in oklch,var(--ids-color-border-shadow-strong)100.0%,var(--ids-color-glow-hue)var(--ids-color-border-glow-strong-hover-\%)))var(--🌀button-state--pressed,color-mix(in oklch,var(--ids-color-border-shadow-strong)100.0%,var(--ids-color-glow-hue)var(--ids-color-border-glow-strong-pressed-\%)))var(--🌀button-state--disabled,transparent);--🥝button-color:var(--ids-color-text-neutral-emphasis);--🥝icon-color:var(--🌀button-state--default,var(--ids-color-icon-neutral-emphasis))var(--🌀button-state--hover,var(--ids-color-icon-strong-hover))var(--🌀button-state--pressed,var(--ids-color-icon-neutral-hover))var(--🌀button-state--disabled,var(--ids-color-icon-neutral-disabled))}@media (forced-colors:active){.🥝-button:where([data-kiwi-variant=solid]):where([data-kiwi-tone=accent]){--🥝icon-color:ButtonText}}.🥝-button:where([data-kiwi-variant=outline]){--🥝button-background-color:var(--🌀button-state--default,transparent)var(--🌀button-state--hover,color-mix(in oklch,transparent 100.0%,var(--ids-color-glow-hue)var(--ids-color-bg-glow-base-hover-\%)))var(--🌀button-state--pressed,color-mix(in oklch,transparent 100.0%,var(--ids-color-glow-hue)var(--ids-color-bg-glow-base-pressed-\%)))var(--🌀button-state--disabled,transparent);--🥝button-border-color:var(--🌀button-state--default,var(--ids-color-border-neutral-base))var(--🌀button-state--hover,color-mix(in oklch,var(--ids-color-border-neutral-base)100.0%,var(--ids-color-glow-hue)var(--ids-color-border-glow-base-hover-\%)))var(--🌀button-state--pressed,color-mix(in oklch,var(--ids-color-border-neutral-base)100.0%,var(--ids-color-glow-hue)var(--ids-color-border-glow-base-pressed-\%)))var(--🌀button-state--disabled,var(--ids-color-border-glow-on-surface-disabled));box-shadow:0px 0px 0px 1px var(--🥝button-border-color)inset}.🥝-button:where([data-kiwi-variant=ghost]){--🥝button-background-color:var(--🌀button-state--default,transparent)var(--🌀button-state--hover,color-mix(in oklch,transparent 100.0%,var(--ids-color-glow-hue)var(--ids-color-bg-glow-base-hover-\%)))var(--🌀button-state--pressed,color-mix(in oklch,transparent 100.0%,var(--ids-color-glow-hue)var(--ids-color-bg-glow-base-pressed-\%)))var(--🌀button-state--active,var(--ids-color-bg-glow-on-surface-accent-pressed))var(--🌀button-state--disabled,transparent)}}@layer states{@media (any-hover:hover){.🥝-button:where(:hover){--🌀button-state:var(--🌀button-state--hover)}}.🥝-button:where(:active){--🌀button-state:var(--🌀button-state--pressed)}.🥝-button:where([data-kiwi-variant=ghost][aria-pressed=true]){--🌀button-state:var(--🌀button-state--active)}@media (forced-colors:active){.🥝-button:where([data-kiwi-variant=ghost][aria-pressed=true]){color:selecteditemtext;--🥝icon-color:SelectedItemText;background-color:selecteditem}}.🥝-button:where([disabled],:disabled,[aria-disabled=true]){--🌀button-state:var(--🌀button-state--disabled);color:var(--ids-color-text-neutral-disabled);cursor:not-allowed}@media (forced-colors:active){.🥝-button:where([disabled],:disabled,[aria-disabled=true]){color:graytext;--🥝icon-color:GrayText;border-color:graytext}}}@layer base.🌀{.🥝-button{--🌀button-state:var(--🌀button-state--default);--🌀button-state--default:var(--🌀button-state, );--🌀button-state--hover:var(--🌀button-state, );--🌀button-state--pressed:var(--🌀button-state, );--🌀button-state--active:var(--🌀button-state, );--🌀button-state--disabled:var(--🌀button-state, )}}@layer base{.🥝-checkbox{--🥝checkbox-color-svg:var(--ids-color-icon-neutral-emphasis);--🥝checkbox-border-radius:4px;--🥝checkbox-unchecked-svg:url("data:image/svg+xml;utf8,<svg viewBox=\"0 0 16 16\"></svg>");--🥝checkbox-checkmark-svg:url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 16 16\"><path stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" d=\"M11.2 5.6 6.8 10l-2-2\"/></svg>");--🥝checkbox-indeterminate-svg:url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 16 16\"><path stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" d=\"M5 8h6.5\"/></svg>");appearance:none;cursor:pointer;background-color:var(--🌀checkbox-visual-state--default,var(--ids-color-bg-neutral-base))var(--🌀checkbox-visual-state--hover,color-mix(in oklch,var(--ids-color-bg-neutral-base)100.0%,var(--ids-color-glow-hue)var(--ids-color-bg-glow-base-hover-\%)))var(--🌀checkbox-visual-state--checked,var(--ids-color-bg-accent-base))var(--🌀checkbox-visual-state--checked-hover,color-mix(in oklch,var(--ids-color-bg-accent-base)100.0%,var(--ids-color-glow-hue)var(--ids-color-bg-glow-base-pressed-\%)))var(--🌀checkbox-visual-state--disabled,var(--ids-color-bg-glow-on-surface-disabled));border-radius:var(--🥝checkbox-border-radius);block-size:1rem;inline-size:1rem;color:var(--🌀checkbox-aria-state--unchecked,transparent)var(--🌀checkbox-aria-state--checked,var(--🥝checkbox-color-svg))var(--🌀checkbox-aria-state--indeterminate,var(--🥝checkbox-color-svg));box-shadow:var(--ids-shadow-button-base-inset),0px 0px 0px 1px var(--🥝checkbox-border-color)inset,var(--ids-shadow-button-base-drop);--🥝checkbox-border-color:var(--🌀checkbox-visual-state--default,var(--ids-color-border-shadow-base))var(--🌀checkbox-visual-state--hover,color-mix(in oklch,var(--ids-color-border-shadow-base)100.0%,var(--ids-color-glow-hue)var(--ids-color-border-glow-base-hover-\%)))var(--🌀checkbox-visual-state--checked,var(--ids-color-border-shadow-strong))var(--🌀checkbox-visual-state--checked-hover,color-mix(in oklch,var(--ids-color-border-shadow-strong)100.0%,var(--ids-color-glow-hue)var(--ids-color-border-glow-base-pressed-\%)))var(--🌀checkbox-visual-state--disabled,transparent);--🥝checkbox-mask-image:var(--🌀checkbox-aria-state--unchecked,var(--🥝checkbox-unchecked-svg))var(--🌀checkbox-aria-state--checked,var(--🥝checkbox-checkmark-svg))var(--🌀checkbox-aria-state--indeterminate,var(--🥝checkbox-indeterminate-svg));transition:background-color .15s ease-out,border-color .15s ease-out,box-shadow .15s ease-out,--🥝checkbox-border-color .15s ease-out;position:relative}.🥝-checkbox:before,.🥝-checkbox:after{content:"";position:absolute;inset:0}.🥝-checkbox:before{inset:calc(.5rem - 12px)}.🥝-checkbox:after{-webkit-mask-image:var(--🥝checkbox-mask-image,initial);mask-image:var(--🥝checkbox-mask-image,initial);background-color:currentColor;-webkit-mask-position:50%;mask-position:50%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}@media (forced-colors:active){.🥝-checkbox:after{background-color:canvastext}}}@layer states{@media (forced-colors:active){.🥝-checkbox{border:1px solid canvastext}}@media (any-hover:hover){.🥝-checkbox:where(:hover){--🌀checkbox-visual-state:var(--🌀checkbox-visual-state--hover)}}.🥝-checkbox:where(:checked,[aria-checked=true]){--🌀checkbox-visual-state:var(--🌀checkbox-visual-state--checked);--🌀checkbox-aria-state:var(--🌀checkbox-aria-state--checked)}@media (any-hover:hover){.🥝-checkbox:where(:checked,[aria-checked=true]):where(:hover){--🌀checkbox-visual-state:var(--🌀checkbox-visual-state--checked-hover)}}.🥝-checkbox:where(:indeterminate,[aria-checked=mixed]){--🌀checkbox-visual-state:var(--🌀checkbox-visual-state--checked);--🌀checkbox-aria-state:var(--🌀checkbox-aria-state--indeterminate)}.🥝-checkbox:where([disabled],:disabled,[aria-disabled=true]){--🌀checkbox-visual-state:var(--🌀checkbox-visual-state--disabled);--🥝checkbox-color-svg:var(--ids-color-icon-neutral-disabled);cursor:not-allowed;box-shadow:none}@media (forced-colors:active){.🥝-checkbox:where([disabled],:disabled,[aria-disabled=true]){border-color:graytext}.🥝-checkbox:where([disabled],:disabled,[aria-disabled=true]):after{background-color:graytext}}}@layer base.🌀{.🥝-checkbox{--🌀checkbox-visual-state:var(--🌀checkbox-visual-state--default);--🌀checkbox-visual-state--default:var(--🌀checkbox-visual-state, );--🌀checkbox-visual-state--hover:var(--🌀checkbox-visual-state, );--🌀checkbox-visual-state--checked:var(--🌀checkbox-visual-state, );--🌀checkbox-visual-state--checked-hover:var(--🌀checkbox-visual-state, );--🌀checkbox-visual-state--disabled:var(--🌀checkbox-visual-state, );--🌀checkbox-aria-state:var(--🌀checkbox-aria-state--unchecked);--🌀checkbox-aria-state--unchecked:var(--🌀checkbox-aria-state, );--🌀checkbox-aria-state--checked:var(--🌀checkbox-aria-state, );--🌀checkbox-aria-state--indeterminate:var(--🌀checkbox-aria-state, )}}@layer base{.🥝-chip{isolation:isolate;--🥝chip-padding-inline:.5rem;padding-inline:var(--🥝chip-padding-inline);border:none;border-radius:9999px;align-items:center;min-block-size:1.5rem;display:inline-flex;position:relative}}.🥝-chip:before{z-index:-1;content:"";border-radius:inherit;border:1px solid var(--ids-color-border-neutral-base);pointer-events:none;position:absolute;inset:0}@layer modifiers{.🥝-chip:where([data-kiwi-variant=solid]){background-color:var(--ids-color-bg-neutral-base)}.🥝-chip:where([data-kiwi-variant=outline]){background-color:var(--ids-color-bg-page-base)}}@layer base{.🥝-chip-dismiss-button.🥝-icon-button{border-radius:inherit;margin-inline-end:calc(-1*var(--🥝chip-padding-inline));position:relative}}@layer modifiers{.🥝-description.🥝-text:where([data-kiwi-tone=neutral]){color:var(--ids-color-text-neutral-tertiary)}.🥝-description.🥝-text:where([data-kiwi-tone=critical]){color:var(--ids-color-text-critical-base)}}.🥝-divider{background-color:var(--ids-color-border-neutral-muted);flex:none;align-self:stretch}@media (forced-colors:active){.🥝-divider{background-color:canvastext}}.🥝-divider:is(hr){border:none;margin:0}.🥝-divider:not([aria-orientation=vertical],[data-kiwi-orientation=vertical]){block-size:1px}.🥝-divider:is([aria-orientation=vertical],[data-kiwi-orientation=vertical]){min-block-size:100%;inline-size:1px}@layer base{.🥝-dropdown-menu{background-color:var(--ids-color-bg-elevation-level-1);min-inline-size:min(95vi,164px);box-shadow:var(--ids-shadow-surface-xl);border-radius:8px;flex-direction:column;padding:.5rem;display:flex}}@layer states{.🥝-dropdown-menu-button:where([aria-expanded=true]){--🥝disclosure-arrow-rotate:.5turn}}@layer base{.🥝-dropdown-menu-item.🥝-list-item{border-radius:4px}}@layer states{.🥝-dropdown-menu-item.🥝-list-item:where([role=menuitemcheckbox]:not([aria-checked=true])){--🥝dropdown-menu-checkmark-visibility:hidden}}@layer base{.🥝-dropdown-menu-checkmark{visibility:var(--🥝dropdown-menu-checkmark-visibility)}}@layer base{.🥝-dropdown-menu-item-shortcuts{margin-inline-start:.5rem}}@layer base{.🥝-icon-button.🥝-button{aspect-ratio:1;--🥝button-padding-inline:4px}}@layer base{.🥝-kbd{color:var(--ids-color-text-neutral-secondary);min-block-size:16px;font-family:inherit;font-weight:500;font-size:var(--ids-font-size-12);letter-spacing:0;flex-shrink:0;justify-content:center;align-items:center;line-height:1.3333;display:inline-flex}}@layer modifiers{.🥝-kbd:where([data-kiwi-variant=solid],[data-kiwi-variant=muted]){background-color:var(--ids-color-bg-neutral-base);border-radius:4px;padding-inline:4px}.🥝-kbd:where([data-kiwi-variant=solid]){box-shadow:var(--ids-shadow-button-base-inset),0px 0px 0px 1px var(--ids-color-border-shadow-base)inset,var(--ids-shadow-button-base-drop)}.🥝-kbd:where([data-kiwi-variant=ghost]){color:var(--ids-color-text-neutral-tertiary)}}@layer base{.🥝-label{color:var(--ids-color-text-neutral-secondary);cursor:default;font-size:var(--ids-font-size-12)}.🥝-label:is(label){cursor:pointer}}@layer states{.🥝-label:has(+:where(:disabled,[disabled],[aria-disabled=true])){color:var(--ids-color-text-neutral-disabled)}.🥝-label:has(+:where(:disabled,[disabled],[aria-disabled=true])):is(label){cursor:not-allowed}}.🥝-radio.🥝-checkbox{--🥝checkbox-border-radius:9999px;--🥝checkbox-checkmark-svg:url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 16 16\" ><circle cx=\"8\" cy=\"8\" r=\"4\" /></svg>");--🥝checkbox-indeterminate-svg:var(--🥝checkbox-unchecked-svg)}@layer states{.🥝-radio.🥝-checkbox:where(:indeterminate){--🌀checkbox-visual-state:var(--🌀checkbox-visual-state--default)}}@layer base{.🥝-list-item{cursor:pointer;line-height:1.2;font-size:var(--ids-font-size-12);background-color:var(--🥝list-item-background-color);--🥝list-item-background-color:var(--🌀list-item-state--default,transparent)var(--🌀list-item-state--hover,var(--ids-color-bg-glow-on-surface-neutral-hover))var(--🌀list-item-state--pressed,var(--ids-color-bg-glow-on-surface-neutral-pressed))var(--🌀list-item-state--active,var(--ids-color-bg-glow-on-surface-accent-pressed))var(--🌀list-item-state--active-hover,var(--ids-color-bg-glow-on-surface-accent-pressed))var(--🌀list-item-state--disabled,transparent);min-block-size:1.75rem;color:var(--🌀list-item-state--default,var(--ids-color-text-neutral-primary))var(--🌀list-item-state--hover,var(--ids-color-text-neutral-primary))var(--🌀list-item-state--pressed,var(--ids-color-text-neutral-primary))var(--🌀list-item-state--active,var(--ids-color-text-accent-strong))var(--🌀list-item-state--active-hover,var(--ids-color-text-accent-strong))var(--🌀list-item-state--disabled,var(--ids-color-text-neutral-disabled));--🥝icon-color:var(--🌀list-item-state--default,var(--ids-color-icon-neutral-base))var(--🌀list-item-state--hover,var(--ids-color-icon-neutral-hover))var(--🌀list-item-state--pressed,var(--ids-color-icon-neutral-hover))var(--🌀list-item-state--active,var(--ids-color-icon-accent-strong))var(--🌀list-item-state--active-hover,var(--ids-color-icon-accent-strong))var(--🌀list-item-state--disabled,var(--ids-color-icon-neutral-disabled));grid-template-rows:[block-start]auto min-content[block-end];grid-template-columns:[decoration-before-start]auto[decoration-before-end content-start]minmax(0,1fr)[content-end decoration-after-start]auto[decoration-after-end];align-items:center;padding-inline:.5rem;display:grid}}@layer states{@media (any-hover:hover){.🥝-list-item:where(:hover){--🌀list-item-state:var(--🌀list-item-state--hover)}}.🥝-list-item:where(:active){--🌀list-item-state:var(--🌀list-item-state--pressed)}.🥝-list-item:where([disabled],:disabled,[aria-disabled=true]){--🌀list-item-state:var(--🌀list-item-state--disabled);cursor:not-allowed}}@layer base.🌀{.🥝-list-item{--🌀list-item-state:var(--🌀list-item-state--default);--🌀list-item-state--default:var(--🌀list-item-state, );--🌀list-item-state--hover:var(--🌀list-item-state, );--🌀list-item-state--pressed:var(--🌀list-item-state, );--🌀list-item-state--active:var(--🌀list-item-state, );--🌀list-item-state--active-hover:var(--🌀list-item-state, );--🌀list-item-state--disabled:var(--🌀list-item-state, )}}@layer base{.🥝-list-item-content{grid-column:content}}@layer base{.🥝-list-item-decoration{grid-column:decoration-before;align-items:center;margin-inline-end:.25rem;display:flex}:where(.🥝-list-item-content)~.🥝-list-item-decoration{grid-column:decoration-after;margin-inline:.25rem 0}}@layer base{.🥝-spinner{color:var(--🥝spinner-color);block-size:var(--🥝spinner-size);inline-size:var(--🥝spinner-size);display:inline-block}}@layer modifiers{.🥝-spinner:where([data-kiwi-tone=neutral]){--🥝spinner-color:var(--ids-color-icon-neutral-base)}.🥝-spinner:where([data-kiwi-tone=accent]){--🥝spinner-color:var(--ids-color-icon-accent-strong)}.🥝-spinner:where([data-kiwi-size=small]){--🥝spinner-size:1rem}.🥝-spinner:where([data-kiwi-size=medium]){--🥝spinner-size:1.5rem}.🥝-spinner:where([data-kiwi-size=large]){--🥝spinner-size:2rem}.🥝-spinner:where([data-kiwi-size=xlarge]){--🥝spinner-size:3rem}}@layer base{.🥝-spinner-svg{block-size:inherit;inline-size:inherit;fill:none;animation:1s linear infinite both --🥝spinner-spin}@media (prefers-reduced-motion){.🥝-spinner-svg{animation-duration:4s;animation-timing-function:steps(4,end)}}}@keyframes --🥝spinner-spin{to{rotate:360deg}}@layer base{.🥝-select-root:where(:has(select.🥝-select),[data-kiwi-has-select=true]){--🥝button-padding-inline:8px calc(4px + 16px + 4px);align-items:center;display:inline-grid}.🥝-select-root:where(:has(select.🥝-select),[data-kiwi-has-select=true])>*{grid-area:1/1/-1/-1}}@layer base{.🥝-select.🥝-button:where(select:not([multiple])){appearance:none}}@layer base{.🥝-select-arrow.🥝-disclosure-arrow{pointer-events:none;--🥝icon-color:var(--🌀select-arrow-state--default,var(--ids-color-icon-neutral-base))var(--🌀select-arrow-state--hover,var(--ids-color-icon-neutral-hover))var(--🌀select-arrow-state--disabled,var(--ids-color-icon-neutral-disabled));justify-self:end;margin-inline-end:4px}}@layer states{@media (any-hover:hover){:where(.🥝-select:hover)+.🥝-select-arrow.🥝-disclosure-arrow{--🌀select-arrow-state:var(--🌀select-arrow-state--hover)}}:where(.🥝-select:disabled)+.🥝-select-arrow.🥝-disclosure-arrow{--🌀select-arrow-state:var(--🌀select-arrow-state--disabled)}}@layer base.🌀{.🥝-select-arrow.🥝-disclosure-arrow{--🌀select-arrow-state:var(--🌀select-arrow-state--default);--🌀select-arrow-state--default:var(--🌀select-arrow-state, );--🌀select-arrow-state--hover:var(--🌀select-arrow-state, );--🌀select-arrow-state--disabled:var(--🌀select-arrow-state, )}}@layer base{.🥝-switch{appearance:none;cursor:pointer;background-color:var(--🌀switch-state--default,var(--ids-color-bg-page-base))var(--🌀switch-state--hover,color-mix(in oklch,var(--ids-color-bg-page-base)100.0%,var(--ids-color-glow-hue)var(--ids-color-bg-glow-base-hover-\%)))var(--🌀switch-state--pressed,color-mix(in oklch,var(--ids-color-bg-page-base)100.0%,var(--ids-color-glow-hue)var(--ids-color-bg-glow-base-hover-\%)))var(--🌀switch-state--checked,var(--ids-color-bg-accent-base))var(--🌀switch-state--checked-hover,color-mix(in oklch,var(--ids-color-bg-accent-base)100.0%,var(--ids-color-glow-hue)var(--ids-color-bg-glow-strong-hover-\%)))var(--🌀switch-state--disabled,var(--ids-color-bg-page-base));border:1px solid #0000;border-color:var(--🌀switch-state--default,var(--ids-color-border-neutral-base))var(--🌀switch-state--hover,color-mix(in oklch,var(--ids-color-border-neutral-base)100.0%,var(--ids-color-glow-hue)var(--ids-color-border-glow-base-hover-\%)))var(--🌀switch-state--pressed,color-mix(in oklch,var(--ids-color-border-neutral-base)100.0%,var(--ids-color-glow-hue)var(--ids-color-border-glow-base-pressed-\%)))var(--🌀switch-state--checked,color-mix(in oklch,var(--ids-color-bg-accent-base)100.0%,var(--ids-color-glow-hue)var(--ids-color-border-glow-strong-hover-\%)))var(--🌀switch-state--checked-hover,color-mix(in oklch,var(--ids-color-bg-accent-base)100.0%,var(--ids-color-glow-hue)var(--ids-color-border-glow-strong-hover-\%)))var(--🌀switch-state--disabled,var(--ids-color-border-glow-on-surface-disabled));border-radius:9999px;align-items:center;inline-size:2rem;transition:background-color .15s ease-out,border-color .15s ease-out;display:inline-grid;position:relative}.🥝-switch:before,.🥝-switch:after{content:"";grid-area:1/1/-1/-1;display:block}.🥝-switch:before{block-size:24px;inline-size:2rem;margin:-1px;position:absolute}.🥝-switch:after{aspect-ratio:var(--🥝switch-thumb-aspect-ratio);background-color:var(--🥝switch-thumb-color);block-size:1rem;box-shadow:var(--ids-shadow-button-base-inset),0px 0px 0px 1px var(--ids-color-border-shadow-base)inset,var(--ids-shadow-button-base-drop);justify-self:var(--🥝switch-thumb-placement);border-radius:9999px;margin:calc(.125rem - 1px)}@media (prefers-reduced-motion:no-preference){.🥝-switch:after{will-change:aspect-ratio;transition:aspect-ratio .15s ease-out}}@media (forced-colors:active){.🥝-switch:after{background-color:canvastext}}}@layer states{.🥝-switch{--🥝switch-thumb-color:var(--ids-color-bg-neutral-inverse);--🥝switch-thumb-placement:start;--🥝switch-thumb-aspect-ratio:1/1}@media (any-hover:hover){.🥝-switch:where(:hover){--🌀switch-state:var(--🌀switch-state--hover)}}.🥝-switch:where(:checked,[aria-checked=true]){--🌀switch-state:var(--🌀switch-state--checked);--🥝switch-thumb-placement:end}@media (any-hover:hover){.🥝-switch:where(:checked,[aria-checked=true]):where(:hover){--🌀switch-state:var(--🌀switch-state--checked-hover)}}.🥝-switch:where(:active){--🌀switch-state:var(--🌀switch-state--pressed);--🥝switch-thumb-aspect-ratio:1.75}.🥝-switch:where([disabled],:disabled,[aria-disabled=true]){--🌀switch-state:var(--🌀switch-state--disabled);--🥝switch-thumb-color:var(--ids-color-icon-neutral-disabled);cursor:not-allowed}.🥝-switch:where([disabled],:disabled,[aria-disabled=true]):after{box-shadow:none}}@layer base.🌀{.🥝-switch{--🌀switch-state:var(--🌀switch-state--default);--🌀switch-state--default:var(--🌀switch-state, );--🌀switch-state--hover:var(--🌀switch-state, );--🌀switch-state--pressed:var(--🌀switch-state, );--🌀switch-state--checked:var(--🌀switch-state, );--🌀switch-state--checked-hover:var(--🌀switch-state, );--🌀switch-state--disabled:var(--🌀switch-state, )}}@layer base{.🥝-table{flex-direction:column;display:flex}}@layer base{.🥝-table-header{color:var(--ids-color-text-neutral-secondary)}}@layer base{.🥝-table-body{flex-direction:column;display:flex}}@layer base{.🥝-table-row{border-block-end:1px solid var(--ids-color-border-neutral-muted);display:flex}}@layer base{:is(.🥝-table-caption,.🥝-table-cell){word-break:break-word;-webkit-hyphens:auto;hyphens:auto;align-items:center;column-gap:.5rem;min-block-size:3rem;padding:.5rem;display:flex}}@layer base{.🥝-table-cell{background-color:var(--🌀table-cell-state--default,var(--ids-color-bg-page-base))var(--🌀table-cell-state--hover,color-mix(in oklch,var(--ids-color-bg-page-base)100.0%,var(--ids-color-glow-hue)var(--ids-color-bg-glow-base-hover-\%)));flex-grow:1;flex-basis:4rem;min-inline-size:4rem}}@layer states{@media (any-hover:hover){.🥝-table-cell:where(:hover){--🌀table-cell-state:var(--🌀table-cell-state--hover)}:where(.🥝-table-row:hover) .🥝-table-cell:where(:not([role=columnheader])){--🌀table-cell-state:var(--🌀table-cell-state--hover)}}}@layer base.🌀{.🥝-table-cell{--🌀table-cell-state:var(--🌀table-cell-state--default);--🌀table-cell-state--default:var(--🌀table-cell-state, );--🌀table-cell-state--hover:var(--🌀table-cell-state, )}}@layer base{.🥝-tab-list{--🥝tab-active-stripe-gap:6px;gap:8px;display:flex}}@layer modifiers{.🥝-tab-list[aria-orientation=horizontal]{padding-block-end:var(--🥝tab-active-stripe-gap)}}@layer base{.🥝-tab{font-size:var(--ids-font-size-12);color:var(--🥝tab-color);background-color:var(--🥝tab-bg);-webkit-user-select:none;user-select:none;white-space:nowrap;cursor:pointer;border:none;border-radius:4px;block-size:1.25rem;padding-inline:4px;transition:background-color .15s ease-out,color .15s ease-out;position:relative}@media (forced-colors:active){.🥝-tab{color:buttontext}}.🥝-tab:before{content:"";inset-inline:0;inset-block:0 calc(var(--🥝tab-active-stripe-gap)*-1);position:absolute}}@layer modifiers{:where(.🥝-tab-list[data-kiwi-tone=neutral]) .🥝-tab{--🥝tab-active-stripe-color:var(--ids-color-border-neutral-inverse);--🥝tab-bg:var(--🌀tab-state--default,transparent)var(--🌀tab-state--hover,var(--ids-color-bg-glow-on-surface-neutral-hover))var(--🌀tab-state--selected,transparent)var(--🌀tab-state--disabled,transparent);--🥝tab-color:var(--🌀tab-state--default,var(--ids-color-text-neutral-tertiary))var(--🌀tab-state--hover,var(--ids-color-text-neutral-primary))var(--🌀tab-state--selected,var(--ids-color-text-neutral-primary))var(--🌀tab-state--disabled,var(--ids-color-text-neutral-disabled));-webkit-tap-highlight-color:var(--ids-color-bg-glow-on-surface-neutral-hover)}:where(.🥝-tab-list[data-kiwi-tone=accent]) .🥝-tab{--🥝tab-active-stripe-color:var(--ids-color-border-accent-strong);--🥝tab-bg:var(--🌀tab-state--default,transparent)var(--🌀tab-state--hover,var(--ids-color-bg-glow-on-surface-accent-hover))var(--🌀tab-state--selected,transparent)var(--🌀tab-state--disabled,transparent);--🥝tab-color:var(--🌀tab-state--default,var(--ids-color-text-neutral-tertiary))var(--🌀tab-state--hover,var(--ids-color-text-accent-strong))var(--🌀tab-state--selected,var(--ids-color-text-accent-strong))var(--🌀tab-state--disabled,var(--ids-color-text-neutral-disabled));-webkit-tap-highlight-color:var(--ids-color-bg-glow-on-surface-accent-hover)}}@layer states{.🥝-tab:where([aria-selected=true]){--🌀tab-state:var(--🌀tab-state--selected)}.🥝-tab:where([aria-selected=true]):after{content:"";background-color:var(--🥝tab-active-stripe-color);block-size:2px;inset-inline:4px;inset-block:auto calc(var(--🥝tab-active-stripe-gap)*-1);position:absolute}@media (prefers-reduced-motion:no-preference){.🥝-tab:where([aria-selected=true]):after{view-transition-name:var(--🥝tab-active-stripe-view-transition-name)}}@media (forced-colors:active){.🥝-tab:where([aria-selected=true]):after{background-color:selecteditem}}@media (any-hover:hover){.🥝-tab:where(:hover){--🌀tab-state:var(--🌀tab-state--hover)}}.🥝-tab:where([disabled],:disabled,[aria-disabled=true]){--🌀tab-state:var(--🌀tab-state--disabled);--🥝tab-active-stripe-color:var(--ids-color-border-neutral-disabled);cursor:not-allowed}@media (forced-colors:active){.🥝-tab:where([disabled],:disabled,[aria-disabled=true]){color:graytext}.🥝-tab:where([disabled],:disabled,[aria-disabled=true]):after{background-color:graytext}}}@layer base.🌀{.🥝-tab{--🌀tab-state:var(--🌀tab-state--default);--🌀tab-state--default:var(--🌀tab-state, );--🌀tab-state--hover:var(--🌀tab-state, );--🌀tab-state--selected:var(--🌀tab-state, );--🌀tab-state--disabled:var(--🌀tab-state, )}}@layer base{.🥝-tab-panel{outline-offset:-2px}.🥝-tab-panel:not([data-open]){display:none!important}}@layer modifiers{.🥝-text:where([data-kiwi-text-variant=display-lg]){font-size:var(--ids-font-size-48);letter-spacing:0;line-height:1.1667}.🥝-text:where([data-kiwi-text-variant=display-md]){font-size:var(--ids-font-size-40);letter-spacing:0;line-height:1.2}.🥝-text:where([data-kiwi-text-variant=display-sm]){font-size:var(--ids-font-size-32);letter-spacing:0;line-height:1.25}.🥝-text:where([data-kiwi-text-variant=headline-lg]){font-size:var(--ids-font-size-28);letter-spacing:0;line-height:1.2857}.🥝-text:where([data-kiwi-text-variant=headline-md]){font-size:var(--ids-font-size-24);letter-spacing:0;line-height:1.3333}.🥝-text:where([data-kiwi-text-variant=headline-sm]){font-size:var(--ids-font-size-20);letter-spacing:0;line-height:1.4}.🥝-text:where([data-kiwi-text-variant=body-lg]){font-size:var(--ids-font-size-16);letter-spacing:0;line-height:1.5}.🥝-text:where([data-kiwi-text-variant=body-md]){font-size:var(--ids-font-size-14);letter-spacing:0;line-height:1.4286}.🥝-text:where([data-kiwi-text-variant=body-sm]){font-size:var(--ids-font-size-12);letter-spacing:0;line-height:1.3333}.🥝-text:where([data-kiwi-text-variant=caption-lg]){font-size:var(--ids-font-size-11);letter-spacing:0;line-height:1.4545}.🥝-text:where([data-kiwi-text-variant=caption-md]){font-size:var(--ids-font-size-10);letter-spacing:0;line-height:1.2}.🥝-text:where([data-kiwi-text-variant=caption-sm]){font-size:var(--ids-font-size-8);letter-spacing:0;line-height:1.5}.🥝-text:where([data-kiwi-text-variant=mono-sm]){font-family:var(--ids-font-family-mono);font-size:var(--ids-font-size-12);letter-spacing:0;line-height:1.3333}}@layer base{.🥝-text-box{cursor:var(--🥝text-box-cursor);font-size:var(--ids-font-size-12);background-color:var(--🥝text-box-background-color);min-block-size:1.5rem;min-inline-size:0;box-shadow:var(--ids-shadow-input-base);color:var(--ids-color-text-neutral-primary);--🥝text-box-cursor:text;--🥝text-box-background-color:var(--🌀text-box-state--default,var(--ids-color-bg-page-base))var(--🌀text-box-state--hover,color-mix(in oklch,var(--ids-color-bg-page-base)100.0%,var(--ids-color-glow-hue)var(--ids-color-bg-glow-base-hover-\%)))var(--🌀text-box-state--disabled,var(--ids-color-bg-elevation-control));--🥝text-box-border-color:var(--🌀text-box-state--default,var(--ids-color-border-neutral-base))var(--🌀text-box-state--hover,color-mix(in oklch,var(--ids-color-border-neutral-base)100.0%,var(--ids-color-glow-hue)var(--ids-color-border-glow-base-hover-\%)))var(--🌀text-box-state--disabled,var(--ids-color-border-glow-on-surface-disabled));border-radius:4px;padding-inline:8px;transition:background-color .15s ease-out,border-color .15s ease-out}.🥝-text-box:where(:not(input,textarea)){align-items:center;gap:4px;display:inline-flex;position:relative}.🥝-text-box:where(:not(input,textarea)):before{content:"";border-radius:inherit;pointer-events:none;border:1px solid var(--🥝text-box-border-color);transition:border-color .15s ease-out;position:absolute;inset:0}.🥝-text-box:where(input,textarea),.🥝-text-box :where(input,textarea){appearance:none;border:1px solid var(--🥝text-box-border-color);min-inline-size:0;cursor:var(--🥝text-box-cursor);padding-block:max(0px,.75rem - 1px - .5lh);line-height:1.3}:is(.🥝-text-box:where(input,textarea),.🥝-text-box :where(input,textarea))::placeholder{color:var(--ids-color-text-neutral-secondary);opacity:1;-webkit-user-select:none;user-select:none}.🥝-text-box:where(textarea),.🥝-text-box :where(textarea){resize:vertical;resize:block}.🥝-text-box :where(input,textarea){background-color:var(--🥝text-box-background-color);outline:unset;border:none;flex:999;align-self:stretch;transition:background-color .15s ease-out}}@layer states{@media (any-hover:hover){.🥝-text-box:where(:hover){--🌀text-box-state:var(--🌀text-box-state--hover)}}.🥝-text-box:where(:has(:is(input,textarea):focus-visible),:is(input,textarea):focus-visible){outline:2px solid var(--ids-color-border-accent-base);outline-offset:1px;--🥝text-box-border-color:var(--ids-color-border-accent-strong);--🥝icon-color:var(--ids-color-icon-accent-strong)}@supports not selector(:has(+ *)){.🥝-text-box:where(:not(input,textarea):focus-within){outline:2px solid var(--ids-color-border-accent-base);outline-offset:1px;--🥝text-box-border-color:var(--ids-color-border-accent-strong);--🥝icon-color:var(--ids-color-icon-accent-strong)}}.🥝-text-box:where([disabled],:disabled,[aria-disabled=true],[data-kiwi-disabled=true],:has(:is(input,textarea):disabled)){--🌀text-box-state:var(--🌀text-box-state--disabled);box-shadow:none;color:var(--ids-color-text-neutral-disabled);--🥝text-box-cursor:not-allowed}}@layer base.🌀{.🥝-text-box{--🌀text-box-state:var(--🌀text-box-state--default);--🌀text-box-state--default:var(--🌀text-box-state, );--🌀text-box-state--hover:var(--🌀text-box-state, );--🌀text-box-state--disabled:var(--🌀text-box-state, )}}@layer base{.🥝-text-box-decoration{flex-shrink:0}}@layer base{.🥝-tooltip{background-color:var(--ids-color-bg-elevation-emphasis);box-shadow:var(--ids-shadow-tooltip-base);color:var(--ids-color-text-neutral-emphasis);border:1px solid var(--ids-color-border-elevation-base);min-block-size:1rem;max-inline-size:12.25rem;font-size:var(--ids-font-size-12);letter-spacing:0;border-radius:.25rem;justify-content:center;gap:.25rem;padding-block:calc(.25rem - 1px);padding-inline:calc(.625rem - 1px);line-height:1.3333;display:flex}}@layer base{.🥝-tree{background-color:var(--ids-color-bg-page-base);align-content:start;display:grid;overflow:auto}}@layer base{.🥝-tree-item{min-inline-size:max-content;position:relative}}@layer states{.🥝-tree-item:focus-visible{isolation:isolate;outline:none}.🥝-tree-item:focus-visible:before{content:"";z-index:1;pointer-events:none;outline:2px solid var(--ids-color-border-accent-strong);outline-offset:-1px;position:absolute;inset:0}@media (any-hover:hover){.🥝-tree-item:where(:not(:hover,:focus-within)){--🥝tree-item-action-visibility:hidden}}}@layer base{.🥝-tree-item-node.🥝-list-item{isolation:isolate;padding-inline-start:calc(8px + 6px*(var(--🥝tree-item-level) - 1));padding-inline-end:0;position:relative}}@layer states{.🥝-tree-item-node.🥝-list-item:where([data-kiwi-selected=true]){--🌀list-item-state:var(--🌀list-item-state--active)}.🥝-tree-item-node.🥝-list-item:where([data-kiwi-expanded=false]){--🥝tree-chevron-rotate:-.25turn}.🥝-tree-item-node.🥝-list-item:where(:not([data-kiwi-expanded])){--🥝tree-item-expander-visibility:hidden}}@layer base{.🥝-tree-item-content.🥝-list-item-content{white-space:nowrap}}@layer base{.🥝-tree-item-actions.🥝-list-item-decoration{background-color:var(--ids-color-bg-page-base);visibility:var(--🥝tree-item-actions-visibility,var(--🥝tree-item-action-visibility));grid-row:block;align-self:stretch;padding-inline-end:4px;display:inline-flex;position:sticky;inset-inline-end:0}.🥝-tree-item-actions.🥝-list-item-decoration:before{content:"";background-color:var(--🥝list-item-background-color);z-index:-1;position:absolute;inset:0}}@layer modifiers{.🥝-tree-item-actions.🥝-list-item-decoration:where(:has(.🥝-tree-item-action[data-kiwi-visible=true])){--🥝tree-item-actions-visibility:visible}@supports not selector(:has(+ *)){.🥝-tree-item-actions.🥝-list-item-decoration{--🥝tree-item-actions-visibility:visible}}}@layer base{.🥝-tree-item-action.🥝-icon-button{visibility:var(--🥝tree-item-action-visibility)}}@layer modifiers{.🥝-tree-item-action.🥝-icon-button:where([data-kiwi-visible=false]){--🥝tree-item-action-visibility:hidden}.🥝-tree-item-action.🥝-icon-button:where([data-kiwi-visible=true]){--🥝tree-item-action-visibility:visible}}@layer base{.🥝-tree-item-expander.🥝-icon-button{visibility:var(--🥝tree-item-expander-visibility);z-index:1}}@layer base{.🥝-tree-chevron{rotate:var(--🥝tree-chevron-rotate)}@media (prefers-reduced-motion:no-preference){.🥝-tree-chevron{transition:rotate .15s ease-in-out}}}@layer base{.🥝-field{--🥝field-description-column:label-start/label-end;grid-template-columns:[label-start]auto[label-end control-start]auto[control-end];justify-content:start;align-items:center;gap:.5rem;display:grid}.🥝-field:where([data-kiwi-control-type=checkable][data-kiwi-label-placement=after]){grid-template-columns:[control-start]auto[control-end label-start]auto[label-end]}.🥝-field:where([data-kiwi-control-type=textlike]){--🥝field-description-column:control-start/control-end;align-items:baseline}.🥝-field:where([data-kiwi-control-type=textlike]):where(:not([data-kiwi-layout=inline])){grid-template-columns:[label-start control-start]auto[label-end control-end]}.🥝-field :where(.🥝-description){grid-column:var(--🥝field-description-column)}}}`;
3
3
 
4
4
  // src/bricks/styles.css.ts
5
5
  var styles_css_default = styles_default;
package/dist/DEV/bricks/~hooks.js CHANGED
@@ -48,9 +48,17 @@ function useEventHandlers(...handlers) {
48
48
  [latestHandlers]
49
49
  );
50
50
  }
51
+ function useSafeContext(context) {
52
+ const value = React.useContext(context);
53
+ if (value === void 0) {
54
+ throw new Error(`${context.displayName || "Context"} is undefined`);
55
+ }
56
+ return value;
57
+ }
51
58
  export {
52
59
  useControlledState,
53
60
  useEventHandlers,
54
61
  useLatestRef,
55
- useMergedRefs
62
+ useMergedRefs,
63
+ useSafeContext
56
64
  };
package/dist/DEV/foundations/styles.css.js CHANGED
@@ -1,5 +1,5 @@
1
1
  // inline-css:/home/runner/work/kiwi/kiwi/packages/kiwi-react/src/foundations/styles.css
2
- var styles_default = String.raw`@layer reset{*,:before,:after{box-sizing:border-box;margin:0;padding:0}:where([hidden]:not([hidden=until-found])){display:none!important}:where(html){-webkit-text-size-adjust:auto}:where(html:has(dialog:modal[open])){overflow:clip}:where(input,button,textarea,select){font:inherit;color:inherit}:where(img,picture,svg,video){block-size:auto;max-inline-size:100%;display:block}:where(p,h1,h2,h3,h4,h5,h6){overflow-wrap:break-word}:where(dialog,[popover]){color:inherit;inset:unset;max-width:unset;max-height:unset;overflow:unset;background:0 0;border:none}:where(dialog:not([open],[popover]),[popover]:not(:popover-open)){display:none!important}}@layer kiwi.foundations{html:where([data-color-scheme=light]),:host([data-color-scheme=light]),.🥝-root:where([data-kiwi-theme=light]){--kiwi-color-border-shadow-base:var(--kiwi-color-border-neutral-base);--kiwi-color-border-shadow-strong:#0000001f}@supports (color:lab(0% 0 0)){html:where([data-color-scheme=light]),:host([data-color-scheme=light]),.🥝-root:where([data-kiwi-theme=light]){--kiwi-color-border-shadow-strong:lab(0% 0 0/.12)}}:is(html:where([data-color-scheme=light]),:host([data-color-scheme=light]),.🥝-root:where([data-kiwi-theme=light])){--kiwi-color-bg-mono-base:#6b737d;--kiwi-color-bg-mono-muted:#fbfcfd;--kiwi-color-bg-mono-faded:#36393f;--kiwi-color-bg-accent-base:#188166;--kiwi-color-bg-accent-muted:#cae2dc;--kiwi-color-bg-accent-faded:#0d4133;--kiwi-color-bg-info-base:#0470dd;--kiwi-color-bg-info-muted:#c8dff8;--kiwi-color-bg-info-faded:#033970;--kiwi-color-bg-positive-base:#228404;--kiwi-color-bg-positive-muted:#cde3c6;--kiwi-color-bg-positive-faded:#114302;--kiwi-color-bg-attention-base:#9a6804;--kiwi-color-bg-attention-muted:#ecdbb9;--kiwi-color-bg-attention-faded:#4e3402;--kiwi-color-bg-critical-base:#df1c41;--kiwi-color-bg-critical-muted:#f9d4db;--kiwi-color-bg-critical-faded:#730e22;--kiwi-color-bg-surface-secondary:#edeeef;--kiwi-color-bg-surface-primary:#f7f8f9;--kiwi-color-bg-surface-tertiary:#e1e3e6;--kiwi-color-bg-surface-emphasis:#090a0b;--kiwi-color-bg-surface-base:#fbfcfd;--kiwi-color-bg-surface-quaternary:#111213;--kiwi-color-bg-neutral-base:#fbfcfd;--kiwi-color-bg-neutral-muted:#25282c;--kiwi-color-bg-neutral-faded:#edeeef;--kiwi-color-bg-neutral-inverse:#fbfcfd;--kiwi-color-bg-glow-base-hover-\%:4.0%;--kiwi-color-bg-glow-base-pressed-\%:8.0%;--kiwi-color-bg-glow-on-surface-accent-hover:#1881661f;--kiwi-color-bg-glow-on-surface-accent-pressed:#18816629;--kiwi-color-bg-glow-on-surface-neutral-hover:#0000000a;--kiwi-color-bg-glow-on-surface-neutral-pressed:#00000014;--kiwi-color-bg-glow-on-surface-critical-pressed:#df1c4129;--kiwi-color-bg-glow-on-surface-critical-hover:#df1c411f;--kiwi-color-bg-glow-on-surface-disabled:#0000000a;--kiwi-color-bg-glow-on-surface-overlay:#0000003d;--kiwi-color-bg-glow-on-surface-neutral-hover-\%:4.0%;--kiwi-color-bg-glow-on-surface-neutral-pressed-\%:8.0%;--kiwi-color-bg-glow-strong-pressed-\%:16.0%;--kiwi-color-bg-glow-strong-hover-\%:8.0%;--kiwi-color-icon-neutral-hover:#25282c;--kiwi-color-icon-neutral-base:#6b737d;--kiwi-color-icon-neutral-secondary:#969ca4;--kiwi-color-icon-neutral-tertiary:#acb1b7;--kiwi-color-icon-neutral-disabled:#acb1b7;--kiwi-color-icon-neutral-emphasis:#fff;--kiwi-color-icon-neutral-muted:#b8bdc1;--kiwi-color-icon-accent-base:#188166;--kiwi-color-icon-accent-strong:#188166;--kiwi-color-icon-accent-faded:#146b54;--kiwi-color-icon-info-base:#0470dd;--kiwi-color-icon-info-faded:#035db8;--kiwi-color-icon-positive-base:#228404;--kiwi-color-icon-positive-faded:#1c6d01;--kiwi-color-icon-attention-base:#9a6804;--kiwi-color-icon-attention-faded:#805604;--kiwi-color-icon-critical-base:#df1c41;--kiwi-color-icon-critical-faded:#ba1536;--kiwi-color-icon-mono-base:#6b737d;--kiwi-color-icon-mono-faded:#585f68;--kiwi-color-icon-glow-base-hover-\%:8.0%;--kiwi-color-icon-glow-base-pressed-\%:12.0%;--kiwi-color-icon-glow-strong-hover-\%:8.0%;--kiwi-color-icon-glow-strong-pressed-\%:16.0%;--kiwi-color-border-mono-base:#6b737d;--kiwi-color-border-mono-faded:#474c53;--kiwi-color-border-mono-muted:#808791;--kiwi-color-border-accent-base:#188166;--kiwi-color-border-accent-faded:#125544;--kiwi-color-border-accent-muted:#a7cfc4;--kiwi-color-border-accent-strong:#188166;--kiwi-color-border-info-base:#0470dd;--kiwi-color-border-info-faded:#024a93;--kiwi-color-border-info-muted:#a3caf3;--kiwi-color-border-positive-base:#228404;--kiwi-color-border-positive-muted:#acd1a0;--kiwi-color-border-positive-faded:#175801;--kiwi-color-border-attention-base:#9a6804;--kiwi-color-border-attention-muted:#dfc38a;--kiwi-color-border-attention-faded:#664502;--kiwi-color-border-critical-base:#df1c41;--kiwi-color-border-critical-muted:#f5b6c2;--kiwi-color-border-critical-faded:#96122c;--kiwi-color-border-glow-base-hover-\%:8.0%;--kiwi-color-border-glow-base-pressed-\%:12.0%;--kiwi-color-border-glow-on-surface-faded:#0000000a;--kiwi-color-border-glow-on-surface-disabled:#00000014;--kiwi-color-border-glow-strong-hover-\%:8.0%;--kiwi-color-border-glow-strong-pressed-\%:16.0%;--kiwi-color-border-neutral-base:#d4d7da;--kiwi-color-border-neutral-muted:#edeeef;--kiwi-color-border-neutral-faded:#c3c7cb;--kiwi-color-border-neutral-inverse:#090a0b;--kiwi-color-border-neutral-disabled:#acb1b7;--kiwi-color-border-surface-primary:#000000a3;--kiwi-color-text-mono-base:#6b737d;--kiwi-color-text-mono-faded:#585f68;--kiwi-color-text-accent-base:#188166;--kiwi-color-text-accent-faded:#146b54;--kiwi-color-text-accent-strong:#188166;--kiwi-color-text-info-base:#0470dd;--kiwi-color-text-info-faded:#035db8;--kiwi-color-text-positive-base:#228404;--kiwi-color-text-positive-faded:#1c6d01;--kiwi-color-text-attention-base:#9a6804;--kiwi-color-text-attention-faded:#805604;--kiwi-color-text-critical-base:#df1c41;--kiwi-color-text-critical-faded:#ba1536;--kiwi-color-text-neutral-emphasis:#fff;--kiwi-color-text-neutral-primary:#25282c;--kiwi-color-text-neutral-secondary:#474c53;--kiwi-color-text-neutral-tertiary:#585f68;--kiwi-color-text-neutral-disabled:#acb1b7;--kiwi-color-text-glow-base-hover-\%:8.0%;--kiwi-color-text-glow-base-pressed-\%:12.0%;--kiwi-color-text-glow-strong-hover-\%:8.0%;--kiwi-color-text-glow-strong-pressed-\%:16.0%;--kiwi-color-static-black:#000;--kiwi-color-static-white:#fff;--kiwi-color-static-accent:#188166;--kiwi-color-glow-hue:#000;--kiwi-shadow-surface-xs:0px 1px 0px 0px #0000000a,0px 0px 0px 1px #0000000a,inset 0px 0px 0px 1px #ffffff14,0px 1px 1px -.5px #0000000a;--kiwi-shadow-surface-sm:0px 1px 0px 0px #0000000a,0px 0px 0px 1px #0000000a,inset 0px 0px 0px 1px #ffffff14,0px 1px 1px -.5px #0000000a,0px 3px 3px -1.5px #0000000a;--kiwi-shadow-surface-md:0px 1px 0px 0px #0000000a,0px 0px 0px 1px #0000000a,0px 1px 1px -.5px #0000000a,inset 0px 0px 0px 1px #ffffff14,0px 3px 3px -1.5px #0000000a,0px 6px 6px -3px #0000000a;--kiwi-shadow-surface-lg:0px 1px 0px 0px #0000000a,0px 0px 0px 1px #0000000a,inset 0px 0px 0px 1px #ffffff14,0px 1px 1px -.5px #0000000a,0px 3px 3px -1.5px #0000000a,0px 6px 6px -3px #0000000a,0px 12px 12px -6px #0000000a;--kiwi-shadow-surface-xl:0px 1px 0px 0px #0000000a,0px 0px 0px 1px #0000000a,inset 0px 0px 0px 1px #ffffff14,0px 1px 1px -.5px #0000000a,0px 3px 3px -1.5px #0000000a,0px 6px 6px -3px #0000000a,0px 12px 12px -6px #0000000a,0px 24px 24px -12px #0000000a;--kiwi-shadow-button-base-drop:0px 1px 1px -.5px #0000000a,0px 3px 3px -1.5px #0000000a;--kiwi-shadow-button-base-inset:inset 0px -1px 0px 0px #00000014;--kiwi-shadow-input-base:inset 0px 1px 1px 0px #0000000a,inset 0px 2px 4px 0px #0000000a;--kiwi-shadow-tooltip-base:0px 1px 1px -.5px #0000000a,0px 3px 3px -1.5px #0000000a,0px 6px 6px -3px #0000000a,0px 12px 12px -6px #0000000a;--kiwi-shadow-toolbar-base:0px 1px 0px 0px #0000000a,0px 0px 0px 1px #000c,inset 0px 0px 0px 1px #ffffff14,0px 1px 1px -.5px #0000000a,0px 3px 3px -1.5px #0000000a,0px 6px 6px -3px #0000000a,0px 12px 12px -6px #0000000a,0px 24px 24px -12px #0000000a}@supports (color:lab(0% 0 0)){:is(html:where([data-color-scheme=light]),:host([data-color-scheme=light]),.🥝-root:where([data-kiwi-theme=light])){--kiwi-color-bg-mono-base:lab(48.0166% -1.43915 -6.5074);--kiwi-color-bg-mono-muted:lab(98.9092% -.247031 -.706732);--kiwi-color-bg-mono-faded:lab(23.8534% -.214189 -4.11189);--kiwi-color-bg-accent-base:lab(47.9563% -34.9245 6.19844);--kiwi-color-bg-accent-muted:lab(87.9759% -9.19014 .0959873);--kiwi-color-bg-accent-faded:lab(23.9375% -20.5725 3.46543);--kiwi-color-bg-info-base:lab(47.0129% 6.89358 -64.3085);--kiwi-color-bg-info-muted:lab(87.698% -4.01369 -14.8192);--kiwi-color-bg-info-faded:lab(23.4622% 1.99829 -36.9401);--kiwi-color-bg-positive-base:lab(48.1335% -44.6409 49.5307);--kiwi-color-bg-positive-muted:lab(88.0118% -11.6213 11.7514);--kiwi-color-bg-positive-faded:lab(24.1751% -26.9395 30.542);--kiwi-color-bg-attention-base:lab(48.4136% 15.4963 54.4339);--kiwi-color-bg-attention-muted:lab(88.1498% 2.15477 19.165);--kiwi-color-bg-attention-faded:lab(24.1971% 8.78102 32.5961);--kiwi-color-bg-critical-base:lab(48.9224% 71.0533 33.7629);--kiwi-color-bg-critical-muted:lab(88.2422% 14.0584 1.58488);--kiwi-color-bg-critical-faded:lab(24.3988% 42.8858 18.0549);--kiwi-color-bg-surface-secondary:lab(94.0372% -.246972 -.706685);--kiwi-color-bg-surface-primary:lab(97.5288% -.247031 -.706697);--kiwi-color-bg-surface-tertiary:lab(90.1495% -.315368 -1.86194);--kiwi-color-bg-surface-emphasis:lab(2.6968% -.176921 -.525138);--kiwi-color-bg-surface-base:lab(98.9092% -.247031 -.706732);--kiwi-color-bg-surface-quaternary:lab(5.39981% -.273019 -.834915);--kiwi-color-bg-neutral-base:lab(98.9092% -.247031 -.706732);--kiwi-color-bg-neutral-muted:lab(15.9236% -.636965 -3.2773);--kiwi-color-bg-neutral-faded:lab(94.0372% -.246972 -.706685);--kiwi-color-bg-neutral-inverse:lab(98.9092% -.247031 -.706732);--kiwi-color-bg-glow-on-surface-accent-hover:lab(47.9563% -34.9245 6.19844/.12);--kiwi-color-bg-glow-on-surface-accent-pressed:lab(47.9563% -34.9245 6.19844/.16);--kiwi-color-bg-glow-on-surface-neutral-hover:lab(0% 0 0/.04);--kiwi-color-bg-glow-on-surface-neutral-pressed:lab(0% 0 0/.08);--kiwi-color-bg-glow-on-surface-critical-pressed:lab(48.9224% 71.0533 33.7629/.16);--kiwi-color-bg-glow-on-surface-critical-hover:lab(48.9224% 71.0533 33.7629/.12);--kiwi-color-bg-glow-on-surface-disabled:lab(0% 0 0/.04);--kiwi-color-bg-glow-on-surface-overlay:lab(0% 0 0/.24);--kiwi-color-icon-neutral-hover:lab(15.9236% -.636965 -3.2773);--kiwi-color-icon-neutral-base:lab(48.0166% -1.43915 -6.5074);--kiwi-color-icon-neutral-secondary:lab(64.054% -1.04737 -5.12308);--kiwi-color-icon-neutral-tertiary:lab(71.9356% -.923872 -3.62363);--kiwi-color-icon-neutral-disabled:lab(71.9356% -.923872 -3.62363);--kiwi-color-icon-neutral-emphasis:lab(100% 0 0);--kiwi-color-icon-neutral-muted:lab(76.2989% -1.2362 -2.68073);--kiwi-color-icon-accent-base:lab(47.9563% -34.9245 6.19844);--kiwi-color-icon-accent-strong:lab(47.9563% -34.9245 6.19844);--kiwi-color-icon-accent-faded:lab(39.9909% -30.3487 5.56632);--kiwi-color-icon-info-base:lab(47.0129% 6.89358 -64.3085);--kiwi-color-icon-info-faded:lab(39.1976% 5.53149 -55.6635);--kiwi-color-icon-positive-base:lab(48.1335% -44.6409 49.5307);--kiwi-color-icon-positive-faded:lab(39.9631% -38.7919 43.5088);--kiwi-color-icon-attention-base:lab(48.4136% 15.4963 54.4339);--kiwi-color-icon-attention-faded:lab(40.3825% 13.3977 47.2814);--kiwi-color-icon-critical-base:lab(48.9224% 71.0533 33.7629);--kiwi-color-icon-critical-faded:lab(40.7732% 62.087 28.9054);--kiwi-color-icon-mono-base:lab(48.0166% -1.43915 -6.5074);--kiwi-color-icon-mono-faded:lab(39.9415% -1.2762 -6.16004);--kiwi-color-border-mono-base:lab(48.0166% -1.43915 -6.5074);--kiwi-color-border-mono-faded:lab(32.0457% -.837266 -4.75932);--kiwi-color-border-mono-muted:lab(55.9762% -1.06928 -6.24512);--kiwi-color-border-accent-base:lab(47.9563% -34.9245 6.19844);--kiwi-color-border-accent-faded:lab(31.7715% -24.8213 3.70236);--kiwi-color-border-accent-muted:lab(79.9997% -15.3805 .888169);--kiwi-color-border-accent-strong:lab(47.9563% -34.9245 6.19844);--kiwi-color-border-info-base:lab(47.0129% 6.89358 -64.3085);--kiwi-color-border-info-faded:lab(31.1021% 4.10384 -46.6708);--kiwi-color-border-info-muted:lab(79.5683% -6.13773 -24.6515);--kiwi-color-border-positive-base:lab(48.1335% -44.6409 49.5307);--kiwi-color-border-positive-muted:lab(80.1967% -19.5707 20.2529);--kiwi-color-border-positive-faded:lab(32.2353% -32.9313 37.368);--kiwi-color-border-attention-base:lab(48.4136% 15.4963 54.4339);--kiwi-color-border-attention-muted:lab(80.2272% 4.41358 32.3333);--kiwi-color-border-attention-faded:lab(32.3185% 10.6467 40.4656);--kiwi-color-border-critical-base:lab(48.9224% 71.0533 33.7629);--kiwi-color-border-critical-muted:lab(80.2428% 24.9421 3.36735);--kiwi-color-border-critical-faded:lab(32.6435% 52.4911 23.3912);--kiwi-color-border-glow-on-surface-faded:lab(0% 0 0/.04);--kiwi-color-border-glow-on-surface-disabled:lab(0% 0 0/.08);--kiwi-color-border-neutral-base:lab(85.8119% -.611454 -1.76426);--kiwi-color-border-neutral-muted:lab(94.0372% -.246972 -.706685);--kiwi-color-border-neutral-faded:lab(80.0111% -.849456 -2.46736);--kiwi-color-border-neutral-inverse:lab(2.6968% -.176921 -.525138);--kiwi-color-border-neutral-disabled:lab(71.9356% -.923872 -3.62363);--kiwi-color-border-surface-primary:lab(0% 0 0/.64);--kiwi-color-text-mono-base:lab(48.0166% -1.43915 -6.5074);--kiwi-color-text-mono-faded:lab(39.9415% -1.2762 -6.16004);--kiwi-color-text-accent-base:lab(47.9563% -34.9245 6.19844);--kiwi-color-text-accent-faded:lab(39.9909% -30.3487 5.56632);--kiwi-color-text-accent-strong:lab(47.9563% -34.9245 6.19844);--kiwi-color-text-info-base:lab(47.0129% 6.89358 -64.3085);--kiwi-color-text-info-faded:lab(39.1976% 5.53149 -55.6635);--kiwi-color-text-positive-base:lab(48.1335% -44.6409 49.5307);--kiwi-color-text-positive-faded:lab(39.9631% -38.7919 43.5088);--kiwi-color-text-attention-base:lab(48.4136% 15.4963 54.4339);--kiwi-color-text-attention-faded:lab(40.3825% 13.3977 47.2814);--kiwi-color-text-critical-base:lab(48.9224% 71.0533 33.7629);--kiwi-color-text-critical-faded:lab(40.7732% 62.087 28.9054);--kiwi-color-text-neutral-emphasis:lab(100% 0 0);--kiwi-color-text-neutral-primary:lab(15.9236% -.636965 -3.2773);--kiwi-color-text-neutral-secondary:lab(32.0457% -.837266 -4.75932);--kiwi-color-text-neutral-tertiary:lab(39.9415% -1.2762 -6.16004);--kiwi-color-text-neutral-disabled:lab(71.9356% -.923872 -3.62363);--kiwi-color-static-black:lab(0% 0 0);--kiwi-color-static-white:lab(100% 0 0);--kiwi-color-static-accent:lab(47.9563% -34.9245 6.19844);--kiwi-color-glow-hue:lab(0% 0 0);--kiwi-shadow-surface-xs:0px 1px 0px 0px lab(0% 0 0/.04),0px 0px 0px 1px lab(0% 0 0/.04),inset 0px 0px 0px 1px lab(100% 0 0/.08),0px 1px 1px -.5px lab(0% 0 0/.04);--kiwi-shadow-surface-sm:0px 1px 0px 0px lab(0% 0 0/.04),0px 0px 0px 1px lab(0% 0 0/.04),inset 0px 0px 0px 1px lab(100% 0 0/.08),0px 1px 1px -.5px lab(0% 0 0/.04),0px 3px 3px -1.5px lab(0% 0 0/.04);--kiwi-shadow-surface-md:0px 1px 0px 0px lab(0% 0 0/.04),0px 0px 0px 1px lab(0% 0 0/.04),0px 1px 1px -.5px lab(0% 0 0/.04),inset 0px 0px 0px 1px lab(100% 0 0/.08),0px 3px 3px -1.5px lab(0% 0 0/.04),0px 6px 6px -3px lab(0% 0 0/.04);--kiwi-shadow-surface-lg:0px 1px 0px 0px lab(0% 0 0/.04),0px 0px 0px 1px lab(0% 0 0/.04),inset 0px 0px 0px 1px lab(100% 0 0/.08),0px 1px 1px -.5px lab(0% 0 0/.04),0px 3px 3px -1.5px lab(0% 0 0/.04),0px 6px 6px -3px lab(0% 0 0/.04),0px 12px 12px -6px lab(0% 0 0/.04);--kiwi-shadow-surface-xl:0px 1px 0px 0px lab(0% 0 0/.04),0px 0px 0px 1px lab(0% 0 0/.04),inset 0px 0px 0px 1px lab(100% 0 0/.08),0px 1px 1px -.5px lab(0% 0 0/.04),0px 3px 3px -1.5px lab(0% 0 0/.04),0px 6px 6px -3px lab(0% 0 0/.04),0px 12px 12px -6px lab(0% 0 0/.04),0px 24px 24px -12px lab(0% 0 0/.04);--kiwi-shadow-button-base-drop:0px 1px 1px -.5px lab(0% 0 0/.04),0px 3px 3px -1.5px lab(0% 0 0/.04);--kiwi-shadow-button-base-inset:inset 0px -1px 0px 0px lab(0% 0 0/.08);--kiwi-shadow-input-base:inset 0px 1px 1px 0px lab(0% 0 0/.04),inset 0px 2px 4px 0px lab(0% 0 0/.04);--kiwi-shadow-tooltip-base:0px 1px 1px -.5px lab(0% 0 0/.04),0px 3px 3px -1.5px lab(0% 0 0/.04),0px 6px 6px -3px lab(0% 0 0/.04),0px 12px 12px -6px lab(0% 0 0/.04);--kiwi-shadow-toolbar-base:0px 1px 0px 0px lab(0% 0 0/.04),0px 0px 0px 1px lab(0% 0 0/.8),inset 0px 0px 0px 1px lab(100% 0 0/.08),0px 1px 1px -.5px lab(0% 0 0/.04),0px 3px 3px -1.5px lab(0% 0 0/.04),0px 6px 6px -3px lab(0% 0 0/.04),0px 12px 12px -6px lab(0% 0 0/.04),0px 24px 24px -12px lab(0% 0 0/.04)}}html:where([data-color-scheme=dark]),:host([data-color-scheme=dark]),.🥝-root:where([data-kiwi-theme=dark]){--kiwi-color-border-shadow-base:#ffffff14;--kiwi-color-border-shadow-strong:#ffffff29}@supports (color:lab(0% 0 0)){html:where([data-color-scheme=dark]),:host([data-color-scheme=dark]),.🥝-root:where([data-kiwi-theme=dark]){--kiwi-color-border-shadow-base:lab(100% 0 0/.08);--kiwi-color-border-shadow-strong:lab(100% 0 0/.16)}}:is(html:where([data-color-scheme=dark]),:host([data-color-scheme=dark]),.🥝-root:where([data-kiwi-theme=dark])){--kiwi-color-bg-mono-base:#6b737d;--kiwi-color-bg-mono-muted:#36393f;--kiwi-color-bg-mono-faded:#969ca4;--kiwi-color-bg-accent-base:#188166;--kiwi-color-bg-accent-muted:#0d4133;--kiwi-color-bg-accent-faded:#61a896;--kiwi-color-bg-info-base:#0470dd;--kiwi-color-bg-info-muted:#033970;--kiwi-color-bg-info-faded:#589fe9;--kiwi-color-bg-positive-base:#228404;--kiwi-color-bg-positive-muted:#114302;--kiwi-color-bg-positive-faded:#68ab53;--kiwi-color-bg-attention-base:#9a6804;--kiwi-color-bg-attention-muted:#4e3402;--kiwi-color-bg-attention-faded:#c6922c;--kiwi-color-bg-critical-base:#df1c41;--kiwi-color-bg-critical-muted:#730e22;--kiwi-color-bg-critical-faded:#ec768d;--kiwi-color-bg-surface-secondary:#212327;--kiwi-color-bg-surface-primary:#25282c;--kiwi-color-bg-surface-tertiary:#1a1c1e;--kiwi-color-bg-surface-emphasis:#090a0b;--kiwi-color-bg-surface-base:#25282c;--kiwi-color-bg-surface-quaternary:#111213;--kiwi-color-bg-neutral-base:#36393f;--kiwi-color-bg-neutral-muted:#25282c;--kiwi-color-bg-neutral-faded:#585f68;--kiwi-color-bg-neutral-inverse:#fbfcfd;--kiwi-color-bg-glow-base-hover-\%:4.0%;--kiwi-color-bg-glow-base-pressed-\%:8.0%;--kiwi-color-bg-glow-on-surface-accent-hover:#1881661f;--kiwi-color-bg-glow-on-surface-accent-pressed:#18816629;--kiwi-color-bg-glow-on-surface-critical-pressed:#df1c4129;--kiwi-color-bg-glow-on-surface-critical-hover:#df1c411f;--kiwi-color-bg-glow-on-surface-disabled:#ffffff0a;--kiwi-color-bg-glow-on-surface-overlay:#ffffff52;--kiwi-color-bg-glow-on-surface-neutral-hover-\%:4.0%;--kiwi-color-bg-glow-on-surface-neutral-pressed-\%:8.0%;--kiwi-color-bg-glow-strong-pressed-\%:16.0%;--kiwi-color-bg-glow-strong-hover-\%:8.0%;--kiwi-color-icon-neutral-hover:#fbfcfd;--kiwi-color-icon-neutral-base:#acb1b7;--kiwi-color-icon-neutral-secondary:#808791;--kiwi-color-icon-neutral-tertiary:#6b737d;--kiwi-color-icon-neutral-disabled:#585f68;--kiwi-color-icon-neutral-emphasis:#fff;--kiwi-color-icon-neutral-muted:#585f68;--kiwi-color-icon-accent-base:#61a896;--kiwi-color-icon-accent-strong:#06fac2;--kiwi-color-icon-accent-faded:#84bcad;--kiwi-color-icon-info-base:#589fe9;--kiwi-color-icon-info-faded:#7eb5ee;--kiwi-color-icon-positive-base:#68ab53;--kiwi-color-icon-positive-faded:#8abe7a;--kiwi-color-icon-attention-base:#c6922c;--kiwi-color-icon-attention-faded:#d3ab5b;--kiwi-color-icon-critical-base:#ec768d;--kiwi-color-icon-critical-faded:#f097a9;--kiwi-color-icon-mono-base:#969ca4;--kiwi-color-icon-mono-faded:#acb1b7;--kiwi-color-icon-glow-base-hover-\%:8.0%;--kiwi-color-icon-glow-base-pressed-\%:12.0%;--kiwi-color-icon-glow-strong-hover-\%:16.0%;--kiwi-color-icon-glow-strong-pressed-\%:24.0%;--kiwi-color-border-mono-base:#808791;--kiwi-color-border-mono-faded:#b8bdc1;--kiwi-color-border-mono-muted:#474c53;--kiwi-color-border-accent-base:#3d957e;--kiwi-color-border-accent-faded:#a7cfc4;--kiwi-color-border-accent-muted:#125544;--kiwi-color-border-accent-strong:#06fac2;--kiwi-color-border-info-base:#3088e4;--kiwi-color-border-info-faded:#a3caf3;--kiwi-color-border-info-muted:#024a93;--kiwi-color-border-positive-base:#46982c;--kiwi-color-border-positive-muted:#175801;--kiwi-color-border-positive-faded:#acd1a0;--kiwi-color-border-attention-base:#b67a02;--kiwi-color-border-attention-muted:#664502;--kiwi-color-border-attention-faded:#dfc38a;--kiwi-color-border-critical-base:#e7516e;--kiwi-color-border-critical-muted:#96122c;--kiwi-color-border-critical-faded:#f5b6c2;--kiwi-color-border-glow-base-hover-\%:8.0%;--kiwi-color-border-glow-base-pressed-\%:12.0%;--kiwi-color-border-glow-on-surface-faded:#ffffff0a;--kiwi-color-border-glow-on-surface-disabled:#ffffff14;--kiwi-color-border-glow-strong-hover-\%:16.0%;--kiwi-color-border-glow-strong-pressed-\%:24.0%;--kiwi-color-border-neutral-base:#474c53;--kiwi-color-border-neutral-muted:#36393f;--kiwi-color-border-neutral-faded:#808791;--kiwi-color-border-neutral-inverse:#fbfcfd;--kiwi-color-border-neutral-disabled:#585f68;--kiwi-color-border-surface-primary:#000000a3;--kiwi-color-text-mono-base:#969ca4;--kiwi-color-text-mono-faded:#acb1b7;--kiwi-color-text-accent-base:#61a896;--kiwi-color-text-accent-faded:#84bcad;--kiwi-color-text-accent-strong:#06fac2;--kiwi-color-text-info-base:#589fe9;--kiwi-color-text-info-faded:#7eb5ee;--kiwi-color-text-positive-base:#68ab53;--kiwi-color-text-positive-faded:#8abe7a;--kiwi-color-text-attention-base:#c6922c;--kiwi-color-text-attention-faded:#d3ab5b;--kiwi-color-text-critical-base:#ec768d;--kiwi-color-text-critical-faded:#f097a9;--kiwi-color-text-neutral-emphasis:#fff;--kiwi-color-text-neutral-primary:#fbfcfd;--kiwi-color-text-neutral-secondary:#b8bdc1;--kiwi-color-text-neutral-tertiary:#969ca4;--kiwi-color-text-neutral-disabled:#585f68;--kiwi-color-text-glow-base-hover-\%:8.0%;--kiwi-color-text-glow-base-pressed-\%:12.0%;--kiwi-color-text-glow-strong-hover-\%:16.0%;--kiwi-color-text-glow-strong-pressed-\%:24.0%;--kiwi-color-static-black:#000;--kiwi-color-static-white:#fff;--kiwi-color-static-accent:#188166;--kiwi-color-glow-hue:#fff;--kiwi-shadow-surface-xs:0px 1px 0px 0px #00000014,0px 0px 0px 1px #00000029,inset 0px 0px 0px 1px #ffffff14,0px 1px 1px -.5px #00000029;--kiwi-shadow-surface-sm:0px 1px 0px 0px #00000014,0px 0px 0px 1px #00000029,inset 0px 0px 0px 1px #ffffff14,0px 1px 1px -.5px #00000029,0px 3px 3px -1.5px #00000029;--kiwi-shadow-surface-md:0px 1px 0px 0px #00000014,0px 0px 0px 1px #00000029,0px 1px 1px -.5px #00000029,inset 0px 0px 0px 1px #ffffff14,0px 3px 3px -1.5px #00000029,0px 6px 6px -3px #00000029;--kiwi-shadow-surface-lg:0px 1px 0px 0px #00000014,0px 0px 0px 1px #00000029,inset 0px 0px 0px 1px #ffffff14,0px 1px 1px -.5px #00000029,0px 3px 3px -1.5px #00000029,0px 6px 6px -3px #00000029,0px 12px 12px -6px #00000029;--kiwi-shadow-surface-xl:0px 1px 0px 0px #00000014,0px 0px 0px 1px #00000029,inset 0px 0px 0px 1px #ffffff14,0px 1px 1px -.5px #00000029,0px 3px 3px -1.5px #00000029,0px 6px 6px -3px #00000029,0px 12px 12px -6px #00000029,0px 24px 24px -12px #00000029;--kiwi-shadow-button-base-drop:0px 1px 1px -.5px #00000029,0px 3px 3px -1.5px #00000029;--kiwi-shadow-button-base-inset:inset 0px -1px 0px 0px #00000014;--kiwi-shadow-input-base:inset 0px 1px 2px 0px #00000029,inset 0px 2px 4px 0px #00000029;--kiwi-shadow-tooltip-base:0px 1px 1px -.5px #00000029,0px 3px 3px -1.5px #00000029,0px 6px 6px -3px #00000029,0px 12px 12px -6px #00000029;--kiwi-shadow-toolbar-base:0px 1px 0px 0px #00000014,0px 0px 0px 1px #000c,inset 0px 0px 0px 1px #ffffff14,0px 1px 1px -.5px #00000029,0px 3px 3px -1.5px #00000029,0px 6px 6px -3px #00000029,0px 12px 12px -6px #00000029,0px 24px 24px -12px #00000029}@supports (color:lab(0% 0 0)){:is(html:where([data-color-scheme=dark]),:host([data-color-scheme=dark]),.🥝-root:where([data-kiwi-theme=dark])){--kiwi-color-bg-mono-base:lab(48.0166% -1.43915 -6.5074);--kiwi-color-bg-mono-muted:lab(23.8534% -.214189 -4.11189);--kiwi-color-bg-mono-faded:lab(64.054% -1.04737 -5.12308);--kiwi-color-bg-accent-base:lab(47.9563% -34.9245 6.19844);--kiwi-color-bg-accent-muted:lab(23.9375% -20.5725 3.46543);--kiwi-color-bg-accent-faded:lab(63.8151% -26.6434 1.96097);--kiwi-color-bg-info-base:lab(47.0129% 6.89358 -64.3085);--kiwi-color-bg-info-muted:lab(23.4622% 1.99829 -36.9401);--kiwi-color-bg-info-faded:lab(63.3151% -5.85896 -44.7124);--kiwi-color-bg-positive-base:lab(48.1335% -44.6409 49.5307);--kiwi-color-bg-positive-muted:lab(24.1751% -26.9395 30.542);--kiwi-color-bg-positive-faded:lab(63.9985% -35.01 38.0049);--kiwi-color-bg-attention-base:lab(48.4136% 15.4963 54.4339);--kiwi-color-bg-attention-muted:lab(24.1971% 8.78102 32.5961);--kiwi-color-bg-attention-faded:lab(64.4222% 13.6025 58.3401);--kiwi-color-bg-critical-base:lab(48.9224% 71.0533 33.7629);--kiwi-color-bg-critical-muted:lab(24.3988% 42.8858 18.0549);--kiwi-color-bg-critical-faded:lab(64.3708% 48.1797 9.98121);--kiwi-color-bg-surface-secondary:lab(13.6245% -.157475 -2.99128);--kiwi-color-bg-surface-primary:lab(15.9236% -.636965 -3.2773);--kiwi-color-bg-surface-tertiary:lab(10.1205% -.583336 -1.75366);--kiwi-color-bg-surface-emphasis:lab(2.6968% -.176921 -.525138);--kiwi-color-bg-surface-base:lab(15.9236% -.636965 -3.2773);--kiwi-color-bg-surface-quaternary:lab(5.39981% -.273019 -.834915);--kiwi-color-bg-neutral-base:lab(23.8534% -.214189 -4.11189);--kiwi-color-bg-neutral-muted:lab(15.9236% -.636965 -3.2773);--kiwi-color-bg-neutral-faded:lab(39.9415% -1.2762 -6.16004);--kiwi-color-bg-neutral-inverse:lab(98.9092% -.247031 -.706732);--kiwi-color-bg-glow-on-surface-accent-hover:lab(47.9563% -34.9245 6.19844/.12);--kiwi-color-bg-glow-on-surface-accent-pressed:lab(47.9563% -34.9245 6.19844/.16);--kiwi-color-bg-glow-on-surface-critical-pressed:lab(48.9224% 71.0533 33.7629/.16);--kiwi-color-bg-glow-on-surface-critical-hover:lab(48.9224% 71.0533 33.7629/.12);--kiwi-color-bg-glow-on-surface-disabled:lab(100% 0 0/.04);--kiwi-color-bg-glow-on-surface-overlay:lab(100% 0 0/.32);--kiwi-color-icon-neutral-hover:lab(98.9092% -.247031 -.706732);--kiwi-color-icon-neutral-base:lab(71.9356% -.923872 -3.62363);--kiwi-color-icon-neutral-secondary:lab(55.9762% -1.06928 -6.24512);--kiwi-color-icon-neutral-tertiary:lab(48.0166% -1.43915 -6.5074);--kiwi-color-icon-neutral-disabled:lab(39.9415% -1.2762 -6.16004);--kiwi-color-icon-neutral-emphasis:lab(100% 0 0);--kiwi-color-icon-neutral-muted:lab(39.9415% -1.2762 -6.16004);--kiwi-color-icon-accent-base:lab(63.8151% -26.6434 1.96097);--kiwi-color-icon-accent-strong:lab(87.9135% -61.1161 12.4515);--kiwi-color-icon-accent-faded:lab(72.0306% -21.3089 1.44627);--kiwi-color-icon-info-base:lab(63.3151% -5.85896 -44.7124);--kiwi-color-icon-info-faded:lab(71.5249% -7.08985 -34.6622);--kiwi-color-icon-positive-base:lab(63.9985% -35.01 38.0049);--kiwi-color-icon-positive-faded:lab(72.0603% -27.3667 28.6884);--kiwi-color-icon-attention-base:lab(64.4222% 13.6025 58.3401);--kiwi-color-icon-attention-faded:lab(72.4404% 8.26526 46.2542);--kiwi-color-icon-critical-base:lab(64.3708% 48.1797 9.98121);--kiwi-color-icon-critical-faded:lab(72.2102% 36.0258 5.42828);--kiwi-color-icon-mono-base:lab(64.054% -1.04737 -5.12308);--kiwi-color-icon-mono-faded:lab(71.9356% -.923872 -3.62363);--kiwi-color-border-mono-base:lab(55.9762% -1.06928 -6.24512);--kiwi-color-border-mono-faded:lab(76.2989% -1.2362 -2.68073);--kiwi-color-border-mono-muted:lab(32.0457% -.837266 -4.75932);--kiwi-color-border-accent-base:lab(55.9371% -32.0364 3.90248);--kiwi-color-border-accent-faded:lab(79.9997% -15.3805 .888169);--kiwi-color-border-accent-muted:lab(31.7715% -24.8213 3.70236);--kiwi-color-border-accent-strong:lab(87.9135% -61.1161 12.4515);--kiwi-color-border-info-base:lab(55.0934% -1.51214 -54.9444);--kiwi-color-border-info-faded:lab(79.5683% -6.13773 -24.6515);--kiwi-color-border-info-muted:lab(31.1021% 4.10384 -46.6708);--kiwi-color-border-positive-base:lab(56.1124% -41.2107 46.1777);--kiwi-color-border-positive-muted:lab(32.2353% -32.9313 37.368);--kiwi-color-border-positive-faded:lab(80.1967% -19.5707 20.2529);--kiwi-color-border-attention-base:lab(56.4461% 18.5372 61.9135);--kiwi-color-border-attention-muted:lab(32.3185% 10.6467 40.4656);--kiwi-color-border-attention-faded:lab(80.2272% 4.41358 32.3333);--kiwi-color-border-critical-base:lab(56.7098% 60.1448 17.1741);--kiwi-color-border-critical-muted:lab(32.6435% 52.4911 23.3912);--kiwi-color-border-critical-faded:lab(80.2428% 24.9421 3.36735);--kiwi-color-border-glow-on-surface-faded:lab(100% 0 0/.04);--kiwi-color-border-glow-on-surface-disabled:lab(100% 0 0/.08);--kiwi-color-border-neutral-base:lab(32.0457% -.837266 -4.75932);--kiwi-color-border-neutral-muted:lab(23.8534% -.214189 -4.11189);--kiwi-color-border-neutral-faded:lab(55.9762% -1.06928 -6.24512);--kiwi-color-border-neutral-inverse:lab(98.9092% -.247031 -.706732);--kiwi-color-border-neutral-disabled:lab(39.9415% -1.2762 -6.16004);--kiwi-color-border-surface-primary:lab(0% 0 0/.64);--kiwi-color-text-mono-base:lab(64.054% -1.04737 -5.12308);--kiwi-color-text-mono-faded:lab(71.9356% -.923872 -3.62363);--kiwi-color-text-accent-base:lab(63.8151% -26.6434 1.96097);--kiwi-color-text-accent-faded:lab(72.0306% -21.3089 1.44627);--kiwi-color-text-accent-strong:lab(87.9135% -61.1161 12.4515);--kiwi-color-text-info-base:lab(63.3151% -5.85896 -44.7124);--kiwi-color-text-info-faded:lab(71.5249% -7.08985 -34.6622);--kiwi-color-text-positive-base:lab(63.9985% -35.01 38.0049);--kiwi-color-text-positive-faded:lab(72.0603% -27.3667 28.6884);--kiwi-color-text-attention-base:lab(64.4222% 13.6025 58.3401);--kiwi-color-text-attention-faded:lab(72.4404% 8.26526 46.2542);--kiwi-color-text-critical-base:lab(64.3708% 48.1797 9.98121);--kiwi-color-text-critical-faded:lab(72.2102% 36.0258 5.42828);--kiwi-color-text-neutral-emphasis:lab(100% 0 0);--kiwi-color-text-neutral-primary:lab(98.9092% -.247031 -.706732);--kiwi-color-text-neutral-secondary:lab(76.2989% -1.2362 -2.68073);--kiwi-color-text-neutral-tertiary:lab(64.054% -1.04737 -5.12308);--kiwi-color-text-neutral-disabled:lab(39.9415% -1.2762 -6.16004);--kiwi-color-static-black:lab(0% 0 0);--kiwi-color-static-white:lab(100% 0 0);--kiwi-color-static-accent:lab(47.9563% -34.9245 6.19844);--kiwi-color-glow-hue:lab(100% 0 0);--kiwi-shadow-surface-xs:0px 1px 0px 0px lab(0% 0 0/.08),0px 0px 0px 1px lab(0% 0 0/.16),inset 0px 0px 0px 1px lab(100% 0 0/.08),0px 1px 1px -.5px lab(0% 0 0/.16);--kiwi-shadow-surface-sm:0px 1px 0px 0px lab(0% 0 0/.08),0px 0px 0px 1px lab(0% 0 0/.16),inset 0px 0px 0px 1px lab(100% 0 0/.08),0px 1px 1px -.5px lab(0% 0 0/.16),0px 3px 3px -1.5px lab(0% 0 0/.16);--kiwi-shadow-surface-md:0px 1px 0px 0px lab(0% 0 0/.08),0px 0px 0px 1px lab(0% 0 0/.16),0px 1px 1px -.5px lab(0% 0 0/.16),inset 0px 0px 0px 1px lab(100% 0 0/.08),0px 3px 3px -1.5px lab(0% 0 0/.16),0px 6px 6px -3px lab(0% 0 0/.16);--kiwi-shadow-surface-lg:0px 1px 0px 0px lab(0% 0 0/.08),0px 0px 0px 1px lab(0% 0 0/.16),inset 0px 0px 0px 1px lab(100% 0 0/.08),0px 1px 1px -.5px lab(0% 0 0/.16),0px 3px 3px -1.5px lab(0% 0 0/.16),0px 6px 6px -3px lab(0% 0 0/.16),0px 12px 12px -6px lab(0% 0 0/.16);--kiwi-shadow-surface-xl:0px 1px 0px 0px lab(0% 0 0/.08),0px 0px 0px 1px lab(0% 0 0/.16),inset 0px 0px 0px 1px lab(100% 0 0/.08),0px 1px 1px -.5px lab(0% 0 0/.16),0px 3px 3px -1.5px lab(0% 0 0/.16),0px 6px 6px -3px lab(0% 0 0/.16),0px 12px 12px -6px lab(0% 0 0/.16),0px 24px 24px -12px lab(0% 0 0/.16);--kiwi-shadow-button-base-drop:0px 1px 1px -.5px lab(0% 0 0/.16),0px 3px 3px -1.5px lab(0% 0 0/.16);--kiwi-shadow-button-base-inset:inset 0px -1px 0px 0px lab(0% 0 0/.08);--kiwi-shadow-input-base:inset 0px 1px 2px 0px lab(0% 0 0/.16),inset 0px 2px 4px 0px lab(0% 0 0/.16);--kiwi-shadow-tooltip-base:0px 1px 1px -.5px lab(0% 0 0/.16),0px 3px 3px -1.5px lab(0% 0 0/.16),0px 6px 6px -3px lab(0% 0 0/.16),0px 12px 12px -6px lab(0% 0 0/.16);--kiwi-shadow-toolbar-base:0px 1px 0px 0px lab(0% 0 0/.08),0px 0px 0px 1px lab(0% 0 0/.8),inset 0px 0px 0px 1px lab(100% 0 0/.08),0px 1px 1px -.5px lab(0% 0 0/.16),0px 3px 3px -1.5px lab(0% 0 0/.16),0px 6px 6px -3px lab(0% 0 0/.16),0px 12px 12px -6px lab(0% 0 0/.16),0px 24px 24px -12px lab(0% 0 0/.16)}}:root,:host{--kiwi-font-family-sans:"InterVariable","Noto Sans","Open Sans",sans-serif;--kiwi-font-family-mono:"Geist Mono","Noto Sans Mono",ui-monospace,"Segoe UI Mono",Consolas,monospace}:is(:root,:host){--kiwi-font-size-8:.5rem;--kiwi-font-size-10:.625rem;--kiwi-font-size-11:.6875rem;--kiwi-font-size-12:.75rem;--kiwi-font-size-14:.875rem;--kiwi-font-size-16:1rem;--kiwi-font-size-20:1.25rem;--kiwi-font-size-24:1.5rem;--kiwi-font-size-28:1.75rem;--kiwi-font-size-32:2rem;--kiwi-font-size-40:2.5rem;--kiwi-font-size-48:3rem}.🥝-root:where([data-kiwi-density=dense]){font-size:var(--kiwi-font-size-12);letter-spacing:0;line-height:1.3333}html{background-color:var(--kiwi-color-bg-surface-primary)}body{font-size:var(--kiwi-font-size-14);letter-spacing:0;line-height:1.4286}:is(body,.🥝-root){font-family:var(--kiwi-font-family-sans);color:var(--kiwi-color-text-neutral-primary)}:focus-visible{outline:2px solid var(--kiwi-color-border-accent-strong);outline-offset:1px}}`;
2
+ var styles_default = String.raw`@layer reset{*,:before,:after{box-sizing:border-box;margin:0;padding:0}:where([hidden]:not([hidden=until-found])){display:none!important}:where(html){-webkit-text-size-adjust:auto}:where(html:has(dialog:modal[open])){overflow:clip}:where(input,button,textarea,select){font:inherit;color:inherit}:where(img,picture,svg,video){block-size:auto;max-inline-size:100%;display:block}:where(p,h1,h2,h3,h4,h5,h6){overflow-wrap:break-word}:where(dialog,[popover]){color:inherit;inset:unset;max-width:unset;max-height:unset;overflow:unset;background:0 0;border:none}:where(dialog:not([open],[popover]),[popover]:not(:popover-open)){display:none!important}}@layer itwinui.foundations{html:where([data-color-scheme=light]),:host([data-color-scheme=light]),.🥝-root:where([data-kiwi-theme=light]){--ids-color-border-shadow-base:var(--ids-color-border-neutral-base);--ids-color-border-shadow-strong:oklch(0% none none/.12)}:is(html:where([data-color-scheme=light]),:host([data-color-scheme=light]),.🥝-root:where([data-kiwi-theme=light])){--ids-color-bg-mono-base:oklch(55.22% .018 253.99);--ids-color-bg-mono-muted:oklch(87.77% .005 247.88);--ids-color-bg-mono-faded:oklch(34.4% .011 264.42);--ids-color-bg-accent-base:oklch(54% .1 170.26);--ids-color-bg-accent-muted:oklch(89.34% .027 178.99);--ids-color-bg-accent-faded:oklch(33.76% .059 170.74);--ids-color-bg-info-base:oklch(55.68% .187 255.82);--ids-color-bg-info-muted:oklch(89.45% .042 250.5);--ids-color-bg-info-faded:oklch(34.71% .108 254.29);--ids-color-bg-positive-base:oklch(53.64% .173 140.57);--ids-color-bg-positive-muted:oklch(89.17% .046 138.13);--ids-color-bg-positive-faded:oklch(33.63% .106 139.87);--ids-color-bg-attention-base:oklch(55.63% .116 75.58);--ids-color-bg-attention-muted:oklch(89.65% .049 84.55);--ids-color-bg-attention-faded:oklch(34.69% .071 77.24);--ids-color-bg-critical-base:oklch(58.02% .221 19.39);--ids-color-bg-critical-muted:oklch(90.3% .042 5.14);--ids-color-bg-critical-faded:oklch(36.08% .133 17.52);--ids-color-bg-page-depth:oklch(94.86% .002 247.84);--ids-color-bg-page-base:oklch(99.06% .002 247.84);--ids-color-bg-page-zebra:oklch(0% none none/.02);--ids-color-bg-elevation-base:oklch(100% none none);--ids-color-bg-elevation-emphasis:oklch(18.15% .003 247.97);--ids-color-bg-elevation-control:oklch(100% none none);--ids-color-bg-elevation-level-1:oklch(100% none none);--ids-color-bg-elevation-overlay:oklch(99.06% .002 247.84);--ids-color-bg-elevation-level-2:oklch(100% none none);--ids-color-bg-elevation-scrollbar-surface:oklch(0% none none/.32);--ids-color-bg-elevation-scrollbar-canvas:oklch(0% none none/.48);--ids-color-bg-neutral-base:oklch(100% none none);--ids-color-bg-neutral-muted:oklch(97.87% .002 247.84);--ids-color-bg-neutral-faded:oklch(94.86% .002 247.84);--ids-color-bg-neutral-inverse:oklch(100% none none);--ids-color-bg-glow-base-hover-\%:4.0%;--ids-color-bg-glow-base-pressed-\%:8.0%;--ids-color-bg-glow-on-surface-accent-hover:oklch(54% .1 170.26/.12);--ids-color-bg-glow-on-surface-accent-pressed:oklch(54% .1 170.26/.16);--ids-color-bg-glow-on-surface-neutral-hover:oklch(0% none none/.04);--ids-color-bg-glow-on-surface-neutral-pressed:oklch(0% none none/.08);--ids-color-bg-glow-on-surface-critical-pressed:oklch(58.02% .221 19.39/.16);--ids-color-bg-glow-on-surface-critical-hover:oklch(58.02% .221 19.39/.12);--ids-color-bg-glow-on-surface-disabled:oklch(0% none none/.04);--ids-color-bg-glow-strong-pressed-\%:16.0%;--ids-color-bg-glow-strong-hover-\%:8.0%;--ids-color-icon-neutral-hover:oklch(26.92% .008 268.32);--ids-color-icon-neutral-base:oklch(55.22% .018 253.99);--ids-color-icon-neutral-secondary:oklch(69.04% .014 255.53);--ids-color-icon-neutral-tertiary:oklch(75.82% .01 252.83);--ids-color-icon-neutral-disabled:oklch(75.82% .01 252.83);--ids-color-icon-neutral-emphasis:oklch(100% none none);--ids-color-icon-neutral-muted:oklch(79.56% .008 241.69);--ids-color-icon-accent-base:oklch(54% .1 170.26);--ids-color-icon-accent-strong:oklch(54% .1 170.26);--ids-color-icon-accent-faded:oklch(47.28% .087 169.96);--ids-color-icon-info-base:oklch(55.68% .187 255.82);--ids-color-icon-info-faded:oklch(48.74% .162 255.58);--ids-color-icon-positive-base:oklch(53.64% .173 140.57);--ids-color-icon-positive-faded:oklch(46.81% .151 140.37);--ids-color-icon-attention-base:oklch(55.63% .116 75.58);--ids-color-icon-attention-faded:oklch(48.69% .101 75.71);--ids-color-icon-critical-base:oklch(58.02% .221 19.39);--ids-color-icon-critical-faded:oklch(50.74% .193 19.05);--ids-color-icon-mono-base:oklch(55.22% .018 253.99);--ids-color-icon-mono-faded:oklch(48.26% .017 254.7);--ids-color-icon-glow-base-hover-\%:8.0%;--ids-color-icon-glow-base-pressed-\%:12.0%;--ids-color-icon-glow-strong-hover-\%:8.0%;--ids-color-icon-glow-strong-pressed-\%:16.0%;--ids-color-border-mono-base:oklch(55.22% .018 253.99);--ids-color-border-mono-faded:oklch(41.45% .013 256.75);--ids-color-border-mono-muted:oklch(62.09% .017 257.22);--ids-color-border-accent-base:oklch(54% .1 170.26);--ids-color-border-accent-faded:oklch(40.38% .071 171.73);--ids-color-border-accent-muted:oklch(82.26% .045 176.56);--ids-color-border-accent-strong:oklch(54% .1 170.26);--ids-color-border-info-base:oklch(55.68% .187 255.82);--ids-color-border-info-faded:oklch(41.55% .136 255.23);--ids-color-border-info-muted:oklch(82.51% .071 249.98);--ids-color-border-positive-base:oklch(53.64% .173 140.57);--ids-color-border-positive-muted:oklch(82.11% .078 138.1);--ids-color-border-positive-faded:oklch(40.36% .129 140.08);--ids-color-border-attention-base:oklch(55.63% .116 75.58);--ids-color-border-attention-muted:oklch(82.78% .08 84.58);--ids-color-border-attention-faded:oklch(41.7% .086 77.28);--ids-color-border-critical-base:oklch(58.02% .221 19.39);--ids-color-border-critical-muted:oklch(83.74% .075 6.15);--ids-color-border-critical-faded:oklch(43.46% .163 18.38);--ids-color-border-glow-base-hover-\%:8.0%;--ids-color-border-glow-base-pressed-\%:12.0%;--ids-color-border-glow-base-default:oklch(0% none none/.08);--ids-color-border-glow-on-surface-faded:oklch(0% none none/.04);--ids-color-border-glow-on-surface-disabled:oklch(0% none none/.08);--ids-color-border-glow-strong-hover-\%:8.0%;--ids-color-border-glow-strong-pressed-\%:16.0%;--ids-color-border-glow-strong-default:oklch(0% none none/.12);--ids-color-border-neutral-base:oklch(87.77% .005 247.88);--ids-color-border-neutral-muted:oklch(91.52% .005 258.33);--ids-color-border-neutral-faded:oklch(82.77% .007 247.91);--ids-color-border-neutral-inverse:oklch(14.4% .003 247.09);--ids-color-border-neutral-disabled:oklch(75.82% .01 252.83);--ids-color-border-elevation-base:oklch(0% none none/.64);--ids-color-border-elevation-scrollbar-canvas:oklch(100% none none/.24);--ids-color-border-page-base:oklch(0% none none/.08);--ids-color-border-page-depth:oklch(0% none none/.08);--ids-color-text-mono-base:oklch(55.22% .018 253.99);--ids-color-text-mono-faded:oklch(48.26% .017 254.7);--ids-color-text-accent-base:oklch(54% .1 170.26);--ids-color-text-accent-faded:oklch(47.28% .087 169.96);--ids-color-text-accent-strong:oklch(54% .1 170.26);--ids-color-text-info-base:oklch(55.68% .187 255.82);--ids-color-text-info-faded:oklch(48.74% .162 255.58);--ids-color-text-positive-base:oklch(53.64% .173 140.57);--ids-color-text-positive-faded:oklch(46.81% .151 140.37);--ids-color-text-attention-base:oklch(55.63% .116 75.58);--ids-color-text-attention-faded:oklch(48.69% .101 75.71);--ids-color-text-critical-base:oklch(58.02% .221 19.39);--ids-color-text-critical-faded:oklch(50.74% .193 19.05);--ids-color-text-neutral-emphasis:oklch(100% none none);--ids-color-text-neutral-primary:oklch(24.37% .006 268.32);--ids-color-text-neutral-secondary:oklch(41.45% .013 256.75);--ids-color-text-neutral-tertiary:oklch(48.26% .017 254.7);--ids-color-text-neutral-disabled:oklch(75.82% .01 252.83);--ids-color-text-glow-base-hover-\%:8.0%;--ids-color-text-glow-base-pressed-\%:12.0%;--ids-color-text-glow-strong-hover-\%:8.0%;--ids-color-text-glow-strong-pressed-\%:16.0%;--ids-color-static-black:oklch(0% none none);--ids-color-static-white:oklch(100% none none);--ids-color-static-accent:oklch(54% .1 170.26);--ids-color-glow-hue:oklch(0% none none);--ids-shadow-surface-xs:0px 1px 0px 0px oklch(0% none none/.04),0px 0px 0px 1px oklch(0% none none/.08),inset 0px 0px 0px 1px oklch(100% none none/.04),0px 1px 1px -.5px oklch(0% none none/.04);--ids-shadow-surface-sm:0px 1px 0px 0px oklch(0% none none/.04),0px 0px 0px 1px oklch(0% none none/.08),inset 0px 0px 0px 1px oklch(100% none none/.04),0px 1px 1px -.5px oklch(0% none none/.04),0px 3px 3px -1.5px oklch(0% none none/.04);--ids-shadow-surface-md:0px 1px 0px 0px oklch(0% none none/.04),0px 0px 0px 1px oklch(0% none none/.08),0px 1px 1px -.5px oklch(0% none none/.04),inset 0px 0px 0px 1px oklch(100% none none/.04),0px 3px 3px -1.5px oklch(0% none none/.04),0px 6px 6px -3px oklch(0% none none/.04);--ids-shadow-surface-lg:0px 1px 0px 0px oklch(0% none none/.04),0px 0px 0px 1px oklch(0% none none/.08),inset 0px 0px 0px 1px oklch(100% none none/.04),0px 1px 1px -.5px oklch(0% none none/.04),0px 3px 3px -1.5px oklch(0% none none/.04),0px 6px 6px -3px oklch(0% none none/.04),0px 12px 12px -6px oklch(0% none none/.04);--ids-shadow-surface-xl:0px 1px 0px 0px oklch(0% none none/.04),0px 0px 0px 1px oklch(0% none none/.08),inset 0px 0px 0px 1px oklch(100% none none/.04),0px 1px 1px -.5px oklch(0% none none/.04),0px 3px 3px -1.5px oklch(0% none none/.04),0px 6px 6px -3px oklch(0% none none/.04),0px 12px 12px -6px oklch(0% none none/.04),0px 24px 24px -12px oklch(0% none none/.04);--ids-shadow-button-base-drop:0px 1px 1px -.5px oklch(0% none none/.04),0px 3px 3px -1.5px oklch(0% none none/.04);--ids-shadow-button-base-inset:inset 0px -1px 0px 0px oklch(0% none none/.08);--ids-shadow-input-base:inset 0px 1px 1px 0px oklch(0% none none/.04),inset 0px 2px 4px 0px oklch(0% none none/.04);--ids-shadow-tooltip-base:0px 1px 1px -.5px oklch(0% none none/.04),0px 3px 3px -1.5px oklch(0% none none/.04),0px 6px 6px -3px oklch(0% none none/.04),0px 12px 12px -6px oklch(0% none none/.04);--ids-shadow-toolbar-base:0px 1px 0px 0px oklch(0% none none/.04),0px 0px 0px 1px oklch(0% none none/.8),inset 0px 0px 0px 1px oklch(100% none none/.08),0px 1px 1px -.5px oklch(0% none none/.04),0px 3px 3px -1.5px oklch(0% none none/.04),0px 6px 6px -3px oklch(0% none none/.04),0px 12px 12px -6px oklch(0% none none/.04),0px 24px 24px -12px oklch(0% none none/.04)}@supports not (color:oklch(0% 0 0)){:is(html:where([data-color-scheme=light]),:host([data-color-scheme=light]),.🥝-root:where([data-kiwi-theme=light])){--ids-color-bg-mono-base:#6b737d;--ids-color-bg-mono-muted:#d4d7da;--ids-color-bg-mono-faded:#36393f;--ids-color-bg-accent-base:#188166;--ids-color-bg-accent-muted:#cae2dc;--ids-color-bg-accent-faded:#0d4133;--ids-color-bg-info-base:#0470dd;--ids-color-bg-info-muted:#c8dff8;--ids-color-bg-info-faded:#033970;--ids-color-bg-positive-base:#228404;--ids-color-bg-positive-muted:#cde3c6;--ids-color-bg-positive-faded:#114302;--ids-color-bg-attention-base:#9a6804;--ids-color-bg-attention-muted:#ecdbb9;--ids-color-bg-attention-faded:#4e3402;--ids-color-bg-critical-base:#df1c41;--ids-color-bg-critical-muted:#f9d4db;--ids-color-bg-critical-faded:#730e22;--ids-color-bg-page-depth:#edeeef;--ids-color-bg-page-base:#fbfcfd;--ids-color-bg-page-zebra:#00000005;--ids-color-bg-elevation-base:#fff;--ids-color-bg-elevation-emphasis:#111213;--ids-color-bg-elevation-control:#fff;--ids-color-bg-elevation-level-1:#fff;--ids-color-bg-elevation-overlay:#fbfcfd;--ids-color-bg-elevation-level-2:#fff;--ids-color-bg-elevation-scrollbar-surface:#00000052;--ids-color-bg-elevation-scrollbar-canvas:#0000007a;--ids-color-bg-neutral-base:#fff;--ids-color-bg-neutral-muted:#f7f8f9;--ids-color-bg-neutral-faded:#edeeef;--ids-color-bg-neutral-inverse:#fff;--ids-color-bg-glow-base-hover-\%:4.0%;--ids-color-bg-glow-base-pressed-\%:8.0%;--ids-color-bg-glow-on-surface-accent-hover:#1881661f;--ids-color-bg-glow-on-surface-accent-pressed:#18816629;--ids-color-bg-glow-on-surface-neutral-hover:#0000000a;--ids-color-bg-glow-on-surface-neutral-pressed:#00000014;--ids-color-bg-glow-on-surface-critical-pressed:#df1c4129;--ids-color-bg-glow-on-surface-critical-hover:#df1c411f;--ids-color-bg-glow-on-surface-disabled:#0000000a;--ids-color-bg-glow-strong-pressed-\%:16.0%;--ids-color-bg-glow-strong-hover-\%:8.0%;--ids-color-icon-neutral-hover:#24262a;--ids-color-icon-neutral-base:#6b737d;--ids-color-icon-neutral-secondary:#969ca4;--ids-color-icon-neutral-tertiary:#acb1b7;--ids-color-icon-neutral-disabled:#acb1b7;--ids-color-icon-neutral-emphasis:#fff;--ids-color-icon-neutral-muted:#b8bdc1;--ids-color-icon-accent-base:#188166;--ids-color-icon-accent-strong:#188166;--ids-color-icon-accent-faded:#146b54;--ids-color-icon-info-base:#0470dd;--ids-color-icon-info-faded:#035db8;--ids-color-icon-positive-base:#228404;--ids-color-icon-positive-faded:#1c6d01;--ids-color-icon-attention-base:#9a6804;--ids-color-icon-attention-faded:#805604;--ids-color-icon-critical-base:#df1c41;--ids-color-icon-critical-faded:#ba1536;--ids-color-icon-mono-base:#6b737d;--ids-color-icon-mono-faded:#585f68;--ids-color-icon-glow-base-hover-\%:8.0%;--ids-color-icon-glow-base-pressed-\%:12.0%;--ids-color-icon-glow-strong-hover-\%:8.0%;--ids-color-icon-glow-strong-pressed-\%:16.0%;--ids-color-border-mono-base:#6b737d;--ids-color-border-mono-faded:#474c53;--ids-color-border-mono-muted:#808791;--ids-color-border-accent-base:#188166;--ids-color-border-accent-faded:#125544;--ids-color-border-accent-muted:#a7cfc4;--ids-color-border-accent-strong:#188166;--ids-color-border-info-base:#0470dd;--ids-color-border-info-faded:#024a93;--ids-color-border-info-muted:#a3caf3;--ids-color-border-positive-base:#228404;--ids-color-border-positive-muted:#acd1a0;--ids-color-border-positive-faded:#175801;--ids-color-border-attention-base:#9a6804;--ids-color-border-attention-muted:#dfc38a;--ids-color-border-attention-faded:#664502;--ids-color-border-critical-base:#df1c41;--ids-color-border-critical-muted:#f5b6c2;--ids-color-border-critical-faded:#96122c;--ids-color-border-glow-base-hover-\%:8.0%;--ids-color-border-glow-base-pressed-\%:12.0%;--ids-color-border-glow-base-default:#00000014;--ids-color-border-glow-on-surface-faded:#0000000a;--ids-color-border-glow-on-surface-disabled:#00000014;--ids-color-border-glow-strong-hover-\%:8.0%;--ids-color-border-glow-strong-pressed-\%:16.0%;--ids-color-border-glow-strong-default:#0000001f;--ids-color-border-neutral-base:#d4d7da;--ids-color-border-neutral-muted:#e1e3e6;--ids-color-border-neutral-faded:#c3c7cb;--ids-color-border-neutral-inverse:#090a0b;--ids-color-border-neutral-disabled:#acb1b7;--ids-color-border-elevation-base:#000000a3;--ids-color-border-elevation-scrollbar-canvas:#ffffff3d;--ids-color-border-page-base:#00000014;--ids-color-border-page-depth:#00000014;--ids-color-text-mono-base:#6b737d;--ids-color-text-mono-faded:#585f68;--ids-color-text-accent-base:#188166;--ids-color-text-accent-faded:#146b54;--ids-color-text-accent-strong:#188166;--ids-color-text-info-base:#0470dd;--ids-color-text-info-faded:#035db8;--ids-color-text-positive-base:#228404;--ids-color-text-positive-faded:#1c6d01;--ids-color-text-attention-base:#9a6804;--ids-color-text-attention-faded:#805604;--ids-color-text-critical-base:#df1c41;--ids-color-text-critical-faded:#ba1536;--ids-color-text-neutral-emphasis:#fff;--ids-color-text-neutral-primary:#1f2023;--ids-color-text-neutral-secondary:#474c53;--ids-color-text-neutral-tertiary:#585f68;--ids-color-text-neutral-disabled:#acb1b7;--ids-color-text-glow-base-hover-\%:8.0%;--ids-color-text-glow-base-pressed-\%:12.0%;--ids-color-text-glow-strong-hover-\%:8.0%;--ids-color-text-glow-strong-pressed-\%:16.0%;--ids-color-static-black:#000;--ids-color-static-white:#fff;--ids-color-static-accent:#188166;--ids-color-glow-hue:#000;--ids-shadow-surface-xs:0px 1px 0px 0px #0000000a,0px 0px 0px 1px #00000014,inset 0px 0px 0px 1px #ffffff0a,0px 1px 1px -.5px #0000000a;--ids-shadow-surface-sm:0px 1px 0px 0px #0000000a,0px 0px 0px 1px #00000014,inset 0px 0px 0px 1px #ffffff0a,0px 1px 1px -.5px #0000000a,0px 3px 3px -1.5px #0000000a;--ids-shadow-surface-md:0px 1px 0px 0px #0000000a,0px 0px 0px 1px #00000014,0px 1px 1px -.5px #0000000a,inset 0px 0px 0px 1px #ffffff0a,0px 3px 3px -1.5px #0000000a,0px 6px 6px -3px #0000000a;--ids-shadow-surface-lg:0px 1px 0px 0px #0000000a,0px 0px 0px 1px #00000014,inset 0px 0px 0px 1px #ffffff0a,0px 1px 1px -.5px #0000000a,0px 3px 3px -1.5px #0000000a,0px 6px 6px -3px #0000000a,0px 12px 12px -6px #0000000a;--ids-shadow-surface-xl:0px 1px 0px 0px #0000000a,0px 0px 0px 1px #00000014,inset 0px 0px 0px 1px #ffffff0a,0px 1px 1px -.5px #0000000a,0px 3px 3px -1.5px #0000000a,0px 6px 6px -3px #0000000a,0px 12px 12px -6px #0000000a,0px 24px 24px -12px #0000000a;--ids-shadow-button-base-drop:0px 1px 1px -.5px #0000000a,0px 3px 3px -1.5px #0000000a;--ids-shadow-button-base-inset:inset 0px -1px 0px 0px #00000014;--ids-shadow-input-base:inset 0px 1px 1px 0px #0000000a,inset 0px 2px 4px 0px #0000000a;--ids-shadow-tooltip-base:0px 1px 1px -.5px #0000000a,0px 3px 3px -1.5px #0000000a,0px 6px 6px -3px #0000000a,0px 12px 12px -6px #0000000a;--ids-shadow-toolbar-base:0px 1px 0px 0px #0000000a,0px 0px 0px 1px #000c,inset 0px 0px 0px 1px #ffffff14,0px 1px 1px -.5px #0000000a,0px 3px 3px -1.5px #0000000a,0px 6px 6px -3px #0000000a,0px 12px 12px -6px #0000000a,0px 24px 24px -12px #0000000a}}html:where([data-color-scheme=dark]),:host([data-color-scheme=dark]),.🥝-root:where([data-kiwi-theme=dark]){--ids-color-border-shadow-base:oklch(100% none none/.08);--ids-color-border-shadow-strong:oklch(100% none none/.16)}:is(html:where([data-color-scheme=dark]),:host([data-color-scheme=dark]),.🥝-root:where([data-kiwi-theme=dark])){--ids-color-bg-mono-base:oklch(55.22% .018 253.99);--ids-color-bg-mono-muted:oklch(34.4% .011 264.42);--ids-color-bg-mono-faded:oklch(69.04% .014 255.53);--ids-color-bg-accent-base:oklch(54% .1 170.26);--ids-color-bg-accent-muted:oklch(33.76% .059 170.74);--ids-color-bg-accent-faded:oklch(67.95% .077 175.72);--ids-color-bg-info-base:oklch(55.68% .187 255.82);--ids-color-bg-info-muted:oklch(34.71% .108 254.29);--ids-color-bg-info-faded:oklch(68.84% .131 251.14);--ids-color-bg-positive-base:oklch(53.64% .173 140.57);--ids-color-bg-positive-muted:oklch(33.63% .106 139.87);--ids-color-bg-positive-faded:oklch(67.58% .14 138.68);--ids-color-bg-attention-base:oklch(55.63% .116 75.58);--ids-color-bg-attention-muted:oklch(34.69% .071 77.24);--ids-color-bg-attention-faded:oklch(69.31% .129 79.75);--ids-color-bg-critical-base:oklch(58.02% .221 19.39);--ids-color-bg-critical-muted:oklch(36.08% .133 17.52);--ids-color-bg-critical-faded:oklch(70.76% .147 9.28);--ids-color-bg-page-depth:oklch(22.52% .005 268.32);--ids-color-bg-page-base:oklch(24.37% .006 268.32);--ids-color-bg-page-zebra:oklch(0% none none/.04);--ids-color-bg-elevation-base:oklch(26.92% .008 268.32);--ids-color-bg-elevation-emphasis:oklch(14.4% .003 247.09);--ids-color-bg-elevation-control:oklch(24.37% .006 268.32);--ids-color-bg-elevation-level-1:oklch(29.76% .011 268.32);--ids-color-bg-elevation-overlay:oklch(18.15% .003 247.97);--ids-color-bg-elevation-level-2:oklch(32.63% .014 268.32);--ids-color-bg-elevation-scrollbar-surface:oklch(100% none none/.32);--ids-color-bg-elevation-scrollbar-canvas:oklch(0% none none/.48);--ids-color-bg-neutral-base:oklch(34.4% .011 264.42);--ids-color-bg-neutral-muted:oklch(32.63% .014 268.32);--ids-color-bg-neutral-faded:oklch(48.26% .017 254.7);--ids-color-bg-neutral-inverse:oklch(99.06% .002 247.84);--ids-color-bg-glow-base-hover-\%:4.0%;--ids-color-bg-glow-base-pressed-\%:8.0%;--ids-color-bg-glow-on-surface-accent-hover:oklch(54% .1 170.26/.12);--ids-color-bg-glow-on-surface-accent-pressed:oklch(54% .1 170.26/.16);--ids-color-bg-glow-on-surface-neutral-hover:oklch(100% none none/.04);--ids-color-bg-glow-on-surface-neutral-pressed:oklch(100% none none/.08);--ids-color-bg-glow-on-surface-critical-pressed:oklch(58.02% .221 19.39/.16);--ids-color-bg-glow-on-surface-critical-hover:oklch(58.02% .221 19.39/.12);--ids-color-bg-glow-on-surface-disabled:oklch(100% none none/.04);--ids-color-bg-glow-strong-pressed-\%:16.0%;--ids-color-bg-glow-strong-hover-\%:8.0%;--ids-color-icon-neutral-hover:oklch(99.06% .002 247.84);--ids-color-icon-neutral-base:oklch(75.82% .01 252.83);--ids-color-icon-neutral-secondary:oklch(62.09% .017 257.22);--ids-color-icon-neutral-tertiary:oklch(55.22% .018 253.99);--ids-color-icon-neutral-disabled:oklch(48.26% .017 254.7);--ids-color-icon-neutral-emphasis:oklch(100% none none);--ids-color-icon-neutral-muted:oklch(48.26% .017 254.7);--ids-color-icon-accent-base:oklch(67.95% .077 175.72);--ids-color-icon-accent-strong:oklch(87.59% .175 168.9);--ids-color-icon-accent-faded:oklch(75.2% .062 176.03);--ids-color-icon-info-base:oklch(68.84% .131 251.14);--ids-color-icon-info-faded:oklch(75.7% .101 250.13);--ids-color-icon-positive-base:oklch(67.58% .14 138.68);--ids-color-icon-positive-faded:oklch(74.8% .109 138.51);--ids-color-icon-attention-base:oklch(69.31% .129 79.75);--ids-color-icon-attention-faded:oklch(76.1% .109 83.1);--ids-color-icon-critical-base:oklch(70.76% .147 9.28);--ids-color-icon-critical-faded:oklch(77.16% .109 6.79);--ids-color-icon-mono-base:oklch(69.04% .014 255.53);--ids-color-icon-mono-faded:oklch(75.82% .01 252.83);--ids-color-icon-glow-base-hover-\%:8.0%;--ids-color-icon-glow-base-pressed-\%:12.0%;--ids-color-icon-glow-strong-hover-\%:16.0%;--ids-color-icon-glow-strong-pressed-\%:24.0%;--ids-color-border-mono-base:oklch(62.09% .017 257.22);--ids-color-border-mono-faded:oklch(79.56% .008 241.69);--ids-color-border-mono-muted:oklch(41.45% .013 256.75);--ids-color-border-accent-base:oklch(60.98% .092 173.18);--ids-color-border-accent-faded:oklch(82.26% .045 176.56);--ids-color-border-accent-muted:oklch(40.38% .071 171.73);--ids-color-border-accent-strong:oklch(87.59% .175 168.9);--ids-color-border-info-base:oklch(62.11% .161 252.88);--ids-color-border-info-faded:oklch(82.51% .071 249.98);--ids-color-border-info-muted:oklch(41.55% .136 255.23);--ids-color-border-positive-base:oklch(60.59% .164 139.21);--ids-color-border-positive-muted:oklch(40.36% .129 140.08);--ids-color-border-positive-faded:oklch(82.11% .078 138.1);--ids-color-border-attention-base:oklch(62.6% .132 74.4);--ids-color-border-attention-muted:oklch(41.7% .086 77.28);--ids-color-border-attention-faded:oklch(82.78% .08 84.58);--ids-color-border-critical-base:oklch(64.49% .185 12.51);--ids-color-border-critical-muted:oklch(43.46% .163 18.38);--ids-color-border-critical-faded:oklch(83.74% .075 6.15);--ids-color-border-glow-base-hover-\%:8.0%;--ids-color-border-glow-base-pressed-\%:12.0%;--ids-color-border-glow-base-default:oklch(100% none none/.08);--ids-color-border-glow-on-surface-faded:oklch(100% none none/.04);--ids-color-border-glow-on-surface-disabled:oklch(100% none none/.08);--ids-color-border-glow-strong-hover-\%:16.0%;--ids-color-border-glow-strong-pressed-\%:24.0%;--ids-color-border-glow-strong-default:oklch(100% none none/.16);--ids-color-border-neutral-base:oklch(41.45% .013 256.75);--ids-color-border-neutral-muted:oklch(32.63% .014 268.32);--ids-color-border-neutral-faded:oklch(62.09% .017 257.22);--ids-color-border-neutral-inverse:oklch(99.06% .002 247.84);--ids-color-border-neutral-disabled:oklch(48.26% .017 254.7);--ids-color-border-elevation-base:oklch(0% none none/.64);--ids-color-border-elevation-scrollbar-canvas:oklch(100% none none/.24);--ids-color-border-page-base:oklch(100% none none/.08);--ids-color-border-page-depth:oklch(100% none none/.08);--ids-color-text-mono-base:oklch(69.04% .014 255.53);--ids-color-text-mono-faded:oklch(75.82% .01 252.83);--ids-color-text-accent-base:oklch(67.95% .077 175.72);--ids-color-text-accent-faded:oklch(75.2% .062 176.03);--ids-color-text-accent-strong:oklch(87.59% .175 168.9);--ids-color-text-info-base:oklch(68.84% .131 251.14);--ids-color-text-info-faded:oklch(75.7% .101 250.13);--ids-color-text-positive-base:oklch(67.58% .14 138.68);--ids-color-text-positive-faded:oklch(74.8% .109 138.51);--ids-color-text-attention-base:oklch(69.31% .129 79.75);--ids-color-text-attention-faded:oklch(76.1% .109 83.1);--ids-color-text-critical-base:oklch(70.76% .147 9.28);--ids-color-text-critical-faded:oklch(77.16% .109 6.79);--ids-color-text-neutral-emphasis:oklch(100% none none);--ids-color-text-neutral-primary:oklch(99.06% .002 247.84);--ids-color-text-neutral-secondary:oklch(79.56% .008 241.69);--ids-color-text-neutral-tertiary:oklch(69.04% .014 255.53);--ids-color-text-neutral-disabled:oklch(48.26% .017 254.7);--ids-color-text-glow-base-hover-\%:8.0%;--ids-color-text-glow-base-pressed-\%:12.0%;--ids-color-text-glow-strong-hover-\%:16.0%;--ids-color-text-glow-strong-pressed-\%:24.0%;--ids-color-static-black:oklch(0% none none);--ids-color-static-white:oklch(100% none none);--ids-color-static-accent:oklch(54% .1 170.26);--ids-color-glow-hue:oklch(100% none none);--ids-shadow-surface-xs:0px 1px 0px 0px oklch(0% none none/.08),0px 0px 0px 1px oklch(0% none none/.16),inset 0px 0px 0px 1px oklch(100% none none/.08),0px 1px 1px -.5px oklch(0% none none/.16);--ids-shadow-surface-sm:0px 1px 0px 0px oklch(0% none none/.08),0px 0px 0px 1px oklch(0% none none/.16),inset 0px 0px 0px 1px oklch(100% none none/.08),0px 1px 1px -.5px oklch(0% none none/.16),0px 3px 3px -1.5px oklch(0% none none/.16);--ids-shadow-surface-md:0px 1px 0px 0px oklch(0% none none/.08),0px 0px 0px 1px oklch(0% none none/.16),0px 1px 1px -.5px oklch(0% none none/.16),inset 0px 0px 0px 1px oklch(100% none none/.08),0px 3px 3px -1.5px oklch(0% none none/.16),0px 6px 6px -3px oklch(0% none none/.16);--ids-shadow-surface-lg:0px 1px 0px 0px oklch(0% none none/.08),0px 0px 0px 1px oklch(0% none none/.16),inset 0px 0px 0px 1px oklch(100% none none/.08),0px 1px 1px -.5px oklch(0% none none/.16),0px 3px 3px -1.5px oklch(0% none none/.16),0px 6px 6px -3px oklch(0% none none/.16),0px 12px 12px -6px oklch(0% none none/.16);--ids-shadow-surface-xl:0px 1px 0px 0px oklch(0% none none/.08),0px 0px 0px 1px oklch(0% none none/.16),inset 0px 0px 0px 1px oklch(100% none none/.08),0px 1px 1px -.5px oklch(0% none none/.16),0px 3px 3px -1.5px oklch(0% none none/.16),0px 6px 6px -3px oklch(0% none none/.16),0px 12px 12px -6px oklch(0% none none/.16),0px 24px 24px -12px oklch(0% none none/.16);--ids-shadow-button-base-drop:0px 1px 1px -.5px oklch(0% none none/.16),0px 3px 3px -1.5px oklch(0% none none/.16);--ids-shadow-button-base-inset:inset 0px -1px 0px 0px oklch(0% none none/.08);--ids-shadow-input-base:inset 0px 1px 2px 0px oklch(0% none none/.16),inset 0px 2px 4px 0px oklch(0% none none/.16);--ids-shadow-tooltip-base:0px 1px 1px -.5px oklch(0% none none/.16),0px 3px 3px -1.5px oklch(0% none none/.16),0px 6px 6px -3px oklch(0% none none/.16),0px 12px 12px -6px oklch(0% none none/.16);--ids-shadow-toolbar-base:0px 1px 0px 0px oklch(0% none none/.08),0px 0px 0px 1px oklch(0% none none/.8),inset 0px 0px 0px 1px oklch(100% none none/.08),0px 1px 1px -.5px oklch(0% none none/.16),0px 3px 3px -1.5px oklch(0% none none/.16),0px 6px 6px -3px oklch(0% none none/.16),0px 12px 12px -6px oklch(0% none none/.16),0px 24px 24px -12px oklch(0% none none/.16)}@supports not (color:oklch(0% 0 0)){:is(html:where([data-color-scheme=dark]),:host([data-color-scheme=dark]),.🥝-root:where([data-kiwi-theme=dark])){--ids-color-bg-mono-base:#6b737d;--ids-color-bg-mono-muted:#36393f;--ids-color-bg-mono-faded:#969ca4;--ids-color-bg-accent-base:#188166;--ids-color-bg-accent-muted:#0d4133;--ids-color-bg-accent-faded:#61a896;--ids-color-bg-info-base:#0470dd;--ids-color-bg-info-muted:#033970;--ids-color-bg-info-faded:#589fe9;--ids-color-bg-positive-base:#228404;--ids-color-bg-positive-muted:#114302;--ids-color-bg-positive-faded:#68ab53;--ids-color-bg-attention-base:#9a6804;--ids-color-bg-attention-muted:#4e3402;--ids-color-bg-attention-faded:#c6922c;--ids-color-bg-critical-base:#df1c41;--ids-color-bg-critical-muted:#730e22;--ids-color-bg-critical-faded:#ec768d;--ids-color-bg-page-depth:#1b1c1e;--ids-color-bg-page-base:#1f2023;--ids-color-bg-page-zebra:#0000000a;--ids-color-bg-elevation-base:#24262a;--ids-color-bg-elevation-emphasis:#090a0b;--ids-color-bg-elevation-control:#1f2023;--ids-color-bg-elevation-level-1:#2b2d33;--ids-color-bg-elevation-overlay:#111213;--ids-color-bg-elevation-level-2:#31343c;--ids-color-bg-elevation-scrollbar-surface:#ffffff52;--ids-color-bg-elevation-scrollbar-canvas:#0000007a;--ids-color-bg-neutral-base:#36393f;--ids-color-bg-neutral-muted:#31343c;--ids-color-bg-neutral-faded:#585f68;--ids-color-bg-neutral-inverse:#fbfcfd;--ids-color-bg-glow-base-hover-\%:4.0%;--ids-color-bg-glow-base-pressed-\%:8.0%;--ids-color-bg-glow-on-surface-accent-hover:#1881661f;--ids-color-bg-glow-on-surface-accent-pressed:#18816629;--ids-color-bg-glow-on-surface-neutral-hover:#ffffff0a;--ids-color-bg-glow-on-surface-neutral-pressed:#ffffff14;--ids-color-bg-glow-on-surface-critical-pressed:#df1c4129;--ids-color-bg-glow-on-surface-critical-hover:#df1c411f;--ids-color-bg-glow-on-surface-disabled:#ffffff0a;--ids-color-bg-glow-strong-pressed-\%:16.0%;--ids-color-bg-glow-strong-hover-\%:8.0%;--ids-color-icon-neutral-hover:#fbfcfd;--ids-color-icon-neutral-base:#acb1b7;--ids-color-icon-neutral-secondary:#808791;--ids-color-icon-neutral-tertiary:#6b737d;--ids-color-icon-neutral-disabled:#585f68;--ids-color-icon-neutral-emphasis:#fff;--ids-color-icon-neutral-muted:#585f68;--ids-color-icon-accent-base:#61a896;--ids-color-icon-accent-strong:#06fac2;--ids-color-icon-accent-faded:#84bcad;--ids-color-icon-info-base:#589fe9;--ids-color-icon-info-faded:#7eb5ee;--ids-color-icon-positive-base:#68ab53;--ids-color-icon-positive-faded:#8abe7a;--ids-color-icon-attention-base:#c6922c;--ids-color-icon-attention-faded:#d3ab5b;--ids-color-icon-critical-base:#ec768d;--ids-color-icon-critical-faded:#f097a9;--ids-color-icon-mono-base:#969ca4;--ids-color-icon-mono-faded:#acb1b7;--ids-color-icon-glow-base-hover-\%:8.0%;--ids-color-icon-glow-base-pressed-\%:12.0%;--ids-color-icon-glow-strong-hover-\%:16.0%;--ids-color-icon-glow-strong-pressed-\%:24.0%;--ids-color-border-mono-base:#808791;--ids-color-border-mono-faded:#b8bdc1;--ids-color-border-mono-muted:#474c53;--ids-color-border-accent-base:#3d957e;--ids-color-border-accent-faded:#a7cfc4;--ids-color-border-accent-muted:#125544;--ids-color-border-accent-strong:#06fac2;--ids-color-border-info-base:#3088e4;--ids-color-border-info-faded:#a3caf3;--ids-color-border-info-muted:#024a93;--ids-color-border-positive-base:#46982c;--ids-color-border-positive-muted:#175801;--ids-color-border-positive-faded:#acd1a0;--ids-color-border-attention-base:#b67a02;--ids-color-border-attention-muted:#664502;--ids-color-border-attention-faded:#dfc38a;--ids-color-border-critical-base:#e7516e;--ids-color-border-critical-muted:#96122c;--ids-color-border-critical-faded:#f5b6c2;--ids-color-border-glow-base-hover-\%:8.0%;--ids-color-border-glow-base-pressed-\%:12.0%;--ids-color-border-glow-base-default:#ffffff14;--ids-color-border-glow-on-surface-faded:#ffffff0a;--ids-color-border-glow-on-surface-disabled:#ffffff14;--ids-color-border-glow-strong-hover-\%:16.0%;--ids-color-border-glow-strong-pressed-\%:24.0%;--ids-color-border-glow-strong-default:#ffffff29;--ids-color-border-neutral-base:#474c53;--ids-color-border-neutral-muted:#31343c;--ids-color-border-neutral-faded:#808791;--ids-color-border-neutral-inverse:#fbfcfd;--ids-color-border-neutral-disabled:#585f68;--ids-color-border-elevation-base:#000000a3;--ids-color-border-elevation-scrollbar-canvas:#ffffff3d;--ids-color-border-page-base:#ffffff14;--ids-color-border-page-depth:#ffffff14;--ids-color-text-mono-base:#969ca4;--ids-color-text-mono-faded:#acb1b7;--ids-color-text-accent-base:#61a896;--ids-color-text-accent-faded:#84bcad;--ids-color-text-accent-strong:#06fac2;--ids-color-text-info-base:#589fe9;--ids-color-text-info-faded:#7eb5ee;--ids-color-text-positive-base:#68ab53;--ids-color-text-positive-faded:#8abe7a;--ids-color-text-attention-base:#c6922c;--ids-color-text-attention-faded:#d3ab5b;--ids-color-text-critical-base:#ec768d;--ids-color-text-critical-faded:#f097a9;--ids-color-text-neutral-emphasis:#fff;--ids-color-text-neutral-primary:#fbfcfd;--ids-color-text-neutral-secondary:#b8bdc1;--ids-color-text-neutral-tertiary:#969ca4;--ids-color-text-neutral-disabled:#585f68;--ids-color-text-glow-base-hover-\%:8.0%;--ids-color-text-glow-base-pressed-\%:12.0%;--ids-color-text-glow-strong-hover-\%:16.0%;--ids-color-text-glow-strong-pressed-\%:24.0%;--ids-color-static-black:#000;--ids-color-static-white:#fff;--ids-color-static-accent:#188166;--ids-color-glow-hue:#fff;--ids-shadow-surface-xs:0px 1px 0px 0px #00000014,0px 0px 0px 1px #00000029,inset 0px 0px 0px 1px #ffffff14,0px 1px 1px -.5px #00000029;--ids-shadow-surface-sm:0px 1px 0px 0px #00000014,0px 0px 0px 1px #00000029,inset 0px 0px 0px 1px #ffffff14,0px 1px 1px -.5px #00000029,0px 3px 3px -1.5px #00000029;--ids-shadow-surface-md:0px 1px 0px 0px #00000014,0px 0px 0px 1px #00000029,0px 1px 1px -.5px #00000029,inset 0px 0px 0px 1px #ffffff14,0px 3px 3px -1.5px #00000029,0px 6px 6px -3px #00000029;--ids-shadow-surface-lg:0px 1px 0px 0px #00000014,0px 0px 0px 1px #00000029,inset 0px 0px 0px 1px #ffffff14,0px 1px 1px -.5px #00000029,0px 3px 3px -1.5px #00000029,0px 6px 6px -3px #00000029,0px 12px 12px -6px #00000029;--ids-shadow-surface-xl:0px 1px 0px 0px #00000014,0px 0px 0px 1px #00000029,inset 0px 0px 0px 1px #ffffff14,0px 1px 1px -.5px #00000029,0px 3px 3px -1.5px #00000029,0px 6px 6px -3px #00000029,0px 12px 12px -6px #00000029,0px 24px 24px -12px #00000029;--ids-shadow-button-base-drop:0px 1px 1px -.5px #00000029,0px 3px 3px -1.5px #00000029;--ids-shadow-button-base-inset:inset 0px -1px 0px 0px #00000014;--ids-shadow-input-base:inset 0px 1px 2px 0px #00000029,inset 0px 2px 4px 0px #00000029;--ids-shadow-tooltip-base:0px 1px 1px -.5px #00000029,0px 3px 3px -1.5px #00000029,0px 6px 6px -3px #00000029,0px 12px 12px -6px #00000029;--ids-shadow-toolbar-base:0px 1px 0px 0px #00000014,0px 0px 0px 1px #000c,inset 0px 0px 0px 1px #ffffff14,0px 1px 1px -.5px #00000029,0px 3px 3px -1.5px #00000029,0px 6px 6px -3px #00000029,0px 12px 12px -6px #00000029,0px 24px 24px -12px #00000029}}:root,:host{--ids-font-family-sans:"InterVariable","Noto Sans","Open Sans",sans-serif;--ids-font-family-mono:"Geist Mono","Noto Sans Mono",ui-monospace,"Segoe UI Mono",Consolas,monospace}:is(:root,:host){--ids-font-size-8:.5rem;--ids-font-size-10:.625rem;--ids-font-size-11:.6875rem;--ids-font-size-12:.75rem;--ids-font-size-14:.875rem;--ids-font-size-16:1rem;--ids-font-size-20:1.25rem;--ids-font-size-24:1.5rem;--ids-font-size-28:1.75rem;--ids-font-size-32:2rem;--ids-font-size-40:2.5rem;--ids-font-size-48:3rem}.🥝-root:where([data-kiwi-density=dense]){font-size:var(--ids-font-size-12);letter-spacing:0;line-height:1.3333}html{background-color:var(--ids-color-bg-page-base)}body{font-size:var(--ids-font-size-14);letter-spacing:0;line-height:1.4286}:is(body,.🥝-root){font-family:var(--ids-font-family-sans);color:var(--ids-color-text-neutral-primary)}:focus-visible{outline:2px solid var(--ids-color-border-accent-strong);outline-offset:1px}}`;
3
3
 
4
4
  // src/foundations/styles.css.ts
5
5
  var styles_css_default = styles_default;
package/dist/bricks/Avatar.d.ts ADDED
@@ -0,0 +1,47 @@
1
+ import { type BaseProps } from "./~utils.js";
2
+ interface AvatarProps extends BaseProps<"span"> {
3
+ /**
4
+ * The size of the avatar.
5
+ * @default "medium"
6
+ */
7
+ size?: "small" | "medium" | "large" | "xlarge";
8
+ /**
9
+ * Initials that gets displayed in the absence of an image.
10
+ */
11
+ initials?: string;
12
+ /**
13
+ * Alternative text describing the avatar, typically the user's or organization's full name.
14
+ *
15
+ * When this prop is passed, the avatar gets rendered as `role="img"` and labelled
16
+ * using the provided text.
17
+ *
18
+ * This prop is not required if the avatar is purely decorative. By default, the avatar
19
+ * will be hidden from the accessibility tree.
20
+ */
21
+ alt?: string;
22
+ /**
23
+ * Image to be displayed. Can be `<img>` or `<svg>` or anything else.
24
+ */
25
+ image?: React.JSX.Element;
26
+ }
27
+ /**
28
+ * An avatar to represent a user or organization.
29
+ *
30
+ * By default, this component assumes that the avatar is decorative, so it adds `aria-hidden` by default.
31
+ * ```tsx
32
+ * <Avatar initials="JD" />
33
+ * ```
34
+ *
35
+ * If the avatar is semantically meaningful, the `alt` prop can be used to provide alternative text.
36
+ * ```tsx
37
+ * <Avatar initials="JD" alt="John Doe" />
38
+ * ```
39
+ *
40
+ * Image & size examples:
41
+ * ```tsx
42
+ * <Avatar initials="JD" alt="John Doe" size="xlarge" image={<img src="…" alt="">} />
43
+ * <Avatar initials="JD" alt="John Doe" size="small" image={<Icon href="…">} />
44
+ * ```
45
+ */
46
+ export declare const Avatar: import("react").ForwardRefExoticComponent<AvatarProps & import("react").RefAttributes<HTMLElement | HTMLSpanElement>>;
47
+ export {};
package/dist/bricks/Avatar.js ADDED
@@ -0,0 +1,23 @@
1
+ import { jsx } from "react/jsx-runtime";
2
+ import cx from "classnames";
3
+ import * as Ariakit from "@ariakit/react";
4
+ import { forwardRef } from "./~utils.js";
5
+ const Avatar = forwardRef((props, forwardedRef) => {
6
+ const { size = "medium", initials, alt, image, children, ...rest } = props;
7
+ const isDecorative = !alt;
8
+ return /* @__PURE__ */ jsx(
9
+ Ariakit.Role.span,
10
+ {
11
+ role: isDecorative ? void 0 : "img",
12
+ "aria-label": isDecorative ? void 0 : alt,
13
+ ...rest,
14
+ "data-kiwi-size": size,
15
+ className: cx("\u{1F95D}-avatar", props.className),
16
+ ref: forwardedRef,
17
+ children: image ?? /* @__PURE__ */ jsx("abbr", { className: "\u{1F95D}-avatar-initials", "aria-hidden": "true", children: initials?.substring(0, 1) })
18
+ }
19
+ );
20
+ });
21
+ export {
22
+ Avatar
23
+ };
package/dist/bricks/Badge.d.ts ADDED
@@ -0,0 +1,28 @@
1
+ import { type BaseProps } from "./~utils.js";
2
+ interface BadgeProps extends Omit<BaseProps<"span">, "children"> {
3
+ /**
4
+ * The label displayed inside the badge.
5
+ */
6
+ label: string;
7
+ /**
8
+ * The tone of the badge.
9
+ * @default "neutral"
10
+ */
11
+ tone?: "neutral" | "info" | "positive" | "attention" | "critical";
12
+ /**
13
+ * The variant style of the badge.
14
+ * @default "solid"
15
+ */
16
+ variant?: "solid" | "muted" | "outline";
17
+ }
18
+ /**
19
+ * A badge component, typically used to designate the status of an item.
20
+ *
21
+ * Example:
22
+ * ```tsx
23
+ * <Badge label="Value" />
24
+ * <Badge label="Value" tone="info" variant="outline" />
25
+ * ```
26
+ */
27
+ export declare const Badge: import("react").ForwardRefExoticComponent<BadgeProps & import("react").RefAttributes<HTMLElement | HTMLSpanElement>>;
28
+ export {};
package/dist/bricks/Badge.js ADDED
@@ -0,0 +1,21 @@
1
+ import { jsx } from "react/jsx-runtime";
2
+ import cx from "classnames";
3
+ import * as Ariakit from "@ariakit/react";
4
+ import { forwardRef } from "./~utils.js";
5
+ const Badge = forwardRef((props, forwardedRef) => {
6
+ const { tone = "neutral", variant = "solid", label, ...rest } = props;
7
+ return /* @__PURE__ */ jsx(
8
+ Ariakit.Role.span,
9
+ {
10
+ ...rest,
11
+ "data-kiwi-tone": tone,
12
+ "data-kiwi-variant": variant,
13
+ className: cx("\u{1F95D}-badge", props.className),
14
+ ref: forwardedRef,
15
+ children: label
16
+ }
17
+ );
18
+ });
19
+ export {
20
+ Badge
21
+ };
package/dist/bricks/Checkbox.js CHANGED
@@ -1,12 +1,11 @@
1
1
  import { jsx } from "react/jsx-runtime";
2
2
  import cx from "classnames";
3
3
  import * as Ariakit from "@ariakit/react";
4
- import { FieldControl, useFieldDescribedBy } from "./Field.js";
4
+ import { FieldControl } from "./Field.js";
5
5
  import { forwardRef } from "./~utils.js";
6
6
  const Checkbox = forwardRef(
7
7
  (props, forwardedRef) => {
8
8
  const { id, ...rest } = props;
9
- const describedBy = useFieldDescribedBy(props["aria-describedby"]);
10
9
  return /* @__PURE__ */ jsx(
11
10
  FieldControl,
12
11
  {
@@ -18,7 +17,6 @@ const Checkbox = forwardRef(
18
17
  accessibleWhenDisabled: true,
19
18
  ...rest,
20
19
  className: cx("\u{1F95D}-checkbox", props.className),
21
- "aria-describedby": describedBy,
22
20
  ref: forwardedRef
23
21
  }
24
22
  )
package/dist/bricks/Description.d.ts CHANGED
@@ -1,4 +1,3 @@
1
- import * as React from "react";
2
1
  import { type BaseProps } from "./~utils.js";
3
2
  interface DescriptionProps extends BaseProps {
4
3
  /**
@@ -16,5 +15,5 @@ interface DescriptionProps extends BaseProps {
16
15
  * using `aria-describedby` on said control or use the `<Field>` component
17
16
  * (WIP).
18
17
  */
19
- export declare const Description: React.ForwardRefExoticComponent<DescriptionProps & React.RefAttributes<HTMLElement | HTMLDivElement>>;
18
+ export declare const Description: import("react").ForwardRefExoticComponent<DescriptionProps & import("react").RefAttributes<HTMLElement | HTMLDivElement>>;
20
19
  export {};
package/dist/bricks/Description.js CHANGED
@@ -1,23 +1,25 @@
1
1
  import { jsx } from "react/jsx-runtime";
2
- import * as React from "react";
3
2
  import { forwardRef } from "./~utils.js";
4
3
  import cx from "classnames";
5
4
  import { Text } from "./Text.js";
6
- import { useFieldRegisterDescribedBy } from "./Field.js";
5
+ import { FieldDescription } from "./Field.js";
7
6
  const Description = forwardRef(
8
7
  (props, forwardedRef) => {
9
- const generatedId = React.useId();
10
- const { id = generatedId, tone, ...rest } = props;
11
- useFieldRegisterDescribedBy(id);
8
+ const { id, tone, ...rest } = props;
12
9
  return /* @__PURE__ */ jsx(
13
- Text,
10
+ FieldDescription,
14
11
  {
15
- ...rest,
16
12
  id,
17
- variant: "caption-md",
18
- "data-kiwi-tone": tone ?? "neutral",
19
- className: cx("\u{1F95D}-description", props.className),
20
- ref: forwardedRef
13
+ render: /* @__PURE__ */ jsx(
14
+ Text,
15
+ {
16
+ ...rest,
17
+ variant: "caption-md",
18
+ "data-kiwi-tone": tone ?? "neutral",
19
+ className: cx("\u{1F95D}-description", props.className),
20
+ ref: forwardedRef
21
+ }
22
+ )
21
23
  }
22
24
  );
23
25
  }
package/dist/bricks/DropdownMenu.js CHANGED
@@ -90,7 +90,7 @@ const DropdownMenuItem = forwardRef(
90
90
  ref: forwardedRef,
91
91
  children: [
92
92
  /* @__PURE__ */ jsx(ListItem.Content, { children: props.children }),
93
- hasShortcuts && /* @__PURE__ */ jsx("span", { className: "\u{1F95D}-dropdown-menu-item-shortcuts", children: shortcutKeys.map((key, index) => /* @__PURE__ */ jsx(Kbd, { variant: "ghost", children: key }, `${key + index}`)) })
93
+ hasShortcuts && /* @__PURE__ */ jsx(ListItem.Decoration, { className: "\u{1F95D}-dropdown-menu-item-shortcuts", children: shortcutKeys.map((key, index) => /* @__PURE__ */ jsx(Kbd, { variant: "ghost", children: key }, `${key + index}`)) })
94
94
  ]
95
95
  }
96
96
  );
@@ -108,7 +108,12 @@ const DropdownMenuCheckboxItem = forwardRef((props, forwardedRef) => {
108
108
  ref: forwardedRef,
109
109
  children: [
110
110
  /* @__PURE__ */ jsx(ListItem.Content, { children: props.children }),
111
- /* @__PURE__ */ jsx(Checkmark, { className: "\u{1F95D}-dropdown-menu-checkmark" })
111
+ /* @__PURE__ */ jsx(
112
+ ListItem.Decoration,
113
+ {
114
+ render: /* @__PURE__ */ jsx(Checkmark, { className: "\u{1F95D}-dropdown-menu-checkmark" })
115
+ }
116
+ )
112
117
  ]
113
118
  }
114
119
  );