import {
  DirController
} from "./chunk-O7KRADOF.js";
import {
  observes
} from "./chunk-PQ7FKAPD.js";
import "./chunk-S2LAJOGU.js";
import {
  desc,
  query
} from "./chunk-GPHXI3E5.js";
import {
  InternalsController
} from "./chunk-L6TBUEZ3.js";
import {
  colorContextProvider
} from "./chunk-BJGK6XVH.js";
import {
  Logger
} from "./chunk-2GLQRFAL.js";
import {
  colorContextConsumer
} from "./chunk-D44H7DHP.js";
import {
  LitElement,
  classMap,
  css,
  customElement,
  html,
  isServer,
  property
} from "./chunk-ZEUKO5B7.js";
import {
  __classPrivateFieldGet,
  __classPrivateFieldSet,
  __decorate
} from "./chunk-7XARYKPP.js";
import "./chunk-PR4QN5HX.js";

// node_modules/@lit/context/development/lib/context-request-event.js
var ContextRequestEvent = class extends Event {
  /**
   *
   * @param context the context key to request
   * @param contextTarget the original context target of the requester
   * @param callback the callback that should be invoked when the context with the specified key is available
   * @param subscribe when, true indicates we want to subscribe to future updates
   */
  constructor(context2, contextTarget, callback, subscribe) {
    super("context-request", { bubbles: true, composed: true });
    this.context = context2;
    this.contextTarget = contextTarget;
    this.callback = callback;
    this.subscribe = subscribe ?? false;
  }
};

// node_modules/@lit/context/development/lib/create-context.js
function createContext(key) {
  return key;
}

// node_modules/@lit/context/development/lib/controllers/context-consumer.js
var ContextConsumer = class {
  constructor(host, contextOrOptions, callback, subscribe) {
    this.subscribe = false;
    this.provided = false;
    this.value = void 0;
    this._callback = (value, unsubscribe) => {
      if (this.unsubscribe) {
        if (this.unsubscribe !== unsubscribe) {
          this.provided = false;
          this.unsubscribe();
        }
        if (!this.subscribe) {
          this.unsubscribe();
        }
      }
      this.value = value;
      this.host.requestUpdate();
      if (!this.provided || this.subscribe) {
        this.provided = true;
        if (this.callback) {
          this.callback(value, unsubscribe);
        }
      }
      this.unsubscribe = unsubscribe;
    };
    this.host = host;
    if (contextOrOptions.context !== void 0) {
      const options = contextOrOptions;
      this.context = options.context;
      this.callback = options.callback;
      this.subscribe = options.subscribe ?? false;
    } else {
      this.context = contextOrOptions;
      this.callback = callback;
      this.subscribe = subscribe ?? false;
    }
    this.host.addController(this);
  }
  hostConnected() {
    this.dispatchRequest();
  }
  hostDisconnected() {
    if (this.unsubscribe) {
      this.unsubscribe();
      this.unsubscribe = void 0;
    }
  }
  dispatchRequest() {
    this.host.dispatchEvent(new ContextRequestEvent(this.context, this.host, this._callback, this.subscribe));
  }
};

// node_modules/@lit/context/development/lib/value-notifier.js
var ValueNotifier = class {
  get value() {
    return this._value;
  }
  set value(v) {
    this.setValue(v);
  }
  setValue(v, force = false) {
    const update = force || !Object.is(v, this._value);
    this._value = v;
    if (update) {
      this.updateObservers();
    }
  }
  constructor(defaultValue) {
    this.subscriptions = /* @__PURE__ */ new Map();
    this.updateObservers = () => {
      for (const [callback, { disposer }] of this.subscriptions) {
        callback(this._value, disposer);
      }
    };
    if (defaultValue !== void 0) {
      this.value = defaultValue;
    }
  }
  addCallback(callback, consumerHost, subscribe) {
    if (!subscribe) {
      callback(this.value);
      return;
    }
    if (!this.subscriptions.has(callback)) {
      this.subscriptions.set(callback, {
        disposer: () => {
          this.subscriptions.delete(callback);
        },
        consumerHost
      });
    }
    const { disposer } = this.subscriptions.get(callback);
    callback(this.value, disposer);
  }
  clearCallbacks() {
    this.subscriptions.clear();
  }
};

// node_modules/@lit/context/development/lib/controllers/context-provider.js
var ContextProviderEvent = class extends Event {
  /**
   *
   * @param context the context which this provider can provide
   * @param contextTarget the original context target of the provider
   */
  constructor(context2, contextTarget) {
    super("context-provider", { bubbles: true, composed: true });
    this.context = context2;
    this.contextTarget = contextTarget;
  }
};
var ContextProvider = class extends ValueNotifier {
  constructor(host, contextOrOptions, initialValue) {
    super(contextOrOptions.context !== void 0 ? contextOrOptions.initialValue : initialValue);
    this.onContextRequest = (ev) => {
      if (ev.context !== this.context) {
        return;
      }
      const consumerHost = ev.contextTarget ?? ev.composedPath()[0];
      if (consumerHost === this.host) {
        return;
      }
      ev.stopPropagation();
      this.addCallback(ev.callback, consumerHost, ev.subscribe);
    };
    this.onProviderRequest = (ev) => {
      if (ev.context !== this.context) {
        return;
      }
      const childProviderHost = ev.contextTarget ?? ev.composedPath()[0];
      if (childProviderHost === this.host) {
        return;
      }
      const seen = /* @__PURE__ */ new Set();
      for (const [callback, { consumerHost }] of this.subscriptions) {
        if (seen.has(callback)) {
          continue;
        }
        seen.add(callback);
        consumerHost.dispatchEvent(new ContextRequestEvent(this.context, consumerHost, callback, true));
      }
      ev.stopPropagation();
    };
    this.host = host;
    if (contextOrOptions.context !== void 0) {
      this.context = contextOrOptions.context;
    } else {
      this.context = contextOrOptions;
    }
    this.attachListeners();
    this.host.addController?.(this);
  }
  attachListeners() {
    this.host.addEventListener("context-request", this.onContextRequest);
    this.host.addEventListener("context-provider", this.onProviderRequest);
  }
  hostConnected() {
    this.host.dispatchEvent(new ContextProviderEvent(this.context, this.host));
  }
};

// node_modules/@lit/context/development/lib/context-root.js
var ContextRoot = class {
  constructor() {
    this.pendingContextRequests = /* @__PURE__ */ new Map();
    this.onContextProvider = (event) => {
      const pendingRequestData = this.pendingContextRequests.get(event.context);
      if (pendingRequestData === void 0) {
        return;
      }
      this.pendingContextRequests.delete(event.context);
      const { requests } = pendingRequestData;
      for (const { elementRef, callbackRef } of requests) {
        const element = elementRef.deref();
        const callback = callbackRef.deref();
        if (element === void 0 || callback === void 0) {
        } else {
          element.dispatchEvent(new ContextRequestEvent(event.context, element, callback, true));
        }
      }
    };
    this.onContextRequest = (event) => {
      if (event.subscribe !== true) {
        return;
      }
      const element = event.contextTarget ?? event.composedPath()[0];
      const callback = event.callback;
      let pendingContextRequests = this.pendingContextRequests.get(event.context);
      if (pendingContextRequests === void 0) {
        this.pendingContextRequests.set(event.context, pendingContextRequests = {
          callbacks: /* @__PURE__ */ new WeakMap(),
          requests: []
        });
      }
      let callbacks = pendingContextRequests.callbacks.get(element);
      if (callbacks === void 0) {
        pendingContextRequests.callbacks.set(element, callbacks = /* @__PURE__ */ new WeakSet());
      }
      if (callbacks.has(callback)) {
        return;
      }
      callbacks.add(callback);
      pendingContextRequests.requests.push({
        elementRef: new WeakRef(element),
        callbackRef: new WeakRef(callback)
      });
    };
  }
  /**
   * Attach the ContextRoot to a given element to intercept `context-request` and
   * `context-provider` events.
   *
   * @param element an element to add event listeners to
   */
  attach(element) {
    element.addEventListener("context-request", this.onContextRequest);
    element.addEventListener("context-provider", this.onContextProvider);
  }
  /**
   * Removes the ContextRoot event listeners from a given element.
   *
   * @param element an element from which to remove event listeners
   */
  detach(element) {
    element.removeEventListener("context-request", this.onContextRequest);
    element.removeEventListener("context-provider", this.onContextProvider);
  }
};

// node_modules/@lit/context/development/lib/decorators/provide.js
function provide({ context: context2 }) {
  return (protoOrTarget, nameOrContext) => {
    const controllerMap = /* @__PURE__ */ new WeakMap();
    if (typeof nameOrContext === "object") {
      nameOrContext.addInitializer(function() {
        controllerMap.set(this, new ContextProvider(this, { context: context2 }));
      });
      return {
        get() {
          return protoOrTarget.get.call(this);
        },
        set(value) {
          controllerMap.get(this)?.setValue(value);
          return protoOrTarget.set.call(this, value);
        },
        init(value) {
          controllerMap.get(this)?.setValue(value);
          return value;
        }
      };
    } else {
      protoOrTarget.constructor.addInitializer((element) => {
        controllerMap.set(element, new ContextProvider(element, { context: context2 }));
      });
      const descriptor = Object.getOwnPropertyDescriptor(protoOrTarget, nameOrContext);
      let newDescriptor;
      if (descriptor === void 0) {
        const valueMap = /* @__PURE__ */ new WeakMap();
        newDescriptor = {
          get() {
            return valueMap.get(this);
          },
          set(value) {
            controllerMap.get(this).setValue(value);
            valueMap.set(this, value);
          },
          configurable: true,
          enumerable: true
        };
      } else {
        const oldSetter = descriptor.set;
        newDescriptor = {
          ...descriptor,
          set(value) {
            controllerMap.get(this).setValue(value);
            oldSetter?.call(this, value);
          }
        };
      }
      Object.defineProperty(protoOrTarget, nameOrContext, newDescriptor);
      return;
    }
  };
}

// node_modules/@lit/context/development/lib/decorators/consume.js
function consume({ context: context2, subscribe }) {
  return (protoOrTarget, nameOrContext) => {
    if (typeof nameOrContext === "object") {
      nameOrContext.addInitializer(function() {
        new ContextConsumer(this, {
          context: context2,
          callback: (value) => {
            protoOrTarget.set.call(this, value);
          },
          subscribe
        });
      });
    } else {
      protoOrTarget.constructor.addInitializer((element) => {
        new ContextConsumer(element, {
          context: context2,
          callback: (value) => {
            element[nameOrContext] = value;
          },
          subscribe
        });
      });
    }
  };
}

// node_modules/@patternfly/pfe-core/decorators/bound.js
var configurable = true;
function bound(_, key, descriptor) {
  if (typeof descriptor?.value !== "function") {
    throw new TypeError(`Only methods can be decorated with @bound. <${key ?? _.name}> is not a method!`);
  }
  return {
    configurable,
    get() {
      const value = descriptor.value.bind(this);
      Object.defineProperty(this, key, { value, configurable, writable: true });
      return value;
    }
  };
}

// node_modules/@patternfly/pfe-core/controllers/at-focus-controller.js
var _ATFocusController_instances;
var _ATFocusController_itemsContainerElement;
var _ATFocusController_atFocusedItemIndex;
var _ATFocusController_initContainer;
function isATFocusableItem(el) {
  return !!el && el.ariaHidden !== "true" && !el.hasAttribute("inert") && !el.hasAttribute("hidden");
}
var ATFocusController = class {
  /**
   * Index of the Item which currently has assistive technology focus
   * Set this to change focus. Setting to an out-of-bounds value will
   * wrap around to the other side of the list.
   */
  get atFocusedItemIndex() {
    return __classPrivateFieldGet(this, _ATFocusController_atFocusedItemIndex, "f");
  }
  set atFocusedItemIndex(index) {
    const previousIndex = __classPrivateFieldGet(this, _ATFocusController_atFocusedItemIndex, "f");
    const direction = index > previousIndex ? 1 : -1;
    const { items, atFocusableItems } = this;
    const itemsIndexOfLastATFocusableItem = items.indexOf(this.atFocusableItems.at(-1));
    let itemToGainFocus = items.at(index);
    let itemToGainFocusIsFocusable = atFocusableItems.includes(itemToGainFocus);
    if (atFocusableItems.length) {
      let count = 0;
      while (!itemToGainFocus || !itemToGainFocusIsFocusable && count++ <= 1e3) {
        if (index < 0) {
          index = itemsIndexOfLastATFocusableItem;
        } else if (index >= itemsIndexOfLastATFocusableItem) {
          index = 0;
        } else {
          index = index + direction;
        }
        itemToGainFocus = items.at(index);
        itemToGainFocusIsFocusable = atFocusableItems.includes(itemToGainFocus);
      }
      if (count >= 1e3) {
        throw new Error("Could not atFocusedItemIndex");
      }
    }
    __classPrivateFieldSet(this, _ATFocusController_atFocusedItemIndex, index, "f");
  }
  /** Elements which control the items container e.g. a combobox input */
  get controlsElements() {
    return this.options.getControlsElements?.() ?? [];
  }
  /** All items which are able to receive assistive technology focus */
  get atFocusableItems() {
    return this._items.filter(isATFocusableItem);
  }
  /** The element containing focusable items, e.g. a listbox */
  get itemsContainerElement() {
    return __classPrivateFieldGet(this, _ATFocusController_itemsContainerElement, "f") ?? null;
  }
  set itemsContainerElement(container) {
    if (container !== __classPrivateFieldGet(this, _ATFocusController_itemsContainerElement, "f")) {
      __classPrivateFieldGet(this, _ATFocusController_itemsContainerElement, "f")?.removeEventListener("keydown", this.onKeydown);
      __classPrivateFieldSet(this, _ATFocusController_itemsContainerElement, container, "f");
      __classPrivateFieldGet(this, _ATFocusController_itemsContainerElement, "f")?.addEventListener("keydown", this.onKeydown);
      this.host.requestUpdate();
    }
  }
  constructor(host, options) {
    _ATFocusController_instances.add(this);
    this.host = host;
    this.options = options;
    _ATFocusController_itemsContainerElement.set(this, null);
    _ATFocusController_atFocusedItemIndex.set(this, -1);
    this._items = [];
    this.host.updateComplete.then(() => this.initItems());
  }
  /**
   * Initialize the items and itemsContainerElement fields
   */
  initItems() {
    this.items = this.options.getItems();
    this.itemsContainerElement ?? (this.itemsContainerElement = __classPrivateFieldGet(this, _ATFocusController_instances, "m", _ATFocusController_initContainer).call(this));
  }
  hostConnected() {
    this.hostUpdate();
  }
  hostDisconnected() {
    __classPrivateFieldGet(this, _ATFocusController_itemsContainerElement, "f")?.removeEventListener("keydown", this.onKeydown);
  }
  hostUpdate() {
    this.itemsContainerElement ?? (this.itemsContainerElement = __classPrivateFieldGet(this, _ATFocusController_instances, "m", _ATFocusController_initContainer).call(this));
  }
  /**
   * Override and conditionally call `super.onKeydown` to filter out keyboard events
   * which should not result in a focus change. Ensure that subclass' method is bound
   * @param event keyboard event
   */
  onKeydown(event) {
    const orientation = this.options.getOrientation?.() ?? __classPrivateFieldGet(this, _ATFocusController_itemsContainerElement, "f")?.getAttribute("aria-orientation");
    const item = this._items.at(this.atFocusedItemIndex);
    const horizontalOnly = orientation === "horizontal" || item?.tagName === "SELECT" || item?.getAttribute("role") === "spinbutton";
    const verticalOnly = orientation === "vertical";
    switch (event.key) {
      case "ArrowLeft":
        if (verticalOnly) {
          return;
        }
        this.atFocusedItemIndex--;
        event.stopPropagation();
        event.preventDefault();
        break;
      case "ArrowRight":
        if (verticalOnly) {
          return;
        }
        this.atFocusedItemIndex++;
        event.stopPropagation();
        event.preventDefault();
        break;
      case "ArrowUp":
        if (horizontalOnly) {
          return;
        }
        this.atFocusedItemIndex--;
        event.stopPropagation();
        event.preventDefault();
        break;
      case "ArrowDown":
        if (horizontalOnly) {
          return;
        }
        this.atFocusedItemIndex++;
        event.stopPropagation();
        event.preventDefault();
        break;
      case "Home":
        if (!(event.target instanceof HTMLElement && (event.target.hasAttribute("aria-activedescendant") || event.target.ariaActiveDescendantElement))) {
          this.atFocusedItemIndex = 0;
          event.stopPropagation();
          event.preventDefault();
        }
        break;
      case "End":
        if (!(event.target instanceof HTMLElement && (event.target.hasAttribute("aria-activedescendant") || event.target.ariaActiveDescendantElement))) {
          this.atFocusedItemIndex = this.items.length - 1;
          event.stopPropagation();
          event.preventDefault();
        }
        break;
      default:
        break;
    }
    this.host.requestUpdate();
  }
};
_ATFocusController_itemsContainerElement = /* @__PURE__ */ new WeakMap(), _ATFocusController_atFocusedItemIndex = /* @__PURE__ */ new WeakMap(), _ATFocusController_instances = /* @__PURE__ */ new WeakSet(), _ATFocusController_initContainer = function _ATFocusController_initContainer2() {
  return this.options.getItemsContainer?.() ?? (!isServer && this.host instanceof HTMLElement ? this.host : null);
};

// node_modules/@patternfly/pfe-core/controllers/roving-tabindex-controller.js
var _RovingTabindexController_logger;
var _RovingTabindexController_gainedInitialFocus;
var _RovingTabindexController_itemsSet;
var RovingTabindexController = class _RovingTabindexController extends ATFocusController {
  static of(host, options) {
    return new _RovingTabindexController(host, options);
  }
  get atFocusedItemIndex() {
    return super.atFocusedItemIndex;
  }
  /**
   * Sets the DOM Focus on the item with assistive technology focus
   * @param item item
   */
  set atFocusedItemIndex(index) {
    super.atFocusedItemIndex = index;
    const item = this.items.at(this.atFocusedItemIndex);
    for (const i of this.items) {
      i.tabIndex = item === i ? 0 : -1;
    }
    if (__classPrivateFieldGet(this, _RovingTabindexController_gainedInitialFocus, "f")) {
      item?.focus();
    }
    this.host.requestUpdate();
  }
  get items() {
    return this._items;
  }
  set items(items) {
    this._items = items;
    __classPrivateFieldSet(this, _RovingTabindexController_itemsSet, new Set(items), "f");
    const pivot = Math.max(0, this.atFocusedItemIndex);
    const [firstFocusable] = this.atFocusableItems;
    const firstFocusableIndex = firstFocusable ? items.indexOf(firstFocusable) : -1;
    const pivotFocusableIndex = items.indexOf(this.items.slice(pivot).concat(this.items.slice(0, pivot)).find((item) => this.atFocusableItems.includes(item)));
    this.atFocusedItemIndex = Math.max(firstFocusableIndex, pivotFocusableIndex);
    this.host.requestUpdate();
  }
  constructor(host, options) {
    super(host, options);
    this.host = host;
    _RovingTabindexController_logger.set(this, new Logger(this.host));
    _RovingTabindexController_gainedInitialFocus.set(this, false);
    _RovingTabindexController_itemsSet.set(this, /* @__PURE__ */ new Set());
    this.initItems();
    const container = options.getItemsContainer?.() ?? this.host;
    if (!isServer) {
      if (container instanceof HTMLElement) {
        container.addEventListener("focusin", () => __classPrivateFieldSet(this, _RovingTabindexController_gainedInitialFocus, true, "f"), { once: true });
      } else {
        __classPrivateFieldGet(this, _RovingTabindexController_logger, "f").warn("RovingTabindexController requires a getItemsContainer function");
      }
    }
  }
  onKeydown(event) {
    if (!event.ctrlKey && !event.altKey && !event.metaKey && !!this.atFocusableItems.length && !!event.composedPath().some((node) => __classPrivateFieldGet(this, _RovingTabindexController_itemsSet, "f").has(node))) {
      super.onKeydown(event);
    }
  }
};
_RovingTabindexController_logger = /* @__PURE__ */ new WeakMap(), _RovingTabindexController_gainedInitialFocus = /* @__PURE__ */ new WeakMap(), _RovingTabindexController_itemsSet = /* @__PURE__ */ new WeakMap();
__decorate([
  bound
], RovingTabindexController.prototype, "onKeydown", null);

// node_modules/@patternfly/pfe-core/controllers/tabs-aria-controller.js
var _TabsAriaController_instances;
var _TabsAriaController_logger;
var _TabsAriaController_host;
var _TabsAriaController_element;
var _TabsAriaController_tabPanelMap;
var _TabsAriaController_options;
var _TabsAriaController_mo;
var _TabsAriaController_onSlotchange;
var TabsAriaController = class {
  get tabs() {
    return [...__classPrivateFieldGet(this, _TabsAriaController_tabPanelMap, "f").keys()];
  }
  get activeTab() {
    return this.tabs.find((x) => __classPrivateFieldGet(this, _TabsAriaController_options, "f").isActiveTab(x));
  }
  /**
   * @param host controller host
   * @param options controller options
   * @example Usage in PfTab
   *          ```ts
   *          new TabsController(this, {
   *             isTab: (x): x is PfTab => x instanceof PfTab,
   *             isPanel: (x): x is PfTabPanel => x instanceof PfTabPanel
   *          });
   *          ```
   */
  constructor(host, options) {
    _TabsAriaController_instances.add(this);
    _TabsAriaController_logger.set(this, void 0);
    _TabsAriaController_host.set(this, void 0);
    _TabsAriaController_element.set(this, void 0);
    _TabsAriaController_tabPanelMap.set(this, /* @__PURE__ */ new Map());
    _TabsAriaController_options.set(this, void 0);
    _TabsAriaController_mo.set(this, new MutationObserver(__classPrivateFieldGet(this, _TabsAriaController_instances, "m", _TabsAriaController_onSlotchange).bind(this)));
    __classPrivateFieldSet(this, _TabsAriaController_options, options, "f");
    __classPrivateFieldSet(this, _TabsAriaController_logger, new Logger(host), "f");
    __classPrivateFieldSet(this, _TabsAriaController_host, host, "f").addController(this);
    if (isServer) {
      return;
    }
    if (host instanceof HTMLElement) {
      __classPrivateFieldSet(this, _TabsAriaController_element, host, "f");
    } else {
      const element = options.getHTMLElement?.();
      if (!element) {
        throw new Error("TabsController must be instantiated with an HTMLElement or a `getHTMLElement()` option");
      }
      __classPrivateFieldSet(this, _TabsAriaController_element, element, "f");
    }
    __classPrivateFieldGet(this, _TabsAriaController_element, "f").addEventListener("slotchange", __classPrivateFieldGet(this, _TabsAriaController_instances, "m", _TabsAriaController_onSlotchange));
    if (__classPrivateFieldGet(this, _TabsAriaController_element, "f").isConnected) {
      this.hostConnected();
    }
  }
  hostConnected() {
    __classPrivateFieldGet(this, _TabsAriaController_mo, "f").observe(__classPrivateFieldGet(this, _TabsAriaController_element, "f"), { attributes: false, childList: true, subtree: false });
    __classPrivateFieldGet(this, _TabsAriaController_instances, "m", _TabsAriaController_onSlotchange).call(this);
  }
  hostUpdated() {
    for (const [tab, panel] of __classPrivateFieldGet(this, _TabsAriaController_tabPanelMap, "f")) {
      panel.setAttribute("aria-labelledby", tab.id);
      tab.setAttribute("aria-controls", panel.id);
    }
  }
  hostDisconnected() {
    __classPrivateFieldGet(this, _TabsAriaController_mo, "f").disconnect();
  }
  panelFor(tab) {
    return __classPrivateFieldGet(this, _TabsAriaController_tabPanelMap, "f").get(tab);
  }
  tabFor(panel) {
    for (const [tab, panelToCheck] of __classPrivateFieldGet(this, _TabsAriaController_tabPanelMap, "f")) {
      if (panel === panelToCheck) {
        return tab;
      }
    }
  }
};
_TabsAriaController_logger = /* @__PURE__ */ new WeakMap(), _TabsAriaController_host = /* @__PURE__ */ new WeakMap(), _TabsAriaController_element = /* @__PURE__ */ new WeakMap(), _TabsAriaController_tabPanelMap = /* @__PURE__ */ new WeakMap(), _TabsAriaController_options = /* @__PURE__ */ new WeakMap(), _TabsAriaController_mo = /* @__PURE__ */ new WeakMap(), _TabsAriaController_instances = /* @__PURE__ */ new WeakSet(), _TabsAriaController_onSlotchange = function _TabsAriaController_onSlotchange2() {
  __classPrivateFieldGet(this, _TabsAriaController_tabPanelMap, "f").clear();
  const tabs = [];
  const panels = [];
  for (const child of __classPrivateFieldGet(this, _TabsAriaController_element, "f")?.children ?? []) {
    if (__classPrivateFieldGet(this, _TabsAriaController_options, "f").isTab(child)) {
      tabs.push(child);
      child.role ?? (child.role = "tab");
    } else if (__classPrivateFieldGet(this, _TabsAriaController_options, "f").isPanel(child)) {
      panels.push(child);
      child.role ?? (child.role = "tabpanel");
    }
  }
  if (tabs.length > panels.length) {
    __classPrivateFieldGet(this, _TabsAriaController_logger, "f").warn("Too many tabs!");
  } else if (panels.length > tabs.length) {
    __classPrivateFieldGet(this, _TabsAriaController_logger, "f").warn("Too many panels!");
  }
  while (tabs.length) {
    __classPrivateFieldGet(this, _TabsAriaController_tabPanelMap, "f").set(tabs.shift(), panels.shift());
  }
  __classPrivateFieldGet(this, _TabsAriaController_host, "f").requestUpdate();
};

// node_modules/@patternfly/pfe-core/functions/isElementInView.js
function isElementInView(container, element, partial = false, strict = false) {
  if (!container || !element) {
    return false;
  }
  const containerBounds = container.getBoundingClientRect();
  const elementBounds = element.getBoundingClientRect();
  const containerBoundsLeft = Math.ceil(containerBounds.left);
  const containerBoundsRight = Math.floor(containerBounds.right);
  const elementBoundsLeft = Math.ceil(elementBounds.left);
  const elementBoundsRight = Math.floor(elementBounds.right);
  const isTotallyInView = elementBoundsLeft >= containerBoundsLeft && elementBoundsRight <= containerBoundsRight;
  const isPartiallyInView = (partial || !strict && containerBounds.width < elementBounds.width) && (elementBoundsLeft < containerBoundsLeft && elementBoundsRight > containerBoundsLeft || elementBoundsRight > containerBoundsRight && elementBoundsLeft < containerBoundsRight);
  return isTotallyInView || isPartiallyInView;
}

// node_modules/@patternfly/pfe-core/controllers/overflow-controller.js
var _OverflowController_instances;
var _a;
var _OverflowController_instances_1;
var _OverflowController_container;
var _OverflowController_items;
var _OverflowController_scrollTimeoutDelay;
var _OverflowController_scrollTimeout;
var _OverflowController_hideOverflowButtons;
var _OverflowController_mo;
var _OverflowController_ro;
var _OverflowController_setOverflowState;
var OverflowController = class {
  get firstItem() {
    return __classPrivateFieldGet(this, _OverflowController_items, "f").at(0);
  }
  get lastItem() {
    return __classPrivateFieldGet(this, _OverflowController_items, "f").at(-1);
  }
  constructor(host, options) {
    _OverflowController_instances.add(this);
    this.host = host;
    this.options = options;
    _OverflowController_container.set(this, void 0);
    _OverflowController_items.set(this, []);
    _OverflowController_scrollTimeoutDelay.set(this, void 0);
    _OverflowController_scrollTimeout.set(this, void 0);
    _OverflowController_hideOverflowButtons.set(this, void 0);
    _OverflowController_mo.set(this, new MutationObserver((mutations) => {
      for (const mutation of mutations) {
        if (mutation.type === "childList") {
          __classPrivateFieldGet(this, _OverflowController_instances, "m", _OverflowController_setOverflowState).call(this);
        }
      }
    }));
    _OverflowController_ro.set(this, new ResizeObserver(() => {
      requestAnimationFrame(() => {
        __classPrivateFieldGet(this, _OverflowController_instances, "m", _OverflowController_setOverflowState).call(this);
      });
    }));
    this.showScrollButtons = false;
    this.overflowLeft = false;
    this.overflowRight = false;
    this.onScroll = () => {
      clearTimeout(__classPrivateFieldGet(this, _OverflowController_scrollTimeout, "f"));
      __classPrivateFieldSet(this, _OverflowController_scrollTimeout, setTimeout(() => __classPrivateFieldGet(this, _OverflowController_instances, "m", _OverflowController_setOverflowState).call(this), __classPrivateFieldGet(this, _OverflowController_scrollTimeoutDelay, "f")), "f");
    };
    __classPrivateFieldSet(this, _OverflowController_hideOverflowButtons, options?.hideOverflowButtons ?? false, "f");
    __classPrivateFieldSet(this, _OverflowController_scrollTimeoutDelay, options?.scrollTimeoutDelay ?? 0, "f");
    if (host.isConnected) {
      __classPrivateFieldGet(_a, _a, "f", _OverflowController_instances_1).add(this);
    }
    host.addController(this);
    if (host.isConnected) {
      this.hostConnected();
    }
  }
  init(container, items) {
    __classPrivateFieldSet(this, _OverflowController_container, container, "f");
    __classPrivateFieldSet(this, _OverflowController_items, items, "f");
  }
  scrollLeft() {
    if (!__classPrivateFieldGet(this, _OverflowController_container, "f")) {
      return;
    }
    const leftScroll = __classPrivateFieldGet(this, _OverflowController_container, "f").scrollLeft - __classPrivateFieldGet(this, _OverflowController_container, "f").clientWidth;
    __classPrivateFieldGet(this, _OverflowController_container, "f").scroll({ left: leftScroll, behavior: "smooth" });
    __classPrivateFieldGet(this, _OverflowController_instances, "m", _OverflowController_setOverflowState).call(this);
  }
  scrollRight() {
    if (!__classPrivateFieldGet(this, _OverflowController_container, "f")) {
      return;
    }
    const leftScroll = __classPrivateFieldGet(this, _OverflowController_container, "f").scrollLeft + __classPrivateFieldGet(this, _OverflowController_container, "f").clientWidth;
    __classPrivateFieldGet(this, _OverflowController_container, "f").scroll({ left: leftScroll, behavior: "smooth" });
    __classPrivateFieldGet(this, _OverflowController_instances, "m", _OverflowController_setOverflowState).call(this);
  }
  update() {
    __classPrivateFieldGet(this, _OverflowController_instances, "m", _OverflowController_setOverflowState).call(this);
  }
  hostConnected() {
    __classPrivateFieldGet(this, _OverflowController_mo, "f").observe(this.host, { attributes: false, childList: true, subtree: true });
    __classPrivateFieldGet(this, _OverflowController_ro, "f").observe(this.host);
    this.onScroll();
    __classPrivateFieldGet(this, _OverflowController_instances, "m", _OverflowController_setOverflowState).call(this);
  }
};
_a = OverflowController, _OverflowController_container = /* @__PURE__ */ new WeakMap(), _OverflowController_items = /* @__PURE__ */ new WeakMap(), _OverflowController_scrollTimeoutDelay = /* @__PURE__ */ new WeakMap(), _OverflowController_scrollTimeout = /* @__PURE__ */ new WeakMap(), _OverflowController_hideOverflowButtons = /* @__PURE__ */ new WeakMap(), _OverflowController_mo = /* @__PURE__ */ new WeakMap(), _OverflowController_ro = /* @__PURE__ */ new WeakMap(), _OverflowController_instances = /* @__PURE__ */ new WeakSet(), _OverflowController_setOverflowState = function _OverflowController_setOverflowState2() {
  if (!this.firstItem || !this.lastItem || !__classPrivateFieldGet(this, _OverflowController_container, "f")) {
    return;
  }
  const prevLeft = this.overflowLeft;
  const prevRight = this.overflowRight;
  this.overflowLeft = !__classPrivateFieldGet(this, _OverflowController_hideOverflowButtons, "f") && !isElementInView(__classPrivateFieldGet(this, _OverflowController_container, "f"), this.firstItem);
  this.overflowRight = !__classPrivateFieldGet(this, _OverflowController_hideOverflowButtons, "f") && !isElementInView(__classPrivateFieldGet(this, _OverflowController_container, "f"), this.lastItem);
  let scrollButtonsWidth = 0;
  if (this.overflowLeft || this.overflowRight) {
    scrollButtonsWidth = (__classPrivateFieldGet(this, _OverflowController_container, "f").parentElement?.querySelector("button")?.getBoundingClientRect().width || 0) * 2;
  }
  this.showScrollButtons = !__classPrivateFieldGet(this, _OverflowController_hideOverflowButtons, "f") && __classPrivateFieldGet(this, _OverflowController_container, "f").scrollWidth > __classPrivateFieldGet(this, _OverflowController_container, "f").clientWidth + scrollButtonsWidth;
  if (prevLeft !== this.overflowLeft || prevRight !== this.overflowRight) {
    this.host.requestUpdate();
  }
};
_OverflowController_instances_1 = { value: /* @__PURE__ */ new Set() };
(() => {
  globalThis.addEventListener?.("resize", () => {
    for (const instance of __classPrivateFieldGet(_a, _a, "f", _OverflowController_instances_1)) {
      instance.onScroll();
    }
  }, { capture: false, passive: true });
})();

// node_modules/@patternfly/pfe-core/functions/random.js
function getRandomId(prefix = "pfe") {
  return `${prefix}-${Math.random().toString(36).substr(2, 9)}`;
}

// node_modules/@lit/reactive-element/development/decorators/query-assigned-elements.js
function queryAssignedElements(options) {
  return (obj, name) => {
    const { slot, selector } = options ?? {};
    const slotSelector = `slot${slot ? `[name=${slot}]` : ":not([name])"}`;
    return desc(obj, name, {
      get() {
        const slotEl = this.renderRoot?.querySelector(slotSelector);
        const elements = slotEl?.assignedElements(options) ?? [];
        return selector === void 0 ? elements : elements.filter((node) => node.matches(selector));
      }
    });
  };
}

// node_modules/@patternfly/pfe-core/functions/context.js
var root;
function makeContextRoot() {
  const root2 = new ContextRoot();
  if (!isServer) {
    root2.attach(document.body);
  }
  return root2;
}
function createContextWithRoot(...args) {
  root ?? (root = makeContextRoot());
  return createContext(...args);
}

// node_modules/@rhds/elements/elements/rh-tabs/context.js
var context = createContextWithRoot(Symbol("rh-tabs-context"));

// node_modules/@rhds/elements/elements/rh-tabs/rh-tab.js
var _RhTab_instances;
var _RhTab_internals;
var _RhTab_onClick;
var _RhTab_onFocus;
var _RhTab_onKeydown;
var _RhTab_activate;
var styles = css`:host{display:flex;flex:none;--_active-tab-border:var(--rh-border-width-lg,3px) solid var(--_active-tab-border-color,var(--rh-tabs-active-border-color,var(--rh-color-accent-brand)));--_active-tab-border-open:var(--rh-border-width-sm,1px) solid var(--rh-color-surface)}[part=text]{display:inline;line-height:var(--rh-line-height-heading,1.3);text-wrap:balance}.vertical [part=text]{max-width:100%;overflow-wrap:break-word}[hidden]{display:none!important}slot[name=icon]{display:block}[part=icon]{margin-inline-end:var(--rh-space-md,8px)}#button{--_button-text-color:var(--rh-tabs-link-color,var(--rh-color-text-secondary));--_button-focus-outline-color:var(--rh-color-border-interactive);margin:0;font-family:inherit;font-size:100%;border:0;position:relative;display:flex;flex:1;text-decoration:none;cursor:pointer;align-items:center;background-color:inherit;color:var(--_button-text-color);width:100%;max-width:var(--_tab-max-width,200px);max-height:100%;line-height:0;padding:var(--rh-tabs-link-padding-block-start,var(--rh-space-lg,16px)) var(--rh-tabs-link-padding-inline-end,var(--rh-space-2xl,32px)) var(--rh-tabs-link-padding-block-end,var(--rh-space-lg,16px)) var(--rh-tabs-link-padding-inline-start,var(--rh-space-2xl,32px))}#button:after,#button:before{position:absolute;inset:0;content:"";border-style:solid;padding:0;margin:0;background-color:initial}#button:before{pointer-events:none;border:0 solid #0000}#button:after{background-color:initial;border-inline:0 solid #0000;border-block-start:var(--rh-border-width-lg,3px) solid #0000;border-block-end:var(--rh-border-width-sm,1px) solid #0000}#button.box{--_inactive-tab-background-color:var(--rh-color-surface-lighter,#f2f2f2)}#button.vertical{text-align:start;padding-inline:var(--rh-space-lg,16px)}@container (min-width: 768px){#button.vertical.box.first{margin-block-start:var(--rh-space-2xl,32px)}#button.vertical.box.last{margin-block-end:var(--rh-space-2xl,32px)}#button.vertical:not(.box){padding-block:var(--rh-tabs-link-padding-block-start,var(--rh-space-md,8px)) var(--rh-tabs-link-padding-block-end,var(--rh-space-md,8px))}#button.vertical.first:not(.box){margin-block-start:var(--rh-space-xl,24px)}#button.vertical.last:not(.box){margin-block-end:var(--rh-space-xl,24px)}}#button.active{--_button-text-color:var(--rh-tabs-link-color,var(--rh-color-text-primary))}#button.active.box:before{border-inline-color:var(--_border-color);border-inline-start-width:var(--rh-border-width-sm,1px)}#button.active.box:after{border-block-start:var(--_active-tab-border);border-block-end:var(--_active-tab-border-open)}#button.active.box.first:before{border-inline-start-color:var(--_border-color);border-inline-start-width:var(--rh-border-width-sm,1px)}#button.active.box.last:before{border-inline-end-color:var(--_border-color);border-inline-end-width:var(--rh-border-width-sm,1px)}@container (min-width: 768px){#button.active.box.vertical:before{border-inline-start:var(--_active-tab-border);border-inline-end:var(--_active-tab-border-open)}#button.active.box.vertical:after{border-block-start:var(--rh-border-width-sm,1px) solid var(--_border-color)}#button.active.box.vertical.first:after{border-block-start-color:var(--_border-color);border-block-start-width:var(--rh-border-width-sm,1px)}#button.active.box.vertical.last:before{border-block-end-color:var(--_border-color);border-block-end-width:var(--rh-border-width-sm,1px)}#button.active.box.first:not(.vertical):before{border-inline-start-color:var(--_border-color);border-inline-start-width:var(--rh-border-width-sm,1px)}#button.active.box.last:not(.vertical):before{border-inline-end-color:var(--_border-color);border-inline-end-width:var(--rh-border-width-sm,1px)}#button.active.box:not(.vertical):after{border-block-start:var(--_active-tab-border);border-block-end:var(--_active-tab-border-open)}}@container (max-width: 767px){#button.active.vertical:after{border-block-start:var(--_active-tab-border)}}@container (min-width: 768px){#button.active.vertical:after{border-block-end:#0000}}@container (max-width: 767px){#button.active.vertical:not(.box):after{border-block-start:#0000;border-block-end:var(--_active-tab-border)}}@container (min-width: 768px){#button.active.vertical:not(.box):before{border-inline-start:var(--_active-tab-border)}#button.active.vertical:not(.box):after{border-block-end:#0000}}#button.active:not(.box):not(.vertical):after{border-block-end:var(--_active-tab-border)}#button.box:not(.active){background-color:var(--_inactive-tab-background-color)}#button.box:not(.active):before{border-inline-color:var(--_border-color);border-inline-start-width:var(--rh-border-width-sm,1px)}#button.box:not(.active):after{border-block-end-color:var(--_border-color)}#button.box.vertical:not(.active):hover:before{border-block-start:var(--rh-border-width-lg,3px) solid var(--rh-color-interactive-secondary-default)}@container (min-width: 768px){#button.box.vertical:not(.active):before{border-inline-start-color:#0000;border-inline-end:var(--rh-border-width-sm,1px) solid var(--_border-color);border-block-start:var(--rh-border-width-sm,1px) solid var(--_border-color)}#button.box.vertical:not(.active):after{border-block-end-color:#0000}#button.box.vertical:not(.active):hover:before{border-inline-start:var(--rh-border-width-lg,3px) solid var(--rh-color-interactive-secondary-default);border-block-start:var(--rh-border-width-sm,1px) solid var(--_border-color)}}@container (min-width: 768px) and (min-width: 768px){#button.box.vertical.first:not(.active):before{border-block-start-color:#0000;border-inline-end-color:var(--_border-color)}#button.box.vertical.last:not(.active):after{border-block-end:none}}#button.box:not(.active):not(.vertical):hover:before{border-block-start:var(--rh-border-width-lg,3px) solid var(--rh-color-interactive-secondary-default)}@container (min-width: 768px){#button.box:not(.active):not(.vertical):after{border-block-end-color:var(--_border-color)}}#button.box.first:not(.active):before{border-inline-color:#0000}@container (max-width: 767px){#button.vertical:not(.active):not(.box):hover:after{border-block-end:var(--rh-border-width-lg,3px) solid var(--rh-color-interactive-secondary-default)}}@container (min-width: 768px){#button.vertical:not(.active):not(.box):hover:after{border-inline-start:var(--rh-border-width-lg,3px) solid var(--rh-color-interactive-secondary-default)}}#button:not(.active):not(.vertical,.box):hover:before{border-block-end:var(--rh-border-width-lg,3px) solid var(--rh-color-interactive-secondary-default)}#button.dark{--_button-text-color:var(--rh-tabs-link-color,var(--rh-color-text-secondary));--_button-focus-outline-color:var(--rh-color-border-interactive);--_inactive-tab-background-color:var(--rh-color-surface-dark-alt,#292929)}#button.dark.active{--_button-text-color:var(--rh-tabs-link-color,var(--rh-color-text-primary))}:host(:disabled) #button{pointer-events:none}:host([aria-disabled=true]) #button{cursor:default}:host(:is(:focus,:focus-within)) #button{outline:1px auto var(--rh-color-interactive-primary-default);outline-offset:-3px}`;
var TabExpandEvent = class extends Event {
  constructor(active, tab) {
    super("expand", { bubbles: true, cancelable: true });
    this.active = active;
    this.tab = tab;
  }
};
var RhTab = class RhTab2 extends LitElement {
  constructor() {
    super(...arguments);
    _RhTab_instances.add(this);
    this.active = false;
    this.disabled = false;
    _RhTab_internals.set(this, InternalsController.of(this, { role: "tab" }));
  }
  connectedCallback() {
    super.connectedCallback();
    this.id || (this.id = getRandomId(this.localName));
    this.addEventListener("click", __classPrivateFieldGet(this, _RhTab_instances, "m", _RhTab_onClick));
    this.addEventListener("keydown", __classPrivateFieldGet(this, _RhTab_instances, "m", _RhTab_onKeydown));
    this.addEventListener("focus", __classPrivateFieldGet(this, _RhTab_instances, "m", _RhTab_onFocus));
  }
  render() {
    const { on = "light" } = this;
    const active = this.ctx?.activeTab === this;
    const { box = false, vertical = false, firstTab, lastTab } = this.ctx ?? {};
    const first = firstTab === this;
    const last = lastTab === this;
    return html`
      <div id="button"
           part="button"
           ?disabled="${this.disabled}"
           class="${classMap({ active, box, vertical, first, last, on: true, [on]: true })}">
        <slot name="icon"
              part="icon"
              ?hidden="${!this.icons.length}"
              @slotchange="${() => this.requestUpdate()}"></slot>
        <slot part="text"></slot>
      </div>
    `;
  }
  activeChanged(old) {
    __classPrivateFieldGet(this, _RhTab_internals, "f").ariaSelected = String(!!this.active);
    if (this.active && !old) {
      __classPrivateFieldGet(this, _RhTab_instances, "m", _RhTab_activate).call(this);
    }
  }
  /**
   * if a tab is disabled, then it is also aria-disabled
   * if a tab is removed from disabled its not necessarily
   * not still aria-disabled so we don't remove the aria-disabled
   */
  disabledChanged() {
    __classPrivateFieldGet(this, _RhTab_internals, "f").ariaDisabled = String(!!this.disabled);
  }
};
_RhTab_internals = /* @__PURE__ */ new WeakMap();
_RhTab_instances = /* @__PURE__ */ new WeakSet();
_RhTab_onClick = function _RhTab_onClick2() {
  if (!this.disabled && __classPrivateFieldGet(this, _RhTab_internals, "f").ariaDisabled !== "true" && this.ariaDisabled !== "true") {
    __classPrivateFieldGet(this, _RhTab_instances, "m", _RhTab_activate).call(this);
    if (InternalsController.isSafari) {
      this.focus();
    }
  }
};
_RhTab_onFocus = function _RhTab_onFocus2() {
  if (!this.ctx?.manual && !this.disabled) {
    __classPrivateFieldGet(this, _RhTab_instances, "m", _RhTab_activate).call(this);
  }
};
_RhTab_onKeydown = function _RhTab_onKeydown2(event) {
  if (!this.disabled) {
    switch (event.key) {
      case "Enter":
        __classPrivateFieldGet(this, _RhTab_instances, "m", _RhTab_activate).call(this);
    }
  }
};
_RhTab_activate = function _RhTab_activate2() {
  this.dispatchEvent(new TabExpandEvent(this.active, this));
};
RhTab.styles = [styles];
__decorate([
  property({ reflect: true, type: Boolean })
], RhTab.prototype, "active", void 0);
__decorate([
  property({ reflect: true, type: Boolean })
], RhTab.prototype, "disabled", void 0);
__decorate([
  consume({ context, subscribe: true }),
  property({ attribute: false })
], RhTab.prototype, "ctx", void 0);
__decorate([
  colorContextConsumer()
], RhTab.prototype, "on", void 0);
__decorate([
  queryAssignedElements({ slot: "icon", flatten: true })
], RhTab.prototype, "icons", void 0);
__decorate([
  query("#button")
], RhTab.prototype, "button", void 0);
__decorate([
  observes("active")
], RhTab.prototype, "activeChanged", null);
__decorate([
  observes("disabled")
], RhTab.prototype, "disabledChanged", null);
RhTab = __decorate([
  customElement("rh-tab")
], RhTab);

// node_modules/@rhds/elements/elements/rh-tabs/rh-tab-panel.js
var _RhTabPanel_internals;
var styles2 = css`:host{display:block;padding:var(--_panel-padding,var(--rh-space-2xl,32px))}:host([hidden]){display:none!important}#container{display:contents}`;
var RhTabPanel = class RhTabPanel2 extends LitElement {
  constructor() {
    super(...arguments);
    _RhTabPanel_internals.set(this, this.attachInternals());
  }
  connectedCallback() {
    super.connectedCallback();
    this.id || (this.id = getRandomId("rh-tab-panel"));
    this.hidden ?? (this.hidden = true);
    __classPrivateFieldGet(this, _RhTabPanel_internals, "f").role = "tabpanel";
    this.tabIndex = 0;
  }
  render() {
    const { on = "light" } = this;
    return html`
      <div id="container" class="${classMap({ on: true, [on]: true })}">
        <slot></slot>
      </div>
    `;
  }
};
_RhTabPanel_internals = /* @__PURE__ */ new WeakMap();
RhTabPanel.styles = [styles2];
__decorate([
  colorContextConsumer()
], RhTabPanel.prototype, "on", void 0);
RhTabPanel = __decorate([
  customElement("rh-tab-panel")
], RhTabPanel);

// node_modules/@rhds/elements/elements/rh-tabs/rh-tabs.js
var _RhTabs_instances;
var _RhTabs_ctx_get;
var _RhTabs_activeIndex;
var _RhTabs_overflow;
var _RhTabs_tabs;
var _RhTabs_tabindex;
var _RhTabs_dir;
var _RhTabs_firstTab_get;
var _RhTabs_lastTab_get;
var _RhTabs_onSlotchange;
var _RhTabs_onExpand;
var styles3 = css`:host{display:block;background:var(--rh-color-surface);color:var(--rh-color-text-primary);container-name:host;container-type:inline-size}[part=tabs-container]{--_tab-max-width:200px;position:relative;display:flex;overflow:hidden}@container host (min-width: 768px){[part=tabs-container]{--_tab-max-width:none}}[part=tabs-container]:before{position:absolute;inset-inline-end:0;inset:0;border-width:0 0 var(--rh-border-width-sm,1px);border-color:var(--_border-color);border-style:solid}:is([part=tabs],[part=panels]){display:block}[part=tabs]{scrollbar-width:none;position:relative;max-width:100%;overflow-x:auto;display:flex;bottom:0;margin:0;width:auto;font-size:var(--rh-font-size-body-text-md,1rem)}:is([part=tabs-container],[part=tabs],button):before{position:absolute;inset-block-end:0;inset-inline:0;content:"";border-style:solid}:is([part=tabs],button):before{top:0}#tablist{display:contents}[part=tabs]:before,button{border:0}button{flex:none;line-height:1;opacity:1}button:before{border-block-start-width:0}button:first-of-type{margin-inline-end:0;translate:0 0}button:nth-of-type(2){margin-inline-start:0;translate:0 0}button:disabled{pointer-events:none}#rhds-container{display:contents;--_border-color:var(--rh-tabs-border-color,var(--rh-color-border-subtle));--_arrow-color:var(--rh-color-accent-base);--_overflow-button-text-color:var(--rh-color-text-secondary);--_overflow-button-disabled-text-color:var(--rh-color-gray-40,#a3a3a3);--_overflow-button-hover-text-color:var(--rh-color-text-primary)}@container (min-width: 768px){#rhds-container{--_panel-padding:var(--rh-space-2xl,32px)}}@container host (min-width: 768px){#rhds-container.vertical [part=container]{display:grid;grid-template-columns:max-content 1fr;grid-template-areas:"tabs panels"}#rhds-container.vertical [part=tabs-container]{grid-area:tabs;display:inline-flex;flex-direction:column;height:100%;padding:0;overflow:visible}#rhds-container.vertical [part=tabs-container]:before{height:100%;border-block-end-width:0;border-inline-start-width:var(--rh-border-width-sm,1px)}#rhds-container.vertical [part=panels]{grid-area:panels}#rhds-container.vertical [part=tabs]{flex-direction:column;flex-grow:1;max-width:15.625rem}#rhds-container.vertical.box{--_panel-padding:var(--rh-space-3xl,48px)}#rhds-container.vertical.box [part=tabs-container]:before{border-inline-start-width:0;border-inline-end-width:var(--rh-border-width-sm,1px)}}#rhds-container .overflow[part=container]{--_panel-padding:var(--rh-space-lg,16px)}#rhds-container.box.inset:not(.vertical) [part=container]:not(.overflow){--_panel-padding:var(--rh-space-2xl,32px) var(--rh-space-4xl,64px)}#rhds-container.dark{--_border-color:var(--rh-tabs-border-color,var(--rh-color-border-subtle));--_arrow-color:var(--rh-color-accent-base);--_overflow-button-text-color:var(--rh-color-text-secondary);--_overflow-button-disabled-text-color:var(--rh-color-gray-50,#707070);--_overflow-button-hover-text-color:var(--rh-color-text-primary)}.overflow[part=container] [part=tabs]{--_inset-inline-margin:0;position:relative;inset-inline-start:-1px;z-index:1}.overflow[part=container] [part=panels]{--_panels-overflow-padding:var(--rh-space-2xl,32px)}:host([box=inset]:not([vertical])) [part=tabs]{--_inset-inline-margin:var(--rh-space-2xl,32px)}:host(:is([centered],[box=inset])) [part=container]:not(.overflow) [part=tabs]{margin-inline:var(--rh-tabs-inset,var(--_inset-inline-margin,auto))}:is(#previous-tab,#next-tab){padding-block:0;padding-inline:var(--rh-space-lg,16px);background-color:var(--rh-color-surface);color:var(--_overflow-button-text-color);position:relative;z-index:2}:is(#previous-tab,#next-tab):before{border-block-start:var(--rh-border-width-sm,1px) solid #0000;border-block-end:var(--rh-border-width-sm,1px) solid var(--_border-color);border-inline:var(--rh-border-width-sm,1px) solid var(--_border-color)}:is(#previous-tab,#next-tab):hover{color:var(--_overflow-button-hover-text-color,var(--rh-color-text-primary))}:is(#previous-tab,#next-tab):hover:before{border-block-end:var(--rh-border-width-lg,3px) solid var(--_border-color)}:is(#previous-tab,#next-tab):disabled{color:var(--_overflow-button-disabled-text-color)}#next-tab{inset-inline-start:-1px}#next-tab:before{border-inline-width:1px 0}#previous-tab:before{border-inline-width:0 1px}.rtl :is(#previous-tab,#next-tab) rh-icon{rotate:180deg}`;
var RhTabs = class RhTabs2 extends LitElement {
  constructor() {
    super(...arguments);
    _RhTabs_instances.add(this);
    this.labelScrollLeft = "Scroll left";
    this.labelScrollRight = "Scroll right";
    this.manual = false;
    this.centered = false;
    this.vertical = false;
    _RhTabs_activeIndex.set(this, -1);
    _RhTabs_overflow.set(this, new OverflowController(this));
    _RhTabs_tabs.set(this, new TabsAriaController(this, {
      isTab: (x) => x.localName === "rh-tab",
      isPanel: (x) => x.localName === "rh-tab-panel",
      isActiveTab: (x) => x.active
    }));
    _RhTabs_tabindex.set(this, RovingTabindexController.of(this, {
      getItemsContainer: () => this.tabList,
      getItems: () => this.tabs ?? []
    }));
    _RhTabs_dir.set(this, new DirController(this));
    this.ctx = __classPrivateFieldGet(this, _RhTabs_instances, "a", _RhTabs_ctx_get);
  }
  /**
   * Index of the active tab
   */
  get activeIndex() {
    return __classPrivateFieldGet(this, _RhTabs_activeIndex, "f");
  }
  set activeIndex(v) {
    __classPrivateFieldGet(this, _RhTabs_tabindex, "f").atFocusedItemIndex = v;
    __classPrivateFieldSet(this, _RhTabs_activeIndex, v, "f");
    this.activeTab = this.tabs[v];
    for (const tab of this.tabs) {
      if (!this.activeTab?.disabled) {
        tab.active = tab === this.activeTab;
      }
      __classPrivateFieldGet(this, _RhTabs_tabs, "f").panelFor(tab)?.toggleAttribute("hidden", !tab.active);
    }
  }
  get canShowScrollButtons() {
    return !this.vertical;
  }
  get tabs() {
    return __classPrivateFieldGet(this, _RhTabs_tabs, "f").tabs;
  }
  get panels() {
    return this.tabs.map((tab) => __classPrivateFieldGet(this, _RhTabs_tabs, "f").panelFor(tab));
  }
  connectedCallback() {
    super.connectedCallback();
    this.id || (this.id = getRandomId(this.localName));
    this.addEventListener("expand", __classPrivateFieldGet(this, _RhTabs_instances, "m", _RhTabs_onExpand));
    this.activeIndex = __classPrivateFieldGet(this, _RhTabs_tabindex, "f").atFocusedItemIndex;
  }
  willUpdate() {
    if (!this.manual && this.activeIndex !== __classPrivateFieldGet(this, _RhTabs_tabindex, "f").atFocusedItemIndex) {
      this.activeIndex = __classPrivateFieldGet(this, _RhTabs_tabindex, "f").atFocusedItemIndex;
    }
    this.ctx = __classPrivateFieldGet(this, _RhTabs_instances, "a", _RhTabs_ctx_get);
  }
  async firstUpdated() {
    this.tabList.addEventListener("scroll", __classPrivateFieldGet(this, _RhTabs_overflow, "f").onScroll.bind(this));
    if (this.tabs.length && this.activeIndex === -1) {
      this.select(this.tabs.findIndex((x) => !x.disabled));
    }
    __classPrivateFieldGet(this, _RhTabs_instances, "m", _RhTabs_onSlotchange).call(this);
  }
  render() {
    const { on = "", vertical = false, box = false, centered = false } = this;
    const inset = this.box === "inset" ? "inset" : "";
    const rtl = __classPrivateFieldGet(this, _RhTabs_dir, "f").dir === "rtl";
    return html`
      <div id="rhds-container" class="${classMap({ on: true, [on]: !!on, rtl, vertical, box, inset, centered })}">
        <div part="container" class="${classMap({ overflow: __classPrivateFieldGet(this, _RhTabs_overflow, "f").showScrollButtons })}">
          <div part="tabs-container">${!__classPrivateFieldGet(this, _RhTabs_overflow, "f").showScrollButtons ? "" : html`
            <button id="previous-tab" tabindex="-1"
                    aria-label="${this.getAttribute("label-scroll-left") ?? "Scroll left"}"
                    ?disabled="${!__classPrivateFieldGet(this, _RhTabs_overflow, "f").overflowLeft}"
                    @click="${() => !rtl ? __classPrivateFieldGet(this, _RhTabs_overflow, "f").scrollLeft() : __classPrivateFieldGet(this, _RhTabs_overflow, "f").scrollRight()}">
              <rh-icon set="ui" icon="caret-left" loading="eager"></rh-icon>
            </button>`}
            <div id="tablist" role="tablist">
              <slot name="tab"
                    part="tabs"
                    @slotchange="${__classPrivateFieldGet(this, _RhTabs_instances, "m", _RhTabs_onSlotchange)}"></slot>
            </div>${!__classPrivateFieldGet(this, _RhTabs_overflow, "f").showScrollButtons ? "" : html`
            <button id="next-tab"
                    tabindex="-1"
                    aria-label="${this.getAttribute("label-scroll-right") ?? "Scroll right"}"
                    ?disabled="${!__classPrivateFieldGet(this, _RhTabs_overflow, "f").overflowRight}"
                    @click="${() => !rtl ? __classPrivateFieldGet(this, _RhTabs_overflow, "f").scrollRight() : __classPrivateFieldGet(this, _RhTabs_overflow, "f").scrollLeft()}">
               <rh-icon set="ui" icon="caret-right" loading="eager"></rh-icon>
            </button>`}
          </div>
          <slot part="panels" @slotchange="${__classPrivateFieldGet(this, _RhTabs_instances, "m", _RhTabs_onSlotchange)}"></slot>
        </div>
      </div>
    `;
  }
  activeTabChanged(old, activeTab) {
    if (activeTab?.disabled) {
      this.activeIndex = 0;
    }
    if (activeTab) {
      this.activeIndex = this.tabs.indexOf(activeTab);
    }
  }
  select(option) {
    if (typeof option === "number") {
      this.activeIndex = option;
    } else {
      this.activeIndex = __classPrivateFieldGet(this, _RhTabs_tabindex, "f").items.indexOf(option);
    }
    __classPrivateFieldGet(this, _RhTabs_overflow, "f").update();
  }
};
_RhTabs_activeIndex = /* @__PURE__ */ new WeakMap();
_RhTabs_overflow = /* @__PURE__ */ new WeakMap();
_RhTabs_tabs = /* @__PURE__ */ new WeakMap();
_RhTabs_tabindex = /* @__PURE__ */ new WeakMap();
_RhTabs_dir = /* @__PURE__ */ new WeakMap();
_RhTabs_instances = /* @__PURE__ */ new WeakSet();
_RhTabs_ctx_get = function _RhTabs_ctx_get2() {
  const { activeTab, manual, vertical } = this;
  const box = this.box === null || this.box === "" ? "box" : this.box;
  const firstTab = __classPrivateFieldGet(this, _RhTabs_instances, "a", _RhTabs_firstTab_get);
  const lastTab = __classPrivateFieldGet(this, _RhTabs_instances, "a", _RhTabs_lastTab_get);
  return { activeTab, box, firstTab, lastTab, manual, vertical };
};
_RhTabs_firstTab_get = function _RhTabs_firstTab_get2() {
  const [tab] = this.tabs;
  return tab;
};
_RhTabs_lastTab_get = function _RhTabs_lastTab_get2() {
  return this.tabs.at(-1);
};
_RhTabs_onSlotchange = function _RhTabs_onSlotchange2() {
  __classPrivateFieldGet(this, _RhTabs_overflow, "f").init(this.tabList, this.tabs);
};
_RhTabs_onExpand = function _RhTabs_onExpand2(event) {
  if (event instanceof TabExpandEvent && !event.defaultPrevented && this.tabs.includes(event.tab)) {
    this.select(event.tab);
  }
};
RhTabs.styles = [styles3];
__decorate([
  property({ reflect: true, attribute: "label-scroll-left" })
], RhTabs.prototype, "labelScrollLeft", void 0);
__decorate([
  property({ reflect: true, attribute: "label-scroll-right" })
], RhTabs.prototype, "labelScrollRight", void 0);
__decorate([
  property({ reflect: true, type: Boolean })
], RhTabs.prototype, "manual", void 0);
__decorate([
  property({ attribute: "active-index", type: Number })
], RhTabs.prototype, "activeIndex", null);
__decorate([
  property({ attribute: false })
], RhTabs.prototype, "activeTab", void 0);
__decorate([
  colorContextConsumer()
], RhTabs.prototype, "on", void 0);
__decorate([
  colorContextProvider(),
  property({ reflect: true, attribute: "color-palette" })
], RhTabs.prototype, "colorPalette", void 0);
__decorate([
  property({ reflect: true, type: Boolean })
], RhTabs.prototype, "centered", void 0);
__decorate([
  property({ reflect: true })
], RhTabs.prototype, "box", void 0);
__decorate([
  property({ reflect: true, type: Boolean })
], RhTabs.prototype, "vertical", void 0);
__decorate([
  query('[part="tabs"]')
], RhTabs.prototype, "tabList", void 0);
__decorate([
  provide({ context })
], RhTabs.prototype, "ctx", void 0);
__decorate([
  observes("activeTab")
], RhTabs.prototype, "activeTabChanged", null);
RhTabs = __decorate([
  customElement("rh-tabs")
], RhTabs);
export {
  RhTab,
  RhTabs
};
/*! Bundled license information:

@lit/context/development/lib/context-request-event.js:
  (**
   * @license
   * Copyright 2021 Google LLC
   * SPDX-License-Identifier: BSD-3-Clause
   *)

@lit/context/development/lib/create-context.js:
  (**
   * @license
   * Copyright 2021 Google LLC
   * SPDX-License-Identifier: BSD-3-Clause
   *)

@lit/context/development/lib/controllers/context-consumer.js:
  (**
   * @license
   * Copyright 2021 Google LLC
   * SPDX-License-Identifier: BSD-3-Clause
   *)

@lit/context/development/lib/value-notifier.js:
  (**
   * @license
   * Copyright 2021 Google LLC
   * SPDX-License-Identifier: BSD-3-Clause
   *)

@lit/context/development/lib/controllers/context-provider.js:
  (**
   * @license
   * Copyright 2021 Google LLC
   * SPDX-License-Identifier: BSD-3-Clause
   *)

@lit/context/development/lib/context-root.js:
  (**
   * @license
   * Copyright 2021 Google LLC
   * SPDX-License-Identifier: BSD-3-Clause
   *)

@lit/context/development/lib/decorators/provide.js:
  (**
   * @license
   * Copyright 2017 Google LLC
   * SPDX-License-Identifier: BSD-3-Clause
   *)

@lit/context/development/lib/decorators/consume.js:
  (**
   * @license
   * Copyright 2022 Google LLC
   * SPDX-License-Identifier: BSD-3-Clause
   *)

@lit/context/development/index.js:
  (**
   * @license
   * Copyright 2021 Google LLC
   * SPDX-License-Identifier: BSD-3-Clause
   *)

@lit/reactive-element/development/decorators/query-assigned-elements.js:
  (**
   * @license
   * Copyright 2021 Google LLC
   * SPDX-License-Identifier: BSD-3-Clause
   *)
*/
//# sourceMappingURL=@rhds_elements_rh-tabs_rh-tabs__js.js.map