@sebgroup/green-core 1.18.1 → 1.20.0

package/chunks/chunk.YEV6STTM.js

@@ -0,0 +1,201 @@
+import {
+  resizeObserver
+} from "./chunk.VHN4JEZC.js";
+import {
+  stringArrayConverter
+} from "./chunk.C3ECHGX7.js";
+import {
+  GdsFormControlElement
+} from "./chunk.XOARVFGN.js";
+import {
+  watch
+} from "./chunk.2WO4NHJ2.js";
+import {
+  gdsCustomElement,
+  html
+} from "./chunk.VOYMQ322.js";
+import {
+  __decorateClass,
+  __privateAdd,
+  __privateGet,
+  __privateMethod,
+  __privateSet
+} from "./chunk.5VURDMKE.js";
+
+// libs/core/src/components/filter-chips/filter-chips.ts
+import { property, query, state } from "lit/decorators.js";
+import { classMap } from "lit/directives/class-map.js";
+
+// libs/core/src/components/filter-chips/filter-chips.styles.ts
+import { css } from "lit";
+var styles = css`
+  @layer base, reset, transitional-styles;
+  @layer base {
+    :host {
+      display: inline-block;
+      max-width: 100%;
+    }
+
+    .chips {
+      display: flex;
+      flex-wrap: wrap;
+      gap: 0.5rem;
+    }
+
+    .collapse {
+      overflow: auto;
+      scroll-snap-type: both mandatory;
+      overscroll-behavior-x: contain;
+      flex-wrap: nowrap;
+      padding-bottom: 0.5rem;
+      scrollbar-color: rgba(0, 0, 0, 0.5) transparent;
+      scrollbar-width: thin;
+    }
+
+    ::slotted(*) {
+      scroll-snap-align: start;
+      scroll-snap-stop: always;
+    }
+  }
+`;
+
+// libs/core/src/components/filter-chips/filter-chips.ts
+var _handleChipClick, _collapseThreshold, _collapsedAt, _getChipHeight, getChipHeight_fn, _handleSlotChange, handleSlotChange_fn;
+var GdsFilterChips = class extends GdsFormControlElement {
+  constructor() {
+    super(...arguments);
+    __privateAdd(this, _getChipHeight);
+    __privateAdd(this, _handleSlotChange);
+    this.multiple = false;
+    this.label = "";
+    this.rowCollapse = false;
+    this._collapsed = false;
+    __privateAdd(this, _handleChipClick, (event) => {
+      const clickedChip = this.chips.find(
+        (s) => s === event.target || s.contains(event.target)
+      );
+      if (clickedChip) {
+        if (this.multiple && Array.isArray(this.value)) {
+          if (clickedChip.selected) {
+            this.value = this.value.filter((v) => v !== clickedChip.value);
+          } else {
+            this.value = [...this.value, clickedChip.value];
+          }
+        } else {
+          this.value = clickedChip.value;
+        }
+        this.dispatchEvent(
+          new CustomEvent("change", {
+            detail: { clickedChip, value: this.value },
+            bubbles: true,
+            composed: true
+          })
+        );
+      }
+    });
+    __privateAdd(this, _collapseThreshold, 3);
+    __privateAdd(this, _collapsedAt, 0);
+  }
+  /**
+   * Returns the chips in the control
+   * @readonly
+   */
+  get chips() {
+    return this._elSlot ? this._elSlot.assignedElements() : [];
+  }
+  render() {
+    const layoutClasses = {
+      collapse: this._collapsed
+    };
+    return html`<div
+      class="chips ${classMap(layoutClasses)}"
+      role="listbox"
+      aria-label=${this.label}
+      aria-multiselectable=${this.multiple}
+    >
+      <slot
+        gds-allow="gds-filter-chip"
+        @click=${__privateGet(this, _handleChipClick)}
+        @slotchange=${__privateMethod(this, _handleSlotChange, handleSlotChange_fn)}
+        role="none"
+      ></slot>
+    </div>`;
+  }
+  _handleResize() {
+    if (!this.rowCollapse)
+      return;
+    const chipHeight = __privateMethod(this, _getChipHeight, getChipHeight_fn).call(this);
+    const selfHeight = this.offsetHeight;
+    const selfWidth = this.offsetWidth;
+    if (selfHeight >= chipHeight * __privateGet(this, _collapseThreshold)) {
+      this._collapsed = true;
+      __privateSet(this, _collapsedAt, selfWidth);
+    }
+    if (selfWidth > __privateGet(this, _collapsedAt)) {
+      this._collapsed = false;
+    }
+  }
+  _updateSelectedFromValue() {
+    if (!this.value)
+      return;
+    if (this.multiple && !Array.isArray(this.value)) {
+      this.value = [this.value];
+    }
+    if (!this.multiple && Array.isArray(this.value)) {
+      this.value = this.value[0];
+    }
+    this.updateComplete.then(() => {
+      this.chips.forEach((chip) => {
+        chip.selected = this.multiple ? this.value.includes(chip.value) : this.value === chip.value;
+      });
+    });
+  }
+};
+_handleChipClick = new WeakMap();
+_collapseThreshold = new WeakMap();
+_collapsedAt = new WeakMap();
+_getChipHeight = new WeakSet();
+getChipHeight_fn = function() {
+  var _a;
+  return ((_a = this.chips[0]) == null ? void 0 : _a.offsetHeight) || 0;
+};
+_handleSlotChange = new WeakSet();
+handleSlotChange_fn = function() {
+  var _a;
+  const selChipValue = (_a = this.chips.find((s) => s.selected)) == null ? void 0 : _a.value;
+  if (selChipValue) {
+    this.value = selChipValue;
+  }
+};
+GdsFilterChips.styles = [styles];
+__decorateClass([
+  property({ converter: stringArrayConverter })
+], GdsFilterChips.prototype, "value", 2);
+__decorateClass([
+  property({ type: Boolean })
+], GdsFilterChips.prototype, "multiple", 2);
+__decorateClass([
+  property()
+], GdsFilterChips.prototype, "label", 2);
+__decorateClass([
+  property({ type: Boolean, attribute: "row-collapse" })
+], GdsFilterChips.prototype, "rowCollapse", 2);
+__decorateClass([
+  state()
+], GdsFilterChips.prototype, "_collapsed", 2);
+__decorateClass([
+  query("slot")
+], GdsFilterChips.prototype, "_elSlot", 2);
+__decorateClass([
+  resizeObserver()
+], GdsFilterChips.prototype, "_handleResize", 1);
+__decorateClass([
+  watch("value")
+], GdsFilterChips.prototype, "_updateSelectedFromValue", 1);
+GdsFilterChips = __decorateClass([
+  gdsCustomElement("gds-filter-chips")
+], GdsFilterChips);
+
+export {
+  GdsFilterChips
+};

package/chunks/{chunk.H7YA5KO4.js → chunk.Z5NACNXH.js}

@@ -1,9 +1,13 @@
+import {
+  dateArrayConverter,
+  dateConverter
+} from "./chunk.C3ECHGX7.js";
 import {
   GdsFormControlElement
-} from "./chunk.YIQIH4RW.js";
+} from "./chunk.XOARVFGN.js";
 import {
   TransitionalStyles
-} from "./chunk.XQ3SZZAO.js";
+} from "./chunk.ZLWSCK7R.js";
 import {
   watch
 } from "./chunk.2WO4NHJ2.js";
@@ -42,22 +46,6 @@ var styles = css`
 `;
 
 // libs/core/src/components/datepicker/datepicker.ts
-var dateConverter = {
-  fromAttribute(value) {
-    return new Date(value);
-  },
-  toAttribute(value) {
-    return value.toISOString();
-  }
-};
-var dateArrayConverter = {
-  fromAttribute(value) {
-    return value.split(",").map((d) => new Date(d.trim()));
-  },
-  toAttribute(value) {
-    return JSON.stringify(value.map((d) => d.toISOString()));
-  }
-};
 var _valueOnOpen, _renderBackToValidRangeButton, renderBackToValidRangeButton_fn, _focusDate, focusDate_fn, _getSpinnerLabel, getSpinnerLabel_fn, _getMinSpinnerValue, getMinSpinnerValue_fn, _getMaxSpinnerValue, getMaxSpinnerValue_fn, _dispatchChangeEvent, dispatchChangeEvent_fn, _dispatchInputEvent, dispatchInputEvent_fn, _handleFieldFocusOut, _handleSpinnerFocus, _handleClipboardCopy, _handleClipboardPaste, _handleFieldClick, _handleCalendarChange, _handleMonthChange, _handleYearChange, _handleIncrementFocusedMonth, _handleDecrementFocusedMonth, _handleCalendarFocusChange, _handlePopoverStateChange, _handleSpinnerKeydown, _parseDateFormat, parseDateFormat_fn, _handleSpinnerChange, _spinnerState, _years, years_get, _isValueOutsideRange, isValueOutsideRange_get;
 var GdsDatepicker = class extends GdsFormControlElement {
   constructor() {
@@ -263,8 +251,7 @@ var GdsDatepicker = class extends GdsFormControlElement {
     TransitionalStyles.instance.apply(this, "gds-datepicker");
   }
   render() {
-    return html`${this._tStyles}
-      ${when(
+    return html`${when(
       this.label && !this.hideLabel,
       () => html`<label for="spinner-0" id="label">${this.label}</label>`
     )}
@@ -637,9 +624,6 @@ __decorateClass([
 __decorateClass([
   query(".input")
 ], GdsDatepicker.prototype, "_elInput", 2);
-__decorateClass([
-  state()
-], GdsDatepicker.prototype, "_tStyles", 2);
 __decorateClass([
   watch("value")
 ], GdsDatepicker.prototype, "_handleValueChange", 1);