@progressive-development/pd-spa-helper 0.9.2 → 1.0.0

package/dist/stories/test-impls/test-pages/test-wizard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"test-wizard.d.ts","sourceRoot":"","sources":["../../../../src/stories/test-impls/test-pages/test-wizard.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,kBAAkB,EAAE,MAAM,KAAK,CAAC;AAE/C,OAAO,EAAE,aAAa,EAAE,MAAM,qCAAqC,CAAC;AAEpE,OAAO,oBAAoB,CAAC;AAC5B,OAAO,uBAAuB,CAAC;AAE/B,UAAU,aAAa;IACrB,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,qBACa,UAAW,SAAQ,aAAa,CAAC,aAAa,CAAC;IAC1D,YAAY,EAAE,KAAK,CAAC,GAAG,CAAC,CAgBtB;IAEF,YAAY,IAAI,IAAI;IAIpB,YAAY;IAQZ,SAAS,CAAC,eAAe,CAAC,IAAI,EAAE,GAAG,EAAE,MAAM,EAAE,MAAM;IAqBnD,WAAW,IAAI,kBAAkB;IAIjC,aAAa,IAAI,IAAI;CAGtB"}

package/dist/stories/test-impls/test-popups/default-confirm-popup-test-error.d.ts

@@ -0,0 +1,8 @@
+import { DefaultConfirmPopup, PopupType } from '../../../defaultpage/default-confirm-popup';
+export declare class DefaultConfirmPopupTestError extends DefaultConfirmPopup {
+    _singleButton: boolean;
+    _type: PopupType;
+    _popupTitle: string;
+    _renderContent(): import('lit').TemplateResult<1>;
+}
+//# sourceMappingURL=default-confirm-popup-test-error.d.ts.map

package/dist/stories/test-impls/test-popups/default-confirm-popup-test-error.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"default-confirm-popup-test-error.d.ts","sourceRoot":"","sources":["../../../../src/stories/test-impls/test-popups/default-confirm-popup-test-error.ts"],"names":[],"mappings":"AAGA,OAAO,EACL,mBAAmB,EACnB,SAAS,EACV,MAAM,4CAA4C,CAAC;AAEpD,qBACa,4BAA6B,SAAQ,mBAAmB;IACnE,aAAa,UAAQ;IACrB,KAAK,EAAE,SAAS,CAAW;IAC3B,WAAW,SAA0B;IAErC,cAAc;CASf"}

package/dist/stories/test-impls/test-popups/default-confirm-popup-test-info.d.ts

@@ -0,0 +1,8 @@
+import { DefaultConfirmPopup, PopupType } from '../../../defaultpage/default-confirm-popup';
+export declare class DefaultConfirmPopupTestInfo extends DefaultConfirmPopup {
+    _singleButton: boolean;
+    _type: PopupType;
+    _popupTitle: string;
+    _renderContent(): import('lit').TemplateResult<1>;
+}
+//# sourceMappingURL=default-confirm-popup-test-info.d.ts.map

package/dist/stories/test-impls/test-popups/default-confirm-popup-test-info.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"default-confirm-popup-test-info.d.ts","sourceRoot":"","sources":["../../../../src/stories/test-impls/test-popups/default-confirm-popup-test-info.ts"],"names":[],"mappings":"AAGA,OAAO,EACL,mBAAmB,EACnB,SAAS,EACV,MAAM,4CAA4C,CAAC;AAEpD,qBACa,2BAA4B,SAAQ,mBAAmB;IAClE,aAAa,UAAQ;IACrB,KAAK,EAAE,SAAS,CAAU;IAC1B,WAAW,SAA0B;IAErC,cAAc;CASf"}

package/dist/stories/test-impls/test-popups/default-confirm-popup-test-warn.d.ts

@@ -0,0 +1,8 @@
+import { DefaultConfirmPopup, PopupType } from '../../../defaultpage/default-confirm-popup';
+export declare class DefaultConfirmPopupTestWarn extends DefaultConfirmPopup {
+    _singleButton: boolean;
+    _type: PopupType;
+    _popupTitle: string;
+    _renderContent(): import('lit').TemplateResult<1>;
+}
+//# sourceMappingURL=default-confirm-popup-test-warn.d.ts.map

package/dist/stories/test-impls/test-popups/default-confirm-popup-test-warn.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"default-confirm-popup-test-warn.d.ts","sourceRoot":"","sources":["../../../../src/stories/test-impls/test-popups/default-confirm-popup-test-warn.ts"],"names":[],"mappings":"AAGA,OAAO,EACL,mBAAmB,EACnB,SAAS,EACV,MAAM,4CAA4C,CAAC;AAEpD,qBACa,2BAA4B,SAAQ,mBAAmB;IAClE,aAAa,UAAS;IACtB,KAAK,EAAE,SAAS,CAAU;IAC1B,WAAW,SAA0B;IAErC,cAAc;CASf"}

package/dist/stories/test-impls/test-popups/default-dialog-popup-test.d.ts

@@ -0,0 +1,13 @@
+import { DefaultDialogPopup } from '../../../defaultpage/default-dialog-popup';
+interface TestFormData {
+    name: string;
+}
+export declare class DefaultDialogPopupTest extends DefaultDialogPopup<TestFormData> {
+    _popupTitle: string;
+    _formData: TestFormData;
+    nameParam: string;
+    _renderContent(): import('lit').TemplateResult<1>;
+    _isValidFormData(): boolean;
+}
+export {};
+//# sourceMappingURL=default-dialog-popup-test.d.ts.map

package/dist/stories/test-impls/test-popups/default-dialog-popup-test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"default-dialog-popup-test.d.ts","sourceRoot":"","sources":["../../../../src/stories/test-impls/test-popups/default-dialog-popup-test.ts"],"names":[],"mappings":"AAGA,OAAO,+CAA+C,CAAC;AACvD,OAAO,4CAA4C,CAAC;AAEpD,OAAO,EAAE,kBAAkB,EAAE,MAAM,2CAA2C,CAAC;AAE/E,UAAU,YAAY;IACpB,IAAI,EAAE,MAAM,CAAC;CACd;AAED,qBACa,sBAAuB,SAAQ,kBAAkB,CAAC,YAAY,CAAC;IAC1E,WAAW,EAAE,MAAM,CAAuB;IAE1C,SAAS,EAAG,YAAY,CAAC;IAGzB,SAAS,EAAG,MAAM,CAAC;IAEnB,cAAc;IA0Cd,gBAAgB,IAAI,OAAO;CAG5B"}

package/dist/stories/test-impls/test-popups/default-popup-test.d.ts

@@ -0,0 +1,5 @@
+import { DefaultPopup } from '../../../defaultpage/default-popup';
+export declare class DefaultPopupTest extends DefaultPopup {
+    _renderContent(): import('lit').TemplateResult<1>;
+}
+//# sourceMappingURL=default-popup-test.d.ts.map

package/dist/stories/test-impls/test-popups/default-popup-test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"default-popup-test.d.ts","sourceRoot":"","sources":["../../../../src/stories/test-impls/test-popups/default-popup-test.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,YAAY,EAAE,MAAM,oCAAoC,CAAC;AAElE,qBACa,gBAAiB,SAAQ,YAAY;IACvC,cAAc;CAMxB"}

package/dist/stories/test-wizard-step.stories.d.ts

@@ -0,0 +1,11 @@
+import { StoryObj } from '@storybook/web-components';
+declare const meta: {
+    title: string;
+    render: (args: import('@storybook/web-components').Args) => import('lit').TemplateResult<1>;
+};
+export default meta;
+type Story = StoryObj;
+export declare const DefaultStep: Story;
+export declare const StepWithRequiredInfo: Story;
+export declare const StepWithError: Story;
+//# sourceMappingURL=test-wizard-step.stories.d.ts.map

package/dist/stories/test-wizard-step.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"test-wizard-step.stories.d.ts","sourceRoot":"","sources":["../../src/stories/test-wizard-step.stories.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,2BAA2B,CAAC;AAEhE,OAAO,6CAA6C,CAAC;AAErD,QAAA,MAAM,IAAI;;;CASM,CAAC;AAEjB,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC;AAEtB,eAAO,MAAM,WAAW,EAAE,KAKzB,CAAC;AAEF,eAAO,MAAM,oBAAoB,EAAE,KAKlC,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAK3B,CAAC"}

package/dist/stories/test-wizard.stories.d.ts

@@ -0,0 +1,9 @@
+import { StoryObj } from '@storybook/web-components';
+declare const meta: {
+    title: string;
+    render: (args: import('@storybook/web-components').Args) => import('lit').TemplateResult<1>;
+};
+export default meta;
+type Story = StoryObj;
+export declare const DefaultWizard: Story;
+//# sourceMappingURL=test-wizard.stories.d.ts.map

package/dist/stories/test-wizard.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"test-wizard.stories.d.ts","sourceRoot":"","sources":["../../src/stories/test-wizard.stories.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,2BAA2B,CAAC;AAEhE,OAAO,wCAAwC,CAAC;AAEhD,QAAA,MAAM,IAAI;;;CAGM,CAAC;AAEjB,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC;AAEtB,eAAO,MAAM,aAAa,EAAE,KAK3B,CAAC"}

package/dist/tmpown/pd-loading-state.d.ts

@@ -0,0 +1,9 @@
+import { LitElement, CSSResultGroup } from 'lit';
+import { LoadingState } from '../model/spa-model.js';
+export declare class PdLoadingState extends LitElement {
+    loadingState?: LoadingState;
+    static styles: CSSResultGroup;
+    render(): "" | import('lit').TemplateResult<1>;
+    _renderContent(): "" | import('lit').TemplateResult<1>;
+}
+//# sourceMappingURL=pd-loading-state.d.ts.map

package/dist/tmpown/pd-loading-state.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"pd-loading-state.d.ts","sourceRoot":"","sources":["../../src/tmpown/pd-loading-state.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,cAAc,EAAE,MAAM,KAAK,CAAC;AAK5D,OAAO,0CAA0C,CAAC;AAElD,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAErD,qBAEa,cAAe,SAAQ,UAAU;IAE5C,YAAY,CAAC,EAAE,YAAY,CAAC;IAE5B,MAAM,CAAC,MAAM,EAmHR,cAAc,CAAC;IAEpB,MAAM;IASN,cAAc;CA0Df"}

package/dist/tmpown/pd-loading-state.js

@@ -0,0 +1,196 @@
+import { css, LitElement, html } from 'lit';
+import { property, customElement } from 'lit/decorators.js';
+import { localized, msg } from '@lit/localize';
+import { classMap } from 'lit/directives/class-map.js';
+import '@progressive-development/pd-icon/pd-icon';
+
+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 PdLoadingState = class extends LitElement {
+  render() {
+    if (!this.loadingState) {
+      return "";
+    }
+    return this.loadingState.modal ? html` <div id="modalId" class="modal">${this._renderContent()}</div> ` : this._renderContent();
+  }
+  _renderContent() {
+    if (!this.loadingState) {
+      return "";
+    }
+    return html`
+      <div
+        class="${classMap({
+      content: !this.loadingState.smallBackground,
+      "no-modal-content": this.loadingState.modal !== true && this.loadingState.smallBackground !== true,
+      "background-content": this.loadingState.smallBackground === true
+    })}"
+      >
+        <div
+          class="${this.loadingState.smallBackground ? "background-loader" : "loader"}"
+        ></div>
+        <p>
+          ${this.loadingState.loadingTxt || (this.loadingState.smallBackground ? msg("Daten werden synchronisiert", {
+      id: "spaH.loadingstate.syncState"
+    }) : msg("Bitte warten, Daten werden geladen", {
+      id: "spaH.loadingstate.pleaseWait"
+    }))}
+        </p>
+        ${this.loadingState.subTask && this.loadingState.subTask.length > 0 ? html`
+              <ul class="sub-ul">
+                ${this.loadingState.subTask.map(
+      (task) => html`
+                    <li>
+                      <div class="sub-row">
+                        ${task.loadingTxt}
+                        ${task.completed ? html`<pd-icon
+                              class="sub-icon completed"
+                              icon="checkBox"
+                              activeIcon
+                            ></pd-icon>` : html`<pd-icon
+                              class="sub-icon loading"
+                              icon="syncIcon"
+                              activeIcon
+                            ></pd-icon>`}
+                      </div>
+                    </li>
+                  `
+    )}
+              </ul>
+            ` : ""}
+      </div>
+    `;
+  }
+};
+PdLoadingState.styles = [
+  css`
+      :host {
+        display: block;
+      }
+
+      /* The Modal (background) */
+      .modal {
+        position: fixed; /* Stay in place */
+        left: 0;
+        top: 0;
+        z-index: 500; /* Sit on top */
+
+        display: flex;
+        align-items: center;
+        justify-content: center;
+
+        width: 100%; /* Full width */
+        height: 100%; /* Full height */
+        overflow: auto; /* Enable scroll if needed */
+        /* RGBA Wert muss hier verwendet werden #AFC1D2 to rgba for opacity */
+        background-color: var(
+          --pd-popup-modal-bg-rgba,
+          rgba(175, 193, 210, 0.8)
+        );
+      }
+
+      /* Modal Content */
+      .no-modal-content {
+        position: fixed; /* Stay in place */
+        left: 50%;
+        top: 50%;
+        transform: translate(-50%, -50%);
+      }
+
+      .content {
+        padding: 1em;
+        text-align: center;
+        background-color: var(--pd-loading-state-bg-col, #edf7fd);
+        border: 2px solid
+          var(--pd-loading-state-bg-col, var(--pd-default-col, #067394));
+        z-index: 101; /* Sit on top */
+      }
+
+      .background-content {
+        position: fixed; /* Stay in place */
+        right: 0em;
+        bottom: 0em;
+
+        padding: 1em;
+        z-index: 600; /* Sit on top */
+
+        display: flex;
+        gap: 0.5em;
+        align-items: center;
+
+        background-color: white;
+      }
+
+      .loader {
+        border: 16px solid var(--pd-heating-service-loader, #0a3a48);
+        border-top: 16px solid var(--pd-heating-service-loader-run, #067394);
+        border-radius: 50%;
+        width: 30px;
+        height: 30px;
+        animation: spin 2s linear infinite;
+
+        margin-left: auto;
+        margin-right: auto;
+      }
+
+      .background-loader {
+        border: 10px solid var(--pd-heating-service-loader, #0a3a48);
+        border-top: 10px solid var(--pd-heating-service-loader-run, #067394);
+        border-radius: 50%;
+        width: 10px;
+        height: 10px;
+        animation: spin 2s linear infinite;
+      }
+
+      .sub-ul {
+        text-align: start;
+      }
+
+      .sub-row {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        padding-right: 10px;
+      }
+
+      .sub-icon {
+        --pd-icon-size: 1rem;
+        padding: 0;
+        vertical-align: baseline;
+        margin: 0 0.25rem 0 0;
+      }
+
+      .completed {
+        --pd-icon-col-active: green;
+      }
+
+      .loading {
+        --pd-icon-col-active: orange;
+      }
+
+      @keyframes spin {
+        0% {
+          transform: rotate(0deg);
+        }
+        100% {
+          transform: rotate(360deg);
+        }
+      }
+    `
+];
+__decorateClass([
+  property({ type: Object })
+], PdLoadingState.prototype, "loadingState", 2);
+PdLoadingState = __decorateClass([
+  localized(),
+  customElement("pd-loading-state")
+], PdLoadingState);
+
+export { PdLoadingState };

package/dist/tmpown/pd-login.d.ts

@@ -0,0 +1,13 @@
+import { LitElement } from 'lit';
+export declare class PdLogin extends LitElement {
+    /**
+     * @event login-success fired when login was successfully
+     */
+    protected _validForm: boolean;
+    private _formElement;
+    static get styles(): import('lit').CSSResult[];
+    render(): import('lit').TemplateResult<1>;
+    _accessLogin(): void;
+    _dispatchToastEvent(txt: string): void;
+}
+//# sourceMappingURL=pd-login.d.ts.map

package/dist/tmpown/pd-login.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"pd-login.d.ts","sourceRoot":"","sources":["../../src/tmpown/pd-login.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,MAAM,KAAK,CAAC;AAG5C,OAAO,qDAAqD,CAAC;AAC7D,OAAO,+CAA+C,CAAC;AACvD,OAAO,4CAA4C,CAAC;AACpD,OAAO,mDAAmD,CAAC;AAM3D,qBACa,OAAQ,SAAQ,UAAU;IACrC;;OAEG;IAGH,SAAS,CAAC,UAAU,EAAE,OAAO,CAAS;IAGtC,OAAO,CAAC,YAAY,CAAmB;IAEvC,MAAM,KAAK,MAAM,8BA6BhB;IAED,MAAM;IAmDN,YAAY;IA2CZ,mBAAmB,CAAC,GAAG,EAAE,MAAM;CAYhC"}

package/dist/tmpown/pd-login.js

@@ -0,0 +1,165 @@
+import { LitElement, css, html } from 'lit';
+import { state, query, customElement } from 'lit/decorators.js';
+import '@progressive-development/pd-forms/pd-form-container';
+import '@progressive-development/pd-forms/pd-form-row';
+import '@progressive-development/pd-forms/pd-input';
+import '@progressive-development/pd-forms/pd-panel-button';
+import { loginImpl } from '../service-provider/service-provider-impl.js';
+import { pdIcons } from '@progressive-development/pd-icon';
+
+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 PdLogin = class extends LitElement {
+  constructor() {
+    super(...arguments);
+    this._validForm = false;
+  }
+  static get styles() {
+    return [
+      css`
+        :host {
+          display: flex;
+          justify-content: center;
+          /*min-height: 100vh;
+            min-width: 100vh;*/
+        }
+
+        .login-form {
+          display: flex;
+          flex-flow: column;
+          justify-content: center;
+          --pd-form-row-allign: center;
+
+          background-color: var(--pd-login-bg-color);
+          padding: 1rem;
+          border-radius: var(--pd-login-border-radius);
+        }
+
+        .pwd-link {
+          display: block;
+          text-align: right;
+          padding-top: 0.5em;
+          padding-bottom: 0.5em;
+        }
+      `
+    ];
+  }
+  render() {
+    return html`
+      <div class="login-form">
+        <pd-form-container
+          id="loginFormId"
+          @pd-form-change="${(e) => {
+      this._validForm = e.detail.overallValidity;
+      e.stopPropagation();
+    }}"
+        >
+          <pd-form-row>
+            <pd-input
+              id="eMail"
+              class="quarter3"
+              maxlength="250"
+              fieldType="mail"
+              valueName="email"
+              label="E-mail"
+              autoCompleteName="email"
+              required
+              @enter-pressed="${this._accessLogin}"
+            ></pd-input>
+          </pd-form-row>
+
+          <pd-form-row>
+            <pd-input
+              id="pWord"
+              class="quarter3"
+              secret
+              maxlength="30"
+              label="Password"
+              required
+              @enter-pressed="${this._accessLogin}"
+            ></pd-input>
+          </pd-form-row>
+          <span class="pwd-link"><a href="#">Passwort vergessen?</a></span>
+
+          <pd-form-row>
+            <pd-panel-button
+              class="quarter3"
+              buttonText="Login"
+              pdButtonIcon="${pdIcons.ICON_USER}"
+              ?disabled="${!this._validForm}"
+              @click="${this._accessLogin}"
+            ></pd-panel-button>
+          </pd-form-row>
+        </pd-form-container>
+      </div>
+    `;
+  }
+  _accessLogin() {
+    if (!this._formElement.valid) {
+      this._dispatchToastEvent("Invalid form");
+      return;
+    }
+    this._validForm = false;
+    const formValues = this._formElement.getValues().origin;
+    loginImpl(formValues.email, formValues?.pWord).then((user) => {
+      this.dispatchEvent(
+        new CustomEvent("login-success", {
+          detail: user,
+          bubbles: true,
+          composed: true
+        })
+      );
+      this._validForm = true;
+    }).catch((error) => {
+      this._validForm = true;
+      switch (error.code) {
+        case "auth/invalid-email":
+          this._dispatchToastEvent(
+            "E-Mail Format für Benutzer ist ungültig."
+          );
+          break;
+        case "auth/wrong-password":
+        case "auth/user-not-found":
+          this._dispatchToastEvent(
+            "Anmeldung fehlgeschlagen, ungültige Benutzerdaten."
+          );
+          break;
+        default:
+          this._dispatchToastEvent(
+            "Technisches Problem aufgetreten, die Anmeldung kann leider aktuell nicht durchgeführt werden."
+          );
+      }
+    });
+  }
+  _dispatchToastEvent(txt) {
+    this.dispatchEvent(
+      new CustomEvent("toast-event", {
+        detail: {
+          txt,
+          isError: true
+        },
+        bubbles: true,
+        composed: true
+      })
+    );
+  }
+};
+__decorateClass([
+  state()
+], PdLogin.prototype, "_validForm", 2);
+__decorateClass([
+  query("#loginFormId")
+], PdLogin.prototype, "_formElement", 2);
+PdLogin = __decorateClass([
+  customElement("pd-login")
+], PdLogin);
+
+export { PdLogin };

package/dist/tmpown/pd-toast.d.ts

@@ -0,0 +1,13 @@
+import { LitElement } from 'lit';
+export declare class PdToast extends LitElement {
+    isError: boolean;
+    isSuccess: boolean;
+    duration: number;
+    static styles: import('lit').CSSResult;
+    render(): import('lit').TemplateResult<1>;
+    connectedCallback(): void;
+    updated(changedProps: any): void;
+    _show(): Promise<unknown>;
+    _close(): void;
+}
+//# sourceMappingURL=pd-toast.d.ts.map

package/dist/tmpown/pd-toast.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"pd-toast.d.ts","sourceRoot":"","sources":["../../src/tmpown/pd-toast.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,MAAM,KAAK,CAAC;AAG5C,qBACa,OAAQ,SAAQ,UAAU;IAErC,OAAO,EAAE,OAAO,CAAS;IAGzB,SAAS,EAAE,OAAO,CAAS;IAG3B,QAAQ,EAAE,MAAM,CAAQ;IAExB,MAAM,CAAC,MAAM,0BA6CX;IAEF,MAAM;IAWN,iBAAiB;IAKjB,OAAO,CAAC,YAAY,EAAE,GAAG;IAUzB,KAAK;IAwBL,MAAM;CAIP"}

package/dist/tmpown/pd-toast.js

@@ -0,0 +1,127 @@
+import { css, LitElement, html } from 'lit';
+import { property, customElement } from 'lit/decorators.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 PdToast = class extends LitElement {
+  constructor() {
+    super(...arguments);
+    this.isError = false;
+    this.isSuccess = false;
+    this.duration = -100;
+  }
+  render() {
+    return html`
+      <slot></slot>
+      <pd-icon
+        @click="${this._close}"
+        icon="closeLink"
+        class="close-link"
+      ></pd-icon>
+    `;
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.setAttribute("aria-live", "polite");
+  }
+  updated(changedProps) {
+    if (changedProps.has("duration")) {
+      if (this.duration === -100) {
+        this._close();
+      } else {
+        this._show();
+      }
+    }
+  }
+  _show() {
+    return new Promise((resolve) => {
+      if (this.className === "show") ; else {
+        if (this.duration >= 1e3) {
+          this.style.animation = `fadein 0.5s, fadeout 0.5s ${this.duration - 500}ms`;
+        }
+        this.className = "show";
+        if (this.duration > 0) {
+          setTimeout(
+            () => {
+              this._close();
+              resolve("Ok");
+            },
+            this.duration >= 1e3 ? this.duration : 3e3
+          );
+        }
+      }
+    });
+  }
+  _close() {
+    this.style.animation = "";
+    this.className = this.className.replace("show", "");
+  }
+};
+PdToast.styles = css`
+    :host {
+      --pd-icon-size: 1rem;
+
+      transform: translateX(-150%);
+      transition: transform 1s;
+
+      /* Other styles */
+      position: fixed;
+      bottom: 30px;
+      left: 30px;
+      width: calc(100% - 60px);
+      max-width: 400px;
+
+      z-index: 105;
+
+      background: var(--app-primary-color, #ebcf57);
+      color: #0a3a48;
+      padding: 0.6rem;
+      border-radius: var(--item-border-radius, 2px);
+      box-shadow: 3px 5px 5px 3px lightgrey;
+      display: flex;
+    }
+
+    :host([isError]) {
+      background: darkred;
+      color: #fff;
+    }
+
+    :host([isSuccess]) {
+      background: green;
+      color: #fff;
+    }
+
+    :host(.show) {
+      transform: translateX(0%);
+    }
+
+    .close-link {
+      --pd-icon-size: 1.4rem;
+      position: absolute;
+      right: 0;
+      top: 0;
+      cursor: pointer;
+    }
+  `;
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], PdToast.prototype, "isError", 2);
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], PdToast.prototype, "isSuccess", 2);
+__decorateClass([
+  property({ type: Number })
+], PdToast.prototype, "duration", 2);
+PdToast = __decorateClass([
+  customElement("pd-toast")
+], PdToast);
+
+export { PdToast };