npm - @zanichelli/albe-web-components - Versions diffs - 19.2.1-RC → 19.2.2 - Mend

@zanichelli/albe-web-components 19.2.1-RC → 19.2.2

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

Files changed (216) hide show

package/dist/components/index25.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"index25.js","mappings":"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","names":["stylesCss"],"sources":["src/components/z-searchbar/styles.css?tag=z-searchbar&encapsulation=shadow","src/components/css-components/z-label/styles.css?tag=z-searchbar&encapsulation=shadow","src/components/z-searchbar/index.tsx"],"sourcesContent":[":host {\n --z-searchbar-tag-text-color: var(--color-primary03);\n --z-searchbar-tag-bg: var(--color-hover-primary);\n --z-searchbar-item-height: 44px;\n\n z-index: 15;\n display: flex;\n column-gap: calc(var(--space-unit) * 2);\n font-family: var(--font-family-sans);\n font-weight: var(--font-rg);\n}\n\n:host,\n* {\n box-sizing: border-box;\n}\n\n:host::part(list-item-container) {\n display: block;\n min-height: unset;\n padding: 0;\n}\n\n.input-container {\n position: relative;\n display: flex;\n width: 100%;\n flex-direction: column;\n}\n\n.results-wrapper {\n position: absolute;\n top: calc(100% - 1px);\n left: 0;\n width: 100%;\n padding: calc(var(--space-unit) / 4);\n border: var(--border-size-small) solid var(--color-surface03);\n border-top: none;\n background: var(--color-surface01);\n}\n\n.results {\n overflow: auto;\n max-height: var(--z-searchbar-results-height, 540px);\n padding: calc(var(--space-unit) / 2) calc(var(--space-unit) * 1.5);\n}\n\n.results::-webkit-scrollbar {\n width: 6px;\n background: linear-gradient(to right, transparent 0 1px, var(--gray200) 1px 5px, transparent 5px 6px);\n}\n\n.results::-webkit-scrollbar-thumb {\n background-color: var(--color-primary01);\n}\n\n.results::-webkit-scrollbar-thumb:hover {\n background-color: var(--color-hover-primary);\n}\n\n/* Firefox scrollbar /\n@supports not selector(.results::-webkit-scrollbar-track) {\n .results {\n scrollbar-color: var(--color-primary01) transparent;\n }\n}\n\n.results .category-heading {\n display: block;\n font-size: var(--font-size-2);\n font-weight: var(--font-rg);\n line-height: var(--font-size-3);\n}\n\n.results .category-heading > {\n display: block;\n}\n\n.results .category-heading > .category {\n color: var(--color-text05);\n font-style: italic;\n}\n\n.results .category-heading > .subcategory {\n margin-top: var(--space-unit);\n color: var(--color-default-text);\n text-transform: uppercase;\n}\n\n.results z-list-element {\n position: relative;\n display: block;\n}\n\nz-list-element > .item-search {\n padding: var(--space-unit) 0;\n}\n\nz-list z-list-element::before {\n position: absolute;\n z-index: 100;\n top: 5px;\n left: -20px;\n width: 8px;\n height: 1em;\n border-bottom: 1px solid var(--color-disabled01-icon);\n border-left: 1px solid var(--color-disabled01-icon);\n content: \"\";\n cursor: pointer;\n}\n\nz-list z-list-element::after {\n position: absolute;\n z-index: 100;\n top: 5px;\n left: -20px;\n width: 8px;\n height: 100%;\n border-left: 1px solid var(--color-disabled01-icon);\n content: \"\";\n cursor: pointer;\n}\n\nz-list z-list-element:last-child::after {\n display: none;\n}\n\nz-list > z-list-element::before,\nz-list > z-list-element::after,\nz-list > z-list-group > z-list-element::before,\nz-list > z-list-group > z-list-element::after {\n display: none;\n}\n\nz-list > div.children-node {\n padding-left: calc(var(--space-unit) * 3);\n}\n\n.results z-list-element > .list-element {\n display: flex;\n justify-content: space-between;\n padding: calc(var(--space-unit) * 1.25) 0;\n cursor: pointer;\n}\n\n.results z-list-element > .list-element:focus-visible {\n box-shadow: var(--shadow-focus-primary);\n outline: none;\n}\n\n.results z-list-element > .list-element .item.ellipsis {\n overflow: hidden;\n}\n\n.results z-list-element .list-element::after {\n position: absolute;\n top: 0;\n right: 0;\n display: block;\n width: 100%;\n height: 44px;\n content: \"\";\n transform: translateX(-100%);\n}\n\n.results z-list-element .list-element.focused.hovered::after {\n padding-left: 6px;\n}\n\n.results z-list-element > .list-element:hover,\n.results z-list-element > .list-element:hover::after {\n background-color: var(--color-background);\n cursor: pointer;\n}\n\n.results z-list-element > .list-element > z-tag {\n border: 1px solid var(--gray800);\n font-size: var(--font-size-1);\n font-weight: var(--font-sb);\n\n --z-tag-bg: var(--z-searchbar-tag-bg);\n --z-tag-text-color: var(--z-searchbar-tag-text-color);\n}\n\n.results .item {\n --z-icon-height: 12px;\n --z-icon-width: 12px;\n\n display: flex;\n flex-flow: row nowrap;\n align-items: center;\n justify-content: flex-start;\n color: var(--color-default-text);\n column-gap: calc(var(--space-unit) * 1.5);\n fill: var(--color-default-icon);\n font-size: var(--font-size-2);\n line-height: var(--font-size-6);\n}\n\n.results .item.ellipsis > .item-label {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.results .item > .item-label mark {\n background: var(--color-primary03);\n}\n\n.results .item.item-search {\n --z-icon-height: 16px;\n --z-icon-width: 16px;\n}\n\n.results .item-show-all {\n text-align: center;\n}\n\n.results .item-no-results {\n display: block;\n font-size: var(--font-size-2);\n font-style: italic;\n line-height: var(--font-size-5);\n}\n\n.results .item-no-results > ul {\n padding-left: calc(var(--space-unit) * 2);\n margin: var(--space-unit);\n}\n\n/* Tablet breakpoint /\n@media (min-width: 768px) {\n .results .category-heading {\n font-size: var(--font-size-3);\n line-height: var(--font-size-6);\n }\n\n .results .item {\n font-size: var(--font-size-3);\n line-height: var(--font-size-6);\n }\n\n .results .item.item-search {\n --z-icon-height: 18px;\n --z-icon-width: 18px;\n }\n\n .results .item.ellipsis > .item-label {\n height: 24px;\n }\n\n .results z-list-element > .list-element > z-tag {\n min-width: max-content;\n }\n}\n\n/ Desktop breakpoint /\n@media (min-width: 1152px) {\n .results .item {\n cursor: pointer;\n }\n\n .results .item-no-results {\n cursor: default;\n font-size: var(--font-size-3);\n line-height: var(--font-size-6);\n }\n}\n\n:host([size=\"small\"]) .results :is(.item, .category-heading),\n:host([size=\"x-small\"]) .results :is(.item, .category-heading) {\n font-size: var(--font-size-2);\n}\n\n:host([size=\"small\"]) .results .item:not(.has-category),\n:host([size=\"x-small\"]) .results .item:not(.has-category) {\n --z-icon-height: 16px;\n --z-icon-width: 16px;\n}\n\n:host([size=\"small\"]) z-list-element > .list-element,\n:host([size=\"small\"]) z-list-element > .item-search {\n padding: calc(var(--space-unit) 0.75) 0;\n}\n\n:host([size=\"x-small\"]) z-list-element > .list-element,\n:host([size=\"x-small\"]) z-list-element > .item-search {\n padding: calc(var(--space-unit) / 2) 0;\n}\n\n:host([size=\"small\"]) z-list-element .list-element::after {\n height: 36px;\n}\n\n:host([size=\"x-small\"]) z-list-element .list-element::after {\n height: 32px;\n}\n",".z-label {\n display: block;\n padding-bottom: var(--space-unit);\n color: var(--color-default-text);\n font-family: var(--font-family-sans);\n font-size: var(--font-size-1);\n font-weight: var(--font-sb);\n text-align: left;\n text-transform: uppercase;\n}\n","import {Component, Element, Event, EventEmitter, Host, Listen, Prop, State, Watch, h} from \"@stencil/core\";\nimport {\n ButtonVariant,\n ControlSize,\n Device,\n KeyboardCode,\n ListDividerType,\n SearchbarGroup,\n SearchbarGroupedItem,\n SearchbarItem,\n} from \"../../beans\";\nimport {getDevice, handleEnterKeydSubmit, randomId} from \"../../utils/utils\";\n\n/*\n @cssprop --z-searchbar-results-height - Max height of the results container (default: 540px)\n * @cssprop --z-searchbar-tag-text-color - Color of tag's text (default --color-primary03);\n * @cssprop --z-searchbar-tag-bg - Color of tag's background (default --color-hover-primary);\n /\n@Component({\n tag: \"z-searchbar\",\n styleUrls: [\"styles.css\", \"../css-components/z-label/styles.css\"],\n shadow: true,\n})\nexport class ZSearchbar {\n /* the id of the searchbar element /\n @Prop({reflect: true})\n htmlid = `searchbar-${randomId()}`;\n\n /* Prevent submit action /\n @Prop()\n preventSubmit?: boolean = false;\n\n /* the input label /\n @Prop()\n label?: string;\n\n /* the input aria-label /\n @Prop()\n htmlAriaLabel?: string;\n\n /* Input search string /\n @Prop()\n value?: string;\n\n /* Search input placeholder /\n @Prop()\n placeholder?: string;\n\n /* Show autocomplete results /\n @Prop()\n autocomplete?: boolean = false;\n\n /* Minimun number of characters to dispatch typing event /\n @Prop()\n autocompleteMinChars?: number = 3;\n\n /* Number of results shown - default all /\n @Prop()\n resultsCount?: number;\n\n /* Search helper text /\n @Prop()\n searchHelperLabel?: string = \"Cerca {searchString}\";\n\n /* Autocomplete results items /\n @Prop()\n resultsItems?: SearchbarItem[] \| string;\n\n /* Sort autocomplete results items /\n @Prop()\n sortResultsItems?: boolean = false;\n\n /* Show submit button /\n @Prop()\n showSearchButton?: boolean = false;\n\n /* Set button icon without label/\n @Prop()\n searchButtonIconOnly?: boolean = false;\n\n /* Available sizes: `big`, `small` and `x-small`. Defaults to `big`. /\n @Prop()\n size?: ControlSize = ControlSize.BIG;\n\n /* Graphical variant: `primary`, `secondary`, `tertiary`. Defaults to `primary`. /\n @Prop()\n variant?: ButtonVariant = ButtonVariant.PRIMARY;\n\n @State()\n searchString = this.value;\n\n @State()\n currResultsCount = 0;\n\n @State()\n showResults = false;\n\n @State()\n isMobile = false;\n\n @State()\n selectedItem?: SearchbarItem;\n\n @Element() element: HTMLZSearchbarElement;\n\n private resultsItemsList: SearchbarItem[] \| undefined = null;\n\n private inputRef: HTMLZInputElement;\n\n private resizeObserver: ResizeObserver;\n\n private items: HTMLElement[] = [];\n\n /* Emitted on search submit, return search string /\n @Event()\n searchSubmit: EventEmitter<string>;\n\n private emitSearchSubmit(): void {\n this.searchSubmit.emit(this.inputRef.value);\n }\n\n /* Emitted on search typing, return search string /\n @Event()\n searchTyping: EventEmitter<string>;\n\n private emitSearchTyping(search: string): void {\n this.searchTyping.emit(search);\n }\n\n /* Emitted on search result click, return item /\n @Event()\n searchItemClick: EventEmitter<SearchbarItem>;\n\n private emitSearchItemClick(item: SearchbarItem): void {\n this.searchItemClick.emit(item);\n this.selectedItem = item;\n this.searchString = \"\";\n }\n\n @Watch(\"resultsItems\")\n watchItems(): void {\n this.resultsItemsList = this.getResultsItemsList();\n }\n\n @Watch(\"resultsCount\")\n watchResultsCount(): void {\n this.currResultsCount = this.resultsCount;\n }\n\n @Watch(\"value\")\n watchValue(): void {\n this.searchString = this.value;\n }\n\n @Watch(\"searchString\")\n watchSearchString(): void {\n this.emitSearchTyping(this.searchString);\n this.items = [];\n if (!this.searchString) {\n this.currResultsCount = this.resultsCount;\n }\n }\n\n @Watch(\"showResults\")\n watchShowResults(): void {\n if (!this.showResults) {\n this.items = [];\n }\n }\n\n disconnectedCallback(): void {\n this.resizeObserver?.disconnect();\n }\n\n componentDidLoad(): void {\n this.resizeObserver = new ResizeObserver(() => {\n if (getDevice() === Device.MOBILE && !this.isMobile) {\n this.isMobile = true;\n }\n if (getDevice() !== Device.MOBILE && this.isMobile) {\n this.isMobile = false;\n }\n });\n this.resizeObserver.observe(this.element);\n }\n\n componentWillLoad(): void {\n this.resultsItemsList = this.getResultsItemsList();\n this.currResultsCount = this.resultsCount;\n }\n\n private getResultsItemsList(): SearchbarItem[] \| undefined {\n return typeof this.resultsItems === \"string\" ? JSON.parse(this.resultsItems) : this.resultsItems;\n }\n\n private getGroupedItems(items: SearchbarItem[]): SearchbarGroupedItem {\n const groupedItems = {};\n items.forEach((item: SearchbarItem) => {\n const key = `${item?.category}${item?.subcategory}`;\n groupedItems[key] = groupedItems[key] ?? {\n category: item?.category,\n subcategory: item?.subcategory,\n items: [],\n };\n groupedItems[key][\"items\"].push(item);\n });\n\n if (this.sortResultsItems) {\n return Object.keys(groupedItems)\n .sort()\n .reduce((obj, key) => {\n obj[key] = {\n ...groupedItems[key],\n items: groupedItems[key][\"items\"].sort((a: SearchbarItem, b: SearchbarItem) => {\n const nameA = a.label.toUpperCase();\n const nameB = b.label.toUpperCase();\n if (nameA < nameB) {\n return -1;\n }\n if (nameA > nameB) {\n return 1;\n }\n\n return 0;\n }),\n };\n\n return obj;\n }, {});\n }\n\n return groupedItems;\n }\n\n private checkResultsCount(counter: number): boolean {\n if (!this.currResultsCount \|\| counter < this.currResultsCount) {\n return true;\n }\n\n return false;\n }\n\n private handleStopTyping(e: CustomEvent): void {\n e.stopPropagation();\n this.searchString = e.detail.value;\n if (this.selectedItem) {\n this.selectedItem = undefined;\n }\n }\n\n private handleSubmit(): void {\n if (this.preventSubmit) {\n return;\n }\n this.emitSearchSubmit();\n }\n\n @Listen(\"click\", {target: \"document\"})\n private handleOutsideClick(e: MouseEvent): void {\n const cp = e.composedPath();\n\n const searchbar = cp.find((elem: HTMLElement) => elem.nodeName === \"Z-SEARCHBAR\");\n if (!searchbar \|\| (searchbar as HTMLZSearchbarElement).htmlid !== this.htmlid) {\n this.showResults = false;\n\n return;\n }\n\n if (cp.find((elem: HTMLElement) => elem?.nodeName === \"Z-INPUT\" \|\| elem?.classList?.contains(\"results\"))) {\n this.showResults = true;\n\n return;\n }\n\n this.showResults = false;\n }\n\n private renderInput(): HTMLZInputElement {\n return (\n <z-input\n ref={(val) => {\n this.inputRef = val;\n }}\n htmlid={`input-${this.htmlid}`}\n message={false}\n placeholder={this.placeholder}\n onStopTyping={(e: CustomEvent) => this.handleStopTyping(e)}\n onKeyUp={(e: KeyboardEvent) => {\n handleEnterKeydSubmit(e, () => this.handleSubmit());\n this.handleArrowsNavigation(e);\n }}\n value={this.searchString \|\| this.selectedItem?.label}\n size={this.size}\n label={this.label}\n aria-label={this.htmlAriaLabel \|\| this.placeholder}\n />\n );\n }\n\n private renderButton(): HTMLZButtonElement \| null {\n if (!this.showSearchButton) {\n return null;\n }\n\n const iconProp = this.searchButtonIconOnly ? {icon: \"search\"} : null;\n const buttonLabel = this.searchButtonIconOnly ? \"\" : \"CERCA\";\n const ariaLabel = this.searchButtonIconOnly ? {\"aria-label\": \"CERCA\"} : null;\n const defaultProps = {\n disabled: this.preventSubmit,\n variant: this.variant,\n size: this.size,\n onClick: () => this.handleSubmit(),\n ...iconProp,\n ...ariaLabel,\n };\n\n return <z-button {...defaultProps}>{buttonLabel}</z-button>;\n }\n\n private renderResults(): HTMLDivElement \| null {\n if (\n !this.showResults \|\|\n !this.autocomplete \|\|\n !this.searchString \|\|\n this.searchString.length < this.autocompleteMinChars \|\|\n !this.resultsItemsList\n ) {\n return null;\n }\n\n return (\n <div class=\"results-wrapper\">\n <div class=\"results\">{this.renderResultsList()}</div>\n </div>\n );\n }\n\n private renderResultsList(): HTMLZListElement \| HTMLSpanElement {\n if (this.preventSubmit && !this.resultsItemsList?.length) {\n return (\n <span class=\"item item-no-results\">\n Non abbiamo trovato risultati per <b>{this.searchString}</b>\n <br />\n <br />\n Cosa puoi fare?\n <ul>\n <li>Verificare di aver scritto bene</li>\n <li>Provare a cercare un'altra parola</li>\n <li>Provare a cercare qualcosa di più generico</li>\n </ul>\n </span>\n );\n }\n\n return (\n <z-list\n role=\"listbox\"\n id={`list-${this.htmlid}`}\n aria-label={this.htmlAriaLabel \|\| this.label}\n >\n {this.renderSearchHelper(!!this.resultsItemsList?.length)}\n {this.renderItems()}\n {this.renderShowAllResults()}\n </z-list>\n );\n }\n\n private renderItems(): HTMLZListGroupElement[] {\n if (!this.resultsItemsList?.length) {\n return [];\n }\n\n const groupedItems = this.getGroupedItems(this.resultsItemsList);\n const listGroups: HTMLZListGroupElement[] = [];\n let counter = 0;\n\n Object.values(groupedItems).forEach((groupItem: SearchbarGroup, index: number, array) => {\n if (this.checkResultsCount(counter)) {\n const listGroupsElements: HTMLZListElement[] = [];\n groupItem.items.forEach((item: SearchbarItem, subindex: number, subarray) => {\n if (this.checkResultsCount(counter)) {\n const isLast = index === array.length - 1 && subindex === subarray.length - 1;\n listGroupsElements.push(this.renderItem(item, subindex, !isLast));\n }\n counter++;\n });\n\n if (listGroupsElements.length) {\n listGroups.push(\n <z-list-group divider-type={ListDividerType.ELEMENT}>\n {this.renderItemCategory(groupItem)}\n {listGroupsElements}\n </z-list-group>\n );\n }\n }\n });\n\n return listGroups;\n }\n\n private handleArrowsNavigation(e: KeyboardEvent): void {\n const currentElement = e.target as HTMLElement;\n const arrows = [KeyboardCode.ARROW_DOWN, KeyboardCode.ARROW_UP];\n\n if (!arrows.includes(e.key as KeyboardCode)) {\n e.preventDefault();\n\n return;\n }\n\n if (!this.items.length) {\n const list = this.element.shadowRoot.querySelector(\"z-list\");\n if (!list) {\n return;\n }\n\n this.items = Array.from(list.querySelectorAll(\".list-element\"));\n }\n\n this.items.forEach((item) => item.classList.contains(\"focused\") && item.classList.remove(\"focused\"));\n\n const currentIndex = this.items.indexOf(currentElement as HTMLZListElementElement);\n\n if (e.key === KeyboardCode.ARROW_DOWN) {\n e.preventDefault();\n const nextIndex = currentIndex + 1;\n if (nextIndex < this.items.length) {\n (this.items[nextIndex] as HTMLElement).focus();\n this.items[nextIndex].classList.add(\"focused\");\n }\n }\n\n if (e.key === KeyboardCode.ARROW_UP) {\n e.preventDefault();\n const prevIndex = currentIndex - 1;\n if (prevIndex < 0) {\n this.element.shadowRoot.querySelector(\"input\").focus();\n this.element.shadowRoot\n .querySelector(\"input\")\n .setSelectionRange(this.inputRef.value.length, this.inputRef.value.length);\n }\n if (prevIndex >= 0) {\n (this.items[prevIndex] as HTMLElement).focus();\n this.items[prevIndex].classList.add(\"focused\");\n }\n }\n }\n\n private renderItem(item: SearchbarItem, key: number, divider: boolean): HTMLZListElementElement {\n return (\n <z-list-element\n id={`list-item-${this.htmlid}-${key}`}\n tabIndex={0}\n role=\"option\"\n dividerType={divider ? ListDividerType.ELEMENT : undefined}\n onKeyDown={(e: KeyboardEvent) => this.handleArrowsNavigation(e)}\n >\n <div\n class=\"list-element\"\n tabIndex={0}\n onClick={() => this.emitSearchItemClick(item)}\n onKeyDown={(e: KeyboardEvent) => handleEnterKeydSubmit(e, () => this.emitSearchItemClick(item))}\n onMouseEnter={(e: MouseEvent) => {\n const currentElement = e.target as HTMLElement;\n currentElement.classList.add(\"hovered\");\n }}\n onMouseLeave={(e: MouseEvent) => {\n const currentElement = e.target as HTMLElement;\n currentElement.classList.contains(\"hovered\") && currentElement.classList.remove(\"hovered\");\n }}\n >\n <span class=\"item ellipsis\">\n {item?.icon && (\n <z-icon\n class=\"item-icon\"\n name={item.icon}\n />\n )}\n <span\n class=\"item-label\"\n title={item.label}\n innerHTML={this.renderItemLabel(item.label)}\n />\n </span>\n {item?.tag && <z-tag icon={item.tag.icon}>{!this.isMobile ? item.tag.text : \"\"}</z-tag>}\n </div>\n {item.children && item.children.length > 0 ? (\n <z-list>\n <div class=\"children-node\">{item.children.map((child, index) => this.renderItem(child, index, false))}</div>\n </z-list>\n ) : null}\n </z-list-element>\n );\n }\n\n private renderItemLabel(label: string): string {\n if (!this.searchString) {\n return label;\n }\n\n return label.replace(\n new RegExp(this.searchString.replace(/[.+?^${}()\|[\\]\\\\]/g, \"\\\\$&\"), \"gmi\"),\n (found) => `<mark>${found}</mark>`\n );\n }\n\n private renderItemCategory(groupItem: SearchbarGroup): HTMLSpanElement \| null {\n if (!groupItem?.category) {\n return null;\n }\n\n return (\n <span\n class=\"category-heading\"\n slot=\"header-title\"\n >\n <span class=\"category\">{groupItem.category}</span>\n {groupItem?.subcategory && <span class=\"subcategory\">{groupItem.subcategory}</span>}\n </span>\n );\n }\n\n private renderSearchHelper(hasDivider = true): HTMLZListElement \| null {\n if (!this.autocomplete \|\| this.preventSubmit \|\| !this.searchString) {\n return null;\n }\n\n return (\n <z-list-element\n role=\"option\"\n dividerType={hasDivider ? ListDividerType.ELEMENT : undefined}\n id={`list-item-${this.htmlid}-search`}\n onKeyDown={(e: KeyboardEvent) => this.handleArrowsNavigation(e)}\n >\n <div\n tabindex={0}\n onClick={() => this.emitSearchSubmit()}\n onKeyDown={(e: KeyboardEvent) => handleEnterKeydSubmit(e, () => this.emitSearchSubmit())}\n class=\"list-element\"\n >\n <span class=\"item item-search\">\n <z-icon\n class=\"search-icon\"\n name=\"left-magnifying-glass\"\n />\n <span\n class=\"item-label\"\n innerHTML={this.searchHelperLabel.replace(\"{searchString}\", `<mark>${this.searchString}</mark>`)}\n />\n </span>\n </div>\n </z-list-element>\n );\n }\n\n private renderShowAllResults(): HTMLZListElement \| null {\n if (\n !this.currResultsCount \|\|\n !this.searchString \|\|\n !this.resultsItemsList?.length \|\|\n this.currResultsCount >= this.resultsItemsList?.length\n ) {\n return null;\n }\n\n return (\n <z-list-element\n role=\"option\"\n tabindex={0}\n clickable\n id={`list-item-${this.htmlid}-show-all`}\n onClickItem={() => (this.currResultsCount = 0)}\n color=\"color-primary01\"\n >\n <div class=\"item-show-all\">Vedi tutti i risultati</div>\n </z-list-element>\n );\n }\n\n render(): HTMLZSearchbarElement {\n return (\n <Host\n onFocus={() => (this.showResults = true)}\n onClick={(e) => this.handleOutsideClick(e)}\n class={{\"has-submit\": this.showSearchButton, \"has-results\": this.autocomplete}}\n >\n <div class=\"input-container\">\n {this.renderInput()}\n {this.renderResults()}\n </div>\n {this.renderButton()}\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"index25.js","mappings":"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","names":["stylesCss"],"sources":["src/components/z-searchbar/styles.css?tag=z-searchbar&encapsulation=shadow","src/components/css-components/z-label/styles.css?tag=z-searchbar&encapsulation=shadow","src/components/z-searchbar/index.tsx"],"sourcesContent":[":host {\n --z-searchbar-tag-text-color: var(--color-primary03);\n --z-searchbar-tag-bg: var(--color-hover-primary);\n --z-searchbar-item-height: 44px;\n\n z-index: 15;\n display: flex;\n column-gap: calc(var(--space-unit) * 2);\n font-family: var(--font-family-sans);\n font-weight: var(--font-rg);\n}\n\n:host,\n* {\n box-sizing: border-box;\n}\n\n:host::part(list-item-container) {\n display: block;\n min-height: unset;\n padding: 0;\n}\n\n.input-container {\n position: relative;\n display: flex;\n width: 100%;\n flex-direction: column;\n}\n\n.results-wrapper {\n position: absolute;\n top: calc(100% - 1px);\n left: 0;\n width: 100%;\n padding: calc(var(--space-unit) / 4);\n border: var(--border-size-small) solid var(--color-surface03);\n border-top: none;\n background: var(--color-surface01);\n}\n\n.results {\n overflow: auto;\n max-height: var(--z-searchbar-results-height, 540px);\n padding: calc(var(--space-unit) / 2) calc(var(--space-unit) * 1.5);\n}\n\n.results::-webkit-scrollbar {\n width: 6px;\n background: linear-gradient(to right, transparent 0 1px, var(--gray200) 1px 5px, transparent 5px 6px);\n}\n\n.results::-webkit-scrollbar-thumb {\n background-color: var(--color-primary01);\n}\n\n.results::-webkit-scrollbar-thumb:hover {\n background-color: var(--color-hover-primary);\n}\n\n/* Firefox scrollbar /\n@supports not selector(.results::-webkit-scrollbar-track) {\n .results {\n scrollbar-color: var(--color-primary01) transparent;\n }\n}\n\n.results .category-heading {\n display: block;\n font-size: var(--font-size-2);\n font-weight: var(--font-rg);\n line-height: var(--font-size-3);\n}\n\n.results .category-heading > {\n display: block;\n}\n\n.results .category-heading > .category {\n color: var(--color-text05);\n font-style: italic;\n}\n\n.results .category-heading > .subcategory {\n margin-top: var(--space-unit);\n color: var(--color-default-text);\n text-transform: uppercase;\n}\n\n.results z-list-element {\n position: relative;\n display: block;\n}\n\nz-list-element > .item-search {\n padding: var(--space-unit) 0;\n}\n\nz-list z-list-element::before {\n position: absolute;\n z-index: 100;\n top: 5px;\n left: -20px;\n width: 8px;\n height: 1em;\n border-bottom: 1px solid var(--color-disabled01-icon);\n border-left: 1px solid var(--color-disabled01-icon);\n content: \"\";\n cursor: pointer;\n}\n\nz-list z-list-element::after {\n position: absolute;\n z-index: 100;\n top: 5px;\n left: -20px;\n width: 8px;\n height: 100%;\n border-left: 1px solid var(--color-disabled01-icon);\n content: \"\";\n cursor: pointer;\n}\n\nz-list z-list-element:last-child::after {\n display: none;\n}\n\nz-list > z-list-element::before,\nz-list > z-list-element::after,\nz-list > z-list-group > z-list-element::before,\nz-list > z-list-group > z-list-element::after {\n display: none;\n}\n\nz-list > div.children-node {\n padding-left: calc(var(--space-unit) * 3);\n}\n\n.results z-list-element > .list-element {\n display: flex;\n justify-content: space-between;\n padding: calc(var(--space-unit) * 1.25) 0;\n cursor: pointer;\n}\n\n.results z-list-element > .list-element:focus-visible {\n box-shadow: var(--shadow-focus-primary);\n outline: none;\n}\n\n.results z-list-element > .list-element .item.ellipsis {\n overflow: hidden;\n}\n\n.results z-list-element .list-element::after {\n position: absolute;\n top: 0;\n right: 0;\n display: block;\n width: 100%;\n height: 44px;\n content: \"\";\n transform: translateX(-100%);\n}\n\n.results z-list-element .list-element.focused.hovered::after {\n padding-left: 6px;\n}\n\n.results z-list-element > .list-element:hover,\n.results z-list-element > .list-element:hover::after {\n background-color: var(--color-background);\n cursor: pointer;\n}\n\n.results z-list-element > .list-element > z-tag {\n border: 1px solid var(--gray800);\n font-size: var(--font-size-1);\n font-weight: var(--font-sb);\n\n --z-tag-bg: var(--z-searchbar-tag-bg);\n --z-tag-text-color: var(--z-searchbar-tag-text-color);\n}\n\n.results .item {\n --z-icon-height: 12px;\n --z-icon-width: 12px;\n\n display: flex;\n flex-flow: row nowrap;\n align-items: center;\n justify-content: flex-start;\n color: var(--color-default-text);\n column-gap: calc(var(--space-unit) * 1.5);\n fill: var(--color-default-icon);\n font-size: var(--font-size-2);\n line-height: var(--font-size-6);\n}\n\n.results .item.ellipsis > .item-label {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.results .item > .item-label mark {\n background: var(--color-primary03);\n}\n\n.results .item.item-search {\n --z-icon-height: 16px;\n --z-icon-width: 16px;\n}\n\n.results .item-show-all {\n text-align: center;\n}\n\n.results .item-no-results {\n display: block;\n font-size: var(--font-size-2);\n font-style: italic;\n line-height: var(--font-size-5);\n}\n\n.results .item-no-results > ul {\n padding-left: calc(var(--space-unit) * 2);\n margin: var(--space-unit);\n}\n\n/* Tablet breakpoint /\n@media (min-width: 768px) {\n .results .category-heading {\n font-size: var(--font-size-3);\n line-height: var(--font-size-6);\n }\n\n .results .item {\n font-size: var(--font-size-3);\n line-height: var(--font-size-6);\n }\n\n .results .item.item-search {\n --z-icon-height: 18px;\n --z-icon-width: 18px;\n }\n\n .results .item.ellipsis > .item-label {\n height: 1.5rem;\n }\n\n .results z-list-element > .list-element > z-tag {\n min-width: max-content;\n }\n}\n\n/ Desktop breakpoint /\n@media (min-width: 1152px) {\n .results .item {\n cursor: pointer;\n }\n\n .results .item-no-results {\n cursor: default;\n font-size: var(--font-size-3);\n line-height: var(--font-size-6);\n }\n}\n\n:host([size=\"small\"]) .results :is(.item, .category-heading),\n:host([size=\"x-small\"]) .results :is(.item, .category-heading) {\n font-size: var(--font-size-2);\n}\n\n:host([size=\"small\"]) .results .item:not(.has-category),\n:host([size=\"x-small\"]) .results .item:not(.has-category) {\n --z-icon-height: 16px;\n --z-icon-width: 16px;\n}\n\n:host([size=\"small\"]) z-list-element > .list-element,\n:host([size=\"small\"]) z-list-element > .item-search {\n padding: calc(var(--space-unit) 0.75) 0;\n}\n\n:host([size=\"x-small\"]) z-list-element > .list-element,\n:host([size=\"x-small\"]) z-list-element > .item-search {\n padding: calc(var(--space-unit) / 2) 0;\n}\n\n:host([size=\"small\"]) z-list-element .list-element::after {\n height: 36px;\n}\n\n:host([size=\"x-small\"]) z-list-element .list-element::after {\n height: 32px;\n}\n",".z-label {\n display: block;\n padding-bottom: var(--space-unit);\n color: var(--color-default-text);\n font-family: var(--font-family-sans);\n font-size: var(--font-size-1);\n font-weight: var(--font-sb);\n text-align: left;\n text-transform: uppercase;\n}\n","import {Component, Element, Event, EventEmitter, Host, Listen, Prop, State, Watch, h} from \"@stencil/core\";\nimport {\n ButtonVariant,\n ControlSize,\n Device,\n KeyboardCode,\n ListDividerType,\n SearchbarGroup,\n SearchbarGroupedItem,\n SearchbarItem,\n} from \"../../beans\";\nimport {getDevice, handleEnterKeydSubmit, randomId} from \"../../utils/utils\";\n\n/*\n @cssprop --z-searchbar-results-height - Max height of the results container (default: 540px)\n * @cssprop --z-searchbar-tag-text-color - Color of tag's text (default --color-primary03);\n * @cssprop --z-searchbar-tag-bg - Color of tag's background (default --color-hover-primary);\n /\n@Component({\n tag: \"z-searchbar\",\n styleUrls: [\"styles.css\", \"../css-components/z-label/styles.css\"],\n shadow: true,\n})\nexport class ZSearchbar {\n /* the id of the searchbar element /\n @Prop({reflect: true})\n htmlid = `searchbar-${randomId()}`;\n\n /* Prevent submit action /\n @Prop()\n preventSubmit?: boolean = false;\n\n /* the input label /\n @Prop()\n label?: string;\n\n /* the input aria-label /\n @Prop()\n htmlAriaLabel?: string;\n\n /* Input search string /\n @Prop()\n value?: string;\n\n /* Search input placeholder /\n @Prop()\n placeholder?: string;\n\n /* Show autocomplete results /\n @Prop()\n autocomplete?: boolean = false;\n\n /* Minimun number of characters to dispatch typing event /\n @Prop()\n autocompleteMinChars?: number = 3;\n\n /* Number of results shown - default all /\n @Prop()\n resultsCount?: number;\n\n /* Search helper text /\n @Prop()\n searchHelperLabel?: string = \"Cerca {searchString}\";\n\n /* Autocomplete results items /\n @Prop()\n resultsItems?: SearchbarItem[] \| string;\n\n /* Sort autocomplete results items /\n @Prop()\n sortResultsItems?: boolean = false;\n\n /* Show submit button /\n @Prop()\n showSearchButton?: boolean = false;\n\n /* Set button icon without label/\n @Prop()\n searchButtonIconOnly?: boolean = false;\n\n /* Available sizes: `big`, `small` and `x-small`. Defaults to `big`. /\n @Prop()\n size?: ControlSize = ControlSize.BIG;\n\n /* Graphical variant: `primary`, `secondary`, `tertiary`. Defaults to `primary`. /\n @Prop()\n variant?: ButtonVariant = ButtonVariant.PRIMARY;\n\n @State()\n searchString = this.value;\n\n @State()\n currResultsCount = 0;\n\n @State()\n showResults = false;\n\n @State()\n isMobile = false;\n\n @State()\n selectedItem?: SearchbarItem;\n\n @Element() element: HTMLZSearchbarElement;\n\n private resultsItemsList: SearchbarItem[] \| undefined = null;\n\n private inputRef: HTMLZInputElement;\n\n private resizeObserver: ResizeObserver;\n\n private items: HTMLElement[] = [];\n\n /* Emitted on search submit, return search string /\n @Event()\n searchSubmit: EventEmitter<string>;\n\n private emitSearchSubmit(): void {\n this.searchSubmit.emit(this.inputRef.value);\n }\n\n /* Emitted on search typing, return search string /\n @Event()\n searchTyping: EventEmitter<string>;\n\n private emitSearchTyping(search: string): void {\n this.searchTyping.emit(search);\n }\n\n /* Emitted on search result click, return item /\n @Event()\n searchItemClick: EventEmitter<SearchbarItem>;\n\n private emitSearchItemClick(item: SearchbarItem): void {\n this.searchItemClick.emit(item);\n this.selectedItem = item;\n this.searchString = \"\";\n }\n\n @Watch(\"resultsItems\")\n watchItems(): void {\n this.resultsItemsList = this.getResultsItemsList();\n }\n\n @Watch(\"resultsCount\")\n watchResultsCount(): void {\n this.currResultsCount = this.resultsCount;\n }\n\n @Watch(\"value\")\n watchValue(): void {\n this.searchString = this.value;\n }\n\n @Watch(\"searchString\")\n watchSearchString(): void {\n this.emitSearchTyping(this.searchString);\n this.items = [];\n if (!this.searchString) {\n this.currResultsCount = this.resultsCount;\n }\n }\n\n @Watch(\"showResults\")\n watchShowResults(): void {\n if (!this.showResults) {\n this.items = [];\n }\n }\n\n disconnectedCallback(): void {\n this.resizeObserver?.disconnect();\n }\n\n componentDidLoad(): void {\n this.resizeObserver = new ResizeObserver(() => {\n if (getDevice() === Device.MOBILE && !this.isMobile) {\n this.isMobile = true;\n }\n if (getDevice() !== Device.MOBILE && this.isMobile) {\n this.isMobile = false;\n }\n });\n this.resizeObserver.observe(this.element);\n }\n\n componentWillLoad(): void {\n this.resultsItemsList = this.getResultsItemsList();\n this.currResultsCount = this.resultsCount;\n }\n\n private getResultsItemsList(): SearchbarItem[] \| undefined {\n return typeof this.resultsItems === \"string\" ? JSON.parse(this.resultsItems) : this.resultsItems;\n }\n\n private getGroupedItems(items: SearchbarItem[]): SearchbarGroupedItem {\n const groupedItems = {};\n items.forEach((item: SearchbarItem) => {\n const key = `${item?.category}${item?.subcategory}`;\n groupedItems[key] = groupedItems[key] ?? {\n category: item?.category,\n subcategory: item?.subcategory,\n items: [],\n };\n groupedItems[key][\"items\"].push(item);\n });\n\n if (this.sortResultsItems) {\n return Object.keys(groupedItems)\n .sort()\n .reduce((obj, key) => {\n obj[key] = {\n ...groupedItems[key],\n items: groupedItems[key][\"items\"].sort((a: SearchbarItem, b: SearchbarItem) => {\n const nameA = a.label.toUpperCase();\n const nameB = b.label.toUpperCase();\n if (nameA < nameB) {\n return -1;\n }\n if (nameA > nameB) {\n return 1;\n }\n\n return 0;\n }),\n };\n\n return obj;\n }, {});\n }\n\n return groupedItems;\n }\n\n private checkResultsCount(counter: number): boolean {\n if (!this.currResultsCount \|\| counter < this.currResultsCount) {\n return true;\n }\n\n return false;\n }\n\n private handleStopTyping(e: CustomEvent): void {\n e.stopPropagation();\n this.searchString = e.detail.value;\n if (this.selectedItem) {\n this.selectedItem = undefined;\n }\n }\n\n private handleSubmit(): void {\n if (this.preventSubmit) {\n return;\n }\n this.emitSearchSubmit();\n }\n\n @Listen(\"click\", {target: \"document\"})\n private handleOutsideClick(e: MouseEvent): void {\n const cp = e.composedPath();\n\n const searchbar = cp.find((elem: HTMLElement) => elem.nodeName === \"Z-SEARCHBAR\");\n if (!searchbar \|\| (searchbar as HTMLZSearchbarElement).htmlid !== this.htmlid) {\n this.showResults = false;\n\n return;\n }\n\n if (cp.find((elem: HTMLElement) => elem?.nodeName === \"Z-INPUT\" \|\| elem?.classList?.contains(\"results\"))) {\n this.showResults = true;\n\n return;\n }\n\n this.showResults = false;\n }\n\n private renderInput(): HTMLZInputElement {\n return (\n <z-input\n ref={(val) => {\n this.inputRef = val;\n }}\n htmlid={`input-${this.htmlid}`}\n message={false}\n placeholder={this.placeholder}\n onStopTyping={(e: CustomEvent) => this.handleStopTyping(e)}\n onKeyUp={(e: KeyboardEvent) => {\n handleEnterKeydSubmit(e, () => this.handleSubmit());\n this.handleArrowsNavigation(e);\n }}\n value={this.searchString \|\| this.selectedItem?.label}\n size={this.size}\n label={this.label}\n aria-label={this.htmlAriaLabel \|\| this.placeholder}\n />\n );\n }\n\n private renderButton(): HTMLZButtonElement \| null {\n if (!this.showSearchButton) {\n return null;\n }\n\n const iconProp = this.searchButtonIconOnly ? {icon: \"search\"} : null;\n const buttonLabel = this.searchButtonIconOnly ? \"\" : \"CERCA\";\n const ariaLabel = this.searchButtonIconOnly ? {\"aria-label\": \"CERCA\"} : null;\n const defaultProps = {\n disabled: this.preventSubmit,\n variant: this.variant,\n size: this.size,\n onClick: () => this.handleSubmit(),\n ...iconProp,\n ...ariaLabel,\n };\n\n return <z-button {...defaultProps}>{buttonLabel}</z-button>;\n }\n\n private renderResults(): HTMLDivElement \| null {\n if (\n !this.showResults \|\|\n !this.autocomplete \|\|\n !this.searchString \|\|\n this.searchString.length < this.autocompleteMinChars \|\|\n !this.resultsItemsList\n ) {\n return null;\n }\n\n return (\n <div class=\"results-wrapper\">\n <div class=\"results\">{this.renderResultsList()}</div>\n </div>\n );\n }\n\n private renderResultsList(): HTMLZListElement \| HTMLSpanElement {\n if (this.preventSubmit && !this.resultsItemsList?.length) {\n return (\n <span class=\"item item-no-results\">\n Non abbiamo trovato risultati per <b>{this.searchString}</b>\n <br />\n <br />\n Cosa puoi fare?\n <ul>\n <li>Verificare di aver scritto bene</li>\n <li>Provare a cercare un'altra parola</li>\n <li>Provare a cercare qualcosa di più generico</li>\n </ul>\n </span>\n );\n }\n\n return (\n <z-list\n role=\"listbox\"\n id={`list-${this.htmlid}`}\n aria-label={this.htmlAriaLabel \|\| this.label}\n >\n {this.renderSearchHelper(!!this.resultsItemsList?.length)}\n {this.renderItems()}\n {this.renderShowAllResults()}\n </z-list>\n );\n }\n\n private renderItems(): HTMLZListGroupElement[] {\n if (!this.resultsItemsList?.length) {\n return [];\n }\n\n const groupedItems = this.getGroupedItems(this.resultsItemsList);\n const listGroups: HTMLZListGroupElement[] = [];\n let counter = 0;\n\n Object.values(groupedItems).forEach((groupItem: SearchbarGroup, index: number, array) => {\n if (this.checkResultsCount(counter)) {\n const listGroupsElements: HTMLZListElement[] = [];\n groupItem.items.forEach((item: SearchbarItem, subindex: number, subarray) => {\n if (this.checkResultsCount(counter)) {\n const isLast = index === array.length - 1 && subindex === subarray.length - 1;\n listGroupsElements.push(this.renderItem(item, subindex, !isLast));\n }\n counter++;\n });\n\n if (listGroupsElements.length) {\n listGroups.push(\n <z-list-group divider-type={ListDividerType.ELEMENT}>\n {this.renderItemCategory(groupItem)}\n {listGroupsElements}\n </z-list-group>\n );\n }\n }\n });\n\n return listGroups;\n }\n\n private handleArrowsNavigation(e: KeyboardEvent): void {\n const currentElement = e.target as HTMLElement;\n const arrows = [KeyboardCode.ARROW_DOWN, KeyboardCode.ARROW_UP];\n\n if (!arrows.includes(e.key as KeyboardCode)) {\n e.preventDefault();\n\n return;\n }\n\n if (!this.items.length) {\n const list = this.element.shadowRoot.querySelector(\"z-list\");\n if (!list) {\n return;\n }\n\n this.items = Array.from(list.querySelectorAll(\".list-element\"));\n }\n\n this.items.forEach((item) => item.classList.contains(\"focused\") && item.classList.remove(\"focused\"));\n\n const currentIndex = this.items.indexOf(currentElement as HTMLZListElementElement);\n\n if (e.key === KeyboardCode.ARROW_DOWN) {\n e.preventDefault();\n const nextIndex = currentIndex + 1;\n if (nextIndex < this.items.length) {\n (this.items[nextIndex] as HTMLElement).focus();\n this.items[nextIndex].classList.add(\"focused\");\n }\n }\n\n if (e.key === KeyboardCode.ARROW_UP) {\n e.preventDefault();\n const prevIndex = currentIndex - 1;\n if (prevIndex < 0) {\n this.element.shadowRoot.querySelector(\"input\").focus();\n this.element.shadowRoot\n .querySelector(\"input\")\n .setSelectionRange(this.inputRef.value.length, this.inputRef.value.length);\n }\n if (prevIndex >= 0) {\n (this.items[prevIndex] as HTMLElement).focus();\n this.items[prevIndex].classList.add(\"focused\");\n }\n }\n }\n\n private renderItem(item: SearchbarItem, key: number, divider: boolean): HTMLZListElementElement {\n return (\n <z-list-element\n id={`list-item-${this.htmlid}-${key}`}\n tabIndex={0}\n role=\"option\"\n dividerType={divider ? ListDividerType.ELEMENT : undefined}\n onKeyDown={(e: KeyboardEvent) => this.handleArrowsNavigation(e)}\n >\n <div\n class=\"list-element\"\n tabIndex={0}\n onClick={() => this.emitSearchItemClick(item)}\n onKeyDown={(e: KeyboardEvent) => handleEnterKeydSubmit(e, () => this.emitSearchItemClick(item))}\n onMouseEnter={(e: MouseEvent) => {\n const currentElement = e.target as HTMLElement;\n currentElement.classList.add(\"hovered\");\n }}\n onMouseLeave={(e: MouseEvent) => {\n const currentElement = e.target as HTMLElement;\n currentElement.classList.contains(\"hovered\") && currentElement.classList.remove(\"hovered\");\n }}\n >\n <span class=\"item ellipsis\">\n {item?.icon && (\n <z-icon\n class=\"item-icon\"\n name={item.icon}\n />\n )}\n <span\n class=\"item-label\"\n title={item.label}\n innerHTML={this.renderItemLabel(item.label)}\n />\n </span>\n {item?.tag && <z-tag icon={item.tag.icon}>{!this.isMobile ? item.tag.text : \"\"}</z-tag>}\n </div>\n {item.children && item.children.length > 0 ? (\n <z-list>\n <div class=\"children-node\">{item.children.map((child, index) => this.renderItem(child, index, false))}</div>\n </z-list>\n ) : null}\n </z-list-element>\n );\n }\n\n private renderItemLabel(label: string): string {\n if (!this.searchString) {\n return label;\n }\n\n return label.replace(\n new RegExp(this.searchString.replace(/[.+?^${}()\|[\\]\\\\]/g, \"\\\\$&\"), \"gmi\"),\n (found) => `<mark>${found}</mark>`\n );\n }\n\n private renderItemCategory(groupItem: SearchbarGroup): HTMLSpanElement \| null {\n if (!groupItem?.category) {\n return null;\n }\n\n return (\n <span\n class=\"category-heading\"\n slot=\"header-title\"\n >\n <span class=\"category\">{groupItem.category}</span>\n {groupItem?.subcategory && <span class=\"subcategory\">{groupItem.subcategory}</span>}\n </span>\n );\n }\n\n private renderSearchHelper(hasDivider = true): HTMLZListElement \| null {\n if (!this.autocomplete \|\| this.preventSubmit \|\| !this.searchString) {\n return null;\n }\n\n return (\n <z-list-element\n role=\"option\"\n dividerType={hasDivider ? ListDividerType.ELEMENT : undefined}\n id={`list-item-${this.htmlid}-search`}\n onKeyDown={(e: KeyboardEvent) => this.handleArrowsNavigation(e)}\n >\n <div\n tabindex={0}\n onClick={() => this.emitSearchSubmit()}\n onKeyDown={(e: KeyboardEvent) => handleEnterKeydSubmit(e, () => this.emitSearchSubmit())}\n class=\"list-element\"\n >\n <span class=\"item item-search\">\n <z-icon\n class=\"search-icon\"\n name=\"left-magnifying-glass\"\n />\n <span\n class=\"item-label\"\n innerHTML={this.searchHelperLabel.replace(\"{searchString}\", `<mark>${this.searchString}</mark>`)}\n />\n </span>\n </div>\n </z-list-element>\n );\n }\n\n private renderShowAllResults(): HTMLZListElement \| null {\n if (\n !this.currResultsCount \|\|\n !this.searchString \|\|\n !this.resultsItemsList?.length \|\|\n this.currResultsCount >= this.resultsItemsList?.length\n ) {\n return null;\n }\n\n return (\n <z-list-element\n role=\"option\"\n tabindex={0}\n clickable\n id={`list-item-${this.htmlid}-show-all`}\n onClickItem={() => (this.currResultsCount = 0)}\n color=\"color-primary01\"\n >\n <div class=\"item-show-all\">Vedi tutti i risultati</div>\n </z-list-element>\n );\n }\n\n render(): HTMLZSearchbarElement {\n return (\n <Host\n onFocus={() => (this.showResults = true)}\n onClick={(e) => this.handleOutsideClick(e)}\n class={{\"has-submit\": this.showSearchButton, \"has-results\": this.autocomplete}}\n >\n <div class=\"input-container\">\n {this.renderInput()}\n {this.renderResults()}\n </div>\n {this.renderButton()}\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/components/utils.js CHANGED Viewed

@@ -235,7 +235,12 @@ function findContainingBlockAncestor(element) {
     }
     return element.ownerDocument.documentElement;
 }
+/** Convert HTML to plain text */
+const getPlainText = (html) => {
+    const doc = new DOMParser().parseFromString(html, "text/html");
+    return doc.body.textContent || "";
+};
-export { containsElement as a, boolean as b, colorFromId as c, getElementTree as d, getClickedElement as e, convertJson as f, getDevice as g, handleKeyboardSubmit as h, getParentElement as i, findContainingBlockAncestor as j, isElementVisibleInContainer as k, handleEnterKeydSubmit as l, randomId as r };
+export { containsElement as a, getPlainText as b, colorFromId as c, boolean as d, getElementTree as e, getClickedElement as f, getDevice as g, handleKeyboardSubmit as h, convertJson as i, getParentElement as j, findContainingBlockAncestor as k, isElementVisibleInContainer as l, handleEnterKeydSubmit as m, randomId as r };
 //# sourceMappingURL=utils.js.map

package/dist/components/utils.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"utils.js","mappings":"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","names":[],"sources":["src/utils/utils.ts"],"sourcesContent":["import {ChildNode} from \"@stencil/core\";\nimport {Device, KeyboardCode} from \"../beans/index\";\nimport {Breakpoints} from \"../constants/breakpoints\";\n\n/*\n Return boolean value for passed value if a boolean corresponding value is found\n * Return passed value otherwise\n /\nexport function boolean(value: string \| number \| boolean): boolean \| string \| number {\n switch (value) {\n case true:\n case \"true\":\n case 1:\n case \"1\":\n case \"on\":\n case \"yes\":\n return true;\n case false:\n case \"false\":\n case 0:\n case \"0\":\n case \"off\":\n case \"no\":\n return false;\n default:\n return value;\n }\n}\n\nexport function retrieveAsset(assetName: string): string {\n return assetName && \"assets/images/png/\" + assetName;\n}\n\nexport function randomId(): string {\n return Math.random().toString(36).replace(\"0.\", \"\");\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport function handleKeyboardSubmit(ev: KeyboardEvent, callback: (...args) => void, ...args: any[]): void {\n if (ev.code === KeyboardCode.ENTER \|\| ev.code === KeyboardCode.SPACE) {\n ev.preventDefault();\n callback(...args);\n }\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport function handleEnterKeydSubmit(ev: KeyboardEvent, callback: (...args) => void, ...args: any[]): void {\n if (ev.code === KeyboardCode.ENTER) {\n ev.preventDefault();\n callback(...args);\n }\n}\n\nexport function getClickedElement(elem: null \| Element = null): null \| Element {\n if (!elem) {\n elem = document.activeElement;\n }\n\n if (elem && elem.shadowRoot && elem.shadowRoot.activeElement) {\n elem = elem.shadowRoot.activeElement;\n\n return getClickedElement(elem);\n }\n\n return elem;\n}\n\nexport function getElementTree(elem: Element, tree: Element[] = []): null \| Element[] {\n tree.push(elem);\n\n if (elem.parentElement) {\n elem = elem.parentElement;\n\n return getElementTree(elem, tree);\n } else if (elem.parentNode && (elem.parentNode as ShadowRoot).host) {\n elem = (elem.parentNode as ShadowRoot).host;\n\n return getElementTree(elem, tree);\n }\n\n return tree;\n}\n\nexport function getSiblings(elem: HTMLElement): ChildNode[] {\n const siblings = [];\n if (!elem \|\| !elem.parentNode \|\| !elem.parentNode.childNodes) {\n return siblings;\n }\n\n elem.parentNode.childNodes.forEach((child) => {\n if (child.nodeType === 1 && child !== elem) {\n siblings.push(child);\n }\n });\n\n return siblings;\n}\n\n/\n Get the current device type based on the window width.\n * @returns {Device} - The current device type\n /\nexport function getDevice(): Device {\n switch (true) {\n case window.innerWidth <= Breakpoints.MOBILE:\n return Device.MOBILE;\n case window.innerWidth <= Breakpoints.TABLET:\n return Device.TABLET;\n case window.innerWidth <= Breakpoints.DESKTOP:\n return Device.DESKTOP;\n default:\n return Device.DESKTOP_WIDE;\n }\n}\n\ntype JSONValue = string \| number \| boolean \| JSONObject \| JSONArray;\ninterface JSONObject {\n [x: string]: JSONValue;\n}\ntype JSONArray = JSONValue[];\n\nexport function convertJson(data: string): JSONValue {\n try {\n return JSON.parse(data);\n } catch {\n return false;\n }\n}\n\nexport function colorFromId(id: number): string {\n const prefix = \"avatar-C\"; // prefix for color vars name\n const colorsCount = 19; // available colors\n const seed = Math.ceil(2 * 31 - 1) * parseFloat(`0.${id}`);\n let color = Math.ceil(colorsCount * (seed % 1));\n\n // if result of mc is 0\n // es.: 3895229\n if (color === 0) {\n color = 1;\n }\n\n return `${prefix}${color.toString().padStart(2, \"0\")}`;\n}\n\n/*\n Check if the passed CSS selector is valid.\n * @param selector CSS selector to validate\n /\nexport function isSelectorValid(selector: string): boolean {\n try {\n document.createDocumentFragment().querySelector(selector);\n\n return true;\n } catch {\n return false;\n }\n}\n\n/\n Check if an element contains another element, checking both light and shadow DOM recursively.\n * This function also checks slot assignments, so it correctly handles nested slots across components.\n * @param ancestor Ancestor element\n * @param descendant Descendant element\n /\nexport function containsElement(ancestor: HTMLElement, descendant: Node): boolean {\n if (ancestor.contains(descendant) \|\| ancestor.shadowRoot?.contains(descendant)) {\n return true;\n }\n\n const checkRecursive = (node: Node): boolean => {\n if (node === descendant) {\n return true;\n }\n\n const shadowRoot = (node as HTMLElement).shadowRoot;\n if (!shadowRoot) {\n // Check light DOM children only\n return Array.from(node.childNodes).some(checkRecursive);\n }\n\n if (shadowRoot.contains(descendant)) {\n return true;\n }\n\n // Check slot assigned nodes\n const hasDescendantInAssignedNodes = Array.from(shadowRoot.querySelectorAll(\"slot\")).some((slot) =>\n (slot as HTMLSlotElement)\n .assignedNodes({flatten: true})\n .some((assigned) => (assigned as HTMLElement).contains?.(descendant) \|\| checkRecursive(assigned))\n );\n if (hasDescendantInAssignedNodes) {\n return true;\n }\n\n // Check shadow and light DOM children\n return Array.from(shadowRoot.children).some(checkRecursive) \|\| Array.from(node.childNodes).some(checkRecursive);\n };\n\n return checkRecursive(ancestor);\n}\n\n/* Get the parent of passed element, accounting for shadow DOM.\n * @param element The element whose parent is to be found.\n /\nexport function getParentElement(element: Element): Element \| null {\n // If the element is slotted, the direct rendered parent is the target slot in shadow DOM.\n if (element.assignedSlot) {\n return element.assignedSlot;\n }\n\n // If the element is in a shadow root, the parent is the shadow host.\n if (element.parentNode instanceof ShadowRoot) {\n return element.parentNode.host;\n }\n\n // Otherwise fall back to standard light DOM parent.\n return element.parentElement;\n}\n\n/\n Check if the `element` is visible within the `container` or in the viewport.\n * @param element The element to check.\n * @param container The container to check against, which must be the nearest scrollable ancestor.\n /\nexport function isElementVisibleInContainer(element: HTMLElement, container: HTMLElement): boolean {\n const elemRect = element.getBoundingClientRect();\n const documentWidth = element.ownerDocument.documentElement.clientWidth;\n const documentHeight = element.ownerDocument.documentElement.clientHeight;\n\n // Check if element is visible in viewport\n const isVisibleInViewport =\n elemRect.bottom > 0 && elemRect.top < documentHeight && elemRect.right > 0 && elemRect.left < documentWidth;\n\n // If container is the document element, only check viewport visibility\n if (container === element.ownerDocument.documentElement \|\| container === element.ownerDocument.body) {\n return isVisibleInViewport;\n }\n\n // For other containers, check both container and viewport visibility\n const containerRect = container.getBoundingClientRect();\n const isVisibleInContainer =\n elemRect.bottom > containerRect.top &&\n elemRect.top < containerRect.bottom &&\n elemRect.right > containerRect.left &&\n elemRect.left < containerRect.right;\n\n return isVisibleInContainer && isVisibleInViewport;\n}\n\n/\n Find the nearest containing block ancestor of an element.\n * The containing block is determined based on the element's `position` value:\n * - `static`, `sticky` or `relative`: nearest block container or root\n * - `absolute`: nearest ancestor with `position` != `static`\n * - `fixed`: nearest ancestor with properties that create a containing block (`transform`, `filter`, `will-change`, `backdrop-filter`, `perspective`, etc.).\n * An ancestor with these properties will create a containing block for fixed positioned elements, making them behave like absolute positioned elements relative to that ancestor.\n \n @link https://developer.mozilla.org/en-US/docs/Web/CSS/Guides/Display/Containing_block#identifying_the_containing_block\n * @param element The element for which to find the containing block\n * @returns The containing block element if any, or the `documentElement`\n */\nexport function findContainingBlockAncestor(element: HTMLElement): HTMLElement {\n let parent = getParentElement(element);\n const elementPosition = window.getComputedStyle(element).position;\n while (parent && parent !== element.ownerDocument.documentElement) {\n const parentStyle = window.getComputedStyle(parent);\n\n switch (elementPosition) {\n case \"fixed\": {\n const affectingProperties = [\n \"filter\",\n \"transform\",\n \"translate\",\n \"perspective\",\n \"scale\",\n \"rotate\",\n \"backdrop-filter\",\n ];\n if (\n affectingProperties.some((property) => parentStyle.getPropertyValue(property) !== \"none\") \|\|\n affectingProperties.some((property) => parentStyle.getPropertyValue(\"will-change\").includes(property))\n ) {\n return parent as HTMLElement;\n }\n break;\n }\n case \"absolute\":\n if (parentStyle.position !== \"static\") {\n return parent as HTMLElement;\n }\n break;\n // Handle position: static, relative, sticky (they all look for the nearest block container or root)\n case \"relative\":\n case \"sticky\":\n case \"static\": {\n const display = window.getComputedStyle(parent).display;\n\n // Block containers: block, flex, grid, table, flow-root\n if (\n display === \"block\" \|\|\n display === \"flex\" \|\|\n display === \"grid\" \|\|\n display === \"table\" \|\|\n display === \"flow-root\" \|\|\n display === \"inline-block\" \|\|\n display === \"inline-flex\" \|\|\n display === \"inline-grid\"\n ) {\n return parent as HTMLElement;\n }\n\n break;\n }\n }\n\n parent = getParentElement(parent);\n }\n\n return element.ownerDocument.documentElement;\n}\n"],"version":3}
1	+ {"file":"utils.js","mappings":"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","names":[],"sources":["src/utils/utils.ts"],"sourcesContent":["import {ChildNode} from \"@stencil/core\";\nimport {Device, KeyboardCode} from \"../beans/index\";\nimport {Breakpoints} from \"../constants/breakpoints\";\n\n/*\n Return boolean value for passed value if a boolean corresponding value is found\n * Return passed value otherwise\n /\nexport function boolean(value: string \| number \| boolean): boolean \| string \| number {\n switch (value) {\n case true:\n case \"true\":\n case 1:\n case \"1\":\n case \"on\":\n case \"yes\":\n return true;\n case false:\n case \"false\":\n case 0:\n case \"0\":\n case \"off\":\n case \"no\":\n return false;\n default:\n return value;\n }\n}\n\nexport function retrieveAsset(assetName: string): string {\n return assetName && \"assets/images/png/\" + assetName;\n}\n\nexport function randomId(): string {\n return Math.random().toString(36).replace(\"0.\", \"\");\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport function handleKeyboardSubmit(ev: KeyboardEvent, callback: (...args) => void, ...args: any[]): void {\n if (ev.code === KeyboardCode.ENTER \|\| ev.code === KeyboardCode.SPACE) {\n ev.preventDefault();\n callback(...args);\n }\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport function handleEnterKeydSubmit(ev: KeyboardEvent, callback: (...args) => void, ...args: any[]): void {\n if (ev.code === KeyboardCode.ENTER) {\n ev.preventDefault();\n callback(...args);\n }\n}\n\nexport function getClickedElement(elem: null \| Element = null): null \| Element {\n if (!elem) {\n elem = document.activeElement;\n }\n\n if (elem && elem.shadowRoot && elem.shadowRoot.activeElement) {\n elem = elem.shadowRoot.activeElement;\n\n return getClickedElement(elem);\n }\n\n return elem;\n}\n\nexport function getElementTree(elem: Element, tree: Element[] = []): null \| Element[] {\n tree.push(elem);\n\n if (elem.parentElement) {\n elem = elem.parentElement;\n\n return getElementTree(elem, tree);\n } else if (elem.parentNode && (elem.parentNode as ShadowRoot).host) {\n elem = (elem.parentNode as ShadowRoot).host;\n\n return getElementTree(elem, tree);\n }\n\n return tree;\n}\n\nexport function getSiblings(elem: HTMLElement): ChildNode[] {\n const siblings = [];\n if (!elem \|\| !elem.parentNode \|\| !elem.parentNode.childNodes) {\n return siblings;\n }\n\n elem.parentNode.childNodes.forEach((child) => {\n if (child.nodeType === 1 && child !== elem) {\n siblings.push(child);\n }\n });\n\n return siblings;\n}\n\n/\n Get the current device type based on the window width.\n * @returns {Device} - The current device type\n /\nexport function getDevice(): Device {\n switch (true) {\n case window.innerWidth <= Breakpoints.MOBILE:\n return Device.MOBILE;\n case window.innerWidth <= Breakpoints.TABLET:\n return Device.TABLET;\n case window.innerWidth <= Breakpoints.DESKTOP:\n return Device.DESKTOP;\n default:\n return Device.DESKTOP_WIDE;\n }\n}\n\ntype JSONValue = string \| number \| boolean \| JSONObject \| JSONArray;\ninterface JSONObject {\n [x: string]: JSONValue;\n}\ntype JSONArray = JSONValue[];\n\nexport function convertJson(data: string): JSONValue {\n try {\n return JSON.parse(data);\n } catch {\n return false;\n }\n}\n\nexport function colorFromId(id: number): string {\n const prefix = \"avatar-C\"; // prefix for color vars name\n const colorsCount = 19; // available colors\n const seed = Math.ceil(2 * 31 - 1) * parseFloat(`0.${id}`);\n let color = Math.ceil(colorsCount * (seed % 1));\n\n // if result of mc is 0\n // es.: 3895229\n if (color === 0) {\n color = 1;\n }\n\n return `${prefix}${color.toString().padStart(2, \"0\")}`;\n}\n\n/*\n Check if the passed CSS selector is valid.\n * @param selector CSS selector to validate\n /\nexport function isSelectorValid(selector: string): boolean {\n try {\n document.createDocumentFragment().querySelector(selector);\n\n return true;\n } catch {\n return false;\n }\n}\n\n/\n Check if an element contains another element, checking both light and shadow DOM recursively.\n * This function also checks slot assignments, so it correctly handles nested slots across components.\n * @param ancestor Ancestor element\n * @param descendant Descendant element\n /\nexport function containsElement(ancestor: HTMLElement, descendant: Node): boolean {\n if (ancestor.contains(descendant) \|\| ancestor.shadowRoot?.contains(descendant)) {\n return true;\n }\n\n const checkRecursive = (node: Node): boolean => {\n if (node === descendant) {\n return true;\n }\n\n const shadowRoot = (node as HTMLElement).shadowRoot;\n if (!shadowRoot) {\n // Check light DOM children only\n return Array.from(node.childNodes).some(checkRecursive);\n }\n\n if (shadowRoot.contains(descendant)) {\n return true;\n }\n\n // Check slot assigned nodes\n const hasDescendantInAssignedNodes = Array.from(shadowRoot.querySelectorAll(\"slot\")).some((slot) =>\n (slot as HTMLSlotElement)\n .assignedNodes({flatten: true})\n .some((assigned) => (assigned as HTMLElement).contains?.(descendant) \|\| checkRecursive(assigned))\n );\n if (hasDescendantInAssignedNodes) {\n return true;\n }\n\n // Check shadow and light DOM children\n return Array.from(shadowRoot.children).some(checkRecursive) \|\| Array.from(node.childNodes).some(checkRecursive);\n };\n\n return checkRecursive(ancestor);\n}\n\n/* Get the parent of passed element, accounting for shadow DOM.\n * @param element The element whose parent is to be found.\n /\nexport function getParentElement(element: Element): Element \| null {\n // If the element is slotted, the direct rendered parent is the target slot in shadow DOM.\n if (element.assignedSlot) {\n return element.assignedSlot;\n }\n\n // If the element is in a shadow root, the parent is the shadow host.\n if (element.parentNode instanceof ShadowRoot) {\n return element.parentNode.host;\n }\n\n // Otherwise fall back to standard light DOM parent.\n return element.parentElement;\n}\n\n/\n Check if the `element` is visible within the `container` or in the viewport.\n * @param element The element to check.\n * @param container The container to check against, which must be the nearest scrollable ancestor.\n /\nexport function isElementVisibleInContainer(element: HTMLElement, container: HTMLElement): boolean {\n const elemRect = element.getBoundingClientRect();\n const documentWidth = element.ownerDocument.documentElement.clientWidth;\n const documentHeight = element.ownerDocument.documentElement.clientHeight;\n\n // Check if element is visible in viewport\n const isVisibleInViewport =\n elemRect.bottom > 0 && elemRect.top < documentHeight && elemRect.right > 0 && elemRect.left < documentWidth;\n\n // If container is the document element, only check viewport visibility\n if (container === element.ownerDocument.documentElement \|\| container === element.ownerDocument.body) {\n return isVisibleInViewport;\n }\n\n // For other containers, check both container and viewport visibility\n const containerRect = container.getBoundingClientRect();\n const isVisibleInContainer =\n elemRect.bottom > containerRect.top &&\n elemRect.top < containerRect.bottom &&\n elemRect.right > containerRect.left &&\n elemRect.left < containerRect.right;\n\n return isVisibleInContainer && isVisibleInViewport;\n}\n\n/\n Find the nearest containing block ancestor of an element.\n * The containing block is determined based on the element's `position` value:\n * - `static`, `sticky` or `relative`: nearest block container or root\n * - `absolute`: nearest ancestor with `position` != `static`\n * - `fixed`: nearest ancestor with properties that create a containing block (`transform`, `filter`, `will-change`, `backdrop-filter`, `perspective`, etc.).\n * An ancestor with these properties will create a containing block for fixed positioned elements, making them behave like absolute positioned elements relative to that ancestor.\n \n @link https://developer.mozilla.org/en-US/docs/Web/CSS/Guides/Display/Containing_block#identifying_the_containing_block\n * @param element The element for which to find the containing block\n * @returns The containing block element if any, or the `documentElement`\n /\nexport function findContainingBlockAncestor(element: HTMLElement): HTMLElement {\n let parent = getParentElement(element);\n const elementPosition = window.getComputedStyle(element).position;\n while (parent && parent !== element.ownerDocument.documentElement) {\n const parentStyle = window.getComputedStyle(parent);\n\n switch (elementPosition) {\n case \"fixed\": {\n const affectingProperties = [\n \"filter\",\n \"transform\",\n \"translate\",\n \"perspective\",\n \"scale\",\n \"rotate\",\n \"backdrop-filter\",\n ];\n if (\n affectingProperties.some((property) => parentStyle.getPropertyValue(property) !== \"none\") \|\|\n affectingProperties.some((property) => parentStyle.getPropertyValue(\"will-change\").includes(property))\n ) {\n return parent as HTMLElement;\n }\n break;\n }\n case \"absolute\":\n if (parentStyle.position !== \"static\") {\n return parent as HTMLElement;\n }\n break;\n // Handle position: static, relative, sticky (they all look for the nearest block container or root)\n case \"relative\":\n case \"sticky\":\n case \"static\": {\n const display = window.getComputedStyle(parent).display;\n\n // Block containers: block, flex, grid, table, flow-root\n if (\n display === \"block\" \|\|\n display === \"flex\" \|\|\n display === \"grid\" \|\|\n display === \"table\" \|\|\n display === \"flow-root\" \|\|\n display === \"inline-block\" \|\|\n display === \"inline-flex\" \|\|\n display === \"inline-grid\"\n ) {\n return parent as HTMLElement;\n }\n\n break;\n }\n }\n\n parent = getParentElement(parent);\n }\n\n return element.ownerDocument.documentElement;\n}\n\n/* Convert HTML to plain text */\nexport const getPlainText = (html: string): string => {\n const doc = new DOMParser().parseFromString(html, \"text/html\");\n\n return doc.body.textContent \|\| \"\";\n};\n"],"version":3}

package/dist/components/z-book-card.js CHANGED Viewed

@@ -4,7 +4,7 @@ import { d as defineCustomElement$4 } from './index4.js';
 import { d as defineCustomElement$3 } from './index5.js';
 import { d as defineCustomElement$2 } from './index10.js';
-const stylesCss$1 = ":host{--z-book-card-portrait-cover-height:378px;--z-book-card-title-lines:2;--z-book-card-title-word-break:initial;--z-book-card-subtitle-lines:1;--z-book-card-subtitle-word-break:break-all;--z-book-card-authors-lines:1;--z-book-card-authors-word-break:break-all;display:flex;width:304px;box-sizing:border-box;flex-direction:column;border:solid var(--border-size-medium) var(--color-surface03);background-color:var(--color-surface01);border-radius:var(--border-radius);color:var(--color-default-text);font-family:var(--font-family-sans)}:host,*{box-sizing:border-box}.main-content{display:flex;height:100%;flex-direction:column;padding:var(--space-unit);gap:var(--space-unit)}.main-content .cover{position:relative;display:flex;overflow:hidden;align-items:flex-end;border-radius:var(--border-radius)}.main-content .cover z-book-cover{--z-book-cover-height:var(--z-book-card-portrait-cover-height)}.main-content a.cover:focus-visible{box-shadow:var(--shadow-focus-primary);outline:none}.main-content .card-info{display:flex;flex:1;flex-direction:column;justify-content:space-between;gap:var(--space-unit)}.main-content .card-info .top{display:flex;flex-direction:column;gap:calc(var(--space-unit) * 2)}.main-content .card-info .top ::slotted([slot=\"tags\"]){display:flex;flex-wrap:wrap;gap:var(--space-unit)}.main-content .card-info .top ::slotted([slot=\"data\"]){display:flex;justify-content:space-between}.main-content .card-info .top .ellipsis{display:-webkit-box;overflow:hidden;height:1.4rem;-webkit-box-orient:vertical;-webkit-line-clamp:1;line-clamp:1;line-height:1.4rem;text-overflow:ellipsis;word-break:break-all}.main-content .card-info .top .ellipsis.opera-title{height:auto;max-height:calc(1.5rem * var(--z-book-card-title-lines));-webkit-line-clamp:var(--z-book-card-title-lines);line-clamp:var(--z-book-card-title-lines);line-height:1.5rem;word-break:var(--z-book-card-title-word-break)}.main-content .card-info .top .ellipsis.volume-title{height:auto;max-height:calc(1.4rem * var(--z-book-card-subtitle-lines));-webkit-line-clamp:var(--z-book-card-subtitle-lines);line-clamp:var(--z-book-card-subtitle-lines);line-height:1.4rem;word-break:var(--z-book-card-subtitle-word-break)}.main-content .card-info .top .ellipsis.authors{height:auto;max-height:calc(1.4rem * var(--z-book-card-authors-lines));-webkit-line-clamp:var(--z-book-card-authors-lines);line-clamp:var(--z-book-card-authors-lines);line-height:1.4rem;word-break:var(--z-book-card-authors-word-break)}.main-content .card-info .top .opera-title *{all:unset}.main-content .cta-wrapper{display:flex;justify-content:space-between;gap:calc(var(--space-unit) / 2)}.main-content .card-info .top .link-chip-wrapper{display:flex;justify-content:space-between}.main-content .card-info .bottom .ebook{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;padding:var(--space-unit);background-color:var(--color-primary02);border-radius:var(--border-radius);gap:var(--space-unit)}.main-content .card-info .bottom .ebook .app-name{display:flex;align-items:center;padding:calc(var(--space-unit) / 2) 0;font-family:var(--font-family-serif);gap:calc(var(--space-unit) / 2)}.main-content .card-info .bottom .ebook .app-name .ebook-logo{width:1.5rem;height:1.5rem;content:url(\"data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 20 20%22 fill=%22none%22 aria-hidden=%22true%22%3E%3Cg clip-path=%22url(%23clip0_11996_224)%22%3E%3Cpath d=%22M14.6644 0.469604H5.00141C2.33305 0.469604 0.169922 2.63274 0.169922 5.3011V14.9641C0.169922 17.6324 2.33305 19.7956 5.00141 19.7956H14.6644C17.3328 19.7956 19.4959 17.6324 19.4959 14.9641V5.3011C19.4959 2.63274 17.3328 0.469604 14.6644 0.469604Z%22 fill=%22%23E2011A%22/%3E%3Cpath d=%22M15.9523 13.3536H12.7313C11.6861 13.3536 10.6683 13.6934 9.83241 14.3199C8.99657 13.6934 7.97873 13.3536 6.93352 13.3536H3.71252V5.30115H6.93352C7.97873 5.30115 8.99657 5.64096 9.83241 6.26745C10.6683 5.64096 11.6861 5.30115 12.7313 5.30115H15.9523V13.3536Z%22 fill=%22white%22/%3E%3Cpath d=%22M15.9523 14.3201H3.71252V14.9643H15.9523V14.3201Z%22 fill=%22black%22/%3E%3Cpath d=%22M8.22229 10.732V8.24543C8.22229 7.97165 8.51057 7.79449 8.75375 7.91689L11.2404 9.16019C11.5109 9.29548 11.5109 9.682 11.2404 9.81728L8.75375 11.0606C8.50896 11.183 8.22229 11.0058 8.22229 10.732Z%22 fill=%22black%22/%3E%3Cpath d=%22M4.35704 7.87826C5.42438 7.87826 6.28963 7.013 6.28963 5.94566C6.28963 4.87831 5.42438 4.01306 4.35704 4.01306C3.28969 4.01306 2.42444 4.87831 2.42444 5.94566C2.42444 7.013 3.28969 7.87826 4.35704 7.87826Z%22 fill=%22black%22/%3E%3Cpath d=%22M5.6454 5.62354H3.0686V6.26773H5.6454V5.62354Z%22 fill=%22white%22/%3E%3Cpath d=%22M4.67917 4.65723H4.03497V7.23402H4.67917V4.65723Z%22 fill=%22white%22/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id=%22clip0_11996_224%22%3E%3Crect width=%2219.326%22 height=%2219.326%22 fill=%22white%22 transform=%22translate(0.169922 0.469604)%22/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E\")}:host([variant=\"landscape\"]){width:637px;min-height:max(332px, 20.75rem);padding:0}:host([variant=\"landscape\"]) .main-content{min-height:max(332px, 20.75rem);flex-direction:row;padding:calc(var(--space-unit) * 2);gap:calc(var(--space-unit) * 2)}:host([variant=\"landscape\"]) .main-content .cover z-book-cover{--z-book-cover-height:300px}:host([variant=\"landscape\"]) .main-content .card-info,:host([variant=\"landscape\"]) .main-content .card-info .top{gap:calc(var(--space-unit) / 2)}@media (max-width: 767px){:host([variant=\"portrait\"]){width:100%;max-width:400px}}";
+const stylesCss$1 = ":host{--z-book-card-portrait-cover-height:378px;--z-book-card-title-lines:2;--z-book-card-title-word-break:initial;--z-book-card-subtitle-lines:1;--z-book-card-subtitle-word-break:break-all;--z-book-card-authors-lines:1;--z-book-card-authors-word-break:break-all;display:flex;width:304px;box-sizing:border-box;flex-direction:column;border:solid var(--border-size-medium) var(--color-surface03);background-color:var(--color-surface01);border-radius:var(--border-radius);color:var(--color-default-text);font-family:var(--font-family-sans)}:host,*{box-sizing:border-box}.main-content{display:flex;height:100%;flex-direction:column;padding:var(--space-unit);gap:var(--space-unit)}.main-content .cover{position:relative;display:flex;overflow:hidden;align-items:flex-end;justify-content:center;border-radius:var(--border-radius)}.main-content .cover z-book-cover{--z-book-cover-height:var(--z-book-card-portrait-cover-height)}.main-content a.cover:focus-visible{box-shadow:var(--shadow-focus-primary);outline:none}.main-content .card-info{display:flex;flex:1;flex-direction:column;justify-content:space-between;gap:var(--space-unit)}.main-content .card-info .top{display:flex;flex-direction:column;gap:calc(var(--space-unit) * 2)}.main-content .card-info .top ::slotted([slot=\"tags\"]){display:flex;flex-wrap:wrap;gap:var(--space-unit)}.main-content .card-info .top ::slotted([slot=\"data\"]){display:flex;justify-content:space-between}.main-content .card-info .top .ellipsis{display:-webkit-box;overflow:hidden;height:1.4rem;-webkit-box-orient:vertical;-webkit-line-clamp:1;line-clamp:1;line-height:1.4rem;text-overflow:ellipsis;word-break:break-all}.main-content .card-info .top .ellipsis.opera-title{height:auto;max-height:calc(1.5rem * var(--z-book-card-title-lines));-webkit-line-clamp:var(--z-book-card-title-lines);line-clamp:var(--z-book-card-title-lines);line-height:1.5rem;word-break:var(--z-book-card-title-word-break)}.main-content .card-info .top .ellipsis.volume-title{height:auto;max-height:calc(1.4rem * var(--z-book-card-subtitle-lines));-webkit-line-clamp:var(--z-book-card-subtitle-lines);line-clamp:var(--z-book-card-subtitle-lines);line-height:1.4rem;word-break:var(--z-book-card-subtitle-word-break)}.main-content .card-info .top .ellipsis.authors{height:auto;max-height:calc(1.4rem * var(--z-book-card-authors-lines));-webkit-line-clamp:var(--z-book-card-authors-lines);line-clamp:var(--z-book-card-authors-lines);line-height:1.4rem;word-break:var(--z-book-card-authors-word-break)}.main-content .card-info .top .opera-title *{all:unset}.main-content .cta-wrapper{display:flex;justify-content:space-between;gap:calc(var(--space-unit) / 2)}.main-content .card-info .top .link-chip-wrapper{display:flex;justify-content:space-between}.main-content .card-info .bottom .ebook{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;padding:var(--space-unit);background-color:var(--color-primary02);border-radius:var(--border-radius);gap:var(--space-unit)}.main-content .card-info .bottom .ebook .app-name{display:flex;align-items:center;padding:calc(var(--space-unit) / 2) 0;font-family:var(--font-family-serif);gap:calc(var(--space-unit) / 2)}.main-content .card-info .bottom .ebook .app-name .ebook-logo{width:1.5rem;height:1.5rem;content:url(\"data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 20 20%22 fill=%22none%22 aria-hidden=%22true%22%3E%3Cg clip-path=%22url(%23clip0_11996_224)%22%3E%3Cpath d=%22M14.6644 0.469604H5.00141C2.33305 0.469604 0.169922 2.63274 0.169922 5.3011V14.9641C0.169922 17.6324 2.33305 19.7956 5.00141 19.7956H14.6644C17.3328 19.7956 19.4959 17.6324 19.4959 14.9641V5.3011C19.4959 2.63274 17.3328 0.469604 14.6644 0.469604Z%22 fill=%22%23E2011A%22/%3E%3Cpath d=%22M15.9523 13.3536H12.7313C11.6861 13.3536 10.6683 13.6934 9.83241 14.3199C8.99657 13.6934 7.97873 13.3536 6.93352 13.3536H3.71252V5.30115H6.93352C7.97873 5.30115 8.99657 5.64096 9.83241 6.26745C10.6683 5.64096 11.6861 5.30115 12.7313 5.30115H15.9523V13.3536Z%22 fill=%22white%22/%3E%3Cpath d=%22M15.9523 14.3201H3.71252V14.9643H15.9523V14.3201Z%22 fill=%22black%22/%3E%3Cpath d=%22M8.22229 10.732V8.24543C8.22229 7.97165 8.51057 7.79449 8.75375 7.91689L11.2404 9.16019C11.5109 9.29548 11.5109 9.682 11.2404 9.81728L8.75375 11.0606C8.50896 11.183 8.22229 11.0058 8.22229 10.732Z%22 fill=%22black%22/%3E%3Cpath d=%22M4.35704 7.87826C5.42438 7.87826 6.28963 7.013 6.28963 5.94566C6.28963 4.87831 5.42438 4.01306 4.35704 4.01306C3.28969 4.01306 2.42444 4.87831 2.42444 5.94566C2.42444 7.013 3.28969 7.87826 4.35704 7.87826Z%22 fill=%22black%22/%3E%3Cpath d=%22M5.6454 5.62354H3.0686V6.26773H5.6454V5.62354Z%22 fill=%22white%22/%3E%3Cpath d=%22M4.67917 4.65723H4.03497V7.23402H4.67917V4.65723Z%22 fill=%22white%22/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id=%22clip0_11996_224%22%3E%3Crect width=%2219.326%22 height=%2219.326%22 fill=%22white%22 transform=%22translate(0.169922 0.469604)%22/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E\")}:host([variant=\"landscape\"]){width:635px;min-height:max(332px, 20.75rem);padding:0}:host([variant=\"landscape\"]) .main-content{min-height:max(332px, 20.75rem);flex-direction:row;padding:calc(var(--space-unit) * 2);gap:calc(var(--space-unit) * 2)}:host([variant=\"landscape\"]) .main-content .cover z-book-cover{--z-book-cover-height:300px}:host([variant=\"landscape\"]) .main-content .card-info,:host([variant=\"landscape\"]) .main-content .card-info .top{gap:calc(var(--space-unit) / 2)}@media (max-width: 767px){:host([variant=\"portrait\"]){width:100%;max-width:400px}}";
 const ZBookCardStyle0 = stylesCss$1;
 const typographyCss = ":root{--font-family-sans:\"IBM Plex Sans\", sans-serif;--font-family-serif:\"IBM Plex Serif\", serif;--font-lt:300;--font-rg:400;--font-sb:600;--font-bd:700;--font-size-1:0.75rem;--font-size-2:0.875rem;--font-size-3:1rem;--font-size-4:1.125rem;--font-size-5:1.25rem;--font-size-6:1.5rem;--font-size-7:1.75rem;--font-size-8:2rem;--font-size-9:2.25rem;--font-size-10:2.625rem;--font-size-11:3rem;--font-size-12:3.375rem;--font-size-13:3.75rem;--font-size-14:4.25rem;--font-size-15:4.75rem;--font-size-16:5.25rem;--font-size-17:5.75rem;--section-title-1:var(--font-sb) var(--font-size-11) / 1.083 var(--font-family-serif);--section-title-2:var(--font-sb) var(--font-size-10) / 1.142 var(--font-family-serif);--section-title-3:var(--font-sb) var(--font-size-9) / 1.222 var(--font-family-serif);--section-title-4:var(--font-sb) var(--font-size-8) / 1.25 var(--font-family-serif);--section-title-5:var(--font-sb) var(--font-size-7) / 1.2857 var(--font-family-serif);--section-title-6:var(--font-sb) var(--font-size-6) / 1.333 var(--font-family-serif)}.heading-1,.heading-1-sb,.heading-1-lt{font-size:var(--font-size-7);font-weight:var(--font-rg);line-height:1.28}.heading-2,.heading-2-sb,.heading-2-lt{font-size:var(--font-size-6);font-weight:var(--font-rg);line-height:1.333}.heading-3,.heading-3-sb,.heading-3-lt{font-size:var(--font-size-6);font-weight:var(--font-rg);line-height:1.333}.heading-4,.heading-4-sb,.heading-4-lt{font-size:var(--font-size-5);font-weight:var(--font-rg);line-height:1.4}.body-1,.body-1-sb{font-size:var(--font-size-5);font-weight:var(--font-rg);line-height:1.4}.body-2,.body-2-sb{font-size:var(--font-size-4);font-weight:var(--font-rg);line-height:1.5}.body-3,.body-3-sb{font-size:var(--font-size-3);font-weight:var(--font-rg);line-height:1.5}.body-4,.body-4-sb{font-size:var(--font-size-2);font-weight:var(--font-rg);letter-spacing:0.16px;line-height:1.4}.body-5,.body-5-sb{font-size:var(--font-size-1);font-weight:var(--font-rg);letter-spacing:0.32px;line-height:1.333}.interactive-1,.interactive-1-sb{font-size:var(--font-size-3);font-weight:var(--font-rg);line-height:1.5}.interactive-2,.interactive-2-sb{font-size:var(--font-size-2);font-weight:var(--font-rg);letter-spacing:0.16px;line-height:1.4}.interactive-3,.interactive-3-sb{font-size:var(--font-size-1);font-weight:var(--font-rg);letter-spacing:0.32px;line-height:1.333}.helper,.helper-sb{font-size:var(--font-size-1);font-style:italic;font-weight:var(--font-rg);letter-spacing:0.32px;line-height:1.333}.section-title-1{font:var(--section-title-1)}.section-title-2{font:var(--section-title-2)}.section-title-3{font:var(--section-title-3)}.section-title-4{font:var(--section-title-4)}.section-title-5{font:var(--section-title-5)}.section-title-6{font:var(--section-title-6)}@media (min-width: 1152px){.heading-1,.heading-1-sb,.heading-1-lt{font-size:var(--font-size-8);font-weight:var(--font-rg);line-height:1.25}.heading-2,.heading-2-sb,.heading-2-lt{font-size:var(--font-size-7);font-weight:var(--font-rg);line-height:1.28}}@media (max-width: 767px){.mobile-heading-1,.mobile-heading-1-sb,.mobile-heading-1-lt{font-size:var(--font-size-7);font-weight:var(--font-rg);line-height:1.28}.mobile-heading-2,.mobile-heading-2-sb,.mobile-heading-2-lt{font-size:var(--font-size-6);font-weight:var(--font-rg);line-height:1.333}.mobile-heading-3,.mobile-heading-3-sb,.mobile-heading-3-lt{font-size:var(--font-size-6);font-weight:var(--font-rg);line-height:1.333}.mobile-heading-4,.mobile-heading-4-sb,.mobile-heading-4-lt{font-size:var(--font-size-5);font-weight:var(--font-rg);line-height:1.4}.mobile-body-1,.mobile-body-1-sb{font-size:var(--font-size-5);font-weight:var(--font-rg);line-height:1.4}.mobile-body-2,.mobile-body-2-sb{font-size:var(--font-size-4);font-weight:var(--font-rg);line-height:1.5}.mobile-body-3,.mobile-body-3-sb{font-size:var(--font-size-3);font-weight:var(--font-rg);line-height:1.5}.mobile-body-4,.mobile-body-4-sb{font-size:var(--font-size-2);font-weight:var(--font-rg);letter-spacing:0.16px;line-height:1.4}.mobile-body-5,.mobile-body-5-sb{font-size:var(--font-size-1);font-weight:var(--font-rg);letter-spacing:0.32px;line-height:1.333}.mobile-interactive-1,.mobile-interactive-1-sb{font-size:var(--font-size-3);font-weight:var(--font-rg);line-height:1.5}.mobile-interactive-2,.mobile-interactive-2-sb{font-size:var(--font-size-2);font-weight:var(--font-rg);letter-spacing:0.16px;line-height:1.4}.mobile-interactive-3,.mobile-interactive-3-sb{font-size:var(--font-size-1);font-weight:var(--font-rg);letter-spacing:0.32px;line-height:1.333}.mobile-section-title-1{font:var(--section-title-1)}.mobile-section-title-2{font:var(--section-title-2)}.mobile-section-title-3{font:var(--section-title-3)}.mobile-section-title-4{font:var(--section-title-4)}.mobile-section-title-5{font:var(--section-title-5)}.mobile-section-title-6{font:var(--section-title-6)}.mobile-heading-1-lt,.mobile-heading-2-lt,.mobile-heading-3-lt,.mobile-heading-4-lt{font-weight:var(--font-lt)}.mobile-heading-1-sb,.mobile-heading-2-sb,.mobile-heading-3-sb,.mobile-heading-4-sb,.mobile-body-1-sb,.mobile-body-2-sb,.mobile-body-3-sb,.mobile-body-4-sb,.mobile-body-5-sb,.mobile-interactive-1-sb,.mobile-interactive-2-sb,.mobile-interactive-3-sb{font-weight:var(--font-sb)}}@media (min-width: 768px) and (max-width: 1151px){.tablet-heading-1,.tablet-heading-1-sb,.tablet-heading-1-lt{font-size:var(--font-size-7);font-weight:var(--font-rg);line-height:1.28}.tablet-heading-2,.tablet-heading-2-sb,.tablet-heading-2-lt{font-size:var(--font-size-6);font-weight:var(--font-rg);line-height:1.333}.tablet-heading-3,.tablet-heading-3-sb,.tablet-heading-3-lt{font-size:var(--font-size-6);font-weight:var(--font-rg);line-height:1.333}.tablet-heading-4,.tablet-heading-4-sb,.tablet-heading-4-lt{font-size:var(--font-size-5);font-weight:var(--font-rg);line-height:1.4}.tablet-body-1,.tablet-body-1-sb{font-size:var(--font-size-5);font-weight:var(--font-rg);line-height:1.4}.tablet-body-2,.tablet-body-2-sb{font-size:var(--font-size-4);font-weight:var(--font-rg);line-height:1.5}.tablet-body-3,.tablet-body-3-sb{font-size:var(--font-size-3);font-weight:var(--font-rg);line-height:1.5}.tablet-body-4,.tablet-body-4-sb{font-size:var(--font-size-2);font-weight:var(--font-rg);letter-spacing:0.16px;line-height:1.4}.tablet-body-5,.tablet-body-5-sb{font-size:var(--font-size-1);font-weight:var(--font-rg);letter-spacing:0.32px;line-height:1.333}.tablet-interactive-1,.tablet-interactive-1-sb{font-size:var(--font-size-3);font-weight:var(--font-rg);line-height:1.5}.tablet-interactive-2,.tablet-interactive-2-sb{font-size:var(--font-size-2);font-weight:var(--font-rg);letter-spacing:0.16px;line-height:1.4}.tablet-interactive-3,.tablet-interactive-3-sb{font-size:var(--font-size-1);font-weight:var(--font-rg);letter-spacing:0.32px;line-height:1.333}.tablet-section-title-1{font:var(--section-title-1)}.tablet-section-title-2{font:var(--section-title-2)}.tablet-section-title-3{font:var(--section-title-3)}.tablet-section-title-4{font:var(--section-title-4)}.tablet-section-title-5{font:var(--section-title-5)}.tablet-section-title-6{font:var(--section-title-6)}.tablet-heading-1-lt,.tablet-heading-2-lt,.tablet-heading-3-lt,.tablet-heading-4-lt{font-weight:var(--font-lt)}.tablet-heading-1-sb,.tablet-heading-2-sb,.tablet-heading-3-sb,.tablet-heading-4-sb,.tablet-body-1-sb,.tablet-body-2-sb,.tablet-body-3-sb,.tablet-body-4-sb,.tablet-body-5-sb,.tablet-interactive-1-sb,.tablet-interactive-2-sb,.tablet-interactive-3-sb{font-weight:var(--font-sb)}}@media (min-width: 1152px) and (max-width: 1365px){.desktop-heading-1,.desktop-heading-1-sb,.desktop-heading-1-lt{font-size:var(--font-size-8);font-weight:var(--font-rg);line-height:1.25}.desktop-heading-2,.desktop-heading-2-sb,.desktop-heading-2-lt{font-size:var(--font-size-7);font-weight:var(--font-rg);line-height:1.28}.desktop-heading-3,.desktop-heading-3-sb,.desktop-heading-3-lt{font-size:var(--font-size-6);font-weight:var(--font-rg);line-height:1.333}.desktop-heading-4,.desktop-heading-4-sb,.desktop-heading-4-lt{font-size:var(--font-size-5);font-weight:var(--font-rg);line-height:1.4}.desktop-body-1,.desktop-body-1-sb{font-size:var(--font-size-5);font-weight:var(--font-rg);line-height:1.4}.desktop-body-2,.desktop-body-2-sb{font-size:var(--font-size-4);font-weight:var(--font-rg);line-height:1.5}.desktop-body-3,.desktop-body-3-sb{font-size:var(--font-size-3);font-weight:var(--font-rg);line-height:1.5}.desktop-body-4,.desktop-body-4-sb{font-size:var(--font-size-2);font-weight:var(--font-rg);letter-spacing:0.16px;line-height:1.4}.desktop-body-5,.desktop-body-5-sb{font-size:var(--font-size-1);font-weight:var(--font-rg);letter-spacing:0.32px;line-height:1.333}.desktop-interactive-1,.desktop-interactive-1-sb{font-size:var(--font-size-3);font-weight:var(--font-rg);line-height:1.5}.desktop-interactive-2,.desktop-interactive-2-sb{font-size:var(--font-size-2);font-weight:var(--font-rg);letter-spacing:0.16px;line-height:1.4}.desktop-interactive-3,.desktop-interactive-3-sb{font-size:var(--font-size-1);font-weight:var(--font-rg);letter-spacing:0.32px;line-height:1.333}.desktop-section-title-1{font:var(--section-title-1)}.desktop-section-title-2{font:var(--section-title-2)}.desktop-section-title-3{font:var(--section-title-3)}.desktop-section-title-4{font:var(--section-title-4)}.desktop-section-title-5{font:var(--section-title-5)}.desktop-section-title-6{font:var(--section-title-6)}.desktop-heading-1-lt,.desktop-heading-2-lt,.desktop-heading-3-lt,.desktop-heading-4-lt{font-weight:var(--font-lt)}.desktop-heading-1-sb,.desktop-heading-2-sb,.desktop-heading-3-sb,.desktop-heading-4-sb,.desktop-body-1-sb,.desktop-body-2-sb,.desktop-body-3-sb,.desktop-body-4-sb,.desktop-body-5-sb,.desktop-interactive-1-sb,.desktop-interactive-2-sb,.desktop-interactive-3-sb{font-weight:var(--font-sb)}}@media (min-width: 1366px){.wide-heading-1,.wide-heading-1-sb,.wide-heading-1-lt{font-size:var(--font-size-8);font-weight:var(--font-rg);line-height:1.25}.wide-heading-2,.wide-heading-2-sb,.wide-heading-2-lt{font-size:var(--font-size-7);font-weight:var(--font-rg);line-height:1.28}.wide-heading-3,.wide-heading-3-sb,.wide-heading-3-lt{font-size:var(--font-size-6);font-weight:var(--font-rg);line-height:1.333}.wide-heading-4,.wide-heading-4-sb,.wide-heading-4-lt{font-size:var(--font-size-5);font-weight:var(--font-rg);line-height:1.4}.wide-body-1,.wide-body-1-sb{font-size:var(--font-size-5);font-weight:var(--font-rg);line-height:1.4}.wide-body-2,.wide-body-2-sb{font-size:var(--font-size-4);font-weight:var(--font-rg);line-height:1.5}.wide-body-3,.wide-body-3-sb{font-size:var(--font-size-3);font-weight:var(--font-rg);line-height:1.5}.wide-body-4,.wide-body-4-sb{font-size:var(--font-size-2);font-weight:var(--font-rg);letter-spacing:0.16px;line-height:1.4}.wide-body-5,.wide-body-5-sb{font-size:var(--font-size-1);font-weight:var(--font-rg);letter-spacing:0.32px;line-height:1.333}.wide-interactive-1,.wide-interactive-1-sb{font-size:var(--font-size-3);font-weight:var(--font-rg);line-height:1.5}.wide-interactive-2,.wide-interactive-2-sb{font-size:var(--font-size-2);font-weight:var(--font-rg);letter-spacing:0.16px;line-height:1.4}.wide-interactive-3,.wide-interactive-3-sb{font-size:var(--font-size-1);font-weight:var(--font-rg);letter-spacing:0.32px;line-height:1.333}.wide-section-title-1{font:var(--section-title-1)}.wide-section-title-2{font:var(--section-title-2)}.wide-section-title-3{font:var(--section-title-3)}.wide-section-title-4{font:var(--section-title-4)}.wide-section-title-5{font:var(--section-title-5)}.wide-section-title-6{font:var(--section-title-6)}.wide-heading-1-lt,.wide-heading-2-lt,.wide-heading-3-lt,.wide-heading-4-lt{font-weight:var(--font-lt)}.wide-heading-1-sb,.wide-heading-2-sb,.wide-heading-3-sb,.wide-heading-4-sb,.wide-body-1-sb,.wide-body-2-sb,.wide-body-3-sb,.wide-body-4-sb,.wide-body-5-sb,.wide-interactive-1-sb,.wide-interactive-2-sb,.wide-interactive-3-sb{font-weight:var(--font-sb)}}.heading-1-lt,.heading-2-lt,.heading-3-lt,.heading-4-lt{font-weight:var(--font-lt)}.heading-1-sb,.heading-2-sb,.heading-3-sb,.heading-4-sb,.body-1-sb,.body-2-sb,.body-3-sb,.body-4-sb,.body-5-sb,.interactive-1-sb,.interactive-2-sb,.interactive-3-sb,.helper-sb{font-weight:var(--font-sb)}";

package/dist/components/z-book-card.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"z-book-card.js","mappings":"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","names":["stylesCss","ZBookCard"],"sources":["src/components/book-card/z-book-card/styles.css?tag=z-book-card&encapsulation=shadow","src/tokens/typography.css?tag=z-book-card&encapsulation=shadow","src/components/css-components/z-link/styles.css?tag=z-book-card&encapsulation=shadow","src/components/book-card/z-book-card/index.tsx"],"sourcesContent":[":host {\n --z-book-card-portrait-cover-height: 378px;\n --z-book-card-title-lines: 2;\n --z-book-card-title-word-break: initial;\n --z-book-card-subtitle-lines: 1;\n --z-book-card-subtitle-word-break: break-all;\n --z-book-card-authors-lines: 1;\n --z-book-card-authors-word-break: break-all;\n\n display: flex;\n width: 304px;\n box-sizing: border-box;\n flex-direction: column;\n border: solid var(--border-size-medium) var(--color-surface03);\n background-color: var(--color-surface01);\n border-radius: var(--border-radius);\n color: var(--color-default-text);\n font-family: var(--font-family-sans);\n}\n\n:host,\n* {\n box-sizing: border-box;\n}\n\n.main-content {\n display: flex;\n height: 100%;\n flex-direction: column;\n padding: var(--space-unit);\n gap: var(--space-unit);\n}\n\n.main-content .cover {\n position: relative;\n display: flex;\n overflow: hidden;\n align-items: flex-end;\n border-radius: var(--border-radius);\n}\n\n.main-content .cover z-book-cover {\n --z-book-cover-height: var(--z-book-card-portrait-cover-height);\n}\n\n.main-content a.cover:focus-visible {\n box-shadow: var(--shadow-focus-primary);\n outline: none;\n}\n\n.main-content .card-info {\n display: flex;\n flex: 1;\n flex-direction: column;\n justify-content: space-between;\n gap: var(--space-unit);\n}\n\n.main-content .card-info .top {\n display: flex;\n flex-direction: column;\n gap: calc(var(--space-unit) * 2);\n}\n\n.main-content .card-info .top ::slotted([slot=\"tags\"]) {\n display: flex;\n flex-wrap: wrap;\n gap: var(--space-unit);\n}\n\n.main-content .card-info .top ::slotted([slot=\"data\"]) {\n display: flex;\n justify-content: space-between;\n}\n\n.main-content .card-info .top .ellipsis {\n display: -webkit-box;\n overflow: hidden;\n height: 1.4rem;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 1;\n line-clamp: 1;\n line-height: 1.4rem;\n text-overflow: ellipsis;\n word-break: break-all;\n}\n\n.main-content .card-info .top .ellipsis.opera-title {\n height: auto;\n max-height: calc(1.5rem * var(--z-book-card-title-lines));\n -webkit-line-clamp: var(--z-book-card-title-lines);\n line-clamp: var(--z-book-card-title-lines);\n line-height: 1.5rem;\n word-break: var(--z-book-card-title-word-break);\n}\n\n.main-content .card-info .top .ellipsis.volume-title {\n height: auto;\n max-height: calc(1.4rem * var(--z-book-card-subtitle-lines));\n -webkit-line-clamp: var(--z-book-card-subtitle-lines);\n line-clamp: var(--z-book-card-subtitle-lines);\n line-height: 1.4rem;\n word-break: var(--z-book-card-subtitle-word-break);\n}\n\n.main-content .card-info .top .ellipsis.authors {\n height: auto;\n max-height: calc(1.4rem * var(--z-book-card-authors-lines));\n -webkit-line-clamp: var(--z-book-card-authors-lines);\n line-clamp: var(--z-book-card-authors-lines);\n line-height: 1.4rem;\n word-break: var(--z-book-card-authors-word-break);\n}\n\n.main-content .card-info .top .opera-title * {\n all: unset;\n}\n\n.main-content .cta-wrapper {\n display: flex;\n justify-content: space-between;\n gap: calc(var(--space-unit) / 2);\n}\n\n.main-content .card-info .top .link-chip-wrapper {\n display: flex;\n justify-content: space-between;\n}\n\n.main-content .card-info .bottom .ebook {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n justify-content: space-between;\n padding: var(--space-unit);\n background-color: var(--color-primary02);\n border-radius: var(--border-radius);\n gap: var(--space-unit);\n}\n\n.main-content .card-info .bottom .ebook .app-name {\n display: flex;\n align-items: center;\n padding: calc(var(--space-unit) / 2) 0;\n font-family: var(--font-family-serif);\n gap: calc(var(--space-unit) / 2);\n}\n\n.main-content .card-info .bottom .ebook .app-name .ebook-logo {\n width: 1.5rem;\n height: 1.5rem;\n content: url(\"data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 20 20%22 fill=%22none%22 aria-hidden=%22true%22%3E%3Cg clip-path=%22url(%23clip0_11996_224)%22%3E%3Cpath d=%22M14.6644 0.469604H5.00141C2.33305 0.469604 0.169922 2.63274 0.169922 5.3011V14.9641C0.169922 17.6324 2.33305 19.7956 5.00141 19.7956H14.6644C17.3328 19.7956 19.4959 17.6324 19.4959 14.9641V5.3011C19.4959 2.63274 17.3328 0.469604 14.6644 0.469604Z%22 fill=%22%23E2011A%22/%3E%3Cpath d=%22M15.9523 13.3536H12.7313C11.6861 13.3536 10.6683 13.6934 9.83241 14.3199C8.99657 13.6934 7.97873 13.3536 6.93352 13.3536H3.71252V5.30115H6.93352C7.97873 5.30115 8.99657 5.64096 9.83241 6.26745C10.6683 5.64096 11.6861 5.30115 12.7313 5.30115H15.9523V13.3536Z%22 fill=%22white%22/%3E%3Cpath d=%22M15.9523 14.3201H3.71252V14.9643H15.9523V14.3201Z%22 fill=%22black%22/%3E%3Cpath d=%22M8.22229 10.732V8.24543C8.22229 7.97165 8.51057 7.79449 8.75375 7.91689L11.2404 9.16019C11.5109 9.29548 11.5109 9.682 11.2404 9.81728L8.75375 11.0606C8.50896 11.183 8.22229 11.0058 8.22229 10.732Z%22 fill=%22black%22/%3E%3Cpath d=%22M4.35704 7.87826C5.42438 7.87826 6.28963 7.013 6.28963 5.94566C6.28963 4.87831 5.42438 4.01306 4.35704 4.01306C3.28969 4.01306 2.42444 4.87831 2.42444 5.94566C2.42444 7.013 3.28969 7.87826 4.35704 7.87826Z%22 fill=%22black%22/%3E%3Cpath d=%22M5.6454 5.62354H3.0686V6.26773H5.6454V5.62354Z%22 fill=%22white%22/%3E%3Cpath d=%22M4.67917 4.65723H4.03497V7.23402H4.67917V4.65723Z%22 fill=%22white%22/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id=%22clip0_11996_224%22%3E%3Crect width=%2219.326%22 height=%2219.326%22 fill=%22white%22 transform=%22translate(0.169922 0.469604)%22/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E\");\n}\n\n:host([variant=\"landscape\"]) {\n width: 637px;\n min-height: max(332px, 20.75rem);\n padding: 0;\n}\n\n:host([variant=\"landscape\"]) .main-content {\n min-height: max(332px, 20.75rem);\n flex-direction: row;\n padding: calc(var(--space-unit) * 2);\n gap: calc(var(--space-unit) * 2);\n}\n\n:host([variant=\"landscape\"]) .main-content .cover z-book-cover {\n --z-book-cover-height: 300px;\n}\n\n:host([variant=\"landscape\"]) .main-content .card-info,\n:host([variant=\"landscape\"]) .main-content .card-info .top {\n gap: calc(var(--space-unit) / 2);\n}\n\n@media (max-width: 767px) {\n :host([variant=\"portrait\"]) {\n width: 100%;\n max-width: 400px;\n }\n}\n",":root {\n /* font-family /\n --font-family-sans: \"IBM Plex Sans\", sans-serif;\n --font-family-serif: \"IBM Plex Serif\", serif;\n\n / font-weight /\n --font-lt: 300;\n --font-rg: 400;\n --font-sb: 600;\n --font-bd: 700;\n\n / font-size type scale /\n --font-size-1: 0.75rem; / 12px /\n --font-size-2: 0.875rem; / 14px /\n --font-size-3: 1rem; / assuming 16px /\n --font-size-4: 1.125rem; / 18px /\n --font-size-5: 1.25rem; / 20px /\n --font-size-6: 1.5rem; / 24px /\n --font-size-7: 1.75rem; / 28px /\n --font-size-8: 2rem; / 32px /\n --font-size-9: 2.25rem; / 36px /\n --font-size-10: 2.625rem; / 42px /\n --font-size-11: 3rem; / 48px /\n --font-size-12: 3.375rem; / 54px /\n --font-size-13: 3.75rem; / 60px /\n --font-size-14: 4.25rem; / 68px /\n --font-size-15: 4.75rem; / 76px /\n --font-size-16: 5.25rem; / 84px /\n --font-size-17: 5.75rem; / 92px /\n\n / cssprops to use with `font` shorthand property /\n --section-title-1: var(--font-sb) var(--font-size-11) / 1.083 var(--font-family-serif);\n --section-title-2: var(--font-sb) var(--font-size-10) / 1.142 var(--font-family-serif);\n --section-title-3: var(--font-sb) var(--font-size-9) / 1.222 var(--font-family-serif);\n --section-title-4: var(--font-sb) var(--font-size-8) / 1.25 var(--font-family-serif);\n --section-title-5: var(--font-sb) var(--font-size-7) / 1.2857 var(--font-family-serif);\n --section-title-6: var(--font-sb) var(--font-size-6) / 1.333 var(--font-family-serif);\n}\n\n/ Typography classes /\n.heading-1,\n.heading-1-sb,\n.heading-1-lt {\n font-size: var(--font-size-7);\n font-weight: var(--font-rg);\n line-height: 1.28;\n}\n\n.heading-2,\n.heading-2-sb,\n.heading-2-lt {\n font-size: var(--font-size-6);\n font-weight: var(--font-rg);\n line-height: 1.333;\n}\n\n.heading-3,\n.heading-3-sb,\n.heading-3-lt {\n font-size: var(--font-size-6);\n font-weight: var(--font-rg);\n line-height: 1.333;\n}\n\n.heading-4,\n.heading-4-sb,\n.heading-4-lt {\n font-size: var(--font-size-5);\n font-weight: var(--font-rg);\n line-height: 1.4;\n}\n\n.body-1,\n.body-1-sb {\n font-size: var(--font-size-5);\n font-weight: var(--font-rg);\n line-height: 1.4;\n}\n\n.body-2,\n.body-2-sb {\n font-size: var(--font-size-4);\n font-weight: var(--font-rg);\n line-height: 1.5;\n}\n\n.body-3,\n.body-3-sb {\n font-size: var(--font-size-3);\n font-weight: var(--font-rg);\n line-height: 1.5;\n}\n\n.body-4,\n.body-4-sb {\n font-size: var(--font-size-2);\n font-weight: var(--font-rg);\n letter-spacing: 0.16px;\n line-height: 1.4;\n}\n\n.body-5,\n.body-5-sb {\n font-size: var(--font-size-1);\n font-weight: var(--font-rg);\n letter-spacing: 0.32px;\n line-height: 1.333;\n}\n\n.interactive-1,\n.interactive-1-sb {\n font-size: var(--font-size-3);\n font-weight: var(--font-rg);\n line-height: 1.5;\n}\n\n.interactive-2,\n.interactive-2-sb {\n font-size: var(--font-size-2);\n font-weight: var(--font-rg);\n letter-spacing: 0.16px;\n line-height: 1.4;\n}\n\n.interactive-3,\n.interactive-3-sb {\n font-size: var(--font-size-1);\n font-weight: var(--font-rg);\n letter-spacing: 0.32px;\n line-height: 1.333;\n}\n\n.helper,\n.helper-sb {\n font-size: var(--font-size-1);\n font-style: italic;\n font-weight: var(--font-rg);\n letter-spacing: 0.32px;\n line-height: 1.333;\n}\n\n/ section title /\n.section-title-1 {\n font: var(--section-title-1);\n}\n\n.section-title-2 {\n font: var(--section-title-2);\n}\n\n.section-title-3 {\n font: var(--section-title-3);\n}\n\n.section-title-4 {\n font: var(--section-title-4);\n}\n\n.section-title-5 {\n font: var(--section-title-5);\n}\n\n.section-title-6 {\n font: var(--section-title-6);\n}\n\n/ heading-1/2 for desktop and wide viewports /\n@media (min-width: 1152px) {\n .heading-1,\n .heading-1-sb,\n .heading-1-lt {\n font-size: var(--font-size-8);\n font-weight: var(--font-rg);\n line-height: 1.25;\n }\n\n .heading-2,\n .heading-2-sb,\n .heading-2-lt {\n font-size: var(--font-size-7);\n font-weight: var(--font-rg);\n line-height: 1.28;\n }\n}\n\n/ viewport classes /\n@media (max-width: 767px) {\n .mobile-heading-1,\n .mobile-heading-1-sb,\n .mobile-heading-1-lt {\n font-size: var(--font-size-7);\n font-weight: var(--font-rg);\n line-height: 1.28;\n }\n\n .mobile-heading-2,\n .mobile-heading-2-sb,\n .mobile-heading-2-lt {\n font-size: var(--font-size-6);\n font-weight: var(--font-rg);\n line-height: 1.333;\n }\n\n .mobile-heading-3,\n .mobile-heading-3-sb,\n .mobile-heading-3-lt {\n font-size: var(--font-size-6);\n font-weight: var(--font-rg);\n line-height: 1.333;\n }\n\n .mobile-heading-4,\n .mobile-heading-4-sb,\n .mobile-heading-4-lt {\n font-size: var(--font-size-5);\n font-weight: var(--font-rg);\n line-height: 1.4;\n }\n\n .mobile-body-1,\n .mobile-body-1-sb {\n font-size: var(--font-size-5);\n font-weight: var(--font-rg);\n line-height: 1.4;\n }\n\n .mobile-body-2,\n .mobile-body-2-sb {\n font-size: var(--font-size-4);\n font-weight: var(--font-rg);\n line-height: 1.5;\n }\n\n .mobile-body-3,\n .mobile-body-3-sb {\n font-size: var(--font-size-3);\n font-weight: var(--font-rg);\n line-height: 1.5;\n }\n\n .mobile-body-4,\n .mobile-body-4-sb {\n font-size: var(--font-size-2);\n font-weight: var(--font-rg);\n letter-spacing: 0.16px;\n line-height: 1.4;\n }\n\n .mobile-body-5,\n .mobile-body-5-sb {\n font-size: var(--font-size-1);\n font-weight: var(--font-rg);\n letter-spacing: 0.32px;\n line-height: 1.333;\n }\n\n .mobile-interactive-1,\n .mobile-interactive-1-sb {\n font-size: var(--font-size-3);\n font-weight: var(--font-rg);\n line-height: 1.5;\n }\n\n .mobile-interactive-2,\n .mobile-interactive-2-sb {\n font-size: var(--font-size-2);\n font-weight: var(--font-rg);\n letter-spacing: 0.16px;\n line-height: 1.4;\n }\n\n .mobile-interactive-3,\n .mobile-interactive-3-sb {\n font-size: var(--font-size-1);\n font-weight: var(--font-rg);\n letter-spacing: 0.32px;\n line-height: 1.333;\n }\n\n .mobile-section-title-1 {\n font: var(--section-title-1);\n }\n\n .mobile-section-title-2 {\n font: var(--section-title-2);\n }\n\n .mobile-section-title-3 {\n font: var(--section-title-3);\n }\n\n .mobile-section-title-4 {\n font: var(--section-title-4);\n }\n\n .mobile-section-title-5 {\n font: var(--section-title-5);\n }\n\n .mobile-section-title-6 {\n font: var(--section-title-6);\n }\n\n .mobile-heading-1-lt,\n .mobile-heading-2-lt,\n .mobile-heading-3-lt,\n .mobile-heading-4-lt {\n font-weight: var(--font-lt);\n }\n\n .mobile-heading-1-sb,\n .mobile-heading-2-sb,\n .mobile-heading-3-sb,\n .mobile-heading-4-sb,\n .mobile-body-1-sb,\n .mobile-body-2-sb,\n .mobile-body-3-sb,\n .mobile-body-4-sb,\n .mobile-body-5-sb,\n .mobile-interactive-1-sb,\n .mobile-interactive-2-sb,\n .mobile-interactive-3-sb {\n font-weight: var(--font-sb);\n }\n}\n\n@media (min-width: 768px) and (max-width: 1151px) {\n .tablet-heading-1,\n .tablet-heading-1-sb,\n .tablet-heading-1-lt {\n font-size: var(--font-size-7);\n font-weight: var(--font-rg);\n line-height: 1.28;\n }\n\n .tablet-heading-2,\n .tablet-heading-2-sb,\n .tablet-heading-2-lt {\n font-size: var(--font-size-6);\n font-weight: var(--font-rg);\n line-height: 1.333;\n }\n\n .tablet-heading-3,\n .tablet-heading-3-sb,\n .tablet-heading-3-lt {\n font-size: var(--font-size-6);\n font-weight: var(--font-rg);\n line-height: 1.333;\n }\n\n .tablet-heading-4,\n .tablet-heading-4-sb,\n .tablet-heading-4-lt {\n font-size: var(--font-size-5);\n font-weight: var(--font-rg);\n line-height: 1.4;\n }\n\n .tablet-body-1,\n .tablet-body-1-sb {\n font-size: var(--font-size-5);\n font-weight: var(--font-rg);\n line-height: 1.4;\n }\n\n .tablet-body-2,\n .tablet-body-2-sb {\n font-size: var(--font-size-4);\n font-weight: var(--font-rg);\n line-height: 1.5;\n }\n\n .tablet-body-3,\n .tablet-body-3-sb {\n font-size: var(--font-size-3);\n font-weight: var(--font-rg);\n line-height: 1.5;\n }\n\n .tablet-body-4,\n .tablet-body-4-sb {\n font-size: var(--font-size-2);\n font-weight: var(--font-rg);\n letter-spacing: 0.16px;\n line-height: 1.4;\n }\n\n .tablet-body-5,\n .tablet-body-5-sb {\n font-size: var(--font-size-1);\n font-weight: var(--font-rg);\n letter-spacing: 0.32px;\n line-height: 1.333;\n }\n\n .tablet-interactive-1,\n .tablet-interactive-1-sb {\n font-size: var(--font-size-3);\n font-weight: var(--font-rg);\n line-height: 1.5;\n }\n\n .tablet-interactive-2,\n .tablet-interactive-2-sb {\n font-size: var(--font-size-2);\n font-weight: var(--font-rg);\n letter-spacing: 0.16px;\n line-height: 1.4;\n }\n\n .tablet-interactive-3,\n .tablet-interactive-3-sb {\n font-size: var(--font-size-1);\n font-weight: var(--font-rg);\n letter-spacing: 0.32px;\n line-height: 1.333;\n }\n\n .tablet-section-title-1 {\n font: var(--section-title-1);\n }\n\n .tablet-section-title-2 {\n font: var(--section-title-2);\n }\n\n .tablet-section-title-3 {\n font: var(--section-title-3);\n }\n\n .tablet-section-title-4 {\n font: var(--section-title-4);\n }\n\n .tablet-section-title-5 {\n font: var(--section-title-5);\n }\n\n .tablet-section-title-6 {\n font: var(--section-title-6);\n }\n\n .tablet-heading-1-lt,\n .tablet-heading-2-lt,\n .tablet-heading-3-lt,\n .tablet-heading-4-lt {\n font-weight: var(--font-lt);\n }\n\n .tablet-heading-1-sb,\n .tablet-heading-2-sb,\n .tablet-heading-3-sb,\n .tablet-heading-4-sb,\n .tablet-body-1-sb,\n .tablet-body-2-sb,\n .tablet-body-3-sb,\n .tablet-body-4-sb,\n .tablet-body-5-sb,\n .tablet-interactive-1-sb,\n .tablet-interactive-2-sb,\n .tablet-interactive-3-sb {\n font-weight: var(--font-sb);\n }\n}\n\n@media (min-width: 1152px) and (max-width: 1365px) {\n .desktop-heading-1,\n .desktop-heading-1-sb,\n .desktop-heading-1-lt {\n font-size: var(--font-size-8);\n font-weight: var(--font-rg);\n line-height: 1.25;\n }\n\n .desktop-heading-2,\n .desktop-heading-2-sb,\n .desktop-heading-2-lt {\n font-size: var(--font-size-7);\n font-weight: var(--font-rg);\n line-height: 1.28;\n }\n\n .desktop-heading-3,\n .desktop-heading-3-sb,\n .desktop-heading-3-lt {\n font-size: var(--font-size-6);\n font-weight: var(--font-rg);\n line-height: 1.333;\n }\n\n .desktop-heading-4,\n .desktop-heading-4-sb,\n .desktop-heading-4-lt {\n font-size: var(--font-size-5);\n font-weight: var(--font-rg);\n line-height: 1.4;\n }\n\n .desktop-body-1,\n .desktop-body-1-sb {\n font-size: var(--font-size-5);\n font-weight: var(--font-rg);\n line-height: 1.4;\n }\n\n .desktop-body-2,\n .desktop-body-2-sb {\n font-size: var(--font-size-4);\n font-weight: var(--font-rg);\n line-height: 1.5;\n }\n\n .desktop-body-3,\n .desktop-body-3-sb {\n font-size: var(--font-size-3);\n font-weight: var(--font-rg);\n line-height: 1.5;\n }\n\n .desktop-body-4,\n .desktop-body-4-sb {\n font-size: var(--font-size-2);\n font-weight: var(--font-rg);\n letter-spacing: 0.16px;\n line-height: 1.4;\n }\n\n .desktop-body-5,\n .desktop-body-5-sb {\n font-size: var(--font-size-1);\n font-weight: var(--font-rg);\n letter-spacing: 0.32px;\n line-height: 1.333;\n }\n\n .desktop-interactive-1,\n .desktop-interactive-1-sb {\n font-size: var(--font-size-3);\n font-weight: var(--font-rg);\n line-height: 1.5;\n }\n\n .desktop-interactive-2,\n .desktop-interactive-2-sb {\n font-size: var(--font-size-2);\n font-weight: var(--font-rg);\n letter-spacing: 0.16px;\n line-height: 1.4;\n }\n\n .desktop-interactive-3,\n .desktop-interactive-3-sb {\n font-size: var(--font-size-1);\n font-weight: var(--font-rg);\n letter-spacing: 0.32px;\n line-height: 1.333;\n }\n\n .desktop-section-title-1 {\n font: var(--section-title-1);\n }\n\n .desktop-section-title-2 {\n font: var(--section-title-2);\n }\n\n .desktop-section-title-3 {\n font: var(--section-title-3);\n }\n\n .desktop-section-title-4 {\n font: var(--section-title-4);\n }\n\n .desktop-section-title-5 {\n font: var(--section-title-5);\n }\n\n .desktop-section-title-6 {\n font: var(--section-title-6);\n }\n\n .desktop-heading-1-lt,\n .desktop-heading-2-lt,\n .desktop-heading-3-lt,\n .desktop-heading-4-lt {\n font-weight: var(--font-lt);\n }\n\n .desktop-heading-1-sb,\n .desktop-heading-2-sb,\n .desktop-heading-3-sb,\n .desktop-heading-4-sb,\n .desktop-body-1-sb,\n .desktop-body-2-sb,\n .desktop-body-3-sb,\n .desktop-body-4-sb,\n .desktop-body-5-sb,\n .desktop-interactive-1-sb,\n .desktop-interactive-2-sb,\n .desktop-interactive-3-sb {\n font-weight: var(--font-sb);\n }\n}\n\n@media (min-width: 1366px) {\n .wide-heading-1,\n .wide-heading-1-sb,\n .wide-heading-1-lt {\n font-size: var(--font-size-8);\n font-weight: var(--font-rg);\n line-height: 1.25;\n }\n\n .wide-heading-2,\n .wide-heading-2-sb,\n .wide-heading-2-lt {\n font-size: var(--font-size-7);\n font-weight: var(--font-rg);\n line-height: 1.28;\n }\n\n .wide-heading-3,\n .wide-heading-3-sb,\n .wide-heading-3-lt {\n font-size: var(--font-size-6);\n font-weight: var(--font-rg);\n line-height: 1.333;\n }\n\n .wide-heading-4,\n .wide-heading-4-sb,\n .wide-heading-4-lt {\n font-size: var(--font-size-5);\n font-weight: var(--font-rg);\n line-height: 1.4;\n }\n\n .wide-body-1,\n .wide-body-1-sb {\n font-size: var(--font-size-5);\n font-weight: var(--font-rg);\n line-height: 1.4;\n }\n\n .wide-body-2,\n .wide-body-2-sb {\n font-size: var(--font-size-4);\n font-weight: var(--font-rg);\n line-height: 1.5;\n }\n\n .wide-body-3,\n .wide-body-3-sb {\n font-size: var(--font-size-3);\n font-weight: var(--font-rg);\n line-height: 1.5;\n }\n\n .wide-body-4,\n .wide-body-4-sb {\n font-size: var(--font-size-2);\n font-weight: var(--font-rg);\n letter-spacing: 0.16px;\n line-height: 1.4;\n }\n\n .wide-body-5,\n .wide-body-5-sb {\n font-size: var(--font-size-1);\n font-weight: var(--font-rg);\n letter-spacing: 0.32px;\n line-height: 1.333;\n }\n\n .wide-interactive-1,\n .wide-interactive-1-sb {\n font-size: var(--font-size-3);\n font-weight: var(--font-rg);\n line-height: 1.5;\n }\n\n .wide-interactive-2,\n .wide-interactive-2-sb {\n font-size: var(--font-size-2);\n font-weight: var(--font-rg);\n letter-spacing: 0.16px;\n line-height: 1.4;\n }\n\n .wide-interactive-3,\n .wide-interactive-3-sb {\n font-size: var(--font-size-1);\n font-weight: var(--font-rg);\n letter-spacing: 0.32px;\n line-height: 1.333;\n }\n\n .wide-section-title-1 {\n font: var(--section-title-1);\n }\n\n .wide-section-title-2 {\n font: var(--section-title-2);\n }\n\n .wide-section-title-3 {\n font: var(--section-title-3);\n }\n\n .wide-section-title-4 {\n font: var(--section-title-4);\n }\n\n .wide-section-title-5 {\n font: var(--section-title-5);\n }\n\n .wide-section-title-6 {\n font: var(--section-title-6);\n }\n\n .wide-heading-1-lt,\n .wide-heading-2-lt,\n .wide-heading-3-lt,\n .wide-heading-4-lt {\n font-weight: var(--font-lt);\n }\n\n .wide-heading-1-sb,\n .wide-heading-2-sb,\n .wide-heading-3-sb,\n .wide-heading-4-sb,\n .wide-body-1-sb,\n .wide-body-2-sb,\n .wide-body-3-sb,\n .wide-body-4-sb,\n .wide-body-5-sb,\n .wide-interactive-1-sb,\n .wide-interactive-2-sb,\n .wide-interactive-3-sb {\n font-weight: var(--font-sb);\n }\n}\n\n/ font-weight variants /\n.heading-1-lt,\n.heading-2-lt,\n.heading-3-lt,\n.heading-4-lt {\n font-weight: var(--font-lt);\n}\n\n.heading-1-sb,\n.heading-2-sb,\n.heading-3-sb,\n.heading-4-sb,\n.body-1-sb,\n.body-2-sb,\n.body-3-sb,\n.body-4-sb,\n.body-5-sb,\n.interactive-1-sb,\n.interactive-2-sb,\n.interactive-3-sb,\n.helper-sb {\n font-weight: var(--font-sb);\n}\n","button.z-link {\n padding: 0;\n border: 0;\n margin: 0;\n background-color: transparent;\n}\n\na.z-link,\nbutton.z-link {\n display: inline-flex;\n cursor: pointer;\n font-family: var(--font-family-sans);\n line-height: inherit;\n text-decoration: none;\n}\n\na.z-link.z-link-icon,\nbutton.z-link.z-link-icon {\n --z-icon-width: 1.125em;\n --z-icon-height: 1.125em;\n\n align-items: center;\n column-gap: 0.5em;\n}\n\na.z-link.z-link-sb,\nbutton.z-link.z-link-sb {\n font-weight: var(--font-sb);\n}\n\na.z-link.z-link-underline,\nbutton.z-link.z-link-underline {\n text-decoration: underline;\n}\n\na.z-link:hover,\nbutton.z-link:hover,\na.z-link:focus-visible,\nbutton.z-link:focus-visible,\na.z-link:active,\nbutton.z-link:active {\n text-decoration: underline;\n}\n\na.z-link:focus-visible,\nbutton.z-link:focus-visible {\n box-shadow: var(--shadow-focus-primary);\n outline: none;\n}\n\na.z-link.z-link-disabled,\nbutton.z-link.z-link-disabled {\n box-shadow: none;\n color: var(--color-disabled03);\n cursor: default;\n fill: var(--color-disabled03);\n outline: none;\n pointer-events: none;\n text-decoration: none;\n}\n\na.z-link,\nbutton.z-link,\na.z-link.z-link-active,\nbutton.z-link.z-link-active,\na.z-link:hover,\nbutton.z-link:hover,\na.z-link.z-link-active:hover,\nbutton.z-link.z-link-active:hover,\na.z-link:focus-visible,\nbutton.z-link:focus-visible,\na.z-link.z-link-active:focus-visible,\nbutton.z-link.z-link-active:focus-visible,\na.z-link:active,\nbutton.z-link:active,\na.z-link.z-link-active:active,\nbutton.z-link.z-link-active:active,\na.z-link:visited,\nbutton.z-link:visited,\na.z-link.z-link-active:visited,\nbutton.z-link.z-link-active:visited {\n color: var(--color-text-link-default);\n fill: var(--color-text-link-default);\n}\n\na.z-link.z-link-blue,\nbutton.z-link.z-link-blue,\na.z-link.z-link-blue.z-link-active,\nbutton.z-link.z-link-blue.z-link-active {\n color: var(--color-text-link-blue);\n fill: var(--color-text-link-blue);\n}\n\na.z-link.z-link-red,\nbutton.z-link.z-link-red,\na.z-link.z-link-red.z-link-active,\nbutton.z-link.z-link-red.z-link-active {\n color: var(--color-text-link-red);\n fill: var(--color-text-link-red);\n}\n\na.z-link.z-link-inverse,\nbutton.z-link.z-link-inverse,\na.z-link.z-link-inverse.z-link-active,\nbutton.z-link.z-link-inverse.z-link-active {\n color: var(--color-text-link-inverse);\n fill: var(--color-text-link-inverse);\n}\n\na.z-link.z-link-blue:hover,\nbutton.z-link.z-link-blue:hover {\n color: var(--color-text-link-blue-hover);\n fill: var(--color-text-link-blue-hover);\n}\n\na.z-link.z-link-red:hover,\nbutton.z-link.z-link-red:hover {\n color: var(--color-text-link-red-hover);\n fill: var(--color-text-link-red-hover);\n}\n\na.z-link.z-link-inverse:hover,\nbutton.z-link.z-link-inverse:hover {\n color: var(--color-text-link-inverse);\n fill: var(--color-text-link-inverse);\n}\n\na.z-link.z-link-blue:active,\nbutton.z-link.z-link-blue:active,\na.z-link.z-link-blue:focus-visible,\nbutton.z-link.z-link-blue:focus-visible {\n color: var(--color-text-link-blue-active);\n fill: var(--color-text-link-blue-active);\n}\n\na.z-link.z-link-red:active,\nbutton.z-link.z-link-red:active,\na.z-link.z-link-red:focus-visible,\nbutton.z-link.z-link-red:focus-visible {\n color: var(--color-text-link-red-active);\n fill: var(--color-text-link-red-active);\n}\n\na.z-link.z-link-inverse:active,\nbutton.z-link.z-link-inverse:active,\na.z-link.z-link-inverse:focus-visible,\nbutton.z-link.z-link-inverse:focus-visible {\n color: var(--color-text-link-inverse);\n fill: var(--color-text-link-inverse);\n}\n\na.z-link.z-link-blue:visited,\nbutton.z-link.z-link-blue:visited {\n color: var(--color-text-link-blue-visited);\n fill: var(--color-text-link-blue-visited);\n}\n\na.z-link.z-link-red:visited,\nbutton.z-link.z-link-red:visited {\n color: var(--color-text-link-red-visited);\n fill: var(--color-text-link-red-visited);\n}\n\na.z-link.z-link-inverse:visited,\nbutton.z-link.z-link-inverse:visited {\n color: var(--color-text-link-inverse);\n fill: var(--color-text-link-inverse);\n}\n","import {Component, Element, Event, EventEmitter, Host, Prop, h} from \"@stencil/core\";\nimport {BookCardVariant, ControlSize} from \"../../../beans\";\n\n/\n @slot cta - Top right cta (e.g. bookmark icon)\n * @slot ebook - As default, it shows laZ ebook link\n * @slot tags - Tags section, default empty\n * @slot data - External link and pill, default empty\n * @slot apps - List of card-related apps, default empty\n * @slot coverOverlay - Content to be displayed in the `z-book-cover` component slot\n * @cssprop --z-book-card-portrait-cover-height - Set custom cover height for portrait variant - Default: `378px`\n * @cssprop --z-book-card-title-lines - Set title avilable lines - Default: `2`\n * @cssprop --z-book-card-title-word-break - Set title word-break rule - Default: `initial`\n * @cssprop --z-book-card-subtitle-lines - Set subtitle available lines - Default: `1`\n * @cssprop --z-book-card-subtitle-word-break - Set subtitle word-break rule - Default: `break-all`\n * @cssprop --z-book-card-authors-lines - Set authors available lines - Default: `1`\n * @cssprop --z-book-card-authors-word-break - Set authors word-break rule - Default: `break-all`\n /\n@Component({\n tag: \"z-book-card\",\n styleUrls: [\"styles.css\", \"../../../tokens/typography.css\", \"../../css-components/z-link/styles.css\"],\n shadow: true,\n})\nexport class ZBookCard {\n @Element() hostElement: HTMLZBookCardElement;\n\n /* Card variant: landscape, portrait /\n @Prop({reflect: true})\n variant: BookCardVariant = BookCardVariant.PORTRAIT;\n\n /* Cover URL /\n @Prop()\n cover: string;\n\n /* Opera title (card title) /\n @Prop()\n operaTitle: string;\n\n /* [optional] Volume title (card subvolume) /\n @Prop()\n volumeTitle?: string;\n\n /* [optional] Authors /\n @Prop()\n authors?: string;\n\n /* [optional] Main ISBN /\n @Prop()\n isbn?: string;\n\n /* [optional] ISBN label /\n @Prop()\n isbnLabel = \"\";\n\n /* [optional] year /\n @Prop()\n year?: string;\n\n /* [optional] Link to the ebook resource. Creates a link also around the cover and title. /\n @Prop()\n ebookUrl?: string;\n\n /* [optional] Value for the `target` attribute of the links created by `ebookUrl` prop. /\n @Prop()\n linkTarget = \"_blank\";\n\n /* [optional] Fallback cover URL. /\n @Prop()\n fallbackCover?: string;\n\n /* Whether to show a stack of covers to represent multiple books (only for `portrait` variant). /\n @Prop()\n hasMultipleCovers = false;\n\n /* [optional] Set a specific heading level as html tag for the title. /\n @Prop()\n titleHtmlTag?: string;\n\n /* click on ebook link /\n @Event()\n ebookClick: EventEmitter;\n\n /* click on cover link /\n @Event()\n coverClick: EventEmitter;\n\n /* click on title link */\n @Event()\n titleClick: EventEmitter;\n\n private emitEbookClick(): void {\n this.ebookClick.emit();\n }\n\n private emitCoverClick(): void {\n this.coverClick.emit();\n }\n\n private emitTitleClick(): void {\n this.titleClick.emit();\n }\n\n private renderCover(): HTMLDivElement {\n const CoverTag = this.ebookUrl ? \"a\" : \"div\";\n const coverAttrs = this.ebookUrl\n ? {\n href: this.ebookUrl,\n onClick: () => this.emitCoverClick(),\n target: this.linkTarget,\n }\n : {};\n\n return (\n <CoverTag\n class=\"cover\"\n {...coverAttrs}\n >\n <z-book-cover\n cover={this.cover}\n fallbackCover={this.fallbackCover}\n multiple={this.hasMultipleCovers && this.variant === BookCardVariant.PORTRAIT}\n >\n <slot\n name=\"coverOverlay\"\n slot=\"coverOverlay\"\n ></slot>\n </z-book-cover>\n </CoverTag>\n );\n }\n\n private renderYear(): null \| HTMLDivElement {\n if (!this.year) {\n return null;\n }\n\n return (\n <div\n class=\"year ellipsis body-4\"\n aria-description=\"anno\"\n >\n {this.year}\n </div>\n );\n }\n\n private renderAuthors(): null \| HTMLDivElement {\n if (!this.authors) {\n return null;\n }\n\n return (\n <div class=\"cta-wrapper\">\n <div\n class=\"authors ellipsis body-4\"\n aria-description=\"autori\"\n >\n {this.authors}\n </div>\n {this.variant === BookCardVariant.LANDSCAPE ? this.renderCtaSlot() : null}\n </div>\n );\n }\n\n private renderOperaTitle(): HTMLDivElement {\n const title = this.titleHtmlTag\n ? `<${this.titleHtmlTag}>${this.operaTitle}</${this.titleHtmlTag}>`\n : this.operaTitle;\n\n const operaTitle = (\n <div\n class=\"opera-title ellipsis body-2-sb\"\n innerHTML={title}\n />\n );\n\n return (\n <div class=\"cta-wrapper\">\n {this.ebookUrl ? (\n <a\n class=\"z-link\"\n href={this.ebookUrl}\n onClick={() => this.emitTitleClick()}\n target={this.linkTarget}\n >\n {operaTitle}\n </a>\n ) : (\n operaTitle\n )}\n {this.variant === BookCardVariant.PORTRAIT ? this.renderCtaSlot() : null}\n </div>\n );\n }\n\n private renderVolumeTitle(): null \| HTMLDivElement {\n if (!this.volumeTitle) {\n return null;\n }\n\n return <div class=\"volume-title ellipsis body-4\">{this.volumeTitle}</div>;\n }\n\n private renderIsbn(): null \| HTMLDivElement {\n if (!this.isbn) {\n return null;\n }\n\n return (\n <div\n class=\"isbn ellipsis body-4-sb\"\n aria-description={`isbn ${this.isbnLabel}`}\n >\n {this.isbn} {this.isbnLabel ? <span class=\"body-4\">{this.isbnLabel}</span> : null}\n </div>\n );\n }\n\n private renderEbook(): HTMLDivElement {\n return (\n <div class=\"ebook\">\n <div class=\"app-name\">\n <img\n class=\"ebook-logo\"\n aria-hidden=\"true\"\n />\n <div class=\"body-4-sb\">laZ Ebook</div>\n </div>\n <z-button\n size={ControlSize.X_SMALL}\n href={this.ebookUrl}\n target={this.linkTarget}\n onClick={() => this.emitEbookClick()}\n htmlrole=\"link\"\n aria-description={`leggi l'ebook ${this.operaTitle} su laZ Ebook`}\n >\n leggi ebook\n </z-button>\n </div>\n );\n }\n\n private renderCtaSlot(): HTMLSlotElement {\n return <slot name=\"cta\"></slot>;\n }\n\n render(): HTMLZBookCardElement {\n return (\n <Host>\n <div class=\"main-content\">\n {this.renderCover()}\n <div class=\"card-info\">\n <div class=\"top\">\n <div>\n {this.renderYear()}\n {this.renderAuthors()}\n {this.renderOperaTitle()}\n {this.renderVolumeTitle()}\n {this.renderIsbn()}\n </div>\n <slot name=\"tags\"></slot>\n <slot name=\"data\"></slot>\n </div>\n <slot name=\"ebook\">{!!this.ebookUrl && <div class=\"bottom\">{this.renderEbook()}</div>}</slot>\n </div>\n </div>\n <slot name=\"apps\"></slot>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"z-book-card.js","mappings":"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","names":["stylesCss","ZBookCard"],"sources":["src/components/book-card/z-book-card/styles.css?tag=z-book-card&encapsulation=shadow","src/tokens/typography.css?tag=z-book-card&encapsulation=shadow","src/components/css-components/z-link/styles.css?tag=z-book-card&encapsulation=shadow","src/components/book-card/z-book-card/index.tsx"],"sourcesContent":[":host {\n --z-book-card-portrait-cover-height: 378px;\n --z-book-card-title-lines: 2;\n --z-book-card-title-word-break: initial;\n --z-book-card-subtitle-lines: 1;\n --z-book-card-subtitle-word-break: break-all;\n --z-book-card-authors-lines: 1;\n --z-book-card-authors-word-break: break-all;\n\n display: flex;\n width: 304px;\n box-sizing: border-box;\n flex-direction: column;\n border: solid var(--border-size-medium) var(--color-surface03);\n background-color: var(--color-surface01);\n border-radius: var(--border-radius);\n color: var(--color-default-text);\n font-family: var(--font-family-sans);\n}\n\n:host,\n* {\n box-sizing: border-box;\n}\n\n.main-content {\n display: flex;\n height: 100%;\n flex-direction: column;\n padding: var(--space-unit);\n gap: var(--space-unit);\n}\n\n.main-content .cover {\n position: relative;\n display: flex;\n overflow: hidden;\n align-items: flex-end;\n justify-content: center;\n border-radius: var(--border-radius);\n}\n\n.main-content .cover z-book-cover {\n --z-book-cover-height: var(--z-book-card-portrait-cover-height);\n}\n\n.main-content a.cover:focus-visible {\n box-shadow: var(--shadow-focus-primary);\n outline: none;\n}\n\n.main-content .card-info {\n display: flex;\n flex: 1;\n flex-direction: column;\n justify-content: space-between;\n gap: var(--space-unit);\n}\n\n.main-content .card-info .top {\n display: flex;\n flex-direction: column;\n gap: calc(var(--space-unit) * 2);\n}\n\n.main-content .card-info .top ::slotted([slot=\"tags\"]) {\n display: flex;\n flex-wrap: wrap;\n gap: var(--space-unit);\n}\n\n.main-content .card-info .top ::slotted([slot=\"data\"]) {\n display: flex;\n justify-content: space-between;\n}\n\n.main-content .card-info .top .ellipsis {\n display: -webkit-box;\n overflow: hidden;\n height: 1.4rem;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 1;\n line-clamp: 1;\n line-height: 1.4rem;\n text-overflow: ellipsis;\n word-break: break-all;\n}\n\n.main-content .card-info .top .ellipsis.opera-title {\n height: auto;\n max-height: calc(1.5rem * var(--z-book-card-title-lines));\n -webkit-line-clamp: var(--z-book-card-title-lines);\n line-clamp: var(--z-book-card-title-lines);\n line-height: 1.5rem;\n word-break: var(--z-book-card-title-word-break);\n}\n\n.main-content .card-info .top .ellipsis.volume-title {\n height: auto;\n max-height: calc(1.4rem * var(--z-book-card-subtitle-lines));\n -webkit-line-clamp: var(--z-book-card-subtitle-lines);\n line-clamp: var(--z-book-card-subtitle-lines);\n line-height: 1.4rem;\n word-break: var(--z-book-card-subtitle-word-break);\n}\n\n.main-content .card-info .top .ellipsis.authors {\n height: auto;\n max-height: calc(1.4rem * var(--z-book-card-authors-lines));\n -webkit-line-clamp: var(--z-book-card-authors-lines);\n line-clamp: var(--z-book-card-authors-lines);\n line-height: 1.4rem;\n word-break: var(--z-book-card-authors-word-break);\n}\n\n.main-content .card-info .top .opera-title * {\n all: unset;\n}\n\n.main-content .cta-wrapper {\n display: flex;\n justify-content: space-between;\n gap: calc(var(--space-unit) / 2);\n}\n\n.main-content .card-info .top .link-chip-wrapper {\n display: flex;\n justify-content: space-between;\n}\n\n.main-content .card-info .bottom .ebook {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n justify-content: space-between;\n padding: var(--space-unit);\n background-color: var(--color-primary02);\n border-radius: var(--border-radius);\n gap: var(--space-unit);\n}\n\n.main-content .card-info .bottom .ebook .app-name {\n display: flex;\n align-items: center;\n padding: calc(var(--space-unit) / 2) 0;\n font-family: var(--font-family-serif);\n gap: calc(var(--space-unit) / 2);\n}\n\n.main-content .card-info .bottom .ebook .app-name .ebook-logo {\n width: 1.5rem;\n height: 1.5rem;\n content: url(\"data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 20 20%22 fill=%22none%22 aria-hidden=%22true%22%3E%3Cg clip-path=%22url(%23clip0_11996_224)%22%3E%3Cpath d=%22M14.6644 0.469604H5.00141C2.33305 0.469604 0.169922 2.63274 0.169922 5.3011V14.9641C0.169922 17.6324 2.33305 19.7956 5.00141 19.7956H14.6644C17.3328 19.7956 19.4959 17.6324 19.4959 14.9641V5.3011C19.4959 2.63274 17.3328 0.469604 14.6644 0.469604Z%22 fill=%22%23E2011A%22/%3E%3Cpath d=%22M15.9523 13.3536H12.7313C11.6861 13.3536 10.6683 13.6934 9.83241 14.3199C8.99657 13.6934 7.97873 13.3536 6.93352 13.3536H3.71252V5.30115H6.93352C7.97873 5.30115 8.99657 5.64096 9.83241 6.26745C10.6683 5.64096 11.6861 5.30115 12.7313 5.30115H15.9523V13.3536Z%22 fill=%22white%22/%3E%3Cpath d=%22M15.9523 14.3201H3.71252V14.9643H15.9523V14.3201Z%22 fill=%22black%22/%3E%3Cpath d=%22M8.22229 10.732V8.24543C8.22229 7.97165 8.51057 7.79449 8.75375 7.91689L11.2404 9.16019C11.5109 9.29548 11.5109 9.682 11.2404 9.81728L8.75375 11.0606C8.50896 11.183 8.22229 11.0058 8.22229 10.732Z%22 fill=%22black%22/%3E%3Cpath d=%22M4.35704 7.87826C5.42438 7.87826 6.28963 7.013 6.28963 5.94566C6.28963 4.87831 5.42438 4.01306 4.35704 4.01306C3.28969 4.01306 2.42444 4.87831 2.42444 5.94566C2.42444 7.013 3.28969 7.87826 4.35704 7.87826Z%22 fill=%22black%22/%3E%3Cpath d=%22M5.6454 5.62354H3.0686V6.26773H5.6454V5.62354Z%22 fill=%22white%22/%3E%3Cpath d=%22M4.67917 4.65723H4.03497V7.23402H4.67917V4.65723Z%22 fill=%22white%22/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id=%22clip0_11996_224%22%3E%3Crect width=%2219.326%22 height=%2219.326%22 fill=%22white%22 transform=%22translate(0.169922 0.469604)%22/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E\");\n}\n\n:host([variant=\"landscape\"]) {\n width: 635px;\n min-height: max(332px, 20.75rem);\n padding: 0;\n}\n\n:host([variant=\"landscape\"]) .main-content {\n min-height: max(332px, 20.75rem);\n flex-direction: row;\n padding: calc(var(--space-unit) * 2);\n gap: calc(var(--space-unit) * 2);\n}\n\n:host([variant=\"landscape\"]) .main-content .cover z-book-cover {\n --z-book-cover-height: 300px;\n}\n\n:host([variant=\"landscape\"]) .main-content .card-info,\n:host([variant=\"landscape\"]) .main-content .card-info .top {\n gap: calc(var(--space-unit) / 2);\n}\n\n@media (max-width: 767px) {\n :host([variant=\"portrait\"]) {\n width: 100%;\n max-width: 400px;\n }\n}\n",":root {\n /* font-family /\n --font-family-sans: \"IBM Plex Sans\", sans-serif;\n --font-family-serif: \"IBM Plex Serif\", serif;\n\n / font-weight /\n --font-lt: 300;\n --font-rg: 400;\n --font-sb: 600;\n --font-bd: 700;\n\n / font-size type scale /\n --font-size-1: 0.75rem; / 12px /\n --font-size-2: 0.875rem; / 14px /\n --font-size-3: 1rem; / assuming 16px /\n --font-size-4: 1.125rem; / 18px /\n --font-size-5: 1.25rem; / 20px /\n --font-size-6: 1.5rem; / 24px /\n --font-size-7: 1.75rem; / 28px /\n --font-size-8: 2rem; / 32px /\n --font-size-9: 2.25rem; / 36px /\n --font-size-10: 2.625rem; / 42px /\n --font-size-11: 3rem; / 48px /\n --font-size-12: 3.375rem; / 54px /\n --font-size-13: 3.75rem; / 60px /\n --font-size-14: 4.25rem; / 68px /\n --font-size-15: 4.75rem; / 76px /\n --font-size-16: 5.25rem; / 84px /\n --font-size-17: 5.75rem; / 92px /\n\n / cssprops to use with `font` shorthand property /\n --section-title-1: var(--font-sb) var(--font-size-11) / 1.083 var(--font-family-serif);\n --section-title-2: var(--font-sb) var(--font-size-10) / 1.142 var(--font-family-serif);\n --section-title-3: var(--font-sb) var(--font-size-9) / 1.222 var(--font-family-serif);\n --section-title-4: var(--font-sb) var(--font-size-8) / 1.25 var(--font-family-serif);\n --section-title-5: var(--font-sb) var(--font-size-7) / 1.2857 var(--font-family-serif);\n --section-title-6: var(--font-sb) var(--font-size-6) / 1.333 var(--font-family-serif);\n}\n\n/ Typography classes /\n.heading-1,\n.heading-1-sb,\n.heading-1-lt {\n font-size: var(--font-size-7);\n font-weight: var(--font-rg);\n line-height: 1.28;\n}\n\n.heading-2,\n.heading-2-sb,\n.heading-2-lt {\n font-size: var(--font-size-6);\n font-weight: var(--font-rg);\n line-height: 1.333;\n}\n\n.heading-3,\n.heading-3-sb,\n.heading-3-lt {\n font-size: var(--font-size-6);\n font-weight: var(--font-rg);\n line-height: 1.333;\n}\n\n.heading-4,\n.heading-4-sb,\n.heading-4-lt {\n font-size: var(--font-size-5);\n font-weight: var(--font-rg);\n line-height: 1.4;\n}\n\n.body-1,\n.body-1-sb {\n font-size: var(--font-size-5);\n font-weight: var(--font-rg);\n line-height: 1.4;\n}\n\n.body-2,\n.body-2-sb {\n font-size: var(--font-size-4);\n font-weight: var(--font-rg);\n line-height: 1.5;\n}\n\n.body-3,\n.body-3-sb {\n font-size: var(--font-size-3);\n font-weight: var(--font-rg);\n line-height: 1.5;\n}\n\n.body-4,\n.body-4-sb {\n font-size: var(--font-size-2);\n font-weight: var(--font-rg);\n letter-spacing: 0.16px;\n line-height: 1.4;\n}\n\n.body-5,\n.body-5-sb {\n font-size: var(--font-size-1);\n font-weight: var(--font-rg);\n letter-spacing: 0.32px;\n line-height: 1.333;\n}\n\n.interactive-1,\n.interactive-1-sb {\n font-size: var(--font-size-3);\n font-weight: var(--font-rg);\n line-height: 1.5;\n}\n\n.interactive-2,\n.interactive-2-sb {\n font-size: var(--font-size-2);\n font-weight: var(--font-rg);\n letter-spacing: 0.16px;\n line-height: 1.4;\n}\n\n.interactive-3,\n.interactive-3-sb {\n font-size: var(--font-size-1);\n font-weight: var(--font-rg);\n letter-spacing: 0.32px;\n line-height: 1.333;\n}\n\n.helper,\n.helper-sb {\n font-size: var(--font-size-1);\n font-style: italic;\n font-weight: var(--font-rg);\n letter-spacing: 0.32px;\n line-height: 1.333;\n}\n\n/ section title /\n.section-title-1 {\n font: var(--section-title-1);\n}\n\n.section-title-2 {\n font: var(--section-title-2);\n}\n\n.section-title-3 {\n font: var(--section-title-3);\n}\n\n.section-title-4 {\n font: var(--section-title-4);\n}\n\n.section-title-5 {\n font: var(--section-title-5);\n}\n\n.section-title-6 {\n font: var(--section-title-6);\n}\n\n/ heading-1/2 for desktop and wide viewports /\n@media (min-width: 1152px) {\n .heading-1,\n .heading-1-sb,\n .heading-1-lt {\n font-size: var(--font-size-8);\n font-weight: var(--font-rg);\n line-height: 1.25;\n }\n\n .heading-2,\n .heading-2-sb,\n .heading-2-lt {\n font-size: var(--font-size-7);\n font-weight: var(--font-rg);\n line-height: 1.28;\n }\n}\n\n/ viewport classes /\n@media (max-width: 767px) {\n .mobile-heading-1,\n .mobile-heading-1-sb,\n .mobile-heading-1-lt {\n font-size: var(--font-size-7);\n font-weight: var(--font-rg);\n line-height: 1.28;\n }\n\n .mobile-heading-2,\n .mobile-heading-2-sb,\n .mobile-heading-2-lt {\n font-size: var(--font-size-6);\n font-weight: var(--font-rg);\n line-height: 1.333;\n }\n\n .mobile-heading-3,\n .mobile-heading-3-sb,\n .mobile-heading-3-lt {\n font-size: var(--font-size-6);\n font-weight: var(--font-rg);\n line-height: 1.333;\n }\n\n .mobile-heading-4,\n .mobile-heading-4-sb,\n .mobile-heading-4-lt {\n font-size: var(--font-size-5);\n font-weight: var(--font-rg);\n line-height: 1.4;\n }\n\n .mobile-body-1,\n .mobile-body-1-sb {\n font-size: var(--font-size-5);\n font-weight: var(--font-rg);\n line-height: 1.4;\n }\n\n .mobile-body-2,\n .mobile-body-2-sb {\n font-size: var(--font-size-4);\n font-weight: var(--font-rg);\n line-height: 1.5;\n }\n\n .mobile-body-3,\n .mobile-body-3-sb {\n font-size: var(--font-size-3);\n font-weight: var(--font-rg);\n line-height: 1.5;\n }\n\n .mobile-body-4,\n .mobile-body-4-sb {\n font-size: var(--font-size-2);\n font-weight: var(--font-rg);\n letter-spacing: 0.16px;\n line-height: 1.4;\n }\n\n .mobile-body-5,\n .mobile-body-5-sb {\n font-size: var(--font-size-1);\n font-weight: var(--font-rg);\n letter-spacing: 0.32px;\n line-height: 1.333;\n }\n\n .mobile-interactive-1,\n .mobile-interactive-1-sb {\n font-size: var(--font-size-3);\n font-weight: var(--font-rg);\n line-height: 1.5;\n }\n\n .mobile-interactive-2,\n .mobile-interactive-2-sb {\n font-size: var(--font-size-2);\n font-weight: var(--font-rg);\n letter-spacing: 0.16px;\n line-height: 1.4;\n }\n\n .mobile-interactive-3,\n .mobile-interactive-3-sb {\n font-size: var(--font-size-1);\n font-weight: var(--font-rg);\n letter-spacing: 0.32px;\n line-height: 1.333;\n }\n\n .mobile-section-title-1 {\n font: var(--section-title-1);\n }\n\n .mobile-section-title-2 {\n font: var(--section-title-2);\n }\n\n .mobile-section-title-3 {\n font: var(--section-title-3);\n }\n\n .mobile-section-title-4 {\n font: var(--section-title-4);\n }\n\n .mobile-section-title-5 {\n font: var(--section-title-5);\n }\n\n .mobile-section-title-6 {\n font: var(--section-title-6);\n }\n\n .mobile-heading-1-lt,\n .mobile-heading-2-lt,\n .mobile-heading-3-lt,\n .mobile-heading-4-lt {\n font-weight: var(--font-lt);\n }\n\n .mobile-heading-1-sb,\n .mobile-heading-2-sb,\n .mobile-heading-3-sb,\n .mobile-heading-4-sb,\n .mobile-body-1-sb,\n .mobile-body-2-sb,\n .mobile-body-3-sb,\n .mobile-body-4-sb,\n .mobile-body-5-sb,\n .mobile-interactive-1-sb,\n .mobile-interactive-2-sb,\n .mobile-interactive-3-sb {\n font-weight: var(--font-sb);\n }\n}\n\n@media (min-width: 768px) and (max-width: 1151px) {\n .tablet-heading-1,\n .tablet-heading-1-sb,\n .tablet-heading-1-lt {\n font-size: var(--font-size-7);\n font-weight: var(--font-rg);\n line-height: 1.28;\n }\n\n .tablet-heading-2,\n .tablet-heading-2-sb,\n .tablet-heading-2-lt {\n font-size: var(--font-size-6);\n font-weight: var(--font-rg);\n line-height: 1.333;\n }\n\n .tablet-heading-3,\n .tablet-heading-3-sb,\n .tablet-heading-3-lt {\n font-size: var(--font-size-6);\n font-weight: var(--font-rg);\n line-height: 1.333;\n }\n\n .tablet-heading-4,\n .tablet-heading-4-sb,\n .tablet-heading-4-lt {\n font-size: var(--font-size-5);\n font-weight: var(--font-rg);\n line-height: 1.4;\n }\n\n .tablet-body-1,\n .tablet-body-1-sb {\n font-size: var(--font-size-5);\n font-weight: var(--font-rg);\n line-height: 1.4;\n }\n\n .tablet-body-2,\n .tablet-body-2-sb {\n font-size: var(--font-size-4);\n font-weight: var(--font-rg);\n line-height: 1.5;\n }\n\n .tablet-body-3,\n .tablet-body-3-sb {\n font-size: var(--font-size-3);\n font-weight: var(--font-rg);\n line-height: 1.5;\n }\n\n .tablet-body-4,\n .tablet-body-4-sb {\n font-size: var(--font-size-2);\n font-weight: var(--font-rg);\n letter-spacing: 0.16px;\n line-height: 1.4;\n }\n\n .tablet-body-5,\n .tablet-body-5-sb {\n font-size: var(--font-size-1);\n font-weight: var(--font-rg);\n letter-spacing: 0.32px;\n line-height: 1.333;\n }\n\n .tablet-interactive-1,\n .tablet-interactive-1-sb {\n font-size: var(--font-size-3);\n font-weight: var(--font-rg);\n line-height: 1.5;\n }\n\n .tablet-interactive-2,\n .tablet-interactive-2-sb {\n font-size: var(--font-size-2);\n font-weight: var(--font-rg);\n letter-spacing: 0.16px;\n line-height: 1.4;\n }\n\n .tablet-interactive-3,\n .tablet-interactive-3-sb {\n font-size: var(--font-size-1);\n font-weight: var(--font-rg);\n letter-spacing: 0.32px;\n line-height: 1.333;\n }\n\n .tablet-section-title-1 {\n font: var(--section-title-1);\n }\n\n .tablet-section-title-2 {\n font: var(--section-title-2);\n }\n\n .tablet-section-title-3 {\n font: var(--section-title-3);\n }\n\n .tablet-section-title-4 {\n font: var(--section-title-4);\n }\n\n .tablet-section-title-5 {\n font: var(--section-title-5);\n }\n\n .tablet-section-title-6 {\n font: var(--section-title-6);\n }\n\n .tablet-heading-1-lt,\n .tablet-heading-2-lt,\n .tablet-heading-3-lt,\n .tablet-heading-4-lt {\n font-weight: var(--font-lt);\n }\n\n .tablet-heading-1-sb,\n .tablet-heading-2-sb,\n .tablet-heading-3-sb,\n .tablet-heading-4-sb,\n .tablet-body-1-sb,\n .tablet-body-2-sb,\n .tablet-body-3-sb,\n .tablet-body-4-sb,\n .tablet-body-5-sb,\n .tablet-interactive-1-sb,\n .tablet-interactive-2-sb,\n .tablet-interactive-3-sb {\n font-weight: var(--font-sb);\n }\n}\n\n@media (min-width: 1152px) and (max-width: 1365px) {\n .desktop-heading-1,\n .desktop-heading-1-sb,\n .desktop-heading-1-lt {\n font-size: var(--font-size-8);\n font-weight: var(--font-rg);\n line-height: 1.25;\n }\n\n .desktop-heading-2,\n .desktop-heading-2-sb,\n .desktop-heading-2-lt {\n font-size: var(--font-size-7);\n font-weight: var(--font-rg);\n line-height: 1.28;\n }\n\n .desktop-heading-3,\n .desktop-heading-3-sb,\n .desktop-heading-3-lt {\n font-size: var(--font-size-6);\n font-weight: var(--font-rg);\n line-height: 1.333;\n }\n\n .desktop-heading-4,\n .desktop-heading-4-sb,\n .desktop-heading-4-lt {\n font-size: var(--font-size-5);\n font-weight: var(--font-rg);\n line-height: 1.4;\n }\n\n .desktop-body-1,\n .desktop-body-1-sb {\n font-size: var(--font-size-5);\n font-weight: var(--font-rg);\n line-height: 1.4;\n }\n\n .desktop-body-2,\n .desktop-body-2-sb {\n font-size: var(--font-size-4);\n font-weight: var(--font-rg);\n line-height: 1.5;\n }\n\n .desktop-body-3,\n .desktop-body-3-sb {\n font-size: var(--font-size-3);\n font-weight: var(--font-rg);\n line-height: 1.5;\n }\n\n .desktop-body-4,\n .desktop-body-4-sb {\n font-size: var(--font-size-2);\n font-weight: var(--font-rg);\n letter-spacing: 0.16px;\n line-height: 1.4;\n }\n\n .desktop-body-5,\n .desktop-body-5-sb {\n font-size: var(--font-size-1);\n font-weight: var(--font-rg);\n letter-spacing: 0.32px;\n line-height: 1.333;\n }\n\n .desktop-interactive-1,\n .desktop-interactive-1-sb {\n font-size: var(--font-size-3);\n font-weight: var(--font-rg);\n line-height: 1.5;\n }\n\n .desktop-interactive-2,\n .desktop-interactive-2-sb {\n font-size: var(--font-size-2);\n font-weight: var(--font-rg);\n letter-spacing: 0.16px;\n line-height: 1.4;\n }\n\n .desktop-interactive-3,\n .desktop-interactive-3-sb {\n font-size: var(--font-size-1);\n font-weight: var(--font-rg);\n letter-spacing: 0.32px;\n line-height: 1.333;\n }\n\n .desktop-section-title-1 {\n font: var(--section-title-1);\n }\n\n .desktop-section-title-2 {\n font: var(--section-title-2);\n }\n\n .desktop-section-title-3 {\n font: var(--section-title-3);\n }\n\n .desktop-section-title-4 {\n font: var(--section-title-4);\n }\n\n .desktop-section-title-5 {\n font: var(--section-title-5);\n }\n\n .desktop-section-title-6 {\n font: var(--section-title-6);\n }\n\n .desktop-heading-1-lt,\n .desktop-heading-2-lt,\n .desktop-heading-3-lt,\n .desktop-heading-4-lt {\n font-weight: var(--font-lt);\n }\n\n .desktop-heading-1-sb,\n .desktop-heading-2-sb,\n .desktop-heading-3-sb,\n .desktop-heading-4-sb,\n .desktop-body-1-sb,\n .desktop-body-2-sb,\n .desktop-body-3-sb,\n .desktop-body-4-sb,\n .desktop-body-5-sb,\n .desktop-interactive-1-sb,\n .desktop-interactive-2-sb,\n .desktop-interactive-3-sb {\n font-weight: var(--font-sb);\n }\n}\n\n@media (min-width: 1366px) {\n .wide-heading-1,\n .wide-heading-1-sb,\n .wide-heading-1-lt {\n font-size: var(--font-size-8);\n font-weight: var(--font-rg);\n line-height: 1.25;\n }\n\n .wide-heading-2,\n .wide-heading-2-sb,\n .wide-heading-2-lt {\n font-size: var(--font-size-7);\n font-weight: var(--font-rg);\n line-height: 1.28;\n }\n\n .wide-heading-3,\n .wide-heading-3-sb,\n .wide-heading-3-lt {\n font-size: var(--font-size-6);\n font-weight: var(--font-rg);\n line-height: 1.333;\n }\n\n .wide-heading-4,\n .wide-heading-4-sb,\n .wide-heading-4-lt {\n font-size: var(--font-size-5);\n font-weight: var(--font-rg);\n line-height: 1.4;\n }\n\n .wide-body-1,\n .wide-body-1-sb {\n font-size: var(--font-size-5);\n font-weight: var(--font-rg);\n line-height: 1.4;\n }\n\n .wide-body-2,\n .wide-body-2-sb {\n font-size: var(--font-size-4);\n font-weight: var(--font-rg);\n line-height: 1.5;\n }\n\n .wide-body-3,\n .wide-body-3-sb {\n font-size: var(--font-size-3);\n font-weight: var(--font-rg);\n line-height: 1.5;\n }\n\n .wide-body-4,\n .wide-body-4-sb {\n font-size: var(--font-size-2);\n font-weight: var(--font-rg);\n letter-spacing: 0.16px;\n line-height: 1.4;\n }\n\n .wide-body-5,\n .wide-body-5-sb {\n font-size: var(--font-size-1);\n font-weight: var(--font-rg);\n letter-spacing: 0.32px;\n line-height: 1.333;\n }\n\n .wide-interactive-1,\n .wide-interactive-1-sb {\n font-size: var(--font-size-3);\n font-weight: var(--font-rg);\n line-height: 1.5;\n }\n\n .wide-interactive-2,\n .wide-interactive-2-sb {\n font-size: var(--font-size-2);\n font-weight: var(--font-rg);\n letter-spacing: 0.16px;\n line-height: 1.4;\n }\n\n .wide-interactive-3,\n .wide-interactive-3-sb {\n font-size: var(--font-size-1);\n font-weight: var(--font-rg);\n letter-spacing: 0.32px;\n line-height: 1.333;\n }\n\n .wide-section-title-1 {\n font: var(--section-title-1);\n }\n\n .wide-section-title-2 {\n font: var(--section-title-2);\n }\n\n .wide-section-title-3 {\n font: var(--section-title-3);\n }\n\n .wide-section-title-4 {\n font: var(--section-title-4);\n }\n\n .wide-section-title-5 {\n font: var(--section-title-5);\n }\n\n .wide-section-title-6 {\n font: var(--section-title-6);\n }\n\n .wide-heading-1-lt,\n .wide-heading-2-lt,\n .wide-heading-3-lt,\n .wide-heading-4-lt {\n font-weight: var(--font-lt);\n }\n\n .wide-heading-1-sb,\n .wide-heading-2-sb,\n .wide-heading-3-sb,\n .wide-heading-4-sb,\n .wide-body-1-sb,\n .wide-body-2-sb,\n .wide-body-3-sb,\n .wide-body-4-sb,\n .wide-body-5-sb,\n .wide-interactive-1-sb,\n .wide-interactive-2-sb,\n .wide-interactive-3-sb {\n font-weight: var(--font-sb);\n }\n}\n\n/ font-weight variants /\n.heading-1-lt,\n.heading-2-lt,\n.heading-3-lt,\n.heading-4-lt {\n font-weight: var(--font-lt);\n}\n\n.heading-1-sb,\n.heading-2-sb,\n.heading-3-sb,\n.heading-4-sb,\n.body-1-sb,\n.body-2-sb,\n.body-3-sb,\n.body-4-sb,\n.body-5-sb,\n.interactive-1-sb,\n.interactive-2-sb,\n.interactive-3-sb,\n.helper-sb {\n font-weight: var(--font-sb);\n}\n","button.z-link {\n padding: 0;\n border: 0;\n margin: 0;\n background-color: transparent;\n}\n\na.z-link,\nbutton.z-link {\n display: inline-flex;\n cursor: pointer;\n font-family: var(--font-family-sans);\n line-height: inherit;\n text-decoration: none;\n}\n\na.z-link.z-link-icon,\nbutton.z-link.z-link-icon {\n --z-icon-width: 1.125em;\n --z-icon-height: 1.125em;\n\n align-items: center;\n column-gap: 0.5em;\n}\n\na.z-link.z-link-sb,\nbutton.z-link.z-link-sb {\n font-weight: var(--font-sb);\n}\n\na.z-link.z-link-underline,\nbutton.z-link.z-link-underline {\n text-decoration: underline;\n}\n\na.z-link:hover,\nbutton.z-link:hover,\na.z-link:focus-visible,\nbutton.z-link:focus-visible,\na.z-link:active,\nbutton.z-link:active {\n text-decoration: underline;\n}\n\na.z-link:focus-visible,\nbutton.z-link:focus-visible {\n box-shadow: var(--shadow-focus-primary);\n outline: none;\n}\n\na.z-link.z-link-disabled,\nbutton.z-link.z-link-disabled {\n box-shadow: none;\n color: var(--color-disabled03);\n cursor: default;\n fill: var(--color-disabled03);\n outline: none;\n pointer-events: none;\n text-decoration: none;\n}\n\na.z-link,\nbutton.z-link,\na.z-link.z-link-active,\nbutton.z-link.z-link-active,\na.z-link:hover,\nbutton.z-link:hover,\na.z-link.z-link-active:hover,\nbutton.z-link.z-link-active:hover,\na.z-link:focus-visible,\nbutton.z-link:focus-visible,\na.z-link.z-link-active:focus-visible,\nbutton.z-link.z-link-active:focus-visible,\na.z-link:active,\nbutton.z-link:active,\na.z-link.z-link-active:active,\nbutton.z-link.z-link-active:active,\na.z-link:visited,\nbutton.z-link:visited,\na.z-link.z-link-active:visited,\nbutton.z-link.z-link-active:visited {\n color: var(--color-text-link-default);\n fill: var(--color-text-link-default);\n}\n\na.z-link.z-link-blue,\nbutton.z-link.z-link-blue,\na.z-link.z-link-blue.z-link-active,\nbutton.z-link.z-link-blue.z-link-active {\n color: var(--color-text-link-blue);\n fill: var(--color-text-link-blue);\n}\n\na.z-link.z-link-red,\nbutton.z-link.z-link-red,\na.z-link.z-link-red.z-link-active,\nbutton.z-link.z-link-red.z-link-active {\n color: var(--color-text-link-red);\n fill: var(--color-text-link-red);\n}\n\na.z-link.z-link-inverse,\nbutton.z-link.z-link-inverse,\na.z-link.z-link-inverse.z-link-active,\nbutton.z-link.z-link-inverse.z-link-active {\n color: var(--color-text-link-inverse);\n fill: var(--color-text-link-inverse);\n}\n\na.z-link.z-link-blue:hover,\nbutton.z-link.z-link-blue:hover {\n color: var(--color-text-link-blue-hover);\n fill: var(--color-text-link-blue-hover);\n}\n\na.z-link.z-link-red:hover,\nbutton.z-link.z-link-red:hover {\n color: var(--color-text-link-red-hover);\n fill: var(--color-text-link-red-hover);\n}\n\na.z-link.z-link-inverse:hover,\nbutton.z-link.z-link-inverse:hover {\n color: var(--color-text-link-inverse);\n fill: var(--color-text-link-inverse);\n}\n\na.z-link.z-link-blue:active,\nbutton.z-link.z-link-blue:active,\na.z-link.z-link-blue:focus-visible,\nbutton.z-link.z-link-blue:focus-visible {\n color: var(--color-text-link-blue-active);\n fill: var(--color-text-link-blue-active);\n}\n\na.z-link.z-link-red:active,\nbutton.z-link.z-link-red:active,\na.z-link.z-link-red:focus-visible,\nbutton.z-link.z-link-red:focus-visible {\n color: var(--color-text-link-red-active);\n fill: var(--color-text-link-red-active);\n}\n\na.z-link.z-link-inverse:active,\nbutton.z-link.z-link-inverse:active,\na.z-link.z-link-inverse:focus-visible,\nbutton.z-link.z-link-inverse:focus-visible {\n color: var(--color-text-link-inverse);\n fill: var(--color-text-link-inverse);\n}\n\na.z-link.z-link-blue:visited,\nbutton.z-link.z-link-blue:visited {\n color: var(--color-text-link-blue-visited);\n fill: var(--color-text-link-blue-visited);\n}\n\na.z-link.z-link-red:visited,\nbutton.z-link.z-link-red:visited {\n color: var(--color-text-link-red-visited);\n fill: var(--color-text-link-red-visited);\n}\n\na.z-link.z-link-inverse:visited,\nbutton.z-link.z-link-inverse:visited {\n color: var(--color-text-link-inverse);\n fill: var(--color-text-link-inverse);\n}\n","import {Component, Element, Event, EventEmitter, Host, Prop, h} from \"@stencil/core\";\nimport {BookCardVariant, ControlSize} from \"../../../beans\";\n\n/\n @slot cta - Top right cta (e.g. bookmark icon)\n * @slot ebook - As default, it shows laZ ebook link\n * @slot tags - Tags section, default empty\n * @slot data - External link and pill, default empty\n * @slot apps - List of card-related apps, default empty\n * @slot coverOverlay - Content to be displayed in the `z-book-cover` component slot\n * @cssprop --z-book-card-portrait-cover-height - Set custom cover height for portrait variant - Default: `378px`\n * @cssprop --z-book-card-title-lines - Set title avilable lines - Default: `2`\n * @cssprop --z-book-card-title-word-break - Set title word-break rule - Default: `initial`\n * @cssprop --z-book-card-subtitle-lines - Set subtitle available lines - Default: `1`\n * @cssprop --z-book-card-subtitle-word-break - Set subtitle word-break rule - Default: `break-all`\n * @cssprop --z-book-card-authors-lines - Set authors available lines - Default: `1`\n * @cssprop --z-book-card-authors-word-break - Set authors word-break rule - Default: `break-all`\n /\n@Component({\n tag: \"z-book-card\",\n styleUrls: [\"styles.css\", \"../../../tokens/typography.css\", \"../../css-components/z-link/styles.css\"],\n shadow: true,\n})\nexport class ZBookCard {\n @Element() hostElement: HTMLZBookCardElement;\n\n /* Card variant: landscape, portrait /\n @Prop({reflect: true})\n variant: BookCardVariant = BookCardVariant.PORTRAIT;\n\n /* Cover URL /\n @Prop()\n cover: string;\n\n /* Opera title (card title) /\n @Prop()\n operaTitle: string;\n\n /* [optional] Volume title (card subvolume) /\n @Prop()\n volumeTitle?: string;\n\n /* [optional] Authors /\n @Prop()\n authors?: string;\n\n /* [optional] Main ISBN /\n @Prop()\n isbn?: string;\n\n /* [optional] ISBN label /\n @Prop()\n isbnLabel = \"\";\n\n /* [optional] year /\n @Prop()\n year?: string;\n\n /* [optional] Link to the ebook resource. Creates a link also around the cover and title. /\n @Prop()\n ebookUrl?: string;\n\n /* [optional] Value for the `target` attribute of the links created by `ebookUrl` prop. /\n @Prop()\n linkTarget = \"_blank\";\n\n /* [optional] Fallback cover URL. /\n @Prop()\n fallbackCover?: string;\n\n /* Whether to show a stack of covers to represent multiple books (only for `portrait` variant). /\n @Prop()\n hasMultipleCovers = false;\n\n /* [optional] Set a specific heading level as html tag for the title. /\n @Prop()\n titleHtmlTag?: string;\n\n /* click on ebook link /\n @Event()\n ebookClick: EventEmitter;\n\n /* click on cover link /\n @Event()\n coverClick: EventEmitter;\n\n /* click on title link */\n @Event()\n titleClick: EventEmitter;\n\n private emitEbookClick(): void {\n this.ebookClick.emit();\n }\n\n private emitCoverClick(): void {\n this.coverClick.emit();\n }\n\n private emitTitleClick(): void {\n this.titleClick.emit();\n }\n\n private renderCover(): HTMLDivElement {\n const CoverTag = this.ebookUrl ? \"a\" : \"div\";\n const coverAttrs = this.ebookUrl\n ? {\n href: this.ebookUrl,\n onClick: () => this.emitCoverClick(),\n target: this.linkTarget,\n }\n : {};\n\n return (\n <CoverTag\n class=\"cover\"\n {...coverAttrs}\n >\n <z-book-cover\n cover={this.cover}\n fallbackCover={this.fallbackCover}\n multiple={this.hasMultipleCovers && this.variant === BookCardVariant.PORTRAIT}\n >\n <slot\n name=\"coverOverlay\"\n slot=\"coverOverlay\"\n ></slot>\n </z-book-cover>\n </CoverTag>\n );\n }\n\n private renderYear(): null \| HTMLDivElement {\n if (!this.year) {\n return null;\n }\n\n return (\n <div\n class=\"year ellipsis body-4\"\n aria-description=\"anno\"\n >\n {this.year}\n </div>\n );\n }\n\n private renderAuthors(): null \| HTMLDivElement {\n if (!this.authors) {\n return null;\n }\n\n return (\n <div class=\"cta-wrapper\">\n <div\n class=\"authors ellipsis body-4\"\n aria-description=\"autori\"\n >\n {this.authors}\n </div>\n {this.variant === BookCardVariant.LANDSCAPE ? this.renderCtaSlot() : null}\n </div>\n );\n }\n\n private renderOperaTitle(): HTMLDivElement {\n const title = this.titleHtmlTag\n ? `<${this.titleHtmlTag}>${this.operaTitle}</${this.titleHtmlTag}>`\n : this.operaTitle;\n\n const operaTitle = (\n <div\n class=\"opera-title ellipsis body-2-sb\"\n innerHTML={title}\n />\n );\n\n return (\n <div class=\"cta-wrapper\">\n {this.ebookUrl ? (\n <a\n class=\"z-link\"\n href={this.ebookUrl}\n onClick={() => this.emitTitleClick()}\n target={this.linkTarget}\n >\n {operaTitle}\n </a>\n ) : (\n operaTitle\n )}\n {this.variant === BookCardVariant.PORTRAIT ? this.renderCtaSlot() : null}\n </div>\n );\n }\n\n private renderVolumeTitle(): null \| HTMLDivElement {\n if (!this.volumeTitle) {\n return null;\n }\n\n return <div class=\"volume-title ellipsis body-4\">{this.volumeTitle}</div>;\n }\n\n private renderIsbn(): null \| HTMLDivElement {\n if (!this.isbn) {\n return null;\n }\n\n return (\n <div\n class=\"isbn ellipsis body-4-sb\"\n aria-description={`isbn ${this.isbnLabel}`}\n >\n {this.isbn} {this.isbnLabel ? <span class=\"body-4\">{this.isbnLabel}</span> : null}\n </div>\n );\n }\n\n private renderEbook(): HTMLDivElement {\n return (\n <div class=\"ebook\">\n <div class=\"app-name\">\n <img\n class=\"ebook-logo\"\n aria-hidden=\"true\"\n />\n <div class=\"body-4-sb\">laZ Ebook</div>\n </div>\n <z-button\n size={ControlSize.X_SMALL}\n href={this.ebookUrl}\n target={this.linkTarget}\n onClick={() => this.emitEbookClick()}\n htmlrole=\"link\"\n aria-description={`leggi l'ebook ${this.operaTitle} su laZ Ebook`}\n >\n leggi ebook\n </z-button>\n </div>\n );\n }\n\n private renderCtaSlot(): HTMLSlotElement {\n return <slot name=\"cta\"></slot>;\n }\n\n render(): HTMLZBookCardElement {\n return (\n <Host>\n <div class=\"main-content\">\n {this.renderCover()}\n <div class=\"card-info\">\n <div class=\"top\">\n <div>\n {this.renderYear()}\n {this.renderAuthors()}\n {this.renderOperaTitle()}\n {this.renderVolumeTitle()}\n {this.renderIsbn()}\n </div>\n <slot name=\"tags\"></slot>\n <slot name=\"data\"></slot>\n </div>\n <slot name=\"ebook\">{!!this.ebookUrl && <div class=\"bottom\">{this.renderEbook()}</div>}</slot>\n </div>\n </div>\n <slot name=\"apps\"></slot>\n </Host>\n );\n }\n}\n"],"version":3}