@zanichelli/albe-web-components 17.0.0-RC3 → 17.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +13 -0
- package/dist/cjs/{index-0b5e5c05.js → index-141d598e.js} +2 -2
- package/dist/cjs/index-141d598e.js.map +1 -0
- package/dist/cjs/{index-47d0257d.js → index-4b1d6599.js} +2 -2
- package/dist/cjs/index-4b1d6599.js.map +1 -0
- package/dist/cjs/{index-15cb0816.js → index-e2718c94.js} +3 -3
- package/dist/cjs/index-e2718c94.js.map +1 -0
- package/dist/cjs/z-anchor-navigation.cjs.entry.js +1 -1
- package/dist/cjs/z-anchor-navigation.cjs.entry.js.map +1 -1
- package/dist/cjs/z-app-header_12.cjs.entry.js +15 -3
- package/dist/cjs/z-app-header_12.cjs.entry.js.map +1 -1
- package/dist/cjs/z-book-card-app.cjs.entry.js +3 -3
- package/dist/cjs/z-book-card-app.cjs.entry.js.map +1 -1
- package/dist/cjs/z-book-card-deprecated.cjs.entry.js +1 -1
- package/dist/cjs/z-book-card-deprecated.cjs.entry.js.map +1 -1
- package/dist/cjs/z-book-card.cjs.entry.js +3 -3
- package/dist/cjs/z-book-card.cjs.entry.js.map +1 -1
- package/dist/cjs/z-breadcrumb.cjs.entry.js +1 -1
- package/dist/cjs/z-breadcrumb.cjs.entry.js.map +1 -1
- package/dist/cjs/z-combobox.cjs.entry.js +1 -1
- package/dist/cjs/z-combobox.cjs.entry.js.map +1 -1
- package/dist/cjs/z-dragdrop-area_2.cjs.entry.js +6 -12
- package/dist/cjs/z-dragdrop-area_2.cjs.entry.js.map +1 -1
- package/dist/cjs/z-file-upload.cjs.entry.js +1 -1
- package/dist/cjs/z-file-upload.cjs.entry.js.map +1 -1
- package/dist/cjs/z-ghost-loading.cjs.entry.js +1 -1
- package/dist/cjs/z-ghost-loading.cjs.entry.js.map +1 -1
- package/dist/cjs/z-myz-card-alert.cjs.entry.js +1 -1
- package/dist/cjs/z-myz-card-alert.cjs.entry.js.map +1 -1
- package/dist/cjs/z-myz-card-info.cjs.entry.js +1 -1
- package/dist/cjs/z-myz-card-info.cjs.entry.js.map +1 -1
- package/dist/cjs/z-myz-card_4.cjs.entry.js +2 -2
- package/dist/cjs/z-myz-card_4.cjs.entry.js.map +1 -1
- package/dist/cjs/z-navigation-tabs.cjs.entry.js +1 -1
- package/dist/cjs/z-navigation-tabs.cjs.entry.js.map +1 -1
- package/dist/cjs/z-panel-elem.cjs.entry.js +3 -2
- package/dist/cjs/z-panel-elem.cjs.entry.js.map +1 -1
- package/dist/cjs/z-skip-to-content.cjs.entry.js +1 -2
- package/dist/cjs/z-skip-to-content.cjs.entry.js.map +1 -1
- package/dist/cjs/z-slideshow.cjs.entry.js +1 -1
- package/dist/cjs/z-slideshow.cjs.entry.js.map +1 -1
- package/dist/cjs/z-table.cjs.entry.js +3 -3
- package/dist/cjs/z-th.cjs.entry.js +1 -1
- package/dist/cjs/z-thead.cjs.entry.js +1 -1
- package/dist/cjs/z-tr.cjs.entry.js +2 -2
- package/dist/collection/components/book-card/z-book-card/index.js +1 -1
- package/dist/collection/components/book-card/z-book-card/index.js.map +1 -1
- package/dist/collection/components/book-card/z-book-card/index.stories.js +6 -6
- package/dist/collection/components/book-card/z-book-card/index.stories.js.map +1 -1
- package/dist/collection/components/book-card/z-book-card/styles.css +1 -0
- package/dist/collection/components/book-card/z-book-card-app/index.js +6 -1
- package/dist/collection/components/book-card/z-book-card-app/index.js.map +1 -1
- package/dist/collection/components/book-card/z-book-card-app/index.stories.js +13 -1
- package/dist/collection/components/book-card/z-book-card-app/index.stories.js.map +1 -1
- package/dist/collection/components/book-card/z-book-card-app/styles.css +2 -1
- package/dist/collection/components/css-components/z-link/index.stories.js +5 -6
- package/dist/collection/components/css-components/z-link/index.stories.js.map +1 -1
- package/dist/collection/components/css-components/z-link/styles.css +101 -107
- package/dist/collection/components/deprecated/z-book-card-deprecated/index.stories.js +3 -3
- package/dist/collection/components/deprecated/z-book-card-deprecated/index.stories.js.map +1 -1
- package/dist/collection/components/deprecated/z-book-card-deprecated/styles.css +2 -2
- package/dist/collection/components/file-upload/z-dragdrop-area/styles.css +2 -2
- package/dist/collection/components/file-upload/z-file-upload/styles.css +1 -1
- package/dist/collection/components/list/z-list-element/styles.css +2 -2
- package/dist/collection/components/table/cells/z-th/styles.css +1 -1
- package/dist/collection/components/table/z-thead/styles.css +1 -1
- package/dist/collection/components/table/z-tr/styles.css +1 -1
- package/dist/collection/components/z-anchor-navigation/styles.css +2 -2
- package/dist/collection/components/z-breadcrumb/styles.css +4 -4
- package/dist/collection/components/z-combobox/styles.css +2 -2
- package/dist/collection/components/z-ghost-loading/styles.css +3 -3
- package/dist/collection/components/z-input/styles.css +2 -2
- package/dist/collection/components/z-modal/index.js +4 -10
- package/dist/collection/components/z-modal/index.js.map +1 -1
- package/dist/collection/components/z-modal/styles.css +1 -1
- package/dist/collection/components/z-navigation-tabs/styles.css +1 -1
- package/dist/collection/components/z-panel-elem/index.js +3 -2
- package/dist/collection/components/z-panel-elem/index.js.map +1 -1
- package/dist/collection/components/z-searchbar/styles.css +1 -1
- package/dist/collection/components/z-skip-to-content/index.js +1 -2
- package/dist/collection/components/z-skip-to-content/index.js.map +1 -1
- package/dist/collection/constants/iconset.js +12 -0
- package/dist/collection/constants/iconset.js.map +1 -1
- package/dist/collection/snowflakes/myz/card/z-myz-card/styles.css +1 -1
- package/dist/collection/snowflakes/myz/card/z-myz-card-alert/styles.css +1 -1
- package/dist/collection/snowflakes/myz/card/z-myz-card-header/styles.css +1 -1
- package/dist/collection/snowflakes/myz/card/z-myz-card-info/styles.css +1 -1
- package/dist/collection/snowflakes/myz/z-slideshow/styles.css +2 -2
- package/dist/components/iconset.js +12 -0
- package/dist/components/iconset.js.map +1 -1
- package/dist/components/index11.js +1 -1
- package/dist/components/index11.js.map +1 -1
- package/dist/components/index14.js +1 -1
- package/dist/components/index14.js.map +1 -1
- package/dist/components/index16.js +5 -11
- package/dist/components/index16.js.map +1 -1
- package/dist/components/index17.js +1 -1
- package/dist/components/index17.js.map +1 -1
- package/dist/components/index20.js +1 -1
- package/dist/components/index20.js.map +1 -1
- package/dist/components/index24.js +1 -1
- package/dist/components/index24.js.map +1 -1
- package/dist/components/index7.js +1 -1
- package/dist/components/index7.js.map +1 -1
- package/dist/components/index8.js +1 -1
- package/dist/components/index8.js.map +1 -1
- package/dist/components/z-anchor-navigation.js +1 -1
- package/dist/components/z-anchor-navigation.js.map +1 -1
- package/dist/components/z-book-card-app.js +3 -3
- package/dist/components/z-book-card-app.js.map +1 -1
- package/dist/components/z-book-card-deprecated.js +1 -1
- package/dist/components/z-book-card-deprecated.js.map +1 -1
- package/dist/components/z-book-card.js +3 -3
- package/dist/components/z-book-card.js.map +1 -1
- package/dist/components/z-breadcrumb.js +1 -1
- package/dist/components/z-breadcrumb.js.map +1 -1
- package/dist/components/z-combobox.js +1 -1
- package/dist/components/z-combobox.js.map +1 -1
- package/dist/components/z-file-upload.js +1 -1
- package/dist/components/z-file-upload.js.map +1 -1
- package/dist/components/z-myz-card-alert.js +1 -1
- package/dist/components/z-myz-card-alert.js.map +1 -1
- package/dist/components/z-myz-card-info.js +1 -1
- package/dist/components/z-myz-card-info.js.map +1 -1
- package/dist/components/z-navigation-tabs.js +1 -1
- package/dist/components/z-navigation-tabs.js.map +1 -1
- package/dist/components/z-panel-elem.js +3 -2
- package/dist/components/z-panel-elem.js.map +1 -1
- package/dist/components/z-skip-to-content.js +1 -2
- package/dist/components/z-skip-to-content.js.map +1 -1
- package/dist/components/z-slideshow.js +1 -1
- package/dist/components/z-slideshow.js.map +1 -1
- package/dist/components/z-th.js +1 -1
- package/dist/components/z-th.js.map +1 -1
- package/dist/components/z-thead.js +1 -1
- package/dist/components/z-thead.js.map +1 -1
- package/dist/components/z-tr.js +1 -1
- package/dist/components/z-tr.js.map +1 -1
- package/dist/docs/themes/index.stories.js +1 -1
- package/dist/docs/themes/index.stories.js.map +1 -1
- package/dist/esm/{index-13d1f531.js → index-03fd6621.js} +3 -3
- package/dist/esm/index-03fd6621.js.map +1 -0
- package/dist/esm/{index-f372e39c.js → index-2e00cecb.js} +2 -2
- package/{www/build/p-72bfc9d0.js.map → dist/esm/index-2e00cecb.js.map} +1 -1
- package/dist/esm/{index-a71eb5f5.js → index-bcd128c9.js} +2 -2
- package/dist/esm/index-bcd128c9.js.map +1 -0
- package/dist/esm/z-anchor-navigation.entry.js +1 -1
- package/dist/esm/z-anchor-navigation.entry.js.map +1 -1
- package/dist/esm/z-app-header_12.entry.js +15 -3
- package/dist/esm/z-app-header_12.entry.js.map +1 -1
- package/dist/esm/z-book-card-app.entry.js +3 -3
- package/dist/esm/z-book-card-app.entry.js.map +1 -1
- package/dist/esm/z-book-card-deprecated.entry.js +1 -1
- package/dist/esm/z-book-card-deprecated.entry.js.map +1 -1
- package/dist/esm/z-book-card.entry.js +3 -3
- package/dist/esm/z-book-card.entry.js.map +1 -1
- package/dist/esm/z-breadcrumb.entry.js +1 -1
- package/dist/esm/z-breadcrumb.entry.js.map +1 -1
- package/dist/esm/z-combobox.entry.js +1 -1
- package/dist/esm/z-combobox.entry.js.map +1 -1
- package/dist/esm/z-dragdrop-area_2.entry.js +6 -12
- package/dist/esm/z-dragdrop-area_2.entry.js.map +1 -1
- package/dist/esm/z-file-upload.entry.js +1 -1
- package/dist/esm/z-file-upload.entry.js.map +1 -1
- package/dist/esm/z-ghost-loading.entry.js +1 -1
- package/dist/esm/z-ghost-loading.entry.js.map +1 -1
- package/dist/esm/z-myz-card-alert.entry.js +1 -1
- package/dist/esm/z-myz-card-alert.entry.js.map +1 -1
- package/dist/esm/z-myz-card-info.entry.js +1 -1
- package/dist/esm/z-myz-card-info.entry.js.map +1 -1
- package/dist/esm/z-myz-card_4.entry.js +2 -2
- package/dist/esm/z-myz-card_4.entry.js.map +1 -1
- package/dist/esm/z-navigation-tabs.entry.js +1 -1
- package/dist/esm/z-navigation-tabs.entry.js.map +1 -1
- package/dist/esm/z-panel-elem.entry.js +3 -2
- package/dist/esm/z-panel-elem.entry.js.map +1 -1
- package/dist/esm/z-skip-to-content.entry.js +1 -2
- package/dist/esm/z-skip-to-content.entry.js.map +1 -1
- package/dist/esm/z-slideshow.entry.js +1 -1
- package/dist/esm/z-slideshow.entry.js.map +1 -1
- package/dist/esm/z-table.entry.js +3 -3
- package/dist/esm/z-th.entry.js +1 -1
- package/dist/esm/z-thead.entry.js +1 -1
- package/dist/esm/z-tr.entry.js +2 -2
- package/dist/types/components/book-card/z-book-card-app/index.d.ts +5 -0
- package/dist/types/components/book-card/z-book-card-app/index.stories.d.ts +19 -2
- package/dist/types/components/css-components/z-link/index.stories.d.ts +0 -1
- package/dist/types/components/z-modal/index.d.ts +0 -1
- package/dist/types/components.d.ts +20 -0
- package/dist/types/constants/iconset.d.ts +24 -0
- package/dist/web-components-library/p-2c6519dc.entry.js +2 -0
- package/dist/web-components-library/{p-5365f354.entry.js → p-2dbbc58f.entry.js} +2 -2
- package/dist/web-components-library/{p-5365f354.entry.js.map → p-2dbbc58f.entry.js.map} +1 -1
- package/dist/web-components-library/p-2f486acc.entry.js +2 -0
- package/dist/web-components-library/p-2f486acc.entry.js.map +1 -0
- package/dist/web-components-library/p-382e2939.entry.js +2 -0
- package/dist/web-components-library/p-4629a66a.entry.js +2 -0
- package/dist/web-components-library/p-4629a66a.entry.js.map +1 -0
- package/dist/web-components-library/p-479b13ae.entry.js +2 -0
- package/dist/web-components-library/p-479b13ae.entry.js.map +1 -0
- package/dist/web-components-library/p-612da2d0.entry.js +2 -0
- package/dist/web-components-library/p-612da2d0.entry.js.map +1 -0
- package/dist/web-components-library/p-65f1b68b.entry.js +2 -0
- package/dist/web-components-library/p-65f1b68b.entry.js.map +1 -0
- package/dist/web-components-library/p-72618fde.entry.js +2 -0
- package/dist/web-components-library/p-72618fde.entry.js.map +1 -0
- package/dist/web-components-library/p-76d8d404.entry.js +2 -0
- package/dist/web-components-library/p-76d8d404.entry.js.map +1 -0
- package/dist/web-components-library/p-7d844bac.entry.js +2 -0
- package/dist/web-components-library/p-7d844bac.entry.js.map +1 -0
- package/dist/web-components-library/p-7db32c12.entry.js +2 -0
- package/dist/web-components-library/p-7db32c12.entry.js.map +1 -0
- package/dist/web-components-library/p-8b627bff.entry.js +2 -0
- package/dist/web-components-library/p-8b627bff.entry.js.map +1 -0
- package/dist/web-components-library/p-8d79971b.entry.js +2 -0
- package/dist/web-components-library/p-8d79971b.entry.js.map +1 -0
- package/dist/web-components-library/p-90d54c40.js +2 -0
- package/dist/web-components-library/p-90d54c40.js.map +1 -0
- package/dist/web-components-library/p-9e183204.entry.js +2 -0
- package/dist/web-components-library/p-9e183204.entry.js.map +1 -0
- package/dist/web-components-library/p-a707640a.entry.js +2 -0
- package/dist/web-components-library/p-a707640a.entry.js.map +1 -0
- package/dist/web-components-library/p-b896dcf7.entry.js +2 -0
- package/dist/web-components-library/{p-589f4f48.entry.js → p-c0588dbe.entry.js} +2 -2
- package/dist/web-components-library/{p-166ea39f.entry.js → p-cc87d814.entry.js} +2 -2
- package/dist/web-components-library/{p-166ea39f.entry.js.map → p-cc87d814.entry.js.map} +1 -1
- package/dist/web-components-library/p-cd55204b.js +2 -0
- package/dist/web-components-library/p-cd55204b.js.map +1 -0
- package/dist/web-components-library/{p-8be628c6.entry.js → p-e9149664.entry.js} +2 -2
- package/dist/web-components-library/{p-8be628c6.entry.js.map → p-e9149664.entry.js.map} +1 -1
- package/dist/web-components-library/p-ec4d7f60.js +2 -0
- package/dist/web-components-library/p-ec4d7f60.js.map +1 -0
- package/dist/web-components-library/p-efe1de34.entry.js +2 -0
- package/dist/web-components-library/p-efe1de34.entry.js.map +1 -0
- package/dist/web-components-library/web-components-library.css +171 -144
- package/dist/web-components-library/web-components-library.esm.js +1 -1
- package/package.json +1 -1
- package/www/build/p-2c6519dc.entry.js +2 -0
- package/www/build/{p-5365f354.entry.js → p-2dbbc58f.entry.js} +2 -2
- package/www/build/{p-5365f354.entry.js.map → p-2dbbc58f.entry.js.map} +1 -1
- package/www/build/p-2f486acc.entry.js +2 -0
- package/www/build/p-2f486acc.entry.js.map +1 -0
- package/www/build/p-382e2939.entry.js +2 -0
- package/www/build/p-4629a66a.entry.js +2 -0
- package/www/build/p-4629a66a.entry.js.map +1 -0
- package/www/build/p-479b13ae.entry.js +2 -0
- package/www/build/p-479b13ae.entry.js.map +1 -0
- package/www/build/{p-d9dbe303.css → p-4c358c38.css} +171 -144
- package/www/build/p-612da2d0.entry.js +2 -0
- package/www/build/p-612da2d0.entry.js.map +1 -0
- package/www/build/p-65f1b68b.entry.js +2 -0
- package/www/build/p-65f1b68b.entry.js.map +1 -0
- package/www/build/p-72618fde.entry.js +2 -0
- package/www/build/p-72618fde.entry.js.map +1 -0
- package/www/build/p-76d8d404.entry.js +2 -0
- package/www/build/p-76d8d404.entry.js.map +1 -0
- package/www/build/p-7d844bac.entry.js +2 -0
- package/www/build/p-7d844bac.entry.js.map +1 -0
- package/www/build/p-7db32c12.entry.js +2 -0
- package/www/build/p-7db32c12.entry.js.map +1 -0
- package/www/build/p-8b627bff.entry.js +2 -0
- package/www/build/p-8b627bff.entry.js.map +1 -0
- package/www/build/p-8d79971b.entry.js +2 -0
- package/www/build/p-8d79971b.entry.js.map +1 -0
- package/www/build/p-90d54c40.js +2 -0
- package/www/build/p-90d54c40.js.map +1 -0
- package/www/build/p-9e183204.entry.js +2 -0
- package/www/build/p-9e183204.entry.js.map +1 -0
- package/www/build/p-a707640a.entry.js +2 -0
- package/www/build/p-a707640a.entry.js.map +1 -0
- package/www/build/p-b896dcf7.entry.js +2 -0
- package/www/build/{p-589f4f48.entry.js → p-c0588dbe.entry.js} +2 -2
- package/www/build/{p-93642961.js → p-c9e50d51.js} +1 -1
- package/www/build/{p-166ea39f.entry.js → p-cc87d814.entry.js} +2 -2
- package/www/build/{p-166ea39f.entry.js.map → p-cc87d814.entry.js.map} +1 -1
- package/www/build/p-cd55204b.js +2 -0
- package/www/build/p-cd55204b.js.map +1 -0
- package/www/build/{p-8be628c6.entry.js → p-e9149664.entry.js} +2 -2
- package/www/build/{p-8be628c6.entry.js.map → p-e9149664.entry.js.map} +1 -1
- package/www/build/p-ec4d7f60.js +2 -0
- package/www/build/p-ec4d7f60.js.map +1 -0
- package/www/build/p-efe1de34.entry.js +2 -0
- package/www/build/p-efe1de34.entry.js.map +1 -0
- package/www/build/web-components-library.css +171 -144
- package/www/build/web-components-library.esm.js +1 -1
- package/www/index.html +1 -1
- package/www/pages/book-cards.html +11 -5
- package/dist/cjs/index-0b5e5c05.js.map +0 -1
- package/dist/cjs/index-15cb0816.js.map +0 -1
- package/dist/cjs/index-47d0257d.js.map +0 -1
- package/dist/esm/index-13d1f531.js.map +0 -1
- package/dist/esm/index-a71eb5f5.js.map +0 -1
- package/dist/esm/index-f372e39c.js.map +0 -1
- package/dist/web-components-library/p-0d966ad0.js +0 -2
- package/dist/web-components-library/p-0d966ad0.js.map +0 -1
- package/dist/web-components-library/p-1a297fb0.entry.js +0 -2
- package/dist/web-components-library/p-1db926ff.entry.js +0 -2
- package/dist/web-components-library/p-1db926ff.entry.js.map +0 -1
- package/dist/web-components-library/p-372d3d61.entry.js +0 -2
- package/dist/web-components-library/p-372d3d61.entry.js.map +0 -1
- package/dist/web-components-library/p-3be73d77.entry.js +0 -2
- package/dist/web-components-library/p-3be73d77.entry.js.map +0 -1
- package/dist/web-components-library/p-5b677d6c.entry.js +0 -2
- package/dist/web-components-library/p-5b677d6c.entry.js.map +0 -1
- package/dist/web-components-library/p-63806f4f.entry.js +0 -2
- package/dist/web-components-library/p-63806f4f.entry.js.map +0 -1
- package/dist/web-components-library/p-7049aef2.entry.js +0 -2
- package/dist/web-components-library/p-7049aef2.entry.js.map +0 -1
- package/dist/web-components-library/p-72af7932.entry.js +0 -2
- package/dist/web-components-library/p-72bfc9d0.js +0 -2
- package/dist/web-components-library/p-72bfc9d0.js.map +0 -1
- package/dist/web-components-library/p-72f77ee8.entry.js +0 -2
- package/dist/web-components-library/p-767b66ca.entry.js +0 -2
- package/dist/web-components-library/p-767b66ca.entry.js.map +0 -1
- package/dist/web-components-library/p-814f09df.entry.js +0 -2
- package/dist/web-components-library/p-814f09df.entry.js.map +0 -1
- package/dist/web-components-library/p-8b94f31a.entry.js +0 -2
- package/dist/web-components-library/p-8b94f31a.entry.js.map +0 -1
- package/dist/web-components-library/p-8e203650.entry.js +0 -2
- package/dist/web-components-library/p-8e203650.entry.js.map +0 -1
- package/dist/web-components-library/p-af9df838.entry.js +0 -2
- package/dist/web-components-library/p-af9df838.entry.js.map +0 -1
- package/dist/web-components-library/p-b5b0ffb6.entry.js +0 -2
- package/dist/web-components-library/p-b5b0ffb6.entry.js.map +0 -1
- package/dist/web-components-library/p-e1ed2ecb.js +0 -2
- package/dist/web-components-library/p-e1ed2ecb.js.map +0 -1
- package/dist/web-components-library/p-e7ed034e.entry.js +0 -2
- package/dist/web-components-library/p-e7ed034e.entry.js.map +0 -1
- package/dist/web-components-library/p-e945ed47.entry.js +0 -2
- package/dist/web-components-library/p-e945ed47.entry.js.map +0 -1
- package/www/build/p-0d966ad0.js +0 -2
- package/www/build/p-0d966ad0.js.map +0 -1
- package/www/build/p-1a297fb0.entry.js +0 -2
- package/www/build/p-1db926ff.entry.js +0 -2
- package/www/build/p-1db926ff.entry.js.map +0 -1
- package/www/build/p-372d3d61.entry.js +0 -2
- package/www/build/p-372d3d61.entry.js.map +0 -1
- package/www/build/p-3be73d77.entry.js +0 -2
- package/www/build/p-3be73d77.entry.js.map +0 -1
- package/www/build/p-5b677d6c.entry.js +0 -2
- package/www/build/p-5b677d6c.entry.js.map +0 -1
- package/www/build/p-63806f4f.entry.js +0 -2
- package/www/build/p-63806f4f.entry.js.map +0 -1
- package/www/build/p-7049aef2.entry.js +0 -2
- package/www/build/p-7049aef2.entry.js.map +0 -1
- package/www/build/p-72af7932.entry.js +0 -2
- package/www/build/p-72bfc9d0.js +0 -2
- package/www/build/p-72f77ee8.entry.js +0 -2
- package/www/build/p-767b66ca.entry.js +0 -2
- package/www/build/p-767b66ca.entry.js.map +0 -1
- package/www/build/p-814f09df.entry.js +0 -2
- package/www/build/p-814f09df.entry.js.map +0 -1
- package/www/build/p-8b94f31a.entry.js +0 -2
- package/www/build/p-8b94f31a.entry.js.map +0 -1
- package/www/build/p-8e203650.entry.js +0 -2
- package/www/build/p-8e203650.entry.js.map +0 -1
- package/www/build/p-af9df838.entry.js +0 -2
- package/www/build/p-af9df838.entry.js.map +0 -1
- package/www/build/p-b5b0ffb6.entry.js +0 -2
- package/www/build/p-b5b0ffb6.entry.js.map +0 -1
- package/www/build/p-e1ed2ecb.js +0 -2
- package/www/build/p-e1ed2ecb.js.map +0 -1
- package/www/build/p-e7ed034e.entry.js +0 -2
- package/www/build/p-e7ed034e.entry.js.map +0 -1
- package/www/build/p-e945ed47.entry.js +0 -2
- package/www/build/p-e945ed47.entry.js.map +0 -1
- /package/dist/web-components-library/{p-1a297fb0.entry.js.map → p-2c6519dc.entry.js.map} +0 -0
- /package/dist/web-components-library/{p-72af7932.entry.js.map → p-382e2939.entry.js.map} +0 -0
- /package/dist/web-components-library/{p-72f77ee8.entry.js.map → p-b896dcf7.entry.js.map} +0 -0
- /package/dist/web-components-library/{p-589f4f48.entry.js.map → p-c0588dbe.entry.js.map} +0 -0
- /package/www/build/{p-1a297fb0.entry.js.map → p-2c6519dc.entry.js.map} +0 -0
- /package/www/build/{p-72af7932.entry.js.map → p-382e2939.entry.js.map} +0 -0
- /package/www/build/{p-72f77ee8.entry.js.map → p-b896dcf7.entry.js.map} +0 -0
- /package/www/build/{p-589f4f48.entry.js.map → p-c0588dbe.entry.js.map} +0 -0
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["stylesCss","ZBookCardAppStyle0","ZBookCardAppStyle1","typographyCss","ZBookCardAppStyle2","ZBookCardApp","emitAppClick","this","appClick","emit","renderLaz","laz","h","class","render","key","href","link","name","onClick","target","logo","src","alt","info","icon","size","ControlSize","X_SMALL","position","InfoRevealPosition","TOP_RIGHT","width","height","fill"],"sources":["src/components/book-card/z-book-card-app/styles.css?tag=z-book-card-app&encapsulation=shadow","src/components/css-components/z-link/styles.css?tag=z-book-card-app&encapsulation=shadow","src/tokens/typography.css?tag=z-book-card-app&encapsulation=shadow","src/components/book-card/z-book-card-app/index.tsx"],"sourcesContent":[":host {\n display: block;\n width: inherit;\n min-width: 300px;\n height: inherit;\n min-height: 32px;\n background-color: var(--color-surface01);\n}\n\n:host > div {\n display: flex;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n align-items: center;\n justify-content: space-between;\n padding: var(--space-unit) calc(var(--space-unit) * 1.5);\n gap: calc(var(--space-unit) * 2);\n}\n\n:host > div .app {\n display: flex;\n flex: 1;\n align-items: center;\n gap: var(--space-unit);\n}\n\n:host > div .app.z-link {\n color: inherit;\n text-decoration: none;\n}\n\n:host > div .app.z-link:focus {\n text-decoration: none;\n}\n\n:host > div .app img {\n width: 24px;\n height: 24px;\n}\n\n:host > div .app .name {\n display: -webkit-box;\n overflow: hidden;\n height: 20px;\n -webkit-box-orient: vertical;\n font-family: var(--font-family-serif);\n -webkit-line-clamp: 1;\n line-clamp: 1;\n text-overflow: ellipsis;\n}\n\n:host > div .app .name .laz {\n color: var(--red500);\n}\n\n:host > div z-info-reveal {\n --z-info-reveal-panel-width: 250px;\n\n font-family: var(--font-family-sans);\n\n --color-surface05: var(--color-surface01);\n --color-text-inverse: var(--color-default-text);\n --color-inverse-icon: var(--color-primary01);\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 color: var(--color-link-primary);\n cursor: pointer;\n fill: var(--color-link-primary);\n font-family: var(--font-family-sans);\n line-height: inherit;\n text-decoration: none;\n}\n\na.z-link:hover,\nbutton.z-link:hover,\na.z-link:focus,\nbutton.z-link:focus,\na.z-link:active,\nbutton.z-link:active {\n text-decoration: underline;\n}\n\na.z-link:hover,\nbutton.z-link:hover,\na.z-link:focus,\nbutton.z-link:focus {\n color: var(--color-hover-link);\n fill: var(--color-hover-link);\n}\n\na.z-link:focus,\nbutton.z-link:focus {\n box-shadow: var(--shadow-focus-primary);\n outline: none;\n}\n\na.z-link:active,\nbutton.z-link:active,\na.z-link.z-link-active:active,\nbutton.z-link.z-link-active:active {\n color: var(--color-pressed-link);\n fill: var(--color-pressed-link);\n}\n\na.z-link:visited,\nbutton.z-link:visited {\n color: var(--color-visited-link);\n fill: var(--color-visited-link);\n}\n\na.z-link.z-link-active,\nbutton.z-link.z-link-active {\n color: var(--color-active-link);\n fill: var(--color-active-link);\n}\n\na.z-link.z-link-active.z-link-inverse,\nbutton.z-link.z-link-active.z-link-inverse {\n color: var(--color-inverse-active-link);\n fill: var(--color-inverse-active-link);\n}\n\na.z-link.z-link-active.z-link-black,\nbutton.z-link.z-link-active.z-link-black {\n color: var(--color-black);\n fill: var(--color-black);\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.z-link-underline,\nbutton.z-link.z-link-underline {\n text-decoration: underline;\n}\n\na.z-link.z-link-inverse,\nbutton.z-link.z-link-inverse {\n color: var(--color-inverse-link);\n fill: var(--color-inverse-link);\n}\n\na.z-link.z-link-inverse:hover,\nbutton.z-link.z-link-inverse:hover {\n color: var(--color-inverse-hover-link);\n fill: var(--color-inverse-hover-link);\n}\n\na.z-link.z-link-inverse:active,\nbutton.z-link.z-link-inverse:active,\na.z-link.z-link-inverse:focus,\nbutton.z-link.z-link-inverse:focus {\n color: var(--color-inverse-pressed-link);\n fill: var(--color-inverse-pressed-link);\n}\n\na.z-link.z-link-inverse:visited,\nbutton.z-link.z-link-inverse:visited {\n color: var(--color-inverse-visited-link);\n fill: var(--color-inverse-visited-link);\n}\n\na.z-link.z-link-black,\nbutton.z-link.z-link-black {\n color: var(--gray800);\n fill: var(--gray800);\n}\n\na.z-link.z-link-black:hover:visited,\nbutton.z-link.z-link-black:hover:visited {\n color: var(--gray800);\n fill: var(--gray800);\n}\n\na.z-link.z-link-black:hover,\nbutton.z-link.z-link-black:hover,\na.z-link.z-link-black.z-link-active:focus,\nbutton.z-link.z-link-black.z-link-active:focus {\n color: var(--color-black);\n fill: var(--color-black);\n}\n\na.z-link.z-link-black:active,\nbutton.z-link.z-link-black:active,\na.z-link.z-link-black.z-link-active:active,\nbutton.z-link.z-link-black.z-link-active:active {\n color: var(--gray700);\n fill: var(--gray700);\n}\n\na.z-link.z-link-black.z-link-disabled.z-link-active,\nbutton.z-link.z-link-black.z-link-disabled.z-link-active {\n color: var(--color-disabled03);\n fill: var(--color-disabled03);\n}\n\na.z-link.z-link-white,\nbutton.z-link.z-link-white {\n color: var(--color-white);\n fill: var(--color-white);\n}\n\na.z-link.z-link-white.z-link-disabled,\nbutton.z-link.z-link-white.z-link-disabled {\n color: var(--color-disabled03);\n fill: var(--color-disabled03);\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",":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) / 0.9166 var(--font-family-serif);\n --section-title-2: var(--font-sb) var(--font-size-10) / 1.1904 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\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\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\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\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","import {Component, Element, Event, EventEmitter, Prop, h} from \"@stencil/core\";\nimport {ControlSize, InfoRevealPosition} from \"../../../beans\";\n\n@Component({\n tag: \"z-book-card-app\",\n styleUrls: [\"styles.css\", \"../../css-components/z-link/styles.css\", \"../../../tokens/typography.css\"],\n shadow: true,\n})\nexport class ZBookCardApp {\n @Element() hostElement: HTMLZBookCardAppElement;\n\n /**\n * App logo url\n */\n @Prop()\n logo?: string;\n\n /**\n * App name\n */\n @Prop()\n name: string;\n\n /**\n * link to the app website\n */\n @Prop()\n link: string;\n\n /**\n * Show or hide laZ prefix before app name\n */\n @Prop()\n laz? = true;\n\n /**\n * Info text to show as inforeveal\n */\n @Prop()\n info?: string;\n\n /** click on app link */\n @Event()\n appClick: EventEmitter;\n\n private emitAppClick(): void {\n this.appClick.emit();\n }\n\n private renderLaz(): HTMLSpanElement | null {\n if (this.laz) {\n return <span class=\"laz\">laZ </span>;\n }\n\n return null;\n }\n\n render(): HTMLZBookCardAppElement {\n return (\n <div>\n <a\n class=\"app z-link\"\n href={this.link}\n aria-label={`vai a ${this.laz ? \"laz\" : \"\"} ${this.name}`}\n onClick={() => this.emitAppClick()}\n target=\"_blank\"\n >\n {this.logo && (\n <img\n src={this.logo}\n alt=\"\"\n />\n )}\n <div class=\"name body-4-sb\">\n {this.renderLaz()}\n {this.name}\n </div>\n </a>\n {this.info && (\n <z-info-reveal\n icon=\"info\"\n size={ControlSize.X_SMALL}\n position={InfoRevealPosition.TOP_RIGHT}\n class=\"info body-5\"\n >\n <div>{this.info}</div>\n </z-info-reveal>\n )}\n <a\n class=\"z-link z-link-icon\"\n href={this.link}\n aria-label={`vai a ${this.laz ? \"laz\" : \"\"} ${this.name}`}\n onClick={() => this.emitAppClick()}\n target=\"_blank\"\n >\n <z-icon\n name=\"chevron-right\"\n width={16}\n height={16}\n fill=\"color-primary01-icon\"\n ></z-icon>\n </a>\n </div>\n );\n }\n}\n"],"mappings":"oGAAA,MAAMA,EAAY,w/BAClB,MAAAC,EAAeD,ECDf,MAAMA,EAAY,6zGAClB,MAAAE,EAAeF,ECDf,MAAMG,EAAgB,w8UACtB,MAAAC,EAAeD,E,MCOFE,EAAY,M,iIAyBhB,K,oBAYC,YAAAC,GACNC,KAAKC,SAASC,M,CAGR,SAAAC,GACN,GAAIH,KAAKI,IAAK,CACZ,OAAOC,EAAA,QAAMC,MAAM,OAAK,O,CAG1B,OAAO,I,CAGT,MAAAC,GACE,OACEF,EAAA,OAAAG,IAAA,4CACEH,EAAA,KAAAG,IAAA,2CACEF,MAAM,aACNG,KAAMT,KAAKU,KAAI,aACH,SAASV,KAAKI,IAAM,MAAQ,MAAMJ,KAAKW,OACnDC,QAAS,IAAMZ,KAAKD,eACpBc,OAAO,UAENb,KAAKc,MACJT,EAAA,OAAAG,IAAA,2CACEO,IAAKf,KAAKc,KACVE,IAAI,KAGRX,EAAA,OAAAG,IAAA,2CAAKF,MAAM,kBACRN,KAAKG,YACLH,KAAKW,OAGTX,KAAKiB,MACJZ,EAAA,iBAAAG,IAAA,2CACEU,KAAK,OACLC,KAAMC,EAAYC,QAClBC,SAAUC,EAAmBC,UAC7BlB,MAAM,eAEND,EAAA,OAAAG,IAAA,4CAAMR,KAAKiB,OAGfZ,EAAA,KAAAG,IAAA,2CACEF,MAAM,qBACNG,KAAMT,KAAKU,KAAI,aACH,SAASV,KAAKI,IAAM,MAAQ,MAAMJ,KAAKW,OACnDC,QAAS,IAAMZ,KAAKD,eACpBc,OAAO,UAEPR,EAAA,UAAAG,IAAA,2CACEG,KAAK,gBACLc,MAAO,GACPC,OAAQ,GACRC,KAAK,0B","ignoreList":[]}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as t,c as i,h as e,g as n}from"./p-75c4a726.js";import{X as o,_ as a,e as s}from"./p-b34993de.js";const l=':host{display:block;max-width:fit-content}:host>article{width:304px;min-height:686px;box-sizing:border-box;padding:var(--space-unit) 0;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>article .main-content{display:flex;flex-direction:column;gap:calc(var(--space-unit) * 2)}:host>article .main-content .cover{display:flex;overflow:hidden;height:378px;margin:0 var(--space-unit);border-radius:var(--border-radius)}:host>article .main-content .cover img{max-width:100%;max-height:100%;align-self:end}:host>article .main-content .card-info{display:flex;flex:1;flex-direction:column;justify-content:space-between;gap:calc(var(--space-unit) * 2)}:host>article .main-content .card-info .book-data{display:flex;flex:1;flex-direction:column;justify-content:space-between;margin:0 var(--space-unit);gap:var(--space-unit)}:host>article .main-content .card-info .book-data .authors-title-cta-section{display:grid;column-gap:var(--space-unit);grid-template-areas:"authors authors"\n "title cta";grid-template-columns:auto 24px}:host>article .main-content .card-info .book-data .authors-title-cta-section .authors{display:-webkit-box;overflow:hidden;height:20px;margin-bottom:calc(var(--space-unit) / 2);-webkit-box-orient:vertical;grid-area:authors;-webkit-line-clamp:1;line-clamp:1;text-overflow:ellipsis}:host>article .main-content .card-info .book-data .authors-title-cta-section .opera-title{display:-webkit-box;overflow:hidden;height:54px;-webkit-box-orient:vertical;grid-area:title;-webkit-line-clamp:2;line-clamp:2;text-overflow:ellipsis}:host>article .main-content .card-info .book-data .authors-title-cta-section .opera-title *{all:unset}:host>article .main-content .card-info .book-data .isbn-tags-link-section .isbn-tags-section{margin-bottom:var(--space-unit)}:host>article .main-content .card-info .book-data .isbn-tags-link-section .isbn-tags-section .volume-title{display:-webkit-box;overflow:hidden;height:20px;-webkit-box-orient:vertical;-webkit-line-clamp:1;line-clamp:1;text-overflow:ellipsis}:host>article .main-content .card-info .book-data .isbn-tags-link-section .isbn-tags-section .isbn{display:-webkit-box;overflow:hidden;height:20px;-webkit-box-orient:vertical;-webkit-line-clamp:1;line-clamp:1;text-overflow:ellipsis}:host>article .main-content .card-info .book-data .isbn-tags-link-section .isbn-tags-section .tags{display:flex;overflow:hidden;height:22px;flex-flow:wrap;align-items:center;padding:var(--space-unit);margin:calc(calc(var(--space-unit) / 2) * -1) calc(var(--space-unit) * -1) 0;gap:var(--space-unit)}:host>article .main-content .card-info .book-data .isbn-tags-link-section .isbn-tags-section .tags z-tag.active{--z-tag-bg:var(--color-primary03);--z-tag-text-color:var(--color-default-text)}:host>article .main-content .card-info .book-data .isbn-tags-link-section .isbn-tags-section .tags z-tag.disabled{--z-tag-bg:var(--color-surface03);--z-tag-text-color:var(--color-default-text)}:host>article .main-content .card-info .book-data .isbn-tags-link-section .isbn-tags-section .tags z-tag.interactive{cursor:pointer}:host>article .main-content .card-info .book-data .isbn-tags-link-section .isbn-tags-section .tags z-tag:focus{box-shadow:var(--shadow-focus-primary);outline:none}:host>article .main-content .card-info .book-data .isbn-tags-link-section .link-section{display:flex;height:24px;align-items:center;justify-content:space-between;gap:var(--space-unit)}:host>article .main-content .card-info .book-data .isbn-tags-link-section .link-section .adoption-tag{padding:calc(var(--space-unit) / 2) var(--space-unit);background-color:var(--green100);border-radius:100px;text-transform:uppercase}:host>article .main-content .card-info .ebook-container{height:64px}:host>article .main-content .card-info .ebook-container .ebook{display:flex;align-items:center;justify-content:space-between;padding:calc(var(--space-unit) * 2) var(--space-unit);background-color:var(--color-primary02);border-radius:var(--border-radius);gap:var(--space-unit)}:host>article .main-content .card-info .ebook-container .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)}:host>article .main-content .card-info .ebook-container .ebook .app-name .ebook-logo{content:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2220%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>article .main-content .card-info .ebook-container .ebook .app-name .laz{color:var(--red500)}::slotted([slot="cta"]){grid-area:cta}:host>article.landscape{width:635px;min-height:332px;max-height:428px;padding:0}:host>article.landscape .main-content{height:296px;flex-direction:row;padding:calc(var(--space-unit) * 2)}:host>article.landscape .main-content .cover{display:flex;overflow:hidden;width:221px;height:auto;margin:0}:host>article.landscape .main-content .card-info .book-data{margin:0;gap:unset}:host>article.landscape .main-content .card-info .book-data .authors-title-cta-section{column-gap:calc(var(--space-unit) * 2);grid-template-areas:"authors cta"\n "title title"}:host>article.landscape .main-content .card-info .book-data .isbn-tags-link-section .isbn-tags-section .tags{margin:calc(calc(var(--space-unit) / 2) * -1) calc(var(--space-unit) * -1)}:host>article.landscape .main-content .card-info .ebook-container{height:76px}:host>article.landscape .main-content .card-info .ebook-container .ebook{padding:var(--space-unit)}';const r=l;const c="button.z-link{padding:0;border:0;margin:0;background-color:transparent}a.z-link,button.z-link{display:inline-flex;color:var(--color-link-primary);cursor:pointer;fill:var(--color-link-primary);font-family:var(--font-family-sans);line-height:inherit;text-decoration:none}a.z-link:hover,button.z-link:hover,a.z-link:focus,button.z-link:focus,a.z-link:active,button.z-link:active{text-decoration:underline}a.z-link:hover,button.z-link:hover,a.z-link:focus,button.z-link:focus{color:var(--color-hover-link);fill:var(--color-hover-link)}a.z-link:focus,button.z-link:focus{box-shadow:var(--shadow-focus-primary);outline:none}a.z-link:active,button.z-link:active,a.z-link.z-link-active:active,button.z-link.z-link-active:active{color:var(--color-pressed-link);fill:var(--color-pressed-link)}a.z-link:visited,button.z-link:visited{color:var(--color-visited-link);fill:var(--color-visited-link)}a.z-link.z-link-active,button.z-link.z-link-active{color:var(--color-active-link);fill:var(--color-active-link)}a.z-link.z-link-active.z-link-inverse,button.z-link.z-link-active.z-link-inverse{color:var(--color-inverse-active-link);fill:var(--color-inverse-active-link)}a.z-link.z-link-active.z-link-black,button.z-link.z-link-active.z-link-black{color:var(--color-black);fill:var(--color-black)}a.z-link.z-link-disabled,button.z-link.z-link-disabled{box-shadow:none;color:var(--color-disabled03);cursor:default;fill:var(--color-disabled03);outline:none;pointer-events:none;text-decoration:none}a.z-link.z-link-underline,button.z-link.z-link-underline{text-decoration:underline}a.z-link.z-link-inverse,button.z-link.z-link-inverse{color:var(--color-inverse-link);fill:var(--color-inverse-link)}a.z-link.z-link-inverse:hover,button.z-link.z-link-inverse:hover{color:var(--color-inverse-hover-link);fill:var(--color-inverse-hover-link)}a.z-link.z-link-inverse:active,button.z-link.z-link-inverse:active,a.z-link.z-link-inverse:focus,button.z-link.z-link-inverse:focus{color:var(--color-inverse-pressed-link);fill:var(--color-inverse-pressed-link)}a.z-link.z-link-inverse:visited,button.z-link.z-link-inverse:visited{color:var(--color-inverse-visited-link);fill:var(--color-inverse-visited-link)}a.z-link.z-link-black,button.z-link.z-link-black{color:var(--gray800);fill:var(--gray800)}a.z-link.z-link-black:hover:visited,button.z-link.z-link-black:hover:visited{color:var(--gray800);fill:var(--gray800)}a.z-link.z-link-black:hover,button.z-link.z-link-black:hover,a.z-link.z-link-black.z-link-active:focus,button.z-link.z-link-black.z-link-active:focus{color:var(--color-black);fill:var(--color-black)}a.z-link.z-link-black:active,button.z-link.z-link-black:active,a.z-link.z-link-black.z-link-active:active,button.z-link.z-link-black.z-link-active:active{color:var(--gray700);fill:var(--gray700)}a.z-link.z-link-black.z-link-disabled.z-link-active,button.z-link.z-link-black.z-link-disabled.z-link-active{color:var(--color-disabled03);fill:var(--color-disabled03)}a.z-link.z-link-white,button.z-link.z-link-white{color:var(--color-white);fill:var(--color-white)}a.z-link.z-link-white.z-link-disabled,button.z-link.z-link-white.z-link-disabled{color:var(--color-disabled03);fill:var(--color-disabled03)}a.z-link.z-link-icon,button.z-link.z-link-icon{--z-icon-width:1.125em;--z-icon-height:1.125em;align-items:center;column-gap:0.5em}a.z-link.z-link-sb,button.z-link.z-link-sb{font-weight:var(--font-sb)}";const d=c;const f=':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) / 0.9166 var(--font-family-serif);--section-title-2:var(--font-sb) var(--font-size-10) / 1.1904 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)}}@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)}}@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)}}@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)}}.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)}';const h=f;const b=class{constructor(e){t(this,e);this.tagClick=i(this,"tagClick",7);this.catalogClick=i(this,"catalogClick",7);this.ebookClick=i(this,"ebookClick",7);this.immersiveReaderClick=i(this,"immersiveReaderClick",7);this.variant=o.PORTRAIT;this.cover=undefined;this.authors=undefined;this.operaTitle=undefined;this.volumeTitle=undefined;this.isbn=undefined;this.isbnLabel="";this.edi=undefined;this.annotated=undefined;this.teacherVersion=undefined;this.adoption=false;this.catalogUrl=undefined;this.ebookUrl=undefined;this.fallbackCover=undefined;this.operaTitleHtmlTag=undefined;this.ediTag=undefined;this.annotatedTag=undefined;this.teacherVersionTag=undefined}watchEdi(){this.ediTag=typeof this.edi==="string"?JSON.parse(this.edi):this.edi}watchAnnotated(){this.annotatedTag=typeof this.annotated==="string"?JSON.parse(this.annotated):this.annotated}watchTeacherVersion(){this.teacherVersionTag=typeof this.teacherVersion==="string"?JSON.parse(this.teacherVersion):this.teacherVersion}componentWillLoad(){this.watchEdi();this.watchAnnotated();this.watchTeacherVersion()}emitTagClick(t){this.tagClick.emit(t)}emitCatalogClick(){this.catalogClick.emit()}emitEbookClick(){this.ebookClick.emit()}emitImmersiveReaderClick(){this.immersiveReaderClick.emit()}renderOperaTitle(){const t=this.operaTitleHtmlTag?`<${this.operaTitleHtmlTag}>${this.operaTitle}</${this.operaTitleHtmlTag}>`:this.operaTitle;return e("div",{class:"opera-title body-2-sb",innerHTML:t})}renderIsbnLabel(){return this.isbnLabel?e("span",{class:"body-4"},this.isbnLabel):null}renderTag(t,i,n){return e("z-tag",{class:{[i.status]:true,interactive:i.interactive},role:i.interactive?"button":undefined,tabIndex:i.interactive?0:undefined,onClick:()=>i.interactive&&this.emitTagClick({tag:n,state:i.status}),onKeyUp:t=>i.interactive&&t.key==="Enter"&&this.emitTagClick({tag:n,state:i.status})},t)}renderTags(){const t=[];if(this.edi&&Object.values(a).includes(this.ediTag.status)){t.push(this.renderTag("edi",this.ediTag,"edi"))}if(this.annotated&&Object.values(a).includes(this.annotatedTag.status)){t.push(this.renderTag("annotata",this.annotatedTag,"annotated"))}if(this.teacherVersion&&Object.values(a).includes(this.teacherVersionTag.status)){t.push(this.renderTag("versione insegnante",this.teacherVersionTag,"teacherVersion"))}if(t.length>0){return t}return null}renderCover(){return e("div",{class:"cover"},e("img",{src:this.cover,onError:()=>{if(this.fallbackCover){this.cover=this.fallbackCover}},"aria-hidden":"true"}))}render(){return e("article",{key:"995a31329fdf85453bb26cbb42be924fba6c28bb",class:{[this.variant]:true}},e("div",{key:"d3bd68272b601c8e40e82da7f676900ff695b0ce",class:"main-content"},this.renderCover(),e("div",{key:"7912fe6ec4b4b5b5bdf7594c6458841d5162c21d",class:"card-info"},e("div",{key:"06bd27cc9a9a570232fa2e57b6a0616f82e072ac",class:"book-data"},e("div",{key:"86042f5bc869d7da2bbc85ddf6b5ae8ec5392f94",class:"authors-title-cta-section"},e("div",{key:"e24123d9ef8631156c08b61c39729cc2fddfa44e",class:"authors body-4","aria-description":"autori"},this.authors),this.renderOperaTitle(),e("slot",{key:"a441440afe2f15ffd43dcd7ac9dc307c54565f3f",name:"cta"})),e("div",{key:"fb61ed950c98f1a8c76fe93f1ead60a2e6ecc6ad",class:"isbn-tags-link-section"},e("div",{key:"5039b8f43161542692ed6004516159ebf36b31ef",class:"isbn-tags-section"},e("div",{key:"d8a79f00867e0eff27677accee806d0c14063fc4",class:"volume-title body-4"},this.volumeTitle),e("div",{key:"e28692cc30512b64fa6f7a4aebc38d26f84fb4de",class:"isbn body-4-sb","aria-description":`isbn ${this.isbnLabel}`},this.isbn," ",this.renderIsbnLabel()),e("div",{key:"0bba463af67af4e6f45188a89673cf57a4ca84db",class:"tags"},this.renderTags())),e("div",{key:"a62fdf6c196fa5d658c1c71046297251b43a9cce",class:"link-section"},e("div",{key:"62c16d7975cc5f99aaaf8f188bcbce7cd15fd34f",class:"catalog-link"},this.catalogUrl&&e("a",{key:"6a3f2a1e182845d3cdc2b41b3d5dc20b8b9cdf54",href:this.catalogUrl,class:"z-link z-link-icon body-4-sb",onClick:()=>this.emitCatalogClick()},"Scheda catalogo",e("z-icon",{key:"8ad4e0dd77e4d235b396fea9206524c8d127f76b",name:"arrow-quad-north-east",height:16,width:16,fill:"color-primary01-icon"}))),this.adoption&&e("div",{key:"f7def1a20ab2d47a5d85b0b173d4c05487f8fbed",class:"adoption-tag body-5-sb"},"adottato")))),e("div",{key:"4fce381b66f578306c2184534880f999a3097572",class:"ebook-container"},e("slot",{key:"3f72c174065cf36dfa2b018bf627546fe967763b",name:"ebook"},this.ebookUrl&&e("div",{key:"1e0c0023ae52ce0af12841013550a326f463c528",class:"ebook"},e("div",{key:"63008c797124ed845645b526ce6a48867a224aa1"},e("div",{key:"e2d9f599396567aa63695c180c26faf0b53fdc1c",class:"app-name"},e("img",{key:"e69ade1d7da98a9a0dfc6510ca4ece7ca7f6796b",class:"ebook-logo","aria-hidden":"true"}),e("div",{key:"c3627df0e9099af547d09031562437ab873e91c1",class:"body-4-sb"},e("span",{key:"7982aa998ac01cf4a1447f288ae47fe90aafaa33",class:"laz"},"laZ")," Ebook")),this.variant===o.LANDSCAPE&&e("div",{key:"d91f78c3d210249a8dc06921eeb02d32e560c6d9",class:"body-5"},"Anche nella versione libro liquido con"," ",e("button",{key:"d4720dd21bcac20b81ced73df04e0c1bf85a3055",class:"body-5-sb immersive-reader z-link",onClick:()=>this.emitImmersiveReaderClick(),tabIndex:0},"strumento di lettura immersiva"))),e("z-button",{key:"6b4f6446f6485aa3207f738a3f2c87f405295834",size:s.X_SMALL,href:this.ebookUrl,onClick:()=>this.emitEbookClick(),role:"link","aria-description":`leggi l'ebook ${this.operaTitle} su laZ Ebook`},"leggi ebook")))))),e("slot",{key:"f7937c2c825d850a82da5ce12383d9ef4ce6cf2b",name:"apps"}))}get hostElement(){return n(this)}static get watchers(){return{edi:["watchEdi"],annotated:["watchAnnotated"],teacherVersion:["watchTeacherVersion"]}}};b.style=r+(d+h);export{b as z_book_card};
|
|
2
|
-
//# sourceMappingURL=p-e945ed47.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["stylesCss","ZBookCardStyle0","ZBookCardStyle1","typographyCss","ZBookCardStyle2","ZBookCard","BookCardVariant","PORTRAIT","watchEdi","this","ediTag","edi","JSON","parse","watchAnnotated","annotatedTag","annotated","watchTeacherVersion","teacherVersionTag","teacherVersion","componentWillLoad","emitTagClick","e","tagClick","emit","emitCatalogClick","catalogClick","emitEbookClick","ebookClick","emitImmersiveReaderClick","immersiveReaderClick","renderOperaTitle","title","operaTitleHtmlTag","operaTitle","h","class","innerHTML","renderIsbnLabel","isbnLabel","renderTag","label","tag","id","status","interactive","role","undefined","tabIndex","onClick","state","onKeyUp","key","renderTags","tags","Object","values","BookCardTagStatus","includes","push","length","renderCover","src","cover","onError","fallbackCover","render","variant","authors","name","volumeTitle","isbn","catalogUrl","href","height","width","fill","adoption","ebookUrl","LANDSCAPE","size","ControlSize","X_SMALL"],"sources":["src/components/book-card/z-book-card/styles.css?tag=z-book-card&encapsulation=shadow","src/components/css-components/z-link/styles.css?tag=z-book-card&encapsulation=shadow","src/tokens/typography.css?tag=z-book-card&encapsulation=shadow","src/components/book-card/z-book-card/index.tsx"],"sourcesContent":[":host {\n display: block;\n max-width: fit-content;\n}\n\n:host > article {\n width: 304px;\n min-height: 686px;\n box-sizing: border-box;\n padding: var(--space-unit) 0;\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 > article .main-content {\n display: flex;\n flex-direction: column;\n gap: calc(var(--space-unit) * 2);\n}\n\n:host > article .main-content .cover {\n display: flex;\n overflow: hidden;\n height: 378px;\n margin: 0 var(--space-unit);\n border-radius: var(--border-radius);\n}\n\n:host > article .main-content .cover img {\n max-width: 100%;\n max-height: 100%;\n align-self: end;\n}\n\n:host > article .main-content .card-info {\n display: flex;\n flex: 1;\n flex-direction: column;\n justify-content: space-between;\n gap: calc(var(--space-unit) * 2);\n}\n\n:host > article .main-content .card-info .book-data {\n display: flex;\n flex: 1;\n flex-direction: column;\n justify-content: space-between;\n margin: 0 var(--space-unit);\n gap: var(--space-unit);\n}\n\n:host > article .main-content .card-info .book-data .authors-title-cta-section {\n display: grid;\n column-gap: var(--space-unit);\n grid-template-areas:\n \"authors authors\"\n \"title cta\";\n grid-template-columns: auto 24px;\n}\n\n:host > article .main-content .card-info .book-data .authors-title-cta-section .authors {\n display: -webkit-box;\n overflow: hidden;\n height: 20px;\n margin-bottom: calc(var(--space-unit) / 2);\n -webkit-box-orient: vertical;\n grid-area: authors;\n -webkit-line-clamp: 1;\n line-clamp: 1;\n text-overflow: ellipsis;\n}\n\n:host > article .main-content .card-info .book-data .authors-title-cta-section .opera-title {\n display: -webkit-box;\n overflow: hidden;\n height: 54px;\n -webkit-box-orient: vertical;\n grid-area: title;\n -webkit-line-clamp: 2;\n line-clamp: 2;\n text-overflow: ellipsis;\n}\n\n:host > article .main-content .card-info .book-data .authors-title-cta-section .opera-title * {\n all: unset;\n}\n\n:host > article .main-content .card-info .book-data .isbn-tags-link-section .isbn-tags-section {\n margin-bottom: var(--space-unit);\n}\n\n:host > article .main-content .card-info .book-data .isbn-tags-link-section .isbn-tags-section .volume-title {\n display: -webkit-box;\n overflow: hidden;\n height: 20px;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 1;\n line-clamp: 1;\n text-overflow: ellipsis;\n}\n\n:host > article .main-content .card-info .book-data .isbn-tags-link-section .isbn-tags-section .isbn {\n display: -webkit-box;\n overflow: hidden;\n height: 20px;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 1;\n line-clamp: 1;\n text-overflow: ellipsis;\n}\n\n:host > article .main-content .card-info .book-data .isbn-tags-link-section .isbn-tags-section .tags {\n display: flex;\n overflow: hidden;\n height: 22px;\n flex-flow: wrap;\n align-items: center;\n padding: var(--space-unit);\n margin: calc(calc(var(--space-unit) / 2) * -1) calc(var(--space-unit) * -1) 0;\n gap: var(--space-unit);\n}\n\n:host > article .main-content .card-info .book-data .isbn-tags-link-section .isbn-tags-section .tags z-tag.active {\n --z-tag-bg: var(--color-primary03);\n --z-tag-text-color: var(--color-default-text);\n}\n\n:host > article .main-content .card-info .book-data .isbn-tags-link-section .isbn-tags-section .tags z-tag.disabled {\n --z-tag-bg: var(--color-surface03);\n --z-tag-text-color: var(--color-default-text);\n}\n\n:host > article .main-content .card-info .book-data .isbn-tags-link-section .isbn-tags-section .tags z-tag.interactive {\n cursor: pointer;\n}\n\n:host > article .main-content .card-info .book-data .isbn-tags-link-section .isbn-tags-section .tags z-tag:focus {\n box-shadow: var(--shadow-focus-primary);\n outline: none;\n}\n\n:host > article .main-content .card-info .book-data .isbn-tags-link-section .link-section {\n display: flex;\n height: 24px;\n align-items: center;\n justify-content: space-between;\n gap: var(--space-unit);\n}\n\n:host > article .main-content .card-info .book-data .isbn-tags-link-section .link-section .adoption-tag {\n padding: calc(var(--space-unit) / 2) var(--space-unit);\n background-color: var(--green100);\n border-radius: 100px;\n text-transform: uppercase;\n}\n\n:host > article .main-content .card-info .ebook-container {\n height: 64px;\n}\n\n:host > article .main-content .card-info .ebook-container .ebook {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: calc(var(--space-unit) * 2) var(--space-unit);\n background-color: var(--color-primary02);\n border-radius: var(--border-radius);\n gap: var(--space-unit);\n}\n\n:host > article .main-content .card-info .ebook-container .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:host > article .main-content .card-info .ebook-container .ebook .app-name .ebook-logo {\n content: url(\"data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2220%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 > article .main-content .card-info .ebook-container .ebook .app-name .laz {\n color: var(--red500);\n}\n\n::slotted([slot=\"cta\"]) {\n grid-area: cta;\n}\n\n:host > article.landscape {\n width: 635px;\n min-height: 332px;\n max-height: 428px;\n padding: 0;\n}\n\n:host > article.landscape .main-content {\n height: 296px;\n flex-direction: row;\n padding: calc(var(--space-unit) * 2);\n}\n\n:host > article.landscape .main-content .cover {\n display: flex;\n overflow: hidden;\n width: 221px;\n height: auto;\n margin: 0;\n}\n\n:host > article.landscape .main-content .card-info .book-data {\n margin: 0;\n gap: unset;\n}\n\n:host > article.landscape .main-content .card-info .book-data .authors-title-cta-section {\n column-gap: calc(var(--space-unit) * 2);\n grid-template-areas:\n \"authors cta\"\n \"title title\";\n}\n\n:host > article.landscape .main-content .card-info .book-data .isbn-tags-link-section .isbn-tags-section .tags {\n margin: calc(calc(var(--space-unit) / 2) * -1) calc(var(--space-unit) * -1);\n}\n\n:host > article.landscape .main-content .card-info .ebook-container {\n height: 76px;\n}\n\n:host > article.landscape .main-content .card-info .ebook-container .ebook {\n padding: var(--space-unit);\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 color: var(--color-link-primary);\n cursor: pointer;\n fill: var(--color-link-primary);\n font-family: var(--font-family-sans);\n line-height: inherit;\n text-decoration: none;\n}\n\na.z-link:hover,\nbutton.z-link:hover,\na.z-link:focus,\nbutton.z-link:focus,\na.z-link:active,\nbutton.z-link:active {\n text-decoration: underline;\n}\n\na.z-link:hover,\nbutton.z-link:hover,\na.z-link:focus,\nbutton.z-link:focus {\n color: var(--color-hover-link);\n fill: var(--color-hover-link);\n}\n\na.z-link:focus,\nbutton.z-link:focus {\n box-shadow: var(--shadow-focus-primary);\n outline: none;\n}\n\na.z-link:active,\nbutton.z-link:active,\na.z-link.z-link-active:active,\nbutton.z-link.z-link-active:active {\n color: var(--color-pressed-link);\n fill: var(--color-pressed-link);\n}\n\na.z-link:visited,\nbutton.z-link:visited {\n color: var(--color-visited-link);\n fill: var(--color-visited-link);\n}\n\na.z-link.z-link-active,\nbutton.z-link.z-link-active {\n color: var(--color-active-link);\n fill: var(--color-active-link);\n}\n\na.z-link.z-link-active.z-link-inverse,\nbutton.z-link.z-link-active.z-link-inverse {\n color: var(--color-inverse-active-link);\n fill: var(--color-inverse-active-link);\n}\n\na.z-link.z-link-active.z-link-black,\nbutton.z-link.z-link-active.z-link-black {\n color: var(--color-black);\n fill: var(--color-black);\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.z-link-underline,\nbutton.z-link.z-link-underline {\n text-decoration: underline;\n}\n\na.z-link.z-link-inverse,\nbutton.z-link.z-link-inverse {\n color: var(--color-inverse-link);\n fill: var(--color-inverse-link);\n}\n\na.z-link.z-link-inverse:hover,\nbutton.z-link.z-link-inverse:hover {\n color: var(--color-inverse-hover-link);\n fill: var(--color-inverse-hover-link);\n}\n\na.z-link.z-link-inverse:active,\nbutton.z-link.z-link-inverse:active,\na.z-link.z-link-inverse:focus,\nbutton.z-link.z-link-inverse:focus {\n color: var(--color-inverse-pressed-link);\n fill: var(--color-inverse-pressed-link);\n}\n\na.z-link.z-link-inverse:visited,\nbutton.z-link.z-link-inverse:visited {\n color: var(--color-inverse-visited-link);\n fill: var(--color-inverse-visited-link);\n}\n\na.z-link.z-link-black,\nbutton.z-link.z-link-black {\n color: var(--gray800);\n fill: var(--gray800);\n}\n\na.z-link.z-link-black:hover:visited,\nbutton.z-link.z-link-black:hover:visited {\n color: var(--gray800);\n fill: var(--gray800);\n}\n\na.z-link.z-link-black:hover,\nbutton.z-link.z-link-black:hover,\na.z-link.z-link-black.z-link-active:focus,\nbutton.z-link.z-link-black.z-link-active:focus {\n color: var(--color-black);\n fill: var(--color-black);\n}\n\na.z-link.z-link-black:active,\nbutton.z-link.z-link-black:active,\na.z-link.z-link-black.z-link-active:active,\nbutton.z-link.z-link-black.z-link-active:active {\n color: var(--gray700);\n fill: var(--gray700);\n}\n\na.z-link.z-link-black.z-link-disabled.z-link-active,\nbutton.z-link.z-link-black.z-link-disabled.z-link-active {\n color: var(--color-disabled03);\n fill: var(--color-disabled03);\n}\n\na.z-link.z-link-white,\nbutton.z-link.z-link-white {\n color: var(--color-white);\n fill: var(--color-white);\n}\n\na.z-link.z-link-white.z-link-disabled,\nbutton.z-link.z-link-white.z-link-disabled {\n color: var(--color-disabled03);\n fill: var(--color-disabled03);\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",":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) / 0.9166 var(--font-family-serif);\n --section-title-2: var(--font-sb) var(--font-size-10) / 1.1904 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\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\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\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\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","import {Component, Element, Event, EventEmitter, Prop, State, Watch, h} from \"@stencil/core\";\nimport {BookCardTag, BookCardTagEvent, BookCardTagStatus, BookCardVariant, ControlSize} from \"../../../beans\";\n\n/**\n * @slot cta - to the right of authors and title (e.g. bookmark icon)\n * @slot ebook - main action slot on the card (as default, it shows laZ ebook link)\n * @slot apps - list of card-related apps\n */\n@Component({\n tag: \"z-book-card\",\n styleUrls: [\"styles.css\", \"../../css-components/z-link/styles.css\", \"../../../tokens/typography.css\"],\n shadow: true,\n})\nexport class ZBookCard {\n @Element() hostElement: HTMLZBookCardElement;\n\n /** Card variant: landscape, portrait */\n @Prop()\n variant: BookCardVariant = BookCardVariant.PORTRAIT;\n\n /** Cover URL */\n @Prop()\n cover: string;\n\n /** [optional] Authors */\n @Prop()\n authors?: string;\n\n /** [optional] Opera title */\n @Prop()\n operaTitle?: string;\n\n /** [optional] Volume title */\n @Prop()\n volumeTitle?: string;\n\n /** [optional] Main ISBN */\n @Prop()\n isbn?: string;\n\n /** [optional] ISBN label */\n @Prop()\n isbnLabel = \"\";\n\n /** [optional] EDI tag */\n @Prop()\n edi?: BookCardTag | string;\n\n /** [optional] Annotated tag */\n @Prop()\n annotated?: BookCardTag | string;\n\n /** [optional] Teacher version tag */\n @Prop()\n teacherVersion?: BookCardTag | string;\n\n /** [optional] Show adoption badge */\n @Prop()\n adoption?: boolean = false;\n\n /** [optional] Show catalog link to correspondent resource */\n @Prop()\n catalogUrl?: string;\n\n /** [optional] Show link to the ebook resource */\n @Prop()\n ebookUrl?: string;\n\n /** [optional] Fallback cover URL */\n @Prop()\n fallbackCover?: string;\n\n /** [optional] Set a specific h level as html tag for opera title */\n @Prop()\n operaTitleHtmlTag?: string;\n\n @State()\n ediTag;\n\n @State()\n annotatedTag;\n\n @State()\n teacherVersionTag;\n\n /** click on tag */\n @Event()\n tagClick: EventEmitter;\n\n /** click on catalog link */\n @Event()\n catalogClick: EventEmitter;\n\n /** click on ebook link */\n @Event()\n ebookClick: EventEmitter;\n\n /** click on immersive reader */\n @Event()\n immersiveReaderClick: EventEmitter;\n\n @Watch(\"edi\")\n watchEdi(): void {\n this.ediTag = typeof this.edi === \"string\" ? JSON.parse(this.edi) : this.edi;\n }\n\n @Watch(\"annotated\")\n watchAnnotated(): void {\n this.annotatedTag = typeof this.annotated === \"string\" ? JSON.parse(this.annotated) : this.annotated;\n }\n\n @Watch(\"teacherVersion\")\n watchTeacherVersion(): void {\n this.teacherVersionTag =\n typeof this.teacherVersion === \"string\" ? JSON.parse(this.teacherVersion) : this.teacherVersion;\n }\n\n componentWillLoad(): void {\n this.watchEdi();\n this.watchAnnotated();\n this.watchTeacherVersion();\n }\n\n private emitTagClick(e: BookCardTagEvent): void {\n this.tagClick.emit(e);\n }\n\n private emitCatalogClick(): void {\n this.catalogClick.emit();\n }\n\n private emitEbookClick(): void {\n this.ebookClick.emit();\n }\n\n private emitImmersiveReaderClick(): void {\n this.immersiveReaderClick.emit();\n }\n\n private renderOperaTitle(): HTMLDivElement {\n const title = this.operaTitleHtmlTag\n ? `<${this.operaTitleHtmlTag}>${this.operaTitle}</${this.operaTitleHtmlTag}>`\n : this.operaTitle;\n\n return (\n <div\n class=\"opera-title body-2-sb\"\n innerHTML={title}\n />\n );\n }\n\n private renderIsbnLabel(): HTMLDivElement | null {\n return this.isbnLabel ? <span class=\"body-4\">{this.isbnLabel}</span> : null;\n }\n\n private renderTag(label: string, tag: BookCardTag, id: string): HTMLDivElement {\n return (\n <z-tag\n class={{[tag.status]: true, interactive: tag.interactive}}\n role={tag.interactive ? \"button\" : undefined}\n tabIndex={tag.interactive ? 0 : undefined}\n onClick={() =>\n tag.interactive &&\n this.emitTagClick({\n tag: id,\n state: tag.status,\n })\n }\n onKeyUp={(e: KeyboardEvent) =>\n tag.interactive &&\n e.key === \"Enter\" &&\n this.emitTagClick({\n tag: id,\n state: tag.status,\n })\n }\n >\n {label}\n </z-tag>\n );\n }\n\n private renderTags(): HTMLDivElement[] | null {\n const tags = [];\n\n if (this.edi && Object.values(BookCardTagStatus).includes(this.ediTag.status)) {\n tags.push(this.renderTag(\"edi\", this.ediTag, \"edi\"));\n }\n\n if (this.annotated && Object.values(BookCardTagStatus).includes(this.annotatedTag.status)) {\n tags.push(this.renderTag(\"annotata\", this.annotatedTag, \"annotated\"));\n }\n\n if (this.teacherVersion && Object.values(BookCardTagStatus).includes(this.teacherVersionTag.status)) {\n tags.push(this.renderTag(\"versione insegnante\", this.teacherVersionTag, \"teacherVersion\"));\n }\n\n if (tags.length > 0) {\n return tags;\n }\n\n return null;\n }\n\n private renderCover(): HTMLDivElement {\n return (\n <div class=\"cover\">\n <img\n src={this.cover}\n onError={() => {\n if (this.fallbackCover) {\n this.cover = this.fallbackCover;\n }\n }}\n aria-hidden=\"true\"\n />\n </div>\n );\n }\n\n render(): HTMLZBookCardElement {\n return (\n <article\n class={{\n [this.variant]: true,\n }}\n >\n <div class=\"main-content\">\n {this.renderCover()}\n <div class=\"card-info\">\n <div class=\"book-data\">\n <div class=\"authors-title-cta-section\">\n <div\n class=\"authors body-4\"\n aria-description=\"autori\"\n >\n {this.authors}\n </div>\n {this.renderOperaTitle()}\n <slot name=\"cta\"></slot>\n </div>\n <div class=\"isbn-tags-link-section\">\n <div class=\"isbn-tags-section\">\n <div class=\"volume-title body-4\">{this.volumeTitle}</div>\n <div\n class=\"isbn body-4-sb\"\n aria-description={`isbn ${this.isbnLabel}`}\n >\n {this.isbn} {this.renderIsbnLabel()}\n </div>\n <div class=\"tags\">{this.renderTags()}</div>\n </div>\n <div class=\"link-section\">\n <div class=\"catalog-link\">\n {this.catalogUrl && (\n <a\n href={this.catalogUrl}\n class=\"z-link z-link-icon body-4-sb\"\n onClick={() => this.emitCatalogClick()}\n >\n Scheda catalogo\n <z-icon\n name=\"arrow-quad-north-east\"\n height={16}\n width={16}\n fill=\"color-primary01-icon\"\n ></z-icon>\n </a>\n )}\n </div>\n {this.adoption && <div class=\"adoption-tag body-5-sb\">adottato</div>}\n </div>\n </div>\n </div>\n <div class=\"ebook-container\">\n <slot name=\"ebook\">\n {this.ebookUrl && (\n <div class=\"ebook\">\n <div>\n <div class=\"app-name\">\n <img\n class=\"ebook-logo\"\n aria-hidden=\"true\"\n />\n <div class=\"body-4-sb\">\n <span class=\"laz\">laZ</span> Ebook\n </div>\n </div>\n {this.variant === BookCardVariant.LANDSCAPE && (\n <div class=\"body-5\">\n Anche nella versione libro liquido con{\" \"}\n <button\n class=\"body-5-sb immersive-reader z-link\"\n onClick={() => this.emitImmersiveReaderClick()}\n tabIndex={0}\n >\n strumento di lettura immersiva\n </button>\n </div>\n )}\n </div>\n <z-button\n size={ControlSize.X_SMALL}\n href={this.ebookUrl}\n onClick={() => this.emitEbookClick()}\n role=\"link\"\n aria-description={`leggi l'ebook ${this.operaTitle} su laZ Ebook`}\n >\n leggi ebook\n </z-button>\n </div>\n )}\n </slot>\n </div>\n </div>\n </div>\n <slot name=\"apps\"></slot>\n </article>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
|
package/www/build/p-0d966ad0.js
DELETED
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as o,h as s,a as e}from"./p-75c4a726.js";const r=":host{--z-table--cells-bottom-border-size:var(\n --border-size-medium\n );--z-table--cells-background:var(\n --color-surface02\n );display:block;box-sizing:border-box}:host([sticky]){position:sticky;z-index:2;top:0;box-shadow:0 2px 4px -2px var(--shadow-color-base)}";const a=r;const t=class{constructor(s){o(this,s);this.sticky=false}render(){return s(e,{key:"3d8fc0d5ebe1a7459f3af8773b6fed710521ddbb",role:"rowgroup"},s("slot",{key:"7ac6ee2f4bd099f45f805a79471bf10f900665bb"}))}};t.style=a;export{t as Z};
|
|
2
|
-
//# sourceMappingURL=p-0d966ad0.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["stylesCss","ZTheadStyle0","ZThead","render","h","Host","key","role"],"sources":["src/components/table/z-thead/styles.css?tag=z-thead&encapsulation=shadow","src/components/table/z-thead/index.tsx"],"sourcesContent":[":host {\n --z-table--cells-bottom-border-size: var(\n --border-size-medium\n ); /* Needed to handle the border of the expand button cell */\n\n --z-table--cells-background: var(\n --color-surface02\n ); /* Needed to handle the background-color of the expand button cell */\n\n display: block;\n box-sizing: border-box;\n}\n\n:host([sticky]) {\n position: sticky;\n z-index: 2;\n top: 0;\n box-shadow: 0 2px 4px -2px var(--shadow-color-base);\n}\n","import {Component, Host, Prop, h} from \"@stencil/core\";\n\n/**\n * ZThead component.\n * @slot - ZThead content (`z-tr`).\n */\n@Component({\n tag: \"z-thead\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZThead {\n /**\n * If true, the header will be stuck to the top of the table.\n */\n @Prop({reflect: true})\n sticky = false;\n\n render(): HTMLZTheadElement {\n return (\n <Host role=\"rowgroup\">\n <slot></slot>\n </Host>\n );\n }\n}\n"],"mappings":"kDAAA,MAAMA,EAAY,qRAClB,MAAAC,EAAeD,E,MCUFE,EAAM,M,qCAKR,K,CAET,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,KAAK,YACTH,EAAA,QAAAE,IAAA,6C","ignoreList":[]}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as e,c as t,h as r}from"./p-75c4a726.js";import{o as a}from"./p-b34993de.js";const i=":host{position:absolute;z-index:2;top:0;left:0;width:100%;font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>z-alert{height:calc(var(--space-unit) * 6)}.relative-container{position:relative;display:grid;align-items:center;padding:0;grid-column-gap:var(--space-unit);grid-template-columns:18px auto 46px;grid-template-rows:1fr;outline:none}.relative-container::-moz-focus-inner{border:0}.alert-external-wrapper.remove-alert{border:var(--border-size-medium) solid var(--color-surface02);border-top:none}:host div.add-alert{background:var(--color-success-inverse)}:host div.remove-alert{background:var(--color-warning-inverse)}:host div>.content-text{color:var(--color-surface05);font-size:14px;letter-spacing:0.16px;line-height:20px}:host div>.content-action{height:20px;color:var(--color-primary01);cursor:pointer;font-size:12px;font-weight:var(--font-sb);letter-spacing:0.32px;line-height:20px}:host div>z-icon{justify-self:center}";const s=i;const n=class{constructor(r){e(this,r);this.undoAction=t(this,"undoAction",7);this.iconname=undefined;this.contenttext=undefined;this.actiontext=undefined;this.type=undefined}emitUndoAction(){this.undoAction.emit({actionType:this.type})}handleSpaceKeyPress(e){if(e.keyCode==32||e.keyCode==13){e.preventDefault();this.emitUndoAction()}}handleActionButtonClick(e){e.preventDefault();this.emitUndoAction()}retrieveClass(){let e="";switch(this.type){case"add":e="add-alert";break;case"remove":e="remove-alert";break;default:e="";break}return e}getAlertType(){switch(this.type){case"add":return a.SUCCESS;case"remove":return a.WARNING;default:return null}}render(){return r("div",{key:"20f62eeb1a0ca24f6cd9700ba70a7e09e0ac729b",class:"alert-external-wrapper "+this.retrieveClass()},r("z-alert",{key:"5a8275ea2ab9dc49866b22e8a9d235911e1f7275",type:this.getAlertType()},r("div",{key:"8d69056c30fb55d0bb32701fecd1063dff392665",class:"relative-container"},r("z-icon",{key:"a17e02b4545f15d1a730b66b6e4b5ab5bc665654",name:this.iconname,width:18,height:18,class:this.retrieveClass()}),r("span",{key:"d231b939eb09ddb1b1f25d40a8512ce8f4a18f19",class:"content-text"},this.contenttext),this.actiontext&&!!this.actiontext.trim().length&&r("span",{key:"00f3f7d6ec722547fbc8c14881ca1c69f0652731",role:"button",tabindex:"0",class:"content-action",onClick:e=>{this.handleActionButtonClick(e)},onKeyPress:e=>{this.handleSpaceKeyPress(e)}},this.actiontext))))}};n.style=s;export{n as z_myz_card_alert};
|
|
2
|
-
//# sourceMappingURL=p-1db926ff.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["stylesCss","ZMyzCardAlertStyle0","ZMyzCardAlert","emitUndoAction","this","undoAction","emit","actionType","type","handleSpaceKeyPress","e","keyCode","preventDefault","handleActionButtonClick","retrieveClass","className","getAlertType","AlertType","SUCCESS","WARNING","render","h","key","class","name","iconname","width","height","contenttext","actiontext","trim","length","role","tabindex","onClick","onKeyPress"],"sources":["src/snowflakes/myz/card/z-myz-card-alert/styles.css?tag=z-myz-card-alert&encapsulation=shadow","src/snowflakes/myz/card/z-myz-card-alert/index.tsx"],"sourcesContent":[":host {\n position: absolute;\n z-index: 2;\n top: 0;\n left: 0;\n width: 100%;\n font-family: var(--font-family-sans);\n font-weight: var(--font-rg);\n}\n\n:host > z-alert {\n height: calc(var(--space-unit) * 6);\n}\n\n.relative-container {\n position: relative;\n display: grid;\n align-items: center;\n padding: 0;\n grid-column-gap: var(--space-unit);\n grid-template-columns: 18px auto 46px;\n grid-template-rows: 1fr;\n outline: none;\n}\n\n.relative-container::-moz-focus-inner {\n border: 0;\n}\n\n.alert-external-wrapper.remove-alert {\n border: var(--border-size-medium) solid var(--color-surface02);\n border-top: none;\n}\n\n:host div.add-alert {\n background: var(--color-success-inverse);\n}\n\n:host div.remove-alert {\n background: var(--color-warning-inverse);\n}\n\n:host div > .content-text {\n color: var(--color-surface05);\n font-size: 14px;\n letter-spacing: 0.16px;\n line-height: 20px;\n}\n\n:host div > .content-action {\n height: 20px;\n color: var(--color-primary01);\n cursor: pointer;\n font-size: 12px;\n font-weight: var(--font-sb);\n letter-spacing: 0.32px;\n line-height: 20px;\n}\n\n:host div > z-icon {\n justify-self: center;\n}\n","import {Component, Event, EventEmitter, Prop, h} from \"@stencil/core\";\nimport {AlertType} from \"../../../../beans\";\n\n@Component({\n tag: \"z-myz-card-alert\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZMyzCardAlert {\n /** icon name */\n @Prop()\n iconname: string;\n\n /** content text */\n @Prop()\n contenttext: string;\n\n /** action button text */\n @Prop()\n actiontext?: string;\n\n /** alert variant type */\n @Prop()\n type: string;\n\n /** undo action click/keyboard event, returns actionType */\n @Event()\n undoAction: EventEmitter;\n\n private emitUndoAction(): void {\n this.undoAction.emit({actionType: this.type});\n }\n\n private handleSpaceKeyPress(e: KeyboardEvent): void {\n if (e.keyCode == 32 || e.keyCode == 13) {\n e.preventDefault();\n this.emitUndoAction();\n }\n }\n\n private handleActionButtonClick(e: MouseEvent): void {\n e.preventDefault();\n this.emitUndoAction();\n }\n\n private retrieveClass(): string {\n let className = \"\";\n switch (this.type) {\n case \"add\":\n className = \"add-alert\";\n break;\n case \"remove\":\n className = \"remove-alert\";\n break;\n default:\n className = \"\";\n break;\n }\n\n return className;\n }\n\n private getAlertType(): AlertType {\n switch (this.type) {\n case \"add\":\n return AlertType.SUCCESS;\n case \"remove\":\n return AlertType.WARNING;\n default:\n return null;\n }\n }\n\n render(): HTMLDivElement {\n return (\n <div class={\"alert-external-wrapper \" + this.retrieveClass()}>\n <z-alert type={this.getAlertType()}>\n <div class=\"relative-container\">\n <z-icon\n name={this.iconname}\n width={18}\n height={18}\n class={this.retrieveClass()}\n ></z-icon>\n <span class=\"content-text\">{this.contenttext}</span>\n {this.actiontext && !!this.actiontext.trim().length && (\n <span\n role=\"button\"\n tabindex=\"0\"\n class=\"content-action\"\n onClick={(e: MouseEvent) => {\n this.handleActionButtonClick(e);\n }}\n onKeyPress={(e: KeyboardEvent) => {\n this.handleSpaceKeyPress(e);\n }}\n >\n {this.actiontext}\n </span>\n )}\n </div>\n </z-alert>\n </div>\n );\n }\n}\n"],"mappings":"sFAAA,MAAMA,EAAY,w7BAClB,MAAAC,EAAeD,E,MCOFE,EAAa,M,iKAqBhB,cAAAC,GACNC,KAAKC,WAAWC,KAAK,CAACC,WAAYH,KAAKI,M,CAGjC,mBAAAC,CAAoBC,GAC1B,GAAIA,EAAEC,SAAW,IAAMD,EAAEC,SAAW,GAAI,CACtCD,EAAEE,iBACFR,KAAKD,gB,EAID,uBAAAU,CAAwBH,GAC9BA,EAAEE,iBACFR,KAAKD,gB,CAGC,aAAAW,GACN,IAAIC,EAAY,GAChB,OAAQX,KAAKI,MACX,IAAK,MACHO,EAAY,YACZ,MACF,IAAK,SACHA,EAAY,eACZ,MACF,QACEA,EAAY,GACZ,MAGJ,OAAOA,C,CAGD,YAAAC,GACN,OAAQZ,KAAKI,MACX,IAAK,MACH,OAAOS,EAAUC,QACnB,IAAK,SACH,OAAOD,EAAUE,QACnB,QACE,OAAO,K,CAIb,MAAAC,GACE,OACEC,EAAA,OAAAC,IAAA,2CAAKC,MAAO,0BAA4BnB,KAAKU,iBAC3CO,EAAA,WAAAC,IAAA,2CAASd,KAAMJ,KAAKY,gBAClBK,EAAA,OAAAC,IAAA,2CAAKC,MAAM,sBACTF,EAAA,UAAAC,IAAA,2CACEE,KAAMpB,KAAKqB,SACXC,MAAO,GACPC,OAAQ,GACRJ,MAAOnB,KAAKU,kBAEdO,EAAA,QAAAC,IAAA,2CAAMC,MAAM,gBAAgBnB,KAAKwB,aAChCxB,KAAKyB,cAAgBzB,KAAKyB,WAAWC,OAAOC,QAC3CV,EAAA,QAAAC,IAAA,2CACEU,KAAK,SACLC,SAAS,IACTV,MAAM,iBACNW,QAAUxB,IACRN,KAAKS,wBAAwBH,EAAE,EAEjCyB,WAAazB,IACXN,KAAKK,oBAAoBC,EAAE,GAG5BN,KAAKyB,c","ignoreList":[]}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as e,h as r}from"./p-75c4a726.js";import{L as i}from"./p-b34993de.js";const t=":host{--card-overflow:hidden}div{display:flex;overflow:var(--card-overflow);width:auto;width:256px;height:522px;box-sizing:border-box;flex-direction:column;border:var(--border-size-medium) solid var(--color-surface03);background-color:var(--color-surface01);border-radius:var(--border-radius)}div.real,div.trial,div.temp{border-color:var(--blue100)}div.faded{border:var(--border-size-medium) solid var(--color-surface02)}div.highlighted{box-shadow:var(--shadow-4);outline:none}div.pressed{box-shadow:var(--shadow-8);outline:none}div:focus{box-shadow:var(--shadow-focus-primary);outline:none}";const a=t;const d=class{constructor(r){e(this,r);this.faded=undefined;this.cardtype=undefined;this.ispressed=false;this.ishighlighted=false}retrieveClass(){let e="";if(this.cardtype===i.REAL){e+="real"}else if(this.cardtype===i.TRIAL){e+="trial"}else if(this.cardtype===i.TEMP){e+="temp"}if(this.faded){e+=" faded"}else if(this.ispressed){e+=" pressed"}else if(this.ishighlighted){e+=" highlighted"}return e}render(){return r("div",{key:"d07b37d42382d81be002b31b448e5d6ac3e8867c",class:this.retrieveClass(),tabindex:"0"},r("slot",{key:"03e02f39390a302f558bc341b538390027ecb148"}))}};d.style=a;const o=":host{width:auto;height:340px}:host>div{position:relative;display:flex;width:auto;height:340px;align-items:center;justify-content:center}";const s=o;const n=class{constructor(r){e(this,r)}render(){return r("div",{key:"5e1a72de482c87d1b26e8e60bd833a05e5f3b062"},r("slot",{key:"268e3bb553b952cbdbc55db2d17879adddf28e23",name:"alert"}),r("slot",{key:"a26bede57fa17b34b348a1384d815646c361bee5",name:"cover"}))}};n.style=s;const c="img{display:block;max-width:100%;height:340px;margin:auto;object-fit:cover}img.faded{opacity:0.3}";const l=c;const h=class{constructor(r){e(this,r);this.img=undefined;this.titolo=undefined;this.faded=undefined;this.defaultimg=undefined}hadleOnImageError(){this.img=this.defaultimg}render(){return r("img",{key:"36c96fbd2c8546b245e3ed835957ea9ddb4def3d",class:this.faded&&"faded",onError:this.hadleOnImageError.bind(this),alt:this.titolo,src:this.img})}};h.style=l;const b='header{position:relative;display:flex;width:auto;height:calc(var(--space-unit) * 6);flex-direction:row;align-items:flex-start;justify-content:space-between;border-bottom:var(--border-size-medium) solid var(--color-surface03);background-color:var(--color-surface01);border-radius:var(--border-radius) var(--border-radius) var(--border-no-radius) var(--border-no-radius)}slot[name="aria-heading"]::slotted(*){position:absolute;overflow:hidden !important;width:1px !important;height:1px !important;padding:0 !important;border:0 none !important;margin:-1px !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important}header.real,header.trial,header.temp{border-bottom:var(--border-size-medium) solid var(--blue100);background-color:var(--color-primary03)}.card-title{overflow:hidden;height:calc(var(--space-unit) * 2);padding:calc(var(--space-unit) * 2);margin:0;color:var(--color-surface05);font-family:var(--font-family-sans);font-size:12px;font-weight:var(--font-sb);letter-spacing:0.22px;line-height:calc(var(--space-unit) * 2);text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap}.faded{border-bottom:var(--border-size-medium) solid var(--color-surface02)}.faded.real,.faded.trial,.faded.temp{border-top:var(--border-size-medium) solid var(--blue100);border-right:var(--border-size-medium) solid var(--blue100);border-left:var(--border-size-medium) solid var(--blue100)}';const f=b;const u=class{constructor(r){e(this,r);this.titolo=undefined;this.faded=undefined;this.cardtype=undefined;this.allowTooltip=false}getTitle(){return this.allowTooltip?this.titolo:""}componentDidLoad(){if(this.elementHasEllipsis()){this.allowTooltip=true}}elementHasEllipsis(){return this.ellipsis.offsetWidth<this.ellipsis.scrollWidth}retrieveClass(){return{real:this.cardtype===i.REAL,trial:this.cardtype===i.TRIAL,temp:this.cardtype===i.TEMP,faded:this.faded}}render(){return r("header",{key:"40152ef3144db81f149eb5d8ecf4a823f7950f3e",class:this.retrieveClass()},r("slot",{key:"8386bb3e5a3b7c5bee3da6a6801ada1e4aa2a5dc",name:"aria-heading"}),r("span",{key:"35b55d3be757c0a646dca9184c55ad1bd922fc1e",class:"card-title",ref:e=>this.ellipsis=e,title:this.getTitle()},this.titolo),r("slot",{key:"834cb2fac275139fe0f4a97c5c75ed0422348719",name:"icon"}))}};u.style=f;export{d as z_myz_card,n as z_myz_card_body,h as z_myz_card_cover,u as z_myz_card_header};
|
|
2
|
-
//# sourceMappingURL=p-372d3d61.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["stylesCss","ZMyzCardStyle0","ZMyzCardComponent","retrieveClass","elemClasses","this","cardtype","LicenseType","REAL","TRIAL","TEMP","faded","ispressed","ishighlighted","render","h","key","class","tabindex","ZMyzCardBodyStyle0","ZMyzCardBody","name","ZMyzCardCoverStyle0","ZMyzCardCover","hadleOnImageError","img","defaultimg","onError","bind","alt","titolo","src","ZMyzCardHeaderStyle0","ZMyzCardHeader","getTitle","allowTooltip","componentDidLoad","elementHasEllipsis","ellipsis","offsetWidth","scrollWidth","real","trial","temp","ref","el","title"],"sources":["src/snowflakes/myz/card/z-myz-card/styles.css?tag=z-myz-card&encapsulation=shadow","src/snowflakes/myz/card/z-myz-card/index.tsx","src/snowflakes/myz/card/z-myz-card-body/styles.css?tag=z-myz-card-body&encapsulation=shadow","src/snowflakes/myz/card/z-myz-card-body/index.tsx","src/snowflakes/myz/card/z-myz-card-cover/styles.css?tag=z-myz-card-cover&encapsulation=shadow","src/snowflakes/myz/card/z-myz-card-cover/index.tsx","src/snowflakes/myz/card/z-myz-card-header/styles.css?tag=z-myz-card-header&encapsulation=shadow","src/snowflakes/myz/card/z-myz-card-header/index.tsx"],"sourcesContent":[":host {\n --card-overflow: hidden;\n}\n\ndiv {\n display: flex;\n overflow: var(--card-overflow);\n width: auto;\n width: 256px; /* TODO: width must be 100% - must be handled in dashboard */\n height: 522px;\n box-sizing: border-box;\n flex-direction: column;\n border: var(--border-size-medium) solid var(--color-surface03);\n background-color: var(--color-surface01);\n border-radius: var(--border-radius);\n}\n\ndiv.real,\ndiv.trial,\ndiv.temp {\n border-color: var(--blue100);\n}\n\n/* HIDDEN status */\ndiv.faded {\n border: var(--border-size-medium) solid var(--color-surface02);\n}\n\n/* HIGHLIGHTED status */\ndiv.highlighted {\n box-shadow: var(--shadow-4);\n outline: none;\n}\n\n/* PRESSED status */\ndiv.pressed {\n box-shadow: var(--shadow-8);\n outline: none;\n}\n\ndiv:focus {\n box-shadow: var(--shadow-focus-primary);\n outline: none;\n}\n","import {Component, h, Prop} from \"@stencil/core\";\nimport {LicenseType} from \"../../../../beans/index\";\n\n/**\n * @slot - generic card slot\n */\n@Component({\n tag: \"z-myz-card\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZMyzCardComponent {\n /** faded status */\n @Prop()\n faded: boolean;\n\n /** graphic variant (optional) */\n @Prop()\n cardtype?: LicenseType;\n\n /** pressed status */\n @Prop()\n ispressed = false;\n\n /** highlighted status */\n @Prop()\n ishighlighted = false;\n\n private retrieveClass(): string {\n let elemClasses = \"\";\n\n if (this.cardtype === LicenseType.REAL) {\n elemClasses += \"real\";\n } else if (this.cardtype === LicenseType.TRIAL) {\n elemClasses += \"trial\";\n } else if (this.cardtype === LicenseType.TEMP) {\n elemClasses += \"temp\";\n }\n\n if (this.faded) {\n elemClasses += \" faded\";\n } else if (this.ispressed) {\n elemClasses += \" pressed\";\n } else if (this.ishighlighted) {\n elemClasses += \" highlighted\";\n }\n\n return elemClasses;\n }\n\n render(): HTMLDivElement {\n return (\n <div\n class={this.retrieveClass()}\n tabindex=\"0\"\n >\n <slot />\n </div>\n );\n }\n}\n",":host {\n width: auto;\n height: 340px;\n}\n\n:host > div {\n position: relative;\n display: flex;\n width: auto;\n height: 340px;\n align-items: center;\n justify-content: center;\n}\n","import {Component, h} from \"@stencil/core\";\n\n/**\n * @slot alert - card alert slot\n * @slot cover - book cover slot\n */\n@Component({\n tag: \"z-myz-card-body\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZMyzCardBody {\n render(): HTMLDivElement {\n return (\n <div>\n <slot name=\"alert\"></slot>\n <slot name=\"cover\" />\n </div>\n );\n }\n}\n","img {\n display: block;\n max-width: 100%;\n height: 340px;\n margin: auto;\n object-fit: cover;\n}\n\nimg.faded {\n opacity: 0.3;\n}\n","import {Component, Prop, h} from \"@stencil/core\";\n\n@Component({\n tag: \"z-myz-card-cover\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZMyzCardCover {\n /** image source */\n @Prop()\n img: string;\n\n /** cover alt title */\n @Prop()\n titolo: string;\n\n /** faded status */\n @Prop()\n faded: boolean;\n\n /** default error image source */\n @Prop()\n defaultimg: string;\n\n private hadleOnImageError(): void {\n this.img = this.defaultimg;\n }\n\n render(): HTMLImageElement {\n return (\n <img\n class={this.faded && \"faded\"}\n onError={this.hadleOnImageError.bind(this)}\n alt={this.titolo}\n src={this.img}\n />\n );\n }\n}\n","header {\n position: relative;\n display: flex;\n width: auto;\n height: calc(var(--space-unit) * 6);\n flex-direction: row;\n align-items: flex-start;\n justify-content: space-between;\n border-bottom: var(--border-size-medium) solid var(--color-surface03);\n background-color: var(--color-surface01);\n border-radius: var(--border-radius) var(--border-radius) var(--border-no-radius) var(--border-no-radius);\n}\n\nslot[name=\"aria-heading\"]::slotted(*) {\n position: absolute;\n overflow: hidden !important;\n width: 1px !important;\n height: 1px !important;\n padding: 0 !important;\n border: 0 none !important;\n margin: -1px !important;\n clip: rect(0, 0, 0, 0) !important;\n white-space: nowrap !important;\n}\n\nheader.real,\nheader.trial,\nheader.temp {\n border-bottom: var(--border-size-medium) solid var(--blue100);\n background-color: var(--color-primary03);\n}\n\n.card-title {\n overflow: hidden;\n height: calc(var(--space-unit) * 2);\n padding: calc(var(--space-unit) * 2);\n margin: 0;\n color: var(--color-surface05);\n font-family: var(--font-family-sans);\n font-size: 12px;\n font-weight: var(--font-sb);\n letter-spacing: 0.22px;\n line-height: calc(var(--space-unit) * 2);\n text-overflow: ellipsis;\n text-transform: uppercase;\n white-space: nowrap;\n}\n\n.faded {\n border-bottom: var(--border-size-medium) solid var(--color-surface02);\n}\n\n.faded.real,\n.faded.trial,\n.faded.temp {\n border-top: var(--border-size-medium) solid var(--blue100);\n border-right: var(--border-size-medium) solid var(--blue100);\n border-left: var(--border-size-medium) solid var(--blue100);\n}\n","import {Component, Prop, State, h} from \"@stencil/core\";\nimport {JSXBase} from \"@stencil/core/internal\";\nimport {LicenseType} from \"../../../../beans/index\";\n\n/**\n * @slot icon - card header icon slot\n */\n@Component({\n tag: \"z-myz-card-header\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZMyzCardHeader {\n /** volume title */\n @Prop()\n titolo: string;\n\n /** faded status */\n @Prop()\n faded: boolean;\n\n /** card graphic variant (optional) */\n @Prop()\n cardtype?: LicenseType;\n\n @State()\n allowTooltip = false;\n\n private ellipsis?: HTMLElement;\n\n private getTitle(): string {\n return this.allowTooltip ? this.titolo : \"\";\n }\n\n componentDidLoad(): void {\n if (this.elementHasEllipsis()) {\n this.allowTooltip = true;\n }\n }\n\n private elementHasEllipsis(): boolean {\n return this.ellipsis.offsetWidth < this.ellipsis.scrollWidth;\n }\n\n private retrieveClass(): JSXBase.HTMLAttributes[\"class\"] {\n return {\n real: this.cardtype === LicenseType.REAL,\n trial: this.cardtype === LicenseType.TRIAL,\n temp: this.cardtype === LicenseType.TEMP,\n faded: this.faded,\n };\n }\n\n render(): HTMLElement {\n return (\n <header class={this.retrieveClass()}>\n <slot name=\"aria-heading\" />\n <span\n class=\"card-title\"\n ref={(el) => (this.ellipsis = el as HTMLElement)}\n title={this.getTitle()}\n >\n {this.titolo}\n </span>\n <slot name=\"icon\" />\n </header>\n );\n }\n}\n"],"mappings":"+EAAA,MAAMA,EAAY,klBAClB,MAAAC,EAAeD,E,MCUFE,EAAiB,M,qFAWhB,M,mBAII,K,CAER,aAAAC,GACN,IAAIC,EAAc,GAElB,GAAIC,KAAKC,WAAaC,EAAYC,KAAM,CACtCJ,GAAe,M,MACV,GAAIC,KAAKC,WAAaC,EAAYE,MAAO,CAC9CL,GAAe,O,MACV,GAAIC,KAAKC,WAAaC,EAAYG,KAAM,CAC7CN,GAAe,M,CAGjB,GAAIC,KAAKM,MAAO,CACdP,GAAe,Q,MACV,GAAIC,KAAKO,UAAW,CACzBR,GAAe,U,MACV,GAAIC,KAAKQ,cAAe,CAC7BT,GAAe,c,CAGjB,OAAOA,C,CAGT,MAAAU,GACE,OACEC,EAAA,OAAAC,IAAA,2CACEC,MAAOZ,KAAKF,gBACZe,SAAS,KAETH,EAAA,QAAAC,IAAA,6C,aCxDR,MAAMhB,EAAY,4IAClB,MAAAmB,EAAenB,E,MCUFoB,EAAY,M,yBACvB,MAAAN,GACE,OACEC,EAAA,OAAAC,IAAA,4CACED,EAAA,QAAAC,IAAA,2CAAMK,KAAK,UACXN,EAAA,QAAAC,IAAA,2CAAMK,KAAK,U,aChBnB,MAAMrB,EAAY,oGAClB,MAAAsB,EAAetB,E,MCMFuB,EAAa,M,iHAiBhB,iBAAAC,GACNnB,KAAKoB,IAAMpB,KAAKqB,U,CAGlB,MAAAZ,GACE,OACEC,EAAA,OAAAC,IAAA,2CACEC,MAAOZ,KAAKM,OAAS,QACrBgB,QAAStB,KAAKmB,kBAAkBI,KAAKvB,MACrCwB,IAAKxB,KAAKyB,OACVC,IAAK1B,KAAKoB,K,aClClB,MAAMzB,EAAY,03CAClB,MAAAgC,EAAehC,E,MCWFiC,EAAc,M,8GAcV,K,CAIP,QAAAC,GACN,OAAO7B,KAAK8B,aAAe9B,KAAKyB,OAAS,E,CAG3C,gBAAAM,GACE,GAAI/B,KAAKgC,qBAAsB,CAC7BhC,KAAK8B,aAAe,I,EAIhB,kBAAAE,GACN,OAAOhC,KAAKiC,SAASC,YAAclC,KAAKiC,SAASE,W,CAG3C,aAAArC,GACN,MAAO,CACLsC,KAAMpC,KAAKC,WAAaC,EAAYC,KACpCkC,MAAOrC,KAAKC,WAAaC,EAAYE,MACrCkC,KAAMtC,KAAKC,WAAaC,EAAYG,KACpCC,MAAON,KAAKM,M,CAIhB,MAAAG,GACE,OACEC,EAAA,UAAAC,IAAA,2CAAQC,MAAOZ,KAAKF,iBAClBY,EAAA,QAAAC,IAAA,2CAAMK,KAAK,iBACXN,EAAA,QAAAC,IAAA,2CACEC,MAAM,aACN2B,IAAMC,GAAQxC,KAAKiC,SAAWO,EAC9BC,MAAOzC,KAAK6B,YAEX7B,KAAKyB,QAERf,EAAA,QAAAC,IAAA,2CAAMK,KAAK,S","ignoreList":[]}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as t,c as e,h as i,g as r}from"./p-75c4a726.js";import{Y as a}from"./p-b34993de.js";import{B as o}from"./p-5145a606.js";import{r as s}from"./p-10607a39.js";const n=':host{--z-book-card-ribbon-background-color:var(--avatar-C08);--z-book-card-ribbon-shadow-color:var(--green950);--z-book-card-compact-width:262px;--z-book-card-compact-height:568px}:host>article{display:block;width:100%;max-width:360px;box-sizing:border-box;border:var(--border-size-medium) solid var(--color-surface03);background-color:var(--color-surface01);border-radius:var(--border-radius);font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>article div.cover{position:relative}:host>article div.cover div.img-wrapper{display:flex;overflow:hidden;border:var(--border-size-small) solid var(--color-surface03);line-height:0}:host>article div.cover div.img-wrapper img{width:auto;max-width:100%;height:auto;max-height:100%;align-self:flex-end}:host>article div.cover .ribbon{position:absolute;z-index:10;top:calc(var(--space-unit) * 2);left:calc(var(--space-unit) * -2);display:flex;max-width:100%;height:calc(var(--space-unit) * 4);box-sizing:border-box;align-items:center;padding:0 calc(var(--space-unit) * 2);border:var(--border-size-medium) solid var(--color-surface01);background:var(--z-book-card-ribbon-background-color);border-radius:0 var(--border-radius) var(--border-radius) 0;box-shadow:var(--shadow-2);color:var(--color-text-inverse);font-family:var(--font-family-sans);font-size:var(--font-size-2);font-weight:var(--font-sb);line-height:initial}:host>article div.cover .ribbon.interactive:hover{cursor:pointer}:host>article div.cover .ribbon.interactive:focus{box-shadow:var(--shadow-focus-primary);outline:none !important}:host>article div.cover .ribbon span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-wrap:nowrap}:host>article div.cover .ribbon::before{position:absolute;bottom:-12px;left:-2px;width:0;height:0;border-top:10px solid var(--z-book-card-ribbon-shadow-color);border-left:16px solid transparent;content:""}:host>article div.cover .ribbon z-icon{margin-right:var(--space-unit)}:host>article div.content{margin:var(--space-unit) 0;border-radius:var(--border-radius)}:host>article .title{display:flex;height:100%;align-self:center;color:var(--color-default-text);font-size:var(--font-size-4);font-weight:var(--font-sb);line-height:1.5}:host>article .title *{all:unset}:host>article div.subtitle{color:var(--color-default-text);font-size:var(--font-size-2);font-weight:var(--font-rg);line-height:1.4}:host>article div.authors{color:var(--color-default-text);font-size:var(--font-size-1);font-weight:var(--font-rg);line-height:1.33}:host>article div.isbn{overflow:hidden;color:var(--color-default-text);font-size:var(--font-size-2);line-height:1.33;text-overflow:ellipsis;white-space:nowrap;word-wrap:nowrap}:host>article div.isbn>.code{font-weight:var(--font-sb)}:host>article div.tags{display:flex;overflow:hidden;max-height:32px;flex-flow:row wrap;align-content:stretch;align-items:stretch;justify-content:flex-start;gap:calc(var(--space-unit) / 2)}:host>article ::slotted([slot="tags"]){margin-bottom:var(--space-unit)}:host>article ::slotted([slot="header-cta"]){--z-icon-width:20px;--z-icon-height:20px;padding:var(--space-unit);cursor:pointer;fill:var(--color-primary01-icon)}:host>article ::slotted([slot="header-cta"]:focus){box-shadow:var(--shadow-focus-primary);outline:none !important}:host>article.expanded{width:100%;min-width:328px;padding:calc(var(--space-unit) * 2);padding-bottom:0}:host>article.expanded div.header{display:flex;flex-flow:row nowrap;align-content:stretch;align-items:top;justify-content:space-between;margin-bottom:var(--space-unit);white-space:nowrap}:host>article.expanded div.cover div.img-wrapper{border-radius:var(--border-radius)}:host>article.expanded div.cover div.img-wrapper img{width:100%}:host>article.expanded .title,:host>article.expanded .subtitle,:host>article.expanded .authors{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2;white-space:initial}:host>article.expanded div.footer{border-top:var(--border-size-small) solid var(--color-surface03);margin-bottom:calc(var(--space-unit) * 1.5)}:host>article.expanded div.footer.open{padding-top:calc(var(--space-unit) * 1.5)}:host>article.expanded div.footer.open div.resources{display:initial}:host>article.expanded div.footer.close div.resources{display:none}:host>article.expanded button.show-resources{--z-icon-height:16px;--z-icon-width:16px;all:unset;display:flex;width:100%;flex-flow:row nowrap;align-content:center;align-items:center;justify-content:center;padding:calc(var(--space-unit) * 1) 0;color:var(--color-link-primary);cursor:pointer;fill:var(--color-link-primary);font-size:var(--font-size-2);font-weight:var(--font-sb);gap:var(--space-unit)}:host>article.expanded button.show-resources:focus{box-shadow:var(--shadow-focus-primary)}:host>article.search{width:262px;height:616px;padding:calc(var(--space-unit) * 2);padding-bottom:0}:host>article.search .wrapper-container{display:flex;height:100%;flex-direction:column;justify-content:space-between}:host>article.search .wrapper-container .wrapper{height:451px}:host>article.search .wrapper-container .action-container{padding-bottom:calc(var(--space-unit) * 2)}:host>article.search div.header{display:flex;height:24px;flex-flow:row nowrap;align-content:stretch;align-items:center;justify-content:space-between;margin-bottom:calc(var(--space-unit) * 1.5);white-space:nowrap}:host>article.search div.cover div.img-wrapper{height:314px;border-radius:var(--border-radius)}:host>article.search .title{display:block;height:initial;align-self:unset;font-size:var(--font-size-3)}:host>article.search .title,:host>article.search .subtitle,:host>article.search .authors{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host>article.compact{width:var(--z-book-card-compact-width);height:var(--z-book-card-compact-height)}:host>article.compact.borderless{border:none}:host>article.compact div.cover div.img-wrapper{width:100%;height:calc(var(--z-book-card-compact-width) * 1.36);box-sizing:border-box;border:none;background:var(--color-white);border-radius:var(--border-radius) var(--border-radius) 0 0;box-shadow:var(--shadow-2)}:host>article.compact div.wrapper{display:flex;height:100%;flex-flow:column nowrap;align-content:stretch;align-items:stretch;justify-content:flex-start}:host>article.compact div.content{display:flex;box-sizing:border-box;flex-flow:column nowrap;align-content:stretch;align-items:stretch;justify-content:space-between;padding:calc(var(--space-unit) * 2);padding-top:var(--space-unit);margin:0}:host>article.compact div.action-container{padding:calc(var(--space-unit) * 2);padding-top:0;margin-top:auto}:host>article.compact.borderless div.cover div.img-wrapper{width:var(--z-book-card-compact-width)}:host>article.compact.borderless div.content{padding:0;padding-top:var(--space-unit)}:host>article.compact.borderless div.action-container{padding:0;padding-bottom:calc(var(--space-unit) * 2)}:host>article.compact .title{display:block;height:initial;align-self:unset}:host>article.compact .title,:host>article.compact .subtitle,:host>article.compact .authors{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2;white-space:initial}@media (min-width: 768px){:host>article{width:100%;max-width:initial}:host>article .title{display:block;height:initial;align-self:unset}:host>article.expanded{width:100%;min-width:initial;max-width:initial;height:360px;padding:0;border:0}:host>article.expanded div.wrapper{display:flex;flex-flow:row nowrap;align-content:stretch;align-items:stretch;justify-content:flex-start}:host>article.expanded div.cover div.img-wrapper{width:262px;height:356px;border:0;border:var(--border-size-medium) solid var(--color-surface03);border-right:none;background:var(--color-surface01);border-radius:var(--border-radius) 0 0 var(--border-radius)}:host>article.expanded div.cover div.img-wrapper img{width:auto;border-radius:0}:host>article.expanded div.content{display:flex;overflow:hidden;width:100%;height:356px;flex-flow:column nowrap;align-content:stretch;align-items:stretch;justify-content:space-between;border:var(--border-size-medium) solid var(--color-surface03);border-left:none;margin:0;background:var(--color-surface01);border-radius:0 var(--border-radius) var(--border-radius) 0}:host>article.expanded div.content div.top{padding:calc(var(--space-unit) * 2);padding-bottom:0}:host>article.expanded div.content div.top div.info{display:flex;flex-flow:row nowrap;align-content:stretch;align-items:stretch;justify-content:space-between;margin-bottom:calc(var(--space-unit) / 2)}:host>article.expanded div.content div.top div.info>div.left{width:100%}:host>article.expanded div.content div.bottom{padding:calc(var(--space-unit) * 2);padding-bottom:0}}@media (min-width: 1152px){:host>article{width:fit-content;max-width:initial}}@media (min-width: 1366px){:host>article.expanded{width:635px}:host>article.expanded div.content{width:369px}}';const d=n;const c=class{constructor(i){t(this,i);this.ribbonClick=e(this,"ribbonClick",7);this.variant=undefined;this.cover=undefined;this.operaTitle=undefined;this.volumeTitle=undefined;this.authors=undefined;this.isbn=undefined;this.isbnLabel="";this.ribbon=undefined;this.ribbonIcon=undefined;this.ribbonInteractive=undefined;this.borderless=undefined;this.fallbackCover=undefined;this.operaTitleTag=undefined;this.isMobile=false;this.hasResources=false;this.showResources=false}emitRibbonClick(){this.ribbonClick.emit()}componentWillLoad(){this.id=`id-${s()}`;const t=window.matchMedia(`(max-width: ${o.MOBILE}px)`);this.isMobile=t.matches;t.onchange=t=>this.isMobile=t.matches}componentDidLoad(){this.handleResources()}handleResources(){var t;if(this.variant!==a.EXPANDED||!this.isMobile){return}this.hasResources=((t=this.hostElement.querySelectorAll("[slot=resources]"))===null||t===void 0?void 0:t.length)>0}toggleResources(){this.showResources=!this.showResources}renderCard(){switch(this.variant){case a.EXPANDED:return this.isMobile?this.renderMobileExpandedCard():this.renderExpandedCard();case a.COMPACT:return this.renderCompactCard();case a.SEARCH:return this.renderSearchCard()}}renderExpandedCard(){return i("div",{class:"wrapper"},this.renderCover(),i("div",{class:"content"},i("div",{class:"top"},i("div",{class:"info"},i("div",{class:"left"},this.renderAuthors(),this.renderOperaTitle(),this.renderVolumeTitle(),this.renderIsbn()),i("div",{class:"right"},this.renderHeaderCtaSlot())),this.renderTagsSlot()),i("div",{class:"bottom"},this.renderResourcesSlot())))}renderMobileExpandedCard(){return i("div",{class:"wrapper"},i("div",{class:"header"},this.renderOperaTitle(),this.renderHeaderCtaSlot()),this.renderCover(),i("div",{class:"content"},this.renderTagsSlot(),this.renderAuthors(),this.renderVolumeTitle(),this.renderIsbn()),this.hasResources&&i("div",{class:{footer:true,open:this.showResources,close:!this.showResources}},!this.showResources&&this.renderShowResources(),this.renderResourcesSlot(),this.showResources&&this.renderShowResources()))}renderSearchCard(){return i("div",{class:"wrapper-container"},i("div",{class:"wrapper"},i("div",{class:"header"},this.renderOperaTitle(),this.renderHeaderCtaSlot()),this.renderCover(),i("div",{class:"content"},this.renderTagsSlot(),this.renderAuthors(),this.renderVolumeTitle(),this.renderIsbn())),this.renderFooterCtaSlot())}renderCompactCard(){return i("div",{class:"wrapper"},this.renderCover(),i("div",{class:"content"},this.renderAuthors(),this.renderOperaTitle(),this.renderVolumeTitle(),this.renderIsbn()),this.renderFooterCtaSlot())}renderCover(){return i("div",{class:"cover"},this.ribbon&&this.variant!==a.COMPACT&&this.renderRibbon(),i("div",{class:"img-wrapper"},i("img",{src:this.cover,onError:()=>{if(this.fallbackCover){this.cover=this.fallbackCover}},"aria-hidden":"true"})))}renderRibbon(){const t=[this.ribbonIcon&&i("z-icon",{name:this.ribbonIcon,width:16,height:16,fill:"color-inverse-icon"}),i("span",null,this.ribbon)];return this.ribbonInteractive?i("button",{class:"ribbon interactive",onClick:()=>this.emitRibbonClick()},t):i("div",{class:"ribbon"},t)}renderOperaTitle(){const t=this.operaTitleTag?`<${this.operaTitleTag}>${this.operaTitle}</${this.operaTitleTag}>`:this.operaTitle;return i("div",{class:"title",innerHTML:t})}renderVolumeTitle(){return this.volumeTitle?i("div",{class:"subtitle"},this.volumeTitle):null}renderAuthors(){return this.authors?i("div",{class:"authors","aria-description":"Autori"},this.authors):null}renderIsbn(){return this.isbn?i("div",{class:"isbn"},i("span",{class:"code","aria-description":`ISBN ${this.isbnLabel}`},this.isbn),this.isbnLabel?i("span",{class:"label"}," ",this.isbnLabel):null):null}renderShowResources(){return i("button",{class:"show-resources","aria-label":`Risorse del libro ${this.operaTitle}`,"aria-expanded":this.showResources.toString(),"aria-controls":`resources-${this.id}`,onClick:()=>this.toggleResources()},this.showResources?"Chiudi":"Vedi tutto",i("z-icon",{name:this.showResources?"chevron-up":"chevron-down"}))}renderTagsSlot(){return i("div",{class:"tags"},i("slot",{name:"tags"}))}renderHeaderCtaSlot(){return i("slot",{name:"header-cta"})}renderResourcesSlot(){return i("div",{id:`resources-${this.id}`,class:"resources"},i("slot",{name:"resources",onSlotchange:()=>this.handleResources()}))}renderFooterCtaSlot(){return i("div",{class:"action-container"},i("slot",{name:"footer-cta"}))}render(){return i("article",{key:"3f1180dbc4753548ce11a6827a9c4c0d5080ec71",class:{[this.variant]:true,borderless:!!this.borderless}},this.renderCard())}get hostElement(){return r(this)}};c.style=d;export{c as z_book_card_deprecated};
|
|
2
|
-
//# sourceMappingURL=p-3be73d77.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["stylesCss","ZBookCardDeprecatedStyle0","ZBookCardDeprecated","emitRibbonClick","this","ribbonClick","emit","componentWillLoad","id","randomId","mobileMediaQuery","window","matchMedia","Breakpoints","MOBILE","isMobile","matches","onchange","mql","componentDidLoad","handleResources","variant","BookCardDeprecatedVariant","EXPANDED","hasResources","_a","hostElement","querySelectorAll","length","toggleResources","showResources","renderCard","renderMobileExpandedCard","renderExpandedCard","COMPACT","renderCompactCard","SEARCH","renderSearchCard","h","class","renderCover","renderAuthors","renderOperaTitle","renderVolumeTitle","renderIsbn","renderHeaderCtaSlot","renderTagsSlot","renderResourcesSlot","footer","open","close","renderShowResources","renderFooterCtaSlot","ribbon","renderRibbon","src","cover","onError","fallbackCover","content","ribbonIcon","name","width","height","fill","ribbonInteractive","onClick","title","operaTitleTag","operaTitle","innerHTML","volumeTitle","authors","isbn","isbnLabel","toString","onSlotchange","render","key","borderless"],"sources":["src/components/deprecated/z-book-card-deprecated/styles.css?tag=z-book-card-deprecated&encapsulation=shadow","src/components/deprecated/z-book-card-deprecated/index.tsx"],"sourcesContent":["/* COMMON STYLES */\n\n:host {\n --z-book-card-ribbon-background-color: var(--avatar-C08);\n --z-book-card-ribbon-shadow-color: var(--green950);\n --z-book-card-compact-width: 262px;\n --z-book-card-compact-height: 568px;\n}\n\n:host > article {\n display: block;\n width: 100%;\n max-width: 360px;\n box-sizing: border-box;\n border: var(--border-size-medium) solid var(--color-surface03);\n background-color: var(--color-surface01);\n border-radius: var(--border-radius);\n font-family: var(--font-family-sans);\n font-weight: var(--font-rg);\n}\n\n:host > article div.cover {\n position: relative;\n}\n\n:host > article div.cover div.img-wrapper {\n display: flex;\n overflow: hidden;\n border: var(--border-size-small) solid var(--color-surface03);\n line-height: 0;\n}\n\n:host > article div.cover div.img-wrapper img {\n width: auto;\n max-width: 100%;\n height: auto;\n max-height: 100%;\n align-self: flex-end;\n}\n\n:host > article div.cover .ribbon {\n position: absolute;\n z-index: 10;\n top: calc(var(--space-unit) * 2);\n left: calc(var(--space-unit) * -2);\n display: flex;\n max-width: 100%;\n height: calc(var(--space-unit) * 4);\n box-sizing: border-box;\n align-items: center;\n padding: 0 calc(var(--space-unit) * 2);\n border: var(--border-size-medium) solid var(--color-surface01);\n background: var(--z-book-card-ribbon-background-color);\n border-radius: 0 var(--border-radius) var(--border-radius) 0;\n box-shadow: var(--shadow-2);\n color: var(--color-text-inverse);\n font-family: var(--font-family-sans);\n font-size: var(--font-size-2);\n font-weight: var(--font-sb);\n line-height: initial;\n}\n\n:host > article div.cover .ribbon.interactive:hover {\n cursor: pointer;\n}\n\n:host > article div.cover .ribbon.interactive:focus {\n box-shadow: var(--shadow-focus-primary);\n outline: none !important;\n}\n\n:host > article div.cover .ribbon span {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n word-wrap: nowrap;\n}\n\n:host > article div.cover .ribbon::before {\n position: absolute;\n bottom: -12px;\n left: -2px;\n width: 0;\n height: 0;\n border-top: 10px solid var(--z-book-card-ribbon-shadow-color);\n border-left: 16px solid transparent;\n content: \"\";\n}\n\n:host > article div.cover .ribbon z-icon {\n margin-right: var(--space-unit);\n}\n\n:host > article div.content {\n margin: var(--space-unit) 0;\n border-radius: var(--border-radius);\n}\n\n:host > article .title {\n display: flex;\n height: 100%;\n align-self: center;\n color: var(--color-default-text);\n font-size: var(--font-size-4);\n font-weight: var(--font-sb);\n line-height: 1.5;\n}\n\n:host > article .title * {\n all: unset;\n}\n\n:host > article div.subtitle {\n color: var(--color-default-text);\n font-size: var(--font-size-2);\n font-weight: var(--font-rg);\n line-height: 1.4;\n}\n\n:host > article div.authors {\n color: var(--color-default-text);\n font-size: var(--font-size-1);\n font-weight: var(--font-rg);\n line-height: 1.33;\n}\n\n:host > article div.isbn {\n overflow: hidden;\n color: var(--color-default-text);\n font-size: var(--font-size-2);\n line-height: 1.33;\n text-overflow: ellipsis;\n white-space: nowrap;\n word-wrap: nowrap;\n}\n\n:host > article div.isbn > .code {\n font-weight: var(--font-sb);\n}\n\n:host > article div.tags {\n display: flex;\n overflow: hidden;\n max-height: 32px;\n flex-flow: row wrap;\n align-content: stretch;\n align-items: stretch;\n justify-content: flex-start;\n gap: calc(var(--space-unit) / 2);\n}\n\n:host > article ::slotted([slot=\"tags\"]) {\n margin-bottom: var(--space-unit);\n}\n\n:host > article ::slotted([slot=\"header-cta\"]) {\n --z-icon-width: 20px;\n --z-icon-height: 20px;\n\n padding: var(--space-unit);\n cursor: pointer;\n fill: var(--color-primary01-icon);\n}\n\n:host > article ::slotted([slot=\"header-cta\"]:focus) {\n box-shadow: var(--shadow-focus-primary);\n outline: none !important;\n}\n\n/* EXPANDED STYLES */\n\n:host > article.expanded {\n width: 100%;\n min-width: 328px;\n padding: calc(var(--space-unit) * 2);\n padding-bottom: 0;\n}\n\n:host > article.expanded div.header {\n display: flex;\n flex-flow: row nowrap;\n align-content: stretch;\n align-items: top;\n justify-content: space-between;\n margin-bottom: var(--space-unit);\n white-space: nowrap;\n}\n\n:host > article.expanded div.cover div.img-wrapper {\n border-radius: var(--border-radius);\n}\n\n:host > article.expanded div.cover div.img-wrapper img {\n width: 100%;\n}\n\n:host > article.expanded .title,\n:host > article.expanded .subtitle,\n:host > article.expanded .authors {\n display: -webkit-box;\n overflow: hidden;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 2;\n white-space: initial;\n}\n\n:host > article.expanded div.footer {\n border-top: var(--border-size-small) solid var(--color-surface03);\n margin-bottom: calc(var(--space-unit) * 1.5);\n}\n\n:host > article.expanded div.footer.open {\n padding-top: calc(var(--space-unit) * 1.5);\n}\n\n:host > article.expanded div.footer.open div.resources {\n display: initial;\n}\n\n:host > article.expanded div.footer.close div.resources {\n display: none;\n}\n\n:host > article.expanded button.show-resources {\n --z-icon-height: 16px;\n --z-icon-width: 16px;\n\n all: unset;\n display: flex;\n width: 100%;\n flex-flow: row nowrap;\n align-content: center;\n align-items: center;\n justify-content: center;\n padding: calc(var(--space-unit) * 1) 0;\n color: var(--color-link-primary);\n cursor: pointer;\n fill: var(--color-link-primary);\n font-size: var(--font-size-2);\n font-weight: var(--font-sb);\n gap: var(--space-unit);\n}\n\n:host > article.expanded button.show-resources:focus {\n box-shadow: var(--shadow-focus-primary);\n}\n\n/* SEARCH STYLES */\n\n:host > article.search {\n width: 262px;\n height: 616px;\n padding: calc(var(--space-unit) * 2);\n padding-bottom: 0;\n}\n\n:host > article.search .wrapper-container {\n display: flex;\n height: 100%;\n flex-direction: column;\n justify-content: space-between;\n}\n\n:host > article.search .wrapper-container .wrapper {\n height: 451px;\n}\n\n:host > article.search .wrapper-container .action-container {\n padding-bottom: calc(var(--space-unit) * 2);\n}\n\n:host > article.search div.header {\n display: flex;\n height: 24px;\n flex-flow: row nowrap;\n align-content: stretch;\n align-items: center;\n justify-content: space-between;\n margin-bottom: calc(var(--space-unit) * 1.5);\n white-space: nowrap;\n}\n\n:host > article.search div.cover div.img-wrapper {\n height: 314px;\n border-radius: var(--border-radius);\n}\n\n:host > article.search .title {\n display: block;\n height: initial;\n align-self: unset;\n font-size: var(--font-size-3);\n}\n\n:host > article.search .title,\n:host > article.search .subtitle,\n:host > article.search .authors {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n/* COMPACT STYLES */\n\n:host > article.compact {\n width: var(--z-book-card-compact-width);\n height: var(--z-book-card-compact-height);\n}\n\n:host > article.compact.borderless {\n border: none;\n}\n\n:host > article.compact div.cover div.img-wrapper {\n width: 100%;\n height: calc(var(--z-book-card-compact-width) * 1.36);\n box-sizing: border-box;\n border: none;\n background: var(--color-white);\n border-radius: var(--border-radius) var(--border-radius) 0 0;\n box-shadow: var(--shadow-2);\n}\n\n:host > article.compact div.wrapper {\n display: flex;\n height: 100%;\n flex-flow: column nowrap;\n align-content: stretch;\n align-items: stretch;\n justify-content: flex-start;\n}\n\n:host > article.compact div.content {\n display: flex;\n box-sizing: border-box;\n flex-flow: column nowrap;\n align-content: stretch;\n align-items: stretch;\n justify-content: space-between;\n padding: calc(var(--space-unit) * 2);\n padding-top: var(--space-unit);\n margin: 0;\n}\n\n:host > article.compact div.action-container {\n padding: calc(var(--space-unit) * 2);\n padding-top: 0;\n margin-top: auto;\n}\n\n:host > article.compact.borderless div.cover div.img-wrapper {\n width: var(--z-book-card-compact-width);\n}\n\n:host > article.compact.borderless div.content {\n padding: 0;\n padding-top: var(--space-unit);\n}\n\n:host > article.compact.borderless div.action-container {\n padding: 0;\n padding-bottom: calc(var(--space-unit) * 2);\n}\n\n:host > article.compact .title {\n display: block;\n height: initial;\n align-self: unset;\n}\n\n:host > article.compact .title,\n:host > article.compact .subtitle,\n:host > article.compact .authors {\n display: -webkit-box;\n overflow: hidden;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 2;\n white-space: initial;\n}\n\n/* Tablet breakpoint */\n@media (min-width: 768px) {\n :host > article {\n width: 100%;\n max-width: initial;\n }\n\n :host > article .title {\n display: block;\n height: initial;\n align-self: unset;\n }\n\n /* EXPANDED STYLES */\n\n :host > article.expanded {\n width: 100%;\n min-width: initial;\n max-width: initial;\n height: 360px;\n padding: 0;\n border: 0;\n }\n\n :host > article.expanded div.wrapper {\n display: flex;\n flex-flow: row nowrap;\n align-content: stretch;\n align-items: stretch;\n justify-content: flex-start;\n }\n\n :host > article.expanded div.cover div.img-wrapper {\n width: 262px;\n height: 356px;\n border: 0;\n border: var(--border-size-medium) solid var(--color-surface03);\n border-right: none;\n background: var(--color-surface01);\n border-radius: var(--border-radius) 0 0 var(--border-radius);\n }\n\n :host > article.expanded div.cover div.img-wrapper img {\n width: auto;\n border-radius: 0;\n }\n\n :host > article.expanded div.content {\n display: flex;\n overflow: hidden;\n width: 100%;\n height: 356px;\n flex-flow: column nowrap;\n align-content: stretch;\n align-items: stretch;\n justify-content: space-between;\n border: var(--border-size-medium) solid var(--color-surface03);\n border-left: none;\n margin: 0;\n background: var(--color-surface01);\n border-radius: 0 var(--border-radius) var(--border-radius) 0;\n }\n\n :host > article.expanded div.content div.top {\n padding: calc(var(--space-unit) * 2);\n padding-bottom: 0;\n }\n\n :host > article.expanded div.content div.top div.info {\n display: flex;\n flex-flow: row nowrap;\n align-content: stretch;\n align-items: stretch;\n justify-content: space-between;\n margin-bottom: calc(var(--space-unit) / 2);\n }\n\n :host > article.expanded div.content div.top div.info > div.left {\n width: 100%;\n }\n\n :host > article.expanded div.content div.bottom {\n padding: calc(var(--space-unit) * 2);\n padding-bottom: 0;\n }\n}\n\n/* Desktop breakpoint */\n\n@media (min-width: 1152px) {\n :host > article {\n width: fit-content;\n max-width: initial;\n }\n}\n\n/* Wide breakpoint */\n@media (min-width: 1366px) {\n :host > article.expanded {\n width: 635px;\n }\n\n :host > article.expanded div.content {\n width: 369px;\n }\n}\n","import {Component, Element, Event, EventEmitter, Prop, State, h} from \"@stencil/core\";\nimport {BookCardDeprecatedVariant} from \"../../../beans\";\nimport {Breakpoints} from \"../../../constants/breakpoints\";\nimport {randomId} from \"../../../utils/utils\";\n\n/**\n * @slot resources - books resources (extended variant only)\n * @slot header-cta - header CTA (e.g. bookmark icon - extended and search variant only)\n * @slot tags - card tags (extended and search variant only)\n * @slot footer-cta - footer cta button (search and compact variant only)\n * @cssprop --z-book-card-ribbon-background-color - ribbon backgrund color\n * @cssprop --z-book-card-ribbon-shadow-color - ribbon shadow color\n * @cssprop --z-book-card-compact-width - compact card custom width\n * @cssprop --z-book-card-compact-height - compact card custom height\n */\n@Component({\n tag: \"z-book-card-deprecated\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZBookCardDeprecated {\n @Element() hostElement: HTMLZBookCardDeprecatedElement;\n\n /**\n * Card variant: expanded, compact, search\n */\n @Prop()\n variant: BookCardDeprecatedVariant;\n\n /**\n * Cover URL\n */\n @Prop()\n cover: string;\n\n /**\n * Card main title\n */\n @Prop()\n operaTitle: string;\n\n /**\n * [optional] Card subtitle\n */\n @Prop()\n volumeTitle?: string;\n\n /**\n * [optional] Authors\n */\n @Prop()\n authors?: string;\n\n /**\n * [optional] Main ISBN\n */\n @Prop()\n isbn?: string;\n\n /**\n * [optional] ISBN label\n */\n @Prop()\n isbnLabel = \"\";\n\n /**\n * [optional] Ribbon label - expanded and search variant only\n */\n @Prop()\n ribbon?: string;\n\n /**\n * [optional] Ribbon icon - expanded and search variant only\n */\n @Prop()\n ribbonIcon?: string;\n\n /**\n * [optional] Ribbon interactive - expanded and search variant only\n */\n @Prop()\n ribbonInteractive?: boolean;\n\n /**\n * [optional] Borderless card - compact variant only\n */\n @Prop()\n borderless?: boolean;\n\n /**\n * [optional] Fallback cover URL\n */\n @Prop()\n fallbackCover?: string;\n\n /**\n * [optional] [accessibility] Card title HTML tag\n */\n @Prop()\n operaTitleTag?: string;\n\n @State()\n isMobile = false;\n\n @State()\n hasResources = false;\n\n @State()\n showResources = false;\n\n /** click on interactive ribbon */\n @Event()\n ribbonClick: EventEmitter;\n\n private emitRibbonClick(): void {\n this.ribbonClick.emit();\n }\n\n private id: string;\n\n componentWillLoad(): void {\n this.id = `id-${randomId()}`;\n\n const mobileMediaQuery = window.matchMedia(`(max-width: ${Breakpoints.MOBILE}px)`);\n this.isMobile = mobileMediaQuery.matches;\n mobileMediaQuery.onchange = (mql) => (this.isMobile = mql.matches);\n }\n\n componentDidLoad(): void {\n this.handleResources();\n }\n\n private handleResources(): void {\n if (this.variant !== BookCardDeprecatedVariant.EXPANDED || !this.isMobile) {\n return;\n }\n this.hasResources = this.hostElement.querySelectorAll(\"[slot=resources]\")?.length > 0;\n }\n\n private toggleResources(): void {\n this.showResources = !this.showResources;\n }\n\n private renderCard(): HTMLDivElement {\n switch (this.variant) {\n case BookCardDeprecatedVariant.EXPANDED:\n return this.isMobile ? this.renderMobileExpandedCard() : this.renderExpandedCard();\n case BookCardDeprecatedVariant.COMPACT:\n return this.renderCompactCard();\n case BookCardDeprecatedVariant.SEARCH:\n return this.renderSearchCard();\n }\n }\n\n private renderExpandedCard(): HTMLDivElement {\n return (\n <div class=\"wrapper\">\n {this.renderCover()}\n <div class=\"content\">\n <div class=\"top\">\n <div class=\"info\">\n <div class=\"left\">\n {this.renderAuthors()}\n {this.renderOperaTitle()}\n {this.renderVolumeTitle()}\n {this.renderIsbn()}\n </div>\n <div class=\"right\">{this.renderHeaderCtaSlot()}</div>\n </div>\n {this.renderTagsSlot()}\n </div>\n <div class=\"bottom\">{this.renderResourcesSlot()}</div>\n </div>\n </div>\n );\n }\n\n private renderMobileExpandedCard(): HTMLDivElement {\n return (\n <div class=\"wrapper\">\n <div class=\"header\">\n {this.renderOperaTitle()}\n {this.renderHeaderCtaSlot()}\n </div>\n {this.renderCover()}\n <div class=\"content\">\n {this.renderTagsSlot()}\n {this.renderAuthors()}\n {this.renderVolumeTitle()}\n {this.renderIsbn()}\n </div>\n {this.hasResources && (\n <div\n class={{\n footer: true,\n open: this.showResources,\n close: !this.showResources,\n }}\n >\n {!this.showResources && this.renderShowResources()}\n {this.renderResourcesSlot()}\n {this.showResources && this.renderShowResources()}\n </div>\n )}\n </div>\n );\n }\n\n private renderSearchCard(): HTMLDivElement {\n return (\n <div class=\"wrapper-container\">\n <div class=\"wrapper\">\n <div class=\"header\">\n {this.renderOperaTitle()}\n {this.renderHeaderCtaSlot()}\n </div>\n {this.renderCover()}\n <div class=\"content\">\n {this.renderTagsSlot()}\n {this.renderAuthors()}\n {this.renderVolumeTitle()}\n {this.renderIsbn()}\n </div>\n </div>\n {this.renderFooterCtaSlot()}\n </div>\n );\n }\n\n private renderCompactCard(): HTMLDivElement {\n return (\n <div class=\"wrapper\">\n {this.renderCover()}\n <div class=\"content\">\n {this.renderAuthors()}\n {this.renderOperaTitle()}\n {this.renderVolumeTitle()}\n {this.renderIsbn()}\n </div>\n {this.renderFooterCtaSlot()}\n </div>\n );\n }\n\n private renderCover(): HTMLDivElement {\n return (\n <div class=\"cover\">\n {this.ribbon && this.variant !== BookCardDeprecatedVariant.COMPACT && this.renderRibbon()}\n <div class=\"img-wrapper\">\n <img\n src={this.cover}\n onError={() => {\n if (this.fallbackCover) {\n this.cover = this.fallbackCover;\n }\n }}\n aria-hidden=\"true\"\n />\n </div>\n </div>\n );\n }\n\n private renderRibbon(): HTMLElement {\n const content = [\n this.ribbonIcon && (\n <z-icon\n name={this.ribbonIcon}\n width={16}\n height={16}\n fill={\"color-inverse-icon\"}\n />\n ),\n <span>{this.ribbon}</span>,\n ];\n\n return this.ribbonInteractive ? (\n <button\n class=\"ribbon interactive\"\n onClick={() => this.emitRibbonClick()}\n >\n {content}\n </button>\n ) : (\n <div class=\"ribbon\">{content}</div>\n );\n }\n\n private renderOperaTitle(): HTMLDivElement {\n const title = this.operaTitleTag\n ? `<${this.operaTitleTag}>${this.operaTitle}</${this.operaTitleTag}>`\n : this.operaTitle;\n\n return (\n <div\n class=\"title\"\n innerHTML={title}\n />\n );\n }\n\n private renderVolumeTitle(): null | HTMLDivElement {\n return this.volumeTitle ? <div class=\"subtitle\">{this.volumeTitle}</div> : null;\n }\n\n private renderAuthors(): null | HTMLDivElement {\n return this.authors ? (\n <div\n class=\"authors\"\n aria-description=\"Autori\"\n >\n {this.authors}\n </div>\n ) : null;\n }\n\n private renderIsbn(): null | HTMLDivElement {\n return this.isbn ? (\n <div class=\"isbn\">\n <span\n class=\"code\"\n aria-description={`ISBN ${this.isbnLabel}`}\n >\n {this.isbn}\n </span>\n {this.isbnLabel ? <span class=\"label\"> {this.isbnLabel}</span> : null}\n </div>\n ) : null;\n }\n\n private renderShowResources(): HTMLButtonElement {\n return (\n <button\n class=\"show-resources\"\n aria-label={`Risorse del libro ${this.operaTitle}`}\n aria-expanded={this.showResources.toString()}\n aria-controls={`resources-${this.id}`}\n onClick={() => this.toggleResources()}\n >\n {this.showResources ? \"Chiudi\" : \"Vedi tutto\"}\n <z-icon name={this.showResources ? \"chevron-up\" : \"chevron-down\"} />\n </button>\n );\n }\n\n private renderTagsSlot(): HTMLDivElement {\n return (\n <div class=\"tags\">\n <slot name=\"tags\" />\n </div>\n );\n }\n\n private renderHeaderCtaSlot(): HTMLSlotElement {\n return <slot name=\"header-cta\" />;\n }\n\n private renderResourcesSlot(): HTMLDivElement {\n return (\n <div\n id={`resources-${this.id}`}\n class=\"resources\"\n >\n <slot\n name=\"resources\"\n onSlotchange={() => this.handleResources()}\n />\n </div>\n );\n }\n\n private renderFooterCtaSlot(): HTMLDivElement {\n return (\n <div class=\"action-container\">\n <slot name=\"footer-cta\" />\n </div>\n );\n }\n\n render(): HTMLZBookCardDeprecatedElement {\n return (\n <article\n class={{\n [this.variant]: true,\n borderless: !!this.borderless,\n }}\n >\n {this.renderCard()}\n </article>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as t,h as e,g as i}from"./p-75c4a726.js";import{p as r}from"./p-b34993de.js";import{i as s,g as o,d as n}from"./p-10607a39.js";import"./p-5145a606.js";const a=':host{display:block;width:inherit;font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>div{display:flex;width:inherit;flex-direction:column}main{position:relative;overflow:hidden;width:100%}main z-icon.scroll{position:absolute;z-index:10;top:50%;width:auto;margin:0 var(--space-unit);cursor:pointer;fill:var(--color-primary01);transition:0.6s ease}main .scroll.disabled{opacity:0.5;pointer-events:none}main .scroll.right{right:0}#slides{display:flex;flex-wrap:wrap;line-height:0px;overflow-y:hidden;transition:all 300ms}footer{display:grid;width:100%;height:56px;align-items:center;border-top:var(--border-size-medium) solid var(--color-surface02);grid-template:2 / 2;grid-template-areas:"center center" "left right"}footer>div{width:100%;align-items:center}footer .footer-center{grid-area:center}footer .footer-left{grid-area:left}footer .footer-right{grid-area:right}footer .bullet-container{display:flex;min-height:60px;align-items:center;justify-content:center;margin:0 auto}footer .bullet-container .bullet{width:8px;height:8px;margin:var(--space-unit) 2px;background-color:var(--gray200);border-radius:50%;pointer-events:none}footer .bullet-container .bullet.selected{background-color:var(--gray400)}main z-icon:focus,footer .bullet-container .bullet:focus{border-radius:50%;box-shadow:var(--shadow-focus-primary);outline:none !important}@media only screen and (min-width: 768px){footer{height:76px;border-top:var(--border-size-medium) solid var(--color-surface02);grid-template:1 / 1fr 2fr 1fr;grid-template-areas:"left center right"}footer .bullet-container .bullet{width:10px;height:10px;margin:var(--space-unit) 3px}}@media only screen and (min-width: 1025px){main z-icon.scroll{margin:0 10px}footer .bullet-container .bullet{width:16px;height:16px;margin:var(--space-unit) calc(var(--space-unit) * 0.5);cursor:pointer;pointer-events:auto}}';const l=a;function d(t){return Array.isArray(t)&&t.every((t=>typeof t==="string"))}const h=class{constructor(e){t(this,e);this.slideshowid=undefined;this.data=undefined;this.device=undefined;this.currentSlide=0}watchData(){this.parseLinks()}componentWillLoad(){this.parseLinks();this.setDevice();window.addEventListener("resize",this.handleResize.bind(this))}componentDidRender(){this.setStyle()}handleResize(){this.setDevice();this.setStyle()}parseLinks(){var t;switch(typeof this.data){case"string":{const e=(t=s(this.data))!==null&&t!==void 0?t:[];if(!d(e)){throw new Error("Passed data is invalid")}this.links=e;break}default:this.links=this.data;break}}setStyle(){const t=this.el.shadowRoot.querySelector("#slides");if(!t){return}const e=this.el.shadowRoot.querySelectorAll(".slide");const i=this.el.offsetWidth;const r=i*this.links.length;t.style.width=`${r}px`;t.style.transform=`translate(-${i*this.currentSlide}px)`;e.forEach((t=>{const e=t.querySelector("img");e.style.width=`${i}px`}))}setDevice(){this.device=o()}setCurrentSlide(t){this.currentSlide=t}getBulletDimension(){switch(this.device){case r.MOBILE:return 24;case r.TABLET:return 32;default:return 40}}renderSlides(t){return e("div",{id:"slides"},t.map(((t,i)=>e("div",{id:"slide"+i,class:`slide ${this.currentSlide!==i&&"hide"}`},e("img",{src:t})))))}renderScroll(t){let i=false,r=this.currentSlide;if(t==="left"){i=this.currentSlide===0;r--}else if(t==="right"){i=this.currentSlide===this.links.length-1;r++}return e("z-icon",{class:`scroll ${t} ${i&&"disabled"}`,width:this.getBulletDimension(),height:this.getBulletDimension(),name:`chevron-${t}-circle`,onClick:()=>{!i&&this.setCurrentSlide(r)},onKeyUp:t=>!i&&n(t,(()=>{this.setCurrentSlide(r)})),tabindex:0,role:"button"})}renderSlideshowMain(){return e("main",null,this.renderScroll("left"),this.renderSlides(this.links),this.renderScroll("right"))}renderBullet(t){return e("a",{class:`bullet ${this.currentSlide===t&&"selected"}`,onClick:()=>this.setCurrentSlide(t),onKeyUp:e=>n(e,(()=>this.setCurrentSlide(t))),tabindex:0,role:"button"})}renderSlideshowFooter(){return e("footer",null,e("div",{class:"footer-left"},e("slot",{name:"footer-left"})),e("div",{class:"footer-center"},e("div",{class:"bullet-container"},Object.keys(this.links).map((t=>this.renderBullet(parseInt(t)))))),e("div",{class:"footer-right"},e("slot",{name:"footer-right"})))}render(){if(!this.links||!this.links.length){return e("div",null)}return e("div",{id:this.slideshowid},this.renderSlideshowMain(),this.renderSlideshowFooter())}get el(){return i(this)}static get watchers(){return{data:["watchData"]}}};h.style=l;export{h as z_slideshow};
|
|
2
|
-
//# sourceMappingURL=p-5b677d6c.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["stylesCss","ZSlideshowStyle0","isStringArray","data","Array","isArray","every","datum","ZSlideshow","watchData","this","parseLinks","componentWillLoad","setDevice","window","addEventListener","handleResize","bind","componentDidRender","setStyle","parsed","_a","convertJson","Error","links","refSlides","el","shadowRoot","querySelector","allImages","querySelectorAll","width","offsetWidth","fullwidth","length","style","transform","currentSlide","forEach","item","img","device","getDevice","setCurrentSlide","index","getBulletDimension","Device","MOBILE","TABLET","renderSlides","items","h","id","map","i","class","src","renderScroll","direction","disabled","nextSlide","height","name","onClick","onKeyUp","e","handleKeyboardSubmit","tabindex","role","renderSlideshowMain","renderBullet","renderSlideshowFooter","Object","keys","parseInt","render","slideshowid"],"sources":["src/snowflakes/myz/z-slideshow/styles.css?tag=z-slideshow&encapsulation=shadow","src/snowflakes/myz/z-slideshow/index.tsx"],"sourcesContent":[":host {\n display: block;\n width: inherit;\n font-family: var(--font-family-sans);\n font-weight: var(--font-rg);\n}\n\n:host > div {\n display: flex;\n width: inherit;\n flex-direction: column;\n}\n\nmain {\n position: relative;\n overflow: hidden;\n width: 100%;\n}\n\nmain z-icon.scroll {\n position: absolute;\n z-index: 10;\n top: 50%;\n width: auto;\n margin: 0 var(--space-unit);\n cursor: pointer;\n fill: var(--color-primary01);\n transition: 0.6s ease;\n}\n\nmain .scroll.disabled {\n opacity: 0.5;\n pointer-events: none;\n}\n\nmain .scroll.right {\n right: 0;\n}\n\n#slides {\n display: flex;\n flex-wrap: wrap;\n line-height: 0px;\n overflow-y: hidden;\n transition: all 300ms;\n}\n\nfooter {\n display: grid;\n width: 100%;\n height: 56px;\n align-items: center;\n border-top: var(--border-size-medium) solid var(--color-surface02);\n grid-template: 2 / 2;\n grid-template-areas: \"center center\" \"left right\";\n}\n\nfooter > div {\n width: 100%;\n align-items: center;\n}\n\nfooter .footer-center {\n grid-area: center;\n}\n\nfooter .footer-left {\n grid-area: left;\n}\n\nfooter .footer-right {\n grid-area: right;\n}\n\nfooter .bullet-container {\n display: flex;\n min-height: 60px;\n align-items: center;\n justify-content: center;\n margin: 0 auto;\n}\n\nfooter .bullet-container .bullet {\n width: 8px;\n height: 8px;\n margin: var(--space-unit) 2px;\n background-color: var(--gray200);\n border-radius: 50%;\n pointer-events: none;\n}\n\nfooter .bullet-container .bullet.selected {\n background-color: var(--gray400);\n}\n\nmain z-icon:focus,\nfooter .bullet-container .bullet:focus {\n border-radius: 50%;\n box-shadow: var(--shadow-focus-primary);\n outline: none !important;\n}\n\n/* Tablet breakpoint */\n\n@media only screen and (min-width: 768px) {\n footer {\n height: 76px;\n border-top: var(--border-size-medium) solid var(--color-surface02);\n grid-template: 1 / 1fr 2fr 1fr;\n grid-template-areas: \"left center right\";\n }\n\n footer .bullet-container .bullet {\n width: 10px;\n height: 10px;\n margin: var(--space-unit) 3px;\n }\n}\n\n/* Desktop breakpoint */\n\n@media only screen and (min-width: 1025px) {\n main z-icon.scroll {\n margin: 0 10px;\n }\n\n footer .bullet-container .bullet {\n width: 16px;\n height: 16px;\n margin: var(--space-unit) calc(var(--space-unit) * 0.5);\n cursor: pointer;\n pointer-events: auto;\n }\n}\n","import {Component, Element, Prop, State, Watch, h} from \"@stencil/core\";\nimport {Device} from \"../../../beans\";\nimport {convertJson, getDevice, handleKeyboardSubmit} from \"../../../utils/utils\";\n\n/**\n * Check if data is an array of strings.\n * @param {unknown} data Data to check\n * @returns {boolean}\n */\nfunction isStringArray(data: unknown): data is string[] {\n return Array.isArray(data) && data.every((datum: unknown): datum is string => typeof datum === \"string\");\n}\n\n/**\n * @slot footer-right - right content slot in footer\n * @slot footer-left - left content slot in footer\n */\n@Component({\n tag: \"z-slideshow\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZSlideshow {\n @Element() el: HTMLZSlideshowElement;\n\n /** slideshow id */\n @Prop()\n slideshowid: string;\n\n /** array or JSON stringified images urls */\n @Prop()\n data: string[] | string;\n\n @State()\n device: Device;\n\n @State()\n currentSlide = 0;\n\n private links: string[];\n\n @Watch(\"data\")\n watchData(): void {\n this.parseLinks();\n }\n\n componentWillLoad(): void {\n this.parseLinks();\n\n this.setDevice();\n window.addEventListener(\"resize\", this.handleResize.bind(this));\n }\n\n componentDidRender(): void {\n this.setStyle();\n }\n\n private handleResize(): void {\n this.setDevice();\n this.setStyle();\n }\n\n private parseLinks(): void {\n switch (typeof this.data) {\n case \"string\": {\n const parsed = convertJson(this.data) ?? [];\n if (!isStringArray(parsed)) {\n throw new Error(\"Passed data is invalid\");\n }\n\n this.links = parsed;\n break;\n }\n default:\n this.links = this.data;\n break;\n }\n }\n\n private setStyle(): void {\n const refSlides = this.el.shadowRoot.querySelector(\"#slides\") as HTMLElement;\n if (!refSlides) {\n return;\n }\n\n const allImages = this.el.shadowRoot.querySelectorAll(\".slide\");\n const width = this.el.offsetWidth;\n const fullwidth = width * this.links.length;\n\n refSlides.style.width = `${fullwidth}px`;\n refSlides.style.transform = `translate(-${width * this.currentSlide}px)`;\n allImages.forEach((item: HTMLElement) => {\n const img = item.querySelector(\"img\");\n img.style.width = `${width}px`;\n });\n }\n\n private setDevice(): void {\n this.device = getDevice();\n }\n\n private setCurrentSlide(index: number): void {\n this.currentSlide = index;\n }\n\n private getBulletDimension(): number {\n switch (this.device) {\n case Device.MOBILE:\n return 24;\n case Device.TABLET:\n return 32;\n default:\n return 40;\n }\n }\n\n private renderSlides(items: string[]): HTMLElement {\n return (\n <div id=\"slides\">\n {items.map((item: string, i: number) => (\n <div\n id={\"slide\" + i}\n class={`slide ${this.currentSlide !== i && \"hide\"}`}\n >\n <img src={item} />\n </div>\n ))}\n </div>\n );\n }\n\n private renderScroll(direction: \"left\" | \"right\"): HTMLZIconElement {\n let disabled = false,\n nextSlide = this.currentSlide;\n\n if (direction === \"left\") {\n disabled = this.currentSlide === 0;\n nextSlide--;\n } else if (direction === \"right\") {\n disabled = this.currentSlide === this.links.length - 1;\n nextSlide++;\n }\n\n return (\n <z-icon\n class={`scroll ${direction} ${disabled && \"disabled\"}`}\n width={this.getBulletDimension()}\n height={this.getBulletDimension()}\n name={`chevron-${direction}-circle`}\n onClick={() => {\n !disabled && this.setCurrentSlide(nextSlide);\n }}\n onKeyUp={(e: KeyboardEvent) =>\n !disabled &&\n handleKeyboardSubmit(e, () => {\n this.setCurrentSlide(nextSlide);\n })\n }\n tabindex={0}\n role=\"button\"\n />\n );\n }\n\n private renderSlideshowMain(): HTMLElement {\n return (\n <main>\n {this.renderScroll(\"left\")}\n {this.renderSlides(this.links)}\n {this.renderScroll(\"right\")}\n </main>\n );\n }\n\n private renderBullet(i: number): HTMLElement {\n return (\n <a\n class={`bullet ${this.currentSlide === i && \"selected\"}`}\n onClick={() => this.setCurrentSlide(i)}\n onKeyUp={(e: KeyboardEvent) => handleKeyboardSubmit(e, () => this.setCurrentSlide(i))}\n tabindex={0}\n role=\"button\"\n ></a>\n );\n }\n\n private renderSlideshowFooter(): HTMLElement {\n return (\n <footer>\n <div class=\"footer-left\">\n <slot name=\"footer-left\" />\n </div>\n <div class=\"footer-center\">\n <div class=\"bullet-container\">{Object.keys(this.links).map((i) => this.renderBullet(parseInt(i)))}</div>\n </div>\n <div class=\"footer-right\">\n <slot name=\"footer-right\" />\n </div>\n </footer>\n );\n }\n\n render(): HTMLElement {\n if (!this.links || !this.links.length) {\n return <div />;\n }\n\n return (\n <div id={this.slideshowid}>\n {this.renderSlideshowMain()}\n {this.renderSlideshowFooter()}\n </div>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as t,c as i,h as e,a as s,g as n}from"./p-75c4a726.js";import{v as a,p as r,D as o}from"./p-b34993de.js";import{g as l}from"./p-10607a39.js";import"./p-5145a606.js";const c=':host{color:var(--color-default-text);font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>.container{display:flex;flex-direction:column}:host .modal-wrapper{display:flex;align-items:center;justify-content:center;padding:calc(var(--space-unit) * 2)}:host .modal-wrapper>.files-wrapper{display:flex;flex-direction:column;margin:calc(var(--space-unit) * 4);gap:var(--space-unit)}:host .text-container{display:flex;flex-direction:column;margin:auto}:host .text-container .body-1{text-align:center}:host .text-container .upload-link{color:var(--color-link-primary);cursor:pointer}:host .text-container .upload-link:focus-visible{box-shadow:var(--shadow-focus-primary);outline:none !important}:host .text-container .upload-link-text{margin-bottom:var(--space-unit)}input#file-elem{display:none}#title{display:inline-block;margin:calc(var(--space-unit) * 2.5) 0 calc(var(--space-unit) * 4);font-size:calc(var(--space-unit) * 3);font-weight:var(--font-sb)}:host>.container>z-button{display:inline-block;margin-top:calc(var(--space-unit) * 3)}:host>.container>.files-container.hidden{display:none}:host>.container>.files-container>.heading-4-sb{display:inline-block;margin:calc(var(--space-unit) * 3) 0;font-size:calc(var(--space-unit) * 2);font-weight:var(--font-sb)}:host([type="dragdrop"])>.container>.files-container>.heading-4-sb{margin-top:0;margin-bottom:calc(var(--space-unit) * 3)}:host>.container>.files-container>.files-wrapper{display:flex;flex-wrap:wrap;column-gap:calc(var(--space-unit) * 2);row-gap:calc(var(--space-unit) * 2)}:host>.container>.files-container>z-divider{margin-top:calc(var(--space-unit) * 3);margin-bottom:0}:host([type="dragdrop"])>.container>.files-container>z-divider{margin:calc(var(--space-unit) * 3) 0}:host .error-message{font-size:14px;font-weight:400;letter-spacing:0.16%;line-height:20px;text-align:left}:host .error-message>.file-name{font-weight:600}@media only screen and (min-width: 768px){:host>.container>z-button{align-self:flex-start}:host .modal-wrapper{padding:calc(var(--space-unit) * 3)}}@media only screen and (min-width: 1152px){:host .modal-wrapper{padding:calc(var(--space-unit) * 4)}}';const d=c;const h=class{constructor(e){t(this,e);this.fileInput=i(this,"fileInput",7);this.inputAttributes={type:"file",id:"file-elem",multiple:true};this.type=a.DEFAULT;this.buttonVariant=undefined;this.acceptedFormat=undefined;this.fileMaxSize=undefined;this.mainTitle=undefined;this.description=undefined;this.files=[];this.uploadBtnLabel="allega";this.dragAndDropLabel="Rilascia i file in questa area per allegarli.";this.allowedFilesMessage=undefined;this.uploadClickableMessage="Carica";this.uploadMessage="o trascina dal tuo computer";this.errorModalTitle="Errore di caricamento";this.errorModalMessage=undefined;this.uploadedFilesLabel="File appena caricati";this.hasFileSection=true;this.invalidFiles=undefined}removeFileListener(t){this.removeFileHandler(t.detail)}fileDroppedListener(t){this.input.files=t.detail;this.fileInputHandler()}componentDidUpdate(){this.handleAccessibility();this.invalidFiles.size&&this.errorModal.focus()}componentWillLoad(){this.invalidFiles=new Map}fileInputHandler(){if(this.input.files.length){this.invalidFiles=this.checkFiles(Array.from(this.input.files))}}async getFiles(){return this.files}async removeFile(t){this.removeFileHandler(t)}removeFileHandler(t){const i=this.files;const e=i.find((i=>i.name===t));if(e){const t=i.indexOf(e);if(t>=0){i.splice(t,1);this.files=[...i]}}}getType(){if(l()!==r.DESKTOP&&l()!==r.DESKTOP_WIDE){return a.DEFAULT}return this.type}handleAccessibility(){const t=this.el.querySelector("z-file:last-child z-chip button");if(this.files.length>0&&t){t.focus()}else{this.getType()===a.DEFAULT?this.button.querySelector("button").focus():this.uploadLink.focus()}}checkFiles(t){const i=new Map;const e=`supera il limite di ${this.fileMaxSize}MB`;const s=" ha un formato non supportato";t.forEach((t=>{const n=t.size/1024/1024;const a=this.acceptedFormat.split(",").some((i=>t.name.toLowerCase().endsWith(i.trim())));const r=n<=this.fileMaxSize;if(r&&a){if(!this.files.find((i=>i.name===t.name))){this.files.push(t);this.fileInput.emit(t);this.input.value=""}return}i.set(t.name,[]);if(!r){i.get(t.name).push(e)}if(!a){i.get(t.name).push(s)}}));return i}renderTitle(){return e("span",{id:"title"},this.mainTitle)}renderDescription(t){return e("span",{class:t},this.description)}renderAllowedFileExtensions(){let t="";let i="";if(this.acceptedFormat){const i=this.acceptedFormat.split(", ").map((t=>t.substring(1).toUpperCase())).join(", ");t=` nei formati ${i}`}if(this.fileMaxSize){i=` per un massimo di ${this.fileMaxSize}MB di peso`}const s=`Puoi allegare file${t}${i}.`;return e("span",{class:"body-3"},this.allowedFilesMessage?this.allowedFilesMessage:t||i?s:null)}renderFileSection(){if(!this.hasFileSection){return}return e("section",{class:`files-container ${!this.files.length?"hidden":""}`},e("span",{class:"heading-4-sb"},this.uploadedFilesLabel),e("div",{class:"files-wrapper"},e("slot",{name:"files"})),e("z-divider",{size:o.MEDIUM}))}renderInput(){return e("input",Object.assign({},this.inputAttributes,{onChange:()=>this.fileInputHandler(),accept:this.acceptedFormat,ref:t=>this.input=t}))}renderUploadButton(){return[this.renderInput(),e("z-button",{onClick:()=>this.input.click(),onKeyPress:t=>{if(t.code=="Space"||t.code=="Enter"){t.preventDefault();this.input.click()}},id:"fileSelect",variant:this.buttonVariant,icon:"upload",ref:t=>this.button=t},this.uploadBtnLabel)]}renderUploadLink(){return[this.renderInput(),e("span",{class:"body-1 upload-link-text"},e("span",{tabIndex:0,class:"body-1-sb upload-link",onClick:()=>this.input.click(),onKeyPress:t=>{if(t.code=="Space"||t.code=="Enter"){t.preventDefault();this.input.click()}},ref:t=>this.uploadLink=t},this.uploadClickableMessage)," ",this.uploadMessage)]}renderDefaultMode(){return[this.renderDescription("body-3-sb"),this.renderAllowedFileExtensions(),this.renderFileSection(),this.renderUploadButton()]}renderDragDropMode(){return[this.renderFileSection(),e("z-dragdrop-area",{"drag-and-drop-label":this.dragAndDropLabel},e("div",{class:"text-container"},this.renderDescription("body-1"),this.renderUploadLink(),this.renderAllowedFileExtensions()))]}formatErrorString(t,i){var s,n;const a=i[0]&&i[1]?" e ":"";return e("span",{class:"error-message"},"Il file ",e("span",{class:"file-name"},t)," ",(s=i[1])!==null&&s!==void 0?s:"",a,(n=i[0])!==null&&n!==void 0?n:"",".")}handleErrorModalContent(){return e("div",{slot:"modalContent"},e("div",{class:"modal-wrapper"},e("div",{class:"files"},this.errorModalMessage?e("span",{class:"body-3"},this.errorModalMessage):Array.from(this.invalidFiles).map((([t,i])=>e("span",{class:"body-3"},this.formatErrorString(t,i)))))))}render(){return e(s,{key:"516d51d19835f55e0a5696d3f3b847f2f253e915"},e("div",{key:"41a4196b48636cf761673ce0672bd3c5246ba8f8",class:`container ${this.getType()}`},this.mainTitle&&this.renderTitle(),this.getType()==a.DEFAULT?this.renderDefaultMode():this.renderDragDropMode()),!!this.invalidFiles.size&&e("z-modal",{key:"8c790bf5dd9b70557b4479bae9ef3a949d9bb4c3",modalid:`file-upload-${this.type}-error-modal`,tabIndex:0,ref:t=>this.errorModal=t,modaltitle:this.errorModalTitle,onModalClose:()=>this.invalidFiles=new Map,onModalBackgroundClick:()=>this.invalidFiles=new Map},this.handleErrorModalContent()))}get el(){return n(this)}};h.style=d;export{h as z_file_upload};
|
|
2
|
-
//# sourceMappingURL=p-63806f4f.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["stylesCss","ZFileUploadStyle0","ZFileUpload","this","inputAttributes","type","id","multiple","ZFileUploadType","DEFAULT","removeFileListener","e","removeFileHandler","detail","fileDroppedListener","input","files","fileInputHandler","componentDidUpdate","handleAccessibility","invalidFiles","size","errorModal","focus","componentWillLoad","Map","length","checkFiles","Array","from","getFiles","removeFile","fileName","file","find","name","index","indexOf","splice","getType","getDevice","Device","DESKTOP","DESKTOP_WIDE","lastFile","el","querySelector","button","uploadLink","errors","sizeErrorString","fileMaxSize","formatErrorString","forEach","fileSize","fileFormatOk","acceptedFormat","split","some","ext","toLowerCase","endsWith","trim","fileSizeOk","f","push","fileInput","emit","value","set","get","renderTitle","h","mainTitle","renderDescription","cssClass","class","description","renderAllowedFileExtensions","fileFormatString","fileWeightString","fileFormat","map","string","substring","toUpperCase","join","finalString","allowedFilesMessage","renderFileSection","hasFileSection","uploadedFilesLabel","DividerSize","MEDIUM","renderInput","Object","assign","onChange","accept","ref","val","renderUploadButton","onClick","click","onKeyPress","code","preventDefault","variant","buttonVariant","icon","uploadBtnLabel","renderUploadLink","tabIndex","uploadClickableMessage","uploadMessage","renderDefaultMode","renderDragDropMode","dragAndDropLabel","key","bothErrors","_a","_b","handleErrorModalContent","slot","errorModalMessage","render","Host","modalid","modaltitle","errorModalTitle","onModalClose","onModalBackgroundClick"],"sources":["src/components/file-upload/z-file-upload/styles.css?tag=z-file-upload&encapsulation=shadow","src/components/file-upload/z-file-upload/index.tsx"],"sourcesContent":[":host {\n color: var(--color-default-text);\n font-family: var(--font-family-sans);\n font-weight: var(--font-rg);\n}\n\n:host > .container {\n display: flex;\n flex-direction: column;\n}\n\n:host .modal-wrapper {\n display: flex;\n align-items: center;\n justify-content: center;\n padding: calc(var(--space-unit) * 2);\n}\n\n:host .modal-wrapper > .files-wrapper {\n display: flex;\n flex-direction: column;\n margin: calc(var(--space-unit) * 4);\n gap: var(--space-unit);\n}\n\n:host .text-container {\n display: flex;\n flex-direction: column;\n margin: auto;\n}\n\n:host .text-container .body-1 {\n text-align: center;\n}\n\n:host .text-container .upload-link {\n color: var(--color-link-primary);\n cursor: pointer;\n}\n\n:host .text-container .upload-link:focus-visible {\n box-shadow: var(--shadow-focus-primary);\n outline: none !important;\n}\n\n:host .text-container .upload-link-text {\n margin-bottom: var(--space-unit);\n}\n\ninput#file-elem {\n display: none;\n}\n\n#title {\n display: inline-block;\n margin: calc(var(--space-unit) * 2.5) 0 calc(var(--space-unit) * 4);\n font-size: calc(var(--space-unit) * 3);\n font-weight: var(--font-sb);\n}\n\n:host > .container > z-button {\n display: inline-block;\n margin-top: calc(var(--space-unit) * 3);\n}\n\n:host > .container > .files-container.hidden {\n display: none;\n}\n\n:host > .container > .files-container > .heading-4-sb {\n display: inline-block;\n margin: calc(var(--space-unit) * 3) 0;\n font-size: calc(var(--space-unit) * 2);\n font-weight: var(--font-sb);\n}\n\n:host([type=\"dragdrop\"]) > .container > .files-container > .heading-4-sb {\n margin-top: 0;\n margin-bottom: calc(var(--space-unit) * 3);\n}\n\n:host > .container > .files-container > .files-wrapper {\n display: flex;\n flex-wrap: wrap;\n column-gap: calc(var(--space-unit) * 2);\n row-gap: calc(var(--space-unit) * 2);\n}\n\n:host > .container > .files-container > z-divider {\n margin-top: calc(var(--space-unit) * 3);\n margin-bottom: 0;\n}\n\n:host([type=\"dragdrop\"]) > .container > .files-container > z-divider {\n margin: calc(var(--space-unit) * 3) 0;\n}\n\n:host .error-message {\n font-size: 14px;\n font-weight: 400;\n letter-spacing: 0.16%;\n line-height: 20px;\n text-align: left;\n}\n\n:host .error-message > .file-name {\n font-weight: 600;\n}\n\n/* Tablet breakpoint */\n@media only screen and (min-width: 768px) {\n :host > .container > z-button {\n align-self: flex-start;\n }\n\n :host .modal-wrapper {\n padding: calc(var(--space-unit) * 3);\n }\n}\n\n@media only screen and (min-width: 1152px) {\n :host .modal-wrapper {\n padding: calc(var(--space-unit) * 4);\n }\n}\n","import {Component, Element, Event, EventEmitter, Host, Listen, Method, Prop, State, h} from \"@stencil/core\";\nimport {ButtonVariant, Device, DividerSize, ZFileUploadType} from \"../../../beans\";\nimport {getDevice} from \"../../../utils/utils\";\n\n@Component({\n tag: \"z-file-upload\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZFileUpload {\n /** Prop indicating the file upload type - can be default or dragdrop */\n @Prop({reflect: true})\n type: ZFileUploadType = ZFileUploadType.DEFAULT;\n\n /** Prop indicating the button variant*/\n @Prop()\n buttonVariant?: ButtonVariant;\n\n /** Prop indicating the accepted file type: ex \".pdf, .doc, .jpg\" */\n @Prop()\n acceptedFormat?: string;\n\n /** Max file dimension in Megabyte */\n @Prop()\n fileMaxSize?: number;\n\n /** Title */\n @Prop()\n mainTitle?: string;\n\n /** Description */\n @Prop()\n description?: string;\n\n /** Files added by the user */\n @State()\n files: File[] = [];\n\n /** upoload button label */\n @Prop()\n uploadBtnLabel?: string = \"allega\";\n\n /** drag & drop button label */\n @Prop()\n dragAndDropLabel?: string = \"Rilascia i file in questa area per allegarli.\";\n\n /** allowed file message */\n @Prop()\n allowedFilesMessage?: string;\n\n /** upload clickable message */\n @Prop()\n uploadClickableMessage?: string = \"Carica\";\n\n /** upload message */\n @Prop()\n uploadMessage?: string = \"o trascina dal tuo computer\";\n\n /** error modal title */\n @Prop()\n errorModalTitle?: string = \"Errore di caricamento\";\n\n /** error modal message */\n @Prop()\n errorModalMessage?: string;\n\n /** loaded files label */\n @Prop()\n uploadedFilesLabel?: string = \"File appena caricati\";\n\n /** uploaded files history rendering */\n @Prop()\n hasFileSection?: boolean = true;\n\n /** List of files not allowed to be uploaded */\n @State()\n invalidFiles: Map<string, string[]>;\n\n @Element() el: HTMLZFileUploadElement;\n\n private input: HTMLInputElement;\n\n private button: HTMLZButtonElement;\n\n private errorModal: HTMLZModalElement;\n\n private uploadLink: HTMLSpanElement;\n\n private inputAttributes = {\n type: \"file\",\n id: \"file-elem\",\n multiple: true,\n };\n\n /** Listen removeFile event sent from z-file component */\n @Listen(\"removeFile\")\n removeFileListener(e: CustomEvent): void {\n this.removeFileHandler(e.detail);\n }\n\n /** Listen fileDropped event sent from z-dragdrop-area component */\n @Listen(\"fileDropped\")\n fileDroppedListener(e: CustomEvent): void {\n this.input.files = e.detail;\n this.fileInputHandler();\n }\n\n componentDidUpdate(): void {\n this.handleAccessibility();\n this.invalidFiles.size && this.errorModal.focus();\n }\n\n componentWillLoad(): void {\n this.invalidFiles = new Map<string, string[]>();\n }\n\n /** Emitted when user select one or more files */\n @Event()\n fileInput: EventEmitter;\n\n private fileInputHandler(): void {\n if (this.input.files.length) {\n this.invalidFiles = this.checkFiles(Array.from(this.input.files));\n }\n }\n\n /** get array of uploaded files */\n @Method()\n async getFiles(): Promise<File[]> {\n return this.files;\n }\n\n /** remove file from the array */\n @Method()\n async removeFile(fileName: string): Promise<void> {\n this.removeFileHandler(fileName);\n }\n\n private removeFileHandler(fileName: string): void {\n const files = this.files;\n const file = files.find((file) => file.name === fileName);\n if (file) {\n const index = files.indexOf(file);\n if (index >= 0) {\n files.splice(index, 1);\n this.files = [...files];\n }\n }\n }\n\n private getType(): ZFileUploadType {\n if (getDevice() !== Device.DESKTOP && getDevice() !== Device.DESKTOP_WIDE) {\n return ZFileUploadType.DEFAULT;\n }\n\n return this.type;\n }\n\n private handleAccessibility(): void {\n const lastFile = this.el.querySelector(\"z-file:last-child z-chip button\");\n if (this.files.length > 0 && lastFile) {\n (lastFile as HTMLElement).focus();\n } else {\n this.getType() === ZFileUploadType.DEFAULT\n ? this.button.querySelector(\"button\").focus()\n : this.uploadLink.focus();\n }\n }\n\n private checkFiles(files: File[]): Map<string, string[]> {\n const errors = new Map<string, string[]>();\n const sizeErrorString = `supera il limite di ${this.fileMaxSize}MB`;\n const formatErrorString = \" ha un formato non supportato\";\n files.forEach((file: File) => {\n const fileSize = file.size / 1024 / 1024;\n const fileFormatOk = this.acceptedFormat\n .split(\",\")\n .some((ext: string) => file.name.toLowerCase().endsWith(ext.trim()));\n const fileSizeOk = fileSize <= this.fileMaxSize;\n if (fileSizeOk && fileFormatOk) {\n if (!this.files.find((f) => f.name === file.name)) {\n this.files.push(file);\n this.fileInput.emit(file);\n this.input.value = \"\";\n }\n\n return;\n }\n errors.set(file.name, []);\n if (!fileSizeOk) {\n errors.get(file.name).push(sizeErrorString);\n }\n if (!fileFormatOk) {\n errors.get(file.name).push(formatErrorString);\n }\n });\n\n return errors;\n }\n\n private renderTitle(): HTMLElement {\n return <span id=\"title\">{this.mainTitle}</span>;\n }\n\n private renderDescription(cssClass): HTMLElement {\n return <span class={cssClass}>{this.description}</span>;\n }\n\n private renderAllowedFileExtensions(): HTMLElement {\n let fileFormatString = \"\";\n let fileWeightString = \"\";\n\n if (this.acceptedFormat) {\n const fileFormat = this.acceptedFormat\n .split(\", \")\n .map((string) => string.substring(1).toUpperCase())\n .join(\", \");\n fileFormatString = ` nei formati ${fileFormat}`;\n }\n\n if (this.fileMaxSize) {\n fileWeightString = ` per un massimo di ${this.fileMaxSize}MB di peso`;\n }\n\n const finalString = `Puoi allegare file${fileFormatString}${fileWeightString}.`;\n\n return (\n <span class=\"body-3\">\n {this.allowedFilesMessage\n ? this.allowedFilesMessage\n : fileFormatString || fileWeightString\n ? finalString\n : null}\n </span>\n );\n }\n\n private renderFileSection(): HTMLElement {\n if (!this.hasFileSection) {\n return;\n }\n\n return (\n <section class={`files-container ${!this.files.length ? \"hidden\" : \"\"}`}>\n <span class=\"heading-4-sb\">{this.uploadedFilesLabel}</span>\n <div class=\"files-wrapper\">\n <slot name=\"files\" />\n </div>\n <z-divider size={DividerSize.MEDIUM} />\n </section>\n );\n }\n\n private renderInput(): HTMLInputElement {\n return (\n <input\n {...this.inputAttributes}\n onChange={() => this.fileInputHandler()}\n accept={this.acceptedFormat}\n ref={(val) => (this.input = val)}\n />\n );\n }\n\n private renderUploadButton(): unknown[] {\n return [\n this.renderInput(),\n <z-button\n onClick={() => this.input.click()}\n onKeyPress={(e) => {\n if (e.code == \"Space\" || e.code == \"Enter\") {\n e.preventDefault();\n this.input.click();\n }\n }}\n id=\"fileSelect\"\n variant={this.buttonVariant}\n icon=\"upload\"\n ref={(val) => (this.button = val)}\n >\n {this.uploadBtnLabel}\n </z-button>,\n ];\n }\n\n private renderUploadLink(): unknown[] {\n return [\n this.renderInput(),\n <span class=\"body-1 upload-link-text\">\n <span\n tabIndex={0}\n class=\"body-1-sb upload-link\"\n onClick={() => this.input.click()}\n onKeyPress={(e) => {\n if (e.code == \"Space\" || e.code == \"Enter\") {\n e.preventDefault();\n this.input.click();\n }\n }}\n ref={(val) => (this.uploadLink = val)}\n >\n {this.uploadClickableMessage}\n </span>{\" \"}\n {this.uploadMessage}\n </span>,\n ];\n }\n\n private renderDefaultMode(): unknown[] {\n return [\n this.renderDescription(\"body-3-sb\"),\n this.renderAllowedFileExtensions(),\n this.renderFileSection(),\n this.renderUploadButton(),\n ];\n }\n\n private renderDragDropMode(): unknown[] {\n return [\n this.renderFileSection(),\n <z-dragdrop-area drag-and-drop-label={this.dragAndDropLabel}>\n <div class=\"text-container\">\n {this.renderDescription(\"body-1\")}\n {this.renderUploadLink()}\n {this.renderAllowedFileExtensions()}\n </div>\n </z-dragdrop-area>,\n ];\n }\n\n private formatErrorString(key, value): string {\n const bothErrors = value[0] && value[1] ? \" e \" : \"\";\n\n return (\n <span class=\"error-message\">\n Il file <span class=\"file-name\">{key}</span> {value[1] ?? \"\"}\n {bothErrors}\n {value[0] ?? \"\"}.\n </span>\n );\n }\n\n private handleErrorModalContent(): HTMLDivElement {\n return (\n <div slot=\"modalContent\">\n <div class=\"modal-wrapper\">\n <div class=\"files\">\n {this.errorModalMessage ? (\n <span class=\"body-3\">{this.errorModalMessage}</span>\n ) : (\n Array.from(this.invalidFiles).map(([key, value]) => {\n return <span class=\"body-3\">{this.formatErrorString(key, value)}</span>;\n })\n )}\n </div>\n </div>\n </div>\n );\n }\n\n render(): HTMLZFileUploadElement {\n return (\n <Host>\n <div class={`container ${this.getType()}`}>\n {this.mainTitle && this.renderTitle()}\n {this.getType() == ZFileUploadType.DEFAULT ? this.renderDefaultMode() : this.renderDragDropMode()}\n </div>\n {!!this.invalidFiles.size && (\n <z-modal\n modalid={`file-upload-${this.type}-error-modal`}\n tabIndex={0}\n ref={(val) => (this.errorModal = val)}\n modaltitle={this.errorModalTitle}\n onModalClose={() => (this.invalidFiles = new Map<string, string[]>())}\n onModalBackgroundClick={() => (this.invalidFiles = new Map<string, string[]>())}\n >\n {this.handleErrorModalContent()}\n </z-modal>\n )}\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as t,c as i,h as a,a as n,g as e}from"./p-75c4a726.js";import{N as o,a as s,b as r}from"./p-b34993de.js";const l='z-navigation-tabs{position:relative;z-index:0;display:flex;overflow:hidden;flex-direction:row;font-family:var(--font-family-sans);font-weight:var(--font-rg)}z-navigation-tabs,z-navigation-tabs *{box-sizing:border-box}z-navigation-tabs>nav::-webkit-scrollbar{display:none}z-navigation-tabs .navigation-button{position:absolute;z-index:1;display:flex;align-items:center;justify-content:center;padding:0;border:none;margin:0;background-color:var(--z-navigation-tabs-nav-buttons-bg, var(--color-surface01));border-radius:var(--border-no-radius);box-shadow:0 0 4px 1px var(--shadow-color-base);cursor:pointer;fill:var(--z-navigation-tabs-nav-buttons-fg, var(--color-primary01));outline:none}z-navigation-tabs .navigation-button:disabled{display:none}z-navigation-tabs>nav{z-index:0;display:flex;overflow:auto;align-items:center;justify-content:flex-start;scroll-behavior:smooth;scrollbar-width:none}z-navigation-tabs[orientation="horizontal"]>nav{width:100%}z-navigation-tabs[orientation="horizontal"] .navigation-button{top:0;width:calc(var(--space-unit) * 4);height:100%}z-navigation-tabs[orientation="horizontal"] .navigation-button:first-child{left:0}z-navigation-tabs[orientation="horizontal"] .navigation-button:last-child{right:0}z-navigation-tabs[orientation="vertical"]{width:fit-content;flex-direction:column}z-navigation-tabs[orientation="vertical"]>nav{height:100%;flex-direction:column;align-items:stretch}z-navigation-tabs[orientation="vertical"] .navigation-button{left:0;width:100%;height:calc(var(--space-unit) * 4)}z-navigation-tabs[orientation="vertical"] .navigation-button:first-child{top:0}z-navigation-tabs[orientation="vertical"] .navigation-button:last-child{bottom:0}z-navigation-tabs[size="small"][orientation="vertical"] .navigation-button{height:calc(var(--space-unit) * 4)}z-navigation-tabs>nav>*{position:relative;z-index:0;display:inline-flex;width:auto;align-items:center;justify-content:center;padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 5);border:none;margin:0;background-color:unset;border-radius:var(--border-no-radius);color:var(--color-primary01);cursor:pointer;fill:currentcolor;font-family:var(--font-family-sans);font-size:inherit;gap:var(--space-unit);letter-spacing:inherit;line-height:inherit;outline:none;text-align:center;white-space:nowrap}z-navigation-tabs>nav>a{text-decoration:none}z-navigation-tabs>nav>*:focus:focus-visible{z-index:1;box-shadow:inset 0 0 4px 3px var(--blue800)}z-navigation-tabs>nav>:not([disabled]):hover{background-color:var(--color-surface02)}z-navigation-tabs>nav>button[disabled]{color:var(--color-disabled03);cursor:not-allowed;fill:currentcolor;pointer-events:all}z-navigation-tabs>nav>:not([disabled]):hover,nav>[aria-selected="true"]{color:var(--color-hover-secondary);fill:currentcolor}z-navigation-tabs>nav>:not([disabled]):hover::after,nav>[aria-selected="true"]::after{position:absolute;background-color:var(--color-hover-secondary);content:""}z-navigation-tabs[orientation="horizontal"]>nav>:not([disabled]):hover::after,z-navigation-tabs[orientation="horizontal"]>nav>[aria-selected="true"]::after{bottom:0;left:0;width:100%;height:var(--border-size-large)}z-navigation-tabs>nav>* z-icon{--z-icon-width:calc(var(--space-unit) * 2);--z-icon-height:calc(var(--space-unit) * 2);display:flex;margin:0}z-navigation-tabs[size="small"][orientation="horizontal"]>nav>*{padding:var(--space-unit) calc(var(--space-unit) * 2)}z-navigation-tabs[size="small"][orientation="horizontal"]>nav>:not([disabled]):hover::after,z-navigation-tabs[size="small"][orientation="horizontal"]>nav>[aria-selected="true"]::after{height:var(--border-size-medium)}z-navigation-tabs[size="small"]:not([orientation="vertical"])>nav>* z-icon{--z-icon-width:14px;--z-icon-height:14px}z-navigation-tabs[orientation="vertical"]>nav>*{padding:calc(var(--space-unit) * 3) calc(var(--space-unit) * 2)}z-navigation-tabs[orientation="vertical"]>nav>*>:not(z-icon){display:none}z-navigation-tabs[orientation="vertical"]>nav>:not([disabled]):hover::after,z-navigation-tabs[orientation="vertical"]>nav>[aria-selected="true"]::after{top:0;right:0;width:var(--border-size-large);height:100%}';const h=l;const c=class{constructor(a){t(this,a);this.selected=i(this,"selected",7);this.focusedTab=undefined;this.ariaLabel="";this.orientation=o.HORIZONTAL;this.size=s.BIG;this.selectedTab=undefined;this.canNavigate=undefined;this.canNavigatePrev=undefined;this.canNavigateNext=undefined}get direction(){return this.orientation==o.HORIZONTAL?"Left":"Top"}get dimension(){return this.orientation==o.HORIZONTAL?"Width":"Height"}get tabs(){return Array.from(this.nav.children)}scrollToTab(t){const i=this.orientation===o.HORIZONTAL?{block:"nearest",inline:"center"}:{block:"center",inline:"nearest"};t.scrollIntoView(Object.assign({behavior:"smooth"},i))}navigateBackwards(){this.nav.scrollBy({[this.direction.toLowerCase()]:0-this.nav[`client${this.dimension}`]/2,behavior:"smooth"})}navigateForward(){this.nav.scrollBy({[this.direction.toLowerCase()]:this.nav[`scroll${this.direction}`]+this.nav[`client${this.dimension}`]/2,behavior:"smooth"})}isArrowNavigation(t){return Object.values(r).includes(t.key)}checkScrollVisible(){if(!this.nav){return}this.canNavigate=this.nav[`scroll${this.dimension}`]>this.nav[`client${this.dimension}`]}checkScrollEnabled(){if(!this.nav){return}this.canNavigateNext=this.nav[`scroll${this.direction}`]+this.nav[`client${this.dimension}`]<this.nav[`scroll${this.dimension}`];this.canNavigatePrev=this.nav[`scroll${this.direction}`]>0}onTabSelected(){this.tabs.forEach(((t,i)=>{const a=t.querySelector("z-icon");const n=a===null||a===void 0?void 0:a.name.replace("-filled","");if(i!==this.selectedTab){t.setAttribute("aria-selected","false");t.tabIndex=-1;if(a){a.name=n}return}if(a){a.name=`${n}-filled`}t.setAttribute("aria-selected","true")}));this.selected.emit(this.selectedTab);if(this.selectedTab!==undefined){this.scrollToTab(this.tabs[this.selectedTab])}}handleTabClick(t){const i=t.target.closest("[role='tab']");if(!this.tabs.some((t=>t.contains(i)))){return}this.selectedTab=this.tabs.indexOf(i)}onTabFocusIn(t){const i=this.tabs.findIndex((i=>i.contains(t.target)));if(i===-1){return}if(this.selectedTab!==undefined){this.tabs[this.selectedTab].tabIndex=-1}this.focusedTab=i;this.tabs[this.focusedTab].tabIndex=-1;this.scrollToTab(this.tabs[this.focusedTab])}navigateThroughTabs(t){if(!this.tabs.some((i=>i.contains(t.target)))||!this.isArrowNavigation(t)){return true}t.preventDefault();if(t.key===r.RIGHT&&this.orientation==o.HORIZONTAL||t.key===r.DOWN&&this.orientation==o.VERTICAL){this.focusedTab++;if(this.focusedTab>=this.tabs.length){this.focusedTab=0}}else if(t.key===r.LEFT&&this.orientation==o.HORIZONTAL||t.key===r.UP&&this.orientation==o.VERTICAL){this.focusedTab--;if(this.focusedTab<0){this.focusedTab=this.tabs.length-1}}if(this.tabs[this.focusedTab].hasAttribute("disabled")&&this.tabs[this.focusedTab].getAttribute("disabled")!=="false"){return this.navigateThroughTabs(t)}this.tabs[this.focusedTab].focus();this.scrollToTab(this.tabs[this.focusedTab])}onTabFocusOut(t){var i;if(!this.tabs.some((i=>i.contains(t.relatedTarget)))){this.tabs[(i=this.selectedTab)!==null&&i!==void 0?i:0].tabIndex=0;this.focusedTab=undefined}}connectedCallback(){this.resizeObserver=new ResizeObserver((()=>this.checkScrollVisible()))}componentDidLoad(){var t;this.tabs.forEach((t=>{t.setAttribute("role","tab");t.tabIndex=-1}));const i=(t=this.selectedTab)!==null&&t!==void 0?t:this.tabs.findIndex((t=>t.ariaSelected==="true"));if(i!==-1){this.selectedTab=i;this.tabs[i].tabIndex=0;this.onTabSelected()}else{this.tabs[0].tabIndex=0}this.resizeObserver.observe(this.nav)}disconnectedCallback(){var t;(t=this.resizeObserver)===null||t===void 0?void 0:t.disconnect()}render(){return a(n,{key:"5be0d9887946f1fe38edf5ae657c9bf2fabc8d1f",class:{"interactive-2":this.size===s.SMALL,"interactive-1":this.size!==s.SMALL},scrollable:this.canNavigate},a("button",{key:"626765b099eb840c62ecf28a8281e0354ff63f3a",class:"navigation-button",onClick:this.navigateBackwards.bind(this),tabIndex:-1,disabled:!this.canNavigatePrev,"aria-label":"Mostra elementi precedenti",hidden:!this.canNavigate},a("z-icon",{key:"c59992ffc3e62a55c49b7d1c312d125a97b2fec8",name:this.orientation===o.HORIZONTAL?"chevron-left":"chevron-up",width:16,height:16})),a("nav",{key:"de67749daf40000757fff0148be2248127092c68",role:"tablist","aria-label":this.ariaLabel,ref:t=>this.nav=t!==null&&t!==void 0?t:this.nav,onScroll:this.checkScrollEnabled.bind(this),"aria-orientation":this.orientation},a("slot",{key:"9ddc7ad7766c525f9c2226a858c5cd1e6a2bbc6a"})),a("button",{key:"4af266b3752e99fd23720a3ba38376b564d461a9",class:"navigation-button",onClick:this.navigateForward.bind(this),tabIndex:-1,disabled:!this.canNavigateNext,"aria-label":"Mostra elementi successivi",hidden:!this.canNavigate},a("z-icon",{key:"6cd04b56841f88ac636a43a043196d96dacb6c88",name:this.orientation===o.HORIZONTAL?"chevron-right":"chevron-down",width:16,height:16})))}get host(){return e(this)}static get watchers(){return{canNavigate:["checkScrollEnabled"],selectedTab:["onTabSelected"]}}};c.style=h;export{c as z_navigation_tabs};
|
|
2
|
-
//# sourceMappingURL=p-7049aef2.entry.js.map
|