@krollins/blueprint 0.1.12 → 0.1.14

package/dist/components/drawer.js

@@ -0,0 +1,568 @@
+import { css as b, LitElement as u, nothing as l, html as n } from "lit";
+import { property as a, customElement as f } from "lit/decorators.js";
+import { b as d } from "../shared/boolean-converter-XDGfS9LC.js";
+const w = b`
+  /* Base styles */
+  :host {
+    display: contents;
+  }
+
+  .drawer {
+    font-family: var(--bp-font-family);
+    font-size: var(--bp-font-size-base);
+    color: var(--bp-color-text);
+  }
+
+  /* Overlay mode */
+  .drawer--overlay {
+    position: fixed;
+    inset: 0;
+    z-index: var(--bp-z-modal);
+    pointer-events: none;
+  }
+
+  .drawer--overlay.drawer--open {
+    pointer-events: auto;
+  }
+
+  /* Backdrop */
+  .backdrop {
+    position: absolute;
+    inset: 0;
+    background-color: oklch(from var(--bp-color-text) l c h / 0.5);
+    opacity: 0;
+    transition: opacity var(--bp-transition-base) ease-out;
+  }
+
+  .backdrop--visible {
+    opacity: 1;
+  }
+
+  /* Panel base */
+  .panel {
+    position: absolute;
+    display: flex;
+    flex-direction: column;
+    background-color: var(--bp-color-surface);
+    box-shadow: var(--bp-shadow-xl);
+    transition: transform var(--bp-transition-base) ease-out;
+    overflow: hidden;
+  }
+
+  .drawer--overlay .panel:focus {
+    outline: none;
+  }
+
+  /* Horizontal drawers (left/right) */
+  .drawer--horizontal .panel {
+    top: 0;
+    bottom: 0;
+    height: 100%;
+  }
+
+  .drawer--left .panel {
+    left: 0;
+    transform: translateX(-100%);
+  }
+
+  .drawer--left .panel--open {
+    transform: translateX(0);
+  }
+
+  .drawer--right .panel {
+    right: 0;
+    transform: translateX(100%);
+  }
+
+  .drawer--right .panel--open {
+    transform: translateX(0);
+  }
+
+  /* Vertical drawers (top/bottom) */
+  .drawer--vertical .panel {
+    left: 0;
+    right: 0;
+    width: 100%;
+  }
+
+  .drawer--top .panel {
+    top: 0;
+    transform: translateY(-100%);
+  }
+
+  .drawer--top .panel--open {
+    transform: translateY(0);
+  }
+
+  .drawer--bottom .panel {
+    bottom: 0;
+    transform: translateY(100%);
+  }
+
+  .drawer--bottom .panel--open {
+    transform: translateY(0);
+  }
+
+  /* Sizes - horizontal (width) */
+  .drawer--horizontal.drawer--sm .panel {
+    width: calc(var(--bp-spacing-24) * 3);
+  }
+
+  .drawer--horizontal.drawer--md .panel {
+    width: calc(var(--bp-spacing-24) * 4 + var(--bp-spacing-16));
+  }
+
+  .drawer--horizontal.drawer--lg .panel {
+    width: var(--bp-breakpoint-sm);
+  }
+
+  .drawer--horizontal.drawer--full .panel {
+    width: 100%;
+  }
+
+  /* Sizes - vertical (height) */
+  .drawer--vertical.drawer--sm .panel {
+    height: calc(var(--bp-spacing-24) * 2);
+  }
+
+  .drawer--vertical.drawer--md .panel {
+    height: calc(var(--bp-spacing-24) * 3 + var(--bp-spacing-8));
+  }
+
+  .drawer--vertical.drawer--lg .panel {
+    height: calc(var(--bp-spacing-24) * 5);
+  }
+
+  .drawer--vertical.drawer--full .panel {
+    height: 100%;
+  }
+
+  /* Header */
+  .header {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: var(--bp-spacing-4);
+    padding: var(--bp-spacing-4) var(--bp-spacing-5);
+    border-bottom: var(--bp-border-width) solid var(--bp-color-border);
+    flex-shrink: 0;
+  }
+
+  .header--empty {
+    display: none;
+  }
+
+  .header ::slotted(*) {
+    margin: 0;
+    font-size: var(--bp-font-size-lg);
+    font-weight: var(--bp-font-weight-semibold);
+  }
+
+  /* Body */
+  .body {
+    flex: 1;
+    overflow-y: auto;
+    padding: var(--bp-spacing-5);
+  }
+
+  /* Footer */
+  .footer {
+    display: flex;
+    align-items: center;
+    gap: var(--bp-spacing-4);
+    padding: var(--bp-spacing-4) var(--bp-spacing-5);
+    border-top: var(--bp-border-width) solid var(--bp-color-border);
+    flex-shrink: 0;
+  }
+
+  /* Close button */
+  .close-button {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 44px;
+    height: 44px;
+    padding: 0;
+    margin-left: auto;
+    background: transparent;
+    border: none;
+    border-radius: var(--bp-border-radius-sm);
+    color: var(--bp-color-text-muted);
+    cursor: pointer;
+    transition:
+      background-color var(--bp-transition-fast),
+      color var(--bp-transition-fast),
+      transform var(--bp-transition-fast);
+  }
+
+  .close-button:hover {
+    background-color: var(--bp-color-surface-subdued);
+    color: var(--bp-color-text);
+  }
+
+  .close-button:active {
+    background-color: var(--bp-color-surface-pressed);
+    transform: translateY(1px);
+  }
+
+  .close-button:focus {
+    outline: var(--bp-focus-width) var(--bp-focus-style) var(--bp-color-focus);
+    outline-offset: var(--bp-focus-offset);
+  }
+
+  .close-button:focus:not(:focus-visible) {
+    outline: none;
+  }
+
+  .close-button:focus-visible {
+    outline: var(--bp-focus-width) var(--bp-focus-style) var(--bp-color-focus);
+    outline-offset: var(--bp-focus-offset);
+  }
+
+  /* Inline mode - static sidebar */
+  .drawer--inline {
+    display: block;
+  }
+
+  .drawer--inline .panel {
+    position: relative;
+    transform: none;
+    box-shadow: none;
+    border: var(--bp-border-width) solid var(--bp-color-border);
+    border-radius: var(--bp-border-radius-md);
+  }
+
+  .drawer--inline.drawer--horizontal {
+    height: 100%;
+  }
+
+  .drawer--inline.drawer--vertical {
+    width: 100%;
+  }
+
+  /* Inline sizes - horizontal */
+  .drawer--inline.drawer--horizontal.drawer--small {
+    width: calc(var(--bp-spacing-24) * 3);
+  }
+
+  .drawer--inline.drawer--horizontal.drawer--medium {
+    width: calc(var(--bp-spacing-24) * 4 + var(--bp-spacing-16));
+  }
+
+  .drawer--inline.drawer--horizontal.drawer--large {
+    width: var(--bp-breakpoint-sm);
+  }
+
+  .drawer--inline.drawer--horizontal.drawer--full {
+    width: 100%;
+  }
+
+  /* Inline sizes - vertical */
+  .drawer--inline.drawer--vertical.drawer--small .panel {
+    height: calc(var(--bp-spacing-24) * 2);
+  }
+
+  .drawer--inline.drawer--vertical.drawer--medium .panel {
+    height: calc(var(--bp-spacing-24) * 3 + var(--bp-spacing-8));
+  }
+
+  .drawer--inline.drawer--vertical.drawer--large .panel {
+    height: calc(var(--bp-spacing-24) * 5);
+  }
+
+  .drawer--inline.drawer--vertical.drawer--full .panel {
+    height: auto;
+  }
+
+  /* Border positioning for inline drawers */
+  .drawer--inline.drawer--left .panel {
+    border-left: none;
+    border-top-left-radius: 0;
+    border-bottom-left-radius: 0;
+  }
+
+  .drawer--inline.drawer--right .panel {
+    border-right: none;
+    border-top-right-radius: 0;
+    border-bottom-right-radius: 0;
+  }
+
+  .drawer--inline.drawer--top .panel {
+    border-top: none;
+    border-top-left-radius: 0;
+    border-top-right-radius: 0;
+  }
+
+  .drawer--inline.drawer--bottom .panel {
+    border-bottom: none;
+    border-bottom-left-radius: 0;
+    border-bottom-right-radius: 0;
+  }
+
+  /* Reduced motion */
+  @media (prefers-reduced-motion: reduce) {
+    .panel {
+      transition: none;
+    }
+
+    .backdrop {
+      transition: none;
+    }
+  }
+`;
+var v = Object.defineProperty, m = Object.getOwnPropertyDescriptor, o = (e, t, p, i) => {
+  for (var s = i > 1 ? void 0 : i ? m(t, p) : t, c = e.length - 1, h; c >= 0; c--)
+    (h = e[c]) && (s = (i ? h(t, p, s) : h(s)) || s);
+  return i && s && v(t, p, s), s;
+};
+let r = class extends u {
+  constructor() {
+    super(), this.hasHeader = !1, this.hasFooter = !1, this.previouslyFocusedElement = null, this.handleKeyDown = (e) => {
+      e.key === "Escape" && this.closeOnEscape && this.open && !this.inline && (e.preventDefault(), this.hide("escape"));
+    }, this.handleBackdropClick = () => {
+      this.closeOnBackdrop && this.hide("backdrop");
+    }, this.handleCloseClick = () => {
+      this.hide("close-button");
+    }, this.handleHeaderSlotChange = (e) => {
+      const t = e.target;
+      this.hasHeader = t.assignedNodes({ flatten: !0 }).length > 0;
+    }, this.handleFooterSlotChange = (e) => {
+      const t = e.target;
+      this.hasFooter = t.assignedNodes({ flatten: !0 }).length > 0;
+    }, this.open = !1, this.placement = "left", this.size = "md", this.showClose = !0, this.closeOnBackdrop = !0, this.closeOnEscape = !0, this.showBackdrop = !0, this.label = "", this.inline = !1;
+  }
+  connectedCallback() {
+    super.connectedCallback(), this.addEventListener("keydown", this.handleKeyDown);
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback(), this.removeEventListener("keydown", this.handleKeyDown);
+  }
+  /**
+   * Open the drawer.
+   * Sets open property to true and manages focus/scroll behavior.
+   *
+   * @fires bp-open - Emitted when the drawer opens
+   * @fires bp-after-open - Emitted after open animation completes
+   */
+  show() {
+    this.open || (this.open = !0);
+  }
+  /**
+   * Close the drawer.
+   * Sets open property to false if bp-close event is not prevented.
+   *
+   * @param reason - The reason the drawer was closed
+   * @fires bp-close - Emitted when the drawer closes (cancelable)
+   * @fires bp-after-close - Emitted after close animation completes
+   */
+  hide(e = "api") {
+    if (!this.open) return;
+    const t = new CustomEvent("bp-close", {
+      detail: { reason: e },
+      bubbles: !0,
+      composed: !0,
+      cancelable: !0
+    });
+    this.dispatchEvent(t), t.defaultPrevented || (this.open = !1);
+  }
+  /**
+   * Toggle the drawer open/closed state.
+   * Calls hide() if open, show() if closed.
+   */
+  toggle() {
+    this.open ? this.hide("api") : this.show();
+  }
+  updated(e) {
+    e.has("open") && (this.open ? this.handleOpen() : this.handleClose());
+  }
+  handleOpen() {
+    this.inline || (this.previouslyFocusedElement = document.activeElement, document.body.style.overflow = "hidden"), this.dispatchEvent(
+      new CustomEvent("bp-open", {
+        bubbles: !0,
+        composed: !0
+      })
+    ), this.updateComplete.then(() => {
+      this.shadowRoot?.querySelector(".panel")?.focus(), this.dispatchEvent(
+        new CustomEvent("bp-after-open", {
+          bubbles: !0,
+          composed: !0
+        })
+      );
+    });
+  }
+  handleClose() {
+    this.inline || (document.body.style.overflow = "", this.previouslyFocusedElement && (this.previouslyFocusedElement.focus(), this.previouslyFocusedElement = null)), this.updateComplete.then(() => {
+      this.dispatchEvent(
+        new CustomEvent("bp-after-close", {
+          bubbles: !0,
+          composed: !0
+        })
+      );
+    });
+  }
+  render() {
+    const e = this.placement === "left" || this.placement === "right";
+    return this.inline ? n`
+        <aside
+          class="drawer drawer--inline drawer--${this.placement} drawer--${this.size} ${e ? "drawer--horizontal" : "drawer--vertical"}"
+          part="drawer"
+          role="complementary"
+          aria-label=${this.label || l}
+        >
+          <div class="panel" part="panel">
+            ${this.hasHeader || this.showClose ? n`
+                  <header class="header" part="header">
+                    <slot
+                      name="header"
+                      @slotchange=${this.handleHeaderSlotChange}
+                    ></slot>
+                  </header>
+                ` : n`<slot
+                  name="header"
+                  @slotchange=${this.handleHeaderSlotChange}
+                ></slot>`}
+            <div class="body" part="body">
+              <slot></slot>
+            </div>
+            ${this.hasFooter ? n`
+                  <footer class="footer" part="footer">
+                    <slot
+                      name="footer"
+                      @slotchange=${this.handleFooterSlotChange}
+                    ></slot>
+                  </footer>
+                ` : n`<slot
+                  name="footer"
+                  @slotchange=${this.handleFooterSlotChange}
+                ></slot>`}
+          </div>
+        </aside>
+      ` : n`
+      <div
+        class="drawer drawer--overlay drawer--${this.placement} drawer--${this.size} ${e ? "drawer--horizontal" : "drawer--vertical"} ${this.open ? "drawer--open" : ""}"
+        part="drawer"
+      >
+        ${this.showBackdrop ? n`
+              <div
+                class="backdrop ${this.open ? "backdrop--visible" : ""}"
+                part="backdrop"
+                @click=${this.handleBackdropClick}
+                aria-hidden="true"
+              ></div>
+            ` : l}
+        <aside
+          class="panel ${this.open ? "panel--open" : ""}"
+          part="panel"
+          role="dialog"
+          aria-modal="true"
+          aria-label=${this.label || l}
+          tabindex="-1"
+        >
+          <header
+            class="header ${this.hasHeader || this.showClose ? "" : "header--empty"}"
+            part="header"
+          >
+            <slot
+              name="header"
+              @slotchange=${this.handleHeaderSlotChange}
+            ></slot>
+            ${this.showClose ? n`
+                  <button
+                    class="close-button"
+                    part="close-button"
+                    type="button"
+                    aria-label="Close drawer"
+                    @click=${this.handleCloseClick}
+                  >
+                    <bp-icon name="close" size="sm"></bp-icon>
+                  </button>
+                ` : l}
+          </header>
+          <div class="body" part="body">
+            <slot></slot>
+          </div>
+          ${this.hasFooter ? n`
+                <footer class="footer" part="footer">
+                  <slot
+                    name="footer"
+                    @slotchange=${this.handleFooterSlotChange}
+                  ></slot>
+                </footer>
+              ` : n`<slot
+                name="footer"
+                @slotchange=${this.handleFooterSlotChange}
+              ></slot>`}
+        </aside>
+      </div>
+    `;
+  }
+};
+r.styles = [w];
+o([
+  a({ type: Boolean, reflect: !0 })
+], r.prototype, "open", 2);
+o([
+  a({
+    type: String,
+    reflect: !0,
+    converter: {
+      fromAttribute: (e) => e && ["left", "right", "top", "bottom"].includes(e) ? e : "left"
+    }
+  })
+], r.prototype, "placement", 2);
+o([
+  a({
+    type: String,
+    reflect: !0,
+    converter: {
+      fromAttribute: (e) => e && ["sm", "md", "lg", "full"].includes(e) ? e : "md"
+    }
+  })
+], r.prototype, "size", 2);
+o([
+  a({
+    converter: d,
+    attribute: "show-close",
+    reflect: !0
+  })
+], r.prototype, "showClose", 2);
+o([
+  a({
+    converter: d,
+    attribute: "close-on-backdrop",
+    reflect: !0
+  })
+], r.prototype, "closeOnBackdrop", 2);
+o([
+  a({
+    converter: d,
+    attribute: "close-on-escape",
+    reflect: !0
+  })
+], r.prototype, "closeOnEscape", 2);
+o([
+  a({
+    converter: d,
+    attribute: "show-backdrop",
+    reflect: !0
+  })
+], r.prototype, "showBackdrop", 2);
+o([
+  a({ type: String })
+], r.prototype, "label", 2);
+o([
+  a({ type: Boolean, reflect: !0 })
+], r.prototype, "inline", 2);
+o([
+  a({ type: Boolean, attribute: !1 })
+], r.prototype, "hasHeader", 2);
+o([
+  a({ type: Boolean, attribute: !1 })
+], r.prototype, "hasFooter", 2);
+r = o([
+  f("bp-drawer")
+], r);
+export {
+  r as BpDrawer
+};
+//# sourceMappingURL=drawer.js.map

package/dist/components/drawer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer.js","sources":["../../source/components/drawer/drawer.style.ts","../../source/components/drawer/drawer.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const drawerStyles = css`\n  /* Base styles */\n  :host {\n    display: contents;\n  }\n\n  .drawer {\n    font-family: var(--bp-font-family);\n    font-size: var(--bp-font-size-base);\n    color: var(--bp-color-text);\n  }\n\n  /* Overlay mode */\n  .drawer--overlay {\n    position: fixed;\n    inset: 0;\n    z-index: var(--bp-z-modal);\n    pointer-events: none;\n  }\n\n  .drawer--overlay.drawer--open {\n    pointer-events: auto;\n  }\n\n  /* Backdrop */\n  .backdrop {\n    position: absolute;\n    inset: 0;\n    background-color: oklch(from var(--bp-color-text) l c h / 0.5);\n    opacity: 0;\n    transition: opacity var(--bp-transition-base) ease-out;\n  }\n\n  .backdrop--visible {\n    opacity: 1;\n  }\n\n  /* Panel base */\n  .panel {\n    position: absolute;\n    display: flex;\n    flex-direction: column;\n    background-color: var(--bp-color-surface);\n    box-shadow: var(--bp-shadow-xl);\n    transition: transform var(--bp-transition-base) ease-out;\n    overflow: hidden;\n  }\n\n  .drawer--overlay .panel:focus {\n    outline: none;\n  }\n\n  /* Horizontal drawers (left/right) */\n  .drawer--horizontal .panel {\n    top: 0;\n    bottom: 0;\n    height: 100%;\n  }\n\n  .drawer--left .panel {\n    left: 0;\n    transform: translateX(-100%);\n  }\n\n  .drawer--left .panel--open {\n    transform: translateX(0);\n  }\n\n  .drawer--right .panel {\n    right: 0;\n    transform: translateX(100%);\n  }\n\n  .drawer--right .panel--open {\n    transform: translateX(0);\n  }\n\n  /* Vertical drawers (top/bottom) */\n  .drawer--vertical .panel {\n    left: 0;\n    right: 0;\n    width: 100%;\n  }\n\n  .drawer--top .panel {\n    top: 0;\n    transform: translateY(-100%);\n  }\n\n  .drawer--top .panel--open {\n    transform: translateY(0);\n  }\n\n  .drawer--bottom .panel {\n    bottom: 0;\n    transform: translateY(100%);\n  }\n\n  .drawer--bottom .panel--open {\n    transform: translateY(0);\n  }\n\n  /* Sizes - horizontal (width) */\n  .drawer--horizontal.drawer--sm .panel {\n    width: calc(var(--bp-spacing-24) * 3);\n  }\n\n  .drawer--horizontal.drawer--md .panel {\n    width: calc(var(--bp-spacing-24) * 4 + var(--bp-spacing-16));\n  }\n\n  .drawer--horizontal.drawer--lg .panel {\n    width: var(--bp-breakpoint-sm);\n  }\n\n  .drawer--horizontal.drawer--full .panel {\n    width: 100%;\n  }\n\n  /* Sizes - vertical (height) */\n  .drawer--vertical.drawer--sm .panel {\n    height: calc(var(--bp-spacing-24) * 2);\n  }\n\n  .drawer--vertical.drawer--md .panel {\n    height: calc(var(--bp-spacing-24) * 3 + var(--bp-spacing-8));\n  }\n\n  .drawer--vertical.drawer--lg .panel {\n    height: calc(var(--bp-spacing-24) * 5);\n  }\n\n  .drawer--vertical.drawer--full .panel {\n    height: 100%;\n  }\n\n  /* Header */\n  .header {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: var(--bp-spacing-4);\n    padding: var(--bp-spacing-4) var(--bp-spacing-5);\n    border-bottom: var(--bp-border-width) solid var(--bp-color-border);\n    flex-shrink: 0;\n  }\n\n  .header--empty {\n    display: none;\n  }\n\n  .header ::slotted(*) {\n    margin: 0;\n    font-size: var(--bp-font-size-lg);\n    font-weight: var(--bp-font-weight-semibold);\n  }\n\n  /* Body */\n  .body {\n    flex: 1;\n    overflow-y: auto;\n    padding: var(--bp-spacing-5);\n  }\n\n  /* Footer */\n  .footer {\n    display: flex;\n    align-items: center;\n    gap: var(--bp-spacing-4);\n    padding: var(--bp-spacing-4) var(--bp-spacing-5);\n    border-top: var(--bp-border-width) solid var(--bp-color-border);\n    flex-shrink: 0;\n  }\n\n  /* Close button */\n  .close-button {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 44px;\n    height: 44px;\n    padding: 0;\n    margin-left: auto;\n    background: transparent;\n    border: none;\n    border-radius: var(--bp-border-radius-sm);\n    color: var(--bp-color-text-muted);\n    cursor: pointer;\n    transition:\n      background-color var(--bp-transition-fast),\n      color var(--bp-transition-fast),\n      transform var(--bp-transition-fast);\n  }\n\n  .close-button:hover {\n    background-color: var(--bp-color-surface-subdued);\n    color: var(--bp-color-text);\n  }\n\n  .close-button:active {\n    background-color: var(--bp-color-surface-pressed);\n    transform: translateY(1px);\n  }\n\n  .close-button:focus {\n    outline: var(--bp-focus-width) var(--bp-focus-style) var(--bp-color-focus);\n    outline-offset: var(--bp-focus-offset);\n  }\n\n  .close-button:focus:not(:focus-visible) {\n    outline: none;\n  }\n\n  .close-button:focus-visible {\n    outline: var(--bp-focus-width) var(--bp-focus-style) var(--bp-color-focus);\n    outline-offset: var(--bp-focus-offset);\n  }\n\n  /* Inline mode - static sidebar */\n  .drawer--inline {\n    display: block;\n  }\n\n  .drawer--inline .panel {\n    position: relative;\n    transform: none;\n    box-shadow: none;\n    border: var(--bp-border-width) solid var(--bp-color-border);\n    border-radius: var(--bp-border-radius-md);\n  }\n\n  .drawer--inline.drawer--horizontal {\n    height: 100%;\n  }\n\n  .drawer--inline.drawer--vertical {\n    width: 100%;\n  }\n\n  /* Inline sizes - horizontal */\n  .drawer--inline.drawer--horizontal.drawer--small {\n    width: calc(var(--bp-spacing-24) * 3);\n  }\n\n  .drawer--inline.drawer--horizontal.drawer--medium {\n    width: calc(var(--bp-spacing-24) * 4 + var(--bp-spacing-16));\n  }\n\n  .drawer--inline.drawer--horizontal.drawer--large {\n    width: var(--bp-breakpoint-sm);\n  }\n\n  .drawer--inline.drawer--horizontal.drawer--full {\n    width: 100%;\n  }\n\n  /* Inline sizes - vertical */\n  .drawer--inline.drawer--vertical.drawer--small .panel {\n    height: calc(var(--bp-spacing-24) * 2);\n  }\n\n  .drawer--inline.drawer--vertical.drawer--medium .panel {\n    height: calc(var(--bp-spacing-24) * 3 + var(--bp-spacing-8));\n  }\n\n  .drawer--inline.drawer--vertical.drawer--large .panel {\n    height: calc(var(--bp-spacing-24) * 5);\n  }\n\n  .drawer--inline.drawer--vertical.drawer--full .panel {\n    height: auto;\n  }\n\n  /* Border positioning for inline drawers */\n  .drawer--inline.drawer--left .panel {\n    border-left: none;\n    border-top-left-radius: 0;\n    border-bottom-left-radius: 0;\n  }\n\n  .drawer--inline.drawer--right .panel {\n    border-right: none;\n    border-top-right-radius: 0;\n    border-bottom-right-radius: 0;\n  }\n\n  .drawer--inline.drawer--top .panel {\n    border-top: none;\n    border-top-left-radius: 0;\n    border-top-right-radius: 0;\n  }\n\n  .drawer--inline.drawer--bottom .panel {\n    border-bottom: none;\n    border-bottom-left-radius: 0;\n    border-bottom-right-radius: 0;\n  }\n\n  /* Reduced motion */\n  @media (prefers-reduced-motion: reduce) {\n    .panel {\n      transition: none;\n    }\n\n    .backdrop {\n      transition: none;\n    }\n  }\n`;\n","import { LitElement, html, nothing } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { drawerStyles } from './drawer.style.js';\nimport { booleanConverter } from '../../utilities/boolean-converter.js';\nimport '../icon/icon.js';\n\nexport type DrawerPlacement = 'left' | 'right' | 'top' | 'bottom';\nexport type DrawerSize = 'sm' | 'md' | 'lg' | 'full';\n\n/**\n * A slide-in panel component that can appear from any edge of the viewport.\n *\n * @fires bp-open - Fired when the drawer opens\n * @fires bp-close - Fired when the drawer closes (includes reason: 'escape' | 'backdrop' | 'close-button' | 'api')\n * @fires bp-after-open - Fired after open animation completes\n * @fires bp-after-close - Fired after close animation completes\n *\n * @slot - Default slot for drawer content\n * @slot header - Optional header content\n * @slot footer - Optional footer content\n *\n * @csspart drawer - The drawer container\n * @csspart backdrop - The backdrop overlay (when not inline)\n * @csspart panel - The drawer panel\n * @csspart header - The header section\n * @csspart body - The body/content section\n * @csspart footer - The footer section\n * @csspart close-button - The close button\n */\n@customElement('bp-drawer')\nexport class BpDrawer extends LitElement {\n  /** Whether the drawer is open */\n  @property({ type: Boolean, reflect: true }) declare open: boolean;\n\n  /** Which edge the drawer slides in from */\n  @property({\n    type: String,\n    reflect: true,\n    converter: {\n      fromAttribute: (value: string | null) => {\n        const valid = ['left', 'right', 'top', 'bottom'];\n        return value && valid.includes(value)\n          ? (value as DrawerPlacement)\n          : 'left';\n      },\n    },\n  })\n  declare placement: DrawerPlacement;\n\n  /** Size of the drawer (width for left/right, height for top/bottom) */\n  @property({\n    type: String,\n    reflect: true,\n    converter: {\n      fromAttribute: (value: string | null) => {\n        const valid = ['sm', 'md', 'lg', 'full'];\n        return value && valid.includes(value) ? (value as DrawerSize) : 'md';\n      },\n    },\n  })\n  declare size: DrawerSize;\n\n  /** Whether to show the close button */\n  @property({\n    converter: booleanConverter,\n    attribute: 'show-close',\n    reflect: true,\n  })\n  declare showClose: boolean;\n\n  /** Whether clicking the backdrop closes the drawer */\n  @property({\n    converter: booleanConverter,\n    attribute: 'close-on-backdrop',\n    reflect: true,\n  })\n  declare closeOnBackdrop: boolean;\n\n  /** Whether pressing Escape closes the drawer */\n  @property({\n    converter: booleanConverter,\n    attribute: 'close-on-escape',\n    reflect: true,\n  })\n  declare closeOnEscape: boolean;\n\n  /** Whether to show the backdrop overlay */\n  @property({\n    converter: booleanConverter,\n    attribute: 'show-backdrop',\n    reflect: true,\n  })\n  declare showBackdrop: boolean;\n\n  /** Accessible label for the drawer */\n  @property({ type: String }) declare label: string;\n\n  /**\n   * Whether the drawer is rendered inline (always visible, part of document flow).\n   * When true, the drawer acts as a static sidebar without overlay behavior.\n   */\n  @property({ type: Boolean, reflect: true }) declare inline: boolean;\n\n  /** Whether the drawer has a header slot content */\n  @property({ type: Boolean, attribute: false }) private hasHeader = false;\n\n  /** Whether the drawer has a footer slot content */\n  @property({ type: Boolean, attribute: false }) private hasFooter = false;\n\n  private previouslyFocusedElement: HTMLElement | null = null;\n\n  static styles = [drawerStyles];\n\n  constructor() {\n    super();\n    this.open = false;\n    this.placement = 'left';\n    this.size = 'md';\n    this.showClose = true;\n    this.closeOnBackdrop = true;\n    this.closeOnEscape = true;\n    this.showBackdrop = true;\n    this.label = '';\n    this.inline = false;\n  }\n\n  connectedCallback(): void {\n    super.connectedCallback();\n    this.addEventListener('keydown', this.handleKeyDown);\n  }\n\n  disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.removeEventListener('keydown', this.handleKeyDown);\n  }\n\n  /**\n   * Open the drawer.\n   * Sets open property to true and manages focus/scroll behavior.\n   *\n   * @fires bp-open - Emitted when the drawer opens\n   * @fires bp-after-open - Emitted after open animation completes\n   */\n  show(): void {\n    if (this.open) return;\n    this.open = true;\n  }\n\n  /**\n   * Close the drawer.\n   * Sets open property to false if bp-close event is not prevented.\n   *\n   * @param reason - The reason the drawer was closed\n   * @fires bp-close - Emitted when the drawer closes (cancelable)\n   * @fires bp-after-close - Emitted after close animation completes\n   */\n  hide(reason: 'escape' | 'backdrop' | 'close-button' | 'api' = 'api'): void {\n    if (!this.open) return;\n\n    const event = new CustomEvent('bp-close', {\n      detail: { reason },\n      bubbles: true,\n      composed: true,\n      cancelable: true,\n    });\n\n    this.dispatchEvent(event);\n\n    if (!event.defaultPrevented) {\n      this.open = false;\n    }\n  }\n\n  /**\n   * Toggle the drawer open/closed state.\n   * Calls hide() if open, show() if closed.\n   */\n  toggle(): void {\n    if (this.open) {\n      this.hide('api');\n    } else {\n      this.show();\n    }\n  }\n\n  protected updated(changedProperties: Map<string, unknown>): void {\n    if (changedProperties.has('open')) {\n      if (this.open) {\n        this.handleOpen();\n      } else {\n        this.handleClose();\n      }\n    }\n  }\n\n  private handleOpen(): void {\n    if (!this.inline) {\n      // Store currently focused element\n      this.previouslyFocusedElement = document.activeElement as HTMLElement;\n\n      // Prevent body scroll\n      document.body.style.overflow = 'hidden';\n    }\n\n    this.dispatchEvent(\n      new CustomEvent('bp-open', {\n        bubbles: true,\n        composed: true,\n      })\n    );\n\n    // Focus the drawer panel for accessibility\n    this.updateComplete.then(() => {\n      const panel = this.shadowRoot?.querySelector('.panel') as HTMLElement;\n      panel?.focus();\n\n      this.dispatchEvent(\n        new CustomEvent('bp-after-open', {\n          bubbles: true,\n          composed: true,\n        })\n      );\n    });\n  }\n\n  private handleClose(): void {\n    if (!this.inline) {\n      // Restore body scroll\n      document.body.style.overflow = '';\n\n      // Restore focus\n      if (this.previouslyFocusedElement) {\n        this.previouslyFocusedElement.focus();\n        this.previouslyFocusedElement = null;\n      }\n    }\n\n    this.updateComplete.then(() => {\n      this.dispatchEvent(\n        new CustomEvent('bp-after-close', {\n          bubbles: true,\n          composed: true,\n        })\n      );\n    });\n  }\n\n  private handleKeyDown = (event: KeyboardEvent): void => {\n    if (\n      event.key === 'Escape' &&\n      this.closeOnEscape &&\n      this.open &&\n      !this.inline\n    ) {\n      event.preventDefault();\n      this.hide('escape');\n    }\n  };\n\n  /**\n   * Handles click events on the backdrop overlay.\n   * Closes the drawer if closeOnBackdrop is true.\n   */\n  private handleBackdropClick = (): void => {\n    if (this.closeOnBackdrop) {\n      this.hide('backdrop');\n    }\n  };\n\n  /**\n   * Handles click events on the close button.\n   * Closes the drawer with reason 'close-button'.\n   */\n  private handleCloseClick = (): void => {\n    this.hide('close-button');\n  };\n\n  /**\n   * Handles slot change events for the header slot.\n   * Updates hasHeader state to control header visibility.\n   *\n   * @param event - The slotchange event\n   */\n  private handleHeaderSlotChange = (event: Event): void => {\n    const slot = event.target as HTMLElement & {\n      assignedNodes: (options?: { flatten?: boolean }) => Node[];\n    };\n    this.hasHeader = slot.assignedNodes({ flatten: true }).length > 0;\n  };\n\n  /**\n   * Handles slot change events for the footer slot.\n   * Updates hasFooter state to control footer visibility.\n   *\n   * @param event - The slotchange event\n   */\n  private handleFooterSlotChange = (event: Event): void => {\n    const slot = event.target as HTMLElement & {\n      assignedNodes: (options?: { flatten?: boolean }) => Node[];\n    };\n    this.hasFooter = slot.assignedNodes({ flatten: true }).length > 0;\n  };\n\n  render() {\n    const isHorizontal =\n      this.placement === 'left' || this.placement === 'right';\n\n    // Inline mode: always visible, no backdrop, no overlay behavior\n    if (this.inline) {\n      return html`\n        <aside\n          class=\"drawer drawer--inline drawer--${this.placement} drawer--${this\n            .size} ${isHorizontal ? 'drawer--horizontal' : 'drawer--vertical'}\"\n          part=\"drawer\"\n          role=\"complementary\"\n          aria-label=${this.label || nothing}\n        >\n          <div class=\"panel\" part=\"panel\">\n            ${this.hasHeader || this.showClose\n              ? html`\n                  <header class=\"header\" part=\"header\">\n                    <slot\n                      name=\"header\"\n                      @slotchange=${this.handleHeaderSlotChange}\n                    ></slot>\n                  </header>\n                `\n              : html`<slot\n                  name=\"header\"\n                  @slotchange=${this.handleHeaderSlotChange}\n                ></slot>`}\n            <div class=\"body\" part=\"body\">\n              <slot></slot>\n            </div>\n            ${this.hasFooter\n              ? html`\n                  <footer class=\"footer\" part=\"footer\">\n                    <slot\n                      name=\"footer\"\n                      @slotchange=${this.handleFooterSlotChange}\n                    ></slot>\n                  </footer>\n                `\n              : html`<slot\n                  name=\"footer\"\n                  @slotchange=${this.handleFooterSlotChange}\n                ></slot>`}\n          </div>\n        </aside>\n      `;\n    }\n\n    // Overlay mode: slide-in panel with backdrop\n    return html`\n      <div\n        class=\"drawer drawer--overlay drawer--${this.placement} drawer--${this\n          .size} ${isHorizontal\n          ? 'drawer--horizontal'\n          : 'drawer--vertical'} ${this.open ? 'drawer--open' : ''}\"\n        part=\"drawer\"\n      >\n        ${this.showBackdrop\n          ? html`\n              <div\n                class=\"backdrop ${this.open ? 'backdrop--visible' : ''}\"\n                part=\"backdrop\"\n                @click=${this.handleBackdropClick}\n                aria-hidden=\"true\"\n              ></div>\n            `\n          : nothing}\n        <aside\n          class=\"panel ${this.open ? 'panel--open' : ''}\"\n          part=\"panel\"\n          role=\"dialog\"\n          aria-modal=\"true\"\n          aria-label=${this.label || nothing}\n          tabindex=\"-1\"\n        >\n          <header\n            class=\"header ${this.hasHeader || this.showClose\n              ? ''\n              : 'header--empty'}\"\n            part=\"header\"\n          >\n            <slot\n              name=\"header\"\n              @slotchange=${this.handleHeaderSlotChange}\n            ></slot>\n            ${this.showClose\n              ? html`\n                  <button\n                    class=\"close-button\"\n                    part=\"close-button\"\n                    type=\"button\"\n                    aria-label=\"Close drawer\"\n                    @click=${this.handleCloseClick}\n                  >\n                    <bp-icon name=\"close\" size=\"sm\"></bp-icon>\n                  </button>\n                `\n              : nothing}\n          </header>\n          <div class=\"body\" part=\"body\">\n            <slot></slot>\n          </div>\n          ${this.hasFooter\n            ? html`\n                <footer class=\"footer\" part=\"footer\">\n                  <slot\n                    name=\"footer\"\n                    @slotchange=${this.handleFooterSlotChange}\n                  ></slot>\n                </footer>\n              `\n            : html`<slot\n                name=\"footer\"\n                @slotchange=${this.handleFooterSlotChange}\n              ></slot>`}\n        </aside>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'bp-drawer': BpDrawer;\n  }\n}\n"],"names":["drawerStyles","css","BpDrawer","LitElement","event","slot","reason","changedProperties","isHorizontal","html","nothing","__decorateClass","property","value","booleanConverter","customElement"],"mappings":";;;AAEO,MAAMA,IAAeC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;AC4BrB,IAAMC,IAAN,cAAuBC,EAAW;AAAA,EAmFvC,cAAc;AACZ,UAAA,GAV6C,KAAQ,YAAY,IAGpB,KAAQ,YAAY,IAEnE,KAAQ,2BAA+C,MA0IvD,KAAQ,gBAAgB,CAACC,MAA+B;AACtD,MACEA,EAAM,QAAQ,YACd,KAAK,iBACL,KAAK,QACL,CAAC,KAAK,WAENA,EAAM,eAAA,GACN,KAAK,KAAK,QAAQ;AAAA,IAEtB,GAMA,KAAQ,sBAAsB,MAAY;AACxC,MAAI,KAAK,mBACP,KAAK,KAAK,UAAU;AAAA,IAExB,GAMA,KAAQ,mBAAmB,MAAY;AACrC,WAAK,KAAK,cAAc;AAAA,IAC1B,GAQA,KAAQ,yBAAyB,CAACA,MAAuB;AACvD,YAAMC,IAAOD,EAAM;AAGnB,WAAK,YAAYC,EAAK,cAAc,EAAE,SAAS,GAAA,CAAM,EAAE,SAAS;AAAA,IAClE,GAQA,KAAQ,yBAAyB,CAACD,MAAuB;AACvD,YAAMC,IAAOD,EAAM;AAGnB,WAAK,YAAYC,EAAK,cAAc,EAAE,SAAS,GAAA,CAAM,EAAE,SAAS;AAAA,IAClE,GA1LE,KAAK,OAAO,IACZ,KAAK,YAAY,QACjB,KAAK,OAAO,MACZ,KAAK,YAAY,IACjB,KAAK,kBAAkB,IACvB,KAAK,gBAAgB,IACrB,KAAK,eAAe,IACpB,KAAK,QAAQ,IACb,KAAK,SAAS;AAAA,EAChB;AAAA,EAEA,oBAA0B;AACxB,UAAM,kBAAA,GACN,KAAK,iBAAiB,WAAW,KAAK,aAAa;AAAA,EACrD;AAAA,EAEA,uBAA6B;AAC3B,UAAM,qBAAA,GACN,KAAK,oBAAoB,WAAW,KAAK,aAAa;AAAA,EACxD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EASA,OAAa;AACX,IAAI,KAAK,SACT,KAAK,OAAO;AAAA,EACd;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAUA,KAAKC,IAAyD,OAAa;AACzE,QAAI,CAAC,KAAK,KAAM;AAEhB,UAAMF,IAAQ,IAAI,YAAY,YAAY;AAAA,MACxC,QAAQ,EAAE,QAAAE,EAAA;AAAA,MACV,SAAS;AAAA,MACT,UAAU;AAAA,MACV,YAAY;AAAA,IAAA,CACb;AAED,SAAK,cAAcF,CAAK,GAEnBA,EAAM,qBACT,KAAK,OAAO;AAAA,EAEhB;AAAA;AAAA;AAAA;AAAA;AAAA,EAMA,SAAe;AACb,IAAI,KAAK,OACP,KAAK,KAAK,KAAK,IAEf,KAAK,KAAA;AAAA,EAET;AAAA,EAEU,QAAQG,GAA+C;AAC/D,IAAIA,EAAkB,IAAI,MAAM,MAC1B,KAAK,OACP,KAAK,WAAA,IAEL,KAAK,YAAA;AAAA,EAGX;AAAA,EAEQ,aAAmB;AACzB,IAAK,KAAK,WAER,KAAK,2BAA2B,SAAS,eAGzC,SAAS,KAAK,MAAM,WAAW,WAGjC,KAAK;AAAA,MACH,IAAI,YAAY,WAAW;AAAA,QACzB,SAAS;AAAA,QACT,UAAU;AAAA,MAAA,CACX;AAAA,IAAA,GAIH,KAAK,eAAe,KAAK,MAAM;AAE7B,MADc,KAAK,YAAY,cAAc,QAAQ,GAC9C,MAAA,GAEP,KAAK;AAAA,QACH,IAAI,YAAY,iBAAiB;AAAA,UAC/B,SAAS;AAAA,UACT,UAAU;AAAA,QAAA,CACX;AAAA,MAAA;AAAA,IAEL,CAAC;AAAA,EACH;AAAA,EAEQ,cAAoB;AAC1B,IAAK,KAAK,WAER,SAAS,KAAK,MAAM,WAAW,IAG3B,KAAK,6BACP,KAAK,yBAAyB,MAAA,GAC9B,KAAK,2BAA2B,QAIpC,KAAK,eAAe,KAAK,MAAM;AAC7B,WAAK;AAAA,QACH,IAAI,YAAY,kBAAkB;AAAA,UAChC,SAAS;AAAA,UACT,UAAU;AAAA,QAAA,CACX;AAAA,MAAA;AAAA,IAEL,CAAC;AAAA,EACH;AAAA,EA0DA,SAAS;AACP,UAAMC,IACJ,KAAK,cAAc,UAAU,KAAK,cAAc;AAGlD,WAAI,KAAK,SACAC;AAAA;AAAA,iDAEoC,KAAK,SAAS,YAAY,KAC9D,IAAI,IAAID,IAAe,uBAAuB,kBAAkB;AAAA;AAAA;AAAA,uBAGtD,KAAK,SAASE,CAAO;AAAA;AAAA;AAAA,cAG9B,KAAK,aAAa,KAAK,YACrBD;AAAA;AAAA;AAAA;AAAA,oCAIoB,KAAK,sBAAsB;AAAA;AAAA;AAAA,oBAI/CA;AAAA;AAAA,gCAEgB,KAAK,sBAAsB;AAAA,yBAClC;AAAA;AAAA;AAAA;AAAA,cAIX,KAAK,YACHA;AAAA;AAAA;AAAA;AAAA,oCAIoB,KAAK,sBAAsB;AAAA;AAAA;AAAA,oBAI/CA;AAAA;AAAA,gCAEgB,KAAK,sBAAsB;AAAA,yBAClC;AAAA;AAAA;AAAA,UAOdA;AAAA;AAAA,gDAEqC,KAAK,SAAS,YAAY,KAC/D,IAAI,IAAID,IACP,uBACA,kBAAkB,IAAI,KAAK,OAAO,iBAAiB,EAAE;AAAA;AAAA;AAAA,UAGvD,KAAK,eACHC;AAAA;AAAA,kCAEsB,KAAK,OAAO,sBAAsB,EAAE;AAAA;AAAA,yBAE7C,KAAK,mBAAmB;AAAA;AAAA;AAAA,gBAIrCC,CAAO;AAAA;AAAA,yBAEM,KAAK,OAAO,gBAAgB,EAAE;AAAA;AAAA;AAAA;AAAA,uBAIhC,KAAK,SAASA,CAAO;AAAA;AAAA;AAAA;AAAA,4BAIhB,KAAK,aAAa,KAAK,YACnC,KACA,eAAe;AAAA;AAAA;AAAA;AAAA;AAAA,4BAKH,KAAK,sBAAsB;AAAA;AAAA,cAEzC,KAAK,YACHD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,6BAMa,KAAK,gBAAgB;AAAA;AAAA;AAAA;AAAA,oBAKlCC,CAAO;AAAA;AAAA;AAAA;AAAA;AAAA,YAKX,KAAK,YACHD;AAAA;AAAA;AAAA;AAAA,kCAIoB,KAAK,sBAAsB;AAAA;AAAA;AAAA,kBAI/CA;AAAA;AAAA,8BAEgB,KAAK,sBAAsB;AAAA,uBAClC;AAAA;AAAA;AAAA;AAAA,EAIrB;AACF;AAzYaP,EAiFJ,SAAS,CAACF,CAAY;AA/EuBW,EAAA;AAAA,EAAnDC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAF/BV,EAEyC,WAAA,QAAA,CAAA;AAe5CS,EAAA;AAAA,EAZPC,EAAS;AAAA,IACR,MAAM;AAAA,IACN,SAAS;AAAA,IACT,WAAW;AAAA,MACT,eAAe,CAACC,MAEPA,KADO,CAAC,QAAQ,SAAS,OAAO,QAAQ,EACzB,SAASA,CAAK,IAC/BA,IACD;AAAA,IACN;AAAA,EACF,CACD;AAAA,GAhBUX,EAiBH,WAAA,aAAA,CAAA;AAaAS,EAAA;AAAA,EAVPC,EAAS;AAAA,IACR,MAAM;AAAA,IACN,SAAS;AAAA,IACT,WAAW;AAAA,MACT,eAAe,CAACC,MAEPA,KADO,CAAC,MAAM,MAAM,MAAM,MAAM,EACjB,SAASA,CAAK,IAAKA,IAAuB;AAAA,IAClE;AAAA,EACF,CACD;AAAA,GA7BUX,EA8BH,WAAA,QAAA,CAAA;AAQAS,EAAA;AAAA,EALPC,EAAS;AAAA,IACR,WAAWE;AAAA,IACX,WAAW;AAAA,IACX,SAAS;AAAA,EAAA,CACV;AAAA,GArCUZ,EAsCH,WAAA,aAAA,CAAA;AAQAS,EAAA;AAAA,EALPC,EAAS;AAAA,IACR,WAAWE;AAAA,IACX,WAAW;AAAA,IACX,SAAS;AAAA,EAAA,CACV;AAAA,GA7CUZ,EA8CH,WAAA,mBAAA,CAAA;AAQAS,EAAA;AAAA,EALPC,EAAS;AAAA,IACR,WAAWE;AAAA,IACX,WAAW;AAAA,IACX,SAAS;AAAA,EAAA,CACV;AAAA,GArDUZ,EAsDH,WAAA,iBAAA,CAAA;AAQAS,EAAA;AAAA,EALPC,EAAS;AAAA,IACR,WAAWE;AAAA,IACX,WAAW;AAAA,IACX,SAAS;AAAA,EAAA,CACV;AAAA,GA7DUZ,EA8DH,WAAA,gBAAA,CAAA;AAG4BS,EAAA;AAAA,EAAnCC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GAjEfV,EAiEyB,WAAA,SAAA,CAAA;AAMgBS,EAAA;AAAA,EAAnDC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAvE/BV,EAuEyC,WAAA,UAAA,CAAA;AAGGS,EAAA;AAAA,EAAtDC,EAAS,EAAE,MAAM,SAAS,WAAW,IAAO;AAAA,GA1ElCV,EA0E4C,WAAA,aAAA,CAAA;AAGAS,EAAA;AAAA,EAAtDC,EAAS,EAAE,MAAM,SAAS,WAAW,IAAO;AAAA,GA7ElCV,EA6E4C,WAAA,aAAA,CAAA;AA7E5CA,IAANS,EAAA;AAAA,EADNI,EAAc,WAAW;AAAA,GACbb,CAAA;"}