@six-group/ui-library 3.0.0-beta.1.7 → 3.0.0-beta.1.8

package/dist/collection/components/six-icon/six-icon.js

@@ -1,77 +1,77 @@
-import { Component, h, Prop } from '@stencil/core';
-/**
- * @since 1.0
- * @status stable
- *
- * @slot - Used to define the material icon name.
- */
-export class SixIcon {
-  constructor() {
-    /** The icon's size. */
-    this.size = 'inherit';
-    /** If set to true the default material outlined icons are not used. */
-    this.filled = false;
-  }
-  render() {
-    return (h("i", { class: {
-        'material-icons': true,
-        'material-icons-outlined': !this.filled,
-        'material-icons-filled': this.filled,
-        'icon--xsmall': this.size === 'xSmall',
-        'icon--small': this.size === 'small',
-        'icon--medium': this.size === 'medium',
-        'icon--large': this.size === 'large',
-        'icon--xlarge': this.size === 'xLarge',
-        'icon--xxlarge': this.size === 'xxLarge',
-        'icon--xxxlarge': this.size === 'xxxLarge',
-        'icon--inherit': this.size === 'inherit',
-      } },
-      h("slot", null)));
-  }
-  static get is() { return "six-icon"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["six-icon.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["six-icon.css"]
-  }; }
-  static get properties() { return {
-    "size": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "| 'inherit'\n    | 'xSmall'\n    | 'small'\n    | 'medium'\n    | 'large'\n    | 'xLarge'\n    | 'xxLarge'\n    | 'xxxLarge'",
-        "resolved": "\"inherit\" | \"large\" | \"medium\" | \"small\" | \"xLarge\" | \"xSmall\" | \"xxLarge\" | \"xxxLarge\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "The icon's size."
-      },
-      "attribute": "size",
-      "reflect": true,
-      "defaultValue": "'inherit'"
-    },
-    "filled": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "If set to true the default material outlined icons are not used."
-      },
-      "attribute": "filled",
-      "reflect": false,
-      "defaultValue": "false"
-    }
-  }; }
-}
+import { Component, h, Prop } from '@stencil/core';
+/**
+ * @since 1.0
+ * @status stable
+ *
+ * @slot - Used to define the material icon name.
+ */
+export class SixIcon {
+  constructor() {
+    /** The icon's size. */
+    this.size = 'inherit';
+    /** If set to true the default material outlined icons are not used. */
+    this.filled = false;
+  }
+  render() {
+    return (h("i", { class: {
+        'material-icons': true,
+        'material-icons-outlined': !this.filled,
+        'material-icons-filled': this.filled,
+        'icon--xsmall': this.size === 'xSmall',
+        'icon--small': this.size === 'small',
+        'icon--medium': this.size === 'medium',
+        'icon--large': this.size === 'large',
+        'icon--xlarge': this.size === 'xLarge',
+        'icon--xxlarge': this.size === 'xxLarge',
+        'icon--xxxlarge': this.size === 'xxxLarge',
+        'icon--inherit': this.size === 'inherit',
+      } },
+      h("slot", null)));
+  }
+  static get is() { return "six-icon"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() { return {
+    "$": ["six-icon.scss"]
+  }; }
+  static get styleUrls() { return {
+    "$": ["six-icon.css"]
+  }; }
+  static get properties() { return {
+    "size": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "| 'inherit'\n    | 'xSmall'\n    | 'small'\n    | 'medium'\n    | 'large'\n    | 'xLarge'\n    | 'xxLarge'\n    | 'xxxLarge'",
+        "resolved": "\"inherit\" | \"large\" | \"medium\" | \"small\" | \"xLarge\" | \"xSmall\" | \"xxLarge\" | \"xxxLarge\"",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "The icon's size."
+      },
+      "attribute": "size",
+      "reflect": true,
+      "defaultValue": "'inherit'"
+    },
+    "filled": {
+      "type": "boolean",
+      "mutable": false,
+      "complexType": {
+        "original": "boolean",
+        "resolved": "boolean",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "If set to true the default material outlined icons are not used."
+      },
+      "attribute": "filled",
+      "reflect": false,
+      "defaultValue": "false"
+    }
+  }; }
+}

package/dist/collection/components/six-icon-button/six-icon-button.js

@@ -1,142 +1,142 @@
-import { Component, h, Prop } from '@stencil/core';
-import { focusVisible } from '../../utils/focus-visible';
-/**
- * @since 1.0
- * @status stable
- *
- * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
- *
- * @part base - The component's base wrapper.
- */
-export class SixIconButton {
-  constructor() {
-    /** The icon's size. */
-    this.size = 'medium';
-    /** Set to true to disable the button. */
-    this.disabled = false;
-    this.handleClickEvent = (event) => {
-      if (this.disabled) {
-        event.preventDefault();
-        event.stopPropagation();
-      }
-    };
-  }
-  componentDidLoad() {
-    if (this.button) {
-      focusVisible.observe(this.button);
-    }
-  }
-  disconnectedCallback() {
-    if (this.button) {
-      focusVisible.unobserve(this.button);
-    }
-  }
-  render() {
-    const html = this.html && h("span", { innerHTML: this.html });
-    return (h("div", { onClick: this.handleClickEvent, class: { 'icon-button-wrapper--disabled': this.disabled } },
-      h("button", { ref: (el) => (this.button = el), part: "base", disabled: this.disabled, class: {
-          'icon-button': true,
-          'icon-button--disabled': this.disabled,
-        }, type: "button", "aria-label": this.label },
-        h("six-icon", { "aria-hidden": "true", size: this.size }, this.name),
-        h("slot", null),
-        html)));
-  }
-  static get is() { return "six-icon-button"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["six-icon-button.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["six-icon-button.css"]
-  }; }
-  static get properties() { return {
-    "name": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "The name of the icon to draw."
-      },
-      "attribute": "name",
-      "reflect": true
-    },
-    "size": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "'xSmall' | 'small' | 'medium' | 'large' | 'xLarge' | 'xxLarge' | 'xxxLarge'",
-        "resolved": "\"large\" | \"medium\" | \"small\" | \"xLarge\" | \"xSmall\" | \"xxLarge\" | \"xxxLarge\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "The icon's size."
-      },
-      "attribute": "size",
-      "reflect": true,
-      "defaultValue": "'medium'"
-    },
-    "label": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "A description that gets read by screen readers and other assistive devices. For optimal accessibility, you should\nalways include a label that describes what the icon button does."
-      },
-      "attribute": "label",
-      "reflect": true
-    },
-    "disabled": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Set to true to disable the button."
-      },
-      "attribute": "disabled",
-      "reflect": true,
-      "defaultValue": "false"
-    },
-    "html": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "HTML symbol code or entity."
-      },
-      "attribute": "html",
-      "reflect": true
-    }
-  }; }
-}
+import { Component, h, Prop } from '@stencil/core';
+import { focusVisible } from '../../utils/focus-visible';
+/**
+ * @since 1.0
+ * @status stable
+ *
+ * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
+ *
+ * @part base - The component's base wrapper.
+ */
+export class SixIconButton {
+  constructor() {
+    /** The icon's size. */
+    this.size = 'medium';
+    /** Set to true to disable the button. */
+    this.disabled = false;
+    this.handleClickEvent = (event) => {
+      if (this.disabled) {
+        event.preventDefault();
+        event.stopPropagation();
+      }
+    };
+  }
+  componentDidLoad() {
+    if (this.button) {
+      focusVisible.observe(this.button);
+    }
+  }
+  disconnectedCallback() {
+    if (this.button) {
+      focusVisible.unobserve(this.button);
+    }
+  }
+  render() {
+    const html = this.html && h("span", { innerHTML: this.html });
+    return (h("div", { onClick: this.handleClickEvent, class: { 'icon-button-wrapper--disabled': this.disabled } },
+      h("button", { ref: (el) => (this.button = el), part: "base", disabled: this.disabled, class: {
+          'icon-button': true,
+          'icon-button--disabled': this.disabled,
+        }, type: "button", "aria-label": this.label },
+        h("six-icon", { "aria-hidden": "true", size: this.size }, this.name),
+        h("slot", null),
+        html)));
+  }
+  static get is() { return "six-icon-button"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() { return {
+    "$": ["six-icon-button.scss"]
+  }; }
+  static get styleUrls() { return {
+    "$": ["six-icon-button.css"]
+  }; }
+  static get properties() { return {
+    "name": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "The name of the icon to draw."
+      },
+      "attribute": "name",
+      "reflect": true
+    },
+    "size": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "'xSmall' | 'small' | 'medium' | 'large' | 'xLarge' | 'xxLarge' | 'xxxLarge'",
+        "resolved": "\"large\" | \"medium\" | \"small\" | \"xLarge\" | \"xSmall\" | \"xxLarge\" | \"xxxLarge\"",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "The icon's size."
+      },
+      "attribute": "size",
+      "reflect": true,
+      "defaultValue": "'medium'"
+    },
+    "label": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "A description that gets read by screen readers and other assistive devices. For optimal accessibility, you should\nalways include a label that describes what the icon button does."
+      },
+      "attribute": "label",
+      "reflect": true
+    },
+    "disabled": {
+      "type": "boolean",
+      "mutable": false,
+      "complexType": {
+        "original": "boolean",
+        "resolved": "boolean",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Set to true to disable the button."
+      },
+      "attribute": "disabled",
+      "reflect": true,
+      "defaultValue": "false"
+    },
+    "html": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "HTML symbol code or entity."
+      },
+      "attribute": "html",
+      "reflect": true
+    }
+  }; }
+}