npm - @six-group/ui-library - Versions diffs - 0.0.0-insider.cd0cd0d → 0.0.0-insider.db2b416 - Mend

@six-group/ui-library 0.0.0-insider.cd0cd0d → 0.0.0-insider.db2b416

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (744) hide show

package/dist/collection/components/six-tab-panel/test/six-tab-panel.spec.js ADDED Viewed

@@ -0,0 +1,20 @@
+import { newSpecPage } from "@stencil/core/testing";
+import { SixTabPanel } from "../six-tab-panel";
+describe('six-tab-panel', () => {
+  it('renders', async () => {
+    const page = await newSpecPage({
+      components: [SixTabPanel],
+      html: `<six-tab-panel></six-tab-panel>`,
+    });
+    expect(page.root).toEqualHtml(`
+      <six-tab-panel id="tab-panel-1" style="display: none;">
+        <mock:shadow-root>
+          <div aria-hidden="true" aria-selected="false" class="tab-panel" part="base" role="tabpanel">
+            <slot></slot>
+          </div>
+        </mock:shadow-root>
+      </six-tab-panel>
+    `);
+  });
+});
+//# sourceMappingURL=six-tab-panel.spec.js.map

package/dist/collection/components/six-tab-panel/test/six-tab-panel.spec.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"six-tab-panel.spec.js","sourceRoot":"","sources":["../../../../src/components/six-tab-panel/test/six-tab-panel.spec.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAE/C,QAAQ,CAAC,eAAe,EAAE,GAAG,EAAE;EAC7B,EAAE,CAAC,SAAS,EAAE,KAAK,IAAI,EAAE;IACvB,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;MAC7B,UAAU,EAAE,CAAC,WAAW,CAAC;MACzB,IAAI,EAAE,iCAAiC;KACxC,CAAC,CAAC;IACH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;KAQ7B,CAAC,CAAC;EACL,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { newSpecPage } from '@stencil/core/testing';\nimport { SixTabPanel } from '../six-tab-panel';\n\ndescribe('six-tab-panel', () => {\n it('renders', async () => {\n const page = await newSpecPage({\n components: [SixTabPanel],\n html: `<six-tab-panel></six-tab-panel>`,\n });\n expect(page.root).toEqualHtml(`\n <six-tab-panel id=\"tab-panel-1\" style=\"display: none;\">\n <mock:shadow-root>\n <div aria-hidden=\"true\" aria-selected=\"false\" class=\"tab-panel\" part=\"base\" role=\"tabpanel\">\n <slot></slot>\n </div>\n </mock:shadow-root>\n </six-tab-panel>\n `);\n });\n});\n"]}

package/dist/collection/components/six-tag/six-tag.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { h } from '@stencil/core';
+import { h } from "@stencil/core";
 /**
  * @since 1.0
  * @status stable
@@ -146,7 +146,8 @@ export class SixTag {
           "references": {
             "EmptyPayload": {
               "location": "import",
-              "path": "../../utils/types"
+              "path": "../../utils/types",
+              "id": "src/utils/types.ts::EmptyPayload"
             }
           }
         }

package/dist/collection/components/six-tag/six-tag.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"six-tag.js","sourceRoot":"","sources":["../../../src/components/six-tag/six-tag.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAgB,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAGxE;;;;;;;;;;;GAWG;AAOH,MAAM,OAAO,MAAM;;IAgBT,qBAAgB,GAAG,GAAG,EAAE;MAC9B,IAAI,CAAC,QAAQ,CAAC,IAAI,EAAE,CAAC;IACvB,CAAC,CAAC;gBAhByG,SAAS;gBAGtD,QAAQ;gBAGtC,KAAK;qBAGA,KAAK;;EAS1C,MAAM;IACJ,OAAO,CACL,YACE,IAAI,EAAC,MAAM,EACX,KAAK,EAAE;QACL,GAAG,EAAE,IAAI;QAET,QAAQ;QACR,cAAc,EAAE,IAAI,CAAC,IAAI,KAAK,SAAS;QACvC,cAAc,EAAE,IAAI,CAAC,IAAI,KAAK,SAAS;QACvC,WAAW,EAAE,IAAI,CAAC,IAAI,KAAK,MAAM;QACjC,cAAc,EAAE,IAAI,CAAC,IAAI,KAAK,SAAS;QACvC,aAAa,EAAE,IAAI,CAAC,IAAI,KAAK,QAAQ;QACrC,aAAa,EAAE,IAAI,CAAC,IAAI,KAAK,QAAQ;QACrC,WAAW,EAAE,IAAI,CAAC,IAAI,KAAK,MAAM;QAEjC,QAAQ;QACR,YAAY,EAAE,IAAI,CAAC,IAAI,KAAK,OAAO;QACnC,aAAa,EAAE,IAAI,CAAC,IAAI,KAAK,QAAQ;QACrC,YAAY,EAAE,IAAI,CAAC,IAAI,KAAK,OAAO;QAEnC,WAAW;QACX,WAAW,EAAE,IAAI,CAAC,IAAI;QACtB,YAAY,EAAE,IAAI,CAAC,SAAS;OAC7B;MAED,YAAM,IAAI,EAAC,SAAS,EAAC,KAAK,EAAC,cAAc;QACvC,eAAQ,CACH;MAEN,IAAI,CAAC,SAAS,IAAI,CACjB,uBACE,WAAW,EAAC,mBAAmB,EAC/B,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,YAAY,EAClB,OAAO,EAAE,IAAI,CAAC,gBAAgB,GAC9B,CACH,CACI,CACR,CAAC;EACJ,CAAC~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~CACF","sourcesContent":["import { Component, Event, EventEmitter, h, Prop } from '@stencil/core';\nimport { EmptyPayload } from '../../utils/types';\n\n/*\n @since 1.0\n * @status stable\n \n Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n \n @slot - The tag's content.\n \n @part base - The component's base wrapper.\n * @part content - The tag content.\n * @part clear-button - The clear button.\n /\n\n@Component({\n tag: 'six-tag',\n styleUrl: 'six-tag.scss',\n shadow: true,\n})\nexport class SixTag {\n /* The tag's type. /\n @Prop({ reflect: true }) type: 'primary' \| 'success' \| 'info' \| 'warning' \| 'danger' \| 'action' \| 'text' = 'primary';\n\n /* The tag's size. /\n @Prop({ reflect: true }) size: 'small' \| 'medium' \| 'large' = 'medium';\n\n /* Set to true to draw a pill-style tag with rounded edges. /\n @Prop({ reflect: true }) pill = false;\n\n /* Set to true to make the tag clearable. /\n @Prop({ reflect: true }) clearable = false;\n\n /* Emitted when the clear button is activated. */\n @Event({ eventName: 'six-tag-clear' }) sixClear!: EventEmitter<EmptyPayload>;\n\n private handleClearClick = () => {\n this.sixClear.emit();\n };\n\n render() {\n return (\n <span\n part=\"base\"\n class={{\n tag: true,\n\n // Types\n 'tag--primary': this.type === 'primary',\n 'tag--success': this.type === 'success',\n 'tag--info': this.type === 'info',\n 'tag--warning': this.type === 'warning',\n 'tag--danger': this.type === 'danger',\n 'tag--action': this.type === 'action',\n 'tag--text': this.type === 'text',\n\n // Sizes\n 'tag--small': this.size === 'small',\n 'tag--medium': this.size === 'medium',\n 'tag--large': this.size === 'large',\n\n // Modifers\n 'tag--pill': this.pill,\n 'tag--clear': this.clearable,\n }}\n >\n <span part=\"content\" class=\"tag__content\">\n <slot />\n </span>\n\n {this.clearable && (\n <six-icon-button\n exportparts=\"base:clear-button\"\n size=\"xSmall\"\n name=\"clear\"\n class=\"tag__clear\"\n onClick={this.handleClearClick}\n />\n )}\n </span>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"six-tag.js","sourceRoot":"","sources":["../../../src/components/six-tag/six-tag.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAgB,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAGxE;;;;;;;;;;;GAWG;AAOH,MAAM,OAAO,MAAM;;IAgBT,qBAAgB,GAAG,GAAG,EAAE;MAC9B,IAAI,CAAC,QAAQ,CAAC,IAAI,EAAE,CAAC;IACvB,CAAC,CAAC;gBAhByG,SAAS;gBAGtD,QAAQ;gBAGtC,KAAK;qBAGA,KAAK;;EAS1C,MAAM;IACJ,OAAO,CACL,YACE,IAAI,EAAC,MAAM,EACX,KAAK,EAAE;QACL,GAAG,EAAE,IAAI;QAET,QAAQ;QACR,cAAc,EAAE,IAAI,CAAC,IAAI,KAAK,SAAS;QACvC,cAAc,EAAE,IAAI,CAAC,IAAI,KAAK,SAAS;QACvC,WAAW,EAAE,IAAI,CAAC,IAAI,KAAK,MAAM;QACjC,cAAc,EAAE,IAAI,CAAC,IAAI,KAAK,SAAS;QACvC,aAAa,EAAE,IAAI,CAAC,IAAI,KAAK,QAAQ;QACrC,aAAa,EAAE,IAAI,CAAC,IAAI,KAAK,QAAQ;QACrC,WAAW,EAAE,IAAI,CAAC,IAAI,KAAK,MAAM;QAEjC,QAAQ;QACR,YAAY,EAAE,IAAI,CAAC,IAAI,KAAK,OAAO;QACnC,aAAa,EAAE,IAAI,CAAC,IAAI,KAAK,QAAQ;QACrC,YAAY,EAAE,IAAI,CAAC,IAAI,KAAK,OAAO;QAEnC,WAAW;QACX,WAAW,EAAE,IAAI,CAAC,IAAI;QACtB,YAAY,EAAE,IAAI,CAAC,SAAS;OAC7B;MAED,YAAM,IAAI,EAAC,SAAS,EAAC,KAAK,EAAC,cAAc;QACvC,eAAQ,CACH;MAEN,IAAI,CAAC,SAAS,IAAI,CACjB,uBACE,WAAW,EAAC,mBAAmB,EAC/B,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,YAAY,EAClB,OAAO,EAAE,IAAI,CAAC,gBAAgB,GAC9B,CACH,CACI,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Event, EventEmitter, h, Prop } from '@stencil/core';\nimport { EmptyPayload } from '../../utils/types';\n\n/*\n @since 1.0\n * @status stable\n \n Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n \n @slot - The tag's content.\n \n @part base - The component's base wrapper.\n * @part content - The tag content.\n * @part clear-button - The clear button.\n /\n\n@Component({\n tag: 'six-tag',\n styleUrl: 'six-tag.scss',\n shadow: true,\n})\nexport class SixTag {\n /* The tag's type. /\n @Prop({ reflect: true }) type: 'primary' \| 'success' \| 'info' \| 'warning' \| 'danger' \| 'action' \| 'text' = 'primary';\n\n /* The tag's size. /\n @Prop({ reflect: true }) size: 'small' \| 'medium' \| 'large' = 'medium';\n\n /* Set to true to draw a pill-style tag with rounded edges. /\n @Prop({ reflect: true }) pill = false;\n\n /* Set to true to make the tag clearable. /\n @Prop({ reflect: true }) clearable = false;\n\n /* Emitted when the clear button is activated. */\n @Event({ eventName: 'six-tag-clear' }) sixClear!: EventEmitter<EmptyPayload>;\n\n private handleClearClick = () => {\n this.sixClear.emit();\n };\n\n render() {\n return (\n <span\n part=\"base\"\n class={{\n tag: true,\n\n // Types\n 'tag--primary': this.type === 'primary',\n 'tag--success': this.type === 'success',\n 'tag--info': this.type === 'info',\n 'tag--warning': this.type === 'warning',\n 'tag--danger': this.type === 'danger',\n 'tag--action': this.type === 'action',\n 'tag--text': this.type === 'text',\n\n // Sizes\n 'tag--small': this.size === 'small',\n 'tag--medium': this.size === 'medium',\n 'tag--large': this.size === 'large',\n\n // Modifers\n 'tag--pill': this.pill,\n 'tag--clear': this.clearable,\n }}\n >\n <span part=\"content\" class=\"tag__content\">\n <slot />\n </span>\n\n {this.clearable && (\n <six-icon-button\n exportparts=\"base:clear-button\"\n size=\"xSmall\"\n name=\"clear\"\n class=\"tag__clear\"\n onClick={this.handleClearClick}\n />\n )}\n </span>\n );\n }\n}\n"]}

package/dist/collection/components/six-tag/test/six-tag.spec.js ADDED Viewed

@@ -0,0 +1,42 @@
+import { newSpecPage } from "@stencil/core/testing";
+import { SixTag } from "../six-tag";
+describe('six-tag', () => {
+  it('renders', async () => {
+    const page = await newSpecPage({
+      components: [SixTag],
+      html: `<six-tag size="small">label</six-tag>`,
+    });
+    expect(page.root).toEqualHtml(`
+      <six-tag size="small" type="primary">
+        <mock:shadow-root>
+          <span class="tag tag--primary tag--small" part="base">
+            <span class="tag__content" part="content">
+              <slot></slot>
+            </span>
+          </span>
+        </mock:shadow-root>
+        label
+      </six-tag>
+    `);
+  });
+  it('renders clearable', async () => {
+    const page = await newSpecPage({
+      components: [SixTag],
+      html: `<six-tag size="medium" clearable>label</six-tag>`,
+    });
+    expect(page.root).toEqualHtml(`
+      <six-tag clearable="" size="medium" type="primary">
+        <mock:shadow-root>
+          <span class="tag tag--clear tag--medium tag--primary" part="base">
+            <span class="tag__content" part="content">
+              <slot></slot>
+            </span>
+            <six-icon-button class="tag__clear" exportparts="base:clear-button" name="clear" size="xSmall"></six-icon-button>
+          </span>
+        </mock:shadow-root>
+        label
+      </six-tag>
+    `);
+  });
+});
+//# sourceMappingURL=six-tag.spec.js.map

package/dist/collection/components/six-tag/test/six-tag.spec.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"six-tag.spec.js","sourceRoot":"","sources":["../../../../src/components/six-tag/test/six-tag.spec.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,MAAM,EAAE,MAAM,YAAY,CAAC;AAEpC,QAAQ,CAAC,SAAS,EAAE,GAAG,EAAE;EACvB,EAAE,CAAC,SAAS,EAAE,KAAK,IAAI,EAAE;IACvB,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;MAC7B,UAAU,EAAE,CAAC,MAAM,CAAC;MACpB,IAAI,EAAE,uCAAuC;KAC9C,CAAC,CAAC;IACH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;KAW7B,CAAC,CAAC;EACL,CAAC,CAAC,CAAC;EAEH,EAAE,CAAC,mBAAmB,EAAE,KAAK,IAAI,EAAE;IACjC,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;MAC7B,UAAU,EAAE,CAAC,MAAM,CAAC;MACpB,IAAI,EAAE,kDAAkD;KACzD,CAAC,CAAC;IACH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;;KAY7B,CAAC,CAAC;EACL,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { newSpecPage } from '@stencil/core/testing';\nimport { SixTag } from '../six-tag';\n\ndescribe('six-tag', () => {\n it('renders', async () => {\n const page = await newSpecPage({\n components: [SixTag],\n html: `<six-tag size=\"small\">label</six-tag>`,\n });\n expect(page.root).toEqualHtml(`\n <six-tag size=\"small\" type=\"primary\">\n <mock:shadow-root>\n <span class=\"tag tag--primary tag--small\" part=\"base\">\n <span class=\"tag__content\" part=\"content\">\n <slot></slot>\n </span>\n </span>\n </mock:shadow-root>\n label\n </six-tag>\n `);\n });\n\n it('renders clearable', async () => {\n const page = await newSpecPage({\n components: [SixTag],\n html: `<six-tag size=\"medium\" clearable>label</six-tag>`,\n });\n expect(page.root).toEqualHtml(`\n <six-tag clearable=\"\" size=\"medium\" type=\"primary\">\n <mock:shadow-root>\n <span class=\"tag tag--clear tag--medium tag--primary\" part=\"base\">\n <span class=\"tag__content\" part=\"content\">\n <slot></slot>\n </span>\n <six-icon-button class=\"tag__clear\" exportparts=\"base:clear-button\" name=\"clear\" size=\"xSmall\"></six-icon-button>\n </span>\n </mock:shadow-root>\n label\n </six-tag>\n `);\n });\n});\n"]}

package/dist/collection/components/six-textarea/six-textarea.js CHANGED Viewed

@@ -1,7 +1,7 @@
-import { h } from '@stencil/core';
-import FormControl from '../../functional-components/form-control/form-control';
-import { hasSlot } from '../../utils/slot';
-import { EventListeners } from '../../utils/event-listeners';
+import { h } from "@stencil/core";
+import FormControl from "../../functional-components/form-control/form-control";
+import { hasSlot } from "../../utils/slot";
+import { EventListeners } from "../../utils/event-listeners";
 let id = 0;
 /**
  * @since 1.0
@@ -595,7 +595,8 @@ export class SixTextarea {
           "references": {
             "EmptyPayload": {
               "location": "import",
-              "path": "../../utils/types"
+              "path": "../../utils/types",
+              "id": "src/utils/types.ts::EmptyPayload"
             }
           }
         }
@@ -615,7 +616,8 @@ export class SixTextarea {
           "references": {
             "EmptyPayload": {
               "location": "import",
-              "path": "../../utils/types"
+              "path": "../../utils/types",
+              "id": "src/utils/types.ts::EmptyPayload"
             }
           }
         }
@@ -635,7 +637,8 @@ export class SixTextarea {
           "references": {
             "EmptyPayload": {
               "location": "import",
-              "path": "../../utils/types"
+              "path": "../../utils/types",
+              "id": "src/utils/types.ts::EmptyPayload"
             }
           }
         }
@@ -655,7 +658,8 @@ export class SixTextarea {
           "references": {
             "EmptyPayload": {
               "location": "import",
-              "path": "../../utils/types"
+              "path": "../../utils/types",
+              "id": "src/utils/types.ts::EmptyPayload"
             }
           }
         }
@@ -672,10 +676,12 @@ export class SixTextarea {
             }],
           "references": {
             "Promise": {
-              "location": "global"
+              "location": "global",
+              "id": "global::Promise"
             },
             "FocusOptions": {
-              "location": "global"
+              "location": "global",
+              "id": "global::FocusOptions"
             }
           },
           "return": "Promise<void>"
@@ -691,7 +697,8 @@ export class SixTextarea {
           "parameters": [],
           "references": {
             "Promise": {
-              "location": "global"
+              "location": "global",
+              "id": "global::Promise"
             }
           },
           "return": "Promise<void>"
@@ -707,7 +714,8 @@ export class SixTextarea {
           "parameters": [],
           "references": {
             "Promise": {
-              "location": "global"
+              "location": "global",
+              "id": "global::Promise"
             }
           },
           "return": "Promise<void | undefined>"
@@ -732,7 +740,8 @@ export class SixTextarea {
             }],
           "references": {
             "Promise": {
-              "location": "global"
+              "location": "global",
+              "id": "global::Promise"
             }
           },
           "return": "Promise<void | undefined>"
@@ -760,7 +769,8 @@ export class SixTextarea {
             }],
           "references": {
             "Promise": {
-              "location": "global"
+              "location": "global",
+              "id": "global::Promise"
             }
           },
           "return": "Promise<void>"

package/dist/collection/components/six-textarea/six-textarea.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"six-textarea.js","sourceRoot":"","sources":["../../../src/components/six-textarea/six-textarea.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core';\nimport FormControl from '../../functional-components/form-control/form-control';\nimport { hasSlot } from '../../utils/slot';\nimport { EventListeners } from '../../utils/event-listeners';\nimport { EmptyPayload } from '../../utils/types';\n\nlet id = 0;\n\n/*\n @since 1.0\n * @status stable\n \n Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n \n @slot label - The textarea's label. Alternatively, you can use the label prop.\n * @slot help-text - Help text that describes how to use the input.\n * @slot error-text - Error text that is shown for validation errors. Alternatively, you can use the error-text prop.\n \n @part base - The component's base wrapper.\n * @part form-control - The form control that wraps the label, textarea, and help text.\n * @part label - The textarea label.\n * @part textarea - The textarea control.\n * @part help-text - The textarea help text.\n /\n@Component({\n tag: 'six-textarea',\n styleUrl: 'six-textarea.scss',\n shadow: true,\n})\nexport class SixTextarea {\n private inputId = `textarea-${++id}`;\n private labelId = `textarea-label-${id}`;\n private helpTextId = `textarea-help-text-${id}`;\n private errorTextId = `input-error-text-${id}`;\n private nativeTextarea?: HTMLTextAreaElement;\n private eventListeners = new EventListeners();\n private resizeObserver = new ResizeObserver(() => this.setTextareaHeight());\n\n @Element() host!: HTMLSixTextareaElement;\n\n @State() hasFocus = false;\n @State() hasHelpTextSlot = false;\n @State() hasLabelSlot = false;\n\n /* The textarea's size. /\n @Prop({ reflect: true }) size: 'small' \| 'medium' \| 'large' = 'medium';\n\n /* The textarea's name attribute. /\n @Prop({ reflect: true }) name = '';\n\n /* The textarea's value attribute. /\n @Prop({ mutable: true, reflect: true }) value = '';\n\n /* The textarea's help text. Alternatively, you can use the help-text slot. /\n @Prop() helpText = '';\n\n /* The textarea's placeholder text. /\n @Prop() placeholder?: string;\n\n /* The number of rows to display by default. /\n @Prop() rows = 4;\n\n /* Controls how the textarea can be resized. /\n @Prop() resize: 'none' \| 'vertical' \| 'auto' = 'vertical';\n\n /* Set to true to disable the textarea. /\n @Prop({ reflect: true }) disabled = false;\n\n /* Set to true for a readonly textarea. /\n @Prop({ reflect: true }) readonly = false;\n\n /* The minimum length of input that will be considered valid. /\n @Prop({ reflect: true }) minlength?: number;\n\n /* The maximum length of input that will be considered valid. /\n @Prop({ reflect: true }) maxlength?: number;\n\n /* Set to true to show an asterisk beneath the label. /\n @Prop() required = false;\n\n /* The label text. /\n @Prop() label = '';\n\n /* The error message shown, if `invalid` is set to true. /\n @Prop() errorText = '';\n\n /* If this property is set to true and an error message is provided by `errorText`, the error message is displayed. /\n @Prop({ reflect: true }) invalid = false;\n\n /* The textarea's autocaptialize attribute. /\n @Prop() autocapitalize = 'off';\n\n /* The textarea's autocorrect attribute. /\n @Prop() autocorrect: 'on' \| 'off' = 'off';\n\n /* The textarea's autocomplete attribute. /\n @Prop() autocomplete = 'off';\n\n /* The textarea's autofocus attribute. /\n @Prop() autofocus = false;\n\n /* The textarea's spellcheck attribute. /\n @Prop() spellcheck = false;\n\n /* The textarea's inputmode attribute. /\n @Prop() inputmode?: 'none' \| 'text' \| 'decimal' \| 'numeric' \| 'tel' \| 'search' \| 'email' \| 'url';\n\n /* Emitted when the control's value changes. Access the new value via event.target.value. /\n @Event({ eventName: 'six-textarea-change' }) sixChange!: EventEmitter<EmptyPayload>;\n\n /* Emitted when the control receives input. Access the new value via event.target.value. /\n @Event({ eventName: 'six-textarea-input' }) sixInput!: EventEmitter<EmptyPayload>;\n\n /* Emitted when the control gains focus. /\n @Event({ eventName: 'six-textarea-focus' }) sixFocus!: EventEmitter<EmptyPayload>;\n\n /* Emitted when the control loses focus. Access the new value via event.target.value. /\n @Event({ eventName: 'six-textarea-blur' }) sixBlur!: EventEmitter<EmptyPayload>;\n\n @Watch('helpText')\n @Watch('errorText')\n @Watch('label')\n handleLabelChange() {\n this.handleSlotChange();\n }\n\n @Watch('rows')\n handleRowsChange() {\n this.setTextareaHeight();\n }\n\n @Watch('value')\n handleValueChange() {\n this.value = this.getValue();\n if (this.nativeTextarea != null) {\n if (this.nativeTextarea.value !== this.value) {\n this.nativeTextarea.value = this.value;\n }\n }\n }\n\n connectedCallback() {\n this.host.shadowRoot?.addEventListener('slotchange', this.handleSlotChange);\n this.eventListeners.forward('six-textarea-input', 'input', this.host);\n this.eventListeners.forward('six-textarea-change', 'change', this.host);\n this.eventListeners.forward('six-textarea-focus', 'focus', this.host);\n this.eventListeners.forward('six-textarea-blur', 'blur', this.host);\n }\n\n componentWillLoad() {\n this.handleSlotChange();\n }\n\n componentDidLoad() {\n this.setTextareaHeight();\n if (this.nativeTextarea != null) {\n this.resizeObserver.observe(this.nativeTextarea);\n }\n }\n\n disconnectedCallback() {\n if (this.nativeTextarea != null) {\n this.resizeObserver.unobserve(this.nativeTextarea);\n }\n this.host.shadowRoot?.removeEventListener('slotchange', this.handleSlotChange);\n this.eventListeners.removeAll();\n }\n\n /* Sets focus on the textarea. /\n @Method()\n async setFocus(options?: FocusOptions) {\n this.nativeTextarea?.focus(options);\n }\n\n /* Removes focus fromt the textarea. /\n @Method()\n async removeFocus() {\n this.nativeTextarea?.blur();\n }\n\n /* Selects all the text in the input. /\n @Method()\n async select() {\n return this.nativeTextarea?.select();\n }\n\n /* Sets the start and end positions of the text selection (0-based). /\n @Method()\n async setSelectionRange(\n selectionStart: number,\n selectionEnd: number,\n selectionDirection: 'forward' \| 'backward' \| 'none' = 'none'\n ) {\n return this.nativeTextarea?.setSelectionRange(selectionStart, selectionEnd, selectionDirection);\n }\n\n /* Replaces a range of text with a new string. */\n @Method()\n async setRangeText(\n replacement: string,\n start: number,\n end: number,\n selectMode: 'select' \| 'start' \| 'end' \| 'preserve' = 'preserve'\n ) {\n if (this.nativeTextarea == null) return;\n\n this.nativeTextarea.setRangeText(replacement, start, end, selectMode);\n if (this.getValue() !== this.nativeTextarea.value) {\n this.value = this.nativeTextarea.value;\n this.setTextareaHeight();\n this.sixChange.emit();\n this.sixInput.emit();\n }\n }\n\n private handleChange = () => {\n if (this.nativeTextarea != null) {\n this.value = this.nativeTextarea.value;\n this.sixChange.emit();\n }\n };\n\n private handleInput = () => {\n if (this.nativeTextarea != null) {\n this.value = this.nativeTextarea.value;\n this.setTextareaHeight();\n this.sixInput.emit();\n }\n };\n\n private handleBlur = () => {\n this.hasFocus = false;\n this.sixBlur.emit();\n };\n\n private handleFocus = () => {\n this.hasFocus = true;\n this.sixFocus.emit();\n };\n\n private handleSlotChange = () => {\n this.hasLabelSlot = hasSlot(this.host, 'label');\n this.hasHelpTextSlot = hasSlot(this.host, 'help-text');\n };\n\n private setTextareaHeight() {\n if (this.nativeTextarea == null) return;\n\n if (this.resize === 'auto') {\n this.nativeTextarea.style.height = 'auto';\n this.nativeTextarea.style.height = this.nativeTextarea.scrollHeight + 'px';\n } else {\n (this.nativeTextarea.style.height as string \| undefined) = undefined;\n }\n }\n\n private getValue(): string {\n return (this.value ?? '').toString();\n }\n\n render() {\n return (\n <FormControl\n inputId={this.inputId}\n label={this.label}\n labelId={this.labelId}\n hasLabelSlot={this.hasLabelSlot}\n helpTextId={this.helpTextId}\n helpText={this.helpText}\n hasHelpTextSlot={this.hasHelpTextSlot}\n errorTextId={this.errorTextId}\n errorText={this.errorText}\n size={this.size}\n disabled={this.disabled}\n required={this.required}\n displayError={this.invalid}\n >\n <div\n part=\"base\"\n class={{\n textarea: true,\n\n // Sizes\n 'textarea--small': this.size === 'small',\n 'textarea--medium': this.size === 'medium',\n 'textarea--large': this.size === 'large',\n\n // States\n 'textarea--disabled': this.disabled,\n 'textarea--focused': this.hasFocus,\n 'textarea--empty': this.getValue().length === 0,\n 'textarea--invalid': this.invalid,\n\n // Modifiers\n 'textarea--resize-none': this.resize === 'none',\n 'textarea--resize-vertical': this.resize === 'vertical',\n 'textarea--resize-auto': this.resize === 'auto',\n }}\n >\n <textarea\n part=\"textarea\"\n ref={(el) => (this.nativeTextarea = el)}\n id={this.inputId}\n class=\"textarea__control\"\n name={this.name}\n placeholder={this.placeholder}\n disabled={this.disabled}\n readOnly={this.readonly}\n rows={this.rows}\n minLength={this.minlength}\n maxLength={this.maxlength}\n value={this.getValue()}\n autoCapitalize={this.autocapitalize}\n autoCorrect={this.autocorrect}\n autoFocus={this.autofocus}\n spellcheck={this.spellcheck}\n required={this.required}\n inputMode={this.inputmode}\n aria-labelledby={this.labelId}\n onChange={this.handleChange}\n onInput={this.handleInput}\n onFocus={this.handleFocus}\n onBlur={this.handleBlur}\n />\n </div>\n </FormControl>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"six-textarea.js","sourceRoot":"","sources":["../../../src/components/six-textarea/six-textarea.tsx"],"names":[],"mappings":"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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Element, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core';\nimport FormControl from '../../functional-components/form-control/form-control';\nimport { hasSlot } from '../../utils/slot';\nimport { EventListeners } from '../../utils/event-listeners';\nimport { EmptyPayload } from '../../utils/types';\n\nlet id = 0;\n\n/*\n @since 1.0\n * @status stable\n \n Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n \n @slot label - The textarea's label. Alternatively, you can use the label prop.\n * @slot help-text - Help text that describes how to use the input.\n * @slot error-text - Error text that is shown for validation errors. Alternatively, you can use the error-text prop.\n \n @part base - The component's base wrapper.\n * @part form-control - The form control that wraps the label, textarea, and help text.\n * @part label - The textarea label.\n * @part textarea - The textarea control.\n * @part help-text - The textarea help text.\n /\n@Component({\n tag: 'six-textarea',\n styleUrl: 'six-textarea.scss',\n shadow: true,\n})\nexport class SixTextarea {\n private inputId = `textarea-${++id}`;\n private labelId = `textarea-label-${id}`;\n private helpTextId = `textarea-help-text-${id}`;\n private errorTextId = `input-error-text-${id}`;\n private nativeTextarea?: HTMLTextAreaElement;\n private eventListeners = new EventListeners();\n private resizeObserver = new ResizeObserver(() => this.setTextareaHeight());\n\n @Element() host!: HTMLSixTextareaElement;\n\n @State() hasFocus = false;\n @State() hasHelpTextSlot = false;\n @State() hasLabelSlot = false;\n\n /* The textarea's size. /\n @Prop({ reflect: true }) size: 'small' \| 'medium' \| 'large' = 'medium';\n\n /* The textarea's name attribute. /\n @Prop({ reflect: true }) name = '';\n\n /* The textarea's value attribute. /\n @Prop({ mutable: true, reflect: true }) value = '';\n\n /* The textarea's help text. Alternatively, you can use the help-text slot. /\n @Prop() helpText = '';\n\n /* The textarea's placeholder text. /\n @Prop() placeholder?: string;\n\n /* The number of rows to display by default. /\n @Prop() rows = 4;\n\n /* Controls how the textarea can be resized. /\n @Prop() resize: 'none' \| 'vertical' \| 'auto' = 'vertical';\n\n /* Set to true to disable the textarea. /\n @Prop({ reflect: true }) disabled = false;\n\n /* Set to true for a readonly textarea. /\n @Prop({ reflect: true }) readonly = false;\n\n /* The minimum length of input that will be considered valid. /\n @Prop({ reflect: true }) minlength?: number;\n\n /* The maximum length of input that will be considered valid. /\n @Prop({ reflect: true }) maxlength?: number;\n\n /* Set to true to show an asterisk beneath the label. /\n @Prop() required = false;\n\n /* The label text. /\n @Prop() label = '';\n\n /* The error message shown, if `invalid` is set to true. /\n @Prop() errorText = '';\n\n /* If this property is set to true and an error message is provided by `errorText`, the error message is displayed. /\n @Prop({ reflect: true }) invalid = false;\n\n /* The textarea's autocaptialize attribute. /\n @Prop() autocapitalize = 'off';\n\n /* The textarea's autocorrect attribute. /\n @Prop() autocorrect: 'on' \| 'off' = 'off';\n\n /* The textarea's autocomplete attribute. /\n @Prop() autocomplete = 'off';\n\n /* The textarea's autofocus attribute. /\n @Prop() autofocus = false;\n\n /* The textarea's spellcheck attribute. /\n @Prop() spellcheck = false;\n\n /* The textarea's inputmode attribute. /\n @Prop() inputmode?: 'none' \| 'text' \| 'decimal' \| 'numeric' \| 'tel' \| 'search' \| 'email' \| 'url';\n\n /* Emitted when the control's value changes. Access the new value via event.target.value. /\n @Event({ eventName: 'six-textarea-change' }) sixChange!: EventEmitter<EmptyPayload>;\n\n /* Emitted when the control receives input. Access the new value via event.target.value. /\n @Event({ eventName: 'six-textarea-input' }) sixInput!: EventEmitter<EmptyPayload>;\n\n /* Emitted when the control gains focus. /\n @Event({ eventName: 'six-textarea-focus' }) sixFocus!: EventEmitter<EmptyPayload>;\n\n /* Emitted when the control loses focus. Access the new value via event.target.value. /\n @Event({ eventName: 'six-textarea-blur' }) sixBlur!: EventEmitter<EmptyPayload>;\n\n @Watch('helpText')\n @Watch('errorText')\n @Watch('label')\n handleLabelChange() {\n this.handleSlotChange();\n }\n\n @Watch('rows')\n handleRowsChange() {\n this.setTextareaHeight();\n }\n\n @Watch('value')\n handleValueChange() {\n this.value = this.getValue();\n if (this.nativeTextarea != null) {\n if (this.nativeTextarea.value !== this.value) {\n this.nativeTextarea.value = this.value;\n }\n }\n }\n\n connectedCallback() {\n this.host.shadowRoot?.addEventListener('slotchange', this.handleSlotChange);\n this.eventListeners.forward('six-textarea-input', 'input', this.host);\n this.eventListeners.forward('six-textarea-change', 'change', this.host);\n this.eventListeners.forward('six-textarea-focus', 'focus', this.host);\n this.eventListeners.forward('six-textarea-blur', 'blur', this.host);\n }\n\n componentWillLoad() {\n this.handleSlotChange();\n }\n\n componentDidLoad() {\n this.setTextareaHeight();\n if (this.nativeTextarea != null) {\n this.resizeObserver.observe(this.nativeTextarea);\n }\n }\n\n disconnectedCallback() {\n if (this.nativeTextarea != null) {\n this.resizeObserver.unobserve(this.nativeTextarea);\n }\n this.host.shadowRoot?.removeEventListener('slotchange', this.handleSlotChange);\n this.eventListeners.removeAll();\n }\n\n /* Sets focus on the textarea. /\n @Method()\n async setFocus(options?: FocusOptions) {\n this.nativeTextarea?.focus(options);\n }\n\n /* Removes focus fromt the textarea. /\n @Method()\n async removeFocus() {\n this.nativeTextarea?.blur();\n }\n\n /* Selects all the text in the input. /\n @Method()\n async select() {\n return this.nativeTextarea?.select();\n }\n\n /* Sets the start and end positions of the text selection (0-based). /\n @Method()\n async setSelectionRange(\n selectionStart: number,\n selectionEnd: number,\n selectionDirection: 'forward' \| 'backward' \| 'none' = 'none'\n ) {\n return this.nativeTextarea?.setSelectionRange(selectionStart, selectionEnd, selectionDirection);\n }\n\n /* Replaces a range of text with a new string. */\n @Method()\n async setRangeText(\n replacement: string,\n start: number,\n end: number,\n selectMode: 'select' \| 'start' \| 'end' \| 'preserve' = 'preserve'\n ) {\n if (this.nativeTextarea == null) return;\n\n this.nativeTextarea.setRangeText(replacement, start, end, selectMode);\n if (this.getValue() !== this.nativeTextarea.value) {\n this.value = this.nativeTextarea.value;\n this.setTextareaHeight();\n this.sixChange.emit();\n this.sixInput.emit();\n }\n }\n\n private handleChange = () => {\n if (this.nativeTextarea != null) {\n this.value = this.nativeTextarea.value;\n this.sixChange.emit();\n }\n };\n\n private handleInput = () => {\n if (this.nativeTextarea != null) {\n this.value = this.nativeTextarea.value;\n this.setTextareaHeight();\n this.sixInput.emit();\n }\n };\n\n private handleBlur = () => {\n this.hasFocus = false;\n this.sixBlur.emit();\n };\n\n private handleFocus = () => {\n this.hasFocus = true;\n this.sixFocus.emit();\n };\n\n private handleSlotChange = () => {\n this.hasLabelSlot = hasSlot(this.host, 'label');\n this.hasHelpTextSlot = hasSlot(this.host, 'help-text');\n };\n\n private setTextareaHeight() {\n if (this.nativeTextarea == null) return;\n\n if (this.resize === 'auto') {\n this.nativeTextarea.style.height = 'auto';\n this.nativeTextarea.style.height = this.nativeTextarea.scrollHeight + 'px';\n } else {\n (this.nativeTextarea.style.height as string \| undefined) = undefined;\n }\n }\n\n private getValue(): string {\n return (this.value ?? '').toString();\n }\n\n render() {\n return (\n <FormControl\n inputId={this.inputId}\n label={this.label}\n labelId={this.labelId}\n hasLabelSlot={this.hasLabelSlot}\n helpTextId={this.helpTextId}\n helpText={this.helpText}\n hasHelpTextSlot={this.hasHelpTextSlot}\n errorTextId={this.errorTextId}\n errorText={this.errorText}\n size={this.size}\n disabled={this.disabled}\n required={this.required}\n displayError={this.invalid}\n >\n <div\n part=\"base\"\n class={{\n textarea: true,\n\n // Sizes\n 'textarea--small': this.size === 'small',\n 'textarea--medium': this.size === 'medium',\n 'textarea--large': this.size === 'large',\n\n // States\n 'textarea--disabled': this.disabled,\n 'textarea--focused': this.hasFocus,\n 'textarea--empty': this.getValue().length === 0,\n 'textarea--invalid': this.invalid,\n\n // Modifiers\n 'textarea--resize-none': this.resize === 'none',\n 'textarea--resize-vertical': this.resize === 'vertical',\n 'textarea--resize-auto': this.resize === 'auto',\n }}\n >\n <textarea\n part=\"textarea\"\n ref={(el) => (this.nativeTextarea = el)}\n id={this.inputId}\n class=\"textarea__control\"\n name={this.name}\n placeholder={this.placeholder}\n disabled={this.disabled}\n readOnly={this.readonly}\n rows={this.rows}\n minLength={this.minlength}\n maxLength={this.maxlength}\n value={this.getValue()}\n autoCapitalize={this.autocapitalize}\n autoCorrect={this.autocorrect}\n autoFocus={this.autofocus}\n spellcheck={this.spellcheck}\n required={this.required}\n inputMode={this.inputmode}\n aria-labelledby={this.labelId}\n onChange={this.handleChange}\n onInput={this.handleInput}\n onFocus={this.handleFocus}\n onBlur={this.handleBlur}\n />\n </div>\n </FormControl>\n );\n }\n}\n"]}

package/dist/collection/components/six-textarea/test/six-textarea.spec.js ADDED Viewed

@@ -0,0 +1,117 @@
+import { newSpecPage } from "@stencil/core/testing";
+import { SixTextarea } from "../six-textarea";
+describe('six-textarea', () => {
+  let page;
+  let textarea;
+  beforeEach(async () => {
+    var _a;
+    global.ResizeObserver = jest.fn().mockImplementation(() => ({
+      observe: jest.fn(),
+      unobserve: jest.fn(),
+      disconnect: jest.fn(),
+    }));
+    page = (await newSpecPage({
+      components: [SixTextarea],
+      html: `<six-textarea></six-textarea>`,
+      supportsShadowDom: true,
+    }));
+    const element = (_a = page.root.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('textarea');
+    if (element != null) {
+      textarea = element;
+      return;
+    }
+    fail('textarea not found');
+  });
+  it('renders', async () => {
+    // then
+    expect(page.root).toEqualHtml(`
+      <six-textarea size="medium" value="">
+        <mock:shadow-root>
+         <div class="form-control form-control--medium" part="form-control">
+           <label aria-hidden="true" class="form-control__label" htmlfor="textarea-1" id="textarea-label-1" part="label">
+             <slot name="label"></slot>
+           </label>
+           <div class="form-control__input">
+             <div class="textarea textarea--empty textarea--medium textarea--resize-vertical" part="base"><textarea aria-labelledby="textarea-label-1" autocapitalize="off" autocorrect="off" class="textarea__control" id="textarea-1" part="textarea" rows="4" value=""></textarea>
+             </div>
+           </div>
+           <div aria-hidden="true" class="form-control__error-text" id="input-error-text-1" part="error-text"></div>
+           <div aria-hidden="true" class="form-control__help-text" id="textarea-help-text-1" part="help-text">
+             <slot name="help-text"></slot>
+           </div>
+         </div>
+       </mock:shadow-root>
+     </six-textarea>
+    `);
+  });
+  it('should properly dispatch blur event', async () => {
+    const spy = jest.fn();
+    page.root.addEventListener('six-textarea-blur', spy);
+    await page.waitForChanges();
+    // when
+    textarea.dispatchEvent(new Event('blur'));
+    await page.waitForChanges();
+    // then
+    expect(spy).toHaveBeenCalledWith(expect.objectContaining({
+      detail: undefined,
+      type: 'six-textarea-blur',
+    }));
+    // when
+    page.root.value = 'some new value';
+    await page.waitForChanges();
+    textarea.dispatchEvent(new Event('blur'));
+    await page.waitForChanges();
+    // then
+    expect(spy).toHaveBeenCalledWith(expect.objectContaining({
+      detail: undefined,
+      type: 'six-textarea-blur',
+    }));
+  });
+  it('should properly dispatch focus event', async () => {
+    const spy = jest.fn();
+    page.root.addEventListener('six-textarea-focus', spy);
+    await page.waitForChanges();
+    // when
+    textarea.dispatchEvent(new Event('focus'));
+    await page.waitForChanges();
+    // then
+    expect(spy).toHaveBeenCalledWith(expect.objectContaining({
+      detail: undefined,
+      type: 'six-textarea-focus',
+    }));
+    // when
+    page.root.value = 'some new value';
+    await page.waitForChanges();
+    textarea.dispatchEvent(new Event('focus'));
+    await page.waitForChanges();
+    // then
+    expect(spy).toHaveBeenCalledWith(expect.objectContaining({
+      detail: undefined,
+      type: 'six-textarea-focus',
+    }));
+  });
+  it('should properly dispatch input event', async () => {
+    const spy = jest.fn();
+    page.root.addEventListener('six-textarea-input', spy);
+    await page.waitForChanges();
+    // when
+    textarea.dispatchEvent(new Event('input'));
+    await page.waitForChanges();
+    // then
+    expect(spy).toHaveBeenCalledWith(expect.objectContaining({
+      detail: undefined,
+      type: 'six-textarea-input',
+    }));
+    // when
+    page.root.value = 'some new value';
+    await page.waitForChanges();
+    textarea.dispatchEvent(new Event('input'));
+    await page.waitForChanges();
+    // then
+    expect(spy).toHaveBeenCalledWith(expect.objectContaining({
+      detail: undefined,
+      type: 'six-textarea-input',
+    }));
+  });
+});
+//# sourceMappingURL=six-textarea.spec.js.map

package/dist/collection/components/six-textarea/test/six-textarea.spec.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"six-textarea.spec.js","sourceRoot":"","sources":["../../../../src/components/six-textarea/test/six-textarea.spec.tsx"],"names":[],"mappings":"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","sourcesContent":["import { newSpecPage, SpecPage } from '@stencil/core/testing';\nimport { SixTextarea } from '../six-textarea';\n\ninterface TypedSpecPage<T> extends SpecPage {\n root: HTMLElement & T;\n}\n\ndescribe('six-textarea', () => {\n let page: TypedSpecPage<SixTextarea>;\n let textarea: HTMLTextAreaElement;\n\n beforeEach(async () => {\n global.ResizeObserver = jest.fn().mockImplementation(() => ({\n observe: jest.fn(),\n unobserve: jest.fn(),\n disconnect: jest.fn(),\n }));\n\n page = (await newSpecPage({\n components: [SixTextarea],\n html: `<six-textarea></six-textarea>`,\n supportsShadowDom: true,\n })) as TypedSpecPage<SixTextarea>;\n\n const element = page.root.shadowRoot?.querySelector('textarea');\n if (element != null) {\n textarea = element;\n return;\n }\n fail('textarea not found');\n });\n\n it('renders', async () => {\n // then\n expect(page.root).toEqualHtml(`\n <six-textarea size=\"medium\" value=\"\">\n <mock:shadow-root>\n <div class=\"form-control form-control--medium\" part=\"form-control\">\n <label aria-hidden=\"true\" class=\"form-control__label\" htmlfor=\"textarea-1\" id=\"textarea-label-1\" part=\"label\">\n <slot name=\"label\"></slot>\n </label>\n <div class=\"form-control__input\">\n <div class=\"textarea textarea--empty textarea--medium textarea--resize-vertical\" part=\"base\"><textarea aria-labelledby=\"textarea-label-1\" autocapitalize=\"off\" autocorrect=\"off\" class=\"textarea__control\" id=\"textarea-1\" part=\"textarea\" rows=\"4\" value=\"\"></textarea>\n </div>\n </div>\n <div aria-hidden=\"true\" class=\"form-control__error-text\" id=\"input-error-text-1\" part=\"error-text\"></div>\n <div aria-hidden=\"true\" class=\"form-control__help-text\" id=\"textarea-help-text-1\" part=\"help-text\">\n <slot name=\"help-text\"></slot>\n </div>\n </div>\n </mock:shadow-root>\n </six-textarea>\n `);\n });\n\n it('should properly dispatch blur event', async () => {\n const spy = jest.fn();\n page.root.addEventListener('six-textarea-blur', spy);\n await page.waitForChanges();\n\n // when\n textarea.dispatchEvent(new Event('blur'));\n await page.waitForChanges();\n\n // then\n expect(spy).toHaveBeenCalledWith(\n expect.objectContaining({\n detail: undefined,\n type: 'six-textarea-blur',\n })\n );\n\n // when\n page.root.value = 'some new value';\n await page.waitForChanges();\n textarea.dispatchEvent(new Event('blur'));\n await page.waitForChanges();\n\n // then\n expect(spy).toHaveBeenCalledWith(\n expect.objectContaining({\n detail: undefined,\n type: 'six-textarea-blur',\n })\n );\n });\n\n it('should properly dispatch focus event', async () => {\n const spy = jest.fn();\n page.root.addEventListener('six-textarea-focus', spy);\n await page.waitForChanges();\n\n // when\n textarea.dispatchEvent(new Event('focus'));\n await page.waitForChanges();\n\n // then\n expect(spy).toHaveBeenCalledWith(\n expect.objectContaining({\n detail: undefined,\n type: 'six-textarea-focus',\n })\n );\n\n // when\n page.root.value = 'some new value';\n await page.waitForChanges();\n textarea.dispatchEvent(new Event('focus'));\n await page.waitForChanges();\n\n // then\n expect(spy).toHaveBeenCalledWith(\n expect.objectContaining({\n detail: undefined,\n type: 'six-textarea-focus',\n })\n );\n });\n\n it('should properly dispatch input event', async () => {\n const spy = jest.fn();\n page.root.addEventListener('six-textarea-input', spy);\n await page.waitForChanges();\n\n // when\n textarea.dispatchEvent(new Event('input'));\n await page.waitForChanges();\n\n // then\n expect(spy).toHaveBeenCalledWith(\n expect.objectContaining({\n detail: undefined,\n type: 'six-textarea-input',\n })\n );\n\n // when\n page.root.value = 'some new value';\n await page.waitForChanges();\n textarea.dispatchEvent(new Event('input'));\n await page.waitForChanges();\n\n // then\n expect(spy).toHaveBeenCalledWith(\n expect.objectContaining({\n detail: undefined,\n type: 'six-textarea-input',\n })\n );\n });\n});\n"]}

package/dist/collection/components/six-tile/six-tile.js CHANGED Viewed

@@ -1,5 +1,5 @@
-import { h } from '@stencil/core';
-import { getSlot, hasSlot } from '../../utils/slot';
+import { h } from "@stencil/core";
+import { getSlot, hasSlot } from "../../utils/slot";
 /**
  * @since 1.0
  * @status stable
@@ -230,7 +230,8 @@ export class SixTile {
           "references": {
             "EmptyPayload": {
               "location": "import",
-              "path": "../../utils/types"
+              "path": "../../utils/types",
+              "id": "src/utils/types.ts::EmptyPayload"
             }
           }
         }
@@ -250,7 +251,8 @@ export class SixTile {
           "references": {
             "EmptyPayload": {
               "location": "import",
-              "path": "../../utils/types"
+              "path": "../../utils/types",
+              "id": "src/utils/types.ts::EmptyPayload"
             }
           }
         }
@@ -264,7 +266,8 @@ export class SixTile {
           "parameters": [],
           "references": {
             "Promise": {
-              "location": "global"
+              "location": "global",
+              "id": "global::Promise"
             }
           },
           "return": "Promise<void>"
@@ -280,7 +283,8 @@ export class SixTile {
           "parameters": [],
           "references": {
             "Promise": {
-              "location": "global"
+              "location": "global",
+              "id": "global::Promise"
             }
           },
           "return": "Promise<void>"

package/dist/collection/components/six-tile/six-tile.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"six-tile.js","sourceRoot":"","sources":["../../../src/components/six-tile/six-tile.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, h, Method, Prop, State } from '@stencil/core';\nimport { EmptyPayload } from '../../utils/types';\nimport { getSlot, hasSlot } from '../../utils/slot';\n\n/*\n @since 1.0\n * @status stable\n /\n\n@Component({\n tag: 'six-tile',\n styleUrl: 'six-tile.scss',\n shadow: true,\n})\nexport class SixTile {\n @Element() host!: HTMLSixTileElement;\n\n /* The tile's label. /\n @Prop() label = '';\n\n /* The icon's name. /\n @Prop() iconName?: string;\n\n /* Flag, whether the tile is closeable. /\n @Prop() closeable = true;\n\n /* Flag, whether the tile should cast a shadow. /\n @Prop() elevated = false;\n\n /* Enables tile tooltip for tiles /\n @Prop() disableTooltip = true;\n\n /* Set to true to disable the tile. /\n @Prop({ reflect: true }) disabled = false;\n\n /* The tile's size. /\n @Prop({ reflect: true }) size: 'small' \| 'medium' \| 'large' = 'medium';\n\n @State() visible = true;\n\n /* Emitted when the tile was closed. /\n @Event({ eventName: 'six-tile-closed' }) sixTileClose!: EventEmitter<EmptyPayload>;\n\n /* Emitted when the tile is selected. /\n @Event({ eventName: 'six-tile-selected' }) sixTileSelected!: EventEmitter<EmptyPayload>;\n\n /* Hides the tile /\n @Method()\n async hide() {\n this.visible = false;\n }\n\n /* Shows the tile */\n @Method()\n async show() {\n this.visible = true;\n }\n\n @State() hasIconSlot = false;\n\n @State() hasLabelSlot = false;\n\n componentWillLoad() {\n this.handleSlotChange();\n }\n\n private handleSlotChange = () => {\n this.hasIconSlot = hasSlot(this.host, 'icon');\n this.hasLabelSlot = hasSlot(this.host, 'label');\n\n if (this.hasIconSlot) {\n const slot = getSlot(this.host, 'icon');\n slot?.addEventListener('click', this.handleClickEvent);\n }\n\n if (this.hasLabelSlot) {\n const slot = getSlot(this.host, 'label');\n slot?.addEventListener('click', this.handleClickEvent);\n }\n };\n\n render() {\n return (\n <six-tooltip disabled={this.disableTooltip \|\| this.label === ''} content={this.label}>\n <div\n part=\"base\"\n class={{\n tile: true,\n 'tile--visible': this.visible,\n 'tile--small': this.size === 'small',\n 'tile--medium': this.size === 'medium',\n 'tile--large': this.size === 'large',\n 'tile--elevated': this.elevated,\n }}\n >\n <div part=\"header\" class=\"tile__header\">\n <six-icon-button\n class={{\n 'tile__header--hidden': !this.closeable,\n }}\n name=\"close\"\n size={closeIconSize(this.size)}\n onClick={this.handleCloseClickEvent}\n />\n </div>\n\n <div part=\"body\" class=\"tile__body\">\n {this.iconName && (\n <six-icon onClick={this.handleClickEvent} size={iconSize(this.size)}>\n {this.iconName}\n </six-icon>\n )}\n {this.hasIconSlot && <slot name=\"icon\"></slot>}\n </div>\n\n <div\n part=\"footer\"\n class={{\n 'tile__footer--small': this.size === 'small',\n 'tile__footer--medium': this.size === 'medium',\n 'tile__footer--large': this.size === 'large',\n }}\n >\n {this.label && (\n <div\n class={{\n '.label__footer': true,\n }}\n onClick={this.handleClickEvent}\n >\n {this.label}\n </div>\n )}\n {this.hasLabelSlot && <slot name=\"label\"></slot>}\n </div>\n </div>\n </six-tooltip>\n );\n }\n\n private handleCloseClickEvent = () => {\n this.visible = false;\n this.sixTileClose.emit();\n };\n\n private handleClickEvent = () => {\n this.sixTileSelected.emit();\n };\n}\n\nconst closeIconSize = (size: string) => {\n return {\n small: 'xxSmall',\n medium: 'medium',\n large: 'medium',\n }[size] as 'xSmall' \| 'medium';\n};\n\nconst iconSize = (size: string) => {\n return {\n small: 'xLarge',\n medium: 'xxLarge',\n large: 'xxxLarge',\n }[size] as 'xLarge' \| 'xxLarge' \| 'xxxLarge';\n};\n"]}
1	+ {"version":3,"file":"six-tile.js","sourceRoot":"","sources":["../../../src/components/six-tile/six-tile.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, h, Method, Prop, State } from '@stencil/core';\nimport { EmptyPayload } from '../../utils/types';\nimport { getSlot, hasSlot } from '../../utils/slot';\n\n/*\n @since 1.0\n * @status stable\n /\n\n@Component({\n tag: 'six-tile',\n styleUrl: 'six-tile.scss',\n shadow: true,\n})\nexport class SixTile {\n @Element() host!: HTMLSixTileElement;\n\n /* The tile's label. /\n @Prop() label = '';\n\n /* The icon's name. /\n @Prop() iconName?: string;\n\n /* Flag, whether the tile is closeable. /\n @Prop() closeable = true;\n\n /* Flag, whether the tile should cast a shadow. /\n @Prop() elevated = false;\n\n /* Enables tile tooltip for tiles /\n @Prop() disableTooltip = true;\n\n /* Set to true to disable the tile. /\n @Prop({ reflect: true }) disabled = false;\n\n /* The tile's size. /\n @Prop({ reflect: true }) size: 'small' \| 'medium' \| 'large' = 'medium';\n\n @State() visible = true;\n\n /* Emitted when the tile was closed. /\n @Event({ eventName: 'six-tile-closed' }) sixTileClose!: EventEmitter<EmptyPayload>;\n\n /* Emitted when the tile is selected. /\n @Event({ eventName: 'six-tile-selected' }) sixTileSelected!: EventEmitter<EmptyPayload>;\n\n /* Hides the tile /\n @Method()\n async hide() {\n this.visible = false;\n }\n\n /* Shows the tile */\n @Method()\n async show() {\n this.visible = true;\n }\n\n @State() hasIconSlot = false;\n\n @State() hasLabelSlot = false;\n\n componentWillLoad() {\n this.handleSlotChange();\n }\n\n private handleSlotChange = () => {\n this.hasIconSlot = hasSlot(this.host, 'icon');\n this.hasLabelSlot = hasSlot(this.host, 'label');\n\n if (this.hasIconSlot) {\n const slot = getSlot(this.host, 'icon');\n slot?.addEventListener('click', this.handleClickEvent);\n }\n\n if (this.hasLabelSlot) {\n const slot = getSlot(this.host, 'label');\n slot?.addEventListener('click', this.handleClickEvent);\n }\n };\n\n render() {\n return (\n <six-tooltip disabled={this.disableTooltip \|\| this.label === ''} content={this.label}>\n <div\n part=\"base\"\n class={{\n tile: true,\n 'tile--visible': this.visible,\n 'tile--small': this.size === 'small',\n 'tile--medium': this.size === 'medium',\n 'tile--large': this.size === 'large',\n 'tile--elevated': this.elevated,\n }}\n >\n <div part=\"header\" class=\"tile__header\">\n <six-icon-button\n class={{\n 'tile__header--hidden': !this.closeable,\n }}\n name=\"close\"\n size={closeIconSize(this.size)}\n onClick={this.handleCloseClickEvent}\n />\n </div>\n\n <div part=\"body\" class=\"tile__body\">\n {this.iconName && (\n <six-icon onClick={this.handleClickEvent} size={iconSize(this.size)}>\n {this.iconName}\n </six-icon>\n )}\n {this.hasIconSlot && <slot name=\"icon\"></slot>}\n </div>\n\n <div\n part=\"footer\"\n class={{\n 'tile__footer--small': this.size === 'small',\n 'tile__footer--medium': this.size === 'medium',\n 'tile__footer--large': this.size === 'large',\n }}\n >\n {this.label && (\n <div\n class={{\n '.label__footer': true,\n }}\n onClick={this.handleClickEvent}\n >\n {this.label}\n </div>\n )}\n {this.hasLabelSlot && <slot name=\"label\"></slot>}\n </div>\n </div>\n </six-tooltip>\n );\n }\n\n private handleCloseClickEvent = () => {\n this.visible = false;\n this.sixTileClose.emit();\n };\n\n private handleClickEvent = () => {\n this.sixTileSelected.emit();\n };\n}\n\nconst closeIconSize = (size: string) => {\n return {\n small: 'xxSmall',\n medium: 'medium',\n large: 'medium',\n }[size] as 'xSmall' \| 'medium';\n};\n\nconst iconSize = (size: string) => {\n return {\n small: 'xLarge',\n medium: 'xxLarge',\n large: 'xxxLarge',\n }[size] as 'xLarge' \| 'xxLarge' \| 'xxxLarge';\n};\n"]}

package/dist/collection/components/six-tile/test/six-tile.spec.js ADDED Viewed

@@ -0,0 +1,69 @@
+import { newSpecPage } from "@stencil/core/testing";
+import { SixTile } from "../six-tile";
+describe('six-tile', () => {
+  it('renders six-tile with props', async () => {
+    const page = await newSpecPage({
+      components: [SixTile],
+      html: `<six-tile label="Medium" icon-name="home"></six-tile>`,
+    });
+    expect(page.root).toEqualHtml(`
+      <six-tile label="Medium" icon-name="home" size="medium">
+        <mock:shadow-root>
+          <six-tooltip disabled="" content="Medium">
+            <div class="tile tile--medium tile--visible" part="base">
+              <div class="tile__header" part="header">
+                <six-icon-button name="close" size="medium"></six-icon-button>
+              </div>
+              <div class="tile__body" part="body">
+                <six-icon size="xxLarge">
+                  home
+                </six-icon>
+              </div>
+              <div class="tile__footer--medium" part="footer">
+                <div class=".label__footer">
+                  Medium
+                </div>
+              </div>
+            </div>
+          </six-tooltip>
+        </mock:shadow-root>
+      </six-tile>
+    `);
+  });
+  it('renders six-tile with slot', async () => {
+    const page = await newSpecPage({
+      components: [SixTile],
+      html: `
+      <six-tile>
+        <six-icon slot="icon">delete</six-icon>
+        <div slot="label">short label</div>
+      </six-tile>`,
+    });
+    expect(page.root).toEqualHtml(`
+      <six-tile size="medium">
+        <mock:shadow-root>
+          <six-tooltip content="" disabled="">
+            <div class="tile tile--medium tile--visible" part="base">
+              <div class="tile__header" part="header">
+                <six-icon-button name="close" size="medium"></six-icon-button>
+              </div>
+              <div class="tile__body" part="body">
+                <slot name="icon"></slot>
+              </div>
+              <div class="tile__footer--medium" part="footer">
+                <slot name="label"></slot>
+              </div>
+            </div>
+          </six-tooltip>
+        </mock:shadow-root>
+        <six-icon slot="icon">
+          delete
+        </six-icon>
+        <div slot="label">
+          short label
+        </div>
+      </six-tile>
+    `);
+  });
+});
+//# sourceMappingURL=six-tile.spec.js.map

package/dist/collection/components/six-tile/test/six-tile.spec.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"six-tile.spec.js","sourceRoot":"","sources":["../../../../src/components/six-tile/test/six-tile.spec.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAEtC,QAAQ,CAAC,UAAU,EAAE,GAAG,EAAE;EACxB,EAAE,CAAC,6BAA6B,EAAE,KAAK,IAAI,EAAE;IAC3C,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;MAC7B,UAAU,EAAE,CAAC,OAAO,CAAC;MACrB,IAAI,EAAE,uDAAuD;KAC9D,CAAC,CAAC;IACH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;;;;;;;;;;;;KAsB7B,CAAC,CAAC;EACL,CAAC,CAAC,CAAC;EAEH,EAAE,CAAC,4BAA4B,EAAE,KAAK,IAAI,EAAE;IAC1C,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;MAC7B,UAAU,EAAE,CAAC,OAAO,CAAC;MACrB,IAAI,EAAE;;;;kBAIM;KACb,CAAC,CAAC;IACH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;;;;;;;;;;;;;;KAwB7B,CAAC,CAAC;EACL,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { newSpecPage } from '@stencil/core/testing';\nimport { SixTile } from '../six-tile';\n\ndescribe('six-tile', () => {\n it('renders six-tile with props', async () => {\n const page = await newSpecPage({\n components: [SixTile],\n html: `<six-tile label=\"Medium\" icon-name=\"home\"></six-tile>`,\n });\n expect(page.root).toEqualHtml(`\n <six-tile label=\"Medium\" icon-name=\"home\" size=\"medium\">\n <mock:shadow-root>\n <six-tooltip disabled=\"\" content=\"Medium\">\n <div class=\"tile tile--medium tile--visible\" part=\"base\">\n <div class=\"tile__header\" part=\"header\">\n <six-icon-button name=\"close\" size=\"medium\"></six-icon-button>\n </div>\n <div class=\"tile__body\" part=\"body\">\n <six-icon size=\"xxLarge\">\n home\n </six-icon>\n </div>\n <div class=\"tile__footer--medium\" part=\"footer\">\n <div class=\".label__footer\">\n Medium\n </div>\n </div>\n </div>\n </six-tooltip>\n </mock:shadow-root>\n </six-tile>\n `);\n });\n\n it('renders six-tile with slot', async () => {\n const page = await newSpecPage({\n components: [SixTile],\n html: `\n <six-tile>\n <six-icon slot=\"icon\">delete</six-icon>\n <div slot=\"label\">short label</div>\n </six-tile>`,\n });\n expect(page.root).toEqualHtml(`\n <six-tile size=\"medium\">\n <mock:shadow-root>\n <six-tooltip content=\"\" disabled=\"\">\n <div class=\"tile tile--medium tile--visible\" part=\"base\">\n <div class=\"tile__header\" part=\"header\">\n <six-icon-button name=\"close\" size=\"medium\"></six-icon-button>\n </div>\n <div class=\"tile__body\" part=\"body\">\n <slot name=\"icon\"></slot>\n </div>\n <div class=\"tile__footer--medium\" part=\"footer\">\n <slot name=\"label\"></slot>\n </div>\n </div>\n </six-tooltip>\n </mock:shadow-root>\n <six-icon slot=\"icon\">\n delete\n </six-icon>\n <div slot=\"label\">\n short label\n </div>\n </six-tile>\n `);\n });\n});\n"]}