npm - @zanichelli/albe-web-components - Versions diffs - 16.4.0-rc → 16.4.0 - Mend

@zanichelli/albe-web-components 16.4.0-rc → 16.4.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 (258) hide show

package/dist/collection/components/z-carousel/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/z-carousel/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import {Component, Element, Event, EventEmitter, Host, Prop, State, Watch, h} from \"@stencil/core\";\nimport {ButtonVariant, CarouselArrowsPosition, CarouselProgressMode} from \"../../beans\";\n\n/*\n ZCarousel component.\n * @cssprop --z-carousel-gutter - The gutter between items.\n * @cssprop --z-carousel-items-shadow - The shadow around the items.\n * @slot - Carousel items. Use `<li>` elements inside this slot.\n /\n@Component({\n tag: \"z-carousel\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZCarousel {\n @Element() host: HTMLZCarouselElement;\n\n /* The z-carousel is on loading state /\n @Prop()\n isLoading: boolean;\n\n /* The z-carousel title /\n @Prop()\n label?: string;\n\n /* Shows only one content at a time /\n @Prop({reflect: true})\n single = false;\n\n /* Arrow buttons position /\n @Prop({reflect: true})\n arrowsPosition?: CarouselArrowsPosition;\n\n /* Progress indicator type. Only available for `single` mode /\n @Prop()\n progressMode?: CarouselProgressMode;\n\n /\n Whether the navigation arrow buttons over the items are always visible or only on mouse hover.\n * If set to `false`, the arrows will not be visible on mobile.\n * Only meaningful with `arrowsPosition` set to `OVER`.\n /\n @Prop({reflect: true})\n fixedArrows = true;\n\n /* The height of the ghost loader (only visible when `isLoading` is set to `true`) /\n @Prop()\n ghostLoadingHeight = 100;\n\n /* When enabled, navigating next the last item will go back to the first item and vice versa. /\n @Prop()\n infinite = false;\n\n /* Current item index for single mode. /\n @State()\n current = 0;\n\n /* Items on the slider. /\n @State()\n items: HTMLLIElement[];\n\n /* Index of the indicator to highlight. /\n @State()\n highlightedIndicator: number;\n\n @State()\n canNavigatePrev: boolean;\n\n @State()\n canNavigateNext: boolean;\n\n /* Reference for the items container element. /\n protected itemsContainer: HTMLUListElement;\n\n /* Observer that handles current index change when scrolling on single mode. /\n private intersectionObserver: IntersectionObserver;\n\n /* Observer to check if navigation can still be enabled/showed when the size of the items' container changes /\n private resizeObserver: ResizeObserver;\n\n /* Flag indicating the items container is about to scroll programmatically towards the stored index. /\n private scrollingTo: number = null;\n\n /* Emitted on index change and only in `single` mode. /\n @Event()\n indexChange: EventEmitter<{currentItem: number}>;\n\n @Watch(\"current\")\n onIndexChange(): void {\n this.indexChange.emit({currentItem: this.current});\n }\n\n @Watch(\"single\")\n onSingleModeChange(): void {\n if (this.single && !this.intersectionObserver) {\n this.setIntersectionObserver();\n }\n }\n\n @Watch(\"infinite\")\n onInfiniteModeChange(): void {\n this.checkNavigationValidity();\n }\n\n /\n Set an intersection observer to:\n * - highlight the indicator of the intersecting item during scroll\n * - set the current item to the last intersecting item\n /\n private setIntersectionObserver(): void {\n this.intersectionObserver = new IntersectionObserver(\n (entries) => {\n const entry = entries.find(({isIntersecting}) => isIntersecting);\n if (!entry) {\n return;\n }\n\n const entryIndex = this.items.findIndex((item) => item === entry.target);\n this.highlightedIndicator = entryIndex;\n\n / skip setting the current item if intersection has been triggered by a programmatic scroll\n (@see `goTo` function) and the final index has not been reached /\n if (this.scrollingTo !== null && entryIndex !== this.scrollingTo) {\n return;\n }\n\n this.scrollingTo = null;\n this.current = entryIndex;\n },\n {\n root: this.itemsContainer,\n threshold: 0.5,\n }\n );\n\n this.items.forEach((element) => this.intersectionObserver.observe(element));\n }\n\n /* Update items' list and check conditions to allow navigation /\n private onSlotChange(): void {\n this.items = Array.from(this.host.children) as HTMLLIElement[];\n this.checkNavigationValidity();\n this.setIntersectionObserver();\n this.goTo(this.current);\n }\n\n private onPrev(): void {\n if (this.single) {\n this.goTo(this.infinite && this.current - 1 < 0 ? this.items.length - 1 : Math.max(0, this.current - 1));\n\n return;\n }\n\n this.itemsContainer.scrollBy({\n left:\n this.infinite && this.itemsContainer.scrollLeft == 0\n ? this.itemsContainer.scrollWidth - this.itemsContainer.clientWidth\n : -this.itemsContainer.clientWidth / 2,\n behavior: \"smooth\",\n });\n }\n\n private onNext(): void {\n if (this.single) {\n const next =\n this.infinite && this.current + 1 > this.items.length - 1\n ? 0\n : Math.min(this.current + 1, this.items.length - 1);\n\n return this.goTo(next);\n }\n\n this.itemsContainer.scrollBy({\n left:\n this.infinite &&\n this.itemsContainer.scrollLeft == this.itemsContainer.scrollWidth - this.itemsContainer.clientWidth\n ? -this.itemsContainer.scrollWidth\n : this.itemsContainer.clientWidth / 2,\n behavior: \"smooth\",\n });\n }\n\n /\n Check if navigation buttons can be enabled and set the related local states.\n /\n private checkNavigationValidity(): void {\n if (this.single) {\n this.canNavigatePrev = this.current > 0;\n this.canNavigateNext = this.current < this.items.length - 1;\n\n return;\n }\n\n this.canNavigatePrev = this.itemsContainer.scrollLeft > 0;\n this.canNavigateNext =\n this.itemsContainer.scrollLeft < this.itemsContainer.scrollWidth - this.itemsContainer.clientWidth;\n }\n\n /\n Check if footer has to be rendered.\n /\n private canShowFooter(): boolean {\n if (!this.canNavigatePrev && !this.canNavigateNext) {\n return false;\n }\n\n return (\n this.arrowsPosition === CarouselArrowsPosition.BOTTOM \|\|\n this.progressMode === CarouselProgressMode.DOTS \|\|\n this.progressMode === CarouselProgressMode.NUMBERS\n );\n }\n\n /\n Set current item to passed index.\n * @param index Index to set\n /\n private goTo(index: number): void {\n if (this.current === index) {\n return;\n }\n\n this.scrollingTo = index;\n const left = this.items.slice(0, index).reduce((acc, item) => (acc += item.clientWidth), 0);\n // the scroll will trigger the IntersectionObserver and set the current item\n this.itemsContainer.scroll({\n left,\n behavior: \"smooth\",\n });\n }\n\n /* Check if navigation of at least one direction is enabled */\n private get canNavigate(): boolean {\n return this.canNavigatePrev \|\| this.canNavigateNext;\n }\n\n private setupItems(): void {\n this.items = Array.from(this.host.children) as HTMLLIElement[];\n this.items.forEach((item) => {\n item.setAttribute(\"aria-roledescription\", \"slide\");\n });\n }\n\n componentDidLoad(): void {\n this.itemsContainer?.addEventListener(\"scroll\", this.checkNavigationValidity.bind(this), {passive: true});\n this.resizeObserver = new ResizeObserver(this.checkNavigationValidity.bind(this));\n this.resizeObserver.observe(this.itemsContainer);\n this.setupItems();\n if (this.single) {\n this.setIntersectionObserver();\n }\n this.checkNavigationValidity();\n }\n\n disconnectedCallback(): void {\n this.resizeObserver?.disconnect();\n }\n\n render(): HTMLDivElement \| HTMLZCarouselElement {\n if (this.isLoading) {\n return (\n <div class=\"z-carousel-container\">\n {this.label && <div class=\"heading-3-sb z-carousel-title\">{this.label}</div>}\n <div style={{height: `${this.ghostLoadingHeight}px`}}>\n <z-ghost-loading></z-ghost-loading>\n </div>\n </div>\n );\n }\n\n return (\n <Host>\n <div\n class=\"z-carousel-container\"\n aria-roledescription=\"carousel\"\n aria-label={this.label \|\| \"Carousel\"}\n >\n {this.label && <div class=\"z-carousel-title heading-3-sb\">{this.label}</div>}\n <div class=\"z-carousel-wrapper\">\n <z-button\n class=\"z-carousel-navigation-arrow\"\n variant={ButtonVariant.SECONDARY}\n data-direction=\"prev\"\n icon=\"arrow-left\"\n onClick={this.onPrev.bind(this)}\n disabled={!this.infinite && !this.canNavigatePrev}\n hidden={this.arrowsPosition !== CarouselArrowsPosition.OVER \|\| !this.canNavigate}\n ariaLabel={this.single ? \"Mostra l'elemento precedente\" : \"Mostra gli elementi precedenti\"}\n />\n <ul\n class=\"z-carousel-items-container\"\n aria-atomic=\"false\"\n aria-live=\"polite\"\n ref={(el) => (this.itemsContainer = el)}\n >\n <slot onSlotchange={this.onSlotChange.bind(this)} />\n </ul>\n <z-button\n class=\"z-carousel-navigation-arrow\"\n variant={ButtonVariant.SECONDARY}\n data-direction=\"next\"\n icon=\"arrow-right\"\n onClick={this.onNext.bind(this)}\n disabled={!this.infinite && !this.canNavigateNext}\n hidden={this.arrowsPosition !== CarouselArrowsPosition.OVER \|\| !this.canNavigate}\n ariaLabel={this.single ? \"Mostra l'elemento successivo\" : \"Mostra gli elementi successivi\"}\n />\n </div>\n </div>\n\n {this.canShowFooter() && (\n <div class=\"z-carousel-footer\">\n {this.arrowsPosition === CarouselArrowsPosition.BOTTOM && (\n <z-button\n class=\"z-carousel-navigation-arrow\"\n variant={ButtonVariant.TERTIARY}\n icon=\"arrow-left\"\n onClick={this.onPrev.bind(this)}\n disabled={!this.infinite && !this.canNavigatePrev}\n ariaLabel={this.single ? \"Mostra l'elemento precedente\" : \"Mostra gli elementi precedenti\"}\n />\n )}\n {this.progressMode === CarouselProgressMode.DOTS && this.single && this.items && (\n <div class=\"dots-progress\">\n {this.items.map((_, index) => (\n <button\n type=\"button\"\n class={{current: this.highlightedIndicator === index}}\n aria-label={\n this.highlightedIndicator === index ? \"Elemento corrente\" : `Spostati all'elemento ${index + 1}`\n }\n onClick={() => this.goTo(index)}\n />\n ))}\n </div>\n )}\n {this.progressMode === CarouselProgressMode.NUMBERS && this.single && this.items && (\n <div class=\"numbers-progress interactive-1\">\n <span class=\"current\">{this.current + 1}</span>\n <span>di</span>\n <span>{this.items.length}</span>\n </div>\n )}\n {this.arrowsPosition === CarouselArrowsPosition.BOTTOM && (\n <z-button\n class=\"z-carousel-navigation-arrow\"\n variant={ButtonVariant.TERTIARY}\n icon=\"arrow-right\"\n onClick={this.onNext.bind(this)}\n disabled={!this.infinite && !this.canNavigateNext}\n ariaLabel={this.single ? \"Mostra l'elemento successivo\" : \"Mostra gli elementi successivi\"}\n />\n )}\n </div>\n )}\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/z-carousel/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import {Component, Element, Event, EventEmitter, Host, Prop, State, Watch, h} from \"@stencil/core\";\nimport {ButtonVariant, CarouselArrowsPosition, CarouselProgressMode} from \"../../beans\";\n\n/*\n ZCarousel component.\n * @cssprop --z-carousel-gutter - The gutter between items.\n * @cssprop --z-carousel-items-shadow - The shadow around the items.\n * @slot - Carousel items. Use `<li>` elements inside this slot.\n /\n@Component({\n tag: \"z-carousel\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZCarousel {\n @Element() host: HTMLZCarouselElement;\n\n /* The z-carousel is on loading state /\n @Prop()\n isLoading: boolean;\n\n /* The z-carousel title /\n @Prop()\n label?: string;\n\n /* Shows only one content at a time /\n @Prop({reflect: true})\n single = false;\n\n /* Arrow buttons position /\n @Prop({reflect: true})\n arrowsPosition?: CarouselArrowsPosition;\n\n /* Progress indicator type. Only available for `single` mode /\n @Prop()\n progressMode?: CarouselProgressMode;\n\n /\n Whether the navigation arrow buttons over the items are always visible or only on mouse hover.\n * If set to `false`, the arrows will not be visible on mobile.\n * Only meaningful with `arrowsPosition` set to `OVER`.\n /\n @Prop({reflect: true})\n fixedArrows = true;\n\n /* The height of the ghost loader (only visible when `isLoading` is set to `true`) /\n @Prop()\n ghostLoadingHeight = 100;\n\n /* When enabled, navigating next the last item will go back to the first item and vice versa. /\n @Prop()\n infinite = false;\n\n /* Current item index for single mode. /\n @State()\n current = 0;\n\n /* Items on the slider. /\n @State()\n items: HTMLLIElement[];\n\n /* Index of the indicator to highlight. /\n @State()\n highlightedIndicator: number;\n\n @State()\n canNavigatePrev: boolean;\n\n @State()\n canNavigateNext: boolean;\n\n /* Reference for the items container element. /\n protected itemsContainer: HTMLUListElement;\n\n /* Observer that handles current index change when scrolling on single mode. /\n private intersectionObserver: IntersectionObserver;\n\n /* Observer to check if navigation can still be enabled/showed when the size of the items' container changes /\n private resizeObserver: ResizeObserver;\n\n /* Flag indicating the items container is about to scroll programmatically towards the stored index. /\n private scrollingTo: number = null;\n\n /* Emitted on index change and only in `single` mode. /\n @Event()\n indexChange: EventEmitter<{currentItem: number}>;\n\n @Watch(\"current\")\n onIndexChange(): void {\n this.indexChange.emit({currentItem: this.current});\n }\n\n @Watch(\"single\")\n onSingleModeChange(): void {\n if (this.single && !this.intersectionObserver) {\n this.setIntersectionObserver();\n }\n }\n\n @Watch(\"infinite\")\n onInfiniteModeChange(): void {\n this.checkNavigationValidity();\n }\n\n /\n Set an intersection observer to:\n * - highlight the indicator of the intersecting item during scroll\n * - set the current item to the last intersecting item\n /\n private setIntersectionObserver(): void {\n this.intersectionObserver = new IntersectionObserver(\n (entries) => {\n const entry = entries.find(({isIntersecting}) => isIntersecting);\n if (!entry) {\n return;\n }\n\n const entryIndex = this.items.findIndex((item) => item === entry.target);\n this.highlightedIndicator = entryIndex;\n\n / skip setting the current item if intersection has been triggered by a programmatic scroll\n (@see `goTo` function) and the final index has not been reached /\n if (this.scrollingTo !== null && entryIndex !== this.scrollingTo) {\n return;\n }\n\n this.scrollingTo = null;\n this.current = entryIndex;\n },\n {\n root: this.itemsContainer,\n threshold: 0.5,\n }\n );\n\n this.items.forEach((element) => this.intersectionObserver.observe(element));\n }\n\n /* Update items' list and check conditions to allow navigation /\n private onSlotChange(): void {\n this.items = Array.from(this.host.children) as HTMLLIElement[];\n this.checkNavigationValidity();\n this.setIntersectionObserver();\n this.goTo(this.current);\n }\n\n private onPrev(): void {\n if (this.single) {\n this.goTo(this.infinite && this.current - 1 < 0 ? this.items.length - 1 : Math.max(0, this.current - 1));\n\n return;\n }\n\n this.itemsContainer.scrollBy({\n left:\n this.infinite && this.itemsContainer.scrollLeft == 0\n ? this.itemsContainer.scrollWidth - this.itemsContainer.clientWidth\n : -this.itemsContainer.clientWidth / 2,\n behavior: \"smooth\",\n });\n }\n\n private onNext(): void {\n if (this.single) {\n const next =\n this.infinite && this.current + 1 > this.items.length - 1\n ? 0\n : Math.min(this.current + 1, this.items.length - 1);\n\n return this.goTo(next);\n }\n\n this.itemsContainer.scrollBy({\n left:\n this.infinite &&\n this.itemsContainer.scrollLeft == this.itemsContainer.scrollWidth - this.itemsContainer.clientWidth\n ? -this.itemsContainer.scrollWidth\n : this.itemsContainer.clientWidth / 2,\n behavior: \"smooth\",\n });\n }\n\n /\n Check if navigation buttons can be enabled and set the related local states.\n /\n private checkNavigationValidity(): void {\n if (this.single) {\n this.canNavigatePrev = this.current > 0;\n this.canNavigateNext = this.current < this.items.length - 1;\n\n return;\n }\n\n this.canNavigatePrev = this.itemsContainer.scrollLeft > 0;\n this.canNavigateNext =\n this.itemsContainer.scrollLeft < this.itemsContainer.scrollWidth - this.itemsContainer.clientWidth;\n }\n\n /\n Check if footer has to be rendered.\n /\n private canShowFooter(): boolean {\n if (!this.canNavigatePrev && !this.canNavigateNext) {\n return false;\n }\n\n return (\n this.arrowsPosition === CarouselArrowsPosition.BOTTOM \|\|\n this.progressMode === CarouselProgressMode.DOTS \|\|\n this.progressMode === CarouselProgressMode.NUMBERS\n );\n }\n\n /\n Set current item to passed index.\n * @param index Index to set\n /\n private goTo(index: number): void {\n if (this.current === index) {\n return;\n }\n\n this.scrollingTo = index;\n const left = this.items.slice(0, index).reduce((acc, item) => (acc += item.clientWidth), 0);\n // the scroll will trigger the IntersectionObserver and set the current item\n this.itemsContainer.scroll({\n left,\n behavior: \"smooth\",\n });\n }\n\n /* Check if navigation of at least one direction is enabled */\n private get canNavigate(): boolean {\n return this.canNavigatePrev \|\| this.canNavigateNext;\n }\n\n private setupItems(): void {\n this.items = Array.from(this.host.children) as HTMLLIElement[];\n this.items.forEach((item) => {\n item.setAttribute(\"aria-roledescription\", \"slide\");\n });\n }\n\n componentDidLoad(): void {\n this.itemsContainer?.addEventListener(\"scroll\", this.checkNavigationValidity.bind(this), {passive: true});\n this.resizeObserver = new ResizeObserver(this.checkNavigationValidity.bind(this));\n this.resizeObserver.observe(this.itemsContainer);\n this.setupItems();\n if (this.single) {\n this.setIntersectionObserver();\n }\n this.checkNavigationValidity();\n }\n\n disconnectedCallback(): void {\n this.resizeObserver?.disconnect();\n }\n\n render(): HTMLDivElement \| HTMLZCarouselElement {\n if (this.isLoading) {\n return (\n <div class=\"z-carousel-container\">\n {this.label && <div class=\"heading-3-sb z-carousel-title\">{this.label}</div>}\n <div style={{height: `${this.ghostLoadingHeight}px`}}>\n <z-ghost-loading></z-ghost-loading>\n </div>\n </div>\n );\n }\n\n return (\n <Host>\n <div\n class=\"z-carousel-container\"\n aria-roledescription=\"carousel\"\n aria-label={this.label \|\| \"Carousel\"}\n >\n {this.label && <div class=\"z-carousel-title heading-3-sb\">{this.label}</div>}\n <div class=\"z-carousel-wrapper\">\n <z-button\n class=\"z-carousel-navigation-arrow\"\n variant={ButtonVariant.SECONDARY}\n data-direction=\"prev\"\n icon=\"arrow-left\"\n onClick={this.onPrev.bind(this)}\n disabled={!this.infinite && !this.canNavigatePrev}\n hidden={this.arrowsPosition !== CarouselArrowsPosition.OVER \|\| !this.canNavigate}\n ariaLabel={this.single ? \"Mostra l'elemento precedente\" : \"Mostra gli elementi precedenti\"}\n />\n <ul\n class=\"z-carousel-items-container\"\n aria-atomic=\"false\"\n aria-live=\"polite\"\n ref={(el) => (this.itemsContainer = el)}\n >\n <slot onSlotchange={this.onSlotChange.bind(this)} />\n </ul>\n <z-button\n class=\"z-carousel-navigation-arrow\"\n variant={ButtonVariant.SECONDARY}\n data-direction=\"next\"\n icon=\"arrow-right\"\n onClick={this.onNext.bind(this)}\n disabled={!this.infinite && !this.canNavigateNext}\n hidden={this.arrowsPosition !== CarouselArrowsPosition.OVER \|\| !this.canNavigate}\n ariaLabel={this.single ? \"Mostra l'elemento successivo\" : \"Mostra gli elementi successivi\"}\n />\n </div>\n </div>\n\n {this.canShowFooter() && (\n <div class=\"z-carousel-footer\">\n {this.arrowsPosition === CarouselArrowsPosition.BOTTOM && (\n <z-button\n class=\"z-carousel-navigation-arrow\"\n variant={ButtonVariant.TERTIARY}\n icon=\"arrow-left\"\n onClick={this.onPrev.bind(this)}\n disabled={!this.infinite && !this.canNavigatePrev}\n ariaLabel={this.single ? \"Mostra l'elemento precedente\" : \"Mostra gli elementi precedenti\"}\n />\n )}\n {this.progressMode === CarouselProgressMode.DOTS && this.single && this.items && (\n <div class=\"dots-progress\">\n {this.items.map((_, index) => (\n <button\n type=\"button\"\n class={{current: this.highlightedIndicator === index}}\n aria-label={\n this.highlightedIndicator === index ? \"Elemento corrente\" : `Spostati all'elemento ${index + 1}`\n }\n onClick={() => this.goTo(index)}\n />\n ))}\n </div>\n )}\n {this.progressMode === CarouselProgressMode.NUMBERS && this.single && this.items && (\n <div class=\"numbers-progress interactive-1\">\n <span class=\"current\">{this.current + 1}</span>\n <span>di</span>\n <span>{this.items.length}</span>\n </div>\n )}\n {this.arrowsPosition === CarouselArrowsPosition.BOTTOM && (\n <z-button\n class=\"z-carousel-navigation-arrow\"\n variant={ButtonVariant.TERTIARY}\n icon=\"arrow-right\"\n onClick={this.onNext.bind(this)}\n disabled={!this.infinite && !this.canNavigateNext}\n ariaLabel={this.single ? \"Mostra l'elemento successivo\" : \"Mostra gli elementi successivi\"}\n />\n )}\n </div>\n )}\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/z-carousel/index.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.stories.js","sourceRoot":"","sources":["~~../../../~~src/components/z-carousel/index.stories.ts"],"names":[],"mappings":"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","sourcesContent":["import {Meta, StoryObj} from \"@storybook/web-components\";\nimport {html} from \"lit\";\nimport {repeat} from \"lit/directives/repeat.js\";\nimport {type ZCarousel} from \".\";\nimport {CarouselArrowsPosition, CarouselProgressMode} from \"../../beans\";\nimport {CSSVarsArguments} from \"../../utils/storybook-utils\";\nimport \"../z-ghost-loading/index\";\nimport \"./index\";\nimport \"./index.stories.css\";\n\ntype ZCarouselStoriesArgs = ZCarousel & {itemsCount: number} & CSSVarsArguments<\"z-carousel-gutter\">;\n\n/*\n This component was conceived as a list of elements to respect the rules of accessibility (https://www.w3.org/WAI/tutorials/carousels/working-example/).\n * Pass any number of elements inside its main `slot`.\n * @example```html\n * <z-carousel>\n * <li>element</li>\n * <li>element</li>\n * <li>element</li>\n * </z-carousel>\n * ```\n * > Note: always use `li` elements as direct children of `z-carousel`, as it wraps them with an `ul` element.\n * You can set the gutter between the elements by using the `--z-carousel-gutter` custom property.\n * @example```css\n * z-carousel {\n * --z-carousel-gutter: calc(var(--space-unit) * 2);\n * }```\n /\nconst StoryMeta = {\n title: \"ZCarousel\",\n component: \"z-carousel\",\n decorators: [(Story) => html`<div class=\"z-carousel-story-container\">${Story()}</div>`],\n} satisfies Meta<ZCarouselStoriesArgs>;\n\nexport default StoryMeta;\n\ntype Story = StoryObj<ZCarouselStoriesArgs>;\n\nexport const SlideshowWithArrowsOver = {\n args: {\n \"label\": \"\",\n \"--z-carousel-gutter\": \"var(--space-unit)\",\n \"infinite\": false,\n \"fixedArrows\": true,\n \"itemsCount\": 8,\n },\n render: (args) =>\n html`<z-carousel\n .arrowsPosition=${CarouselArrowsPosition.OVER}\n .fixedArrows=${args.fixedArrows}\n .infinite=${args.infinite}\n label=${args.label}\n style=\"--z-carousel-gutter: ${args[\"--z-carousel-gutter\"]}\"\n >\n ${repeat(\n [...new Array(args.itemsCount)].map((_, i) => i),\n (i) => i,\n (_, index) => html`<li><div class=\"carousel-box\">${index + 1}</div></li>`\n )}\n </z-carousel>`,\n} satisfies Story;\n\nexport const SingleMode = {\n parameters: {\n layout: \"centered\",\n },\n argTypes: {\n arrowsPosition: {\n control: {\n type: \"inline-radio\",\n },\n options: Object.values(CarouselArrowsPosition),\n },\n progressMode: {\n control: {\n type: \"inline-radio\",\n },\n options: Object.values(CarouselProgressMode),\n },\n },\n args: {\n label: \"Carousel title\",\n progressMode: CarouselProgressMode.DOTS,\n arrowsPosition: CarouselArrowsPosition.BOTTOM,\n infinite: false,\n fixedArrows: true,\n itemsCount: 8,\n },\n render: (args) =>\n html`<z-carousel\n .arrowsPosition=${args.arrowsPosition}\n .fixedArrows=${args.fixedArrows}\n .infinite=${args.infinite}\n .progressMode=${args.progressMode}\n .single=${true}\n label=${args.label}\n >\n ${repeat(\n [...new Array(args.itemsCount)].map((_, i) => i),\n (i) => i,\n (_, index) => html`<li><div class=\"carousel-box\">${index + 1}</div></li>`\n )}\n </z-carousel>`,\n} satisfies Story;\n\n/\n You can handle ghost loading for the whole z-carousel by setting two properties:\n * - `isLoading` (boolean): to show a `z-ghost-loading` component instead of the carousel content.\n * - `ghostLoadingHeight` (number): to set the height of the `z-ghost-loading` component.\n * You can also manually handle ghost loading by putting <z-ghost-loading> elements as items.\n */\nexport const GhostLoading = {\n args: {\n label: \"Carousel title\",\n ghostLoadingHeight: 265,\n },\n parameters: {\n controls: {\n exclude: [\"infinite\"],\n },\n },\n render: (args) =>\n html`<z-carousel\n label=${args.label}\n .isLoading=${true}\n .ghostLoadingHeight=${args.ghostLoadingHeight}\n ></z-carousel>`,\n} satisfies Story;\n\nexport const LoadingItems = {\n args: {\n \"label\": \"Carousel title\",\n \"--z-carousel-gutter\": \"8px\",\n },\n parameters: {\n controls: {\n exclude: [\"infinite\"],\n },\n },\n render: (args) =>\n html`<z-carousel\n label=${args.label}\n .infinite=${args.infinite}\n style=\"--z-carousel-gutter: ${args[\"--z-carousel-gutter\"]}\"\n >\n ${repeat(\n new Array(8),\n () =>\n html`<li>\n <div class=\"carousel-box-loading\">\n <z-ghost-loading></z-ghost-loading>\n </div>\n </li>`\n )}\n </z-carousel>`,\n} satisfies Story;\n"]}
1	+ {"version":3,"file":"index.stories.js","sourceRoot":"","sources":["../../../../src/components/z-carousel/index.stories.ts"],"names":[],"mappings":"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","sourcesContent":["import {Meta, StoryObj} from \"@storybook/web-components\";\nimport {html} from \"lit\";\nimport {repeat} from \"lit/directives/repeat.js\";\nimport {type ZCarousel} from \".\";\nimport {CarouselArrowsPosition, CarouselProgressMode} from \"../../beans\";\nimport {CSSVarsArguments} from \"../../utils/storybook-utils\";\nimport \"../z-ghost-loading/index\";\nimport \"./index\";\nimport \"./index.stories.css\";\n\ntype ZCarouselStoriesArgs = ZCarousel & {itemsCount: number} & CSSVarsArguments<\"z-carousel-gutter\">;\n\n/*\n This component was conceived as a list of elements to respect the rules of accessibility (https://www.w3.org/WAI/tutorials/carousels/working-example/).\n * Pass any number of elements inside its main `slot`.\n * @example```html\n * <z-carousel>\n * <li>element</li>\n * <li>element</li>\n * <li>element</li>\n * </z-carousel>\n * ```\n * > Note: always use `li` elements as direct children of `z-carousel`, as it wraps them with an `ul` element.\n * You can set the gutter between the elements by using the `--z-carousel-gutter` custom property.\n * @example```css\n * z-carousel {\n * --z-carousel-gutter: calc(var(--space-unit) * 2);\n * }```\n /\nconst StoryMeta = {\n title: \"ZCarousel\",\n component: \"z-carousel\",\n decorators: [(Story) => html`<div class=\"z-carousel-story-container\">${Story()}</div>`],\n} satisfies Meta<ZCarouselStoriesArgs>;\n\nexport default StoryMeta;\n\ntype Story = StoryObj<ZCarouselStoriesArgs>;\n\nexport const SlideshowWithArrowsOver = {\n args: {\n \"label\": \"\",\n \"--z-carousel-gutter\": \"var(--space-unit)\",\n \"infinite\": false,\n \"fixedArrows\": true,\n \"itemsCount\": 8,\n },\n render: (args) =>\n html`<z-carousel\n .arrowsPosition=${CarouselArrowsPosition.OVER}\n .fixedArrows=${args.fixedArrows}\n .infinite=${args.infinite}\n label=${args.label}\n style=\"--z-carousel-gutter: ${args[\"--z-carousel-gutter\"]}\"\n >\n ${repeat(\n [...new Array(args.itemsCount)].map((_, i) => i),\n (i) => i,\n (_, index) => html`<li><div class=\"carousel-box\">${index + 1}</div></li>`\n )}\n </z-carousel>`,\n} satisfies Story;\n\nexport const SingleMode = {\n parameters: {\n layout: \"centered\",\n },\n argTypes: {\n arrowsPosition: {\n control: {\n type: \"inline-radio\",\n },\n options: Object.values(CarouselArrowsPosition),\n },\n progressMode: {\n control: {\n type: \"inline-radio\",\n },\n options: Object.values(CarouselProgressMode),\n },\n },\n args: {\n label: \"Carousel title\",\n progressMode: CarouselProgressMode.DOTS,\n arrowsPosition: CarouselArrowsPosition.BOTTOM,\n infinite: false,\n fixedArrows: true,\n itemsCount: 8,\n },\n render: (args) =>\n html`<z-carousel\n .arrowsPosition=${args.arrowsPosition}\n .fixedArrows=${args.fixedArrows}\n .infinite=${args.infinite}\n .progressMode=${args.progressMode}\n .single=${true}\n label=${args.label}\n >\n ${repeat(\n [...new Array(args.itemsCount)].map((_, i) => i),\n (i) => i,\n (_, index) => html`<li><div class=\"carousel-box\">${index + 1}</div></li>`\n )}\n </z-carousel>`,\n} satisfies Story;\n\n/\n You can handle ghost loading for the whole z-carousel by setting two properties:\n * - `isLoading` (boolean): to show a `z-ghost-loading` component instead of the carousel content.\n * - `ghostLoadingHeight` (number): to set the height of the `z-ghost-loading` component.\n * You can also manually handle ghost loading by putting <z-ghost-loading> elements as items.\n */\nexport const GhostLoading = {\n args: {\n label: \"Carousel title\",\n ghostLoadingHeight: 265,\n },\n parameters: {\n controls: {\n exclude: [\"infinite\"],\n },\n },\n render: (args) =>\n html`<z-carousel\n label=${args.label}\n .isLoading=${true}\n .ghostLoadingHeight=${args.ghostLoadingHeight}\n ></z-carousel>`,\n} satisfies Story;\n\nexport const LoadingItems = {\n args: {\n \"label\": \"Carousel title\",\n \"--z-carousel-gutter\": \"8px\",\n },\n parameters: {\n controls: {\n exclude: [\"infinite\"],\n },\n },\n render: (args) =>\n html`<z-carousel\n label=${args.label}\n .infinite=${args.infinite}\n style=\"--z-carousel-gutter: ${args[\"--z-carousel-gutter\"]}\"\n >\n ${repeat(\n new Array(8),\n () =>\n html`<li>\n <div class=\"carousel-box-loading\">\n <z-ghost-loading></z-ghost-loading>\n </div>\n </li>`\n )}\n </z-carousel>`,\n} satisfies Story;\n"]}

package/dist/collection/components/z-chip/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["~~../../../~~src/components/z-chip/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,OAAO,EAAE,KAAK,EAAgB,IAAI,EAAE,CAAC,EAAC,MAAM,eAAe,CAAC;AAC/E,OAAO,EAAC,SAAS,EAAC,MAAM,aAAa,CAAC;AAQtC,MAAM,OAAO,KAAK;;;oBASG,SAAS,CAAC,OAAO;;wBAQf,KAAK;yBAId,EAAE;;IAMd,MAAM;QACJ,OAAO,CACL,4DACE,KAAK,EAAE;gBACL,kBAAkB,EAAE,IAAI;gBACxB,oBAAoB,EAAE,CAAC,CAAC,IAAI,CAAC,eAAe;gBAC5C,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,IAAI;aAClB,mBACc,IAAI,CAAC,QAAQ;YAE3B,IAAI,CAAC,IAAI,IAAI,+DAAQ,IAAI,EAAE,IAAI,CAAC,IAAI,GAAI;YACzC,8DAAQ;YACP,IAAI,CAAC,eAAe,IAAI,CACvB,+DACE,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,oBAAoB,CAAC,IAAI,EAAE,gBACnC,IAAI,CAAC,SAAS,EAC1B,QAAQ,EAAE,IAAI,CAAC,QAAQ;gBAEvB,+DACE,KAAK,EAAC,kBAAkB,EACxB,IAAI,EAAE,IAAI,CAAC,eAAe,GAC1B,CACK,CACV,CACG,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {Component, Element, Event, EventEmitter, Prop, h} from \"@stencil/core\";\nimport {ZChipType} from \"../../beans\";\n\n@Component({\n tag: \"z-chip\",\n styleUrl: \"styles.css\",\n shadow: false,\n scoped: true,\n})\nexport class ZChip {\n @Element() el: HTMLZChipElement;\n\n /** Non interactive icon /\n @Prop()\n icon?: string;\n\n /* z-chip size type, can be default, medium or small /\n @Prop({reflect: true})\n type?: ZChipType = ZChipType.DEFAULT;\n\n /* z-chip interactive icon /\n @Prop({reflect: true})\n interactiveIcon?: string;\n\n /* set z-chip as disabled /\n @Prop({reflect: true})\n disabled?: boolean = false;\n\n /* z-chip aria-label string /\n @Prop()\n ariaLabel = \"\";\n\n /* click on interactive icon */\n @Event()\n interactiveIconClick: EventEmitter;\n\n render(): HTMLDivElement {\n return (\n <div\n class={{\n \"z-chip-container\": true,\n \"z-chip-interactive\": !!this.interactiveIcon,\n [this.type]: true,\n }}\n aria-disabled={this.disabled}\n >\n {this.icon && <z-icon name={this.icon} />}\n <slot />\n {this.interactiveIcon && (\n <button\n type=\"button\"\n onClick={() => this.interactiveIconClick.emit()}\n aria-label={this.ariaLabel}\n disabled={this.disabled}\n >\n <z-icon\n class=\"interactive-icon\"\n name={this.interactiveIcon}\n />\n </button>\n )}\n </div>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/z-chip/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,OAAO,EAAE,KAAK,EAAgB,IAAI,EAAE,CAAC,EAAC,MAAM,eAAe,CAAC;AAC/E,OAAO,EAAC,SAAS,EAAC,MAAM,aAAa,CAAC;AAQtC,MAAM,OAAO,KAAK;;;oBASG,SAAS,CAAC,OAAO;;wBAQf,KAAK;yBAId,EAAE;;IAMd,MAAM;QACJ,OAAO,CACL,4DACE,KAAK,EAAE;gBACL,kBAAkB,EAAE,IAAI;gBACxB,oBAAoB,EAAE,CAAC,CAAC,IAAI,CAAC,eAAe;gBAC5C,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,IAAI;aAClB,mBACc,IAAI,CAAC,QAAQ;YAE3B,IAAI,CAAC,IAAI,IAAI,+DAAQ,IAAI,EAAE,IAAI,CAAC,IAAI,GAAI;YACzC,8DAAQ;YACP,IAAI,CAAC,eAAe,IAAI,CACvB,+DACE,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,oBAAoB,CAAC,IAAI,EAAE,gBACnC,IAAI,CAAC,SAAS,EAC1B,QAAQ,EAAE,IAAI,CAAC,QAAQ;gBAEvB,+DACE,KAAK,EAAC,kBAAkB,EACxB,IAAI,EAAE,IAAI,CAAC,eAAe,GAC1B,CACK,CACV,CACG,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {Component, Element, Event, EventEmitter, Prop, h} from \"@stencil/core\";\nimport {ZChipType} from \"../../beans\";\n\n@Component({\n tag: \"z-chip\",\n styleUrl: \"styles.css\",\n shadow: false,\n scoped: true,\n})\nexport class ZChip {\n @Element() el: HTMLZChipElement;\n\n /** Non interactive icon /\n @Prop()\n icon?: string;\n\n /* z-chip size type, can be default, medium or small /\n @Prop({reflect: true})\n type?: ZChipType = ZChipType.DEFAULT;\n\n /* z-chip interactive icon /\n @Prop({reflect: true})\n interactiveIcon?: string;\n\n /* set z-chip as disabled /\n @Prop({reflect: true})\n disabled?: boolean = false;\n\n /* z-chip aria-label string /\n @Prop()\n ariaLabel = \"\";\n\n /* click on interactive icon */\n @Event()\n interactiveIconClick: EventEmitter;\n\n render(): HTMLDivElement {\n return (\n <div\n class={{\n \"z-chip-container\": true,\n \"z-chip-interactive\": !!this.interactiveIcon,\n [this.type]: true,\n }}\n aria-disabled={this.disabled}\n >\n {this.icon && <z-icon name={this.icon} />}\n <slot />\n {this.interactiveIcon && (\n <button\n type=\"button\"\n onClick={() => this.interactiveIconClick.emit()}\n aria-label={this.ariaLabel}\n disabled={this.disabled}\n >\n <z-icon\n class=\"interactive-icon\"\n name={this.interactiveIcon}\n />\n </button>\n )}\n </div>\n );\n }\n}\n"]}

package/dist/collection/components/z-chip/index.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.stories.js","sourceRoot":"","sources":["~~../../../~~src/components/z-chip/index.stories.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,IAAI,EAAC,MAAM,KAAK,CAAC;AAEzB,OAAO,EAAC,SAAS,EAAC,MAAM,aAAa,CAAC;AACtC,OAAO,EAAC,KAAK,EAAC,MAAM,yBAAyB,CAAC;AAC9C,OAAO,SAAS,CAAC;AAEjB,MAAM,SAAS,GAAG;IAChB,KAAK,EAAE,OAAO;IACd,QAAQ,EAAE;QACR,IAAI,EAAE;YACJ,OAAO,EAAE,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC;YACjC,OAAO,EAAE;gBACP,IAAI,EAAE,OAAO;aACd;SACF;KACF;IACD,IAAI,EAAE;QACJ,IAAI,EAAE,SAAS,CAAC,OAAO;QACvB,IAAI,EAAE,KAAK;KACZ;CACoB,CAAC;AAExB,eAAe,SAAS,CAAC;AAIzB,MAAM,CAAC,MAAM,OAAO,GAAG;IACrB,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAA;;aAEX,IAAI,CAAC,IAAI;aACT,IAAI,CAAC,IAAI;;;GAGnB;CACc,CAAC;AAElB,MAAM,CAAC,MAAM,mBAAmB,GAAG;IACjC,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAA;;aAEX,IAAI,CAAC,IAAI;aACT,IAAI,CAAC,IAAI;;;;;GAKnB;CACc,CAAC;AAElB,MAAM,CAAC,MAAM,eAAe,GAAG;IAC7B,QAAQ,EAAE;QACR,IAAI,EAAE;YACJ,OAAO,EAAE,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC;YAC3B,OAAO,EAAE;gBACP,IAAI,EAAE,QAAQ;aACf;SACF;QACD,eAAe,EAAE;YACf,OAAO,EAAE,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC;YAC3B,OAAO,EAAE;gBACP,IAAI,EAAE,QAAQ;aACf;SACF;KACF;IACD,IAAI,EAAE;QACJ,eAAe,EAAE,kBAAkB;QACnC,QAAQ,EAAE,KAAK;KAChB;IACD,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAA;;aAEX,IAAI,CAAC,IAAI;aACT,IAAI,CAAC,IAAI;iBACL,IAAI,CAAC,QAAQ;yBACL,IAAI,CAAC,eAAe;;;GAG1C;CACc,CAAC","sourcesContent":["import {Meta, StoryObj} from \"@storybook/web-components\";\nimport {html} from \"lit\";\nimport {type ZChip} from \".\";\nimport {ZChipType} from \"../../beans\";\nimport {ICONS} from \"../../constants/iconset\";\nimport \"./index\";\n\nconst StoryMeta = {\n title: \"ZChip\",\n argTypes: {\n type: {\n options: Object.values(ZChipType),\n control: {\n type: \"radio\",\n },\n },\n },\n args: {\n type: ZChipType.DEFAULT,\n icon: \"pdf\",\n },\n} satisfies Meta<ZChip>;\n\nexport default StoryMeta;\n\ntype Story = StoryObj<ZChip>;\n\nexport const Default = {\n render: (args) => html`\n <z-chip\n type=${args.type}\n icon=${args.icon}\n >my custom element</z-chip\n >\n `,\n} satisfies Story;\n\nexport const DifferentFontWeight = {\n render: (args) => html`\n <z-chip\n type=${args.type}\n icon=${args.icon}\n >\n <strong>my</strong>\n <span style=\"margin-left: 4px\">custom element</span>\n </z-chip>\n `,\n} satisfies Story;\n\nexport const InteractiveIcon = {\n argTypes: {\n icon: {\n options: Object.keys(ICONS),\n control: {\n type: \"select\",\n },\n },\n interactiveIcon: {\n options: Object.keys(ICONS),\n control: {\n type: \"select\",\n },\n },\n },\n args: {\n interactiveIcon: \"multiply-circled\",\n disabled: false,\n },\n render: (args) => html`\n <z-chip\n type=${args.type}\n icon=${args.icon}\n disabled=${args.disabled}\n .interactiveIcon=${args.interactiveIcon}\n >my custom element</z-chip\n >\n `,\n} satisfies Story;\n"]}
1	+ {"version":3,"file":"index.stories.js","sourceRoot":"","sources":["../../../../src/components/z-chip/index.stories.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,IAAI,EAAC,MAAM,KAAK,CAAC;AAEzB,OAAO,EAAC,SAAS,EAAC,MAAM,aAAa,CAAC;AACtC,OAAO,EAAC,KAAK,EAAC,MAAM,yBAAyB,CAAC;AAC9C,OAAO,SAAS,CAAC;AAEjB,MAAM,SAAS,GAAG;IAChB,KAAK,EAAE,OAAO;IACd,QAAQ,EAAE;QACR,IAAI,EAAE;YACJ,OAAO,EAAE,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC;YACjC,OAAO,EAAE;gBACP,IAAI,EAAE,OAAO;aACd;SACF;KACF;IACD,IAAI,EAAE;QACJ,IAAI,EAAE,SAAS,CAAC,OAAO;QACvB,IAAI,EAAE,KAAK;KACZ;CACoB,CAAC;AAExB,eAAe,SAAS,CAAC;AAIzB,MAAM,CAAC,MAAM,OAAO,GAAG;IACrB,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAA;;aAEX,IAAI,CAAC,IAAI;aACT,IAAI,CAAC,IAAI;;;GAGnB;CACc,CAAC;AAElB,MAAM,CAAC,MAAM,mBAAmB,GAAG;IACjC,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAA;;aAEX,IAAI,CAAC,IAAI;aACT,IAAI,CAAC,IAAI;;;;;GAKnB;CACc,CAAC;AAElB,MAAM,CAAC,MAAM,eAAe,GAAG;IAC7B,QAAQ,EAAE;QACR,IAAI,EAAE;YACJ,OAAO,EAAE,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC;YAC3B,OAAO,EAAE;gBACP,IAAI,EAAE,QAAQ;aACf;SACF;QACD,eAAe,EAAE;YACf,OAAO,EAAE,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC;YAC3B,OAAO,EAAE;gBACP,IAAI,EAAE,QAAQ;aACf;SACF;KACF;IACD,IAAI,EAAE;QACJ,eAAe,EAAE,kBAAkB;QACnC,QAAQ,EAAE,KAAK;KAChB;IACD,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAA;;aAEX,IAAI,CAAC,IAAI;aACT,IAAI,CAAC,IAAI;iBACL,IAAI,CAAC,QAAQ;yBACL,IAAI,CAAC,eAAe;;;GAG1C;CACc,CAAC","sourcesContent":["import {Meta, StoryObj} from \"@storybook/web-components\";\nimport {html} from \"lit\";\nimport {type ZChip} from \".\";\nimport {ZChipType} from \"../../beans\";\nimport {ICONS} from \"../../constants/iconset\";\nimport \"./index\";\n\nconst StoryMeta = {\n title: \"ZChip\",\n argTypes: {\n type: {\n options: Object.values(ZChipType),\n control: {\n type: \"radio\",\n },\n },\n },\n args: {\n type: ZChipType.DEFAULT,\n icon: \"pdf\",\n },\n} satisfies Meta<ZChip>;\n\nexport default StoryMeta;\n\ntype Story = StoryObj<ZChip>;\n\nexport const Default = {\n render: (args) => html`\n <z-chip\n type=${args.type}\n icon=${args.icon}\n >my custom element</z-chip\n >\n `,\n} satisfies Story;\n\nexport const DifferentFontWeight = {\n render: (args) => html`\n <z-chip\n type=${args.type}\n icon=${args.icon}\n >\n <strong>my</strong>\n <span style=\"margin-left: 4px\">custom element</span>\n </z-chip>\n `,\n} satisfies Story;\n\nexport const InteractiveIcon = {\n argTypes: {\n icon: {\n options: Object.keys(ICONS),\n control: {\n type: \"select\",\n },\n },\n interactiveIcon: {\n options: Object.keys(ICONS),\n control: {\n type: \"select\",\n },\n },\n },\n args: {\n interactiveIcon: \"multiply-circled\",\n disabled: false,\n },\n render: (args) => html`\n <z-chip\n type=${args.type}\n icon=${args.icon}\n disabled=${args.disabled}\n .interactiveIcon=${args.interactiveIcon}\n >my custom element</z-chip\n >\n `,\n} satisfies Story;\n"]}

package/dist/collection/components/z-combobox/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/z-combobox/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import {Component, Element, Event, EventEmitter, Prop, State, Watch, h} from \"@stencil/core\";\nimport {ComboItem, ControlSize, InputType, KeyboardCode, ListDividerType, ListSize} from \"../../beans\";\nimport {ZMyzListItem} from \"../../snowflakes/myz/list/z-myz-list-item\";\nimport {handleKeyboardSubmit, randomId} from \"../../utils/utils\";\nimport {ZInput} from \"../z-input\";\n\n@Component({\n tag: \"z-combobox\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZCombobox {\n @Element() element: HTMLZComboboxElement;\n\n /** input unique id /\n @Prop()\n inputid = `combo-${randomId()}`;\n\n /* list items array /\n @Prop()\n items: ComboItem[] \| string;\n\n /* label text /\n @Prop()\n label: string;\n\n /* the combobox is disabled /\n @Prop({reflect: true})\n disabled?: boolean = false;\n\n /* show search input flag (optional) /\n @Prop()\n hassearch?: boolean = false;\n\n /* search input label text (optional) /\n @Prop()\n searchlabel?: string;\n\n /* search input placeholder text (optional) /\n @Prop()\n searchplaceholder?: string;\n\n /* search input title text (optional) /\n @Prop()\n searchtitle?: string;\n\n /* no result text message /\n @Prop()\n noresultslabel?: string = \"Nessun risultato\";\n\n /* toggle combo list opening flag /\n @Prop({mutable: true})\n isopen = false;\n\n /* fixed style flag /\n @Prop()\n isfixed = false;\n\n /* close combobox list text /\n @Prop()\n closesearchtext?: string = \"Chiudi\";\n\n /* show \"check all\" checkbox (optional) /\n @Prop()\n hascheckall?: boolean = false;\n\n /* check all label (optional) /\n @Prop()\n checkalltext?: string = \"Seleziona tutti\";\n\n /* uncheck all label (optional) /\n @Prop()\n uncheckalltext?: string = \"Deseleziona tutti\";\n\n /* max number of checkable items (0 = unlimited) /\n @Prop()\n maxcheckableitems = 0;\n\n /* group items by category /\n @Prop()\n hasgroupitems?: boolean;\n\n /* Available sizes: `big`, `small` and `x-small`. Defaults to `big`. /\n @Prop()\n size?: ControlSize = ControlSize.BIG;\n\n @State()\n searchValue: string;\n\n @State()\n selectedCounter: number;\n\n @State()\n renderItemsList: ComboItem[] = []; // used for render only\n\n @State()\n focusedItemId: string;\n\n @State()\n checkboxes: HTMLInputElement[] = [];\n\n private itemsList: ComboItem[] = [];\n\n private inputType: InputType = InputType.TEXT;\n\n @Watch(\"items\")\n watchItems(): void {\n this.itemsList = typeof this.items === \"string\" ? JSON.parse(this.items) : this.items;\n this.selectedCounter = this.itemsList.filter((item) => item.checked).length;\n this.updateRenderItemsList();\n }\n\n @Watch(\"searchValue\")\n watchSearchValue(): void {\n this.filterItems(this.searchValue);\n }\n\n @Watch(\"checkboxes\")\n watchCheckboxes(): void {\n this.checkboxes.forEach((item, index) => item.setAttribute(\"tabindex\", index === 0 ? \"0\" : \"-1\"));\n }\n\n /* Emitted when value is checked/unchecked. Returns id, items. */\n @Event()\n comboboxChange: EventEmitter;\n\n private emitComboboxChange(): void {\n this.comboboxChange.emit({id: this.inputid, items: this.itemsList});\n }\n\n constructor() {\n this.toggleComboBox = this.toggleComboBox.bind(this);\n this.closeFilterItems = this.closeFilterItems.bind(this);\n }\n\n componentWillLoad(): void {\n this.watchItems();\n }\n\n componentWillRender(): void {\n this.selectedCounter = this.itemsList.filter((item) => item.checked).length;\n }\n\n componentDidRender(): void {\n const checkboxes = this.getAllCheckboxes();\n if (JSON.stringify(checkboxes) !== JSON.stringify(this.checkboxes)) {\n this.checkboxes = checkboxes;\n }\n }\n\n private getItemId(item: ComboItem): string {\n return `combo-checkbox-${this.inputid}-${item.id}`;\n }\n\n private getCheckboxClass(): string {\n return `combo-item-checkbox-input-${this.inputid}`;\n }\n\n private getAllCheckboxes(): HTMLInputElement[] {\n return Array.from(\n this.element.shadowRoot.querySelectorAll(`.${this.getCheckboxClass()} input:not([disabled])`)\n ) as HTMLInputElement[];\n }\n\n private getControlToListSize(): ListSize {\n switch (this.size) {\n case ControlSize.X_SMALL:\n return ListSize.SMALL;\n case ControlSize.SMALL:\n return ListSize.MEDIUM;\n default:\n return ListSize.LARGE;\n }\n }\n\n private handleSelectArrowsNavigation(e: KeyboardEvent, currId: string): void {\n if (![KeyboardCode.ARROW_DOWN, KeyboardCode.ARROW_UP].includes(e.key as KeyboardCode) \|\| !this.isopen) {\n return;\n }\n\n e.preventDefault();\n e.stopPropagation();\n\n const currElem = this.element.shadowRoot.querySelector(`#${currId}`) as HTMLInputElement;\n if (!currElem) {\n return;\n }\n\n const checkboxes = this.checkboxes;\n if (!checkboxes.length) {\n return;\n }\n\n const currElemIndex = checkboxes.indexOf(currElem);\n const firstElemIndex = 0;\n const lastElemIndex = checkboxes.length - 1;\n\n let nextElem = null;\n if (e.key === KeyboardCode.ARROW_DOWN) {\n nextElem = currElemIndex === lastElemIndex ? checkboxes[firstElemIndex] : checkboxes[currElemIndex + 1];\n } else if (e.key === KeyboardCode.ARROW_UP) {\n nextElem = currElemIndex === firstElemIndex ? checkboxes[lastElemIndex] : checkboxes[currElemIndex - 1];\n }\n\n this.focusComboboxItem(nextElem);\n }\n\n private handleHeaderKeyboardEvent(ev: KeyboardEvent): void {\n if (ev.key === KeyboardCode.SPACE) {\n ev.preventDefault();\n }\n if ((ev.key === KeyboardCode.ARROW_DOWN && !this.isopen) \|\| (ev.key === KeyboardCode.ARROW_UP && this.isopen)) {\n this.toggleComboBox();\n }\n }\n\n private handleCheckboxFocus(id: string): void {\n this.focusedItemId = id;\n }\n\n private focusComboboxItem(elem): void {\n this.checkboxes.forEach(function (item) {\n item.setAttribute(\"tabindex\", \"-1\");\n });\n\n elem.setAttribute(\"tabindex\", \"0\");\n elem.focus();\n }\n\n private updateRenderItemsList(): void {\n if (this.searchValue) {\n this.filterItems(this.searchValue);\n } else {\n this.resetRenderItemsList();\n }\n }\n\n private resetRenderItemsList(): void {\n const renderItemsList = [];\n this.itemsList.forEach((item: ComboItem) => {\n renderItemsList.push({...item});\n });\n this.renderItemsList = renderItemsList;\n }\n\n private filterItems(value: string): void {\n if (!value) {\n return this.closeFilterItems();\n }\n\n this.resetRenderItemsList();\n this.renderItemsList = this.renderItemsList.filter((item) => {\n const start = item.name.toUpperCase().indexOf(value.toUpperCase());\n const end = start + value.length;\n const newName =\n item.name.substring(0, start) +\n \"<strong>\" +\n item.name.substring(start, end) +\n \"</strong>\" +\n item.name.substring(end, item.name.length);\n\n item.name = newName;\n\n return start >= 0;\n });\n }\n\n private checkAll(checked = true): void {\n this.itemsList = this.itemsList.map((item: ComboItem) => ({\n ...item,\n checked: checked,\n }));\n this.resetRenderItemsList();\n this.emitComboboxChange();\n }\n\n private closeFilterItems(): void {\n this.searchValue = \"\";\n this.resetRenderItemsList();\n }\n\n private toggleComboBox(): void {\n this.isopen = !this.isopen;\n }\n\n private getComboboxA11yAttributes(): Record<string, unknown> {\n return {\n \"role\": \"combobox\",\n \"aria-label\": this.label,\n \"aria-expanded\": this.isopen ? \"true\" : \"false\",\n \"aria-activedescendant\": this.isopen ? this.focusedItemId : \"\",\n \"aria-controls\": `${this.inputid}_list`,\n };\n }\n\n private renderHeader(): HTMLDivElement {\n return (\n <div\n class=\"header\"\n onClick={() => this.toggleComboBox()}\n onKeyDown={(ev: KeyboardEvent) => {\n this.handleHeaderKeyboardEvent(ev);\n }}\n onKeyUp={(ev: KeyboardEvent) => handleKeyboardSubmit(ev, this.toggleComboBox)}\n role=\"button\"\n tabindex={0}\n aria-expanded={this.isopen ? \"true\" : \"false\"}\n >\n <p class=\"body-3\">\n {this.label}\n <span>{this.selectedCounter > 0 && ` (${this.selectedCounter})`}</span>\n </p>\n <z-icon\n name=\"caret-down\"\n class={this.size}\n />\n </div>\n );\n }\n\n private renderContent(): HTMLDivElement {\n if (!this.isopen) {\n return;\n }\n\n return (\n <div class=\"open-combo-data\">\n {this.hassearch && this.renderSearchInput()}\n {!this.hassearch ? <span {...this.getComboboxA11yAttributes()} /> : null}\n <div\n role=\"listbox\"\n aria-label={this.label}\n aria-multiselectable={true}\n id={`${this.inputid}_list`}\n aria-owns={`${this.checkboxes.map((item) => item.id).join(\" \")}`}\n >\n {this.hascheckall && this.renderCheckAll()}\n {this.renderItems()}\n </div>\n </div>\n );\n }\n\n private renderItems(): HTMLDivElement {\n return (\n <div class={this.searchValue && \"search\"}>\n {this.renderList(this.renderItemsList)}\n {this.searchValue && this.renderCloseButton()}\n </div>\n );\n }\n\n private renderItem(item: ComboItem, index: number, length: number): ZMyzListItem {\n return (\n <z-list-element\n id={item.id}\n htmlTabindex={null}\n dividerType={index !== length - 1 ? ListDividerType.ELEMENT : ListDividerType.NONE}\n size={this.getControlToListSize()}\n >\n <z-input\n type={InputType.CHECKBOX}\n checked={item.checked}\n htmlid={this.getItemId(item)}\n label={item.name}\n class={this.getCheckboxClass()}\n disabled={!item.checked && this.maxcheckableitems && this.selectedCounter >= this.maxcheckableitems}\n size={this.size === ControlSize.X_SMALL ? ControlSize.SMALL : this.size}\n role=\"option\"\n aria-selected={item.checked ? \"true\" : \"false\"}\n onKeyDown={(e: KeyboardEvent) => this.handleSelectArrowsNavigation(e, this.getItemId(item))}\n onInputCheck={(e: CustomEvent) => {\n this.itemsList = this.itemsList.map((i: ComboItem) => {\n if (item.id === i.id) {\n i.checked = e.detail.checked;\n }\n\n return i;\n });\n this.updateRenderItemsList();\n this.emitComboboxChange();\n }}\n onInputFocus={(e: CustomEvent) => this.handleCheckboxFocus(e.detail.id)}\n />\n </z-list-element>\n );\n }\n\n private renderList(items: ComboItem[]): HTMLUListElement {\n if (!items) {\n return;\n }\n if (!items.length && this.searchValue) {\n return this.renderNoSearchResults();\n }\n\n if (this.hasgroupitems) {\n return this.renderGroups(items);\n }\n\n return (\n <ul role=\"none\">\n {items.map((item, i) => {\n return this.renderItem(item, i, items.length);\n })}\n </ul>\n );\n }\n\n private renderGroups(items: ComboItem[]): HTMLUListElement {\n const newData = items.reduce((group, item, index) => {\n const {category} = item;\n const zListItem = this.renderItem(item, index, items.length);\n\n group[category] = group[category] ?? [];\n group[category].push(zListItem);\n\n return group;\n }, {});\n\n const listGroups = Object.entries(newData as {[key: string]: HTMLZListElementElement[]}).map(([key, value]) => {\n return (\n <z-list-group divider-type={ListDividerType.ELEMENT}>\n <span\n class=\"body-3-sb z-list-group-title\"\n slot=\"header-title\"\n >\n {key}\n </span>\n {value.map((item) => item)}\n </z-list-group>\n );\n });\n\n return <ul role=\"none\">{listGroups}</ul>;\n }\n\n private renderNoSearchResults(): HTMLUListElement {\n return (\n <ul role=\"none\">\n <z-myz-list-item\n id=\"no-results\"\n text={this.noresultslabel}\n listitemid=\"no-results\"\n icon=\"multiply-circle\"\n class={this.size}\n />\n </ul>\n );\n }\n\n private renderCloseButton(): HTMLDivElement {\n return (\n <div>\n <a\n onClick={() => this.closeFilterItems()}\n onKeyUp={(e: KeyboardEvent) => handleKeyboardSubmit(e, this.closeFilterItems)}\n role=\"button\"\n tabindex={0}\n >\n {this.closesearchtext}\n </a>\n </div>\n );\n }\n\n private renderSearchInput(): ZInput {\n return (\n <z-input\n htmlid={`${this.inputid}_search`}\n label={this.searchlabel}\n placeholder={this.searchplaceholder}\n htmltitle={this.searchtitle}\n type={this.inputType}\n value={this.searchValue}\n message={false}\n size={this.size}\n aria-autocomplete=\"list\"\n {...this.getComboboxA11yAttributes()}\n onKeyUp={(e: KeyboardEvent) => {\n if (e.key === KeyboardCode.ESC) {\n this.closeFilterItems();\n }\n }}\n onInputChange={(e: CustomEvent) => {\n this.searchValue = e.detail.value;\n }}\n />\n );\n }\n\n private renderCheckAll(): HTMLDivElement {\n if (this.searchValue) {\n return;\n }\n\n const checkAllId = `combo-checkbox-${this.inputid}-check-all`;\n const allChecked = this.selectedCounter === this.itemsList.length;\n\n return (\n <div class=\"check-all-wrapper\">\n <z-input\n type={InputType.CHECKBOX}\n checked={allChecked}\n htmlid={checkAllId}\n class={this.getCheckboxClass()}\n label={allChecked ? this.uncheckalltext : this.checkalltext}\n disabled={this.maxcheckableitems && this.maxcheckableitems < this.itemsList.length}\n size={this.size === ControlSize.X_SMALL ? ControlSize.SMALL : this.size}\n role=\"option\"\n aria-selected={allChecked ? \"true\" : \"false\"}\n onKeyDown={(e: KeyboardEvent) => this.handleSelectArrowsNavigation(e, checkAllId)}\n onInputCheck={(e: CustomEvent) => this.checkAll(e.detail.checked)}\n onInputFocus={(e: CustomEvent) => this.handleCheckboxFocus(e.detail.id)}\n />\n </div>\n );\n }\n\n render(): HTMLDivElement {\n return (\n <div\n data-action={`combo-${this.inputid}`}\n class={{open: this.isopen, fixed: this.isfixed, disabled: this.disabled}}\n id={this.inputid}\n >\n {this.renderHeader()}\n {!this.disabled && this.renderContent()}\n </div>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/z-combobox/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import {Component, Element, Event, EventEmitter, Prop, State, Watch, h} from \"@stencil/core\";\nimport {ComboItem, ControlSize, InputType, KeyboardCode, ListDividerType, ListSize} from \"../../beans\";\nimport {ZMyzListItem} from \"../../snowflakes/myz/list/z-myz-list-item\";\nimport {handleKeyboardSubmit, randomId} from \"../../utils/utils\";\nimport {ZInput} from \"../z-input\";\n\n@Component({\n tag: \"z-combobox\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZCombobox {\n @Element() element: HTMLZComboboxElement;\n\n /** input unique id /\n @Prop()\n inputid = `combo-${randomId()}`;\n\n /* list items array /\n @Prop()\n items: ComboItem[] \| string;\n\n /* label text /\n @Prop()\n label: string;\n\n /* the combobox is disabled /\n @Prop({reflect: true})\n disabled?: boolean = false;\n\n /* show search input flag (optional) /\n @Prop()\n hassearch?: boolean = false;\n\n /* search input label text (optional) /\n @Prop()\n searchlabel?: string;\n\n /* search input placeholder text (optional) /\n @Prop()\n searchplaceholder?: string;\n\n /* search input title text (optional) /\n @Prop()\n searchtitle?: string;\n\n /* no result text message /\n @Prop()\n noresultslabel?: string = \"Nessun risultato\";\n\n /* toggle combo list opening flag /\n @Prop({mutable: true})\n isopen = false;\n\n /* fixed style flag /\n @Prop()\n isfixed = false;\n\n /* close combobox list text /\n @Prop()\n closesearchtext?: string = \"Chiudi\";\n\n /* show \"check all\" checkbox (optional) /\n @Prop()\n hascheckall?: boolean = false;\n\n /* check all label (optional) /\n @Prop()\n checkalltext?: string = \"Seleziona tutti\";\n\n /* uncheck all label (optional) /\n @Prop()\n uncheckalltext?: string = \"Deseleziona tutti\";\n\n /* max number of checkable items (0 = unlimited) /\n @Prop()\n maxcheckableitems = 0;\n\n /* group items by category /\n @Prop()\n hasgroupitems?: boolean;\n\n /* Available sizes: `big`, `small` and `x-small`. Defaults to `big`. /\n @Prop()\n size?: ControlSize = ControlSize.BIG;\n\n @State()\n searchValue: string;\n\n @State()\n selectedCounter: number;\n\n @State()\n renderItemsList: ComboItem[] = []; // used for render only\n\n @State()\n focusedItemId: string;\n\n @State()\n checkboxes: HTMLInputElement[] = [];\n\n private itemsList: ComboItem[] = [];\n\n private inputType: InputType = InputType.TEXT;\n\n @Watch(\"items\")\n watchItems(): void {\n this.itemsList = typeof this.items === \"string\" ? JSON.parse(this.items) : this.items;\n this.selectedCounter = this.itemsList.filter((item) => item.checked).length;\n this.updateRenderItemsList();\n }\n\n @Watch(\"searchValue\")\n watchSearchValue(): void {\n this.filterItems(this.searchValue);\n }\n\n @Watch(\"checkboxes\")\n watchCheckboxes(): void {\n this.checkboxes.forEach((item, index) => item.setAttribute(\"tabindex\", index === 0 ? \"0\" : \"-1\"));\n }\n\n /* Emitted when value is checked/unchecked. Returns id, items. */\n @Event()\n comboboxChange: EventEmitter;\n\n private emitComboboxChange(): void {\n this.comboboxChange.emit({id: this.inputid, items: this.itemsList});\n }\n\n constructor() {\n this.toggleComboBox = this.toggleComboBox.bind(this);\n this.closeFilterItems = this.closeFilterItems.bind(this);\n }\n\n componentWillLoad(): void {\n this.watchItems();\n }\n\n componentWillRender(): void {\n this.selectedCounter = this.itemsList.filter((item) => item.checked).length;\n }\n\n componentDidRender(): void {\n const checkboxes = this.getAllCheckboxes();\n if (JSON.stringify(checkboxes) !== JSON.stringify(this.checkboxes)) {\n this.checkboxes = checkboxes;\n }\n }\n\n private getItemId(item: ComboItem): string {\n return `combo-checkbox-${this.inputid}-${item.id}`;\n }\n\n private getCheckboxClass(): string {\n return `combo-item-checkbox-input-${this.inputid}`;\n }\n\n private getAllCheckboxes(): HTMLInputElement[] {\n return Array.from(\n this.element.shadowRoot.querySelectorAll(`.${this.getCheckboxClass()} input:not([disabled])`)\n ) as HTMLInputElement[];\n }\n\n private getControlToListSize(): ListSize {\n switch (this.size) {\n case ControlSize.X_SMALL:\n return ListSize.SMALL;\n case ControlSize.SMALL:\n return ListSize.MEDIUM;\n default:\n return ListSize.LARGE;\n }\n }\n\n private handleSelectArrowsNavigation(e: KeyboardEvent, currId: string): void {\n if (![KeyboardCode.ARROW_DOWN, KeyboardCode.ARROW_UP].includes(e.key as KeyboardCode) \|\| !this.isopen) {\n return;\n }\n\n e.preventDefault();\n e.stopPropagation();\n\n const currElem = this.element.shadowRoot.querySelector(`#${currId}`) as HTMLInputElement;\n if (!currElem) {\n return;\n }\n\n const checkboxes = this.checkboxes;\n if (!checkboxes.length) {\n return;\n }\n\n const currElemIndex = checkboxes.indexOf(currElem);\n const firstElemIndex = 0;\n const lastElemIndex = checkboxes.length - 1;\n\n let nextElem = null;\n if (e.key === KeyboardCode.ARROW_DOWN) {\n nextElem = currElemIndex === lastElemIndex ? checkboxes[firstElemIndex] : checkboxes[currElemIndex + 1];\n } else if (e.key === KeyboardCode.ARROW_UP) {\n nextElem = currElemIndex === firstElemIndex ? checkboxes[lastElemIndex] : checkboxes[currElemIndex - 1];\n }\n\n this.focusComboboxItem(nextElem);\n }\n\n private handleHeaderKeyboardEvent(ev: KeyboardEvent): void {\n if (ev.key === KeyboardCode.SPACE) {\n ev.preventDefault();\n }\n if ((ev.key === KeyboardCode.ARROW_DOWN && !this.isopen) \|\| (ev.key === KeyboardCode.ARROW_UP && this.isopen)) {\n this.toggleComboBox();\n }\n }\n\n private handleCheckboxFocus(id: string): void {\n this.focusedItemId = id;\n }\n\n private focusComboboxItem(elem): void {\n this.checkboxes.forEach(function (item) {\n item.setAttribute(\"tabindex\", \"-1\");\n });\n\n elem.setAttribute(\"tabindex\", \"0\");\n elem.focus();\n }\n\n private updateRenderItemsList(): void {\n if (this.searchValue) {\n this.filterItems(this.searchValue);\n } else {\n this.resetRenderItemsList();\n }\n }\n\n private resetRenderItemsList(): void {\n const renderItemsList = [];\n this.itemsList.forEach((item: ComboItem) => {\n renderItemsList.push({...item});\n });\n this.renderItemsList = renderItemsList;\n }\n\n private filterItems(value: string): void {\n if (!value) {\n return this.closeFilterItems();\n }\n\n this.resetRenderItemsList();\n this.renderItemsList = this.renderItemsList.filter((item) => {\n const start = item.name.toUpperCase().indexOf(value.toUpperCase());\n const end = start + value.length;\n const newName =\n item.name.substring(0, start) +\n \"<strong>\" +\n item.name.substring(start, end) +\n \"</strong>\" +\n item.name.substring(end, item.name.length);\n\n item.name = newName;\n\n return start >= 0;\n });\n }\n\n private checkAll(checked = true): void {\n this.itemsList = this.itemsList.map((item: ComboItem) => ({\n ...item,\n checked: checked,\n }));\n this.resetRenderItemsList();\n this.emitComboboxChange();\n }\n\n private closeFilterItems(): void {\n this.searchValue = \"\";\n this.resetRenderItemsList();\n }\n\n private toggleComboBox(): void {\n this.isopen = !this.isopen;\n }\n\n private getComboboxA11yAttributes(): Record<string, unknown> {\n return {\n \"role\": \"combobox\",\n \"aria-label\": this.label,\n \"aria-expanded\": this.isopen ? \"true\" : \"false\",\n \"aria-activedescendant\": this.isopen ? this.focusedItemId : \"\",\n \"aria-controls\": `${this.inputid}_list`,\n };\n }\n\n private renderHeader(): HTMLDivElement {\n return (\n <div\n class=\"header\"\n onClick={() => this.toggleComboBox()}\n onKeyDown={(ev: KeyboardEvent) => {\n this.handleHeaderKeyboardEvent(ev);\n }}\n onKeyUp={(ev: KeyboardEvent) => handleKeyboardSubmit(ev, this.toggleComboBox)}\n role=\"button\"\n tabindex={0}\n aria-expanded={this.isopen ? \"true\" : \"false\"}\n >\n <p class=\"body-3\">\n {this.label}\n <span>{this.selectedCounter > 0 && ` (${this.selectedCounter})`}</span>\n </p>\n <z-icon\n name=\"caret-down\"\n class={this.size}\n />\n </div>\n );\n }\n\n private renderContent(): HTMLDivElement {\n if (!this.isopen) {\n return;\n }\n\n return (\n <div class=\"open-combo-data\">\n {this.hassearch && this.renderSearchInput()}\n {!this.hassearch ? <span {...this.getComboboxA11yAttributes()} /> : null}\n <div\n role=\"listbox\"\n aria-label={this.label}\n aria-multiselectable={true}\n id={`${this.inputid}_list`}\n aria-owns={`${this.checkboxes.map((item) => item.id).join(\" \")}`}\n >\n {this.hascheckall && this.renderCheckAll()}\n {this.renderItems()}\n </div>\n </div>\n );\n }\n\n private renderItems(): HTMLDivElement {\n return (\n <div class={this.searchValue && \"search\"}>\n {this.renderList(this.renderItemsList)}\n {this.searchValue && this.renderCloseButton()}\n </div>\n );\n }\n\n private renderItem(item: ComboItem, index: number, length: number): ZMyzListItem {\n return (\n <z-list-element\n id={item.id}\n htmlTabindex={null}\n dividerType={index !== length - 1 ? ListDividerType.ELEMENT : ListDividerType.NONE}\n size={this.getControlToListSize()}\n >\n <z-input\n type={InputType.CHECKBOX}\n checked={item.checked}\n htmlid={this.getItemId(item)}\n label={item.name}\n class={this.getCheckboxClass()}\n disabled={!item.checked && this.maxcheckableitems && this.selectedCounter >= this.maxcheckableitems}\n size={this.size === ControlSize.X_SMALL ? ControlSize.SMALL : this.size}\n role=\"option\"\n aria-selected={item.checked ? \"true\" : \"false\"}\n onKeyDown={(e: KeyboardEvent) => this.handleSelectArrowsNavigation(e, this.getItemId(item))}\n onInputCheck={(e: CustomEvent) => {\n this.itemsList = this.itemsList.map((i: ComboItem) => {\n if (item.id === i.id) {\n i.checked = e.detail.checked;\n }\n\n return i;\n });\n this.updateRenderItemsList();\n this.emitComboboxChange();\n }}\n onInputFocus={(e: CustomEvent) => this.handleCheckboxFocus(e.detail.id)}\n />\n </z-list-element>\n );\n }\n\n private renderList(items: ComboItem[]): HTMLUListElement {\n if (!items) {\n return;\n }\n if (!items.length && this.searchValue) {\n return this.renderNoSearchResults();\n }\n\n if (this.hasgroupitems) {\n return this.renderGroups(items);\n }\n\n return (\n <ul role=\"none\">\n {items.map((item, i) => {\n return this.renderItem(item, i, items.length);\n })}\n </ul>\n );\n }\n\n private renderGroups(items: ComboItem[]): HTMLUListElement {\n const newData = items.reduce((group, item, index) => {\n const {category} = item;\n const zListItem = this.renderItem(item, index, items.length);\n\n group[category] = group[category] ?? [];\n group[category].push(zListItem);\n\n return group;\n }, {});\n\n const listGroups = Object.entries(newData as {[key: string]: HTMLZListElementElement[]}).map(([key, value]) => {\n return (\n <z-list-group divider-type={ListDividerType.ELEMENT}>\n <span\n class=\"body-3-sb z-list-group-title\"\n slot=\"header-title\"\n >\n {key}\n </span>\n {value.map((item) => item)}\n </z-list-group>\n );\n });\n\n return <ul role=\"none\">{listGroups}</ul>;\n }\n\n private renderNoSearchResults(): HTMLUListElement {\n return (\n <ul role=\"none\">\n <z-myz-list-item\n id=\"no-results\"\n text={this.noresultslabel}\n listitemid=\"no-results\"\n icon=\"multiply-circle\"\n class={this.size}\n />\n </ul>\n );\n }\n\n private renderCloseButton(): HTMLDivElement {\n return (\n <div>\n <a\n onClick={() => this.closeFilterItems()}\n onKeyUp={(e: KeyboardEvent) => handleKeyboardSubmit(e, this.closeFilterItems)}\n role=\"button\"\n tabindex={0}\n >\n {this.closesearchtext}\n </a>\n </div>\n );\n }\n\n private renderSearchInput(): ZInput {\n return (\n <z-input\n htmlid={`${this.inputid}_search`}\n label={this.searchlabel}\n placeholder={this.searchplaceholder}\n htmltitle={this.searchtitle}\n type={this.inputType}\n value={this.searchValue}\n message={false}\n size={this.size}\n aria-autocomplete=\"list\"\n {...this.getComboboxA11yAttributes()}\n onKeyUp={(e: KeyboardEvent) => {\n if (e.key === KeyboardCode.ESC) {\n this.closeFilterItems();\n }\n }}\n onInputChange={(e: CustomEvent) => {\n this.searchValue = e.detail.value;\n }}\n />\n );\n }\n\n private renderCheckAll(): HTMLDivElement {\n if (this.searchValue) {\n return;\n }\n\n const checkAllId = `combo-checkbox-${this.inputid}-check-all`;\n const allChecked = this.selectedCounter === this.itemsList.length;\n\n return (\n <div class=\"check-all-wrapper\">\n <z-input\n type={InputType.CHECKBOX}\n checked={allChecked}\n htmlid={checkAllId}\n class={this.getCheckboxClass()}\n label={allChecked ? this.uncheckalltext : this.checkalltext}\n disabled={this.maxcheckableitems && this.maxcheckableitems < this.itemsList.length}\n size={this.size === ControlSize.X_SMALL ? ControlSize.SMALL : this.size}\n role=\"option\"\n aria-selected={allChecked ? \"true\" : \"false\"}\n onKeyDown={(e: KeyboardEvent) => this.handleSelectArrowsNavigation(e, checkAllId)}\n onInputCheck={(e: CustomEvent) => this.checkAll(e.detail.checked)}\n onInputFocus={(e: CustomEvent) => this.handleCheckboxFocus(e.detail.id)}\n />\n </div>\n );\n }\n\n render(): HTMLDivElement {\n return (\n <div\n data-action={`combo-${this.inputid}`}\n class={{open: this.isopen, fixed: this.isfixed, disabled: this.disabled}}\n id={this.inputid}\n >\n {this.renderHeader()}\n {!this.disabled && this.renderContent()}\n </div>\n );\n }\n}\n"]}

package/dist/collection/components/z-combobox/index.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.stories.js","sourceRoot":"","sources":["~~../../../~~src/components/z-combobox/index.stories.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,IAAI,EAAC,MAAM,KAAK,CAAC;AAEzB,OAAO,EAAY,WAAW,EAAC,MAAM,aAAa,CAAC;AACnD,OAAO,SAAS,CAAC;AAEjB,MAAM,SAAS,GAAG;IAChB,KAAK,EAAE,WAAW;IAClB,SAAS,EAAE,YAAY;IACvB,QAAQ,EAAE;QACR,KAAK,EAAE;YACL,OAAO,EAAE;gBACP,IAAI,EAAE,QAAQ;aACf;SACF;QACD,IAAI,EAAE;YACJ,OAAO,EAAE;gBACP,IAAI,EAAE,cAAc;aACrB;YACD,OAAO,EAAE,MAAM,CAAC,MAAM,CAAC,WAAW,CAAC;SACpC;KACF;IACD,IAAI,EAAE;QACJ,KAAK,EAAE;YACL,EAAC,EAAE,EAAE,SAAS,EAAE,IAAI,EAAE,YAAY,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAC;YACzE,EAAC,EAAE,EAAE,SAAS,EAAE,IAAI,EAAE,aAAa,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAC;YAC1E,EAAC,EAAE,EAAE,SAAS,EAAE,IAAI,EAAE,YAAY,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAC;YACzE,EAAC,EAAE,EAAE,UAAU,EAAE,IAAI,EAAE,WAAW,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAC;SACpD;QACvB,YAAY,EAAE,YAAY;QAC1B,eAAe,EAAE,OAAO;QACxB,QAAQ,EAAE,KAAK;QACf,WAAW,EAAE,IAAI;QACjB,SAAS,EAAE,IAAI;QACf,OAAO,EAAE,SAAS;QAClB,OAAO,EAAE,IAAI;QACb,MAAM,EAAE,IAAI;QACZ,KAAK,EAAE,gBAAgB;QACvB,iBAAiB,EAAE,CAAC;QACpB,aAAa,EAAE,KAAK;QACpB,cAAc,EAAE,UAAU;QAC1B,WAAW,EAAE,cAAc;QAC3B,iBAAiB,EAAE,oBAAoB;QACvC,WAAW,EAAE,cAAc;QAC3B,cAAc,EAAE,aAAa;QAC7B,IAAI,EAAE,WAAW,CAAC,GAAG;KACtB;IACD,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CACf,IAAI,CAAA;qBACa,IAAI,CAAC,YAAY;wBACd,IAAI,CAAC,eAAe;iBAC3B,IAAI,CAAC,QAAQ;oBACV,IAAI,CAAC,WAAW;kBAClB,IAAI,CAAC,SAAS;gBAChB,IAAI,CAAC,OAAO;gBACZ,IAAI,CAAC,OAAO;eACb,IAAI,CAAC,MAAM;eACX,IAAI,CAAC,KAAK;cACX,IAAI,CAAC,KAAK;0BACE,IAAI,CAAC,iBAAiB;sBAC1B,IAAI,CAAC,aAAa;uBACjB,IAAI,CAAC,cAAc;oBACtB,IAAI,CAAC,WAAW;0BACV,IAAI,CAAC,iBAAiB;oBAC5B,IAAI,CAAC,WAAW;uBACb,IAAI,CAAC,cAAc;aAC7B,IAAI,CAAC,IAAI;OACf;CACoB,CAAC;AAE5B,eAAe,SAAS,CAAC;AAEzB,MAAM,CAAC,MAAM,OAAO,GAAG,EAAE,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG;IACpB,IAAI,EAAE;QACJ,aAAa,EAAE,IAAI;KACpB;CACc,CAAC;AAElB,MAAM,CAAC,MAAM,QAAQ,GAAG;IACtB,IAAI,EAAE;QACJ,QAAQ,EAAE,IAAI;KACf;CACc,CAAC","sourcesContent":["import {Meta, StoryObj} from \"@storybook/web-components\";\nimport {html} from \"lit\";\nimport {ZCombobox} from \".\";\nimport {ComboItem, ControlSize} from \"../../beans\";\nimport \"./index\";\n\nconst StoryMeta = {\n title: \"ZCombobox\",\n component: \"z-combobox\",\n argTypes: {\n items: {\n control: {\n type: \"object\",\n },\n },\n size: {\n control: {\n type: \"inline-radio\",\n },\n options: Object.values(ControlSize),\n },\n },\n args: {\n items: [\n {id: \"ite_m_1\", name: \"First item\", checked: false, category: \"Gruppo 1\"},\n {id: \"ite_m_2\", name: \"Second item\", checked: false, category: \"Gruppo 1\"},\n {id: \"it_em_3\", name: \"Other item\", checked: false, category: \"Gruppo 2\"},\n {id: \"it_e_m_5\", name: \"Last item\", checked: false, category: \"Gruppo 3\"},\n ] satisfies ComboItem[],\n checkalltext: \"Select all\",\n closesearchtext: \"Close\",\n disabled: false,\n hascheckall: true,\n hassearch: true,\n inputid: \"combo_1\",\n isfixed: true,\n isopen: true,\n label: \"Combobox Label\",\n maxcheckableitems: 4,\n hasgroupitems: false,\n noresultslabel: \"No items\",\n searchlabel: \"Search Label\",\n searchplaceholder: \"Search Placeholder\",\n searchtitle: \"Search Title\",\n uncheckalltext: \"Uncheck All\",\n size: ControlSize.BIG,\n },\n render: (args) =>\n html`<z-combobox\n checkalltext=${args.checkalltext}\n closesearchtext=${args.closesearchtext}\n disabled=${args.disabled}\n hascheckall=${args.hascheckall}\n hassearch=${args.hassearch}\n inputid=${args.inputid}\n isfixed=${args.isfixed}\n isopen=${args.isopen}\n .items=${args.items}\n label=${args.label}\n maxcheckableitems=${args.maxcheckableitems}\n hasgroupitems=${args.hasgroupitems}\n noresultslabel=${args.noresultslabel}\n searchlabel=${args.searchlabel}\n searchplaceholder=${args.searchplaceholder}\n searchtitle=${args.searchtitle}\n uncheckalltext=${args.uncheckalltext}\n size=${args.size}\n />`,\n} satisfies Meta<ZCombobox>;\n\nexport default StoryMeta;\ntype Story = StoryObj<ZCombobox>;\nexport const Default = {};\n\nexport const Groups = {\n args: {\n hasgroupitems: true,\n },\n} satisfies Story;\n\nexport const Disabled = {\n args: {\n disabled: true,\n },\n} satisfies Story;\n"]}
1	+ {"version":3,"file":"index.stories.js","sourceRoot":"","sources":["../../../../src/components/z-combobox/index.stories.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,IAAI,EAAC,MAAM,KAAK,CAAC;AAEzB,OAAO,EAAY,WAAW,EAAC,MAAM,aAAa,CAAC;AACnD,OAAO,SAAS,CAAC;AAEjB,MAAM,SAAS,GAAG;IAChB,KAAK,EAAE,WAAW;IAClB,SAAS,EAAE,YAAY;IACvB,QAAQ,EAAE;QACR,KAAK,EAAE;YACL,OAAO,EAAE;gBACP,IAAI,EAAE,QAAQ;aACf;SACF;QACD,IAAI,EAAE;YACJ,OAAO,EAAE;gBACP,IAAI,EAAE,cAAc;aACrB;YACD,OAAO,EAAE,MAAM,CAAC,MAAM,CAAC,WAAW,CAAC;SACpC;KACF;IACD,IAAI,EAAE;QACJ,KAAK,EAAE;YACL,EAAC,EAAE,EAAE,SAAS,EAAE,IAAI,EAAE,YAAY,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAC;YACzE,EAAC,EAAE,EAAE,SAAS,EAAE,IAAI,EAAE,aAAa,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAC;YAC1E,EAAC,EAAE,EAAE,SAAS,EAAE,IAAI,EAAE,YAAY,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAC;YACzE,EAAC,EAAE,EAAE,UAAU,EAAE,IAAI,EAAE,WAAW,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAC;SACpD;QACvB,YAAY,EAAE,YAAY;QAC1B,eAAe,EAAE,OAAO;QACxB,QAAQ,EAAE,KAAK;QACf,WAAW,EAAE,IAAI;QACjB,SAAS,EAAE,IAAI;QACf,OAAO,EAAE,SAAS;QAClB,OAAO,EAAE,IAAI;QACb,MAAM,EAAE,IAAI;QACZ,KAAK,EAAE,gBAAgB;QACvB,iBAAiB,EAAE,CAAC;QACpB,aAAa,EAAE,KAAK;QACpB,cAAc,EAAE,UAAU;QAC1B,WAAW,EAAE,cAAc;QAC3B,iBAAiB,EAAE,oBAAoB;QACvC,WAAW,EAAE,cAAc;QAC3B,cAAc,EAAE,aAAa;QAC7B,IAAI,EAAE,WAAW,CAAC,GAAG;KACtB;IACD,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CACf,IAAI,CAAA;qBACa,IAAI,CAAC,YAAY;wBACd,IAAI,CAAC,eAAe;iBAC3B,IAAI,CAAC,QAAQ;oBACV,IAAI,CAAC,WAAW;kBAClB,IAAI,CAAC,SAAS;gBAChB,IAAI,CAAC,OAAO;gBACZ,IAAI,CAAC,OAAO;eACb,IAAI,CAAC,MAAM;eACX,IAAI,CAAC,KAAK;cACX,IAAI,CAAC,KAAK;0BACE,IAAI,CAAC,iBAAiB;sBAC1B,IAAI,CAAC,aAAa;uBACjB,IAAI,CAAC,cAAc;oBACtB,IAAI,CAAC,WAAW;0BACV,IAAI,CAAC,iBAAiB;oBAC5B,IAAI,CAAC,WAAW;uBACb,IAAI,CAAC,cAAc;aAC7B,IAAI,CAAC,IAAI;OACf;CACoB,CAAC;AAE5B,eAAe,SAAS,CAAC;AAEzB,MAAM,CAAC,MAAM,OAAO,GAAG,EAAE,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG;IACpB,IAAI,EAAE;QACJ,aAAa,EAAE,IAAI;KACpB;CACc,CAAC;AAElB,MAAM,CAAC,MAAM,QAAQ,GAAG;IACtB,IAAI,EAAE;QACJ,QAAQ,EAAE,IAAI;KACf;CACc,CAAC","sourcesContent":["import {Meta, StoryObj} from \"@storybook/web-components\";\nimport {html} from \"lit\";\nimport {ZCombobox} from \".\";\nimport {ComboItem, ControlSize} from \"../../beans\";\nimport \"./index\";\n\nconst StoryMeta = {\n title: \"ZCombobox\",\n component: \"z-combobox\",\n argTypes: {\n items: {\n control: {\n type: \"object\",\n },\n },\n size: {\n control: {\n type: \"inline-radio\",\n },\n options: Object.values(ControlSize),\n },\n },\n args: {\n items: [\n {id: \"ite_m_1\", name: \"First item\", checked: false, category: \"Gruppo 1\"},\n {id: \"ite_m_2\", name: \"Second item\", checked: false, category: \"Gruppo 1\"},\n {id: \"it_em_3\", name: \"Other item\", checked: false, category: \"Gruppo 2\"},\n {id: \"it_e_m_5\", name: \"Last item\", checked: false, category: \"Gruppo 3\"},\n ] satisfies ComboItem[],\n checkalltext: \"Select all\",\n closesearchtext: \"Close\",\n disabled: false,\n hascheckall: true,\n hassearch: true,\n inputid: \"combo_1\",\n isfixed: true,\n isopen: true,\n label: \"Combobox Label\",\n maxcheckableitems: 4,\n hasgroupitems: false,\n noresultslabel: \"No items\",\n searchlabel: \"Search Label\",\n searchplaceholder: \"Search Placeholder\",\n searchtitle: \"Search Title\",\n uncheckalltext: \"Uncheck All\",\n size: ControlSize.BIG,\n },\n render: (args) =>\n html`<z-combobox\n checkalltext=${args.checkalltext}\n closesearchtext=${args.closesearchtext}\n disabled=${args.disabled}\n hascheckall=${args.hascheckall}\n hassearch=${args.hassearch}\n inputid=${args.inputid}\n isfixed=${args.isfixed}\n isopen=${args.isopen}\n .items=${args.items}\n label=${args.label}\n maxcheckableitems=${args.maxcheckableitems}\n hasgroupitems=${args.hasgroupitems}\n noresultslabel=${args.noresultslabel}\n searchlabel=${args.searchlabel}\n searchplaceholder=${args.searchplaceholder}\n searchtitle=${args.searchtitle}\n uncheckalltext=${args.uncheckalltext}\n size=${args.size}\n />`,\n} satisfies Meta<ZCombobox>;\n\nexport default StoryMeta;\ntype Story = StoryObj<ZCombobox>;\nexport const Default = {};\n\nexport const Groups = {\n args: {\n hasgroupitems: true,\n },\n} satisfies Story;\n\nexport const Disabled = {\n args: {\n disabled: true,\n },\n} satisfies Story;\n"]}

package/dist/collection/components/z-cover-hero/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["~~../../../~~src/components/z-cover-hero/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,CAAC,EAAC,MAAM,eAAe,CAAC;AACxE,OAAO,EAAC,wBAAwB,EAAE,gBAAgB,EAAC,MAAM,aAAa,CAAC;AAEvE;;;;;;;;;;GAUG;AAMH,MAAM,OAAO,UAAU;;uBAOO,gBAAgB,CAAC,OAAO;+BAMR,wBAAwB,CAAC,GAAG;mCASlD,IAAI;;IAE1B;;;;OAIG;IAEO,SAAS,CAAC,EAAC,MAAM,EAAQ;QACjC,IAAI,MAAM,YAAY,KAAK,IAAI,MAAM,CAAC,OAAO,CAAC,cAAc,CAAC,EAAE,CAAC;YAC9D,MAAM,KAAK,GAAG,MAAM,CAAC,YAAY,GAAG,MAAM,CAAC,aAAa,CAAC;YACzD,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,sBAAsB,EAAE,KAAK,CAAC,QAAQ,EAAE,CAAC,CAAC;QACxE,CAAC;IACH,CAAC;IAED;;OAEG;IACK,aAAa;QACnB,OAAO,CACL,WAAK,KAAK,EAAC,mBAAmB;YAC5B,YAAM,IAAI,EAAC,SAAS,GAAQ,CACxB,CACP,CAAC;IACJ,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACF,IAAI,CAAC,OAAO,KAAK,gBAAgB,CAAC,OAAO;gBACxC,IAAI,CAAC,eAAe,KAAK,wBAAwB,CAAC,GAAG;gBACrD,IAAI,CAAC,aAAa,EAAE;YACtB,4DAAK,KAAK,EAAC,gBAAgB;gBACzB,4DAAK,KAAK,EAAC,iBAAiB;oBAC1B,6DAAM,IAAI,EAAC,OAAO,GAAQ,CACtB;gBACN,6DAAM,IAAI,EAAC,aAAa,GAAQ;gBAC/B,IAAI,CAAC,OAAO,KAAK,gBAAgB,CAAC,OAAO,IAAI,IAAI,CAAC,aAAa,EAAE,CAC9D;YACL,IAAI,CAAC,OAAO,KAAK,gBAAgB,CAAC,OAAO;gBACxC,IAAI,CAAC,eAAe,KAAK,wBAAwB,CAAC,MAAM;gBACxD,IAAI,CAAC,aAAa,EAAE,CACjB,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {Component, Element, Host, Listen, Prop, h} from \"@stencil/core\";\nimport {CoverHeroContentPosition, CoverHeroVariant} from \"../../beans\";\n\n/*\n Cover hero component.\n * Component to display a hero image with content.\n \n @slot cover - slot for the cover image.\n * @slot content - slot for the content.\n * @slot info-reveal - slot for the info reveal.\n * @cssprop --cover-hero-overlay - overlay color of the cover hero (CSS `background` property). Default: `linear-gradient(270deg, #0000 0%, #000000e6 100%)`.\n * @cssprop --cover-hero-text-color - color of the text.\n * @cssprop --cover-hero-aspect-ratio - aspect ratio to use for the image. You can pass a fraction or a number representing the ratio. Default: the intrinsic aspect ratio of the slotted image or `16/9`.\n /\n@Component({\n tag: \"z-cover-hero\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZCoverHero {\n @Element() host: HTMLZCoverHeroElement;\n\n /\n Cover hero variant. Can be `OVERLAY` or `STACKED`.\n /\n @Prop({reflect: true})\n variant: CoverHeroVariant = CoverHeroVariant.OVERLAY;\n\n /\n Vertical content position (for `STACKED` variant).\n /\n @Prop({reflect: true})\n contentPosition: CoverHeroContentPosition = CoverHeroContentPosition.TOP;\n\n /\n Whether to keep the image aspect ratio.\n * If set to `false`, the cssprop `--cover-hero-aspect-ratio` will not affect the component's size;\n * instead, the height of the component follows the content's one.\n * Note: it may be necessary to set a min and/or max height to the component.\n /\n @Prop({reflect: true})\n preserveAspectRatio = true;\n\n /\n Store the intrinsic aspect ratio of the slotted image when loaded,\n * to have a default when `--cover-hero-aspect-ratio` is not set.\n * @param target The event target\n /\n @Listen(\"load\", {capture: true})\n protected onImgLoad({target}: Event): void {\n if (target instanceof Image && target.closest(\"[slot=cover]\")) {\n const ratio = target.naturalWidth / target.naturalHeight;\n this.host.style.setProperty(\"--image-aspect-ratio\", ratio.toString());\n }\n }\n\n /\n Template for the content.\n */\n private renderContent(): HTMLDivElement {\n return (\n <div class=\"content-container\">\n <slot name=\"content\"></slot>\n </div>\n );\n }\n\n render(): HTMLZCoverHeroElement {\n return (\n <Host>\n {this.variant === CoverHeroVariant.STACKED &&\n this.contentPosition === CoverHeroContentPosition.TOP &&\n this.renderContent()}\n <div class=\"main-container\">\n <div class=\"cover-container\">\n <slot name=\"cover\"></slot>\n </div>\n <slot name=\"info-reveal\"></slot>\n {this.variant === CoverHeroVariant.OVERLAY && this.renderContent()}\n </div>\n {this.variant === CoverHeroVariant.STACKED &&\n this.contentPosition === CoverHeroContentPosition.BOTTOM &&\n this.renderContent()}\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/z-cover-hero/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,CAAC,EAAC,MAAM,eAAe,CAAC;AACxE,OAAO,EAAC,wBAAwB,EAAE,gBAAgB,EAAC,MAAM,aAAa,CAAC;AAEvE;;;;;;;;;;GAUG;AAMH,MAAM,OAAO,UAAU;;uBAOO,gBAAgB,CAAC,OAAO;+BAMR,wBAAwB,CAAC,GAAG;mCASlD,IAAI;;IAE1B;;;;OAIG;IAEO,SAAS,CAAC,EAAC,MAAM,EAAQ;QACjC,IAAI,MAAM,YAAY,KAAK,IAAI,MAAM,CAAC,OAAO,CAAC,cAAc,CAAC,EAAE,CAAC;YAC9D,MAAM,KAAK,GAAG,MAAM,CAAC,YAAY,GAAG,MAAM,CAAC,aAAa,CAAC;YACzD,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,sBAAsB,EAAE,KAAK,CAAC,QAAQ,EAAE,CAAC,CAAC;QACxE,CAAC;IACH,CAAC;IAED;;OAEG;IACK,aAAa;QACnB,OAAO,CACL,WAAK,KAAK,EAAC,mBAAmB;YAC5B,YAAM,IAAI,EAAC,SAAS,GAAQ,CACxB,CACP,CAAC;IACJ,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACF,IAAI,CAAC,OAAO,KAAK,gBAAgB,CAAC,OAAO;gBACxC,IAAI,CAAC,eAAe,KAAK,wBAAwB,CAAC,GAAG;gBACrD,IAAI,CAAC,aAAa,EAAE;YACtB,4DAAK,KAAK,EAAC,gBAAgB;gBACzB,4DAAK,KAAK,EAAC,iBAAiB;oBAC1B,6DAAM,IAAI,EAAC,OAAO,GAAQ,CACtB;gBACN,6DAAM,IAAI,EAAC,aAAa,GAAQ;gBAC/B,IAAI,CAAC,OAAO,KAAK,gBAAgB,CAAC,OAAO,IAAI,IAAI,CAAC,aAAa,EAAE,CAC9D;YACL,IAAI,CAAC,OAAO,KAAK,gBAAgB,CAAC,OAAO;gBACxC,IAAI,CAAC,eAAe,KAAK,wBAAwB,CAAC,MAAM;gBACxD,IAAI,CAAC,aAAa,EAAE,CACjB,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {Component, Element, Host, Listen, Prop, h} from \"@stencil/core\";\nimport {CoverHeroContentPosition, CoverHeroVariant} from \"../../beans\";\n\n/*\n Cover hero component.\n * Component to display a hero image with content.\n \n @slot cover - slot for the cover image.\n * @slot content - slot for the content.\n * @slot info-reveal - slot for the info reveal.\n * @cssprop --cover-hero-overlay - overlay color of the cover hero (CSS `background` property). Default: `linear-gradient(270deg, #0000 0%, #000000e6 100%)`.\n * @cssprop --cover-hero-text-color - color of the text.\n * @cssprop --cover-hero-aspect-ratio - aspect ratio to use for the image. You can pass a fraction or a number representing the ratio. Default: the intrinsic aspect ratio of the slotted image or `16/9`.\n /\n@Component({\n tag: \"z-cover-hero\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZCoverHero {\n @Element() host: HTMLZCoverHeroElement;\n\n /\n Cover hero variant. Can be `OVERLAY` or `STACKED`.\n /\n @Prop({reflect: true})\n variant: CoverHeroVariant = CoverHeroVariant.OVERLAY;\n\n /\n Vertical content position (for `STACKED` variant).\n /\n @Prop({reflect: true})\n contentPosition: CoverHeroContentPosition = CoverHeroContentPosition.TOP;\n\n /\n Whether to keep the image aspect ratio.\n * If set to `false`, the cssprop `--cover-hero-aspect-ratio` will not affect the component's size;\n * instead, the height of the component follows the content's one.\n * Note: it may be necessary to set a min and/or max height to the component.\n /\n @Prop({reflect: true})\n preserveAspectRatio = true;\n\n /\n Store the intrinsic aspect ratio of the slotted image when loaded,\n * to have a default when `--cover-hero-aspect-ratio` is not set.\n * @param target The event target\n /\n @Listen(\"load\", {capture: true})\n protected onImgLoad({target}: Event): void {\n if (target instanceof Image && target.closest(\"[slot=cover]\")) {\n const ratio = target.naturalWidth / target.naturalHeight;\n this.host.style.setProperty(\"--image-aspect-ratio\", ratio.toString());\n }\n }\n\n /\n Template for the content.\n */\n private renderContent(): HTMLDivElement {\n return (\n <div class=\"content-container\">\n <slot name=\"content\"></slot>\n </div>\n );\n }\n\n render(): HTMLZCoverHeroElement {\n return (\n <Host>\n {this.variant === CoverHeroVariant.STACKED &&\n this.contentPosition === CoverHeroContentPosition.TOP &&\n this.renderContent()}\n <div class=\"main-container\">\n <div class=\"cover-container\">\n <slot name=\"cover\"></slot>\n </div>\n <slot name=\"info-reveal\"></slot>\n {this.variant === CoverHeroVariant.OVERLAY && this.renderContent()}\n </div>\n {this.variant === CoverHeroVariant.STACKED &&\n this.contentPosition === CoverHeroContentPosition.BOTTOM &&\n this.renderContent()}\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/z-cover-hero/index.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.stories.js","sourceRoot":"","sources":["../../../src/components/z-cover-hero/index.stories.ts"],"names":[],"mappings":"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","sourcesContent":["import {Meta, StoryObj} from \"@storybook/web-components\";\nimport {html} from \"lit\";\nimport {styleMap} from \"lit/directives/style-map.js\";\nimport {type ZCoverHero} from \".\";\nimport {CoverHeroContentPosition, CoverHeroVariant} from \"../../beans\";\nimport {CSSVarsArguments, getColorTokenArgConfig} from \"../../utils/storybook-utils\";\nimport \"../z-button/index\";\nimport \"../z-info-reveal/index\";\nimport \"./index\";\nimport \"./index.stories.css\";\n\ntype ZCoverHeroStoriesArgs = ZCoverHero &\n CSSVarsArguments<\"cover-hero-text-color\" \| \"cover-hero-overlay\" \| \"cover-hero-aspect-ratio\">;\n\nconst StoryMeta = {\n title: \"ZCoverHero\",\n component: \"z-cover-hero\",\n argTypes: {\n \"variant\": {\n control: {\n type: \"inline-radio\",\n },\n options: Object.values(CoverHeroVariant),\n },\n \"contentPosition\": {\n if: {\n arg: \"variant\",\n eq: CoverHeroVariant.STACKED,\n },\n control: {\n type: \"inline-radio\",\n },\n options: Object.values(CoverHeroContentPosition),\n },\n \"--cover-hero-text-color\": getColorTokenArgConfig(),\n \"--cover-hero-overlay\": {\n if: {\n arg: \"variant\",\n eq: CoverHeroVariant.OVERLAY,\n },\n },\n \"--cover-hero-aspect-ratio\": {\n if: {\n arg: \"preserveAspectRatio\",\n },\n control: {\n type: \"text\",\n },\n },\n },\n args: {\n \"variant\": CoverHeroVariant.OVERLAY,\n \"contentPosition\": CoverHeroContentPosition.TOP,\n \"preserveAspectRatio\": true,\n \"--cover-hero-aspect-ratio\": undefined,\n \"--cover-hero-overlay\": \"linear-gradient(270deg, #0000 0%, #000000e6 100%)\",\n \"--cover-hero-text-color\": \"var(--color-text-inverse)\",\n },\n} satisfies Meta<ZCoverHeroStoriesArgs>;\n\nexport default StoryMeta;\n\ntype Story = StoryObj<ZCoverHeroStoriesArgs>;\n\nexport const Default = {\n render: (args) => html`\n <div class=\"z-cover-hero-story-container\">\n <z-cover-hero\n .contentPosition=${args.contentPosition}\n .variant=${args.variant}\n .preserveAspectRatio=${args.preserveAspectRatio}\n style=${styleMap({\n \"--cover-hero-overlay\": args[\"--cover-hero-overlay\"],\n \"--cover-hero-text-color\": args[\"--cover-hero-text-color\"],\n \"--cover-hero-aspect-ratio\": args[\"--cover-hero-aspect-ratio\"],\n })}\n >\n <img\n slot=\"cover\"\n src=\"https://images.pexels.com/photos/10323759/pexels-photo-10323759.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2\"\n alt=\"\"\n />\n <div slot=\"content\">\n <div>\n Lorem ipsum dolor sit amet, consectetur adipisci elit, sed do eiusmod tempor incidunt ut labore et dolore\n magna aliqua. Ut enim ad minim veniam, quis nostrum exercitationem ullamco laboriosam, nisi ut aliquid ex ea\n commodi consequatur. Duis aute irure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla\n pariatur.\n </div>\n <div class=\"buttons\">\n <z-button variant=\"primary\">Primary</z-button>\n <z-button variant=\"secondary\">Secondary</z-button>\n </div>\n </div>\n <z-info-reveal\n slot=\"info-reveal\"\n position=\"bottom_right\"\n >\n <span>Lorem ipsum dolor sit amet.</span>\n </z-info-reveal>\n </z-cover-hero>\n </div>\n `,\n} satisfies Story;\n\nexport const CustomAspectRatio = {\n parameters: {\n controls: {\n exclude: [\"variant\", \"preserveAspectRatio\"],\n },\n },\n args: {\n \"--cover-hero-aspect-ratio\": \"16/8\",\n },\n render: (args) => html`\n <div class=\"z-cover-hero-story-container\">\n <z-cover-hero\n style=${styleMap({\n \"--cover-hero-overlay\": args[\"--cover-hero-overlay\"],\n \"--cover-hero-text-color\": args[\"--cover-hero-text-color\"],\n \"--cover-hero-aspect-ratio\": args[\"--cover-hero-aspect-ratio\"],\n })}\n >\n <img\n slot=\"cover\"\n src=\"https://images.pexels.com/photos/10323759/pexels-photo-10323759.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2\"\n alt=\"\"\n />\n <div slot=\"content\">\n <div>\n Lorem ipsum dolor sit amet, consectetur adipisci elit, sed do eiusmod tempor incidunt ut labore et dolore\n magna aliqua. Ut enim ad minim veniam, quis nostrum exercitationem ullamco laboriosam, nisi ut aliquid ex ea\n commodi consequatur. Duis aute irure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla\n pariatur.\n </div>\n <div class=\"buttons\">\n <z-button variant=\"primary\">Primary</z-button>\n <z-button variant=\"secondary\">Secondary</z-button>\n </div>\n </div>\n <z-info-reveal\n slot=\"info-reveal\"\n position=\"bottom_right\"\n >\n <span>Lorem ipsum dolor sit amet.</span>\n </z-info-reveal>\n </z-cover-hero>\n </div>\n `,\n};\n\nexport const AutoAspectRatio = {\n parameters: {\n controls: {\n exclude: [\"variant\", \"preserveAspectRatio\"],\n },\n },\n args: {\n \"--cover-hero-aspect-ratio\": \"\",\n },\n render: (args) => html`\n <div class=\"z-cover-hero-story-container z-cover-hero-auto-ratio\">\n <z-cover-hero\n style=${styleMap({\n \"--cover-hero-overlay\": args[\"--cover-hero-overlay\"],\n \"--cover-hero-text-color\": args[\"--cover-hero-text-color\"],\n \"--cover-hero-aspect-ratio\": args[\"--cover-hero-aspect-ratio\"],\n })}\n >\n <img\n slot=\"cover\"\n src=\"https://images.pexels.com/photos/4934920/pexels-photo-4934920.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2\"\n alt=\"\"\n />\n <div slot=\"content\">\n <div>\n Lorem ipsum dolor sit amet, consectetur adipisci elit, sed do eiusmod tempor incidunt ut labore et dolore\n magna aliqua. Ut enim ad minim veniam, quis nostrum exercitationem ullamco laboriosam, nisi ut aliquid ex ea\n commodi consequatur. Duis aute irure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla\n pariatur.\n </div>\n <div class=\"buttons\">\n <z-button variant=\"primary\">Primary</z-button>\n <z-button variant=\"secondary\">Secondary</z-button>\n </div>\n </div>\n </z-cover-hero>\n </div>\n `,\n};\n\nexport const WithoutPreservingAspectRatio = {\n argTypes: {\n \"variant\": {table: {disable: true}},\n \"preserveAspectRatio\": {table: {disable: true}},\n \"--cover-hero-aspect-ratio\": {table: {disable: true}},\n },\n args: {\n textContent:\n \"Lorem ipsum dolor sit amet, consectetur adipisci elit, sed do eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrum exercitationem ullamco laboriosam, nisi ut aliquid ex ea commodi consequatur. Duis aute irure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.\",\n },\n render: (args) => html`\n <div class=\"z-cover-hero-story-container\">\n <z-cover-hero\n .preserveAspectRatio=${false}\n style=${styleMap({\n \"--cover-hero-overlay\": args[\"--cover-hero-overlay\"],\n \"--cover-hero-text-color\": args[\"--cover-hero-text-color\"],\n })}\n >\n <img\n slot=\"cover\"\n src=\"https://images.pexels.com/photos/10323759/pexels-photo-10323759.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2\"\n alt=\"\"\n />\n <div slot=\"content\">\n <div>${args.textContent}</div>\n <div class=\"buttons\">\n <z-button variant=\"primary\">Primary</z-button>\n <z-button variant=\"secondary\">Secondary</z-button>\n </div>\n </div>\n </z-cover-hero>\n </div>\n `,\n};\n\nexport const StackedVariant = {\n parameters: {\n controls: {\n exclude: [\"variant\", \"preserveAspectRatio\", \"--cover-hero-aspect-ratio\", \"--cover-hero-text-color\"],\n },\n },\n args: {\n variant: CoverHeroVariant.STACKED,\n },\n render: (args) => html`\n <div class=\"z-cover-hero-story-container\">\n <z-cover-hero\n .contentPosition=${args.contentPosition}\n .preserveAspectRatio=${args.preserveAspectRatio}\n .variant=${args.variant}\n >\n <img\n slot=\"cover\"\n src=\"https://images.pexels.com/photos/10323759/pexels-photo-10323759.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2\"\n alt=\"\"\n />\n <div slot=\"content\">\n <div>\n Lorem ipsum dolor sit amet, consectetur adipisci elit, sed do eiusmod tempor incidunt ut labore et dolore\n magna aliqua. Ut enim ad minim veniam, quis nostrum exercitationem ullamco laboriosam, nisi ut aliquid ex ea\n commodi consequatur. Duis aute irure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla\n pariatur.\n </div>\n <div class=\"buttons\">\n <z-button variant=\"primary\">Primary</z-button>\n <z-button variant=\"secondary\">Secondary</z-button>\n </div>\n </div>\n <z-info-reveal\n slot=\"info-reveal\"\n position=\"bottom_right\"\n >\n <span>Lorem ipsum dolor sit amet.</span>\n </z-info-reveal>\n </z-cover-hero>\n </div>\n `,\n};\n"]}
1	+ {"version":3,"file":"index.stories.js","sourceRoot":"","sources":["../../../../src/components/z-cover-hero/index.stories.ts"],"names":[],"mappings":"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","sourcesContent":["import {Meta, StoryObj} from \"@storybook/web-components\";\nimport {html} from \"lit\";\nimport {styleMap} from \"lit/directives/style-map.js\";\nimport {type ZCoverHero} from \".\";\nimport {CoverHeroContentPosition, CoverHeroVariant} from \"../../beans\";\nimport {CSSVarsArguments, getColorTokenArgConfig} from \"../../utils/storybook-utils\";\nimport \"../z-button/index\";\nimport \"../z-info-reveal/index\";\nimport \"./index\";\nimport \"./index.stories.css\";\n\ntype ZCoverHeroStoriesArgs = ZCoverHero &\n CSSVarsArguments<\"cover-hero-text-color\" \| \"cover-hero-overlay\" \| \"cover-hero-aspect-ratio\">;\n\nconst StoryMeta = {\n title: \"ZCoverHero\",\n component: \"z-cover-hero\",\n argTypes: {\n \"variant\": {\n control: {\n type: \"inline-radio\",\n },\n options: Object.values(CoverHeroVariant),\n },\n \"contentPosition\": {\n if: {\n arg: \"variant\",\n eq: CoverHeroVariant.STACKED,\n },\n control: {\n type: \"inline-radio\",\n },\n options: Object.values(CoverHeroContentPosition),\n },\n \"--cover-hero-text-color\": getColorTokenArgConfig(),\n \"--cover-hero-overlay\": {\n if: {\n arg: \"variant\",\n eq: CoverHeroVariant.OVERLAY,\n },\n },\n \"--cover-hero-aspect-ratio\": {\n if: {\n arg: \"preserveAspectRatio\",\n },\n control: {\n type: \"text\",\n },\n },\n },\n args: {\n \"variant\": CoverHeroVariant.OVERLAY,\n \"contentPosition\": CoverHeroContentPosition.TOP,\n \"preserveAspectRatio\": true,\n \"--cover-hero-aspect-ratio\": undefined,\n \"--cover-hero-overlay\": \"linear-gradient(270deg, #0000 0%, #000000e6 100%)\",\n \"--cover-hero-text-color\": \"var(--color-text-inverse)\",\n },\n} satisfies Meta<ZCoverHeroStoriesArgs>;\n\nexport default StoryMeta;\n\ntype Story = StoryObj<ZCoverHeroStoriesArgs>;\n\nexport const Default = {\n render: (args) => html`\n <div class=\"z-cover-hero-story-container\">\n <z-cover-hero\n .contentPosition=${args.contentPosition}\n .variant=${args.variant}\n .preserveAspectRatio=${args.preserveAspectRatio}\n style=${styleMap({\n \"--cover-hero-overlay\": args[\"--cover-hero-overlay\"],\n \"--cover-hero-text-color\": args[\"--cover-hero-text-color\"],\n \"--cover-hero-aspect-ratio\": args[\"--cover-hero-aspect-ratio\"],\n })}\n >\n <img\n slot=\"cover\"\n src=\"https://images.pexels.com/photos/10323759/pexels-photo-10323759.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2\"\n alt=\"\"\n />\n <div slot=\"content\">\n <div>\n Lorem ipsum dolor sit amet, consectetur adipisci elit, sed do eiusmod tempor incidunt ut labore et dolore\n magna aliqua. Ut enim ad minim veniam, quis nostrum exercitationem ullamco laboriosam, nisi ut aliquid ex ea\n commodi consequatur. Duis aute irure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla\n pariatur.\n </div>\n <div class=\"buttons\">\n <z-button variant=\"primary\">Primary</z-button>\n <z-button variant=\"secondary\">Secondary</z-button>\n </div>\n </div>\n <z-info-reveal\n slot=\"info-reveal\"\n position=\"bottom_right\"\n >\n <span>Lorem ipsum dolor sit amet.</span>\n </z-info-reveal>\n </z-cover-hero>\n </div>\n `,\n} satisfies Story;\n\nexport const CustomAspectRatio = {\n parameters: {\n controls: {\n exclude: [\"variant\", \"preserveAspectRatio\"],\n },\n },\n args: {\n \"--cover-hero-aspect-ratio\": \"16/8\",\n },\n render: (args) => html`\n <div class=\"z-cover-hero-story-container\">\n <z-cover-hero\n style=${styleMap({\n \"--cover-hero-overlay\": args[\"--cover-hero-overlay\"],\n \"--cover-hero-text-color\": args[\"--cover-hero-text-color\"],\n \"--cover-hero-aspect-ratio\": args[\"--cover-hero-aspect-ratio\"],\n })}\n >\n <img\n slot=\"cover\"\n src=\"https://images.pexels.com/photos/10323759/pexels-photo-10323759.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2\"\n alt=\"\"\n />\n <div slot=\"content\">\n <div>\n Lorem ipsum dolor sit amet, consectetur adipisci elit, sed do eiusmod tempor incidunt ut labore et dolore\n magna aliqua. Ut enim ad minim veniam, quis nostrum exercitationem ullamco laboriosam, nisi ut aliquid ex ea\n commodi consequatur. Duis aute irure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla\n pariatur.\n </div>\n <div class=\"buttons\">\n <z-button variant=\"primary\">Primary</z-button>\n <z-button variant=\"secondary\">Secondary</z-button>\n </div>\n </div>\n <z-info-reveal\n slot=\"info-reveal\"\n position=\"bottom_right\"\n >\n <span>Lorem ipsum dolor sit amet.</span>\n </z-info-reveal>\n </z-cover-hero>\n </div>\n `,\n};\n\nexport const AutoAspectRatio = {\n parameters: {\n controls: {\n exclude: [\"variant\", \"preserveAspectRatio\"],\n },\n },\n args: {\n \"--cover-hero-aspect-ratio\": \"\",\n },\n render: (args) => html`\n <div class=\"z-cover-hero-story-container z-cover-hero-auto-ratio\">\n <z-cover-hero\n style=${styleMap({\n \"--cover-hero-overlay\": args[\"--cover-hero-overlay\"],\n \"--cover-hero-text-color\": args[\"--cover-hero-text-color\"],\n \"--cover-hero-aspect-ratio\": args[\"--cover-hero-aspect-ratio\"],\n })}\n >\n <img\n slot=\"cover\"\n src=\"https://images.pexels.com/photos/4934920/pexels-photo-4934920.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2\"\n alt=\"\"\n />\n <div slot=\"content\">\n <div>\n Lorem ipsum dolor sit amet, consectetur adipisci elit, sed do eiusmod tempor incidunt ut labore et dolore\n magna aliqua. Ut enim ad minim veniam, quis nostrum exercitationem ullamco laboriosam, nisi ut aliquid ex ea\n commodi consequatur. Duis aute irure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla\n pariatur.\n </div>\n <div class=\"buttons\">\n <z-button variant=\"primary\">Primary</z-button>\n <z-button variant=\"secondary\">Secondary</z-button>\n </div>\n </div>\n </z-cover-hero>\n </div>\n `,\n};\n\nexport const WithoutPreservingAspectRatio = {\n argTypes: {\n \"variant\": {table: {disable: true}},\n \"preserveAspectRatio\": {table: {disable: true}},\n \"--cover-hero-aspect-ratio\": {table: {disable: true}},\n },\n args: {\n textContent:\n \"Lorem ipsum dolor sit amet, consectetur adipisci elit, sed do eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrum exercitationem ullamco laboriosam, nisi ut aliquid ex ea commodi consequatur. Duis aute irure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.\",\n },\n render: (args) => html`\n <div class=\"z-cover-hero-story-container\">\n <z-cover-hero\n .preserveAspectRatio=${false}\n style=${styleMap({\n \"--cover-hero-overlay\": args[\"--cover-hero-overlay\"],\n \"--cover-hero-text-color\": args[\"--cover-hero-text-color\"],\n })}\n >\n <img\n slot=\"cover\"\n src=\"https://images.pexels.com/photos/10323759/pexels-photo-10323759.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2\"\n alt=\"\"\n />\n <div slot=\"content\">\n <div>${args.textContent}</div>\n <div class=\"buttons\">\n <z-button variant=\"primary\">Primary</z-button>\n <z-button variant=\"secondary\">Secondary</z-button>\n </div>\n </div>\n </z-cover-hero>\n </div>\n `,\n};\n\nexport const StackedVariant = {\n parameters: {\n controls: {\n exclude: [\"variant\", \"preserveAspectRatio\", \"--cover-hero-aspect-ratio\", \"--cover-hero-text-color\"],\n },\n },\n args: {\n variant: CoverHeroVariant.STACKED,\n },\n render: (args) => html`\n <div class=\"z-cover-hero-story-container\">\n <z-cover-hero\n .contentPosition=${args.contentPosition}\n .preserveAspectRatio=${args.preserveAspectRatio}\n .variant=${args.variant}\n >\n <img\n slot=\"cover\"\n src=\"https://images.pexels.com/photos/10323759/pexels-photo-10323759.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2\"\n alt=\"\"\n />\n <div slot=\"content\">\n <div>\n Lorem ipsum dolor sit amet, consectetur adipisci elit, sed do eiusmod tempor incidunt ut labore et dolore\n magna aliqua. Ut enim ad minim veniam, quis nostrum exercitationem ullamco laboriosam, nisi ut aliquid ex ea\n commodi consequatur. Duis aute irure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla\n pariatur.\n </div>\n <div class=\"buttons\">\n <z-button variant=\"primary\">Primary</z-button>\n <z-button variant=\"secondary\">Secondary</z-button>\n </div>\n </div>\n <z-info-reveal\n slot=\"info-reveal\"\n position=\"bottom_right\"\n >\n <span>Lorem ipsum dolor sit amet.</span>\n </z-info-reveal>\n </z-cover-hero>\n </div>\n `,\n};\n"]}

package/dist/collection/components/z-divider/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["~~../../../~~src/components/z-divider/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAC,MAAM,eAAe,CAAC;AACvD,OAAO,EAAC,kBAAkB,EAAE,WAAW,EAAC,MAAM,aAAa,CAAC;AAO5D,MAAM,OAAO,QAAQ;;oBAGE,WAAW,CAAC,KAAK;qBAIrB,SAAS;2BAIS,kBAAkB,CAAC,UAAU;;IAEhE,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDACH,KAAK,EAAE,WAAW,IAAI,CAAC,IAAI,YAAY,IAAI,CAAC,WAAW,EAAE,EACzD,KAAK,EAAE,EAAC,eAAe,EAAE,SAAS,IAAI,CAAC,KAAK,GAAG,EAAC,GAChD,CACH,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {Component, Host, Prop, h} from \"@stencil/core\";\nimport {DividerOrientation, DividerSize} from \"../../beans\";\n@Component({\n tag: \"z-divider\",\n styleUrl: \"styles.css\",\n shadow: false,\n scoped: true,\n})\nexport class ZDivider {\n /** [optional] Divider size /\n @Prop()\n size?: DividerSize = DividerSize.SMALL;\n\n /* [optional] Divider color /\n @Prop()\n color?: string = \"gray200\";\n\n /* [optional] Divider orintation */\n @Prop()\n orientation?: DividerOrientation = DividerOrientation.HORIZONTAL;\n\n render(): HTMLZDividerElement {\n return (\n <Host\n class={`divider-${this.size} divider-${this.orientation}`}\n style={{backgroundColor: `var(--${this.color})`}}\n />\n );\n }\n}\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/z-divider/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAC,MAAM,eAAe,CAAC;AACvD,OAAO,EAAC,kBAAkB,EAAE,WAAW,EAAC,MAAM,aAAa,CAAC;AAO5D,MAAM,OAAO,QAAQ;;oBAGE,WAAW,CAAC,KAAK;qBAIrB,SAAS;2BAIS,kBAAkB,CAAC,UAAU;;IAEhE,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDACH,KAAK,EAAE,WAAW,IAAI,CAAC,IAAI,YAAY,IAAI,CAAC,WAAW,EAAE,EACzD,KAAK,EAAE,EAAC,eAAe,EAAE,SAAS,IAAI,CAAC,KAAK,GAAG,EAAC,GAChD,CACH,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {Component, Host, Prop, h} from \"@stencil/core\";\nimport {DividerOrientation, DividerSize} from \"../../beans\";\n@Component({\n tag: \"z-divider\",\n styleUrl: \"styles.css\",\n shadow: false,\n scoped: true,\n})\nexport class ZDivider {\n /** [optional] Divider size /\n @Prop()\n size?: DividerSize = DividerSize.SMALL;\n\n /* [optional] Divider color /\n @Prop()\n color?: string = \"gray200\";\n\n /* [optional] Divider orintation */\n @Prop()\n orientation?: DividerOrientation = DividerOrientation.HORIZONTAL;\n\n render(): HTMLZDividerElement {\n return (\n <Host\n class={`divider-${this.size} divider-${this.orientation}`}\n style={{backgroundColor: `var(--${this.color})`}}\n />\n );\n }\n}\n"]}

package/dist/collection/components/z-divider/index.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.stories.js","sourceRoot":"","sources":["~~../../../~~src/components/z-divider/index.stories.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,IAAI,EAAC,MAAM,KAAK,CAAC;AAEzB,OAAO,EAAC,kBAAkB,EAAE,WAAW,EAAC,MAAM,aAAa,CAAC;AAC5D,OAAO,EAAC,cAAc,EAAC,MAAM,6BAA6B,CAAC;AAC3D,OAAO,SAAS,CAAC;AAEjB,MAAM,SAAS,GAAG;IAChB,KAAK,EAAE,UAAU;IACjB,SAAS,EAAE,WAAW;IACtB,QAAQ,EAAE;QACR,IAAI,EAAE;YACJ,OAAO,EAAE;gBACP,IAAI,EAAE,QAAQ;aACf;YACD,OAAO,EAAE,MAAM,CAAC,MAAM,CAAC,WAAW,CAAC;SACpC;QACD,WAAW,EAAE;YACX,OAAO,EAAE;gBACP,IAAI,EAAE,QAAQ;aACf;YACD,OAAO,EAAE,MAAM,CAAC,MAAM,CAAC,kBAAkB,CAAC;SAC3C;QACD,KAAK,EAAE;YACL,OAAO,EAAE;gBACP,IAAI,EAAE,QAAQ;aACf;YACD,OAAO,EAAE,cAAc,EAAE,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;SAClE;KACF;IACD,IAAI,EAAE;QACJ,IAAI,EAAE,WAAW,CAAC,KAAK;QACvB,KAAK,EAAE,SAAS;QAChB,WAAW,EAAE,kBAAkB,CAAC,UAAU;KAC3C;CACuB,CAAC;AAC3B,eAAe,SAAS,CAAC;AAEzB,MAAM,CAAC,MAAM,OAAO,GAAG;IACrB,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CACf,IAAI,CAAA;;gBAEQ,IAAI,CAAC,IAAI;iBACR,IAAI,CAAC,KAAK;uBACJ,IAAI,CAAC,WAAW;;WAE5B;IACT,IAAI,EAAE,UAAU;CACY,CAAC","sourcesContent":["import {Meta, StoryObj} from \"@storybook/web-components\";\nimport {html} from \"lit\";\nimport {ZDivider} from \".\";\nimport {DividerOrientation, DividerSize} from \"../../beans\";\nimport {getColorTokens} from \"../../utils/storybook-utils\";\nimport \"./index\";\n\nconst StoryMeta = {\n title: \"ZDivider\",\n component: \"z-divider\",\n argTypes: {\n size: {\n control: {\n type: \"select\",\n },\n options: Object.values(DividerSize),\n },\n orientation: {\n control: {\n type: \"select\",\n },\n options: Object.values(DividerOrientation),\n },\n color: {\n control: {\n type: \"select\",\n },\n options: getColorTokens().map((token) => token.replace(\"--\", \"\")),\n },\n },\n args: {\n size: DividerSize.SMALL,\n color: \"gray200\",\n orientation: DividerOrientation.HORIZONTAL,\n },\n} satisfies Meta<ZDivider>;\nexport default StoryMeta;\n\nexport const Default = {\n render: (args) =>\n html`<div style=\"height: 300px; padding: 24px\">\n <z-divider\n size=\"${args.size}\"\n color=\"${args.color}\"\n orientation=\"${args.orientation}\"\n ></z-divider>\n </div>`,\n name: \"ZDivider\",\n} satisfies StoryObj<ZDivider>;\n"]}
1	+ {"version":3,"file":"index.stories.js","sourceRoot":"","sources":["../../../../src/components/z-divider/index.stories.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,IAAI,EAAC,MAAM,KAAK,CAAC;AAEzB,OAAO,EAAC,kBAAkB,EAAE,WAAW,EAAC,MAAM,aAAa,CAAC;AAC5D,OAAO,EAAC,cAAc,EAAC,MAAM,6BAA6B,CAAC;AAC3D,OAAO,SAAS,CAAC;AAEjB,MAAM,SAAS,GAAG;IAChB,KAAK,EAAE,UAAU;IACjB,SAAS,EAAE,WAAW;IACtB,QAAQ,EAAE;QACR,IAAI,EAAE;YACJ,OAAO,EAAE;gBACP,IAAI,EAAE,QAAQ;aACf;YACD,OAAO,EAAE,MAAM,CAAC,MAAM,CAAC,WAAW,CAAC;SACpC;QACD,WAAW,EAAE;YACX,OAAO,EAAE;gBACP,IAAI,EAAE,QAAQ;aACf;YACD,OAAO,EAAE,MAAM,CAAC,MAAM,CAAC,kBAAkB,CAAC;SAC3C;QACD,KAAK,EAAE;YACL,OAAO,EAAE;gBACP,IAAI,EAAE,QAAQ;aACf;YACD,OAAO,EAAE,cAAc,EAAE,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;SAClE;KACF;IACD,IAAI,EAAE;QACJ,IAAI,EAAE,WAAW,CAAC,KAAK;QACvB,KAAK,EAAE,SAAS;QAChB,WAAW,EAAE,kBAAkB,CAAC,UAAU;KAC3C;CACuB,CAAC;AAC3B,eAAe,SAAS,CAAC;AAEzB,MAAM,CAAC,MAAM,OAAO,GAAG;IACrB,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CACf,IAAI,CAAA;;gBAEQ,IAAI,CAAC,IAAI;iBACR,IAAI,CAAC,KAAK;uBACJ,IAAI,CAAC,WAAW;;WAE5B;IACT,IAAI,EAAE,UAAU;CACY,CAAC","sourcesContent":["import {Meta, StoryObj} from \"@storybook/web-components\";\nimport {html} from \"lit\";\nimport {ZDivider} from \".\";\nimport {DividerOrientation, DividerSize} from \"../../beans\";\nimport {getColorTokens} from \"../../utils/storybook-utils\";\nimport \"./index\";\n\nconst StoryMeta = {\n title: \"ZDivider\",\n component: \"z-divider\",\n argTypes: {\n size: {\n control: {\n type: \"select\",\n },\n options: Object.values(DividerSize),\n },\n orientation: {\n control: {\n type: \"select\",\n },\n options: Object.values(DividerOrientation),\n },\n color: {\n control: {\n type: \"select\",\n },\n options: getColorTokens().map((token) => token.replace(\"--\", \"\")),\n },\n },\n args: {\n size: DividerSize.SMALL,\n color: \"gray200\",\n orientation: DividerOrientation.HORIZONTAL,\n },\n} satisfies Meta<ZDivider>;\nexport default StoryMeta;\n\nexport const Default = {\n render: (args) =>\n html`<div style=\"height: 300px; padding: 24px\">\n <z-divider\n size=\"${args.size}\"\n color=\"${args.color}\"\n orientation=\"${args.orientation}\"\n ></z-divider>\n </div>`,\n name: \"ZDivider\",\n} satisfies StoryObj<ZDivider>;\n"]}

package/dist/collection/components/z-ghost-loading/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["~~../../../~~src/components/z-ghost-loading/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,CAAC,EAAE,IAAI,EAAC,MAAM,eAAe,CAAC;AAMjD,MAAM,OAAO,aAAa;IACxB,MAAM;QACJ,OAAO,EAAC,IAAI,sDAAG,CAAC;IAClB,CAAC;;;;;;;;;CACF","sourcesContent":["import {Component, h, Host} from \"@stencil/core\";\n@Component({\n tag: \"z-ghost-loading\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZGhostLoading {\n render(): HTMLZGhostLoadingElement {\n return <Host />;\n }\n}\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/z-ghost-loading/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,CAAC,EAAE,IAAI,EAAC,MAAM,eAAe,CAAC;AAMjD,MAAM,OAAO,aAAa;IACxB,MAAM;QACJ,OAAO,EAAC,IAAI,sDAAG,CAAC;IAClB,CAAC;;;;;;;;;CACF","sourcesContent":["import {Component, h, Host} from \"@stencil/core\";\n@Component({\n tag: \"z-ghost-loading\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZGhostLoading {\n render(): HTMLZGhostLoadingElement {\n return <Host />;\n }\n}\n"]}

package/dist/collection/components/z-ghost-loading/index.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.stories.js","sourceRoot":"","sources":["~~../../../~~src/components/z-ghost-loading/index.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,IAAI,EAAC,MAAM,KAAK,CAAC;AACzB,OAAO,SAAS,CAAC;AAEjB,eAAe;IACb,KAAK,EAAE,eAAe;IACtB,SAAS,EAAE,iBAAiB;CAC7B,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAG;IAC3B,MAAM,EAAE,GAAG,EAAE,CACX,IAAI,CAAA;;;;;;;;;;;;aAYK;CACZ,CAAC","sourcesContent":["import {html} from \"lit\";\nimport \"./index\";\n\nexport default {\n title: \"ZGhostLoading\",\n component: \"z-ghost-loading\",\n};\n\nexport const ZGhostLoading = {\n render: () =>\n html`<div style=\"height:24px; padding-bottom:8px;\"><z-ghost-loading></z-ghost-loading></div>\n <div style=\"width:50%; height:24px\"><z-ghost-loading></z-ghost-loading></div>\n <br /><br />\n <div style=\"height:12px; padding-bottom:8px;\"><z-ghost-loading></z-ghost-loading></div>\n <div style=\"height:12px; padding-bottom:8px;\"><z-ghost-loading></z-ghost-loading></div>\n <div style=\"height:12px; padding-bottom:8px;\"><z-ghost-loading></z-ghost-loading></div>\n <div style=\"width:50%; height:12px\"><z-ghost-loading></z-ghost-loading></div>\n <br /><br />\n <div style=\"display:flex\">\n <div style=\"width:30%; height:50px; padding-right:20px\"><z-ghost-loading></z-ghost-loading></div>\n <div style=\"width:30%; height:50px; padding-right:20px\"><z-ghost-loading></z-ghost-loading></div>\n <div style=\"width:30%; height:50px;\"><z-ghost-loading></z-ghost-loading></div>\n </div>`,\n};\n"]}
1	+ {"version":3,"file":"index.stories.js","sourceRoot":"","sources":["../../../../src/components/z-ghost-loading/index.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,IAAI,EAAC,MAAM,KAAK,CAAC;AACzB,OAAO,SAAS,CAAC;AAEjB,eAAe;IACb,KAAK,EAAE,eAAe;IACtB,SAAS,EAAE,iBAAiB;CAC7B,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAG;IAC3B,MAAM,EAAE,GAAG,EAAE,CACX,IAAI,CAAA;;;;;;;;;;;;aAYK;CACZ,CAAC","sourcesContent":["import {html} from \"lit\";\nimport \"./index\";\n\nexport default {\n title: \"ZGhostLoading\",\n component: \"z-ghost-loading\",\n};\n\nexport const ZGhostLoading = {\n render: () =>\n html`<div style=\"height:24px; padding-bottom:8px;\"><z-ghost-loading></z-ghost-loading></div>\n <div style=\"width:50%; height:24px\"><z-ghost-loading></z-ghost-loading></div>\n <br /><br />\n <div style=\"height:12px; padding-bottom:8px;\"><z-ghost-loading></z-ghost-loading></div>\n <div style=\"height:12px; padding-bottom:8px;\"><z-ghost-loading></z-ghost-loading></div>\n <div style=\"height:12px; padding-bottom:8px;\"><z-ghost-loading></z-ghost-loading></div>\n <div style=\"width:50%; height:12px\"><z-ghost-loading></z-ghost-loading></div>\n <br /><br />\n <div style=\"display:flex\">\n <div style=\"width:30%; height:50px; padding-right:20px\"><z-ghost-loading></z-ghost-loading></div>\n <div style=\"width:30%; height:50px; padding-right:20px\"><z-ghost-loading></z-ghost-loading></div>\n <div style=\"width:30%; height:50px;\"><z-ghost-loading></z-ghost-loading></div>\n </div>`,\n};\n"]}

package/dist/collection/components/z-icon/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["~~../../../~~src/components/z-icon/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAC,MAAM,eAAe,CAAC;AACvD,OAAO,EAAC,KAAK,EAAC,MAAM,yBAAyB,CAAC;AAO9C,MAAM,OAAO,KAAK;;;;;;;;IAqBR,mBAAmB,CAAC,SAAiB;QAC3C,IAAI,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,UAAU,CAAC,GAAG,CAAC,EAAE,CAAC;YAC/B,OAAO,YAAM,CAAC,EAAE,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,GAAS,CAAC;QAC5C,CAAC;QAED,OAAO,eAAS,MAAM,EAAE,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,GAAY,CAAC;IACvD,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,oEAAa,MAAM;YACtB,4DACE,OAAO,EAAC,eAAe,EACvB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,EAAE,EAAE,IAAI,CAAC,MAAM,EACf,IAAI,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,IAAI,CAAC,IAAI,GAAG,CAAC,CAAC,CAAC,EAAE,IAE3C,IAAI,CAAC,mBAAmB,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CACvC,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {Component, Host, Prop, h} from \"@stencil/core\";\nimport {ICONS} from \"../../constants/iconset\";\n\n@Component({\n tag: \"z-icon\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZIcon {\n /** icon name /\n @Prop()\n name: string;\n\n /* icon height (optional) /\n @Prop()\n height?: number;\n\n /* icon width (optional) /\n @Prop()\n width?: number;\n\n /* icon id (optional) /\n @Prop()\n iconid?: string;\n\n /* icon fill (optional) */\n @Prop()\n fill?: string;\n\n private selectPathOrPolygon(iconValue: string): SVGPathElement \| SVGPolygonElement {\n if (iconValue?.startsWith(\"M\")) {\n return <path d={ICONS[this.name]}></path>;\n }\n\n return <polygon points={ICONS[this.name]}></polygon>;\n }\n\n render(): SVGElement {\n return (\n <Host aria-hidden=\"true\">\n <svg\n viewBox=\"0 0 1000 1000\"\n width={this.width}\n height={this.height}\n id={this.iconid}\n fill={this.fill ? `var(--${this.fill})` : \"\"}\n >\n {this.selectPathOrPolygon(ICONS[this.name])}\n </svg>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/z-icon/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAC,MAAM,eAAe,CAAC;AACvD,OAAO,EAAC,KAAK,EAAC,MAAM,yBAAyB,CAAC;AAO9C,MAAM,OAAO,KAAK;;;;;;;;IAqBR,mBAAmB,CAAC,SAAiB;QAC3C,IAAI,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,UAAU,CAAC,GAAG,CAAC,EAAE,CAAC;YAC/B,OAAO,YAAM,CAAC,EAAE,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,GAAS,CAAC;QAC5C,CAAC;QAED,OAAO,eAAS,MAAM,EAAE,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,GAAY,CAAC;IACvD,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,oEAAa,MAAM;YACtB,4DACE,OAAO,EAAC,eAAe,EACvB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,EAAE,EAAE,IAAI,CAAC,MAAM,EACf,IAAI,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,IAAI,CAAC,IAAI,GAAG,CAAC,CAAC,CAAC,EAAE,IAE3C,IAAI,CAAC,mBAAmB,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CACvC,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {Component, Host, Prop, h} from \"@stencil/core\";\nimport {ICONS} from \"../../constants/iconset\";\n\n@Component({\n tag: \"z-icon\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZIcon {\n /** icon name /\n @Prop()\n name: string;\n\n /* icon height (optional) /\n @Prop()\n height?: number;\n\n /* icon width (optional) /\n @Prop()\n width?: number;\n\n /* icon id (optional) /\n @Prop()\n iconid?: string;\n\n /* icon fill (optional) */\n @Prop()\n fill?: string;\n\n private selectPathOrPolygon(iconValue: string): SVGPathElement \| SVGPolygonElement {\n if (iconValue?.startsWith(\"M\")) {\n return <path d={ICONS[this.name]}></path>;\n }\n\n return <polygon points={ICONS[this.name]}></polygon>;\n }\n\n render(): SVGElement {\n return (\n <Host aria-hidden=\"true\">\n <svg\n viewBox=\"0 0 1000 1000\"\n width={this.width}\n height={this.height}\n id={this.iconid}\n fill={this.fill ? `var(--${this.fill})` : \"\"}\n >\n {this.selectPathOrPolygon(ICONS[this.name])}\n </svg>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/z-icon/index.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.stories.js","sourceRoot":"","sources":["~~../../../~~src/components/z-icon/index.stories.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,IAAI,EAAC,MAAM,KAAK,CAAC;AAEzB,OAAO,EAAC,cAAc,EAAC,MAAM,6BAA6B,CAAC;AAC3D,OAAO,SAAS,CAAC;AAEjB,eAAe;IACb,KAAK,EAAE,OAAO;IACd,SAAS,EAAE,QAAQ;IACnB,QAAQ,EAAE;QACR,IAAI,EAAE;YACJ,OAAO,EAAE,cAAc,EAAE,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;YACjE,OAAO,EAAE;gBACP,IAAI,EAAE,QAAQ;aACf;SACF;KACF;IACD,IAAI,EAAE;QACJ,IAAI,EAAE,UAAU;QAChB,MAAM,EAAE,EAAE;QACV,KAAK,EAAE,EAAE;QACT,IAAI,EAAE,iBAAiB;KACxB;CACoB,CAAC;AAExB,MAAM,CAAC,MAAM,OAAO,GAAG;IACrB,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CACf,IAAI,CAAA;cACM,IAAI,CAAC,IAAI;gBACP,IAAI,CAAC,MAAM;eACZ,IAAI,CAAC,KAAK;cACX,IAAI,CAAC,IAAI;eACR;CACd,CAAC","sourcesContent":["import {Meta} from \"@storybook/web-components\";\nimport {html} from \"lit\";\nimport {type ZIcon} from \".\";\nimport {getColorTokens} from \"../../utils/storybook-utils\";\nimport \"./index\";\n\nexport default {\n title: \"ZIcon\",\n component: \"z-icon\",\n argTypes: {\n fill: {\n options: getColorTokens().map((token) => token.replace(\"--\", \"\")),\n control: {\n type: \"select\",\n },\n },\n },\n args: {\n name: \"download\",\n height: 24,\n width: 24,\n fill: \"color-primary01\",\n },\n} satisfies Meta<ZIcon>;\n\nexport const Default = {\n render: (args) =>\n html`<z-icon\n name=\"${args.name}\"\n height=\"${args.height}\"\n width=\"${args.width}\"\n fill=\"${args.fill}\"\n ></z-icon>`,\n};\n"]}
1	+ {"version":3,"file":"index.stories.js","sourceRoot":"","sources":["../../../../src/components/z-icon/index.stories.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,IAAI,EAAC,MAAM,KAAK,CAAC;AAEzB,OAAO,EAAC,cAAc,EAAC,MAAM,6BAA6B,CAAC;AAC3D,OAAO,SAAS,CAAC;AAEjB,eAAe;IACb,KAAK,EAAE,OAAO;IACd,SAAS,EAAE,QAAQ;IACnB,QAAQ,EAAE;QACR,IAAI,EAAE;YACJ,OAAO,EAAE,cAAc,EAAE,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;YACjE,OAAO,EAAE;gBACP,IAAI,EAAE,QAAQ;aACf;SACF;KACF;IACD,IAAI,EAAE;QACJ,IAAI,EAAE,UAAU;QAChB,MAAM,EAAE,EAAE;QACV,KAAK,EAAE,EAAE;QACT,IAAI,EAAE,iBAAiB;KACxB;CACoB,CAAC;AAExB,MAAM,CAAC,MAAM,OAAO,GAAG;IACrB,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CACf,IAAI,CAAA;cACM,IAAI,CAAC,IAAI;gBACP,IAAI,CAAC,MAAM;eACZ,IAAI,CAAC,KAAK;cACX,IAAI,CAAC,IAAI;eACR;CACd,CAAC","sourcesContent":["import {Meta} from \"@storybook/web-components\";\nimport {html} from \"lit\";\nimport {type ZIcon} from \".\";\nimport {getColorTokens} from \"../../utils/storybook-utils\";\nimport \"./index\";\n\nexport default {\n title: \"ZIcon\",\n component: \"z-icon\",\n argTypes: {\n fill: {\n options: getColorTokens().map((token) => token.replace(\"--\", \"\")),\n control: {\n type: \"select\",\n },\n },\n },\n args: {\n name: \"download\",\n height: 24,\n width: 24,\n fill: \"color-primary01\",\n },\n} satisfies Meta<ZIcon>;\n\nexport const Default = {\n render: (args) =>\n html`<z-icon\n name=\"${args.name}\"\n height=\"${args.height}\"\n width=\"${args.width}\"\n fill=\"${args.fill}\"\n ></z-icon>`,\n};\n"]}

package/dist/collection/components/z-info-box/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["~~../../../~~src/components/z-info-box/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,KAAK,EAAgB,IAAI,EAAE,CAAC,EAAC,MAAM,eAAe,CAAC;AAEtE;;GAEG;AAMH,MAAM,OAAO,QAAQ;;;0BAON,IAAI;;IAMT,gBAAgB;QACtB,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,EAAC,KAAK,EAAE,IAAI,CAAC,KAAK,EAAC,CAAC,CAAC;IAC9C,CAAC;IAED,MAAM;QACJ,OAAO,CACL,4DAAK,EAAE,EAAE,IAAI,CAAC,KAAK;YACjB,6DAAM,IAAI,EAAC,SAAS,GAAG;YACtB,IAAI,CAAC,UAAU,IAAI,CAClB,+DACE,IAAI,EAAC,UAAU,iBACH,cAAc,EAC1B,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,gBAAgB,EAAE,GACtC,CACH,CACG,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {Component, Event, EventEmitter, Prop, h} from \"@stencil/core\";\n\n/*\n @slot content - set the info box content\n /\n@Component({\n tag: \"z-info-box\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZInfoBox {\n /* info box unique id /\n @Prop()\n boxid: string;\n\n /* render close icon flag /\n @Prop()\n isclosable = true;\n\n /* emitted on close icon click */\n @Event()\n infoBoxClose: EventEmitter;\n\n private emitInfoBoxClose(): void {\n this.infoBoxClose.emit({boxid: this.boxid});\n }\n\n render(): HTMLDivElement {\n return (\n <div id={this.boxid}>\n <slot name=\"content\" />\n {this.isclosable && (\n <z-icon\n name=\"multiply\"\n data-action=\"infoBoxClose\"\n onClick={() => this.emitInfoBoxClose()}\n />\n )}\n </div>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/z-info-box/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,KAAK,EAAgB,IAAI,EAAE,CAAC,EAAC,MAAM,eAAe,CAAC;AAEtE;;GAEG;AAMH,MAAM,OAAO,QAAQ;;;0BAON,IAAI;;IAMT,gBAAgB;QACtB,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,EAAC,KAAK,EAAE,IAAI,CAAC,KAAK,EAAC,CAAC,CAAC;IAC9C,CAAC;IAED,MAAM;QACJ,OAAO,CACL,4DAAK,EAAE,EAAE,IAAI,CAAC,KAAK;YACjB,6DAAM,IAAI,EAAC,SAAS,GAAG;YACtB,IAAI,CAAC,UAAU,IAAI,CAClB,+DACE,IAAI,EAAC,UAAU,iBACH,cAAc,EAC1B,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,gBAAgB,EAAE,GACtC,CACH,CACG,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {Component, Event, EventEmitter, Prop, h} from \"@stencil/core\";\n\n/*\n @slot content - set the info box content\n /\n@Component({\n tag: \"z-info-box\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZInfoBox {\n /* info box unique id /\n @Prop()\n boxid: string;\n\n /* render close icon flag /\n @Prop()\n isclosable = true;\n\n /* emitted on close icon click */\n @Event()\n infoBoxClose: EventEmitter;\n\n private emitInfoBoxClose(): void {\n this.infoBoxClose.emit({boxid: this.boxid});\n }\n\n render(): HTMLDivElement {\n return (\n <div id={this.boxid}>\n <slot name=\"content\" />\n {this.isclosable && (\n <z-icon\n name=\"multiply\"\n data-action=\"infoBoxClose\"\n onClick={() => this.emitInfoBoxClose()}\n />\n )}\n </div>\n );\n }\n}\n"]}

package/dist/collection/components/z-info-box/index.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.stories.js","sourceRoot":"","sources":["~~../../../~~src/components/z-info-box/index.stories.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,IAAI,EAAC,MAAM,KAAK,CAAC;AAEzB,OAAO,SAAS,CAAC;AAEjB,MAAM,SAAS,GAAG;IAChB,KAAK,EAAE,UAAU;IACjB,SAAS,EAAE,YAAY;IACvB,IAAI,EAAE;QACJ,UAAU,EAAE,IAAI;KACjB;CACuB,CAAC;AAC3B,eAAe,SAAS,CAAC;AAEzB,MAAM,CAAC,MAAM,OAAO,GAAG;IACrB,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CACf,IAAI,CAAA,2BAA2B,IAAI,CAAC,UAAU;;;;;;kBAMhC;CACjB,CAAC","sourcesContent":["import {Meta} from \"@storybook/web-components\";\nimport {html} from \"lit\";\nimport {type ZInfoBox} from \".\";\nimport \"./index\";\n\nconst StoryMeta = {\n title: \"ZInfoBox\",\n component: \"z-info-box\",\n args: {\n isclosable: true,\n },\n} satisfies Meta<ZInfoBox>;\nexport default StoryMeta;\n\nexport const Default = {\n render: (args) =>\n html`<z-info-box isclosable=\"${args.isclosable}\">\n <span slot=\"content\"\n >Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque fermentum convallis ex, eu faucibus velit\n dignissim in. Quisque at risus accumsan, auctor enim a, varius tortor. Donec egestas sodales mi at imperdiet.\n Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</span\n >\n </z-info-box>`,\n};\n"]}
1	+ {"version":3,"file":"index.stories.js","sourceRoot":"","sources":["../../../../src/components/z-info-box/index.stories.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,IAAI,EAAC,MAAM,KAAK,CAAC;AAEzB,OAAO,SAAS,CAAC;AAEjB,MAAM,SAAS,GAAG;IAChB,KAAK,EAAE,UAAU;IACjB,SAAS,EAAE,YAAY;IACvB,IAAI,EAAE;QACJ,UAAU,EAAE,IAAI;KACjB;CACuB,CAAC;AAC3B,eAAe,SAAS,CAAC;AAEzB,MAAM,CAAC,MAAM,OAAO,GAAG;IACrB,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CACf,IAAI,CAAA,2BAA2B,IAAI,CAAC,UAAU;;;;;;kBAMhC;CACjB,CAAC","sourcesContent":["import {Meta} from \"@storybook/web-components\";\nimport {html} from \"lit\";\nimport {type ZInfoBox} from \".\";\nimport \"./index\";\n\nconst StoryMeta = {\n title: \"ZInfoBox\",\n component: \"z-info-box\",\n args: {\n isclosable: true,\n },\n} satisfies Meta<ZInfoBox>;\nexport default StoryMeta;\n\nexport const Default = {\n render: (args) =>\n html`<z-info-box isclosable=\"${args.isclosable}\">\n <span slot=\"content\"\n >Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque fermentum convallis ex, eu faucibus velit\n dignissim in. Quisque at risus accumsan, auctor enim a, varius tortor. Donec egestas sodales mi at imperdiet.\n Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</span\n >\n </z-info-box>`,\n};\n"]}

package/dist/collection/components/z-info-reveal/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["~~../../../~~src/components/z-info-reveal/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import {Component, Element, Host, Listen, Prop, State, Watch, h} from \"@stencil/core\";\nimport {ControlSize, InfoRevealPosition} from \"../../beans\";\n\n/*\n Info reveal component.\n \n @slot - content of the info panel.\n * @cssprop --z-info-reveal-panel-width - Width of the info panel.\n /\n@Component({\n tag: \"z-info-reveal\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZInfoReveal {\n /* Name of the icon for the trigger button /\n @Prop()\n icon? = \"informationsource\";\n\n /\n The position of the z-info-reveal in the page. This helps to correctly place the info panel.\n * The panel will grow in the opposite direction of the position.\n * For example, with the default position `BOTTOM_RIGHT`, the panel will grow vertically upwards and horizontally to the left.\n /\n @Prop({reflect: true})\n position?: InfoRevealPosition = InfoRevealPosition.BOTTOM_RIGHT;\n\n /* Label of the trigger button. /\n @Prop()\n label?: string;\n\n /* Aria label of the trigger button. It will be only used when `label` prop is empty. /\n @Prop()\n ariaLabel = \"Apri pannello informazioni\";\n\n /* Size of the trigger button /\n @Prop({reflect: true})\n size?: ControlSize = ControlSize.BIG;\n\n /* Whether the info panel is open. /\n @State()\n open = false;\n\n @Element() host: HTMLZInfoRevealElement;\n\n private panel: HTMLDivElement;\n\n /\n Adjust the position of the info panel to prevent exiting the viewport.\n /\n @Watch(\"position\")\n @Watch(\"open\")\n @Listen(\"resize\", {target: \"window\", passive: true})\n adjustPanelPosition(): void {\n if (!this.open \|\| !this.panel) {\n return;\n }\n\n const rect = this.host.getBoundingClientRect();\n const gridMargin = parseInt(getComputedStyle(document.documentElement).getPropertyValue(\"--grid-margin\"), 10);\n const pageWidth = document.documentElement.offsetWidth;\n // Available space for the info panel to grow towards the edge of the page, based on the `position` prop.\n const availableSpace = Math.round(\n (this.position.includes(\"left\") ? pageWidth - rect.left : rect.right) - gridMargin\n );\n this.panel.style.maxWidth = `${availableSpace}px`;\n }\n\n /\n Toggle the open state of the info panel.\n /\n private togglePanel(): void {\n this.open = !this.open;\n }\n\n /\n Close the info panel.\n */\n private closePanel(): void {\n this.open = false;\n }\n\n @Listen(\"keydown\", {target: \"window\", capture: true})\n handleEscapeKey(event: KeyboardEvent): void {\n if (event.key === \"Escape\" && this.open) {\n this.closePanel();\n }\n }\n\n render(): HTMLZInfoRevealElement {\n return (\n <Host open={this.open}>\n <button\n class=\"z-info-reveal-trigger\"\n type=\"button\"\n onClick={this.togglePanel.bind(this)}\n aria-label={!this.label ? this.ariaLabel : undefined}\n aria-expanded={this.open ? \"true\" : \"false\"}\n aria-controls=\"z-info-reveal-panel\"\n >\n {this.icon && <z-icon name={this.icon} />}\n {this.label && <span class=\"z-info-reveal-label\">{this.label}</span>}\n </button>\n <div\n class=\"z-info-reveal-panel\"\n id=\"z-info-reveal-panel\"\n ref={(el) => (this.panel = el)}\n hidden={!this.open}\n >\n <slot></slot>\n <button\n class=\"z-info-reveal-close\"\n type=\"button\"\n onClick={this.closePanel.bind(this)}\n aria-label=\"Chiudi pannello informazioni\"\n >\n <z-icon name=\"multiply\" />\n </button>\n </div>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/z-info-reveal/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import {Component, Element, Host, Listen, Prop, State, Watch, h} from \"@stencil/core\";\nimport {ControlSize, InfoRevealPosition} from \"../../beans\";\n\n/*\n Info reveal component.\n \n @slot - content of the info panel.\n * @cssprop --z-info-reveal-panel-width - Width of the info panel.\n /\n@Component({\n tag: \"z-info-reveal\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZInfoReveal {\n /* Name of the icon for the trigger button /\n @Prop()\n icon? = \"informationsource\";\n\n /\n The position of the z-info-reveal in the page. This helps to correctly place the info panel.\n * The panel will grow in the opposite direction of the position.\n * For example, with the default position `BOTTOM_RIGHT`, the panel will grow vertically upwards and horizontally to the left.\n /\n @Prop({reflect: true})\n position?: InfoRevealPosition = InfoRevealPosition.BOTTOM_RIGHT;\n\n /* Label of the trigger button. /\n @Prop()\n label?: string;\n\n /* Aria label of the trigger button. It will be only used when `label` prop is empty. /\n @Prop()\n ariaLabel = \"Apri pannello informazioni\";\n\n /* Size of the trigger button /\n @Prop({reflect: true})\n size?: ControlSize = ControlSize.BIG;\n\n /* Whether the info panel is open. /\n @State()\n open = false;\n\n @Element() host: HTMLZInfoRevealElement;\n\n private panel: HTMLDivElement;\n\n /\n Adjust the position of the info panel to prevent exiting the viewport.\n /\n @Watch(\"position\")\n @Watch(\"open\")\n @Listen(\"resize\", {target: \"window\", passive: true})\n adjustPanelPosition(): void {\n if (!this.open \|\| !this.panel) {\n return;\n }\n\n const rect = this.host.getBoundingClientRect();\n const gridMargin = parseInt(getComputedStyle(document.documentElement).getPropertyValue(\"--grid-margin\"), 10);\n const pageWidth = document.documentElement.offsetWidth;\n // Available space for the info panel to grow towards the edge of the page, based on the `position` prop.\n const availableSpace = Math.round(\n (this.position.includes(\"left\") ? pageWidth - rect.left : rect.right) - gridMargin\n );\n this.panel.style.maxWidth = `${availableSpace}px`;\n }\n\n /\n Toggle the open state of the info panel.\n /\n private togglePanel(): void {\n this.open = !this.open;\n }\n\n /\n Close the info panel.\n */\n private closePanel(): void {\n this.open = false;\n }\n\n @Listen(\"keydown\", {target: \"window\", capture: true})\n handleEscapeKey(event: KeyboardEvent): void {\n if (event.key === \"Escape\" && this.open) {\n this.closePanel();\n }\n }\n\n render(): HTMLZInfoRevealElement {\n return (\n <Host open={this.open}>\n <button\n class=\"z-info-reveal-trigger\"\n type=\"button\"\n onClick={this.togglePanel.bind(this)}\n aria-label={!this.label ? this.ariaLabel : undefined}\n aria-expanded={this.open ? \"true\" : \"false\"}\n aria-controls=\"z-info-reveal-panel\"\n >\n {this.icon && <z-icon name={this.icon} />}\n {this.label && <span class=\"z-info-reveal-label\">{this.label}</span>}\n </button>\n <div\n class=\"z-info-reveal-panel\"\n id=\"z-info-reveal-panel\"\n ref={(el) => (this.panel = el)}\n hidden={!this.open}\n >\n <slot></slot>\n <button\n class=\"z-info-reveal-close\"\n type=\"button\"\n onClick={this.closePanel.bind(this)}\n aria-label=\"Chiudi pannello informazioni\"\n >\n <z-icon name=\"multiply\" />\n </button>\n </div>\n </Host>\n );\n }\n}\n"]}