npm - @oiz/stzh-components - Versions diffs - 4.0.0-beta3 → 4.0.0 - Mend

@oiz/stzh-components 4.0.0-beta3 → 4.0.0

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

Files changed (459) hide show

package/dist/components/{p-5748d860.js → p-f254ab81.js} RENAMED Viewed

@@ -3,11 +3,11 @@ import { a as addWordBreakToLinks } from './p-d1f98854.js';
 import { d as defineCustomElement$6 } from './p-26f6521e.js';
 import { d as defineCustomElement$5 } from './p-f57f18a3.js';
 import { d as defineCustomElement$4 } from './p-8d12a95f.js';
-import { d as defineCustomElement$3 } from './p-8bab76e0.js';
-import { d as defineCustomElement$2 } from './p-adc06dc4.js';
-import { d as defineCustomElement$1 } from './p-da29e441.js';
+import { d as defineCustomElement$3 } from './p-bed8abab.js';
+import { d as defineCustomElement$2 } from './p-ae7adee7.js';
+import { d as defineCustomElement$1 } from './p-a518f263.js';
-const stzhDatalistItemCss = ".sc-stzh-datalist-item-h{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium);color:var(--stzh-base-color);box-sizing:border-box;display:block}[hidden].sc-stzh-datalist-item-h,[stzh-hidden].sc-stzh-datalist-item-h{display:none}.sc-stzh-datalist-item-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-datalist-item-h *.sc-stzh-datalist-item,.sc-stzh-datalist-item-h *.sc-stzh-datalist-item::before,.sc-stzh-datalist-item-h *.sc-stzh-datalist-item::after{box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness);-webkit-text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink);text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink)}.sc-stzh-datalist-item-h .has-focus.sc-stzh-datalist-item{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-datalist-item-h .stzh-fylingfocus-focused.sc-stzh-datalist-item{outline-style:none !important}.sc-stzh-datalist-item-h .stzh-fylingfocus-focused.sc-stzh-datalist-item::-moz-focus-inner{border:0 !important}.sc-stzh-datalist-item-h{--value-font-family:var(--stzh-font-family-medium);--value-font-weight:var(--stzh-font-weight-medium);--value-color:inherit;--action-display:flex;--leading-icon-color:var(--stzh-color-grey90);--nested-display:var(--stzh-datalist-item-nested-display, block);--wrapper-display:var(--stzh-datalist-item-wrapper-display, contents);--text-overflow:ellipsis;--white-space:nowrap;--overflow:hidden;--max-width:100%;display:contents}[href].sc-stzh-datalist-item-h:not([href=\"\"]),[a11y-expanded].sc-stzh-datalist-item-h,[a11y-controls].sc-stzh-datalist-item-h{--value-color:var(--stzh-link-color);--value-hover-color:var(--stzh-link-hover-color)}.no-text-truncate.sc-stzh-datalist-item-h{--text-overflow:clip;--white-space:normal;--overflow:visible;--width:initial;--max-width:initial}.stzh-datalist-item.sc-stzh-datalist-item{position:relative;-webkit-text-decoration-line:none;text-decoration-line:none;display:var(--wrapper-display);align-items:center}.stzh-datalist-item__nested.sc-stzh-datalist-item{display:contents}.stzh-datalist-item__nested-inner.sc-stzh-datalist-item{display:var(--nested-display);grid-column:var(--full-grid-column)}.stzh-datalist-item__vhidden.sc-stzh-datalist-item{border:0;clip:rect(0 0 0 0);clip-path:inset(100%);width:0.0625rem;height:0.0625rem;overflow:hidden;padding:0;position:absolute}.stzh-datalist-item__wrapper.sc-stzh-datalist-item{flex-grow:1;display:grid}.stzh-datalist-item__leading.sc-stzh-datalist-item,.stzh-datalist-item__value.sc-stzh-datalist-item,.stzh-datalist-item__label.sc-stzh-datalist-item,.stzh-datalist-item__meta.sc-stzh-datalist-item,.stzh-datalist-item__action-list.sc-stzh-datalist-item{color:inherit;display:flex;text-align:left;appearance:none;font-family:inherit;background:transparent;border:none;padding:0;-webkit-text-decoration-line:none;text-decoration-line:none}.stzh-datalist-item__leading.is-button.sc-stzh-datalist-item,.stzh-datalist-item__leading.is-link.sc-stzh-datalist-item,.stzh-datalist-item__value.is-button.sc-stzh-datalist-item,.stzh-datalist-item__value.is-link.sc-stzh-datalist-item,.stzh-datalist-item__label.is-button.sc-stzh-datalist-item,.stzh-datalist-item__label.is-link.sc-stzh-datalist-item,.stzh-datalist-item__meta.is-button.sc-stzh-datalist-item,.stzh-datalist-item__meta.is-link.sc-stzh-datalist-item,.stzh-datalist-item__action-list.is-button.sc-stzh-datalist-item,.stzh-datalist-item__action-list.is-link.sc-stzh-datalist-item{cursor:pointer}.stzh-datalist-item__leading.sc-stzh-datalist-item{flex-shrink:0}.stzh-datalist-item__leading.sc-stzh-datalist-item:not(:empty){padding-right:var(--stzh-space-xsmall)}.stzh-datalist-item__leading-icon-container.sc-stzh-datalist-item{color:var(--leading-icon-color);transition-property:color, background-color;transition-duration:var(--stzh-base-transition-animation-speed)}.stzh-datalist-item__value-wrapper.sc-stzh-datalist-item{display:flex;align-items:center;gap:var(--stzh-space-xsmall);color:var(--value-color);transition:color var(--stzh-base-transition-animation-speed)}.stzh-datalist-item__value.sc-stzh-datalist-item{flex-grow:1;flex-direction:column}.stzh-datalist-item__value-text.sc-stzh-datalist-item{--color:initial;font-size:var(--stzh-font-curve-p1-default-font-size, var(--stzh-font-milli-font-size));line-height:var(--stzh-font-curve-p1-default-text-line-height, var(--stzh-font-milli-text-line-height));letter-spacing:var(--stzh-font-curve-p1-default-text-letter-spacing);font-family:var(--value-font-family);font-weight:var(--value-font-weight);width:auto}@media screen and (min-width: 900px){.stzh-datalist-item__value-text.sc-stzh-datalist-item{font-size:var(--stzh-font-curve-p1-medium-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-p1-medium-text-line-height, var(--stzh-font-centi-text-line-height));letter-spacing:var(--stzh-font-curve-p1-medium-text-letter-spacing)}}.stzh-datalist-item__label.sc-stzh-datalist-item,.stzh-datalist-item__meta.sc-stzh-datalist-item{font-size:var(--stzh-font-curve-caption-default-font-size, var(--stzh-font-nano-font-size));line-height:var(--stzh-font-curve-caption-default-text-line-height, var(--stzh-font-nano-text-line-height))}@media screen and (min-width: 900px){.stzh-datalist-item__label.sc-stzh-datalist-item,.stzh-datalist-item__meta.sc-stzh-datalist-item{font-size:var(--stzh-font-curve-caption-medium-font-size, var(--stzh-font-micro-font-size));line-height:var(--stzh-font-curve-caption-medium-text-line-height, var(--stzh-font-micro-text-line-height))}}.stzh-datalist-item__meta.sc-stzh-datalist-item{justify-content:flex-end}.stzh-datalist-item__meta-text.sc-stzh-datalist-item{display:flex;gap:var(--stzh-space-xsmall);color:var(--stzh-color-grey70)}.stzh-datalist-item__label.sc-stzh-datalist-item{color:var(--stzh-color-grey90)}.stzh-datalist-item__action-list.sc-stzh-datalist-item{display:var(--action-display);justify-content:center;text-align:center}.stzh-datalist-item__action-list.sc-stzh-datalist-item:not(:empty){padding-left:var(--stzh-space-medium)}.stzh-datalist-item__action.is-non-interactive.sc-stzh-datalist-item{display:flex;justify-content:center;align-items:center;width:var(--stzh-form-input-small-height);height:var(--stzh-form-input-small-height)}.stzh-datalist-item__interactive.sc-stzh-datalist-item{position:absolute;top:0;left:0}.stzh-datalist-item__readspeaker.sc-stzh-datalist-item{width:-moz-fit-content;width:fit-content}.stzh-datalist-item--is-button.sc-stzh-datalist-item .stzh-datalist-item__icon.is-open.sc-stzh-datalist-item{display:none}.stzh-datalist-item--is-button.stzh-datalist-item--is-expanded.sc-stzh-datalist-item .stzh-datalist-item__icon.is-closed.sc-stzh-datalist-item{display:none}.stzh-datalist-item--is-button.stzh-datalist-item--is-expanded.sc-stzh-datalist-item .stzh-datalist-item__icon.is-open.sc-stzh-datalist-item{display:inline-flex}.stzh-datalist-item--is-interactive.sc-stzh-datalist-item .stzh-datalist-item__value-text.sc-stzh-datalist-item{-webkit-text-decoration-line:underline;text-decoration-line:underline}.stzh-datalist-item--is-interactive.sc-stzh-datalist-item:hover .stzh-datalist-item__value-wrapper.sc-stzh-datalist-item{color:var(--value-hover-color)}.stzh-datalist-item--direction-vertical.sc-stzh-datalist-item .stzh-datalist-item__wrapper.sc-stzh-datalist-item{flex-grow:inherit}.stzh-datalist-item--direction-vertical.sc-stzh-datalist-item .stzh-datalist-item__leading.sc-stzh-datalist-item:not(:empty),.stzh-datalist-item--direction-vertical.sc-stzh-datalist-item .stzh-datalist-item__wrapper.sc-stzh-datalist-item:not(:empty),.stzh-datalist-item--direction-vertical.sc-stzh-datalist-item .stzh-datalist-item__action-list.sc-stzh-datalist-item:not(:empty){padding-top:var(--stzh-space-xsmall);padding-bottom:var(--stzh-space-xsmall)}.stzh-datalist-item--direction-vertical.sc-stzh-datalist-item .stzh-datalist-item__meta.sc-stzh-datalist-item{flex-direction:column;align-items:flex-start}.stzh-datalist-item--direction-horizontal.sc-stzh-datalist-item .stzh-datalist-item__leading.sc-stzh-datalist-item:not(:empty),.stzh-datalist-item--direction-horizontal.sc-stzh-datalist-item .stzh-datalist-item__value.sc-stzh-datalist-item:not(:empty),.stzh-datalist-item--direction-horizontal.sc-stzh-datalist-item .stzh-datalist-item__action-list.sc-stzh-datalist-item:not(:empty){padding-top:var(--stzh-space-xxsmall);padding-bottom:var(--stzh-space-xxsmall)}.stzh-datalist-item--direction-horizontal.sc-stzh-datalist-item .stzh-datalist-item__meta.sc-stzh-datalist-item{padding-bottom:var(--stzh-space-xxsmall);padding-top:calc(var(--stzh-space-xxsmall) + 0.75rem)}.stzh-datalist-item--direction-horizontal.sc-stzh-datalist-item .stzh-datalist-item__readspeaker.sc-stzh-datalist-item{padding-bottom:var(--stzh-space-xxsmall);padding-top:var(--stzh-space-xxsmall);padding-left:var(--stzh-space-medium)}.stzh-datalist-item--direction-horizontal.sc-stzh-datalist-item .stzh-datalist-item__meta.sc-stzh-datalist-item:not(:empty){padding-left:var(--stzh-space-xsmall)}.stzh-datalist-item--direction-horizontal.sc-stzh-datalist-item .stzh-datalist-item__meta-status.sc-stzh-datalist-item+.stzh-datalist-item__meta-text.sc-stzh-datalist-item{margin-left:var(--stzh-space-xsmall)}.stzh-datalist-item--table.sc-stzh-datalist-item .stzh-datalist-item__label.sc-stzh-datalist-item,.stzh-datalist-item--table.sc-stzh-datalist-item .stzh-datalist-item__meta.sc-stzh-datalist-item{font-size:var(--stzh-font-nano-font-size);line-height:var(--stzh-font-nano-text-line-height)}.stzh-datalist-item--table.sc-stzh-datalist-item .stzh-datalist-item__label.sc-stzh-datalist-item{color:var(--stzh-color-grey70)}.stzh-datalist-item--table.sc-stzh-datalist-item .stzh-datalist-item__value-text.sc-stzh-datalist-item{font-size:var(--stzh-font-milli-font-size);line-height:var(--stzh-font-milli-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}.stzh-datalist-item--table.sc-stzh-datalist-item .stzh-datalist-item__leading.sc-stzh-datalist-item:not(:empty),.stzh-datalist-item--table.sc-stzh-datalist-item .stzh-datalist-item__value.sc-stzh-datalist-item:not(:empty),.stzh-datalist-item--table.sc-stzh-datalist-item .stzh-datalist-item__label.sc-stzh-datalist-item:not(:empty),.stzh-datalist-item--table.sc-stzh-datalist-item .stzh-datalist-item__meta.sc-stzh-datalist-item:not(:empty),.stzh-datalist-item--table.sc-stzh-datalist-item .stzh-datalist-item__action-list.sc-stzh-datalist-item:not(:empty){padding-top:var(--stzh-space-xsmall);padding-bottom:var(--stzh-space-small)}.stzh-datalist-item--table.sc-stzh-datalist-item .stzh-datalist-item__label.sc-stzh-datalist-item:not(:empty)+.stzh-datalist-item__value.sc-stzh-datalist-item{padding-left:var(--stzh-space-medium)}.stzh-datalist-item--table.sc-stzh-datalist-item .stzh-datalist-item__meta.sc-stzh-datalist-item:not(:empty){padding-left:var(--stzh-space-medium)}.stzh-datalist-item--table.stzh-datalist-item--big-label.sc-stzh-datalist-item .stzh-datalist-item__label.sc-stzh-datalist-item{font-family:var(--stzh-font-family-heavy);font-weight:var(--stzh-font-weight-heavy);font-style:var(--stzh-font-style-heavy);font-size:var(--stzh-font-milli-font-size);line-height:var(--stzh-font-milli-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing);color:var(--stzh-color-grey80)}.stzh-datalist-item--table.stzh-datalist-item--big-label.sc-stzh-datalist-item .stzh-datalist-item__leading.sc-stzh-datalist-item:not(:empty),.stzh-datalist-item--table.stzh-datalist-item--big-label.sc-stzh-datalist-item .stzh-datalist-item__value.sc-stzh-datalist-item:not(:empty),.stzh-datalist-item--table.stzh-datalist-item--big-label.sc-stzh-datalist-item .stzh-datalist-item__label.sc-stzh-datalist-item:not(:empty),.stzh-datalist-item--table.stzh-datalist-item--big-label.sc-stzh-datalist-item .stzh-datalist-item__meta.sc-stzh-datalist-item:not(:empty),.stzh-datalist-item--table.stzh-datalist-item--big-label.sc-stzh-datalist-item .stzh-datalist-item__action-list.sc-stzh-datalist-item:not(:empty){padding-top:0;padding-bottom:0}@media screen and (min-width: 600px){.stzh-datalist-item--table.stzh-datalist-item--big-label.sc-stzh-datalist-item .stzh-datalist-item__leading.sc-stzh-datalist-item:not(:empty),.stzh-datalist-item--table.stzh-datalist-item--big-label.sc-stzh-datalist-item .stzh-datalist-item__value.sc-stzh-datalist-item:not(:empty),.stzh-datalist-item--table.stzh-datalist-item--big-label.sc-stzh-datalist-item .stzh-datalist-item__label.sc-stzh-datalist-item:not(:empty),.stzh-datalist-item--table.stzh-datalist-item--big-label.sc-stzh-datalist-item .stzh-datalist-item__meta.sc-stzh-datalist-item:not(:empty),.stzh-datalist-item--table.stzh-datalist-item--big-label.sc-stzh-datalist-item .stzh-datalist-item__action-list.sc-stzh-datalist-item:not(:empty){padding-top:var(--stzh-space-xsmall);padding-bottom:var(--stzh-space-small)}}.stzh-datalist-item--table.stzh-datalist-item--big-label.sc-stzh-datalist-item .stzh-datalist-item__label.sc-stzh-datalist-item:not(:empty)+.stzh-datalist-item__value.sc-stzh-datalist-item{padding-left:var(--stzh-space-medium)}@media screen and (max-width: 599px){.stzh-datalist-item--table.stzh-datalist-item--big-label.sc-stzh-datalist-item .stzh-datalist-item__label.sc-stzh-datalist-item:not(:empty)+.stzh-datalist-item__value.sc-stzh-datalist-item{padding-left:0}}";
+const stzhDatalistItemCss = ".sc-stzh-datalist-item-h{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium);color:var(--stzh-base-color);box-sizing:border-box;display:block}[hidden].sc-stzh-datalist-item-h,[stzh-hidden].sc-stzh-datalist-item-h{display:none}.sc-stzh-datalist-item-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-datalist-item-h *.sc-stzh-datalist-item,.sc-stzh-datalist-item-h *.sc-stzh-datalist-item::before,.sc-stzh-datalist-item-h *.sc-stzh-datalist-item::after{box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness);-webkit-text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink);text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink)}.sc-stzh-datalist-item-h .has-focus.sc-stzh-datalist-item{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-datalist-item-h .stzh-fylingfocus-focused.sc-stzh-datalist-item{outline-style:none !important}.sc-stzh-datalist-item-h .stzh-fylingfocus-focused.sc-stzh-datalist-item::-moz-focus-inner{border:0 !important}.sc-stzh-datalist-item-h{--value-font-family:var(--stzh-font-family-medium);--value-font-weight:var(--stzh-font-weight-medium);--value-color:inherit;--action-display:flex;--leading-icon-color:var(--stzh-color-grey90);--nested-display:var(--stzh-datalist-item-nested-display, block);--wrapper-display:var(--stzh-datalist-item-wrapper-display, contents);--text-overflow:clip;--white-space:normal;--overflow:visible;--width:initial;--max-width:initial;display:contents}[href].sc-stzh-datalist-item-h:not([href=\"\"]),[a11y-expanded].sc-stzh-datalist-item-h,[a11y-controls].sc-stzh-datalist-item-h{--value-color:var(--stzh-link-color);--value-hover-color:var(--stzh-link-hover-color)}.value-truncate.sc-stzh-datalist-item-h{--text-overflow:ellipsis;--white-space:nowrap;--overflow:hidden;--max-width:100%}.stzh-datalist-item.sc-stzh-datalist-item{position:relative;-webkit-text-decoration-line:none;text-decoration-line:none;display:var(--wrapper-display);align-items:center}.stzh-datalist-item__nested.sc-stzh-datalist-item{display:contents}.stzh-datalist-item__nested-inner.sc-stzh-datalist-item{display:var(--nested-display);grid-column:var(--full-grid-column)}.stzh-datalist-item__vhidden.sc-stzh-datalist-item{border:0;clip:rect(0 0 0 0);clip-path:inset(100%);width:0.0625rem;height:0.0625rem;overflow:hidden;padding:0;position:absolute}.stzh-datalist-item__wrapper.sc-stzh-datalist-item{flex-grow:1;display:grid}.stzh-datalist-item__leading.sc-stzh-datalist-item,.stzh-datalist-item__value.sc-stzh-datalist-item,.stzh-datalist-item__label.sc-stzh-datalist-item,.stzh-datalist-item__meta.sc-stzh-datalist-item,.stzh-datalist-item__action-list.sc-stzh-datalist-item{color:inherit;display:flex;text-align:left;appearance:none;font-family:inherit;background:transparent;border:none;padding:0;-webkit-text-decoration-line:none;text-decoration-line:none}.stzh-datalist-item__leading.is-button.sc-stzh-datalist-item,.stzh-datalist-item__leading.is-link.sc-stzh-datalist-item,.stzh-datalist-item__value.is-button.sc-stzh-datalist-item,.stzh-datalist-item__value.is-link.sc-stzh-datalist-item,.stzh-datalist-item__label.is-button.sc-stzh-datalist-item,.stzh-datalist-item__label.is-link.sc-stzh-datalist-item,.stzh-datalist-item__meta.is-button.sc-stzh-datalist-item,.stzh-datalist-item__meta.is-link.sc-stzh-datalist-item,.stzh-datalist-item__action-list.is-button.sc-stzh-datalist-item,.stzh-datalist-item__action-list.is-link.sc-stzh-datalist-item{cursor:pointer}.stzh-datalist-item__leading.sc-stzh-datalist-item{flex-shrink:0}.stzh-datalist-item__leading.sc-stzh-datalist-item:not(:empty){padding-right:var(--stzh-space-xsmall)}.stzh-datalist-item__leading-icon-container.sc-stzh-datalist-item{color:var(--leading-icon-color);transition-property:color, background-color;transition-duration:var(--stzh-base-transition-animation-speed)}.stzh-datalist-item__value-wrapper.sc-stzh-datalist-item{display:flex;align-items:center;gap:var(--stzh-space-xsmall);color:var(--value-color);transition:color var(--stzh-base-transition-animation-speed)}.stzh-datalist-item__value.sc-stzh-datalist-item{flex-grow:1;flex-direction:column;min-width:0}.stzh-datalist-item__value-text.sc-stzh-datalist-item{--color:initial;min-width:0;font-size:var(--stzh-font-curve-p1-default-font-size, var(--stzh-font-milli-font-size));line-height:var(--stzh-font-curve-p1-default-text-line-height, var(--stzh-font-milli-text-line-height));letter-spacing:var(--stzh-font-curve-p1-default-text-letter-spacing);font-family:var(--value-font-family);font-weight:var(--value-font-weight);width:auto}@media screen and (min-width: 900px){.stzh-datalist-item__value-text.sc-stzh-datalist-item{font-size:var(--stzh-font-curve-p1-medium-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-p1-medium-text-line-height, var(--stzh-font-centi-text-line-height));letter-spacing:var(--stzh-font-curve-p1-medium-text-letter-spacing)}}.stzh-datalist-item__label.sc-stzh-datalist-item,.stzh-datalist-item__meta.sc-stzh-datalist-item{font-size:var(--stzh-font-curve-caption-default-font-size, var(--stzh-font-nano-font-size));line-height:var(--stzh-font-curve-caption-default-text-line-height, var(--stzh-font-nano-text-line-height))}@media screen and (min-width: 900px){.stzh-datalist-item__label.sc-stzh-datalist-item,.stzh-datalist-item__meta.sc-stzh-datalist-item{font-size:var(--stzh-font-curve-caption-medium-font-size, var(--stzh-font-micro-font-size));line-height:var(--stzh-font-curve-caption-medium-text-line-height, var(--stzh-font-micro-text-line-height))}}.stzh-datalist-item__meta.sc-stzh-datalist-item{justify-content:flex-end}.stzh-datalist-item__meta-text.sc-stzh-datalist-item{display:flex;gap:var(--stzh-space-xsmall);color:var(--stzh-color-grey70)}.stzh-datalist-item__label.sc-stzh-datalist-item{color:var(--stzh-color-grey90)}.stzh-datalist-item__action-list.sc-stzh-datalist-item{display:var(--action-display);justify-content:center;text-align:center}.stzh-datalist-item__action-list.sc-stzh-datalist-item:not(:empty){padding-left:var(--stzh-space-medium)}.stzh-datalist-item__action.is-non-interactive.sc-stzh-datalist-item{display:flex;justify-content:center;align-items:center;width:var(--stzh-form-input-small-height);height:var(--stzh-form-input-small-height)}.stzh-datalist-item__interactive.sc-stzh-datalist-item{position:absolute;top:0;left:0}.stzh-datalist-item__readspeaker.sc-stzh-datalist-item{width:-moz-fit-content;width:fit-content}.stzh-datalist-item--is-button.sc-stzh-datalist-item .stzh-datalist-item__icon.is-open.sc-stzh-datalist-item{display:none}.stzh-datalist-item--is-button.stzh-datalist-item--is-expanded.sc-stzh-datalist-item .stzh-datalist-item__icon.is-closed.sc-stzh-datalist-item{display:none}.stzh-datalist-item--is-button.stzh-datalist-item--is-expanded.sc-stzh-datalist-item .stzh-datalist-item__icon.is-open.sc-stzh-datalist-item{display:inline-flex}.stzh-datalist-item--is-interactive.sc-stzh-datalist-item .stzh-datalist-item__value-text.sc-stzh-datalist-item{-webkit-text-decoration-line:underline;text-decoration-line:underline}.stzh-datalist-item--is-interactive.sc-stzh-datalist-item:hover .stzh-datalist-item__value-wrapper.sc-stzh-datalist-item{color:var(--value-hover-color)}.stzh-datalist-item--direction-vertical.sc-stzh-datalist-item .stzh-datalist-item__wrapper.sc-stzh-datalist-item{flex-grow:inherit}.stzh-datalist-item--direction-vertical.sc-stzh-datalist-item .stzh-datalist-item__leading.sc-stzh-datalist-item:not(:empty),.stzh-datalist-item--direction-vertical.sc-stzh-datalist-item .stzh-datalist-item__wrapper.sc-stzh-datalist-item:not(:empty),.stzh-datalist-item--direction-vertical.sc-stzh-datalist-item .stzh-datalist-item__action-list.sc-stzh-datalist-item:not(:empty){padding-top:var(--stzh-space-xsmall);padding-bottom:var(--stzh-space-xsmall)}.stzh-datalist-item--direction-vertical.sc-stzh-datalist-item .stzh-datalist-item__meta.sc-stzh-datalist-item{flex-direction:column;align-items:flex-start}.stzh-datalist-item--direction-horizontal.sc-stzh-datalist-item .stzh-datalist-item__leading.sc-stzh-datalist-item:not(:empty),.stzh-datalist-item--direction-horizontal.sc-stzh-datalist-item .stzh-datalist-item__value.sc-stzh-datalist-item:not(:empty),.stzh-datalist-item--direction-horizontal.sc-stzh-datalist-item .stzh-datalist-item__action-list.sc-stzh-datalist-item:not(:empty){padding-top:var(--stzh-space-xxsmall);padding-bottom:var(--stzh-space-xxsmall)}.stzh-datalist-item--direction-horizontal.sc-stzh-datalist-item .stzh-datalist-item__meta.sc-stzh-datalist-item{padding-bottom:var(--stzh-space-xxsmall);padding-top:calc(var(--stzh-space-xxsmall) + 0.75rem)}.stzh-datalist-item--direction-horizontal.sc-stzh-datalist-item .stzh-datalist-item__readspeaker.sc-stzh-datalist-item{padding-bottom:var(--stzh-space-xxsmall);padding-top:var(--stzh-space-xxsmall);padding-left:var(--stzh-space-medium)}.stzh-datalist-item--direction-horizontal.sc-stzh-datalist-item .stzh-datalist-item__meta.sc-stzh-datalist-item:not(:empty){padding-left:var(--stzh-space-xsmall)}.stzh-datalist-item--direction-horizontal.sc-stzh-datalist-item .stzh-datalist-item__meta-status.sc-stzh-datalist-item+.stzh-datalist-item__meta-text.sc-stzh-datalist-item{margin-left:var(--stzh-space-xsmall)}.stzh-datalist-item--table.sc-stzh-datalist-item .stzh-datalist-item__label.sc-stzh-datalist-item,.stzh-datalist-item--table.sc-stzh-datalist-item .stzh-datalist-item__meta.sc-stzh-datalist-item{font-size:var(--stzh-font-nano-font-size);line-height:var(--stzh-font-nano-text-line-height)}.stzh-datalist-item--table.sc-stzh-datalist-item .stzh-datalist-item__label.sc-stzh-datalist-item{color:var(--stzh-color-grey70)}.stzh-datalist-item--table.sc-stzh-datalist-item .stzh-datalist-item__value-text.sc-stzh-datalist-item{font-size:var(--stzh-font-milli-font-size);line-height:var(--stzh-font-milli-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}.stzh-datalist-item--table.sc-stzh-datalist-item .stzh-datalist-item__leading.sc-stzh-datalist-item:not(:empty),.stzh-datalist-item--table.sc-stzh-datalist-item .stzh-datalist-item__value.sc-stzh-datalist-item:not(:empty),.stzh-datalist-item--table.sc-stzh-datalist-item .stzh-datalist-item__label.sc-stzh-datalist-item:not(:empty),.stzh-datalist-item--table.sc-stzh-datalist-item .stzh-datalist-item__meta.sc-stzh-datalist-item:not(:empty),.stzh-datalist-item--table.sc-stzh-datalist-item .stzh-datalist-item__action-list.sc-stzh-datalist-item:not(:empty){padding-top:var(--stzh-space-xsmall);padding-bottom:var(--stzh-space-small)}.stzh-datalist-item--table.sc-stzh-datalist-item .stzh-datalist-item__label.sc-stzh-datalist-item:not(:empty)+.stzh-datalist-item__value.sc-stzh-datalist-item{padding-left:var(--stzh-space-medium)}.stzh-datalist-item--table.sc-stzh-datalist-item .stzh-datalist-item__meta.sc-stzh-datalist-item:not(:empty){padding-left:var(--stzh-space-medium)}.stzh-datalist-item--table.stzh-datalist-item--big-label.sc-stzh-datalist-item .stzh-datalist-item__label.sc-stzh-datalist-item{font-family:var(--stzh-font-family-heavy);font-weight:var(--stzh-font-weight-heavy);font-style:var(--stzh-font-style-heavy);font-size:var(--stzh-font-milli-font-size);line-height:var(--stzh-font-milli-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing);color:var(--stzh-color-grey80)}.stzh-datalist-item--table.stzh-datalist-item--big-label.sc-stzh-datalist-item .stzh-datalist-item__leading.sc-stzh-datalist-item:not(:empty),.stzh-datalist-item--table.stzh-datalist-item--big-label.sc-stzh-datalist-item .stzh-datalist-item__value.sc-stzh-datalist-item:not(:empty),.stzh-datalist-item--table.stzh-datalist-item--big-label.sc-stzh-datalist-item .stzh-datalist-item__label.sc-stzh-datalist-item:not(:empty),.stzh-datalist-item--table.stzh-datalist-item--big-label.sc-stzh-datalist-item .stzh-datalist-item__meta.sc-stzh-datalist-item:not(:empty),.stzh-datalist-item--table.stzh-datalist-item--big-label.sc-stzh-datalist-item .stzh-datalist-item__action-list.sc-stzh-datalist-item:not(:empty){padding-top:0;padding-bottom:0}@media screen and (min-width: 600px){.stzh-datalist-item--table.stzh-datalist-item--big-label.sc-stzh-datalist-item .stzh-datalist-item__leading.sc-stzh-datalist-item:not(:empty),.stzh-datalist-item--table.stzh-datalist-item--big-label.sc-stzh-datalist-item .stzh-datalist-item__value.sc-stzh-datalist-item:not(:empty),.stzh-datalist-item--table.stzh-datalist-item--big-label.sc-stzh-datalist-item .stzh-datalist-item__label.sc-stzh-datalist-item:not(:empty),.stzh-datalist-item--table.stzh-datalist-item--big-label.sc-stzh-datalist-item .stzh-datalist-item__meta.sc-stzh-datalist-item:not(:empty),.stzh-datalist-item--table.stzh-datalist-item--big-label.sc-stzh-datalist-item .stzh-datalist-item__action-list.sc-stzh-datalist-item:not(:empty){padding-top:var(--stzh-space-xsmall);padding-bottom:var(--stzh-space-small)}}.stzh-datalist-item--table.stzh-datalist-item--big-label.sc-stzh-datalist-item .stzh-datalist-item__label.sc-stzh-datalist-item:not(:empty)+.stzh-datalist-item__value.sc-stzh-datalist-item{padding-left:var(--stzh-space-medium)}@media screen and (max-width: 599px){.stzh-datalist-item--table.stzh-datalist-item--big-label.sc-stzh-datalist-item .stzh-datalist-item__label.sc-stzh-datalist-item:not(:empty)+.stzh-datalist-item__value.sc-stzh-datalist-item{padding-left:0}}";
 const StzhDatalistItemStyle0 = stzhDatalistItemCss;
 let datalistItemCounter = 0;
@@ -55,7 +55,7 @@ const StzhDatalistItem = /*@__PURE__*/ proxyCustomElement(class StzhDatalistItem
         this.iconHref = undefined;
         this.label = "";
         this.value = "";
-        this.noTextTruncate = false;
+        this.valueTruncate = false;
         this.readspeakerLabel = "";
         this.readspeakerHref = "";
         this.meta = "";
@@ -173,7 +173,7 @@ const StzhDatalistItem = /*@__PURE__*/ proxyCustomElement(class StzhDatalistItem
                     "is-button": true,
                 }, variant: "tertiary", size: "small", "aria-label": this.iconLabel, iconOnly: true, href: this.iconHref, icon: this.icon, onClick: this.onActionClick }));
         };
-        return (h(Host, { role: "listitem", class: { "no-text-truncate": !!this.href || this.noTextTruncate } }, h("div", { class: classes }, this.direction === "horizontal" || this.variant === "table" ? (h(Fragment, null, this.renderLeadingIcon(isButton), this.renderInner(isButton, hasActionButton))) : (h(Fragment, null, this.renderLeadingIcon(isButton), h("div", { class: "stzh-datalist-item__wrapper" }, this.renderInner(isButton, hasActionButton)))), h(ActionItem, { role: hasActionButton ? null : "presentation", "aria-hidden": hasActionButton ? null : "true", tabindex: "-1", class: {
+        return (h(Host, { role: "listitem", class: { 'value-truncate': this.valueTruncate } }, h("div", { class: classes }, this.direction === "horizontal" || this.variant === "table" ? (h(Fragment, null, this.renderLeadingIcon(isButton), this.renderInner(isButton, hasActionButton))) : (h(Fragment, null, this.renderLeadingIcon(isButton), h("div", { class: "stzh-datalist-item__wrapper" }, this.renderInner(isButton, hasActionButton)))), h(ActionItem, { role: hasActionButton ? null : "presentation", "aria-hidden": hasActionButton ? null : "true", tabindex: "-1", class: {
                 "stzh-datalist-item__action-list": true,
                 "is-button": isButton,
                 "is-link": !!this.href && !this.iconHref,
@@ -201,7 +201,7 @@ const StzhDatalistItem = /*@__PURE__*/ proxyCustomElement(class StzhDatalistItem
         "iconHref": [1, "icon-href"],
         "label": [1],
         "value": [1],
-        "noTextTruncate": [4, "no-text-truncate"],
+        "valueTruncate": [4, "value-truncate"],
         "readspeakerLabel": [1, "readspeaker-label"],
         "readspeakerHref": [1, "readspeaker-href"],
         "meta": [513],
@@ -263,4 +263,4 @@ function defineCustomElement() {
 export { StzhDatalistItem as S, defineCustomElement as d };
-//# sourceMappingURL=p-5748d860.js.map
+//# sourceMappingURL=p-f254ab81.js.map

package/dist/components/p-f254ab81.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"p-f254ab81.js","mappings":"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","names":[],"sources":["src/components/stzh-datalist-item/stzh-datalist-item.scss?tag=stzh-datalist-item&encapsulation=scoped","src/components/stzh-datalist-item/stzh-datalist-item.tsx"],"sourcesContent":[":host {\n --value-font-family: var(--stzh-font-family-medium);\n --value-font-weight: var(--stzh-font-weight-medium);\n --value-color: inherit;\n --action-display: flex;\n --leading-icon-color: #{$colorGrey90};\n --nested-display: var(--stzh-datalist-item-nested-display, block);\n --wrapper-display: var(--stzh-datalist-item-wrapper-display, contents);\n\n --text-overflow: clip;\n --white-space: normal;\n --overflow: visible;\n --width: initial;\n --max-width: initial;\n\n display: contents;\n\n &[href]:not([href=\"\"]),\n &[a11y-expanded],\n &[a11y-controls] {\n --value-color: #{$linkColor};\n --value-hover-color: #{$linkHoverColor};\n }\n}\n\n:host(.value-truncate) {\n --text-overflow: ellipsis;\n --white-space: nowrap;\n --overflow: hidden;\n --max-width: 100%;\n}\n\n\n.stzh-datalist-item {\n position: relative;\n text-decoration-line: none;\n display: var(--wrapper-display);\n align-items: center;\n\n &__nested {\n display: contents;\n }\n\n &__nested-inner {\n display: var(--nested-display);\n grid-column: var(--full-grid-column);\n }\n\n &__vhidden {\n @include visuallyhidden;\n }\n\n &__wrapper {\n flex-grow: 1;\n display: grid;\n }\n\n &__leading,\n &__value,\n &__label,\n &__meta,\n &__action-list {\n color: inherit;\n display: flex;\n text-align: left;\n appearance: none;\n font-family: inherit;\n background: transparent;\n border: none;\n padding: 0;\n text-decoration-line: none;\n\n &.is-button,\n &.is-link {\n cursor: pointer;\n }\n }\n\n &__leading {\n flex-shrink: 0;\n\n &:not(:empty) {\n padding-right: space('xsmall');\n }\n }\n\n &__leading-icon-container {\n color: var(--leading-icon-color);\n transition-property: color, background-color;\n transition-duration: $baseTransitionAnimationSpeed;\n }\n\n &__value-wrapper {\n display: flex;\n align-items: center;\n gap: space('xsmall');\n color: var(--value-color);\n transition: color $baseTransitionAnimationSpeed;\n }\n\n &__value {\n flex-grow: 1;\n flex-direction: column;\n min-width: 0;\n }\n\n &__value-text {\n --color: initial;\n min-width: 0;\n\n @include fontCurve('p1');\n font-family: var(--value-font-family);\n font-weight: var(--value-font-weight);\n width: auto;\n }\n\n &__label,\n &__meta {\n @include fontCurve('caption');\n }\n\n &__meta {\n justify-content: flex-end;\n }\n\n &__meta-text {\n display: flex;\n gap: space('xsmall');\n color: $colorGrey70;\n }\n\n &__label {\n color: $colorGrey90;\n }\n\n &__action-list {\n display: var(--action-display);\n justify-content: center;\n text-align: center;\n\n &:not(:empty) {\n padding-left: space('medium');\n }\n }\n\n &__action {\n &.is-non-interactive {\n display: flex;\n justify-content: center;\n align-items: center;\n width: $formInputHeightSmall;\n height: $formInputHeightSmall;\n }\n }\n\n &__interactive {\n position: absolute;\n top: 0;\n left: 0;\n }\n\n &__readspeaker {\n width: fit-content;\n }\n\n /* Button variant */\n\n &--is-button &__icon.is-open {\n display: none;\n }\n\n &--is-button#{&}--is-expanded &__icon {\n &.is-closed {\n display: none;\n }\n\n &.is-open {\n display: inline-flex;\n }\n }\n\n /* Interactive variant */\n\n &--is-interactive &__value-text {\n text-decoration-line: underline;\n }\n\n &--is-interactive:hover &__value-wrapper {\n color: var(--value-hover-color);\n }\n\n /* Vertical Variant */\n\n &--direction-vertical &__wrapper {\n flex-grow: inherit;\n }\n\n &--direction-vertical &__leading,\n &--direction-vertical &__wrapper,\n &--direction-vertical &__action-list {\n &:not(:empty) {\n padding-top: space('xsmall');\n padding-bottom: space('xsmall');\n }\n }\n\n &--direction-vertical &__meta {\n flex-direction: column;\n align-items: flex-start;\n }\n\n /* Horizontal / Table Variant */\n\n &--direction-horizontal &__leading,\n &--direction-horizontal &__value,\n &--direction-horizontal &__action-list {\n &:not(:empty) {\n padding-top: space('xxsmall');\n padding-bottom: space('xxsmall');\n }\n }\n\n &--direction-horizontal &__meta {\n padding-bottom: space('xxsmall');\n padding-top: calc(#{space('xxsmall')} + 12px);\n }\n\n &--direction-horizontal &__readspeaker {\n padding-bottom: space('xxsmall');\n padding-top: space('xxsmall');\n padding-left: space('medium');\n }\n\n &--direction-horizontal &__meta {\n &:not(:empty) {\n padding-left: space('xsmall');\n }\n }\n\n &--direction-horizontal &__meta-status + &__meta-text {\n margin-left: space('xsmall');\n }\n\n /** Table Variant */\n\n &--table &__label,\n &--table &__meta {\n @include fontSize('nano');\n }\n\n &--table &__label {\n color: $colorGrey70;\n }\n\n &--table &__value-text {\n @include fontSize('milli');\n }\n\n &--table &__leading,\n &--table &__value,\n &--table &__label,\n &--table &__meta,\n &--table &__action-list {\n &:not(:empty) {\n padding-top: space('xsmall');\n padding-bottom: space('small');\n }\n }\n\n &--table &__label:not(:empty) + &__value {\n padding-left: space('medium');\n }\n\n &--table &__meta {\n &:not(:empty) {\n padding-left: space('medium');\n }\n }\n\n /** Big label */\n\n &--table#{&}--big-label &__label {\n @include font('heavy');\n @include fontSize('milli');\n color: $colorGrey80;\n }\n\n &--table#{&}--big-label &__leading,\n &--table#{&}--big-label &__value,\n &--table#{&}--big-label &__label,\n &--table#{&}--big-label &__meta,\n &--table#{&}--big-label &__action-list {\n &:not(:empty) {\n padding-top: 0;\n padding-bottom: 0;\n\n @include mq($from: small) {\n padding-top: space('xsmall');\n padding-bottom: space('small');\n }\n }\n }\n\n &--table#{&}--big-label &__label:not(:empty) + &__value {\n padding-left: space('medium');\n\n @include mq($to: small) {\n padding-left: 0;\n }\n }\n}\n","import { Component, Element, Event, EventEmitter, Fragment, h, Host, Prop, State, Watch } from \"@stencil/core\";\n\nimport {\n StzhDatalistBigLabelChangeEvent,\n StzhDatalistDirection,\n StzhDatalistDirectionChangeEvent,\n StzhDatalistItemActionClickEvent,\n StzhDatalistItemClickEvent,\n StzhDatalistVariant,\n StzhDatalistVariantChangeEvent,\n StzhStatusType,\n} from \"../../index\";\n\nimport { addWordBreakToLinks } from \"../../utils/utils\";\nimport { StzhLocaleComponent } from \"../../index\";\n\nlet datalistItemCounter = 0;\n\n/**\n * @slot - Slot for nested datalist\n * @slot value - Slot for value (or use value slot instead)\n * @slot readspeaker - Slot for readspeaker\n */\n@Component({\n tag: \"stzh-datalist-item\",\n styleUrl: \"stzh-datalist-item.scss\",\n scoped: true,\n})\nexport class StzhDatalistItem {\n /** Translation strings */\n @Prop() localization: StzhLocaleComponent;\n\n /** Link */\n @Prop({ reflect: true }) href: string;\n\n /** Rel (if href is used) */\n @Prop() rel: string;\n\n /** Target (if href is used) */\n @Prop() target: string;\n\n /** Download attribute of link (if `href` used) */\n @Prop() download: string;\n\n /** Leading icon */\n @Prop() leadingIcon: string;\n\n /** Icon of action button (if href is used, will only be for presentation) */\n @Prop() icon: string;\n\n /** Icon position */\n @Prop() iconPosition: \"left\" | \"right\" = \"right\";\n\n /** Overwrite aria-label of action button (default aria label is `label` and `value`). */\n @Prop() iconLabel: string;\n\n /** Tooltip content of action button. Overwrites aria-label (set by default or `iconLabel`) of action button. */\n @Prop() iconTooltip: string;\n\n /** Href of action button */\n @Prop() iconHref: string;\n\n /** Label */\n @Prop() label: string = \"\";\n\n /** Value (or use value slot instead) */\n @Prop() value: string = \"\";\n\n /** Whether value should be truncate or not */\n @Prop() valueTruncate: boolean = false; \n\n /** Readspeaker label */\n @Prop() readspeakerLabel: string = \"\";\n\n /** Readspeaker link */\n @Prop() readspeakerHref: string = \"\";\n\n /** Meta */\n @Prop({ reflect: true }) meta: string | string[] = \"\";\n private _meta: string[] = [];\n\n /** Status Label */\n @Prop({ reflect: true }) statusLabel: string = \"\";\n\n /** Status Type */\n @Prop() statusType: StzhStatusType = \"default\";\n\n /** Aria expanded of link/button */\n @Prop({ reflect: true, attribute: \"a11y-expanded\" }) a11yExpanded: boolean;\n\n /** Aria controls of link/button */\n @Prop({ attribute: \"a11y-controls\" }) a11yControls: string;\n\n /** Item action click event */\n @Event() stzhItemActionClick: EventEmitter<StzhDatalistItemActionClickEvent>;\n\n /** Item click event */\n @Event() stzhClick: EventEmitter<StzhDatalistItemClickEvent>;\n\n @Element() element: HTMLStzhDatalistItemElement;\n\n @Watch(\"meta\")\n metaWatcher(newValue: string[] | string) {\n if (typeof newValue === \"string\") {\n try {\n this._meta = JSON.parse(newValue);\n } catch (ex) {\n this._meta = newValue === \"\" ? [] : [newValue];\n }\n } else {\n this._meta = newValue;\n }\n }\n\n @Watch(\"rel\")\n externalWatcher() {\n this.external = this.rel && this.rel.includes(\"external\");\n }\n\n @Watch(\"href\")\n hrefWatcher() {\n this.isPhone = this.href && (this.href.startsWith(\"tel:\") || this.href.startsWith(\"fax:\"));\n }\n\n @State() direction: StzhDatalistDirection = \"vertical\";\n @State() variant: StzhDatalistVariant = \"default\";\n @State() bigLabel: boolean = false;\n\n private external: boolean = false;\n private isPhone: boolean = false;\n private datalist: HTMLStzhDatalistElement;\n private datalistItemId: string;\n\n private onActionClick = (originalEvent: MouseEvent) => {\n this.stzhItemActionClick.emit({\n component: \"stzh-datalist-item\",\n originalEvent,\n });\n };\n\n private onClick = (event: MouseEvent) => {\n this.stzhClick.emit({\n component: \"stzh-datalist-item\",\n originalEvent: event,\n href: this.href,\n });\n };\n\n private handleDirectionChange = (event: CustomEvent<StzhDatalistDirectionChangeEvent>) => {\n this.direction = event.detail.value;\n };\n\n private handleVariantChange = (event: CustomEvent<StzhDatalistVariantChangeEvent>) => {\n this.variant = event.detail.value;\n };\n\n private handleBigLabelChange = (event: CustomEvent<StzhDatalistBigLabelChangeEvent>) => {\n this.bigLabel = event.detail.value;\n };\n\n private addWordBreakToLinks() {\n const links = Array.from(\n this.element?.getElementsByClassName(\"stzh-datalist-item__value-text\") || []\n );\n addWordBreakToLinks(links as HTMLElement[]);\n }\n\n private renderInner(isButton: boolean, hasActionButton: boolean): DocumentFragment {\n const Item = isButton ? \"button\" : this.href ? \"a\" : \"div\";\n\n const Icon = () => (\n <Fragment>\n {(this.href || this.icon) && !hasActionButton && !isButton && (\n <div class=\"stzh-datalist-item__label-icon\">\n <stzh-icon\n class=\"stzh-datalist-item__icon\"\n name={this.icon ? this.icon : this.isPhone ? \"phone\" : this.external && \"external-link\"}\n ></stzh-icon>\n </div>\n )}\n\n {isButton && (\n <div class=\"stzh-datalist-item__label-icon\">\n <stzh-icon class=\"stzh-datalist-item__icon is-closed\" name={this.icon ? this.icon : \"plus\"}></stzh-icon>\n <stzh-icon class=\"stzh-datalist-item__icon is-open\" name={this.icon ? this.icon : \"minus\"}></stzh-icon>\n </div>\n )}\n </Fragment>\n );\n\n return (\n <Fragment>\n {this.variant === \"table\" && (\n <Item\n aria-hidden={this.label ? null : \"true\"}\n tabindex=\"-1\"\n id={`${this.datalistItemId}-label`}\n class={{\n \"stzh-datalist-item__label\": true,\n \"is-button\": isButton,\n \"is-link\": !!this.href,\n }}\n href={this.href}\n rel={this.rel}\n target={this.target}\n download={this.download}\n onClick={this.onClick}\n >\n {this.label}\n </Item>\n )}\n\n <Item\n id={`${this.datalistItemId}-value`}\n class={{\n \"stzh-datalist-item__value\": true,\n \"is-button\": isButton,\n \"is-link\": !!this.href,\n }}\n href={this.href}\n rel={this.rel}\n target={this.target}\n download={this.download}\n // aria-labelledby={Item !== 'div' ? `${this.datalistItemId}-label ${this.datalistItemId}-value ${this.datalistItemId}-meta` : null}\n aria-labelledby={\n Item !== \"div\"\n ? `${this.variant === \"table\" ? `${this.datalistItemId}-label` : \"\"} ${this.datalistItemId}-value ${\n this.datalistItemId\n }-meta`\n : null\n }\n aria-controls={this.a11yControls || null}\n aria-expanded={typeof this.a11yExpanded !== \"undefined\" ? (this.a11yExpanded ? \"true\" : \"false\") : null}\n onClick={this.onClick}\n >\n {this.variant === \"default\" && <div class=\"stzh-datalist-item__label\">{this.label}</div>}\n\n {this.external && (\n <div class=\"stzh-datalist-item__vhidden\">{this.localization.$globals.externalLinkLabel}</div>\n )}\n {this.download && (\n <div class=\"stzh-datalist-item__vhidden\">{this.localization.$globals.downloadLinkLabel}</div>\n )}\n\n <div class=\"stzh-datalist-item__value-wrapper\">\n {this.iconPosition === \"left\" && <Icon></Icon>}\n {this.value ? (\n <stzh-text curve=\"none\" class=\"stzh-datalist-item__value-text\" innerHTML={this.value}></stzh-text>\n ) : (\n <stzh-text curve=\"none\" class=\"stzh-datalist-item__value-text\">\n <slot name=\"value\"></slot>\n </stzh-text>\n )}\n {this.iconPosition === \"right\" && <Icon></Icon>}\n </div>\n </Item>\n\n <Item\n aria-hidden={this.statusLabel || this._meta.length > 0 ? null : \"true\"}\n tabindex=\"-1\"\n id={`${this.datalistItemId}-meta`}\n class={{\n \"stzh-datalist-item__meta\": true,\n \"is-button\": isButton,\n \"is-link\": !!this.href,\n }}\n href={this.href}\n rel={this.rel}\n target={this.target}\n download={this.download}\n onClick={this.onClick}\n >\n {this.statusLabel && (\n <stzh-status\n class=\"stzh-datalist-item__meta-status\"\n label={this.statusLabel}\n type={this.statusType}\n ></stzh-status>\n )}\n {this._meta.length > 0 && (\n <span class=\"stzh-datalist-item__meta-text\">\n {this._meta.map((meta, index) => (\n <Fragment>\n <span class=\"stzh-datalist-item__meta-text-inner\">{meta}</span>\n {index + 1 !== this._meta.length && <span class=\"stzh-datalist-item__meta-separator\">|</span>}\n </Fragment>\n ))}\n </span>\n )}\n </Item>\n\n {this.readspeakerHref && this.readspeakerLabel && (\n <stzh-button\n class=\"stzh-datalist-item__readspeaker\"\n variant=\"tertiary-plain\"\n no-padding-left=\"true\"\n no-padding-right=\"true\"\n icon-position=\"right\"\n icon=\"volume-medium\"\n size=\"small\"\n href={this.readspeakerHref}\n target=\"_blank\"\n >\n {this.readspeakerLabel}\n </stzh-button>\n )}\n </Fragment>\n );\n }\n\n private renderLeadingIcon(isButton: boolean): HTMLElement {\n const Item = isButton ? \"button\" : this.href ? \"a\" : \"div\";\n\n return (\n <Item\n role=\"presentation\"\n aria-hidden=\"true\"\n tabindex=\"-1\"\n class={{\n \"stzh-datalist-item__leading\": true,\n \"is-button\": isButton,\n \"is-link\": !!this.href,\n }}\n href={this.href}\n rel={this.rel}\n target={this.target}\n download={this.download}\n onClick={this.onClick}\n >\n {this.leadingIcon && (\n <div class=\"stzh-datalist-item__leading-icon-container\">\n <stzh-icon class=\"stzh-datalist-item__leading-icon\" name={this.leadingIcon}></stzh-icon>\n </div>\n )}\n </Item>\n );\n }\n\n async componentDidLoad() {\n // execute connectedCallbck again, because sometimes has problem rendering\n this.connectedCallback();\n this.addWordBreakToLinks();\n }\n\n async componentWillLoad() {\n this.datalistItemId = `stzh-datalist-item-${datalistItemCounter++}`;\n this.metaWatcher(this.meta);\n this.externalWatcher();\n this.hrefWatcher();\n\n if (!this.localization) {\n this.localization = await window.stzhComponents.utils.fetchTranslations(this.element, \"datalist-item\");\n }\n }\n\n async connectedCallback() {\n this.datalist = this.element.closest(\"stzh-datalist\");\n\n if (this.datalist) {\n this.variant = this.datalist.variant;\n this.bigLabel = this.datalist.bigLabel;\n this.direction = await this.datalist.getCurrentDirection();\n\n this.datalist?.addEventListener(\"stzhDirectionChange\", this.handleDirectionChange);\n this.datalist?.addEventListener(\"stzhVariantChange\", this.handleVariantChange);\n this.datalist?.addEventListener(\"stzhBigLabelChange\", this.handleBigLabelChange);\n }\n }\n\n disconnectedCallback() {\n if (this.datalist) {\n this.datalist?.removeEventListener(\"stzhDirectionChange\", this.handleDirectionChange);\n this.datalist?.removeEventListener(\"stzhVariantChange\", this.handleVariantChange);\n this.datalist?.removeEventListener(\"stzhBigLabelChange\", this.handleBigLabelChange);\n this.datalist = null;\n }\n }\n\n render() {\n const isButton = typeof this.a11yExpanded !== \"undefined\" || typeof this.a11yControls !== \"undefined\";\n\n const hasActionButton = !!((!this.href || this.iconHref || this.iconTooltip) && this.icon);\n\n const classes = {\n \"stzh-datalist-item\": true,\n \"stzh-datalist-item--is-interactive\": !!this.href || isButton,\n \"stzh-datalist-item--is-link\": !!this.href,\n \"stzh-datalist-item--is-button\": isButton,\n \"stzh-datalist-item--is-expanded\": this.a11yExpanded,\n \"stzh-datalist-item--big-label\": this.bigLabel,\n [`stzh-datalist-item--direction-${this.direction}`]: !!this.direction && this.variant === \"default\",\n [`stzh-datalist-item--${this.variant}`]: !!this.variant,\n };\n\n let ActionItem = isButton ? \"button\" : hasActionButton ? \"div\" : \"a\";\n\n const ActionButton = () => {\n return (\n <stzh-button\n class={{\n \"stzh-datalist-item__action\": true,\n \"is-button\": true,\n }}\n variant=\"tertiary\"\n size=\"small\"\n aria-label={this.iconLabel}\n iconOnly={true}\n href={this.iconHref}\n icon={this.icon}\n onClick={this.onActionClick}\n ></stzh-button>\n );\n };\n\n return (\n <Host role=\"listitem\" class={{'value-truncate': this.valueTruncate}}>\n <div class={classes}>\n {this.direction === \"horizontal\" || this.variant === \"table\" ? (\n <Fragment>\n {this.renderLeadingIcon(isButton)}\n {this.renderInner(isButton, hasActionButton)}\n </Fragment>\n ) : (\n <Fragment>\n {this.renderLeadingIcon(isButton)}\n <div class=\"stzh-datalist-item__wrapper\">{this.renderInner(isButton, hasActionButton)}</div>\n </Fragment>\n )}\n <ActionItem\n role={hasActionButton ? null : \"presentation\"}\n aria-hidden={hasActionButton ? null : \"true\"}\n tabindex=\"-1\"\n class={{\n \"stzh-datalist-item__action-list\": true,\n \"is-button\": isButton,\n \"is-link\": !!this.href && !this.iconHref,\n }}\n href={!this.iconHref ? this.href : null}\n rel={!this.iconHref ? this.rel : null}\n target={!this.iconHref ? this.target : null}\n download={!this.iconHref ? this.download : null}\n >\n {hasActionButton &&\n (this.iconTooltip ? (\n <stzh-tooltip content={this.iconTooltip}>{ActionButton()}</stzh-tooltip>\n ) : (\n ActionButton()\n ))}\n </ActionItem>\n\n <div class=\"stzh-datalist-item__spacer\"></div>\n </div>\n\n <div class=\"stzh-datalist-item__nested\">\n <div class=\"stzh-datalist-item__nested-inner\">\n <slot></slot>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/components/{p-7d72e50c.js → p-fd0fbd98.js} RENAMED Viewed

@@ -4042,7 +4042,7 @@ const StzhSortable = /*@__PURE__*/ proxyCustomElement(class StzhSortable extends
             "stzh-sortable": true,
             "stzh-sortable--disabled": this.disabled,
         };
-        return (h(Host, { key: '070d1c60a725357990f0f00a347fb3eb2064c77f' }, h("div", { key: '279fc104c35941bdd118aa1a89256d44c60fa582', class: classes }, !this.disabled && (h("div", { key: '0a23fc3f116f6b22b69e3c04ba63d3bbf029fcf6', id: `${this.sortableId}-description`, class: "stzh-sortable__description" }, this.localization.description)), h("div", { key: '3cfe6856d9594854f58517143bf223f537d53082', ref: el => (this.ariaLiveElement = el), "aria-live": "assertive", class: "stzh-sortable__aria-live" }), h("div", { key: 'be91474f7e42c5d212722fb5c6f021765f0a65c5', ref: el => (this.containerElement = el), class: "stzh-sortable__container" }, h("slot", { key: '7e6a289218b4cdbbe01ac4a464e2b99624fd245d' })))));
+        return (h(Host, { key: '67ffd0187f08c6b7d6061c9b4f452ced46fb2ff3' }, h("div", { key: 'bc675ebe02a5992304118b63570962d802e1a2ae', class: classes }, !this.disabled && (h("div", { key: '2186234ed2173ad739fbb1b6bd8a259f51885ec5', id: `${this.sortableId}-description`, class: "stzh-sortable__description" }, this.localization.description)), h("div", { key: 'ba6373028dd95117a3f1274b6f9ddfa1ddecb99e', ref: el => (this.ariaLiveElement = el), "aria-live": "assertive", class: "stzh-sortable__aria-live" }), h("div", { key: '9678063c30d08200a1df0934b6452edc3d306c67', ref: el => (this.containerElement = el), class: "stzh-sortable__container" }, h("slot", { key: '64f4e657de3dd8934d350eb9b0b8d434f62a3476' })))));
     }
     get element() { return this; }
     static get watchers() { return {
@@ -4080,4 +4080,4 @@ function defineCustomElement() {
 export { StzhSortable as S, defineCustomElement as d };
-//# sourceMappingURL=p-7d72e50c.js.map
+//# sourceMappingURL=p-fd0fbd98.js.map