@progressive-development/pd-forms 0.8.6 → 0.9.1

package/dist/pd-range.js

@@ -1,287 +1,8 @@
-import { css, html } from "lit";
-import { property, customElement } from "lit/decorators.js";
-import { classMap } from "lit/directives/class-map.js";
-import { PdBaseUIInput, INPUT_TYPE_RANGE } 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 PdRange = class extends PdBaseUIInput {
-  constructor() {
-    super();
-    this.min = 0;
-    this.max = 10;
-    this.step = 1;
-    this.optionValueMapper = {};
-    this.name = "";
-    this._inputType = INPUT_TYPE_RANGE;
-  }
-  update(changedProps) {
-    if (changedProps.has("optionValueMapper") && !this.initValue) {
-      this._value = Object.keys(this.optionValueMapper)[0];
-    }
-    super.update(changedProps);
-  }
-  firstUpdated() {
-    var _a;
-    this._input = (_a = this.shadowRoot) == null ? void 0 : _a.querySelector("input");
-    super.firstUpdated();
-  }
-  _onChange(e) {
-    var _a;
-    this._handleChangedValue(((_a = this._input) == null ? void 0 : _a.value) ?? "", e, true);
-  }
-  _onBlur(event) {
-    var _a;
-    this._focused = false;
-    this._touched = true;
-    this.dispatchEvent(
-      new CustomEvent("pd-form-element-blur", {
-        detail: {
-          name: this.valueName || this.id || "field",
-          value: (_a = this._input) == null ? void 0 : _a.value
-        },
-        bubbles: true,
-        composed: true
-      })
-    );
-  }
-  _onFocus(event) {
-    var _a;
-    this._focused = true;
-    this.dispatchEvent(
-      new CustomEvent("pd-form-element-focus", {
-        detail: {
-          name: this.valueName || this.id || "field",
-          value: (_a = this._input) == null ? void 0 : _a.value
-        },
-        bubbles: true,
-        composed: true
-      })
-    );
-  }
-  focus() {
-    var _a;
-    (_a = this._input) == null ? void 0 : _a.focus();
-  }
-  render() {
-    const inputId = `${this.id}Range`;
-    const labelDetail = this.optionValueMapper[this._value] || this._value;
-    return html`
-      ${this._renderLabel(inputId, labelDetail)}
-      <div
-        class="${classMap(
-      this.getClassmap({
-        "input-range": true
-      })
-    )}"
-      >
-        <input
-          id=${inputId}
-          name=${this.name || this.valueName || ""}
-          class="input-range-style ${this.gradient ? "gradient" : ""}"
-          type="range"
-          .value=${this._value}
-          ?readonly=${this.readonly}
-          ?disabled=${this.disabled}
-          min=${this.min}
-          max=${this.max}
-          step=${this.step}
-          @change=${this._onChange}
-          @input=${this._onChange}
-          @blur=${this._onBlur}
-          @focus=${this._onFocus}
-        />
-        <div class="ticks ${this.disabled ? "disabled" : "enabled"}">
-          ${Array.from({ length: this.max - this.min + 1 }).map(
-      () => html`<span class="tick">|</span>`
-    )}
-        </div>
-      </div>
-      ${this._renderErrorMsg()}
-    `;
-  }
-  _getInitialValue() {
-    return this.initValue || Object.keys(this.optionValueMapper)[0] || "0";
-  }
-  clear() {
-    this.reset();
-  }
-};
-PdRange.styles = [
-  PdBaseUIInput.styles,
-  css`
-      :host([disabled]) {
-        --pd-range-bg-col: grey;
-        --pd-range-thumb-col: lightgrey;
-      }
+import { PdRange } from './pd-range/PdRange.js';
 
-      input[type="range"] {
-        -webkit-appearance: none;
-        width: var(--pd-input-field-width, 250px);
-        background: transparent;
-        background-color: var(--pd-range-bg-col, var(--pd-default-col));
-        padding: 0.5rem;
-        height: var(--pd-input-field-range-height, 1.7rem);
-        box-sizing: border-box;
-        border-radius: 0.75rem;
-      }
+const tag = "pd-range";
+if (!customElements.get(tag)) {
+  customElements.define(tag, PdRange);
+}
 
-      input[type="range"]:focus {
-        outline: none;
-      }
-
-      input[type="range"]::-webkit-slider-thumb {
-        -webkit-appearance: none;
-        margin-top: -6px;
-        cursor: pointer;
-        height: 15px;
-        width: 39px;
-        background: var(--pd-range-thumb-col, var(--pd-default-hover-col));
-        border: 1px solid var(--pd-default-dark-col);
-        border-radius: 3px;
-        box-shadow:
-          1px 1px 1px #000000,
-          0px 0px 1px #0d0d0d;
-      }
-
-      input[type="range"]::-moz-range-thumb {
-        cursor: pointer;
-        height: 15px;
-        width: 39px;
-        background: var(--pd-range-thumb-col, var(--pd-default-hover-col));
-        border: 1px solid var(--pd-default-dark-col);
-        border-radius: 3px;
-        box-shadow:
-          1px 1px 1px #000000,
-          0px 0px 1px #0d0d0d;
-      }
-
-      input[type="range"]::-ms-thumb {
-        cursor: pointer;
-        height: 15px;
-        width: 39px;
-        background: var(--pd-range-thumb-col, var(--pd-default-hover-col));
-        border: 1px solid var(--pd-default-dark-col);
-        border-radius: 3px;
-        box-shadow:
-          1px 1px 1px #000000,
-          0px 0px 1px #0d0d0d;
-      }
-
-      input[type="range"]::-webkit-slider-runnable-track {
-        width: 100%;
-        height: 8.4px;
-        cursor: pointer;
-        box-shadow:
-          1px 1px 1px #000000,
-          0px 0px 1px #0d0d0d;
-        background: var(--pd-range-track-col, var(--pd-default-light-col));
-        border: 0.2px solid #010101;
-        border-radius: 0.75rem;
-      }
-
-      input[type="range"]:focus::-webkit-slider-runnable-track {
-        background: var(
-          --pd-range-track-hover-col,
-          var(--pd-default-light-col)
-        );
-        border: 0.2px solid var(--pd-default-hover-col);
-      }
-
-      input[type="range"]::-moz-range-track {
-        width: 100%;
-        height: 8.4px;
-        cursor: pointer;
-        box-shadow:
-          1px 1px 1px #000000,
-          0px 0px 1px #0d0d0d;
-        background: var(--pd-range-track-col, var(--pd-default-light-col));
-        border-radius: 0.75rem;
-        border: 0.2px solid #010101;
-      }
-
-      input[type="range"]::-ms-track {
-        height: 8.4px;
-        width: 100%;
-        cursor: pointer;
-        background: transparent;
-        border-color: transparent;
-        color: transparent;
-        border-width: 16px 0;
-      }
-
-      input[type="range"]::-ms-fill-lower,
-      input[type="range"]::-ms-fill-upper {
-        background: var(--pd-range-track-col, var(--pd-default-light-col));
-        border: 0.2px solid #010101;
-        border-radius: 0.75rem;
-        box-shadow:
-          1px 1px 1px #000000,
-          0px 0px 1px #0d0d0d;
-      }
-
-      input[type="range"]:focus::-ms-fill-lower {
-        background: #3071a9;
-      }
-
-      input[type="range"]:focus::-ms-fill-upper {
-        background: #367ebd;
-      }
-
-      .ticks {
-        display: flex;
-        justify-content: space-between;
-        padding: 10px 30px;
-      }
-
-      .tick {
-        line-height: 5px;
-        height: 5px;
-        margin-top: -13px;
-        font-size: 8pt;
-        font-weight: bolder;
-      }
-
-      .ticks.disabled {
-        color: grey;
-      }
-
-      .ticks.enabled {
-        color: var(--pd-default-col);
-      }
-
-      @media (max-width: 650px) {
-        label {
-          font-size: 12px;
-        }
-      }
-    `
-];
-__decorateClass([
-  property({ type: Number })
-], PdRange.prototype, "min", 2);
-__decorateClass([
-  property({ type: Number })
-], PdRange.prototype, "max", 2);
-__decorateClass([
-  property({ type: Number })
-], PdRange.prototype, "step", 2);
-__decorateClass([
-  property({ type: Object })
-], PdRange.prototype, "optionValueMapper", 2);
-__decorateClass([
-  property({ type: String })
-], PdRange.prototype, "name", 2);
-PdRange = __decorateClass([
-  customElement("pd-range")
-], PdRange);
-export {
-  PdRange
-};
+export { PdRange };

package/dist/pd-select/PdSelect.d.ts

@@ -0,0 +1,21 @@
+import { CSSResultGroup, PropertyValues } from 'lit';
+import { PdBaseInputElement } from '../base/pd-base-input-element.js';
+import { PdSelectOption } from '../types.js';
+/**
+ * @tagname pd-select
+ */
+export declare class PdSelect extends PdBaseInputElement {
+    values: PdSelectOption[];
+    static styles: CSSResultGroup;
+    constructor();
+    update(changedProps: PropertyValues<this>): void;
+    render(): import('lit').TemplateResult<1>;
+    protected _onSelectChange(event: Event): void;
+    /**
+     * Empty, reserved for possible future enhancements on keyup for select.
+     */
+    protected _onSelectKeyUp(): void;
+    _getInitialValue(): string;
+    clear(): void;
+}
+//# sourceMappingURL=PdSelect.d.ts.map

package/dist/pd-select/PdSelect.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PdSelect.d.ts","sourceRoot":"","sources":["../../src/pd-select/PdSelect.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAa,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAKhE,OAAO,EAAE,kBAAkB,EAAE,MAAM,kCAAkC,CAAC;AACtE,OAAO,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAE7C;;GAEG;AACH,qBAAa,QAAS,SAAQ,kBAAkB;IAE9C,MAAM,EAAE,cAAc,EAAE,CAAM;IAE9B,OAAgB,MAAM,EAAE,cAAc,CA0DpC;;IAOO,MAAM,CAAC,YAAY,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAWhD,MAAM;IAoCf,SAAS,CAAC,eAAe,CAAC,KAAK,EAAE,KAAK;IAItC;;OAEG;IACH,SAAS,CAAC,cAAc,IAAI,IAAI;IAIvB,gBAAgB,IAAI,MAAM;IAI5B,KAAK,IAAI,IAAI;CAGrB"}

package/dist/pd-select/PdSelect.js

@@ -0,0 +1,142 @@
+import { css, html } from 'lit';
+import { property } from 'lit/decorators.js';
+import { classMap } from 'lit/directives/class-map.js';
+import { INPUT_TYPE_SELECT } from '../base/pd-base-ui-input.js';
+import { PdBaseInputElement } from '../base/pd-base-input-element.js';
+
+var __defProp = Object.defineProperty;
+var __decorateClass = (decorators, target, key, kind) => {
+  var result = void 0 ;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators[i])
+      result = (decorator(target, key, result) ) || result;
+  if (result) __defProp(target, key, result);
+  return result;
+};
+class PdSelect extends PdBaseInputElement {
+  constructor() {
+    super();
+    this.values = [];
+    this._inputType = INPUT_TYPE_SELECT;
+  }
+  static {
+    this.styles = [
+      PdBaseInputElement.styles,
+      css`
+      .select-css {
+        display: block;
+        -moz-appearance: none;
+        -webkit-appearance: none;
+        appearance: none;
+        padding: 5px;
+        background-image: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23007CB2%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E");
+        background-repeat: no-repeat, repeat;
+        background-position:
+          right 0.5em top 50%,
+          0 0;
+        background-size:
+          0.65em auto,
+          100%;
+        max-width: 100%;
+      }
+
+      .select-css::-ms-expand {
+        display: none;
+      }
+
+      .select-css option {
+        font-weight: normal;
+        text-indent: 5px;
+      }
+
+      .gradient {
+        background-image:
+          url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23007CB2%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E"),
+          linear-gradient(
+            to bottom,
+            var(--my-background-gradient-color),
+            var(--my-background-color)
+          );
+        background-color: var(--my-background-color);
+      }
+
+      .error .gradient {
+        background-image:
+          url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22graytext%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E"),
+          linear-gradient(
+            to bottom,
+            var(--my-background-gradient-color) 10%,
+            #f5979b 100%
+          );
+        background-repeat: no-repeat, repeat;
+        background-position:
+          right 0.5em top 50%,
+          0 0;
+        background-size:
+          0.65em auto,
+          100%;
+        background-color: var(--my-error-background-color);
+      }
+    `
+    ];
+  }
+  update(changedProps) {
+    if (changedProps.has("values") && this.values?.length > 0 && !this.initValue) {
+      this._value = this.values[0].value;
+    }
+    super.update(changedProps);
+  }
+  render() {
+    const selectId = `${this.id}Select`;
+    return html`
+      ${this._renderLabel(selectId)}
+      <div
+        class="${classMap(
+      this.getClassmap({
+        input: true
+      })
+    )}"
+      >
+        <select
+          id=${selectId}
+          class="input-style select-css ${this.gradient ? "gradient" : ""}"
+          ?disabled=${this.disabled}
+          name=${this.name || this.valueName || this.autoCompleteName}
+          autocomplete=${this.autoCompleteName ?? "off"}
+          @change=${this._onSelectChange}
+          @keyup=${this._onSelectKeyUp}
+          @blur=${this._onBlur}
+          @focus=${this._onFocus}
+        >
+          ${this.values.map(
+      (val) => html`
+              <option value=${val.value} ?selected=${this._value == val.value}>
+                ${val.name}
+              </option>
+            `
+    )}
+        </select>
+      </div>
+      ${this._renderErrorMsg()}
+    `;
+  }
+  _onSelectChange(event) {
+    this._handleChangedValue(this._input.value, event, true);
+  }
+  /**
+   * Empty, reserved for possible future enhancements on keyup for select.
+   */
+  _onSelectKeyUp() {
+  }
+  _getInitialValue() {
+    return this.initValue || this.values[0]?.value || "";
+  }
+  clear() {
+    this.reset();
+  }
+}
+__decorateClass([
+  property({ type: Array })
+], PdSelect.prototype, "values");
+
+export { PdSelect };

package/dist/pd-select/pd-select.d.ts

@@ -0,0 +1,3 @@
+import { PdSelect } from './PdSelect.js';
+export { PdSelect };
+//# sourceMappingURL=pd-select.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"pd-select.d.ts","sourceRoot":"","sources":["../../src/pd-select/pd-select.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAOzC,OAAO,EAAE,QAAQ,EAAE,CAAC"}

package/dist/{stories/select.stories.d.ts → pd-select/pd-select.stories.d.ts}

@@ -34,4 +34,4 @@ declare const meta: {
 export default meta;
 type Story = StoryObj;
 export declare const Select: Story;
-//# sourceMappingURL=select.stories.d.ts.map
+//# sourceMappingURL=pd-select.stories.d.ts.map

package/dist/pd-select/pd-select.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"pd-select.stories.d.ts","sourceRoot":"","sources":["../../src/pd-select/pd-select.stories.ts"],"names":[],"mappings":"AACA,OAAO,EAAQ,QAAQ,EAAE,MAAM,2BAA2B,CAAC;AAE3D,OAAO,gBAAgB,CAAC;AACxB,OAAO,2CAA2C,CAAC;AACnD,OAAO,+BAA+B,CAAC;AAGvC,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAaM,CAAC;AAEjB,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC;AAEtB,eAAO,MAAM,MAAM,EAAE,KAqDpB,CAAC"}

package/dist/pd-select.d.ts

@@ -1,18 +1,2 @@
-import { CSSResultGroup, PropertyValues } from 'lit';
-import { PdBaseInputElement } from './pd-base-input-element.js';
-import { PdSelectOption } from './types.js';
-export declare class PdSelect extends PdBaseInputElement {
-    values: PdSelectOption[];
-    static styles: CSSResultGroup;
-    constructor();
-    update(changedProps: PropertyValues<this>): void;
-    render(): import('lit-html').TemplateResult<1>;
-    protected _onSelectChange(event: Event): void;
-    /**
-     * Empty, reserved for possible future enhancements on keyup for select.
-     */
-    protected _onSelectKeyUp(): void;
-    _getInitialValue(): string;
-    clear(): void;
-}
-//# sourceMappingURL=pd-select.d.ts.map
+export * from './pd-select/pd-select'
+export {}

package/dist/pd-select.js

@@ -1,146 +1,8 @@
-import { css, html } from "lit";
-import { property, customElement } from "lit/decorators.js";
-import { classMap } from "lit/directives/class-map.js";
-import { INPUT_TYPE_SELECT } from "./pd-base-ui-input.js";
-import { PdBaseInputElement } from "./pd-base-input-element.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 PdSelect = class extends PdBaseInputElement {
-  constructor() {
-    super();
-    this.values = [];
-    this._inputType = INPUT_TYPE_SELECT;
-  }
-  update(changedProps) {
-    var _a;
-    if (changedProps.has("values") && ((_a = this.values) == null ? void 0 : _a.length) > 0 && !this.initValue) {
-      this._value = this.values[0].value;
-    }
-    super.update(changedProps);
-  }
-  render() {
-    const selectId = `${this.id}Select`;
-    return html`
-      ${this._renderLabel(selectId)}
-      <div
-        class="${classMap(
-      this.getClassmap({
-        input: true
-      })
-    )}"
-      >
-        <select
-          id=${selectId}
-          class="input-style select-css ${this.gradient ? "gradient" : ""}"
-          ?disabled=${this.disabled}
-          name=${this.name || this.valueName || this.autoCompleteName}
-          autocomplete=${this.autoCompleteName ?? "off"}
-          @change=${this._onSelectChange}
-          @keyup=${this._onSelectKeyUp}
-          @blur=${this._onBlur}
-          @focus=${this._onFocus}
-        >
-          ${this.values.map(
-      (val) => html`
-              <option value=${val.value} ?selected=${this._value == val.value}>
-                ${val.name}
-              </option>
-            `
-    )}
-        </select>
-      </div>
-      ${this._renderErrorMsg()}
-    `;
-  }
-  _onSelectChange(event) {
-    this._handleChangedValue(this._input.value, event, true);
-  }
-  /**
-   * Empty, reserved for possible future enhancements on keyup for select.
-   */
-  _onSelectKeyUp() {
-  }
-  _getInitialValue() {
-    var _a;
-    return this.initValue || ((_a = this.values[0]) == null ? void 0 : _a.value) || "";
-  }
-  clear() {
-    this.reset();
-  }
-};
-PdSelect.styles = [
-  PdBaseInputElement.styles,
-  css`
-      .select-css {
-        display: block;
-        -moz-appearance: none;
-        -webkit-appearance: none;
-        appearance: none;
-        padding: 5px;
-        background-image: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23007CB2%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E");
-        background-repeat: no-repeat, repeat;
-        background-position:
-          right 0.5em top 50%,
-          0 0;
-        background-size:
-          0.65em auto,
-          100%;
-        max-width: 100%;
-      }
+import { PdSelect } from './pd-select/PdSelect.js';
 
-      .select-css::-ms-expand {
-        display: none;
-      }
+const tag = "pd-select";
+if (!customElements.get(tag)) {
+  customElements.define(tag, PdSelect);
+}
 
-      .select-css option {
-        font-weight: normal;
-        text-indent: 5px;
-      }
-
-      .gradient {
-        background-image:
-          url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23007CB2%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E"),
-          linear-gradient(
-            to bottom,
-            var(--my-background-gradient-color),
-            var(--my-background-color)
-          );
-        background-color: var(--my-background-color);
-      }
-
-      .error .gradient {
-        background-image:
-          url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22graytext%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E"),
-          linear-gradient(
-            to bottom,
-            var(--my-background-gradient-color) 10%,
-            #f5979b 100%
-          );
-        background-repeat: no-repeat, repeat;
-        background-position:
-          right 0.5em top 50%,
-          0 0;
-        background-size:
-          0.65em auto,
-          100%;
-        background-color: var(--my-error-background-color);
-      }
-    `
-];
-__decorateClass([
-  property({ type: Array })
-], PdSelect.prototype, "values", 2);
-PdSelect = __decorateClass([
-  customElement("pd-select")
-], PdSelect);
-export {
-  PdSelect
-};
+export { PdSelect };

package/dist/stories/01_index.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"01_index.stories.d.ts","sourceRoot":"","sources":["../../src/stories/01_index.stories.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,2BAA2B,CAAC;AAEhE,OAAO,iBAAiB,CAAC;AACzB,OAAO,mBAAmB,CAAC;AAC3B,OAAO,gBAAgB,CAAC;AACxB,OAAO,qBAAqB,CAAC;AAC7B,OAAO,qBAAqB,CAAC;AAC7B,OAAO,sBAAsB,CAAC;AAC9B,OAAO,iBAAiB,CAAC;AAGzB,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsBM,CAAC;AAEjB,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC;AAGtB,eAAO,MAAM,YAAY,EAAE,KA4L1B,CAAC"}
+{"version":3,"file":"01_index.stories.d.ts","sourceRoot":"","sources":["../../src/stories/01_index.stories.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,2BAA2B,CAAC;AAEhE,OAAO,2BAA2B,CAAC;AACnC,OAAO,+BAA+B,CAAC;AACvC,OAAO,yBAAyB,CAAC;AACjC,OAAO,mCAAmC,CAAC;AAC3C,OAAO,mCAAmC,CAAC;AAC3C,OAAO,qCAAqC,CAAC;AAC7C,OAAO,2BAA2B,CAAC;AAGnC,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsBM,CAAC;AAEjB,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC;AAGtB,eAAO,MAAM,YAAY,EAAE,KA4L1B,CAAC"}

package/dist/styles/shared-input-field-styles.js

@@ -1,4 +1,5 @@
-import { css } from "lit";
+import { css } from 'lit';
+
 /**
  * @license
  * Copyright (c) 2021 PD Progressive Development UG. All rights reserved.
@@ -169,6 +170,5 @@ const SharedInputFieldStyles = css`
     color: var(--pd-input-placeholder-color, #474747e4);
   }
 `;
-export {
-  SharedInputFieldStyles
-};
+
+export { SharedInputFieldStyles };

package/dist/styles/shared-input-styles.js

@@ -1,4 +1,5 @@
-import { css } from "lit";
+import { css } from 'lit';
+
 /**
  * @license
  * Copyright (c) 2021 PD Progressive Development UG. All rights reserved.
@@ -60,6 +61,5 @@ const SharedInputStyles = css`
     background: linear-gradient(to bottom, #ebebeb 0%, #999 100%);
   }
 `;
-export {
-  SharedInputStyles
-};
+
+export { SharedInputStyles };