@sebgroup/green-core 1.15.0 → 1.16.0

package/chunks/chunk.TN6ZYAH3.js

@@ -0,0 +1,74 @@
+import {
+  constrainSlots
+} from "./chunk.6NM7ENKA.js";
+import {
+  __decorateClass,
+  __privateAdd,
+  __privateSet
+} from "./chunk.5VURDMKE.js";
+
+// libs/core/src/components/radio/radio-group.ts
+import { LitElement, html } from "lit";
+import { customElement, property } from "lit/decorators.js";
+var _internals;
+var GdsRadioGroup = class extends LitElement {
+  constructor() {
+    super();
+    // Private members
+    __privateAdd(this, _internals, void 0);
+    this.label = "Label";
+    this.inputElement = null;
+    this.exludeAttr = ["id", "label"];
+    __privateSet(this, _internals, this.attachInternals());
+    constrainSlots(this);
+  }
+  reflectAttributesToInput() {
+    if (this.inputElement) {
+      const attributes = this.attributes;
+      for (let i = 0; i < attributes.length; i++) {
+        const attribute = attributes[i];
+        if (!this.exludeAttr.includes(attribute.name)) {
+          this.inputElement.setAttribute(attribute.name, attribute.value);
+        }
+      }
+    }
+  }
+  update(changedProperties) {
+    var _a;
+    super.update(changedProperties);
+    if (!this.inputElement) {
+      this.inputElement = (_a = this.shadowRoot) == null ? void 0 : _a.getElementById(
+        "radio"
+      );
+    }
+    this.reflectAttributesToInput();
+  }
+  render() {
+    return html`
+      <fieldset
+        class="gds-radio-group"
+        role="radiogroup"
+        aria-labelledby="label"
+      >
+        <label>${this.label}</label>
+        <slot></slot>
+      </fieldset>
+    `;
+  }
+};
+_internals = new WeakMap();
+// static styles = unsafeCSS(styles)
+GdsRadioGroup.shadowRootOptions = {
+  mode: "open",
+  delegatesFocus: true
+};
+__decorateClass([
+  property({ type: String, reflect: true, attribute: "label" })
+], GdsRadioGroup.prototype, "label", 2);
+GdsRadioGroup = __decorateClass([
+  customElement("gds-radio-group")
+], GdsRadioGroup);
+
+export {
+  GdsRadioGroup
+};

package/chunks/chunk.VOYMQ322.js

@@ -0,0 +1,61 @@
+// libs/core/src/utils/helpers/custom-element-scoping.ts
+import { html as litHtml } from "lit";
+import { customElement } from "lit/decorators.js";
+var VER_SUFFIX = "-482aa6";
+var elementLookupTable = /* @__PURE__ */ new Map();
+var gdsCustomElement = (tagName) => {
+  if (globalThis.GDS_DISABLE_VERSIONED_ELEMENTS) {
+    elementLookupTable.set(tagName, tagName);
+    return customElement(tagName);
+  }
+  const versionedTagName = tagName + VER_SUFFIX;
+  elementLookupTable.set(tagName, versionedTagName);
+  if (customElements.get(versionedTagName))
+    return (_classOrDescriptor) => false;
+  return customElement(versionedTagName);
+};
+var templateCache = /* @__PURE__ */ new WeakMap();
+function applyElementScoping(strings, ...values) {
+  let modstrings = templateCache.get(strings);
+  if (!modstrings) {
+    modstrings = replaceTags(strings);
+    modstrings.raw = replaceTags(strings.raw);
+    templateCache.set(strings, modstrings);
+  }
+  return [modstrings, ...values];
+}
+var replaceTags = (inStr) => inStr.map((s) => {
+  for (const [key, value] of elementLookupTable.entries()) {
+    s = s.replace(new RegExp(`${key}(?![-a-z])`, "mg"), value);
+  }
+  return s;
+});
+function htmlTemplateTagFactory(extendedTag) {
+  return (strings, ...values) => {
+    if (globalThis.GDS_DISABLE_VERSIONED_ELEMENTS) {
+      return extendedTag(strings, ...values);
+    }
+    const [modstrings, ...modvalues] = applyElementScoping(strings, ...values);
+    return extendedTag(modstrings, ...modvalues);
+  };
+}
+var html = htmlTemplateTagFactory(litHtml);
+function getScopedTagName(tagName) {
+  var _a;
+  return (_a = elementLookupTable.get(tagName)) != null ? _a : tagName;
+}
+function getUnscopedTagName(tagName) {
+  var _a;
+  return (_a = [...elementLookupTable.entries()].find(
+    ([, value]) => value === tagName
+  )) == null ? void 0 : _a[0];
+}
+
+export {
+  VER_SUFFIX,
+  gdsCustomElement,
+  htmlTemplateTagFactory,
+  html,
+  getScopedTagName,
+  getUnscopedTagName
+};

package/chunks/chunk.VYK7D6QO.js

@@ -0,0 +1,64 @@
+import {
+  Focusable,
+  option_styles_default
+} from "./chunk.2ND5EWHE.js";
+import {
+  TransitionalStyles
+} from "./chunk.QONSFT2N.js";
+import {
+  GdsElement
+} from "./chunk.2LQSDOD4.js";
+import {
+  gdsCustomElement,
+  html
+} from "./chunk.VOYMQ322.js";
+import {
+  __decorateClass,
+  __privateAdd,
+  __privateGet
+} from "./chunk.5VURDMKE.js";
+
+// libs/core/src/primitives/menu/menu-item.ts
+import { state } from "lit/decorators.js";
+var _handleOnClick;
+var GdsMenuItem = class extends Focusable(GdsElement) {
+  constructor() {
+    super(...arguments);
+    __privateAdd(this, _handleOnClick, () => {
+      this.dispatchEvent(
+        new CustomEvent("gds-menu-item-click", {
+          bubbles: true,
+          composed: true
+        })
+      );
+    });
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.setAttribute("role", "menuitem");
+    this.addEventListener("keydown", (e) => {
+      if (e.key !== "Enter" && e.key !== " ")
+        return;
+      e.preventDefault();
+      this.click();
+    });
+    this.addEventListener("click", __privateGet(this, _handleOnClick));
+    TransitionalStyles.instance.apply(this, "gds-option");
+  }
+  render() {
+    return html`${this._tStyles}
+      <div><slot></slot></div>`;
+  }
+};
+_handleOnClick = new WeakMap();
+GdsMenuItem.styles = [option_styles_default];
+__decorateClass([
+  state()
+], GdsMenuItem.prototype, "_tStyles", 2);
+GdsMenuItem = __decorateClass([
+  gdsCustomElement("gds-menu-item")
+], GdsMenuItem);
+
+export {
+  GdsMenuItem
+};

package/chunks/chunk.WDZ2JTCP.js

@@ -0,0 +1,360 @@
+import {
+  TransitionalStyles
+} from "./chunk.QONSFT2N.js";
+import {
+  watchMediaQuery
+} from "./chunk.WM7HBMMV.js";
+import {
+  GdsElement
+} from "./chunk.2LQSDOD4.js";
+import {
+  watch
+} from "./chunk.2WO4NHJ2.js";
+import {
+  gdsCustomElement
+} from "./chunk.VOYMQ322.js";
+import {
+  __decorateClass,
+  __privateAdd,
+  __privateGet,
+  __privateMethod,
+  __privateSet
+} from "./chunk.5VURDMKE.js";
+
+// libs/core/src/primitives/popover/popover.ts
+import { html, unsafeCSS } from "lit";
+import { property, state } from "lit/decorators.js";
+import { classMap } from "lit/directives/class-map.js";
+import { msg } from "@lit/localize";
+import { createRef, ref } from "lit/directives/ref.js";
+import {
+  computePosition,
+  autoUpdate,
+  offset,
+  flip
+} from "@floating-ui/dom";
+
+// libs/core/src/primitives/popover/popover.styles.ts
+import { css } from "lit";
+var style = css`
+  @layer base, reset, transitional-styles;
+  @layer base {
+    :host([open]) dialog {
+      opacity: 1;
+      box-sizing: border-box;
+      transform: translate3d(0, 0, 0);
+      visibility: visible;
+    }
+
+    dialog {
+      inset: auto;
+      position: fixed;
+      overflow: hidden;
+      padding: 0px;
+      box-sizing: border-box;
+      right: 0;
+      margin: 0;
+      box-shadow:
+        0 0 0 1px rgba(0, 0, 0, 0.2),
+        0 1rem 28px rgba(0, 0, 0, 0.15);
+      border-width: 0;
+      border-radius: 0.5rem;
+    }
+
+    header {
+      display: none;
+    }
+
+    dialog::backdrop {
+      background-color: transparent;
+      display: block;
+      position: fixed;
+    }
+  }
+`;
+var popover_styles_default = style;
+
+// libs/core/src/primitives/popover/popover.ts
+var _dialogElementRef, _autoPositionCleanupFn, _isMobileViewport, _dispatchUiStateEvent, _handleCloseButton, _registerTriggerEvents, registerTriggerEvents_fn, _unregisterTriggerEvents, unregisterTriggerEvents_fn, _registerAutoPositioning, registerAutoPositioning_fn, _triggerKeyDownListener, _focusFirstSlottedChild, _clickOutsideListener;
+var GdsPopover = class extends GdsElement {
+  constructor() {
+    super(...arguments);
+    __privateAdd(this, _registerTriggerEvents);
+    __privateAdd(this, _unregisterTriggerEvents);
+    __privateAdd(this, _registerAutoPositioning);
+    this.open = false;
+    this.triggerRef = Promise.resolve(void 0);
+    this.label = void 0;
+    this.placement = "bottom-start";
+    this.calcMinWidth = (referenceEl) => `${referenceEl.offsetWidth}px`;
+    this.calcMaxWidth = (_referenceEl) => `auto`;
+    this.calcMinHeight = (referenceEl) => `auto`;
+    this.calcMaxHeight = (_referenceEl) => `500px`;
+    this._trigger = void 0;
+    this._isVirtKbVisible = false;
+    // A reference to the dialog element used to make the popover modal
+    __privateAdd(this, _dialogElementRef, createRef());
+    // A function that removes the Floating UI auto positioning. This gets called when we switch to mobile view layout.
+    __privateAdd(this, _autoPositionCleanupFn, void 0);
+    __privateAdd(this, _isMobileViewport, false);
+    __privateAdd(this, _dispatchUiStateEvent, (reason) => {
+      this.dispatchEvent(
+        new CustomEvent("gds-ui-state", {
+          detail: { open: this.open, reason },
+          bubbles: false,
+          composed: false
+        })
+      );
+    });
+    __privateAdd(this, _handleCloseButton, (e) => {
+      e.stopPropagation();
+      e.preventDefault();
+      this.open = false;
+      __privateGet(this, _dispatchUiStateEvent).call(this, "close");
+      setTimeout(() => {
+        var _a;
+        return (_a = this._trigger) == null ? void 0 : _a.focus();
+      }, 250);
+    });
+    /**
+     * ArrowDown on the trigger element will trigger the popover by default, and escape will close it.
+     */
+    __privateAdd(this, _triggerKeyDownListener, (e) => {
+      if (e.key === "ArrowDown") {
+        e.preventDefault();
+        this.open = true;
+        __privateGet(this, _dispatchUiStateEvent).call(this, "show");
+      }
+      if (e.key === "Escape") {
+        this.open = false;
+        __privateGet(this, _dispatchUiStateEvent).call(this, "cancel");
+      }
+    });
+    /**
+     * Move focus to the first slotted child.
+     */
+    __privateAdd(this, _focusFirstSlottedChild, () => {
+      var _a, _b;
+      const firstSlottedChild = (_b = (_a = this.shadowRoot) == null ? void 0 : _a.querySelector("slot")) == null ? void 0 : _b.assignedElements()[0];
+      this.updateComplete.then(() => {
+        firstSlottedChild == null ? void 0 : firstSlottedChild.focus();
+      });
+    });
+    __privateAdd(this, _clickOutsideListener, (evt) => {
+      const e = evt;
+      const dialog = __privateGet(this, _dialogElementRef).value;
+      const isNotEnterKey = e.clientX > 0 || e.clientY > 0;
+      if (isNotEnterKey && dialog && this.open) {
+        const rect = dialog.getBoundingClientRect();
+        const isInDialog = rect.top <= e.clientY && e.clientY <= rect.top + rect.height && rect.left <= e.clientX && e.clientX <= rect.left + rect.width;
+        if (!isInDialog) {
+          e.stopPropagation();
+          this.open = false;
+          __privateGet(this, _dispatchUiStateEvent).call(this, "close");
+        }
+      }
+    });
+  }
+  _handleTriggerRefChanged() {
+    this.triggerRef.then((el) => {
+      if (el)
+        this._trigger = el;
+    });
+  }
+  _handleTriggerChanged() {
+    __privateMethod(this, _registerTriggerEvents, registerTriggerEvents_fn).call(this);
+    __privateMethod(this, _registerAutoPositioning, registerAutoPositioning_fn).call(this);
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    TransitionalStyles.instance.apply(this, "gds-popover");
+    __privateMethod(this, _registerTriggerEvents, registerTriggerEvents_fn).call(this);
+    this._handleOpenChange();
+    this.addEventListener("keydown", (e) => {
+      if (e.key === "Escape") {
+        this.open = false;
+        __privateGet(this, _dispatchUiStateEvent).call(this, "cancel");
+        e.stopPropagation();
+        e.preventDefault();
+      }
+    });
+    this.addEventListener("focusin", (e) => {
+      const t = e.target;
+      if (t.tagName === "INPUT" || t.tagName === "TEXTAREA") {
+        this._isVirtKbVisible = true;
+      } else {
+        this._isVirtKbVisible = false;
+      }
+    });
+    this.addEventListener("blurin", (_) => {
+      this._isVirtKbVisible = false;
+    });
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    __privateMethod(this, _unregisterTriggerEvents, unregisterTriggerEvents_fn).call(this);
+  }
+  render() {
+    return html`${this._tStyles}
+      <dialog
+        class="${classMap({ "v-kb-visible": this._isVirtKbVisible })}"
+        ${ref(__privateGet(this, _dialogElementRef))}
+      >
+        <header>
+          <h2>${this.label}</h2>
+          <button
+            class="close"
+            @click=${__privateGet(this, _handleCloseButton)}
+            aria-label="${msg("Close")}"
+          >
+            <i></i>
+          </button>
+        </header>
+        <slot></slot>
+      </dialog>`;
+  }
+  _handleOpenChange() {
+    this.setAttribute("aria-hidden", String(!this.open));
+    this.hidden = !this.open;
+    this.updateComplete.then(() => {
+      var _a, _b, _c;
+      if (this.open) {
+        (_a = __privateGet(this, _dialogElementRef).value) == null ? void 0 : _a.showModal();
+        __privateGet(this, _focusFirstSlottedChild).call(this);
+        setTimeout(
+          () => {
+            var _a2;
+            return (_a2 = __privateGet(this, _dialogElementRef).value) == null ? void 0 : _a2.addEventListener(
+              "click",
+              __privateGet(this, _clickOutsideListener)
+            );
+          },
+          0
+        );
+      } else {
+        (_b = __privateGet(this, _dialogElementRef).value) == null ? void 0 : _b.close();
+        (_c = __privateGet(this, _dialogElementRef).value) == null ? void 0 : _c.removeEventListener(
+          "click",
+          __privateGet(this, _clickOutsideListener)
+        );
+      }
+    });
+  }
+  _handleMobileLayout(matches) {
+    var _a, _b, _c, _d;
+    __privateSet(this, _isMobileViewport, matches);
+    if (matches) {
+      (_a = __privateGet(this, _autoPositionCleanupFn)) == null ? void 0 : _a.call(this);
+      (_b = __privateGet(this, _dialogElementRef).value) == null ? void 0 : _b.style.removeProperty("left");
+      (_c = __privateGet(this, _dialogElementRef).value) == null ? void 0 : _c.style.removeProperty("top");
+      (_d = __privateGet(this, _dialogElementRef).value) == null ? void 0 : _d.style.removeProperty("minWidth");
+      this.updateComplete.then(() => {
+        var _a2;
+        if (this.open)
+          (_a2 = __privateGet(this, _dialogElementRef).value) == null ? void 0 : _a2.showModal();
+      });
+    } else {
+      this.updateComplete.then(() => {
+        __privateMethod(this, _registerAutoPositioning, registerAutoPositioning_fn).call(this);
+      });
+    }
+  }
+};
+_dialogElementRef = new WeakMap();
+_autoPositionCleanupFn = new WeakMap();
+_isMobileViewport = new WeakMap();
+_dispatchUiStateEvent = new WeakMap();
+_handleCloseButton = new WeakMap();
+_registerTriggerEvents = new WeakSet();
+registerTriggerEvents_fn = function() {
+  var _a;
+  (_a = this._trigger) == null ? void 0 : _a.addEventListener("keydown", __privateGet(this, _triggerKeyDownListener));
+};
+_unregisterTriggerEvents = new WeakSet();
+unregisterTriggerEvents_fn = function() {
+  var _a, _b;
+  (_a = this._trigger) == null ? void 0 : _a.removeEventListener("keydown", __privateGet(this, _triggerKeyDownListener));
+  (_b = __privateGet(this, _autoPositionCleanupFn)) == null ? void 0 : _b.call(this);
+};
+_registerAutoPositioning = new WeakSet();
+registerAutoPositioning_fn = function() {
+  const referenceEl = this._trigger;
+  const floatingEl = __privateGet(this, _dialogElementRef).value;
+  if (!referenceEl || !floatingEl || __privateGet(this, _isMobileViewport))
+    return;
+  if (__privateGet(this, _autoPositionCleanupFn)) {
+    __privateGet(this, _autoPositionCleanupFn).call(this);
+  }
+  __privateSet(this, _autoPositionCleanupFn, autoUpdate(referenceEl, floatingEl, () => {
+    computePosition(referenceEl, floatingEl, {
+      placement: this.placement,
+      middleware: [offset(8), flip()],
+      strategy: "fixed"
+    }).then(
+      ({ x, y }) => Object.assign(floatingEl.style, {
+        left: `${x}px`,
+        top: `${y}px`,
+        minWidth: this.calcMinWidth(referenceEl),
+        maxWidth: this.calcMaxWidth(referenceEl),
+        minHeight: this.calcMinHeight(referenceEl),
+        maxHeight: this.calcMaxHeight(referenceEl)
+      })
+    );
+  }));
+};
+_triggerKeyDownListener = new WeakMap();
+_focusFirstSlottedChild = new WeakMap();
+_clickOutsideListener = new WeakMap();
+GdsPopover.styles = unsafeCSS(popover_styles_default);
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], GdsPopover.prototype, "open", 2);
+__decorateClass([
+  property()
+], GdsPopover.prototype, "triggerRef", 2);
+__decorateClass([
+  property()
+], GdsPopover.prototype, "label", 2);
+__decorateClass([
+  property()
+], GdsPopover.prototype, "placement", 2);
+__decorateClass([
+  property()
+], GdsPopover.prototype, "calcMinWidth", 2);
+__decorateClass([
+  property()
+], GdsPopover.prototype, "calcMaxWidth", 2);
+__decorateClass([
+  property()
+], GdsPopover.prototype, "calcMinHeight", 2);
+__decorateClass([
+  property()
+], GdsPopover.prototype, "calcMaxHeight", 2);
+__decorateClass([
+  state()
+], GdsPopover.prototype, "_trigger", 2);
+__decorateClass([
+  state()
+], GdsPopover.prototype, "_isVirtKbVisible", 2);
+__decorateClass([
+  watch("triggerRef")
+], GdsPopover.prototype, "_handleTriggerRefChanged", 1);
+__decorateClass([
+  watch("_trigger")
+], GdsPopover.prototype, "_handleTriggerChanged", 1);
+__decorateClass([
+  state()
+], GdsPopover.prototype, "_tStyles", 2);
+__decorateClass([
+  watch("open")
+], GdsPopover.prototype, "_handleOpenChange", 1);
+__decorateClass([
+  watchMediaQuery("(max-width: 576px)")
+], GdsPopover.prototype, "_handleMobileLayout", 1);
+GdsPopover = __decorateClass([
+  gdsCustomElement("gds-popover")
+], GdsPopover);
+
+export {
+  GdsPopover
+};