@six-group/ui-library 0.0.0-insider.d005298 → 0.0.0-insider.d6239e2

package/dist/collection/components/six-footer/test/six-footer.spec.js

@@ -1,21 +0,0 @@
-import { newSpecPage } from "@stencil/core/testing";
-import { SixFooter } from "../six-footer";
-describe('six-footer', () => {
-    it('renders', async () => {
-        const page = await newSpecPage({
-            components: [SixFooter],
-            html: `<six-footer></six-footer>`,
-        });
-        expect(page.root).toEqualHtml(`
-      <six-footer>
-        <mock:shadow-root>
-          <footer class="six-footer">
-            <slot></slot>
-          </footer>
-        </mock:shadow-root>
-      </six-footer>
-
-    `);
-    });
-});
-//# sourceMappingURL=six-footer.spec.js.map

package/dist/collection/components/six-footer/test/six-footer.spec.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"six-footer.spec.js","sourceRoot":"","sources":["../../../../src/components/six-footer/test/six-footer.spec.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAE1C,QAAQ,CAAC,YAAY,EAAE,GAAG,EAAE;IAC1B,EAAE,CAAC,SAAS,EAAE,KAAK,IAAI,EAAE;QACvB,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,2BAA2B;SAClC,CAAC,CAAC;QACH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;KAS7B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { newSpecPage } from '@stencil/core/testing';\nimport { SixFooter } from '../six-footer';\n\ndescribe('six-footer', () => {\n  it('renders', async () => {\n    const page = await newSpecPage({\n      components: [SixFooter],\n      html: `<six-footer></six-footer>`,\n    });\n    expect(page.root).toEqualHtml(`\n      <six-footer>\n        <mock:shadow-root>\n          <footer class=\"six-footer\">\n            <slot></slot>\n          </footer>\n        </mock:shadow-root>\n      </six-footer>\n\n    `);\n  });\n});\n"]}

package/dist/collection/components/six-group-label/test/six-group-label.spec.js

@@ -1,45 +0,0 @@
-import { newSpecPage } from "@stencil/core/testing";
-import { SixGroupLabel } from "../six-group-label";
-describe('six-group-label', () => {
-    it('renders', async () => {
-        global.ResizeObserver = jest.fn().mockImplementation(() => ({
-            observe: jest.fn(),
-            unobserve: jest.fn(),
-            disconnect: jest.fn(),
-        }));
-        const page = await newSpecPage({
-            components: [SixGroupLabel],
-            html: `<six-group-label>
-              <six-layout-grid columns="2">
-               <six-radio name="option" checked>Option 1</six-radio>
-               <six-radio name="option">Option 2</six-radio>
-              </six-layout-grid>
-             </six-group-label>`,
-        });
-        expect(page.root).toEqualHtml(`
-      <six-group-label size="medium">
-        <mock:shadow-root>
-         <div class="form-control form-control--medium" part="form-control">
-           <label aria-hidden="true" class="form-control__label" htmlfor="label-1" id="label-label-1" part="label">
-             <slot name="label"></slot>
-           </label>
-           <div class="form-control__input">
-             <slot></slot>
-           </div>
-           <div aria-hidden="true" class="form-control__error-text" part="error-text">
-             <slot name="error-text"></slot>
-           </div>
-           <div aria-hidden="true" class="form-control__help-text" id="label-help-text-1" part="help-text">
-             <slot name="help-text"></slot>
-           </div>
-         </div>
-       </mock:shadow-root>
-       <six-layout-grid columns="2">
-         <six-radio checked="" name="option">Option 1</six-radio></mock:shadow-root>
-         <six-radio name="option">Option 2</six-radio>
-       </six-layout-grid>
-     </six-group-label>
-    `);
-    });
-});
-//# sourceMappingURL=six-group-label.spec.js.map

package/dist/collection/components/six-group-label/test/six-group-label.spec.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"six-group-label.spec.js","sourceRoot":"","sources":["../../../../src/components/six-group-label/test/six-group-label.spec.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAEnD,QAAQ,CAAC,iBAAiB,EAAE,GAAG,EAAE;IAC/B,EAAE,CAAC,SAAS,EAAE,KAAK,IAAI,EAAE;QACvB,MAAM,CAAC,cAAc,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC,kBAAkB,CAAC,GAAG,EAAE,CAAC,CAAC;YAC1D,OAAO,EAAE,IAAI,CAAC,EAAE,EAAE;YAClB,SAAS,EAAE,IAAI,CAAC,EAAE,EAAE;YACpB,UAAU,EAAE,IAAI,CAAC,EAAE,EAAE;SACtB,CAAC,CAAC,CAAC;QACJ,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,aAAa,CAAC;YAC3B,IAAI,EAAE;;;;;gCAKoB;SAC3B,CAAC,CAAC;QACH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;;;;;;;;;;;;;KAuB7B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { newSpecPage } from '@stencil/core/testing';\nimport { SixGroupLabel } from '../six-group-label';\n\ndescribe('six-group-label', () => {\n  it('renders', async () => {\n    global.ResizeObserver = jest.fn().mockImplementation(() => ({\n      observe: jest.fn(),\n      unobserve: jest.fn(),\n      disconnect: jest.fn(),\n    }));\n    const page = await newSpecPage({\n      components: [SixGroupLabel],\n      html: `<six-group-label>\n              <six-layout-grid columns=\"2\">\n               <six-radio name=\"option\" checked>Option 1</six-radio>\n               <six-radio name=\"option\">Option 2</six-radio>\n              </six-layout-grid>\n             </six-group-label>`,\n    });\n    expect(page.root).toEqualHtml(`\n      <six-group-label size=\"medium\">\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=\"label-1\" id=\"label-label-1\" part=\"label\">\n             <slot name=\"label\"></slot>\n           </label>\n           <div class=\"form-control__input\">\n             <slot></slot>\n           </div>\n           <div aria-hidden=\"true\" class=\"form-control__error-text\" part=\"error-text\">\n             <slot name=\"error-text\"></slot>\n           </div>\n           <div aria-hidden=\"true\" class=\"form-control__help-text\" id=\"label-help-text-1\" part=\"help-text\">\n             <slot name=\"help-text\"></slot>\n           </div>\n         </div>\n       </mock:shadow-root>\n       <six-layout-grid columns=\"2\">\n         <six-radio checked=\"\" name=\"option\">Option 1</six-radio></mock:shadow-root>\n         <six-radio name=\"option\">Option 2</six-radio>\n       </six-layout-grid>\n     </six-group-label>\n    `);\n  });\n});\n"]}

package/dist/collection/components/six-header/assets/six-logo.svg

@@ -1 +0,0 @@
-<svg viewBox="0 0 90 26" xmlns="http://www.w3.org/2000/svg"><g fill="#DE3919" fill-rule="nonzero"><path d="m22.798 3.869c1.82-2.168 4.549-3.545 7.6-3.545h6.807v4.961h-6.807c-1.526 0-2.89.689-3.8 1.771l-12.19 14.526c-1.82 2.166-4.549 3.545-7.6 3.545h-6.808v-4.961h6.808c1.525 0 2.889-.689 3.799-1.773l12.191-14.525"/><path d="m42.16.324h5.21v24.806h-5.21z"/><path d="m66.743 3.869l4.195 4.999 4.195-4.999c1.819-2.168 4.549-3.545 7.6-3.545h6.806v4.961h-6.806c-1.526 0-2.89.689-3.8 1.771l-4.758 5.669 4.758 5.669c.91 1.084 2.274 1.773 3.8 1.773h6.806v4.961h-6.806c-3.051 0-5.781-1.379-7.6-3.545l-4.195-4.999-4.195 4.999c-1.82 2.166-4.55 3.545-7.6 3.545h-6.807v-4.961h6.807c1.525 0 2.889-.689 3.799-1.773l4.758-5.669-4.758-5.669c-.91-1.083-2.274-1.771-3.799-1.771h-6.807v-4.961h6.807c3.05 0 5.78 1.378 7.6 3.545"/></g></svg>

package/dist/collection/components/six-header/test/six-header.spec.js

@@ -1,177 +0,0 @@
-import { newSpecPage } from "@stencil/core/testing";
-import { SixHeader } from "../six-header";
-describe('six-header', () => {
-    beforeEach(() => {
-        const mutationObserverMock = jest.fn(function MutationObserver() {
-            this.observe = jest.fn();
-            this.disconnect = jest.fn();
-            return this;
-        });
-        global.MutationObserver = mutationObserverMock;
-    });
-    it('renders', async () => {
-        const page = await newSpecPage({
-            components: [SixHeader],
-            html: `<six-header></six-header>`,
-        });
-        expect(page.root).toEqualHtml(`
-      <six-header>
-        <mock:shadow-root>
-          <header class="six-header">
-            <section class="six-header__menu">
-              <six-icon-button name="menu"></six-icon-button>
-            </section>
-            <section class="six-header__logo">
-             <svg height="20" viewBox="0 0 90 26" xmlns="http://www.w3.org/2000/svg">
-               <title>
-                 SIX
-               </title>
-               <g fill="#DE3919" fill-rule="nonzero">
-                 <path d="m22.798 3.869c1.82-2.168 4.549-3.545 7.6-3.545h6.807v4.961h-6.807c-1.526 0-2.89.689-3.8 1.771l-12.19 14.526c-1.82 2.166-4.549 3.545-7.6 3.545h-6.808v-4.961h6.808c1.525 0 2.889-.689 3.799-1.773l12.191-14.525"></path>
-                 <path d="m42.16.324h5.21v24.806h-5.21z"></path>
-                 <path d="m66.743 3.869l4.195 4.999 4.195-4.999c1.819-2.168 4.549-3.545 7.6-3.545h6.806v4.961h-6.806c-1.526 0-2.89.689-3.8 1.771l-4.758 5.669 4.758 5.669c.91 1.084 2.274 1.773 3.8 1.773h6.806v4.961h-6.806c-3.051 0-5.781-1.379-7.6-3.545l-4.195-4.999-4.195 4.999c-1.82 2.166-4.55 3.545-7.6 3.545h-6.807v-4.961h6.807c1.525 0 2.889-.689 3.799-1.773l4.758-5.669-4.758-5.669c-.91-1.083-2.274-1.771-3.799-1.771h-6.807v-4.961h6.807c3.05 0 5.78 1.378 7.6 3.545"></path>
-               </g>
-             </svg>
-
-            </section>
-            <section class="six-header__placeholder"></section>
-            <section class="six-header__custom">
-              <slot></slot>
-            </section>
-          </header>
-          <div class="six-header__search-field">
-            <slot name="search-field"></slot>
-          </div>
-        </mock:shadow-root>
-      </six-header>
-    `);
-    });
-    it('should render custom logo ', async () => {
-        // given
-        const html = `<six-header><div slot="logo">custom logo</div></six-header>`;
-        // when
-        const page = await newSpecPage({
-            components: [SixHeader],
-            html: html,
-        });
-        // then
-        expect(page.root).toEqualHtml(`
-      <six-header>
-        <mock:shadow-root>
-          <header class="six-header">
-            <section class="six-header__menu">
-              <six-icon-button name="menu"></six-icon-button>
-            </section>
-            <section>
-               <slot name="logo"></slot>
-            </section>
-            <section class="six-header__placeholder"></section>
-            <section class="six-header__custom">
-              <slot></slot>
-            </section>
-          </header>
-          <div class="six-header__search-field">
-            <slot name="search-field"></slot>
-          </div>
-        </mock:shadow-root>
-          <div slot="logo">
-            custom logo
-          </div>
-      </six-header>
-    `);
-    });
-    it('should render app switcher', async () => {
-        // given
-        const html = `<six-header>
-                    <six-menu slot="app-switcher-menu">
-                      <six-menu-item checked="false">Custody</six-menu-item>
-                      <six-menu-item checked="true">Swiss Interbank Clearing</six-menu-item>
-                    </six-menu>
-                  </six-header>`;
-        // when
-        const page = await newSpecPage({
-            components: [SixHeader],
-            html: html,
-        });
-        // then
-        expect(page.root).toEqualHtml(`
-      <six-header>
-        <mock:shadow-root>
-          <header class="six-header">
-            <section class="six-header__menu">
-              <six-icon-button name="menu"></six-icon-button>
-            </section>
-            <section class="six-header__logo">
-             <svg height="20" viewBox="0 0 90 26" xmlns="http://www.w3.org/2000/svg">
-               <title>
-                 SIX
-               </title>
-               <g fill="#DE3919" fill-rule="nonzero">
-                 <path d="m22.798 3.869c1.82-2.168 4.549-3.545 7.6-3.545h6.807v4.961h-6.807c-1.526 0-2.89.689-3.8 1.771l-12.19 14.526c-1.82 2.166-4.549 3.545-7.6 3.545h-6.808v-4.961h6.808c1.525 0 2.889-.689 3.799-1.773l12.191-14.525"></path>
-                 <path d="m42.16.324h5.21v24.806h-5.21z"></path>
-                 <path d="m66.743 3.869l4.195 4.999 4.195-4.999c1.819-2.168 4.549-3.545 7.6-3.545h6.806v4.961h-6.806c-1.526 0-2.89.689-3.8 1.771l-4.758 5.669 4.758 5.669c.91 1.084 2.274 1.773 3.8 1.773h6.806v4.961h-6.806c-3.051 0-5.781-1.379-7.6-3.545l-4.195-4.999-4.195 4.999c-1.82 2.166-4.55 3.545-7.6 3.545h-6.807v-4.961h6.807c1.525 0 2.889-.689 3.799-1.773l4.758-5.669-4.758-5.669c-.91-1.083-2.274-1.771-3.799-1.771h-6.807v-4.961h6.807c3.05 0 5.78 1.378 7.6 3.545"></path>
-               </g>
-             </svg>
-
-            </section>
-            <section class="six-header__placeholder"></section>
-            <section class="six-header__custom">
-              <slot></slot>
-            </section>
-            <section class="six-header__app-switcher">
-                <six-dropdown distance="13" placement="bottom-end" skidding="20">
-                  <div class="six-header__app-switcher-dropdown" slot="trigger">
-                    <a class="six-header__selected-app">Swiss Interbank Clearing</a>
-                    <six-icon-button name="apps"></six-icon-button>
-                  </div>
-                  <slot name="app-switcher-menu"></slot>
-               </six-dropdown>
-           </section>
-          </header>
-          <div class="six-header__search-field">
-            <slot name="search-field"></slot>
-          </div>
-        </mock:shadow-root>
-        <six-menu slot="app-switcher-menu">
-            <six-menu-item checked="false">Custody</six-menu-item>
-            <six-menu-item checked="true">Swiss Interbank Clearing</six-menu-item>
-        </six-menu>
-      </six-header>
-    `);
-    });
-    it('renders without hamburger menu', async () => {
-        const page = await newSpecPage({
-            components: [SixHeader],
-            html: `<six-header hide-hamburger-menu="true"></six-header>`,
-        });
-        expect(page.root).toEqualHtml(`
-      <six-header hide-hamburger-menu="true">
-        <mock:shadow-root>
-          <header class="six-header">
-            <section class="six-header__logo">
-            <svg height="20" viewBox="0 0 90 26" xmlns="http://www.w3.org/2000/svg">
-              <title>
-                SIX
-              </title>
-              <g fill="#DE3919" fill-rule="nonzero">
-                <path d="m22.798 3.869c1.82-2.168 4.549-3.545 7.6-3.545h6.807v4.961h-6.807c-1.526 0-2.89.689-3.8 1.771l-12.19 14.526c-1.82 2.166-4.549 3.545-7.6 3.545h-6.808v-4.961h6.808c1.525 0 2.889-.689 3.799-1.773l12.191-14.525"></path>
-                <path d="m42.16.324h5.21v24.806h-5.21z"></path>
-                <path d="m66.743 3.869l4.195 4.999 4.195-4.999c1.819-2.168 4.549-3.545 7.6-3.545h6.806v4.961h-6.806c-1.526 0-2.89.689-3.8 1.771l-4.758 5.669 4.758 5.669c.91 1.084 2.274 1.773 3.8 1.773h6.806v4.961h-6.806c-3.051 0-5.781-1.379-7.6-3.545l-4.195-4.999-4.195 4.999c-1.82 2.166-4.55 3.545-7.6 3.545h-6.807v-4.961h6.807c1.525 0 2.889-.689 3.799-1.773l4.758-5.669-4.758-5.669c-.91-1.083-2.274-1.771-3.799-1.771h-6.807v-4.961h6.807c3.05 0 5.78 1.378 7.6 3.545"></path>
-              </g>
-            </svg>
-
-            </section>
-            <section class="six-header__placeholder"></section>
-            <section class="six-header__custom">
-              <slot></slot>
-            </section>
-          </header>
-          <div class="six-header__search-field">
-            <slot name="search-field"></slot>
-          </div>
-        </mock:shadow-root>
-      </six-header>
-  `);
-    });
-});
-//# sourceMappingURL=six-header.spec.js.map

package/dist/collection/components/six-header/test/six-header.spec.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"six-header.spec.js","sourceRoot":"","sources":["../../../../src/components/six-header/test/six-header.spec.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAE1C,QAAQ,CAAC,YAAY,EAAE,GAAG,EAAE;IAC1B,UAAU,CAAC,GAAG,EAAE;QACd,MAAM,oBAAoB,GAAG,IAAI,CAAC,EAAE,CAAC,SAAS,gBAAgB;YAC5D,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;YACzB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;YAC5B,OAAO,IAAI,CAAC;QACd,CAAC,CAAC,CAAC;QACH,MAAM,CAAC,gBAAgB,GAAG,oBAAoB,CAAC;IACjD,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,SAAS,EAAE,KAAK,IAAI,EAAE;QACvB,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,2BAA2B;SAClC,CAAC,CAAC;QACH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA8B7B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,4BAA4B,EAAE,KAAK,IAAI,EAAE;QAC1C,QAAQ;QACR,MAAM,IAAI,GAAG,6DAA6D,CAAC;QAE3E,OAAO;QACP,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,IAAI;SACX,CAAC,CAAC;QAEH,OAAO;QACP,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;;;;;;;;;;;;;KAuB7B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,4BAA4B,EAAE,KAAK,IAAI,EAAE;QAC1C,QAAQ;QACR,MAAM,IAAI,GAAG;;;;;gCAKe,CAAC;QAE7B,OAAO;QACP,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,IAAI;SACX,CAAC,CAAC;QAEH,OAAO;QACP,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA2C7B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,gCAAgC,EAAE,KAAK,IAAI,EAAE;QAC9C,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,sDAAsD;SAC7D,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2B/B,CAAC,CAAC;IACH,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { newSpecPage } from '@stencil/core/testing';\nimport { SixHeader } from '../six-header';\n\ndescribe('six-header', () => {\n  beforeEach(() => {\n    const mutationObserverMock = jest.fn(function MutationObserver(this: MutationObserver): MutationObserver {\n      this.observe = jest.fn();\n      this.disconnect = jest.fn();\n      return this;\n    });\n    global.MutationObserver = mutationObserverMock;\n  });\n\n  it('renders', async () => {\n    const page = await newSpecPage({\n      components: [SixHeader],\n      html: `<six-header></six-header>`,\n    });\n    expect(page.root).toEqualHtml(`\n      <six-header>\n        <mock:shadow-root>\n          <header class=\"six-header\">\n            <section class=\"six-header__menu\">\n              <six-icon-button name=\"menu\"></six-icon-button>\n            </section>\n            <section class=\"six-header__logo\">\n             <svg height=\"20\" viewBox=\"0 0 90 26\" xmlns=\"http://www.w3.org/2000/svg\">\n               <title>\n                 SIX\n               </title>\n               <g fill=\"#DE3919\" fill-rule=\"nonzero\">\n                 <path d=\"m22.798 3.869c1.82-2.168 4.549-3.545 7.6-3.545h6.807v4.961h-6.807c-1.526 0-2.89.689-3.8 1.771l-12.19 14.526c-1.82 2.166-4.549 3.545-7.6 3.545h-6.808v-4.961h6.808c1.525 0 2.889-.689 3.799-1.773l12.191-14.525\"></path>\n                 <path d=\"m42.16.324h5.21v24.806h-5.21z\"></path>\n                 <path d=\"m66.743 3.869l4.195 4.999 4.195-4.999c1.819-2.168 4.549-3.545 7.6-3.545h6.806v4.961h-6.806c-1.526 0-2.89.689-3.8 1.771l-4.758 5.669 4.758 5.669c.91 1.084 2.274 1.773 3.8 1.773h6.806v4.961h-6.806c-3.051 0-5.781-1.379-7.6-3.545l-4.195-4.999-4.195 4.999c-1.82 2.166-4.55 3.545-7.6 3.545h-6.807v-4.961h6.807c1.525 0 2.889-.689 3.799-1.773l4.758-5.669-4.758-5.669c-.91-1.083-2.274-1.771-3.799-1.771h-6.807v-4.961h6.807c3.05 0 5.78 1.378 7.6 3.545\"></path>\n               </g>\n             </svg>\n\n            </section>\n            <section class=\"six-header__placeholder\"></section>\n            <section class=\"six-header__custom\">\n              <slot></slot>\n            </section>\n          </header>\n          <div class=\"six-header__search-field\">\n            <slot name=\"search-field\"></slot>\n          </div>\n        </mock:shadow-root>\n      </six-header>\n    `);\n  });\n\n  it('should render custom logo ', async () => {\n    // given\n    const html = `<six-header><div slot=\"logo\">custom logo</div></six-header>`;\n\n    // when\n    const page = await newSpecPage({\n      components: [SixHeader],\n      html: html,\n    });\n\n    // then\n    expect(page.root).toEqualHtml(`\n      <six-header>\n        <mock:shadow-root>\n          <header class=\"six-header\">\n            <section class=\"six-header__menu\">\n              <six-icon-button name=\"menu\"></six-icon-button>\n            </section>\n            <section>\n               <slot name=\"logo\"></slot>\n            </section>\n            <section class=\"six-header__placeholder\"></section>\n            <section class=\"six-header__custom\">\n              <slot></slot>\n            </section>\n          </header>\n          <div class=\"six-header__search-field\">\n            <slot name=\"search-field\"></slot>\n          </div>\n        </mock:shadow-root>\n          <div slot=\"logo\">\n            custom logo\n          </div>\n      </six-header>\n    `);\n  });\n\n  it('should render app switcher', async () => {\n    // given\n    const html = `<six-header>\n                    <six-menu slot=\"app-switcher-menu\">\n                      <six-menu-item checked=\"false\">Custody</six-menu-item>\n                      <six-menu-item checked=\"true\">Swiss Interbank Clearing</six-menu-item>\n                    </six-menu>\n                  </six-header>`;\n\n    // when\n    const page = await newSpecPage({\n      components: [SixHeader],\n      html: html,\n    });\n\n    // then\n    expect(page.root).toEqualHtml(`\n      <six-header>\n        <mock:shadow-root>\n          <header class=\"six-header\">\n            <section class=\"six-header__menu\">\n              <six-icon-button name=\"menu\"></six-icon-button>\n            </section>\n            <section class=\"six-header__logo\">\n             <svg height=\"20\" viewBox=\"0 0 90 26\" xmlns=\"http://www.w3.org/2000/svg\">\n               <title>\n                 SIX\n               </title>\n               <g fill=\"#DE3919\" fill-rule=\"nonzero\">\n                 <path d=\"m22.798 3.869c1.82-2.168 4.549-3.545 7.6-3.545h6.807v4.961h-6.807c-1.526 0-2.89.689-3.8 1.771l-12.19 14.526c-1.82 2.166-4.549 3.545-7.6 3.545h-6.808v-4.961h6.808c1.525 0 2.889-.689 3.799-1.773l12.191-14.525\"></path>\n                 <path d=\"m42.16.324h5.21v24.806h-5.21z\"></path>\n                 <path d=\"m66.743 3.869l4.195 4.999 4.195-4.999c1.819-2.168 4.549-3.545 7.6-3.545h6.806v4.961h-6.806c-1.526 0-2.89.689-3.8 1.771l-4.758 5.669 4.758 5.669c.91 1.084 2.274 1.773 3.8 1.773h6.806v4.961h-6.806c-3.051 0-5.781-1.379-7.6-3.545l-4.195-4.999-4.195 4.999c-1.82 2.166-4.55 3.545-7.6 3.545h-6.807v-4.961h6.807c1.525 0 2.889-.689 3.799-1.773l4.758-5.669-4.758-5.669c-.91-1.083-2.274-1.771-3.799-1.771h-6.807v-4.961h6.807c3.05 0 5.78 1.378 7.6 3.545\"></path>\n               </g>\n             </svg>\n\n            </section>\n            <section class=\"six-header__placeholder\"></section>\n            <section class=\"six-header__custom\">\n              <slot></slot>\n            </section>\n            <section class=\"six-header__app-switcher\">\n                <six-dropdown distance=\"13\" placement=\"bottom-end\" skidding=\"20\">\n                  <div class=\"six-header__app-switcher-dropdown\" slot=\"trigger\">\n                    <a class=\"six-header__selected-app\">Swiss Interbank Clearing</a>\n                    <six-icon-button name=\"apps\"></six-icon-button>\n                  </div>\n                  <slot name=\"app-switcher-menu\"></slot>\n               </six-dropdown>\n           </section>\n          </header>\n          <div class=\"six-header__search-field\">\n            <slot name=\"search-field\"></slot>\n          </div>\n        </mock:shadow-root>\n        <six-menu slot=\"app-switcher-menu\">\n            <six-menu-item checked=\"false\">Custody</six-menu-item>\n            <six-menu-item checked=\"true\">Swiss Interbank Clearing</six-menu-item>\n        </six-menu>\n      </six-header>\n    `);\n  });\n\n  it('renders without hamburger menu', async () => {\n    const page = await newSpecPage({\n      components: [SixHeader],\n      html: `<six-header hide-hamburger-menu=\"true\"></six-header>`,\n    });\n\n    expect(page.root).toEqualHtml(`\n      <six-header hide-hamburger-menu=\"true\">\n        <mock:shadow-root>\n          <header class=\"six-header\">\n            <section class=\"six-header__logo\">\n            <svg height=\"20\" viewBox=\"0 0 90 26\" xmlns=\"http://www.w3.org/2000/svg\">\n              <title>\n                SIX\n              </title>\n              <g fill=\"#DE3919\" fill-rule=\"nonzero\">\n                <path d=\"m22.798 3.869c1.82-2.168 4.549-3.545 7.6-3.545h6.807v4.961h-6.807c-1.526 0-2.89.689-3.8 1.771l-12.19 14.526c-1.82 2.166-4.549 3.545-7.6 3.545h-6.808v-4.961h6.808c1.525 0 2.889-.689 3.799-1.773l12.191-14.525\"></path>\n                <path d=\"m42.16.324h5.21v24.806h-5.21z\"></path>\n                <path d=\"m66.743 3.869l4.195 4.999 4.195-4.999c1.819-2.168 4.549-3.545 7.6-3.545h6.806v4.961h-6.806c-1.526 0-2.89.689-3.8 1.771l-4.758 5.669 4.758 5.669c.91 1.084 2.274 1.773 3.8 1.773h6.806v4.961h-6.806c-3.051 0-5.781-1.379-7.6-3.545l-4.195-4.999-4.195 4.999c-1.82 2.166-4.55 3.545-7.6 3.545h-6.807v-4.961h6.807c1.525 0 2.889-.689 3.799-1.773l4.758-5.669-4.758-5.669c-.91-1.083-2.274-1.771-3.799-1.771h-6.807v-4.961h6.807c3.05 0 5.78 1.378 7.6 3.545\"></path>\n              </g>\n            </svg>\n\n            </section>\n            <section class=\"six-header__placeholder\"></section>\n            <section class=\"six-header__custom\">\n              <slot></slot>\n            </section>\n          </header>\n          <div class=\"six-header__search-field\">\n            <slot name=\"search-field\"></slot>\n          </div>\n        </mock:shadow-root>\n      </six-header>\n  `);\n  });\n});\n"]}

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

@@ -1,20 +0,0 @@
-import { newSpecPage } from "@stencil/core/testing";
-import { SixIcon } from "../six-icon";
-describe('six-icon', () => {
-    it('renders', async () => {
-        const page = await newSpecPage({
-            components: [SixIcon],
-            html: `<six-icon></six-icon>`,
-        });
-        expect(page.root).toEqualHtml(`
-      <six-icon size="inherit">
-        <mock:shadow-root>
-          <i class="icon--inherit material-icons material-icons-outlined">
-            <slot></slot>
-          </i>
-        </mock:shadow-root>
-      </six-icon>
-    `);
-    });
-});
-//# sourceMappingURL=six-icon.spec.js.map

package/dist/collection/components/six-icon/test/six-icon.spec.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"six-icon.spec.js","sourceRoot":"","sources":["../../../../src/components/six-icon/test/six-icon.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;IACxB,EAAE,CAAC,SAAS,EAAE,KAAK,IAAI,EAAE;QACvB,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,OAAO,CAAC;YACrB,IAAI,EAAE,uBAAuB;SAC9B,CAAC,CAAC;QACH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;KAQ7B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { newSpecPage } from '@stencil/core/testing';\nimport { SixIcon } from '../six-icon';\n\ndescribe('six-icon', () => {\n  it('renders', async () => {\n    const page = await newSpecPage({\n      components: [SixIcon],\n      html: `<six-icon></six-icon>`,\n    });\n    expect(page.root).toEqualHtml(`\n      <six-icon size=\"inherit\">\n        <mock:shadow-root>\n          <i class=\"icon--inherit material-icons material-icons-outlined\">\n            <slot></slot>\n          </i>\n        </mock:shadow-root>\n      </six-icon>\n    `);\n  });\n});\n"]}

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

@@ -1,23 +0,0 @@
-import { newSpecPage } from "@stencil/core/testing";
-import { SixIconButton } from "../six-icon-button";
-describe('six-icon-button', () => {
-    it('renders', async () => {
-        const page = await newSpecPage({
-            components: [SixIconButton],
-            html: `<six-icon-button></six-icon-button>`,
-        });
-        expect(page.root).toEqualHtml(`
-      <six-icon-button size="medium">
-        <mock:shadow-root>
-         <div>
-          <button class="icon-button" part="base" type="button">
-            <six-icon aria-hidden="true" size="medium"></six-icon>
-            <slot></slot>
-          </button>
-         </div>
-        </mock:shadow-root>
-      </six-icon-button>
-    `);
-    });
-});
-//# sourceMappingURL=six-icon-button.spec.js.map

package/dist/collection/components/six-icon-button/test/six-icon-button.spec.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"six-icon-button.spec.js","sourceRoot":"","sources":["../../../../src/components/six-icon-button/test/six-icon-button.spec.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAEnD,QAAQ,CAAC,iBAAiB,EAAE,GAAG,EAAE;IAC/B,EAAE,CAAC,SAAS,EAAE,KAAK,IAAI,EAAE;QACvB,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,aAAa,CAAC;YAC3B,IAAI,EAAE,qCAAqC;SAC5C,CAAC,CAAC;QACH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;KAW7B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { newSpecPage } from '@stencil/core/testing';\nimport { SixIconButton } from '../six-icon-button';\n\ndescribe('six-icon-button', () => {\n  it('renders', async () => {\n    const page = await newSpecPage({\n      components: [SixIconButton],\n      html: `<six-icon-button></six-icon-button>`,\n    });\n    expect(page.root).toEqualHtml(`\n      <six-icon-button size=\"medium\">\n        <mock:shadow-root>\n         <div>\n          <button class=\"icon-button\" part=\"base\" type=\"button\">\n            <six-icon aria-hidden=\"true\" size=\"medium\"></six-icon>\n            <slot></slot>\n          </button>\n         </div>\n        </mock:shadow-root>\n      </six-icon-button>\n    `);\n  });\n});\n"]}

package/dist/collection/components/six-input/test/six-input.spec.js

@@ -1,39 +0,0 @@
-import { newSpecPage } from "@stencil/core/testing";
-import { SixInput } from "../six-input";
-describe('six-input', () => {
-    it('renders', async () => {
-        const page = await newSpecPage({
-            components: [SixInput],
-            html: `<six-input></six-input>`,
-        });
-        expect(page.root).toEqualHtml(`
-        <six-input size="medium" type="text" value="">
-          <mock:shadow-root>
-            <div class="form-control form-control--medium" part="form-control">
-              <label aria-hidden="true" class="form-control__label" htmlfor="input-1" id="input-label-1" part="label">
-                <slot name="label"></slot>
-              </label>
-              <div class="form-control__input">
-                <div class="input input--empty input--medium" part="base">
-                  <span class="input__prefix" part="prefix">
-                    <slot name="prefix"></slot>
-                  </span>
-                  <input aria-describedby="input-help-text-1" aria-invalid="false" aria-labelledby="input-label-1" autocapitalize="off" autocomplete="off" autocorrect="off" class="input__control" data-testid="input-control" id="input-1" part="input" size="1" type="text" value="">
-                  <span class="input__suffix" part="suffix">
-                    <slot name="suffix"></slot>
-                  </span>
-                </div>
-              </div>
-              <div aria-hidden="true" class="form-control__error-text" id="input-error-text-1" part="error-text">
-                <slot name="error-text"></slot>
-              </div>
-              <div aria-hidden="true" class="form-control__help-text" id="input-help-text-1" part="help-text">
-                <slot name="help-text"></slot>
-              </div>
-            </div>
-        </mock:shadow-root>
-      </six-input>
-    `);
-    });
-});
-//# sourceMappingURL=six-input.spec.js.map

package/dist/collection/components/six-input/test/six-input.spec.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"six-input.spec.js","sourceRoot":"","sources":["../../../../src/components/six-input/test/six-input.spec.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAExC,QAAQ,CAAC,WAAW,EAAE,GAAG,EAAE;IACzB,EAAE,CAAC,SAAS,EAAE,KAAK,IAAI,EAAE;QACvB,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,QAAQ,CAAC;YACtB,IAAI,EAAE,yBAAyB;SAChC,CAAC,CAAC;QACH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;KA2B7B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { newSpecPage } from '@stencil/core/testing';\nimport { SixInput } from '../six-input';\n\ndescribe('six-input', () => {\n  it('renders', async () => {\n    const page = await newSpecPage({\n      components: [SixInput],\n      html: `<six-input></six-input>`,\n    });\n    expect(page.root).toEqualHtml(`\n        <six-input size=\"medium\" type=\"text\" 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=\"input-1\" id=\"input-label-1\" part=\"label\">\n                <slot name=\"label\"></slot>\n              </label>\n              <div class=\"form-control__input\">\n                <div class=\"input input--empty input--medium\" part=\"base\">\n                  <span class=\"input__prefix\" part=\"prefix\">\n                    <slot name=\"prefix\"></slot>\n                  </span>\n                  <input aria-describedby=\"input-help-text-1\" aria-invalid=\"false\" aria-labelledby=\"input-label-1\" autocapitalize=\"off\" autocomplete=\"off\" autocorrect=\"off\" class=\"input__control\" data-testid=\"input-control\" id=\"input-1\" part=\"input\" size=\"1\" type=\"text\" value=\"\">\n                  <span class=\"input__suffix\" part=\"suffix\">\n                    <slot name=\"suffix\"></slot>\n                  </span>\n                </div>\n              </div>\n              <div aria-hidden=\"true\" class=\"form-control__error-text\" id=\"input-error-text-1\" part=\"error-text\">\n                <slot name=\"error-text\"></slot>\n              </div>\n              <div aria-hidden=\"true\" class=\"form-control__help-text\" id=\"input-help-text-1\" part=\"help-text\">\n                <slot name=\"help-text\"></slot>\n              </div>\n            </div>\n        </mock:shadow-root>\n      </six-input>\n    `);\n  });\n});\n"]}

package/dist/collection/components/six-item-picker/test/six-item-picker.spec.js

@@ -1,90 +0,0 @@
-import { newSpecPage } from "@stencil/core/testing";
-import { SixItemPicker } from "../six-item-picker";
-describe('six-item-picker', () => {
-    it('should render default', async () => {
-        // given
-        const page = await newSpecPage({
-            components: [SixItemPicker],
-            html: `<six-item-picker></six-item-picker>`,
-        });
-        // then
-        expect(page.root).toEqualHtml(`
-      <six-item-picker roundtrip="" step="1" value="0">
-        <mock:shadow-root>
-          <div class="item_picker__container" part="container" tabindex="0">
-            <div class="item_picker__btn" part="up" tabindex="-1">
-              <six-icon size="large">
-                expand_less
-              </six-icon>
-            </div>
-            <div class="item_picker__content" part="content">
-              0
-            </div>
-            <div class="item_picker__btn" part="down" tabindex="-1">
-              <six-icon size="large">
-                expand_more
-              </six-icon>
-            </div>
-          </div>
-        </mock:shadow-root>
-      </six-item-picker>`);
-    });
-    it('should render number picker with correct attributes', async () => {
-        // given
-        const page = await newSpecPage({
-            components: [SixItemPicker],
-            html: `<six-item-picker value="5" step="5" min="3" max="13" roundtrip="false"></six-item-picker>`,
-        });
-        // then
-        expect(page.root).toEqualHtml(`
-      <six-item-picker max="13" min="3" roundtrip="false" step="5" value="5">
-        <mock:shadow-root>
-          <div class="item_picker__container" part="container" tabindex="0">
-            <div class="item_picker__btn" part="up" tabindex="-1">
-              <six-icon size="large">
-                expand_less
-              </six-icon>
-            </div>
-            <div class="item_picker__content" part="content">
-              5
-            </div>
-            <div class="item_picker__btn item_picker__btn--disabled" part="down" tabindex="-1">
-              <six-icon size="large">
-                expand_more
-              </six-icon>
-            </div>
-          </div>
-        </mock:shadow-root>
-      </six-item-picker>
-    `);
-    });
-    it('should render letter picker with correct attributes', async () => {
-        // given
-        const page = await newSpecPage({
-            components: [SixItemPicker],
-            html: `<six-item-picker type="letter" roundtrip="false" min="c" max="k" value="d"></six-item-picker>`,
-        });
-        // then
-        expect(page.root).toEqualHtml(`
-      <six-item-picker max="k" min="c" roundtrip="false" step="1" type="letter" value="d">
-        <mock:shadow-root>
-          <div class="item_picker__container" part="container" tabindex="0">
-            <div class="item_picker__btn" part="up" tabindex="-1">
-              <six-icon size="large">
-                expand_less
-              </six-icon>
-            </div>
-            <div class="item_picker__content" part="content">
-              d
-            </div>
-            <div class="item_picker__btn" part="down" tabindex="-1">
-              <six-icon size="large">
-                expand_more
-              </six-icon>
-            </div>
-          </div>
-        </mock:shadow-root>
-      </six-item-picker>`);
-    });
-});
-//# sourceMappingURL=six-item-picker.spec.js.map

package/dist/collection/components/six-item-picker/test/six-item-picker.spec.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"six-item-picker.spec.js","sourceRoot":"","sources":["../../../../src/components/six-item-picker/test/six-item-picker.spec.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAEnD,QAAQ,CAAC,iBAAiB,EAAE,GAAG,EAAE;IAC/B,EAAE,CAAC,uBAAuB,EAAE,KAAK,IAAI,EAAE;QACrC,QAAQ;QACR,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,aAAa,CAAC;YAC3B,IAAI,EAAE,qCAAqC;SAC5C,CAAC,CAAC;QAEH,OAAO;QACP,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;;;;;;;;;yBAmBT,CAAC,CAAC;IACzB,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,qDAAqD,EAAE,KAAK,IAAI,EAAE;QACnE,QAAQ;QACR,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,aAAa,CAAC;YAC3B,IAAI,EAAE,2FAA2F;SAClG,CAAC,CAAC;QAEH,OAAO;QACP,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;;;;;;;;;;KAoB7B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,qDAAqD,EAAE,KAAK,IAAI,EAAE;QACnE,QAAQ;QACR,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,aAAa,CAAC;YAC3B,IAAI,EAAE,+FAA+F;SACtG,CAAC,CAAC;QAEH,OAAO;QACP,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;;;;;;;;;yBAmBT,CAAC,CAAC;IACzB,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { newSpecPage } from '@stencil/core/testing';\nimport { SixItemPicker } from '../six-item-picker';\n\ndescribe('six-item-picker', () => {\n  it('should render default', async () => {\n    // given\n    const page = await newSpecPage({\n      components: [SixItemPicker],\n      html: `<six-item-picker></six-item-picker>`,\n    });\n\n    // then\n    expect(page.root).toEqualHtml(`\n      <six-item-picker roundtrip=\"\" step=\"1\" value=\"0\">\n        <mock:shadow-root>\n          <div class=\"item_picker__container\" part=\"container\" tabindex=\"0\">\n            <div class=\"item_picker__btn\" part=\"up\" tabindex=\"-1\">\n              <six-icon size=\"large\">\n                expand_less\n              </six-icon>\n            </div>\n            <div class=\"item_picker__content\" part=\"content\">\n              0\n            </div>\n            <div class=\"item_picker__btn\" part=\"down\" tabindex=\"-1\">\n              <six-icon size=\"large\">\n                expand_more\n              </six-icon>\n            </div>\n          </div>\n        </mock:shadow-root>\n      </six-item-picker>`);\n  });\n\n  it('should render number picker with correct attributes', async () => {\n    // given\n    const page = await newSpecPage({\n      components: [SixItemPicker],\n      html: `<six-item-picker value=\"5\" step=\"5\" min=\"3\" max=\"13\" roundtrip=\"false\"></six-item-picker>`,\n    });\n\n    // then\n    expect(page.root).toEqualHtml(`\n      <six-item-picker max=\"13\" min=\"3\" roundtrip=\"false\" step=\"5\" value=\"5\">\n        <mock:shadow-root>\n          <div class=\"item_picker__container\" part=\"container\" tabindex=\"0\">\n            <div class=\"item_picker__btn\" part=\"up\" tabindex=\"-1\">\n              <six-icon size=\"large\">\n                expand_less\n              </six-icon>\n            </div>\n            <div class=\"item_picker__content\" part=\"content\">\n              5\n            </div>\n            <div class=\"item_picker__btn item_picker__btn--disabled\" part=\"down\" tabindex=\"-1\">\n              <six-icon size=\"large\">\n                expand_more\n              </six-icon>\n            </div>\n          </div>\n        </mock:shadow-root>\n      </six-item-picker>\n    `);\n  });\n\n  it('should render letter picker with correct attributes', async () => {\n    // given\n    const page = await newSpecPage({\n      components: [SixItemPicker],\n      html: `<six-item-picker type=\"letter\" roundtrip=\"false\" min=\"c\" max=\"k\" value=\"d\"></six-item-picker>`,\n    });\n\n    // then\n    expect(page.root).toEqualHtml(`\n      <six-item-picker max=\"k\" min=\"c\" roundtrip=\"false\" step=\"1\" type=\"letter\" value=\"d\">\n        <mock:shadow-root>\n          <div class=\"item_picker__container\" part=\"container\" tabindex=\"0\">\n            <div class=\"item_picker__btn\" part=\"up\" tabindex=\"-1\">\n              <six-icon size=\"large\">\n                expand_less\n              </six-icon>\n            </div>\n            <div class=\"item_picker__content\" part=\"content\">\n              d\n            </div>\n            <div class=\"item_picker__btn\" part=\"down\" tabindex=\"-1\">\n              <six-icon size=\"large\">\n                expand_more\n              </six-icon>\n            </div>\n          </div>\n        </mock:shadow-root>\n      </six-item-picker>`);\n  });\n});\n"]}