@progressive-development/pd-forms 0.5.7 → 0.6.1

package/dist/pd-button.js

@@ -1,4 +1,154 @@
-import { PdButton } from "./src/PdButton.js";
-if (!customElements.get("pd-button")) {
-  window.customElements.define("pd-button", PdButton);
-}
+import { css, html } from "lit";
+import { property, customElement } from "lit/decorators.js";
+import { PdBaseUI } from "./pd-base-ui.js";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __decorateClass = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators[i])
+      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result) __defProp(target, key, result);
+  return result;
+};
+let PdButton = class extends PdBaseUI {
+  constructor() {
+    super(...arguments);
+    this.primary = false;
+    this.gradient = false;
+    this.disabled = false;
+    this.text = "Ok";
+  }
+  render() {
+    return html`
+      <div class="button-div" @click=${this._handleClick}>
+        <a ?disabled=${this.disabled}>${this.text}</a>
+      </div>
+    `;
+  }
+  _handleClick() {
+    if (!this.disabled) {
+      this.dispatchEvent(
+        new CustomEvent("button-clicked", {
+          detail: this.value,
+          bubbles: true,
+          composed: true
+        })
+      );
+    }
+  }
+};
+PdButton.styles = [
+  PdBaseUI.styles,
+  css`
+      :host {
+        font-family: var(--pd-default-font-title-family);
+        font-size: var(--pd-button-font-size, 1em);
+        font-weight: var(--pd-button-font-weight, normal);
+        /*        
+         height: 100%;         
+         width: 100%; => Ohne diese Angabe eht die % Angaben icht
+         */
+
+        margin: 0.5rem;
+        margin-left: 0;
+        pointer-events: none;
+      }
+
+      .button-div {
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        width: var(--pd-button-width, 140px);
+        height: var(--pd-button-height, 2rem);
+        border-radius: var(--pd-border-radius, 1px);
+        background-color: var(--pd-button-bg-col, var(--pd-default-dark-col));
+        color: var(--pd-button-font-col, var(--pd-default-bg-col));
+        border: var(--pd-button-border, 0);
+        cursor: pointer;
+        box-shadow: var(--pd-button-box-shadow, none);
+        pointer-events: all;
+      }
+
+      :host(:not([disabled])) .button-div:hover {
+        box-shadow: var(
+          --pd-button-box-shadow-hover,
+          -1px 1px 2px var(--pd-default-dark-col)
+        );
+        background-color: var(
+          --pd-button-bg-col-hover,
+          var(--pd-default-hover-col)
+        );
+        color: var(--pd-button-font-col-hover, var(--pd-default-dark-col));
+        transition: background-color 0.4s ease 0s;
+        --pd-button-border: var(--pd-button-border-hover);
+      }
+
+      :host(:not([disabled])[primary]) .button-div:hover {
+        background-color: var(
+          --pd-button-primary-bg-col-hover,
+          var(--pd-default-hover-col)
+        );
+        color: var(
+          --pd-button-primary-font-col-hover,
+          var(--pd-default-bg-col)
+        );
+      }
+
+      :host([primary]) .button-div {
+        background-color: var(
+          --pd-button-primary-bg-col,
+          var(--pd-default-col)
+        );
+        color: var(--pd-button-primary-font-col, var(--pd-default-bg-col));
+      }
+
+      :host([gradient]) .button-div {
+        background: linear-gradient(
+          to right,
+          var(--my-background-gradient-color, red) 0%,
+          var(--my-background-color, blue) 100%
+        );
+      }
+
+      :host([disabled]) .button-div {
+        cursor: auto;
+        border-color: var(--pd-default-disabled-col);
+        background-color: var(
+          --pd-button-bg-col-disabled,
+          var(--pd-default-disabled-col)
+        );
+        color: var(--pd-button-font-col-disabled, black);
+        --pd-button-border: var(--pd-button-border-disabled);
+      }
+
+      a {
+        display: inline-block;
+        text-decoration: none;
+        white-space: nowrap;
+        margin: 0.5rem;
+        pointer-events: none;
+      }
+    `
+];
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], PdButton.prototype, "primary", 2);
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], PdButton.prototype, "gradient", 2);
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], PdButton.prototype, "disabled", 2);
+__decorateClass([
+  property({ type: String })
+], PdButton.prototype, "text", 2);
+__decorateClass([
+  property({ type: String })
+], PdButton.prototype, "value", 2);
+PdButton = __decorateClass([
+  customElement("pd-button")
+], PdButton);
+export {
+  PdButton
+};

package/dist/pd-checkbox.d.ts

@@ -0,0 +1,14 @@
+import { CSSResultGroup } from 'lit';
+import { PdBaseUIInput } from './pd-base-ui-input';
+export declare class PdCheckbox extends PdBaseUIInput {
+    isSwitch: boolean;
+    private _hasInner;
+    static styles: CSSResultGroup;
+    constructor();
+    firstUpdated(): void;
+    render(): import('lit-html').TemplateResult<1>;
+    private _onClick;
+    private _onKeyPress;
+    private _onLinkClick;
+}
+//# sourceMappingURL=pd-checkbox.d.ts.map

package/dist/pd-checkbox.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"pd-checkbox.d.ts","sourceRoot":"","sources":["../src/pd-checkbox.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqCG;AAEH,OAAO,EAAa,cAAc,EAAE,MAAM,KAAK,CAAC;AAIhD,OAAO,0CAA0C,CAAC;AAElD,OAAO,EAAE,aAAa,EAAoB,MAAM,oBAAoB,CAAC;AAErE,qBACa,UAAW,SAAQ,aAAa;IAE3C,QAAQ,UAAS;IAGjB,OAAO,CAAC,SAAS,CAAS;IAE1B,OAAgB,MAAM,EAAE,cAAc,CAmKpC;;IAOO,YAAY;IAIZ,MAAM;IAuCf,OAAO,CAAC,QAAQ;IAOhB,OAAO,CAAC,WAAW;IAOnB,OAAO,CAAC,YAAY;CAGrB"}

package/dist/pd-checkbox.js

@@ -1,4 +1,251 @@
-import { PdCheckbox } from "./src/PdCheckbox.js";
-if (!customElements.get("pd-checkbox")) {
-  window.customElements.define("pd-checkbox", PdCheckbox);
-}
+import { css, html } from "lit";
+import { property, state, customElement } from "lit/decorators.js";
+import { classMap } from "lit/directives/class-map.js";
+import "@progressive-development/pd-icon/pd-icon";
+import { PdBaseUIInput, INPUT_TYPE_CHECK } from "./pd-base-ui-input.js";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __decorateClass = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators[i])
+      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result) __defProp(target, key, result);
+  return result;
+};
+let PdCheckbox = class extends PdBaseUIInput {
+  constructor() {
+    super();
+    this.isSwitch = false;
+    this._hasInner = false;
+    this._inputType = INPUT_TYPE_CHECK;
+  }
+  firstUpdated() {
+    this._hasInner = this.innerHTML.trim().length > 0;
+  }
+  render() {
+    const checked = this.value === "true";
+    const inputId = `${this.id}Check`;
+    const classMapVal = {
+      disabled: this.disabled,
+      switch: this.isSwitch,
+      readonly: this.readonly,
+      "div-container": true
+    };
+    const aClassMap = {
+      "switch-paddle": this.isSwitch,
+      checkbox: !this.isSwitch,
+      isChecked: checked,
+      isUnchecked: !checked
+    };
+    return html`
+      ${this._renderLabel(inputId)}
+      <div @click=${this._onClick} class=${classMap(classMapVal)}>
+        <a
+          href="#"
+          @click=${this._onLinkClick}
+          @keypress=${this._onKeyPress}
+          class=${classMap(aClassMap)}
+        >
+          <pd-icon
+            icon=${this.isSwitch ? "checkBox" : "checkBoxOnlyCheck"}
+            class="small"
+            ?activeIcon=${checked}
+          ></pd-icon>
+        </a>
+        ${this._hasInner ? html`<span class="label"><slot></slot></span>` : null}
+      </div>
+      ${this._renderErrorMsg()}
+    `;
+  }
+  _onClick(event) {
+    if (this.disabled || this.readonly) return;
+    const checked = this.value === "true";
+    this._handleChangedValue(!checked ? "true" : "false", event);
+  }
+  _onKeyPress(event) {
+    event.preventDefault();
+    if (event.key === " " || event.code === "Space") {
+      this._onClick(event);
+    }
+  }
+  _onLinkClick(event) {
+    event.preventDefault();
+  }
+};
+PdCheckbox.styles = [
+  PdBaseUIInput.styles,
+  css`
+      :host {
+        display: inline-block;
+
+        /* Style for active checkbox => use defaults from pd-icon if no custom properties set */
+        --pd-icon-col-active: var(--pd-cb-col);
+        --pd-icon-col-active-hover: var(--pd-cb-col-hover);
+        --pd-icon-bg-col-active: var(--pd-cb-bg-col);
+        --pd-icon-stroke-col-active: var(--pd-cb-stroke-col);
+        --pd-icon-stroke-col-active-hover: var(--pd-cb-stroke-col-hover);
+
+        /* Style for inactive checkbox */
+        --pd-icon-col: var(--pd-cb-unset-col);
+        --pd-icon-col-hover: var(--pd-cb-unset-col-hover);
+        --pd-icon-bg-col: var(--pd-cb-unset-bg-col);
+        --pd-icon-stroke-col: var(--pd-cb-unset-stroke-col);
+        --pd-icon-stroke-col-hover: var(--pd-cb-unset-stroke-col-hover);
+      }
+
+      /* Switch pd-icon => Prüfen, bei mir musste ich reflect setzten, wird das verwendet? */
+      :host([isSwitch]) {
+        /* derzeit keine Angaben */
+      }
+
+      .div-container {
+        display: flex;
+        align-items: center;
+        cursor: pointer;
+      }
+
+      .div-container.disabled {
+        opacity: 0.5;
+        cursor: auto;
+      }
+
+      .div-container.readonly {
+        cursor: auto;
+      }
+
+      /*
+       * Class checkbox for icon and a element (checkbox case)
+       */
+      .checkbox {
+        display: flex;
+        border-radius: 4px;
+        line-height: 0;
+        align-items: center;
+        justify-content: center;
+        /*
+        Wurde das hier für Border verwendet? Aktuell border in folgendem Element gesetzt
+        background-color: var(--pd-cb-border-col, var(--pd-primary-col, #067394));
+        */
+      }
+
+      .checkbox pd-icon {
+        margin-right: 0.2rem;
+        margin-bottom: 0.2rem;
+        border: 2px solid var(--pd-cb-border-col, var(--pd-default-col));
+        border-radius: var(--pd-cb-border-radius, 3px);
+      }
+
+      .label {
+        margin-left: 0.1rem;
+        color: var(--pd-cb-font-col, var(--pd-default-font-input-col));
+        font-family: var(--pd-default-font-input-family);
+        text-align: left;
+        font-size: var(--pd-default-font-input-size);
+      }
+
+      .readonly .label {
+        color: var(--pd-cb-font-col-readonly, #4d4d4d);
+      }
+
+      .readonly .checkbox pd-icon {
+        border-color: var(--pd-cb-border-col-readonly, transparent);
+      }
+
+      /* Switch styles */
+      .switch {
+        height: var(--pd-cb-switch-height);
+        position: relative;
+        outline: 0;
+        -webkit-user-select: none;
+        -moz-user-select: none;
+        -ms-user-select: none;
+        user-select: none;
+      }
+
+      .switch .label {
+        margin-left: 0.5rem;
+      }
+
+      .switch-paddle {
+        display: inline-block;
+        vertical-align: baseline;
+        margin: 0;
+        position: relative;
+        min-width: 4rem;
+        max-width: 4rem;
+        height: 2rem;
+        border-radius: 0;
+        background: var(--pd-cb-switch-paddle-col, var(--pd-default-col));
+        font-weight: inherit;
+        color: inherit;
+        cursor: pointer;
+      }
+
+      .switch-paddle pd-icon {
+        position: absolute;
+        top: 0;
+        left: 0;
+        display: block;
+        width: 1.5rem;
+        height: 1.5rem;
+        -webkit-transform: translate3d(0, 0, 0);
+        transform: translate3d(0, 0, 0);
+        border: 2px solid var(--pd-cb-border-col, var(--pd-default-col));
+        box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
+        border-radius: var(--pd-cb-border-radius, 4px);
+        -webkit-transition: all 0.25s ease-out;
+        transition: all 0.25s ease-out;
+        content: "";
+      }
+
+      .disabled .switch-paddle {
+        cursor: auto;
+      }
+
+      .readonly .switch-paddle {
+        cursor: auto;
+        max-width: 2rem;
+        min-width: 2rem;
+        background: none;
+
+        /* Prüfen TODO
+        --pd-icon-bg: transparent;
+        --pd-icon-fill: var(--card-dark-red);
+        --pd-icon-fill-hover: var(--pd-icon-fill);
+        --pd-icon-fill-active: var(--card-medium-green);
+        */
+      }
+
+      .readonly .switch-paddle pd-icon {
+        border-color: var(--pd-cb-border-col-readonly, transparent);
+      }
+
+      .readonly .isChecked.switch-paddle pd-icon {
+        transform: translate3d(0, 0, 0);
+        left: 0rem;
+      }
+
+      .isChecked.switch-paddle pd-icon {
+        left: 2.25rem;
+      }
+
+      @media (min-width: 580px) {
+        :host {
+          font-size: 1rem;
+        }
+      }
+    `
+];
+__decorateClass([
+  property({ type: Boolean })
+], PdCheckbox.prototype, "isSwitch", 2);
+__decorateClass([
+  state()
+], PdCheckbox.prototype, "_hasInner", 2);
+PdCheckbox = __decorateClass([
+  customElement("pd-checkbox")
+], PdCheckbox);
+export {
+  PdCheckbox
+};

package/dist/pd-form-container.d.ts

@@ -0,0 +1,25 @@
+import { CSSResultGroup, TemplateResult } from 'lit';
+import { PdBaseUI } from './pd-base-ui.js';
+export declare class PdFormContainer extends PdBaseUI {
+    /**
+     * If true, display info about required fields
+     */
+    requiredFieldInfo: boolean;
+    /**
+     * Optional general error message
+     */
+    commonError: string;
+    /**
+     * Internal: whether all required fields are valid
+     */
+    private _requiredFieldsValid;
+    static styles: CSSResultGroup;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    render(): TemplateResult;
+    private _validateForm;
+    private static _mailIsValid;
+    private static _vatIsValid;
+    private static _phoneIsValid;
+}
+//# sourceMappingURL=pd-form-container.d.ts.map

package/dist/pd-form-container.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"pd-form-container.d.ts","sourceRoot":"","sources":["../src/pd-form-container.ts"],"names":[],"mappings":"AACA;;;;;;;;;GASG;AAEH,OAAO,EAAa,KAAK,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAI1E,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAG3C,qBACa,eAAgB,SAAQ,QAAQ;IAC3C;;OAEG;IAEH,iBAAiB,UAAS;IAE1B;;OAEG;IAEH,WAAW,SAAM;IAEjB;;OAEG;IAEH,OAAO,CAAC,oBAAoB,CAAQ;IAEpC,OAAgB,MAAM,EAAE,cAAc,CAuCpC;IAEO,iBAAiB,IAAI,IAAI;IAKzB,oBAAoB,IAAI,IAAI;IAQ5B,MAAM,IAAI,cAAc;IAyBjC,OAAO,CAAC,aAAa,CAwFnB;IAEF,OAAO,CAAC,MAAM,CAAC,YAAY;IAI3B,OAAO,CAAC,MAAM,CAAC,WAAW;IAI1B,OAAO,CAAC,MAAM,CAAC,aAAa;CAG7B"}

package/dist/pd-form-container.js

@@ -1,4 +1,183 @@
-import { PdFormContainer } from "./src/PdFormContainer.js";
-if (!customElements.get("pd-form-container")) {
-  window.customElements.define("pd-form-container", PdFormContainer);
-}
+import { css, html } from "lit";
+import { property, state, customElement } from "lit/decorators.js";
+import { msg } from "@lit/localize";
+import { PdBaseUI } from "./pd-base-ui.js";
+import { INPUT_TYPE_RANGE, INPUT_TYPE_SELECT } from "./pd-base-ui-input.js";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __decorateClass = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators[i])
+      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result) __defProp(target, key, result);
+  return result;
+};
+let PdFormContainer = class extends PdBaseUI {
+  constructor() {
+    super(...arguments);
+    this.requiredFieldInfo = false;
+    this.commonError = "";
+    this._requiredFieldsValid = true;
+    this._validateForm = (e) => {
+      const errorMap = e.detail.errorMap;
+      const singleElement = e.detail.singleElement;
+      const requiredElements = this.querySelectorAll("[required]");
+      requiredElements.forEach((el) => {
+        const isEmpty = !el.value || el.value === "false" || el.value === "" || el._inputType === INPUT_TYPE_RANGE && el.value === "0" || el._inputType === INPUT_TYPE_SELECT && el.value === "UNDEF";
+        const isTarget = !singleElement || el === singleElement;
+        if (isEmpty && isTarget) {
+          const msgText = el.requiredMsg || msg("Eingabe erforderlich", { id: "pd.form.field.required" });
+          el.errorMsg = msgText;
+          errorMap.set(el.id, msgText);
+        } else if (typeof el.validate === "function" && isTarget) {
+          const err = el.validate(e);
+          if (err) {
+            el.errorMsg = err;
+            errorMap.set(el.id, err);
+          } else {
+            el.errorMsg = "";
+          }
+        } else if (isTarget) {
+          el.errorMsg = "";
+        }
+      });
+      const validateByType = (type, validator, errMsg) => {
+        const targets = (singleElement == null ? void 0 : singleElement.getAttribute("field-type")) === type ? [singleElement] : Array.from(this.querySelectorAll(`[field-type="${type}"]`));
+        targets.forEach((el) => {
+          var _a;
+          if (!errorMap.has(el.id) && ((_a = el.value) == null ? void 0 : _a.length)) {
+            if (!validator(el.value)) {
+              el.errorMsg = errMsg;
+              errorMap.set(el.id, errMsg);
+            } else {
+              el.errorMsg = "";
+            }
+          }
+        });
+      };
+      validateByType(
+        "mail",
+        PdFormContainer._mailIsValid,
+        msg("Format mail@test.de verwenden", {
+          id: "pd.form.field.invalid.mail"
+        })
+      );
+      validateByType(
+        "phone",
+        PdFormContainer._phoneIsValid,
+        msg("Format +49123 123456 verwenden", {
+          id: "pd.form.field.invalid.phone"
+        })
+      );
+      validateByType(
+        "vat",
+        PdFormContainer._vatIsValid,
+        msg("Format DE0123456789 verwenden", { id: "pd.form.field.invalid.vat" })
+      );
+      validateByType(
+        "number",
+        (val) => !isNaN(parseFloat(val.replaceAll(",", "."))),
+        msg("Nur Zahlen erlaubt", { id: "pd.form.field.invalid.number" })
+      );
+      this._requiredFieldsValid = errorMap.size === 0;
+      if (singleElement) {
+        e.stopPropagation();
+      }
+    };
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.addEventListener("validate-form", this._validateForm);
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    this.removeEventListener(
+      "validate-form",
+      this._validateForm
+    );
+  }
+  render() {
+    const showValidState = this._requiredFieldsValid && !this.commonError;
+    return html`
+      <form>
+        <slot></slot>
+        ${(this.requiredFieldInfo || this.commonError) && html`
+          <div class="validation-info-container">
+            <p
+              class="validation-info ${showValidState ? "filled" : "unfilled"}"
+            >
+              ${this.commonError || (this._requiredFieldsValid ? msg("* Pflichtfelder ausgefüllt", {
+      id: "pd.form.required.valid"
+    }) : msg("* Pflichtfeld", { id: "pd.form.required.info" }))}
+            </p>
+          </div>
+        `}
+      </form>
+    `;
+  }
+  static _mailIsValid(mail) {
+    return /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(mail);
+  }
+  static _vatIsValid(vat) {
+    return /^[A-Z]{2}[0-9]{8,12}$/.test(vat);
+  }
+  static _phoneIsValid(phone) {
+    return /^\+?[0-9 ]{7,15}$/.test(phone);
+  }
+};
+PdFormContainer.styles = [
+  PdBaseUI.styles,
+  css`
+      :host {
+        display: flex;
+        flex-direction: column;
+        align-items: flex-start;
+        gap: 20px;
+      }
+
+      .validation-info-container {
+        padding-top: var(--pd-form-row-padding-top, 10px);
+      }
+
+      .validation-info {
+        font-family: var(--pd-default-font-content-family);
+        font-size: var(--pd-form-info-font-size, 0.8em);
+        padding: 0.5em;
+        color: #58585a;
+        border-radius: var(--pd-border-radius, 0);
+        width: 70%;
+        max-width: 780px;
+        min-width: 200px;
+      }
+
+      .filled {
+        border: 1px solid var(--pd-default-success-col);
+        border-left-width: 4px;
+        border-right-width: 4px;
+        background-color: var(--pd-default-success-light-col);
+      }
+
+      .unfilled {
+        border: 1px solid var(--pd-default-error-col);
+        border-left-width: 4px;
+        border-right-width: 4px;
+        background-color: var(--pd-default-error-light-col);
+      }
+    `
+];
+__decorateClass([
+  property({ type: Boolean })
+], PdFormContainer.prototype, "requiredFieldInfo", 2);
+__decorateClass([
+  property({ type: String })
+], PdFormContainer.prototype, "commonError", 2);
+__decorateClass([
+  state()
+], PdFormContainer.prototype, "_requiredFieldsValid", 2);
+PdFormContainer = __decorateClass([
+  customElement("pd-form-container")
+], PdFormContainer);
+export {
+  PdFormContainer
+};

package/dist/pd-form-row.d.ts

@@ -0,0 +1,12 @@
+import { CSSResultGroup } from 'lit';
+import { PdBaseUI } from './pd-base-ui.js';
+/**
+ * Ein flexibles Container-Element zur Darstellung von Formularzeilen mit Slot-Unterstützung.
+ *
+ * @slot - Standard-Slot für Formularelemente
+ */
+export declare class PdFormRow extends PdBaseUI {
+    static styles: CSSResultGroup;
+    render(): import('lit-html').TemplateResult<1>;
+}
+//# sourceMappingURL=pd-form-row.d.ts.map

package/dist/pd-form-row.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"pd-form-row.d.ts","sourceRoot":"","sources":["../src/pd-form-row.ts"],"names":[],"mappings":"AACA;;;GAGG;AAEH,OAAO,EAAa,cAAc,EAAE,MAAM,KAAK,CAAC;AAGhD,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAE3C;;;;GAIG;AACH,qBACa,SAAU,SAAQ,QAAQ;IACrC,OAAgB,MAAM,EAAE,cAAc,CAqFpC;IAEF,MAAM;CAGP"}