npm - @zanichelli/albe-web-components - Versions diffs - 19.3.0-RC6 → 19.3.0 - Mend

@zanichelli/albe-web-components 19.3.0-RC6 → 19.3.0

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

Files changed (1274) hide show

package/dist/cjs/z-navigation-tabs.cjs.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"z-navigation-tabs.cjs.entry.js","mappings":"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","names":["NavigationTabsOrientation","NavigationTabsSize","NavigationTabsKeyboardEvents","h","Host"],"sources":["src/components/z-navigation-tabs/styles.css?tag=z-navigation-tabs","src/components/z-navigation-tabs/index.tsx"],"sourcesContent":["z-navigation-tabs {\n /**\n * @prop --z-navigation-tabs-nav-buttons-bg: Background color of the navigation buttons. The default is `--color-surface01`.\n * @prop --z-navigation-tabs-nav-buttons-fg: Foreground color of the navigation buttons. The default is `--color-primary01`.\n */\n --z-navigation-tabs-nav-buttons-bg: ;\n --z-navigation-tabs-nav-buttons-fg: ;\n\n position: relative;\n z-index: 0;\n display: flex;\n overflow: hidden;\n flex-direction: row;\n font-family: var(--font-family-sans);\n font-weight: var(--font-rg);\n}\n\nz-navigation-tabs,\nz-navigation-tabs * {\n box-sizing: border-box;\n}\n\nz-navigation-tabs > nav::-webkit-scrollbar {\n display: none;\n}\n\nz-navigation-tabs .navigation-button {\n position: absolute;\n z-index: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 0;\n border: none;\n margin: 0;\n background-color: var(--z-navigation-tabs-nav-buttons-bg, var(--color-surface01));\n border-radius: var(--border-no-radius);\n box-shadow: 0 0 4px 1px var(--shadow-color-base);\n cursor: pointer;\n fill: var(--z-navigation-tabs-nav-buttons-fg, var(--color-primary01));\n outline: none;\n}\n\nz-navigation-tabs .navigation-button:disabled {\n display: none;\n}\n\nz-navigation-tabs > nav {\n z-index: 0;\n display: flex;\n overflow: auto;\n align-items: center;\n justify-content: flex-start;\n scroll-behavior: smooth;\n\n /* hide scrollbar in Firefox */\n scrollbar-width: none;\n}\n\nz-navigation-tabs[orientation=\"horizontal\"] > nav {\n width: 100%;\n}\n\nz-navigation-tabs[orientation=\"horizontal\"] .navigation-button {\n top: 0;\n width: calc(var(--space-unit) * 4);\n height: 100%;\n}\n\nz-navigation-tabs[orientation=\"horizontal\"] .navigation-button:first-child {\n left: 0;\n}\n\nz-navigation-tabs[orientation=\"horizontal\"] .navigation-button:last-child {\n right: 0;\n}\n\n/* Orientation vertical */\nz-navigation-tabs[orientation=\"vertical\"] {\n width: fit-content;\n flex-direction: column;\n}\n\nz-navigation-tabs[orientation=\"vertical\"] > nav {\n height: 100%;\n flex-direction: column;\n align-items: stretch;\n}\n\nz-navigation-tabs[orientation=\"vertical\"] .navigation-button {\n left: 0;\n width: 100%;\n height: calc(var(--space-unit) * 4);\n}\n\nz-navigation-tabs[orientation=\"vertical\"] .navigation-button:first-child {\n top: 0;\n}\n\nz-navigation-tabs[orientation=\"vertical\"] .navigation-button:last-child {\n bottom: 0;\n}\n\nz-navigation-tabs[size=\"small\"][orientation=\"vertical\"] .navigation-button {\n height: calc(var(--space-unit) * 4);\n}\n\n/* Style for the tabs */\n\nz-navigation-tabs > nav > * {\n position: relative;\n z-index: 0;\n display: inline-flex;\n width: auto;\n align-items: center;\n justify-content: center;\n padding: calc(var(--space-unit) * 2) calc(var(--space-unit) * 5);\n border: none;\n margin: 0;\n background-color: unset;\n border-radius: var(--border-no-radius);\n color: var(--color-primary01);\n cursor: pointer;\n fill: currentcolor;\n font-family: var(--font-family-sans);\n font-size: inherit;\n gap: var(--space-unit);\n letter-spacing: inherit;\n line-height: inherit;\n outline: none;\n text-align: center;\n white-space: nowrap;\n}\n\nz-navigation-tabs > nav > a {\n text-decoration: none;\n}\n\nz-navigation-tabs > nav > *:focus:focus-visible {\n z-index: 1;\n box-shadow: inset 0 0 2px 2px var(--shadow-color-base);\n}\n\nz-navigation-tabs > nav > :not([disabled]):hover {\n background-color: var(--color-background);\n}\n\nz-navigation-tabs > nav > button[disabled] {\n color: var(--color-disabled03);\n cursor: not-allowed;\n fill: currentcolor;\n pointer-events: all;\n}\n\nz-navigation-tabs > nav > :not([disabled]):hover,\nnav > [aria-selected=\"true\"] {\n color: var(--color-hover-primary);\n fill: currentcolor;\n}\n\nz-navigation-tabs > nav > :not([disabled]):hover::after,\nnav > [aria-selected=\"true\"]::after {\n position: absolute;\n background-color: var(--color-hover-primary);\n content: \"\";\n}\n\nz-navigation-tabs[orientation=\"horizontal\"] > nav > :not([disabled]):hover::after,\nz-navigation-tabs[orientation=\"horizontal\"] > nav > [aria-selected=\"true\"]::after {\n bottom: 0;\n left: 0;\n width: 100%;\n height: var(--border-size-large);\n}\n\nz-navigation-tabs > nav > * z-icon {\n --z-icon-width: calc(var(--space-unit) * 2);\n --z-icon-height: calc(var(--space-unit) * 2);\n\n display: flex;\n margin: 0;\n}\n\n/* `small` size (only available for horizontal orientation) */\n\nz-navigation-tabs[size=\"small\"][orientation=\"horizontal\"] > nav > * {\n padding: var(--space-unit) calc(var(--space-unit) * 2);\n}\n\nz-navigation-tabs[size=\"small\"][orientation=\"horizontal\"] > nav > :not([disabled]):hover::after,\nz-navigation-tabs[size=\"small\"][orientation=\"horizontal\"] > nav > [aria-selected=\"true\"]::after {\n height: var(--border-size-medium);\n}\n\nz-navigation-tabs[size=\"small\"]:not([orientation=\"vertical\"]) > nav > * z-icon {\n --z-icon-width: 14px;\n --z-icon-height: 14px;\n}\n\n/* Orientation Vertical */\n\nz-navigation-tabs[orientation=\"vertical\"] > nav > * {\n padding: calc(var(--space-unit) * 3) calc(var(--space-unit) * 2);\n}\n\nz-navigation-tabs[orientation=\"vertical\"] > nav > * > :not(z-icon) {\n display: none;\n}\n\nz-navigation-tabs[orientation=\"vertical\"] > nav > :not([disabled]):hover::after,\nz-navigation-tabs[orientation=\"vertical\"] > nav > [aria-selected=\"true\"]::after {\n top: 0;\n right: 0;\n width: var(--border-size-large);\n height: 100%;\n}\n","import {\n Component,\n ComponentInterface,\n Element,\n Event,\n EventEmitter,\n Host,\n Listen,\n Prop,\n State,\n Watch,\n h,\n} from \"@stencil/core\";\nimport {NavigationTabsKeyboardEvents, NavigationTabsOrientation, NavigationTabsSize} from \"../../beans\";\n\n/**\n * Navigation tabs component.\n * To select a specific tab programmatically, set the `aria-selected` attribute to `true` on the desired tab.\n * @slot - Main slot. Use `<button>` or `<a>` tags as children.\n */\n@Component({\n tag: \"z-navigation-tabs\",\n styleUrl: \"styles.css\",\n})\nexport class ZNavigationTabs implements ComponentInterface {\n /**\n * Set `aria-label` attribute to the internal `<nav>` element with `tablist` role.\n */\n @Prop()\n ariaLabel = \"\";\n\n /**\n * Navigation tabs orientation.\n */\n @Prop({reflect: true})\n orientation? = NavigationTabsOrientation.HORIZONTAL;\n\n /**\n * Navigation tabs size.\n */\n @Prop({reflect: true})\n size? = NavigationTabsSize.BIG;\n\n /**\n * Index of the selected tab.\n * Useful to programmatically select a tab.\n * The tab can also be selected by setting the `aria-selected` attribute to `true` on the desired tab.\n */\n @Prop({mutable: true})\n selectedTab: number = undefined;\n\n /**\n * Emitted when the selected tab changes.\n * Contains the index of the new selected tab in the `detail` of the event.\n */\n @Event()\n selected: EventEmitter<number>;\n\n /**\n * Whether to show navigation buttons.\n */\n @State()\n canNavigate: boolean;\n\n /**\n * Whether backwards navigation is allowed.\n */\n @State()\n canNavigatePrev: boolean;\n\n /**\n * Whether forward navigation is allowed.\n */\n @State()\n canNavigateNext: boolean;\n\n @Element() host: HTMLZNavigationTabsElement;\n\n /**\n * Index of the last tab that held focus.\n */\n private focusedTab = undefined;\n\n /**\n * Reference to the `<nav>` element\n */\n private nav: HTMLElement;\n\n /**\n * Getter for the direction to check based on current orientation.\n */\n get direction(): string {\n return this.orientation == NavigationTabsOrientation.HORIZONTAL ? \"Left\" : \"Top\";\n }\n\n /**\n * Getter for the dimension to check based on current orientation.\n */\n get dimension(): string {\n return this.orientation == NavigationTabsOrientation.HORIZONTAL ? \"Width\" : \"Height\";\n }\n\n get tabs(): HTMLElement[] {\n return Array.from(this.nav.children) as HTMLElement[];\n }\n\n private resizeObserver: ResizeObserver;\n\n /**\n * Scroll into view to center the tab.\n */\n private scrollToTab(tabElement: HTMLElement): void {\n const container = tabElement.parentElement;\n\n if (!container) {\n return;\n }\n\n setTimeout(() => {\n const isHorizontal = this.orientation === NavigationTabsOrientation.HORIZONTAL;\n\n const containerRect = container.getBoundingClientRect();\n const tabRect = tabElement.getBoundingClientRect();\n\n const offset = isHorizontal ? tabRect.left - containerRect.left : tabRect.top - containerRect.top;\n const containerSize = isHorizontal ? container.clientWidth : container.clientHeight;\n const tabSize = isHorizontal ? tabElement.clientWidth : tabElement.clientHeight;\n const scrollAmount = offset - containerSize / 2 + tabSize / 2;\n\n container.scrollTo({\n [isHorizontal ? \"left\" : \"top\"]: container[isHorizontal ? \"scrollLeft\" : \"scrollTop\"] + scrollAmount,\n behavior: \"smooth\",\n });\n }, 100);\n }\n\n /**\n * Scroll the navigation bar half of its size backward.\n */\n private navigateBackwards(): void {\n this.nav.scrollBy({\n [this.direction.toLowerCase()]: 0 - this.nav[`client${this.dimension}`] / 2,\n behavior: \"smooth\",\n });\n }\n\n /**\n * Scroll the navigation bar half of its size forward.\n */\n private navigateForward(): void {\n this.nav.scrollBy({\n [this.direction.toLowerCase()]: this.nav[`scroll${this.direction}`] + this.nav[`client${this.dimension}`] / 2,\n behavior: \"smooth\",\n });\n }\n\n /**\n * Check if a keyboard event was triggered by an arrow key.\n */\n private isArrowNavigation(e: KeyboardEvent): boolean {\n return Object.values(NavigationTabsKeyboardEvents).includes(e.key as NavigationTabsKeyboardEvents);\n }\n\n /**\n * Check if the navigation buttons are needed.\n */\n private checkScrollVisible(): void {\n if (!this.nav) {\n return;\n }\n\n this.canNavigate = this.nav[`scroll${this.dimension}`] > this.nav[`client${this.dimension}`];\n }\n\n /**\n * Check if navigation buttons can be enabled for each direction.\n */\n @Watch(\"canNavigate\")\n checkScrollEnabled(): void {\n if (!this.nav) {\n return;\n }\n\n this.canNavigateNext =\n this.nav[`scroll${this.direction}`] + this.nav[`client${this.dimension}`] < this.nav[`scroll${this.dimension}`];\n this.canNavigatePrev = this.nav[`scroll${this.direction}`] > 0;\n }\n\n /**\n * When the selected tab changes, update the `aria-selected` attribute on each tab and scroll to the selected tab.\n */\n @Watch(\"selectedTab\")\n onTabSelected(): void {\n this.tabs.forEach((tab, i) => {\n const zicon = tab.querySelector(\"z-icon\");\n const strokeIcon = zicon?.name.replace(\"-filled\", \"\");\n if (i !== this.selectedTab) {\n tab.setAttribute(\"aria-selected\", \"false\");\n tab.tabIndex = -1;\n if (zicon) {\n zicon.name = strokeIcon;\n }\n\n return;\n }\n\n if (zicon) {\n zicon.name = `${strokeIcon}-filled`;\n }\n tab.setAttribute(\"aria-selected\", \"true\");\n });\n this.selected.emit(this.selectedTab);\n if (this.selectedTab !== undefined) {\n this.scrollToTab(this.tabs[this.selectedTab]);\n }\n }\n\n /**\n * Handle click on the tabs.\n * @param event `click` event triggered by a child tab\n */\n @Listen(\"click\")\n handleTabClick(event: MouseEvent): void {\n const clickedTab = (event.target as HTMLElement).closest<HTMLElement>(\"[role='tab']\");\n if (!this.tabs.some((child) => child.contains(clickedTab))) {\n return;\n }\n\n this.selectedTab = this.tabs.indexOf(clickedTab);\n }\n\n /**\n * When a tab is focused, temporarily set to -1 the `tabindex` of the selected tab (if any) and set the `focusedTab` to the index of the focused tab.\n */\n @Listen(\"focusin\")\n onTabFocusIn(event: FocusEvent): void {\n const focused = this.tabs.findIndex((tab) => tab.contains(event.target as HTMLElement));\n if (focused === -1) {\n return;\n }\n\n if (this.selectedTab !== undefined) {\n this.tabs[this.selectedTab].tabIndex = -1;\n }\n this.focusedTab = focused;\n this.tabs[this.focusedTab].tabIndex = -1;\n this.scrollToTab(this.tabs[this.focusedTab]);\n }\n\n /**\n * Handle keyboard navigation through tabs with arrow keys.\n */\n @Listen(\"keydown\")\n navigateThroughTabs(event: KeyboardEvent): void | boolean {\n if (!this.tabs.some((tab) => tab.contains(event.target as HTMLElement)) || !this.isArrowNavigation(event)) {\n return true;\n }\n\n event.preventDefault();\n if (\n (event.key === NavigationTabsKeyboardEvents.RIGHT && this.orientation == NavigationTabsOrientation.HORIZONTAL) ||\n (event.key === NavigationTabsKeyboardEvents.DOWN && this.orientation == NavigationTabsOrientation.VERTICAL)\n ) {\n // Move forward\n this.focusedTab++;\n if (this.focusedTab >= this.tabs.length) {\n this.focusedTab = 0;\n }\n } else if (\n (event.key === NavigationTabsKeyboardEvents.LEFT && this.orientation == NavigationTabsOrientation.HORIZONTAL) ||\n (event.key === NavigationTabsKeyboardEvents.UP && this.orientation == NavigationTabsOrientation.VERTICAL)\n ) {\n // Move backward\n this.focusedTab--;\n if (this.focusedTab < 0) {\n this.focusedTab = this.tabs.length - 1;\n }\n }\n // Ignore disabled tabs\n if (\n this.tabs[this.focusedTab].hasAttribute(\"disabled\") &&\n this.tabs[this.focusedTab].getAttribute(\"disabled\") !== \"false\"\n ) {\n return this.navigateThroughTabs(event);\n }\n\n this.tabs[this.focusedTab].focus();\n this.scrollToTab(this.tabs[this.focusedTab]);\n }\n\n /**\n * If the focus is not going on a tab (`relatedTarget` is the new focused element), set to 0 the `tabindex` of the selected tab or the one of the first tab, then unset the `focusedTab`.\n */\n @Listen(\"focusout\")\n onTabFocusOut(event: FocusEvent): void {\n if (!this.tabs.some((tab) => tab.contains(event.relatedTarget as HTMLElement))) {\n this.tabs[this.selectedTab ?? 0].tabIndex = 0;\n this.focusedTab = undefined;\n }\n }\n\n connectedCallback(): void {\n this.resizeObserver = new ResizeObserver(() => this.checkScrollVisible());\n }\n\n componentDidLoad(): void {\n // Set role and tabindex to each slotted tab\n this.tabs.forEach((tab) => {\n tab.setAttribute(\"role\", \"tab\");\n tab.tabIndex = -1;\n });\n\n const preselectedTab = this.selectedTab ?? this.tabs.findIndex((tab) => tab.ariaSelected === \"true\");\n if (preselectedTab !== -1) {\n this.selectedTab = preselectedTab;\n this.tabs[preselectedTab].tabIndex = 0;\n this.onTabSelected();\n } else {\n this.tabs[0].tabIndex = 0;\n }\n\n this.resizeObserver.observe(this.nav);\n }\n\n disconnectedCallback(): void {\n this.resizeObserver?.disconnect();\n }\n\n render(): HTMLZNavigationTabsElement {\n return (\n <Host\n class={{\n \"interactive-2\": this.size === NavigationTabsSize.SMALL,\n \"interactive-1\": this.size !== NavigationTabsSize.SMALL,\n }}\n scrollable={this.canNavigate}\n >\n <button\n class=\"navigation-button\"\n onClick={this.navigateBackwards.bind(this)}\n tabIndex={-1}\n disabled={!this.canNavigatePrev}\n aria-label=\"Mostra elementi precedenti\"\n hidden={!this.canNavigate}\n >\n <z-icon\n name={this.orientation === NavigationTabsOrientation.HORIZONTAL ? \"chevron-left\" : \"chevron-up\"}\n width={16}\n height={16}\n />\n </button>\n\n <nav\n role=\"tablist\"\n aria-label={this.ariaLabel}\n ref={(el) => (this.nav = el ?? this.nav)}\n onScroll={this.checkScrollEnabled.bind(this)}\n aria-orientation={this.orientation}\n >\n <slot></slot>\n </nav>\n\n <button\n class=\"navigation-button\"\n onClick={this.navigateForward.bind(this)}\n tabIndex={-1}\n disabled={!this.canNavigateNext}\n aria-label=\"Mostra elementi successivi\"\n hidden={!this.canNavigate}\n >\n <z-icon\n name={this.orientation === NavigationTabsOrientation.HORIZONTAL ? \"chevron-right\" : \"chevron-down\"}\n width={16}\n height={16}\n />\n </button>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/cjs/z-notification.cjs.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var index = require('./index-DnscebL4.js');
+var index = require('./index-DY2I5wAY.js');
 const stylesCss = () => `:host{--z-notification--top-offset:0;--z-notification--content-max-width:100%;display:block;width:100%}.main-container{display:flex;max-width:var(--z-notification--content-max-width);align-items:flex-start;padding:calc(var(--space-unit) * 2) var(--z-notification--inline-padding, calc(var(--space-unit) * 2));margin:0 auto;background-color:transparent;font-family:var(--font-family-sans)}:host([sticky]){position:sticky;top:var(--z-notification--top-offset)}:host([sticky]),:host([showshadow]){box-shadow:var(--shadow-3)}:host([type="success"]){background:var(--color-inverse-success)}:host([type="warning"]){background:var(--color-inverse-warning)}:host([type="error"]){background:var(--color-inverse-error)}.status-icon,.close-button{display:flex;height:20px;align-items:center}:host([type="success"]) .status-icon{fill:var(--color-default-success)}:host([type="warning"]) .status-icon{fill:var(--color-default-warning)}:host([type="error"]) .status-icon{fill:var(--color-default-error)}:host([borderposition="bottom"]){border-bottom:var(--border-size-medium) solid var(--color-surface03)}:host([borderposition="top"]){border-top:var(--border-size-medium) solid var(--color-surface03)}button{padding:0;border:none;margin:0;background:transparent;cursor:pointer;font-family:inherit}.status-icon+.content-container{margin-left:var(--space-unit)}.content-container{display:flex;flex:1 auto;flex-wrap:wrap;align-items:baseline;justify-content:space-between;row-gap:calc(var(--space-unit) * 2)}.content-text{width:100%;color:var(--color-default-text);font-size:var(--font-size-2);font-weight:var(--font-rg);letter-spacing:0.16px;line-height:1.4}.action-button{color:var(--color-primary01);font-size:var(--font-size-1);font-weight:var(--font-sb);letter-spacing:0.32px;line-height:1.333;outline:none}.action-button:focus-visible{box-shadow:var(--shadow-focus-primary)}.content-container+.close-button{margin-left:calc(var(--space-unit) * 2)}.close-button z-icon{fill:var(--color-primary01)}@media (min-width: 768px){.content-container{flex-wrap:nowrap}.content-text+.action-button{margin-left:calc(var(--space-unit) * 5)}}`;
@@ -33,9 +33,12 @@ const ZNotification = class {
     }
     render() {
         var _a;
-        return (index.h(index.Host, { key: '05288cf38255e2b7ee8567ea735cc073d2cae4a1' }, index.h("div", { key: '8b737c2201659e6b50911c4a83a5d6eae4facf46', class: "main-container" }, this.contenticonname && (index.h("z-icon", { key: 'd91f0f38d124dd0f61ce14e3607e3eb0fa4b6650', class: "status-icon", name: this.contenticonname, width: 16, height: 16 })), index.h("div", { key: 'bf7b392e4001b37272092270bc31b168f600dbc4', class: "content-container" }, index.h("div", { key: '187e9cbcc37ff55c77a7adc946ac83ffd813ea81', class: "content-text" }, index.h("slot", { key: '4bfcb8305ed25eb85ab95aa3a475f2e61b064f63' })), !!((_a = this.actiontext) === null || _a === void 0 ? void 0 : _a.trim()) && (index.h("button", { key: 'f0a75df6238269b73e6853353c8bb8feee11e90e', class: "action-button", type: "button", onClick: this.handleActionButtonClick }, this.actiontext))), this.showclose && (index.h("button", { key: '575860241a746ddcddd16646496bbfdf458e91db', class: "close-button", type: "button", onClick: this.handleCloseButtonClick }, index.h("z-icon", { key: 'a096f412fec8ab8eec3081853d5baada531bcf54', name: "multiply-circle", width: 16, height: 16 }))))));
+        return (index.h(index.Host, { key: 'dc72b8c965151d9928aa0ddede2796c09fdc5da5' }, index.h("div", { key: 'a3492b0ec98ed322e2e6b41b10ae7f7141a794f1', class: "main-container" }, this.contenticonname && (index.h("z-icon", { key: 'a6754bf4dd0803636e223465e8e0f7d3f0289fd5', class: "status-icon", name: this.contenticonname, width: 16, height: 16 })), index.h("div", { key: 'b0761286fda860b2531b97f3550160cbaba31c69', class: "content-container" }, index.h("div", { key: 'ea7441390672258a330fb137c17376c0f736b022', class: "content-text" }, index.h("slot", { key: '63c90279f0a02606bace42317f9329f4a92b0523' })), !!((_a = this.actiontext) === null || _a === void 0 ? void 0 : _a.trim()) && (index.h("button", { key: '510ab69472d1e530aef292bfa416f50a7f222d0b', class: "action-button", type: "button", onClick: this.handleActionButtonClick }, this.actiontext))), this.showclose && (index.h("button", { key: 'c8577b0e8d0cec6573a6b69cd312738d8e866e58', class: "close-button", type: "button", onClick: this.handleCloseButtonClick }, index.h("z-icon", { key: 'b6c163251b82c717b8b6ebe5d50ddbc02f5ea318', name: "multiply-circle", width: 16, height: 16 }))))));
     }
 };
 ZNotification.style = stylesCss();
 exports.z_notification = ZNotification;
+//# sourceMappingURL=z-notification.entry.cjs.js.map
+//# sourceMappingURL=z-notification.cjs.entry.js.map

package/dist/cjs/z-notification.cjs.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"z-notification.cjs.entry.js","mappings":";;;;AAAA,MAAM,SAAS,GAAG,MAAM,CAAC,qkEAAqkE,CAAC;;MCYllE,aAAa,GAAA,MAAA;AAoChB,IAAA,uBAAuB,CAAC,CAAa,EAAA;QAC3C,CAAC,CAAC,cAAc,EAAE;AAClB,QAAA,IAAI,CAAC,kBAAkB,CAAC,IAAI,EAAE;;AAOxB,IAAA,sBAAsB,CAAC,CAAa,EAAA;QAC1C,CAAC,CAAC,cAAc,EAAE;AAClB,QAAA,IAAI,CAAC,iBAAiB,CAAC,IAAI,EAAE;;AAG/B,IAAA,WAAA,CAAA,OAAA,EAAA;;;;;AAnCA,QAAA,IAAA,CAAA,SAAS,GAAa,KAAK;AAE3B;;;AAGG;AAEH,QAAA,IAAA,CAAA,UAAU,GAAa,KAAK;;AAI5B,QAAA,IAAA,CAAA,MAAM,GAAa,KAAK;;AAIxB,QAAA,IAAA,CAAA,cAAc,GAAsB,QAAQ;QAqB1C,IAAI,CAAC,uBAAuB,GAAG,IAAI,CAAC,uBAAuB,CAAC,IAAI,CAAC,IAAI,CAAC;QACtE,IAAI,CAAC,sBAAsB,GAAG,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,IAAI,CAAC;AACrE;IAED,MAAM,GAAA;;QACJ,QACEA,QAACC,UAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACHD,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,gBAAgB,EAAA,EACxB,IAAI,CAAC,eAAe,KACnBA,qEACE,KAAK,EAAC,aAAa,EACnB,IAAI,EAAE,IAAI,CAAC,eAAe,EAC1B,KAAK,EAAE,EAAE,EACT,MAAM,EAAE,EAAE,EAAA,CACV,CACH,EACDA,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,mBAAmB,EAAA,EAC5BA,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,cAAc,EAAA,EACvBA,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAa,CACT,EACL,CAAC,EAAC,CAAA,EAAA,GAAA,IAAI,CAAC,UAAU,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,IAAI,EAAE,CAAA,KACxBA,OAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAC,eAAe,EACrB,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,IAAI,CAAC,uBAAuB,EAAA,EAEpC,IAAI,CAAC,UAAU,CACT,CACV,CACG,EACL,IAAI,CAAC,SAAS,KACbA,OAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAC,cAAc,EACpB,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,IAAI,CAAC,sBAAsB,EAAA,EAEpCA,OAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,IAAI,EAAC,iBAAiB,EACtB,KAAK,EAAE,EAAE,EACT,MAAM,EAAE,EAAE,EAAA,CACV,CACK,CACV,CACG,CACD;;;;;;;","names":["h","Host"],"sources":["src/components/z-notification/styles.css?tag=z-notification&encapsulation=shadow","src/components/z-notification/index.tsx"],"sourcesContent":[":host {\n /**\n * @prop --z-notification--top-offset: The top offset of the notification. Use it when `sticky` prop is set to `true` and you need the notification to stay under other sticky elements. Default: 0px.\n * @prop --z-notification--content-max-width: The max width of the notification content. Useful to align the content with other elements on the page, keeping the colored background full width. Default: 100%. Note: the content is automatically centered, so if you want to limit the width only for the slotted content, you can wrap it in a container with the desired width and leave the `z-notification` width to 100%.\n * @prop --z-notification--inline-padding: The inline padding of the notification content. It can be useful to align the content when the `--z-notification--content-max-width` is set. Default: calc(var(--space-unit) * 2).\n */\n --z-notification--top-offset: 0;\n --z-notification--content-max-width: 100%;\n --z-notification--inline-padding: ;\n\n display: block;\n width: 100%;\n}\n\n.main-container {\n display: flex;\n max-width: var(--z-notification--content-max-width);\n align-items: flex-start;\n padding: calc(var(--space-unit) * 2) var(--z-notification--inline-padding, calc(var(--space-unit) * 2));\n margin: 0 auto;\n background-color: transparent;\n font-family: var(--font-family-sans);\n}\n\n:host([sticky]) {\n position: sticky;\n top: var(--z-notification--top-offset);\n}\n\n:host([sticky]),\n:host([showshadow]) {\n box-shadow: var(--shadow-3);\n}\n\n:host([type=\"success\"]) {\n background: var(--color-inverse-success);\n}\n\n:host([type=\"warning\"]) {\n background: var(--color-inverse-warning);\n}\n\n:host([type=\"error\"]) {\n background: var(--color-inverse-error);\n}\n\n.status-icon,\n.close-button {\n /* simulate the line-height of the text\n to make the icon look correctly aligned with it. */\n display: flex;\n height: 20px;\n align-items: center;\n}\n\n:host([type=\"success\"]) .status-icon {\n fill: var(--color-default-success);\n}\n\n:host([type=\"warning\"]) .status-icon {\n fill: var(--color-default-warning);\n}\n\n:host([type=\"error\"]) .status-icon {\n fill: var(--color-default-error);\n}\n\n:host([borderposition=\"bottom\"]) {\n border-bottom: var(--border-size-medium) solid var(--color-surface03);\n}\n\n:host([borderposition=\"top\"]) {\n border-top: var(--border-size-medium) solid var(--color-surface03);\n}\n\nbutton {\n padding: 0;\n border: none;\n margin: 0;\n background: transparent;\n cursor: pointer;\n font-family: inherit;\n}\n\n.status-icon + .content-container {\n margin-left: var(--space-unit);\n}\n\n.content-container {\n display: flex;\n flex: 1 auto;\n flex-wrap: wrap;\n align-items: baseline;\n justify-content: space-between;\n row-gap: calc(var(--space-unit) * 2);\n}\n\n.content-text {\n width: 100%;\n color: var(--color-default-text);\n font-size: var(--font-size-2);\n font-weight: var(--font-rg);\n letter-spacing: 0.16px;\n line-height: 1.4;\n}\n\n.action-button {\n color: var(--color-primary01);\n font-size: var(--font-size-1);\n font-weight: var(--font-sb);\n letter-spacing: 0.32px;\n line-height: 1.333;\n outline: none;\n}\n\n.action-button:focus-visible {\n box-shadow: var(--shadow-focus-primary);\n}\n\n.content-container + .close-button {\n margin-left: calc(var(--space-unit) * 2);\n}\n\n.close-button z-icon {\n fill: var(--color-primary01);\n}\n\n/* Tablet breakpoint */\n@media (min-width: 768px) {\n .content-container {\n flex-wrap: nowrap;\n }\n\n .content-text + .action-button {\n margin-left: calc(var(--space-unit) * 5);\n }\n}\n","import {Component, ComponentInterface, Event, EventEmitter, Host, Prop, h} from \"@stencil/core\";\nimport {NotificationType} from \"../../beans\";\n\n/**\n * Notification bar component.\n * @slot - The text of the notification.\n */\n@Component({\n tag: \"z-notification\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZNotification implements ComponentInterface {\n /** Name of the icon on the left of the content */\n @Prop()\n contenticonname?: string;\n\n /** Action button text */\n @Prop()\n actiontext?: string;\n\n /** Alert variant type */\n @Prop({reflect: true})\n type: NotificationType;\n\n /** Enable close icon */\n @Prop()\n showclose?: boolean = false;\n\n /**\n * Enable shadow.\n * @deprecated shadow is available only for the `sticky` version of the notification.\n */\n @Prop({reflect: true})\n showshadow?: boolean = false;\n\n /** Enable sticky notification bar. */\n @Prop({reflect: true})\n sticky?: boolean = false;\n\n /** Border position */\n @Prop({reflect: true})\n borderposition?: \"top\" | \"bottom\" = \"bottom\";\n\n /** Call to action clicked */\n @Event()\n notificationAction: EventEmitter;\n\n private handleActionButtonClick(e: MouseEvent): void {\n e.preventDefault();\n this.notificationAction.emit();\n }\n\n /** Close button clicked */\n @Event()\n notificationClose: EventEmitter;\n\n private handleCloseButtonClick(e: MouseEvent): void {\n e.preventDefault();\n this.notificationClose.emit();\n }\n\n constructor() {\n this.handleActionButtonClick = this.handleActionButtonClick.bind(this);\n this.handleCloseButtonClick = this.handleCloseButtonClick.bind(this);\n }\n\n render(): HTMLZNotificationElement {\n return (\n <Host>\n <div class=\"main-container\">\n {this.contenticonname && (\n <z-icon\n class=\"status-icon\"\n name={this.contenticonname}\n width={16}\n height={16}\n />\n )}\n <div class=\"content-container\">\n <div class=\"content-text\">\n <slot></slot>\n </div>\n {!!this.actiontext?.trim() && (\n <button\n class=\"action-button\"\n type=\"button\"\n onClick={this.handleActionButtonClick}\n >\n {this.actiontext}\n </button>\n )}\n </div>\n {this.showclose && (\n <button\n class=\"close-button\"\n type=\"button\"\n onClick={this.handleCloseButtonClick}\n >\n <z-icon\n name=\"multiply-circle\"\n width={16}\n height={16}\n />\n </button>\n )}\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/cjs/z-otp.cjs.entry.js CHANGED Viewed

@@ -1,7 +1,7 @@
 'use strict';
-var index = require('./index-DnscebL4.js');
-var index$1 = require('./index-wGaSHN1_.js');
+var index = require('./index-DY2I5wAY.js');
+var index$1 = require('./index-Cn7FFDHr.js');
 const stylesCss = () => `input:focus{box-shadow:var(--shadow-focus-primary);outline:none !important}:host{font-family:var(--font-family-sans);font-weight:var(--font-rg)}.digits-container{display:flex;justify-content:flex-start}input{width:calc(var(--space-unit) * 5);height:72px;box-sizing:border-box;padding:0;caret-color:transparent;color:var(--color-surface05);font-family:var(--font-family-sans);font-size:32px;font-weight:300;text-align:center}input.error{border:1px solid;border-color:var(--color-default-error);background-color:var(--color-inverse-error);border-radius:4px}input:not(:last-of-type){margin-right:var(--space-unit)}@media only screen and (min-width: 768px){input:not(:last-of-type){margin-right:calc(var(--space-unit) * 2)}}@media only screen and (min-width: 1025px){input{width:calc(var(--space-unit) * 6)}}`;
@@ -20,7 +20,7 @@ const ZOtp = class {
         this.otpRef = [...Array(this.inputNum)];
     }
     render() {
-        return (index.h("div", { key: '25929eacee727c90dbf664fa11638bb5cdb5823a', class: "otp-container" }, index.h("div", { key: '16d6b64ba2649781fcb359ddefd08d0553c9fcb5', class: "digits-container" }, this.otp.map((_val, i) => (index.h("input", { class: this.status == index$1.InputStatus.ERROR ? "error" : null, onKeyDown: (e) => {
+        return (index.h("div", { key: '82943f654f3601a203981bc476a5e58378604331', class: "otp-container" }, index.h("div", { key: '0e069bb23f23ff9e97bb094b3ccce57d5adeb1b1', class: "digits-container" }, this.otp.map((_val, i) => (index.h("input", { class: this.status == index$1.InputStatus.ERROR ? "error" : null, onKeyDown: (e) => {
                 if (e.keyCode > 47) {
                     this.otpRef[i].value = "";
                 }
@@ -33,9 +33,12 @@ const ZOtp = class {
             }, onInput: (e) => {
                 this.otp[i] = e.target.value;
                 this.emitInputChange(this.otp.join(""));
-            }, type: "text", minlength: "1", maxlength: "1", autoComplete: "off", ref: (el) => (this.otpRef[i] = el) })))), index.h("z-input-message", { key: '201125a3e3f5b0a3b53b170d4f0153188715c7db', message: this.message, status: this.status })));
+            }, type: "text", minlength: "1", maxlength: "1", autoComplete: "off", ref: (el) => (this.otpRef[i] = el) })))), index.h("z-input-message", { key: '752f2b63c997e9b6ff2e239537e15b1a1a2719c7', message: this.message, status: this.status })));
     }
 };
 ZOtp.style = stylesCss();
 exports.z_otp = ZOtp;
+//# sourceMappingURL=z-otp.entry.cjs.js.map
+//# sourceMappingURL=z-otp.cjs.entry.js.map

package/dist/cjs/z-otp.cjs.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"z-otp.cjs.entry.js","mappings":";;;;;AAAA,MAAM,SAAS,GAAG,MAAM,CAAC,oyBAAoyB,CAAC;;MCQjzB,IAAI,GAAA,MAAA;AALjB,IAAA,WAAA,CAAA,OAAA,EAAA;;;;AAQE,QAAA,IAAA,CAAA,QAAQ,GAAY,CAAC;AAiEtB;AA/CS,IAAA,eAAe,CAAC,KAAa,EAAA;QACnC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,EAAC,KAAK,EAAC,CAAC;;IAG9B,iBAAiB,GAAA;AACf,QAAA,IAAI,CAAC,GAAG,GAAG,CAAC,GAAG,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;AACpC,QAAA,IAAI,CAAC,MAAM,GAAG,CAAC,GAAG,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;;IAGzC,MAAM,GAAA;AACJ,QAAA,QACEA,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,eAAe,EAAA,EACxBA,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,kBAAkB,IAC1B,IAAI,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,MACpBA,mBACE,KAAK,EAAE,IAAI,CAAC,MAAM,IAAIC,mBAAW,CAAC,KAAK,GAAG,OAAO,GAAG,IAAI,EACxD,SAAS,EAAE,CAAC,CAAgB,KAAI;AAC9B,gBAAA,IAAI,CAAC,CAAC,OAAO,GAAG,EAAE,EAAE;oBAClB,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,KAAK,GAAG,EAAE;;AAE7B,aAAC,EACD,OAAO,EAAE,CAAC,CAAgB,KAAI;AAC5B,gBAAA,IAAI,CAAC,CAAC,OAAO,GAAG,EAAE,EAAE;oBAClB,IAAI,CAAC,GAAG,IAAI,CAAC,QAAQ,GAAG,CAAC,EAAE;wBACzB,IAAI,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,EAAE;;;AAGhC,aAAC,EACD,OAAO,EAAE,CAAC,CAAa,KAAI;gBACzB,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,GAAI,CAAC,CAAC,MAA2B,CAAC,KAAK;AAClD,gBAAA,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACzC,aAAC,EACD,IAAI,EAAC,MAAM,EACX,SAAS,EAAC,GAAG,EACb,SAAS,EAAC,GAAG,EACb,YAAY,EAAC,KAAK,EAClB,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC,EAAA,CAClC,CACH,CAAC,CACE,EACND,OAAA,CAAA,iBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,MAAM,EAAE,IAAI,CAAC,MAAM,EAAA,CACF,CACf;;;;;;;","names":["h","InputStatus"],"sources":["src/snowflakes/myz/z-otp/styles.css?tag=z-otp&encapsulation=shadow","src/snowflakes/myz/z-otp/index.tsx"],"sourcesContent":["input:focus {\n box-shadow: var(--shadow-focus-primary);\n outline: none !important;\n}\n\n:host {\n font-family: var(--font-family-sans);\n font-weight: var(--font-rg);\n}\n\n.digits-container {\n display: flex;\n justify-content: flex-start;\n}\n\ninput {\n width: calc(var(--space-unit) * 5);\n height: 72px;\n box-sizing: border-box;\n padding: 0;\n caret-color: transparent;\n color: var(--color-surface05);\n font-family: var(--font-family-sans);\n font-size: 32px;\n font-weight: 300;\n text-align: center;\n}\n\ninput.error {\n border: 1px solid;\n border-color: var(--color-default-error);\n background-color: var(--color-inverse-error);\n border-radius: 4px;\n}\n\ninput:not(:last-of-type) {\n margin-right: var(--space-unit);\n}\n\n/* Tablet breakpoint */\n@media only screen and (min-width: 768px) {\n input:not(:last-of-type) {\n margin-right: calc(var(--space-unit) * 2);\n }\n}\n\n/* Desktop breakpoint */\n@media only screen and (min-width: 1025px) {\n input {\n width: calc(var(--space-unit) * 6);\n }\n}\n","import {Component, ComponentInterface, Event, EventEmitter, Prop, h} from \"@stencil/core\";\nimport {InputStatus} from \"../../../beans\";\n\n@Component({\n tag: \"z-otp\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZOtp implements ComponentInterface {\n /** Input number */\n @Prop()\n inputNum?: number = 6;\n\n /** Input status */\n @Prop()\n status?: InputStatus;\n\n /** Input message */\n @Prop()\n message?: string;\n\n private otp: string[];\n\n private otpRef: HTMLInputElement[];\n\n /** Otp change event */\n @Event()\n otpChange: EventEmitter;\n\n private emitInputChange(value: string): void {\n this.otpChange.emit({value});\n }\n\n componentWillLoad(): void {\n this.otp = [...Array(this.inputNum)];\n this.otpRef = [...Array(this.inputNum)];\n }\n\n render(): HTMLDivElement {\n return (\n <div class=\"otp-container\">\n <div class=\"digits-container\">\n {this.otp.map((_val, i) => (\n <input\n class={this.status == InputStatus.ERROR ? \"error\" : null}\n onKeyDown={(e: KeyboardEvent) => {\n if (e.keyCode > 47) {\n this.otpRef[i].value = \"\";\n }\n }}\n onKeyUp={(e: KeyboardEvent) => {\n if (e.keyCode > 47) {\n if (i < this.inputNum - 1) {\n this.otpRef[i + 1].focus();\n }\n }\n }}\n onInput={(e: InputEvent) => {\n this.otp[i] = (e.target as HTMLInputElement).value;\n this.emitInputChange(this.otp.join(\"\"));\n }}\n type=\"text\"\n minlength=\"1\"\n maxlength=\"1\"\n autoComplete=\"off\"\n ref={(el) => (this.otpRef[i] = el)}\n />\n ))}\n </div>\n <z-input-message\n message={this.message}\n status={this.status}\n ></z-input-message>\n </div>\n );\n }\n}\n"],"version":3}

package/dist/cjs/z-pagination.cjs.entry.js CHANGED Viewed

@@ -1,7 +1,7 @@
 'use strict';
-var index = require('./index-DnscebL4.js');
-var index$1 = require('./index-wGaSHN1_.js');
+var index = require('./index-DY2I5wAY.js');
+var index$1 = require('./index-Cn7FFDHr.js');
 const stylesCss = () => `z-pagination{--z-pagination--page-button-width:64px;--z-pagination--pages-container-max-width:100%;--z-pagination-background-color:var(--color-background);--z-pagination-background-color-hover:var(--color-surface01);display:flex;max-width:100%;flex-flow:column wrap;font-family:var(--font-family-sans);font-weight:var(--font-rg);gap:calc(var(--space-unit) * 2) calc(var(--space-unit) * 4)}z-pagination,z-pagination *{box-sizing:border-box}z-pagination button{height:100%}z-pagination z-icon{fill:var(--color-primary01-icon)}z-pagination *:disabled z-icon{fill:var(--color-disabled03)}z-pagination .page-label{margin-right:calc(var(--space-unit) * 3);color:var(--color-default-text)}z-pagination .pagination-bar{display:flex;max-width:100%;height:48px;align-items:center}z-pagination .pagination-bar button{display:flex;align-items:center;justify-content:center;border:none;margin:0;background-color:var(--z-pagination-background-color);color:var(--color-primary01);cursor:pointer;font-family:inherit;font-weight:inherit;transition:background-color 0.15s ease-out,     color 0.15s ease-out,     border-bottom-color 0.15s ease-out,     font-size 0.15s ease-in-out,     font-weight 0.15s ease-in-out}z-pagination .pagination-bar button:focus-visible{background-color:var(--color-surface01);outline:none}z-pagination .pagination-bar .pagination-button{padding:calc(var(--space-unit) * 2);font-weight:var(--font-sb);text-transform:uppercase;white-space:nowrap}z-pagination .pagination-bar .navigation-button{padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 1.5)}z-pagination .pagination-bar .pagination-button:disabled,z-pagination .pagination-bar .navigation-button:disabled{color:var(--color-disabled03);cursor:default;fill:var(--color-disabled03);pointer-events:none}z-pagination .pagination-bar .page-button,z-pagination .pagination-bar .ellipsis-button{width:var(--z-pagination--page-button-width)}z-pagination .pages-container{position:relative;display:inline-flex;max-width:100%;height:100%;overflow-x:auto;scroll-behavior:smooth;scroll-snap-align:center;scrollbar-width:none}z-pagination .pages-container::-webkit-scrollbar{display:none}z-pagination .pages-chunk{display:flex;scroll-snap-align:center}z-pagination .pagination-bar .page-button{padding-top:var(--border-size-large) solid transparent;border-bottom:var(--border-size-large) solid transparent;font-size:var(--font-size-2);font-weight:var(--font-sb)}z-pagination .pagination-bar .page-button[data-current]{border-bottom-color:var(--color-primary01);font-size:var(--font-size-7)}z-pagination .go-to-page{display:flex;flex-direction:column}z-pagination .go-to-page .inputs{display:flex;column-gap:var(--space-unit)}z-pagination .go-to-page .inputs z-input{width:calc(var(--space-unit) * 11)}z-pagination .go-to-page .inputs z-input input,z-pagination .mobile-go-to-page z-input input{padding:0 calc(var(--space-unit) * 1.5) !important;appearance:none}z-pagination .mobile-go-to-page{display:flex;height:100%;flex:1 auto;align-items:center;justify-content:center;background-color:var(--color-surface02)}z-pagination .mobile-go-to-page z-input{width:var(--z-pagination--page-button-width);margin-right:var(--space-unit)}z-pagination .mobile-go-to-page z-input input{text-align:center}z-pagination .mobile-go-to-page z-input input::-webkit-outer-spin-button,z-pagination .mobile-go-to-page z-input input::-webkit-inner-spin-button{appearance:none}z-pagination .mobile-go-to-page>span{font-size:var(--font-size-2)}@media (hover: hover){z-pagination .pagination-bar button:hover{background-color:var(--z-pagination-background-color-hover)}z-pagination .pagination-bar .page-button:hover{border-bottom-color:var(--color-hover-primary);color:var(--color-hover-primary)}}@media (min-width: 768px){z-pagination{--z-pagination--page-button-width:88px;flex-direction:row;align-items:flex-end}z-pagination .pages-container{max-width:var(--z-pagination--pages-container-max-width)}}`;
@@ -236,3 +236,6 @@ const ZPagination = class {
 ZPagination.style = stylesCss();
 exports.z_pagination = ZPagination;
+//# sourceMappingURL=z-pagination.entry.cjs.js.map
+//# sourceMappingURL=z-pagination.cjs.entry.js.map

package/dist/cjs/z-pagination.cjs.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"z-pagination.cjs.entry.js","mappings":";;;;;AAAA,MAAM,SAAS,GAAG,MAAM,CAAC,u2HAAu2H,CAAC;;MCsBp3H,WAAW,GAAA,MAAA;AAJxB,IAAA,WAAA,CAAA,OAAA,EAAA;;;;AAaE,QAAA,IAAA,CAAA,SAAS,GAAG,IAAI;;AAQhB,QAAA,IAAA,CAAA,IAAI,GAAG,CAAC;;AAIR,QAAA,IAAA,CAAA,KAAK,GAAG,KAAK;;AAYb,QAAA,IAAA,CAAA,WAAW,GAAG,CAAC;AAMf;;;;;AAKG;AAEK,QAAA,IAAA,CAAA,aAAa,GAAG,IAAI,CAAC,YAAY;;AAIzC,QAAA,IAAA,CAAA,QAAQ,GAAG,KAAK;;AAIhB,QAAA,IAAA,CAAA,aAAa,GAAG,IAAI;AAiZrB;AA3YC;;AAEG;IAEH,sBAAsB,GAAA;QACpB,IAAI,CAAC,IAAI,CAAC,aAAa,IAAI,IAAI,CAAC,KAAK,EAAE;YACrC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,2CAA2C,EAAE,MAAM,CAAC;YAEhF;;QAGF,MAAM,mBAAmB,GAAG,MAAM,CAAC,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC;QAC9D,MAAM,eAAe,GAAG,mBAAmB,CAAC,gBAAgB,CAAC,mCAAmC,CAAC;AACjG,QAAA,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,WAAW,CACzB,2CAA2C,EAC3C,CAAA,KAAA,EAAQ,eAAe,CAAA,GAAA,EAAM,IAAI,CAAC,aAAa,CAAA,CAAA,CAAG,CACnD;;AAGH;;;;AAIG;IAEH,eAAe,GAAA;AACb,QAAA,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC,UAAU,EAAE,IAAI,CAAC,UAAU,CAAC;;AAGtF;;;AAGG;IAEH,aAAa,GAAA;QACX,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC;QACvC,IAAI,CAAC,YAAY,EAAE;;AAGrB;;;AAGG;IAEH,cAAc,GAAA;AACZ,QAAA,IAAI,IAAI,CAAC,KAAK,EAAE;AACd,YAAA,IAAI,CAAC,KAAK,GAAG,KAAK;;;AAItB;;AAEG;IAEH,QAAQ,GAAA;QACN,IAAI,CAAC,SAAS,EAAE;;AAGlB;;AAEG;IACK,SAAS,GAAA;QACf,MAAM,gBAAgB,GAAG,+BAA+B;QACxD,IAAI,CAAC,QAAQ,GAAG,MAAM,CAAC,UAAU,CAAC,gBAAgB,CAAC,CAAC,OAAO;;AAG7D;;;AAGG;IACK,cAAc,GAAA;;QAEpB,MAAM,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,EAAC,MAAM,EAAE,IAAI,CAAC,UAAU,EAAC,EAAE,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;QAEpE,MAAM,MAAM,GAAG,EAAE;AACjB,QAAA,MAAM,WAAW,GAAG,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC,aAAa,CAAC;AAChE,QAAA,KAAK,IAAI,KAAK,GAAG,CAAC,EAAE,KAAK,GAAG,WAAW,EAAE,KAAK,EAAE,EAAE;YAChD,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,GAAG,IAAI,CAAC,aAAa,EAAE,CAAC,KAAK,GAAG,CAAC,IAAI,IAAI,CAAC,aAAa,CAAC,CAAC;;AAGxF,QAAA,OAAO,MAAM;;AAGf;;AAEG;IACK,YAAY,GAAA;;QAClB,MAAM,SAAS,GAAG,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,kBAAkB,CAAgB;AAC5E,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,CAAA,YAAA,EAAe,IAAI,CAAC,WAAW,CAAA,EAAA,CAAI,CAAgB;QAC3F,MAAM,MAAM,GAAG,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,oBAAoB,CAAgB;AAE3E,QAAA,IAAI,CAAC,OAAO,IAAI,CAAC,SAAS,EAAE;YAC1B;;QAGF,MAAM,cAAc,GAAG,SAAS,CAAC,qBAAqB,EAAE,CAAC,KAAK;QAC9D,MAAM,YAAY,GAAG,OAAO,CAAC,qBAAqB,EAAE,CAAC,KAAK;AAC1D,QAAA,MAAM,WAAW,GAAG,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,MAAM,aAAN,MAAM,KAAA,MAAA,GAAA,MAAA,GAAN,MAAM,CAAE,qBAAqB,EAAE,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,KAAK,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,CAAC;AAE/D,QAAA,SAAS,CAAC,UAAU,GAAG,IAAI,CAAC,WAAW,GAAG,YAAY,GAAG,WAAW,GAAG,cAAc,GAAG,CAAC;;AAG3F;;;;AAIG;AACK,IAAA,UAAU,CAAC,IAAI,EAAA;QACrB,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC,CAAC,EAAE,IAAI,CAAC,UAAU,CAAC;;AAGjE;;;;AAIG;AACK,IAAA,UAAU,CAAC,IAAI,EAAA;AACrB,QAAA,QACEA,OAAA,CAAA,QAAA,EAAA,EACE,KAAK,EAAC,aAAa,EACnB,IAAI,EAAC,QAAQ,EAAA,cAAA,EACC,IAAI,CAAC,WAAW,KAAK,IAAI,GAAG,MAAM,GAAG,OAAO,EAC1D,KAAK,EAAE,CAAA,gBAAA,EAAmB,IAAI,CAAA,CAAE,EAAA,WAAA,EACrB,IAAI,EAAA,cAAA,EACD,IAAI,CAAC,WAAW,KAAK,IAAI,EACvC,OAAO,EAAE,MAAM,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,EAAA,EAEnC,IAAI,CACE;;AAIb;;;;AAIG;AACK,IAAA,oBAAoB,CAAC,IAAI,EAAA;AAC/B,QAAA,QACEA,OAAA,CAAA,QAAA,EAAA,EACE,KAAK,EAAC,iBAAiB,EACvB,IAAI,EAAC,QAAQ,EACb,KAAK,EAAE,CAAA,gBAAA,EAAmB,IAAI,CAAA,CAAE,EAChC,OAAO,EAAE,MAAM,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,EAAA,EAAA,QAAA,CAG7B;;AAIb;;;AAGG;IACK,WAAW,GAAA;AACjB,QAAA,MAAM,WAAW,GAAG,IAAI,CAAC,cAAc,EAAE;AACzC,QAAA,IAAI,WAAW,CAAC,MAAM,IAAI,CAAC,EAAE;YAC3B;;AAGF,QAAA,OAAO,WAAW,CAAC,GAAG,CAAC,CAAC,KAAK,KAAKA,OAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAC,aAAa,IAAE,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,KAAK,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC,CAAO,CAAC;;AAGhH;;;AAGG;IACK,gBAAgB,GAAA;;AAEtB,QAAA,IAAI,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,KAAK,GAAG,CAAC,GAAG,CAAC,EAAE;;AAEzC,YAAA,OAAO,KAAK,CAAC,IAAI,CAAC,EAAC,MAAM,EAAE,IAAI,CAAC,UAAU,EAAC,EAAE,CAAC,CAAC,EAAE,CAAC,KAAK,IAAI,CAAC,UAAU,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC;;AAGhF,QAAA,IAAI,IAAI,CAAC,WAAW,IAAI,IAAI,CAAC,KAAK,GAAG,CAAC,GAAG,CAAC,EAAE;;YAE1C,OAAO;AACL,gBAAA,GAAG,KAAK,CAAC,IAAI,CAAC,EAAC,MAAM,EAAE,IAAI,CAAC,KAAK,GAAG,CAAC,GAAG,CAAC,EAAC,EAAE,CAAC,CAAC,EAAE,CAAC,KAAK,IAAI,CAAC,UAAU,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC;gBAC7E,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,KAAK,GAAG,CAAC,GAAG,CAAC,CAAC;AAC7C,gBAAA,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,UAAU,CAAC;aACjC;;AAGH,QAAA,IAAI,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,KAAK,GAAG,CAAC,GAAG,CAAC,IAAI,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,KAAK,GAAG,CAAC,GAAG,CAAC,EAAE;;YAEpG,OAAO;AACL,gBAAA,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC;AAClB,gBAAA,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,KAAK,GAAG,CAAC,CAAC;AAC5D,gBAAA,GAAG,KAAK,CAAC,IAAI,CAAC,EAAC,MAAM,EAAE,IAAI,CAAC,KAAK,GAAG,CAAC,GAAG,CAAC,EAAC,EAAE,CAAC,CAAC,EAAE,CAAC,KAAK,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC;AACzG,gBAAA,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,KAAK,GAAG,CAAC,CAAC;AAC5D,gBAAA,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,UAAU,CAAC;aACjC;;;QAIH,OAAO;AACL,YAAA,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC;AAClB,YAAA,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,KAAK,GAAG,CAAC,GAAG,CAAC,CAAC;AAC/D,YAAA,GAAG,KAAK,CAAC,IAAI,CAAC,EAAC,MAAM,EAAE,IAAI,CAAC,KAAK,GAAG,CAAC,GAAG,CAAC,EAAC,EAAE,CAAC,CAAC,EAAE,CAAC,KAAK,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,KAAK,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC;SACjH;;IAGK,gBAAgB,GAAA;QACtB,QACEA,OAAA,CAAA,QAAA,EAAA,EACE,KAAK,EAAC,mBAAmB,EACzB,IAAI,EAAC,QAAQ,EAAA,YAAA,EACF,4BAA4B,EACvC,KAAK,EAAC,4BAA4B,EAClC,QAAQ,EAAE,IAAI,CAAC,WAAW,KAAK,CAAC,EAChC,OAAO,EAAE,MAAM,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,WAAW,GAAG,CAAC,CAAC,EAAA,EAEpDA,OAAA,CAAA,QAAA,EAAA,EAAQ,IAAI,EAAC,cAAc,EAAA,CAAU,CAC9B;;IAIL,mBAAmB,GAAA;AACzB,QAAA,QACEA,OAAA,CAAA,QAAA,EAAA,EACE,KAAK,EAAC,mBAAmB,EACzB,IAAI,EAAC,QAAQ,EAAA,YAAA,EACF,0BAA0B,EACrC,KAAK,EAAC,0BAA0B,EAChC,QAAQ,EAAE,IAAI,CAAC,WAAW,KAAK,IAAI,CAAC,UAAU,EAC9C,OAAO,EAAE,MAAM,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,WAAW,GAAG,CAAC,CAAC,EAAA,EAEpDA,OAAA,CAAA,QAAA,EAAA,EAAQ,IAAI,EAAC,eAAe,EAAA,CAAU,CAC/B;;IAIL,YAAY,GAAA;AAClB,QAAA,MAAM,WAAW,GAAG,IAAI,CAAC,cAAc,EAAE;QAEzC,OAAO;AACL,YAAA,IAAI,CAAC,KAAK,IAAIA,OAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAC,sBAAsB,EAAA,EAAE,IAAI,CAAC,KAAK,CAAQ;AAEpE,YAAAA,OAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAC,gBAAgB,EAAA,EACxB,IAAI,CAAC,gBAAgB,EAAE,EAEvB,CAAC,IAAI,CAAC,QAAQ,KACbA,OAAA,CAAA,KAAA,EAAA,EACE,KAAK,EAAC,iBAAiB,EACvB,IAAI,EAAC,YAAY,EACjB,QAAQ,EAAE,EAAE,IAEX,WAAW,CAAC,MAAM,GAAG,CAAC;gBACrB,WAAW,CAAC,GAAG,CAAC,CAAC,KAAK,KAAKA,OAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAC,aAAa,EAAA,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,KAAK,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC,CAAO,CAAC,CACrG,CACP,EAEA,IAAI,CAAC,QAAQ,KACZA,kBACE,KAAK,EAAC,mBAAmB,EACzB,QAAQ,EAAE,CAAC,EAAE,KAAI;oBACf,EAAE,CAAC,cAAc,EAAE;AACnB,oBAAA,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,aAAa,CAAC;AACrC,iBAAC,EAAA,EAEDA,OAAA,CAAA,SAAA,EAAA,EACE,KAAK,EAAC,kBAAkB,EACxB,IAAI,EAAEC,iBAAS,CAAC,MAAM,EACtB,GAAG,EAAE,CAAC,EACN,GAAG,EAAE,IAAI,CAAC,UAAU,EACpB,OAAO,EAAE,KAAK,EACd,OAAO,EAAE,CAAC,EAAc,KAAI;oBAC1B,IAAI,CAAC,aAAa,GAAI,EAAE,CAAC,MAA4B,CAAC,KAAK;AAC7D,iBAAC,EACD,WAAW,EAAE,IAAI,CAAC,WAAW,CAAC,QAAQ,EAAE,EACxC,YAAY,EAAE,KAAK,EAAA,CACV,EACXD,OAAA,CAAA,MAAA,EAAA,IAAA,EAAO,CAAA,CAAA,EAAI,IAAI,CAAC,UAAU,CAAA,CAAE,CAAQ,CAC/B,CACR,EAEA,IAAI,CAAC,mBAAmB,EAAE,CACvB;SACP;;IAGH,gBAAgB,GAAA;QACd,IAAI,CAAC,eAAe,EAAE;;IAGxB,kBAAkB,GAAA;AAChB,QAAA,IAAI,IAAI,CAAC,KAAK,EAAE;AACd,YAAA,IAAI,CAAC,KAAK,GAAG,KAAK;;QAGpB,IAAI,CAAC,sBAAsB,EAAE;QAC7B,IAAI,CAAC,SAAS,EAAE;QAChB,IAAI,CAAC,YAAY,EAAE;;IAGrB,MAAM,GAAA;AACJ,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,OAAOA,OAAA,CAACE,UAAI,EAAA,IAAA,EAAE,IAAI,CAAC,YAAY,EAAE,CAAQ;;QAG3C,QACEF,QAACE,UAAI,EAAA,IAAA,EACHF,OAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAC,gBAAgB,EAAA,EACxB,IAAI,CAAC,KAAK,IAAIA,OAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAC,sBAAsB,EAAA,EAAE,IAAI,CAAC,KAAK,CAAQ,EAEpE,IAAI,CAAC,KAAK,KACTA,OAAA,CAAA,QAAA,EAAA,EACE,KAAK,EAAC,mBAAmB,EACzB,IAAI,EAAC,QAAQ,EACb,KAAK,EAAC,mBAAmB,EACzB,QAAQ,EAAE,IAAI,CAAC,WAAW,KAAK,CAAC,EAChC,OAAO,EAAE,MAAM,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,eAG1B,CACV,EAEA,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,IAAI,GAAG,CAAC,KAC3CA,OAAA,CAAA,QAAA,EAAA,EACE,KAAK,EAAC,mBAAmB,EACzB,IAAI,EAAC,QAAQ,EACb,KAAK,EAAE,CAAA,gBAAA,EAAmB,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,IAAI,EAAE,EACxD,QAAQ,EAAE,IAAI,CAAC,WAAW,IAAI,IAAI,CAAC,IAAI,EACvC,OAAO,EAAE,MAAM,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,IAAI,CAAC,EAAA,OAE1D,IAAI,CAAC,IAAI,CACJ,CACV,EAEA,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,gBAAgB,EAAE,EAE1CA,OAAA,CAAA,KAAA,EAAA,EACE,KAAK,EAAC,iBAAiB,EACvB,IAAI,EAAC,YAAY,EACjB,QAAQ,EAAE,EAAE,IAEX,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,gBAAgB,EAAE,GAAG,IAAI,CAAC,WAAW,EAAE,CACtD,EAEL,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,mBAAmB,EAAE,EAE5C,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,IAAI,GAAG,CAAC,KAC3CA,OAAA,CAAA,QAAA,EAAA,EACE,KAAK,EAAC,mBAAmB,EACzB,IAAI,EAAC,QAAQ,EACb,KAAK,EAAE,CAAA,gBAAA,EAAmB,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,IAAI,CAAA,CAAE,EACxD,QAAQ,EAAE,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,IAAI,EACxD,OAAO,EAAE,MAAM,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,IAAI,CAAC,EAAA,OAE1D,IAAI,CAAC,IAAI,CACJ,CACV,EAEA,IAAI,CAAC,KAAK,KACTA,OAAA,CAAA,QAAA,EAAA,EACE,KAAK,EAAC,mBAAmB,EACzB,IAAI,EAAC,QAAQ,EACb,KAAK,EAAE,CAAA,gBAAA,EAAmB,IAAI,CAAC,UAAU,EAAE,EAC3C,QAAQ,EAAE,IAAI,CAAC,WAAW,KAAK,IAAI,CAAC,UAAU,EAC9C,OAAO,EAAE,MAAM,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,UAAU,CAAC,EAAA,aAEvC,IAAI,CAAC,UAAU,CAChB,CACV,CACG,EACL,IAAI,CAAC,QAAQ,KACZA,OAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAC,YAAY,EAAA,EACrBA,OAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAC,mBAAmB,EAAA,EAAA,eAAA,CAAqB,EACpDA,OAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAC,QAAQ,EAAA,EACjBA,OAAA,CAAA,SAAA,EAAA,EACE,KAAK,EAAC,kBAAkB,EACxB,IAAI,EAAEC,iBAAS,CAAC,MAAM,EACtB,GAAG,EAAE,CAAC,EACN,GAAG,EAAE,IAAI,CAAC,UAAU,EACpB,OAAO,EAAE,KAAK,EACd,WAAW,EAAC,GAAG,EACf,YAAY,EAAE,KAAK,EACnB,OAAO,EAAE,CAAC,EAAc,KAAI;gBAC1B,IAAI,CAAC,aAAa,GAAI,EAAE,CAAC,MAA4B,CAAC,KAAK;AAC7D,aAAC,EACD,SAAS,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,GAAG,KAAK,OAAO,IAAI,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,aAAa,CAAC,EAAA,CACnE,EACXD,OAAA,CAAA,UAAA,EAAA,EACE,QAAQ,EAAE,CAAC,IAAI,CAAC,aAAa,EAC7B,KAAK,EAAC,0BAA0B,EAChC,OAAO,EAAE,MAAM,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,aAAa,CAAC,EAAA,EAAA,KAAA,CAGzC,CACP,CACF,CACP,CACI;;;;;;;;;;;;;;;;;;;;;;","names":["h","InputType","Host"],"sources":["src/components/z-pagination/styles.css?tag=z-pagination","src/components/z-pagination/index.tsx"],"sourcesContent":["z-pagination {\n /**\n * @prop --z-pagination--page-button-width: Width of the pagination's page buttons. The default is 64px on mobile and 88px on desktop.\n * @prop --z-pagination--pages-container-max-width: Max width of the container of the page buttons. The default is 100% (full width).\n * @prop --z-pagination-background-color: Background of the pagination's tabs. The default is --color-background\n * @prop --z-pagination-background-color-hover: Background of the pagination's tabs on hover. The default is --color-surface01\n */\n --z-pagination--page-button-width: 64px;\n --z-pagination--pages-container-max-width: 100%;\n --z-pagination-background-color: var(--color-background);\n --z-pagination-background-color-hover: var(--color-surface01);\n\n display: flex;\n max-width: 100%;\n flex-flow: column wrap;\n font-family: var(--font-family-sans);\n font-weight: var(--font-rg);\n gap: calc(var(--space-unit) * 2) calc(var(--space-unit) * 4);\n}\n\nz-pagination,\nz-pagination * {\n box-sizing: border-box;\n}\n\nz-pagination button {\n height: 100%;\n}\n\nz-pagination z-icon {\n fill: var(--color-primary01-icon);\n}\n\nz-pagination *:disabled z-icon {\n fill: var(--color-disabled03);\n}\n\nz-pagination .page-label {\n margin-right: calc(var(--space-unit) * 3);\n color: var(--color-default-text);\n}\n\nz-pagination .pagination-bar {\n display: flex;\n max-width: 100%;\n height: 48px;\n align-items: center;\n}\n\nz-pagination .pagination-bar button {\n display: flex;\n align-items: center;\n justify-content: center;\n border: none;\n margin: 0;\n background-color: var(--z-pagination-background-color);\n color: var(--color-primary01);\n cursor: pointer;\n font-family: inherit;\n font-weight: inherit;\n transition:\n background-color 0.15s ease-out,\n color 0.15s ease-out,\n border-bottom-color 0.15s ease-out,\n font-size 0.15s ease-in-out,\n font-weight 0.15s ease-in-out;\n}\n\nz-pagination .pagination-bar button:focus-visible {\n background-color: var(--color-surface01);\n outline: none;\n}\n\nz-pagination .pagination-bar .pagination-button {\n padding: calc(var(--space-unit) * 2);\n font-weight: var(--font-sb);\n text-transform: uppercase;\n white-space: nowrap;\n}\n\nz-pagination .pagination-bar .navigation-button {\n padding: calc(var(--space-unit) * 2) calc(var(--space-unit) * 1.5);\n}\n\nz-pagination .pagination-bar .pagination-button:disabled,\nz-pagination .pagination-bar .navigation-button:disabled {\n color: var(--color-disabled03);\n cursor: default;\n fill: var(--color-disabled03);\n pointer-events: none;\n}\n\nz-pagination .pagination-bar .page-button,\nz-pagination .pagination-bar .ellipsis-button {\n width: var(--z-pagination--page-button-width);\n}\n\nz-pagination .pages-container {\n position: relative;\n display: inline-flex;\n max-width: 100%;\n height: 100%;\n overflow-x: auto;\n scroll-behavior: smooth;\n scroll-snap-align: center;\n\n /* hide scrollbar in Firefox */\n scrollbar-width: none;\n}\n\nz-pagination .pages-container::-webkit-scrollbar {\n display: none;\n}\n\nz-pagination .pages-chunk {\n display: flex;\n scroll-snap-align: center;\n}\n\nz-pagination .pagination-bar .page-button {\n padding-top: var(--border-size-large) solid transparent;\n border-bottom: var(--border-size-large) solid transparent;\n font-size: var(--font-size-2);\n font-weight: var(--font-sb);\n}\n\nz-pagination .pagination-bar .page-button[data-current] {\n border-bottom-color: var(--color-primary01);\n font-size: var(--font-size-7);\n}\n\nz-pagination .go-to-page {\n display: flex;\n flex-direction: column;\n}\n\nz-pagination .go-to-page .inputs {\n display: flex;\n column-gap: var(--space-unit);\n}\n\nz-pagination .go-to-page .inputs z-input {\n width: calc(var(--space-unit) * 11);\n}\n\nz-pagination .go-to-page .inputs z-input input,\nz-pagination .mobile-go-to-page z-input input {\n padding: 0 calc(var(--space-unit) * 1.5) !important;\n appearance: none;\n}\n\nz-pagination .mobile-go-to-page {\n display: flex;\n height: 100%;\n flex: 1 auto;\n align-items: center;\n justify-content: center;\n background-color: var(--color-surface02);\n}\n\nz-pagination .mobile-go-to-page z-input {\n width: var(--z-pagination--page-button-width);\n margin-right: var(--space-unit);\n}\n\nz-pagination .mobile-go-to-page z-input input {\n text-align: center;\n}\n\nz-pagination .mobile-go-to-page z-input input::-webkit-outer-spin-button,\nz-pagination .mobile-go-to-page z-input input::-webkit-inner-spin-button {\n appearance: none;\n}\n\nz-pagination .mobile-go-to-page > span {\n font-size: var(--font-size-2);\n}\n\n@media (hover: hover) {\n z-pagination .pagination-bar button:hover {\n background-color: var(--z-pagination-background-color-hover);\n }\n\n z-pagination .pagination-bar .page-button:hover {\n border-bottom-color: var(--color-hover-primary);\n color: var(--color-hover-primary);\n }\n}\n\n@media (min-width: 768px) {\n z-pagination {\n --z-pagination--page-button-width: 88px;\n\n flex-direction: row;\n align-items: flex-end;\n }\n\n z-pagination .pages-container {\n max-width: var(--z-pagination--pages-container-max-width);\n }\n}\n","import {\n Component,\n ComponentInterface,\n Element,\n Event,\n EventEmitter,\n Host,\n Listen,\n Prop,\n State,\n Watch,\n h,\n} from \"@stencil/core\";\nimport {InputType} from \"../../beans\";\n\n/**\n * Pagination bar component.\n */\n@Component({\n tag: \"z-pagination\",\n styleUrl: \"styles.css\",\n})\nexport class ZPagination implements ComponentInterface {\n @Element() host: HTMLZPaginationElement;\n\n /** Pagination label placed before the bar. */\n @Prop()\n label?: string;\n\n /** Enable navigation arrows. */\n @Prop()\n navArrows = true;\n\n /** Total number of pages. Required. */\n @Prop()\n totalPages!: number;\n\n /** Number of pages to skip. */\n @Prop()\n skip = 0;\n\n /** Enable buttons to go to the first and last pages. */\n @Prop()\n edges = false;\n\n /** Number of pages to show left/right of the current, before showing \"load more\" symbol (…). */\n @Prop()\n split?: number;\n\n /** Number of pages to show at a time. If not set, all pages will be shown. */\n @Prop()\n visiblePages?: number;\n\n /** Current page. */\n @Prop({mutable: true})\n currentPage = 1;\n\n /** Whether to show \"go to page\" feature. */\n @Prop()\n goToPage: boolean;\n\n /**\n * Internal visible pages variable.\n * Needed to better handle conflicting props like `visiblePages` and `split`.\n * This state will change based on props values and validation,\n * keeping original `visiblePages` value intact.\n */\n @State()\n private _visiblePages = this.visiblePages;\n\n /** Used to hides/change some functionalities on smaller screen sizes */\n @State()\n isMobile = false;\n\n /** Value of the go to page input */\n @State()\n goToPageValue = null;\n\n /** Event emitted when the current page has changed. */\n @Event()\n pageChanged: EventEmitter;\n\n /**\n * Set the max width of the pages container.\n */\n @Watch(\"_visiblePages\")\n setPagesContainerWidth(): void {\n if (!this._visiblePages || this.split) {\n this.host.style.setProperty(\"--z-pagination--pages-container-max-width\", \"100%\");\n\n return;\n }\n\n const pagesContainerStyle = window.getComputedStyle(this.host);\n const pageButtonWidth = pagesContainerStyle.getPropertyValue(\"--z-pagination--page-button-width\");\n this.host.style.setProperty(\n \"--z-pagination--pages-container-max-width\",\n `calc(${pageButtonWidth} * ${this._visiblePages})`\n );\n }\n\n /**\n * Set visible pages.\n * Ensure that the visible pages are always <= the total pages.\n * If `visiblePages` isn't set, fallback to the total pages.\n */\n @Watch(\"visiblePages\")\n setVisiblePages(): void {\n this._visiblePages = Math.min(this.visiblePages || this.totalPages, this.totalPages);\n }\n\n /**\n * On page changed.\n * @emits pageChanged\n */\n @Watch(\"currentPage\")\n onPageChanged(): void {\n this.pageChanged.emit(this.currentPage);\n this.scrollToPage();\n }\n\n /**\n * On split changed.\n * Empty `edges` value. The split feature wins over the pages chunks and edges.\n */\n @Watch(\"split\")\n onSplitChanged(): void {\n if (this.split) {\n this.edges = false;\n }\n }\n\n /**\n * Hide stuff on mobile.\n */\n @Listen(\"resize\", {target: \"window\", passive: true})\n onResize(): void {\n this.setMobile();\n }\n\n /**\n * Set functionalities according to screen size.\n */\n private setMobile(): void {\n const mobileMediaQuery = \"screen and (max-width: 767px)\";\n this.isMobile = window.matchMedia(mobileMediaQuery).matches;\n }\n\n /**\n * Get a list of pages chunks, each of `visiblePages` length.\n * @returns {number[][]}\n */\n private getPagesChunks(): number[][] {\n // array of numbers from 1 to `totalPages`\n const pages = Array.from({length: this.totalPages}, (_, i) => i + 1);\n\n const chunks = [];\n const chunksCount = Math.ceil(pages.length / this._visiblePages);\n for (let index = 0; index < chunksCount; index++) {\n chunks.push(pages.slice(index * this._visiblePages, (index + 1) * this._visiblePages));\n }\n\n return chunks;\n }\n\n /**\n * Scroll to the left the chunk of pages containing the current page.\n */\n private scrollToPage(): void {\n const container = this.host.querySelector(\".pages-container\") as HTMLElement;\n const pageBtn = this.host.querySelector(`[data-page=\"${this.currentPage}\"]`) as HTMLElement;\n const navBtn = this.host.querySelector(\".navigation-button\") as HTMLElement;\n\n if (!pageBtn || !container) {\n return;\n }\n\n const containerWidth = container.getBoundingClientRect().width;\n const pageBtnWidth = pageBtn.getBoundingClientRect().width;\n const navBtnWidth = navBtn?.getBoundingClientRect()?.width ?? 0;\n\n container.scrollLeft = this.currentPage * pageBtnWidth - navBtnWidth - containerWidth / 2;\n }\n\n /**\n * Select a page.\n * Do validations on the passed value before assigning it to `currentPage`.\n * @param {number} page Page number to set\n */\n private selectPage(page): void {\n this.currentPage = Math.min(Math.max(page, 1), this.totalPages);\n }\n\n /**\n * Render page number button.\n * @param {number} page Page number to render\n * @returns {HTMLButtonElement}\n */\n private renderPage(page): HTMLButtonElement {\n return (\n <button\n class=\"page-button\"\n type=\"button\"\n aria-current={this.currentPage === page ? \"page\" : \"false\"}\n title={`Vai alla pagina ${page}`}\n data-page={page}\n data-current={this.currentPage === page}\n onClick={() => this.selectPage(page)}\n >\n {page}\n </button>\n );\n }\n\n /**\n * Render split button.\n * @param {number} page Page to select on click.\n * @returns {HTMLButtonElement}\n */\n private renderEllipsisButton(page): HTMLButtonElement {\n return (\n <button\n class=\"ellipsis-button\"\n type=\"button\"\n title={`Vai alla pagina ${page}`}\n onClick={() => this.selectPage(page)}\n >\n …\n </button>\n );\n }\n\n /**\n * Render chunked page buttons.\n * @returns {HTMLDivElement[]}\n */\n private renderPages(): HTMLDivElement[] {\n const pagesChunks = this.getPagesChunks();\n if (pagesChunks.length <= 0) {\n return;\n }\n\n return pagesChunks.map((chunk) => <div class=\"pages-chunk\">{chunk.map((page) => this.renderPage(page))}</div>);\n }\n\n /**\n * Render page buttons when split feature is enabled.\n * @returns {HTMLButtonElement[]}\n */\n private renderSplitPages(): HTMLButtonElement[] {\n // left and right split pages, current page, first and last page, left and right ellipsis button\n if (this.totalPages <= this.split * 2 + 5) {\n // Too few pages: ellipsis will never be rendered, so let's just render all pages and that's it.\n return Array.from({length: this.totalPages}, (_, i) => this.renderPage(i + 1));\n }\n\n if (this.currentPage <= this.split * 2 + 2) {\n // Render first (2 * split + 3) pages, ellipsis, then last page.\n return [\n ...Array.from({length: this.split * 2 + 3}, (_, i) => this.renderPage(i + 1)),\n this.renderEllipsisButton(this.split * 2 + 4),\n this.renderPage(this.totalPages),\n ];\n }\n\n if (this.currentPage > this.split * 2 + 2 && this.currentPage < this.totalPages - this.split * 2 - 1) {\n // Render first page, ellipsis, current page surrounded by (split) pages both before and after, another ellipsis, then last page.\n return [\n this.renderPage(1),\n this.renderEllipsisButton(this.currentPage - this.split - 1),\n ...Array.from({length: this.split * 2 + 1}, (_, i) => this.renderPage(this.currentPage - this.split + i)),\n this.renderEllipsisButton(this.currentPage + this.split + 1),\n this.renderPage(this.totalPages),\n ];\n }\n\n // Render first page, ellipsis, then last (2 * split + 3) pages.\n return [\n this.renderPage(1),\n this.renderEllipsisButton(this.totalPages - this.split * 2 - 3),\n ...Array.from({length: this.split * 2 + 3}, (_, i) => this.renderPage(this.totalPages - this.split * 2 - 2 + i)),\n ];\n }\n\n private renderBackButton(): HTMLButtonElement {\n return (\n <button\n class=\"navigation-button\"\n type=\"button\"\n aria-label=\"Vai alla pagina precedente\"\n title=\"Vai alla pagina precedente\"\n disabled={this.currentPage === 1}\n onClick={() => this.selectPage(this.currentPage - 1)}\n >\n <z-icon name=\"chevron-left\"></z-icon>\n </button>\n );\n }\n\n private renderForwardButton(): HTMLButtonElement {\n return (\n <button\n class=\"navigation-button\"\n type=\"button\"\n aria-label=\"Vai alla prossima pagina\"\n title=\"Vai alla prossima pagina\"\n disabled={this.currentPage === this.totalPages}\n onClick={() => this.selectPage(this.currentPage + 1)}\n >\n <z-icon name=\"chevron-right\"></z-icon>\n </button>\n );\n }\n\n private renderMobile(): HTMLElement[] {\n const pagesChunks = this.getPagesChunks();\n\n return [\n this.label && <span class=\"page-label body-1-sb\">{this.label}</span>,\n\n <div class=\"pagination-bar\">\n {this.renderBackButton()}\n\n {!this.goToPage && (\n <div\n class=\"pages-container\"\n role=\"navigation\"\n tabIndex={-1}\n >\n {pagesChunks.length > 0 &&\n pagesChunks.map((chunk) => <div class=\"pages-chunk\">{chunk.map((page) => this.renderPage(page))}</div>)}\n </div>\n )}\n\n {this.goToPage && (\n <form\n class=\"mobile-go-to-page\"\n onSubmit={(ev) => {\n ev.preventDefault();\n this.selectPage(this.goToPageValue);\n }}\n >\n <z-input\n class=\"go-to-page-input\"\n type={InputType.NUMBER}\n min={1}\n max={this.totalPages}\n message={false}\n onInput={(ev: InputEvent) => {\n this.goToPageValue = (ev.target as HTMLZInputElement).value;\n }}\n placeholder={this.currentPage.toString()}\n hasclearicon={false}\n ></z-input>\n <span>{`/${this.totalPages}`}</span>\n </form>\n )}\n\n {this.renderForwardButton()}\n </div>,\n ];\n }\n\n componentDidLoad(): void {\n this.setVisiblePages();\n }\n\n componentDidRender(): void {\n if (this.split) {\n this.edges = false;\n }\n\n this.setPagesContainerWidth();\n this.setMobile();\n this.scrollToPage();\n }\n\n render(): HTMLZPaginationElement {\n if (this.isMobile) {\n return <Host>{this.renderMobile()}</Host>;\n }\n\n return (\n <Host>\n <div class=\"pagination-bar\">\n {this.label && <span class=\"page-label body-1-sb\">{this.label}</span>}\n\n {this.edges && (\n <button\n class=\"pagination-button\"\n type=\"button\"\n title=\"Vai alla pagina 1\"\n disabled={this.currentPage === 1}\n onClick={() => this.selectPage(1)}\n >\n Pagina 1\n </button>\n )}\n\n {this.skip < this.totalPages && this.skip > 1 && (\n <button\n class=\"pagination-button\"\n type=\"button\"\n title={`Vai alla pagina ${this.currentPage - this.skip}`}\n disabled={this.currentPage <= this.skip}\n onClick={() => this.selectPage(this.currentPage - this.skip)}\n >\n -{this.skip}\n </button>\n )}\n\n {this.navArrows && this.renderBackButton()}\n\n <div\n class=\"pages-container\"\n role=\"navigation\"\n tabIndex={-1}\n >\n {this.split ? this.renderSplitPages() : this.renderPages()}\n </div>\n\n {this.navArrows && this.renderForwardButton()}\n\n {this.skip < this.totalPages && this.skip > 1 && (\n <button\n class=\"pagination-button\"\n type=\"button\"\n title={`Vai alla pagina ${this.currentPage + this.skip}`}\n disabled={this.currentPage > this.totalPages - this.skip}\n onClick={() => this.selectPage(this.currentPage + this.skip)}\n >\n +{this.skip}\n </button>\n )}\n\n {this.edges && (\n <button\n class=\"pagination-button\"\n type=\"button\"\n title={`Vai alla pagina ${this.totalPages}`}\n disabled={this.currentPage === this.totalPages}\n onClick={() => this.selectPage(this.totalPages)}\n >\n Pagina {this.totalPages}\n </button>\n )}\n </div>\n {this.goToPage && (\n <div class=\"go-to-page\">\n <span class=\"z-label body-5-sb\">Vai a pagina:</span>\n <div class=\"inputs\">\n <z-input\n class=\"go-to-page-input\"\n type={InputType.NUMBER}\n min={1}\n max={this.totalPages}\n message={false}\n placeholder=\"2\"\n hasclearicon={false}\n onInput={(ev: InputEvent) => {\n this.goToPageValue = (ev.target as HTMLZInputElement).value;\n }}\n onKeyDown={(ev) => ev.key === \"Enter\" && this.selectPage(this.goToPageValue)}\n ></z-input>\n <z-button\n disabled={!this.goToPageValue}\n title=\"Vai alla pagina inserita\"\n onClick={() => this.selectPage(this.goToPageValue)}\n >\n vai\n </z-button>\n </div>\n </div>\n )}\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/cjs/z-panel-elem.cjs.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var index = require('./index-DnscebL4.js');
+var index = require('./index-DY2I5wAY.js');
 const stylesCss = () => `.sc-z-panel-elem-h{width:inherit;font-family:var(--font-family sans);font-weight:var(--font-rg)}.panel-elem-container.sc-z-panel-elem{width:100%}.panel-elem-icon.sc-z-panel-elem{margin:auto calc(var(--space-unit) * 3)}.panel-elem-icon.sc-z-panel-elem img.sc-z-panel-elem{display:block;max-width:96px;height:32px;margin:auto;object-fit:contain}.panel-elem-link.sc-z-panel-elem{display:flex;align-items:center;justify-content:center;margin:var(--space-unit) auto 0;border-radius:var(--border-no-radius);font-size:12px}.panel-elem-link.sc-z-panel-elem>a.z-link.sc-z-panel-elem{padding:calc(var(--space-unit) * 0.5) 0;font-weight:var(--font-sb)}.panel-elem-desc.sc-z-panel-elem{padding-top:var(--space-unit);margin:0;letter-spacing:0.16px;text-align:center}a.sc-z-panel-elem>z-icon.sc-z-panel-elem{margin-right:var(--space-unit)}`;
@@ -14,14 +14,17 @@ const ZPanelElem = class {
     }
     render() {
         const elemId = this.elemid ? this.elemid : "";
-        return (index.h("div", { key: '5ec6258c1b03272d134bfd051fccfa2f922d9d18', class: "panel-elem-container" }, (this.imgurl || this.imgalt) && (index.h("div", { key: '0e2510843c7f3d4a6a51d4e3397972e9f8ff9278', "aria-hidden": "true", class: "panel-elem-icon" }, index.h("img", { key: 'a147b33a20b2432bca9577c724bcb90ee4ec0796', src: this.imgurl, alt: this.imgalt }))), index.h("div", { key: '7eb80ce42df88d0f6f20cd8489b0052588539602', class: "panel-elem-link" }, index.h("a", { key: '40622a092e1b7c111932edcf8e3f083a7e589148', class: {
+        return (index.h("div", { key: '46e51aca7f95d8725e6dcdc8c59827ff746bb1eb', class: "panel-elem-container" }, (this.imgurl || this.imgalt) && (index.h("div", { key: '70da90dd66acdd19751cd3b80834d151857497be', "aria-hidden": "true", class: "panel-elem-icon" }, index.h("img", { key: '5f44b565c0fffe7056ec217066c9ffd1ad2aa5ec', src: this.imgurl, alt: this.imgalt }))), index.h("div", { key: 'dd425e4fb93951570cd66f605c6e39cb12234646', class: "panel-elem-link" }, index.h("a", { key: 'ac7e5734b47ead56cc3d2e0ecf7eb81eb3e0dd18', class: {
                 "z-link": true,
                 "z-link-disabled": this.isdisabled,
                 "z-link-icon": true,
                 "z-link-blue": true,
-            }, id: elemId + "link_id", href: this.url, target: this.target }, index.h("z-icon", { key: 'c5febcd1de48afe90a33cba4c3e4cc90fe08444d', height: 14, width: 14, name: this.linkicon }), this.linklabel)), this.descrSlotName && (index.h("div", { key: '4f131023ff6a577c535670c9762ae8458825c94f', class: "panel-elem-desc" }, index.h("slot", { key: '82e06bd4163c9e72c7f0614c314a001d158db9ce', name: this.descrSlotName })))));
+            }, id: elemId + "link_id", href: this.url, target: this.target }, index.h("z-icon", { key: '405152dd34d8aaacee615f0ec8302d2c305e3dc3', height: 14, width: 14, name: this.linkicon }), this.linklabel)), this.descrSlotName && (index.h("div", { key: '1ce8a5eda374656fe7bdd750d2be29f65d102395', class: "panel-elem-desc" }, index.h("slot", { key: 'fb7f00494aad2bc3228fdc2221d329ec52460676', name: this.descrSlotName })))));
     }
 };
 ZPanelElem.style = stylesCss();
 exports.z_panel_elem = ZPanelElem;
+//# sourceMappingURL=z-panel-elem.entry.cjs.js.map
+//# sourceMappingURL=z-panel-elem.cjs.entry.js.map

package/dist/cjs/z-panel-elem.cjs.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"z-panel-elem.cjs.entry.js","mappings":";;;;AAAA,MAAM,SAAS,GAAG,MAAM,CAAC,yzBAAyzB,CAAC;;MCWt0B,UAAU,GAAA,MAAA;AANvB,IAAA,WAAA,CAAA,OAAA,EAAA;;;AAiCE,QAAA,IAAA,CAAA,MAAM,GAAY,QAAQ;;AAI1B,QAAA,IAAA,CAAA,UAAU,GAAa,KAAK;AAkD7B;IA5CC,MAAM,GAAA;AACJ,QAAA,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,MAAM,GAAG,EAAE;QAE7C,QACEA,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,sBAAsB,EAAA,EAC9B,CAAC,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,MAAM,MAC1BA,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,aAAA,EACc,MAAM,EAClB,KAAK,EAAC,iBAAiB,EAAA,EAEvBA,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,GAAG,EAAE,IAAI,CAAC,MAAM,EAChB,GAAG,EAAE,IAAI,CAAC,MAAM,EAAA,CAChB,CACE,CACP,EACDA,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,iBAAiB,EAAA,EAC1BA,OAAA,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAE;AACL,gBAAA,QAAQ,EAAE,IAAI;gBACd,iBAAiB,EAAE,IAAI,CAAC,UAAU;AAClC,gBAAA,aAAa,EAAE,IAAI;AACnB,gBAAA,aAAa,EAAE,IAAI;AACpB,aAAA,EACD,EAAE,EAAE,MAAM,GAAG,SAAS,EACtB,IAAI,EAAE,IAAI,CAAC,GAAG,EACd,MAAM,EAAE,IAAI,CAAC,MAAM,EAAA,EAEnBA,OAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,MAAM,EAAE,EAAE,EACV,KAAK,EAAE,EAAE,EACT,IAAI,EAAE,IAAI,CAAC,QAAQ,EAAA,CACX,EACT,IAAI,CAAC,SAAS,CACb,CACA,EACL,IAAI,CAAC,aAAa,KACjBA,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,iBAAiB,EAAA,EAC1BA,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAE,IAAI,CAAC,aAAa,GAAI,CAC9B,CACP,CACG;;;;;;;","names":["h"],"sources":["src/components/z-panel-elem/styles.css?tag=z-panel-elem&encapsulation=scoped","src/components/z-panel-elem/index.tsx"],"sourcesContent":[":host {\n width: inherit;\n font-family: var(--font-family sans);\n font-weight: var(--font-rg);\n}\n\n.panel-elem-container {\n width: 100%;\n}\n\n.panel-elem-icon {\n margin: auto calc(var(--space-unit) * 3);\n}\n\n.panel-elem-icon img {\n display: block;\n max-width: 96px;\n height: 32px;\n margin: auto;\n object-fit: contain;\n}\n\n.panel-elem-link {\n display: flex;\n align-items: center;\n justify-content: center;\n margin: var(--space-unit) auto 0;\n border-radius: var(--border-no-radius);\n font-size: 12px;\n}\n\n.panel-elem-link > a.z-link {\n padding: calc(var(--space-unit) * 0.5) 0;\n font-weight: var(--font-sb);\n}\n\n.panel-elem-desc {\n padding-top: var(--space-unit);\n margin: 0;\n letter-spacing: 0.16px;\n text-align: center;\n}\n\na > z-icon {\n margin-right: var(--space-unit);\n}\n","import {Component, ComponentInterface, Prop, h} from \"@stencil/core\";\n\n/**\n * @slot `descrSlotName` - description content\n */\n@Component({\n tag: \"z-panel-elem\",\n styleUrl: \"styles.css\",\n shadow: false,\n scoped: true,\n})\nexport class ZPanelElem implements ComponentInterface {\n /** html element id (optional) */\n @Prop()\n elemid?: string;\n\n /** image url source (optional) */\n @Prop()\n imgurl?: string;\n\n /** alternative image text (optional) */\n @Prop()\n imgalt?: string;\n\n /** icon link name (optional) */\n @Prop()\n linkicon?: string;\n\n /** link label text*/\n @Prop()\n linklabel: string;\n\n /** link url */\n @Prop()\n url: string;\n\n /** link target (optional) */\n @Prop()\n target?: string = \"_blank\";\n\n /** disabled status flag (optional) */\n @Prop()\n isdisabled?: boolean = false;\n\n /** name of slot container (optional) */\n @Prop()\n descrSlotName?: string;\n\n render(): HTMLDivElement {\n const elemId = this.elemid ? this.elemid : \"\";\n\n return (\n <div class=\"panel-elem-container\">\n {(this.imgurl || this.imgalt) && (\n <div\n aria-hidden=\"true\"\n class=\"panel-elem-icon\"\n >\n <img\n src={this.imgurl}\n alt={this.imgalt}\n />\n </div>\n )}\n <div class=\"panel-elem-link\">\n <a\n class={{\n \"z-link\": true,\n \"z-link-disabled\": this.isdisabled,\n \"z-link-icon\": true,\n \"z-link-blue\": true,\n }}\n id={elemId + \"link_id\"}\n href={this.url}\n target={this.target}\n >\n <z-icon\n height={14}\n width={14}\n name={this.linkicon}\n ></z-icon>\n {this.linklabel}\n </a>\n </div>\n {this.descrSlotName && (\n <div class=\"panel-elem-desc\">\n <slot name={this.descrSlotName} />\n </div>\n )}\n </div>\n );\n }\n}\n"],"version":3}

package/dist/cjs/z-popover.cjs.entry.js CHANGED Viewed

@@ -1,8 +1,8 @@
 'use strict';
-var index = require('./index-DnscebL4.js');
-var index$1 = require('./index-wGaSHN1_.js');
-var utils = require('./utils-BY7xrW7W.js');
+var index = require('./index-DY2I5wAY.js');
+var index$1 = require('./index-Cn7FFDHr.js');
+var utils = require('./utils-kQZHfpti.js');
 require('./breakpoints-B7vFm-3T.js');
 const stylesCss = () => `:host{position:fixed;display:none;max-width:calc(100dvw - var(--grid-margin) * 2);max-height:calc(100dvh - var(--grid-margin) * 2);padding:var(--z-popover-padding, 0);background:var(--z-popover-theme--surface, var(--color-surface01));border-radius:var(--border-radius-small);color:var(--z-popover-theme--text, var(--color-default-text));fill:currentcolor;filter:var(--z-popover-shadow-filter, drop-shadow(0 1px 2px var(--shadow-color-base)));text-align:center;visibility:hidden;}:host([open]:not([open="false"])[current-position]){display:block}:host([center][current-position="top"]),:host([center][current-position="bottom"]){transform:translateX(-50%)}:host([center][current-position="right"]),:host([center][current-position="left"]){transform:translateY(-50%)}:host([current-position^="top"]){margin:0 0 var(--space-unit)}:host([current-position^="bottom"]){margin:var(--space-unit) 0 0}:host([current-position^="left"]){margin:0 var(--space-unit) 0 0}:host([current-position^="right"]){margin:0 0 0 var(--space-unit)}:host([current-position])::before{--arrow-size:6px;--arrow-edge-offset:calc(100% - var(--space-unit) - (var(--arrow-size) / 2));--arrow-center-x-offset:calc(50% - (var(--arrow-size) / 2));--arrow-center-y-offset:calc(100% - (var(--arrow-size) / 2));position:absolute;display:block;width:var(--arrow-size);height:var(--arrow-size);background:var(--z-popover-theme--surface, var(--color-surface01));content:"";transform:rotate(45deg)}:host([show-arrow="false"])::before,:host(:not([show-arrow]))::before{display:none}:host([current-position^="top"])::before{top:var(--arrow-center-y-offset)}:host([current-position^="bottom"])::before{bottom:var(--arrow-center-y-offset)}:host([current-position="top"])::before,:host([current-position="bottom"])::before{right:var(--arrow-edge-offset)}:host([current-position="right"])::before,:host([current-position="left"])::before{bottom:var(--arrow-edge-offset)}:host([current-position="right"])::before{right:var(--arrow-center-y-offset)}:host([current-position="left"])::before{left:var(--arrow-center-y-offset)}:host([current-position="top_right"])::before,:host([current-position="bottom_right"])::before{right:var(--arrow-edge-offset)}:host([current-position="top_left"])::before,:host([current-position="bottom_left"])::before{left:var(--arrow-edge-offset)}:host([current-position="right_top"])::before,:host([current-position="left_top"])::before{top:var(--arrow-edge-offset)}:host([current-position="right_top"])::before,:host([current-position="right_bottom"])::before{right:var(--arrow-center-y-offset)}:host([current-position="left_top"])::before,:host([current-position="left_bottom"])::before{left:var(--arrow-center-y-offset)}:host([current-position="right_bottom"])::before,:host([current-position="left_bottom"])::before{bottom:var(--arrow-edge-offset)}:host([center][current-position="top"])::before,:host([center][current-position="bottom"])::before{right:auto;left:var(--arrow-center-x-offset)}:host([center][current-position="right"])::before,:host([center][current-position="left"])::before{top:var(--arrow-center-x-offset);bottom:auto}`;
@@ -508,7 +508,7 @@ const ZPopover = class {
         cancelAnimationFrame(this.animationFrameRequestId);
     }
     render() {
-        return (index.h(index.Host, { key: '52bff483a21ec4b2911ef16ae19fe4a860896b4a', "current-position": this.currentPosition }, index.h("slot", { key: '88e89856e0083f540df0fd0d7155c55c16c1932b' })));
+        return (index.h(index.Host, { key: '7fbbbdd9f347c6b5159070e3c6e59748d6fc93f1', "current-position": this.currentPosition }, index.h("slot", { key: 'f23968908e927fb14a32b74834918aa837f984cd' })));
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {
@@ -541,3 +541,6 @@ ZPopover.positionOrder = [
 ZPopover.style = stylesCss();
 exports.z_popover = ZPopover;
+//# sourceMappingURL=z-popover.entry.cjs.js.map
+//# sourceMappingURL=z-popover.cjs.entry.js.map

package/dist/cjs/z-popover.cjs.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"z-popover.cjs.entry.js","mappings":"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","names":["PopoverPosition","KeyboardCode","containsElement","getParentElement","findContainingBlockAncestor","getDevice","Device","isElementVisibleInContainer","h","Host"],"sources":["src/components/z-popover/styles.css?tag=z-popover&encapsulation=shadow","src/components/z-popover/index.tsx"],"sourcesContent":[":host {\n /**\n * @prop --z-popover-theme--surface: background color of the popover.\n * @prop --z-popover-theme--text: foreground color of the popover.\n * @prop --z-popover-padding: padding of the popover.\n * @prop --z-popover-shadow-filter: drop-shadow filter of the popover. Defaults to `drop-shadow(0 1px 2px var(--shadow-color-base))`.\n */\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(100dvw - var(--grid-margin) * 2);\n max-height: calc(100dvh - 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 visibility: hidden; /* hidden by default. the positioning algorithm will set it to 'visible' when needed */\n}\n\n:host([open]:not([open=\"false\"])[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: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 {\n Component,\n ComponentInterface,\n Element,\n Event,\n EventEmitter,\n Host,\n Listen,\n Prop,\n State,\n Watch,\n h,\n} from \"@stencil/core\";\nimport {Device, KeyboardCode, PopoverPosition} from \"../../beans\";\nimport {\n containsElement,\n findContainingBlockAncestor,\n getDevice,\n getParentElement,\n isElementVisibleInContainer,\n} 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@Component({\n tag: \"z-popover\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZPopover implements ComponentInterface {\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 initial open state of the popover.\n * Internal changes of this prop are emitted through the `openChange` event.\n * Make sure to listen to that event if you need the updated state of the popover from the outside, to avoid inconsistent values.\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 /** 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 * Whether 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 * Default: `true`.\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<{position: PopoverPosition}>;\n\n /** Event emitted when the open state of the popover changes (e.g. when the user clicks outside the popover to close it, if `closable` is true). */\n @Event()\n openChange: EventEmitter<{open: boolean}>;\n\n @Listen(\"keyup\", {target: \"window\", capture: true})\n closePopoverWithKeyboard(e: KeyboardEvent): void {\n if (this.closable && e.key === KeyboardCode.ESC) {\n e.stopPropagation();\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 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 this.currentPosition = undefined;\n\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 = getParentElement(this.host) as HTMLElement;\n if (this.boundElement.tagName.toLowerCase() === \"z-tooltip\") {\n // If the popover is used inside a tooltip without a specified `bindTo`, bind it to the parent of the tooltip.\n this.boundElement = getParentElement(this.boundElement) as HTMLElement;\n }\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 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 * Find the nearest scrollable ancestor of an element to take as a reference for positioning.\n * The ancestor is considered scrollable if it doesn't have `overflow` property set to `hidden` and its scroll size is bigger than its client size.\n */\n private findScrollableAncestor(element: HTMLElement): HTMLElement {\n let parent = getParentElement(element);\n\n while (parent) {\n if (parent === element.ownerDocument.documentElement) {\n return parent as HTMLElement;\n }\n\n const style = 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 * 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 scrollableAncestor = this.findScrollableAncestor(this.boundElement);\n const scrollableAncestorRect = scrollableAncestor.getBoundingClientRect();\n const isScrollableAncestorNested = scrollableAncestor !== 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 ancestor and the viewport.\n // They are used to adjust the available space calculations when the scrollable ancestor is not the document or body,\n // to try to fit the popover inside the scrollable ancestor.\n const deltaTop = isScrollableAncestorNested ? scrollableAncestorRect.top : 0;\n const deltaRight = isScrollableAncestorNested ? documentWidth - scrollableAncestorRect.right : 0;\n const deltaBottom = isScrollableAncestorNested ? documentHeight - scrollableAncestorRect.bottom : 0;\n const deltaLeft = isScrollableAncestorNested ? scrollableAncestorRect.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 the bound element relative to the viewport. */\n private getBoundElementOffsets(): Offsets {\n const elementRect = this.boundElement.getBoundingClientRect();\n const documentWidth = this.boundElement.ownerDocument.documentElement.clientWidth;\n const documentHeight = this.boundElement.ownerDocument.documentElement.clientHeight;\n\n return {\n top: elementRect.top,\n right: documentWidth - elementRect.right,\n bottom: documentHeight - elementRect.bottom,\n left: elementRect.left,\n };\n }\n\n /** Compute positioning offsets in the appropriate coordinate space, accounting for transformed containing blocks and scroll. */\n private computePositionOffsets(): Offsets {\n const boundElementOffsets = this.getBoundElementOffsets();\n const containingBlockAncestor = findContainingBlockAncestor(this.host);\n const isDocumentElement = containingBlockAncestor === this.host.ownerDocument.documentElement;\n\n if (isDocumentElement) {\n return boundElementOffsets;\n }\n\n const containingBlockRect = containingBlockAncestor.getBoundingClientRect();\n const containingBlockStyle = getComputedStyle(containingBlockAncestor);\n /** Padding box of the containing block, accounting for borders. */\n const paddingBox = {\n top: containingBlockRect.top + parseFloat(containingBlockStyle.borderTopWidth),\n right: containingBlockRect.right - parseFloat(containingBlockStyle.borderRightWidth),\n bottom: containingBlockRect.bottom - parseFloat(containingBlockStyle.borderBottomWidth),\n left: containingBlockRect.left + parseFloat(containingBlockStyle.borderLeftWidth),\n };\n\n const boundElementRect = this.boundElement.getBoundingClientRect();\n /** Bound element offsets relative to the containing block padding box. */\n const relativeOffsets = {\n top: boundElementRect.top - paddingBox.top,\n right: paddingBox.right - boundElementRect.right,\n bottom: paddingBox.bottom - boundElementRect.bottom,\n left: boundElementRect.left - paddingBox.left,\n };\n\n /** Account for scroll to keep the popover aligned while the containing block scrolls. */\n return {\n top: relativeOffsets.top + containingBlockAncestor.scrollTop,\n right: relativeOffsets.right - containingBlockAncestor.scrollLeft,\n bottom: relativeOffsets.bottom - containingBlockAncestor.scrollTop,\n left: relativeOffsets.left + containingBlockAncestor.scrollLeft,\n };\n }\n\n /** Apply positioning styles based on `position` parameter. */\n private applyPositionStyles(position: PopoverPosition, availableSpace: Offsets): void {\n const boundElementWidth = this.boundElement.offsetWidth;\n const boundElementHeight = this.boundElement.offsetHeight;\n const offsetModifier = this.offsetModifier;\n /**\n * Distance between the arrow center and the popover edge.\n * Needed to align the center of the arrow with the center of the bound element when `showArrow` and `center` are enabled.\n */\n const arrowModifier = this.showArrow && this.center ? 8 : 0;\n const hostStyle = this.host.style;\n /** Gap between the popover and the bound element, set as margin in CSS. */\n const distanceFromBound = parseFloat(getComputedStyle(this.host).marginTop.replace(\"px\", \"\")) || 0;\n const positionOffsets = this.computePositionOffsets();\n\n /**\n * Precomputed bases to reduce repeated arithmetic in the switch below.\n * They represent the bound element edges plus optional centering offsets.\n */\n const leftBase = positionOffsets.left + boundElementWidth * offsetModifier;\n const rightBase = positionOffsets.right + boundElementWidth * offsetModifier;\n const topBase = positionOffsets.top + boundElementHeight;\n const bottomBase = positionOffsets.bottom + boundElementHeight;\n const sideTopBase = positionOffsets.top + boundElementHeight * offsetModifier;\n const sideBottomBase = positionOffsets.bottom + boundElementHeight * offsetModifier;\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 = `${bottomBase}px`;\n hostStyle.left = `${leftBase - (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 = `${rightBase - arrowModifier}px`;\n hostStyle.bottom = `${bottomBase}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 = `${topBase}px`;\n hostStyle.left = `${leftBase - (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 = `${topBase}px`;\n hostStyle.right = `${rightBase - 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 = `${sideTopBase - (position === PopoverPosition.RIGHT_BOTTOM ? arrowModifier : 0)}px`;\n hostStyle.left = `${positionOffsets.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 = `${sideBottomBase - arrowModifier}px`;\n hostStyle.left = `${positionOffsets.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 = `${sideTopBase - (position === PopoverPosition.LEFT_BOTTOM ? arrowModifier : 0)}px`;\n hostStyle.right = `${positionOffsets.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 = `${positionOffsets.right + boundElementWidth}px`;\n hostStyle.bottom = `${sideBottomBase - 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 Object.assign(hostStyle, {\n maxWidth: maxWidth ? `${maxWidth}px` : \"\",\n maxHeight: maxHeight ? `${maxHeight}px` : \"\",\n });\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, this.findScrollableAncestor(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}

package/dist/cjs/z-range-picker.cjs.entry.js CHANGED Viewed

@@ -1,8 +1,8 @@
 'use strict';
-var index = require('./index-DnscebL4.js');
-var utils = require('./utils-C5_wGVkJ.js');
-var index$1 = require('./index-wGaSHN1_.js');
+var index = require('./index-DY2I5wAY.js');
+var utils = require('./utils-By4U4KkV.js');
+var index$1 = require('./index-Cn7FFDHr.js');
 const stylesCss = () => `.flatpickr-calendar{background:transparent;opacity:0;display:none;text-align:center;visibility:hidden;padding:0;-webkit-animation:none;animation:none;direction:ltr;border:0;font-size:14px;line-height:24px;border-radius:5px;position:absolute;width:307.875px;-webkit-box-sizing:border-box;box-sizing:border-box;-ms-touch-action:manipulation;touch-action:manipulation;background:#fff;-webkit-box-shadow:1px 0 0 #e6e6e6,-1px 0 0 #e6e6e6,0 1px 0 #e6e6e6,0 -1px 0 #e6e6e6,0 3px 13px rgba(0,0,0,0.08);box-shadow:1px 0 0 #e6e6e6,-1px 0 0 #e6e6e6,0 1px 0 #e6e6e6,0 -1px 0 #e6e6e6,0 3px 13px rgba(0,0,0,0.08)}.flatpickr-calendar.open,.flatpickr-calendar.inline{opacity:1;max-height:640px;visibility:visible}.flatpickr-calendar.open{display:inline-block;z-index:99999}.flatpickr-calendar.animate.open{-webkit-animation:fpFadeInDown 300ms cubic-bezier(.23,1,.32,1);animation:fpFadeInDown 300ms cubic-bezier(.23,1,.32,1)}.flatpickr-calendar.inline{display:block;position:relative;top:2px}.flatpickr-calendar.static{position:absolute;top:calc(100% + 2px)}.flatpickr-calendar.static.open{z-index:999;display:block}.flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+1) .flatpickr-day.inRange:nth-child(7n+7){-webkit-box-shadow:none !important;box-shadow:none !important}.flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+2) .flatpickr-day.inRange:nth-child(7n+1){-webkit-box-shadow:-2px 0 0 #e6e6e6,5px 0 0 #e6e6e6;box-shadow:-2px 0 0 #e6e6e6,5px 0 0 #e6e6e6}.flatpickr-calendar .hasWeeks .dayContainer,.flatpickr-calendar .hasTime .dayContainer{border-bottom:0;border-bottom-right-radius:0;border-bottom-left-radius:0}.flatpickr-calendar .hasWeeks .dayContainer{border-left:0}.flatpickr-calendar.hasTime .flatpickr-time{height:40px;border-top:1px solid #e6e6e6}.flatpickr-calendar.noCalendar.hasTime .flatpickr-time{height:auto}.flatpickr-calendar:before,.flatpickr-calendar:after{position:absolute;display:block;pointer-events:none;border:solid transparent;content:'';height:0;width:0;left:22px}.flatpickr-calendar.rightMost:before,.flatpickr-calendar.arrowRight:before,.flatpickr-calendar.rightMost:after,.flatpickr-calendar.arrowRight:after{left:auto;right:22px}.flatpickr-calendar.arrowCenter:before,.flatpickr-calendar.arrowCenter:after{left:50%;right:50%}.flatpickr-calendar:before{border-width:5px;margin:0 -5px}.flatpickr-calendar:after{border-width:4px;margin:0 -4px}.flatpickr-calendar.arrowTop:before,.flatpickr-calendar.arrowTop:after{bottom:100%}.flatpickr-calendar.arrowTop:before{border-bottom-color:#e6e6e6}.flatpickr-calendar.arrowTop:after{border-bottom-color:#fff}.flatpickr-calendar.arrowBottom:before,.flatpickr-calendar.arrowBottom:after{top:100%}.flatpickr-calendar.arrowBottom:before{border-top-color:#e6e6e6}.flatpickr-calendar.arrowBottom:after{border-top-color:#fff}.flatpickr-calendar:focus{outline:0}.flatpickr-wrapper{position:relative;display:inline-block}.flatpickr-months{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex}.flatpickr-months .flatpickr-month{background:transparent;color:rgba(0,0,0,0.9);fill:rgba(0,0,0,0.9);height:34px;line-height:1;text-align:center;position:relative;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;overflow:hidden;-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1}.flatpickr-months .flatpickr-prev-month,.flatpickr-months .flatpickr-next-month{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;text-decoration:none;cursor:pointer;position:absolute;top:0;height:34px;padding:10px;z-index:3;color:rgba(0,0,0,0.9);fill:rgba(0,0,0,0.9)}.flatpickr-months .flatpickr-prev-month.flatpickr-disabled,.flatpickr-months .flatpickr-next-month.flatpickr-disabled{display:none}.flatpickr-months .flatpickr-prev-month i,.flatpickr-months .flatpickr-next-month i{position:relative}.flatpickr-months .flatpickr-prev-month.flatpickr-prev-month,.flatpickr-months .flatpickr-next-month.flatpickr-prev-month{left:0}.flatpickr-months .flatpickr-prev-month.flatpickr-next-month,.flatpickr-months .flatpickr-next-month.flatpickr-next-month{right:0}.flatpickr-months .flatpickr-prev-month:hover,.flatpickr-months .flatpickr-next-month:hover{color:#959ea9}.flatpickr-months .flatpickr-prev-month:hover svg,.flatpickr-months .flatpickr-next-month:hover svg{fill:#f64747}.flatpickr-months .flatpickr-prev-month svg,.flatpickr-months .flatpickr-next-month svg{width:14px;height:14px}.flatpickr-months .flatpickr-prev-month svg path,.flatpickr-months .flatpickr-next-month svg path{-webkit-transition:fill .1s;transition:fill .1s;fill:inherit}.numInputWrapper{position:relative;height:auto}.numInputWrapper input,.numInputWrapper span{display:inline-block}.numInputWrapper input{width:100%}.numInputWrapper input::-ms-clear{display:none}.numInputWrapper input::-webkit-outer-spin-button,.numInputWrapper input::-webkit-inner-spin-button{margin:0;-webkit-appearance:none}.numInputWrapper span{position:absolute;right:0;width:14px;padding:0 4px 0 2px;height:50%;line-height:50%;opacity:0;cursor:pointer;border:1px solid rgba(57,57,57,0.15);-webkit-box-sizing:border-box;box-sizing:border-box}.numInputWrapper span:hover{background:rgba(0,0,0,0.1)}.numInputWrapper span:active{background:rgba(0,0,0,0.2)}.numInputWrapper span:after{display:block;content:"";position:absolute}.numInputWrapper span.arrowUp{top:0;border-bottom:0}.numInputWrapper span.arrowUp:after{border-left:4px solid transparent;border-right:4px solid transparent;border-bottom:4px solid rgba(57,57,57,0.6);top:26%}.numInputWrapper span.arrowDown{top:50%}.numInputWrapper span.arrowDown:after{border-left:4px solid transparent;border-right:4px solid transparent;border-top:4px solid rgba(57,57,57,0.6);top:40%}.numInputWrapper span svg{width:inherit;height:auto}.numInputWrapper span svg path{fill:rgba(0,0,0,0.5)}.numInputWrapper:hover{background:rgba(0,0,0,0.05)}.numInputWrapper:hover span{opacity:1}.flatpickr-current-month{font-size:135%;line-height:inherit;font-weight:300;color:inherit;position:absolute;width:75%;left:12.5%;padding:7.48px 0 0 0;line-height:1;height:34px;display:inline-block;text-align:center;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.flatpickr-current-month span.cur-month{font-family:inherit;font-weight:700;color:inherit;display:inline-block;margin-left:.5ch;padding:0}.flatpickr-current-month span.cur-month:hover{background:rgba(0,0,0,0.05)}.flatpickr-current-month .numInputWrapper{width:6ch;width:7ch\\0;display:inline-block}.flatpickr-current-month .numInputWrapper span.arrowUp:after{border-bottom-color:rgba(0,0,0,0.9)}.flatpickr-current-month .numInputWrapper span.arrowDown:after{border-top-color:rgba(0,0,0,0.9)}.flatpickr-current-month input.cur-year{background:transparent;-webkit-box-sizing:border-box;box-sizing:border-box;color:inherit;cursor:text;padding:0 0 0 .5ch;margin:0;display:inline-block;font-size:inherit;font-family:inherit;font-weight:300;line-height:inherit;height:auto;border:0;border-radius:0;vertical-align:initial;-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield}.flatpickr-current-month input.cur-year:focus{outline:0}.flatpickr-current-month input.cur-year[disabled],.flatpickr-current-month input.cur-year[disabled]:hover{font-size:100%;color:rgba(0,0,0,0.5);background:transparent;pointer-events:none}.flatpickr-current-month .flatpickr-monthDropdown-months{appearance:menulist;background:transparent;border:none;border-radius:0;box-sizing:border-box;color:inherit;cursor:pointer;font-size:inherit;font-family:inherit;font-weight:300;height:auto;line-height:inherit;margin:-1px 0 0 0;outline:none;padding:0 0 0 .5ch;position:relative;vertical-align:initial;-webkit-box-sizing:border-box;-webkit-appearance:menulist;-moz-appearance:menulist;width:auto}.flatpickr-current-month .flatpickr-monthDropdown-months:focus,.flatpickr-current-month .flatpickr-monthDropdown-months:active{outline:none}.flatpickr-current-month .flatpickr-monthDropdown-months:hover{background:rgba(0,0,0,0.05)}.flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month{background-color:transparent;outline:none;padding:0}.flatpickr-weekdays{background:transparent;text-align:center;overflow:hidden;width:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;height:28px}.flatpickr-weekdays .flatpickr-weekdaycontainer{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1}span.flatpickr-weekday{cursor:default;font-size:90%;background:transparent;color:rgba(0,0,0,0.54);line-height:1;margin:0;text-align:center;display:block;-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1;font-weight:bolder}.dayContainer,.flatpickr-weeks{padding:1px 0 0 0}.flatpickr-days{position:relative;overflow:hidden;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:start;-webkit-align-items:flex-start;-ms-flex-align:start;align-items:flex-start;width:307.875px}.flatpickr-days:focus{outline:0}.dayContainer{padding:0;outline:0;text-align:left;width:307.875px;min-width:307.875px;max-width:307.875px;-webkit-box-sizing:border-box;box-sizing:border-box;display:inline-block;display:-ms-flexbox;display:-webkit-box;display:-webkit-flex;display:flex;-webkit-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-wrap:wrap;-ms-flex-pack:justify;-webkit-justify-content:space-around;justify-content:space-around;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1}.dayContainer+.dayContainer{-webkit-box-shadow:-1px 0 0 #e6e6e6;box-shadow:-1px 0 0 #e6e6e6}.flatpickr-day{background:none;border:1px solid transparent;border-radius:150px;-webkit-box-sizing:border-box;box-sizing:border-box;color:#393939;cursor:pointer;font-weight:400;width:14.2857143%;-webkit-flex-basis:14.2857143%;-ms-flex-preferred-size:14.2857143%;flex-basis:14.2857143%;max-width:39px;height:39px;line-height:39px;margin:0;display:inline-block;position:relative;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;text-align:center}.flatpickr-day.inRange,.flatpickr-day.prevMonthDay.inRange,.flatpickr-day.nextMonthDay.inRange,.flatpickr-day.today.inRange,.flatpickr-day.prevMonthDay.today.inRange,.flatpickr-day.nextMonthDay.today.inRange,.flatpickr-day:hover,.flatpickr-day.prevMonthDay:hover,.flatpickr-day.nextMonthDay:hover,.flatpickr-day:focus,.flatpickr-day.prevMonthDay:focus,.flatpickr-day.nextMonthDay:focus{cursor:pointer;outline:0;background:#e6e6e6;border-color:#e6e6e6}.flatpickr-day.today{border-color:#959ea9}.flatpickr-day.today:hover,.flatpickr-day.today:focus{border-color:#959ea9;background:#959ea9;color:#fff}.flatpickr-day.selected,.flatpickr-day.startRange,.flatpickr-day.endRange,.flatpickr-day.selected.inRange,.flatpickr-day.startRange.inRange,.flatpickr-day.endRange.inRange,.flatpickr-day.selected:focus,.flatpickr-day.startRange:focus,.flatpickr-day.endRange:focus,.flatpickr-day.selected:hover,.flatpickr-day.startRange:hover,.flatpickr-day.endRange:hover,.flatpickr-day.selected.prevMonthDay,.flatpickr-day.startRange.prevMonthDay,.flatpickr-day.endRange.prevMonthDay,.flatpickr-day.selected.nextMonthDay,.flatpickr-day.startRange.nextMonthDay,.flatpickr-day.endRange.nextMonthDay{background:#569ff7;-webkit-box-shadow:none;box-shadow:none;color:#fff;border-color:#569ff7}.flatpickr-day.selected.startRange,.flatpickr-day.startRange.startRange,.flatpickr-day.endRange.startRange{border-radius:50px 0 0 50px}.flatpickr-day.selected.endRange,.flatpickr-day.startRange.endRange,.flatpickr-day.endRange.endRange{border-radius:0 50px 50px 0}.flatpickr-day.selected.startRange+.endRange:not(:nth-child(7n+1)),.flatpickr-day.startRange.startRange+.endRange:not(:nth-child(7n+1)),.flatpickr-day.endRange.startRange+.endRange:not(:nth-child(7n+1)){-webkit-box-shadow:-10px 0 0 #569ff7;box-shadow:-10px 0 0 #569ff7}.flatpickr-day.selected.startRange.endRange,.flatpickr-day.startRange.startRange.endRange,.flatpickr-day.endRange.startRange.endRange{border-radius:50px}.flatpickr-day.inRange{border-radius:0;-webkit-box-shadow:-5px 0 0 #e6e6e6,5px 0 0 #e6e6e6;box-shadow:-5px 0 0 #e6e6e6,5px 0 0 #e6e6e6}.flatpickr-day.flatpickr-disabled,.flatpickr-day.flatpickr-disabled:hover,.flatpickr-day.prevMonthDay,.flatpickr-day.nextMonthDay,.flatpickr-day.notAllowed,.flatpickr-day.notAllowed.prevMonthDay,.flatpickr-day.notAllowed.nextMonthDay{color:rgba(57,57,57,0.3);background:transparent;border-color:transparent;cursor:default}.flatpickr-day.flatpickr-disabled,.flatpickr-day.flatpickr-disabled:hover{cursor:not-allowed;color:rgba(57,57,57,0.1)}.flatpickr-day.week.selected{border-radius:0;-webkit-box-shadow:-5px 0 0 #569ff7,5px 0 0 #569ff7;box-shadow:-5px 0 0 #569ff7,5px 0 0 #569ff7}.flatpickr-day.hidden{visibility:hidden}.rangeMode .flatpickr-day{margin-top:1px}.flatpickr-weekwrapper{float:left}.flatpickr-weekwrapper .flatpickr-weeks{padding:0 12px;-webkit-box-shadow:1px 0 0 #e6e6e6;box-shadow:1px 0 0 #e6e6e6}.flatpickr-weekwrapper .flatpickr-weekday{float:none;width:100%;line-height:28px}.flatpickr-weekwrapper span.flatpickr-day,.flatpickr-weekwrapper span.flatpickr-day:hover{display:block;width:100%;max-width:none;color:rgba(57,57,57,0.3);background:transparent;cursor:default;border:none}.flatpickr-innerContainer{display:block;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-sizing:border-box;box-sizing:border-box;overflow:hidden}.flatpickr-rContainer{display:inline-block;padding:0;-webkit-box-sizing:border-box;box-sizing:border-box}.flatpickr-time{text-align:center;outline:0;display:block;height:0;line-height:40px;max-height:40px;-webkit-box-sizing:border-box;box-sizing:border-box;overflow:hidden;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex}.flatpickr-time:after{content:"";display:table;clear:both}.flatpickr-time .numInputWrapper{-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1;width:40%;height:40px;float:left}.flatpickr-time .numInputWrapper span.arrowUp:after{border-bottom-color:#393939}.flatpickr-time .numInputWrapper span.arrowDown:after{border-top-color:#393939}.flatpickr-time.hasSeconds .numInputWrapper{width:26%}.flatpickr-time.time24hr .numInputWrapper{width:49%}.flatpickr-time input{background:transparent;-webkit-box-shadow:none;box-shadow:none;border:0;border-radius:0;text-align:center;margin:0;padding:0;height:inherit;line-height:inherit;color:#393939;font-size:14px;position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield}.flatpickr-time input.flatpickr-hour{font-weight:bold}.flatpickr-time input.flatpickr-minute,.flatpickr-time input.flatpickr-second{font-weight:400}.flatpickr-time input:focus{outline:0;border:0}.flatpickr-time .flatpickr-time-separator,.flatpickr-time .flatpickr-am-pm{height:inherit;float:left;line-height:inherit;color:#393939;font-weight:bold;width:2%;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-align-self:center;-ms-flex-item-align:center;align-self:center}.flatpickr-time .flatpickr-am-pm{outline:0;width:18%;cursor:pointer;text-align:center;font-weight:400}.flatpickr-time input:hover,.flatpickr-time .flatpickr-am-pm:hover,.flatpickr-time input:focus,.flatpickr-time .flatpickr-am-pm:focus{background:#eee}.flatpickr-input[readonly]{cursor:pointer}@-webkit-keyframes fpFadeInDown{from{opacity:0;-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes fpFadeInDown{from{opacity:0;-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.flatpickr-monthSelect-months{margin:10px 1px 3px 1px;flex-wrap:wrap}.flatpickr-monthSelect-month{background:none;border:1px solid transparent;border-radius:4px;-webkit-box-sizing:border-box;box-sizing:border-box;color:#393939;cursor:pointer;display:inline-block;font-weight:400;margin:0.5px;justify-content:center;padding:10px;position:relative;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;text-align:center;width:33%}.flatpickr-monthSelect-month.flatpickr-disabled{color:#eee}.flatpickr-monthSelect-month.flatpickr-disabled:hover,.flatpickr-monthSelect-month.flatpickr-disabled:focus{cursor:not-allowed;background:none !important}.flatpickr-monthSelect-theme-dark{background:#3f4458}.flatpickr-monthSelect-theme-dark .flatpickr-current-month input.cur-year{color:#fff}.flatpickr-monthSelect-theme-dark .flatpickr-months .flatpickr-prev-month,.flatpickr-monthSelect-theme-dark .flatpickr-months .flatpickr-next-month{color:#fff;fill:#fff}.flatpickr-monthSelect-theme-dark .flatpickr-monthSelect-month{color:rgba(255, 255, 255, 0.95)}.flatpickr-monthSelect-month.today{border-color:#959ea9}.flatpickr-monthSelect-month.inRange,.flatpickr-monthSelect-month.inRange.today,.flatpickr-monthSelect-month:hover,.flatpickr-monthSelect-month:focus{background:#e6e6e6;cursor:pointer;outline:0;border-color:#e6e6e6}.flatpickr-monthSelect-theme-dark .flatpickr-monthSelect-month.inRange,.flatpickr-monthSelect-theme-dark .flatpickr-monthSelect-month:hover,.flatpickr-monthSelect-theme-dark .flatpickr-monthSelect-month:focus{background:#646c8c;border-color:#646c8c}.flatpickr-monthSelect-month.today:hover,.flatpickr-monthSelect-month.today:focus{background:#959ea9;border-color:#959ea9;color:#fff}.flatpickr-monthSelect-month.selected,.flatpickr-monthSelect-month.startRange,.flatpickr-monthSelect-month.endRange{background-color:#569ff7;box-shadow:none;color:#fff;border-color:#569ff7}.flatpickr-monthSelect-month.startRange{border-radius:50px 0 0 50px}.flatpickr-monthSelect-month.endRange{border-radius:0 50px 50px 0}.flatpickr-monthSelect-month.startRange.endRange{border-radius:50px}.flatpickr-monthSelect-month.inRange{border-radius:0;box-shadow:-5px 0 0 #e6e6e6, 5px 0 0 #e6e6e6}.flatpickr-monthSelect-theme-dark .flatpickr-monthSelect-month.selected,.flatpickr-monthSelect-theme-dark .flatpickr-monthSelect-month.startRange,.flatpickr-monthSelect-theme-dark .flatpickr-monthSelect-month.endRange{background:#80cbc4;-webkit-box-shadow:none;box-shadow:none;color:#fff;border-color:#80cbc4}:host{font-family:var(--font-family-sans);font-weight:var(--font-rg);--z-range-picker--toggle-height:0}z-date-picker{position:relative}z-date-picker>div>*{cursor:pointer !important}z-range-picker{position:relative}.flatpickr-toggle-container{width:fit-content}.range-pickers-container>div{position:relative}.hidden-input{position:absolute;bottom:0;width:0;height:0;visibility:hidden !important}.flatpickr-calendar::before,.flatpickr-calendar::after{display:none}.flatpickr-calendar{position:absolute !important;top:var(--z-range-picker--toggle-height) !important;left:0 !important;padding-top:calc(var(--space-unit) * 2);border-radius:2px;box-shadow:var(--shadow-2);font-family:var(--font-family-sans) !important}.months.top>.flatpickr-calendar{top:-288px !important}.date.top>.flatpickr-calendar,.date.top>div>.flatpickr-calendar{top:-401px !important}.date-time.top>.flatpickr-calendar,.date-time.top>div>.flatpickr-calendar{top:-523px !important}.flatpickr-calendar,.flatpickr-innerContainer,.flatpickr-days,.dayContainer,.flatpickr-rContainer,.flatpickr-monthSelect-months{width:calc(var(--space-unit) * 42) !important;max-width:calc(var(--space-unit) * 42) !important}.flatpickr-monthSelect-months{box-sizing:border-box;padding:0 !important;margin:calc(var(--space-unit) * 2) 0 !important}.flatpickr-months{position:relative;height:calc(var(--space-unit) * 6) !important;align-items:center;margin-bottom:var(--space-unit) 0 !important}.flatpickr-month{overflow:visible !important;height:calc(var(--space-unit) * 6) !important}.flatpickr-current-month{left:0 !important;display:flex !important;width:fill-available;height:calc(var(--space-unit) * 6);align-items:baseline;justify-content:space-evenly;padding-top:0}.flatpickr-next-month,.flatpickr-prev-month{position:static !important;display:flex;width:calc(var(--space-unit) * 4) !important;height:calc(var(--space-unit) * 4) !important;align-items:center;justify-content:center;padding:0 !important}.flatpickr-prev-month{margin-left:var(--space-unit)}.flatpickr-next-month{margin-right:var(--space-unit)}.flatpickr-next-month>svg,.flatpickr-prev-month>svg{width:calc(var(--space-unit) * 2) !important;height:calc(var(--space-unit) * 2) !important;fill:var(--color-primary01)}.flatpickr-next-month:hover,.flatpickr-prev-month:hover,.flatpickr-next-month:focus,.flatpickr-prev-month:focus{border:none !important;border-color:var(--color-primary03) !important;background-color:var(--color-primary03) !important;border-radius:var(--border-radius);color:var(--color-hover-primary) !important;outline:none !important}.flatpickr-next-month:hover svg,.flatpickr-prev-month:hover svg{fill:var(--color-hover-primary) !important}.flatpickr-next-month:active,.flatpickr-prev-month:active{border-color:var(--color-surface01) !important;background-color:var(--color-surface01) !important;border-radius:var(--border-radius);box-shadow:var(--shadow-2) !important;color:var(--color-primary01) !important}.flatpickr-next-month:focus svg,.flatpickr-prev-month:focus svg{fill:var(--color-primary01) !important}.flatpickr-monthDropdown-months{width:108px !important;height:calc(var(--space-unit) * 5.5) !important;padding-left:var(--space-unit) !important;background:var(--color-surface01) !important;color:var(--color-default-text) !important;font-size:var(--font-size-3) !important;font-weight:var(--font-rg) !important;outline:1px solid black !important}.flatpickr-monthDropdown-months:hover,.flatpickr-monthDropdown-months:focus{outline:1px solid var(--color-primary01) !important}.flatpickr-current-month>.numInputWrapper{display:flex;width:calc(var(--space-unit) * 10);height:calc(var(--space-unit) * 5.5) !important;background:var(--color-surface01) !important;color:var(--color-default-text);outline:1px solid black !important}.flatpickr-current-month>.numInputWrapper:hover,.flatpickr-current-month>.numInputWrapper:focus-within{outline:1px solid var(--color-primary01) !important}.flatpickr-current-month>.numInputWrapper>input{padding:0 calc(var(--space-unit) * 3) 0 var(--space-unit);font-size:var(--font-size-3) !important;font-weight:var(--font-rg) !important;text-align:center}.flatpickr-weekdays{height:calc(var(--space-unit) * 6);border-bottom:1px solid var(--color-surface03)}.flatpickr-weekday{font-size:var(--font-size-3) !important;font-weight:var(--font-rg) !important}.flatpickr-day,.flatpickr-monthSelect-month{width:calc(var(--space-unit) * 6) !important;max-width:100% !important;height:calc(var(--space-unit) * 6) !important;border:none;margin:0 !important;border-radius:0 !important;box-shadow:none !important;font-size:var(--font-size-3) !important;line-height:calc(var(--space-unit) * 6) !important}.flatpickr-day{width:calc(var(--space-unit) * 6) !important;border:none;line-height:calc(var(--space-unit) * 6) !important}.flatpickr-monthSelect-month{width:calc(var(--space-unit) * 14) !important;padding:0 !important;border:2px solid var(--color-surface01) !important;line-height:calc(var(--space-unit) * 5) !important}.flatpickr-day:not(.flatpickr-disabled):hover,.flatpickr-day:not(.flatpickr-disabled):active,.flatpickr-day:not(.flatpickr-disabled):focus,.flatpickr-day:not(.flatpickr-disabled).prevMonthDay:hover,.flatpickr-day:not(.flatpickr-disabled).prevMonthDay:active,.flatpickr-day:not(.flatpickr-disabled).prevMonthDay:focus,.flatpickr-day:not(.flatpickr-disabled).selected:hover,.flatpickr-day:not(.flatpickr-disabled).selected:active,.flatpickr-day:not(.flatpickr-disabled).selected:focus,.flatpickr-monthSelect-month:hover,.flatpickr-monthSelect-month:active,.flatpickr-monthSelect-month:focus{border-color:var(--color-hover-primary) !important;background-color:var(--color-hover-primary) !important;color:var(--color-text-inverse) !important}.flatpickr-day.today,.flatpickr-monthSelect-month.today{border:2px solid var(--color-hover-primary) !important}.flatpickr-day.selected:not(.flatpickr-disabled),.flatpickr-monthSelect-month.selected:not(.flatpickr-disabled){border-color:var(--color-primary01) !important;background-color:var(--color-primary01) !important}.flatpickr-weekday:nth-child(6),.flatpickr-weekday:nth-child(7),.flatpickr-day:nth-child(7n+6),.flatpickr-day:nth-child(7n+7){font-weight:var(--font-sb) !important}.flatpickr-time{display:block;height:90px !important;max-height:90px !important;text-align:left}.flatpickr-time::before{display:block;width:100%;padding-left:var(--space-unit);color:var(--color-default-text) !important;content:"Orario";font-size:var(--font-size-1);font-weight:var(--font-sb);text-transform:uppercase}.flatpickr-time.time24hr{margin:calc(var(--space-unit) * 2) !important}.flatpickr-time.time24hr>.numInputWrapper>input:hover,.flatpickr-time.time24hr>.numInputWrapper>input:focus,.flatpickr-time.time24hr>.numInputWrapper:hover{background-color:var(--color-surface01) !important}.flatpickr-time.time24hr>div{width:calc(var(--space-unit) * 10) !important;height:calc(var(--space-unit) * 5.5) !important;margin-right:var(--space-unit) !important;margin-left:var(--space-unit) !important}.flatpickr-time-separator{display:flex;height:calc(var(--space-unit) * 5.5) !important;align-items:center;justify-content:center;font-weight:unset !important}.flatpickr-minute,.flatpickr-hour{font-size:var(--font-size-3) !important;font-weight:var(--font-rg) !important;outline:1px solid black !important}.numInputWrapper:hover .flatpickr-minute,.numInputWrapper:hover .flatpickr-hour,.flatpickr-minute:focus,.flatpickr-hour:focus{outline:1px solid var(--color-primary01) !important}.arrowUp,.arrowDown{width:calc(var(--space-unit) * 2) !important;height:calc(var(--space-unit) * 2) !important;padding:0 !important;border:none !important;opacity:1 !important}.arrowUp{margin-top:calc(var(--space-unit) / 2) !important;margin-right:calc(var(--space-unit) / 2) !important}.arrowDown{top:auto !important;margin-top:calc(var(--space-unit) * 3) !important;margin-right:calc(var(--space-unit) / 2) !important}.arrowUp:hover,.arrowDown:hover{border-color:var(--color-primary03) !important;background-color:var(--color-primary03) !important;border-radius:var(--border-radius);color:var(--color-hover-primary) !important}.arrowUp:active,.arrowDown:active{border-color:var(--color-surface01) !important;background-color:var(--color-surface01) !important;border-radius:var(--border-radius);box-shadow:var(--shadow-2) !important;color:var(--color-primary01) !important}.arrowUp::after,.arrowDown::after{padding:2.5px !important;border:solid var(--color-primary01) !important;border-width:0 1px 1px 0 !important}.arrowUp::after{top:0 !important;margin-top:6px !important;margin-left:5.5px !important;transform:rotate(-135deg)}.arrowDown::after{top:0 !important;left:5.5px !important;margin-top:4px !important;transform:rotate(45deg)}.flatpickr-day:not(.flatpickr-disabled).inRange:hover,.flatpickr-day:not(.flatpickr-disabled).today.inRange:hover,.flatpickr-day.prevMonthDay:not(.flatpickr-disabled).inRange:hover,.flatpickr-monthSelect-month:not(.flatpickr-disabled).inRange:hover{border-color:var(--color-hover-primary) !important;background-color:var(--color-hover-primary) !important}.flatpickr-day:not(.flatpickr-disabled).inRange,.flatpickr-day:not(.flatpickr-disabled).today.inRange,.flatpickr-day:not(.flatpickr-disabled).prevMonthDay.inRange,.flatpickr-monthSelect-month:not(.flatpickr-disabled).inRange{border-color:var(--color-primary03);background-color:var(--color-primary03)}.flatpickr-day:not(.flatpickr-disabled).startRange,.flatpickr-day:not(.flatpickr-disabled).endRange,.flatpickr-monthSelect-month:not(.flatpickr-disabled).startRange,.flatpickr-monthSelect-month:not(.flatpickr-disabled).endRange{border-color:var(--color-primary01) !important;background-color:var(--color-primary01) !important}.flatpickr-day:not(.flatpickr-disabled).prevMonthDay.selected.startRange,.flatpickr-day:not(.flatpickr-disabled).prevMonthDay.selected.endRange{border-color:var(--color-primary01) !important;background-color:var(--color-primary01) !important}.flatpickr-range.second-input{cursor:pointer}.range-pickers-container{display:flex;gap:16px}`;
@@ -369,3 +369,6 @@ const ZRangePicker = class {
 ZRangePicker.style = stylesCss();
 exports.z_range_picker = ZRangePicker;
+//# sourceMappingURL=z-range-picker.entry.cjs.js.map
+//# sourceMappingURL=z-range-picker.cjs.entry.js.map