@scania/tegel 0.0.51 → 0.0.52

package/dist/collection/components/stepper/stepper-item/sdds-stepper-item.js

@@ -1,112 +1,112 @@
-import { Host, h } from '@stencil/core';
-export class SddsStepper {
-  constructor() {
-    this.labelText = '';
-    this.state = 'upcoming';
-    this.hideLabel = undefined;
-    this.size = undefined;
-    this.iconSize = undefined;
-    this.direction = undefined;
-    this.labelPosition = undefined;
-  }
-  componentWillLoad() {
-    this.stepperEl = this.el.closest('sdds-stepper');
-    this.direction = this.stepperEl.direction;
-    this.labelPosition = this.stepperEl.labelPosition;
-    this.size = this.stepperEl.size;
-    this.hideLabel = this.stepperEl.hideLabels;
-  }
-  /** Method to set the width if the stepper item based on its siblings widht, used by the parent element. */
-  async setWidth(width) {
-    this.el.style.width = `${width}px`;
-  }
-  render() {
-    return (h(Host, null, h("div", { role: "listItem", class: `${this.size} ${this.direction} text-${this.labelPosition} ${this.hideLabel ? 'hide-labels' : ''}` }, h("div", { class: `${this.state} content-container` }, this.state === 'success' || this.state === 'error' ? (h("sdds-icon", { name: this.state === 'success' ? 'tick' : 'warning', size: this.size === 'lg' ? '20px' : '16px' })) : (h("slot", { name: "index" }))), !this.hideLabel && (h("div", { class: `label ${this.size} ${this.state}` }, this.labelText)))));
-  }
-  static get is() { return "sdds-stepper-item"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["sdds-stepper-item.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["sdds-stepper-item.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "labelText": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Label text for the stepper-item."
-        },
-        "attribute": "label-text",
-        "reflect": false,
-        "defaultValue": "''"
-      },
-      "state": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "'current' | 'error' | 'success' | 'upcoming'",
-          "resolved": "\"current\" | \"error\" | \"success\" | \"upcoming\"",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "State of the stepper-item"
-        },
-        "attribute": "state",
-        "reflect": false,
-        "defaultValue": "'upcoming'"
-      }
-    };
-  }
-  static get states() {
-    return {
-      "hideLabel": {},
-      "size": {},
-      "iconSize": {},
-      "direction": {},
-      "labelPosition": {}
-    };
-  }
-  static get methods() {
-    return {
-      "setWidth": {
-        "complexType": {
-          "signature": "(width: any) => Promise<void>",
-          "parameters": [{
-              "tags": [],
-              "text": ""
-            }],
-          "references": {
-            "Promise": {
-              "location": "global"
-            }
-          },
-          "return": "Promise<void>"
-        },
-        "docs": {
-          "text": "Method to set the width if the stepper item based on its siblings widht, used by the parent element.",
-          "tags": []
-        }
-      }
-    };
-  }
-  static get elementRef() { return "el"; }
-}
-//# sourceMappingURL=sdds-stepper-item.js.map
+import { Host, h } from '@stencil/core';
+export class SddsStepper {
+  constructor() {
+    this.labelText = '';
+    this.state = 'upcoming';
+    this.hideLabel = undefined;
+    this.size = undefined;
+    this.iconSize = undefined;
+    this.direction = undefined;
+    this.labelPosition = undefined;
+  }
+  componentWillLoad() {
+    this.stepperEl = this.el.closest('sdds-stepper');
+    this.direction = this.stepperEl.direction;
+    this.labelPosition = this.stepperEl.labelPosition;
+    this.size = this.stepperEl.size;
+    this.hideLabel = this.stepperEl.hideLabels;
+  }
+  /** Method to set the width if the stepper item based on its siblings widht, used by the parent element. */
+  async setWidth(width) {
+    this.el.style.width = `${width}px`;
+  }
+  render() {
+    return (h(Host, null, h("div", { role: "listItem", class: `${this.size} ${this.direction} text-${this.labelPosition} ${this.hideLabel ? 'hide-labels' : ''}` }, h("div", { class: `${this.state} content-container` }, this.state === 'success' || this.state === 'error' ? (h("sdds-icon", { name: this.state === 'success' ? 'tick' : 'warning', size: this.size === 'lg' ? '20px' : '16px' })) : (h("slot", { name: "index" }))), !this.hideLabel && (h("div", { class: `label ${this.size} ${this.state}` }, this.labelText)))));
+  }
+  static get is() { return "sdds-stepper-item"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["sdds-stepper-item.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["sdds-stepper-item.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "labelText": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Label text for the stepper-item."
+        },
+        "attribute": "label-text",
+        "reflect": false,
+        "defaultValue": "''"
+      },
+      "state": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "'current' | 'error' | 'success' | 'upcoming'",
+          "resolved": "\"current\" | \"error\" | \"success\" | \"upcoming\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "State of the stepper-item"
+        },
+        "attribute": "state",
+        "reflect": false,
+        "defaultValue": "'upcoming'"
+      }
+    };
+  }
+  static get states() {
+    return {
+      "hideLabel": {},
+      "size": {},
+      "iconSize": {},
+      "direction": {},
+      "labelPosition": {}
+    };
+  }
+  static get methods() {
+    return {
+      "setWidth": {
+        "complexType": {
+          "signature": "(width: any) => Promise<void>",
+          "parameters": [{
+              "tags": [],
+              "text": ""
+            }],
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
+          },
+          "return": "Promise<void>"
+        },
+        "docs": {
+          "text": "Method to set the width if the stepper item based on its siblings widht, used by the parent element.",
+          "tags": []
+        }
+      }
+    };
+  }
+  static get elementRef() { return "el"; }
+}
+//# sourceMappingURL=sdds-stepper-item.js.map

package/dist/collection/components/stepper/stepper.stories.js

@@ -1,86 +1,86 @@
-import { formatHtmlPreview } from '../../utils/utils';
-export default {
-  title: 'Components/Stepper',
-  parameters: {
-    layout: 'centered',
-    design: [
-      {
-        name: 'Figma',
-        type: 'figma',
-        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=10508%3A32221&t=Ne6myqwca5m00de7-1',
-      },
-      {
-        name: 'Link',
-        type: 'link',
-        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=10508%3A32221&t=Ne6myqwca5m00de7-1',
-      },
-    ],
-  },
-  argTypes: {
-    size: {
-      name: 'Size',
-      description: 'Sets the size of the stepper.',
-      control: {
-        type: 'radio',
-      },
-      options: ['Large', 'Small'],
-      table: {
-        defaultValue: { summary: 'Large' },
-      },
-    },
-    style: {
-      name: 'Style',
-      description: 'Sets the style of the stepper.',
-      control: {
-        type: 'radio',
-      },
-      options: ['Default', 'Text on side', 'Vertical'],
-      table: {
-        defaultValue: { summary: 'Default' },
-      },
-    },
-    iconType: {
-      name: 'Icon type',
-      description: 'Switch between showing a native or a web component icon.',
-      control: {
-        type: 'radio',
-      },
-      options: ['Native', 'Web Component'],
-      table: {
-        defaultValue: { summary: 'Native' },
-      },
-    },
-    hideLabels: {
-      name: 'Hide labels',
-      description: 'Hides the labels for all stepper items.',
-      control: {
-        type: 'boolean',
-      },
-      table: {
-        defaultValue: { summary: false },
-      },
-    },
-  },
-  args: {
-    size: 'Large',
-    style: 'Default',
-    iconType: 'Native',
-    hideLabels: false,
-  },
-};
-const Template = ({ size, style, iconType, hideLabels }) => {
-  const sizeClass = size === 'Small' ? 'sdds-stepper-sm' : '';
-  const styleLookup = {
-    'Default': '',
-    'Text on side': 'sdds-stepper--sidetext',
-    'Vertical': 'sdds-stepper--vertical',
-  };
+import { formatHtmlPreview } from '../../utils/utils';
+export default {
+  title: 'Components/Stepper',
+  parameters: {
+    layout: 'centered',
+    design: [
+      {
+        name: 'Figma',
+        type: 'figma',
+        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=10508%3A32221&t=Ne6myqwca5m00de7-1',
+      },
+      {
+        name: 'Link',
+        type: 'link',
+        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=10508%3A32221&t=Ne6myqwca5m00de7-1',
+      },
+    ],
+  },
+  argTypes: {
+    size: {
+      name: 'Size',
+      description: 'Sets the size of the stepper.',
+      control: {
+        type: 'radio',
+      },
+      options: ['Large', 'Small'],
+      table: {
+        defaultValue: { summary: 'Large' },
+      },
+    },
+    style: {
+      name: 'Style',
+      description: 'Sets the style of the stepper.',
+      control: {
+        type: 'radio',
+      },
+      options: ['Default', 'Text on side', 'Vertical'],
+      table: {
+        defaultValue: { summary: 'Default' },
+      },
+    },
+    iconType: {
+      name: 'Icon type',
+      description: 'Switch between showing a native or a web component icon.',
+      control: {
+        type: 'radio',
+      },
+      options: ['Native', 'Web Component'],
+      table: {
+        defaultValue: { summary: 'Native' },
+      },
+    },
+    hideLabels: {
+      name: 'Hide labels',
+      description: 'Hides the labels for all stepper items.',
+      control: {
+        type: 'boolean',
+      },
+      table: {
+        defaultValue: { summary: false },
+      },
+    },
+  },
+  args: {
+    size: 'Large',
+    style: 'Default',
+    iconType: 'Native',
+    hideLabels: false,
+  },
+};
+const Template = ({ size, style, iconType, hideLabels }) => {
+  const sizeClass = size === 'Small' ? 'sdds-stepper-sm' : '';
+  const styleLookup = {
+    'Default': '',
+    'Text on side': 'sdds-stepper--sidetext',
+    'Vertical': 'sdds-stepper--vertical',
+  };
   return formatHtmlPreview(`
 
-    ${iconType === 'Native'
+    ${iconType === 'Native'
     ? ` <style>/* Note: In case using WebFont icons, please make sure to import icons css file in your implementation */
   @import url('https://cdn.digitaldesign.scania.com/icons/webfont/css/sdds-icons.css');</style>
-    `
+    `
     : ''}
 
 
@@ -95,9 +95,9 @@ const Template = ({ size, style, iconType, hideLabels }) => {
 
       <div class="sdds-stepper__step sdds-stepper__step--warning">
         <div class="sdds-stepper__step-icon">
-        ${iconType === 'Native'
+        ${iconType === 'Native'
     ? `<i class="sdds-icon warning"></i>
-        `
+        `
     : `<sdds-icon name="warning" size="${size === 'Small' ? '16px' : '18px'}"></sdds-icon> `}
         </div>
         ${hideLabels ? '' : '<label class="sdds-stepper__step_label">Step warning</label>'}
@@ -112,9 +112,9 @@ const Template = ({ size, style, iconType, hideLabels }) => {
 
       <div class="sdds-stepper__step sdds-stepper__step--success">
         <div class="sdds-stepper__step-icon">
-        ${iconType === 'Native'
+        ${iconType === 'Native'
     ? `<i class="sdds-icon tick"></i>
-        `
+        `
     : `<div>
         <sdds-icon name="tick" size="${size === 'Small' ? '16px' : '20px'}"></sdds-icon> 
         </div>`}
@@ -123,8 +123,8 @@ const Template = ({ size, style, iconType, hideLabels }) => {
       </div>
 
     </div>
-    `);
-};
-export const Native = Template.bind({});
-Native.args = {};
-//# sourceMappingURL=stepper.stories.js.map
+    `);
+};
+export const Native = Template.bind({});
+Native.args = {};
+//# sourceMappingURL=stepper.stories.js.map

package/dist/collection/components/tabs/folder-tabs/folder-tabs-button/sdds-folder-tabs-button.js

@@ -1,100 +1,100 @@
-import { Host, h } from '@stencil/core';
-export class SddsFolderTabsButton {
-  constructor() {
-    this.disabled = false;
-    this.selected = false;
-    this.tabWidth = undefined;
-  }
-  /** @internal Method to set the width of the tab. Used by the <sdds-folder-tabs> */
-  async setTabWidth(width) {
-    this.tabWidth = width;
-  }
-  render() {
+import { Host, h } from '@stencil/core';
+export class SddsFolderTabsButton {
+  constructor() {
+    this.disabled = false;
+    this.selected = false;
+    this.tabWidth = undefined;
+  }
+  /** @internal Method to set the width of the tab. Used by the <sdds-folder-tabs> */
+  async setTabWidth(width) {
+    this.tabWidth = width;
+  }
+  render() {
     return (h(Host, { role: "listitem" }, h("button", { style: { width: `${this.tabWidth}px` }, class: `${this.selected ? 'selected' : ''}
-          ${this.disabled ? 'disabled' : ''}`, disabled: this.disabled }, h("div", { class: "label" }, h("slot", { name: "label" })))));
-  }
-  static get is() { return "sdds-folder-tabs-button"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["sdds-folder-tabs-button.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["sdds-folder-tabs-button.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "disabled": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Disables the tab."
-        },
-        "attribute": "disabled",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "selected": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Marks the tab as the selected one."
-        },
-        "attribute": "selected",
-        "reflect": false,
-        "defaultValue": "false"
-      }
-    };
-  }
-  static get states() {
-    return {
-      "tabWidth": {}
-    };
-  }
-  static get methods() {
-    return {
-      "setTabWidth": {
-        "complexType": {
-          "signature": "(width: number) => Promise<void>",
-          "parameters": [{
-              "tags": [],
-              "text": ""
-            }],
-          "references": {
-            "Promise": {
-              "location": "global"
-            }
-          },
-          "return": "Promise<void>"
-        },
-        "docs": {
-          "text": "",
-          "tags": [{
-              "name": "internal",
-              "text": "Method to set the width of the tab. Used by the <sdds-folder-tabs>"
-            }]
-        }
-      }
-    };
-  }
-}
-//# sourceMappingURL=sdds-folder-tabs-button.js.map
+          ${this.disabled ? 'disabled' : ''}`, disabled: this.disabled }, h("div", { class: "label" }, h("slot", { name: "label" })))));
+  }
+  static get is() { return "sdds-folder-tabs-button"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["sdds-folder-tabs-button.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["sdds-folder-tabs-button.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "disabled": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Disables the tab."
+        },
+        "attribute": "disabled",
+        "reflect": false,
+        "defaultValue": "false"
+      },
+      "selected": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Marks the tab as the selected one."
+        },
+        "attribute": "selected",
+        "reflect": false,
+        "defaultValue": "false"
+      }
+    };
+  }
+  static get states() {
+    return {
+      "tabWidth": {}
+    };
+  }
+  static get methods() {
+    return {
+      "setTabWidth": {
+        "complexType": {
+          "signature": "(width: number) => Promise<void>",
+          "parameters": [{
+              "tags": [],
+              "text": ""
+            }],
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
+          },
+          "return": "Promise<void>"
+        },
+        "docs": {
+          "text": "",
+          "tags": [{
+              "name": "internal",
+              "text": "Method to set the width of the tab. Used by the <sdds-folder-tabs>"
+            }]
+        }
+      }
+    };
+  }
+}
+//# sourceMappingURL=sdds-folder-tabs-button.js.map