@zanichelli/albe-web-components 18.6.3 → 18.6.4
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 +2 -0
- package/dist/cjs/{index-c48948bf.js → index-0d3de93e.js} +2 -2
- package/dist/cjs/{index-c48948bf.js.map → index-0d3de93e.js.map} +1 -1
- package/dist/cjs/index.cjs.js +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/{utils-93961cb6.js → utils-3dc316f8.js} +56 -1
- package/dist/cjs/utils-3dc316f8.js.map +1 -0
- package/dist/cjs/web-components-library.cjs.js +1 -1
- 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 +2 -2
- package/dist/cjs/z-app-header_12.cjs.entry.js.map +1 -1
- package/dist/cjs/z-book-card-deprecated.cjs.entry.js +1 -1
- package/dist/cjs/z-breadcrumb.cjs.entry.js +1 -1
- package/dist/cjs/z-card.cjs.entry.js +1 -1
- package/dist/cjs/z-card.cjs.entry.js.map +1 -1
- package/dist/cjs/z-combobox.cjs.entry.js +1 -1
- package/dist/cjs/z-menu.cjs.entry.js +1 -1
- package/dist/cjs/z-myz-card-info.cjs.entry.js +1 -1
- package/dist/cjs/z-myz-list-item.cjs.entry.js +1 -1
- package/dist/cjs/z-popover.cjs.entry.js +232 -264
- package/dist/cjs/z-popover.cjs.entry.js.map +1 -1
- package/dist/cjs/z-select.cjs.entry.js +5 -7
- package/dist/cjs/z-select.cjs.entry.js.map +1 -1
- package/dist/cjs/z-skip-to-content.cjs.entry.js +1 -1
- package/dist/cjs/z-slideshow.cjs.entry.js +1 -1
- package/dist/cjs/z-table.cjs.entry.js +2 -2
- package/dist/cjs/z-toggle-switch.cjs.entry.js +1 -1
- package/dist/cjs/z-tr.cjs.entry.js +2 -2
- package/dist/collection/components/list/z-list-element/styles.css +2 -4
- package/dist/collection/components/z-anchor-navigation/index.js +1 -1
- package/dist/collection/components/z-anchor-navigation/index.js.map +1 -1
- package/dist/collection/components/z-card/styles.css +4 -0
- package/dist/collection/components/z-popover/index.js +236 -268
- package/dist/collection/components/z-popover/index.js.map +1 -1
- package/dist/collection/components/z-popover/index.stories.js +92 -45
- package/dist/collection/components/z-popover/index.stories.js.map +1 -1
- package/dist/collection/components/z-popover/styles.css +4 -14
- package/dist/collection/components/z-select/index.js +4 -6
- package/dist/collection/components/z-select/index.js.map +1 -1
- package/dist/collection/components/z-select/styles.css +2 -6
- package/dist/collection/utils/utils.js +53 -0
- package/dist/collection/utils/utils.js.map +1 -1
- package/dist/components/index14.js +1 -1
- package/dist/components/index14.js.map +1 -1
- package/dist/components/index23.js +234 -266
- package/dist/components/index23.js.map +1 -1
- package/dist/components/index24.js +1 -1
- package/dist/components/utils.js +55 -2
- package/dist/components/utils.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-card.js +1 -1
- package/dist/components/z-card.js.map +1 -1
- package/dist/components/z-select.js +5 -7
- package/dist/components/z-select.js.map +1 -1
- package/dist/esm/{index-10473b87.js → index-328b69a7.js} +2 -2
- package/dist/esm/{index-10473b87.js.map → index-328b69a7.js.map} +1 -1
- package/dist/esm/index.js +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/{utils-c8abef2f.js → utils-6e2be2b6.js} +55 -2
- package/dist/esm/utils-6e2be2b6.js.map +1 -0
- package/dist/esm/web-components-library.js +1 -1
- 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 +2 -2
- package/dist/esm/z-app-header_12.entry.js.map +1 -1
- package/dist/esm/z-book-card-deprecated.entry.js +1 -1
- package/dist/esm/z-breadcrumb.entry.js +1 -1
- package/dist/esm/z-card.entry.js +1 -1
- package/dist/esm/z-card.entry.js.map +1 -1
- package/dist/esm/z-combobox.entry.js +1 -1
- package/dist/esm/z-menu.entry.js +1 -1
- package/dist/esm/z-myz-card-info.entry.js +1 -1
- package/dist/esm/z-myz-list-item.entry.js +1 -1
- package/dist/esm/z-popover.entry.js +233 -265
- package/dist/esm/z-popover.entry.js.map +1 -1
- package/dist/esm/z-select.entry.js +5 -7
- package/dist/esm/z-select.entry.js.map +1 -1
- package/dist/esm/z-skip-to-content.entry.js +1 -1
- package/dist/esm/z-slideshow.entry.js +1 -1
- package/dist/esm/z-table.entry.js +2 -2
- package/dist/esm/z-toggle-switch.entry.js +1 -1
- package/dist/esm/z-tr.entry.js +2 -2
- package/dist/types/components/z-popover/index.d.ts +47 -45
- package/dist/types/components/z-popover/index.stories.d.ts +18 -7
- package/dist/types/components.d.ts +13 -17
- package/dist/types/utils/utils.d.ts +17 -0
- package/dist/web-components-library/index.esm.js +1 -1
- package/dist/web-components-library/{p-8b93bc6d.entry.js → p-01302e57.entry.js} +2 -2
- package/dist/web-components-library/{p-14f0bdf4.entry.js → p-1ad8810a.entry.js} +2 -2
- package/{www/build/p-c2ba8a6c.entry.js → dist/web-components-library/p-2e0923bd.entry.js} +2 -2
- package/dist/web-components-library/p-3284e37b.entry.js +2 -0
- package/dist/web-components-library/{p-61f76cab.js → p-43bc482a.js} +2 -2
- package/{www/build/p-2fb52cd0.entry.js → dist/web-components-library/p-539f99db.entry.js} +2 -2
- package/dist/web-components-library/p-625e2cee.js +2 -0
- package/dist/web-components-library/p-625e2cee.js.map +1 -0
- package/dist/web-components-library/p-62e1d867.entry.js +2 -0
- package/dist/web-components-library/p-62e1d867.entry.js.map +1 -0
- package/dist/web-components-library/p-63d220da.entry.js +2 -0
- package/dist/web-components-library/{p-8d5e3396.entry.js.map → p-63d220da.entry.js.map} +1 -1
- package/dist/web-components-library/{p-25935be3.entry.js → p-6d0fa7c1.entry.js} +2 -2
- package/dist/web-components-library/{p-25935be3.entry.js.map → p-6d0fa7c1.entry.js.map} +1 -1
- package/dist/web-components-library/{p-c8814ae1.entry.js → p-7916e0f7.entry.js} +2 -2
- package/{www/build/p-f5efb3fc.entry.js → dist/web-components-library/p-8bd4a2aa.entry.js} +2 -2
- package/dist/web-components-library/{p-c962e854.entry.js → p-8dec332e.entry.js} +2 -2
- package/dist/web-components-library/{p-72a7eb26.entry.js → p-966cbf03.entry.js} +2 -2
- package/{www/build/p-30575221.entry.js → dist/web-components-library/p-a0ed0c63.entry.js} +2 -2
- package/{www/build/p-e41442e0.entry.js → dist/web-components-library/p-b7b972c0.entry.js} +2 -2
- package/{www/build/p-e41442e0.entry.js.map → dist/web-components-library/p-b7b972c0.entry.js.map} +1 -1
- package/dist/web-components-library/p-b96ca9a0.entry.js +2 -0
- package/dist/web-components-library/p-b96ca9a0.entry.js.map +1 -0
- package/dist/web-components-library/{p-57b8bd19.entry.js → p-db9b7eb5.entry.js} +2 -2
- package/dist/web-components-library/p-db9b7eb5.entry.js.map +1 -0
- package/dist/web-components-library/web-components-library.esm.js +1 -1
- package/dist/web-components-library/web-components-library.esm.js.map +1 -1
- package/package.json +1 -1
- package/www/build/index.esm.js +1 -1
- package/www/build/{p-8b93bc6d.entry.js → p-01302e57.entry.js} +2 -2
- package/www/build/{p-14f0bdf4.entry.js → p-1ad8810a.entry.js} +2 -2
- package/{dist/web-components-library/p-c2ba8a6c.entry.js → www/build/p-2e0923bd.entry.js} +2 -2
- package/www/build/p-3284e37b.entry.js +2 -0
- package/www/build/{p-61f76cab.js → p-43bc482a.js} +2 -2
- package/{dist/web-components-library/p-2fb52cd0.entry.js → www/build/p-539f99db.entry.js} +2 -2
- package/www/build/p-625e2cee.js +2 -0
- package/www/build/p-625e2cee.js.map +1 -0
- package/www/build/p-62e1d867.entry.js +2 -0
- package/www/build/p-62e1d867.entry.js.map +1 -0
- package/www/build/p-63d220da.entry.js +2 -0
- package/www/build/{p-8d5e3396.entry.js.map → p-63d220da.entry.js.map} +1 -1
- package/www/build/{p-2870add3.js → p-6c6208e6.js} +1 -1
- package/www/build/{p-25935be3.entry.js → p-6d0fa7c1.entry.js} +2 -2
- package/www/build/{p-25935be3.entry.js.map → p-6d0fa7c1.entry.js.map} +1 -1
- package/www/build/{p-c8814ae1.entry.js → p-7916e0f7.entry.js} +2 -2
- package/{dist/web-components-library/p-f5efb3fc.entry.js → www/build/p-8bd4a2aa.entry.js} +2 -2
- package/www/build/{p-c962e854.entry.js → p-8dec332e.entry.js} +2 -2
- package/www/build/{p-72a7eb26.entry.js → p-966cbf03.entry.js} +2 -2
- package/{dist/web-components-library/p-30575221.entry.js → www/build/p-a0ed0c63.entry.js} +2 -2
- package/{dist/web-components-library/p-e41442e0.entry.js → www/build/p-b7b972c0.entry.js} +2 -2
- package/{dist/web-components-library/p-e41442e0.entry.js.map → www/build/p-b7b972c0.entry.js.map} +1 -1
- package/www/build/p-b96ca9a0.entry.js +2 -0
- package/www/build/p-b96ca9a0.entry.js.map +1 -0
- package/www/build/{p-57b8bd19.entry.js → p-db9b7eb5.entry.js} +2 -2
- package/www/build/p-db9b7eb5.entry.js.map +1 -0
- package/www/build/web-components-library.esm.js +1 -1
- package/www/build/web-components-library.esm.js.map +1 -1
- package/www/index.html +1 -1
- package/dist/cjs/utils-93961cb6.js.map +0 -1
- package/dist/esm/utils-c8abef2f.js.map +0 -1
- package/dist/web-components-library/p-37f271c8.entry.js +0 -2
- package/dist/web-components-library/p-37f271c8.entry.js.map +0 -1
- package/dist/web-components-library/p-57b8bd19.entry.js.map +0 -1
- package/dist/web-components-library/p-69a1a67a.entry.js +0 -2
- package/dist/web-components-library/p-8d5e3396.entry.js +0 -2
- package/dist/web-components-library/p-a06fbbc0.js +0 -2
- package/dist/web-components-library/p-a06fbbc0.js.map +0 -1
- package/dist/web-components-library/p-da30a6cb.entry.js +0 -2
- package/dist/web-components-library/p-da30a6cb.entry.js.map +0 -1
- package/www/build/p-37f271c8.entry.js +0 -2
- package/www/build/p-37f271c8.entry.js.map +0 -1
- package/www/build/p-57b8bd19.entry.js.map +0 -1
- package/www/build/p-69a1a67a.entry.js +0 -2
- package/www/build/p-8d5e3396.entry.js +0 -2
- package/www/build/p-a06fbbc0.js +0 -2
- package/www/build/p-a06fbbc0.js.map +0 -1
- package/www/build/p-da30a6cb.entry.js +0 -2
- package/www/build/p-da30a6cb.entry.js.map +0 -1
- /package/dist/web-components-library/{p-8b93bc6d.entry.js.map → p-01302e57.entry.js.map} +0 -0
- /package/dist/web-components-library/{p-14f0bdf4.entry.js.map → p-1ad8810a.entry.js.map} +0 -0
- /package/dist/web-components-library/{p-c2ba8a6c.entry.js.map → p-2e0923bd.entry.js.map} +0 -0
- /package/dist/web-components-library/{p-69a1a67a.entry.js.map → p-3284e37b.entry.js.map} +0 -0
- /package/dist/web-components-library/{p-61f76cab.js.map → p-43bc482a.js.map} +0 -0
- /package/dist/web-components-library/{p-2fb52cd0.entry.js.map → p-539f99db.entry.js.map} +0 -0
- /package/dist/web-components-library/{p-c8814ae1.entry.js.map → p-7916e0f7.entry.js.map} +0 -0
- /package/dist/web-components-library/{p-f5efb3fc.entry.js.map → p-8bd4a2aa.entry.js.map} +0 -0
- /package/dist/web-components-library/{p-c962e854.entry.js.map → p-8dec332e.entry.js.map} +0 -0
- /package/dist/web-components-library/{p-72a7eb26.entry.js.map → p-966cbf03.entry.js.map} +0 -0
- /package/dist/web-components-library/{p-30575221.entry.js.map → p-a0ed0c63.entry.js.map} +0 -0
- /package/www/build/{p-8b93bc6d.entry.js.map → p-01302e57.entry.js.map} +0 -0
- /package/www/build/{p-14f0bdf4.entry.js.map → p-1ad8810a.entry.js.map} +0 -0
- /package/www/build/{p-c2ba8a6c.entry.js.map → p-2e0923bd.entry.js.map} +0 -0
- /package/www/build/{p-69a1a67a.entry.js.map → p-3284e37b.entry.js.map} +0 -0
- /package/www/build/{p-61f76cab.js.map → p-43bc482a.js.map} +0 -0
- /package/www/build/{p-2fb52cd0.entry.js.map → p-539f99db.entry.js.map} +0 -0
- /package/www/build/{p-c8814ae1.entry.js.map → p-7916e0f7.entry.js.map} +0 -0
- /package/www/build/{p-f5efb3fc.entry.js.map → p-8bd4a2aa.entry.js.map} +0 -0
- /package/www/build/{p-c962e854.entry.js.map → p-8dec332e.entry.js.map} +0 -0
- /package/www/build/{p-72a7eb26.entry.js.map → p-966cbf03.entry.js.map} +0 -0
- /package/www/build/{p-30575221.entry.js.map → p-a0ed0c63.entry.js.map} +0 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"index23.js","mappings":"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","names":[],"sources":["src/components/z-popover/styles.css?tag=z-popover&encapsulation=shadow","src/components/z-popover/index.tsx"],"sourcesContent":[":host {\n --z-popover-theme--surface: ;\n --z-popover-theme--text: ;\n --z-popover-padding: ;\n --z-popover-shadow-filter: ;\n\n position: absolute;\n display: none;\n min-width: calc(var(--space-unit) * 8);\n max-width: 100%;\n min-height: calc(var(--space-unit) * 4);\n max-height: 100%;\n align-items: center;\n justify-content: center;\n padding: var(--z-popover-padding, 0);\n background: var(--z-popover-theme--surface, var(--color-surface01));\n border-radius: var(--border-radius-small);\n color: var(--z-popover-theme--text, var(--color-default-text));\n fill: currentcolor;\n filter: var(--z-popover-shadow-filter, drop-shadow(0 1px 2px var(--shadow-color-base)));\n font-family: var(--font-family-sans);\n text-align: center;\n}\n\n:host([open]:not([current-position])) {\n visibility: hidden;\n}\n\n:host([open][current-position]),\n:host([open=\"true\"][current-position]) {\n display: flex;\n}\n\n:host([center][current-position=\"top\"]),\n:host([center][current-position=\"bottom\"]) {\n transform: translateX(-50%);\n}\n\n:host([center][current-position=\"right\"]),\n:host([center][current-position=\"left\"]) {\n transform: translateY(-50%);\n}\n\n:host([current-position^=\"top\"]) {\n margin: 0 0 var(--space-unit);\n}\n\n:host([current-position^=\"bottom\"]) {\n margin: var(--space-unit) 0 0;\n}\n\n:host([current-position^=\"left\"]) {\n margin: 0 var(--space-unit) 0 0;\n}\n\n:host([current-position^=\"right\"]) {\n margin: 0 0 0 var(--space-unit);\n}\n\n/* Arrow style */\n\n:host([current-position])::before {\n --arrow-size: 6px;\n --arrow-edge-offset: calc(100% - var(--space-unit) - (var(--arrow-size) / 2));\n --arrow-center-x-offset: calc(50% - (var(--arrow-size) / 2));\n --arrow-center-y-offset: calc(100% - (var(--arrow-size) / 2));\n\n position: absolute;\n display: block;\n width: var(--arrow-size);\n height: var(--arrow-size);\n background: var(--z-popover-theme--surface, var(--color-surface01));\n content: \"\";\n transform: rotate(45deg);\n}\n\n:host([show-arrow=\"false\"])::before,\n:host(:not([show-arrow]))::before {\n display: none;\n}\n\n:host([current-position^=\"top\"])::before {\n top: var(--arrow-center-y-offset);\n}\n\n:host([current-position^=\"bottom\"])::before {\n bottom: var(--arrow-center-y-offset);\n}\n\n:host([current-position=\"top\"])::before,\n:host([current-position=\"bottom\"])::before {\n right: var(--arrow-edge-offset);\n}\n\n:host([current-position=\"right\"])::before,\n:host([current-position=\"left\"])::before {\n bottom: var(--arrow-edge-offset);\n}\n\n:host([current-position=\"right\"])::before {\n right: var(--arrow-center-y-offset);\n}\n\n:host([current-position=\"left\"])::before {\n left: var(--arrow-center-y-offset);\n}\n\n:host([current-position=\"top_right\"])::before,\n:host([current-position=\"bottom_right\"])::before {\n right: var(--arrow-edge-offset);\n}\n\n:host([current-position=\"top_left\"])::before,\n:host([current-position=\"bottom_left\"])::before {\n left: var(--arrow-edge-offset);\n}\n\n:host([current-position=\"right_top\"])::before,\n:host([current-position=\"left_top\"])::before {\n top: var(--arrow-edge-offset);\n}\n\n:host([current-position=\"right_top\"])::before,\n:host([current-position=\"right_bottom\"])::before {\n right: var(--arrow-center-y-offset);\n}\n\n:host([current-position=\"left_top\"])::before,\n:host([current-position=\"left_bottom\"])::before {\n left: var(--arrow-center-y-offset);\n}\n\n:host([current-position=\"right_bottom\"])::before,\n:host([current-position=\"left_bottom\"])::before {\n bottom: var(--arrow-edge-offset);\n}\n\n:host([center][current-position=\"top\"])::before,\n:host([center][current-position=\"bottom\"])::before {\n right: auto;\n left: var(--arrow-center-x-offset);\n}\n\n:host([center][current-position=\"right\"])::before,\n:host([center][current-position=\"left\"])::before {\n top: var(--arrow-center-x-offset);\n bottom: auto;\n}\n\n::slotted(*) {\n overflow: auto;\n flex: 1 auto;\n}\n","import {Component, Element, Event, EventEmitter, Host, Listen, Prop, State, Watch, h} from \"@stencil/core\";\nimport {KeyboardCode, PopoverPosition} from \"../../beans\";\n\nconst DOCUMENT_ELEMENT = document.documentElement;\n\ntype Offsets = {top: number; right: number; bottom: number; left: number};\ntype ElementSizes = {width: number; height: number};\n/** Centering offset modifier. 0 for no offset, 0.5 for centering. */\ntype OffsetModifier = 0 | 0.5;\n\nfunction getParentElement(element: Element): Element {\n if (element.parentNode === element.shadowRoot) {\n return element.shadowRoot.host;\n }\n\n return element.parentElement;\n}\n\n/**\n * Find the closest scrollable parent of a node.\n *\n * @param {Element} element The node\n */\nfunction findScrollableParent(element: Element): Element {\n let parent = getParentElement(element);\n\n while (parent && parent !== DOCUMENT_ELEMENT) {\n const style = window.getComputedStyle(parent);\n const {overflow, overflowX, overflowY} = style;\n\n // Check for hidden overflow first (early return)\n if (overflow === \"hidden\" || overflowY === \"hidden\" || overflowX === \"hidden\") {\n return parent;\n }\n\n // Only check scrollable if overflow is not visible\n const isOverflowNotVisible = overflow !== \"visible\";\n const isOverflowYNotVisible = overflowY !== \"visible\";\n const isOverflowXNotVisible = overflowX !== \"visible\";\n\n if (\n (parent.scrollHeight > parent.clientHeight && isOverflowNotVisible && isOverflowYNotVisible) ||\n (parent.scrollWidth > parent.clientWidth && isOverflowNotVisible && isOverflowXNotVisible)\n ) {\n return parent;\n }\n\n parent = getParentElement(parent);\n }\n\n return DOCUMENT_ELEMENT;\n}\n\n/**\n * Calculate computed offset.\n * It includes matrix transformations.\n * @param element The target element.\n * @param targetParentOffset The relative offset parent.\n */\nfunction computeOffset(element: HTMLElement, targetParentOffset?: HTMLElement): Offsets & ElementSizes {\n const rect = element.getBoundingClientRect();\n const {width, height} = rect;\n\n let top = 0;\n let left = 0;\n let offsetParent = element;\n\n while (offsetParent && offsetParent !== targetParentOffset) {\n left += offsetParent.offsetLeft;\n\n // document.body sometimes has offsetTop == 0 but still has an offset because of children margins!\n if (offsetParent === document.body) {\n top += offsetParent.getBoundingClientRect().top + window.scrollY;\n } else {\n top += offsetParent.offsetTop;\n }\n\n // Handle CSS transforms only when DOMMatrix is available\n if (window.DOMMatrix) {\n const style = window.getComputedStyle(offsetParent);\n const {transform} = style;\n\n if (transform && transform !== \"none\") {\n const domMatrix = new DOMMatrix(transform);\n left += domMatrix.m41;\n if (offsetParent !== document.body) {\n top += domMatrix.m42;\n }\n }\n }\n\n if (!offsetParent.offsetParent) {\n break;\n }\n\n offsetParent = offsetParent.offsetParent as HTMLElement;\n }\n\n let parentWidth: number;\n let parentHeight: number;\n if (offsetParent === document.body) {\n parentWidth = window.innerWidth;\n parentHeight = window.innerHeight;\n } else {\n parentWidth = offsetParent.offsetWidth;\n parentHeight = offsetParent.offsetHeight;\n }\n\n const right = parentWidth - left - width;\n const bottom = parentHeight - top - height;\n\n return {top, right, bottom, left, width, height};\n}\n\n/**\n * Popover component.\n * This component displays a popover that can be bound to an element.\n * It supports various positions and can automatically adjust its position based on available space.\n *\n * Notes:\n * - To ensure the positioning algorithm finds the right container when calculating the position, set its container's `position` to `relative`.\n * - Consider manually adjusting the size of the slotted element (using `max-width`, `max-height`, etc...) when its content is \"fluid\" (like a big text), because it can interfere with the position calculation (for example a long text on one single line can be bigger than the available space, letting the algorithm think that the popover doesn't fit in the available space).\n *\n * @cssprop --z-popover-theme--surface - background color of the popover.\n * @cssprop --z-popover-theme--text - foreground color of the popover.\n * @cssprop --z-popover-padding - padding of the popover.\n * @cssprop --z-popover-shadow-filter - drop-shadow filter of the popover. Defaults to `drop-shadow(0 1px 2px var(--shadow-color-base))`.\n */\n@Component({\n tag: \"z-popover\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZPopover {\n /**\n * The preferred position to render the popover.\n * The popover will automatically search another position if not enough space is available for the preferred position.\n * If the preferred position is not available, it will try to find the best position starting from `TOP` and going clockwise.\n */\n @Prop({reflect: true, mutable: true})\n position?: PopoverPosition = PopoverPosition.TOP;\n\n /**\n * The open state of the popover.\n */\n @Prop({reflect: true, mutable: true})\n open = false;\n\n /**\n * The selector or the element bound with the popover.\n * If string css selector is provided make sure to use a valid selector.\n */\n @Prop()\n bindTo?: string | HTMLElement;\n\n /**\n * Whether to show popover's arrow.\n */\n @Prop({reflect: true})\n showArrow = false;\n\n /**\n * Whether to center the popup on the main side (according to \"position\").\n */\n @Prop({reflect: true})\n center = false;\n\n /**\n * If true, the popover can be closed by clicking outside of it or pressing the escape key.\n * Otherwise, it will be closed only programmatically (by setting `open` to `false`).\n */\n @Prop()\n closable = true;\n\n /**\n * The current position of the popover.\n * It differs from `position` only when calculated automatically (position=auto) or when the position is recalculated for space reasons.\n */\n @State()\n currentPosition?: PopoverPosition;\n\n /**\n * Position change event.\n */\n @Event()\n positionChange: EventEmitter;\n\n /**\n * Open change event.\n */\n @Event()\n openChange: EventEmitter;\n\n @Element() host: HTMLZPopoverElement;\n\n private animationFrameRequestId?: number;\n\n private readonly spaceTolerance = 3; // 3px tolerance for space calculations\n\n @Listen(\"keyup\", {target: \"window\"})\n closePopoverWithKeyboard(e: KeyboardEvent): void {\n if (this.closable && e.key === KeyboardCode.ESC) {\n this.open = false;\n }\n }\n\n /**\n * Close the popover when clicking outside of its content.\n * Stop event propagation if the click was fired by popover's trigger element,\n * to prevent close and reopen glitches.\n * @param {MouseEvent} e\n */\n @Listen(\"click\", {target: \"body\", capture: true})\n handleOutsideClick(e: MouseEvent): void {\n if (!this.closable || !this.open) {\n return;\n }\n\n const eventPath = e.composedPath();\n if (!eventPath.includes(this.host)) {\n const target = e.target as HTMLElement;\n let triggerElemClicked = false;\n\n if (typeof this.bindTo === \"string\") {\n triggerElemClicked = !!target.closest(this.bindTo);\n } else if (this.bindTo) {\n triggerElemClicked = this.bindTo.contains(target);\n }\n\n if (triggerElemClicked) {\n // stop propagation if the click was on the trigger element to prevent close and reopen glitches\n e.stopPropagation();\n }\n\n this.open = false;\n this.positionChange.emit({position: this.currentPosition});\n }\n }\n\n @Watch(\"position\")\n validatePosition(newValue: PopoverPosition): void {\n if (!Object.values(PopoverPosition).includes(newValue as PopoverPosition) || newValue === PopoverPosition.AUTO) {\n newValue = PopoverPosition.TOP;\n }\n\n this.position = newValue;\n this.currentPosition = newValue;\n this.positionChange.emit({position: this.currentPosition});\n this.setPosition();\n }\n\n /**\n * Setup popover behaviors on opening.\n */\n @Watch(\"open\")\n onOpen(): void {\n cancelAnimationFrame(this.animationFrameRequestId);\n\n if (this.open) {\n const setPosition = (): void => {\n if (this.open) {\n this.setPosition();\n this.animationFrameRequestId = requestAnimationFrame(setPosition);\n }\n };\n\n // call `setPosition` after a tick to ensure the DOM is ready and sizes are available\n setTimeout(() => {\n setPosition();\n }, 0);\n }\n\n this.openChange.emit({open: this.open});\n }\n\n // Clockwise order of positions.\n private static readonly positionOrder: PopoverPosition[] = [\n PopoverPosition.TOP_RIGHT,\n PopoverPosition.TOP,\n PopoverPosition.TOP_LEFT,\n PopoverPosition.RIGHT_BOTTOM,\n PopoverPosition.RIGHT,\n PopoverPosition.RIGHT_TOP,\n PopoverPosition.BOTTOM_LEFT,\n PopoverPosition.BOTTOM,\n PopoverPosition.BOTTOM_RIGHT,\n PopoverPosition.LEFT_TOP,\n PopoverPosition.LEFT,\n PopoverPosition.LEFT_BOTTOM,\n ] as const;\n\n /**\n * Helper functions for space calculation\n */\n private hasCenteredHorizontalSpace(\n availableLeft: number,\n availableRight: number,\n hostWidth: number,\n boundWidth: number,\n offsetModifier: OffsetModifier\n ): boolean {\n const requiredSpace = (hostWidth - boundWidth) * (1 - offsetModifier);\n\n return (\n availableLeft >= requiredSpace - this.spaceTolerance && availableRight >= requiredSpace - this.spaceTolerance\n );\n }\n\n private hasCenteredVerticalSpace(\n availableTop: number,\n availableBottom: number,\n hostHeight: number,\n boundHeight: number,\n offsetModifier: OffsetModifier\n ): boolean {\n const requiredSpace = (hostHeight - boundHeight) * (1 - offsetModifier);\n\n return (\n availableTop >= requiredSpace - this.spaceTolerance && availableBottom >= requiredSpace - this.spaceTolerance\n );\n }\n\n private hasOffsetSpace(\n availableSpace: number,\n hostSize: number,\n boundSize: number,\n offsetModifier: OffsetModifier\n ): boolean {\n return availableSpace >= hostSize - boundSize * (1 - offsetModifier) - this.spaceTolerance;\n }\n\n /**\n * Given a desired position and available space around the bound element, returns the best position\n * that fits the popover, trying all positions if needed.\n * Takes into account offsetModifier for centering.\n * @param desiredPosition The desired position of the popover.\n * @param availableSpace The available space around the bound element.\n * @param boundElemSizes The sizes of the bound element.\n * @param offsetModifier The modifier to apply to the offset for centering.\n */\n private getOptimalPopoverPosition(\n desiredPosition: PopoverPosition,\n availableSpace: Offsets,\n boundElemSizes: ElementSizes,\n offsetModifier: OffsetModifier\n ): PopoverPosition {\n const hostWidth = this.host.offsetWidth;\n const hostHeight = this.host.offsetHeight;\n\n // Check if the desired position has enough space\n const fits = (pos: PopoverPosition): boolean => {\n switch (pos) {\n case PopoverPosition.TOP:\n return (\n availableSpace.top >= hostHeight &&\n this.hasCenteredHorizontalSpace(\n availableSpace.left,\n availableSpace.right,\n hostWidth,\n boundElemSizes.width,\n offsetModifier\n )\n );\n\n case PopoverPosition.TOP_RIGHT:\n return (\n availableSpace.top >= hostHeight &&\n this.hasOffsetSpace(availableSpace.right, hostWidth, boundElemSizes.width, offsetModifier)\n );\n\n case PopoverPosition.TOP_LEFT:\n return (\n availableSpace.top >= hostHeight &&\n this.hasOffsetSpace(availableSpace.left, hostWidth, boundElemSizes.width, offsetModifier)\n );\n\n case PopoverPosition.RIGHT:\n return (\n availableSpace.right >= hostWidth &&\n this.hasCenteredVerticalSpace(\n availableSpace.top,\n availableSpace.bottom,\n hostHeight,\n boundElemSizes.height,\n offsetModifier\n )\n );\n\n case PopoverPosition.RIGHT_BOTTOM:\n return (\n availableSpace.right >= hostWidth &&\n this.hasOffsetSpace(availableSpace.bottom, hostHeight, boundElemSizes.height, offsetModifier)\n );\n\n case PopoverPosition.RIGHT_TOP:\n return (\n availableSpace.right >= hostWidth &&\n this.hasOffsetSpace(availableSpace.top, hostHeight, boundElemSizes.height, offsetModifier)\n );\n\n case PopoverPosition.BOTTOM:\n return (\n availableSpace.bottom >= hostHeight &&\n this.hasCenteredHorizontalSpace(\n availableSpace.left,\n availableSpace.right,\n hostWidth,\n boundElemSizes.width,\n offsetModifier\n )\n );\n\n case PopoverPosition.BOTTOM_LEFT:\n return (\n availableSpace.bottom >= hostHeight &&\n this.hasOffsetSpace(availableSpace.left, hostWidth, boundElemSizes.width, offsetModifier)\n );\n\n case PopoverPosition.BOTTOM_RIGHT:\n return (\n availableSpace.bottom >= hostHeight &&\n this.hasOffsetSpace(availableSpace.right, hostWidth, boundElemSizes.width, offsetModifier)\n );\n\n case PopoverPosition.LEFT:\n return (\n availableSpace.left >= hostWidth &&\n this.hasCenteredVerticalSpace(\n availableSpace.top,\n availableSpace.bottom,\n hostHeight,\n boundElemSizes.height,\n offsetModifier\n )\n );\n\n case PopoverPosition.LEFT_TOP:\n return (\n availableSpace.left >= hostWidth &&\n this.hasOffsetSpace(availableSpace.top, hostHeight, boundElemSizes.height, offsetModifier)\n );\n\n case PopoverPosition.LEFT_BOTTOM:\n return (\n availableSpace.left >= hostWidth &&\n this.hasOffsetSpace(availableSpace.bottom, hostHeight, boundElemSizes.height, offsetModifier)\n );\n\n default:\n return false;\n }\n };\n\n // Check desired position first\n if (fits(desiredPosition)) {\n return desiredPosition;\n }\n\n // Find position index and create rotation starting from next position\n const positions = ZPopover.positionOrder;\n const startIndex = positions.indexOf(desiredPosition);\n\n if (startIndex === -1) {\n return desiredPosition; // fallback if position not found\n }\n\n // Try all other positions starting from the next one\n for (let i = 1; i < positions.length; i++) {\n const posIndex = (startIndex + i) % positions.length;\n const pos = positions[posIndex];\n if (fits(pos)) {\n return pos;\n }\n }\n\n // If no position fits, find the best fallback based on available space\n return this.findBestFallbackPosition(availableSpace);\n }\n\n /**\n * Find the best fallback position based on available space when no position fits perfectly\n */\n private findBestFallbackPosition(availableSpace: Offsets): PopoverPosition {\n // Determine the directions with the most space\n const bestHorizontalDirection =\n availableSpace.right >= availableSpace.left ? PopoverPosition.RIGHT : PopoverPosition.LEFT;\n\n const bestVerticalDirection =\n availableSpace.bottom >= availableSpace.top ? PopoverPosition.BOTTOM : PopoverPosition.TOP;\n\n // Choose the main direction based on which has more space\n const maxHorizontalSpace = Math.max(availableSpace.right, availableSpace.left);\n const maxVerticalSpace = Math.max(availableSpace.bottom, availableSpace.top);\n\n const mainDirection = maxVerticalSpace >= maxHorizontalSpace ? bestVerticalDirection : bestHorizontalDirection;\n\n // Check if secondary direction is necessary\n // Only add secondary direction if the difference between min and max in that direction is at least double\n let needsSecondaryDirection = false;\n\n if (mainDirection === bestVerticalDirection) {\n // Main direction is vertical, check horizontal space difference\n const minHorizontalSpace = Math.min(availableSpace.right, availableSpace.left);\n needsSecondaryDirection = maxHorizontalSpace >= minHorizontalSpace * 2;\n } else {\n // Main direction is horizontal, check vertical space difference\n const minVerticalSpace = Math.min(availableSpace.bottom, availableSpace.top);\n needsSecondaryDirection = maxVerticalSpace >= minVerticalSpace * 2;\n }\n\n if (!needsSecondaryDirection) {\n return mainDirection;\n }\n\n const secondaryDirection =\n mainDirection === bestVerticalDirection ? bestHorizontalDirection : bestVerticalDirection;\n\n // Create a combined position (e.g., \"bottom_right\")\n return `${mainDirection}_${secondaryDirection}` as PopoverPosition;\n }\n\n /**\n * Calculate available space around the bound element\n */\n private calculateAvailableSpace(\n boundElementRect: Offsets & ElementSizes,\n scrollContainer: HTMLElement,\n scrollingBoundingRect: DOMRect\n ): {top: number; right: number; bottom: number; left: number} {\n const top = boundElementRect.top - scrollContainer.scrollTop;\n const bottom =\n scrollingBoundingRect.height - (boundElementRect.top + boundElementRect.height) + scrollContainer.scrollTop;\n const left = boundElementRect.left - scrollContainer.scrollLeft;\n const right =\n scrollingBoundingRect.width - (boundElementRect.left + boundElementRect.width) + scrollContainer.scrollLeft;\n\n const overflowBottom = Math.max(0, scrollingBoundingRect.top + scrollingBoundingRect.height - window.innerHeight);\n const overflowRight = Math.max(0, scrollingBoundingRect.left + scrollingBoundingRect.width - window.innerWidth);\n\n return {\n top: Math.min(top, top + scrollingBoundingRect.top),\n bottom: Math.min(bottom, bottom - overflowBottom),\n left: Math.min(left, left + scrollingBoundingRect.left),\n right: Math.min(right, right - overflowRight),\n };\n }\n\n /**\n * Calculate relative offsets for positioning\n */\n private calculateRelativeOffsets(\n boundElementRect: Offsets,\n relativeBoundingRect: Offsets\n ): {top: number; right: number; bottom: number; left: number} {\n return {\n top: boundElementRect.top - relativeBoundingRect.top,\n right: boundElementRect.right - relativeBoundingRect.right,\n bottom: boundElementRect.bottom - relativeBoundingRect.bottom,\n left: boundElementRect.left - relativeBoundingRect.left,\n };\n }\n\n /**\n * Apply positioning styles based on position\n */\n private applyPositionStyles(\n position: PopoverPosition,\n style: CSSStyleDeclaration,\n offsets: Offsets,\n boundElementSizes: ElementSizes,\n availableSpace: Offsets,\n offsetModifier: OffsetModifier,\n arrowModifier: number\n ): void {\n const distanceFromBound = 8; // 8px is the distance of the popover from the bound element\n // Reset all positioning properties\n style.top = \"auto\";\n style.right = \"auto\";\n style.bottom = \"auto\";\n style.left = \"auto\";\n style.maxWidth = \"\";\n style.maxHeight = \"\";\n\n switch (position) {\n case PopoverPosition.TOP:\n case PopoverPosition.TOP_RIGHT:\n style.bottom = `${offsets.bottom + boundElementSizes.height}px`;\n style.left = `${offsets.left + boundElementSizes.width * offsetModifier - (position === PopoverPosition.TOP_RIGHT ? arrowModifier : 0)}px`;\n style.maxHeight = `${availableSpace.top - distanceFromBound}px`;\n if (position === PopoverPosition.TOP_RIGHT) {\n style.maxWidth = `${availableSpace.right + boundElementSizes.width * offsetModifier}px`;\n }\n break;\n\n case PopoverPosition.TOP_LEFT:\n style.right = `${offsets.right + boundElementSizes.width * offsetModifier - arrowModifier}px`;\n style.bottom = `${offsets.bottom + boundElementSizes.height}px`;\n style.maxWidth = `${availableSpace.left}px`;\n style.maxHeight = `${availableSpace.top - distanceFromBound}px`;\n break;\n\n case PopoverPosition.BOTTOM:\n case PopoverPosition.BOTTOM_RIGHT:\n style.top = `${offsets.top + boundElementSizes.height}px`;\n style.left = `${offsets.left + boundElementSizes.width * offsetModifier - (position === PopoverPosition.BOTTOM_RIGHT ? arrowModifier : 0)}px`;\n style.maxHeight = `${availableSpace.bottom - distanceFromBound}px`;\n if (position === PopoverPosition.BOTTOM_RIGHT) {\n style.maxWidth = `${availableSpace.right + boundElementSizes.width * offsetModifier}px`;\n }\n break;\n\n case PopoverPosition.BOTTOM_LEFT:\n style.top = `${offsets.top + boundElementSizes.height}px`;\n style.right = `${offsets.right + boundElementSizes.width * offsetModifier - arrowModifier}px`;\n style.maxWidth = `${availableSpace.left}px`;\n style.maxHeight = `${availableSpace.bottom - distanceFromBound}px`;\n break;\n\n case PopoverPosition.RIGHT:\n case PopoverPosition.RIGHT_BOTTOM:\n style.top = `${offsets.top + boundElementSizes.height * offsetModifier - (position === PopoverPosition.RIGHT_BOTTOM ? arrowModifier : 0)}px`;\n style.left = `${offsets.left + boundElementSizes.width}px`;\n style.maxWidth = `${availableSpace.right - distanceFromBound}px`;\n if (position === PopoverPosition.RIGHT) {\n style.maxHeight = `${Math.min(availableSpace.top + availableSpace.bottom + boundElementSizes.height, window.innerHeight - 20)}px`;\n } else {\n style.maxHeight = `${availableSpace.bottom + boundElementSizes.height * offsetModifier}px`;\n }\n break;\n\n case PopoverPosition.RIGHT_TOP:\n style.bottom = `${offsets.bottom + boundElementSizes.height * offsetModifier - arrowModifier}px`;\n style.left = `${offsets.left + boundElementSizes.width}px`;\n style.maxWidth = `${availableSpace.right - distanceFromBound}px`;\n if (position === PopoverPosition.RIGHT_TOP) {\n style.maxHeight = `${availableSpace.top + boundElementSizes.height * offsetModifier}px`;\n }\n break;\n\n case PopoverPosition.LEFT:\n case PopoverPosition.LEFT_BOTTOM:\n style.top = `${offsets.top + boundElementSizes.height * offsetModifier - (position === PopoverPosition.LEFT_BOTTOM ? arrowModifier : 0)}px`;\n style.right = `${offsets.right + boundElementSizes.width}px`;\n style.maxWidth = `${availableSpace.left - distanceFromBound}px`;\n if (position === PopoverPosition.LEFT_BOTTOM) {\n style.maxHeight = `${availableSpace.bottom + boundElementSizes.height * offsetModifier}px`;\n }\n break;\n\n case PopoverPosition.LEFT_TOP:\n style.right = `${offsets.right + boundElementSizes.width}px`;\n style.bottom = `${offsets.bottom + boundElementSizes.height * offsetModifier - arrowModifier}px`;\n style.maxWidth = `${availableSpace.left - distanceFromBound}px`;\n if (position === PopoverPosition.LEFT_TOP) {\n style.maxHeight = `${availableSpace.top + boundElementSizes.height * offsetModifier}px`;\n }\n break;\n }\n }\n\n /**\n * Set the position of the popover.\n */\n private setPosition(): void {\n let boundElement: HTMLElement;\n if (typeof this.bindTo === \"string\") {\n boundElement = this.host.ownerDocument.querySelector(this.bindTo) as HTMLElement;\n } else if (this.bindTo) {\n boundElement = this.bindTo;\n } else {\n boundElement = this.host.parentElement as HTMLElement;\n }\n\n if (!boundElement) {\n return;\n }\n\n const scrollContainer = findScrollableParent(boundElement) as HTMLElement;\n const scrollingBoundingRect = scrollContainer.getBoundingClientRect();\n const offsetContainer = this.host.offsetParent as HTMLElement;\n\n const relativeBoundingRect = offsetContainer\n ? computeOffset(offsetContainer, scrollContainer)\n : {top: 0, right: 0, bottom: 0, left: 0};\n const boundElementRect = computeOffset(boundElement, scrollContainer);\n\n const availableSpace = this.calculateAvailableSpace(boundElementRect, scrollContainer, scrollingBoundingRect);\n const offsets = this.calculateRelativeOffsets(boundElementRect, relativeBoundingRect);\n const offsetModifier = this.center ? 0.5 : 0;\n const arrowModifier = this.showArrow && this.center ? 8 : 0; // 8px is the distance of the arrow center from the edge of the popover\n\n const position = this.getOptimalPopoverPosition(\n this.position,\n availableSpace,\n {width: boundElementRect.width, height: boundElementRect.height},\n offsetModifier\n );\n\n const style = this.host.style;\n this.applyPositionStyles(position, style, offsets, boundElementRect, availableSpace, offsetModifier, arrowModifier);\n\n this.currentPosition = position;\n }\n\n componentWillLoad(): void {\n this.validatePosition(this.position);\n this.onOpen();\n }\n\n componentDidLoad(): void {\n this.setPosition();\n }\n\n disconnectedCallback(): void {\n cancelAnimationFrame(this.animationFrameRequestId);\n }\n\n render(): HTMLZPopoverElement {\n return (\n <Host current-position={this.currentPosition}>\n <slot></slot>\n </Host>\n );\n }\n}\n"],"version":3}
|
|
1
|
+
{"file":"index23.js","mappings":"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","names":[],"sources":["src/components/z-popover/styles.css?tag=z-popover&encapsulation=shadow","src/components/z-popover/index.tsx"],"sourcesContent":[":host {\n --z-popover-theme--surface: ;\n --z-popover-theme--text: ;\n --z-popover-padding: ;\n --z-popover-shadow-filter: ;\n\n position: fixed;\n display: none;\n max-width: calc(100% - var(--grid-margin) * 2);\n max-height: calc(100% - var(--grid-margin) * 2);\n padding: var(--z-popover-padding, 0);\n background: var(--z-popover-theme--surface, var(--color-surface01));\n border-radius: var(--border-radius-small);\n color: var(--z-popover-theme--text, var(--color-default-text));\n fill: currentcolor;\n filter: var(--z-popover-shadow-filter, drop-shadow(0 1px 2px var(--shadow-color-base)));\n text-align: center;\n}\n\n:host([open]:not([current-position])) {\n visibility: hidden;\n}\n\n:host([open][current-position]),\n:host([open=\"true\"][current-position]) {\n display: block;\n}\n\n:host([center][current-position=\"top\"]),\n:host([center][current-position=\"bottom\"]) {\n transform: translateX(-50%);\n}\n\n:host([center][current-position=\"right\"]),\n:host([center][current-position=\"left\"]) {\n transform: translateY(-50%);\n}\n\n:host([current-position^=\"top\"]) {\n margin: 0 0 var(--space-unit);\n}\n\n:host([current-position^=\"bottom\"]) {\n margin: var(--space-unit) 0 0;\n}\n\n:host([current-position^=\"left\"]) {\n margin: 0 var(--space-unit) 0 0;\n}\n\n:host([current-position^=\"right\"]) {\n margin: 0 0 0 var(--space-unit);\n}\n\n/* Arrow style */\n\n:host([current-position])::before {\n --arrow-size: 6px;\n --arrow-edge-offset: calc(100% - var(--space-unit) - (var(--arrow-size) / 2));\n --arrow-center-x-offset: calc(50% - (var(--arrow-size) / 2));\n --arrow-center-y-offset: calc(100% - (var(--arrow-size) / 2));\n\n position: absolute;\n display: block;\n width: var(--arrow-size);\n height: var(--arrow-size);\n background: var(--z-popover-theme--surface, var(--color-surface01));\n content: \"\";\n transform: rotate(45deg);\n}\n\n:host([show-arrow=\"false\"])::before,\n:host(:not([show-arrow]))::before {\n display: none;\n}\n\n:host([current-position^=\"top\"])::before {\n top: var(--arrow-center-y-offset);\n}\n\n:host([current-position^=\"bottom\"])::before {\n bottom: var(--arrow-center-y-offset);\n}\n\n:host([current-position=\"top\"])::before,\n:host([current-position=\"bottom\"])::before {\n right: var(--arrow-edge-offset);\n}\n\n:host([current-position=\"right\"])::before,\n:host([current-position=\"left\"])::before {\n bottom: var(--arrow-edge-offset);\n}\n\n:host([current-position=\"right\"])::before {\n right: var(--arrow-center-y-offset);\n}\n\n:host([current-position=\"left\"])::before {\n left: var(--arrow-center-y-offset);\n}\n\n:host([current-position=\"top_right\"])::before,\n:host([current-position=\"bottom_right\"])::before {\n right: var(--arrow-edge-offset);\n}\n\n:host([current-position=\"top_left\"])::before,\n:host([current-position=\"bottom_left\"])::before {\n left: var(--arrow-edge-offset);\n}\n\n:host([current-position=\"right_top\"])::before,\n:host([current-position=\"left_top\"])::before {\n top: var(--arrow-edge-offset);\n}\n\n:host([current-position=\"right_top\"])::before,\n:host([current-position=\"right_bottom\"])::before {\n right: var(--arrow-center-y-offset);\n}\n\n:host([current-position=\"left_top\"])::before,\n:host([current-position=\"left_bottom\"])::before {\n left: var(--arrow-center-y-offset);\n}\n\n:host([current-position=\"right_bottom\"])::before,\n:host([current-position=\"left_bottom\"])::before {\n bottom: var(--arrow-edge-offset);\n}\n\n:host([center][current-position=\"top\"])::before,\n:host([center][current-position=\"bottom\"])::before {\n right: auto;\n left: var(--arrow-center-x-offset);\n}\n\n:host([center][current-position=\"right\"])::before,\n:host([center][current-position=\"left\"])::before {\n top: var(--arrow-center-x-offset);\n bottom: auto;\n}\n","import {Component, Element, Event, EventEmitter, Host, Listen, Prop, State, Watch, h} from \"@stencil/core\";\nimport {Device, KeyboardCode, PopoverPosition} from \"../../beans\";\nimport {containsElement, findScrollableParent, getDevice, isElementVisibleInContainer} from \"../../utils/utils\";\n\n/** Centering offset modifier. 0 for no offset, 0.5 for centering. */\ntype OffsetModifier = 0 | 0.5;\ntype Offsets = {top: number; right: number; bottom: number; left: number};\n\n/**\n * Popover component.\n * This component displays a popover bound to an element.\n * It supports various positions and can automatically adjust it based on available space, accounting for scrollable containers.\n *\n * Notes:\n * - If positioning has an odd behavior, consider manually adjusting the size of the slotted elements (using `width`, `height`, `max-width`, `max-height`, etc...) when its content is \"fluid\" (like text), because it can interfere with the position calculation (for example a long text on one single line can be bigger than the available space, letting the algorithm think the popover doesn't fits).\n *\n * @cssprop --z-popover-theme--surface - background color of the popover.\n * @cssprop --z-popover-theme--text - foreground color of the popover.\n * @cssprop --z-popover-padding - padding of the popover.\n * @cssprop --z-popover-shadow-filter - drop-shadow filter of the popover. Defaults to `drop-shadow(0 1px 2px var(--shadow-color-base))`.\n */\n@Component({\n tag: \"z-popover\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZPopover {\n /**\n * The preferred position to render the popover.\n * The popover will automatically search another position if not enough space is available for the preferred position.\n * If the preferred position is not available, it will try to find the best position starting from `TOP` and going clockwise.\n */\n @Prop({reflect: true, mutable: true})\n position?: PopoverPosition = PopoverPosition.TOP;\n\n /** The open state of the popover. */\n @Prop({reflect: true, mutable: true})\n open = false;\n\n /**\n * The selector or the element bound with the popover.\n * If string css selector is provided make sure to use a valid selector.\n */\n @Prop()\n bindTo?: string | HTMLElement;\n\n /** Whether to show popover's arrow. */\n @Prop({reflect: true})\n showArrow = false;\n\n /** Whether to center the popup on the main side (according to \"position\"). */\n @Prop({reflect: true})\n center = false;\n\n /**\n * If true, the popover can be closed by clicking outside of it or pressing the escape key.\n * Otherwise, it will be closed only programmatically (by setting `open` to `false`).\n */\n @Prop()\n closable = true;\n\n /**\n * The current position of the popover.\n * It differs from `position` only when calculated automatically for space reasons.\n */\n @State()\n currentPosition?: PopoverPosition;\n\n @Element() host: HTMLZPopoverElement;\n\n // Clockwise order of positions.\n private static readonly positionOrder: PopoverPosition[] = [\n PopoverPosition.TOP,\n PopoverPosition.TOP_RIGHT,\n PopoverPosition.TOP_LEFT,\n PopoverPosition.RIGHT,\n PopoverPosition.RIGHT_BOTTOM,\n PopoverPosition.RIGHT_TOP,\n PopoverPosition.BOTTOM,\n PopoverPosition.BOTTOM_LEFT,\n PopoverPosition.BOTTOM_RIGHT,\n PopoverPosition.LEFT,\n PopoverPosition.LEFT_TOP,\n PopoverPosition.LEFT_BOTTOM,\n ] as const;\n\n private animationFrameRequestId?: number;\n\n /** space tolerance for space calculations */\n private readonly spaceTolerance = 3;\n\n /** The element bound to the popover. */\n private boundElement?: HTMLElement;\n\n /** Cached available space around the bound element to avoid unnecessary recalculations */\n private cachedAvailableSpace?: Offsets;\n\n /** Last bounding rect of the bound element to detect changes and eventually invalidate the caches. */\n private lastBoundRect?: DOMRect;\n\n /** Fired when the position changes. */\n @Event()\n positionChange: EventEmitter;\n\n /** Open change event. */\n @Event()\n openChange: EventEmitter;\n\n @Listen(\"keyup\", {target: \"window\"})\n closePopoverWithKeyboard(e: KeyboardEvent): void {\n if (this.closable && e.key === KeyboardCode.ESC) {\n this.open = false;\n }\n }\n\n /**\n * Close the popover when clicking outside of its content.\n * Stop event propagation if the click was fired by popover's trigger element,\n * to prevent close and reopen glitches.\n */\n @Listen(\"click\", {target: \"body\", capture: true})\n handleOutsideClick(e: MouseEvent): void {\n const target = e.target as Element;\n if (!this.closable || !this.open || containsElement(this.host, target)) {\n return;\n }\n\n if (containsElement(this.boundElement, target)) {\n // stop propagation if the click was on the trigger element to prevent close and reopen glitches\n e.stopPropagation();\n }\n this.open = false;\n }\n\n @Watch(\"position\")\n validatePosition(newValue: PopoverPosition): void {\n if (!Object.values(PopoverPosition).includes(newValue as PopoverPosition) || newValue === PopoverPosition.AUTO) {\n newValue = PopoverPosition.TOP;\n this.position = newValue;\n }\n this.currentPosition = newValue;\n if (this.open) {\n this.setPosition();\n }\n }\n\n /** Setup popover behaviors when `open` changes. */\n @Watch(\"open\")\n onOpen(): void {\n cancelAnimationFrame(this.animationFrameRequestId);\n this.openChange.emit({open: this.open});\n if (!this.open) {\n return;\n }\n\n const updatePositionLoop = (): void => {\n if (!this.open) {\n return;\n }\n\n this.setPosition();\n this.animationFrameRequestId = requestAnimationFrame(updatePositionLoop);\n };\n\n // call `setPosition` after a tick to ensure the DOM is ready and sizes are available\n setTimeout(() => {\n updatePositionLoop();\n }, 0);\n }\n\n @Watch(\"bindTo\")\n onBindingChange(): void {\n this.findBoundElement();\n }\n\n /** Returns the offset modifier to use in calculations to align the popover with the bound element. */\n private get offsetModifier(): OffsetModifier {\n return this.center ? 0.5 : 0;\n }\n\n private findBoundElement(): void {\n if (typeof this.bindTo === \"string\") {\n this.boundElement = this.host.ownerDocument.querySelector(this.bindTo) as HTMLElement;\n } else if (this.bindTo) {\n this.boundElement = this.bindTo;\n } else {\n this.boundElement = this.host.parentElement as HTMLElement;\n }\n }\n\n /**\n * Check if element has enough space to the right and left to be centered.\n * Used for `TOP` and `BOTTOM` position.\n * When `center` is not enabled, only one side needs to be checked and `RIGHT` is the default.\n */\n private hasCenteredHorizontalSpace(\n availableLeft: number,\n availableRight: number,\n hostWidth: number,\n boundElementWidth: number\n ): boolean {\n const requiredSideSpace = (hostWidth - boundElementWidth) * (1 - this.offsetModifier);\n\n if (!this.center) {\n return availableRight >= requiredSideSpace - this.spaceTolerance;\n }\n\n return (\n availableRight >= requiredSideSpace - this.spaceTolerance &&\n availableLeft >= requiredSideSpace - this.spaceTolerance\n );\n }\n\n /**\n * Check if element has enough space to the top and bottom to be centered.\n * Used for `RIGHT` and `LEFT` position.\n * When `center` is not enabled, only one side needs to be checked and `BOTTOM` is the default.\n */\n private hasCenteredVerticalSpace(\n availableTop: number,\n availableBottom: number,\n hostHeight: number,\n boundElementHeight: number\n ): boolean {\n const requiredSideSpace = (hostHeight - boundElementHeight) * (1 - this.offsetModifier);\n\n if (!this.center) {\n return availableBottom >= requiredSideSpace - this.spaceTolerance;\n }\n\n return (\n availableTop >= requiredSideSpace - this.spaceTolerance &&\n availableBottom >= requiredSideSpace - this.spaceTolerance\n );\n }\n\n /**\n * Check if there is enough space in the given direction to fit the popover.\n * Used for composed positions like TOP_RIGHT, LEFT_BOTTOM, etc.\n */\n private hasEnoughSideSpace(\n availableSpace: number,\n hostSize: number,\n boundElementSize: number,\n offsetModifier: OffsetModifier\n ): boolean {\n return availableSpace >= hostSize - boundElementSize * (1 - offsetModifier) - this.spaceTolerance;\n }\n\n /**\n * Given a desired position and available space around the bound element, returns the best position\n * that fits the popover, trying all positions if needed.\n * Takes into account offsetModifier for centering.\n * @param desiredPosition The desired position of the popover.\n * @param availableSpace The available space around the bound element.\n */\n private getOptimalPopoverPosition(desiredPosition: PopoverPosition, availableSpace: Offsets): PopoverPosition {\n const hostWidth = this.host.offsetWidth;\n const hostHeight = this.host.offsetHeight;\n const boundElementWidth = this.boundElement.getBoundingClientRect().width;\n const boundElementHeight = this.boundElement.getBoundingClientRect().height;\n const offsetModifier = this.offsetModifier;\n\n /** Check if there is enough space to fit the popover in the desired position */\n const fits = (pos: PopoverPosition): boolean => {\n switch (pos) {\n case PopoverPosition.TOP:\n return (\n availableSpace.top >= hostHeight - this.spaceTolerance &&\n this.hasCenteredHorizontalSpace(availableSpace.left, availableSpace.right, hostWidth, boundElementWidth)\n );\n case PopoverPosition.TOP_RIGHT:\n return (\n availableSpace.top >= hostHeight &&\n this.hasEnoughSideSpace(availableSpace.right, hostWidth, boundElementWidth, offsetModifier)\n );\n case PopoverPosition.TOP_LEFT:\n return (\n availableSpace.top >= hostHeight &&\n this.hasEnoughSideSpace(availableSpace.left, hostWidth, boundElementWidth, offsetModifier)\n );\n case PopoverPosition.RIGHT:\n return (\n availableSpace.right >= hostWidth &&\n this.hasCenteredVerticalSpace(availableSpace.top, availableSpace.bottom, hostHeight, boundElementHeight)\n );\n case PopoverPosition.RIGHT_BOTTOM:\n return (\n availableSpace.right >= hostWidth &&\n this.hasEnoughSideSpace(availableSpace.bottom, hostHeight, boundElementHeight, offsetModifier)\n );\n case PopoverPosition.RIGHT_TOP:\n return (\n availableSpace.right >= hostWidth &&\n this.hasEnoughSideSpace(availableSpace.top, hostHeight, boundElementHeight, offsetModifier)\n );\n case PopoverPosition.BOTTOM:\n return (\n availableSpace.bottom >= hostHeight &&\n this.hasCenteredHorizontalSpace(availableSpace.left, availableSpace.right, hostWidth, boundElementWidth)\n );\n case PopoverPosition.BOTTOM_LEFT:\n return (\n availableSpace.bottom >= hostHeight &&\n this.hasEnoughSideSpace(availableSpace.left, hostWidth, boundElementWidth, offsetModifier)\n );\n case PopoverPosition.BOTTOM_RIGHT:\n return (\n availableSpace.bottom >= hostHeight &&\n this.hasEnoughSideSpace(availableSpace.right, hostWidth, boundElementWidth, offsetModifier)\n );\n case PopoverPosition.LEFT:\n return (\n availableSpace.left >= hostWidth &&\n this.hasCenteredVerticalSpace(availableSpace.top, availableSpace.bottom, hostHeight, boundElementHeight)\n );\n case PopoverPosition.LEFT_TOP:\n return (\n availableSpace.left >= hostWidth &&\n this.hasEnoughSideSpace(availableSpace.top, hostHeight, boundElementHeight, offsetModifier)\n );\n case PopoverPosition.LEFT_BOTTOM:\n return (\n availableSpace.left >= hostWidth &&\n this.hasEnoughSideSpace(availableSpace.bottom, hostHeight, boundElementHeight, offsetModifier)\n );\n\n default:\n return false;\n }\n };\n\n // Check desired position first\n if (fits(desiredPosition)) {\n return desiredPosition;\n }\n\n // Find position index and create rotation starting from next position\n const positions = ZPopover.positionOrder;\n const startIndex = positions.indexOf(desiredPosition);\n\n if (startIndex === -1) {\n return desiredPosition; // fallback if position not found\n }\n\n // Try all other positions starting from the next one\n for (let i = 1; i < positions.length; i++) {\n const posIndex = (startIndex + i) % positions.length;\n const pos = positions[posIndex];\n if (fits(pos)) {\n return pos;\n }\n }\n\n // If no position fits, find the best fallback based on available space\n return this.findBestFallbackPosition(availableSpace);\n }\n\n /** Find the best fallback position based on available space when no position fits perfectly. */\n private findBestFallbackPosition(availableSpace: Offsets): PopoverPosition {\n // Determine which horizontal and vertical direction has the most available space\n const bestHorizontalDirection =\n availableSpace.right >= availableSpace.left ? PopoverPosition.RIGHT : PopoverPosition.LEFT;\n\n const bestVerticalDirection =\n availableSpace.bottom >= availableSpace.top ? PopoverPosition.BOTTOM : PopoverPosition.TOP;\n\n // Choose the main direction based on which axis has more space overall\n const maxHorizontalSpace = Math.max(availableSpace.right, availableSpace.left);\n const maxVerticalSpace = Math.max(availableSpace.bottom, availableSpace.top);\n\n const mainDirection = maxVerticalSpace >= maxHorizontalSpace ? bestVerticalDirection : bestHorizontalDirection;\n\n // Decide if a secondary direction is needed\n // Only add a secondary direction if the difference between min and max in that axis is at least double\n let needsSecondaryDirection = false;\n\n if (mainDirection === bestVerticalDirection) {\n // If main direction is vertical, check horizontal space difference\n const minHorizontalSpace = Math.min(availableSpace.right, availableSpace.left);\n needsSecondaryDirection = maxHorizontalSpace >= minHorizontalSpace * 2;\n } else {\n // If main direction is horizontal, check vertical space difference\n const minVerticalSpace = Math.min(availableSpace.bottom, availableSpace.top);\n needsSecondaryDirection = maxVerticalSpace >= minVerticalSpace * 2;\n }\n\n if (!needsSecondaryDirection) {\n return mainDirection;\n }\n\n const secondaryDirection =\n mainDirection === bestVerticalDirection ? bestHorizontalDirection : bestVerticalDirection;\n\n // Return a combined position (e.g., \"bottom_right\")\n return `${mainDirection}_${secondaryDirection}` as PopoverPosition;\n }\n\n /**\n * Calculate available space around the element bound with the popover, based on its nearest scrollable ancestor.\n *\n * Calculations for `right` and `bottom` can be a little bit confusing because `boundingRect.right` and `bottom` may not be what you expect...\n * For more information see the explanation in the docs.\n * @link https://developer.mozilla.org/en-US/docs/Web/API/Element/getBoundingClientRect#return_value\n */\n private calculateAvailableSpace(): Offsets {\n const boundElementRect = this.boundElement.getBoundingClientRect();\n\n if (\n this.lastBoundRect &&\n this.lastBoundRect.x === boundElementRect.x &&\n this.lastBoundRect.y === boundElementRect.y &&\n this.lastBoundRect.width === boundElementRect.width &&\n this.lastBoundRect.height === boundElementRect.height &&\n this.cachedAvailableSpace\n ) {\n // If the bound element's rect hasn't changed, return the cached rect\n return this.cachedAvailableSpace;\n }\n\n this.lastBoundRect = boundElementRect;\n const scrollableParent = findScrollableParent(this.boundElement);\n const scrollableParentRect = scrollableParent.getBoundingClientRect();\n const hasNestedScrollableParent = scrollableParent !== this.boundElement.ownerDocument.documentElement;\n const documentWidth = this.boundElement.ownerDocument.documentElement.clientWidth;\n const documentHeight = this.boundElement.ownerDocument.documentElement.clientHeight;\n const safeSpace = 8; // extra space to avoid popover being too close to the edges\n\n // These deltas represent the offset between the scrollable parent and the viewport.\n // They are used to adjust the available space calculations when the scrollable parent is not the document or body,\n // to try to fit the popover inside the scrollable parent.\n const deltaTop = hasNestedScrollableParent ? scrollableParentRect.top : 0;\n const deltaRight = hasNestedScrollableParent ? documentWidth - scrollableParentRect.right : 0;\n const deltaBottom = hasNestedScrollableParent ? documentHeight - scrollableParentRect.bottom : 0;\n const deltaLeft = hasNestedScrollableParent ? scrollableParentRect.left : 0;\n\n this.cachedAvailableSpace = {\n top: boundElementRect.top - deltaTop - safeSpace,\n right: documentWidth - boundElementRect.right - deltaRight - safeSpace,\n bottom: documentHeight - boundElementRect.bottom - deltaBottom - safeSpace,\n left: boundElementRect.left - deltaLeft - safeSpace,\n };\n\n return this.cachedAvailableSpace;\n }\n\n /** Calculate the space around an element relative to the viewport. */\n private calculateElementOffsets(element: HTMLElement): Offsets {\n const elementRect = element.getBoundingClientRect();\n const viewportWidth = element.ownerDocument.documentElement.clientWidth;\n const viewportHeight = element.ownerDocument.documentElement.clientHeight;\n\n return {\n top: elementRect.top,\n right: viewportWidth - elementRect.right,\n bottom: viewportHeight - elementRect.bottom,\n left: elementRect.left,\n };\n }\n\n /** Apply positioning styles based on passed position. */\n private applyPositionStyles(position: PopoverPosition, availableSpace: Offsets): void {\n const boundElementWidth = this.boundElement.offsetWidth;\n const boundElementHeight = this.boundElement.offsetHeight;\n /** Distance between the popover and the bound element */\n const distanceFromBound = 8;\n const offsetModifier = this.offsetModifier;\n /** Distance between the arrow center and the popover edge. Needed to align the center of the arrow with the center of the bound element when `showArrow` and `center` are enabled. */\n const arrowModifier = this.showArrow && this.center ? 8 : 0;\n const hostStyle = this.host.style;\n const boundElementOffsets = this.calculateElementOffsets(this.boundElement);\n\n let maxWidth: number;\n let maxHeight: number;\n\n switch (position) {\n case PopoverPosition.TOP:\n case PopoverPosition.TOP_RIGHT:\n hostStyle.bottom = `${boundElementOffsets.bottom + boundElementHeight}px`;\n hostStyle.left = `${boundElementOffsets.left + boundElementWidth * offsetModifier - (position === PopoverPosition.TOP_RIGHT ? arrowModifier : 0)}px`;\n maxHeight = availableSpace.top - distanceFromBound;\n if (position === PopoverPosition.TOP_RIGHT) {\n maxWidth = availableSpace.right + boundElementWidth * offsetModifier;\n }\n break;\n\n case PopoverPosition.TOP_LEFT:\n hostStyle.right = `${boundElementOffsets.right + boundElementWidth * offsetModifier - arrowModifier}px`;\n hostStyle.bottom = `${boundElementOffsets.bottom + boundElementHeight}px`;\n maxWidth = availableSpace.left + boundElementWidth * offsetModifier;\n maxHeight = availableSpace.top - distanceFromBound;\n break;\n\n case PopoverPosition.BOTTOM:\n case PopoverPosition.BOTTOM_RIGHT:\n hostStyle.top = `${boundElementOffsets.top + boundElementHeight}px`;\n hostStyle.left = `${boundElementOffsets.left + boundElementWidth * offsetModifier - (position === PopoverPosition.BOTTOM_RIGHT ? arrowModifier : 0)}px`;\n maxHeight = availableSpace.bottom - distanceFromBound;\n if (position === PopoverPosition.BOTTOM_RIGHT) {\n maxWidth = availableSpace.right + boundElementWidth * offsetModifier;\n }\n break;\n\n case PopoverPosition.BOTTOM_LEFT:\n hostStyle.top = `${boundElementOffsets.top + boundElementHeight}px`;\n hostStyle.right = `${boundElementOffsets.right + boundElementWidth * offsetModifier - arrowModifier}px`;\n maxWidth = availableSpace.left + boundElementWidth * offsetModifier;\n maxHeight = availableSpace.bottom - distanceFromBound;\n break;\n\n case PopoverPosition.RIGHT:\n case PopoverPosition.RIGHT_BOTTOM:\n hostStyle.top = `${boundElementOffsets.top + boundElementHeight * offsetModifier - (position === PopoverPosition.RIGHT_BOTTOM ? arrowModifier : 0)}px`;\n hostStyle.left = `${boundElementOffsets.left + boundElementWidth}px`;\n maxWidth = availableSpace.right - distanceFromBound;\n if (position === PopoverPosition.RIGHT) {\n maxHeight = availableSpace.top + availableSpace.bottom + boundElementHeight;\n } else {\n maxHeight = availableSpace.bottom + boundElementHeight * offsetModifier;\n }\n break;\n\n case PopoverPosition.RIGHT_TOP:\n hostStyle.bottom = `${boundElementOffsets.bottom + boundElementHeight * offsetModifier - arrowModifier}px`;\n hostStyle.left = `${boundElementOffsets.left + boundElementWidth}px`;\n maxWidth = availableSpace.right - distanceFromBound;\n maxHeight = availableSpace.top + boundElementHeight * offsetModifier;\n break;\n\n case PopoverPosition.LEFT:\n case PopoverPosition.LEFT_BOTTOM:\n hostStyle.top = `${boundElementOffsets.top + boundElementHeight * offsetModifier - (position === PopoverPosition.LEFT_BOTTOM ? arrowModifier : 0)}px`;\n hostStyle.right = `${boundElementOffsets.right + boundElementWidth}px`;\n maxWidth = availableSpace.left - distanceFromBound;\n if (position === PopoverPosition.LEFT_BOTTOM) {\n maxHeight = availableSpace.bottom + boundElementHeight * offsetModifier;\n }\n break;\n\n case PopoverPosition.LEFT_TOP:\n hostStyle.right = `${boundElementOffsets.right + boundElementWidth}px`;\n hostStyle.bottom = `${boundElementOffsets.bottom + boundElementHeight * offsetModifier - arrowModifier}px`;\n maxWidth = availableSpace.left - distanceFromBound;\n maxHeight = availableSpace.top + boundElementHeight * offsetModifier;\n break;\n }\n\n if (getDevice() !== Device.MOBILE) {\n // Only force max sizes on non-mobile viewports\n hostStyle.maxWidth = maxWidth ? `${maxWidth}px` : \"\";\n hostStyle.maxHeight = maxHeight ? `${maxHeight}px` : \"\";\n }\n }\n\n /** Set the position of the popover. */\n private setPosition(): void {\n if (!this.boundElement) {\n return;\n }\n\n if (!isElementVisibleInContainer(this.boundElement, findScrollableParent(this.boundElement))) {\n // If the bound element is not visible, hide the popover too\n this.open = false;\n\n return;\n }\n\n Object.assign(this.host.style, {\n // Reset all positioning properties\n top: \"auto\",\n right: \"auto\",\n bottom: \"auto\",\n left: \"auto\",\n maxWidth: \"\",\n maxHeight: \"\",\n // Set initial visibility to hidden while calculating position...\n visibility: \"hidden\",\n });\n\n const availableSpace = this.calculateAvailableSpace();\n const position = this.getOptimalPopoverPosition(this.position, availableSpace);\n\n this.applyPositionStyles(position, availableSpace);\n this.currentPosition = position;\n this.positionChange.emit({position: this.currentPosition});\n\n // ...then restore the visibility\n this.host.style.visibility = \"visible\";\n }\n\n componentWillLoad(): void {\n this.validatePosition(this.position);\n }\n\n componentDidLoad(): void {\n this.findBoundElement();\n if (this.open) {\n this.onOpen();\n }\n }\n\n disconnectedCallback(): void {\n cancelAnimationFrame(this.animationFrameRequestId);\n }\n\n render(): HTMLZPopoverElement {\n return (\n <Host current-position={this.currentPosition}>\n <slot></slot>\n </Host>\n );\n }\n}\n"],"version":3}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
|
|
2
2
|
import { e as ControlSize, B as ButtonVariant, p as Device, l as ListDividerType, g as KeyboardCode } from './index2.js';
|
|
3
|
-
import { r as randomId, g as getDevice,
|
|
3
|
+
import { r as randomId, g as getDevice, k as handleEnterKeydSubmit } from './utils.js';
|
|
4
4
|
import { d as defineCustomElement$9 } from './index4.js';
|
|
5
5
|
import { d as defineCustomElement$8 } from './index6.js';
|
|
6
6
|
import { d as defineCustomElement$7 } from './index9.js';
|
package/dist/components/utils.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { p as Device, g as KeyboardCode } from './index2.js';
|
|
2
2
|
import { B as Breakpoints } from './breakpoints.js';
|
|
3
3
|
|
|
4
4
|
/**
|
|
@@ -109,7 +109,60 @@ function containsElement(ancestor, descendant) {
|
|
|
109
109
|
var _a;
|
|
110
110
|
return ancestor.contains(descendant) || !!((_a = ancestor.shadowRoot) === null || _a === void 0 ? void 0 : _a.contains(descendant));
|
|
111
111
|
}
|
|
112
|
+
/** Get the parent of passed element, accounting for shadow DOM.
|
|
113
|
+
* @param element The element whose parent is to be found.
|
|
114
|
+
*/
|
|
115
|
+
function getParentElement(element) {
|
|
116
|
+
if (element.parentNode === element.shadowRoot) {
|
|
117
|
+
return element.shadowRoot.host;
|
|
118
|
+
}
|
|
119
|
+
return element.parentElement;
|
|
120
|
+
}
|
|
121
|
+
/**
|
|
122
|
+
* Find the nearest ancestor of an element to take as a reference for positioning.
|
|
123
|
+
* The chosen ancestor is the first to have an overflow set to hidden or is scrollable.
|
|
124
|
+
* Falls back to the `offsetParent` of the element (the closest positioned ancestor, for example the one with `position: relative`).
|
|
125
|
+
* @link https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/offsetParent
|
|
126
|
+
*/
|
|
127
|
+
function findScrollableParent(element) {
|
|
128
|
+
let parent = getParentElement(element);
|
|
129
|
+
while (parent && parent !== element.ownerDocument.documentElement) {
|
|
130
|
+
const style = window.getComputedStyle(parent);
|
|
131
|
+
const { overflow, overflowX, overflowY } = style;
|
|
132
|
+
const hasHiddenOverflow = overflow === "hidden" || overflowY === "hidden" || overflowX === "hidden";
|
|
133
|
+
const isScrollable = (parent.scrollHeight > parent.clientHeight && overflow !== "visible" && overflowY !== "visible") ||
|
|
134
|
+
(parent.scrollWidth > parent.clientWidth && overflow !== "visible" && overflowX !== "visible");
|
|
135
|
+
if (!hasHiddenOverflow && isScrollable) {
|
|
136
|
+
return parent;
|
|
137
|
+
}
|
|
138
|
+
parent = getParentElement(parent);
|
|
139
|
+
}
|
|
140
|
+
return element.ownerDocument.documentElement;
|
|
141
|
+
}
|
|
142
|
+
/**
|
|
143
|
+
* Check if the element is visible within the container or in the viewport.
|
|
144
|
+
* @param element The element to check.
|
|
145
|
+
* @param container The container to check against, which must be the nearest scrollable ancestor.
|
|
146
|
+
*/
|
|
147
|
+
function isElementVisibleInContainer(element, container) {
|
|
148
|
+
const elemRect = element.getBoundingClientRect();
|
|
149
|
+
const documentWidth = element.ownerDocument.documentElement.clientWidth;
|
|
150
|
+
const documentHeight = element.ownerDocument.documentElement.clientHeight;
|
|
151
|
+
// Check if element is visible in viewport
|
|
152
|
+
const isVisibleInViewport = elemRect.bottom > 0 && elemRect.top < documentHeight && elemRect.right > 0 && elemRect.left < documentWidth;
|
|
153
|
+
// If container is the document element, only check viewport visibility
|
|
154
|
+
if (container === element.ownerDocument.documentElement || container === element.ownerDocument.body) {
|
|
155
|
+
return isVisibleInViewport;
|
|
156
|
+
}
|
|
157
|
+
// For other containers, check both container and viewport visibility
|
|
158
|
+
const containerRect = container.getBoundingClientRect();
|
|
159
|
+
const isVisibleInContainer = elemRect.bottom > containerRect.top &&
|
|
160
|
+
elemRect.top < containerRect.bottom &&
|
|
161
|
+
elemRect.right > containerRect.left &&
|
|
162
|
+
elemRect.left < containerRect.right;
|
|
163
|
+
return isVisibleInContainer && isVisibleInViewport;
|
|
164
|
+
}
|
|
112
165
|
|
|
113
|
-
export { containsElement as a, boolean as b, colorFromId as c, getElementTree as d, getClickedElement as e, convertJson as f, getDevice as g, handleKeyboardSubmit as h,
|
|
166
|
+
export { containsElement as a, boolean as b, colorFromId as c, getElementTree as d, getClickedElement as e, convertJson as f, getDevice as g, handleKeyboardSubmit as h, findScrollableParent as i, isElementVisibleInContainer as j, handleEnterKeydSubmit as k, randomId as r };
|
|
114
167
|
|
|
115
168
|
//# sourceMappingURL=utils.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"utils.js","mappings":"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","names":[],"sources":["src/utils/utils.ts"],"sourcesContent":["import {ChildNode} from \"@stencil/core\";\nimport {Device, KeyboardCode} from \"../beans/index\";\nimport {Breakpoints} from \"../constants/breakpoints\";\n\n/**\n * Return boolean value for passed value if a boolean corresponding value is found\n * Return passed value otherwise\n */\nexport function boolean(value: string | number | boolean): boolean | string | number {\n switch (value) {\n case true:\n case \"true\":\n case 1:\n case \"1\":\n case \"on\":\n case \"yes\":\n return true;\n case false:\n case \"false\":\n case 0:\n case \"0\":\n case \"off\":\n case \"no\":\n return false;\n default:\n return value;\n }\n}\n\nexport function retrieveAsset(assetName: string): string {\n return assetName && \"assets/images/png/\" + assetName;\n}\n\nexport function randomId(): string {\n return Math.random().toString(36).replace(\"0.\", \"\");\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport function handleKeyboardSubmit(ev: KeyboardEvent, callback: (...args) => void, ...args: any[]): void {\n if (ev.code === KeyboardCode.ENTER || ev.code === KeyboardCode.SPACE) {\n ev.preventDefault();\n callback(...args);\n }\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport function handleEnterKeydSubmit(ev: KeyboardEvent, callback: (...args) => void, ...args: any[]): void {\n if (ev.code === KeyboardCode.ENTER) {\n ev.preventDefault();\n callback(...args);\n }\n}\n\nexport function getClickedElement(elem: null | Element = null): null | Element {\n if (!elem) {\n elem = document.activeElement;\n }\n\n if (elem && elem.shadowRoot && elem.shadowRoot.activeElement) {\n elem = elem.shadowRoot.activeElement;\n\n return getClickedElement(elem);\n }\n\n return elem;\n}\n\nexport function getElementTree(elem: Element, tree: Element[] = []): null | Element[] {\n tree.push(elem);\n\n if (elem.parentElement) {\n elem = elem.parentElement;\n\n return getElementTree(elem, tree);\n } else if (elem.parentNode && (elem.parentNode as ShadowRoot).host) {\n elem = (elem.parentNode as ShadowRoot).host;\n\n return getElementTree(elem, tree);\n }\n\n return tree;\n}\n\nexport function getSiblings(elem: HTMLElement): ChildNode[] {\n const siblings = [];\n if (!elem || !elem.parentNode || !elem.parentNode.childNodes) {\n return siblings;\n }\n\n elem.parentNode.childNodes.forEach((child) => {\n if (child.nodeType === 1 && child !== elem) {\n siblings.push(child);\n }\n });\n\n return siblings;\n}\n\n/**\n * Get the current device type based on the window width.\n * @returns {Device} - The current device type\n */\nexport function getDevice(): Device {\n switch (true) {\n case window.innerWidth <= Breakpoints.MOBILE:\n return Device.MOBILE;\n case window.innerWidth <= Breakpoints.TABLET:\n return Device.TABLET;\n case window.innerWidth <= Breakpoints.DESKTOP:\n return Device.DESKTOP;\n default:\n return Device.DESKTOP_WIDE;\n }\n}\n\ntype JSONValue = string | number | boolean | JSONObject | JSONArray;\ninterface JSONObject {\n [x: string]: JSONValue;\n}\ntype JSONArray = JSONValue[];\n\nexport function convertJson(data: string): JSONValue {\n try {\n return JSON.parse(data);\n } catch {\n return false;\n }\n}\n\nexport function colorFromId(id: number): string {\n const prefix = \"avatar-C\"; // prefix for color vars name\n const colorsCount = 19; // available colors\n const seed = Math.ceil(2 ** 31 - 1) * parseFloat(`0.${id}`);\n let color = Math.ceil(colorsCount * (seed % 1));\n\n // if result of mc is 0\n // es.: 3895229\n if (color === 0) {\n color = 1;\n }\n\n return `${prefix}${color.toString().padStart(2, \"0\")}`;\n}\n\n/**\n * Check if the passed CSS selector is valid.\n * @param selector CSS selector to validate\n */\nexport function isSelectorValid(selector: string): boolean {\n try {\n document.createDocumentFragment().querySelector(selector);\n\n return true;\n } catch {\n return false;\n }\n}\n\n/**\n * Check if an element contains another element, checking both light and shadow DOM.\n * @param ancestor Ancestor element\n * @param descendant Descendant element\n */\nexport function containsElement(ancestor: HTMLElement, descendant: Node): boolean {\n return ancestor.contains(descendant) || !!ancestor.shadowRoot?.contains(descendant);\n}\n"],"version":3}
|
|
1
|
+
{"file":"utils.js","mappings":"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","names":[],"sources":["src/utils/utils.ts"],"sourcesContent":["import {ChildNode} from \"@stencil/core\";\nimport {Device, KeyboardCode} from \"../beans/index\";\nimport {Breakpoints} from \"../constants/breakpoints\";\n\n/**\n * Return boolean value for passed value if a boolean corresponding value is found\n * Return passed value otherwise\n */\nexport function boolean(value: string | number | boolean): boolean | string | number {\n switch (value) {\n case true:\n case \"true\":\n case 1:\n case \"1\":\n case \"on\":\n case \"yes\":\n return true;\n case false:\n case \"false\":\n case 0:\n case \"0\":\n case \"off\":\n case \"no\":\n return false;\n default:\n return value;\n }\n}\n\nexport function retrieveAsset(assetName: string): string {\n return assetName && \"assets/images/png/\" + assetName;\n}\n\nexport function randomId(): string {\n return Math.random().toString(36).replace(\"0.\", \"\");\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport function handleKeyboardSubmit(ev: KeyboardEvent, callback: (...args) => void, ...args: any[]): void {\n if (ev.code === KeyboardCode.ENTER || ev.code === KeyboardCode.SPACE) {\n ev.preventDefault();\n callback(...args);\n }\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport function handleEnterKeydSubmit(ev: KeyboardEvent, callback: (...args) => void, ...args: any[]): void {\n if (ev.code === KeyboardCode.ENTER) {\n ev.preventDefault();\n callback(...args);\n }\n}\n\nexport function getClickedElement(elem: null | Element = null): null | Element {\n if (!elem) {\n elem = document.activeElement;\n }\n\n if (elem && elem.shadowRoot && elem.shadowRoot.activeElement) {\n elem = elem.shadowRoot.activeElement;\n\n return getClickedElement(elem);\n }\n\n return elem;\n}\n\nexport function getElementTree(elem: Element, tree: Element[] = []): null | Element[] {\n tree.push(elem);\n\n if (elem.parentElement) {\n elem = elem.parentElement;\n\n return getElementTree(elem, tree);\n } else if (elem.parentNode && (elem.parentNode as ShadowRoot).host) {\n elem = (elem.parentNode as ShadowRoot).host;\n\n return getElementTree(elem, tree);\n }\n\n return tree;\n}\n\nexport function getSiblings(elem: HTMLElement): ChildNode[] {\n const siblings = [];\n if (!elem || !elem.parentNode || !elem.parentNode.childNodes) {\n return siblings;\n }\n\n elem.parentNode.childNodes.forEach((child) => {\n if (child.nodeType === 1 && child !== elem) {\n siblings.push(child);\n }\n });\n\n return siblings;\n}\n\n/**\n * Get the current device type based on the window width.\n * @returns {Device} - The current device type\n */\nexport function getDevice(): Device {\n switch (true) {\n case window.innerWidth <= Breakpoints.MOBILE:\n return Device.MOBILE;\n case window.innerWidth <= Breakpoints.TABLET:\n return Device.TABLET;\n case window.innerWidth <= Breakpoints.DESKTOP:\n return Device.DESKTOP;\n default:\n return Device.DESKTOP_WIDE;\n }\n}\n\ntype JSONValue = string | number | boolean | JSONObject | JSONArray;\ninterface JSONObject {\n [x: string]: JSONValue;\n}\ntype JSONArray = JSONValue[];\n\nexport function convertJson(data: string): JSONValue {\n try {\n return JSON.parse(data);\n } catch {\n return false;\n }\n}\n\nexport function colorFromId(id: number): string {\n const prefix = \"avatar-C\"; // prefix for color vars name\n const colorsCount = 19; // available colors\n const seed = Math.ceil(2 ** 31 - 1) * parseFloat(`0.${id}`);\n let color = Math.ceil(colorsCount * (seed % 1));\n\n // if result of mc is 0\n // es.: 3895229\n if (color === 0) {\n color = 1;\n }\n\n return `${prefix}${color.toString().padStart(2, \"0\")}`;\n}\n\n/**\n * Check if the passed CSS selector is valid.\n * @param selector CSS selector to validate\n */\nexport function isSelectorValid(selector: string): boolean {\n try {\n document.createDocumentFragment().querySelector(selector);\n\n return true;\n } catch {\n return false;\n }\n}\n\n/**\n * Check if an element contains another element, checking both light and shadow DOM.\n * @param ancestor Ancestor element\n * @param descendant Descendant element\n */\nexport function containsElement(ancestor: HTMLElement, descendant: Node): boolean {\n return ancestor.contains(descendant) || !!ancestor.shadowRoot?.contains(descendant);\n}\n\n/** Get the parent of passed element, accounting for shadow DOM.\n * @param element The element whose parent is to be found.\n */\nexport function getParentElement(element: Element): Element {\n if (element.parentNode === element.shadowRoot) {\n return element.shadowRoot.host;\n }\n\n return element.parentElement;\n}\n\n/**\n * Find the nearest ancestor of an element to take as a reference for positioning.\n * The chosen ancestor is the first to have an overflow set to hidden or is scrollable.\n * Falls back to the `offsetParent` of the element (the closest positioned ancestor, for example the one with `position: relative`).\n * @link https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/offsetParent\n */\nexport function findScrollableParent(element: HTMLElement): HTMLElement {\n let parent = getParentElement(element);\n\n while (parent && parent !== element.ownerDocument.documentElement) {\n const style = window.getComputedStyle(parent);\n const {overflow, overflowX, overflowY} = style;\n const hasHiddenOverflow = overflow === \"hidden\" || overflowY === \"hidden\" || overflowX === \"hidden\";\n const isScrollable =\n (parent.scrollHeight > parent.clientHeight && overflow !== \"visible\" && overflowY !== \"visible\") ||\n (parent.scrollWidth > parent.clientWidth && overflow !== \"visible\" && overflowX !== \"visible\");\n\n if (!hasHiddenOverflow && isScrollable) {\n return parent as HTMLElement;\n }\n\n parent = getParentElement(parent);\n }\n\n return element.ownerDocument.documentElement;\n}\n\n/**\n * Check if the element is visible within the container or in the viewport.\n * @param element The element to check.\n * @param container The container to check against, which must be the nearest scrollable ancestor.\n */\nexport function isElementVisibleInContainer(element: HTMLElement, container: HTMLElement): boolean {\n const elemRect = element.getBoundingClientRect();\n const documentWidth = element.ownerDocument.documentElement.clientWidth;\n const documentHeight = element.ownerDocument.documentElement.clientHeight;\n\n // Check if element is visible in viewport\n const isVisibleInViewport =\n elemRect.bottom > 0 && elemRect.top < documentHeight && elemRect.right > 0 && elemRect.left < documentWidth;\n\n // If container is the document element, only check viewport visibility\n if (container === element.ownerDocument.documentElement || container === element.ownerDocument.body) {\n return isVisibleInViewport;\n }\n\n // For other containers, check both container and viewport visibility\n const containerRect = container.getBoundingClientRect();\n const isVisibleInContainer =\n elemRect.bottom > containerRect.top &&\n elemRect.top < containerRect.bottom &&\n elemRect.right > containerRect.left &&\n elemRect.left < containerRect.right;\n\n return isVisibleInContainer && isVisibleInViewport;\n}\n"],"version":3}
|
|
@@ -44,7 +44,7 @@ const ZAnchorNavigation$1 = /*@__PURE__*/ proxyCustomElement(class ZAnchorNaviga
|
|
|
44
44
|
window.removeEventListener("hashchange", this.setCurrent);
|
|
45
45
|
}
|
|
46
46
|
render() {
|
|
47
|
-
return (h(Host, { key: '
|
|
47
|
+
return (h(Host, { key: '91fa327dc685a23f2f645feb80957eab8ce2a486', collapsed: this.collapsed, class: "z-scrollbar" }, h("z-button", { key: '3455aa67a11adaa0cb0f8571997a0a118ded5635', class: "toggle", size: ControlSize.SMALL, variant: ButtonVariant.SECONDARY, icon: this.collapsed ? "chevron-up" : "chevron-down", onClick: this.toggleCollapsed.bind(this) }, this.collapsedLabel), h("nav", { key: '3e7ee00cbb6b5c3e353738c68d41c0392ce41ec0', ref: (el) => (this.nav = el) }, h("slot", { key: '35b61d7535025bd4daa6981bfbac5d249bfc59eb' }))));
|
|
48
48
|
}
|
|
49
49
|
get host() { return this; }
|
|
50
50
|
static get style() { return ZAnchorNavigationStyle0; }
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"z-anchor-navigation.js","mappings":";;;;;AAAA,MAAM,SAAS,GAAG,kzEAAkzE,CAAC;AACr0E,gCAAe,SAAS;;MCsBXA,mBAAiB;;;;8BAMX,KAAK;2BASR,IAAI;8BAMD,SAAS;2BAOZ,KAAK;yBAMP,KAAK;;;;;IAUT,UAAU;QAChB,MAAM,cAAc,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,CACpE,CAAC,MAAM,KAAK,MAAM,CAAC,IAAI,KAAK,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,IAAI,CAClE,CAAC;QACF,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC,OAAO,CAAC,CAAC,IAAI;YACzC,MAAM,MAAM,GAAG,IAAI,YAAY,iBAAiB,GAAG,IAAI,GAAG,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;YAClF,MAAM,SAAS,GAAG,MAAM,KAAK,cAAc,CAAC;YAC5C,MAAM,CAAC,YAAY,CAAC,cAAc,EAAE,SAAS,CAAC,QAAQ,EAAE,CAAC,CAAC;YAC1D,IAAI,CAAC,eAAe,CAAC,cAAc,EAAE,SAAS,CAAC,CAAC;SACjD,CAAC,CAAC;KACJ;;;;IAKO,eAAe;QACrB,IAAI,CAAC,SAAS,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC;KAClC;IAED,gBAAgB;QACd,IAAI,IAAI,CAAC,WAAW,EAAE;YACpB,MAAM,CAAC,gBAAgB,CAAC,YAAY,EAAE,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;YAClE,IAAI,CAAC,UAAU,EAAE,CAAC;SACnB;KACF;IAED,oBAAoB;QAClB,MAAM,CAAC,mBAAmB,CAAC,YAAY,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC;KAC3D;IAED,MAAM;QACJ,QACE,EAAC,IAAI,
|
|
1
|
+
{"file":"z-anchor-navigation.js","mappings":";;;;;AAAA,MAAM,SAAS,GAAG,kzEAAkzE,CAAC;AACr0E,gCAAe,SAAS;;MCsBXA,mBAAiB;;;;8BAMX,KAAK;2BASR,IAAI;8BAMD,SAAS;2BAOZ,KAAK;yBAMP,KAAK;;;;;IAUT,UAAU;QAChB,MAAM,cAAc,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,CACpE,CAAC,MAAM,KAAK,MAAM,CAAC,IAAI,KAAK,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,IAAI,CAClE,CAAC;QACF,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC,OAAO,CAAC,CAAC,IAAI;YACzC,MAAM,MAAM,GAAG,IAAI,YAAY,iBAAiB,GAAG,IAAI,GAAG,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;YAClF,MAAM,SAAS,GAAG,MAAM,KAAK,cAAc,CAAC;YAC5C,MAAM,CAAC,YAAY,CAAC,cAAc,EAAE,SAAS,CAAC,QAAQ,EAAE,CAAC,CAAC;YAC1D,IAAI,CAAC,eAAe,CAAC,cAAc,EAAE,SAAS,CAAC,CAAC;SACjD,CAAC,CAAC;KACJ;;;;IAKO,eAAe;QACrB,IAAI,CAAC,SAAS,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC;KAClC;IAED,gBAAgB;QACd,IAAI,IAAI,CAAC,WAAW,EAAE;YACpB,MAAM,CAAC,gBAAgB,CAAC,YAAY,EAAE,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;YAClE,IAAI,CAAC,UAAU,EAAE,CAAC;SACnB;KACF;IAED,oBAAoB;QAClB,MAAM,CAAC,mBAAmB,CAAC,YAAY,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC;KAC3D;IAED,MAAM;QACJ,QACE,EAAC,IAAI,qDACH,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,KAAK,EAAC,aAAa,IAEnB,iEACE,KAAK,EAAC,QAAQ,EACd,IAAI,EAAE,WAAW,CAAC,KAAK,EACvB,OAAO,EAAE,aAAa,CAAC,SAAS,EAChC,IAAI,EAAE,IAAI,CAAC,SAAS,GAAG,YAAY,GAAG,cAAc,EACpD,OAAO,EAAE,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,IAEvC,IAAI,CAAC,cAAc,CACX,EACX,4DAAK,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,GAAG,GAAG,EAAE,CAAC,IAC/B,8DAAa,CACT,CACD,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["ZAnchorNavigation"],"sources":["src/components/z-anchor-navigation/styles.css?tag=z-anchor-navigation","src/components/z-anchor-navigation/index.tsx"],"sourcesContent":["html {\n scroll-behavior: smooth;\n}\n\nz-anchor-navigation nav {\n display: none;\n flex-direction: column;\n justify-content: flex-start;\n row-gap: calc(var(--space-unit) / 2);\n}\n\nz-anchor-navigation[collapsed] nav {\n display: flex;\n margin-top: var(--space-unit);\n}\n\nz-anchor-navigation nav a {\n display: -webkit-box;\n overflow: clip;\n width: 100%;\n box-sizing: border-box;\n padding: calc(var(--space-unit) * 1.5) calc(var(--space-unit) * 2);\n -webkit-box-orient: vertical;\n font-weight: inherit;\n -webkit-line-clamp: 2;\n line-clamp: 2;\n overflow-clip-margin: content-box;\n text-decoration: none;\n}\n\nz-anchor-navigation nav > * a {\n color: inherit;\n}\n\nz-anchor-navigation nav * a:not(:only-child) {\n padding-right: calc(var(--space-unit) * 5);\n}\n\n@supports not (overflow-clip-margin: content-box) {\n z-anchor-navigation nav a {\n display: inline-block;\n overflow: hidden;\n -webkit-line-clamp: none;\n line-clamp: none;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n}\n\nz-anchor-navigation nav > * {\n position: relative;\n border-left: var(--border-size-large) solid var(--color-default-icon);\n color: var(--color-default-text);\n font-family: var(--font-family-sans);\n transition:\n background-color 0.3s ease-in-out,\n border-color 0.3s ease-in-out,\n color 0.3s ease-in-out;\n}\n\nz-anchor-navigation nav > [data-current] {\n border-left-color: var(--color-primary01);\n color: var(--color-primary01);\n font-weight: var(--font-sb);\n}\n\nz-anchor-navigation nav > * > *:is(z-button, button) {\n position: absolute;\n top: 50%;\n right: 0;\n transform: translateY(-50%);\n transition: opacity 0.3s ease-in-out;\n}\n\nz-anchor-navigation nav > *:focus:focus-visible,\nz-anchor-navigation nav > * > *:focus:focus-visible {\n box-shadow: var(--shadow-focus-primary);\n outline: none;\n}\n\nz-anchor-navigation nav button {\n padding: 0;\n border: none;\n margin: 0;\n background-color: transparent;\n}\n\n@media (min-width: 768px) {\n z-anchor-navigation:not([is-collapsed]) z-button.toggle {\n display: none !important;\n }\n\n z-anchor-navigation:not([is-collapsed]) nav {\n display: flex;\n }\n\n /* hide anchor actions by default... */\n z-anchor-navigation nav > * > :is(z-button, button) {\n opacity: 0;\n pointer-events: none;\n }\n\n @media (hover: hover) {\n /* ...show them only hovering/focusing the anchor */\n z-anchor-navigation nav > :is([data-current], :hover, :focus, :focus-within) > :is(z-button, button) {\n fill: var(--color-default-icon);\n opacity: 1;\n pointer-events: unset;\n }\n\n z-anchor-navigation nav > *:hover {\n border-left-color: var(--color-hover-primary);\n background-color: var(--color-background);\n color: var(--color-hover-primary);\n }\n }\n\n z-anchor-navigation[hide-unselected] nav > *:not([data-current], :hover, :focus, :focus-within) {\n color: transparent;\n fill: transparent;\n }\n}\n","import {Component, Element, h, Host, Prop, State} from \"@stencil/core\";\nimport {ButtonVariant, ControlSize} from \"../../beans\";\n\n/**\n * Anchor navigation component.\n * @slot - Anchor navigation items. Use `<a>` elements inside. If you need an extra action element, use a wrapper around it and the anchor.\n * @example\n * ```\n * <z-anchor-navigation>\n * <div>\n * <a href=\"#section-id\">Section name</a>\n * <button type=\"button\">\n * <z-icon name=\"share\" />\n * </button>\n * </div>\n * </z-anchor-navigation>\n * ```\n */\n@Component({\n tag: \"z-anchor-navigation\",\n styleUrl: \"styles.css\",\n shadow: false,\n})\nexport class ZAnchorNavigation {\n /**\n * If enabled, the text of each anchor will be hidden unless\n * for the current one or the one the user is hovering.\n */\n @Prop({reflect: true})\n hideUnselected = false;\n\n /**\n * Enables automatic inference of the current item, listening for hash change\n * and checking the `href` of the slotted anchors.\n * When disabled, the highlight of current item must be handled manually by setting the `data-current`\n * attribute to the correct slotted items and the `aria-current` attribute to the anchors.\n */\n @Prop()\n autoCurrent = true;\n\n /**\n * Sets the label of the button displayed on mobile viewport when the anchor navigation is collapsed\n */\n @Prop()\n collapsedLabel = \"salta a\";\n\n /**\n * Explicitly collapse anchor navigation.\n * If false will collapse automatically only on mobile.\n */\n @Prop({reflect: true})\n isCollapsed = false;\n\n /**\n * Whether the mobile list is collapsed.\n */\n @State()\n collapsed = false;\n\n @Element() host: HTMLZAnchorNavigationElement;\n\n /** Reference to the nav element. */\n private nav: HTMLElement;\n\n /**\n * Set `aria-current` attribute to the anchors.\n */\n private setCurrent(): void {\n const currentElement = Array.from(this.nav.querySelectorAll(\"a\")).find(\n (anchor) => anchor.href === this.host.ownerDocument.location.href\n );\n Array.from(this.nav.children).forEach((item) => {\n const anchor = item instanceof HTMLAnchorElement ? item : item.querySelector(\"a\");\n const isCurrent = anchor === currentElement;\n anchor.setAttribute(\"aria-current\", isCurrent.toString());\n item.toggleAttribute(\"data-current\", isCurrent);\n });\n }\n\n /**\n * Toggle collapsed state.\n */\n private toggleCollapsed(): void {\n this.collapsed = !this.collapsed;\n }\n\n componentDidLoad(): void {\n if (this.autoCurrent) {\n window.addEventListener(\"hashchange\", this.setCurrent.bind(this));\n this.setCurrent();\n }\n }\n\n disconnectedCallback(): void {\n window.removeEventListener(\"hashchange\", this.setCurrent);\n }\n\n render(): HTMLZAnchorNavigationElement {\n return (\n <Host\n collapsed={this.collapsed}\n class=\"z-scrollbar\"\n >\n <z-button\n class=\"toggle\"\n size={ControlSize.SMALL}\n variant={ButtonVariant.SECONDARY}\n icon={this.collapsed ? \"chevron-up\" : \"chevron-down\"}\n onClick={this.toggleCollapsed.bind(this)}\n >\n {this.collapsedLabel}\n </z-button>\n <nav ref={(el) => (this.nav = el)}>\n <slot></slot>\n </nav>\n </Host>\n );\n }\n}\n"],"version":3}
|
|
@@ -2,7 +2,7 @@ import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal
|
|
|
2
2
|
import { C as CardVariant } from './index2.js';
|
|
3
3
|
import { d as defineCustomElement$2 } from './index9.js';
|
|
4
4
|
|
|
5
|
-
const stylesCss = ":host{--aspect-ratio:1.62;--z-card--border-color:var(--gray200);--z-card--color-cover-background:var(--color-surface01);--z-card--text-background:var(--color-surface01);--z-card--text-border-radius:none;--z-card--text-border:none;--z-card--text-padding:calc(var(--space-unit) * 2) var(--space-unit);position:relative;display:flex;flex-direction:column;font-family:var(--font-family-sans);font-weight:var(--font-rg)}*,::slotted(*){box-sizing:border-box}*:focus:focus-visible{box-shadow:var(--shadow-focus-primary);outline:none}:host(:not([variant=\"overlay\"])) .cover-container{position:relative;width:100%}.cover-container{padding-bottom:calc(100% / var(--aspect-ratio))}::slotted([slot=\"cover\"]),.color-cover{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;object-position:center}.cover-container>z-icon{--z-icon-width:calc(var(--space-unit) * 11);--z-icon-height:var(--z-icon-width);position:absolute;top:calc(50% - calc(var(--z-icon-height) / 2));left:calc(50% - calc(var(--z-icon-width) / 2));fill:var(--color-primary01)}.color-cover{background-color:var(--z-card--color-cover-background)}.content{display:flex;flex-direction:column;padding-top:var(--space-unit)}.color-cover .cover-content{display:flex;height:100%;flex-direction:column;justify-content:flex-end;padding:var(--space-unit)}::slotted([slot=\"metadata\"]),::slotted([slot=\"title\"]),::slotted([slot=\"text\"]){display:-webkit-inline-box;overflow:hidden;-webkit-box-orient:vertical}::slotted([slot=\"title\"]:not(:last-child)),::slotted([slot=\"text\"]:not(:last-child)){margin-bottom:var(--space-unit)}::slotted([slot=\"title\"])::before{position:absolute;z-index:1;top:0;right:0;bottom:0;left:0;content:\"\"}::slotted([slot=\"metadata\"]:not(:last-child)){margin:0 0 calc(var(--space-unit) * 0.25);-webkit-line-clamp:1;line-clamp:1;text-transform:uppercase}::slotted([slot=\"title\"]){margin:0;font-size:var(--font-size-3);font-weight:var(--font-sb);-webkit-line-clamp:2;line-clamp:2;text-decoration:none}::slotted([slot=\"title\"]:focus:focus-visible){box-shadow:var(--shadow-focus-primary);outline:none}::slotted([slot=\"text\"]){margin:0;-webkit-line-clamp:3;line-clamp:3}.actions{position:relative;z-index:2;display:flex;flex-direction:row;align-items:center}::slotted([slot=\"action\"]:not(:last-child)){margin-right:calc(var(--space-unit) * 2)}::slotted([slot=\"action\"]:focus){box-shadow:var(--shadow-focus-primary);outline:none !important}:host([clickable]) ::slotted([slot=\"title\"]:focus:focus-visible)::before{box-shadow:var(--shadow-focus-primary)}:host([clickable]) ::slotted([slot=\"title\"]:focus:focus-visible){box-shadow:none !important;outline:none !important}:host([variant=\"text\"]){border:var(--z-card--text-border);background-color:var(--z-card--text-background);border-radius:var(--z-card--text-border-radius)}:host([show-shadow])>.content,:host([variant=\"border\"])>.content,:host([variant=\"shadow\"])>.content{height:100%;padding:var(--space-unit) var(--space-unit) calc(var(--space-unit) * 2)}:host([variant=\"text\"])>.content{padding:var(--z-card--text-padding)}:host([variant=\"border\"]) .actions,:host([variant=\"shadow\"]) .actions{margin-top:auto}:host([variant=\"border\"]){border:var(--border-size-small) solid var(--z-card--border-color)}:host([variant=\"border\"][clickable]:hover)>.content{background:var(--color-background)}:host([variant=\"border\"][clickable]:focus:focus-visible){box-shadow:var(--shadow-focus-primary)}:host([variant=\"border\"][clickable]:active){border-color:transparent}:host([variant=\"shadow\"]),:host([show-shadow]){box-shadow:var(--shadow-2)}:host([variant=\"shadow\"][clickable]:hover),:host([clickable][show-shadow]:hover){box-shadow:var(--shadow-4)}:host([variant=\"shadow\"][clickable]:focus:focus-visible),:host([clickable][show-shadow]:focus:focus-visible){box-shadow:var(--shadow-focus-primary)}:host([variant=\"shadow\"][clickable]:active),:host([clickable][show-shadow]:active){box-shadow:none}:host([variant=\"overlay\"]) .content{position:absolute;top:0;right:0;bottom:0;left:0;justify-content:flex-end;padding:var(--space-unit);background-image:linear-gradient(to top, rgb(0 0 0 / 100%), rgb(0 0 0 / 0%));color:var(--color-text-inverse);fill:var(--color-text-inverse)}";
|
|
5
|
+
const stylesCss = ":host{--aspect-ratio:1.62;--z-card--border-color:var(--gray200);--z-card--color-cover-background:var(--color-surface01);--z-card--text-background:var(--color-surface01);--z-card--text-border-radius:none;--z-card--text-border:none;--z-card--text-padding:calc(var(--space-unit) * 2) var(--space-unit);position:relative;display:flex;flex-direction:column;font-family:var(--font-family-sans);font-weight:var(--font-rg)}*,::slotted(*){box-sizing:border-box}*:focus:focus-visible{box-shadow:var(--shadow-focus-primary);outline:none}:host(:not([variant=\"overlay\"])) .cover-container{position:relative;width:100%}.cover-container{padding-bottom:calc(100% / var(--aspect-ratio))}::slotted([slot=\"cover\"]),.color-cover{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;object-position:center}.cover-container>z-icon{--z-icon-width:calc(var(--space-unit) * 11);--z-icon-height:var(--z-icon-width);position:absolute;top:calc(50% - calc(var(--z-icon-height) / 2));left:calc(50% - calc(var(--z-icon-width) / 2));fill:var(--color-primary01)}.color-cover{background-color:var(--z-card--color-cover-background)}.content{display:flex;flex-direction:column;padding-top:var(--space-unit)}.color-cover .cover-content{display:flex;height:100%;flex-direction:column;justify-content:flex-end;padding:var(--space-unit)}::slotted([slot=\"metadata\"]),::slotted([slot=\"title\"]),::slotted([slot=\"text\"]){display:-webkit-inline-box;overflow:hidden;-webkit-box-orient:vertical}::slotted([slot=\"title\"]:not(:last-child)),::slotted([slot=\"text\"]:not(:last-child)){margin-bottom:var(--space-unit)}::slotted([slot=\"title\"])::before{position:absolute;z-index:1;top:0;right:0;bottom:0;left:0;content:\"\"}::slotted([slot=\"metadata\"]:not(:last-child)){margin:0 0 calc(var(--space-unit) * 0.25);-webkit-line-clamp:1;line-clamp:1;text-transform:uppercase}::slotted([slot=\"title\"]){margin:0;font-size:var(--font-size-3);font-weight:var(--font-sb);-webkit-line-clamp:2;line-clamp:2;text-decoration:none}::slotted([slot=\"title\"]:focus:focus-visible){box-shadow:var(--shadow-focus-primary);outline:none}::slotted([slot=\"text\"]){margin:0;-webkit-line-clamp:3;line-clamp:3}.actions{position:relative;z-index:2;display:flex;flex-direction:row;align-items:center}::slotted([slot=\"action\"]:not(:last-child)){margin-right:calc(var(--space-unit) * 2)}::slotted([slot=\"action\"]:focus){box-shadow:var(--shadow-focus-primary);outline:none !important}:host([clickable]) ::slotted([slot=\"title\"]:focus:focus-visible)::before{box-shadow:var(--shadow-focus-primary)}:host([clickable]) ::slotted([slot=\"title\"]:focus:focus-visible){box-shadow:none !important;outline:none !important}:host([variant=\"text\"]){border:var(--z-card--text-border);background-color:var(--z-card--text-background);border-radius:var(--z-card--text-border-radius)}:host([variant=\"text\"]) [slot=\"text\"]::before{border-radius:var(--z-card--text-border-radius)}:host([show-shadow])>.content,:host([variant=\"border\"])>.content,:host([variant=\"shadow\"])>.content{height:100%;padding:var(--space-unit) var(--space-unit) calc(var(--space-unit) * 2)}:host([variant=\"text\"])>.content{padding:var(--z-card--text-padding)}:host([variant=\"border\"]) .actions,:host([variant=\"shadow\"]) .actions{margin-top:auto}:host([variant=\"border\"]){border:var(--border-size-small) solid var(--z-card--border-color)}:host([variant=\"border\"][clickable]:hover)>.content{background:var(--color-background)}:host([variant=\"border\"][clickable]:focus:focus-visible){box-shadow:var(--shadow-focus-primary)}:host([variant=\"border\"][clickable]:active){border-color:transparent}:host([variant=\"shadow\"]),:host([show-shadow]){box-shadow:var(--shadow-2)}:host([variant=\"shadow\"][clickable]:hover),:host([clickable][show-shadow]:hover){box-shadow:var(--shadow-4)}:host([variant=\"shadow\"][clickable]:focus:focus-visible),:host([clickable][show-shadow]:focus:focus-visible){box-shadow:var(--shadow-focus-primary)}:host([variant=\"shadow\"][clickable]:active),:host([clickable][show-shadow]:active){box-shadow:none}:host([variant=\"overlay\"]) .content{position:absolute;top:0;right:0;bottom:0;left:0;justify-content:flex-end;padding:var(--space-unit);background-image:linear-gradient(to top, rgb(0 0 0 / 100%), rgb(0 0 0 / 0%));color:var(--color-text-inverse);fill:var(--color-text-inverse)}";
|
|
6
6
|
const ZCardStyle0 = stylesCss;
|
|
7
7
|
|
|
8
8
|
const ZCard$1 = /*@__PURE__*/ proxyCustomElement(class ZCard extends HTMLElement {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"z-card.js","mappings":";;;;AAAA,MAAM,SAAS,GAAG,ypIAAypI,CAAC;AAC5qI,oBAAe,SAAS;;MCsBXA,OAAK;;;;;;;0BAeH,KAAK;yBAIN,KAAK;;;IAOjB,iBAAiB;QACf,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;KACzE;;;;;IAMO,oBAAoB;QAC1B,OAAO;YACL,WAAK,KAAK,EAAC,iBAAiB,IAC1B,WAAK,KAAK,EAAC,aAAa,IACtB,WAAK,KAAK,EAAC,eAAe,IACxB,YAAM,IAAI,EAAC,UAAU,GAAQ,EAC7B,YAAM,IAAI,EAAC,OAAO,GAAQ,CACtB,CACF,CACF;YACN,WAAK,KAAK,EAAC,SAAS,IAClB,YAAM,IAAI,EAAC,MAAM,GAAQ,EACzB,WAAK,KAAK,EAAC,SAAS,IAClB,YAAM,IAAI,EAAC,QAAQ,GAAQ,CACvB,CACF;SACP,CAAC;KACH;;;;IAKO,aAAa;QACnB,QACE,WAAK,KAAK,EAAC,SAAS,IAClB,YAAM,IAAI,EAAC,UAAU,GAAQ,EAC7B,YAAM,IAAI,EAAC,OAAO,GAAQ,EAC1B,YAAM,IAAI,EAAC,MAAM,GAAQ,EACzB,WAAK,KAAK,EAAC,SAAS,IAClB,YAAM,IAAI,EAAC,QAAQ,GAAQ,CACvB,CACF,EACN;KACH;IAED,MAAM;QACJ,IAAI,IAAI,CAAC,OAAO,KAAK,WAAW,CAAC,IAAI,EAAE;YACrC,OAAO,EAAC,IAAI,QAAE,IAAI,CAAC,aAAa,EAAE,CAAQ,CAAC;SAC5C;QAED,IAAI,IAAI,CAAC,OAAO,KAAK,WAAW,CAAC,OAAO,IAAI,IAAI,CAAC,aAAa,EAAE;YAC9D,QACE,EAAC,IAAI,QACH,WAAK,KAAK,EAAC,iBAAiB,IACzB,IAAI,CAAC,aAAa,IAAI;gBACrB,YAAM,IAAI,EAAC,OAAO,GAAQ;gBAC1B,IAAI,CAAC,OAAO,KAAK,WAAW,CAAC,OAAO,IAAI,IAAI,CAAC,SAAS,IAAI,cAAQ,IAAI,EAAE,IAAI,CAAC,SAAS,GAAW;aAClG,EACA,CAAC,IAAI,CAAC,aAAa,IAAI,WAAK,KAAK,EAAC,aAAa,GAAO,CACnD,EACL,IAAI,CAAC,aAAa,EAAE,CAChB,EACP;SACH;QAED,OAAO,EAAC,IAAI,QAAE,IAAI,CAAC,oBAAoB,EAAE,CAAQ,CAAC;KACnD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["ZCard"],"sources":["src/components/z-card/styles.css?tag=z-card&encapsulation=shadow","src/components/z-card/index.tsx"],"sourcesContent":["/* The width of the card must be set by its container,\nrespecting the grid indications of the design. */\n\n:host {\n /* Override this var to change the cover's aspect ratio */\n --aspect-ratio: 1.62;\n --z-card--border-color: var(--gray200);\n --z-card--color-cover-background: var(--color-surface01);\n --z-card--text-background: var(--color-surface01);\n --z-card--text-border-radius: none;\n --z-card--text-border: none;\n --z-card--text-padding: calc(var(--space-unit) * 2) var(--space-unit);\n\n position: relative;\n display: flex;\n flex-direction: column;\n font-family: var(--font-family-sans);\n font-weight: var(--font-rg);\n}\n\n*,\n::slotted(*) {\n box-sizing: border-box;\n}\n\n*:focus:focus-visible {\n box-shadow: var(--shadow-focus-primary);\n outline: none;\n}\n\n:host(:not([variant=\"overlay\"])) .cover-container {\n position: relative;\n width: 100%;\n}\n\n/* Old good trick with percentage padding to keep the aspect ratio.\nUnfortunately the `aspect-ratio` property is still experimental */\n.cover-container {\n padding-bottom: calc(100% / var(--aspect-ratio));\n}\n\n::slotted([slot=\"cover\"]),\n.color-cover {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n object-fit: cover;\n object-position: center;\n}\n\n.cover-container > z-icon {\n --z-icon-width: calc(var(--space-unit) * 11);\n --z-icon-height: var(--z-icon-width);\n\n position: absolute;\n top: calc(50% - calc(var(--z-icon-height) / 2));\n left: calc(50% - calc(var(--z-icon-width) / 2));\n fill: var(--color-primary01);\n}\n\n.color-cover {\n background-color: var(--z-card--color-cover-background);\n}\n\n.content {\n display: flex;\n flex-direction: column;\n padding-top: var(--space-unit);\n}\n\n.color-cover .cover-content {\n display: flex;\n height: 100%;\n flex-direction: column;\n justify-content: flex-end;\n padding: var(--space-unit);\n}\n\n/* Truncates overflowing text */\n::slotted([slot=\"metadata\"]),\n::slotted([slot=\"title\"]),\n::slotted([slot=\"text\"]) {\n display: -webkit-inline-box;\n overflow: hidden;\n -webkit-box-orient: vertical;\n}\n\n::slotted([slot=\"title\"]:not(:last-child)),\n::slotted([slot=\"text\"]:not(:last-child)) {\n margin-bottom: var(--space-unit);\n}\n\n::slotted([slot=\"title\"])::before {\n position: absolute;\n z-index: 1;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n content: \"\";\n}\n\n::slotted([slot=\"metadata\"]:not(:last-child)) {\n margin: 0 0 calc(var(--space-unit) * 0.25);\n -webkit-line-clamp: 1;\n line-clamp: 1;\n text-transform: uppercase;\n}\n\n::slotted([slot=\"title\"]) {\n margin: 0;\n font-size: var(--font-size-3);\n font-weight: var(--font-sb);\n -webkit-line-clamp: 2;\n line-clamp: 2;\n text-decoration: none;\n}\n\n::slotted([slot=\"title\"]:focus:focus-visible) {\n box-shadow: var(--shadow-focus-primary);\n outline: none;\n}\n\n::slotted([slot=\"text\"]) {\n margin: 0;\n -webkit-line-clamp: 3;\n line-clamp: 3;\n}\n\n.actions {\n position: relative;\n z-index: 2;\n display: flex;\n flex-direction: row;\n align-items: center;\n}\n\n::slotted([slot=\"action\"]:not(:last-child)) {\n margin-right: calc(var(--space-unit) * 2);\n}\n\n::slotted([slot=\"action\"]:focus) {\n box-shadow: var(--shadow-focus-primary);\n outline: none !important;\n}\n\n:host([clickable]) ::slotted([slot=\"title\"]:focus:focus-visible)::before {\n box-shadow: var(--shadow-focus-primary);\n}\n\n:host([clickable]) ::slotted([slot=\"title\"]:focus:focus-visible) {\n box-shadow: none !important;\n outline: none !important;\n}\n\n:host([variant=\"text\"]) {\n border: var(--z-card--text-border);\n background-color: var(--z-card--text-background);\n border-radius: var(--z-card--text-border-radius);\n}\n\n:host([show-shadow]) > .content,\n:host([variant=\"border\"]) > .content,\n:host([variant=\"shadow\"]) > .content {\n height: 100%;\n padding: var(--space-unit) var(--space-unit) calc(var(--space-unit) * 2);\n}\n\n:host([variant=\"text\"]) > .content {\n padding: var(--z-card--text-padding);\n}\n\n:host([variant=\"border\"]) .actions,\n:host([variant=\"shadow\"]) .actions {\n margin-top: auto;\n}\n\n/* Border */\n:host([variant=\"border\"]) {\n border: var(--border-size-small) solid var(--z-card--border-color);\n}\n\n:host([variant=\"border\"][clickable]:hover) > .content {\n background: var(--color-background);\n}\n\n:host([variant=\"border\"][clickable]:focus:focus-visible) {\n box-shadow: var(--shadow-focus-primary);\n}\n\n:host([variant=\"border\"][clickable]:active) {\n border-color: transparent;\n}\n\n/* Shadow */\n:host([variant=\"shadow\"]),\n:host([show-shadow]) {\n box-shadow: var(--shadow-2);\n}\n\n:host([variant=\"shadow\"][clickable]:hover),\n:host([clickable][show-shadow]:hover) {\n box-shadow: var(--shadow-4);\n}\n\n:host([variant=\"shadow\"][clickable]:focus:focus-visible),\n:host([clickable][show-shadow]:focus:focus-visible) {\n box-shadow: var(--shadow-focus-primary);\n}\n\n:host([variant=\"shadow\"][clickable]:active),\n:host([clickable][show-shadow]:active) {\n box-shadow: none;\n}\n\n/* Overlay */\n:host([variant=\"overlay\"]) .content {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n justify-content: flex-end;\n padding: var(--space-unit);\n background-image: linear-gradient(to top, rgb(0 0 0 / 100%), rgb(0 0 0 / 0%));\n color: var(--color-text-inverse);\n fill: var(--color-text-inverse);\n}\n","import {Component, Element, Host, Prop, State, h} from \"@stencil/core\";\nimport {CardVariant} from \"../../beans\";\n\n/**\n * ZCard component.\n * @cssprop --aspect-ratio - Cover aspect ratio. Default: `1.62`\n * @cssprop --z-card--border-color - Default: `var(--gray200)`\n * @cssprop --z-card--color-cover-background - Cover color. Default: `var(--color-surface01)`\n * @cssprop --z-card--text-background - Background color for the `text` variant. Default: `var(--color-surface01)`\n * @cssprop --z-card--text-border-radius - Default: `none`\n * @cssprop --z-card--text-border - Configure CSS `border`. Default: `none`\n * @cssprop --z-card--text-padding - Configure CSS `padding`. Default: `none`\n * @slot cover - Image cover\n * @slot metadata - Metadata\n * @slot title - Title\n * @slot text - Text content\n * @slot action - Actions\n */\n@Component({\n tag: \"z-card\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZCard {\n /**\n * Card variant.\n * Can be one of \"text\", \"border\", \"shadow\", \"overlay\".\n * Leave it undefined for the default card.\n */\n @Prop({reflect: true})\n variant: CardVariant;\n\n /** Name of the icon to place over the image cover */\n @Prop()\n coverIcon: string;\n\n /** Enable shadow. Default: false. */\n @Prop({reflect: true})\n showShadow = false;\n\n /** Enable \"clickable\" styles like hover background and cursor, focus shadow on the whole card, etc. */\n @Prop({reflect: true})\n clickable = false;\n\n @Element() host: HTMLZCardElement;\n\n @State()\n hasCoverImage: boolean;\n\n componentWillLoad(): void {\n this.hasCoverImage = this.host.querySelector('[slot=\"cover\"]') !== null;\n }\n\n /**\n * Template for a card without image cover.\n * A colored background replaces the image and some data is moved over it.\n */\n private renderColorCoverCard(): HTMLDivElement[] {\n return [\n <div class=\"cover-container\">\n <div class=\"color-cover\">\n <div class=\"cover-content\">\n <slot name=\"metadata\"></slot>\n <slot name=\"title\"></slot>\n </div>\n </div>\n </div>,\n <div class=\"content\">\n <slot name=\"text\"></slot>\n <div class=\"actions\">\n <slot name=\"action\"></slot>\n </div>\n </div>,\n ];\n }\n\n /**\n * Template for the content.\n */\n private renderContent(): HTMLDivElement {\n return (\n <div class=\"content\">\n <slot name=\"metadata\"></slot>\n <slot name=\"title\"></slot>\n <slot name=\"text\"></slot>\n <div class=\"actions\">\n <slot name=\"action\"></slot>\n </div>\n </div>\n );\n }\n\n render(): HTMLZCardElement {\n if (this.variant === CardVariant.TEXT) {\n return <Host>{this.renderContent()}</Host>;\n }\n\n if (this.variant === CardVariant.OVERLAY || this.hasCoverImage) {\n return (\n <Host>\n <div class=\"cover-container\">\n {this.hasCoverImage && [\n <slot name=\"cover\"></slot>,\n this.variant !== CardVariant.OVERLAY && this.coverIcon && <z-icon name={this.coverIcon}></z-icon>,\n ]}\n {!this.hasCoverImage && <div class=\"color-cover\"></div>}\n </div>\n {this.renderContent()}\n </Host>\n );\n }\n\n return <Host>{this.renderColorCoverCard()}</Host>;\n }\n}\n"],"version":3}
|
|
1
|
+
{"file":"z-card.js","mappings":";;;;AAAA,MAAM,SAAS,GAAG,2vIAA2vI,CAAC;AAC9wI,oBAAe,SAAS;;MCsBXA,OAAK;;;;;;;0BAeH,KAAK;yBAIN,KAAK;;;IAOjB,iBAAiB;QACf,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;KACzE;;;;;IAMO,oBAAoB;QAC1B,OAAO;YACL,WAAK,KAAK,EAAC,iBAAiB,IAC1B,WAAK,KAAK,EAAC,aAAa,IACtB,WAAK,KAAK,EAAC,eAAe,IACxB,YAAM,IAAI,EAAC,UAAU,GAAQ,EAC7B,YAAM,IAAI,EAAC,OAAO,GAAQ,CACtB,CACF,CACF;YACN,WAAK,KAAK,EAAC,SAAS,IAClB,YAAM,IAAI,EAAC,MAAM,GAAQ,EACzB,WAAK,KAAK,EAAC,SAAS,IAClB,YAAM,IAAI,EAAC,QAAQ,GAAQ,CACvB,CACF;SACP,CAAC;KACH;;;;IAKO,aAAa;QACnB,QACE,WAAK,KAAK,EAAC,SAAS,IAClB,YAAM,IAAI,EAAC,UAAU,GAAQ,EAC7B,YAAM,IAAI,EAAC,OAAO,GAAQ,EAC1B,YAAM,IAAI,EAAC,MAAM,GAAQ,EACzB,WAAK,KAAK,EAAC,SAAS,IAClB,YAAM,IAAI,EAAC,QAAQ,GAAQ,CACvB,CACF,EACN;KACH;IAED,MAAM;QACJ,IAAI,IAAI,CAAC,OAAO,KAAK,WAAW,CAAC,IAAI,EAAE;YACrC,OAAO,EAAC,IAAI,QAAE,IAAI,CAAC,aAAa,EAAE,CAAQ,CAAC;SAC5C;QAED,IAAI,IAAI,CAAC,OAAO,KAAK,WAAW,CAAC,OAAO,IAAI,IAAI,CAAC,aAAa,EAAE;YAC9D,QACE,EAAC,IAAI,QACH,WAAK,KAAK,EAAC,iBAAiB,IACzB,IAAI,CAAC,aAAa,IAAI;gBACrB,YAAM,IAAI,EAAC,OAAO,GAAQ;gBAC1B,IAAI,CAAC,OAAO,KAAK,WAAW,CAAC,OAAO,IAAI,IAAI,CAAC,SAAS,IAAI,cAAQ,IAAI,EAAE,IAAI,CAAC,SAAS,GAAW;aAClG,EACA,CAAC,IAAI,CAAC,aAAa,IAAI,WAAK,KAAK,EAAC,aAAa,GAAO,CACnD,EACL,IAAI,CAAC,aAAa,EAAE,CAChB,EACP;SACH;QAED,OAAO,EAAC,IAAI,QAAE,IAAI,CAAC,oBAAoB,EAAE,CAAQ,CAAC;KACnD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["ZCard"],"sources":["src/components/z-card/styles.css?tag=z-card&encapsulation=shadow","src/components/z-card/index.tsx"],"sourcesContent":["/* The width of the card must be set by its container,\nrespecting the grid indications of the design. */\n\n:host {\n /* Override this var to change the cover's aspect ratio */\n --aspect-ratio: 1.62;\n --z-card--border-color: var(--gray200);\n --z-card--color-cover-background: var(--color-surface01);\n --z-card--text-background: var(--color-surface01);\n --z-card--text-border-radius: none;\n --z-card--text-border: none;\n --z-card--text-padding: calc(var(--space-unit) * 2) var(--space-unit);\n\n position: relative;\n display: flex;\n flex-direction: column;\n font-family: var(--font-family-sans);\n font-weight: var(--font-rg);\n}\n\n*,\n::slotted(*) {\n box-sizing: border-box;\n}\n\n*:focus:focus-visible {\n box-shadow: var(--shadow-focus-primary);\n outline: none;\n}\n\n:host(:not([variant=\"overlay\"])) .cover-container {\n position: relative;\n width: 100%;\n}\n\n/* Old good trick with percentage padding to keep the aspect ratio.\nUnfortunately the `aspect-ratio` property is still experimental */\n.cover-container {\n padding-bottom: calc(100% / var(--aspect-ratio));\n}\n\n::slotted([slot=\"cover\"]),\n.color-cover {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n object-fit: cover;\n object-position: center;\n}\n\n.cover-container > z-icon {\n --z-icon-width: calc(var(--space-unit) * 11);\n --z-icon-height: var(--z-icon-width);\n\n position: absolute;\n top: calc(50% - calc(var(--z-icon-height) / 2));\n left: calc(50% - calc(var(--z-icon-width) / 2));\n fill: var(--color-primary01);\n}\n\n.color-cover {\n background-color: var(--z-card--color-cover-background);\n}\n\n.content {\n display: flex;\n flex-direction: column;\n padding-top: var(--space-unit);\n}\n\n.color-cover .cover-content {\n display: flex;\n height: 100%;\n flex-direction: column;\n justify-content: flex-end;\n padding: var(--space-unit);\n}\n\n/* Truncates overflowing text */\n::slotted([slot=\"metadata\"]),\n::slotted([slot=\"title\"]),\n::slotted([slot=\"text\"]) {\n display: -webkit-inline-box;\n overflow: hidden;\n -webkit-box-orient: vertical;\n}\n\n::slotted([slot=\"title\"]:not(:last-child)),\n::slotted([slot=\"text\"]:not(:last-child)) {\n margin-bottom: var(--space-unit);\n}\n\n::slotted([slot=\"title\"])::before {\n position: absolute;\n z-index: 1;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n content: \"\";\n}\n\n::slotted([slot=\"metadata\"]:not(:last-child)) {\n margin: 0 0 calc(var(--space-unit) * 0.25);\n -webkit-line-clamp: 1;\n line-clamp: 1;\n text-transform: uppercase;\n}\n\n::slotted([slot=\"title\"]) {\n margin: 0;\n font-size: var(--font-size-3);\n font-weight: var(--font-sb);\n -webkit-line-clamp: 2;\n line-clamp: 2;\n text-decoration: none;\n}\n\n::slotted([slot=\"title\"]:focus:focus-visible) {\n box-shadow: var(--shadow-focus-primary);\n outline: none;\n}\n\n::slotted([slot=\"text\"]) {\n margin: 0;\n -webkit-line-clamp: 3;\n line-clamp: 3;\n}\n\n.actions {\n position: relative;\n z-index: 2;\n display: flex;\n flex-direction: row;\n align-items: center;\n}\n\n::slotted([slot=\"action\"]:not(:last-child)) {\n margin-right: calc(var(--space-unit) * 2);\n}\n\n::slotted([slot=\"action\"]:focus) {\n box-shadow: var(--shadow-focus-primary);\n outline: none !important;\n}\n\n:host([clickable]) ::slotted([slot=\"title\"]:focus:focus-visible)::before {\n box-shadow: var(--shadow-focus-primary);\n}\n\n:host([clickable]) ::slotted([slot=\"title\"]:focus:focus-visible) {\n box-shadow: none !important;\n outline: none !important;\n}\n\n:host([variant=\"text\"]) {\n border: var(--z-card--text-border);\n background-color: var(--z-card--text-background);\n border-radius: var(--z-card--text-border-radius);\n}\n\n:host([variant=\"text\"]) [slot=\"text\"]::before {\n border-radius: var(--z-card--text-border-radius);\n}\n\n:host([show-shadow]) > .content,\n:host([variant=\"border\"]) > .content,\n:host([variant=\"shadow\"]) > .content {\n height: 100%;\n padding: var(--space-unit) var(--space-unit) calc(var(--space-unit) * 2);\n}\n\n:host([variant=\"text\"]) > .content {\n padding: var(--z-card--text-padding);\n}\n\n:host([variant=\"border\"]) .actions,\n:host([variant=\"shadow\"]) .actions {\n margin-top: auto;\n}\n\n/* Border */\n:host([variant=\"border\"]) {\n border: var(--border-size-small) solid var(--z-card--border-color);\n}\n\n:host([variant=\"border\"][clickable]:hover) > .content {\n background: var(--color-background);\n}\n\n:host([variant=\"border\"][clickable]:focus:focus-visible) {\n box-shadow: var(--shadow-focus-primary);\n}\n\n:host([variant=\"border\"][clickable]:active) {\n border-color: transparent;\n}\n\n/* Shadow */\n:host([variant=\"shadow\"]),\n:host([show-shadow]) {\n box-shadow: var(--shadow-2);\n}\n\n:host([variant=\"shadow\"][clickable]:hover),\n:host([clickable][show-shadow]:hover) {\n box-shadow: var(--shadow-4);\n}\n\n:host([variant=\"shadow\"][clickable]:focus:focus-visible),\n:host([clickable][show-shadow]:focus:focus-visible) {\n box-shadow: var(--shadow-focus-primary);\n}\n\n:host([variant=\"shadow\"][clickable]:active),\n:host([clickable][show-shadow]:active) {\n box-shadow: none;\n}\n\n/* Overlay */\n:host([variant=\"overlay\"]) .content {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n justify-content: flex-end;\n padding: var(--space-unit);\n background-image: linear-gradient(to top, rgb(0 0 0 / 100%), rgb(0 0 0 / 0%));\n color: var(--color-text-inverse);\n fill: var(--color-text-inverse);\n}\n","import {Component, Element, Host, Prop, State, h} from \"@stencil/core\";\nimport {CardVariant} from \"../../beans\";\n\n/**\n * ZCard component.\n * @cssprop --aspect-ratio - Cover aspect ratio. Default: `1.62`\n * @cssprop --z-card--border-color - Default: `var(--gray200)`\n * @cssprop --z-card--color-cover-background - Cover color. Default: `var(--color-surface01)`\n * @cssprop --z-card--text-background - Background color for the `text` variant. Default: `var(--color-surface01)`\n * @cssprop --z-card--text-border-radius - Default: `none`\n * @cssprop --z-card--text-border - Configure CSS `border`. Default: `none`\n * @cssprop --z-card--text-padding - Configure CSS `padding`. Default: `none`\n * @slot cover - Image cover\n * @slot metadata - Metadata\n * @slot title - Title\n * @slot text - Text content\n * @slot action - Actions\n */\n@Component({\n tag: \"z-card\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZCard {\n /**\n * Card variant.\n * Can be one of \"text\", \"border\", \"shadow\", \"overlay\".\n * Leave it undefined for the default card.\n */\n @Prop({reflect: true})\n variant: CardVariant;\n\n /** Name of the icon to place over the image cover */\n @Prop()\n coverIcon: string;\n\n /** Enable shadow. Default: false. */\n @Prop({reflect: true})\n showShadow = false;\n\n /** Enable \"clickable\" styles like hover background and cursor, focus shadow on the whole card, etc. */\n @Prop({reflect: true})\n clickable = false;\n\n @Element() host: HTMLZCardElement;\n\n @State()\n hasCoverImage: boolean;\n\n componentWillLoad(): void {\n this.hasCoverImage = this.host.querySelector('[slot=\"cover\"]') !== null;\n }\n\n /**\n * Template for a card without image cover.\n * A colored background replaces the image and some data is moved over it.\n */\n private renderColorCoverCard(): HTMLDivElement[] {\n return [\n <div class=\"cover-container\">\n <div class=\"color-cover\">\n <div class=\"cover-content\">\n <slot name=\"metadata\"></slot>\n <slot name=\"title\"></slot>\n </div>\n </div>\n </div>,\n <div class=\"content\">\n <slot name=\"text\"></slot>\n <div class=\"actions\">\n <slot name=\"action\"></slot>\n </div>\n </div>,\n ];\n }\n\n /**\n * Template for the content.\n */\n private renderContent(): HTMLDivElement {\n return (\n <div class=\"content\">\n <slot name=\"metadata\"></slot>\n <slot name=\"title\"></slot>\n <slot name=\"text\"></slot>\n <div class=\"actions\">\n <slot name=\"action\"></slot>\n </div>\n </div>\n );\n }\n\n render(): HTMLZCardElement {\n if (this.variant === CardVariant.TEXT) {\n return <Host>{this.renderContent()}</Host>;\n }\n\n if (this.variant === CardVariant.OVERLAY || this.hasCoverImage) {\n return (\n <Host>\n <div class=\"cover-container\">\n {this.hasCoverImage && [\n <slot name=\"cover\"></slot>,\n this.variant !== CardVariant.OVERLAY && this.coverIcon && <z-icon name={this.coverIcon}></z-icon>,\n ]}\n {!this.hasCoverImage && <div class=\"color-cover\"></div>}\n </div>\n {this.renderContent()}\n </Host>\n );\n }\n\n return <Host>{this.renderColorCoverCard()}</Host>;\n }\n}\n"],"version":3}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
|
|
2
2
|
import { e as ControlSize, g as KeyboardCode, l as ListDividerType, i as ListSize } from './index2.js';
|
|
3
|
-
import { r as randomId, b as boolean, d as getElementTree,
|
|
3
|
+
import { r as randomId, b as boolean, d as getElementTree, e as getClickedElement } from './utils.js';
|
|
4
4
|
import { d as defineCustomElement$9 } from './index6.js';
|
|
5
5
|
import { d as defineCustomElement$8 } from './index9.js';
|
|
6
6
|
import { d as defineCustomElement$7 } from './index11.js';
|
|
@@ -10,7 +10,7 @@ import { d as defineCustomElement$4 } from './index14.js';
|
|
|
10
10
|
import { d as defineCustomElement$3 } from './index15.js';
|
|
11
11
|
import { d as defineCustomElement$2 } from './index25.js';
|
|
12
12
|
|
|
13
|
-
const stylesCss = ".sc-z-select-h{display:inline-block;width:inherit;color:var(--color-form-default-text);font-family:var(--font-family-sans);font-size:var(--font-size-3);font-weight:var(--font-rg)}[size=\"small\"].sc-z-select-h,[size=\"x-small\"].sc-z-select-h{font-size:var(--font-size-2)}.select-wrapper.sc-z-select>z-input.sc-z-select{width:100%}.select-wrapper.sc-z-select>z-input.sc-z-select .input-icon.sc-z-select{cursor:pointer}.select-wrapper.sc-z-select>div.sc-z-select{position:relative}.select-wrapper.sc-z-select>div.closed.sc-z-select{overflow:hidden;height:0}.select-wrapper.sc-z-select .ul-scroll-wrapper.sc-z-select{position:absolute;width:100%;box-sizing:border-box;border-top:none;background:var(--color-form-background);box-shadow:var(--shadow-2);outline:none}.select-wrapper.sc-z-select .closed.sc-z-select .ul-scroll-wrapper.sc-z-select{z-index:10}.select-wrapper.sc-z-select .open.sc-z-select .ul-scroll-wrapper.sc-z-select{z-index:20}.select-wrapper.sc-z-select .ul-scroll-wrapper.fixed.sc-z-select{position:static}.select-wrapper.sc-z-select z-list.sc-z-select{--background-color-list-element:var(--color-form-background);--background-hover-color-list-element:var(--color-form-surface03);--background-active-color-list-element:var(--color-form-surface03)}.select-wrapper.sc-z-select .ul-scroll-wrapper.sc-z-select>z-list.sc-z-select{position:relative;overflow:auto;max-height:240px;padding:
|
|
13
|
+
const stylesCss = ".sc-z-select-h{display:inline-block;width:inherit;color:var(--color-form-default-text);font-family:var(--font-family-sans);font-size:var(--font-size-3);font-weight:var(--font-rg)}[size=\"small\"].sc-z-select-h,[size=\"x-small\"].sc-z-select-h{font-size:var(--font-size-2)}.select-wrapper.sc-z-select>z-input.sc-z-select{width:100%}.select-wrapper.sc-z-select>z-input.sc-z-select .input-icon.sc-z-select{cursor:pointer}.select-wrapper.sc-z-select>div.sc-z-select{position:relative}.select-wrapper.sc-z-select>div.closed.sc-z-select{overflow:hidden;height:0}.select-wrapper.sc-z-select .ul-scroll-wrapper.sc-z-select{position:absolute;width:100%;box-sizing:border-box;border-top:none;background:var(--color-form-background);box-shadow:var(--shadow-2);outline:none}.select-wrapper.sc-z-select .closed.sc-z-select .ul-scroll-wrapper.sc-z-select{z-index:10}.select-wrapper.sc-z-select .open.sc-z-select .ul-scroll-wrapper.sc-z-select{z-index:20}.select-wrapper.sc-z-select .ul-scroll-wrapper.fixed.sc-z-select{position:static}.select-wrapper.sc-z-select z-list.sc-z-select{--background-color-list-element:var(--color-form-background);--background-hover-color-list-element:var(--color-form-surface03);--background-active-color-list-element:var(--color-form-surface03)}.select-wrapper.sc-z-select .ul-scroll-wrapper.sc-z-select>z-list.sc-z-select{position:relative;overflow:auto;max-height:240px;padding:var(--space-unit) calc(var(--space-unit) * 1.5);margin:calc(var(--space-unit) * -1) 0;outline:none}.select-wrapper.sc-z-select .ul-scroll-wrapper.sc-z-select z-list.sc-z-select z-list-element[disabled].sc-z-select{color:var(--color-form-disabled03)}.select-wrapper.sc-z-select .ul-scroll-wrapper.sc-z-select z-list.sc-z-select z-list-element.sc-z-select .list-element-container.sc-z-select{display:flex;align-items:center;padding:calc(var(--space-unit) / 2) var(--space-unit);column-gap:var(--space-unit)}.select-wrapper.sc-z-select .ul-scroll-wrapper.sc-z-select z-list.sc-z-select z-list-element.sc-z-select .list-element-container.sc-z-select .list-element-content.sc-z-select{margin-right:auto}.select-wrapper.sc-z-select .ul-scroll-wrapper.sc-z-select z-list.sc-z-select z-list-element.sc-z-select .list-element-container.sc-z-select>z-icon.sc-z-select+.list-element-content.sc-z-select{padding:calc(var(--space-unit) * 0.5) var(--space-unit)}[size=\"x-small\"].sc-z-select-h .select-wrapper.sc-z-select .ul-scroll-wrapper.sc-z-select z-list.sc-z-select z-list-element.sc-z-select .list-element-container.sc-z-select .list-element-content.sc-z-select{padding:0}[size=\"small\"].sc-z-select-h .select-wrapper.sc-z-select .ul-scroll-wrapper.sc-z-select z-list.sc-z-select z-list-element.sc-z-select .list-element-container.sc-z-select>z-icon.sc-z-select{--z-icon-width:16px;--z-icon-height:16px}[size=\"x-small\"].sc-z-select-h .select-wrapper.sc-z-select .ul-scroll-wrapper.sc-z-select z-list.sc-z-select z-list-element.sc-z-select .list-element-container.sc-z-select>z-icon.sc-z-select{--z-icon-width:14px;--z-icon-height:14px}[size=\"x-small\"].sc-z-select-h .select-wrapper.sc-z-select .ul-scroll-wrapper.sc-z-select z-list.sc-z-select z-list-element.sc-z-select .list-element-container.sc-z-select>z-icon.sc-z-select+.list-element-content.sc-z-select{padding:0 var(--space-unit)}.select-wrapper.sc-z-select .ul-scroll-wrapper.sc-z-select z-list.sc-z-select z-list-element.sc-z-select .list-element-container.sc-z-select .list-element-content.selected.sc-z-select{font-weight:var(--font-sb)}.select-wrapper.sc-z-select .ul-scroll-wrapper.sc-z-select .no-results.sc-z-select z-icon.sc-z-select{margin-right:var(--space-unit)}.z-list-group-title.sc-z-select{color:var(--color-form-default-text)}.reset-item.sc-z-select{color:var(--color-form-active-primary);fill:var(--color-form-active-primary)}.reset-item-content.sc-z-select{display:flex;align-items:center}.reset-item.reset-item-margin.sc-z-select .reset-item-content.sc-z-select{margin-left:var(--space-unit)}.reset-item.sc-z-select .reset-item-content.sc-z-select>z-icon.sc-z-select{margin-right:var(--space-unit)}.reset-item.hide.sc-z-select{display:none}.tree-list-reset-item.sc-z-select{padding:var(--space-unit) 0}z-list-element.sc-z-select{position:relative;display:block}z-list.sc-z-select z-list-element.sc-z-select::before{position:absolute;z-index:100;top:3px;left:-15px;width:8px;height:1em;border-bottom:1px solid var(--color-form-disabled01-icon);border-left:1px solid var(--color-form-disabled01-icon);content:\"\";cursor:pointer}z-list.sc-z-select z-list-element.sc-z-select::after{position:absolute;z-index:100;top:5px;left:-15px;width:8px;height:100%;border-left:1px solid var(--color-form-disabled01-icon);content:\"\";cursor:pointer}z-list.sc-z-select z-list-element.sc-z-select:last-child::after{display:none}z-list.sc-z-select>z-list-element.sc-z-select::before,z-list.sc-z-select>z-list-element.sc-z-select::after,z-list.sc-z-select>z-list-group.sc-z-select>z-list-element.sc-z-select::before,z-list.sc-z-select>z-list-group.sc-z-select>z-list-element.sc-z-select::after{display:none}z-list.sc-z-select>div.children-node.sc-z-select{padding-left:calc(var(--space-unit) * 2)}z-list-element.grouped-tree-parent-node.sc-z-select{padding-top:0;padding-left:calc(var(--space-unit) * 2)}z-list-element.sc-z-select>.list-element.sc-z-select{display:flex;justify-content:space-between;padding:calc(var(--space-unit) * 1.25) 0;cursor:pointer}z-list-element.sc-z-select>.list-element.sc-z-select:focus:focus-visible{box-shadow:var(--shadow-focus-primary);outline:none}z-list-element.sc-z-select>.list-element.sc-z-select .item.ellipsis.sc-z-select{overflow:hidden}z-list-element.sc-z-select .list-element.sc-z-select::after{position:absolute;top:0;right:-1px;display:block;width:100%;height:40px;content:\"\";transform:translateX(-100%)}z-list-element.tree-search-item.sc-z-select{padding-top:0}z-list-element.tree-search-item.sc-z-select .list-element.sc-z-select::after{position:absolute;top:8px;right:-25px;display:block;width:100%;height:40px;content:\"\";transform:translateX(-100%)}z-list-element.grouped-tree-parent-node.sc-z-select .list-element.sc-z-select::after{position:absolute;top:8px;right:-25px;display:block;width:100%;height:40px;content:\"\";transform:translateX(-100%)}z-list-element.sc-z-select:not([disabled])>.list-element.sc-z-select:hover,z-list-element.sc-z-select:not([disabled])>.list-element.sc-z-select:hover::after{z-index:-1;background-color:var(--color-form-surface03);cursor:pointer}.item-label.selected.sc-z-select{font-weight:bold}.item.ellipsis.sc-z-select{display:inline-block;overflow:hidden;max-width:100%;text-overflow:ellipsis;white-space:nowrap}z-list.sc-z-select>z-list-element.grouped-tree-parent-node.sc-z-select>.list-element.sc-z-select:hover::after,z-list-element.tree-search-item.sc-z-select .list-element.sc-z-select:hover::after,z-list.sc-z-select>z-list-group.sc-z-select>z-list-element.grouped-tree-parent-node.sc-z-select>.list-element.sc-z-select:hover::after{position:absolute;z-index:-1;top:8px;right:-18px;display:block;width:100%;height:40px;content:\"\";transform:translateX(-100%)}z-list-element.sc-z-select>.list-element.sc-z-select:hover::after{position:absolute;z-index:-1;top:0;right:0;display:block;width:100%;height:40px;content:\"\";transform:translateX(-100%)}.children-node.sc-z-select z-list-element.sc-z-select::before,.children-node.sc-z-select z-list-element.sc-z-select::after{left:-15px}.children-node.sc-z-select .children-node.sc-z-select z-list-element.sc-z-select::before,.children-node.sc-z-select .children-node.sc-z-select z-list-element.sc-z-select::after{left:-15px}.children-node.sc-z-select>z-list-element.sc-z-select{padding:0}";
|
|
14
14
|
const ZSelectStyle0 = stylesCss;
|
|
15
15
|
|
|
16
16
|
const ZSelect$1 = /*@__PURE__*/ proxyCustomElement(class ZSelect extends HTMLElement {
|
|
@@ -340,10 +340,8 @@ const ZSelect$1 = /*@__PURE__*/ proxyCustomElement(class ZSelect extends HTMLEle
|
|
|
340
340
|
}, id: `${this.htmlid}_input`, htmlid: `${this.htmlid}_select_input`, placeholder: this.placeholder, value: !this.isOpen && this.selectedItem ? this.selectedItem.name.replace(/<[^>]+>/g, "") : null, label: this.label, "aria-expanded": this.isOpen ? "true" : "false", "aria-label": this.ariaLabel, "aria-controls": `${this.htmlid}_list`, "aria-autocomplete": this.hasAutocomplete() ? "list" : "none", "aria-activedescendant": this.isOpen ? this.focusedItemId : "", icon: this.isOpen ? "caret-up" : "caret-down", hasclearicon: this.hasAutocomplete(), message: false, name: this.name, disabled: this.disabled, readonly: this.readonly || (!this.hasAutocomplete() && this.isOpen), status: this.isOpen ? undefined : this.status, role: "combobox", size: this.size, onClick: (e) => {
|
|
341
341
|
this.handleInputClick(e);
|
|
342
342
|
}, onKeyUp: (e) => {
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
}
|
|
346
|
-
handleKeyboardSubmit(e, this.toggleSelectUl);
|
|
343
|
+
e.preventDefault();
|
|
344
|
+
this.toggleSelectUl();
|
|
347
345
|
}, onKeyDown: (e) => {
|
|
348
346
|
const current = this.selectedItem
|
|
349
347
|
? this.itemIdKeyMap[this.selectedItem.id]
|
|
@@ -487,7 +485,7 @@ const ZSelect$1 = /*@__PURE__*/ proxyCustomElement(class ZSelect extends HTMLEle
|
|
|
487
485
|
return (h("z-input-message", { message: boolean(this.message) === true ? undefined : this.message, status: this.status, class: this.size, disabled: this.disabled }));
|
|
488
486
|
}
|
|
489
487
|
render() {
|
|
490
|
-
return (h("div", { key: '
|
|
488
|
+
return (h("div", { key: 'c3edf9b0bcf842deb48b5c62f994be9d5025d34f', class: "select-wrapper" }, this.renderInput(), this.renderSelectUl(), this.renderMessage()));
|
|
491
489
|
}
|
|
492
490
|
get host() { return this; }
|
|
493
491
|
static get watchers() { return {
|