@oiz/stzh-components 3.8.0 → 3.8.2

package/dist/components/{p-b85a6b2e.js.map → p-05fdea9d.js.map}

@@ -1 +1 @@
-{"file":"p-b85a6b2e.js","mappings":"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","names":[],"sources":["src/components/stzh-menu-item/stzh-menu-item.scss?tag=stzh-menu-item&encapsulation=scoped","src/components/stzh-menu-item/stzh-menu-item.tsx"],"sourcesContent":["/**\n * @prop --height: Height of item\n * @prop --icon-size: Size of icon next to item\n * @prop --color: Color of item\n * @prop --background-color: Background color of item\n * @prop --hover-color: Hover color of item\n * @prop --hover-background-color: Hover background color of item\n *\n * @prop --stzh-menu-item-height: **Global**: Height of items\n */\n\n:host {\n  --height: var(--stzh-menu-item-height);\n  --color: #{$colorBlack};\n  --background-color: transparent;\n  --icon-size: #{iconSize('small')};\n  --padding-top: #{space('xsmall')};\n  --padding-bottom: #{space('xsmall')};\n  --padding-left: #{space('large')};\n  --padding-right: #{space('large')};\n\n  --hover-color: #{$colorBlack};\n  --hover-background-color: #{$colorGrey20};\n\n  &[size=\"large\"] {\n    --icon-size: #{iconSize()};\n    --height: var(--stzh-menu-large-item-height);\n    --padding-left: #{space('xlarge')};\n    --padding-right: #{space('xlarge')};\n  }\n\n  &[variant=\"secondary\"] {\n    --color: #{$colorPrimary70};\n\n    --hover-color: #{$colorPrimary70};\n    --hover-background-color: #{$colorSecondary30};\n  }\n\n  &[active]:not([active=\"false\"]) {\n    --color: #{$colorPrimary70};\n    --hover-color: #{$colorPrimary70};\n    --hover-background-color: #{$colorGrey20};\n  }\n\n  &[disabled]:not([disabled=\"false\"]) {\n    --color: #{$colorGrey70};\n    --background-color: #{$colorGrey10};\n\n    --hover-color: #{$colorGrey70};\n    --hover-background-color: #{$colorGrey10};\n  }\n}\n\n.stzh-menu-item {\n  @include fontSize('micro');\n  font-family: inherit;\n  display: flex;\n  gap: space('small');\n  align-items: center;\n  justify-content: stretch;\n  appearance: none;\n  text-decoration-line: none;\n  border: none;\n  padding-top: var(--padding-top);\n  padding-bottom: var(--padding-bottom);\n  padding-left: var(--padding-left);\n  padding-right: var(--padding-right);\n  color: var(--color);\n  background-color: var(--background-color);\n  width: 100%;\n  height: var(--height);\n  line-height: var(--height);\n  transition-duration: $baseTransitionAnimationSpeed;\n  transition-property: color, background-color, border-color;\n  cursor: pointer;\n\n  &:hover {\n    color: var(--hover-color);\n    background-color: var(--hover-background-color);\n  }\n\n  &__icon-wrapper {\n    --stzh-icon-size: var(--icon-size);\n\n    position: relative;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    width: auto;\n    height: 1em;\n  }\n\n  &__badge {\n    position: absolute;\n    z-index: 1;\n    top: calc(#{space('xsmall')} * -1);\n    right: calc(#{space('xsmall')} * -1);\n  }\n\n  &__text-wrapper {\n    display: flex;\n    gap: space('xsmall');\n  }\n\n  &__counter {\n    @include font;\n  }\n\n  &__text {\n    @include truncate;\n  }\n\n  /* Large variant */\n\n  &--size-large {\n    @include fontSize('milli');\n    gap: space('medium');\n  }\n\n  /* Disabled variant */\n\n  &--is-disabled {\n    cursor: not-allowed;\n  }\n}\n","import { Component, Host, h, Prop, Element, Fragment, Event, EventEmitter } from \"@stencil/core\";\n\nimport {\n  StzhMenuItemFocusEvent,\n  StzhMenuItemBlurEvent,\n  StzhMenuItemClickEvent,\n  StzhBadgeType,\n  StzhMenuSize,\n  StzhMenuVariant,\n} from \"../../index\";\n\nimport { hasSlot } from \"../../utils/utils\";\n\n/**\n * @slot - Slot for any content\n * @slot icon - Slot for `stzh-icon` element\n */\n@Component({\n  tag: \"stzh-menu-item\",\n  styleUrl: \"stzh-menu-item.scss\",\n  scoped: true,\n})\nexport class StzhMenuItem {\n  /** Variant */\n  @Prop({ reflect: true }) variant: StzhMenuVariant = \"default\";\n\n  /** Size */\n  @Prop({ reflect: true }) size: StzhMenuSize = \"default\";\n\n  /** Counter */\n  @Prop() counter: number;\n\n  /** Badge (only displayed if `icon` property or icon slot is used) */\n  @Prop() badge: string = \"\";\n\n  /** Badge type */\n  @Prop({ reflect: true }) badgeType: StzhBadgeType = \"default\";\n\n  /** Whether badge should be displayed empty */\n  @Prop({ reflect: true }) badgeEmpty: boolean = false;\n\n  /** Whether the button is disabled */\n  @Prop({ reflect: true }) disabled: boolean = false;\n\n  /** Whether the button is active */\n  @Prop({ reflect: true }) active: boolean = false;\n\n  /** Icon (use instead of icon slot) */\n  @Prop() icon: string = \"\";\n\n  /** Label */\n  @Prop() label: string = \"\";\n\n  /** `href` if the button should be used as link  */\n  @Prop() href: string = \"\";\n\n  /** Target if the button is used as link (if `href` used)  */\n  @Prop() target: string = \"\";\n\n  /** Accessible label for screen readers to replace visible text */\n  @Prop({ attribute: \"a11y-label\" }) a11yLabel: string;\n\n  /**\n   * For Adobe Analytics.\n   * Will be rendered as value of `s-object-id` attribute to the link/button element.\n   * Default value will be taken from `label` prop or default slot.\n   */\n  @Prop() analyticsId: string;\n\n  @Element() element: HTMLStzhMenuItemElement;\n\n  /** Focus event */\n  @Event() stzhFocus: EventEmitter<StzhMenuItemFocusEvent>;\n\n  /** Blur event */\n  @Event() stzhBlur: EventEmitter<StzhMenuItemBlurEvent>;\n\n  /** Click event */\n  @Event() stzhClick: EventEmitter<StzhMenuItemClickEvent>;\n\n  private menuItem: HTMLButtonElement | HTMLAnchorElement;\n  private text: HTMLDivElement;\n\n  private focusedByInput: boolean = false;\n\n  private onRootFocus = () => {\n    if (!this.focusedByInput) {\n      this.menuItem.focus();\n    }\n\n    this.focusedByInput = false;\n  };\n\n  private onFocus = (event: FocusEvent) => {\n    this.focusedByInput = true;\n\n    const focusEvent = new FocusEvent(\"focus\", {\n      view: window,\n      bubbles: false,\n      cancelable: false,\n    });\n\n    this.element.dispatchEvent(focusEvent);\n    this.stzhFocus.emit({\n      component: \"stzh-menu-item\",\n      originalEvent: event,\n    });\n  };\n\n  private onBlur = (event: FocusEvent) => {\n    const blurEvent = new FocusEvent(\"blur\", {\n      view: window,\n      bubbles: false,\n      cancelable: false,\n    });\n\n    this.element.dispatchEvent(blurEvent);\n    this.stzhBlur.emit({\n      component: \"stzh-menu-item\",\n      originalEvent: event,\n    });\n  };\n\n  private onClick = (event: MouseEvent) => {\n    this.stzhClick.emit({\n      component: \"stzh-menu-item\",\n      originalEvent: event,\n      href: this.href,\n    });\n  };\n\n  componentDidRender() {\n    requestAnimationFrame(() => {\n      this.menuItem?.setAttribute(\"s-object-id\", this.analyticsId || this.text.innerText);\n    });\n  }\n\n  private renderInner(iconUsed: boolean): DocumentFragment {\n    return (\n      <Fragment>\n        {iconUsed && (\n          <div class=\"stzh-menu-item__icon-wrapper\">\n            {this.icon ? (\n              <stzh-icon class=\"stzh-menu-item__icon\" name={this.icon}></stzh-icon>\n            ) : (\n              <slot name=\"icon\"></slot>\n            )}\n            {(this.badge || this.badgeEmpty) && (\n              <stzh-badge class=\"stzh-menu-item__badge\" label={this.badge} type={this.badgeType}></stzh-badge>\n            )}\n          </div>\n        )}\n        <div class=\"stzh-menu-item__text-wrapper\">\n          <div ref={el => (this.text = el as HTMLDivElement)} class=\"stzh-menu-item__text\">\n            {this.label ? this.label : <slot></slot>}\n          </div>\n          {this.counter !== undefined && this.counter > 0 && (\n            <div class=\"stzh-menu-item__counter\">({this.counter})</div>\n          )}\n        </div>\n      </Fragment>\n    );\n  }\n\n  render() {\n    const iconUsed: boolean = hasSlot(this.element, \"icon\") || !!this.icon;\n    const classes = {\n      \"stzh-menu-item\": true,\n      \"stzh-menu-item--has-icon\": iconUsed,\n      \"stzh-menu-item--has-badge\": !!this.badge,\n      \"stzh-menu-item--is-disabled\": this.disabled,\n      \"stzh-menu-item--is-active\": this.active,\n      [`stzh-menu-item--size-${this.size}`]: !!this.size,\n      [`stzh-menu-item--${this.variant}`]: !!this.variant,\n    };\n\n    return (\n      <Host role=\"menuitem\" tabindex={this.disabled ? null : \"-1\"} onFocus={this.onRootFocus}>\n        {this.href ? (\n          <a\n            ref={el => (this.menuItem = el as HTMLAnchorElement)}\n            href={this.disabled ? null : this.href}\n            target={this.target}\n            class={classes}\n            aria-label={this.a11yLabel || null}\n            onFocus={this.onFocus}\n            onBlur={this.onBlur}\n            onClick={this.onClick}\n          >\n            {this.renderInner(iconUsed)}\n          </a>\n        ) : (\n          <button\n            ref={el => (this.menuItem = el as HTMLButtonElement)}\n            class={classes}\n            type=\"button\"\n            disabled={this.disabled}\n            aria-label={this.a11yLabel || null}\n            onFocus={this.onFocus}\n            onBlur={this.onBlur}\n            onClick={this.onClick}\n          >\n            {this.renderInner(iconUsed)}\n          </button>\n        )}\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"p-05fdea9d.js","mappings":"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","names":[],"sources":["src/components/stzh-menu-item/stzh-menu-item.scss?tag=stzh-menu-item&encapsulation=scoped","src/components/stzh-menu-item/stzh-menu-item.tsx"],"sourcesContent":["/**\n * @prop --height: Height of item\n * @prop --icon-size: Size of icon next to item\n * @prop --color: Color of item\n * @prop --background-color: Background color of item\n * @prop --hover-color: Hover color of item\n * @prop --hover-background-color: Hover background color of item\n *\n * @prop --stzh-menu-item-height: **Global**: Height of items\n */\n\n:host {\n  --height: var(--stzh-menu-item-height);\n  --color: #{$colorBlack};\n  --background-color: transparent;\n  --icon-size: #{iconSize('small')};\n  --padding-top: #{space('xsmall')};\n  --padding-bottom: #{space('xsmall')};\n  --padding-left: #{space('large')};\n  --padding-right: #{space('large')};\n\n  --hover-color: #{$colorBlack};\n  --hover-background-color: #{$colorGrey20};\n\n  &[size=\"large\"] {\n    --icon-size: #{iconSize()};\n    --height: var(--stzh-menu-large-item-height);\n    --padding-left: #{space('xlarge')};\n    --padding-right: #{space('xlarge')};\n  }\n\n  &[variant=\"secondary\"] {\n    --color: #{$colorPrimary70};\n\n    --hover-color: #{$colorPrimary70};\n    --hover-background-color: #{$colorSecondary30};\n  }\n\n  &[active]:not([active=\"false\"]) {\n    --color: #{$colorPrimary70};\n    --hover-color: #{$colorPrimary70};\n    --hover-background-color: #{$colorGrey20};\n  }\n\n  &[disabled]:not([disabled=\"false\"]) {\n    --color: #{$colorGrey70};\n    --background-color: #{$colorGrey10};\n\n    --hover-color: #{$colorGrey70};\n    --hover-background-color: #{$colorGrey10};\n  }\n}\n\n.stzh-menu-item {\n  @include fontSize('micro');\n  font-family: inherit;\n  display: flex;\n  gap: space('small');\n  align-items: center;\n  justify-content: stretch;\n  appearance: none;\n  text-decoration-line: none;\n  border: none;\n  padding-top: var(--padding-top);\n  padding-bottom: var(--padding-bottom);\n  padding-left: var(--padding-left);\n  padding-right: var(--padding-right);\n  color: var(--color);\n  background-color: var(--background-color);\n  width: 100%;\n  height: var(--height);\n  line-height: var(--height);\n  transition-duration: $baseTransitionAnimationSpeed;\n  transition-property: color, background-color, border-color;\n  cursor: pointer;\n\n  &:hover {\n    color: var(--hover-color);\n    background-color: var(--hover-background-color);\n  }\n\n  &__icon-wrapper {\n    --stzh-icon-size: var(--icon-size);\n\n    position: relative;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    width: auto;\n    height: 1em;\n  }\n\n  &__badge {\n    position: absolute;\n    z-index: 1;\n    top: calc(#{space('xsmall')} * -1);\n    right: calc(#{space('xsmall')} * -1);\n  }\n\n  &__text-wrapper {\n    display: flex;\n    gap: space('xsmall');\n  }\n\n  &__counter {\n    @include font;\n  }\n\n  &__text {\n    @include truncate;\n  }\n\n  /* Large variant */\n\n  &--size-large {\n    @include fontSize('milli');\n    gap: space('medium');\n  }\n\n  /* Disabled variant */\n\n  &--is-disabled {\n    cursor: not-allowed;\n  }\n}\n","import { Component, Host, h, Prop, Element, Fragment, Event, EventEmitter } from \"@stencil/core\";\n\nimport {\n  StzhMenuItemFocusEvent,\n  StzhMenuItemBlurEvent,\n  StzhMenuItemClickEvent,\n  StzhBadgeType,\n  StzhMenuSize,\n  StzhMenuVariant,\n} from \"../../index\";\n\nimport { hasSlot } from \"../../utils/utils\";\n\n/**\n * @slot - Slot for any content\n * @slot icon - Slot for `stzh-icon` element\n */\n@Component({\n  tag: \"stzh-menu-item\",\n  styleUrl: \"stzh-menu-item.scss\",\n  scoped: true,\n})\nexport class StzhMenuItem {\n  /** Variant */\n  @Prop({ reflect: true }) variant: StzhMenuVariant = \"default\";\n\n  /** Size */\n  @Prop({ reflect: true }) size: StzhMenuSize = \"default\";\n\n  /** Counter */\n  @Prop() counter: number;\n\n  /** Badge (only displayed if `icon` property or icon slot is used) */\n  @Prop() badge: string = \"\";\n\n  /** Badge type */\n  @Prop({ reflect: true }) badgeType: StzhBadgeType = \"default\";\n\n  /** Whether badge should be displayed empty */\n  @Prop({ reflect: true }) badgeEmpty: boolean = false;\n\n  /** Whether the button is disabled */\n  @Prop({ reflect: true }) disabled: boolean = false;\n\n  /** Whether the button is active */\n  @Prop({ reflect: true }) active: boolean = false;\n\n  /** Icon (use instead of icon slot) */\n  @Prop() icon: string = \"\";\n\n  /** Label */\n  @Prop() label: string = \"\";\n\n  /** `href` if the button should be used as link  */\n  @Prop() href: string = \"\";\n\n  /** Target if the button is used as link (if `href` used)  */\n  @Prop() target: string = \"\";\n\n  /** Accessible label for screen readers to replace visible text */\n  @Prop({ attribute: \"a11y-label\" }) a11yLabel: string;\n\n  /**\n   * For Adobe Analytics.\n   * Will be rendered as value of `s-object-id` attribute to the link/button element.\n   * Default value will be taken from `label` prop or default slot.\n   */\n  @Prop() analyticsId: string;\n\n  @Element() element: HTMLStzhMenuItemElement;\n\n  /** Focus event */\n  @Event() stzhFocus: EventEmitter<StzhMenuItemFocusEvent>;\n\n  /** Blur event */\n  @Event() stzhBlur: EventEmitter<StzhMenuItemBlurEvent>;\n\n  /** Click event */\n  @Event() stzhClick: EventEmitter<StzhMenuItemClickEvent>;\n\n  private menuItem: HTMLButtonElement | HTMLAnchorElement;\n  private text: HTMLDivElement;\n\n  private focusedByInput: boolean = false;\n\n  private onRootFocus = () => {\n    if (!this.focusedByInput) {\n      this.menuItem.focus();\n    }\n\n    this.focusedByInput = false;\n  };\n\n  private onFocus = (event: FocusEvent) => {\n    this.focusedByInput = true;\n\n    const focusEvent = new FocusEvent(\"focus\", {\n      view: window,\n      bubbles: false,\n      cancelable: false,\n    });\n\n    this.element.dispatchEvent(focusEvent);\n    this.stzhFocus.emit({\n      component: \"stzh-menu-item\",\n      originalEvent: event,\n    });\n  };\n\n  private onBlur = (event: FocusEvent) => {\n    const blurEvent = new FocusEvent(\"blur\", {\n      view: window,\n      bubbles: false,\n      cancelable: false,\n    });\n\n    this.element.dispatchEvent(blurEvent);\n    this.stzhBlur.emit({\n      component: \"stzh-menu-item\",\n      originalEvent: event,\n    });\n  };\n\n  private onClick = (event: MouseEvent) => {\n    this.stzhClick.emit({\n      component: \"stzh-menu-item\",\n      originalEvent: event,\n      href: this.href,\n    });\n  };\n\n  componentDidRender() {\n    requestAnimationFrame(() => {\n      this.menuItem?.setAttribute(\"s-object-id\", this.analyticsId || this.text.innerText);\n    });\n  }\n\n  private renderInner(iconUsed: boolean): DocumentFragment {\n    return (\n      <Fragment>\n        {iconUsed && (\n          <div class=\"stzh-menu-item__icon-wrapper\">\n            {this.icon ? (\n              <stzh-icon class=\"stzh-menu-item__icon\" name={this.icon}></stzh-icon>\n            ) : (\n              <slot name=\"icon\"></slot>\n            )}\n            {(this.badge || this.badgeEmpty) && (\n              <stzh-badge class=\"stzh-menu-item__badge\" label={this.badge} type={this.badgeType}></stzh-badge>\n            )}\n          </div>\n        )}\n        <div class=\"stzh-menu-item__text-wrapper\">\n          <div ref={el => (this.text = el as HTMLDivElement)} class=\"stzh-menu-item__text\">\n            {this.label ? this.label : <slot></slot>}\n          </div>\n          {this.counter !== undefined && this.counter > 0 && (\n            <div class=\"stzh-menu-item__counter\">({this.counter})</div>\n          )}\n        </div>\n      </Fragment>\n    );\n  }\n\n  render() {\n    const iconUsed: boolean = hasSlot(this.element, \"icon\") || !!this.icon;\n    const classes = {\n      \"stzh-menu-item\": true,\n      \"stzh-menu-item--has-icon\": iconUsed,\n      \"stzh-menu-item--has-badge\": !!this.badge,\n      \"stzh-menu-item--is-disabled\": this.disabled,\n      \"stzh-menu-item--is-active\": this.active,\n      [`stzh-menu-item--size-${this.size}`]: !!this.size,\n      [`stzh-menu-item--${this.variant}`]: !!this.variant,\n    };\n\n    return (\n      <Host role=\"menuitem\" tabindex={this.disabled ? null : \"-1\"} onFocus={this.onRootFocus}>\n        {this.href ? (\n          <a\n            ref={el => (this.menuItem = el as HTMLAnchorElement)}\n            href={this.disabled ? null : this.href}\n            target={this.target}\n            class={classes}\n            aria-label={this.a11yLabel || null}\n            onFocus={this.onFocus}\n            onBlur={this.onBlur}\n            onClick={this.onClick}\n          >\n            {this.renderInner(iconUsed)}\n          </a>\n        ) : (\n          <button\n            ref={el => (this.menuItem = el as HTMLButtonElement)}\n            class={classes}\n            type=\"button\"\n            disabled={this.disabled}\n            aria-label={this.a11yLabel || null}\n            onFocus={this.onFocus}\n            onBlur={this.onBlur}\n            onClick={this.onClick}\n          >\n            {this.renderInner(iconUsed)}\n          </button>\n        )}\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p-073888ce.js → p-095fbf73.js}

@@ -55,6 +55,11 @@ function setPropsIfNull(element, attributes) {
     }
   });
 }
+function setProps(element, attributes) {
+  Object.keys(attributes).forEach((attribute) => {
+    element[attribute] = attributes[attribute];
+  });
+}
 function isStzhElement(element) {
   if (!element || element.nodeType !== 1) {
     return false;
@@ -88,7 +93,7 @@ function isVisible(element) {
     // @ts-ignore
     return element.checkVisibility({
       checkOpacity: false,
-      checkVisibilityCSS: false,
+      checkVisibilityCSS: false
     });
   }
   else {
@@ -105,7 +110,7 @@ function offset(element) {
   let win = element.ownerDocument.defaultView;
   return {
     top: rect.top + win.pageYOffset,
-    left: rect.left + win.pageXOffset,
+    left: rect.left + win.pageXOffset
   };
 }
 async function raf() {
@@ -203,6 +208,6 @@ function addWordBreakToLinks(links) {
 //   return [clonedElement, clonedStzhElement, originalStzhElement];
 // }
 
-export { addWordBreakToLinks as a, isVisible as b, camelCase as c, abbreviateText as d, getStzhEnvironment as e, createParagraphsFromBrs as f, getMeta as g, hasSlot as h, isStzhElement as i, offset as o, raf as r, setPropsIfNull as s };
+export { addWordBreakToLinks as a, isVisible as b, camelCase as c, abbreviateText as d, setProps as e, getStzhEnvironment as f, getMeta as g, hasSlot as h, isStzhElement as i, createParagraphsFromBrs as j, offset as o, raf as r, setPropsIfNull as s };
 
-//# sourceMappingURL=p-073888ce.js.map
+//# sourceMappingURL=p-095fbf73.js.map

package/dist/components/p-095fbf73.js.map

@@ -0,0 +1 @@
+{"file":"p-095fbf73.js","mappings":"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","names":[],"sources":["src/utils/string-utils.ts","src/utils/utils.ts"],"sourcesContent":["export function createParagraphsFromBrs(content: string) {\n  const replaced = content\n    .replace(/^\\s*(?:<br\\s*\\/?>\\s*)*/i, \"\")\n    .replace(/\\s*(?:<br\\s*\\/?>\\s*)*$/i, \"\")\n    .replace(/(?:<br\\s*\\/?>\\s*?){2,}/gi, \"</p><p>\");\n\n  return `<p>${replaced}</p>`;\n}\n\nexport function camelCase(dashString: string) {\n  return dashString\n    .replace(/-([a-z])/g, function (g) {\n      return g[1].toUpperCase();\n    });\n}\n\nexport function dashCase(camelString: string) {\n  return camelString.replace(/[A-Z]/g, m => \"-\" + m.toLowerCase());\n}\n\nexport function abbreviateText(text, length) {\n  if (text.length <= length) {\n    return text;\n  }\n\n  var lastWhitespaceIndex = text.substring(0, length - 1).lastIndexOf(' ');\n\n  if (lastWhitespaceIndex) {\n    return text.substring(0, lastWhitespaceIndex) + '\\u2026';\n  } else {\n    return text.substring(0, length - 1);\n  }\n}\n","import { dashCase } from \"./string-utils\";\n\n// Determines whether an element has a slot. If name is specified, the function will look for a corresponding named\n// slot, otherwise it will look for a \"default\" slot (e.g. a non-empty text node or an element with no slot attribute).\nexport function hasSlot(el: HTMLElement, name?: string) {\n  // Look for a named slot\n  if (name) {\n    return el.querySelector(`[slot=\"${name}\"]`) !== null;\n  }\n\n  // Look for a default slot\n  return Array.from(childNodes(el)).some((node) => {\n    if (node.nodeType === node.TEXT_NODE && node.textContent.trim() !== \"\") {\n      return true;\n    }\n\n    if (node.nodeType === node.ELEMENT_NODE) {\n      const el = node as HTMLElement;\n      if (!el.hasAttribute(\"slot\")) {\n        return true;\n      }\n    }\n\n    return false;\n  });\n}\n\nexport function setPropsIfNull(element: Element, attributes: any) {\n  Object.keys(attributes).forEach((attribute) => {\n    if (element.getAttribute(dashCase(attribute)) === null) {\n      element[attribute] = attributes[attribute];\n    }\n  });\n}\n\nexport function setProps(element: Element, attributes: any) {\n  Object.keys(attributes).forEach((attribute) => {\n    element[attribute] = attributes[attribute];\n  });\n}\n\nexport function isStzhElement(element: Element) {\n  if (!element || element.nodeType !== 1) {\n    return false;\n  }\n\n  return element.tagName.toLowerCase().indexOf(\"stzh-\") === 0;\n}\n\n// returns content of <meta name=\"\" content=\"\"> tags or '' if empty/non existant\nexport function getMeta(name) {\n  const meta = document.querySelector(\n    `meta[name=\"${name}\"],[property=\"${name}\"]`\n  );\n  return meta ? meta.getAttribute(\"content\") : \"\";\n}\n\nexport function parents(node: Element | Node) {\n  const parents = [];\n\n  while (node) {\n    parents.unshift(node);\n    node = node.parentNode;\n  }\n\n  return parents;\n}\n\nexport function childNodes(node: Element) {\n  const childNodes = node.childNodes;\n\n  // check if element is stencil element without shadow dom\n  // and then detect elements that were slotted into the element\n  if (node[\"s-sc\"]) {\n    const result = [];\n\n    for (let i = 0; i < childNodes.length; i++) {\n      const slot = childNodes[i][\"s-nr\"];\n\n      if (slot) {\n        result.push(slot);\n      }\n    }\n\n    return result;\n  }\n\n  return Array.from(childNodes);\n}\n\nexport function isVisible(element: HTMLElement): boolean {\n  // @ts-ignore\n  if (typeof element.checkVisibility !== \"undefined\") {\n    // @ts-ignore\n    return element.checkVisibility({\n      checkOpacity: false,\n      checkVisibilityCSS: false\n    });\n  } else {\n    return !!(\n      element.offsetWidth ||\n      element.offsetHeight ||\n      element.getClientRects().length\n    );\n  }\n}\n\nexport function offset(element): { top: number; left: number } {\n  if (!element.getClientRects().length) {\n    return { top: 0, left: 0 };\n  }\n\n  let rect = element.getBoundingClientRect();\n  let win = element.ownerDocument.defaultView;\n\n  return {\n    top: rect.top + win.pageYOffset,\n    left: rect.left + win.pageXOffset\n  };\n}\n\nexport async function raf() {\n  return new Promise<void>((resolve) => {\n    requestAnimationFrame(() => {\n      resolve();\n    });\n  });\n}\n\nexport async function setTimeout(time: number) {\n  return new Promise<void>((resolve) => {\n    window.setTimeout(() => {\n      resolve();\n    }, time);\n  });\n}\n\nexport enum StzhEnvironmentEnum {\n  UNKNOWN = \"UNKNOWN\",\n  DEV = \"DEV\",\n  UAT = \"UAT\",\n  PROD = \"PROD\",\n}\n\nexport function getStzhEnvironment(): StzhEnvironmentEnum {\n  const url = window.location.href;\n  if (\n    url.includes(\"test.stadt-zuerich.loc\") ||\n    url.match(/\\.dev\\.cmp\\.szh\\.loc/)\n  ) {\n    return StzhEnvironmentEnum.DEV;\n  } else if (\n    url.includes(\"integ.stadt-zuerich.ch\") ||\n    url.includes(\"stzh-desi-unic-preview.netlify.app\") ||\n    url.match(/\\.uat\\.cmp\\.szh\\.loc/)\n  ) {\n    return StzhEnvironmentEnum.UAT;\n  } else if (\n    url.includes(\"https://www.stadt-zuerich.ch\") ||\n    url.includes(\"designsystem.stadt-zuerich.ch\") ||\n    url.match(/\\.cmp\\.szh\\.loc/)\n  ) {\n    return StzhEnvironmentEnum.PROD;\n  } else {\n    return StzhEnvironmentEnum.UNKNOWN;\n  }\n}\n\nexport function addWordBreakToLinks(links: HTMLElement[]) {\n  links.forEach((link) => {\n    if (link.textContent?.includes(\"_\")) {\n      link.innerHTML = link.textContent.replace(/_/g, \"_<wbr>\");\n    }\n  });\n}\n\n// `extras.experimentalSlotFixes` stencil config flag resolves cloning light dom elements\n// so our own cloneElement / cloneWrappedStzhElement helpers are not needed right now\n// (used before in cardlist and sortable component).\n\n// export function children(node: Element) {\n//   return childNodes(node).map((n: any) => n.nodeType === 1);\n// }\n\n// const nativeCloneNodeFn = Node.prototype.cloneNode;\n\n// export function cloneElement(node: Element, deep: boolean) {\n//   const clonedNode = nativeCloneNodeFn.call(node, false);\n//   const srcChildNodes = childNodes(node);\n\n//   if (deep) {\n//     for (let i = 0; i < srcChildNodes.length; i++) {\n//       if (srcChildNodes[i].nodeType !== 2) {\n//         const childClone = cloneElement(srcChildNodes[i], true);\n//         clonedNode.appendChild(childClone);\n//       }\n//     }\n//   }\n\n//   return clonedNode;\n// }\n\n// // Clone an stzh-* element that is using stencil polyfilled slots (no shadow dom)\n// // and potentially wrapped in normal elements (e.g. angular component)\n// export function cloneWrappedStzhElement(elementToClone: Element): [Element, Element, Element] {\n//   let clonedElement: Element;\n//   let clonedStzhElement: Element;\n//   let originalStzhElement: Element;\n\n//   if (isStzhElement(elementToClone)) {\n//     clonedElement = cloneElement(elementToClone, true);\n//     clonedStzhElement = clonedElement;\n//     originalStzhElement = elementToClone;\n//   } else {\n//     clonedElement = elementToClone.cloneNode() as Element;\n\n//     let clonedInnerElementLast: Element = clonedElement;\n//     let originalInnerElementLast: Element = elementToClone;\n\n//     // clone inner root elements separately until we find a stzh element\n//     while (originalInnerElementLast.children.length === 1 && !isStzhElement(originalInnerElementLast.children[0])) {\n//       originalInnerElementLast = originalInnerElementLast.children[0];\n//       const clonedInnerElementCurrent = originalInnerElementLast.cloneNode() as Element;\n\n//       clonedInnerElementLast.appendChild(clonedInnerElementCurrent);\n//       clonedInnerElementLast = clonedInnerElementCurrent;\n//     }\n\n//     if (isStzhElement(originalInnerElementLast.children[0])) {\n//       clonedStzhElement = cloneElement(originalInnerElementLast.children[0], true);\n//       originalStzhElement = originalInnerElementLast.children[0];\n//       clonedInnerElementLast.appendChild(clonedStzhElement);\n//     } else {\n//       // no root stzh element found, so we give up and just deep clone the root\n//       clonedElement = cloneElement(elementToClone, true);\n//     }\n//   }\n\n//   return [clonedElement, clonedStzhElement, originalStzhElement];\n// }\n"],"version":3}

package/dist/components/{p-88880fc3.js → p-136bf880.js}

@@ -1,5 +1,5 @@
 import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-96cf9087.js';
-import { b as isVisible, o as offset } from './p-073888ce.js';
+import { b as isVisible, o as offset } from './p-095fbf73.js';
 import { d as debounce_1, i as isObject_1 } from './p-3a7e4a0b.js';
 
 /** Error message constants. */
@@ -413,4 +413,4 @@ function defineCustomElement() {
 
 export { StzhSticky as S, defineCustomElement as d, throttle_1 as t };
 
-//# sourceMappingURL=p-88880fc3.js.map
+//# sourceMappingURL=p-136bf880.js.map

package/dist/components/{p-88880fc3.js.map → p-136bf880.js.map}

@@ -1 +1 @@
-{"file":"p-88880fc3.js","mappings":"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","names":["isObject","debounce","throttle"],"sources":["node_modules/lodash/throttle.js","src/components/stzh-sticky/stzh-sticky.scss?tag=stzh-sticky&encapsulation=shadow","src/components/stzh-sticky/stzh-sticky.tsx"],"sourcesContent":["var debounce = require('./debounce'),\n    isObject = require('./isObject');\n\n/** Error message constants. */\nvar FUNC_ERROR_TEXT = 'Expected a function';\n\n/**\n * Creates a throttled function that only invokes `func` at most once per\n * every `wait` milliseconds. The throttled function comes with a `cancel`\n * method to cancel delayed `func` invocations and a `flush` method to\n * immediately invoke them. Provide `options` to indicate whether `func`\n * should be invoked on the leading and/or trailing edge of the `wait`\n * timeout. The `func` is invoked with the last arguments provided to the\n * throttled function. Subsequent calls to the throttled function return the\n * result of the last `func` invocation.\n *\n * **Note:** If `leading` and `trailing` options are `true`, `func` is\n * invoked on the trailing edge of the timeout only if the throttled function\n * is invoked more than once during the `wait` timeout.\n *\n * If `wait` is `0` and `leading` is `false`, `func` invocation is deferred\n * until to the next tick, similar to `setTimeout` with a timeout of `0`.\n *\n * See [David Corbacho's article](https://css-tricks.com/debouncing-throttling-explained-examples/)\n * for details over the differences between `_.throttle` and `_.debounce`.\n *\n * @static\n * @memberOf _\n * @since 0.1.0\n * @category Function\n * @param {Function} func The function to throttle.\n * @param {number} [wait=0] The number of milliseconds to throttle invocations to.\n * @param {Object} [options={}] The options object.\n * @param {boolean} [options.leading=true]\n *  Specify invoking on the leading edge of the timeout.\n * @param {boolean} [options.trailing=true]\n *  Specify invoking on the trailing edge of the timeout.\n * @returns {Function} Returns the new throttled function.\n * @example\n *\n * // Avoid excessively updating the position while scrolling.\n * jQuery(window).on('scroll', _.throttle(updatePosition, 100));\n *\n * // Invoke `renewToken` when the click event is fired, but not more than once every 5 minutes.\n * var throttled = _.throttle(renewToken, 300000, { 'trailing': false });\n * jQuery(element).on('click', throttled);\n *\n * // Cancel the trailing throttled invocation.\n * jQuery(window).on('popstate', throttled.cancel);\n */\nfunction throttle(func, wait, options) {\n  var leading = true,\n      trailing = true;\n\n  if (typeof func != 'function') {\n    throw new TypeError(FUNC_ERROR_TEXT);\n  }\n  if (isObject(options)) {\n    leading = 'leading' in options ? !!options.leading : leading;\n    trailing = 'trailing' in options ? !!options.trailing : trailing;\n  }\n  return debounce(func, wait, {\n    'leading': leading,\n    'maxWait': wait,\n    'trailing': trailing\n  });\n}\n\nmodule.exports = throttle;\n","/**\n * @prop --padding-top: Padding top of sticky element\n * @prop --padding-bottom: Padding bottom of sticky element\n * @prop --padding-left: Padding left of sticky element\n * @prop --padding-right: Padding right of sticky element\n * @prop --background-color: Background color of sticky element\n * @prop --stuck-padding-top: Padding top of stuck sticky element\n * @prop --stuck-padding-bottom: Padding bottom of stuck sticky element\n * @prop --stuck-padding-left: Padding left of stuck sticky element\n * @prop --stuck-padding-right: Padding right of stuck sticky element\n * @prop --stuck-background-color: Background color of stuck sticky element\n *\n * @prop --stzh-sticky-{NAME}-is-stuck: **Global**: Whether sticky is currently stuck (readonly variable on `<html>`)\n * @prop --stzh-sticky-{NAME}-is-not-stuck: **Global**: Whether sticky is currently not stuck (readonly variable on `<html>`)\n * @prop --stzh-sticky-{NAME}-is-stuck-top: **Global**: Whether sticky is currently stuck on top (readonly variable on `<html>`)\n * @prop --stzh-sticky-{NAME}-is-not-stuck-top: **Global**: Whether sticky is currently not stuck on top (readonly variable on `<html>`)\n * @prop --stzh-sticky-{NAME}-is-stuck-bottom: **Global**: Whether sticky is currently stuck on bottom (readonly variable on `<html>`)\n * @prop --stzh-sticky-{NAME}-is-not-stuck-bottom: **Global**: Whether sticky is currently not stuck on bottom (readonly variable on `<html>`)\n * @prop --stzh-sticky-{NAME}-stuck-top-height: **Global**: Stuck top sticky element height (readonly variable on `<html>`)\n * @prop --stzh-sticky-{NAME}-stuck-bottom-height: **Global**: Stuck bottom sticky element height (readonly variable on `<html>`)\n */\n\n:host {\n  --padding-top: #{space('large')};\n  --padding-bottom: #{space('large')};\n  --padding-left: 0;\n  --padding-right: 0;\n  --background-color: transparent;\n\n  --stuck-padding-top: var(--padding-top);\n  --stuck-padding-bottom: var(--padding-bottom);\n  --stuck-padding-left: var(--padding-left);\n  --stuck-padding-right: var(--padding-right);\n  --stuck-background-color: #{$colorGrey10};\n\n  display: contents;\n\n  @media print {\n    display: none;\n  }\n}\n\n:host([variant=\"transparent\"]) {\n  --background-color: transparent;\n  --stuck-background-color: transparent;\n\n  pointer-events: none;\n}\n\n:host([position=\"fixed\"]) {\n  display: block;\n}\n\n.stzh-sticky {\n  display: contents;\n\n  &__sticky {\n    position: sticky;\n    top: -1px;\n    bottom: -1px;\n    z-index: $zIndexSticky;\n    width: var(--stzh-sticky-unstuck-width, auto);\n    transition-property: width, transform, opacity;\n    transition-duration: $baseTransitionAnimationSpeed;\n  }\n\n  &__content,\n  &__content::before {\n    background-color: var(--background-color);\n    transition-duration: $baseTransitionAnimationSpeed;\n  }\n\n  &__content {\n    --stzh-button-pointer-events: all;\n    --stzh-link-pointer-events: all;\n\n    position: relative;\n    transition-property: background-color, transform;\n\n    // &::before,\n    // &::after {\n    //   content: '';\n    //   pointer-events: none;\n    //   display: block;\n    //   position: absolute;\n    //   left: 0;\n    //   width: 100%;\n    //   height: space('xxlarge');\n    //   opacity: 0;\n    //   transition: opacity $baseTransitionAnimationSpeed;\n    // }\n\n    // &::before {\n    //   background: linear-gradient(0deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 100%);\n    //   top: 0;\n    //   transform: translateY(-100%);\n    // }\n\n    // &::after {\n    //   background: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, #FFFFFF 100%);\n    //   bottom: 0;\n    //   transform: translateY(100%);\n    // }\n  }\n\n  &__content-inner {\n    padding-top: var(--padding-top);\n    padding-bottom: var(--padding-bottom);\n    padding-left: var(--padding-left);\n    padding-right: var(--padding-right);\n    transition-property: padding;\n    transition-duration: $baseTransitionAnimationSpeed;\n  }\n\n  &__spacer {\n    display: none;\n  }\n\n  /* Disabled variants */\n\n  &--is-disabled-sticky-top &__sticky {\n    top: auto;\n  }\n\n  &--is-disabled-sticky-bottom &__sticky {\n    bottom: auto;\n  }\n\n  /* Bleeding variant */\n\n  &--is-bleeding &__content {\n    &::before {\n      z-index: -1;\n      content: '';\n      position: absolute;\n      display: block;\n      width: 100%;\n      height: 100%;\n      transform: translateY(0);\n      transition-property: width, background-color, transform;\n    }\n  }\n\n  /* Is stuck variant */\n\n  &--is-stuck &__content,\n  &--is-stuck &__content::before {\n    background-color: var(--stuck-background-color);\n  }\n\n  &--is-stuck &__content::before {\n    width: calc(100vw - var(--stzh-scrollbar-width));\n    transform: translateX(calc(var(--stzh-sticky-offset-left) / -1));\n  }\n\n  &--is-stuck &__content-inner {\n    padding-top: var(--stuck-padding-top);\n    padding-bottom: var(--stuck-padding-bottom);\n    padding-left: var(--stuck-padding-left);\n    padding-right: var(--stuck-padding-right);\n  }\n\n  // &--is-stuck-bottom &__content {\n  //   &::before {\n  //     opacity: 1;\n  //   }\n  // }\n\n  // &--is-stuck-top &__content {\n  //   &::after {\n  //     opacity: 1;\n  //   }\n  // }\n\n  /* Transparent variant */\n\n  // &--transparent &__content {\n  //   &::after,\n  //   &::before {\n  //     display: none;\n  //   }\n  // }\n\n  // /* Position sticky variant */\n\n  // &--is-breakout &__content {\n    // position: relative;\n    // left: 50%;\n    // right: 50%;\n    // margin-left: calc(-50vw + var(--stzh-scrollbar-width) / 2);\n    // margin-right: calc(-50vw + var(--stzh-scrollbar-width) / 2);\n    // width: calc(100vw - var(--stzh-scrollbar-width));\n    // max-width: calc(100vw - var(--stzh-scrollbar-width));\n  // }\n\n  &--is-not-loaded {\n    visibility: hidden;\n  }\n\n  &--is-not-loaded#{&}--is-stuck &__sticky {\n    transform: translateY(100%);\n    opacity: 0;\n  }\n\n  &--is-not-loaded &__sticky,\n  &--is-not-loaded &__content,\n  &--is-not-loaded &__content::before,\n  &--is-not-loaded &__content-inner {\n    transition-duration: 0ms;\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Element,\n  Prop,\n  State,\n  Watch,\n  Event,\n  EventEmitter\n} from \"@stencil/core\";\n\nimport {\n  StzhStickyStuckTopEvent,\n  StzhStickyStuckBottomEvent\n} from \"../../index\";\n\nimport { isVisible, offset } from \"../../utils/utils\";\nimport throttle from \"lodash/throttle\";\n\nconst ATTR_STICKY_CONTAINER = \"data-stzh-sticky-container\";\nconst ATTR_STICKY_WIDTH_CONTAINER = \"data-stzh-sticky-width-container\";\n\n/**\n * @slot - Slot for any content \n */\n@Component({\n  tag: \"stzh-sticky\",\n  styleUrl: \"stzh-sticky.scss\",\n  shadow: true\n})\nexport class StzhSticky {\n  /** Variant */\n  @Prop({ reflect: true }) variant: \"default\" | \"transparent\" = \"default\";\n\n  /** Whether to disable sticking to top */\n  @Prop({ reflect: true }) disableStickyTop: boolean = true;\n\n  /** Whether to disable sticking to bottom */\n  @Prop({ reflect: true }) disableStickyBottom: boolean = false;\n\n  /** Whether background breaks out container to full viewport width */\n  @Prop({ reflect: true }) bleeding: boolean = false;\n\n  /** Name of sticky element (used for setting css properties) */\n  @Prop() name: string;\n\n  /**\n   * Position type used.\n   *\n   * - sticky: used only css position sticky\n   * - fixed: uses position fixed with js for positioning (`data-stzh-sticky-container` can be used on a container element to limit sticky position)\n   */\n  @Prop({ reflect: true }) position: \"sticky\" | \"fixed\" = \"sticky\";\n\n  @Watch(\"disableStickyTop\")\n  @Watch(\"disableStickyBottom\")\n  disableStickyWatcher() {\n    requestAnimationFrame(() => {\n      requestAnimationFrame(() => {\n        if (this.position === \"fixed\") {\n          this.updateFixedByResize();\n        } else {\n          this.updateStuck();\n        }\n      });\n    });\n  }\n\n  @Watch(\"isStuckTop\")\n  @Watch(\"isStuckBottom\")\n  @Watch(\"hasReachedTopLimit\")\n  @Watch(\"hasReachedBottomLimit\")\n  stuckHeightWatcher() {\n    let isStuck = false;\n\n    if (this.isStuckTop && !this.hasReachedBottomLimit) {\n      isStuck = true;\n      document.documentElement.style.setProperty(`--stzh-sticky-${this.name && this.name + '-'}is-stuck-top`, \"1\");\n      document.documentElement.style.setProperty(`--stzh-sticky-${this.name && this.name + '-'}is-not-stuck-top`, \"0\");\n      document.documentElement.style.setProperty(`--stzh-sticky-${this.name && this.name + '-'}stuck-top-height`, `${this.stickyElement.offsetHeight}px`);\n    } else {\n      document.documentElement.style.setProperty(`--stzh-sticky-${this.name && this.name + '-'}is-stuck-top`, \"0\");\n      document.documentElement.style.setProperty(`--stzh-sticky-${this.name && this.name + '-'}is-not-stuck-top`, \"1\");\n      document.documentElement.style.setProperty(`--stzh-sticky-${this.name && this.name + '-'}stuck-top-height`, \"0px\");\n    }\n\n    if (this.isStuckBottom && !this.hasReachedTopLimit) {\n      isStuck = true;\n      document.documentElement.style.setProperty(`--stzh-sticky-${this.name && this.name + '-'}is-stuck-bottom`, \"1\");\n      document.documentElement.style.setProperty(`--stzh-sticky-${this.name && this.name + '-'}is-not-stuck-bottom`, \"0\");\n      document.documentElement.style.setProperty(`--stzh-sticky-${this.name && this.name + '-'}stuck-bottom-height`, `${this.stickyElement.offsetHeight}px`);\n    } else {\n      document.documentElement.style.setProperty(`--stzh-sticky-${this.name && this.name + '-'}is-stuck-bottom`, \"0\");\n      document.documentElement.style.setProperty(`--stzh-sticky-${this.name && this.name + '-'}is-not-stuck-bottom`, \"1\");\n      document.documentElement.style.setProperty(`--stzh-sticky-${this.name && this.name + '-'}stuck-bottom-height`, \"0px\");\n    }\n\n    document.documentElement.style.setProperty(`--stzh-sticky-${this.name && this.name + '-'}is-stuck`, isStuck ? \"1\" : \"0\");\n    document.documentElement.style.setProperty(`--stzh-sticky-${this.name && this.name + '-'}is-not-stuck`, isStuck ? \"0\" : \"1\");\n\n    if (isStuck) {\n      this.stickyResizeObserver.observe(this.stickyElement);\n    } else {\n      this.stickyResizeObserver.unobserve(this.stickyElement);\n    }\n  }\n\n  @Watch(\"isStuckTop\")\n  isStuckTopWatcher(newValue: boolean) {\n    this.stzhStuckTop.emit({\n      component: \"stzh-sticky\",\n      sticky: newValue\n    });\n  }\n\n  @Watch(\"isStuckBottom\")\n  isStuckBottomWatcher(newValue: boolean) {\n    this.stzhStuckBottom.emit({\n      component: \"stzh-sticky\",\n      sticky: newValue\n    });\n  }\n\n  @Watch(\"position\")\n  @Watch(\"bleeding\")\n  positionWatcher() {\n    if (this.position === \"fixed\") {\n      if (this.observer) {\n        this.observer.disconnect();\n      }\n\n      window.addEventListener(\"scroll\", this.handleScroll, { passive: true });\n      window.addEventListener(\"resize\", this.handleResize);\n\n      this.updateFixedByResize();\n    } else {\n      if (this.bleeding) {\n        window.addEventListener(\"scroll\", this.handleScroll, { passive: true });\n        this.updateByScroll();\n      } else {\n        window.removeEventListener(\"scroll\", this.handleScroll);\n      }\n\n      window.removeEventListener(\"resize\", this.handleResize);\n      this.setUnfixed();\n\n      this.observer = new IntersectionObserver(this.observe, { threshold: [1] });\n      this.observer.observe(this.stickyElement);\n\n      this.updateStuck();\n    }\n  }\n\n  /** Sticky stuck top event */\n  @Event() stzhStuckTop: EventEmitter<StzhStickyStuckTopEvent>;\n\n  /** Sticky stuck bottom event */\n  @Event() stzhStuckBottom: EventEmitter<StzhStickyStuckBottomEvent>;\n\n  @Element() element: HTMLStzhStickyElement;\n\n  @State() isStuckTop: boolean;\n  @State() isStuckBottom: boolean;\n\n  @State() hasReachedTopLimit: boolean;\n  @State() hasReachedBottomLimit: boolean;\n\n  @State() loaded: boolean = false;\n\n  private observer: IntersectionObserver;\n  private stickyResizeObserver: ResizeObserver;\n  private debounceScroll: number;\n  private debounceResize: number;\n  private stickyElement: HTMLElement;\n  private spacerElement: HTMLElement;\n\n  private windowHeight: number;\n  private scrollX: number;\n  private scrollY: number;\n  private fixedTop: number;\n  private fixedLeft: number;\n  private fixedHeight: number = 0;\n  private fixedWidth: number = 0;\n  private fixedLimit: { top: number, bottom: number } | null = null;\n\n  private updateStuck() {\n    const topCss = parseInt(getComputedStyle(this.stickyElement).top, 10);\n    const bottomCss = parseInt(getComputedStyle(this.stickyElement).bottom, 10);\n    const rect = this.stickyElement.getBoundingClientRect();\n\n    if (topCss) {\n      this.isStuckTop = rect.top < 0;\n    } else {\n      this.isStuckTop = false;\n    }\n\n    if (bottomCss) {\n      this.isStuckBottom = document.documentElement.clientHeight < rect.bottom;\n    } else {\n      this.isStuckBottom = false;\n    }\n  }\n\n  private getFixedLimit(): { top: number, bottom: number } | null {\n    const stickyContainer = this.element.closest(`[${ATTR_STICKY_CONTAINER}]`);\n\n    if (!stickyContainer) {\n      return null;\n    }\n\n    const off = offset(stickyContainer);\n\n    return {\n      top: off.top,\n      bottom: off.top + stickyContainer.scrollHeight,\n    };\n  }\n\n  private setUnfixed() {\n    Object.assign(this.stickyElement.style, {\n      position: null,\n      top: null,\n      bottom: null,\n      left: null,\n      width: null,\n    });\n\n    Object.assign(this.spacerElement.style, {\n      display: \"none\",\n    });\n  }\n\n  private setFixed() {\n    const position = (this.hasReachedTopLimit || this.hasReachedBottomLimit)\n      ? \"absolute\"\n      : \"fixed\";\n\n    Object.assign(this.stickyElement.style, {\n      position,\n      top: position === \"absolute\"\n        ? `${this.isStuckTop ? this.fixedLimit.bottom - this.fixedHeight : this.fixedLimit.top}px`\n        : this.isStuckTop ? \"0px\" : \"auto\",\n      bottom: this.isStuckTop || position === \"absolute\"\n        ? \"auto\" : \"0px\",\n      left: `${this.fixedLeft + (position === \"fixed\" ? this.scrollX : 0)}px`,\n      width: `${this.fixedWidth}px`,\n    });\n\n    Object.assign(this.spacerElement.style, {\n      display: \"block\",\n    });\n  }\n\n  private handleScroll = () => {\n    if (this.debounceScroll) {\n      window.cancelAnimationFrame(this.debounceScroll);\n    }\n\n    this.debounceScroll = requestAnimationFrame(this.updateByScroll);\n  }\n\n  private handleResize = () => {\n    if (this.debounceResize) {\n      window.cancelAnimationFrame(this.debounceResize);\n    }\n\n    this.debounceResize = requestAnimationFrame(this.updateFixedByResize);\n  }\n\n  private handleStickyResize = throttle(() => {\n    this.stuckHeightWatcher();\n    this.updateByScroll();\n  }, 100);\n\n  private updateByScroll = () => {\n    if (!isVisible(this.stickyElement) || !this.element.isConnected) {\n      return;\n    }\n\n    const stickyFixedWidthContainer = this.element.closest(`[${ATTR_STICKY_WIDTH_CONTAINER}]`) as HTMLElement\n      || this.element.parentElement;\n\n    const off = offset(\n      (this.isStuckTop || this.isStuckBottom) && this.position === \"fixed\"\n      ? this.spacerElement : this.stickyElement\n    );\n\n    this.fixedTop = off.top;\n    this.fixedLeft = off.left;\n\n    stickyFixedWidthContainer.style.setProperty('--stzh-sticky-offset-top', `${this.fixedTop}px`);\n    stickyFixedWidthContainer.style.setProperty('--stzh-sticky-offset-left', `${this.fixedLeft}px`);\n\n    if (this.position === \"sticky\") {\n      // for position sticky we only need the offsets variables to be updated in bleeding variant\n      return;\n    }\n\n    this.fixedHeight = this.stickyElement.offsetHeight;\n    this.spacerElement.style.height = `${this.fixedHeight}px`;\n\n    this.scrollX = window.scrollX;\n    this.scrollY = window.scrollY;\n    this.fixedLimit = this.getFixedLimit();\n\n    this.fixedWidth = stickyFixedWidthContainer.getBoundingClientRect().width;\n\n    const unstuckWidth = this.element.getBoundingClientRect().width;\n    // stickyFixedWidthContainer.style.setProperty('--stzh-sticky-stuck-width', `${this.fixedWidth}px`);\n    stickyFixedWidthContainer.style.setProperty('--stzh-sticky-unstuck-width', `${unstuckWidth}px`);\n\n    // console.log(unstuckWidth);\n\n    // console.log(\n    //   this.scrollX,\n    //   this.scrollY,\n    //   this.windowHeight,\n    //   this.fixedTop,\n    //   this.fixedLeft,\n    //   this.fixedHeight,\n    //   this.fixedLimit,\n    // );\n\n    this.isStuckBottom = !this.disableStickyBottom\n      && this.scrollY + this.windowHeight <= this.fixedTop + this.fixedHeight;\n    this.isStuckTop = !this.disableStickyTop\n      && this.scrollY >= this.fixedTop;\n\n    this.hasReachedTopLimit = this.fixedLimit\n      && this.scrollY + this.windowHeight - this.fixedHeight <= this.fixedLimit.top;\n    this.hasReachedBottomLimit = this.fixedLimit\n      && this.scrollY >= this.fixedLimit.bottom - this.fixedHeight;\n\n    // console.log(\n    //   this.isStuckBottom,\n    //   this.isStuckTop,\n    //   this.hasReachedBottomLimit,\n    //   this.hasReachedTopLimit,\n    // );\n\n    if (this.isStuckTop || this.isStuckBottom) {\n      this.setFixed();\n      // stickyFixedWidthContainer.style.setProperty('--stzh-sticky-width', `${this.fixedWidth}px`);\n    } else {\n      this.setUnfixed();\n      // stickyFixedWidthContainer.style.setProperty('--stzh-sticky-width', `${unstuckWidth}px`);\n    }\n  }\n\n  private updateFixedByResize = () => {\n    if (!this.stickyElement || !this.element.isConnected) {\n      return;\n    }\n\n    // reset sticky so we can read current offsets\n    this.setUnfixed();\n    this.stickyElement.style.position = \"static\";\n    this.stickyElement.style.width = \"auto\";\n    this.isStuckTop = false;\n    this.isStuckBottom = false;\n\n    if (isVisible(this.stickyElement)) {\n      this.windowHeight = window.innerHeight;\n      this.updateByScroll();\n    }\n  }\n\n  private observe = () => {\n    this.updateStuck();\n  };\n\n  componentDidLoad() {\n    this.stickyResizeObserver = new ResizeObserver(this.handleStickyResize);\n    this.positionWatcher();\n\n    requestAnimationFrame(() => {\n      requestAnimationFrame(() => {\n        window.setTimeout(() => {\n          this.loaded = true;\n\n          if (this.position === \"fixed\") {\n            this.updateFixedByResize();\n          }\n        }, 250);\n      });\n    });\n  }\n\n  disconnectedCallback() {\n    this.observer?.disconnect();\n    this.stickyResizeObserver?.disconnect();\n\n    window.removeEventListener(\"scroll\", this.handleScroll);\n    window.removeEventListener(\"resize\", this.handleResize);\n  }\n\n  render() {\n    const isStuck = this.isStuckTop || this.isStuckBottom;\n\n    const classes = {\n      \"stzh-sticky\": true,\n      \"stzh-sticky--is-not-loaded\": !this.loaded,\n      \"stzh-sticky--is-stuck\": isStuck,\n      \"stzh-sticky--is-stuck-top\": this.isStuckTop,\n      \"stzh-sticky--is-stuck-bottom\": this.isStuckBottom,\n      \"stzh-sticky--is-disabled-sticky-top\": this.disableStickyTop,\n      \"stzh-sticky--is-disabled-sticky-bottom\": this.disableStickyBottom,\n      \"stzh-sticky--is-bleeding\": this.bleeding,\n      [`stzh-sticky--position-${this.position}`]: !!this.position,\n      [`stzh-sticky--${this.variant}`]: !!this.variant,\n    };\n\n    return (\n      <Host\n        is-stuck={this.isStuckTop || this.isStuckBottom}\n        is-stuck-top={this.isStuckTop}\n        is-stuck-bottom={this.isStuckBottom}\n      >\n        <div class={classes}>\n          <div\n            ref={(el) => (this.spacerElement = el as HTMLDivElement)}\n            class=\"stzh-sticky__spacer\"\n          ></div>\n          <div\n            ref={(el) => (this.stickyElement = el as HTMLDivElement)}\n            class=\"stzh-sticky__sticky\"\n          >\n            <div class=\"stzh-sticky__content\">\n              <div class=\"stzh-sticky__content-inner\">\n                <slot></slot>\n              </div>\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"p-136bf880.js","mappings":"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","names":["isObject","debounce","throttle"],"sources":["node_modules/lodash/throttle.js","src/components/stzh-sticky/stzh-sticky.scss?tag=stzh-sticky&encapsulation=shadow","src/components/stzh-sticky/stzh-sticky.tsx"],"sourcesContent":["var debounce = require('./debounce'),\n    isObject = require('./isObject');\n\n/** Error message constants. */\nvar FUNC_ERROR_TEXT = 'Expected a function';\n\n/**\n * Creates a throttled function that only invokes `func` at most once per\n * every `wait` milliseconds. The throttled function comes with a `cancel`\n * method to cancel delayed `func` invocations and a `flush` method to\n * immediately invoke them. Provide `options` to indicate whether `func`\n * should be invoked on the leading and/or trailing edge of the `wait`\n * timeout. The `func` is invoked with the last arguments provided to the\n * throttled function. Subsequent calls to the throttled function return the\n * result of the last `func` invocation.\n *\n * **Note:** If `leading` and `trailing` options are `true`, `func` is\n * invoked on the trailing edge of the timeout only if the throttled function\n * is invoked more than once during the `wait` timeout.\n *\n * If `wait` is `0` and `leading` is `false`, `func` invocation is deferred\n * until to the next tick, similar to `setTimeout` with a timeout of `0`.\n *\n * See [David Corbacho's article](https://css-tricks.com/debouncing-throttling-explained-examples/)\n * for details over the differences between `_.throttle` and `_.debounce`.\n *\n * @static\n * @memberOf _\n * @since 0.1.0\n * @category Function\n * @param {Function} func The function to throttle.\n * @param {number} [wait=0] The number of milliseconds to throttle invocations to.\n * @param {Object} [options={}] The options object.\n * @param {boolean} [options.leading=true]\n *  Specify invoking on the leading edge of the timeout.\n * @param {boolean} [options.trailing=true]\n *  Specify invoking on the trailing edge of the timeout.\n * @returns {Function} Returns the new throttled function.\n * @example\n *\n * // Avoid excessively updating the position while scrolling.\n * jQuery(window).on('scroll', _.throttle(updatePosition, 100));\n *\n * // Invoke `renewToken` when the click event is fired, but not more than once every 5 minutes.\n * var throttled = _.throttle(renewToken, 300000, { 'trailing': false });\n * jQuery(element).on('click', throttled);\n *\n * // Cancel the trailing throttled invocation.\n * jQuery(window).on('popstate', throttled.cancel);\n */\nfunction throttle(func, wait, options) {\n  var leading = true,\n      trailing = true;\n\n  if (typeof func != 'function') {\n    throw new TypeError(FUNC_ERROR_TEXT);\n  }\n  if (isObject(options)) {\n    leading = 'leading' in options ? !!options.leading : leading;\n    trailing = 'trailing' in options ? !!options.trailing : trailing;\n  }\n  return debounce(func, wait, {\n    'leading': leading,\n    'maxWait': wait,\n    'trailing': trailing\n  });\n}\n\nmodule.exports = throttle;\n","/**\n * @prop --padding-top: Padding top of sticky element\n * @prop --padding-bottom: Padding bottom of sticky element\n * @prop --padding-left: Padding left of sticky element\n * @prop --padding-right: Padding right of sticky element\n * @prop --background-color: Background color of sticky element\n * @prop --stuck-padding-top: Padding top of stuck sticky element\n * @prop --stuck-padding-bottom: Padding bottom of stuck sticky element\n * @prop --stuck-padding-left: Padding left of stuck sticky element\n * @prop --stuck-padding-right: Padding right of stuck sticky element\n * @prop --stuck-background-color: Background color of stuck sticky element\n *\n * @prop --stzh-sticky-{NAME}-is-stuck: **Global**: Whether sticky is currently stuck (readonly variable on `<html>`)\n * @prop --stzh-sticky-{NAME}-is-not-stuck: **Global**: Whether sticky is currently not stuck (readonly variable on `<html>`)\n * @prop --stzh-sticky-{NAME}-is-stuck-top: **Global**: Whether sticky is currently stuck on top (readonly variable on `<html>`)\n * @prop --stzh-sticky-{NAME}-is-not-stuck-top: **Global**: Whether sticky is currently not stuck on top (readonly variable on `<html>`)\n * @prop --stzh-sticky-{NAME}-is-stuck-bottom: **Global**: Whether sticky is currently stuck on bottom (readonly variable on `<html>`)\n * @prop --stzh-sticky-{NAME}-is-not-stuck-bottom: **Global**: Whether sticky is currently not stuck on bottom (readonly variable on `<html>`)\n * @prop --stzh-sticky-{NAME}-stuck-top-height: **Global**: Stuck top sticky element height (readonly variable on `<html>`)\n * @prop --stzh-sticky-{NAME}-stuck-bottom-height: **Global**: Stuck bottom sticky element height (readonly variable on `<html>`)\n */\n\n:host {\n  --padding-top: #{space('large')};\n  --padding-bottom: #{space('large')};\n  --padding-left: 0;\n  --padding-right: 0;\n  --background-color: transparent;\n\n  --stuck-padding-top: var(--padding-top);\n  --stuck-padding-bottom: var(--padding-bottom);\n  --stuck-padding-left: var(--padding-left);\n  --stuck-padding-right: var(--padding-right);\n  --stuck-background-color: #{$colorGrey10};\n\n  display: contents;\n\n  @media print {\n    display: none;\n  }\n}\n\n:host([variant=\"transparent\"]) {\n  --background-color: transparent;\n  --stuck-background-color: transparent;\n\n  pointer-events: none;\n}\n\n:host([position=\"fixed\"]) {\n  display: block;\n}\n\n.stzh-sticky {\n  display: contents;\n\n  &__sticky {\n    position: sticky;\n    top: -1px;\n    bottom: -1px;\n    z-index: $zIndexSticky;\n    width: var(--stzh-sticky-unstuck-width, auto);\n    transition-property: width, transform, opacity;\n    transition-duration: $baseTransitionAnimationSpeed;\n  }\n\n  &__content,\n  &__content::before {\n    background-color: var(--background-color);\n    transition-duration: $baseTransitionAnimationSpeed;\n  }\n\n  &__content {\n    --stzh-button-pointer-events: all;\n    --stzh-link-pointer-events: all;\n\n    position: relative;\n    transition-property: background-color, transform;\n\n    // &::before,\n    // &::after {\n    //   content: '';\n    //   pointer-events: none;\n    //   display: block;\n    //   position: absolute;\n    //   left: 0;\n    //   width: 100%;\n    //   height: space('xxlarge');\n    //   opacity: 0;\n    //   transition: opacity $baseTransitionAnimationSpeed;\n    // }\n\n    // &::before {\n    //   background: linear-gradient(0deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 100%);\n    //   top: 0;\n    //   transform: translateY(-100%);\n    // }\n\n    // &::after {\n    //   background: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, #FFFFFF 100%);\n    //   bottom: 0;\n    //   transform: translateY(100%);\n    // }\n  }\n\n  &__content-inner {\n    padding-top: var(--padding-top);\n    padding-bottom: var(--padding-bottom);\n    padding-left: var(--padding-left);\n    padding-right: var(--padding-right);\n    transition-property: padding;\n    transition-duration: $baseTransitionAnimationSpeed;\n  }\n\n  &__spacer {\n    display: none;\n  }\n\n  /* Disabled variants */\n\n  &--is-disabled-sticky-top &__sticky {\n    top: auto;\n  }\n\n  &--is-disabled-sticky-bottom &__sticky {\n    bottom: auto;\n  }\n\n  /* Bleeding variant */\n\n  &--is-bleeding &__content {\n    &::before {\n      z-index: -1;\n      content: '';\n      position: absolute;\n      display: block;\n      width: 100%;\n      height: 100%;\n      transform: translateY(0);\n      transition-property: width, background-color, transform;\n    }\n  }\n\n  /* Is stuck variant */\n\n  &--is-stuck &__content,\n  &--is-stuck &__content::before {\n    background-color: var(--stuck-background-color);\n  }\n\n  &--is-stuck &__content::before {\n    width: calc(100vw - var(--stzh-scrollbar-width));\n    transform: translateX(calc(var(--stzh-sticky-offset-left) / -1));\n  }\n\n  &--is-stuck &__content-inner {\n    padding-top: var(--stuck-padding-top);\n    padding-bottom: var(--stuck-padding-bottom);\n    padding-left: var(--stuck-padding-left);\n    padding-right: var(--stuck-padding-right);\n  }\n\n  // &--is-stuck-bottom &__content {\n  //   &::before {\n  //     opacity: 1;\n  //   }\n  // }\n\n  // &--is-stuck-top &__content {\n  //   &::after {\n  //     opacity: 1;\n  //   }\n  // }\n\n  /* Transparent variant */\n\n  // &--transparent &__content {\n  //   &::after,\n  //   &::before {\n  //     display: none;\n  //   }\n  // }\n\n  // /* Position sticky variant */\n\n  // &--is-breakout &__content {\n    // position: relative;\n    // left: 50%;\n    // right: 50%;\n    // margin-left: calc(-50vw + var(--stzh-scrollbar-width) / 2);\n    // margin-right: calc(-50vw + var(--stzh-scrollbar-width) / 2);\n    // width: calc(100vw - var(--stzh-scrollbar-width));\n    // max-width: calc(100vw - var(--stzh-scrollbar-width));\n  // }\n\n  &--is-not-loaded {\n    visibility: hidden;\n  }\n\n  &--is-not-loaded#{&}--is-stuck &__sticky {\n    transform: translateY(100%);\n    opacity: 0;\n  }\n\n  &--is-not-loaded &__sticky,\n  &--is-not-loaded &__content,\n  &--is-not-loaded &__content::before,\n  &--is-not-loaded &__content-inner {\n    transition-duration: 0ms;\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Element,\n  Prop,\n  State,\n  Watch,\n  Event,\n  EventEmitter\n} from \"@stencil/core\";\n\nimport {\n  StzhStickyStuckTopEvent,\n  StzhStickyStuckBottomEvent\n} from \"../../index\";\n\nimport { isVisible, offset } from \"../../utils/utils\";\nimport throttle from \"lodash/throttle\";\n\nconst ATTR_STICKY_CONTAINER = \"data-stzh-sticky-container\";\nconst ATTR_STICKY_WIDTH_CONTAINER = \"data-stzh-sticky-width-container\";\n\n/**\n * @slot - Slot for any content \n */\n@Component({\n  tag: \"stzh-sticky\",\n  styleUrl: \"stzh-sticky.scss\",\n  shadow: true\n})\nexport class StzhSticky {\n  /** Variant */\n  @Prop({ reflect: true }) variant: \"default\" | \"transparent\" = \"default\";\n\n  /** Whether to disable sticking to top */\n  @Prop({ reflect: true }) disableStickyTop: boolean = true;\n\n  /** Whether to disable sticking to bottom */\n  @Prop({ reflect: true }) disableStickyBottom: boolean = false;\n\n  /** Whether background breaks out container to full viewport width */\n  @Prop({ reflect: true }) bleeding: boolean = false;\n\n  /** Name of sticky element (used for setting css properties) */\n  @Prop() name: string;\n\n  /**\n   * Position type used.\n   *\n   * - sticky: used only css position sticky\n   * - fixed: uses position fixed with js for positioning (`data-stzh-sticky-container` can be used on a container element to limit sticky position)\n   */\n  @Prop({ reflect: true }) position: \"sticky\" | \"fixed\" = \"sticky\";\n\n  @Watch(\"disableStickyTop\")\n  @Watch(\"disableStickyBottom\")\n  disableStickyWatcher() {\n    requestAnimationFrame(() => {\n      requestAnimationFrame(() => {\n        if (this.position === \"fixed\") {\n          this.updateFixedByResize();\n        } else {\n          this.updateStuck();\n        }\n      });\n    });\n  }\n\n  @Watch(\"isStuckTop\")\n  @Watch(\"isStuckBottom\")\n  @Watch(\"hasReachedTopLimit\")\n  @Watch(\"hasReachedBottomLimit\")\n  stuckHeightWatcher() {\n    let isStuck = false;\n\n    if (this.isStuckTop && !this.hasReachedBottomLimit) {\n      isStuck = true;\n      document.documentElement.style.setProperty(`--stzh-sticky-${this.name && this.name + '-'}is-stuck-top`, \"1\");\n      document.documentElement.style.setProperty(`--stzh-sticky-${this.name && this.name + '-'}is-not-stuck-top`, \"0\");\n      document.documentElement.style.setProperty(`--stzh-sticky-${this.name && this.name + '-'}stuck-top-height`, `${this.stickyElement.offsetHeight}px`);\n    } else {\n      document.documentElement.style.setProperty(`--stzh-sticky-${this.name && this.name + '-'}is-stuck-top`, \"0\");\n      document.documentElement.style.setProperty(`--stzh-sticky-${this.name && this.name + '-'}is-not-stuck-top`, \"1\");\n      document.documentElement.style.setProperty(`--stzh-sticky-${this.name && this.name + '-'}stuck-top-height`, \"0px\");\n    }\n\n    if (this.isStuckBottom && !this.hasReachedTopLimit) {\n      isStuck = true;\n      document.documentElement.style.setProperty(`--stzh-sticky-${this.name && this.name + '-'}is-stuck-bottom`, \"1\");\n      document.documentElement.style.setProperty(`--stzh-sticky-${this.name && this.name + '-'}is-not-stuck-bottom`, \"0\");\n      document.documentElement.style.setProperty(`--stzh-sticky-${this.name && this.name + '-'}stuck-bottom-height`, `${this.stickyElement.offsetHeight}px`);\n    } else {\n      document.documentElement.style.setProperty(`--stzh-sticky-${this.name && this.name + '-'}is-stuck-bottom`, \"0\");\n      document.documentElement.style.setProperty(`--stzh-sticky-${this.name && this.name + '-'}is-not-stuck-bottom`, \"1\");\n      document.documentElement.style.setProperty(`--stzh-sticky-${this.name && this.name + '-'}stuck-bottom-height`, \"0px\");\n    }\n\n    document.documentElement.style.setProperty(`--stzh-sticky-${this.name && this.name + '-'}is-stuck`, isStuck ? \"1\" : \"0\");\n    document.documentElement.style.setProperty(`--stzh-sticky-${this.name && this.name + '-'}is-not-stuck`, isStuck ? \"0\" : \"1\");\n\n    if (isStuck) {\n      this.stickyResizeObserver.observe(this.stickyElement);\n    } else {\n      this.stickyResizeObserver.unobserve(this.stickyElement);\n    }\n  }\n\n  @Watch(\"isStuckTop\")\n  isStuckTopWatcher(newValue: boolean) {\n    this.stzhStuckTop.emit({\n      component: \"stzh-sticky\",\n      sticky: newValue\n    });\n  }\n\n  @Watch(\"isStuckBottom\")\n  isStuckBottomWatcher(newValue: boolean) {\n    this.stzhStuckBottom.emit({\n      component: \"stzh-sticky\",\n      sticky: newValue\n    });\n  }\n\n  @Watch(\"position\")\n  @Watch(\"bleeding\")\n  positionWatcher() {\n    if (this.position === \"fixed\") {\n      if (this.observer) {\n        this.observer.disconnect();\n      }\n\n      window.addEventListener(\"scroll\", this.handleScroll, { passive: true });\n      window.addEventListener(\"resize\", this.handleResize);\n\n      this.updateFixedByResize();\n    } else {\n      if (this.bleeding) {\n        window.addEventListener(\"scroll\", this.handleScroll, { passive: true });\n        this.updateByScroll();\n      } else {\n        window.removeEventListener(\"scroll\", this.handleScroll);\n      }\n\n      window.removeEventListener(\"resize\", this.handleResize);\n      this.setUnfixed();\n\n      this.observer = new IntersectionObserver(this.observe, { threshold: [1] });\n      this.observer.observe(this.stickyElement);\n\n      this.updateStuck();\n    }\n  }\n\n  /** Sticky stuck top event */\n  @Event() stzhStuckTop: EventEmitter<StzhStickyStuckTopEvent>;\n\n  /** Sticky stuck bottom event */\n  @Event() stzhStuckBottom: EventEmitter<StzhStickyStuckBottomEvent>;\n\n  @Element() element: HTMLStzhStickyElement;\n\n  @State() isStuckTop: boolean;\n  @State() isStuckBottom: boolean;\n\n  @State() hasReachedTopLimit: boolean;\n  @State() hasReachedBottomLimit: boolean;\n\n  @State() loaded: boolean = false;\n\n  private observer: IntersectionObserver;\n  private stickyResizeObserver: ResizeObserver;\n  private debounceScroll: number;\n  private debounceResize: number;\n  private stickyElement: HTMLElement;\n  private spacerElement: HTMLElement;\n\n  private windowHeight: number;\n  private scrollX: number;\n  private scrollY: number;\n  private fixedTop: number;\n  private fixedLeft: number;\n  private fixedHeight: number = 0;\n  private fixedWidth: number = 0;\n  private fixedLimit: { top: number, bottom: number } | null = null;\n\n  private updateStuck() {\n    const topCss = parseInt(getComputedStyle(this.stickyElement).top, 10);\n    const bottomCss = parseInt(getComputedStyle(this.stickyElement).bottom, 10);\n    const rect = this.stickyElement.getBoundingClientRect();\n\n    if (topCss) {\n      this.isStuckTop = rect.top < 0;\n    } else {\n      this.isStuckTop = false;\n    }\n\n    if (bottomCss) {\n      this.isStuckBottom = document.documentElement.clientHeight < rect.bottom;\n    } else {\n      this.isStuckBottom = false;\n    }\n  }\n\n  private getFixedLimit(): { top: number, bottom: number } | null {\n    const stickyContainer = this.element.closest(`[${ATTR_STICKY_CONTAINER}]`);\n\n    if (!stickyContainer) {\n      return null;\n    }\n\n    const off = offset(stickyContainer);\n\n    return {\n      top: off.top,\n      bottom: off.top + stickyContainer.scrollHeight,\n    };\n  }\n\n  private setUnfixed() {\n    Object.assign(this.stickyElement.style, {\n      position: null,\n      top: null,\n      bottom: null,\n      left: null,\n      width: null,\n    });\n\n    Object.assign(this.spacerElement.style, {\n      display: \"none\",\n    });\n  }\n\n  private setFixed() {\n    const position = (this.hasReachedTopLimit || this.hasReachedBottomLimit)\n      ? \"absolute\"\n      : \"fixed\";\n\n    Object.assign(this.stickyElement.style, {\n      position,\n      top: position === \"absolute\"\n        ? `${this.isStuckTop ? this.fixedLimit.bottom - this.fixedHeight : this.fixedLimit.top}px`\n        : this.isStuckTop ? \"0px\" : \"auto\",\n      bottom: this.isStuckTop || position === \"absolute\"\n        ? \"auto\" : \"0px\",\n      left: `${this.fixedLeft + (position === \"fixed\" ? this.scrollX : 0)}px`,\n      width: `${this.fixedWidth}px`,\n    });\n\n    Object.assign(this.spacerElement.style, {\n      display: \"block\",\n    });\n  }\n\n  private handleScroll = () => {\n    if (this.debounceScroll) {\n      window.cancelAnimationFrame(this.debounceScroll);\n    }\n\n    this.debounceScroll = requestAnimationFrame(this.updateByScroll);\n  }\n\n  private handleResize = () => {\n    if (this.debounceResize) {\n      window.cancelAnimationFrame(this.debounceResize);\n    }\n\n    this.debounceResize = requestAnimationFrame(this.updateFixedByResize);\n  }\n\n  private handleStickyResize = throttle(() => {\n    this.stuckHeightWatcher();\n    this.updateByScroll();\n  }, 100);\n\n  private updateByScroll = () => {\n    if (!isVisible(this.stickyElement) || !this.element.isConnected) {\n      return;\n    }\n\n    const stickyFixedWidthContainer = this.element.closest(`[${ATTR_STICKY_WIDTH_CONTAINER}]`) as HTMLElement\n      || this.element.parentElement;\n\n    const off = offset(\n      (this.isStuckTop || this.isStuckBottom) && this.position === \"fixed\"\n      ? this.spacerElement : this.stickyElement\n    );\n\n    this.fixedTop = off.top;\n    this.fixedLeft = off.left;\n\n    stickyFixedWidthContainer.style.setProperty('--stzh-sticky-offset-top', `${this.fixedTop}px`);\n    stickyFixedWidthContainer.style.setProperty('--stzh-sticky-offset-left', `${this.fixedLeft}px`);\n\n    if (this.position === \"sticky\") {\n      // for position sticky we only need the offsets variables to be updated in bleeding variant\n      return;\n    }\n\n    this.fixedHeight = this.stickyElement.offsetHeight;\n    this.spacerElement.style.height = `${this.fixedHeight}px`;\n\n    this.scrollX = window.scrollX;\n    this.scrollY = window.scrollY;\n    this.fixedLimit = this.getFixedLimit();\n\n    this.fixedWidth = stickyFixedWidthContainer.getBoundingClientRect().width;\n\n    const unstuckWidth = this.element.getBoundingClientRect().width;\n    // stickyFixedWidthContainer.style.setProperty('--stzh-sticky-stuck-width', `${this.fixedWidth}px`);\n    stickyFixedWidthContainer.style.setProperty('--stzh-sticky-unstuck-width', `${unstuckWidth}px`);\n\n    // console.log(unstuckWidth);\n\n    // console.log(\n    //   this.scrollX,\n    //   this.scrollY,\n    //   this.windowHeight,\n    //   this.fixedTop,\n    //   this.fixedLeft,\n    //   this.fixedHeight,\n    //   this.fixedLimit,\n    // );\n\n    this.isStuckBottom = !this.disableStickyBottom\n      && this.scrollY + this.windowHeight <= this.fixedTop + this.fixedHeight;\n    this.isStuckTop = !this.disableStickyTop\n      && this.scrollY >= this.fixedTop;\n\n    this.hasReachedTopLimit = this.fixedLimit\n      && this.scrollY + this.windowHeight - this.fixedHeight <= this.fixedLimit.top;\n    this.hasReachedBottomLimit = this.fixedLimit\n      && this.scrollY >= this.fixedLimit.bottom - this.fixedHeight;\n\n    // console.log(\n    //   this.isStuckBottom,\n    //   this.isStuckTop,\n    //   this.hasReachedBottomLimit,\n    //   this.hasReachedTopLimit,\n    // );\n\n    if (this.isStuckTop || this.isStuckBottom) {\n      this.setFixed();\n      // stickyFixedWidthContainer.style.setProperty('--stzh-sticky-width', `${this.fixedWidth}px`);\n    } else {\n      this.setUnfixed();\n      // stickyFixedWidthContainer.style.setProperty('--stzh-sticky-width', `${unstuckWidth}px`);\n    }\n  }\n\n  private updateFixedByResize = () => {\n    if (!this.stickyElement || !this.element.isConnected) {\n      return;\n    }\n\n    // reset sticky so we can read current offsets\n    this.setUnfixed();\n    this.stickyElement.style.position = \"static\";\n    this.stickyElement.style.width = \"auto\";\n    this.isStuckTop = false;\n    this.isStuckBottom = false;\n\n    if (isVisible(this.stickyElement)) {\n      this.windowHeight = window.innerHeight;\n      this.updateByScroll();\n    }\n  }\n\n  private observe = () => {\n    this.updateStuck();\n  };\n\n  componentDidLoad() {\n    this.stickyResizeObserver = new ResizeObserver(this.handleStickyResize);\n    this.positionWatcher();\n\n    requestAnimationFrame(() => {\n      requestAnimationFrame(() => {\n        window.setTimeout(() => {\n          this.loaded = true;\n\n          if (this.position === \"fixed\") {\n            this.updateFixedByResize();\n          }\n        }, 250);\n      });\n    });\n  }\n\n  disconnectedCallback() {\n    this.observer?.disconnect();\n    this.stickyResizeObserver?.disconnect();\n\n    window.removeEventListener(\"scroll\", this.handleScroll);\n    window.removeEventListener(\"resize\", this.handleResize);\n  }\n\n  render() {\n    const isStuck = this.isStuckTop || this.isStuckBottom;\n\n    const classes = {\n      \"stzh-sticky\": true,\n      \"stzh-sticky--is-not-loaded\": !this.loaded,\n      \"stzh-sticky--is-stuck\": isStuck,\n      \"stzh-sticky--is-stuck-top\": this.isStuckTop,\n      \"stzh-sticky--is-stuck-bottom\": this.isStuckBottom,\n      \"stzh-sticky--is-disabled-sticky-top\": this.disableStickyTop,\n      \"stzh-sticky--is-disabled-sticky-bottom\": this.disableStickyBottom,\n      \"stzh-sticky--is-bleeding\": this.bleeding,\n      [`stzh-sticky--position-${this.position}`]: !!this.position,\n      [`stzh-sticky--${this.variant}`]: !!this.variant,\n    };\n\n    return (\n      <Host\n        is-stuck={this.isStuckTop || this.isStuckBottom}\n        is-stuck-top={this.isStuckTop}\n        is-stuck-bottom={this.isStuckBottom}\n      >\n        <div class={classes}>\n          <div\n            ref={(el) => (this.spacerElement = el as HTMLDivElement)}\n            class=\"stzh-sticky__spacer\"\n          ></div>\n          <div\n            ref={(el) => (this.stickyElement = el as HTMLDivElement)}\n            class=\"stzh-sticky__sticky\"\n          >\n            <div class=\"stzh-sticky__content\">\n              <div class=\"stzh-sticky__content-inner\">\n                <slot></slot>\n              </div>\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p-8ed7a61b.js → p-158996b9.js}

@@ -1,8 +1,8 @@
 import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-96cf9087.js';
-import { h as hasSlot } from './p-073888ce.js';
+import { h as hasSlot } from './p-095fbf73.js';
 import { S as StzhInputDescription } from './p-dd0d6b20.js';
 import { d as defineCustomElement$3 } from './p-6e55dee9.js';
-import { d as defineCustomElement$2 } from './p-d5ab066a.js';
+import { d as defineCustomElement$2 } from './p-777e6a82.js';
 import { d as defineCustomElement$1 } from './p-8b576ec4.js';
 
 /**
@@ -5545,4 +5545,4 @@ function defineCustomElement() {
 
 export { StzhDropdown as S, defineCustomElement as d };
 
-//# sourceMappingURL=p-8ed7a61b.js.map
+//# sourceMappingURL=p-158996b9.js.map