@scania/tegel 0.0.1-beta.7 → 0.0.1-beta.9

package/dist/components/sdds-dropdown-filter.js

@@ -1,138 +0,0 @@
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-import { d as defineCustomElement$3 } from './dropdown.js';
-import { d as defineCustomElement$2 } from './dropdown-option.js';
-
-const dropdownCss = ":root{--sdds-headline-01:normal normal bold 40px/40px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-headline-01-ls:0;--sdds-headline-02:normal normal bold 32px/32px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-headline-02-ls:-0.04em;--sdds-headline-03:normal normal bold 24px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-headline-03-ls:-0.03em;--sdds-headline-04:normal normal bold 20px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-headline-04-ls:-0.02em;--sdds-headline-05:normal normal bold 14px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-headline-05-ls:-0.02em;--sdds-headline-06:normal normal bold 14px/16px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-headline-06-ls:-0.02em;--sdds-headline-07:normal normal bold 14px/16px \"Scania Sans Semi Condensed\", arial, helvetica,\n    sans-serif;--sdds-headline-07-ls:-0.01em;--sdds-paragraph-01:normal normal normal 24px/32px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-paragraph-01-ls:-0.03em;--sdds-paragraph-02:normal normal normal 20px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-paragraph-02-ls:-0.01em;--sdds-body-01:normal normal normal 16px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-body-01-ls:-0.02em;--sdds-body-02:normal normal normal 14px/20px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-body-02-ls:-0.02em;--sdds-detail-01:normal normal normal 16px/24px \"Scania Sans Semi Condensed\",\n    \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-01-ls:-0.01em;--sdds-detail-02:normal normal normal 14px/16px \"Scania Sans Semi Condensed\",\n    \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-02-ls:-0.01em;--sdds-detail-03:normal normal normal 14px/20px \"Scania Sans Semi Condensed\",\n    \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-03-ls:-0.01em;--sdds-detail-04:normal normal bold 12px/16px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-detail-04-ls:0.08em;--sdds-detail-04-tt:uppercase;--sdds-detail-05:normal normal normal 12px/16px \"Scania Sans Semi Condensed\",\n    \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-05-ls:0;--sdds-detail-06:normal normal bold 10px/16px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-detail-06-ls:0.08em;--sdds-detail-06-tt:uppercase;--sdds-detail-07:normal normal normal 10px/8px \"Scania Sans Semi Condensed\",\n    \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-07-ls:0;--sdds-expressive-headline-01:normal normal bold 80px/80px \"Scania Sans Headline\", arial,\n    helvetica, sans-serif;--sdds-expressive-headline-01-ls:0;--sdds-expressive-headline-02:normal normal bold 56px/56px \"Scania Sans Headline\", arial,\n    helvetica, sans-serif;--sdds-expressive-headline-02-ls:0;--sdds-headline-ex-01:normal normal bold 40px/40px \"Scania Sans Headline\", arial, helvetica,\n    sans-serif;--sdds-headline-ex-01-ls:0;--sdds-headline-ex-02:normal normal bold 32px/32px \"Scania Sans Headline\", arial, helvetica,\n    sans-serif;--sdds-headline-ex-02-ls:-0.04em;--sdds-headline-ex-03:normal normal bold 24px/24px \"Scania Sans Headline\", arial, helvetica,\n    sans-serif;--sdds-headline-ex-03-ls:-0.03em;--sdds-headline-ex-04:normal normal bold 20px/24px \"Scania Sans Headline\", arial, helvetica,\n    sans-serif;--sdds-headline-ex-04-ls:-0.01em;--sdds-headline-ex-05:normal normal bold 16px/24px \"Scania Sans Headline\", arial, helvetica,\n    sans-serif;--sdds-headline-ex-05-ls:-0.02em;--sdds-headline-ex-06:normal normal bold 14px/16px \"Scania Sans Headline\", arial, helvetica,\n    sans-serif;--sdds-headline-ex-06-ls:-0.02em;--sdds-headline-ex-07:normal normal bold 14px/16px \"Scania Sans Semi Condensed\", arial, helvetica,\n    sans-serif;--sdds-headline-ex-07-ls:-0.01em;--sdds-paragraph-ex-01:normal normal normal 24px/32px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-paragraph-ex-01-ls:-0.03em;--sdds-paragraph-ex-02:normal normal normal 20px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-paragraph-ex-02-ls:-0.01em;--sdds-body-ex-01:normal normal normal 16px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-body-ex-01-ls:-0.02em;--sdds-body-ex-02:normal normal normal 14px/20px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-body-ex-02-ls:-0.01em;--sdds-detail-ex-01:normal normal normal 16px/24px \"Scania Sans Semi Condensed\",\n    \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-ex-01-ls:-0.01em;--sdds-detail-ex-02:normal normal normal 14px/16px \"Scania Sans Semi Condensed\",\n    \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-ex-02-ls:-0.01em;--sdds-detail-ex-03:normal normal normal 14px/20px \"Scania Sans Semi Condensed\",\n    \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-ex-03-ls:-0.01em;--sdds-detail-ex-04:normal normal bold 12px/16px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-detail-ex-04-ls:0.08em;--sdds-detail-ex-04-tt:uppercase;--sdds-detail-ex-05:normal normal normal 12px/16px \"Scania Sans Semi Condensed\",\n    \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-ex-05-ls:0;--sdds-detail-ex-06:normal normal bold 10px/16px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-detail-ex-06-ls:0.08em;--sdds-detail-ex-06-tt:uppercase;--sdds-detail-ex-07:normal normal normal 10px/8px \"Scania Sans Semi Condensed\",\n    \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-ex-07-ls:0}:root,:host,::slotted(*),.sdds-theme-light{--sdds-link:var(--sdds-grey-958);--sdds-link-text-decoration:none;--sdds-dropdown-bg:var(--sdds-white);--sdds-dropdown-bg-hover:var(--sdds-grey-50)}:root .sdds-on-white-bg,:host .sdds-on-white-bg,::slotted(*) .sdds-on-white-bg,.sdds-theme-light .sdds-on-white-bg{--sdds-dropdown-bg:var(--sdds-grey-50);--sdds-dropdown-bg-hover:var(--sdds-grey-100)}.sdds-dropdown-helper{font:var(--sdds-detail-ex-05);letter-spacing:var(--sdds-detail-ex-05-ls);color:var(--sdds-grey-700);margin-top:var(--sdds-spacing-element-4);display:flex}.sdds-dropdown-helper .sdds-dropdown-error-icon{width:16px;height:16px;padding-right:9px;display:none}.sdds-dropdown-label-inside{font:var(--sdds-detail-ex-07);letter-spacing:var(--sdds-detail-ex-07-ls);color:var(--sdds-grey-700)}.sdds-dropdown-label-outside{font:var(--sdds-detail-ex-05);letter-spacing:var(--sdds-detail-ex-05-ls);display:block;color:var(--sdds-grey-958);margin-bottom:var(--sdds-spacing-element-8)}:root{--sdds-headline-01:normal normal bold 40px/40px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-headline-01-ls:0;--sdds-headline-02:normal normal bold 32px/32px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-headline-02-ls:-0.04em;--sdds-headline-03:normal normal bold 24px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-headline-03-ls:-0.03em;--sdds-headline-04:normal normal bold 20px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-headline-04-ls:-0.02em;--sdds-headline-05:normal normal bold 14px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-headline-05-ls:-0.02em;--sdds-headline-06:normal normal bold 14px/16px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-headline-06-ls:-0.02em;--sdds-headline-07:normal normal bold 14px/16px \"Scania Sans Semi Condensed\", arial, helvetica,\n    sans-serif;--sdds-headline-07-ls:-0.01em;--sdds-paragraph-01:normal normal normal 24px/32px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-paragraph-01-ls:-0.03em;--sdds-paragraph-02:normal normal normal 20px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-paragraph-02-ls:-0.01em;--sdds-body-01:normal normal normal 16px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-body-01-ls:-0.02em;--sdds-body-02:normal normal normal 14px/20px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-body-02-ls:-0.02em;--sdds-detail-01:normal normal normal 16px/24px \"Scania Sans Semi Condensed\",\n    \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-01-ls:-0.01em;--sdds-detail-02:normal normal normal 14px/16px \"Scania Sans Semi Condensed\",\n    \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-02-ls:-0.01em;--sdds-detail-03:normal normal normal 14px/20px \"Scania Sans Semi Condensed\",\n    \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-03-ls:-0.01em;--sdds-detail-04:normal normal bold 12px/16px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-detail-04-ls:0.08em;--sdds-detail-04-tt:uppercase;--sdds-detail-05:normal normal normal 12px/16px \"Scania Sans Semi Condensed\",\n    \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-05-ls:0;--sdds-detail-06:normal normal bold 10px/16px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-detail-06-ls:0.08em;--sdds-detail-06-tt:uppercase;--sdds-detail-07:normal normal normal 10px/8px \"Scania Sans Semi Condensed\",\n    \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-07-ls:0;--sdds-expressive-headline-01:normal normal bold 80px/80px \"Scania Sans Headline\", arial,\n    helvetica, sans-serif;--sdds-expressive-headline-01-ls:0;--sdds-expressive-headline-02:normal normal bold 56px/56px \"Scania Sans Headline\", arial,\n    helvetica, sans-serif;--sdds-expressive-headline-02-ls:0;--sdds-headline-ex-01:normal normal bold 40px/40px \"Scania Sans Headline\", arial, helvetica,\n    sans-serif;--sdds-headline-ex-01-ls:0;--sdds-headline-ex-02:normal normal bold 32px/32px \"Scania Sans Headline\", arial, helvetica,\n    sans-serif;--sdds-headline-ex-02-ls:-0.04em;--sdds-headline-ex-03:normal normal bold 24px/24px \"Scania Sans Headline\", arial, helvetica,\n    sans-serif;--sdds-headline-ex-03-ls:-0.03em;--sdds-headline-ex-04:normal normal bold 20px/24px \"Scania Sans Headline\", arial, helvetica,\n    sans-serif;--sdds-headline-ex-04-ls:-0.01em;--sdds-headline-ex-05:normal normal bold 16px/24px \"Scania Sans Headline\", arial, helvetica,\n    sans-serif;--sdds-headline-ex-05-ls:-0.02em;--sdds-headline-ex-06:normal normal bold 14px/16px \"Scania Sans Headline\", arial, helvetica,\n    sans-serif;--sdds-headline-ex-06-ls:-0.02em;--sdds-headline-ex-07:normal normal bold 14px/16px \"Scania Sans Semi Condensed\", arial, helvetica,\n    sans-serif;--sdds-headline-ex-07-ls:-0.01em;--sdds-paragraph-ex-01:normal normal normal 24px/32px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-paragraph-ex-01-ls:-0.03em;--sdds-paragraph-ex-02:normal normal normal 20px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-paragraph-ex-02-ls:-0.01em;--sdds-body-ex-01:normal normal normal 16px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-body-ex-01-ls:-0.02em;--sdds-body-ex-02:normal normal normal 14px/20px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-body-ex-02-ls:-0.01em;--sdds-detail-ex-01:normal normal normal 16px/24px \"Scania Sans Semi Condensed\",\n    \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-ex-01-ls:-0.01em;--sdds-detail-ex-02:normal normal normal 14px/16px \"Scania Sans Semi Condensed\",\n    \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-ex-02-ls:-0.01em;--sdds-detail-ex-03:normal normal normal 14px/20px \"Scania Sans Semi Condensed\",\n    \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-ex-03-ls:-0.01em;--sdds-detail-ex-04:normal normal bold 12px/16px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-detail-ex-04-ls:0.08em;--sdds-detail-ex-04-tt:uppercase;--sdds-detail-ex-05:normal normal normal 12px/16px \"Scania Sans Semi Condensed\",\n    \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-ex-05-ls:0;--sdds-detail-ex-06:normal normal bold 10px/16px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-detail-ex-06-ls:0.08em;--sdds-detail-ex-06-tt:uppercase;--sdds-detail-ex-07:normal normal normal 10px/8px \"Scania Sans Semi Condensed\",\n    \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-ex-07-ls:0}:root,:host,::slotted(*),.sdds-theme-light{--sdds-link:var(--sdds-grey-958);--sdds-link-text-decoration:none;--sdds-dropdown-bg:var(--sdds-white);--sdds-dropdown-bg-hover:var(--sdds-grey-50)}:root .sdds-on-white-bg,:host .sdds-on-white-bg,::slotted(*) .sdds-on-white-bg,.sdds-theme-light .sdds-on-white-bg{--sdds-dropdown-bg:var(--sdds-grey-50);--sdds-dropdown-bg-hover:var(--sdds-grey-100)}:root{--sdds-headline-01:normal normal bold 40px/40px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-headline-01-ls:0;--sdds-headline-02:normal normal bold 32px/32px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-headline-02-ls:-0.04em;--sdds-headline-03:normal normal bold 24px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-headline-03-ls:-0.03em;--sdds-headline-04:normal normal bold 20px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-headline-04-ls:-0.02em;--sdds-headline-05:normal normal bold 14px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-headline-05-ls:-0.02em;--sdds-headline-06:normal normal bold 14px/16px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-headline-06-ls:-0.02em;--sdds-headline-07:normal normal bold 14px/16px \"Scania Sans Semi Condensed\", arial, helvetica,\n    sans-serif;--sdds-headline-07-ls:-0.01em;--sdds-paragraph-01:normal normal normal 24px/32px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-paragraph-01-ls:-0.03em;--sdds-paragraph-02:normal normal normal 20px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-paragraph-02-ls:-0.01em;--sdds-body-01:normal normal normal 16px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-body-01-ls:-0.02em;--sdds-body-02:normal normal normal 14px/20px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-body-02-ls:-0.02em;--sdds-detail-01:normal normal normal 16px/24px \"Scania Sans Semi Condensed\",\n    \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-01-ls:-0.01em;--sdds-detail-02:normal normal normal 14px/16px \"Scania Sans Semi Condensed\",\n    \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-02-ls:-0.01em;--sdds-detail-03:normal normal normal 14px/20px \"Scania Sans Semi Condensed\",\n    \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-03-ls:-0.01em;--sdds-detail-04:normal normal bold 12px/16px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-detail-04-ls:0.08em;--sdds-detail-04-tt:uppercase;--sdds-detail-05:normal normal normal 12px/16px \"Scania Sans Semi Condensed\",\n    \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-05-ls:0;--sdds-detail-06:normal normal bold 10px/16px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-detail-06-ls:0.08em;--sdds-detail-06-tt:uppercase;--sdds-detail-07:normal normal normal 10px/8px \"Scania Sans Semi Condensed\",\n    \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-07-ls:0;--sdds-expressive-headline-01:normal normal bold 80px/80px \"Scania Sans Headline\", arial,\n    helvetica, sans-serif;--sdds-expressive-headline-01-ls:0;--sdds-expressive-headline-02:normal normal bold 56px/56px \"Scania Sans Headline\", arial,\n    helvetica, sans-serif;--sdds-expressive-headline-02-ls:0;--sdds-headline-ex-01:normal normal bold 40px/40px \"Scania Sans Headline\", arial, helvetica,\n    sans-serif;--sdds-headline-ex-01-ls:0;--sdds-headline-ex-02:normal normal bold 32px/32px \"Scania Sans Headline\", arial, helvetica,\n    sans-serif;--sdds-headline-ex-02-ls:-0.04em;--sdds-headline-ex-03:normal normal bold 24px/24px \"Scania Sans Headline\", arial, helvetica,\n    sans-serif;--sdds-headline-ex-03-ls:-0.03em;--sdds-headline-ex-04:normal normal bold 20px/24px \"Scania Sans Headline\", arial, helvetica,\n    sans-serif;--sdds-headline-ex-04-ls:-0.01em;--sdds-headline-ex-05:normal normal bold 16px/24px \"Scania Sans Headline\", arial, helvetica,\n    sans-serif;--sdds-headline-ex-05-ls:-0.02em;--sdds-headline-ex-06:normal normal bold 14px/16px \"Scania Sans Headline\", arial, helvetica,\n    sans-serif;--sdds-headline-ex-06-ls:-0.02em;--sdds-headline-ex-07:normal normal bold 14px/16px \"Scania Sans Semi Condensed\", arial, helvetica,\n    sans-serif;--sdds-headline-ex-07-ls:-0.01em;--sdds-paragraph-ex-01:normal normal normal 24px/32px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-paragraph-ex-01-ls:-0.03em;--sdds-paragraph-ex-02:normal normal normal 20px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-paragraph-ex-02-ls:-0.01em;--sdds-body-ex-01:normal normal normal 16px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-body-ex-01-ls:-0.02em;--sdds-body-ex-02:normal normal normal 14px/20px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-body-ex-02-ls:-0.01em;--sdds-detail-ex-01:normal normal normal 16px/24px \"Scania Sans Semi Condensed\",\n    \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-ex-01-ls:-0.01em;--sdds-detail-ex-02:normal normal normal 14px/16px \"Scania Sans Semi Condensed\",\n    \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-ex-02-ls:-0.01em;--sdds-detail-ex-03:normal normal normal 14px/20px \"Scania Sans Semi Condensed\",\n    \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-ex-03-ls:-0.01em;--sdds-detail-ex-04:normal normal bold 12px/16px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-detail-ex-04-ls:0.08em;--sdds-detail-ex-04-tt:uppercase;--sdds-detail-ex-05:normal normal normal 12px/16px \"Scania Sans Semi Condensed\",\n    \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-ex-05-ls:0;--sdds-detail-ex-06:normal normal bold 10px/16px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-detail-ex-06-ls:0.08em;--sdds-detail-ex-06-tt:uppercase;--sdds-detail-ex-07:normal normal normal 10px/8px \"Scania Sans Semi Condensed\",\n    \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-ex-07-ls:0}:root,.sdds-theme-light{--sdds-checkbox-color:var(--sdds-grey-900);--sdds-checkbox-interaction-01:var(--sdds-blue-800);--sdds-checkbox-interaction-02:var(--sdds-white);--sdds-checkbox-bg-hover:var(--sdds-blue-800);--sdds-checkbox-bg-focus:var(--sdds-blue-800);--sdds-checkbox-disabled:var(--sdds-grey-400);--sdds-checkbox-bg-img:url(\"data:image/svg+xml;utf8,<svg width='8' height='6' viewBox='0 0 8 6' fill='none' xmlns='http://www.w3.org/2000/svg'> <path d='M1 2.33333L3.4 5C4.80589 3.4379 5.59411 2.5621 7 1' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round'/></svg>\");--sdds-checkbox-bg-img-disabled:url(\"data:image/svg+xml;utf8,<svg width='8' height='6' viewBox='0 0 8 6' fill='none' xmlns='http://www.w3.org/2000/svg'> <path d='M1 2.33333L3.4 5C4.80589 3.4379 5.59411 2.5621 7 1' stroke='%23b0b7c4' stroke-linecap='round' stroke-linejoin='round'/></svg>\");--sdds-checkbox-border-color-disabled-after:var(--sdds-grey-500);--sdds-checkbox-color-disabled-after:var(--sdds-grey-500)}:root .sdds-theme-dark,.sdds-theme-light .sdds-theme-dark{--sdds-checkbox-color:var(--sdds-white);--sdds-checkbox-interaction-01:var(--sdds-white);--sdds-checkbox-interaction-02:var(--sdds-grey-958);--sdds-checkbox-bg-hover:white;--sdds-checkbox-bg-focus:white;--sdds-checkbox-disabled:white;--sdds-checkbox-bg-img:url(\"data:image/svg+xml;utf8,<svg width='8' height='6' viewBox='0 0 8 6' fill='none' xmlns='http://www.w3.org/2000/svg'> <path d='M1 2.33333L3.4 5C4.80589 3.4379 5.59411 2.5621 7 1' stroke='%230D0F13' stroke-linecap='round' stroke-linejoin='round'/></svg>\");--sdds-checkbox-bg-img-disabled:url(\"data:image/svg+xml;utf8,<svg width='8' height='6' viewBox='0 0 8 6' fill='none' xmlns='http://www.w3.org/2000/svg'> <path d='M1 2.33333L3.4 5C4.80589 3.4379 5.59411 2.5621 7 1' stroke='%2356657A' stroke-linecap='round' stroke-linejoin='round'/></svg>\");--sdds-checkbox-border-color-disabled-after:var(--sdds-grey-700);--sdds-checkbox-color-disabled-after:var(--sdds-grey-700)}.sdds-checkbox-item{box-sizing:border-box;font:var(--sdds-detail-02);letter-spacing:var(--sdds-detail-02-ls);color:var(--sdds-checkbox-text);display:flex;align-items:center;margin-left:-4px}.sdds-checkbox-item *{box-sizing:border-box}.sdds-checkbox-item .sdds-form-input[type=checkbox]{appearance:none;outline:none;margin:0;border:0;border-radius:2px;width:24px;height:24px;position:relative;cursor:pointer}.sdds-checkbox-item .sdds-form-input[type=checkbox]+label{color:var(--sdds-checkbox-color);padding-left:var(--sdds-spacing-element-8);padding-top:var(--sdds-spacing-element-4);padding-bottom:var(--sdds-spacing-element-4);cursor:pointer}.sdds-checkbox-item .sdds-form-input[type=checkbox]::before,.sdds-checkbox-item .sdds-form-input[type=checkbox]::after{content:\"\";position:absolute;box-sizing:border-box;border-radius:2px}.sdds-checkbox-item .sdds-form-input[type=checkbox]::before{width:24px;height:24px;left:0;top:0}.sdds-checkbox-item .sdds-form-input[type=checkbox]::after{border:1px solid var(--sdds-checkbox-interaction-01);background-color:var(--sdds-checkbox-interaction-02);width:16px;height:16px;left:4px;top:4px}.sdds-checkbox-item .sdds-form-input[type=checkbox]:hover::before{background-color:var(--sdds-checkbox-bg-hover);opacity:0.12}.sdds-checkbox-item .sdds-form-input[type=checkbox]:focus::before{background-color:var(--sdds-checkbox-bg-focus);opacity:0.24;animation:cb-focus 0.4s cubic-bezier(0.65, 0.05, 0.38, 0.95) forwards}.sdds-checkbox-item .sdds-form-input[type=checkbox]:disabled,.sdds-checkbox-item .sdds-form-input[type=checkbox].disabled{cursor:not-allowed}.sdds-checkbox-item .sdds-form-input[type=checkbox]:disabled::after,.sdds-checkbox-item .sdds-form-input[type=checkbox].disabled::after{border-color:var(--sdds-checkbox-border-color-disabled-after)}.sdds-checkbox-item .sdds-form-input[type=checkbox]:disabled+label,.sdds-checkbox-item .sdds-form-input[type=checkbox].disabled+label{color:var(--sdds-grey-600);cursor:not-allowed}.sdds-checkbox-item .sdds-form-input[type=checkbox]:disabled:hover::before,.sdds-checkbox-item .sdds-form-input[type=checkbox].disabled:hover::before{display:none}.sdds-form-input[type=checkbox]:checked::after{background-image:var(--sdds-checkbox-bg-img);background-color:var(--sdds-checkbox-interaction-01);background-repeat:no-repeat;background-position:center}.sdds-form-input[type=checkbox]:checked:disabled:hover::before,.sdds-form-input[type=checkbox]:checked:disabled::before,.sdds-form-input[type=checkbox]:checked.disabled:hover::before,.sdds-form-input[type=checkbox]:checked.disabled::before{display:block;width:16px;height:16px;left:4px;top:4px;border:1px solid #b0b7c4}.sdds-form-input[type=checkbox]:checked:disabled::after,.sdds-form-input[type=checkbox]:checked.disabled::after{background-image:var(--sdds-checkbox-bg-img-disabled);background-color:var(--sdds-checkbox-interaction-02);color:var(--sdds-checkbox-color-disabled-after)}@keyframes cb-focus{0%{transform:scale(0);opacity:0}50%{transform:scale(1);opacity:1}100%{transform:scale(1);opacity:0}}:host,::slotted(*){color:var(--sdds-grey-958);box-sizing:border-box;box-sizing:border-box}:host *,::slotted(*) *{box-sizing:border-box}:host,::slotted(*){--sdds-link:var(--sdds-grey-958);--sdds-link-text-decoration:none;font:var(--sdds-detail-02);letter-spacing:var(--sdds-detail-02-ls);color:var(--sdds-grey-958);box-sizing:border-box}:host{position:relative;z-index:auto}:host::part(dropdown-filter-disabled){cursor:not-allowed;caret-color:transparent;pointer-events:none;color:var(--sdds-grey-400);border:none}:host::part(dropdown-filter-disabled)::placeholder{color:var(--sdds-grey-400)}.sdds-dropdown{position:relative;display:flex;flex-flow:column wrap;width:100%;border:0}.sdds-dropdown,.sdds-dropdown *{box-sizing:border-box}.sdds-dropdown .sdds-dropdown-toggle{font:var(--sdds-detail-ex-02);letter-spacing:var(--sdds-detail-ex-02-ls);color:var(--sdds-grey-958);display:flex;align-items:center;background-color:var(--sdds-dropdown-bg);cursor:pointer;transition:box-shadow 0.1s ease-in, border-bottom-color 150ms ease;border-radius:4px 4px 0 0;border:none;border-bottom:1px solid var(--sdds-grey-400);box-shadow:none;width:100%;text-align:left;outline:none;padding:20px 16px;display:flex;align-items:center}.sdds-dropdown .sdds-dropdown-toggle:hover{border-bottom-color:var(--sdds-grey-600)}.sdds-dropdown .sdds-dropdown-toggle:focus::before{content:\" \";position:absolute;z-index:2;bottom:0;left:0;width:100%;border-bottom:2px solid var(--sdds-blue-400)}.sdds-dropdown .sdds-dropdown-toggle:active,.sdds-dropdown .sdds-dropdown-toggle.active .sdds-dropdown .sdds-dropdown-toggle.selected{border-bottom-color:var(--sdds-grey-800)}.sdds-dropdown .sdds-dropdown-toggle.is-filter{transition:border 0.1s ease-in 0.1s;cursor:text}.sdds-dropdown .sdds-dropdown-toggle-lg{padding:20px 16px}.sdds-dropdown .sdds-dropdown-toggle-md{padding:16px}.sdds-dropdown .sdds-dropdown-toggle-sm{padding:12px 16px}.sdds-dropdown .sdds-dropdown-toggle.sdds-dropdown-toggle-label-inside-lg{padding:20px 16px 16px}.sdds-dropdown .sdds-dropdown-toggle.sdds-dropdown-toggle-label-inside-md{padding:16px 16px 12px}.sdds-dropdown .sdds-dropdown-toggle--selected:not(:focus){border-bottom:1px solid var(--sdds-grey-800)}.sdds-dropdown .sdds-dropdown-arrow{width:20px;position:absolute;right:16px;color:inherit;transform:rotate(0);transition:transform ease 250ms}.sdds-dropdown .sdds-dropdown-placeholder{color:var(--sdds-grey-700)}.sdds-dropdown .sdds-dropdown-label{display:grid;width:calc(100% - 25px)}.sdds-dropdown .sdds-dropdown-label-container{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sdds-dropdown.sdds-dropdown.sdds-dropdown-sm .sdds-dropdown-label-container--label-inside{padding-bottom:12px}.sdds-dropdown .sdds-dropdown-filter{border:0;outline:none;font:var(--sdds-detail-02);letter-spacing:var(--sdds-detail-02-ls);color:var(--sdds-grey-958);width:100%;background:transparent}.sdds-dropdown .sdds-dropdown-filter:focus{outline:none}.sdds-dropdown .sdds-dropdown-filter::placeholder{color:var(--sdds-grey-700);opacity:1}.sdds-dropdown .sdds-dropdown-menu{z-index:10000;background-color:var(--sdds-white);position:absolute;top:100%;left:0;min-width:100%;max-height:360px;border-color:transparent;border-style:solid;border-width:0 1px;box-shadow:0 2px 3px 0 rgba(0, 0, 0, 0.1);border-left-color:var(--sdds-grey-100);border-right-color:var(--sdds-grey-100);overflow-x:hidden;overflow-y:auto;transform:scaleY(0);transform-origin:top;transition:transform 250ms ease}.sdds-dropdown .sdds-dropdown-menu::-webkit-scrollbar{width:4px;background-color:inherit}.sdds-dropdown .sdds-dropdown-menu::-webkit-scrollbar-thumb{background-color:var(--sdds-grey-300)}.sdds-dropdown .sdds-dropdown-menu ::-webkit-scrollbar-button{height:0;width:0}.sdds-dropdown.sdds-dropdown-lg .sdds-dropdown-toggle{height:56px}.sdds-dropdown.sdds-dropdown-md .sdds-dropdown-toggle{height:48px}.sdds-dropdown.sdds-dropdown-sm .sdds-dropdown-toggle{height:40px}:host(.sdds-dropdown--open-upwards) .sdds-dropdown .sdds-dropdown-menu{top:auto;bottom:100%;box-shadow:0 -1px 3px 0 rgba(0, 0, 0, 0.1);transform-origin:bottom}:host(.sdds-dropdown--open-upwards[label-position=outside]) span.sdds-dropdown-menu{bottom:calc(100% - 24px)}:host([disabled=true]){cursor:not-allowed}:host([disabled=true]) .sdds-dropdown .sdds-dropdown-toggle{pointer-events:none;color:var(--sdds-grey-400);border:none;padding:0 16px}:host([disabled=true]) .sdds-dropdown .sdds-dropdown-toggle .sdds-dropdown-placeholder{color:var(--sdds-grey-400)}:host([disabled=true]) .sdds-dropdown .sdds-dropdown-toggle .sdds-dropdown-label-inside{color:var(--sdds-grey-400)}:host([disabled=true]) .sdds-dropdown .sdds-dropdown-toggle:focus::before{content:none}:host(.sdds-dropdown--error) .sdds-dropdown .sdds-dropdown-toggle{border-color:var(--sdds-negative)}:host(.sdds-dropdown--error) .sdds-dropdown .sdds-dropdown-toggle:focus::before{border-color:var(--sdds-negative)}:host(.sdds-dropdown--error) .sdds-dropdown-helper{color:var(--sdds-negative)}:host(.sdds-dropdown--error) .sdds-dropdown-helper .sdds-dropdown-error-icon{display:flex}:host ::slotted(sdds-dropdown-option){display:flex;padding:var(--sdds-spacing-element-16);background-color:var(--sdds-white);border-top:1px solid transparent;border-bottom:1px solid var(--sdds-grey-100);opacity:0;visibility:hidden;cursor:pointer;box-sizing:border-box}:host ::slotted(sdds-dropdown-option:last-child){border-bottom-color:transparent;border-bottom-left-radius:4px;border-bottom-right-radius:4px}:host ::slotted(sdds-dropdown-option:hover),:host ::slotted(sdds-dropdown-option:focus){background-color:var(--sdds-dropdown-bg-hover)}:host ::slotted(sdds-dropdown-option:hover:not(:focus):not(sdds-dropdown-option.selected)){background-color:var(--sdds-dropdown-bg-hover)}:host ::slotted(sdds-dropdown-option:hover:focus){outline:none}:host ::slotted(sdds-dropdown-option:focus){outline:2px solid var(--sdds-blue-400);outline-offset:-2px}:host ::slotted(sdds-dropdown-option.sdds-dropdown--selected),:host ::slotted(sdds-dropdown-option.selected),:host ::slotted(sdds-dropdown-option.active),:host ::slotted(sdds-dropdown-option:active){background-color:var(--sdds-grey-300);border-top:1px solid var(--sdds-grey-300);border-bottom:1px solid var(--sdds-grey-300)}:host ::slotted(sdds-dropdown-option.sdds-option--no-result){cursor:not-allowed;pointer-events:none}:host ::slotted(sdds-dropdown-option.sdds-dropdown-option-disabled),:host ::slotted(sdds-dropdown-option.selected.sdds-dropdown-option-disabled){cursor:not-allowed;color:var(--sdds-grey-400);background-color:var(--sdds-white)}:host(.sdds-dropdown--open-upwards) ::slotted(sdds-dropdown-option:first-child){border-radius:4px 4px 0 0}:host(.sdds-dropdown--open-upwards) ::slotted(sdds-dropdown-option:last-child){border-radius:0;border-bottom:1px solid var(--sdds-grey-300)}.sdds-option-label{margin:auto 0;display:flex;align-content:center;text-decoration:none;flex-grow:2}.sdds-option-checkmark{color:inherit;opacity:0;transition:opacity 0.1s cubic-bezier(0.075, 0.82, 0.165, 1);margin-left:var(--sdds-spacing-element-16)}:host([size=sm]) ::slotted(sdds-dropdown-option){padding:var(--sdds-spacing-element-12) var(--sdds-spacing-element-16)}:host(.sdds-dropdown--open) .sdds-dropdown .sdds-dropdown-toggle{box-shadow:0 -1px 3px -1px rgba(0, 0, 0, 0.1);border-bottom-left-radius:0;border-bottom-right-radius:0}:host(.sdds-dropdown--open) .sdds-dropdown .sdds-dropdown-toggle.is-filter::before{content:\" \";position:absolute;z-index:2;bottom:0;left:0;width:100%;border-bottom:1px solid var(--sdds-blue-400)}:host(.sdds-dropdown--open) .sdds-dropdown .sdds-dropdown-arrow{transform:rotate(180deg)}:host(.sdds-dropdown--open) .sdds-dropdown .sdds-dropdown-menu{transform:scaleY(1)}:host(.sdds-dropdown--open) ::slotted(sdds-dropdown-option){visibility:visible;opacity:1}:host(.selected) .sdds-option-checkmark{opacity:1}.sdds-dropdown-label-inside{font:var(--sdds-detail-02);letter-spacing:var(--sdds-detail-02-ls);color:var(--sdds-grey-700);position:absolute;transition:transform 250ms ease, color 200ms ease;width:calc(100% - 63px);overflow:hidden;text-overflow:ellipsis;transform:translate(0, -10px);font-size:10px}.sdds-dropdown-label-container.sdds-dropdown-label-container--label-inside .sdds-dropdown-placeholder{display:block;padding-top:4px}.sdds-dropdown-lg .sdds-dropdown-label-inside{display:block;top:16px}.sdds-dropdown-md .sdds-dropdown-label-inside{display:block;top:12px}.sdds-dropdown.sdds-dropdown-sm .sdds-dropdown-label-inside{display:none}.sdds-dropdown-multiselect-result{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sdds-option-checkbox{margin-right:8px}.sdds-form-label{display:flex}";
-
-const DropdownFilter = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
-    this.__attachShadow();
-    this.dataOptions = [];
-    this.filteredContent = [];
-    this.searchTerm = '';
-    this.selectedOptionState = undefined;
-    this.dropdownRef = undefined;
-    this.placeholder = '';
-    this.label = undefined;
-    this.defaultOption = undefined;
-    this.selectedOption = undefined;
-    this.disabled = undefined;
-    this.size = 'lg';
-    this.inline = false;
-    this.labelPosition = 'no-label';
-    this.state = 'default';
-    this.helper = '';
-    this.data = undefined;
-    this.selectedLabel = 'no-selected';
-    this.selectedValue = 'no-selected';
-  }
-  componentWillLoad() {
-    this.parseData(this.data);
-    if (this.defaultOption) {
-      this.selectedOptionState = this.defaultOption;
-    }
-  }
-  parseData(newValue) {
-    if (newValue)
-      this.dataOptions = JSON.parse(newValue);
-    this.filteredContent = this.dataOptions;
-  }
-  updateOptionsContent(event) {
-    this.searchTerm = event.detail;
-    this.findData();
-  }
-  selectOptionHandler(event) {
-    this.selectedOptionState = event.detail.value;
-    this.selectedLabel = event.detail.label;
-    this.selectedValue = event.detail.value;
-    // Reset list when search is done and user have selected one option
-    // To match with animation time for option list to fadeout first
-    setTimeout(() => {
-      this.filteredContent = this.dataOptions;
-    }, 200);
-  }
-  findData() {
-    const searchAsRegEx = new RegExp(this.searchTerm, 'gmi');
-    this.filteredContent = this.dataOptions.filter(option => {
-      if (option.label) {
-        const listItem = option.label.toLowerCase();
-        const searchResultList = listItem.match(searchAsRegEx);
-        if (searchResultList) {
-          return searchResultList;
-        }
-        this.selectedOptionState = null;
-        this.selectedLabel = 'no-result';
-        this.selectedValue = 'no-result';
-      }
-    });
-  }
-  setOptionsContent() {
-    const newList = this.filteredContent.map(obj => (h("sdds-dropdown-option", { tabindex: "0", value: obj.value, class: `${this.selectedOptionState === obj.value ? 'selected' : ''}` }, obj.label)));
-    if (newList.length > 0) {
-      return newList;
-    }
-    return (h("sdds-dropdown-option", { tabindex: "-1", value: "no-result", class: "sdds-option--no-result" }, "No result"));
-  }
-  /** Use this method to reset the dropdown. Then it will go back to its initial state. */
-  async resetOption() {
-    var _a;
-    await ((_a = this.dropdownRef) === null || _a === void 0 ? void 0 : _a.resetOption());
-  }
-  render() {
-    return (h(Host, { "selected-value": this.selectedValue, "selected-text": this.selectedLabel }, h("sdds-dropdown", { ref: el => (this.dropdownRef = el), exportparts: "dropdown-filter-disabled", size: this.size, label: this.label, disabled: this.disabled, labelPosition: this.labelPosition, helper: this.helper, state: this.state, placeholder: this.placeholder, defaultOption: this.defaultOption, selectedOption: this.selectedOption, type: "filter", tabindex: this.disabled ? '-1' : null }, this.setOptionsContent())));
-  }
-  static get watchers() { return {
-    "data": ["parseData"]
-  }; }
-  static get style() { return dropdownCss; }
-}, [1, "sdds-dropdown-filter", {
-    "placeholder": [1],
-    "label": [1],
-    "defaultOption": [1, "default-option"],
-    "selectedOption": [1, "selected-option"],
-    "disabled": [4],
-    "size": [1],
-    "inline": [4],
-    "labelPosition": [1, "label-position"],
-    "state": [1],
-    "helper": [1],
-    "data": [1],
-    "dataOptions": [32],
-    "filteredContent": [32],
-    "searchTerm": [32],
-    "selectedOptionState": [32],
-    "dropdownRef": [32],
-    "selectedLabel": [32],
-    "selectedValue": [32],
-    "resetOption": [64]
-  }, [[0, "inputSearch", "updateOptionsContent"], [0, "selectOption", "selectOptionHandler"]]]);
-function defineCustomElement$1() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["sdds-dropdown-filter", "sdds-dropdown", "sdds-dropdown-option"];
-  components.forEach(tagName => { switch (tagName) {
-    case "sdds-dropdown-filter":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, DropdownFilter);
-      }
-      break;
-    case "sdds-dropdown":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$3();
-      }
-      break;
-    case "sdds-dropdown-option":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$2();
-      }
-      break;
-  } });
-}
-
-const SddsDropdownFilter = DropdownFilter;
-const defineCustomElement = defineCustomElement$1;
-
-export { SddsDropdownFilter, defineCustomElement };

package/dist/components/sdds-dropdown-option.d.ts

@@ -1,11 +0,0 @@
-import type { Components, JSX } from "../types/components";
-
-interface SddsDropdownOption extends Components.SddsDropdownOption, HTMLElement {}
-export const SddsDropdownOption: {
-  prototype: SddsDropdownOption;
-  new (): SddsDropdownOption;
-};
-/**
- * Used to define this component and all nested components recursively.
- */
-export const defineCustomElement: () => void;

package/dist/components/sdds-dropdown-option.js

@@ -1,6 +0,0 @@
-import { D as DropdownOption, d as defineCustomElement$1 } from './dropdown-option.js';
-
-const SddsDropdownOption = DropdownOption;
-const defineCustomElement = defineCustomElement$1;
-
-export { SddsDropdownOption, defineCustomElement };

package/dist/components/sdds-dropdown.d.ts

@@ -1,11 +0,0 @@
-import type { Components, JSX } from "../types/components";
-
-interface SddsDropdown extends Components.SddsDropdown, HTMLElement {}
-export const SddsDropdown: {
-  prototype: SddsDropdown;
-  new (): SddsDropdown;
-};
-/**
- * Used to define this component and all nested components recursively.
- */
-export const defineCustomElement: () => void;

package/dist/components/sdds-dropdown.js

@@ -1,6 +0,0 @@
-import { D as Dropdown, d as defineCustomElement$1 } from './dropdown.js';
-
-const SddsDropdown = Dropdown;
-const defineCustomElement = defineCustomElement$1;
-
-export { SddsDropdown, defineCustomElement };

package/dist/components/sdds-header-cell.d.ts

@@ -1,11 +0,0 @@
-import type { Components, JSX } from "../types/components";
-
-interface SddsHeaderCell extends Components.SddsHeaderCell, HTMLElement {}
-export const SddsHeaderCell: {
-  prototype: SddsHeaderCell;
-  new (): SddsHeaderCell;
-};
-/**
- * Used to define this component and all nested components recursively.
- */
-export const defineCustomElement: () => void;

package/dist/components/sdds-header-cell.js

@@ -1,173 +0,0 @@
-import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-
-const tableHeaderCellCss = ":host(.sdds-table__header-cell){box-sizing:border-box;font:var(--sdds-headline-07);letter-spacing:var(--sdds-headline-07-ls);display:table-cell;text-align:left;color:var(--sdds-grey-958);background-color:var(--sdds-grey-300);border-bottom:1px solid var(--sdds-grey-400);padding:0;height:48px;min-width:192px;box-sizing:border-box;vertical-align:middle;overflow:hidden;transition:background-color 200ms ease}:host(.sdds-table__header-cell) *{box-sizing:border-box}:host(.sdds-table__header-cell) .sdds-table__header-text{padding:0 16px;margin:0}:host(.sdds-table__header-cell--sortable) .sdds-table__header-button{display:flex;align-items:center;gap:8px;justify-content:start;flex-direction:row;width:100%;height:100%;padding:0 16px;background-color:transparent;border:none;cursor:pointer;transition:background-color 200ms ease}:host(.sdds-table__header-cell--sortable) .sdds-table__header-button:focus{outline:2px solid var(--sdds-blue-400);outline-offset:-2px}:host(.sdds-table__header-cell--sortable) .sdds-table__header-button:focus .sdds-table__header-button-icon{opacity:1}:host(.sdds-table__header-cell--sortable) .sdds-table__header-button .sdds-table__header-button-text{font:var(--sdds-headline-07);letter-spacing:var(--sdds-headline-07-ls);text-align:left;color:var(--sdds-grey-958)}:host(.sdds-table__header-cell--sortable) .sdds-table__header-button .sdds-table__header-button-icon{flex:0 0 16px;height:16px;opacity:0;transform-origin:center;transition:opacity 200ms ease-in, transform 200ms ease}:host(.sdds-table__header-cell--sortable) .sdds-table__header-button:hover .sdds-table__header-button-icon{opacity:1}:host(.sdds-table__header-cell--right-align) .sdds-table__header-button{text-align:right;justify-content:end;flex-direction:row-reverse}:host(.sdds-table__header-cell--is-sorted) .sdds-table__header-button{background-color:var(--sdds-grey-500)}:host(.sdds-table__header-cell--is-sorted) .sdds-table__header-button:hover{background-color:var(--sdds-grey-400)}:host(.sdds-table__header-cell--is-sorted) .sdds-table__header-button .sdds-table__header-button-icon{opacity:1}:host(.sdds-table__header-cell--is-sorted) .sdds-table__header-button .sdds-table__header-button-icon--rotate{transform:rotate(180deg)}:host(.sdds-table--compact){height:33px}:host(.sdds-table--divider){border-right:1px solid var(--sdds-grey-400)}:host(.sdds-table--divider:last-of-type){border-right:none}:host(.sdds-table--no-min-width){min-width:unset}:host(.sdds-table__header-cell:first-of-type){border-top-left-radius:4px}:host(.sdds-table__header-cell:last-of-type){border-top-right-radius:4px}:host(.sdds-table--extra-column:first-of-type){border-top-left-radius:0}:host(.sdds-table--toolbar-available){border-radius:0}:host(.sdds-table--extra-column.sdds-table--toolbar-available){border-radius:0}:host(.sdds-table__header-cell.sdds-table--toolbar-available:first-of-type){border-top-left-radius:0}:host(.sdds-table__header-cell.sdds-table--toolbar-available:last-of-type){border-top-right-radius:0}";
-
-const relevantTableProps = [
-  'enableMultiselect',
-  'enableExpandableRows',
-  'compactDesign',
-  'noMinWidth',
-  'verticalDividers',
-  'whiteBackground',
-];
-const TableHeaderCell = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
-    this.__attachShadow();
-    this.sortColumnDataEvent = createEvent(this, "sortColumnDataEvent", 7);
-    this.textAlignEvent = createEvent(this, "textAlignEvent", 7);
-    this.headCellHoverEvent = createEvent(this, "headCellHoverEvent", 7);
-    this.sortButtonClick = (key) => {
-      // Toggling direction of sorting as we only use one button for sorting
-      if (this.sortingDirection !== 'asc') {
-        this.sortingDirection = 'asc';
-      }
-      else {
-        this.sortingDirection = 'desc';
-      }
-      // Setting to true we can set enable CSS class for "active" state of column
-      this.sortedByMyKey = true;
-      // Use array to send both key and sorting direction
-      this.sortColumnDataEvent.emit([this.tableId, key, this.sortingDirection]);
-    };
-    this.headerCellContent = () => {
-      if (this.sortable && !this.disableSortingBtn) {
-        return (h("button", { class: "sdds-table__header-button", onClick: () => this.sortButtonClick(this.columnKey) }, h("span", { class: "sdds-table__header-button-text", style: { textAlign: this.textAlignState } }, this.columnTitle), this.sortingDirection === '' && (h("svg", { class: "sdds-table__header-button-icon", fill: "none", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 12 15" }, h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M8.45 13.67V4.62a.5.5 0 0 1 1 0v9.05h-1Z", fill: "currentColor" }), h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M6.07 10.28a.5.5 0 0 1 .7.08l2.1 2.66a.1.1 0 0 0 .15 0l2.09-2.66a.5.5 0 1 1 .78.62l-2.08 2.66a1.1 1.1 0 0 1-1.73 0l-2.1-2.66a.5.5 0 0 1 .1-.7ZM3.55.4v9.04a.5.5 0 1 1-1 0V.39h1Z", fill: "currentColor" }), h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M5.93 3.78a.5.5 0 0 1-.7-.08l-2.1-2.66a.1.1 0 0 0-.15 0L.89 3.7a.5.5 0 0 1-.78-.62L2.19.42a1.1 1.1 0 0 1 1.73 0l2.1 2.66a.5.5 0 0 1-.1.7Z", fill: "currentColor" }))), this.sortingDirection !== '' && (h("svg", { class: `sdds-table__header-button-icon ${this.sortingDirection === 'desc' ? 'sdds-table__header-button-icon--rotate' : ''}`, fill: "none", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 32 32" }, h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M17 2.974a1 1 0 0 0-2 0v24.3l-9.312-9.312a1 1 0 0 0-1.414 1.414l9.887 9.888a2.6 2.6 0 0 0 3.677 0l9.888-9.888a1 1 0 0 0-1.414-1.414L17 27.274v-24.3Z", fill: "currentColor" })))));
-      }
-      return (h("p", { class: "sdds-table__header-text", style: { textAlign: this.textAlignState } }, this.columnTitle));
-    };
-    this.onHeadCellHover = (key) => {
-      this.headCellHoverEvent.emit([this.tableId, key]);
-    };
-    this.columnKey = undefined;
-    this.columnTitle = undefined;
-    this.customWidth = undefined;
-    this.sortable = false;
-    this.textAlign = undefined;
-    this.textAlignState = undefined;
-    this.sortingDirection = '';
-    this.sortedByMyKey = false;
-    this.disableSortingBtn = false;
-    this.verticalDividers = false;
-    this.compactDesign = false;
-    this.noMinWidth = false;
-    this.whiteBackground = false;
-    this.enableMultiselect = false;
-    this.enableToolbarDesign = false;
-    this.tableId = '';
-    this.enableExpandableRows = false;
-  }
-  tablePropsChangedEventListener(event) {
-    if (this.tableId === event.detail.tableId) {
-      event.detail.changed
-        .filter((changedProp) => relevantTableProps.includes(changedProp))
-        .forEach((changedProp) => {
-        if (typeof this[changedProp] === 'undefined') {
-          throw new Error(`Table prop is not supported: ${changedProp}`);
-        }
-        this[changedProp] = event.detail[changedProp];
-      });
-    }
-  }
-  // Listen to parent data-table if sorting is allowed
-  sortingSwitcherEventListener(event) {
-    const [receivedID, receivedSortingStatus] = event.detail;
-    if (this.tableId === receivedID) {
-      this.disableSortingBtn = receivedSortingStatus;
-    }
-  }
-  // target is set to body so other instances of same component "listen" and react to the change
-  updateOptionsContent(event) {
-    if (this.tableId === event.detail[0]) {
-      // grab only value at position 1 as it is the "key"
-      if (this.columnKey !== event.detail[1]) {
-        this.sortedByMyKey = false;
-        // To sync with CSS transition timing
-        setTimeout(() => {
-          this.sortingDirection = '';
-        }, 200);
-      }
-    }
-  }
-  enableMultiselectEventListener(event) {
-    if (this.tableId === event.detail[0])
-      [, this.enableMultiselect] = event.detail;
-  }
-  connectedCallback() {
-    this.tableEl = this.host.closest('sdds-table');
-    this.tableId = this.tableEl.tableId;
-  }
-  componentWillLoad() {
-    relevantTableProps.forEach((tablePropName) => {
-      this[tablePropName] = this.tableEl[tablePropName];
-    });
-  }
-  componentWillRender() {
-    // enable only right or left text align
-    if (this.textAlign === 'right' || this.textAlign === 'end') {
-      this.textAlignState = 'right';
-    }
-    else {
-      this.textAlignState = 'left';
-    }
-    // To enable body cells text align per rules set in head cell
-    this.textAlignEvent.emit([this.tableId, this.columnKey, this.textAlignState]);
-    this.enableToolbarDesign =
-      this.host.closest('sdds-table').getElementsByTagName('sdds-table-toolbar').length >= 1;
-  }
-  render() {
-    return (h(Host, { class: {
-        'sdds-table__header-cell': true,
-        'sdds-table__header-cell--sortable': this.sortable,
-        'sdds-table__header-cell--is-sorted': this.sortedByMyKey,
-        'sdds-table__header-cell--custom-width': this.customWidth !== '',
-        'sdds-table__header-cell--right-align': this.textAlignState === 'right',
-        'sdds-table--compact': this.compactDesign,
-        'sdds-table--divider': this.verticalDividers,
-        'sdds-table--no-min-width': this.noMinWidth,
-        'sdds-table--extra-column': this.enableMultiselect || this.enableExpandableRows,
-        'sdds-table--toolbar-available': this.enableToolbarDesign,
-      }, style: { width: this.customWidth },
-      // Calling actions from here to enable hover functionality for both sortable and un-sortable tables
-      onMouseOver: () => this.onHeadCellHover(this.columnKey), onMouseLeave: () => this.onHeadCellHover('') }, this.headerCellContent()));
-  }
-  get host() { return this; }
-  static get style() { return tableHeaderCellCss; }
-}, [1, "sdds-header-cell", {
-    "columnKey": [513, "column-key"],
-    "columnTitle": [513, "column-title"],
-    "customWidth": [513, "custom-width"],
-    "sortable": [4],
-    "textAlign": [513, "text-align"],
-    "textAlignState": [32],
-    "sortingDirection": [32],
-    "sortedByMyKey": [32],
-    "disableSortingBtn": [32],
-    "verticalDividers": [32],
-    "compactDesign": [32],
-    "noMinWidth": [32],
-    "whiteBackground": [32],
-    "enableMultiselect": [32],
-    "enableToolbarDesign": [32],
-    "tableId": [32],
-    "enableExpandableRows": [32]
-  }, [[16, "tablePropsChangedEvent", "tablePropsChangedEventListener"], [16, "sortingSwitcherEvent", "sortingSwitcherEventListener"], [16, "sortColumnDataEvent", "updateOptionsContent"], [16, "enableMultiselectEvent", "enableMultiselectEventListener"]]]);
-function defineCustomElement$1() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["sdds-header-cell"];
-  components.forEach(tagName => { switch (tagName) {
-    case "sdds-header-cell":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, TableHeaderCell);
-      }
-      break;
-  } });
-}
-
-const SddsHeaderCell = TableHeaderCell;
-const defineCustomElement = defineCustomElement$1;
-
-export { SddsHeaderCell, defineCustomElement };

package/dist/components/sdds-icon.d.ts

@@ -1,11 +0,0 @@
-import type { Components, JSX } from "../types/components";
-
-interface SddsIcon extends Components.SddsIcon, HTMLElement {}
-export const SddsIcon: {
-  prototype: SddsIcon;
-  new (): SddsIcon;
-};
-/**
- * Used to define this component and all nested components recursively.
- */
-export const defineCustomElement: () => void;

package/dist/components/sdds-icon.js

@@ -1,6 +0,0 @@
-import { I as Icon, d as defineCustomElement$1 } from './icon.js';
-
-const SddsIcon = Icon;
-const defineCustomElement = defineCustomElement$1;
-
-export { SddsIcon, defineCustomElement };

package/dist/components/sdds-inline-tabs-fullbleed.d.ts

@@ -1,11 +0,0 @@
-import type { Components, JSX } from "../types/components";
-
-interface SddsInlineTabsFullbleed extends Components.SddsInlineTabsFullbleed, HTMLElement {}
-export const SddsInlineTabsFullbleed: {
-  prototype: SddsInlineTabsFullbleed;
-  new (): SddsInlineTabsFullbleed;
-};
-/**
- * Used to define this component and all nested components recursively.
- */
-export const defineCustomElement: () => void;

package/dist/components/sdds-inline-tabs-fullbleed.js

@@ -1,115 +0,0 @@
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-
-const inlineTabsFullbleedCss = ".sdds-inline-tabs-fullbleed{box-sizing:border-box;display:flex;position:relative;}.sdds-inline-tabs-fullbleed *{box-sizing:border-box}.sdds-inline-tabs-fullbleed::after{content:\" \";display:block;border-bottom:1px solid var(--sdds-inline-tabs-fullbleed-horizontal-divider-bg);left:0;right:0;bottom:0;position:absolute}.sdds-inline-tabs-fullbleed-wrapper{display:flex;flex-wrap:nowrap;width:100%;overflow-x:scroll;scrollbar-width:none}.sdds-inline-tabs-fullbleed-wrapper::-webkit-scrollbar{display:none}.sdds-inline-tabs-fullbleed--forward{cursor:pointer;width:48px;height:100%;border:0;position:absolute;right:0;top:0;background-color:var(--sdds-inline-tabs-fullbleed-scroll-btn-bg);display:flex;justify-content:center;align-items:center;opacity:0;pointer-events:none}.sdds-inline-tabs-fullbleed--forward__show{opacity:1;pointer-events:all}.sdds-inline-tabs-fullbleed--forward:hover{background-color:var(--sdds-inline-tabs-fullbleed-scroll-btn-hover-bg)}.sdds-inline-tabs-fullbleed--forward:active{background-color:var(--sdds-inline-tabs-fullbleed-scroll-btn-active-bg)}.sdds-inline-tabs-fullbleed--forward:focus{outline:2px solid var(--sdds-blue-400);outline-offset:-2px}.sdds-inline-tabs-fullbleed--back{cursor:pointer;width:48px;height:100%;border:0;position:absolute;left:0;top:0;background-color:var(--sdds-inline-tabs-fullbleed-scroll-btn-bg);display:flex;justify-content:center;align-items:center;opacity:0;pointer-events:none}.sdds-inline-tabs-fullbleed--back__show{opacity:1;pointer-events:all}.sdds-inline-tabs-fullbleed--back:hover{background-color:var(--sdds-inline-tabs-fullbleed-scroll-btn-hover-bg)}.sdds-inline-tabs-fullbleed--back:active{background-color:var(--sdds-inline-tabs-fullbleed-scroll-btn-active-bg)}.sdds-inline-tabs-fullbleed--back:focus{outline:2px solid var(--sdds-blue-400);outline-offset:-2px}.sdds-inline-tabs-fullbleed-centered{justify-content:center}::slotted(.sdds-inline-tabs-fullbleed--tab){font:var(--sdds-headline-07);letter-spacing:var(--sdds-headline-07-ls);color:rgba(0, 21, 51, 0.6);padding:16px 0;margin-right:32px;text-decoration:none;display:block;position:relative;transition:color 0.15s ease-in-out;white-space:nowrap;text-align:left}::slotted(.sdds-inline-tabs-fullbleed--tab)::after{content:\" \";position:absolute;bottom:0;right:0;left:0;margin-left:auto;width:0;margin-right:auto;height:2px;background-color:var(--sdds-inline-tabs-fullbleed-tab-hover-indicator-bg);transition:width 0.15s ease-in-out;z-index:10}::slotted(.sdds-inline-tabs-fullbleed--tab:first-child){margin-left:32px}::slotted(.sdds-inline-tabs-fullbleed--tab:last-child){margin-right:32px}::slotted(.sdds-inline-tabs-fullbleed--tab:hover){color:var(--sdds-inline-tabs-fullbleed-tab-hover-color)}::slotted(.sdds-inline-tabs-fullbleed--tab:hover)::after{width:100%}::slotted(.sdds-inline-tabs-fullbleed--tab:focus){outline:2px solid var(--sdds-blue-400);outline-offset:-2px;color:var(--sdds-inline-tabs-fullbleed-tab-focus-color)}::slotted(.sdds-inline-tabs-fullbleed--tab:focus)::after{width:0}::slotted(.sdds-inline-tabs-fullbleed--tab__active){color:var(--sdds-inline-tabs-fullbleed-tab-active-color)}::slotted(.sdds-inline-tabs-fullbleed--tab__active)::after{width:100%;background-color:var(--sdds-inline-tabs-fullbleed-tab-active-indicator-bg)}::slotted(.sdds-inline-tabs-fullbleed--tab__active:focus)::after{width:100%}::slotted(.sdds-inline-tabs-fullbleed--tab__disabled){color:var(--sdds-inline-tabs-fullbleed-tab-active-color);pointer-events:none;opacity:0.16}.sdds-inline-tabs-fullbleed-primary{background-color:var(--sdds-white)}.sdds-inline-tabs-fullbleed-primary .sdds-inline-tabs-fullbleed--forward{background-color:var(--sdds-white)}.sdds-inline-tabs-fullbleed-primary .sdds-inline-tabs-fullbleed--back{background-color:var(--sdds-white)}.sdds-inline-tabs-fullbleed-secondary{background-color:var(--sdds-grey-50)}.sdds-inline-tabs-fullbleed-secondary .sdds-inline-tabs-fullbleed--forward{background-color:var(--sdds-grey-50)}.sdds-inline-tabs-fullbleed-secondary .sdds-inline-tabs-fullbleed--back{background-color:var(--sdds-grey-50)}";
-
-const InlineTabsFullbleed = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
-    this.__attachShadow();
-    this.navWrapperElement = null; // reference to container with nav buttons
-    this.componentWidth = 0; // visible width of this component
-    this.buttonsWidth = 0; // total width of all nav items combined
-    this.scrollWidth = 0; // total amount that is possible to scroll in the nav wrapper
-    this.buttonWidth = 0; // current calculated width of the largest nav button
-    this.modeVariant = 'primary';
-    this.tabs = [];
-    this.showLeftScroll = false;
-    this.showRightScroll = false;
-  }
-  componentDidRender() {
-    this._calculateButtonWidth();
-  }
-  componentDidLoad() {
-    const resizeObserver = new ResizeObserver((entries) => {
-      for (const entry of entries) {
-        const componentWidth = entry.contentRect.width;
-        let buttonsWidth = 0;
-        const navButtons = Array.from(this.host.children);
-        navButtons.forEach((navButton) => {
-          const style = window.getComputedStyle(navButton);
-          buttonsWidth +=
-            navButton.clientWidth + parseFloat(style.marginLeft) + parseFloat(style.marginRight);
-          navButton.classList.add('sdds-inline-tabs-fullbleed--tab');
-        });
-        this.componentWidth = componentWidth;
-        this.buttonsWidth = buttonsWidth;
-        this.scrollWidth = buttonsWidth - componentWidth;
-        if (this.buttonsWidth > this.componentWidth) {
-          this._evaluateScrollButtons();
-        }
-        else {
-          this.showLeftScroll = false;
-          this.showRightScroll = false;
-        }
-      }
-    });
-    resizeObserver.observe(this.navWrapperElement);
-    this._calculateButtonWidth();
-  }
-  _calculateButtonWidth() {
-    let best = 0;
-    const navButtons = Array.from(this.host.children);
-    navButtons.forEach((navButton) => {
-      const style = window.getComputedStyle(navButton);
-      const width = navButton.clientWidth + parseFloat(style.marginLeft) + parseFloat(style.marginRight);
-      if (width > best) {
-        best = width;
-      }
-    });
-    this.buttonWidth = best;
-  }
-  _scrollRight() {
-    const scroll = this.navWrapperElement.scrollLeft;
-    this.navWrapperElement.scrollLeft = scroll + this.buttonWidth;
-    this._evaluateScrollButtons();
-  }
-  _scrollLeft() {
-    const scroll = this.navWrapperElement.scrollLeft;
-    this.navWrapperElement.scrollLeft = scroll - this.buttonWidth;
-    this._evaluateScrollButtons();
-  }
-  _evaluateScrollButtons() {
-    const scroll = this.navWrapperElement.scrollLeft;
-    if (scroll >= this.scrollWidth) {
-      this.showRightScroll = false;
-    }
-    else {
-      this.showRightScroll = true;
-    }
-    if (scroll <= 0) {
-      this.showLeftScroll = false;
-    }
-    else {
-      this.showLeftScroll = true;
-    }
-  }
-  render() {
-    return (h(Host, null, h("div", { class: `sdds-inline-tabs-fullbleed sdds-inline-tabs-fullbleed-${this.modeVariant}` }, h("div", { class: "sdds-inline-tabs-fullbleed-wrapper", ref: (el) => (this.navWrapperElement = el) }, h("slot", null)), h("div", { class: "sdds-inline-tabs-fullbleed-navigation" }, h("button", { class: `sdds-inline-tabs-fullbleed--forward ${this.showRightScroll ? 'sdds-inline-tabs-fullbleed--back__show' : ''}`, onClick: () => this._scrollRight() }, h("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M6.1147 17.3291C5.87062 17.0851 5.87062 16.6893 6.1147 16.4453L12.2948 10.2652C12.4412 10.1187 12.4412 9.8813 12.2948 9.73485L6.1147 3.55476C5.87062 3.31068 5.87062 2.91496 6.1147 2.67088C6.35878 2.4268 6.75451 2.4268 6.99858 2.67088L13.1787 8.85097C13.8133 9.48557 13.8133 10.5145 13.1787 11.1491L6.99858 17.3291C6.75451 17.5732 6.35878 17.5732 6.1147 17.3291Z", fill: "#0D0F13" }))), h("button", { class: `sdds-inline-tabs-fullbleed--back ${this.showLeftScroll ? 'sdds-inline-tabs-fullbleed--back__show' : ''}`, onClick: () => this._scrollLeft() }, h("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M13.8853 2.67085C14.1294 2.91493 14.1294 3.31066 13.8853 3.55473L7.70522 9.73482C7.55878 9.88127 7.55878 10.1187 7.70522 10.2652L13.8853 16.4452C14.1294 16.6893 14.1294 17.085 13.8853 17.3291C13.6412 17.5732 13.2455 17.5732 13.0014 17.3291L6.82134 11.149C6.18674 10.5144 6.18674 9.48554 6.82134 8.85094L13.0014 2.67085C13.2455 2.42677 13.6412 2.42677 13.8853 2.67085Z", fill: "#0D0F13" })))))));
-  }
-  get host() { return this; }
-  static get style() { return inlineTabsFullbleedCss; }
-}, [1, "sdds-inline-tabs-fullbleed", {
-    "modeVariant": [1, "mode-variant"],
-    "tabs": [32],
-    "showLeftScroll": [32],
-    "showRightScroll": [32]
-  }]);
-function defineCustomElement$1() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["sdds-inline-tabs-fullbleed"];
-  components.forEach(tagName => { switch (tagName) {
-    case "sdds-inline-tabs-fullbleed":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, InlineTabsFullbleed);
-      }
-      break;
-  } });
-}
-
-const SddsInlineTabsFullbleed = InlineTabsFullbleed;
-const defineCustomElement = defineCustomElement$1;
-
-export { SddsInlineTabsFullbleed, defineCustomElement };

package/dist/components/sdds-inline-tabs.d.ts

@@ -1,11 +0,0 @@
-import type { Components, JSX } from "../types/components";
-
-interface SddsInlineTabs extends Components.SddsInlineTabs, HTMLElement {}
-export const SddsInlineTabs: {
-  prototype: SddsInlineTabs;
-  new (): SddsInlineTabs;
-};
-/**
- * Used to define this component and all nested components recursively.
- */
-export const defineCustomElement: () => void;