@scania/tegel 0.0.8 → 0.0.10

package/dist/collection/components/textfield/textfield.js

@@ -1,429 +0,0 @@
-import { h } from '@stencil/core';
-export class Textfield {
-  constructor() {
-    this.type = 'text';
-    this.labelPosition = 'no-label';
-    this.label = '';
-    this.helper = undefined;
-    this.placeholder = '';
-    this.value = '';
-    this.disabled = false;
-    this.readOnly = false;
-    this.size = 'lg';
-    this.modeVariant = null;
-    this.noMinWidth = false;
-    this.name = '';
-    this.state = 'default';
-    this.maxLength = undefined;
-    this.autofocus = false;
-    this.focusInput = undefined;
-  }
-  handleChange(event) {
-    this.sddsChange.emit(event);
-  }
-  // Data input event in value prop
-  handleInput(event) {
-    this.sddsInput.emit(event);
-    this.value = event.target.value;
-  }
-  /** Set the input as focus when clicking the whole textfield with suffix/prefix */
-  handleFocus(event) {
-    this.textInput.focus();
-    this.focusInput = true;
-    this.sddsFocus.emit(event);
-  }
-  /** Set the input as focus when clicking the whole textfield with suffix/prefix */
-  handleBlur(event) {
-    this.focusInput = false;
-    this.sddsBlur.emit(event);
-  }
-  render() {
-    var _a;
-    return (h("div", { class: `
-        ${this.noMinWidth ? 'form-textfield-nomin' : ''}
-        ${this.focusInput && !this.disabled ? 'form-textfield textfield-focus' : ' form-textfield'}
-        ${this.value ? 'textfield-data' : ''}
-        ${this.labelPosition === 'inside' && this.size !== 'sm'
-        ? 'textfield-container-label-inside'
-        : ''}
-        ${this.disabled ? 'form-textfield-disabled' : ''}
-        ${this.readOnly ? 'form-textfield-readonly' : ''}
-        ${this.modeVariant !== null ? `sdds-mode-variant-${this.modeVariant}` : ''}
-        ${this.size === 'md' ? 'form-textfield-md' : ''}
-        ${this.size === 'sm' ? 'form-textfield-sm' : ''}
-        ${this.state === 'error' || this.state === 'success' ? `form-textfield-${this.state}` : ''}
-        ` }, this.labelPosition === 'outside' && (h("div", { class: "textfield-label-outside" }, h("div", null, this.label))), h("div", { onClick: () => this.textInput.focus(), class: "textfield-container" }, h("div", { class: `textfield-slot-wrap-prefix textfield-${this.state}` }, h("slot", { name: "prefix" })), h("div", { class: "textfield-input-container" }, h("input", { ref: (inputEl) => (this.textInput = inputEl), class: `textfield-input textfield-input-${this.size}`, type: this.type, disabled: this.disabled, readonly: this.readOnly, placeholder: this.placeholder, value: this.value, autofocus: this.autofocus, maxlength: this.maxLength, name: this.name, onInput: (event) => this.handleInput(event), onChange: (event) => this.handleChange(event), onFocus: (event) => {
-        if (!this.readOnly) {
-          this.handleFocus(event);
-        }
-      }, onBlur: (event) => {
-        if (!this.readOnly) {
-          this.handleBlur(event);
-        }
-      } }), this.labelPosition === 'inside' && this.size !== 'sm' && (h("label", { class: "textfield-label-inside" }, this.label))), h("div", { class: "textfield-bar" }), h("div", { class: `textfield-slot-wrap-suffix textfield-${this.state}` }, h("slot", { name: "suffix" })), h("span", { class: "textfield-icon__readonly" }, h("sdds-icon", { name: "edit_inactive", size: "20px" })), h("span", { class: "textfield-icon__readonly-label" }, "This field is non-editable")), h("div", { class: "textfield-helper" }, this.state === 'error' && (h("div", { class: "textfield-helper-error-state" }, h("sdds-icon", { name: "error", size: "16px" }), this.helper)), this.state !== 'error' && this.helper, this.maxLength > 0 && (h("div", { class: "textfield-textcounter" }, this.value === null ? 0 : (_a = this.value) === null || _a === void 0 ? void 0 : _a.length, h("span", { class: "textfield-textcounter-divider" }, " / "), this.maxLength)))));
-  }
-  static get is() { return "sdds-textfield"; }
-  static get encapsulation() { return "scoped"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["textfield.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["textfield.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "type": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "'text' | 'password'",
-          "resolved": "\"password\" | \"text\"",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Which input type, text, password or similar"
-        },
-        "attribute": "type",
-        "reflect": true,
-        "defaultValue": "'text'"
-      },
-      "labelPosition": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "'inside' | 'outside' | 'no-label'",
-          "resolved": "\"inside\" | \"no-label\" | \"outside\"",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Position of the label for the textfield."
-        },
-        "attribute": "label-position",
-        "reflect": false,
-        "defaultValue": "'no-label'"
-      },
-      "label": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Label text"
-        },
-        "attribute": "label",
-        "reflect": false,
-        "defaultValue": "''"
-      },
-      "helper": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Helper text"
-        },
-        "attribute": "helper",
-        "reflect": false
-      },
-      "placeholder": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Placeholder text"
-        },
-        "attribute": "placeholder",
-        "reflect": false,
-        "defaultValue": "''"
-      },
-      "value": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Value of the input text"
-        },
-        "attribute": "value",
-        "reflect": true,
-        "defaultValue": "''"
-      },
-      "disabled": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Set input in disabled state"
-        },
-        "attribute": "disabled",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "readOnly": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Set input in readonly state"
-        },
-        "attribute": "read-only",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "size": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "'sm' | 'md' | 'lg'",
-          "resolved": "\"lg\" | \"md\" | \"sm\"",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Size of the input"
-        },
-        "attribute": "size",
-        "reflect": false,
-        "defaultValue": "'lg'"
-      },
-      "modeVariant": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "'primary' | 'secondary'",
-          "resolved": "\"primary\" | \"secondary\"",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Mode variant of the textfield"
-        },
-        "attribute": "mode-variant",
-        "reflect": false,
-        "defaultValue": "null"
-      },
-      "noMinWidth": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "With setting"
-        },
-        "attribute": "no-min-width",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "name": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Name property"
-        },
-        "attribute": "name",
-        "reflect": false,
-        "defaultValue": "''"
-      },
-      "state": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "'error' | 'success' | 'default'",
-          "resolved": "\"default\" | \"error\" | \"success\"",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Error state of input"
-        },
-        "attribute": "state",
-        "reflect": false,
-        "defaultValue": "'default'"
-      },
-      "maxLength": {
-        "type": "number",
-        "mutable": false,
-        "complexType": {
-          "original": "number",
-          "resolved": "number",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Max length of input"
-        },
-        "attribute": "max-length",
-        "reflect": false
-      },
-      "autofocus": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Autofocus for input"
-        },
-        "attribute": "autofocus",
-        "reflect": false,
-        "defaultValue": "false"
-      }
-    };
-  }
-  static get states() {
-    return {
-      "focusInput": {}
-    };
-  }
-  static get events() {
-    return [{
-        "method": "sddsChange",
-        "name": "sddsChange",
-        "bubbles": true,
-        "cancelable": false,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Change event for the textfield"
-        },
-        "complexType": {
-          "original": "any",
-          "resolved": "any",
-          "references": {}
-        }
-      }, {
-        "method": "sddsInput",
-        "name": "sddsInput",
-        "bubbles": true,
-        "cancelable": false,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Input event for the textfield"
-        },
-        "complexType": {
-          "original": "InputEvent",
-          "resolved": "InputEvent",
-          "references": {
-            "InputEvent": {
-              "location": "global"
-            }
-          }
-        }
-      }, {
-        "method": "sddsFocus",
-        "name": "sddsFocus",
-        "bubbles": true,
-        "cancelable": false,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Focus event for the textfield"
-        },
-        "complexType": {
-          "original": "FocusEvent",
-          "resolved": "FocusEvent",
-          "references": {
-            "FocusEvent": {
-              "location": "global"
-            }
-          }
-        }
-      }, {
-        "method": "sddsBlur",
-        "name": "sddsBlur",
-        "bubbles": true,
-        "cancelable": false,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Blur event for the textfield"
-        },
-        "complexType": {
-          "original": "FocusEvent",
-          "resolved": "FocusEvent",
-          "references": {
-            "FocusEvent": {
-              "location": "global"
-            }
-          }
-        }
-      }];
-  }
-}

package/dist/collection/components/toast/sdds-toast.css

@@ -1,102 +0,0 @@
-:host(.hide) {
-  display: none;
-  visibility: hidden;
-}
-
-:host {
-  z-index: 700;
-}
-:host .toast-wrapper {
-  display: flex;
-  width: 348px;
-  background-color: var(--sdds-toast-background-color);
-  border-radius: 4px;
-}
-:host .toast-wrapper.information {
-  border-left: 4px solid var(--sdds-information);
-}
-:host .toast-wrapper.information sdds-icon {
-  color: var(--sdds-information);
-}
-:host .toast-wrapper.success {
-  border-left: 4px solid var(--sdds-positive);
-}
-:host .toast-wrapper.success sdds-icon {
-  color: var(--sdds-positive);
-}
-:host .toast-wrapper.error {
-  border-left: 4px solid var(--sdds-negative);
-}
-:host .toast-wrapper.error sdds-icon {
-  color: var(--sdds-negative);
-}
-:host .toast-wrapper.warning {
-  border-left: 4px solid var(--sdds-warning);
-}
-:host .toast-wrapper.warning sdds-icon {
-  color: var(--sdds-warning);
-}
-:host .toast-wrapper button.toast-close {
-  height: 20px;
-  width: 20px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  margin: 14px 14px 0 0;
-  border: none;
-  background: transparent;
-}
-:host .toast-wrapper button.toast-close:hover {
-  cursor: pointer;
-}
-:host .toast-wrapper button.toast-close:focus {
-  outline: 2px solid var(--sdds-blue-400);
-  outline-offset: -2px;
-}
-:host .toast-wrapper button.toast-close sdds-icon {
-  color: var(--sdds-toast-dissmiss-color);
-  padding: 0;
-}
-:host sdds-icon {
-  padding: 14px 0 0 12px;
-}
-:host .toast-content {
-  padding: 16px 0 16px 10px;
-  display: flex;
-  flex-direction: column;
-  flex: 1;
-}
-:host .toast-content .toast-header {
-  font: var(--sdds-headline-07);
-  letter-spacing: var(--sdds-headline-07-ls);
-  color: var(--sdds-toast-headline-color);
-}
-:host .toast-content .toast-header.no-subheader {
-  margin-bottom: 4px;
-}
-:host .toast-content .toast-header.only-header {
-  margin-bottom: 0;
-}
-:host .toast-content .toast-subheader slot::slotted(*) {
-  margin-top: 4px;
-  color: var(--sdds-toast-subheadline-color);
-  font: var(--sdds-detail-02);
-  letter-spacing: var(--sdds-detail-02-ls);
-  padding-bottom: 16px;
-  max-width: 252px;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-:host .toast-content .toast-subheader.no-link slot::slotted(*) {
-  padding-bottom: 0;
-}
-:host slot[name=toast-link]::slotted(*) {
-  color: var(--sdds-toast-link-color);
-}
-:host .sdds-mode-variant-primary {
-  --sdds-toast-background: var(--sdds-toast-background-primary);
-}
-:host .sdds-mode-variant-secondary {
-  --sdds-toast-background: var(--sdds-toast-background-secondary);
-}