@nanoporetech-digital/components 5.4.2 → 5.5.1

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 (65) hide show
  1. package/CHANGELOG.md +30 -0
  2. package/dist/cjs/nano-global-nav-user-profile_3.cjs.entry.js +1 -1
  3. package/dist/cjs/nano-global-nav-user-profile_3.cjs.entry.js.map +1 -1
  4. package/dist/cjs/nano-global-nav.cjs.entry.js +1 -4
  5. package/dist/cjs/nano-global-nav.cjs.entry.js.map +1 -1
  6. package/dist/cjs/nano-slides.cjs.entry.js +64 -33
  7. package/dist/cjs/nano-slides.cjs.entry.js.map +1 -1
  8. package/dist/cjs/{nano-table-201b1ee2.js → nano-table-884ce575.js} +2 -2
  9. package/dist/cjs/{nano-table-201b1ee2.js.map → nano-table-884ce575.js.map} +1 -1
  10. package/dist/cjs/nano-table.cjs.entry.js +1 -1
  11. package/dist/cjs/{table.worker-1b295406.js → table.worker-670457aa.js} +2 -2
  12. package/dist/cjs/table.worker-670457aa.js.map +1 -0
  13. package/dist/collection/components/global-nav/global-nav.js +1 -4
  14. package/dist/collection/components/global-nav/global-nav.js.map +1 -1
  15. package/dist/collection/components/nav-item/nav-item.js +1 -1
  16. package/dist/collection/components/nav-item/nav-item.js.map +1 -1
  17. package/dist/collection/components/slides/lib/js/animate.js +5 -3
  18. package/dist/collection/components/slides/lib/js/flickity.js +1 -0
  19. package/dist/collection/components/slides/lib/js/page-dots.js +5 -0
  20. package/dist/collection/components/slides/lib/js/prev-next-button.js +23 -6
  21. package/dist/collection/components/slides/slides-interface.js.map +1 -1
  22. package/dist/collection/components/slides/slides.js +47 -28
  23. package/dist/collection/components/slides/slides.js.map +1 -1
  24. package/dist/components/nano-global-nav.js +1 -4
  25. package/dist/components/nano-global-nav.js.map +1 -1
  26. package/dist/components/nano-slides.js +64 -33
  27. package/dist/components/nano-slides.js.map +1 -1
  28. package/dist/components/nav-item.js +1 -1
  29. package/dist/components/nav-item.js.map +1 -1
  30. package/dist/esm/nano-global-nav-user-profile_3.entry.js +1 -1
  31. package/dist/esm/nano-global-nav-user-profile_3.entry.js.map +1 -1
  32. package/dist/esm/nano-global-nav.entry.js +1 -4
  33. package/dist/esm/nano-global-nav.entry.js.map +1 -1
  34. package/dist/esm/nano-slides.entry.js +64 -33
  35. package/dist/esm/nano-slides.entry.js.map +1 -1
  36. package/dist/esm/{nano-table-f2c222e8.js → nano-table-c6a4e1dc.js} +2 -2
  37. package/dist/esm/{nano-table-f2c222e8.js.map → nano-table-c6a4e1dc.js.map} +1 -1
  38. package/dist/esm/nano-table.entry.js +1 -1
  39. package/dist/esm/{table.worker-8356a40e.js → table.worker-2568f20c.js} +2 -2
  40. package/dist/esm/table.worker-2568f20c.js.map +1 -0
  41. package/dist/nano-components/nano-components.esm.js +1 -1
  42. package/dist/nano-components/{p-bdb5dfc3.js → p-4ef3200a.js} +2 -2
  43. package/dist/nano-components/p-7c4ac519.entry.js +23 -0
  44. package/dist/nano-components/p-7c4ac519.entry.js.map +1 -0
  45. package/dist/nano-components/{p-fa9f834b.entry.js → p-997319eb.entry.js} +2 -2
  46. package/dist/nano-components/{p-fa9f834b.entry.js.map → p-997319eb.entry.js.map} +1 -1
  47. package/dist/nano-components/{p-e94da35a.entry.js → p-9a0191c7.entry.js} +2 -2
  48. package/dist/nano-components/p-afd3cd17.entry.js +5 -0
  49. package/dist/nano-components/p-afd3cd17.entry.js.map +1 -0
  50. package/dist/nano-components/{p-a593dac2.js → p-f5698b41.js} +2 -2
  51. package/dist/types/components/slides/slides-interface.d.ts +2 -0
  52. package/dist/types/components/slides/slides.d.ts +39 -74
  53. package/dist/types/components.d.ts +3 -3
  54. package/docs-json.json +104 -7
  55. package/hydrate/index.js +80 -39
  56. package/package.json +2 -2
  57. package/dist/cjs/table.worker-1b295406.js.map +0 -1
  58. package/dist/esm/table.worker-8356a40e.js.map +0 -1
  59. package/dist/nano-components/p-37c7eda3.entry.js +0 -5
  60. package/dist/nano-components/p-37c7eda3.entry.js.map +0 -1
  61. package/dist/nano-components/p-7f5fb917.entry.js +0 -23
  62. package/dist/nano-components/p-7f5fb917.entry.js.map +0 -1
  63. /package/dist/nano-components/{p-bdb5dfc3.js.map → p-4ef3200a.js.map} +0 -0
  64. /package/dist/nano-components/{p-a593dac2.js.map → p-9a0191c7.entry.js.map} +0 -0
  65. /package/dist/nano-components/{p-e94da35a.entry.js.map → p-f5698b41.js.map} +0 -0
package/dist/collection/components/nav-item/nav-item.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"nav-item.js","sourceRoot":"","sources":["../../../src/components/nav-item/nav-item.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n h,\n Host,\n Element,\n Prop,\n Watch,\n EventEmitter,\n Event,\n State,\n Method,\n ComponentInterface,\n Listen,\n} from '@stencil/core';\nimport { getSiblings, getDirectChildren } from '../../utils/dom';\nimport { displayTransition } from '../../utils/transitions';\nimport { getTabbableElements } from '../../utils/tabbable';\nimport type { NavItemEventDetail } from '../../interface';\n\n/**\n * Nav items to be used with the various nav items.\n * [Globla-Nav](/story/compounds-global-nav)\n * [Menu-Drawer](/story/components-menu-drawer)\n * [Dropdown](/story/components-dropdown)\n *\n * @slot icon-start - an icon at the start of the main control\n * @slot icon-end - an icon at the end of the main control\n * @slot secondary - a content panel in which you can place any html to display on control click\n * @slot - use the default slot for either `<a>` or text (if constructing a secondary content panel or using `href` directly)\n * @part ctrl - the controlling `<a>` or `<button>` element\n * @part ctrl--button - the controlling `<button>` element\n * @part ctrl--anchor - the controlling <a> element\n * @part ctrl-wrapper - the wrapping div around the control (shadow `<button>` / `<a>` or slotted `<a>`)\n * @part secondary-wrapper - the div surrounding slotted secondary content\n * @part secondary-mask - the div that is added when secondary content is shown\n */\n@Component({\n tag: 'nano-nav-item',\n styleUrl: 'nav-item.scss',\n shadow: true,\n})\nexport class NavItem implements ComponentInterface {\n private hasSecondarySlot: boolean = false;\n private secondaryDiv: HTMLDivElement;\n private btn: HTMLButtonElement | HTMLAnchorElement;\n private fromHover: boolean;\n private animating: boolean = false;\n private waitHide: number;\n private waitShow: number;\n private globalNavEle?: HTMLNanoGlobalNavElement;\n\n @State() hasAnchorEle: boolean = false;\n @State() didOpen: boolean = false;\n @State() isInGlobalNav: boolean = false;\n @State() isInMenuDrawer: boolean = false;\n @State() isInMenu: boolean = false;\n @State() hasFocus: boolean = false;\n @Element() private el: HTMLNanoNavItemElement;\n\n /**\n * Href to link to\n */\n @Prop({ mutable: true }) href: string = null;\n\n /**\n * Target to use for links\n */\n @Prop() target: '_self' | '_blank' | '_parent' | '_top' = '_self';\n\n /**\n * Disable the nav item\n */\n @Prop() disabled: boolean = false;\n\n /**\n * Whether a secondary menu should be or is currently open\n */\n @Prop({ mutable: true, reflect: true }) open: boolean = false;\n\n /**\n * Whether this menu item is currently 'selected'\n */\n @Prop({ reflect: true }) selected: boolean = false;\n\n /**\n * Screen pixel width to activate the secondary menu\n */\n @Prop() secondaryActiveWidth: number = 0;\n\n /**\n * Secondary fallback function for when the secondary menu is no longer active.\n */\n @Prop() secondaryFallback = () => {};\n\n /**\n * Whether secondary menus should close on blur\n */\n @Prop() closeOnBlur: boolean = true;\n\n /**\n * Will show an indicator badge - only when placed in a nano-menu-draw\n */\n @Prop() notification: boolean = false;\n\n /**\n * Emitted when the nav item closes it's secondary navigation.\n */\n @Event() nanoClose!: EventEmitter<NavItemEventDetail>;\n\n /**\n * Emitted when the nav item opens it's secondary navigation.\n */\n @Event() nanoOpen!: EventEmitter<NavItemEventDetail>;\n\n /**\n * Emitted when the nav item is about to open it's secondary navigation.\n */\n @Event() nanoOpening!: EventEmitter<NavItemEventDetail>;\n\n /**\n * Emitted when the nav item is about to close it's secondary navigation.\n */\n @Event() nanoClosing!: EventEmitter<NavItemEventDetail>;\n\n /**\n * Emitted when the nav item loses focus.\n */\n @Event() nanoBlur!: EventEmitter<void>;\n\n /**\n * Emitted when the nav item has focus.\n */\n @Event() nanoFocus!: EventEmitter<void>;\n\n /**\n * Sets focus on the first button or anchor present. Use this method instead of the global\n * `element.focus()`.\n */\n @Method()\n async setFocus() {\n if (!this.btn) return;\n this.btn.focus();\n }\n\n /**\n * Public open watcher\n */\n @Watch('open')\n openChange() {\n this.open ? this.openSecondary() : this.closeSecondary();\n }\n\n /**\n * Internal open watcher\n */\n @Watch('didOpen')\n didOpenChange() {\n if (!this.hasSecondarySlot) return;\n\n if (!this.didOpen) {\n /* the secondadry panel is not closing via hover,\n remove blur events, add focus back to originating button */\n setTimeout(() => {\n if (\n !this.fromHover &&\n (!document.activeElement || document.activeElement === document.body)\n )\n this.btn.focus({ preventScroll: true });\n this.el.tabIndex = null;\n this.nanoClose.emit({ secondaryMenu: this.secondaryDiv });\n }, 50);\n } else {\n /* the secondary panel is not opening via hover,\n scroll content into view, focus on it and add blur events */\n if (!this.fromHover) {\n const panelIO = new (window as any).IntersectionObserver(\n (data: IntersectionObserverEntry[]) => {\n if (data[0].boundingClientRect.top < 0) {\n this.secondaryDiv.scrollIntoView({\n behavior: 'smooth',\n });\n }\n panelIO.disconnect();\n },\n { threshold: 1 }\n );\n panelIO.observe(this.secondaryDiv);\n this.secondaryDiv.focus({ preventScroll: true });\n\n const focusableChild = getTabbableElements(this.secondaryDiv, true);\n if (focusableChild[0]) focusableChild[0].focus();\n\n this.el.tabIndex = -1;\n this.nanoOpen.emit({ secondaryMenu: this.secondaryDiv });\n }\n }\n }\n\n @Listen('click', { target: 'body' })\n @Listen('keyup', { target: 'body' })\n handleClose(e: MouseEvent | KeyboardEvent) {\n if (!this.didOpen || !this.hasSecondarySlot) return;\n if (!e.composedPath().some((el) => el === this.secondaryDiv))\n this.toggleSecondary();\n }\n\n private closeSecondary = async () => {\n if (!this.hasSecondarySlot || !this.didOpen) return;\n this.open = false;\n await displayTransition(this.secondaryDiv, 'open', false);\n this.nanoClosing.emit({ secondaryMenu: this.secondaryDiv });\n this.didOpen = false;\n };\n\n private openSecondary = async () => {\n if (window.innerWidth < this.secondaryActiveWidth) {\n this.secondaryFallback.call(this);\n return;\n }\n\n if (!this.hasSecondarySlot || this.didOpen) return;\n this.open = true;\n await displayTransition(this.secondaryDiv, 'open', true);\n this.nanoOpening.emit({ secondaryMenu: this.secondaryDiv });\n this.didOpen = true;\n };\n\n private toggleSecondary = () => {\n if (!this.hasSecondarySlot) return;\n if (this.didOpen) this.closeSecondary();\n else this.openSecondary();\n };\n\n private handleFocus = () => {\n this.hasFocus = true;\n // opens secondary panel when activated via hover\n if (this.href && !this.animating && this.hasSecondarySlot)\n this.openSecondary();\n this.nanoFocus.emit();\n };\n\n private handleHostBlur = () => {\n if (this.animating) return;\n\n // tab index is added to host when secondary panel opens\n // to return focus after secondary panel closes. Remove now if it was added\n this.el.removeAttribute('tabindex');\n this.hasFocus = false;\n this.nanoBlur.emit();\n };\n\n // direct host clicks to internal button\n private handleHostClick = (ev: MouseEvent) => {\n if (!this.hasAnchorEle) return;\n const foundlink = (ev.target as HTMLElement).closest('a, button');\n if (!foundlink) this.btn.click();\n };\n\n // handles secondary menu hover behaviour.\n private handleMouseEnter = async () => {\n if (\n !this.href ||\n this.animating ||\n !this.hasSecondarySlot ||\n (this.globalNavEle && !this.globalNavEle.classList.contains('ready'))\n )\n return;\n\n // if there are sibling secondary panels currently open,\n // we need to wait before opening otherwise we get unwanted overlapping\n let timeToWait = 0;\n if (getSiblings(this.el, '.secondary-open.has-secondary').length)\n timeToWait = 300;\n\n clearTimeout(this.waitHide);\n this.fromHover = true;\n this.animating = true;\n this.waitShow = window.setTimeout(\n async () => await this.openSecondary(),\n timeToWait\n );\n this.animating = false;\n };\n\n // handles secondary menu hover-out behaviour.\n private handleMouseLeave = () => {\n if (!this.href) return;\n clearTimeout(this.waitShow);\n this.fromHover = true;\n this.animating = true;\n\n // prevent closing immediately - makes navigating to items within more forgiving\n this.waitHide = window.setTimeout(\n async () => await this.closeSecondary(),\n 300\n );\n this.animating = false;\n };\n\n private handleClick = () => {\n this.fromHover = false;\n if (this.hasSecondarySlot) this.toggleSecondary();\n };\n\n connectedCallback() {\n const secondaryEle = this.el.querySelector('[slot=\"secondary\"]');\n this.hasSecondarySlot = !!secondaryEle;\n\n const link = getDirectChildren<HTMLAnchorElement | HTMLButtonElement>(\n this.el,\n 'a, button'\n )[0];\n this.hasAnchorEle = !!link;\n\n if (link) {\n this.href = (link as HTMLAnchorElement).href\n ? (link as HTMLAnchorElement).href\n : null;\n this.btn = link;\n if (this.hasSecondarySlot)\n this.btn.addEventListener('click', this.toggleSecondary);\n\n this.btn.addEventListener('focus', this.handleFocus);\n this.btn.addEventListener('blur', this.handleHostBlur);\n }\n\n this.isInGlobalNav = false;\n this.isInMenuDrawer = false;\n this.globalNavEle = this.el.closest('nano-global-nav');\n\n this.isInMenuDrawer = !!this.el.closest('nano-menu-drawer');\n this.isInMenu = !!this.el.closest('nano-menu');\n this.isInGlobalNav =\n this.el.parentElement === this.globalNavEle ||\n !!this.el.closest('.global-nav');\n }\n\n disconnectedCallback(): void {\n this.btn.removeEventListener('click', this.toggleSecondary);\n this.btn.removeEventListener('focus', this.handleFocus);\n this.btn.removeEventListener('blur', this.handleHostBlur);\n }\n\n render() {\n return (\n <Host\n class={{\n 'has-secondary': this.hasSecondarySlot,\n 'secondary-open': this.open,\n selected: this.selected,\n 'has-focus': this.hasFocus,\n disabled: this.disabled,\n 'nano-global-nav': this.isInGlobalNav,\n 'nano-menu-drawer': this.isInMenuDrawer,\n 'nano-menu': this.isInMenu,\n }}\n onBlur={this.handleHostBlur}\n dir={(this.el.ownerDocument as Document).dir === 'rtl' ? 'rtl' : null}\n onMouseEnter={this.handleMouseEnter}\n onMouseLeave={this.handleMouseLeave}\n onClick={this.handleHostClick}\n role=\"menuitem\"\n >\n <div\n class={{\n 'nav-item': true,\n 'secondary-open': this.open,\n selected: this.selected,\n }}\n part=\"ctrl-wrapper\"\n >\n {this.href && !this.hasAnchorEle && !this.disabled && (\n <a\n part=\"ctrl ctrl--anchor\"\n target={this.target}\n ref={(a) => (this.btn = a)}\n href={this.href}\n onFocus={this.handleFocus}\n class={{\n notification: this.notification,\n }}\n >\n <slot name=\"icon-start\" />\n <span class=\"text\">\n <slot />\n </span>\n <slot name=\"icon-end\" />\n </a>\n )}\n {((!this.hasAnchorEle && !this.href) || this.disabled) && (\n <button\n part=\"ctrl ctrl--button\"\n ref={(btn) => (this.btn = btn)}\n onClick={this.handleClick}\n onFocus={this.handleFocus}\n disabled={this.disabled}\n class={{\n notification: this.notification,\n }}\n >\n <slot name=\"icon-start\" />\n <span class=\"text\">\n <slot />\n </span>\n <slot name=\"icon-end\" />\n </button>\n )}\n {this.hasAnchorEle && !this.disabled && (\n <div class=\"link\">\n <slot name=\"icon-start\" />\n <slot />\n <slot name=\"icon-end\" />\n </div>\n )}\n {this.hasSecondarySlot && !this.disabled && (\n <div\n class=\"secondary-menu\"\n ref={(div) => (this.secondaryDiv = div)}\n tabIndex={-1}\n >\n <div class=\"secondary-menu-content\" part=\"secondary-wrapper\">\n <slot name=\"secondary\" />\n </div>\n <div\n class=\"secondary-menu-mask\"\n onClick={this.closeSecondary}\n part=\"secondary-mask\"\n ></div>\n </div>\n )}\n </div>\n </Host>\n );\n }\n}\n"]}
1
+ {"version":3,"file":"nav-item.js","sourceRoot":"","sources":["../../../src/components/nav-item/nav-item.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n h,\n Host,\n Element,\n Prop,\n Watch,\n EventEmitter,\n Event,\n State,\n Method,\n ComponentInterface,\n Listen,\n} from '@stencil/core';\nimport { getSiblings, getDirectChildren } from '../../utils/dom';\nimport { displayTransition } from '../../utils/transitions';\nimport { getTabbableElements } from '../../utils/tabbable';\nimport type { NavItemEventDetail } from '../../interface';\n\n/**\n * Nav items to be used with the various nav items.\n * [Globla-Nav](/story/compounds-global-nav)\n * [Menu-Drawer](/story/components-menu-drawer)\n * [Dropdown](/story/components-dropdown)\n *\n * @slot icon-start - an icon at the start of the main control\n * @slot icon-end - an icon at the end of the main control\n * @slot secondary - a content panel in which you can place any html to display on control click\n * @slot - use the default slot for either `<a>` or text (if constructing a secondary content panel or using `href` directly)\n * @part ctrl - the controlling `<a>` or `<button>` element\n * @part ctrl--button - the controlling `<button>` element\n * @part ctrl--anchor - the controlling <a> element\n * @part ctrl-wrapper - the wrapping div around the control (shadow `<button>` / `<a>` or slotted `<a>`)\n * @part secondary-wrapper - the div surrounding slotted secondary content\n * @part secondary-mask - the div that is added when secondary content is shown\n */\n@Component({\n tag: 'nano-nav-item',\n styleUrl: 'nav-item.scss',\n shadow: true,\n})\nexport class NavItem implements ComponentInterface {\n private hasSecondarySlot: boolean = false;\n private secondaryDiv: HTMLDivElement;\n private btn: HTMLButtonElement | HTMLAnchorElement;\n private fromHover: boolean;\n private animating: boolean = false;\n private waitHide: number;\n private waitShow: number;\n private globalNavEle?: HTMLNanoGlobalNavElement;\n\n @State() hasAnchorEle: boolean = false;\n @State() didOpen: boolean = false;\n @State() isInGlobalNav: boolean = false;\n @State() isInMenuDrawer: boolean = false;\n @State() isInMenu: boolean = false;\n @State() hasFocus: boolean = false;\n @Element() private el: HTMLNanoNavItemElement;\n\n /**\n * Href to link to\n */\n @Prop({ mutable: true }) href: string = null;\n\n /**\n * Target to use for links\n */\n @Prop() target: '_self' | '_blank' | '_parent' | '_top' = '_self';\n\n /**\n * Disable the nav item\n */\n @Prop() disabled: boolean = false;\n\n /**\n * Whether a secondary menu should be or is currently open\n */\n @Prop({ mutable: true, reflect: true }) open: boolean = false;\n\n /**\n * Whether this menu item is currently 'selected'\n */\n @Prop({ reflect: true }) selected: boolean = false;\n\n /**\n * Screen pixel width to activate the secondary menu\n */\n @Prop() secondaryActiveWidth: number = 0;\n\n /**\n * Secondary fallback function for when the secondary menu is no longer active.\n */\n @Prop() secondaryFallback = () => {};\n\n /**\n * Whether secondary menus should close on blur\n */\n @Prop() closeOnBlur: boolean = true;\n\n /**\n * Will show an indicator badge - only when placed in a nano-menu-draw\n */\n @Prop() notification: boolean = false;\n\n /**\n * Emitted when the nav item closes it's secondary navigation.\n */\n @Event() nanoClose!: EventEmitter<NavItemEventDetail>;\n\n /**\n * Emitted when the nav item opens it's secondary navigation.\n */\n @Event() nanoOpen!: EventEmitter<NavItemEventDetail>;\n\n /**\n * Emitted when the nav item is about to open it's secondary navigation.\n */\n @Event() nanoOpening!: EventEmitter<NavItemEventDetail>;\n\n /**\n * Emitted when the nav item is about to close it's secondary navigation.\n */\n @Event() nanoClosing!: EventEmitter<NavItemEventDetail>;\n\n /**\n * Emitted when the nav item loses focus.\n */\n @Event() nanoBlur!: EventEmitter<void>;\n\n /**\n * Emitted when the nav item has focus.\n */\n @Event() nanoFocus!: EventEmitter<void>;\n\n /**\n * Sets focus on the first button or anchor present. Use this method instead of the global\n * `element.focus()`.\n */\n @Method()\n async setFocus() {\n if (!this.btn) return;\n this.btn.focus();\n }\n\n /**\n * Public open watcher\n */\n @Watch('open')\n openChange() {\n this.open ? this.openSecondary() : this.closeSecondary();\n }\n\n /**\n * Internal open watcher\n */\n @Watch('didOpen')\n didOpenChange() {\n if (!this.hasSecondarySlot) return;\n\n if (!this.didOpen) {\n /* the secondadry panel is not closing via hover,\n remove blur events, add focus back to originating button */\n setTimeout(() => {\n if (\n !this.fromHover &&\n (!document.activeElement || document.activeElement === document.body)\n )\n this.btn.focus({ preventScroll: true });\n this.el.tabIndex = null;\n this.nanoClose.emit({ secondaryMenu: this.secondaryDiv });\n }, 50);\n } else {\n /* the secondary panel is not opening via hover,\n scroll content into view, focus on it and add blur events */\n if (!this.fromHover) {\n const panelIO = new (window as any).IntersectionObserver(\n (data: IntersectionObserverEntry[]) => {\n if (data[0].boundingClientRect.top < 0) {\n this.secondaryDiv.scrollIntoView({\n behavior: 'smooth',\n });\n }\n panelIO.disconnect();\n },\n { threshold: 1 }\n );\n panelIO.observe(this.secondaryDiv);\n this.secondaryDiv.focus({ preventScroll: true });\n\n const focusableChild = getTabbableElements(this.secondaryDiv, true);\n if (focusableChild[0]) focusableChild[0].focus();\n\n this.el.tabIndex = -1;\n this.nanoOpen.emit({ secondaryMenu: this.secondaryDiv });\n }\n }\n }\n\n @Listen('click', { target: 'body' })\n @Listen('keyup', { target: 'body' })\n handleClose(e: MouseEvent | KeyboardEvent) {\n if (!this.didOpen || !this.hasSecondarySlot) return;\n if (!e.composedPath().some((el) => el === this.secondaryDiv))\n this.toggleSecondary();\n }\n\n private closeSecondary = async () => {\n if (!this.hasSecondarySlot || !this.didOpen) return;\n this.open = false;\n await displayTransition(this.secondaryDiv, 'open', false);\n this.nanoClosing.emit({ secondaryMenu: this.secondaryDiv });\n this.didOpen = false;\n };\n\n private openSecondary = async () => {\n if (window.innerWidth < this.secondaryActiveWidth) {\n this.secondaryFallback.call(this);\n return;\n }\n\n if (!this.hasSecondarySlot || this.didOpen) return;\n this.open = true;\n await displayTransition(this.secondaryDiv, 'open', true);\n this.nanoOpening.emit({ secondaryMenu: this.secondaryDiv });\n this.didOpen = true;\n };\n\n private toggleSecondary = () => {\n if (!this.hasSecondarySlot) return;\n if (this.didOpen) this.closeSecondary();\n else this.openSecondary();\n };\n\n private handleFocus = () => {\n this.hasFocus = true;\n // opens secondary panel when activated via hover\n if (this.href && !this.animating && this.hasSecondarySlot)\n this.openSecondary();\n this.nanoFocus.emit();\n };\n\n private handleHostBlur = () => {\n if (this.animating) return;\n\n // tab index is added to host when secondary panel opens\n // to return focus after secondary panel closes. Remove now if it was added\n this.el.removeAttribute('tabindex');\n this.hasFocus = false;\n this.nanoBlur.emit();\n };\n\n // direct host clicks to internal button\n private handleHostClick = (ev: MouseEvent) => {\n if (!this.hasAnchorEle) return;\n const foundlink = (ev.target as HTMLElement).closest('a, button');\n if (!foundlink) this.btn.click();\n };\n\n // handles secondary menu hover behaviour.\n private handleMouseEnter = async () => {\n if (\n !this.href ||\n this.animating ||\n !this.hasSecondarySlot ||\n (this.globalNavEle && !this.globalNavEle.classList.contains('ready'))\n )\n return;\n\n // if there are sibling secondary panels currently open,\n // we need to wait before opening otherwise we get unwanted overlapping\n let timeToWait = 0;\n if (getSiblings(this.el, '.secondary-open.has-secondary').length)\n timeToWait = 300;\n\n clearTimeout(this.waitHide);\n this.fromHover = true;\n this.animating = true;\n this.waitShow = window.setTimeout(\n async () => await this.openSecondary(),\n timeToWait\n );\n this.animating = false;\n };\n\n // handles secondary menu hover-out behaviour.\n private handleMouseLeave = () => {\n if (!this.href) return;\n clearTimeout(this.waitShow);\n this.fromHover = true;\n this.animating = true;\n\n // prevent closing immediately - makes navigating to items within more forgiving\n this.waitHide = window.setTimeout(\n async () => await this.closeSecondary(),\n 300\n );\n this.animating = false;\n };\n\n private handleClick = () => {\n this.fromHover = false;\n if (this.hasSecondarySlot) this.toggleSecondary();\n };\n\n connectedCallback() {\n const secondaryEle = this.el.querySelector('[slot=\"secondary\"]');\n this.hasSecondarySlot = !!secondaryEle;\n\n const link = getDirectChildren<HTMLAnchorElement | HTMLButtonElement>(\n this.el,\n 'a, button'\n )[0];\n this.hasAnchorEle = !!link;\n\n if (link) {\n this.href = (link as HTMLAnchorElement).href\n ? (link as HTMLAnchorElement).href\n : null;\n this.btn = link;\n if (this.hasSecondarySlot)\n this.btn.addEventListener('click', this.toggleSecondary);\n\n this.btn.addEventListener('focus', this.handleFocus);\n this.btn.addEventListener('blur', this.handleHostBlur);\n }\n\n this.isInGlobalNav = false;\n this.isInMenuDrawer = false;\n this.globalNavEle = this.el.closest('nano-global-nav');\n\n this.isInMenuDrawer = !!this.el.closest('nano-menu-drawer');\n this.isInMenu = !!this.el.closest('nano-menu');\n this.isInGlobalNav =\n this.el.parentElement === this.globalNavEle ||\n !!this.el.closest('.global-nav');\n }\n\n disconnectedCallback(): void {\n this.btn.removeEventListener('click', this.toggleSecondary);\n this.btn.removeEventListener('focus', this.handleFocus);\n this.btn.removeEventListener('blur', this.handleHostBlur);\n }\n\n render() {\n return (\n <Host\n class={{\n 'has-secondary': this.hasSecondarySlot,\n 'secondary-open': this.open,\n selected: this.selected,\n 'has-focus': this.hasFocus,\n disabled: this.disabled,\n 'nano-global-nav': this.isInGlobalNav,\n 'nano-menu-drawer': this.isInMenuDrawer,\n 'nano-menu': this.isInMenu,\n }}\n onBlur={this.handleHostBlur}\n dir={(this.el.ownerDocument as Document).dir === 'rtl' ? 'rtl' : null}\n onMouseEnter={this.handleMouseEnter}\n onMouseLeave={this.handleMouseLeave}\n onClick={this.handleHostClick}\n role={this.el.closest('[role=\"menu\"]') ? 'menuitem' : undefined}\n >\n <div\n class={{\n 'nav-item': true,\n 'secondary-open': this.open,\n selected: this.selected,\n }}\n part=\"ctrl-wrapper\"\n >\n {this.href && !this.hasAnchorEle && !this.disabled && (\n <a\n part=\"ctrl ctrl--anchor\"\n target={this.target}\n ref={(a) => (this.btn = a)}\n href={this.href}\n onFocus={this.handleFocus}\n class={{\n notification: this.notification,\n }}\n >\n <slot name=\"icon-start\" />\n <span class=\"text\">\n <slot />\n </span>\n <slot name=\"icon-end\" />\n </a>\n )}\n {((!this.hasAnchorEle && !this.href) || this.disabled) && (\n <button\n part=\"ctrl ctrl--button\"\n ref={(btn) => (this.btn = btn)}\n onClick={this.handleClick}\n onFocus={this.handleFocus}\n disabled={this.disabled}\n class={{\n notification: this.notification,\n }}\n >\n <slot name=\"icon-start\" />\n <span class=\"text\">\n <slot />\n </span>\n <slot name=\"icon-end\" />\n </button>\n )}\n {this.hasAnchorEle && !this.disabled && (\n <div class=\"link\">\n <slot name=\"icon-start\" />\n <slot />\n <slot name=\"icon-end\" />\n </div>\n )}\n {this.hasSecondarySlot && !this.disabled && (\n <div\n class=\"secondary-menu\"\n ref={(div) => (this.secondaryDiv = div)}\n tabIndex={-1}\n >\n <div class=\"secondary-menu-content\" part=\"secondary-wrapper\">\n <slot name=\"secondary\" />\n </div>\n <div\n class=\"secondary-menu-mask\"\n onClick={this.closeSecondary}\n part=\"secondary-mask\"\n ></div>\n </div>\n )}\n </div>\n </Host>\n );\n }\n}\n"]}
package/dist/collection/components/slides/lib/js/animate.js CHANGED
@@ -50,9 +50,11 @@ proto.setTranslateX = function (x, is3d) {
50
50
  var translateX = this.getPositionValue(x);
51
51
  // use 3D tranforms for hardware acceleration on iOS
52
52
  // but use 2D when settled, for better font-rendering
53
- this.slider.style.transform = is3d
54
- ? 'translate3d(' + translateX + ',0,0)'
55
- : 'translateX(' + translateX + ')';
53
+ // this.slider.style.transform = is3d
54
+ // ? 'translate3d(' + translateX + ',0,0)'
55
+ // : 'translateX(' + translateX + ')';
56
+
57
+ this.slider.style.transform = 'translate3d(' + translateX + ',0,0)';
56
58
  };
57
59
 
58
60
  proto.dispatchScrollEvent = function () {
package/dist/collection/components/slides/lib/js/flickity.js CHANGED
@@ -91,6 +91,7 @@ proto._create = function () {
91
91
  // create viewport & slider
92
92
  this.viewport = document.createElement('div');
93
93
  this.viewport.className = 'flickity-viewport';
94
+ this.viewport.part.add('slide-viewport');
94
95
  this._createSlider();
95
96
 
96
97
  if (this.options.resize || this.options.watchCSS) {
package/dist/collection/components/slides/lib/js/page-dots.js CHANGED
@@ -18,6 +18,8 @@ PageDots.prototype._create = function () {
18
18
  // create holder element
19
19
  this.holder = document.createElement('ol');
20
20
  this.holder.className = 'flickity-page-dots';
21
+ this.holder.part.add('pagination');
22
+
21
23
  // create dots, array of elements
22
24
  this.dots = [];
23
25
  // events
@@ -59,6 +61,7 @@ PageDots.prototype.addDots = function (count) {
59
61
  for (var i = length; i < max; i++) {
60
62
  var dot = document.createElement('li');
61
63
  dot.classList.add('dot');
64
+ dot.part.add('pagination-item');
62
65
  dot.setAttribute('aria-label', 'Page dot ' + (i + 1));
63
66
  fragment.appendChild(dot);
64
67
  newDots.push(dot);
@@ -81,6 +84,7 @@ PageDots.prototype.updateSelected = function () {
81
84
  // remove selected class on previous
82
85
  if (this.selectedDot) {
83
86
  this.selectedDot.classList.remove('is-selected');
87
+ this.selectedDot.part.remove('pagination-item--active');
84
88
  this.selectedDot.removeAttribute('aria-current');
85
89
  }
86
90
  // don't proceed if no dots
@@ -89,6 +93,7 @@ PageDots.prototype.updateSelected = function () {
89
93
  }
90
94
  this.selectedDot = this.dots[this.parent.selectedIndex];
91
95
  this.selectedDot.classList.add('is-selected');
96
+ this.selectedDot.part.add('pagination-item--active');
92
97
  this.selectedDot.setAttribute('aria-current', 'step');
93
98
  };
94
99
 
package/dist/collection/components/slides/lib/js/prev-next-button.js CHANGED
@@ -24,19 +24,35 @@ PrevNextButton.prototype._create = function () {
24
24
  var leftDirection = this.parent.options.rightToLeft ? 1 : -1;
25
25
  this.isLeft = this.direction == leftDirection;
26
26
 
27
- var element = (this.element = document.createElement('button'));
28
- element.className = 'flickity-button flickity-prev-next-button';
29
- element.className += this.isPrevious ? ' previous' : ' next';
27
+ var button = (this.element = document.createElement('button'));
28
+ button.className = 'flickity-button flickity-prev-next-button';
29
+ button.part.add('navigation-button');
30
+ if (this.isPrevious) {
31
+ button.classList.add('previous');
32
+ button.part.add('navigation-button--previous');
33
+ } else {
34
+ button.classList.add('next');
35
+ button.part.add('navigation-button--next');
36
+ }
30
37
  // prevent button from submitting form http://stackoverflow.com/a/10836076/182183
31
- element.setAttribute('type', 'button');
38
+ button.setAttribute('type', 'button');
32
39
  // init as disabled
33
40
  this.disable();
34
41
 
35
- element.setAttribute('aria-label', this.isPrevious ? 'Previous' : 'Next');
42
+ button.setAttribute('aria-label', this.isPrevious ? 'Previous' : 'Next');
43
+
44
+ const slot = document.createElement('slot');
45
+ slot.name = this.isPrevious ? 'previous-icon' : 'next-icon';
46
+ button.appendChild(slot);
47
+ slot.addEventListener('slotchange', () => {
48
+ slot.assignedElements({ flatten: true }).forEach((ele) => {
49
+ ele.removeAttribute('hidden');
50
+ });
51
+ });
36
52
 
37
53
  // create arrow
38
54
  var svg = this.createSVG();
39
- element.appendChild(svg);
55
+ slot.appendChild(svg);
40
56
  // events
41
57
  this.parent.on('select', this.update.bind(this));
42
58
  this.on('pointerDown', this.parent.childUIPointerDown.bind(this.parent));
@@ -61,6 +77,7 @@ PrevNextButton.prototype.createSVG = function () {
61
77
  var svg = document.createElementNS(svgURI, 'svg');
62
78
  svg.setAttribute('class', 'flickity-button-icon');
63
79
  svg.setAttribute('viewBox', '0 0 100 100');
80
+ svg.part.add('navigation-icon');
64
81
  var path = document.createElementNS(svgURI, 'path');
65
82
  var pathMovements = getArrowMovements(this.parent.options.arrowShape);
66
83
  path.setAttribute('d', pathMovements);
package/dist/collection/components/slides/slides-interface.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"slides-interface.js","sourceRoot":"","sources":["../../../src/components/slides/slides-interface.ts"],"names":[],"mappings":"","sourcesContent":["import Flicker, { Options, EventBindings } from 'flickity';\n\ninterface PointerDragEvent extends PointerEvent {\n x: number;\n y: number;\n}\ninterface TouchDragEvent extends Touch {\n x: number;\n y: number;\n}\n\nexport interface Flickity\n extends Omit<Flicker, 'next' | 'previous' | 'slides'> {\n options: FlickityOptions;\n next(isWrapped?: boolean, isInstant?: boolean): void;\n previous(isWrapped?: boolean, isInstant?: boolean): void;\n updateDraggable(): void;\n viewFullscreen: () => void;\n exitFullscreen: () => void;\n slides: FlickitySlide[];\n x?: number;\n y?: number;\n}\n\nexport interface FlickityOptions extends Options {\n fullscreen?: boolean;\n fade?: boolean;\n}\n\nexport type DragEvent = TouchDragEvent | PointerDragEvent;\n\nexport type SlideAnimation = 'fade' | 'scroll' | 'parallax';\n\nexport interface FlickityEvents\n extends Omit<\n EventBindings,\n 'dragMove' | 'dragEnd' | 'dragStart' | 'staticClick'\n > {\n dragMove?: (pointer?: DragEvent) => void;\n dragStart?: (pointer?: DragEvent) => void;\n dragEnd?: (pointer?: DragEvent) => void;\n staticClick?: (pointer?: DragEvent) => void;\n}\n\nexport interface FlickitySlide {\n cells: FlickityCell[];\n firstMargin: number;\n height: number;\n isOriginLeft: boolean;\n outerWidth: number;\n parent: Flickity;\n target: number;\n x: number;\n}\n\nexport interface FlickityCell {\n element: HTMLElement;\n parent: Flickity;\n shift: number;\n size: { [prop: string]: number };\n target: number;\n x: number;\n}\n"]}
1
+ {"version":3,"file":"slides-interface.js","sourceRoot":"","sources":["../../../src/components/slides/slides-interface.ts"],"names":[],"mappings":"","sourcesContent":["import Flicker, { Options, EventBindings } from 'flickity';\n\ninterface PointerDragEvent extends PointerEvent {\n x: number;\n y: number;\n}\ninterface TouchDragEvent extends Touch {\n x: number;\n y: number;\n}\n\nexport interface Flickity\n extends Omit<Flicker, 'next' | 'previous' | 'slides'> {\n options: FlickityOptions;\n next(isWrapped?: boolean, isInstant?: boolean): void;\n previous(isWrapped?: boolean, isInstant?: boolean): void;\n updateDraggable(): void;\n viewFullscreen: () => void;\n exitFullscreen: () => void;\n slides: FlickitySlide[];\n x?: number;\n y?: number;\n slideableWidth: number;\n cursorPosition: number;\n}\n\nexport interface FlickityOptions extends Options {\n fullscreen?: boolean;\n fade?: boolean;\n}\n\nexport type DragEvent = TouchDragEvent | PointerDragEvent;\n\nexport type SlideAnimation = 'fade' | 'scroll' | 'parallax';\n\nexport interface FlickityEvents\n extends Omit<\n EventBindings,\n 'dragMove' | 'dragEnd' | 'dragStart' | 'staticClick'\n > {\n dragMove?: (pointer?: DragEvent) => void;\n dragStart?: (pointer?: DragEvent) => void;\n dragEnd?: (pointer?: DragEvent) => void;\n staticClick?: (pointer?: DragEvent) => void;\n}\n\nexport interface FlickitySlide {\n cells: FlickityCell[];\n firstMargin: number;\n height: number;\n isOriginLeft: boolean;\n outerWidth: number;\n parent: Flickity;\n target: number;\n x: number;\n}\n\nexport interface FlickityCell {\n element: HTMLElement;\n parent: Flickity;\n shift: number;\n size: { [prop: string]: number };\n target: number;\n x: number;\n}\n"]}
package/dist/collection/components/slides/slides.js CHANGED
@@ -3,14 +3,30 @@
3
3
  */
4
4
  import { h, Host, Build, } from '@stencil/core';
5
5
  import { flickity } from './lib/js';
6
+ const modulo = (num, div) => {
7
+ return ((num % div) + div) % div;
8
+ };
6
9
  /**
7
10
  * The Slides component is a multi-section container. Each section can be swiped or dragged between.
8
11
  * It contains any number of Slide components.
9
12
  *
10
13
  * Uses [Flickity](https://flickity.metafizzy.co/) under the hood.
11
14
  *
12
- * @slot - default slot of nano-slide components
15
+ * @part base - Wrapper around slides and additional ui elements.
16
+ * @part slide-container - Wraps all slide elements.
17
+ * @part slide-viewport - The visible, scrollable area around slide elements.
18
+ * @part navigation-button - Next / previous navigation buttons.
19
+ * @part navigation-button--next - the next navigation button.
20
+ * @part navigation-button--previous - The previous navigation button.
21
+ * @part navigation-icon - The chevron / arrow icon within a navigation button.
22
+ * @part pagination - Wraps pagination indicators.
23
+ * @part pagination-item - A pagination indicator.
24
+ * @part pagination-item--active - The current, active pagination indicator.
25
+ *
26
+ * @slot - default slot of nano-slide components.
13
27
  * @slot ui - An absolutely positioned element that will be placed over the slider. Any custom ui can be housed here.
28
+ * @slot next-icon - Optional next icon to use instead of the default.
29
+ * @slot previous-icon - Optional previous icon to use instead of the default.
14
30
  */
15
31
  export class Slides {
16
32
  constructor() {
@@ -18,12 +34,25 @@ export class Slides {
18
34
  this.flickity = new Promise((resolve) => {
19
35
  this.readyflickity = resolve;
20
36
  });
21
- this.parralax = async () => {
37
+ this.parallax = async () => {
22
38
  const flkty = await this.flickity;
23
- flkty.slides.forEach((slide, i) => {
39
+ flkty.cells.forEach((el, i) => {
40
+ const cell = el;
41
+ let flkX = flkty.x;
42
+ const shiftedPos = cell.x + flkty.slideableWidth * cell.shift;
24
43
  const ele = this.childrenEles[i];
25
- const x = ((slide.target + flkty.x) * -1) / 3;
26
- ele.style['transform'] = 'translateX(' + x + 'px)';
44
+ if (flkty.options.wrapAround && flkty.cells.length > 1) {
45
+ flkX = modulo(flkX, flkty.slideableWidth);
46
+ flkX = flkX - flkty.slideableWidth;
47
+ }
48
+ let x = ((cell.target + flkX) * -1) / 3;
49
+ if (cell.shift < 0) {
50
+ x = x + Math.abs(shiftedPos) * 1.3333;
51
+ }
52
+ else if (cell.shift > 0) {
53
+ x = ((cell.target + (flkX + shiftedPos)) * -1) / 3;
54
+ }
55
+ ele.style.transform = 'translate3d(' + x + 'px, 0, 0)';
27
56
  });
28
57
  };
29
58
  this.handleFullscreen = (isFullScreen) => {
@@ -84,7 +113,7 @@ export class Slides {
84
113
  slide.style['left'] = undefined;
85
114
  });
86
115
  if (oldAnim === 'parallax') {
87
- flkty.off('scroll', this.parralax);
116
+ flkty.off('scroll', this.parallax);
88
117
  slides.forEach((_, i) => {
89
118
  if (this.childrenEles && this.childrenEles[i])
90
119
  this.childrenEles[i].style['transform'] = undefined;
@@ -98,7 +127,7 @@ export class Slides {
98
127
  break;
99
128
  case 'parallax':
100
129
  this.options = { fade: false, percentPosition: false };
101
- flkty.on('scroll', this.parralax);
130
+ flkty.on('scroll', this.parallax);
102
131
  break;
103
132
  default:
104
133
  this.options = { fade: false, percentPosition: true };
@@ -176,30 +205,22 @@ export class Slides {
176
205
  const flickity = await this.getflickity();
177
206
  flickity.previous(instant, wrap);
178
207
  }
179
- /**
180
- * Get the index of the active slide.
181
- */
208
+ /** Get the index of the active slide. */
182
209
  async getActiveIndex() {
183
210
  const flickity = await this.getflickity();
184
211
  return flickity.selectedIndex;
185
212
  }
186
- /**
187
- * Get the total number of slides.
188
- */
213
+ /** Get the total number of slides. */
189
214
  async length() {
190
215
  const flickity = await this.getflickity();
191
216
  return flickity.slides.length;
192
217
  }
193
- /**
194
- * Get whether or not the current slide is the last slide.
195
- */
218
+ /** Get whether or not the current slide is the last slide. */
196
219
  async isEnd() {
197
220
  const flickity = await this.getflickity();
198
221
  return flickity.selectedIndex === flickity.slides.length - 1;
199
222
  }
200
- /**
201
- * Get whether or not the current slide is the first slide.
202
- */
223
+ /** Get whether or not the current slide is the first slide. */
203
224
  async isBeginning() {
204
225
  const flickity = await this.getflickity();
205
226
  return flickity.selectedIndex === 0;
@@ -214,9 +235,7 @@ export class Slides {
214
235
  this.options = { autoPlay: time };
215
236
  setTimeout(() => flickity.playPlayer());
216
237
  }
217
- /**
218
- * Stop auto play.
219
- */
238
+ /** Stop auto play. */
220
239
  async stopAutoplay() {
221
240
  const flickity = await this.getflickity();
222
241
  flickity.stopPlayer();
@@ -296,7 +315,7 @@ export class Slides {
296
315
  this.ready = true;
297
316
  if (!window['ResizeObserver'])
298
317
  return;
299
- // just boots and brances to make sure it's the correct size oninit
318
+ // just boots and braces to make sure it's the correct size oninit
300
319
  const ro = (this.resizeO = new ResizeObserver(() => {
301
320
  flick.resize();
302
321
  // this.resizeO.disconnect();
@@ -390,11 +409,11 @@ export class Slides {
390
409
  slideshow: true,
391
410
  ready: this.ready,
392
411
  'not-ready': !this.ready,
393
- } }, h("div", { ref: (div) => (this.flickityEl = div), class: {
412
+ }, part: "base" }, h("div", { ref: (div) => (this.flickityEl = div), class: {
394
413
  'flickity-container': true,
395
414
  'slides-ready': this.slidesReady,
396
415
  'slides-not-ready': !this.slidesReady,
397
- } }, h("slot", null)), h("div", { class: "ui-extras" }, h("slot", { name: "ui" })))));
416
+ }, part: "slide-container" }, h("slot", null)), h("div", { class: "ui-extras" }, h("slot", { name: "ui" })))));
398
417
  }
399
418
  static get is() { return "nano-slides"; }
400
419
  static get encapsulation() { return "shadow"; }
@@ -619,7 +638,7 @@ export class Slides {
619
638
  "composed": true,
620
639
  "docs": {
621
640
  "tags": [],
622
- "text": "Emitted after component initialization"
641
+ "text": "Emitted after component initialisation."
623
642
  },
624
643
  "complexType": {
625
644
  "original": "void",
@@ -634,7 +653,7 @@ export class Slides {
634
653
  "composed": true,
635
654
  "docs": {
636
655
  "tags": [],
637
- "text": "Emitted after flickity initialization"
656
+ "text": "Emitted after flickity initialisation."
638
657
  },
639
658
  "complexType": {
640
659
  "original": "void",
@@ -649,7 +668,7 @@ export class Slides {
649
668
  "composed": true,
650
669
  "docs": {
651
670
  "tags": [],
652
- "text": "Emitted when a slide is selected, even on the same slide"
671
+ "text": "Emitted when a slide is selected, even on the same slide."
653
672
  },
654
673
  "complexType": {
655
674
  "original": "number",
package/dist/collection/components/slides/slides.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"slides.js","sourceRoot":"","sources":["../../../src/components/slides/slides.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n ComponentInterface,\n Element,\n Event,\n EventEmitter,\n Prop,\n h,\n Host,\n Watch,\n Method,\n State,\n Build,\n} from '@stencil/core';\nimport { flickity } from './lib/js';\nimport type {\n FlickityOptions,\n FlickityEvents,\n Flickity,\n DragEvent,\n FlickitySlide,\n SlideAnimation,\n} from '../../interface';\n\n/**\n * The Slides component is a multi-section container. Each section can be swiped or dragged between.\n * It contains any number of Slide components.\n *\n * Uses [Flickity](https://flickity.metafizzy.co/) under the hood.\n *\n * @slot - default slot of nano-slide components\n * @slot ui - An absolutely positioned element that will be placed over the slider. Any custom ui can be housed here.\n */\n@Component({\n tag: 'nano-slides',\n styleUrl: 'slides.scss',\n shadow: true,\n})\nexport class Slides implements ComponentInterface {\n private flickityEl: HTMLElement;\n private flickityReady = false;\n private mutationO?: MutationObserver;\n private resizeO?: ResizeObserver;\n private readyflickity!: (slider: Flickity) => void;\n private flickity: Promise<Flickity> = new Promise((resolve) => {\n this.readyflickity = resolve;\n });\n private syncflickity?: Flickity;\n private childrenEles: NodeList;\n\n @State() iCurrentSlide: number;\n @State() slidesReady: boolean;\n @State() didInit = false;\n\n @Element() host!: HTMLNanoSlidesElement;\n\n /**\n * Options to pass to the flickity instance.\n * See https://flickity.metafizzy.co/options.html for valid options\n */\n @Prop({ mutable: true }) options: FlickityOptions = {};\n\n @Watch('options')\n async optionsChanged() {\n if (this.flickityReady) {\n const flickity = await this.getflickity();\n Object.assign(flickity.options, this.options);\n await this.update();\n }\n }\n\n /**\n * If `true`, show the next / prev buttons.\n */\n @Prop() navbtns = false;\n\n @Watch('navbtns')\n async navbtnsChanged() {\n Array.from(\n this._getRoot().querySelectorAll('.flickity-prev-next-button')\n ).forEach((btn) => {\n (btn as HTMLElement).hidden = !this.navbtns;\n });\n }\n\n /**\n * If `true`, show the pagination.\n */\n @Prop() pager = false;\n\n @Watch('pager')\n async pagerChanged() {\n const dots = this._getRoot().querySelector(\n '.flickity-page-dots'\n ) as HTMLElement;\n dots.hidden = !this.pager;\n }\n\n /**\n * If `true`, show a fullscreen button.\n */\n @Prop() fullscreenbtn = false;\n\n @Watch('fullscreenbtn')\n async fullscreenBtnChanged() {\n const btn = this._getRoot().querySelector(\n '.flickity-fullscreen-button'\n ) as HTMLElement;\n btn.hidden = !this.fullscreenbtn;\n }\n\n /**\n * If `true`, make the slider fullscreen.\n */\n @Prop({ reflect: true, mutable: true }) fullscreen = false;\n\n @Watch('fullscreen')\n async fullscreenChanged(_?, oldFs?: boolean) {\n const flickity = await this.getflickity();\n if (this.fullscreen) flickity.viewFullscreen();\n else if (typeof oldFs !== 'undefined') flickity.exitFullscreen();\n }\n\n /**\n * Animation presets.\n */\n @Prop({ reflect: true }) animation: SlideAnimation = 'scroll';\n\n @Watch('animation')\n async animationChange(_?, oldAnim?: SlideAnimation) {\n const [flkty, slides] = await Promise.all([\n this.getflickity(),\n waitForSlides(this.host),\n ]);\n\n // clear old stuff\n slides.forEach((slide) => {\n slide.style['left'] = undefined;\n });\n\n if (oldAnim === 'parallax') {\n flkty.off('scroll', this.parralax);\n slides.forEach((_, i) => {\n if (this.childrenEles && this.childrenEles[i])\n (this.childrenEles[i] as HTMLElement).style['transform'] = undefined;\n });\n this.update();\n }\n\n // setup new stuff\n switch (this.animation) {\n case 'fade':\n this.options = { fade: true, percentPosition: true };\n break;\n case 'parallax':\n this.options = { fade: false, percentPosition: false };\n flkty.on('scroll', this.parralax);\n break;\n default:\n this.options = { fade: false, percentPosition: true };\n break;\n }\n }\n\n /**\n * Zero-based index of the selected cell.\n */\n @Prop({ reflect: true, mutable: true }) currentSlide: number = 0;\n\n @Watch('currentSlide')\n currentSlideChange() {\n if (this.currentSlide !== this.iCurrentSlide)\n this.slideTo(this.currentSlide);\n }\n\n @Watch('iCurrentSlide')\n internalSlideChange() {\n this.currentSlide = this.iCurrentSlide;\n }\n\n /**\n * time duration, in ms, to automatically advance slides\n */\n @Prop() autoplay: string | false | number = false;\n\n @Watch('autoplay')\n async autoPlayChange() {\n await this.stopAutoplay();\n if (this.autoplay) {\n if (typeof this.autoplay === 'string')\n this.autoplay = parseInt(this.autoplay);\n if (this.autoplay > 0) this.startAutoplay(this.autoplay as number);\n }\n }\n\n /**\n * @internal\n */\n @Prop({ reflect: true, mutable: true }) ready = false;\n\n /**\n * Emitted after component initialization\n */\n @Event() nanoSlidesDidLoad!: EventEmitter<void>;\n\n /**\n * Emitted after flickity initialization\n */\n @Event() nanoSlidesReady!: EventEmitter<void>;\n\n /**\n * Emitted when a slide is selected, even on the same slide\n */\n @Event() nanoSlidesSelect!: EventEmitter<number>;\n\n /**\n * Emitted when the selected slide is changed.\n */\n @Event() nanoSlidesChange!: EventEmitter<number>;\n\n /**\n * Emitted when the slider moves.\n */\n @Event() nanoSlidesScroll!: EventEmitter<number>;\n\n /**\n * Emitted when the slide transition has finished.\n */\n @Event() nanoSlidesTransitionEnd!: EventEmitter<number>;\n\n /**\n * Emitted when the slider starts actively being moved.\n */\n @Event() nanoSlidesDragStart!: EventEmitter<DragEvent>;\n\n /**\n * Emitted when the slider is being dragged.\n */\n @Event() nanoSlidesDragMove!: EventEmitter<DragEvent>;\n\n /**\n * Emitted when the slider has finished being dragged.\n */\n @Event() nanoSlidesDragEnd!: EventEmitter<DragEvent>;\n\n /**\n * Emitted when the user taps/clicks on the slide's container.\n */\n @Event() nanoSlidesTap!: EventEmitter<DragEvent>;\n\n /**\n * Emitted when the user taps/clicks on the slide's container.\n */\n @Event() nanoSlidesFullscreenChange!: EventEmitter<boolean>;\n\n /**\n * Update the underlying flickity implementation. Call this if you've added or removed\n * child slides.\n */\n @Method()\n async update() {\n const [flickity] = await Promise.all([\n this.getflickity(),\n waitForSlides(this.host),\n ]);\n this.childrenEles = this.host.querySelectorAll('nano-slide > *');\n flickity.reloadCells();\n flickity.resize();\n flickity.reposition();\n }\n\n /**\n * Force flickity to update its height (when adaptiveHeight is enabled) for the duration\n * equal to 'speed' parameter.\n *\n * @param speed The transition duration (in ms).\n */\n @Method()\n async updateAutoHeight(speed?: number) {\n const vp = document.querySelector('.flickity-viewport') as HTMLElement;\n if (vp) vp.style.transition = speed + 'ms';\n }\n\n /**\n * Transition to the specified slide.\n *\n * @param index The index of the slide to transition to.\n * @param instant Immediately view the selected slide without animation.\n */\n @Method()\n async slideTo(index: number, instant?: boolean) {\n const flickity = await this.getflickity();\n flickity.select(index, instant);\n }\n\n /**\n * Transition to the next slide.\n *\n * @param instant The transition duration (in ms).\n * @param wrap If true, the first slide will be selected if at the last slide.\n */\n @Method()\n async slideNext(instant?: boolean, wrap?: boolean) {\n const flickity = await this.getflickity();\n flickity.next(wrap, instant);\n }\n\n /**\n * Transition to the previous slide.\n *\n * @param instant The transition duration (in ms).\n * @param wrap If true, the last slide will be selected if at the first slide.\n */\n @Method()\n async slidePrev(instant?: boolean, wrap?: boolean) {\n const flickity = await this.getflickity();\n flickity.previous(instant, wrap);\n }\n\n /**\n * Get the index of the active slide.\n */\n @Method()\n async getActiveIndex() {\n const flickity = await this.getflickity();\n return flickity.selectedIndex;\n }\n\n /**\n * Get the total number of slides.\n */\n @Method()\n async length() {\n const flickity = await this.getflickity();\n return flickity.slides.length;\n }\n\n /**\n * Get whether or not the current slide is the last slide.\n */\n @Method()\n async isEnd() {\n const flickity = await this.getflickity();\n return flickity.selectedIndex === flickity.slides.length - 1;\n }\n\n /**\n * Get whether or not the current slide is the first slide.\n */\n @Method()\n async isBeginning() {\n const flickity = await this.getflickity();\n return flickity.selectedIndex === 0;\n }\n\n /**\n * Start auto play.\n * @param time - optional time duration to show slides\n */\n @Method()\n async startAutoplay(time?: number) {\n const flickity = await this.getflickity();\n if (time) this.options = { autoPlay: time };\n setTimeout(() => flickity.playPlayer());\n }\n\n /**\n * Stop auto play.\n */\n @Method()\n async stopAutoplay() {\n const flickity = await this.getflickity();\n flickity.stopPlayer();\n }\n\n /**\n * Lock or unlock the ability to slide to the next slide.\n *\n * @param lock If `true`, disable swiping\n */\n @Method()\n async lockSwipes(lock: boolean) {\n const flickity = await this.getflickity();\n flickity.options.draggable = !lock;\n flickity.updateDraggable();\n }\n\n /**\n * Get the flickity instance.\n * Use this to access the full flickity API.\n * See https://flickity.metafizzy.co/ for all API options.\n */\n @Method()\n async getflickity() {\n return this.flickity;\n }\n\n /**\n * Hard destroy / create.\n * Certain flickity options, you will require the instance to be re-initialised\n */\n @Method()\n async reload() {\n this.destroyflickity();\n setTimeout(() => this.initflickity(), 20);\n }\n\n private _getRoot() {\n return this.host.shadowRoot ? this.host.shadowRoot : this.host;\n }\n\n private parralax = async () => {\n const flkty = await this.flickity;\n flkty.slides.forEach((slide: FlickitySlide, i) => {\n const ele = this.childrenEles[i] as HTMLElement;\n const x = ((slide.target + flkty.x) * -1) / 3;\n ele.style['transform'] = 'translateX(' + x + 'px)';\n });\n };\n\n private handleFullscreen = (isFullScreen: boolean) => {\n this.fullscreen = isFullScreen;\n this.nanoSlidesFullscreenChange.emit(isFullScreen);\n };\n\n private handleSlideSelect = (slide: number) => {\n this.iCurrentSlide = slide;\n this.nanoSlidesSelect.emit(slide);\n };\n\n private destroyflickity() {\n /**\n * We need to synchronously destroy\n * flickity otherwise it is possible\n * that it will be left in a\n * destroyed state if connectedCallback\n * is called multiple times\n */\n const flickity = this.syncflickity;\n\n if (flickity !== undefined) {\n flickity.destroy();\n this.flickity = new Promise((resolve) => {\n this.readyflickity = resolve;\n });\n this.flickityReady = false;\n this.syncflickity = undefined;\n this.ready = false;\n }\n this.didInit = false;\n }\n\n private async initflickity() {\n const finalOptions = this.normalizeOptions();\n\n // init flickity core\n await waitForSlides(this.host);\n\n this.flickityEl.style.height =\n this.flickityEl.getBoundingClientRect().height + 'px';\n this.slidesReady = true;\n\n this.flickityEl =\n this.flickityEl || this._getRoot().querySelector('.flickity-container');\n if (\n this.flickityEl &&\n this.flickityEl.classList.contains('flickity-enabled')\n )\n this.destroyflickity();\n\n setTimeout(() => {\n this.flickityEl.style.height = '';\n const flick = new flickity(this.flickityEl, finalOptions) as Flickity;\n this.flickityReady = true;\n this.syncflickity = flick;\n\n this.animationChange();\n this.navbtnsChanged();\n this.pagerChanged();\n this.fullscreenChanged();\n this.fullscreenBtnChanged();\n\n this.readyflickity(flick);\n this.ready = true;\n\n if (!window['ResizeObserver']) return;\n\n // just boots and brances to make sure it's the correct size oninit\n const ro = (this.resizeO = new ResizeObserver(() => {\n flick.resize();\n // this.resizeO.disconnect();\n }));\n ro.observe(this.host);\n }, 100);\n }\n\n private normalizeOptions(): FlickityOptions {\n // Base options, can be changed\n const flickityOptions: FlickityOptions = {\n cellSelector: 'nano-slide',\n contain: true,\n prevNextButtons: true,\n fullscreen: true,\n accessibility: true,\n imagesLoaded: true,\n pageDots: true,\n };\n\n if (this.animation === 'fade') {\n flickityOptions.fade = true;\n }\n if (this.currentSlide > 0) {\n flickityOptions.initialIndex = this.currentSlide;\n }\n if (this.autoplay) {\n if (typeof this.autoplay === 'string')\n this.autoplay = parseInt(this.autoplay);\n if (this.autoplay > 0) flickityOptions.autoPlay = this.autoplay as number;\n }\n\n // Keep the event options separate, we dont want users\n // overwriting these\n const eventOptions: FlickityEvents = {\n ready: () => {\n setTimeout(() => {\n this.nanoSlidesReady.emit();\n }, 20);\n },\n select: this.handleSlideSelect,\n change: this.nanoSlidesChange.emit,\n scroll: this.nanoSlidesScroll.emit,\n settle: this.nanoSlidesTransitionEnd.emit,\n dragStart: this.nanoSlidesDragStart.emit,\n dragMove: this.nanoSlidesDragMove.emit,\n dragEnd: this.nanoSlidesDragEnd.emit,\n staticClick: this.nanoSlidesTap.emit,\n fullscreenChange: this.handleFullscreen,\n };\n\n const customEvents =\n !!this.options && !!this.options.on ? this.options.on : {};\n // merge \"on\" event listeners, while giving our event listeners priority\n const mergedEventOptions = { on: { ...customEvents, ...eventOptions } };\n // Merge the base, user options, and events together then pass to flickity\n // @ts-ignore\n return { ...flickityOptions, ...mergedEventOptions, ...this.options };\n }\n\n componentDidLoad() {\n if (\n Build.isBrowser &&\n typeof window !== 'undefined' &&\n (window as any).MutationObserver\n ) {\n const mut = (this.mutationO = new MutationObserver(\n (e: MutationRecord[]) => {\n if (\n e[0].addedNodes[0] &&\n e[0].addedNodes[0].nodeName.toLowerCase() === 'nano-slide' &&\n this.flickityReady\n ) {\n this.update();\n }\n }\n ));\n\n mut.observe(this.host, {\n childList: true,\n subtree: true,\n });\n }\n }\n\n componentWillLoad() {\n this.nanoSlidesDidLoad.emit();\n\n if (!this.didInit) {\n this.didInit = true;\n this.initflickity();\n }\n }\n\n disconnectedCallback() {\n if (this.mutationO) {\n this.mutationO.disconnect();\n this.mutationO = undefined;\n }\n if (this.resizeO) this.resizeO.disconnect();\n this.destroyflickity();\n }\n\n render() {\n return (\n <Host>\n <div\n class={{\n slideshow: true,\n ready: this.ready,\n 'not-ready': !this.ready,\n }}\n >\n <div\n ref={(div) => (this.flickityEl = div)}\n class={{\n 'flickity-container': true,\n 'slides-ready': this.slidesReady,\n 'slides-not-ready': !this.slidesReady,\n }}\n >\n <slot />\n </div>\n <div class=\"ui-extras\">\n <slot name=\"ui\" />\n </div>\n </div>\n </Host>\n );\n }\n}\n\nconst waitForSlides = (host: HTMLElement): Promise<HTMLNanoSlideElement[]> => {\n const allSlides = Array.from(host.querySelectorAll('nano-slide'));\n let toLoadSlides = allSlides.filter(\n (ele: HTMLNanoSlideElement) => !ele.ready\n );\n\n if (!toLoadSlides.length) return Promise.resolve(allSlides);\n\n return new Promise((resolve) => {\n const slideResolver = (ev: CustomEvent) => {\n toLoadSlides = toLoadSlides.filter((ele) => ele !== ev.target);\n if (!toLoadSlides.length) {\n resolve(allSlides);\n host.removeEventListener('nanoSlideReady', slideResolver);\n }\n };\n host.addEventListener('nanoSlideReady', slideResolver);\n // fallback for vue who can't handle camelcase event names\n host.addEventListener('nano-slide-ready', slideResolver);\n });\n};\n"]}
1
+ {"version":3,"file":"slides.js","sourceRoot":"","sources":["../../../src/components/slides/slides.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n ComponentInterface,\n Element,\n Event,\n EventEmitter,\n Prop,\n h,\n Host,\n Watch,\n Method,\n State,\n Build,\n} from '@stencil/core';\nimport { flickity } from './lib/js';\nimport type {\n FlickityOptions,\n FlickityEvents,\n Flickity,\n DragEvent,\n SlideAnimation,\n FlickityCell,\n} from '../../interface';\n\nconst modulo = (num, div) => {\n return ((num % div) + div) % div;\n};\n\n/**\n * The Slides component is a multi-section container. Each section can be swiped or dragged between.\n * It contains any number of Slide components.\n *\n * Uses [Flickity](https://flickity.metafizzy.co/) under the hood.\n *\n * @part base - Wrapper around slides and additional ui elements.\n * @part slide-container - Wraps all slide elements.\n * @part slide-viewport - The visible, scrollable area around slide elements.\n * @part navigation-button - Next / previous navigation buttons.\n * @part navigation-button--next - the next navigation button.\n * @part navigation-button--previous - The previous navigation button.\n * @part navigation-icon - The chevron / arrow icon within a navigation button.\n * @part pagination - Wraps pagination indicators.\n * @part pagination-item - A pagination indicator.\n * @part pagination-item--active - The current, active pagination indicator.\n *\n * @slot - default slot of nano-slide components.\n * @slot ui - An absolutely positioned element that will be placed over the slider. Any custom ui can be housed here.\n * @slot next-icon - Optional next icon to use instead of the default.\n * @slot previous-icon - Optional previous icon to use instead of the default.\n */\n@Component({\n tag: 'nano-slides',\n styleUrl: 'slides.scss',\n shadow: true,\n})\nexport class Slides implements ComponentInterface {\n private flickityEl: HTMLElement;\n private flickityReady = false;\n private mutationO?: MutationObserver;\n private resizeO?: ResizeObserver;\n private readyflickity!: (slider: Flickity) => void;\n private flickity: Promise<Flickity> = new Promise((resolve) => {\n this.readyflickity = resolve;\n });\n private syncflickity?: Flickity;\n private childrenEles: NodeList;\n\n @State() iCurrentSlide: number;\n @State() slidesReady: boolean;\n @State() didInit = false;\n\n @Element() host!: HTMLNanoSlidesElement;\n\n /**\n * Options to pass to the flickity instance.\n * See https://flickity.metafizzy.co/options.html for valid options\n */\n @Prop({ mutable: true }) options: FlickityOptions = {};\n\n @Watch('options')\n async optionsChanged() {\n if (this.flickityReady) {\n const flickity = await this.getflickity();\n Object.assign(flickity.options, this.options);\n await this.update();\n }\n }\n\n /** If `true`, show the next / prev buttons. */\n @Prop() navbtns = false;\n\n @Watch('navbtns')\n async navbtnsChanged() {\n Array.from(\n this._getRoot().querySelectorAll('.flickity-prev-next-button')\n ).forEach((btn) => {\n (btn as HTMLElement).hidden = !this.navbtns;\n });\n }\n\n /** If `true`, show the pagination. */\n @Prop() pager = false;\n\n @Watch('pager')\n async pagerChanged() {\n const dots = this._getRoot().querySelector(\n '.flickity-page-dots'\n ) as HTMLElement;\n dots.hidden = !this.pager;\n }\n\n /** If `true`, show a fullscreen button. */\n @Prop() fullscreenbtn = false;\n\n @Watch('fullscreenbtn')\n async fullscreenBtnChanged() {\n const btn = this._getRoot().querySelector(\n '.flickity-fullscreen-button'\n ) as HTMLElement;\n btn.hidden = !this.fullscreenbtn;\n }\n\n /** If `true`, make the slider fullscreen. */\n @Prop({ reflect: true, mutable: true }) fullscreen = false;\n\n @Watch('fullscreen')\n async fullscreenChanged(_?, oldFs?: boolean) {\n const flickity = await this.getflickity();\n if (this.fullscreen) flickity.viewFullscreen();\n else if (typeof oldFs !== 'undefined') flickity.exitFullscreen();\n }\n\n /** Animation presets. */\n @Prop({ reflect: true }) animation: SlideAnimation = 'scroll';\n\n @Watch('animation')\n async animationChange(_?, oldAnim?: SlideAnimation) {\n const [flkty, slides] = await Promise.all([\n this.getflickity(),\n waitForSlides(this.host),\n ]);\n\n // clear old stuff\n slides.forEach((slide) => {\n slide.style['left'] = undefined;\n });\n\n if (oldAnim === 'parallax') {\n flkty.off('scroll', this.parallax);\n slides.forEach((_, i) => {\n if (this.childrenEles && this.childrenEles[i])\n (this.childrenEles[i] as HTMLElement).style['transform'] = undefined;\n });\n this.update();\n }\n\n // setup new stuff\n switch (this.animation) {\n case 'fade':\n this.options = { fade: true, percentPosition: true };\n break;\n case 'parallax':\n this.options = { fade: false, percentPosition: false };\n flkty.on('scroll', this.parallax);\n break;\n default:\n this.options = { fade: false, percentPosition: true };\n break;\n }\n }\n\n /** Zero-based index of the selected cell. */\n @Prop({ reflect: true, mutable: true }) currentSlide: number = 0;\n\n @Watch('currentSlide')\n currentSlideChange() {\n if (this.currentSlide !== this.iCurrentSlide)\n this.slideTo(this.currentSlide);\n }\n\n @Watch('iCurrentSlide')\n internalSlideChange() {\n this.currentSlide = this.iCurrentSlide;\n }\n\n /** time duration, in ms, to automatically advance slides */\n @Prop() autoplay: string | false | number = false;\n\n @Watch('autoplay')\n async autoPlayChange() {\n await this.stopAutoplay();\n if (this.autoplay) {\n if (typeof this.autoplay === 'string')\n this.autoplay = parseInt(this.autoplay);\n if (this.autoplay > 0) this.startAutoplay(this.autoplay as number);\n }\n }\n\n /** @internal */\n @Prop({ reflect: true, mutable: true }) ready = false;\n\n /** Emitted after component initialisation. */\n @Event() nanoSlidesDidLoad!: EventEmitter<void>;\n\n /** Emitted after flickity initialisation. */\n @Event() nanoSlidesReady!: EventEmitter<void>;\n\n /** Emitted when a slide is selected, even on the same slide. */\n @Event() nanoSlidesSelect!: EventEmitter<number>;\n\n /** Emitted when the selected slide is changed. */\n @Event() nanoSlidesChange!: EventEmitter<number>;\n\n /** Emitted when the slider moves. */\n @Event() nanoSlidesScroll!: EventEmitter<number>;\n\n /** Emitted when the slide transition has finished. */\n @Event() nanoSlidesTransitionEnd!: EventEmitter<number>;\n\n /** Emitted when the slider starts actively being moved. */\n @Event() nanoSlidesDragStart!: EventEmitter<DragEvent>;\n\n /** Emitted when the slider is being dragged. */\n @Event() nanoSlidesDragMove!: EventEmitter<DragEvent>;\n\n /** Emitted when the slider has finished being dragged. */\n @Event() nanoSlidesDragEnd!: EventEmitter<DragEvent>;\n\n /** Emitted when the user taps/clicks on the slide's container. */\n @Event() nanoSlidesTap!: EventEmitter<DragEvent>;\n\n /** Emitted when the user taps/clicks on the slide's container. */\n @Event() nanoSlidesFullscreenChange!: EventEmitter<boolean>;\n\n /**\n * Update the underlying flickity implementation. Call this if you've added or removed\n * child slides.\n */\n @Method()\n async update() {\n const [flickity] = await Promise.all([\n this.getflickity(),\n waitForSlides(this.host),\n ]);\n this.childrenEles = this.host.querySelectorAll('nano-slide > *');\n flickity.reloadCells();\n flickity.resize();\n flickity.reposition();\n }\n\n /**\n * Force flickity to update its height (when adaptiveHeight is enabled) for the duration\n * equal to 'speed' parameter.\n *\n * @param speed The transition duration (in ms).\n */\n @Method()\n async updateAutoHeight(speed?: number) {\n const vp = document.querySelector('.flickity-viewport') as HTMLElement;\n if (vp) vp.style.transition = speed + 'ms';\n }\n\n /**\n * Transition to the specified slide.\n *\n * @param index The index of the slide to transition to.\n * @param instant Immediately view the selected slide without animation.\n */\n @Method()\n async slideTo(index: number, instant?: boolean) {\n const flickity = await this.getflickity();\n flickity.select(index, instant);\n }\n\n /**\n * Transition to the next slide.\n *\n * @param instant The transition duration (in ms).\n * @param wrap If true, the first slide will be selected if at the last slide.\n */\n @Method()\n async slideNext(instant?: boolean, wrap?: boolean) {\n const flickity = await this.getflickity();\n flickity.next(wrap, instant);\n }\n\n /**\n * Transition to the previous slide.\n *\n * @param instant The transition duration (in ms).\n * @param wrap If true, the last slide will be selected if at the first slide.\n */\n @Method()\n async slidePrev(instant?: boolean, wrap?: boolean) {\n const flickity = await this.getflickity();\n flickity.previous(instant, wrap);\n }\n\n /** Get the index of the active slide. */\n @Method()\n async getActiveIndex() {\n const flickity = await this.getflickity();\n return flickity.selectedIndex;\n }\n\n /** Get the total number of slides. */\n @Method()\n async length() {\n const flickity = await this.getflickity();\n return flickity.slides.length;\n }\n\n /** Get whether or not the current slide is the last slide. */\n @Method()\n async isEnd() {\n const flickity = await this.getflickity();\n return flickity.selectedIndex === flickity.slides.length - 1;\n }\n\n /** Get whether or not the current slide is the first slide. */\n @Method()\n async isBeginning() {\n const flickity = await this.getflickity();\n return flickity.selectedIndex === 0;\n }\n\n /**\n * Start auto play.\n * @param time - optional time duration to show slides\n */\n @Method()\n async startAutoplay(time?: number) {\n const flickity = await this.getflickity();\n if (time) this.options = { autoPlay: time };\n setTimeout(() => flickity.playPlayer());\n }\n\n /** Stop auto play. */\n @Method()\n async stopAutoplay() {\n const flickity = await this.getflickity();\n flickity.stopPlayer();\n }\n\n /**\n * Lock or unlock the ability to slide to the next slide.\n *\n * @param lock If `true`, disable swiping\n */\n @Method()\n async lockSwipes(lock: boolean) {\n const flickity = await this.getflickity();\n flickity.options.draggable = !lock;\n flickity.updateDraggable();\n }\n\n /**\n * Get the flickity instance.\n * Use this to access the full flickity API.\n * See https://flickity.metafizzy.co/ for all API options.\n */\n @Method()\n async getflickity() {\n return this.flickity;\n }\n\n /**\n * Hard destroy / create.\n * Certain flickity options, you will require the instance to be re-initialised\n */\n @Method()\n async reload() {\n this.destroyflickity();\n setTimeout(() => this.initflickity(), 20);\n }\n\n private _getRoot() {\n return this.host.shadowRoot ? this.host.shadowRoot : this.host;\n }\n\n private parallax = async () => {\n const flkty = await this.flickity;\n flkty.cells.forEach((el, i) => {\n const cell = el as unknown as FlickityCell;\n let flkX = flkty.x;\n const shiftedPos = cell.x + flkty.slideableWidth * cell.shift;\n const ele = this.childrenEles[i] as HTMLElement;\n\n if (flkty.options.wrapAround && flkty.cells.length > 1) {\n flkX = modulo(flkX, flkty.slideableWidth);\n flkX = flkX - flkty.slideableWidth;\n }\n\n let x = ((cell.target + flkX) * -1) / 3;\n\n if (cell.shift < 0) {\n x = x + Math.abs(shiftedPos) * 1.3333;\n } else if (cell.shift > 0) {\n x = ((cell.target + (flkX + shiftedPos)) * -1) / 3;\n }\n ele.style.transform = 'translate3d(' + x + 'px, 0, 0)';\n });\n };\n\n private handleFullscreen = (isFullScreen: boolean) => {\n this.fullscreen = isFullScreen;\n this.nanoSlidesFullscreenChange.emit(isFullScreen);\n };\n\n private handleSlideSelect = (slide: number) => {\n this.iCurrentSlide = slide;\n this.nanoSlidesSelect.emit(slide);\n };\n\n private destroyflickity() {\n /**\n * We need to synchronously destroy\n * flickity otherwise it is possible\n * that it will be left in a\n * destroyed state if connectedCallback\n * is called multiple times\n */\n const flickity = this.syncflickity;\n\n if (flickity !== undefined) {\n flickity.destroy();\n this.flickity = new Promise((resolve) => {\n this.readyflickity = resolve;\n });\n this.flickityReady = false;\n this.syncflickity = undefined;\n this.ready = false;\n }\n this.didInit = false;\n }\n\n private async initflickity() {\n const finalOptions = this.normalizeOptions();\n\n // init flickity core\n await waitForSlides(this.host);\n\n this.flickityEl.style.height =\n this.flickityEl.getBoundingClientRect().height + 'px';\n this.slidesReady = true;\n\n this.flickityEl =\n this.flickityEl || this._getRoot().querySelector('.flickity-container');\n if (\n this.flickityEl &&\n this.flickityEl.classList.contains('flickity-enabled')\n )\n this.destroyflickity();\n\n setTimeout(() => {\n this.flickityEl.style.height = '';\n const flick = new flickity(this.flickityEl, finalOptions) as Flickity;\n this.flickityReady = true;\n this.syncflickity = flick;\n\n this.animationChange();\n this.navbtnsChanged();\n this.pagerChanged();\n this.fullscreenChanged();\n this.fullscreenBtnChanged();\n\n this.readyflickity(flick);\n this.ready = true;\n\n if (!window['ResizeObserver']) return;\n\n // just boots and braces to make sure it's the correct size oninit\n const ro = (this.resizeO = new ResizeObserver(() => {\n flick.resize();\n // this.resizeO.disconnect();\n }));\n ro.observe(this.host);\n }, 100);\n }\n\n private normalizeOptions(): FlickityOptions {\n // Base options, can be changed\n const flickityOptions: FlickityOptions = {\n cellSelector: 'nano-slide',\n contain: true,\n prevNextButtons: true,\n fullscreen: true,\n accessibility: true,\n imagesLoaded: true,\n pageDots: true,\n };\n\n if (this.animation === 'fade') {\n flickityOptions.fade = true;\n }\n if (this.currentSlide > 0) {\n flickityOptions.initialIndex = this.currentSlide;\n }\n if (this.autoplay) {\n if (typeof this.autoplay === 'string')\n this.autoplay = parseInt(this.autoplay);\n if (this.autoplay > 0) flickityOptions.autoPlay = this.autoplay as number;\n }\n\n // Keep the event options separate, we dont want users\n // overwriting these\n const eventOptions: FlickityEvents = {\n ready: () => {\n setTimeout(() => {\n this.nanoSlidesReady.emit();\n }, 20);\n },\n select: this.handleSlideSelect,\n change: this.nanoSlidesChange.emit,\n scroll: this.nanoSlidesScroll.emit,\n settle: this.nanoSlidesTransitionEnd.emit,\n dragStart: this.nanoSlidesDragStart.emit,\n dragMove: this.nanoSlidesDragMove.emit,\n dragEnd: this.nanoSlidesDragEnd.emit,\n staticClick: this.nanoSlidesTap.emit,\n fullscreenChange: this.handleFullscreen,\n };\n\n const customEvents =\n !!this.options && !!this.options.on ? this.options.on : {};\n // merge \"on\" event listeners, while giving our event listeners priority\n const mergedEventOptions = { on: { ...customEvents, ...eventOptions } };\n // Merge the base, user options, and events together then pass to flickity\n // @ts-ignore\n return { ...flickityOptions, ...mergedEventOptions, ...this.options };\n }\n\n componentDidLoad() {\n if (\n Build.isBrowser &&\n typeof window !== 'undefined' &&\n (window as any).MutationObserver\n ) {\n const mut = (this.mutationO = new MutationObserver(\n (e: MutationRecord[]) => {\n if (\n e[0].addedNodes[0] &&\n e[0].addedNodes[0].nodeName.toLowerCase() === 'nano-slide' &&\n this.flickityReady\n ) {\n this.update();\n }\n }\n ));\n\n mut.observe(this.host, {\n childList: true,\n subtree: true,\n });\n }\n }\n\n componentWillLoad() {\n this.nanoSlidesDidLoad.emit();\n\n if (!this.didInit) {\n this.didInit = true;\n this.initflickity();\n }\n }\n\n disconnectedCallback() {\n if (this.mutationO) {\n this.mutationO.disconnect();\n this.mutationO = undefined;\n }\n if (this.resizeO) this.resizeO.disconnect();\n this.destroyflickity();\n }\n\n render() {\n return (\n <Host>\n <div\n class={{\n slideshow: true,\n ready: this.ready,\n 'not-ready': !this.ready,\n }}\n part=\"base\"\n >\n <div\n ref={(div) => (this.flickityEl = div)}\n class={{\n 'flickity-container': true,\n 'slides-ready': this.slidesReady,\n 'slides-not-ready': !this.slidesReady,\n }}\n part=\"slide-container\"\n >\n <slot />\n </div>\n <div class=\"ui-extras\">\n <slot name=\"ui\" />\n </div>\n </div>\n </Host>\n );\n }\n}\n\nconst waitForSlides = (host: HTMLElement): Promise<HTMLNanoSlideElement[]> => {\n const allSlides = Array.from(host.querySelectorAll('nano-slide'));\n let toLoadSlides = allSlides.filter(\n (ele: HTMLNanoSlideElement) => !ele.ready\n );\n\n if (!toLoadSlides.length) return Promise.resolve(allSlides);\n\n return new Promise((resolve) => {\n const slideResolver = (ev: CustomEvent) => {\n toLoadSlides = toLoadSlides.filter((ele) => ele !== ev.target);\n if (!toLoadSlides.length) {\n resolve(allSlides);\n host.removeEventListener('nanoSlideReady', slideResolver);\n }\n };\n host.addEventListener('nanoSlideReady', slideResolver);\n // fallback for vue who can't handle camelcase event names\n host.addEventListener('nano-slide-ready', slideResolver);\n });\n};\n"]}
package/dist/components/nano-global-nav.js CHANGED
@@ -965,10 +965,7 @@ const GlobalNav = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
965
965
  (this.loggedInNavItms.length || this.hasLoggedinSlot) && (h("nav", { class: "nav-links", "aria-label": "Your user account links" }, h("nano-nav-item", { class: "nano-global-nav user-nav nano-global-nav-menu" }, this.myAccountUser.name, h("nano-icon", { slot: "icon-end", name: "solid/chevron-right" }), h("div", { slot: "secondary" }, h("div", { class: "content" }, h("button", { class: "back-btn", onClick: this.subMenuClose }, h("nano-icon", { slot: "icon-end", name: "solid/chevron-left", "aria-label": "go back" }), this.myAccountUser.name), !!((_a = this.myAccountUser) === null || _a === void 0 ? void 0 : _a.small_avatar_url) && (h("nano-global-nav-user-profile", { myAccountUser: this.myAccountUser, userProfileUrl: this.userProfileUrl })), h("div", { class: "content--sub" }, h("slot", { name: "loggedin", onSlotchange: this.assessSlottedContent }), this.loggedInNavItms.map((link) => {
966
966
  return (h("nano-nav-item", { class: "nano-global-nav nano-global-nav-menu" }, h("a", { href: link.address, target: link.target }, link.title)));
967
967
  }), h("nano-nav-item", { class: "nano-global-nav nano-global-nav-menu" }, h("a", { href: this.myAccData.urls.forgot_password +
968
- this.ssoRedirect }, "Change Password")))))))), h("slot", { name: "promotion", onSlotchange: this.assessSlottedContent }), this.myAccData && this.myAccData.urls.logout && (h("div", { class: "login-btn logout-btn" }, h("a", { href: this.myAccData.urls.logout + this.ssoRedirect }, "Logout")))))), h("div", { class: "sticker-trigger" }), h("nano-sticker", { "auto-resize": "false", "break-point-max": "800", quietMode: { h: 600, w: 800 }, part: "sticker" }, h("div", { class: "bars", part: "bars" }, h("nav", { part: "main-bar", class: "main-bar", "aria-label": "Main site navigation", tabindex: "-1", ref: (div) => (this.mainBarDiv = div), role: !!this.mainSlotLen &&
969
- this.threshold >= this.THRESHOLDLIMIT - THRESHOLDBREAKS.main
970
- ? 'menu'
971
- : undefined }, (this.hasPromotionSlot ||
968
+ this.ssoRedirect }, "Change Password")))))))), h("slot", { name: "promotion", onSlotchange: this.assessSlottedContent }), this.myAccData && this.myAccData.urls.logout && (h("div", { class: "login-btn logout-btn" }, h("a", { href: this.myAccData.urls.logout + this.ssoRedirect }, "Logout")))))), h("div", { class: "sticker-trigger" }), h("nano-sticker", { "auto-resize": "false", "break-point-max": "800", quietMode: { h: 600, w: 800 }, part: "sticker" }, h("div", { class: "bars", part: "bars" }, h("nav", { part: "main-bar", class: "main-bar", "aria-label": "Main site navigation", tabindex: "-1", ref: (div) => (this.mainBarDiv = div) }, (this.hasPromotionSlot ||
972
969
  !!this.overflowSlotLen ||
973
970
  ((this.myAccData || !!this.iconSlotLen) &&
974
971
  this.threshold <