@siemens/ix 2.0.0-beta.0 → 2.0.0-beta.1

package/dist/collection/components/form-field/form-field.css

@@ -0,0 +1,234 @@
+/*
+ * SPDX-FileCopyrightText: 2023 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+/*
+ * SPDX-FileCopyrightText: 2023 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+/*
+ * SPDX-FileCopyrightText: 2023 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+/* Dimensions */
+/* Font sizes */
+/* Line heights */
+/* Animation timings */
+/*
+ * SPDX-FileCopyrightText: 2023 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+label {
+  color: var(--theme-color-soft-text);
+}
+
+input, input:-webkit-autofill {
+  font-feature-settings: "clig" off, "liga" off;
+  font-family: Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;
+  font-style: normal;
+  font-size: var(--theme-ms-0);
+  line-height: var(--theme-line-height-md);
+  font-weight: var(--theme-font-weight-normal);
+  letter-spacing: var(--theme-letter-spacing-xl);
+  text-decoration: none;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smooting: grayscale;
+  min-height: 2rem;
+  width: 100%;
+  padding: 0.25rem 0.5rem;
+  background-color: var(--theme-input--background);
+  color: var(--theme-input--color);
+  border: var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color);
+  border-radius: var(--theme-input--border-radius);
+  box-shadow: var(--theme-input--box-shadow);
+}
+input:-webkit-autofill {
+  -webkit-box-shadow: 0 0 0 1000px var(--theme-input--background) inset !important;
+  -webkit-text-fill-color: var(--theme-input--color) !important;
+  border-color: var(--theme-input--border-color) !important;
+}
+input::-moz-placeholder {
+  color: var(--theme-input-hint--color);
+}
+input::placeholder {
+  color: var(--theme-input-hint--color);
+}
+input.hover, input:hover {
+  border-color: var(--theme-input--border-color--hover);
+  background-color: var(--theme-input--background--hover);
+}
+input.focus, input:focus {
+  outline: 1px solid var(--theme-color-focus-bdr);
+  outline-offset: var(--theme-input--focus--outline-offset);
+  border-color: var(--theme-input--border-color--focus);
+}
+input:-moz-read-only {
+  box-shadow: none;
+  background-color: transparent;
+  outline: none;
+  border: none;
+  border-bottom: var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly);
+}
+input.read-only, input:read-only {
+  box-shadow: none;
+  background-color: transparent;
+  outline: none;
+  border: none;
+  border-bottom: var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly);
+}
+input:disabled {
+  box-shadow: none;
+  background-color: transparent;
+  outline: none;
+  border: none;
+  color: var(--theme-input--color--disabled);
+  border-bottom: var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--disabled);
+}
+
+input[type=number] {
+  text-align: right;
+}
+input[type=number]::-webkit-inner-spin-button {
+  margin-right: -2px;
+  margin-left: 2px;
+  display: none;
+}
+
+textarea {
+  height: 3.25rem;
+  padding: 0.375rem 1.25rem 0.375rem 0.5rem;
+}
+textarea, textarea:-webkit-autofill {
+  font-feature-settings: "clig" off, "liga" off;
+  font-family: Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;
+  font-style: normal;
+  font-size: var(--theme-ms-0);
+  line-height: var(--theme-line-height-md);
+  font-weight: var(--theme-font-weight-normal);
+  letter-spacing: var(--theme-letter-spacing-xl);
+  text-decoration: none;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smooting: grayscale;
+  min-height: 2rem;
+  width: 100%;
+  padding: 0.25rem 0.5rem;
+  background-color: var(--theme-input--background);
+  color: var(--theme-input--color);
+  border: var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color);
+  border-radius: var(--theme-input--border-radius);
+  box-shadow: var(--theme-input--box-shadow);
+}
+textarea:-webkit-autofill {
+  -webkit-box-shadow: 0 0 0 1000px var(--theme-input--background) inset !important;
+  -webkit-text-fill-color: var(--theme-input--color) !important;
+  border-color: var(--theme-input--border-color) !important;
+}
+textarea::-moz-placeholder {
+  color: var(--theme-input-hint--color);
+}
+textarea::placeholder {
+  color: var(--theme-input-hint--color);
+}
+textarea.hover, textarea:hover {
+  border-color: var(--theme-input--border-color--hover);
+  background-color: var(--theme-input--background--hover);
+}
+textarea.focus, textarea:focus {
+  outline: 1px solid var(--theme-color-focus-bdr);
+  outline-offset: var(--theme-input--focus--outline-offset);
+  border-color: var(--theme-input--border-color--focus);
+}
+textarea:-moz-read-only {
+  box-shadow: none;
+  background-color: transparent;
+  outline: none;
+  border: none;
+  border-bottom: var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly);
+}
+textarea.read-only, textarea:read-only {
+  box-shadow: none;
+  background-color: transparent;
+  outline: none;
+  border: none;
+  border-bottom: var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly);
+}
+textarea:disabled {
+  box-shadow: none;
+  background-color: transparent;
+  outline: none;
+  border: none;
+  color: var(--theme-input--color--disabled);
+  border-bottom: var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--disabled);
+}
+
+textarea ~ .valid-feedback,
+textarea ~ .invalid-feedback,
+input ~ .valid-feedback,
+input ~ .invalid-feedback {
+  display: none;
+  font-feature-settings: "clig" off, "liga" off;
+  font-family: Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;
+  font-style: normal;
+  font-size: var(--theme-ms-0);
+  line-height: var(--theme-line-height-md);
+  font-weight: var(--theme-font-weight-normal);
+  letter-spacing: var(--theme-letter-spacing-xl);
+  text-decoration: none;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smooting: grayscale;
+}
+
+form textarea ~ .valid-feedback,
+form input ~ .valid-feedback {
+  color: var(--theme-color-success);
+}
+form textarea ~ .invalid-feedback,
+form input ~ .invalid-feedback {
+  color: var(--theme-color-alarm-text);
+}
+
+form:not([novalidate]) :invalid,
+form:not([novalidate]) .is-invalid,
+form.was-validated :invalid,
+form.was-validated .is-invalid {
+  background-color: var(--theme-input-error--background);
+  border-color: var(--theme-input-error--border-color);
+  background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg width='512px' height='512px' viewBox='0 0 512 512' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3C!-- Generator: sketchtool 62 (101010) - https://sketch.com --%3E%3Ctitle%3Eerror%3C/title%3E%3Cdesc%3ECreated with sketchtool.%3C/desc%3E%3Cg id='Page-1' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd' fill-opacity='0.75'%3E%3Cg id='error' fill='%23ff2640'%3E%3Cg id='error/error'%3E%3Cpath d='M256,42.6666667 C373.626371,42.6666667 469.333333,138.373627 469.333333,256 C469.333333,373.626371 373.626371,469.333333 256,469.333333 C138.373627,469.333333 42.6666667,373.626371 42.6666667,256 C42.6666667,138.373627 138.373627,42.6666667 256,42.6666667 Z M256,85.3333333 C161.559631,85.3333333 85.3333333,161.559631 85.3333333,256 C85.3333333,350.44037 161.559631,426.666667 256,426.666667 C350.44037,426.666667 426.666667,350.44037 426.666667,256 C426.666667,161.559631 350.44037,85.3333333 256,85.3333333 Z M326.248389,155.581722 L356.418278,185.751611 L286.168667,255.999667 L356.418278,326.248389 L326.248389,356.418278 L255.999667,286.168667 L185.751611,356.418278 L155.581722,326.248389 L225.829667,255.999667 L155.581722,185.751611 L185.751611,155.581722 L255.999667,225.829667 L326.248389,155.581722 Z' id='Combined-Shape'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") !important;
+  background-position: left calc(0.375em + 0.1875rem) center;
+  padding-right: 0.75rem;
+  padding-left: calc(1.5em + 0.75rem);
+  background-size: 18px;
+  background-repeat: no-repeat;
+}
+form:not([novalidate]) :invalid ~ .invalid-feedback,
+form:not([novalidate]) .is-invalid ~ .invalid-feedback,
+form.was-validated :invalid ~ .invalid-feedback,
+form.was-validated .is-invalid ~ .invalid-feedback {
+  display: block;
+}
+form:not([novalidate]) :valid ~ .valid-feedback,
+form:not([novalidate]) .is-valid ~ .valid-feedback,
+form.was-validated :valid ~ .valid-feedback,
+form.was-validated .is-valid ~ .valid-feedback {
+  display: block;
+}
+
+:host {
+  display: contents;
+}

package/dist/collection/components/form-field/form-field.js

@@ -0,0 +1,56 @@
+/*
+ * SPDX-FileCopyrightText: 2023 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import { h, Host } from '@stencil/core';
+export class FormField {
+  constructor() {
+    this.label = undefined;
+  }
+  get inputElement() {
+    return this.hostElement.querySelector('input');
+  }
+  componentWillLoad() { }
+  render() {
+    return (h(Host, null, this.label ? (h("label", { htmlFor: this.inputElement.id }, this.label)) : null, h("slot", null)));
+  }
+  static get is() { return "ix-form-field"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["form-field.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["form-field.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "label": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Label"
+        },
+        "attribute": "label",
+        "reflect": false
+      }
+    };
+  }
+  static get elementRef() { return "hostElement"; }
+}
+//# sourceMappingURL=form-field.js.map

package/dist/collection/components/form-field/form-field.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"form-field.js","sourceRoot":"","sources":["../../../src/components/form-field/form-field.tsx"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AACH,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAOlE,MAAM,OAAO,SAAS;;;;EAQpB,IAAY,YAAY;IACtB,OAAO,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;EACjD,CAAC;EAED,iBAAiB,KAAI,CAAC;EAEtB,MAAM;IACJ,OAAO,CACL,EAAC,IAAI;MACF,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CACZ,aAAO,OAAO,EAAE,IAAI,CAAC,YAAY,CAAC,EAAE,IAAG,IAAI,CAAC,KAAK,CAAS,CAC3D,CAAC,CAAC,CAAC,IAAI;MACR,eAAa,CACR,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\nimport { Component, Element, h, Host, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'ix-form-field',\n  styleUrl: 'form-field.scss',\n  shadow: true,\n})\nexport class FormField {\n  @Element() hostElement!: HTMLIxFormFieldElement;\n\n  /**\n   * Label\n   */\n  @Prop() label: string;\n\n  private get inputElement() {\n    return this.hostElement.querySelector('input');\n  }\n\n  componentWillLoad() {}\n\n  render() {\n    return (\n      <Host>\n        {this.label ? (\n          <label htmlFor={this.inputElement.id}>{this.label}</label>\n        ) : null}\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/grid/grid.css

@@ -0,0 +1,26 @@
+/*
+ * SPDX-FileCopyrightText: 2023 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+:host {
+  --ix-grid-gutter: 1.5rem;
+  display: block;
+  flex: 1;
+  width: 100%;
+  padding-left: calc(var(--ix-grid-gutter) * 0.5);
+  padding-right: calc(var(--ix-grid-gutter) * 0.5);
+  --ix-grid-row-margin: 1rem;
+}
+
+:host(.no-padding) {
+  padding-left: 0;
+  padding-right: 0;
+}
+
+:host(.no-row-gap) {
+  --ix-grid-row-margin: 0rem;
+}

package/dist/collection/components/grid/grid.js

@@ -0,0 +1,98 @@
+/*
+ * SPDX-FileCopyrightText: 2023 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import { h, Host } from '@stencil/core';
+/**
+ * @since 2.0.0
+ */
+export class Grid {
+  constructor() {
+    this.noPadding = false;
+    this.noRowGap = false;
+    this.columns = 12;
+  }
+  render() {
+    return (h(Host, { class: {
+        'no-padding': this.noPadding,
+        'no-row-gap': this.noRowGap,
+      }, style: {
+        '--ix-grid-columns': `${this.columns}`,
+      } }, h("slot", null)));
+  }
+  static get is() { return "ix-grid"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["grid.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["grid.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "noPadding": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The grid will not have any horizontal padding"
+        },
+        "attribute": "no-padding",
+        "reflect": false,
+        "defaultValue": "false"
+      },
+      "noRowGap": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Remove the gap between rows"
+        },
+        "attribute": "no-row-gap",
+        "reflect": false,
+        "defaultValue": "false"
+      },
+      "columns": {
+        "type": "number",
+        "mutable": false,
+        "complexType": {
+          "original": "number",
+          "resolved": "number",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Overwrite the default number of columns. Choose between 2 and 12 columns."
+        },
+        "attribute": "columns",
+        "reflect": false,
+        "defaultValue": "12"
+      }
+    };
+  }
+}
+//# sourceMappingURL=grid.js.map

package/dist/collection/components/grid/grid.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grid.js","sourceRoot":"","sources":["../../../src/components/grid/grid.tsx"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEzD;;GAEG;AAMH,MAAM,OAAO,IAAI;;qBAIK,KAAK;oBAKN,KAAK;mBAKN,EAAE;;EAEpB,MAAM;IACJ,OAAO,CACL,EAAC,IAAI,IACH,KAAK,EAAE;QACL,YAAY,EAAE,IAAI,CAAC,SAAS;QAC5B,YAAY,EAAE,IAAI,CAAC,QAAQ;OAC5B,EACD,KAAK,EAAE;QACL,mBAAmB,EAAE,GAAG,IAAI,CAAC,OAAO,EAAE;OACvC;MAED,eAAa,CACR,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, h, Host, Prop } from '@stencil/core';\n\n/**\n * @since 2.0.0\n */\n@Component({\n  tag: 'ix-grid',\n  styleUrl: 'grid.scss',\n  shadow: true,\n})\nexport class Grid {\n  /**\n   * The grid will not have any horizontal padding\n   */\n  @Prop() noPadding = false;\n\n  /**\n   * Remove the gap between rows\n   */\n  @Prop() noRowGap = false;\n\n  /**\n   * Overwrite the default number of columns. Choose between 2 and 12 columns.\n   */\n  @Prop() columns = 12;\n\n  render() {\n    return (\n      <Host\n        class={{\n          'no-padding': this.noPadding,\n          'no-row-gap': this.noRowGap,\n        }}\n        style={{\n          '--ix-grid-columns': `${this.columns}`,\n        }}\n      >\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/group/group.css

@@ -65,19 +65,19 @@
 :host .group-header:not(.disabled):not(:disabled) {
   cursor: pointer;
 }
-:host .group-header:not(.disabled):not(:disabled):hover {
+:host .group-header:not(.disabled):not(:disabled):hover, :host .group-header:not(.disabled):not(:disabled):hover {
   background-color: var(--theme-group-item--background--hover);
 }
-:host .group-header:not(.disabled):not(:disabled):hover.selected {
+:host .group-header:not(.disabled):not(:disabled):hover.selected, :host .group-header:not(.disabled):not(:disabled):hover.selected {
   background-color: var(--theme-group-item--background--selected);
 }
 :host .group-header:not(.disabled):not(:disabled) {
   cursor: pointer;
 }
-:host .group-header:not(.disabled):not(:disabled):active {
+:host .group-header:not(.disabled):not(:disabled):active, :host .group-header:not(.disabled):not(:disabled).active {
   background-color: var(--theme-group-item--background--active);
 }
-:host .group-header:not(.disabled):not(:disabled):active.selected {
+:host .group-header:not(.disabled):not(:disabled):active.selected, :host .group-header:not(.disabled):not(:disabled).active.selected {
   background-color: var(--theme-group-item--background--selected);
 }
 :host .group-header:not(.disabled):not(:disabled):focus-visible {

package/dist/collection/components/group-item/group-item.css

@@ -50,7 +50,19 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
+/*
+ * SPDX-FileCopyrightText: 2023 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
 :host {
+  /* width */
+  /* Track */
+  /* Handle */
+  /* Handle on hover */
   display: flex;
   min-height: 2.25rem;
   height: 2.25rem;
@@ -60,6 +72,30 @@
 :host *::before {
   box-sizing: border-box;
 }
+:host ::-webkit-scrollbar-button {
+  display: none;
+}
+:host ::-webkit-scrollbar {
+  width: 0.5rem;
+  height: 0.5rem;
+}
+:host ::-webkit-scrollbar-track {
+  border-radius: 5px;
+  background: var(--theme-scrollbar-track--background);
+}
+:host ::-webkit-scrollbar-track:hover {
+  background: var(--theme-scrollbar-track--background--hover);
+}
+:host ::-webkit-scrollbar-thumb {
+  border-radius: 5px;
+  background: var(--theme-scrollbar-thumb--background);
+}
+:host ::-webkit-scrollbar-thumb:hover {
+  background: var(--theme-scrollbar-thumb--background--hover);
+}
+:host ::-webkit-scrollbar-corner {
+  display: none;
+}
 :host > button {
   display: flex;
   height: 100%;

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

@@ -0,0 +1,14 @@
+/*
+ * SPDX-FileCopyrightText: 2023 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import { h } from '@stencil/core';
+import { BaseButton } from '../button/base-button';
+export function BaseIconButton(props) {
+  return h(BaseButton, Object.assign({}, props, { type: "button" }));
+}
+//# sourceMappingURL=base-icon-button.js.map

package/dist/collection/components/icon-button/base-icon-button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"base-icon-button.js","sourceRoot":"","sources":["../../../src/components/icon-button/base-icon-button.tsx"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAClC,OAAO,EAAE,UAAU,EAAmB,MAAM,uBAAuB,CAAC;AAEpE,MAAM,UAAU,cAAc,CAAC,KAAoC;EACjE,OAAO,EAAC,UAAU,oBAAK,KAAK,IAAE,IAAI,EAAC,QAAQ,IAAc,CAAC;AAC5D,CAAC","sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { h } from '@stencil/core';\nimport { BaseButton, BaseButtonProps } from '../button/base-button';\n\nexport function BaseIconButton(props: Omit<BaseButtonProps, 'type'>) {\n  return <BaseButton {...props} type=\"button\"></BaseButton>;\n}\n"]}