import { r as registerInstance, h, f as Host, g as getElement } from './index-e9c7ceaa.js';
import { ElementIDUtils } from '@sankhyalabs/core';

const BOUNDARY_FALSE_POSITIVE_VALUE = 14;
const cardFormResizeObserver = new ResizeObserver((entries) => {
  var _a;
  for (let entry of entries) {
    const children = ((_a = entry === null || entry === void 0 ? void 0 : entry.target) === null || _a === void 0 ? void 0 : _a.children) || [];
    const { parentElement } = (entry === null || entry === void 0 ? void 0 : entry.target) || {};
    if (!(parentElement === null || parentElement === void 0 ? void 0 : parentElement.clientWidth))
      return;
    const limitWidth = parentElement.clientWidth - BOUNDARY_FALSE_POSITIVE_VALUE;
    if (entry.target.hasChildNodes()) {
      const listWidth = [];
      for (const node of children)
        listWidth.push(node);
      listWidth.reduce((total, child) => {
        const totalWidth = total + child.clientWidth;
        if (totalWidth > limitWidth) {
          child.style.visibility = 'hidden';
        }
        else {
          child.style.visibility = 'visible';
        }
        return totalWidth;
      }, 0);
    }
  }
});

const snkFormSummaryCss = ".sc-snk-form-summary-h{display:flex;width:100%;--ez-form-card-summary-field-content-weight:700}.summary-wrapper.sc-snk-form-summary{display:flex;overflow:hidden}.summary-container.sc-snk-form-summary{display:flex;flex-direction:column;padding-right:calc(var(--space--extra-large) / 1.5)}.summary-field.sc-snk-form-summary{min-width:30px;max-width:200px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.summary-field__title.sc-snk-form-summary{color:var(--text--primary, #626e82);font-size:var(--title--small);white-space:nowrap;font-weight:var(--text-weight--medium)}.summary-field__content.sc-snk-form-summary{color:var(--title--primary, #2b3a54);font-size:var(--text--large);font-weight:var(--ez-form-card-summary-field-content-weight)}";

const SnkFormSummary = class {
  constructor(hostRef) {
    registerInstance(this, hostRef);
    this.fixed = false;
    this.contracted = false;
    this.summary = undefined;
  }
  componentDidRender() {
    cardFormResizeObserver.disconnect();
    if (this._summaryElement) {
      cardFormResizeObserver.observe(this._summaryElement);
    }
  }
  disconnectedCallback() {
    cardFormResizeObserver.disconnect();
  }
  render() {
    ElementIDUtils.addIDInfoIfNotExists(this._elem, 'ezFormCard');
    return (h(Host, null, h("div", { ref: el => this._summaryElement = el, class: "summary-wrapper" }, Object.entries(this.summary).map(([key, value]) => h("div", { class: "summary-container", title: `${key}: ${value}` }, h("label", { class: "ez-text summary-field summary-field__title" }, key), h("label", { class: " ez-text summary-field summary-field__content" }, value))))));
  }
  get _elem() { return getElement(this); }
};
SnkFormSummary.style = snkFormSummaryCss;

export { SnkFormSummary as snk_form_summary };
