@six-group/ui-library 0.0.0-insider.ebd822a → 0.0.0-insider.f015905

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

@@ -0,0 +1 @@
+{"version":3,"file":"six-timepicker.spec.js","sourceRoot":"","sources":["../../../../src/components/six-timepicker/test/six-timepicker.spec.tsx"],"names":[],"mappings":"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","sourcesContent":["import { newSpecPage } from '@stencil/core/testing';\nimport { SixTimepicker } from '../six-timepicker';\n\ndescribe('six-timepicker', () => {\n  it('should render default timepicker', async () => {\n    // given\n    const config = {\n      components: [SixTimepicker],\n      html: `<six-timepicker></six-timepicker>`,\n    };\n\n    // when initially loaded\n    const page = await newSpecPage(config);\n\n    // then\n    expect(page.root).toEqualHtml(`\n    <six-timepicker>\n    <mock:shadow-root>\n      <div class=\"timepicker__container\" part=\"container\">\n        <six-input class=\"input--empty\" errortext=\"\" label=\"\" part=\"input\" size=\"medium\" value=\"\">\n          <span class=\"prefix\" part=\"icon\" slot=\"prefix\">\n            <six-icon size=\"medium\">\n              watch_later\n            </six-icon>\n          </span>\n        </six-input>\n      </div>\n    </mock:shadow-root>\n  </six-timepicker>\n   `);\n\n    // when setting a value and opening the popup\n    if (page.root?.shadowRoot != null) {\n      page.root.value = '20:00:00';\n      page.root.shadowRoot.querySelector('six-input')?.click();\n    }\n    await page.waitForChanges();\n\n    // then expect the correct time to be rendered\n    expect(page.root).toEqualHtml(`\n<six-timepicker open=\"\">\n  <mock:shadow-root>\n    <div class=\"timepicker__container\" part=\"container\">\n      <six-input errortext=\"\" label=\"\" part=\"input\" size=\"medium\" value=\"20:00:00\">\n        <span class=\"prefix\" part=\"icon\" slot=\"prefix\">\n          <six-icon size=\"medium\">\n            watch_later\n          </six-icon>\n        </span>\n      </six-input>\n      <div class=\"timepicker__popup\" part=\"popup\">\n        <six-item-picker interval=\"35\" max=\"23\" min=\"0\" padded=\"\" timeout=\"300\" type=\"number\" value=\"20\"></six-item-picker>\n        <div class=\"timepicker__separator\">\n          <span>\n            :\n          </span>\n        </div>\n        <six-item-picker interval=\"35\" max=\"59\" min=\"0\" padded=\"\" timeout=\"300\" type=\"number\" value=\"0\"></six-item-picker>\n        <div class=\"timepicker__separator\">\n          <span>\n            :\n          </span>\n        </div>\n        <six-item-picker interval=\"35\" max=\"59\" min=\"0\" padded=\"\" timeout=\"300\" type=\"number\" value=\"0\"></six-item-picker>\n      </div>\n    </div>\n  </mock:shadow-root>\n</six-timepicker>\n   `);\n  });\n\n  it('should render open timepicker', async () => {\n    // given\n    const config = {\n      components: [SixTimepicker],\n      html: `<six-timepicker open value=\"13:20:59\"></six-timepicker>`,\n    };\n\n    // when\n    const page = await newSpecPage(config);\n\n    // then\n    expect(page.root).toEqualHtml(`\n    <six-timepicker open=\"\" value=\"13:20:59\">\n      <mock:shadow-root>\n        <div class=\"timepicker__container\" part=\"container\">\n          <six-input errortext=\"\" label=\"\" part=\"input\" size=\"medium\" value=\"13:20:59\">\n            <span class=\"prefix\" part=\"icon\" slot=\"prefix\">\n              <six-icon size=\"medium\">\n                watch_later\n              </six-icon>\n            </span>\n          </six-input>\n          <div class=\"timepicker__popup\" part=\"popup\">\n            <six-item-picker interval=\"35\" max=\"23\" min=\"0\" padded=\"\" timeout=\"300\" type=\"number\" value=\"13\"></six-item-picker>\n            <div class=\"timepicker__separator\">\n              <span>\n                :\n              </span>\n            </div>\n            <six-item-picker interval=\"35\" max=\"59\" min=\"0\" padded=\"\" timeout=\"300\" type=\"number\" value=\"20\"></six-item-picker>\n            <div class=\"timepicker__separator\">\n              <span>\n                :\n              </span>\n            </div>\n            <six-item-picker interval=\"35\" max=\"59\" min=\"0\" padded=\"\" timeout=\"300\" type=\"number\" value=\"59\"></six-item-picker>\n          </div>\n        </div>\n      </mock:shadow-root>\n    </six-timepicker>\n   `);\n  });\n\n  it('should render inline timepicker', async () => {\n    // given\n    const config = {\n      components: [SixTimepicker],\n      html: `<six-timepicker inline value=\"13:20:59\"></six-timepicker>`,\n    };\n\n    // when\n    const page = await newSpecPage(config);\n\n    // then\n    expect(page.root).toEqualHtml(`\n    <six-timepicker inline=\"\" open=\"\" value=\"13:20:59\">\n    <mock:shadow-root>\n      <div class=\"timepicker__container\" part=\"container\">\n        <six-input class=\"input--hide\" errortext=\"\" label=\"\" part=\"input\" size=\"medium\" value=\"13:20:59\">\n          <span class=\"prefix\" part=\"icon\" slot=\"prefix\">\n            <six-icon size=\"medium\">\n              watch_later\n            </six-icon>\n          </span>\n        </six-input>\n        <div class=\"timepicker__popup timepicker__popup--is-inline\" part=\"popup\">\n          <six-item-picker interval=\"35\" max=\"23\" min=\"0\" padded=\"\" timeout=\"300\" type=\"number\" value=\"13\"></six-item-picker>\n          <div class=\"timepicker__separator\">\n            <span>\n              :\n            </span>\n          </div>\n          <six-item-picker interval=\"35\" max=\"59\" min=\"0\" padded=\"\" timeout=\"300\" type=\"number\" value=\"20\"></six-item-picker>\n          <div class=\"timepicker__separator\">\n            <span>\n              :\n            </span>\n          </div>\n          <six-item-picker interval=\"35\" max=\"59\" min=\"0\" padded=\"\" timeout=\"300\" type=\"number\" value=\"59\"></six-item-picker>\n        </div>\n      </div>\n    </mock:shadow-root>\n  </six-timepicker>\n   `);\n  });\n\n  it('should render open timepicker with default time', async () => {\n    // given\n    const config = {\n      components: [SixTimepicker],\n      html: `<six-timepicker open default-time=\"13:20:59\"></six-timepicker>`,\n    };\n\n    // when\n    const page = await newSpecPage(config);\n\n    // then\n    expect(page.root).toEqualHtml(`\n    <six-timepicker default-time=\"13:20:59\" open=\"\">\n    <mock:shadow-root>\n      <div class=\"timepicker__container\" part=\"container\">\n        <six-input class=\"input--empty\" errortext=\"\" label=\"\" part=\"input\" size=\"medium\" value=\"\">\n          <span class=\"prefix\" part=\"icon\" slot=\"prefix\">\n            <six-icon size=\"medium\">\n              watch_later\n            </six-icon>\n          </span>\n        </six-input>\n        <div class=\"timepicker__popup\" part=\"popup\">\n          <six-item-picker interval=\"35\" max=\"23\" min=\"0\" padded=\"\" timeout=\"300\" type=\"number\" value=\"13\"></six-item-picker>\n          <div class=\"timepicker__separator\">\n            <span>\n              :\n            </span>\n          </div>\n          <six-item-picker interval=\"35\" max=\"59\" min=\"0\" padded=\"\" timeout=\"300\" type=\"number\" value=\"20\"></six-item-picker>\n          <div class=\"timepicker__separator\">\n            <span>\n              :\n            </span>\n          </div>\n          <six-item-picker interval=\"35\" max=\"59\" min=\"0\" padded=\"\" timeout=\"300\" type=\"number\" value=\"59\"></six-item-picker>\n        </div>\n      </div>\n    </mock:shadow-root>\n  </six-timepicker>\n   `);\n  });\n\n  it('should render timepicker with different separator', async () => {\n    // given\n    const config = {\n      components: [SixTimepicker],\n      html: `<six-timepicker open value=\"11:59:20\" separator=\"-\"></six-timepicker>`,\n    };\n\n    // when\n    const page = await newSpecPage(config);\n\n    // then\n    expect(page.root).toEqualHtml(`\n    <six-timepicker open=\"\" separator=\"-\" value=\"11:59:20\">\n      <mock:shadow-root>\n        <div class=\"timepicker__container\" part=\"container\">\n          <six-input errortext=\"\" label=\"\" part=\"input\" size=\"medium\" value=\"11:59:20\">\n            <span class=\"prefix\" part=\"icon\" slot=\"prefix\">\n              <six-icon size=\"medium\">\n                watch_later\n              </six-icon>\n            </span>\n          </six-input>\n          <div class=\"timepicker__popup\" part=\"popup\">\n            <six-item-picker interval=\"35\" max=\"23\" min=\"0\" padded=\"\" timeout=\"300\" type=\"number\" value=\"11\"></six-item-picker>\n            <div class=\"timepicker__separator\">\n              <span>\n                -\n              </span>\n            </div>\n            <six-item-picker interval=\"35\" max=\"59\" min=\"0\" padded=\"\" timeout=\"300\" type=\"number\" value=\"59\"></six-item-picker>\n            <div class=\"timepicker__separator\">\n              <span>\n                -\n              </span>\n            </div>\n            <six-item-picker interval=\"35\" max=\"59\" min=\"0\" padded=\"\" timeout=\"300\" type=\"number\" value=\"20\"></six-item-picker>\n          </div>\n        </div>\n      </mock:shadow-root>\n    </six-timepicker>\n   `);\n  });\n\n  it('should render timepicker with different format', async () => {\n    // given\n    const config = {\n      components: [SixTimepicker],\n      html: `<six-timepicker open value=\"03:45:20:PM\" format=\"hh:mm:ss:aa\"></six-timepicker>`,\n    };\n\n    // when\n    const page = await newSpecPage(config);\n\n    // then\n    expect(page.root).toEqualHtml(`\n<six-timepicker format=\"hh:mm:ss:aa\" open=\"\" value=\"03:45:20:PM\">\n  <mock:shadow-root>\n    <div class=\"timepicker__container\" part=\"container\">\n      <six-input errortext=\"\" label=\"\" part=\"input\" size=\"medium\" value=\"03:45:20:PM\">\n        <span class=\"prefix\" part=\"icon\" slot=\"prefix\">\n          <six-icon size=\"medium\">\n            watch_later\n          </six-icon>\n        </span>\n      </six-input>\n      <div class=\"timepicker__popup\" part=\"popup\">\n        <six-item-picker interval=\"35\" max=\"11\" min=\"0\" padded=\"\" timeout=\"300\" type=\"number\" value=\"3\"></six-item-picker>\n        <div class=\"timepicker__separator\">\n          <span>\n            :\n          </span>\n        </div>\n        <six-item-picker interval=\"35\" max=\"59\" min=\"0\" padded=\"\" timeout=\"300\" type=\"number\" value=\"45\"></six-item-picker>\n        <div class=\"timepicker__separator\">\n          <span>\n            :\n          </span>\n        </div>\n        <six-item-picker interval=\"35\" max=\"59\" min=\"0\" padded=\"\" timeout=\"300\" type=\"number\" value=\"20\"></six-item-picker>\n        <six-item-picker interval=\"35\" padded=\"\" timeout=\"300\" type=\"custom\" value=\"PM\"></six-item-picker>\n      </div>\n    </div>\n  </mock:shadow-root>\n</six-timepicker>\n   `);\n  });\n\n  it('should render timepicker with adjusted timeout and interval', async () => {\n    // given\n    const config = {\n      components: [SixTimepicker],\n      html: `<six-timepicker open value=\"13:20:59\" timeout=\"500\" interval=\"150\"></six-timepicker>`,\n    };\n\n    // when\n    const page = await newSpecPage(config);\n\n    // then\n    expect(page.root).toEqualHtml(`\n<six-timepicker interval=\"150\" open=\"\" timeout=\"500\" value=\"13:20:59\">\n  <mock:shadow-root>\n    <div class=\"timepicker__container\" part=\"container\">\n      <six-input errortext=\"\" label=\"\" part=\"input\" size=\"medium\" value=\"13:20:59\">\n        <span class=\"prefix\" part=\"icon\" slot=\"prefix\">\n          <six-icon size=\"medium\">\n            watch_later\n          </six-icon>\n        </span>\n      </six-input>\n      <div class=\"timepicker__popup\" part=\"popup\">\n        <six-item-picker interval=\"150\" max=\"23\" min=\"0\" padded=\"\" timeout=\"500\" type=\"number\" value=\"13\"></six-item-picker>\n        <div class=\"timepicker__separator\">\n          <span>\n            :\n          </span>\n        </div>\n        <six-item-picker interval=\"150\" max=\"59\" min=\"0\" padded=\"\" timeout=\"500\" type=\"number\" value=\"20\"></six-item-picker>\n        <div class=\"timepicker__separator\">\n          <span>\n            :\n          </span>\n        </div>\n        <six-item-picker interval=\"150\" max=\"59\" min=\"0\" padded=\"\" timeout=\"500\" type=\"number\" value=\"59\"></six-item-picker>\n      </div>\n    </div>\n  </mock:shadow-root>\n</six-timepicker>\n   `);\n  });\n\n  it('should render timepicker with placeholder', async () => {\n    // given\n    const config = {\n      components: [SixTimepicker],\n      html: `<six-timepicker placeholder=\"HH:mm:ss\"></six-timepicker>`,\n    };\n\n    // when\n    const page = await newSpecPage(config);\n\n    // then\n    expect(page.root).toEqualHtml(`\n<six-timepicker placeholder=\"HH:mm:ss\">\n  <mock:shadow-root>\n    <div class=\"timepicker__container\" part=\"container\">\n      <six-input class=\"input--empty\" errortext=\"\" label=\"\" part=\"input\" placeholder=\"HH:mm:ss\" size=\"medium\" value=\"\">\n        <span class=\"prefix\" part=\"icon\" slot=\"prefix\">\n          <six-icon size=\"medium\">\n            watch_later\n          </six-icon>\n        </span>\n      </six-input>\n    </div>\n  </mock:shadow-root>\n</six-timepicker>\n   `);\n  });\n\n  it('should render readonly timepicker', async () => {\n    // given\n    const config = {\n      components: [SixTimepicker],\n      html: `<six-timepicker value=\"02:00:00\" readonly></six-timepicker>`,\n    };\n\n    // when\n    const page = await newSpecPage(config);\n\n    // then\n    expect(page.root).toEqualHtml(`\n<six-timepicker readonly=\"\" value=\"02:00:00\">\n  <mock:shadow-root>\n    <div class=\"timepicker__container\" part=\"container\">\n      <six-input errortext=\"\" label=\"\" part=\"input\" readonly=\"\" size=\"medium\" value=\"02:00:00\">\n        <span class=\"prefix\" part=\"icon\" slot=\"prefix\">\n          <six-icon size=\"medium\">\n            watch_later\n          </six-icon>\n        </span>\n      </six-input>\n    </div>\n  </mock:shadow-root>\n</six-timepicker>\n   `);\n  });\n\n  it('should render disabled timepicker', async () => {\n    // given\n    const config = {\n      components: [SixTimepicker],\n      html: `<six-timepicker value=\"02:00:00\" disabled></six-timepicker>`,\n    };\n\n    // when\n    const page = await newSpecPage(config);\n\n    // then\n    expect(page.root).toEqualHtml(`\n<six-timepicker disabled=\"\" value=\"02:00:00\">\n  <mock:shadow-root>\n    <div class=\"timepicker__container\" part=\"container\">\n      <six-input disabled=\"\" errortext=\"\" label=\"\" part=\"input\" size=\"medium\" value=\"02:00:00\">\n        <span class=\"prefix\" part=\"icon\" slot=\"prefix\">\n          <six-icon size=\"medium\">\n            watch_later\n          </six-icon>\n        </span>\n      </six-input>\n    </div>\n  </mock:shadow-root>\n</six-timepicker>\n   `);\n  });\n\n  it('should render timepicker in correct sizes', async () => {\n    // given\n    const config = {\n      components: [SixTimepicker],\n      html: `<six-timepicker size=\"small\"></six-timepicker>`,\n    };\n\n    // when\n    const page = await newSpecPage(config);\n\n    // then\n    expect(page.root).toEqualHtml(`\n<six-timepicker size=\"small\">\n  <mock:shadow-root>\n    <div class=\"timepicker__container\" part=\"container\">\n      <six-input class=\"input--empty\" errortext=\"\" label=\"\" part=\"input\" size=\"small\" value=\"\">\n        <span class=\"prefix\" part=\"icon\" slot=\"prefix\">\n          <six-icon size=\"small\">\n            watch_later\n          </six-icon>\n        </span>\n      </six-input>\n    </div>\n  </mock:shadow-root>\n</six-timepicker>\n   `);\n\n    // when changing size\n    if (page.root != null) {\n      page.root.size = 'medium';\n    }\n    await page.waitForChanges();\n\n    // then expect medium sized timepicker\n    expect(page.root).toEqualHtml(`\n<six-timepicker size=\"small\">\n  <mock:shadow-root>\n    <div class=\"timepicker__container\" part=\"container\">\n      <six-input class=\"input--empty\" errortext=\"\" label=\"\" part=\"input\" size=\"medium\" value=\"\">\n        <span class=\"prefix\" part=\"icon\" slot=\"prefix\">\n          <six-icon size=\"medium\">\n            watch_later\n          </six-icon>\n        </span>\n      </six-input>\n    </div>\n  </mock:shadow-root>\n</six-timepicker>\n   `);\n\n    // when changing size\n    if (page.root != null) {\n      page.root.size = 'large';\n    }\n    await page.waitForChanges();\n\n    // then expect medium sized timepicker\n    expect(page.root).toEqualHtml(`\n<six-timepicker size=\"small\">\n  <mock:shadow-root>\n    <div class=\"timepicker__container\" part=\"container\">\n      <six-input class=\"input--empty\" errortext=\"\" label=\"\" part=\"input\" size=\"large\" value=\"\">\n        <span class=\"prefix\" part=\"icon\" slot=\"prefix\">\n          <six-icon size=\"medium\">\n            watch_later\n          </six-icon>\n        </span>\n      </six-input>\n    </div>\n  </mock:shadow-root>\n</six-timepicker>\n   `);\n  });\n\n  it('should render open timepicker with icon on the right', async () => {\n    // given\n    const config = {\n      components: [SixTimepicker],\n      html: `<six-timepicker open value=\"13:20:59\" icon-position=\"right\" clearable></six-timepicker>`,\n    };\n\n    // when\n    const page = await newSpecPage(config);\n\n    // then\n    expect(page.root).toEqualHtml(`\n<six-timepicker clearable=\"\" icon-position=\"right\" open=\"\" value=\"13:20:59\">\n  <mock:shadow-root>\n    <div class=\"timepicker__container\" part=\"container\">\n      <six-input errortext=\"\" label=\"\" part=\"input\" size=\"medium\" value=\"13:20:59\">\n        <span class=\"prefix prefix--right\" part=\"icon\" slot=\"prefix\">\n          <six-icon size=\"medium\">\n            watch_later\n          </six-icon>\n        </span>\n        <button class=\"timepicker_clear timepicker_clear--left\" slot=\"suffix\" tabindex=\"-1\" type=\"button\">\n          <six-icon size=\"small\">\n            clear\n          </six-icon>\n        </button>\n      </six-input>\n      <div class=\"timepicker__popup\" part=\"popup\">\n        <six-item-picker interval=\"35\" max=\"23\" min=\"0\" padded=\"\" timeout=\"300\" type=\"number\" value=\"13\"></six-item-picker>\n        <div class=\"timepicker__separator\">\n          <span>\n            :\n          </span>\n        </div>\n        <six-item-picker interval=\"35\" max=\"59\" min=\"0\" padded=\"\" timeout=\"300\" type=\"number\" value=\"20\"></six-item-picker>\n        <div class=\"timepicker__separator\">\n          <span>\n            :\n          </span>\n        </div>\n        <six-item-picker interval=\"35\" max=\"59\" min=\"0\" padded=\"\" timeout=\"300\" type=\"number\" value=\"59\"></six-item-picker>\n      </div>\n    </div>\n  </mock:shadow-root>\n</six-timepicker>\n   `);\n  });\n});\n"]}

package/dist/collection/components/six-tooltip/six-tooltip.css

@@ -3,7 +3,7 @@
   box-sizing: border-box;
 }
 :host *, :host *:before, :host *:after {
-  box-sizing: inherit;
+  box-sizing: border-box;
 }
 
 /**
@@ -27,7 +27,7 @@
 }
 
 .tooltip-positioner {
-  position: absolute;
+  position: fixed;
   z-index: var(--six-z-index-tooltip);
   pointer-events: none;
 }