@zanichelli/albe-web-components 12.1.3-rc.0 → 12.1.3

package/www/build/p-f97c093d.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["stylesCss","ZPopoverStyle0","DOCUMENT_ELEMENT","document","documentElement","getParentElement","element","parentNode","host","findScrollableParent","parent","overflow","overflowX","overflowY","window","getComputedStyle","scrollHeight","clientHeight","scrollWidth","clientWidth","computeOffset","targetParentOffset","rect","getBoundingClientRect","width","height","top","left","offsetParent","offsetLeft","body","scrollY","offsetTop","DOMMatrix","style","transform","webkitTransform","domMatrix","m41","m42","parentWidth","parentHeight","innerWidth","innerHeight","offsetWidth","offsetHeight","right","bottom","ZPopover","PopoverPosition","AUTO","closePopoverWithKeyboard","e","this","closable","key","KeyboardCode","ESC","open","handleOutsideClick","composedPath","includes","target","triggerElemClicked","bindTo","HTMLElement","contains","closest","CSS","escape","stopPropagation","positionChange","emit","position","currentPosition","validatePosition","newValue","Object","values","onOpen","cancelAnimationFrame","animationFrameRequestId","setPosition","requestAnimationFrame","hasAttribute","removeAttribute","undefined","openChange","disconnectedCallback","ownerDocument","querySelector","parentElement","scrollContainer","scrollingBoundingRect","offsetContainer","relativeBoundingRect","boundingRect","scrollTop","scrollLeft","overflowBottom","Math","max","overflowRight","availableTop","min","availableBottom","availableLeft","availableRight","availableHeight","availableWidth","positions","push","LEFT","RIGHT","unshift","TOP","BOTTOM","join","offsetRight","offsetBottom","offsetModifier","center","sizeModifier","TOP_RIGHT","maxHeight","maxWidth","TOP_LEFT","BOTTOM_RIGHT","BOTTOM_LEFT","RIGHT_BOTTOM","RIGHT_TOP","LEFT_BOTTOM","LEFT_TOP","setAttribute","componentWillLoad","render","h"],"sources":["src/components/z-popover/styles.css?tag=z-popover&encapsulation=shadow","src/components/z-popover/index.tsx"],"sourcesContent":[":host {\n  --z-popover-theme--surface: var(--color-surface01);\n  --z-popover-theme--text: var(--color-text01);\n  --z-popover-padding: 0;\n  --z-popover-shadow-filter: drop-shadow(0 1px 2px var(--shadow-color-base));\n\n  position: relative;\n  display: none;\n  min-width: calc(var(--space-unit) * 8);\n  min-height: calc(var(--space-unit) * 4);\n  align-items: center;\n  justify-content: center;\n  padding: var(--z-popover-padding);\n  background: var(--z-popover-theme--surface);\n  border-radius: var(--border-radius-small);\n  color: var(--z-popover-theme--text);\n  fill: currentcolor;\n  filter: var(--z-popover-shadow-filter);\n  font-family: var(--font-family-sans);\n  text-align: center;\n}\n\n:host([open][current-position]),\n:host([open=\"true\"][current-position]) {\n  display: flex;\n}\n\n:host([center][current-position=\"top\"]),\n:host([center][current-position=\"bottom\"]) {\n  transform: translateX(-50%);\n}\n\n:host([center][current-position=\"right\"]),\n:host([center][current-position=\"left\"]) {\n  transform: translateY(-50%);\n}\n\n:host([current-position^=\"top\"]) {\n  margin: 0 0 var(--space-unit);\n}\n\n:host([current-position^=\"bottom\"]) {\n  margin: var(--space-unit) 0 0;\n}\n\n:host([current-position^=\"left\"]) {\n  margin: 0 var(--space-unit) 0 0;\n}\n\n:host([current-position^=\"right\"]) {\n  margin: 0 0 0 var(--space-unit);\n}\n\n/* Arrow style */\n\n:host([current-position])::before {\n  --arrow-size: 6px;\n  --arrow-edge-offset: calc(100% - var(--space-unit) - (var(--arrow-size) / 2));\n  --arrow-center-x-offset: calc(50% - (var(--arrow-size) / 2));\n  --arrow-center-y-offset: calc(100% - (var(--arrow-size) / 2));\n\n  position: absolute;\n  display: block;\n  width: var(--arrow-size);\n  height: var(--arrow-size);\n  background: var(--z-popover-theme--surface);\n  content: \"\";\n  transform: rotate(45deg);\n}\n\n:host([show-arrow=\"false\"])::before,\n:host(:not([show-arrow]))::before {\n  display: none;\n}\n\n:host([current-position^=\"top\"])::before {\n  top: var(--arrow-center-y-offset);\n}\n\n:host([current-position^=\"bottom\"])::before {\n  bottom: var(--arrow-center-y-offset);\n}\n\n:host([current-position=\"top\"])::before,\n:host([current-position=\"bottom\"])::before {\n  right: var(--arrow-edge-offset);\n}\n\n:host([current-position=\"right\"])::before,\n:host([current-position=\"left\"])::before {\n  bottom: var(--arrow-edge-offset);\n}\n\n:host([current-position=\"right\"])::before {\n  right: var(--arrow-center-y-offset);\n}\n\n:host([current-position=\"left\"])::before {\n  left: var(--arrow-center-y-offset);\n}\n\n:host([current-position=\"top_right\"])::before,\n:host([current-position=\"bottom_right\"])::before {\n  right: var(--arrow-edge-offset);\n}\n\n:host([current-position=\"top_left\"])::before,\n:host([current-position=\"bottom_left\"])::before {\n  left: var(--arrow-edge-offset);\n}\n\n:host([current-position=\"right_top\"])::before,\n:host([current-position=\"left_top\"])::before {\n  top: var(--arrow-edge-offset);\n}\n\n:host([current-position=\"right_top\"])::before,\n:host([current-position=\"right_bottom\"])::before {\n  right: var(--arrow-center-y-offset);\n}\n\n:host([current-position=\"left_top\"])::before,\n:host([current-position=\"left_bottom\"])::before {\n  left: var(--arrow-center-y-offset);\n}\n\n:host([current-position=\"right_bottom\"])::before,\n:host([current-position=\"left_bottom\"])::before {\n  bottom: var(--arrow-edge-offset);\n}\n\n:host([center][current-position=\"top\"])::before,\n:host([center][current-position=\"bottom\"])::before {\n  right: auto;\n  left: var(--arrow-center-x-offset);\n}\n\n:host([center][current-position=\"right\"])::before,\n:host([center][current-position=\"left\"])::before {\n  top: var(--arrow-center-x-offset);\n  bottom: auto;\n}\n\n::slotted(*) {\n  overflow: auto;\n  flex: 1 auto;\n}\n","import {Component, Prop, h, Watch, Listen, Element, State, Event, EventEmitter} from \"@stencil/core\";\nimport {PopoverPosition, KeyboardCode} from \"../../beans\";\n\nconst DOCUMENT_ELEMENT = document.documentElement;\n\nfunction getParentElement(element: Element): ShadowRoot[\"host\"] {\n  if ((element.parentNode as ShadowRoot).host) {\n    return (element.parentNode as ShadowRoot).host;\n  }\n\n  return element.parentNode as Element;\n}\n\n/**\n * Find the closest scrollable parent of a node.\n *\n * @param {Element} element The node\n */\nfunction findScrollableParent(element: Element): Element {\n  let parent = getParentElement(element);\n\n  while (parent && parent !== DOCUMENT_ELEMENT) {\n    const {overflow, overflowX, overflowY} = window.getComputedStyle(parent);\n    if (overflow === \"hidden\" || overflowY === \"hidden\" || overflowX === \"hidden\") {\n      return parent;\n    }\n\n    if (\n      (parent.scrollHeight > parent.clientHeight && overflow !== \"visible\" && overflowY !== \"visible\") ||\n      (parent.scrollWidth > parent.clientWidth && overflow !== \"visible\" && overflowX !== \"visible\")\n    ) {\n      return parent;\n    }\n\n    parent = getParentElement(parent);\n  }\n\n  return DOCUMENT_ELEMENT;\n}\n\n/**\n * Calculate computed offset.\n * It includes matrix transformations.\n * @param element The target element.\n * @param targetParentOffset The relative offset parent.\n * @return A client rect object.\n */\nfunction computeOffset(element: HTMLElement, targetParentOffset?: HTMLElement): Record<string, number> {\n  const rect = element.getBoundingClientRect();\n  const width = rect.width;\n  const height = rect.height;\n\n  let top = 0;\n  let left = 0;\n  let offsetParent = element;\n  while (offsetParent && offsetParent != targetParentOffset) {\n    left += offsetParent.offsetLeft;\n\n    // document.body sometimes has offsetTop == 0 but still has an\n    // offset because of children margins!\n    if (offsetParent === document.body) {\n      top += offsetParent.getBoundingClientRect().top + window.scrollY;\n    } else {\n      top += offsetParent.offsetTop;\n    }\n\n    if (window.DOMMatrix) {\n      const style = window.getComputedStyle(offsetParent);\n      const transform = style.transform || style.webkitTransform;\n      const domMatrix = new DOMMatrix(transform);\n      if (domMatrix) {\n        left += domMatrix.m41;\n        if (offsetParent !== document.body) {\n          top += domMatrix.m42;\n        }\n      }\n    }\n\n    if (!offsetParent.offsetParent) {\n      break;\n    }\n\n    offsetParent = offsetParent.offsetParent as HTMLElement;\n  }\n\n  let parentWidth: number;\n  let parentHeight: number;\n  if (offsetParent === document.body) {\n    parentWidth = window.innerWidth;\n    parentHeight = window.innerHeight;\n  } else {\n    parentWidth = offsetParent.offsetWidth;\n    parentHeight = offsetParent.offsetHeight;\n  }\n\n  const right = parentWidth - left - rect.width;\n  const bottom = parentHeight - top - rect.height;\n\n  return {top, right, bottom, left, width, height};\n}\n\n/**\n * Popover component.\n *\n * @cssprop --z-popover-theme--surface - background color of the popover.\n * @cssprop --z-popover-theme--text - foreground color of the popover.\n * @cssprop --z-popover-padding - padding of the popover.\n * @cssprop --z-popover-shadow-filter - drop-shadow filter of the popover. Defaults to `drop-shadow(0 1px 2px var(--shadow-color-base))`.\n */\n@Component({\n  tag: \"z-popover\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZPopover {\n  /** Popover position. */\n  @Prop({reflect: true})\n  position: PopoverPosition = PopoverPosition.AUTO;\n\n  /**\n   * The open state of the popover.\n   */\n  @Prop({reflect: true, mutable: true})\n  open = false;\n\n  /**\n   * The selector or the element bound with the popover.\n   */\n  @Prop()\n  bindTo?: string | HTMLElement;\n\n  /**\n   * Whether to show popover's arrow.\n   */\n  @Prop({reflect: true})\n  showArrow = false;\n\n  /**\n   * Whether to center the popup on the main side (according to \"position\").\n   */\n  @Prop({reflect: true})\n  center = false;\n\n  /**\n   * If true, the popover can be closed by clicking outside of it or pressing the escape key.\n   * Otherwise, it will be closed only programmatically (by setting `open` to `false`).\n   */\n  @Prop()\n  closable = true;\n\n  /**\n   * The current position of the popover.\n   */\n  @State()\n  currentPosition?: PopoverPosition;\n\n  /**\n   * Position change event.\n   */\n  @Event()\n  positionChange: EventEmitter;\n\n  /**\n   * Open change event.\n   */\n  @Event()\n  openChange: EventEmitter;\n\n  @Element() host: HTMLZPopoverElement;\n\n  private animationFrameRequestId?: number;\n\n  @Listen(\"keyup\", {target: \"window\"})\n  closePopoverWithKeyboard(e: KeyboardEvent): void {\n    if (this.closable && e.key === KeyboardCode.ESC) {\n      this.open = false;\n    }\n  }\n\n  /**\n   * Close the popover when clicking outside of its content.\n   * Stop event propagation if the click was fired by popover's trigger element,\n   * to prevent close and reopen glitches.\n   * @param {MouseEvent} e\n   */\n  @Listen(\"click\", {target: \"body\", capture: true})\n  handleOutsideClick(e: MouseEvent): void {\n    if (!this.closable || !this.open) {\n      return;\n    }\n\n    if (!e.composedPath().includes(this.host)) {\n      const target = e.target as HTMLElement;\n      const triggerElemClicked =\n        this.bindTo instanceof HTMLElement ? this.bindTo.contains(target) : target.closest(CSS.escape(this.bindTo));\n      if (triggerElemClicked) {\n        e.stopPropagation();\n      }\n\n      this.open = false;\n      this.positionChange.emit({position: this.currentPosition});\n    }\n  }\n\n  @Watch(\"position\")\n  validatePosition(newValue: PopoverPosition): void {\n    if (newValue && !Object.values(PopoverPosition).includes(newValue as PopoverPosition)) {\n      this.position = PopoverPosition.AUTO;\n    }\n\n    this.currentPosition = this.position;\n    this.positionChange.emit({position: this.currentPosition});\n  }\n\n  /**\n   * Setup popover behaviors on opening.\n   */\n  @Watch(\"open\")\n  onOpen(): void {\n    cancelAnimationFrame(this.animationFrameRequestId);\n    if (this.open) {\n      const setPosition = (): void => {\n        if (this.open) {\n          this.setPosition();\n          this.animationFrameRequestId = requestAnimationFrame(setPosition);\n        }\n      };\n\n      setPosition();\n    } else if (this.host.hasAttribute(\"current-position\")) {\n      this.host.removeAttribute(\"current-position\");\n      this.currentPosition = undefined;\n    }\n\n    this.openChange.emit({open: this.open});\n  }\n\n  disconnectedCallback(): void {\n    cancelAnimationFrame(this.animationFrameRequestId);\n  }\n\n  /**\n   * Set the position of the popover.\n   */\n  private setPosition(): void {\n    let element: HTMLElement;\n    if (typeof this.bindTo === \"string\") {\n      element = this.host.ownerDocument.querySelector(CSS.escape(this.bindTo)) as HTMLElement;\n    } else if (this.bindTo) {\n      element = this.bindTo;\n    } else {\n      element = this.host.parentElement as HTMLElement;\n    }\n\n    if (!element) {\n      return;\n    }\n\n    const scrollContainer = findScrollableParent(element) as HTMLElement;\n    const scrollingBoundingRect = scrollContainer.getBoundingClientRect();\n    const offsetContainer = this.host.offsetParent as HTMLElement;\n\n    const relativeBoundingRect = offsetContainer\n      ? computeOffset(offsetContainer, scrollContainer)\n      : {top: 0, right: 0, bottom: 0, left: 0};\n    const boundingRect = computeOffset(element, scrollContainer);\n\n    const top = boundingRect.top - scrollContainer.scrollTop;\n    const bottom = scrollingBoundingRect.height - (boundingRect.top + boundingRect.height) + scrollContainer.scrollTop;\n    const left = boundingRect.left - scrollContainer.scrollLeft;\n    const right = scrollingBoundingRect.width - (boundingRect.left + boundingRect.width) + scrollContainer.scrollLeft;\n\n    const overflowBottom = Math.max(0, scrollingBoundingRect.top + scrollingBoundingRect.height - window.innerHeight);\n    const overflowRight = Math.max(0, scrollingBoundingRect.left + scrollingBoundingRect.width - window.innerWidth);\n\n    const availableTop = Math.min(top, top + scrollingBoundingRect.top);\n    const availableBottom = Math.min(bottom, bottom - overflowBottom);\n    const availableLeft = Math.min(left, left + scrollingBoundingRect.left);\n    const availableRight = Math.min(right, right - overflowRight);\n\n    const availableHeight = availableTop + availableBottom + boundingRect.height;\n    const availableWidth = availableLeft + availableRight + boundingRect.width;\n\n    let position = this.currentPosition;\n    const positions: PopoverPosition[] = [];\n    if (this.position === PopoverPosition.AUTO) {\n      /**\n       * The `AUTO` position tries to place the popover in the 'safest' area,\n       * where there's more space available.\n       */\n      if (availableLeft / availableWidth > 0.6) {\n        positions.push(PopoverPosition.LEFT);\n      } else if (availableLeft / availableWidth < 0.4) {\n        positions.push(PopoverPosition.RIGHT);\n      }\n\n      if (availableTop / availableHeight > 0.9) {\n        positions.unshift(PopoverPosition.TOP);\n      } else if (availableTop / availableHeight > 0.6) {\n        positions.push(PopoverPosition.TOP);\n      } else if (availableTop / availableHeight < 0.1) {\n        positions.unshift(PopoverPosition.BOTTOM);\n      } else {\n        positions.push(PopoverPosition.BOTTOM);\n      }\n\n      position = positions.join(\"_\") as PopoverPosition;\n    }\n\n    const style = this.host.style;\n    style.position = \"absolute\";\n\n    const offsetTop = boundingRect.top - relativeBoundingRect.top;\n    const offsetRight = boundingRect.right - relativeBoundingRect.right;\n    const offsetBottom = boundingRect.bottom - relativeBoundingRect.bottom;\n    const offsetLeft = boundingRect.left - relativeBoundingRect.left;\n    const offsetModifier = this.center ? 0.5 : 0;\n    const sizeModifier = this.center ? 0.5 : 0;\n\n    if (position === PopoverPosition.TOP || position === PopoverPosition.TOP_RIGHT) {\n      style.top = \"auto\";\n      style.right = \"auto\";\n      style.bottom = `${offsetBottom + boundingRect.height}px`;\n\n      style.left = `${offsetLeft + boundingRect.width * offsetModifier}px`;\n      style.maxHeight = `${availableTop}px`;\n      if (position === PopoverPosition.TOP_RIGHT) {\n        style.maxWidth = `${availableRight + boundingRect.width * sizeModifier}px`;\n      }\n    } else if (position === PopoverPosition.TOP_LEFT) {\n      style.top = \"auto\";\n      style.right = `${offsetRight + boundingRect.width * offsetModifier}px`;\n      style.bottom = `${offsetBottom + boundingRect.height}px`;\n      style.left = \"auto\";\n      style.maxWidth = `${availableLeft}px`;\n      style.maxHeight = `${availableTop}px`;\n    } else if (position === PopoverPosition.BOTTOM || position === PopoverPosition.BOTTOM_RIGHT) {\n      style.top = `${offsetTop + boundingRect.height}px`;\n      style.right = \"auto\";\n      style.bottom = \"auto\";\n      style.left = `${offsetLeft + boundingRect.width * offsetModifier}px`;\n      style.maxHeight = `${availableBottom}px`;\n      if (position === PopoverPosition.BOTTOM_RIGHT) {\n        style.maxWidth = `${availableRight + boundingRect.width * sizeModifier}px`;\n      }\n    } else if (position === PopoverPosition.BOTTOM_LEFT) {\n      style.top = `${offsetTop + boundingRect.height}px`;\n      style.right = `${offsetRight + boundingRect.width * offsetModifier}px`;\n      style.bottom = \"auto\";\n      style.left = \"auto\";\n      style.maxWidth = `${availableLeft}px`;\n      style.maxHeight = `${availableBottom}px`;\n    } else if (position === PopoverPosition.RIGHT || position === PopoverPosition.RIGHT_BOTTOM) {\n      style.top = `${offsetTop + boundingRect.height * offsetModifier}px`;\n      style.right = \"auto\";\n      style.bottom = \"auto\";\n      style.left = `${offsetLeft + boundingRect.width}px`;\n      style.maxWidth = `${availableRight}px`;\n      style.maxHeight = `${availableBottom + boundingRect.height * sizeModifier}px`;\n    } else if (position === PopoverPosition.RIGHT_TOP) {\n      style.top = \"auto\";\n      style.right = \"auto\";\n      style.bottom = `${offsetBottom + boundingRect.height * offsetModifier}px`;\n      style.left = `${offsetLeft + boundingRect.width}px`;\n      style.maxWidth = `${availableRight}px`;\n      style.maxHeight = `${availableTop + boundingRect.height * sizeModifier}px`;\n    } else if (position === PopoverPosition.LEFT || position === PopoverPosition.LEFT_BOTTOM) {\n      style.top = `${offsetTop + boundingRect.height * offsetModifier}px`;\n      style.right = `${offsetRight + boundingRect.width}px`;\n      style.bottom = \"auto\";\n      style.left = \"auto\";\n      style.maxWidth = `${availableLeft}px`;\n      style.maxHeight = `${availableBottom + boundingRect.height * sizeModifier}px`;\n    } else if (position === PopoverPosition.LEFT_TOP) {\n      style.top = \"auto\";\n      style.right = `${offsetRight + boundingRect.width}px`;\n      style.bottom = `${offsetBottom + boundingRect.height * offsetModifier}px`;\n      style.left = \"auto\";\n      style.maxWidth = `${availableLeft}px`;\n      style.maxHeight = `${availableTop + boundingRect.height * sizeModifier}px`;\n    }\n\n    this.currentPosition = position || this.position;\n    this.host.setAttribute(\"current-position\", this.currentPosition);\n  }\n\n  componentWillLoad(): void {\n    this.validatePosition(this.position);\n    this.onOpen();\n  }\n\n  render(): HTMLSlotElement {\n    return <slot></slot>;\n  }\n}\n"],"mappings":"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"}

package/www/build/p-f9ddfc93.entry.js

@@ -1,2 +0,0 @@
-import{r as t,c as i,h as e,g as r}from"./p-10bb4f4b.js";import{Y as o}from"./p-025f494e.js";import{m as a}from"./p-2c886e8b.js";import{r as s}from"./p-955da62e.js";const n=':host{--z-book-card-ribbon-background-color:var(--avatar-C08);--z-book-card-ribbon-shadow-color:var(--green950);--z-book-card-compact-width:262px;--z-book-card-compact-height:568px}:host>article{display:block;width:100%;max-width:360px;box-sizing:border-box;border:var(--border-size-medium) solid var(--color-surface03);background-color:var(--color-surface01);border-radius:var(--border-radius);font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>article div.cover{position:relative}:host>article div.cover div.img-wrapper{display:flex;overflow:hidden;border:var(--border-size-small) solid var(--color-surface03);line-height:0}:host>article div.cover div.img-wrapper img{width:auto;max-width:100%;height:auto;max-height:100%;align-self:flex-end}:host>article div.cover .ribbon{position:absolute;z-index:10;top:calc(var(--space-unit) * 2);left:calc(var(--space-unit) * -2);display:flex;max-width:100%;height:calc(var(--space-unit) * 4);box-sizing:border-box;align-items:center;padding:0 calc(var(--space-unit) * 2);border:var(--border-size-medium) solid var(--color-surface01);background:var(--z-book-card-ribbon-background-color);border-radius:0 var(--border-radius) var(--border-radius) 0;box-shadow:var(--shadow-2);color:var(--color-text04);font-family:var(--font-family-sans);font-size:var(--font-size-2);font-weight:var(--font-sb);line-height:initial}:host>article div.cover .ribbon.interactive:hover{cursor:pointer}:host>article div.cover .ribbon span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-wrap:nowrap}:host>article div.cover .ribbon::before{position:absolute;bottom:-12px;left:-2px;width:0;height:0;border-top:10px solid var(--z-book-card-ribbon-shadow-color);border-left:16px solid transparent;content:""}:host>article div.cover .ribbon z-icon{margin-right:var(--space-unit)}:host>article div.content{margin:var(--space-unit) 0;border-radius:var(--border-radius)}:host>article .title{display:flex;height:100%;align-self:center;color:var(--color-text02);font-size:var(--font-size-4);font-weight:var(--font-sb);line-height:1.5}:host>article .title *{all:unset}:host>article div.subtitle{color:var(--color-text02);font-size:var(--font-size-2);font-weight:var(--font-rg);line-height:1.4}:host>article div.authors{color:var(--color-text02);font-size:var(--font-size-1);font-weight:var(--font-rg);line-height:1.33}:host>article div.isbn{overflow:hidden;color:var(--color-text02);font-size:var(--font-size-2);line-height:1.33;text-overflow:ellipsis;white-space:nowrap;word-wrap:nowrap}:host>article div.isbn>.code{font-weight:var(--font-sb)}:host>article div.tags{display:flex;overflow:hidden;max-height:32px;flex-flow:row wrap;align-content:stretch;align-items:stretch;justify-content:flex-start;gap:calc(var(--space-unit) / 2)}:host>article ::slotted([slot="tags"]){margin-bottom:var(--space-unit)}:host>article ::slotted([slot="header-cta"]){--z-icon-width:20px;--z-icon-height:20px;padding:var(--space-unit);cursor:pointer;fill:var(--color-icon01)}:host>article.expanded{width:100%;min-width:328px;padding:calc(var(--space-unit) * 2);padding-bottom:0}:host>article.expanded div.header{display:flex;flex-flow:row nowrap;align-content:stretch;align-items:top;justify-content:space-between;margin-bottom:var(--space-unit);white-space:nowrap}:host>article.expanded div.cover div.img-wrapper{border-radius:var(--border-radius)}:host>article.expanded div.cover div.img-wrapper img{width:100%}:host>article.expanded .title,:host>article.expanded .subtitle,:host>article.expanded .authors{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2;white-space:initial}:host>article.expanded div.footer{border-top:var(--border-size-small) solid var(--color-surface03);margin-bottom:calc(var(--space-unit) * 1.5)}:host>article.expanded div.footer.open{padding-top:calc(var(--space-unit) * 1.5)}:host>article.expanded div.footer.open div.resources{display:initial}:host>article.expanded div.footer.close div.resources{display:none}:host>article.expanded button.show-resources{--z-icon-height:16px;--z-icon-width:16px;all:unset;display:flex;width:100%;flex-flow:row nowrap;align-content:center;align-items:center;justify-content:center;padding:calc(var(--space-unit) * 1) 0;color:var(--color-link-primary);cursor:pointer;fill:var(--color-link-primary);font-size:var(--font-size-2);font-weight:var(--font-sb);gap:var(--space-unit)}:host>article.expanded button.show-resources:focus{box-shadow:var(--shadow-focus-primary)}:host>article.search{width:262px;height:616px;padding:calc(var(--space-unit) * 2);padding-bottom:0}:host>article.search .wrapper-container{display:flex;height:100%;flex-direction:column;justify-content:space-between}:host>article.search .wrapper-container .wrapper{height:451px}:host>article.search .wrapper-container .action-container{padding-bottom:calc(var(--space-unit) * 2)}:host>article.search div.header{display:flex;height:24px;flex-flow:row nowrap;align-content:stretch;align-items:center;justify-content:space-between;margin-bottom:calc(var(--space-unit) * 1.5);white-space:nowrap}:host>article.search div.cover div.img-wrapper{height:314px;border-radius:var(--border-radius)}:host>article.search .title{display:block;height:initial;align-self:unset;font-size:var(--font-size-3)}:host>article.search .title,:host>article.search .subtitle,:host>article.search .authors{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host>article.compact{width:var(--z-book-card-compact-width);height:var(--z-book-card-compact-height)}:host>article.compact.borderless{border:none}:host>article.compact div.cover div.img-wrapper{width:100%;height:calc(var(--z-book-card-compact-width) * 1.36);box-sizing:border-box;border:none;background:var(--color-white);border-radius:var(--border-radius) var(--border-radius) 0 0;box-shadow:var(--shadow-2)}:host>article.compact div.wrapper{display:flex;height:100%;flex-flow:column nowrap;align-content:stretch;align-items:stretch;justify-content:flex-start}:host>article.compact div.content{display:flex;box-sizing:border-box;flex-flow:column nowrap;align-content:stretch;align-items:stretch;justify-content:space-between;padding:calc(var(--space-unit) * 2);padding-top:var(--space-unit);margin:0}:host>article.compact div.action-container{padding:calc(var(--space-unit) * 2);padding-top:0;margin-top:auto}:host>article.compact.borderless div.cover div.img-wrapper{width:var(--z-book-card-compact-width)}:host>article.compact.borderless div.content{padding:0;padding-top:var(--space-unit)}:host>article.compact.borderless div.action-container{padding:0;padding-bottom:calc(var(--space-unit) * 2)}:host>article.compact .title{display:block;height:initial;align-self:unset}:host>article.compact .title,:host>article.compact .subtitle,:host>article.compact .authors{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2;white-space:initial}@media (min-width: 768px){:host>article{width:100%;max-width:initial}:host>article .title{display:block;height:initial;align-self:unset}:host>article.expanded{width:100%;min-width:initial;max-width:initial;height:360px;padding:0;border:0}:host>article.expanded div.wrapper{display:flex;flex-flow:row nowrap;align-content:stretch;align-items:stretch;justify-content:flex-start}:host>article.expanded div.cover div.img-wrapper{width:262px;height:356px;border:0;border:var(--border-size-medium) solid var(--color-surface03);border-right:none;background:var(--color-surface01);border-radius:var(--border-radius) 0 0 var(--border-radius)}:host>article.expanded div.cover div.img-wrapper img{width:auto;border-radius:0}:host>article.expanded div.content{display:flex;overflow:hidden;width:100%;height:356px;flex-flow:column nowrap;align-content:stretch;align-items:stretch;justify-content:space-between;border:var(--border-size-medium) solid var(--color-surface03);border-left:none;margin:0;background:var(--color-surface01);border-radius:0 var(--border-radius) var(--border-radius) 0}:host>article.expanded div.content div.top{padding:calc(var(--space-unit) * 2);padding-bottom:0}:host>article.expanded div.content div.top div.info{display:flex;flex-flow:row nowrap;align-content:stretch;align-items:stretch;justify-content:space-between;margin-bottom:calc(var(--space-unit) / 2)}:host>article.expanded div.content div.top div.info>div.left{width:100%}:host>article.expanded div.content div.bottom{padding:calc(var(--space-unit) * 2);padding-bottom:0}}@media (min-width: 1152px){:host>article{width:fit-content;max-width:initial}}@media (min-width: 1366px){:host>article.expanded{width:635px}:host>article.expanded div.content{width:369px}}';const d=n;const c=class{constructor(e){t(this,e);this.ribbonClick=i(this,"ribbonClick",7);this.variant=undefined;this.cover=undefined;this.operaTitle=undefined;this.volumeTitle=undefined;this.authors=undefined;this.isbn=undefined;this.isbnLabel="";this.ribbon=undefined;this.ribbonIcon=undefined;this.ribbonInteractive=undefined;this.borderless=undefined;this.fallbackCover=undefined;this.operaTitleTag=undefined;this.isMobile=false;this.hasResources=false;this.showResources=false}emitRibbonClick(){this.ribbonClick.emit()}componentWillLoad(){this.id=`id-${s()}`;const t=window.matchMedia(`(max-width: ${a}px)`);this.isMobile=t.matches;t.onchange=t=>this.isMobile=t.matches}componentDidLoad(){this.handleResources()}handleResources(){var t;if(this.variant!==o.EXPANDED||!this.isMobile){return}this.hasResources=((t=this.hostElement.querySelectorAll("[slot=resources]"))===null||t===void 0?void 0:t.length)>0}toggleResources(){this.showResources=!this.showResources}renderCard(){switch(this.variant){case o.EXPANDED:return this.isMobile?this.renderMobileExpandedCard():this.renderExpandedCard();case o.COMPACT:return this.renderCompactCard();case o.SEARCH:return this.renderSearchCard()}}renderExpandedCard(){return e("div",{class:"wrapper"},this.renderCover(),e("div",{class:"content"},e("div",{class:"top"},e("div",{class:"info"},e("div",{class:"left"},this.renderAuthors(),this.renderOperaTitle(),this.renderVolumeTitle(),this.renderIsbn()),e("div",{class:"right"},this.renderHeaderCtaSlot())),this.renderTagsSlot()),e("div",{class:"bottom"},this.renderResourcesSlot())))}renderMobileExpandedCard(){return e("div",{class:"wrapper"},e("div",{class:"header"},this.renderOperaTitle(),this.renderHeaderCtaSlot()),this.renderCover(),e("div",{class:"content"},this.renderTagsSlot(),this.renderAuthors(),this.renderVolumeTitle(),this.renderIsbn()),this.hasResources&&e("div",{class:{footer:true,open:this.showResources,close:!this.showResources}},!this.showResources&&this.renderShowResources(),this.renderResourcesSlot(),this.showResources&&this.renderShowResources()))}renderSearchCard(){return e("div",{class:"wrapper-container"},e("div",{class:"wrapper"},e("div",{class:"header"},this.renderOperaTitle(),this.renderHeaderCtaSlot()),this.renderCover(),e("div",{class:"content"},this.renderTagsSlot(),this.renderAuthors(),this.renderVolumeTitle(),this.renderIsbn())),this.renderFooterCtaSlot())}renderCompactCard(){return e("div",{class:"wrapper"},this.renderCover(),e("div",{class:"content"},this.renderAuthors(),this.renderOperaTitle(),this.renderVolumeTitle(),this.renderIsbn()),this.renderFooterCtaSlot())}renderCover(){return e("div",{class:"cover"},this.ribbon&&this.variant!==o.COMPACT&&this.renderRibbon(),e("div",{class:"img-wrapper"},e("img",{src:this.cover,onError:()=>{if(this.fallbackCover){this.cover=this.fallbackCover}},"aria-hidden":"true"})))}renderRibbon(){const t=[this.ribbonIcon&&e("z-icon",{name:this.ribbonIcon,width:16,height:16,fill:"color-icon03"}),e("span",null,this.ribbon)];return this.ribbonInteractive?e("button",{class:"ribbon interactive",onClick:()=>this.emitRibbonClick()},t):e("div",{class:"ribbon"},t)}renderOperaTitle(){const t=this.operaTitleTag?`<${this.operaTitleTag}>${this.operaTitle}</${this.operaTitleTag}>`:this.operaTitle;return e("div",{class:"title",innerHTML:t})}renderVolumeTitle(){return this.volumeTitle?e("div",{class:"subtitle"},this.volumeTitle):null}renderAuthors(){return this.authors?e("div",{class:"authors","aria-description":"Autori"},this.authors):null}renderIsbn(){return this.isbn?e("div",{class:"isbn"},e("span",{class:"code","aria-description":`ISBN ${this.isbnLabel}`},this.isbn),this.isbnLabel?e("span",{class:"label"}," ",this.isbnLabel):null):null}renderShowResources(){return e("button",{class:"show-resources","aria-label":`Risorse del libro ${this.operaTitle}`,"aria-expanded":this.showResources.toString(),"aria-controls":`resources-${this.id}`,onClick:()=>this.toggleResources()},this.showResources?"Chiudi":"Vedi tutto",e("z-icon",{name:this.showResources?"chevron-up":"chevron-down"}))}renderTagsSlot(){return e("div",{class:"tags"},e("slot",{name:"tags"}))}renderHeaderCtaSlot(){return e("slot",{name:"header-cta"})}renderResourcesSlot(){return e("div",{id:`resources-${this.id}`,class:"resources"},e("slot",{name:"resources",onSlotchange:()=>this.handleResources()}))}renderFooterCtaSlot(){return e("div",{class:"action-container"},e("slot",{name:"footer-cta"}))}render(){return e("article",{key:"0be831c7e7f9c9cc2684610dd8015d46820ce07d",class:{[this.variant]:true,borderless:!!this.borderless}},this.renderCard())}get hostElement(){return r(this)}};c.style=d;export{c as z_book_card};
-//# sourceMappingURL=p-f9ddfc93.entry.js.map

package/www/build/p-f9ddfc93.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["stylesCss","ZBookCardStyle0","ZBookCard","emitRibbonClick","this","ribbonClick","emit","componentWillLoad","id","randomId","mobileMediaQuery","window","matchMedia","mobileBreakpoint","isMobile","matches","onchange","mql","componentDidLoad","handleResources","variant","BookCardVariant","EXPANDED","hasResources","_a","hostElement","querySelectorAll","length","toggleResources","showResources","renderCard","renderMobileExpandedCard","renderExpandedCard","COMPACT","renderCompactCard","SEARCH","renderSearchCard","h","class","renderCover","renderAuthors","renderOperaTitle","renderVolumeTitle","renderIsbn","renderHeaderCtaSlot","renderTagsSlot","renderResourcesSlot","footer","open","close","renderShowResources","renderFooterCtaSlot","ribbon","renderRibbon","src","cover","onError","fallbackCover","content","ribbonIcon","name","width","height","fill","ribbonInteractive","onClick","title","operaTitleTag","operaTitle","innerHTML","volumeTitle","authors","isbn","isbnLabel","toString","onSlotchange","render","key","borderless"],"sources":["src/components/z-book-card/styles.css?tag=z-book-card&encapsulation=shadow","src/components/z-book-card/index.tsx"],"sourcesContent":["/* COMMON STYLES */\n\n:host {\n  --z-book-card-ribbon-background-color: var(--avatar-C08);\n  --z-book-card-ribbon-shadow-color: var(--green950);\n  --z-book-card-compact-width: 262px;\n  --z-book-card-compact-height: 568px;\n}\n\n:host > article {\n  display: block;\n  width: 100%;\n  max-width: 360px;\n  box-sizing: border-box;\n  border: var(--border-size-medium) solid var(--color-surface03);\n  background-color: var(--color-surface01);\n  border-radius: var(--border-radius);\n  font-family: var(--font-family-sans);\n  font-weight: var(--font-rg);\n}\n\n:host > article div.cover {\n  position: relative;\n}\n\n:host > article div.cover div.img-wrapper {\n  display: flex;\n  overflow: hidden;\n  border: var(--border-size-small) solid var(--color-surface03);\n  line-height: 0;\n}\n\n:host > article div.cover div.img-wrapper img {\n  width: auto;\n  max-width: 100%;\n  height: auto;\n  max-height: 100%;\n  align-self: flex-end;\n}\n\n:host > article div.cover .ribbon {\n  position: absolute;\n  z-index: 10;\n  top: calc(var(--space-unit) * 2);\n  left: calc(var(--space-unit) * -2);\n  display: flex;\n  max-width: 100%;\n  height: calc(var(--space-unit) * 4);\n  box-sizing: border-box;\n  align-items: center;\n  padding: 0 calc(var(--space-unit) * 2);\n  border: var(--border-size-medium) solid var(--color-surface01);\n  background: var(--z-book-card-ribbon-background-color);\n  border-radius: 0 var(--border-radius) var(--border-radius) 0;\n  box-shadow: var(--shadow-2);\n  color: var(--color-text04);\n  font-family: var(--font-family-sans);\n  font-size: var(--font-size-2);\n  font-weight: var(--font-sb);\n  line-height: initial;\n}\n\n:host > article div.cover .ribbon.interactive:hover {\n  cursor: pointer;\n}\n\n:host > article div.cover .ribbon span {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  word-wrap: nowrap;\n}\n\n:host > article div.cover .ribbon::before {\n  position: absolute;\n  bottom: -12px;\n  left: -2px;\n  width: 0;\n  height: 0;\n  border-top: 10px solid var(--z-book-card-ribbon-shadow-color);\n  border-left: 16px solid transparent;\n  content: \"\";\n}\n\n:host > article div.cover .ribbon z-icon {\n  margin-right: var(--space-unit);\n}\n\n:host > article div.content {\n  margin: var(--space-unit) 0;\n  border-radius: var(--border-radius);\n}\n\n:host > article .title {\n  display: flex;\n  height: 100%;\n  align-self: center;\n  color: var(--color-text02);\n  font-size: var(--font-size-4);\n  font-weight: var(--font-sb);\n  line-height: 1.5;\n}\n\n:host > article .title * {\n  all: unset;\n}\n\n:host > article div.subtitle {\n  color: var(--color-text02);\n  font-size: var(--font-size-2);\n  font-weight: var(--font-rg);\n  line-height: 1.4;\n}\n\n:host > article div.authors {\n  color: var(--color-text02);\n  font-size: var(--font-size-1);\n  font-weight: var(--font-rg);\n  line-height: 1.33;\n}\n\n:host > article div.isbn {\n  overflow: hidden;\n  color: var(--color-text02);\n  font-size: var(--font-size-2);\n  line-height: 1.33;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  word-wrap: nowrap;\n}\n\n:host > article div.isbn > .code {\n  font-weight: var(--font-sb);\n}\n\n:host > article div.tags {\n  display: flex;\n  overflow: hidden;\n  max-height: 32px;\n  flex-flow: row wrap;\n  align-content: stretch;\n  align-items: stretch;\n  justify-content: flex-start;\n  gap: calc(var(--space-unit) / 2);\n}\n\n:host > article ::slotted([slot=\"tags\"]) {\n  margin-bottom: var(--space-unit);\n}\n\n:host > article ::slotted([slot=\"header-cta\"]) {\n  --z-icon-width: 20px;\n  --z-icon-height: 20px;\n\n  padding: var(--space-unit);\n  cursor: pointer;\n  fill: var(--color-icon01);\n}\n\n/* EXPANDED STYLES */\n\n:host > article.expanded {\n  width: 100%;\n  min-width: 328px;\n  padding: calc(var(--space-unit) * 2);\n  padding-bottom: 0;\n}\n\n:host > article.expanded div.header {\n  display: flex;\n  flex-flow: row nowrap;\n  align-content: stretch;\n  align-items: top;\n  justify-content: space-between;\n  margin-bottom: var(--space-unit);\n  white-space: nowrap;\n}\n\n:host > article.expanded div.cover div.img-wrapper {\n  border-radius: var(--border-radius);\n}\n\n:host > article.expanded div.cover div.img-wrapper img {\n  width: 100%;\n}\n\n:host > article.expanded .title,\n:host > article.expanded .subtitle,\n:host > article.expanded .authors {\n  display: -webkit-box;\n  overflow: hidden;\n  -webkit-box-orient: vertical;\n  -webkit-line-clamp: 2;\n  white-space: initial;\n}\n\n:host > article.expanded div.footer {\n  border-top: var(--border-size-small) solid var(--color-surface03);\n  margin-bottom: calc(var(--space-unit) * 1.5);\n}\n\n:host > article.expanded div.footer.open {\n  padding-top: calc(var(--space-unit) * 1.5);\n}\n\n:host > article.expanded div.footer.open div.resources {\n  display: initial;\n}\n\n:host > article.expanded div.footer.close div.resources {\n  display: none;\n}\n\n:host > article.expanded button.show-resources {\n  --z-icon-height: 16px;\n  --z-icon-width: 16px;\n\n  all: unset;\n  display: flex;\n  width: 100%;\n  flex-flow: row nowrap;\n  align-content: center;\n  align-items: center;\n  justify-content: center;\n  padding: calc(var(--space-unit) * 1) 0;\n  color: var(--color-link-primary);\n  cursor: pointer;\n  fill: var(--color-link-primary);\n  font-size: var(--font-size-2);\n  font-weight: var(--font-sb);\n  gap: var(--space-unit);\n}\n\n:host > article.expanded button.show-resources:focus {\n  box-shadow: var(--shadow-focus-primary);\n}\n\n/* SEARCH STYLES */\n\n:host > article.search {\n  width: 262px;\n  height: 616px;\n  padding: calc(var(--space-unit) * 2);\n  padding-bottom: 0;\n}\n\n:host > article.search .wrapper-container {\n  display: flex;\n  height: 100%;\n  flex-direction: column;\n  justify-content: space-between;\n}\n\n:host > article.search .wrapper-container .wrapper {\n  height: 451px;\n}\n\n:host > article.search .wrapper-container .action-container {\n  padding-bottom: calc(var(--space-unit) * 2);\n}\n\n:host > article.search div.header {\n  display: flex;\n  height: 24px;\n  flex-flow: row nowrap;\n  align-content: stretch;\n  align-items: center;\n  justify-content: space-between;\n  margin-bottom: calc(var(--space-unit) * 1.5);\n  white-space: nowrap;\n}\n\n:host > article.search div.cover div.img-wrapper {\n  height: 314px;\n  border-radius: var(--border-radius);\n}\n\n:host > article.search .title {\n  display: block;\n  height: initial;\n  align-self: unset;\n  font-size: var(--font-size-3);\n}\n\n:host > article.search .title,\n:host > article.search .subtitle,\n:host > article.search .authors {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n/* COMPACT STYLES */\n\n:host > article.compact {\n  width: var(--z-book-card-compact-width);\n  height: var(--z-book-card-compact-height);\n}\n\n:host > article.compact.borderless {\n  border: none;\n}\n\n:host > article.compact div.cover div.img-wrapper {\n  width: 100%;\n  height: calc(var(--z-book-card-compact-width) * 1.36);\n  box-sizing: border-box;\n  border: none;\n  background: var(--color-white);\n  border-radius: var(--border-radius) var(--border-radius) 0 0;\n  box-shadow: var(--shadow-2);\n}\n\n:host > article.compact div.wrapper {\n  display: flex;\n  height: 100%;\n  flex-flow: column nowrap;\n  align-content: stretch;\n  align-items: stretch;\n  justify-content: flex-start;\n}\n\n:host > article.compact div.content {\n  display: flex;\n  box-sizing: border-box;\n  flex-flow: column nowrap;\n  align-content: stretch;\n  align-items: stretch;\n  justify-content: space-between;\n  padding: calc(var(--space-unit) * 2);\n  padding-top: var(--space-unit);\n  margin: 0;\n}\n\n:host > article.compact div.action-container {\n  padding: calc(var(--space-unit) * 2);\n  padding-top: 0;\n  margin-top: auto;\n}\n\n:host > article.compact.borderless div.cover div.img-wrapper {\n  width: var(--z-book-card-compact-width);\n}\n\n:host > article.compact.borderless div.content {\n  padding: 0;\n  padding-top: var(--space-unit);\n}\n\n:host > article.compact.borderless div.action-container {\n  padding: 0;\n  padding-bottom: calc(var(--space-unit) * 2);\n}\n\n:host > article.compact .title {\n  display: block;\n  height: initial;\n  align-self: unset;\n}\n\n:host > article.compact .title,\n:host > article.compact .subtitle,\n:host > article.compact .authors {\n  display: -webkit-box;\n  overflow: hidden;\n  -webkit-box-orient: vertical;\n  -webkit-line-clamp: 2;\n  white-space: initial;\n}\n\n/* Tablet breakpoint */\n@media (min-width: 768px) {\n  :host > article {\n    width: 100%;\n    max-width: initial;\n  }\n\n  :host > article .title {\n    display: block;\n    height: initial;\n    align-self: unset;\n  }\n\n  /* EXPANDED STYLES */\n\n  :host > article.expanded {\n    width: 100%;\n    min-width: initial;\n    max-width: initial;\n    height: 360px;\n    padding: 0;\n    border: 0;\n  }\n\n  :host > article.expanded div.wrapper {\n    display: flex;\n    flex-flow: row nowrap;\n    align-content: stretch;\n    align-items: stretch;\n    justify-content: flex-start;\n  }\n\n  :host > article.expanded div.cover div.img-wrapper {\n    width: 262px;\n    height: 356px;\n    border: 0;\n    border: var(--border-size-medium) solid var(--color-surface03);\n    border-right: none;\n    background: var(--color-surface01);\n    border-radius: var(--border-radius) 0 0 var(--border-radius);\n  }\n\n  :host > article.expanded div.cover div.img-wrapper img {\n    width: auto;\n    border-radius: 0;\n  }\n\n  :host > article.expanded div.content {\n    display: flex;\n    overflow: hidden;\n    width: 100%;\n    height: 356px;\n    flex-flow: column nowrap;\n    align-content: stretch;\n    align-items: stretch;\n    justify-content: space-between;\n    border: var(--border-size-medium) solid var(--color-surface03);\n    border-left: none;\n    margin: 0;\n    background: var(--color-surface01);\n    border-radius: 0 var(--border-radius) var(--border-radius) 0;\n  }\n\n  :host > article.expanded div.content div.top {\n    padding: calc(var(--space-unit) * 2);\n    padding-bottom: 0;\n  }\n\n  :host > article.expanded div.content div.top div.info {\n    display: flex;\n    flex-flow: row nowrap;\n    align-content: stretch;\n    align-items: stretch;\n    justify-content: space-between;\n    margin-bottom: calc(var(--space-unit) / 2);\n  }\n\n  :host > article.expanded div.content div.top div.info > div.left {\n    width: 100%;\n  }\n\n  :host > article.expanded div.content div.bottom {\n    padding: calc(var(--space-unit) * 2);\n    padding-bottom: 0;\n  }\n}\n\n/* Desktop breakpoint */\n\n@media (min-width: 1152px) {\n  :host > article {\n    width: fit-content;\n    max-width: initial;\n  }\n}\n\n/* Wide breakpoint */\n@media (min-width: 1366px) {\n  :host > article.expanded {\n    width: 635px;\n  }\n\n  :host > article.expanded div.content {\n    width: 369px;\n  }\n}\n","import {Component, Element, Prop, State, h, Event, EventEmitter} from \"@stencil/core\";\nimport {BookCardVariant} from \"../../beans\";\nimport {mobileBreakpoint} from \"../../constants/breakpoints\";\nimport {randomId} from \"../../utils/utils\";\n\n/**\n * @slot resources - books resources (extended variant only)\n * @slot header-cta - header CTA (e.g. bookmark icon - extended and search variant only)\n * @slot tags - card tags (extended and search variant only)\n * @slot footer-cta - footer cta button (search and compact variant only)\n * @cssprop --z-book-card-ribbon-background-color - ribbon backgrund color\n * @cssprop --z-book-card-ribbon-shadow-color - ribbon shadow color\n * @cssprop --z-book-card-compact-width - compact card custom width\n * @cssprop --z-book-card-compact-height - compact card custom height\n */\n@Component({\n  tag: \"z-book-card\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZBookCard {\n  @Element() hostElement: HTMLZBookCardElement;\n\n  /**\n   * Card variant: expanded, compact, search\n   */\n  @Prop()\n  variant: BookCardVariant;\n\n  /**\n   * Cover URL\n   */\n  @Prop()\n  cover: string;\n\n  /**\n   * Card main title\n   */\n  @Prop()\n  operaTitle: string;\n\n  /**\n   * [optional] Card subtitle\n   */\n  @Prop()\n  volumeTitle?: string;\n\n  /**\n   * [optional] Authors\n   */\n  @Prop()\n  authors?: string;\n\n  /**\n   * [optional] Main ISBN\n   */\n  @Prop()\n  isbn?: string;\n\n  /**\n   * [optional] ISBN label\n   */\n  @Prop()\n  isbnLabel = \"\";\n\n  /**\n   * [optional] Ribbon label - expanded and search variant only\n   */\n  @Prop()\n  ribbon?: string;\n\n  /**\n   * [optional] Ribbon icon - expanded and search variant only\n   */\n  @Prop()\n  ribbonIcon?: string;\n\n  /**\n   * [optional] Ribbon interactive - expanded and search variant only\n   */\n  @Prop()\n  ribbonInteractive?: boolean;\n\n  /**\n   * [optional] Borderless card - compact variant only\n   */\n  @Prop()\n  borderless?: boolean;\n\n  /**\n   * [optional] Fallback cover URL\n   */\n  @Prop()\n  fallbackCover?: string;\n\n  /**\n   * [optional] [accessibility] Card title HTML tag\n   */\n  @Prop()\n  operaTitleTag?: string;\n\n  @State()\n  isMobile = false;\n\n  @State()\n  hasResources = false;\n\n  @State()\n  showResources = false;\n\n  /** click on interactive ribbon */\n  @Event()\n  ribbonClick: EventEmitter;\n\n  private emitRibbonClick(): void {\n    this.ribbonClick.emit();\n  }\n\n  private id: string;\n\n  componentWillLoad(): void {\n    this.id = `id-${randomId()}`;\n\n    const mobileMediaQuery = window.matchMedia(`(max-width: ${mobileBreakpoint}px)`);\n    this.isMobile = mobileMediaQuery.matches;\n    mobileMediaQuery.onchange = (mql) => (this.isMobile = mql.matches);\n  }\n\n  componentDidLoad(): void {\n    this.handleResources();\n  }\n\n  private handleResources(): void {\n    if (this.variant !== BookCardVariant.EXPANDED || !this.isMobile) {\n      return;\n    }\n    this.hasResources = this.hostElement.querySelectorAll(\"[slot=resources]\")?.length > 0;\n  }\n\n  private toggleResources(): void {\n    this.showResources = !this.showResources;\n  }\n\n  private renderCard(): HTMLDivElement {\n    switch (this.variant) {\n      case BookCardVariant.EXPANDED:\n        return this.isMobile ? this.renderMobileExpandedCard() : this.renderExpandedCard();\n      case BookCardVariant.COMPACT:\n        return this.renderCompactCard();\n      case BookCardVariant.SEARCH:\n        return this.renderSearchCard();\n    }\n  }\n\n  private renderExpandedCard(): HTMLDivElement {\n    return (\n      <div class=\"wrapper\">\n        {this.renderCover()}\n        <div class=\"content\">\n          <div class=\"top\">\n            <div class=\"info\">\n              <div class=\"left\">\n                {this.renderAuthors()}\n                {this.renderOperaTitle()}\n                {this.renderVolumeTitle()}\n                {this.renderIsbn()}\n              </div>\n              <div class=\"right\">{this.renderHeaderCtaSlot()}</div>\n            </div>\n            {this.renderTagsSlot()}\n          </div>\n          <div class=\"bottom\">{this.renderResourcesSlot()}</div>\n        </div>\n      </div>\n    );\n  }\n\n  private renderMobileExpandedCard(): HTMLDivElement {\n    return (\n      <div class=\"wrapper\">\n        <div class=\"header\">\n          {this.renderOperaTitle()}\n          {this.renderHeaderCtaSlot()}\n        </div>\n        {this.renderCover()}\n        <div class=\"content\">\n          {this.renderTagsSlot()}\n          {this.renderAuthors()}\n          {this.renderVolumeTitle()}\n          {this.renderIsbn()}\n        </div>\n        {this.hasResources && (\n          <div\n            class={{\n              footer: true,\n              open: this.showResources,\n              close: !this.showResources,\n            }}\n          >\n            {!this.showResources && this.renderShowResources()}\n            {this.renderResourcesSlot()}\n            {this.showResources && this.renderShowResources()}\n          </div>\n        )}\n      </div>\n    );\n  }\n\n  private renderSearchCard(): HTMLDivElement {\n    return (\n      <div class=\"wrapper-container\">\n        <div class=\"wrapper\">\n          <div class=\"header\">\n            {this.renderOperaTitle()}\n            {this.renderHeaderCtaSlot()}\n          </div>\n          {this.renderCover()}\n          <div class=\"content\">\n            {this.renderTagsSlot()}\n            {this.renderAuthors()}\n            {this.renderVolumeTitle()}\n            {this.renderIsbn()}\n          </div>\n        </div>\n        {this.renderFooterCtaSlot()}\n      </div>\n    );\n  }\n\n  private renderCompactCard(): HTMLDivElement {\n    return (\n      <div class=\"wrapper\">\n        {this.renderCover()}\n        <div class=\"content\">\n          {this.renderAuthors()}\n          {this.renderOperaTitle()}\n          {this.renderVolumeTitle()}\n          {this.renderIsbn()}\n        </div>\n        {this.renderFooterCtaSlot()}\n      </div>\n    );\n  }\n\n  private renderCover(): HTMLDivElement {\n    return (\n      <div class=\"cover\">\n        {this.ribbon && this.variant !== BookCardVariant.COMPACT && this.renderRibbon()}\n        <div class=\"img-wrapper\">\n          <img\n            src={this.cover}\n            onError={() => {\n              if (this.fallbackCover) {\n                this.cover = this.fallbackCover;\n              }\n            }}\n            aria-hidden=\"true\"\n          />\n        </div>\n      </div>\n    );\n  }\n\n  private renderRibbon(): HTMLElement {\n    const content = [\n      this.ribbonIcon && (\n        <z-icon\n          name={this.ribbonIcon}\n          width={16}\n          height={16}\n          fill={\"color-icon03\"}\n        />\n      ),\n      <span>{this.ribbon}</span>,\n    ];\n\n    return this.ribbonInteractive ? (\n      <button\n        class=\"ribbon interactive\"\n        onClick={() => this.emitRibbonClick()}\n      >\n        {content}\n      </button>\n    ) : (\n      <div class=\"ribbon\">{content}</div>\n    );\n  }\n\n  private renderOperaTitle(): HTMLDivElement {\n    const title = this.operaTitleTag\n      ? `<${this.operaTitleTag}>${this.operaTitle}</${this.operaTitleTag}>`\n      : this.operaTitle;\n\n    return (\n      <div\n        class=\"title\"\n        innerHTML={title}\n      />\n    );\n  }\n\n  private renderVolumeTitle(): null | HTMLDivElement {\n    return this.volumeTitle ? <div class=\"subtitle\">{this.volumeTitle}</div> : null;\n  }\n\n  private renderAuthors(): null | HTMLDivElement {\n    return this.authors ? (\n      <div\n        class=\"authors\"\n        aria-description=\"Autori\"\n      >\n        {this.authors}\n      </div>\n    ) : null;\n  }\n\n  private renderIsbn(): null | HTMLDivElement {\n    return this.isbn ? (\n      <div class=\"isbn\">\n        <span\n          class=\"code\"\n          aria-description={`ISBN ${this.isbnLabel}`}\n        >\n          {this.isbn}\n        </span>\n        {this.isbnLabel ? <span class=\"label\"> {this.isbnLabel}</span> : null}\n      </div>\n    ) : null;\n  }\n\n  private renderShowResources(): HTMLButtonElement {\n    return (\n      <button\n        class=\"show-resources\"\n        aria-label={`Risorse del libro ${this.operaTitle}`}\n        aria-expanded={this.showResources.toString()}\n        aria-controls={`resources-${this.id}`}\n        onClick={() => this.toggleResources()}\n      >\n        {this.showResources ? \"Chiudi\" : \"Vedi tutto\"}\n        <z-icon name={this.showResources ? \"chevron-up\" : \"chevron-down\"} />\n      </button>\n    );\n  }\n\n  private renderTagsSlot(): HTMLDivElement {\n    return (\n      <div class=\"tags\">\n        <slot name=\"tags\" />\n      </div>\n    );\n  }\n\n  private renderHeaderCtaSlot(): HTMLSlotElement {\n    return <slot name=\"header-cta\" />;\n  }\n\n  private renderResourcesSlot(): HTMLDivElement {\n    return (\n      <div\n        id={`resources-${this.id}`}\n        class=\"resources\"\n      >\n        <slot\n          name=\"resources\"\n          onSlotchange={() => this.handleResources()}\n        />\n      </div>\n    );\n  }\n\n  private renderFooterCtaSlot(): HTMLDivElement {\n    return (\n      <div class=\"action-container\">\n        <slot name=\"footer-cta\" />\n      </div>\n    );\n  }\n\n  render(): HTMLZBookCardElement {\n    return (\n      <article\n        class={{\n          [this.variant]: true,\n          borderless: !!this.borderless,\n        }}\n      >\n        {this.renderCard()}\n      </article>\n    );\n  }\n}\n"],"mappings":"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"}

package/www/build/p-fa4a2862.entry.js

@@ -1,2 +0,0 @@
-import{r as t,c as e,h as i,g as s}from"./p-10bb4f4b.js";import{q as a}from"./p-025f494e.js";import{a as o}from"./p-955da62e.js";import{H as r}from"./p-54b0b04e.js";import"./p-2c886e8b.js";const n=":host{width:inherit;height:100%;margin:inherit;font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>div{width:inherit;height:100%;margin:inherit}:host>div>div.background{position:fixed;z-index:998;top:0;right:0;bottom:0;left:0;width:0;height:0}:host>div>div.background.open{width:100%;height:100%}:host>div>div.content-wrapper{position:fixed;z-index:999;bottom:0;left:0;width:inherit;margin:inherit}:host>div>div.content-wrapper>div{margin:calc(var(--space-unit) * 0.5) calc(var(--space-unit) * 0.5) 0 calc(var(--space-unit) * 0.5);border-radius:var(--space-unit) var(--space-unit) 0 0;box-shadow:0 -2px calc(var(--space-unit) * 0.5) 0 rgb(66 69 72 / 40%)}";const c=n;const h=class{constructor(i){t(this,i);this.pocketToggle=e(this,"pocketToggle",7);this.pocketid=undefined;this.status=a.PREVIEW}async open(){this.status=a.OPEN}async close(){this.status=a.CLOSED}emitPocketToggle(t,e){this.pocketToggle.emit({id:t,status:e})}handlePocketHeaderClick(t){if(t.detail.id&&t.detail.id===this.pocketid){switch(this.status){case a.PREVIEW:case a.CLOSED:this.status=a.OPEN;break;case a.OPEN:this.status=a.CLOSED;break}}}handlePocketHeaderPan(t){if(t.detail.id&&t.detail.id===this.pocketid){if(t.detail.direction==="up"){this.status=a.OPEN}else if(t.detail.direction==="down"){this.status=a.CLOSED}}}watchStatusHandler(t){this.emitPocketToggle(this.pocketid,t)}componentWillLoad(){this.emitPocketToggle(this.pocketid,this.status)}handleBackgroundClick(t){if(t.target.dataset.action=="pocketBackground"){this.close()}}render(){return i("div",{key:"326350f5b42a676f92c1246a676f074c12b5e2c8"},i("div",{key:"ff53a47e16b8a2809e96d49b129c6187e0e3364a","data-action":"pocketBackground","data-pocket":this.pocketid,class:`background ${this.status}`,onClick:t=>this.handleBackgroundClick(t)}),i("div",{key:"28606d7b860f7283919f00010bf5f1c83ca75aa7",id:this.pocketid,class:"content-wrapper"},i("div",{key:"b54698aaa349bb75df7c6344b3cfff3122e530c5"},i("slot",{key:"0e5ac1491d2c5128ed4c93b116d91a62e2afde41"}))))}get hostElement(){return s(this)}static get watchers(){return{status:["watchStatusHandler"]}}};h.style=c;const d=":host{display:block;width:100%;box-sizing:border-box;font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>main{overflow:auto;border-right:var(--border-size-small) solid var(--color-surface03);border-left:var(--border-size-small) solid var(--color-surface03);background:var(--color-surface01);scrollbar-width:none}:host>main.preview{max-height:225px;transition:all 200ms ease-in-out, top 200ms ease-in-out}:host>main.open{max-height:calc(100vh - 48px);transition:all 200ms ease-in-out, top 200ms ease-in-out}:host>main.closed{height:0;transition:all 200ms ease-in-out, top 200ms ease-in-out}:host ::-webkit-scrollbar{width:0}@media only screen and (min-width: 768px){:host>main.preview{max-height:157px}}";const l=d;const f=class{constructor(e){t(this,e);this.pocketid=undefined;this.status=a.PREVIEW}handlePocketToggle(t){if(t.detail.id&&t.detail.id===this.pocketid){this.status=t.detail.status}}render(){return i("main",{key:"a21e5307e4af8970761af2f04d1344997e171b48",class:this.status},i("slot",{key:"c6b38fb56dbca9e8cdb03acfb601f32822312fee"}))}};f.style=l;const p=":host{display:block;width:100%;box-sizing:border-box;font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>header{display:flex;height:36px;flex-flow:row nowrap;align-items:center;justify-content:center;border:var(--border-size-small) solid var(--color-surface03);background:var(--color-surface01);border-radius:var(--space-unit) var(--space-unit) 0 0;cursor:pointer}:host>header:focus{outline:none}:host>header::-moz-focus-inner{border:0}";const b=p;const u=class{emitPocketHeaderClick(){this.pocketHeaderClick.emit({id:this.pocketid})}emitPocketHeaderPan(t){this.pocketHeaderPan.emit({id:this.pocketid,direction:t})}constructor(i){t(this,i);this.pocketHeaderClick=e(this,"pocketHeaderClick",7);this.pocketHeaderPan=e(this,"pocketHeaderPan",7);this.pocketid=undefined;this.emitPocketHeaderClick=this.emitPocketHeaderClick.bind(this)}componentDidLoad(){const t=new r(this.swipeWrap);t.get("pan").set({direction:r.DIRECTION_VERTICAL});t.on("panup",(()=>this.emitPocketHeaderPan("up")));t.on("pandown",(()=>this.emitPocketHeaderPan("down")))}render(){return i("header",{key:"90a6554d0c79aebcb62332c7ee23018103fa1916",role:"button",tabindex:0,onClick:()=>this.emitPocketHeaderClick(),onKeyPress:t=>o(t,this.emitPocketHeaderClick),ref:t=>this.swipeWrap=t},i("slot",{key:"4a3e7b093ba47de8fdbe0e96fff4f5880220bec4"}))}};u.style=b;export{h as z_pocket,f as z_pocket_body,u as z_pocket_header};
-//# sourceMappingURL=p-fa4a2862.entry.js.map

package/www/build/p-fa4a2862.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["stylesCss","ZPocketStyle0","ZPocket","PocketStatus","PREVIEW","open","this","status","OPEN","close","CLOSED","emitPocketToggle","id","pocketToggle","emit","handlePocketHeaderClick","e","detail","pocketid","handlePocketHeaderPan","direction","watchStatusHandler","newVal","componentWillLoad","handleBackgroundClick","target","dataset","action","render","h","key","class","onClick","ZPocketBodyStyle0","ZPocketBody","handlePocketToggle","ZPocketHeaderStyle0","ZPocketHeader","emitPocketHeaderClick","pocketHeaderClick","emitPocketHeaderPan","pocketHeaderPan","constructor","hostRef","bind","componentDidLoad","mc","Hammer","swipeWrap","get","set","DIRECTION_VERTICAL","on","role","tabindex","onKeyPress","ev","handleKeyboardSubmit","ref","el"],"sources":["src/snowflakes/myz/pocket/z-pocket/styles.css?tag=z-pocket&encapsulation=shadow","src/snowflakes/myz/pocket/z-pocket/index.tsx","src/snowflakes/myz/pocket/z-pocket-body/styles.css?tag=z-pocket-body&encapsulation=shadow","src/snowflakes/myz/pocket/z-pocket-body/index.tsx","src/snowflakes/myz/pocket/z-pocket-header/styles.css?tag=z-pocket-header&encapsulation=shadow","src/snowflakes/myz/pocket/z-pocket-header/index.tsx"],"sourcesContent":[":host {\n  width: inherit;\n  height: 100%;\n  margin: inherit;\n  font-family: var(--font-family-sans);\n  font-weight: var(--font-rg);\n}\n\n:host > div {\n  width: inherit;\n  height: 100%;\n  margin: inherit;\n}\n\n:host > div > div.background {\n  position: fixed;\n  z-index: 998;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  width: 0;\n  height: 0;\n}\n\n:host > div > div.background.open {\n  width: 100%;\n  height: 100%;\n}\n\n:host > div > div.content-wrapper {\n  position: fixed;\n  z-index: 999;\n  bottom: 0;\n  left: 0;\n  width: inherit;\n  margin: inherit;\n}\n\n:host > div > div.content-wrapper > div {\n  margin: calc(var(--space-unit) * 0.5) calc(var(--space-unit) * 0.5) 0 calc(var(--space-unit) * 0.5);\n  border-radius: var(--space-unit) var(--space-unit) 0 0;\n  box-shadow: 0 -2px calc(var(--space-unit) * 0.5) 0 rgb(66 69 72 / 40%);\n}\n","import {Component, Prop, h, Method, Event, EventEmitter, Listen, Element, Watch} from \"@stencil/core\";\nimport {PocketStatus} from \"../../../../beans\";\n\n/**\n * @slot - pocket content\n */\n@Component({\n  tag: \"z-pocket\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZPocket {\n  @Element() hostElement: HTMLZPocketElement;\n\n  /** pocket id */\n  @Prop()\n  pocketid: string;\n\n  /** pocket status */\n  @Prop({mutable: true})\n  status: PocketStatus = PocketStatus.PREVIEW;\n\n  /** open z-pocket */\n  @Method()\n  async open(): Promise<void> {\n    this.status = PocketStatus.OPEN;\n  }\n\n  /** close z-pocket */\n  @Method()\n  async close(): Promise<void> {\n    this.status = PocketStatus.CLOSED;\n  }\n\n  /** Emitted on pocket toggle, returns pocket id and status */\n  @Event()\n  pocketToggle: EventEmitter;\n\n  private emitPocketToggle(id: string, status: PocketStatus): void {\n    this.pocketToggle.emit({id, status});\n  }\n\n  @Listen(\"pocketHeaderClick\")\n  handlePocketHeaderClick(e: CustomEvent): void {\n    if (e.detail.id && e.detail.id === this.pocketid) {\n      switch (this.status) {\n        case PocketStatus.PREVIEW:\n        case PocketStatus.CLOSED:\n          this.status = PocketStatus.OPEN;\n          break;\n        case PocketStatus.OPEN:\n          this.status = PocketStatus.CLOSED;\n          break;\n      }\n    }\n  }\n\n  @Listen(\"pocketHeaderPan\")\n  handlePocketHeaderPan(e: CustomEvent): void {\n    if (e.detail.id && e.detail.id === this.pocketid) {\n      if (e.detail.direction === \"up\") {\n        this.status = PocketStatus.OPEN;\n      } else if (e.detail.direction === \"down\") {\n        this.status = PocketStatus.CLOSED;\n      }\n    }\n  }\n\n  @Watch(\"status\")\n  watchStatusHandler(newVal: PocketStatus): void {\n    this.emitPocketToggle(this.pocketid, newVal);\n  }\n\n  componentWillLoad(): void {\n    this.emitPocketToggle(this.pocketid, this.status);\n  }\n\n  private handleBackgroundClick(e: MouseEvent): void {\n    if ((e.target as HTMLElement).dataset.action == \"pocketBackground\") {\n      this.close();\n    }\n  }\n\n  render(): HTMLDivElement {\n    return (\n      <div>\n        <div\n          data-action=\"pocketBackground\"\n          data-pocket={this.pocketid}\n          class={`background ${this.status}`}\n          onClick={(e: MouseEvent) => this.handleBackgroundClick(e)}\n        />\n        <div\n          id={this.pocketid}\n          class=\"content-wrapper\"\n        >\n          <div>\n            <slot />\n          </div>\n        </div>\n      </div>\n    );\n  }\n}\n",":host {\n  display: block;\n  width: 100%;\n  box-sizing: border-box;\n  font-family: var(--font-family-sans);\n  font-weight: var(--font-rg);\n}\n\n:host > main {\n  overflow: auto;\n  border-right: var(--border-size-small) solid var(--color-surface03);\n  border-left: var(--border-size-small) solid var(--color-surface03);\n  background: var(--color-surface01);\n  scrollbar-width: none;\n}\n\n:host > main.preview {\n  max-height: 225px;\n  transition: all 200ms ease-in-out, top 200ms ease-in-out;\n}\n\n:host > main.open {\n  max-height: calc(100vh - 48px);\n  transition: all 200ms ease-in-out, top 200ms ease-in-out;\n}\n\n:host > main.closed {\n  height: 0;\n  transition: all 200ms ease-in-out, top 200ms ease-in-out;\n}\n\n:host ::-webkit-scrollbar {\n  width: 0;\n}\n\n/* Tablet breakpoint */\n@media only screen and (min-width: 768px) {\n  :host > main.preview {\n    max-height: 157px;\n  }\n}\n","import {Component, h, Prop, Listen} from \"@stencil/core\";\nimport {PocketStatus} from \"../../../../beans\";\n\n/**\n * @slot  - pocket body content\n */\n@Component({\n  tag: \"z-pocket-body\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZPocketBody {\n  /** pocket id */\n  @Prop()\n  pocketid: string;\n\n  /** pocket status */\n  @Prop({mutable: true})\n  status: PocketStatus = PocketStatus.PREVIEW;\n\n  @Listen(\"pocketToggle\", {target: \"body\"})\n  handlePocketToggle(e: CustomEvent): void {\n    if (e.detail.id && e.detail.id === this.pocketid) {\n      this.status = e.detail.status;\n    }\n  }\n\n  render(): HTMLElement {\n    return (\n      <main class={this.status}>\n        <slot />\n      </main>\n    );\n  }\n}\n",":host {\n  display: block;\n  width: 100%;\n  box-sizing: border-box;\n  font-family: var(--font-family-sans);\n  font-weight: var(--font-rg);\n}\n\n:host > header {\n  display: flex;\n  height: 36px;\n  flex-flow: row nowrap;\n  align-items: center;\n  justify-content: center;\n  border: var(--border-size-small) solid var(--color-surface03);\n  background: var(--color-surface01);\n  border-radius: var(--space-unit) var(--space-unit) 0 0;\n  cursor: pointer;\n}\n\n:host > header:focus {\n  outline: none;\n}\n\n:host > header::-moz-focus-inner {\n  border: 0;\n}\n","import {Component, Prop, h, Event, EventEmitter} from \"@stencil/core\";\nimport {handleKeyboardSubmit} from \"../../../../utils/utils\";\nimport Hammer from \"hammerjs\";\n\n/**\n * @slot  - pocket header content\n */\n@Component({\n  tag: \"z-pocket-header\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZPocketHeader {\n  /** pocket id */\n  @Prop()\n  pocketid: string;\n\n  private swipeWrap: HTMLElement;\n\n  /** Emitted on pocket header click */\n  @Event()\n  pocketHeaderClick: EventEmitter;\n\n  private emitPocketHeaderClick(): void {\n    this.pocketHeaderClick.emit({id: this.pocketid});\n  }\n\n  /** Emitted on pocket header pan */\n  @Event()\n  pocketHeaderPan: EventEmitter;\n\n  private emitPocketHeaderPan(direction: string): void {\n    this.pocketHeaderPan.emit({id: this.pocketid, direction});\n  }\n\n  constructor() {\n    this.emitPocketHeaderClick = this.emitPocketHeaderClick.bind(this);\n  }\n\n  componentDidLoad(): void {\n    // INFO: swipe handling\n    const mc = new Hammer(this.swipeWrap);\n    mc.get(\"pan\").set({direction: Hammer.DIRECTION_VERTICAL});\n    mc.on(\"panup\", () => this.emitPocketHeaderPan(\"up\"));\n    mc.on(\"pandown\", () => this.emitPocketHeaderPan(\"down\"));\n  }\n\n  render(): HTMLElement {\n    return (\n      <header\n        role=\"button\"\n        tabindex={0}\n        onClick={() => this.emitPocketHeaderClick()}\n        onKeyPress={(ev: KeyboardEvent) => handleKeyboardSubmit(ev, this.emitPocketHeaderClick)}\n        ref={(el) => (this.swipeWrap = el as HTMLElement)}\n      >\n        <slot />\n      </header>\n    );\n  }\n}\n"],"mappings":"6LAAA,MAAMA,EAAY,mqBAClB,MAAAC,EAAeD,E,MCUFE,EAAO,M,wGASKC,EAAaC,O,CAIpC,UAAMC,GACJC,KAAKC,OAASJ,EAAaK,I,CAK7B,WAAMC,GACJH,KAAKC,OAASJ,EAAaO,M,CAOrB,gBAAAC,CAAiBC,EAAYL,GACnCD,KAAKO,aAAaC,KAAK,CAACF,KAAIL,U,CAI9B,uBAAAQ,CAAwBC,GACtB,GAAIA,EAAEC,OAAOL,IAAMI,EAAEC,OAAOL,KAAON,KAAKY,SAAU,CAChD,OAAQZ,KAAKC,QACX,KAAKJ,EAAaC,QAClB,KAAKD,EAAaO,OAChBJ,KAAKC,OAASJ,EAAaK,KAC3B,MACF,KAAKL,EAAaK,KAChBF,KAAKC,OAASJ,EAAaO,OAC3B,M,EAMR,qBAAAS,CAAsBH,GACpB,GAAIA,EAAEC,OAAOL,IAAMI,EAAEC,OAAOL,KAAON,KAAKY,SAAU,CAChD,GAAIF,EAAEC,OAAOG,YAAc,KAAM,CAC/Bd,KAAKC,OAASJ,EAAaK,I,MACtB,GAAIQ,EAAEC,OAAOG,YAAc,OAAQ,CACxCd,KAAKC,OAASJ,EAAaO,M,GAMjC,kBAAAW,CAAmBC,GACjBhB,KAAKK,iBAAiBL,KAAKY,SAAUI,E,CAGvC,iBAAAC,GACEjB,KAAKK,iBAAiBL,KAAKY,SAAUZ,KAAKC,O,CAGpC,qBAAAiB,CAAsBR,GAC5B,GAAKA,EAAES,OAAuBC,QAAQC,QAAU,mBAAoB,CAClErB,KAAKG,O,EAIT,MAAAmB,GACE,OACEC,EAAA,OAAAC,IAAA,4CACED,EAAA,OAAAC,IAAA,yDACc,mBAAkB,cACjBxB,KAAKY,SAClBa,MAAO,cAAczB,KAAKC,SAC1ByB,QAAUhB,GAAkBV,KAAKkB,sBAAsBR,KAEzDa,EAAA,OAAAC,IAAA,2CACElB,GAAIN,KAAKY,SACTa,MAAM,mBAENF,EAAA,OAAAC,IAAA,4CACED,EAAA,QAAAC,IAAA,+C,0GCjGZ,MAAM9B,EAAY,ktBAClB,MAAAiC,EAAejC,E,MCUFkC,EAAW,M,6DAOC/B,EAAaC,O,CAGpC,kBAAA+B,CAAmBnB,GACjB,GAAIA,EAAEC,OAAOL,IAAMI,EAAEC,OAAOL,KAAON,KAAKY,SAAU,CAChDZ,KAAKC,OAASS,EAAEC,OAAOV,M,EAI3B,MAAAqB,GACE,OACEC,EAAA,QAAAC,IAAA,2CAAMC,MAAOzB,KAAKC,QAChBsB,EAAA,QAAAC,IAAA,6C,aC9BR,MAAM9B,EAAY,wcAClB,MAAAoC,EAAepC,E,MCWFqC,EAAa,MAWhB,qBAAAC,GACNhC,KAAKiC,kBAAkBzB,KAAK,CAACF,GAAIN,KAAKY,U,CAOhC,mBAAAsB,CAAoBpB,GAC1Bd,KAAKmC,gBAAgB3B,KAAK,CAACF,GAAIN,KAAKY,SAAUE,a,CAGhD,WAAAsB,CAAAC,G,wIACErC,KAAKgC,sBAAwBhC,KAAKgC,sBAAsBM,KAAKtC,K,CAG/D,gBAAAuC,GAEE,MAAMC,EAAK,IAAIC,EAAOzC,KAAK0C,WAC3BF,EAAGG,IAAI,OAAOC,IAAI,CAAC9B,UAAW2B,EAAOI,qBACrCL,EAAGM,GAAG,SAAS,IAAM9C,KAAKkC,oBAAoB,QAC9CM,EAAGM,GAAG,WAAW,IAAM9C,KAAKkC,oBAAoB,S,CAGlD,MAAAZ,GACE,OACEC,EAAA,UAAAC,IAAA,2CACEuB,KAAK,SACLC,SAAU,EACVtB,QAAS,IAAM1B,KAAKgC,wBACpBiB,WAAaC,GAAsBC,EAAqBD,EAAIlD,KAAKgC,uBACjEoB,IAAMC,GAAQrD,KAAK0C,UAAYW,GAE/B9B,EAAA,QAAAC,IAAA,6C"}

package/www/build/p-fe8d7642.entry.js

@@ -1,2 +0,0 @@
-import{r as t,h as i}from"./p-10bb4f4b.js";const n="ul{padding:0;margin:0}";const a=n;const s=class{constructor(i){t(this,i);this.inputrawdata=undefined;this.list=undefined}componentWillLoad(){if(this.inputrawdata){this.parseinputrawdata(this.inputrawdata)}}parseinputrawdata(t){this.list=[...JSON.parse(t)]}oninputrawdataChange(t){this.parseinputrawdata(t)}render(){const t=this.list?this.list.length-1:-1;return i("ul",{key:"9cf88d3a10f5a2239690c9b548ba18e2a21f4285"},this.list&&this.list.map(((n,a)=>i("z-myz-list-item",{listitemid:n.listitemid,text:n.text,link:n.link,linktarget:n.linktarget,icon:n.icon,underlined:t!=a}))))}static get watchers(){return{inputrawdata:["oninputrawdataChange"]}}};s.style=a;export{s as z_myz_list};
-//# sourceMappingURL=p-fe8d7642.entry.js.map

package/www/build/p-fe8d7642.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["stylesCss","ZMyzListStyle0","ZMyzList","componentWillLoad","this","inputrawdata","parseinputrawdata","list","JSON","parse","oninputrawdataChange","newValue","render","lastElem","length","h","key","map","bean","i","listitemid","text","link","linktarget","icon","underlined"],"sources":["src/snowflakes/myz/list/z-myz-list/styles.css?tag=z-myz-list&encapsulation=shadow","src/snowflakes/myz/list/z-myz-list/index.tsx"],"sourcesContent":["ul {\n  padding: 0;\n  margin: 0;\n}\n","import {Component, Prop, h, Watch} from \"@stencil/core\";\nimport {ListItem} from \"../../../../beans/index.js\";\n\n@Component({\n  tag: \"z-myz-list\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZMyzList {\n  /** json stringified list data (mutable, optional) */\n  @Prop()\n  inputrawdata?: string;\n\n  /** list item data (mutable, optional)*/\n  @Prop({mutable: true})\n  list?: ListItem[];\n\n  componentWillLoad(): void {\n    if (this.inputrawdata) {\n      this.parseinputrawdata(this.inputrawdata);\n    }\n  }\n\n  private parseinputrawdata(inputrawdata: string): void {\n    this.list = [...JSON.parse(inputrawdata)];\n  }\n\n  @Watch(\"inputrawdata\")\n  oninputrawdataChange(newValue: string): void {\n    this.parseinputrawdata(newValue);\n  }\n\n  render(): HTMLUListElement {\n    const lastElem = this.list ? this.list.length - 1 : -1;\n\n    return (\n      <ul>\n        {this.list &&\n          this.list.map((bean, i) => (\n            <z-myz-list-item\n              listitemid={bean.listitemid}\n              text={bean.text}\n              link={bean.link}\n              linktarget={bean.linktarget}\n              icon={bean.icon}\n              underlined={lastElem != i}\n            />\n          ))}\n      </ul>\n    );\n  }\n}\n"],"mappings":"2CAAA,MAAMA,EAAY,yBAClB,MAAAC,EAAeD,E,MCOFE,EAAQ,M,yEASnB,iBAAAC,GACE,GAAIC,KAAKC,aAAc,CACrBD,KAAKE,kBAAkBF,KAAKC,a,EAIxB,iBAAAC,CAAkBD,GACxBD,KAAKG,KAAO,IAAIC,KAAKC,MAAMJ,G,CAI7B,oBAAAK,CAAqBC,GACnBP,KAAKE,kBAAkBK,E,CAGzB,MAAAC,GACE,MAAMC,EAAWT,KAAKG,KAAOH,KAAKG,KAAKO,OAAS,GAAK,EAErD,OACEC,EAAA,MAAAC,IAAA,4CACGZ,KAAKG,MACJH,KAAKG,KAAKU,KAAI,CAACC,EAAMC,IACnBJ,EAAA,mBACEK,WAAYF,EAAKE,WACjBC,KAAMH,EAAKG,KACXC,KAAMJ,EAAKI,KACXC,WAAYL,EAAKK,WACjBC,KAAMN,EAAKM,KACXC,WAAYZ,GAAYM,M"}

package/www/build/web-components-library.esm.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["patchBrowser","patchCloneNodeFix","H","prototype","importMeta","url","opts","resourcesUrl","URL","href","promiseResolve","HTMLElementPrototype","nativeCloneNodeFn","cloneNode","deep","this","nodeName","call","clonedNode","srcChildNodes","childNodes","i","length","nodeType","appendChild","then","options","bootstrapLazy","JSON","parse"],"sources":["node_modules/@stencil/core/internal/client/patch-browser.js","@lazy-browser-entrypoint?app-data=conditional"],"sourcesContent":["/*\n Stencil Client Patch Browser v4.12.1 | MIT Licensed | https://stenciljs.com\n */\nimport { BUILD, NAMESPACE } from '@stencil/core/internal/app-data';\nimport { consoleDevInfo, doc, promiseResolve, H } from '@stencil/core';\nconst patchBrowser = () => {\n    // NOTE!! This fn cannot use async/await!\n    if (BUILD.isDev && !BUILD.isTesting) {\n        consoleDevInfo('Running in development mode.');\n    }\n    if (BUILD.cloneNodeFix) {\n        // opted-in to polyfill cloneNode() for slot polyfilled components\n        patchCloneNodeFix(H.prototype);\n    }\n    const scriptElm = BUILD.scriptDataOpts\n        ? Array.from(doc.querySelectorAll('script')).find((s) => new RegExp(`\\/${NAMESPACE}(\\\\.esm)?\\\\.js($|\\\\?|#)`).test(s.src) ||\n            s.getAttribute('data-stencil-namespace') === NAMESPACE)\n        : null;\n    const importMeta = import.meta.url;\n    const opts = BUILD.scriptDataOpts ? (scriptElm || {})['data-opts'] || {} : {};\n    if (importMeta !== '') {\n        opts.resourcesUrl = new URL('.', importMeta).href;\n    }\n    return promiseResolve(opts);\n};\nconst patchCloneNodeFix = (HTMLElementPrototype) => {\n    const nativeCloneNodeFn = HTMLElementPrototype.cloneNode;\n    HTMLElementPrototype.cloneNode = function (deep) {\n        if (this.nodeName === 'TEMPLATE') {\n            return nativeCloneNodeFn.call(this, deep);\n        }\n        const clonedNode = nativeCloneNodeFn.call(this, false);\n        const srcChildNodes = this.childNodes;\n        if (deep) {\n            for (let i = 0; i < srcChildNodes.length; i++) {\n                // Node.ATTRIBUTE_NODE === 2, and checking because IE11\n                if (srcChildNodes[i].nodeType !== 2) {\n                    clonedNode.appendChild(srcChildNodes[i].cloneNode(true));\n                }\n            }\n        }\n        return clonedNode;\n    };\n};\nexport { patchBrowser };\n","export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { patchBrowser } from '@stencil/core/internal/client/patch-browser';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\npatchBrowser().then(options => {\n  globalScripts();\n  return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n});\n"],"mappings":"6FAKA,MAAMA,EAAe,KAKO,CAEpBC,EAAkBC,EAAEC,UAC5B,CAKI,MAAMC,cAAyBC,IAC/B,MAAMC,EAAqE,GAC3E,GAAIF,IAAe,GAAI,CACnBE,EAAKC,aAAe,IAAIC,IAAI,IAAKJ,GAAYK,IACrD,CACI,OAAOC,EAAeJ,EAAK,EAE/B,MAAML,EAAqBU,IACvB,MAAMC,EAAoBD,EAAqBE,UAC/CF,EAAqBE,UAAY,SAAUC,GACvC,GAAIC,KAAKC,WAAa,WAAY,CAC9B,OAAOJ,EAAkBK,KAAKF,KAAMD,EAChD,CACQ,MAAMI,EAAaN,EAAkBK,KAAKF,KAAM,OAChD,MAAMI,EAAgBJ,KAAKK,WAC3B,GAAIN,EAAM,CACN,IAAK,IAAIO,EAAI,EAAGA,EAAIF,EAAcG,OAAQD,IAAK,CAE3C,GAAIF,EAAcE,GAAGE,WAAa,EAAG,CACjCL,EAAWM,YAAYL,EAAcE,GAAGR,UAAU,MACtE,CACA,CACA,CACQ,OAAOK,CACf,CAAK,ECtCLlB,IAAeyB,MAAKC,GAEXC,EAAcC,KAAAC,MAAA,onhBAAuCH"}