npm - @nanoporetech-digital/components - Versions diffs - 7.6.0 → 7.7.0 - Mend

@nanoporetech-digital/components 7.6.0 → 7.7.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 (680) hide show

package/dist/cjs/nano-dropdown.cjs.entry.js CHANGED Viewed

@@ -5,12 +5,13 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-b6fa04fa.js');
+const index = require('./index-615cdb64.js');
 const activeElement = require('./active-element-8ffcfe49.js');
 const popover = require('./popover-3dfc73f6.js');
 const tabbable = require('./tabbable-619dc959.js');
+const renderer = require('./renderer-cd8b6098.js');
-const dropdownCss = ":host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}:host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}:host{--width:auto;--border:var(--nano-layer-border-style, 1px solid var(--nano-layer-border-color, rgba(0, 0, 0, 0.1)));--border-radius:var(--nano-layer-border-radius, var(--nano-border-radius-medium, 4px));--background:var(--nano-layer-bg, #fff);--padding:10px 0;--overflow:auto;--dropdown-z-index:var(--nano-layer-index-dropdown, 300);--min-width:0;--box-shadow:var(--nano-layer-shadow-large, 0 2px 8px rgba(0, 0, 0, 0.2));--menu-height:var(--max-menu-height, 50vh);display:flex}.dropdown{position:relative}.dropdown__trigger{display:block}.dropdown__positioner{position:absolute;z-index:var(--dropdown-z-index);min-inline-size:var(--min-width);border:0;background:none;padding:0;overflow:visible;color:unset}.dropdown__positioner::backdrop{display:none}.dropdown__positioner[popover],.dropdown__positioner:popover-open{inset:unset}@media (width <= 35.9375em){.dropdown__positioner{z-index:100}}.dropdown__panel{padding:var(--padding);background:var(--background);min-inline-size:var(--min-width);inline-size:var(--width);border:var(--border);border-radius:var(--border-radius);color:currentcolor;box-shadow:var(--box-shadow);opacity:0;transition:0.2s ease opacity, 0.2s ease transform, 0.2s ease min-block-size;min-block-size:20px;overflow:var(--overflow);box-sizing:content-box !important}.dropdown__panel.loading{overflow-y:hidden}.dropdown__panel.top{transform:translateY(-20px) translateZ(0)}.dropdown__panel.bottom{transform:translateY(20px) translateZ(0)}.dropdown__positioner.popover-visible .dropdown__panel{opacity:1;transform:translateY(0) translateZ(0)}.dropdown__panel ::slotted(nano-menu){max-block-size:var(--menu-height)}.dropdown__accessible-title{clip:rect(1px, 1px, 1px, 1px);clip-path:inset(50%);block-size:1px;inline-size:1px;margin:-1px;overflow:hidden;padding:0;position:absolute}";
+const dropdownCss = ":host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}:host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}:host{--width:auto;--border:var(--nano-layer-border-style, 1px solid var(--nano-layer-border-color, rgba(0, 0, 0, 0.1)));--border-radius:var(--nano-layer-border-radius, var(--nano-border-radius-medium, 4px));--background:var(--nano-layer-bg, #fff);--padding:10px 0;--overflow:auto;--dropdown-z-index:var(--nano-layer-index-dropdown, 300);--min-width:0;--box-shadow:var(--nano-layer-shadow-large, 0 2px 8px rgba(0, 0, 0, 0.2));--menu-height:var(--max-menu-height, 50vh);display:flex}.dropdown{position:relative}.dropdown__trigger{display:block}.dropdown__positioner{position:absolute;z-index:var(--dropdown-z-index);min-inline-size:var(--min-width);border:0;background:none;padding:0;overflow:visible;color:unset}.dropdown__positioner::backdrop{display:none}.dropdown__positioner[popover],.dropdown__positioner:popover-open{inset:unset}@media (width <= 35.9375em){.dropdown__positioner{z-index:100}}.dropdown__panel{padding:var(--padding);background:var(--background);min-inline-size:var(--min-width);inline-size:var(--width);border:var(--border);border-radius:var(--border-radius);color:currentcolor;box-shadow:var(--box-shadow);opacity:0;transition:0.2s ease opacity, 0.2s ease transform, 0.2s ease min-block-size;min-block-size:20px;overflow:var(--overflow);box-sizing:content-box !important}.dropdown__panel.loading{overflow-y:hidden}.dropdown__panel.top{transform:translateY(-20px) translateZ(0)}.dropdown__panel.bottom{transform:translateY(20px) translateZ(0)}.dropdown__positioner.popover-visible .dropdown__panel{opacity:1;transform:translateY(0) translateZ(0)}.dropdown__panel ::slotted(.nano-menu){max-block-size:var(--menu-height)}.dropdown__accessible-title{clip:rect(1px, 1px, 1px, 1px);clip-path:inset(50%);block-size:1px;inline-size:1px;margin:-1px;overflow:hidden;padding:0;position:absolute}";
 const NanoDropdownStyle0 = dropdownCss;
 let dropDownIds = 0;
@@ -32,7 +33,7 @@ const Dropdown = class {
     accessibleTrigger;
     didLoad = false;
     get menu() {
-        return this.host.querySelector('nano-menu');
+        return this.host.querySelector(renderer.transformTag('nano-menu'));
     }
     get host() { return index.getElement(this); }
     /** Determines if the dropdown should open automatically when the trigger is clicked */
@@ -146,7 +147,8 @@ const Dropdown = class {
     handlePanelSelect(event) {
         const target = event.target;
         // Hide the dropdown when a menu item is selected
-        if (this.closeOnSelect && target.tagName.toLowerCase() === 'nano-menu')
+        if (this.closeOnSelect &&
+            target.tagName.toLowerCase() === renderer.transformTag('nano-menu'))
             this.hide();
     }
     // Methods
@@ -348,12 +350,12 @@ const Dropdown = class {
             this.popover.destroy();
     }
     render() {
-        return (index.h("div", { key: '12df84c2c810b737883ecade606afc7f2a668499', part: "base", id: this.dropdownId, class: {
+        return (renderer.h(index.Host, { key: '85c1bf918fa0800659aaab7d64c6832134d9b003', class: "nano-dropdown" }, renderer.h("div", { key: '9cc1b9eba8d8fea321f85c71cdd5fef1d823d03e', part: "base", id: this.dropdownId, class: {
                 dropdown: true,
                 'dropdown--open': this.open,
-            } }, index.h("span", { key: '8c7d099792ed9675b1968872a4241cb4a53882bd', part: "trigger", class: "dropdown__trigger", ref: (el) => (this.trigger = el), onKeyDown: this.handleTriggerKeyDown, onClick: this.togglePanel }, index.h("slot", { key: '4f2dcd66413968a15197421e077179b1c1467273', name: "trigger", onSlotchange: this.handleTriggerSlotChange })), index.h("div", { key: 'f9d8416faf7122a8003f7617c8002df15ff6d9d6', ref: (el) => (this.positioner = el), class: "dropdown__positioner", popover: "manual", id: this.dropdownId + '-positioner' }, index.h("div", { key: '64e8f983b70e61cbab84f3f9ce812cda085ae2cd', ref: (el) => (this.panel = el), part: "panel", class: `dropdown__panel ${this.placement.split('-').join(' ')}`, "aria-hidden": !this.open, role: this.host.getAttribute('role') === 'group' ? 'group' : 'dialog', "aria-modal": this.host.getAttribute('role') === 'group' ? undefined : 'true', "aria-labelledby": this.dialogTitle ? this.labelId : undefined }, this.dialogTitle && (index.h("span", { key: 'f6ac2f293047e43bb92940b93ddb58bffae07823', id: this.labelId, class: "dropdown__accessible-title", "aria-live": this.host.getAttribute('role') === 'group'
+            } }, renderer.h("span", { key: '06975a344a9d5760057a1531dd43e4dea9a6eed9', part: "trigger", class: "dropdown__trigger", ref: (el) => (this.trigger = el), onKeyDown: this.handleTriggerKeyDown, onClick: this.togglePanel }, renderer.h("slot", { key: '6a5adccd87e2fa3c763cb2bdadff0aa4323c3da3', name: "trigger", onSlotchange: this.handleTriggerSlotChange })), renderer.h("div", { key: '1a887678dd9cc47a8192060478a5d7acdb06600e', ref: (el) => (this.positioner = el), class: "dropdown__positioner", popover: "manual", id: this.dropdownId + '-positioner' }, renderer.h("div", { key: 'c81fc552c814c87e2df44bf8022c38729069240b', ref: (el) => (this.panel = el), part: "panel", class: `dropdown__panel ${this.placement.split('-').join(' ')}`, "aria-hidden": !this.open, role: this.host.getAttribute('role') === 'group' ? 'group' : 'dialog', "aria-modal": this.host.getAttribute('role') === 'group' ? undefined : 'true', "aria-labelledby": this.dialogTitle ? this.labelId : undefined }, this.dialogTitle && (renderer.h("span", { key: '6d38bbf3d0d4411190dac237f2daa0815fafa420', id: this.labelId, class: "dropdown__accessible-title", "aria-live": this.host.getAttribute('role') === 'group'
                 ? undefined
-                : 'polite' }, this.dialogTitle)), index.h("slot", { key: 'e4a3e354465a78c6c8645c8552dff8e81b413e2a' })))));
+                : 'polite' }, this.dialogTitle)), renderer.h("slot", { key: '8ad35ae3a28c6a057d1cf408e9256605759916ba' }))))));
     }
     static get watchers() { return {
         "open": ["handleOpenChange"],

package/dist/cjs/nano-dropdown.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"nano-dropdown.entry.cjs.js","mappings":"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","names":["activeElement","getActiveElement","getNearestTabbableElement","Popover","h"],"sources":["src/components/dropdown/dropdown.scss?tag=nano-dropdown&encapsulation=shadow","src/components/dropdown/dropdown.tsx"],"sourcesContent":["@use '../../global/style/utilities/mixins' as mx;\n@use '../../global/style/nano-theme/tokens/layers' as tokens;\n\n:host {\n /*\n @prop --width: width of the dropdown. Defaults to 'auto'\n * @prop --border: Defaults to #{tokens.$layer-border-style}\n * @prop --border-radius: Defaults to #{tokens.$layer-bg-color};\n * @prop --background: Defaults to #{tokens.$layer-bg-color};\n * @prop --padding: padding of the drop down. Default to '10px 0';\n * @prop --overflow: `nano-menu` with nested `nav-item` requires hidden overflow. This can be overidden;\n * @prop --dropdown-z-index: Defaults to #{tokens.$layer-index-dropdown};\n * @prop --min-width: Defaults to 0;\n * @prop --box-shadow: #{tokens.$layer-shadow-large};\n * @prop --max-menu-height: max height of a slotted menu. defaults to 50vh\n /\n\n --width: auto;\n --border: #{tokens.$layer-border-style};\n --border-radius: #{tokens.$layer-border-radius};\n --background: #{tokens.$layer-bg-color};\n --padding: 10px 0;\n --overflow: auto;\n --dropdown-z-index: #{tokens.$layer-index-dropdown};\n --min-width: 0;\n --box-shadow: #{tokens.$layer-shadow-large};\n --menu-height: var(--max-menu-height, 50vh);\n\n display: flex;\n}\n\n.dropdown {\n position: relative;\n\n &__trigger {\n display: block;\n }\n\n &__positioner {\n position: absolute;\n z-index: var(--dropdown-z-index);\n min-inline-size: var(--min-width);\n border: 0;\n background: none;\n padding: 0;\n overflow: visible;\n color: unset;\n\n &::backdrop { display: none; }\n\n &[popover],\n &:popover-open {\n inset: unset;\n }\n\n @media (width <= 35.9375em) {\n z-index: 100;\n }\n }\n\n &__panel {\n padding: var(--padding);\n background: var(--background);\n min-inline-size: var(--min-width);\n inline-size: var(--width);\n border: var(--border);\n border-radius: var(--border-radius);\n color: currentcolor;\n box-shadow: var(--box-shadow);\n opacity: 0;\n transition: 0.2s ease opacity, 0.2s ease transform, 0.2s ease min-block-size;\n min-block-size: 20px;\n overflow: var(--overflow);\n box-sizing: content-box !important;\n\n &.loading {\n overflow-y: hidden;\n }\n\n &.top {\n transform: translateY(-20px) translateZ(0);\n }\n\n &.bottom {\n transform: translateY(20px) translateZ(0);\n }\n\n .dropdown__positioner.popover-visible & {\n opacity: 1;\n transform: translateY(0) translateZ(0);\n }\n\n ::slotted(nano-menu) {\n max-block-size: var(--menu-height);\n }\n }\n\n &__accessible-title {\n @include mx.visually-hide();\n }\n}\n","import {\n Component,\n Element,\n Event,\n Method,\n Prop,\n Watch,\n h,\n Listen,\n ComponentInterface,\n EventEmitter,\n} from '@stencil/core';\nimport { getActiveElement } from '../../utils/active-element';\nimport Popover, { PopoverPlacement } from '../../utils/popover';\nimport { getNearestTabbableElement } from '../../utils/tabbable';\nimport type { NavItemEventDetail } from '../nav-item/nav-item-interface';\n\nlet dropDownIds = 0;\n\n/\n Dropdowns show additional content in a panel.\n * Designed to work well with nano-menu components to provide a list of options (`nano-nav-items` / `nano-option`).\n * @slot trigger - The dropdown's trigger.\n * @slot - The dropdown's content.\n /\n@Component({\n tag: 'nano-dropdown',\n styleUrl: 'dropdown.scss',\n shadow: true,\n})\nexport class Dropdown implements ComponentInterface {\n private dropdownId = `dropdown-${dropDownIds++}`;\n private labelId = this.dropdownId + '-title';\n private ignoreOpenWatcher = false;\n private panel: HTMLElement;\n private popover: Popover;\n private trigger: HTMLElement;\n private positioner: HTMLElement;\n private accessibleTrigger: HTMLElement;\n private didLoad = false;\n private get menu() {\n return this.host.querySelector('nano-menu');\n }\n\n @Element() host: HTMLNanoDropdownElement;\n\n /* Determines if the dropdown should open automatically when the trigger is clicked /\n @Prop() autoOpen = true;\n\n /* Indicates whether or not the dropdown is open. You can use this in lieu of the show/hide methods. /\n @Prop({ mutable: true, reflect: true }) open = false;\n\n @Watch('open')\n handleOpenChange() {\n if (this.ignoreOpenWatcher) return;\n\n if (this.open) this.show();\n else this.hide();\n\n if (this.accessibleTrigger) {\n this.accessibleTrigger.setAttribute(\n 'aria-expanded',\n this.open.toString()\n );\n return;\n }\n\n this.updateAccessibleTrigger();\n }\n\n /\n Determines whether the dropdown should hide when a menu item is selected.\n /\n @Prop() closeOnSelect = true;\n\n /\n The dropdown will close when the user interacts outside of this element (e.g. clicking).\n /\n @Prop({ mutable: true }) containingElement: HTMLElement;\n\n /\n If you don't want to use the trigger slot, you can use this to 'tether' the dropdown to another element.\n * And you will still need to control when the component is opened (using show() / hide() or the `open` prop)\n /\n @Prop() tetherTo: HTMLElement = null;\n\n @Watch('tetherTo')\n handleTetherToChange() {\n this.createPopover();\n this.updateAccessibleTrigger();\n }\n\n /\n The preferred placement of the dropdown panel. Note that the actual placement may vary as needed to keep the panel\n * inside of the viewport.\n /\n @Prop() placement: PopoverPlacement = 'bottom-start';\n\n /\n The distance in pixels from which to offset the panel away from its trigger.\n /\n @Prop() distance = 2;\n\n /\n The distance in pixels from which to offset the panel along its trigger.\n /\n @Prop() skidding = 0;\n\n /\n Enable this option to prevent the panel from being clipped when the component is placed inside a container with\n * `overflow: auto\|scroll`.\n /\n @Prop({ mutable: true }) hoist = false;\n\n @Watch('placement')\n @Watch('distance')\n @Watch('skidding')\n @Watch('hoist')\n handlePopoverOptionsChange() {\n if (!this.popover) return;\n\n this.popover.setOptions({\n strategy: this.hoist ? 'fixed' : 'absolute',\n placement: this.placement,\n skidding: this.skidding,\n distance: this.distance,\n });\n }\n\n /\n Title used to describe the dropdown content for accessibility\n /\n @Prop() dialogTitle!: string;\n\n // Events\n\n /\n Emitted when the dropdown opens. Calling `event.preventDefault()` will prevent it from being opened.\n /\n @Event() nanoShow: EventEmitter;\n\n /\n Emitted after the dropdown opens and all transitions are complete.\n /\n @Event() nanoAfterShow: EventEmitter;\n\n /\n Emitted when the dropdown closes. Calling `event.preventDefault()` will prevent it from being closed.\n /\n @Event() nanoHide: EventEmitter;\n\n /\n Emitted after the dropdown closes and all transitions are complete.\n /\n @Event() nanoAfterHide: EventEmitter;\n\n // this is a massive hack to make stencil expose the `EventEmitter` type in the final build\n // because the `Dropdown` class is used as a type in `nano-datalist`\n /* @internal /\n @Prop() eventType: EventEmitter;\n\n // Listeners\n\n @Listen('nanoOpen')\n secondaryOpen(ev: CustomEvent) {\n if (!(ev.detail as NavItemEventDetail).secondaryMenu) return;\n ev.stopPropagation();\n\n this.panel.classList.add('loading');\n this.panel.addEventListener(\n 'transitionend',\n () => {\n this.panel.classList.remove('loading');\n },\n { once: true }\n );\n\n this.panel.style.minHeight =\n (ev.detail as NavItemEventDetail).secondaryMenu.scrollHeight + 'px';\n }\n\n @Listen('nanoClose')\n secondaryClose(ev: CustomEvent) {\n if (!(ev.detail as NavItemEventDetail).secondaryMenu) return;\n ev.stopPropagation();\n if (!(ev.target as HTMLElement).parentElement) return;\n this.panel.style.minHeight =\n (ev.target as HTMLElement).parentElement.scrollHeight + 'px';\n }\n\n @Listen('nanoSelect')\n handlePanelSelect(event: CustomEvent) {\n const target = event.target as HTMLElement;\n\n // Hide the dropdown when a menu item is selected\n if (this.closeOnSelect && target.tagName.toLowerCase() === 'nano-menu')\n this.hide();\n }\n\n // Methods\n\n /* Shows the dropdown panel /\n @Method()\n async show() {\n this.ignoreOpenWatcher = true;\n this.open = true;\n\n const nanoShow = this.nanoShow.emit();\n\n if (nanoShow.defaultPrevented) {\n this.open = false;\n this.ignoreOpenWatcher = false;\n return;\n }\n\n if (typeof this.positioner?.showPopover === 'function') {\n this.hoist = true;\n this.popover.show();\n this.positioner.showPopover();\n } else {\n this.popover.show();\n }\n\n this.ignoreOpenWatcher = false;\n document.addEventListener('mousedown', this.handleDocumentMouseDown);\n document.addEventListener('keydown', this.handleDocumentKeyDown);\n }\n\n /* Hides the dropdown panel /\n @Method()\n async hide() {\n this.ignoreOpenWatcher = true;\n this.open = false;\n\n const nanoHide = this.nanoHide.emit();\n\n if (nanoHide.defaultPrevented) {\n this.open = true;\n this.ignoreOpenWatcher = false;\n return;\n }\n\n if (this.popover) this.popover.hide();\n this.ignoreOpenWatcher = false;\n\n document.removeEventListener('mousedown', this.handleDocumentMouseDown);\n document.removeEventListener('keydown', this.handleDocumentKeyDown);\n\n if (this.accessibleTrigger && this.focusEleInDropDwn()) {\n this.accessibleTrigger.focus();\n }\n\n setTimeout(() => {\n if (!this.open && typeof this.positioner?.hidePopover === 'function') {\n this.positioner.hidePopover();\n }\n }, 300);\n }\n\n // Private methods\n\n /\n Decides if the current active element or element\n * connected to the current event is connected to the Dropdown\n * @param e\n * @returns whether the current focus is within the dropdown\n */\n private focusEleInDropDwn(e?: Event) {\n const activeElement = getActiveElement();\n\n if (e && e.composedPath()?.length) {\n const ddInPath = e.composedPath().includes(this.containingElement);\n if (ddInPath) return ddInPath;\n return e.composedPath().includes(this.accessibleTrigger);\n }\n\n return (\n activeElement &&\n activeElement.closest(this.containingElement.tagName.toLowerCase()) ===\n this.containingElement &&\n activeElement !== this.accessibleTrigger\n );\n }\n\n private togglePanel = () => {\n if (!this.autoOpen) return;\n if (this.open) this.hide();\n else this.show();\n };\n\n // Slotted triggers can be arbitrary content, but we need to link them to the dropdown panel with `aria-haspopup` and\n // `aria-expanded`. These must be applied to the \"accessible trigger\" (the tabbable portion of the trigger element\n // that gets slotted in) so screen readers will understand them. The accessible trigger could be the slotted element,\n private updateAccessibleTrigger() {\n if (!this.didLoad) return;\n\n let accessibleTrigger: HTMLElement;\n this.accessibleTrigger = null;\n\n if (!this.tetherTo) {\n const assignedElements = Array.from(\n this.host.querySelectorAll('[slot=\"trigger\"]')\n );\n accessibleTrigger = assignedElements.map(getNearestTabbableElement)[0];\n } else {\n accessibleTrigger = getNearestTabbableElement(this.tetherTo);\n }\n\n if (accessibleTrigger && !accessibleTrigger.getAttribute('aria-haspopup')) {\n accessibleTrigger.setAttribute('aria-haspopup', 'true');\n accessibleTrigger.setAttribute(\n 'aria-expanded',\n this.open ? 'true' : 'false'\n );\n this.accessibleTrigger = accessibleTrigger;\n }\n }\n\n // Handlers\n\n private handleDocumentKeyDown(event: KeyboardEvent) {\n // Close when escape is pressed\n if (event.key === 'Escape') {\n this.hide();\n return;\n }\n\n // Close when tabbing results in the focus leaving the close element\n if (event.key === 'Tab') {\n setTimeout(() => {\n if (\n document.activeElement &&\n document.activeElement.closest(\n this.containingElement.tagName.toLowerCase()\n ) !== this.containingElement\n ) {\n this.hide();\n return;\n }\n });\n }\n\n // If a menu is present, focus on it when certain keys are pressed\n if (this.menu && ['ArrowDown', 'ArrowUp'].includes(event.key)) {\n // must have menu item, must have pressed down, must be open and must not have focus within dd\n if (!this.open \|\| this.focusEleInDropDwn(event)) return;\n event.preventDefault();\n this.menu.setFocus();\n return;\n }\n\n // All other keys focus the menu and pass the event through to menu (necessary for type-to-search to work)\n const ePath = event.composedPath();\n if (this.menu && ePath.length && !ePath.find((el) => el !== this.menu)) {\n this.menu.dispatchEvent(new KeyboardEvent(event.type, event));\n return;\n }\n }\n\n private handleDocumentMouseDown(event: MouseEvent) {\n // Close when clicking outside of the close element\n if (!this.focusEleInDropDwn(event)) {\n this.hide();\n return;\n }\n }\n\n private handleTriggerKeyDown = (event: KeyboardEvent) => {\n // Open the panel when pressing down or up while focused on the trigger\n if (['ArrowDown', 'ArrowUp', ' '].includes(event.key)) {\n this.show();\n event.preventDefault();\n event.stopPropagation();\n\n if (this.menu) this.menu.setFocus();\n }\n };\n\n private handleTriggerSlotChange = () => {\n this.updateAccessibleTrigger();\n };\n\n private createPopover() {\n if ((!this.tetherTo && !this.trigger) \|\| !this.positioner) return;\n\n if (this.popover) {\n if (this.open) this.hide();\n this.popover.destroy();\n this.popover = null;\n }\n\n this.popover = new Popover(this.tetherTo \|\| this.trigger, this.positioner, {\n strategy: this.hoist ? 'fixed' : 'absolute',\n placement: this.placement,\n distance: this.distance,\n skidding: this.skidding,\n transitionElement: this.panel,\n onAfterHide: () => this.nanoAfterHide.emit(),\n onAfterShow: () => this.nanoAfterShow.emit(),\n onTransitionEnd: () => {\n if (!this.open) {\n this.panel.scrollTop = 0;\n } else if (this.menu) {\n this.menu.showActiveElement();\n }\n },\n });\n // Show on init if open\n if (this.open) {\n this.show();\n }\n }\n\n // Stencil hooks\n\n connectedCallback() {\n this.handleDocumentKeyDown = this.handleDocumentKeyDown.bind(this);\n this.handleDocumentMouseDown = this.handleDocumentMouseDown.bind(this);\n\n if (!this.containingElement) this.containingElement = this.host;\n }\n\n componentDidLoad() {\n this.didLoad = true;\n this.createPopover();\n setTimeout(() => this.updateAccessibleTrigger(), 100);\n }\n\n disconnectedCallback() {\n if (this.host.isConnected) this.hide();\n if (this.popover) this.popover.destroy();\n }\n\n render() {\n return (\n <div\n part=\"base\"\n id={this.dropdownId}\n class={{\n dropdown: true,\n 'dropdown--open': this.open,\n }}\n >\n <span\n part=\"trigger\"\n class=\"dropdown__trigger\"\n ref={(el) => (this.trigger = el)}\n onKeyDown={this.handleTriggerKeyDown}\n onClick={this.togglePanel}\n >\n <slot name=\"trigger\" onSlotchange={this.handleTriggerSlotChange} />\n </span>\n\n <div\n ref={(el) => (this.positioner = el)}\n class=\"dropdown__positioner\"\n popover=\"manual\"\n id={this.dropdownId + '-positioner'}\n >\n <div\n ref={(el) => (this.panel = el)}\n part=\"panel\"\n class={`dropdown__panel ${this.placement.split('-').join(' ')}`}\n aria-hidden={!this.open}\n role={\n this.host.getAttribute('role') === 'group' ? 'group' : 'dialog'\n }\n aria-modal={\n this.host.getAttribute('role') === 'group' ? undefined : 'true'\n }\n aria-labelledby={this.dialogTitle ? this.labelId : undefined}\n >\n {this.dialogTitle && (\n <span\n id={this.labelId}\n class=\"dropdown__accessible-title\"\n aria-live={\n this.host.getAttribute('role') === 'group'\n ? undefined\n : 'polite'\n }\n >\n {this.dialogTitle}\n </span>\n )}\n <slot />\n </div>\n </div>\n </div>\n );\n }\n}\n"],"version":3}
1	+ {"file":"nano-dropdown.entry.cjs.js","mappings":"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","names":["transformTag","activeElement","getActiveElement","getNearestTabbableElement","Popover","h","Host"],"sources":["src/components/dropdown/dropdown.scss?tag=nano-dropdown&encapsulation=shadow","src/components/dropdown/dropdown.tsx"],"sourcesContent":["@use '../../global/style/utilities/mixins' as mx;\n@use '../../global/style/nano-theme/tokens/layers' as tokens;\n\n:host {\n /*\n @prop --width: width of the dropdown. Defaults to 'auto'\n * @prop --border: Defaults to #{tokens.$layer-border-style}\n * @prop --border-radius: Defaults to #{tokens.$layer-bg-color};\n * @prop --background: Defaults to #{tokens.$layer-bg-color};\n * @prop --padding: padding of the drop down. Default to '10px 0';\n * @prop --overflow: `nano-menu` with nested `nav-item` requires hidden overflow. This can be overidden;\n * @prop --dropdown-z-index: Defaults to #{tokens.$layer-index-dropdown};\n * @prop --min-width: Defaults to 0;\n * @prop --box-shadow: #{tokens.$layer-shadow-large};\n * @prop --max-menu-height: max height of a slotted menu. defaults to 50vh\n /\n\n --width: auto;\n --border: #{tokens.$layer-border-style};\n --border-radius: #{tokens.$layer-border-radius};\n --background: #{tokens.$layer-bg-color};\n --padding: 10px 0;\n --overflow: auto;\n --dropdown-z-index: #{tokens.$layer-index-dropdown};\n --min-width: 0;\n --box-shadow: #{tokens.$layer-shadow-large};\n --menu-height: var(--max-menu-height, 50vh);\n\n display: flex;\n}\n\n.dropdown {\n position: relative;\n\n &__trigger {\n display: block;\n }\n\n &__positioner {\n position: absolute;\n z-index: var(--dropdown-z-index);\n min-inline-size: var(--min-width);\n border: 0;\n background: none;\n padding: 0;\n overflow: visible;\n color: unset;\n\n &::backdrop { display: none; }\n\n &[popover],\n &:popover-open {\n inset: unset;\n }\n\n @media (width <= 35.9375em) {\n z-index: 100;\n }\n }\n\n &__panel {\n padding: var(--padding);\n background: var(--background);\n min-inline-size: var(--min-width);\n inline-size: var(--width);\n border: var(--border);\n border-radius: var(--border-radius);\n color: currentcolor;\n box-shadow: var(--box-shadow);\n opacity: 0;\n transition: 0.2s ease opacity, 0.2s ease transform, 0.2s ease min-block-size;\n min-block-size: 20px;\n overflow: var(--overflow);\n box-sizing: content-box !important;\n\n &.loading {\n overflow-y: hidden;\n }\n\n &.top {\n transform: translateY(-20px) translateZ(0);\n }\n\n &.bottom {\n transform: translateY(20px) translateZ(0);\n }\n\n .dropdown__positioner.popover-visible & {\n opacity: 1;\n transform: translateY(0) translateZ(0);\n }\n\n ::slotted(.nano-menu) {\n max-block-size: var(--menu-height);\n }\n }\n\n &__accessible-title {\n @include mx.visually-hide();\n }\n}\n","import {\n Component,\n Element,\n Event,\n Method,\n Prop,\n Watch,\n Listen,\n ComponentInterface,\n EventEmitter,\n Host,\n} from '@stencil/core';\nimport { getActiveElement } from '../../utils/active-element';\nimport Popover, { PopoverPlacement } from '../../utils/popover';\nimport { getNearestTabbableElement } from '../../utils/tabbable';\nimport { transformTag, h } from '../../utils/renderer';\nimport type { NavItemEventDetail } from '../nav-item/nav-item-interface';\n\nlet dropDownIds = 0;\n\n/\n Dropdowns show additional content in a panel.\n * Designed to work well with nano-menu components to provide a list of options (`nano-nav-items` / `nano-option`).\n * @slot trigger - The dropdown's trigger.\n * @slot - The dropdown's content.\n /\n@Component({\n tag: 'nano-dropdown',\n styleUrl: 'dropdown.scss',\n shadow: true,\n})\nexport class Dropdown implements ComponentInterface {\n private dropdownId = `dropdown-${dropDownIds++}`;\n private labelId = this.dropdownId + '-title';\n private ignoreOpenWatcher = false;\n private panel: HTMLElement;\n private popover: Popover;\n private trigger: HTMLElement;\n private positioner: HTMLElement;\n private accessibleTrigger: HTMLElement;\n private didLoad = false;\n private get menu() {\n return this.host.querySelector<HTMLNanoMenuElement>(\n transformTag('nano-menu')\n );\n }\n\n @Element() host: HTMLNanoDropdownElement;\n\n /* Determines if the dropdown should open automatically when the trigger is clicked /\n @Prop() autoOpen = true;\n\n /* Indicates whether or not the dropdown is open. You can use this in lieu of the show/hide methods. /\n @Prop({ mutable: true, reflect: true }) open = false;\n\n @Watch('open')\n handleOpenChange() {\n if (this.ignoreOpenWatcher) return;\n\n if (this.open) this.show();\n else this.hide();\n\n if (this.accessibleTrigger) {\n this.accessibleTrigger.setAttribute(\n 'aria-expanded',\n this.open.toString()\n );\n return;\n }\n\n this.updateAccessibleTrigger();\n }\n\n /\n Determines whether the dropdown should hide when a menu item is selected.\n /\n @Prop() closeOnSelect = true;\n\n /\n The dropdown will close when the user interacts outside of this element (e.g. clicking).\n /\n @Prop({ mutable: true }) containingElement: HTMLElement;\n\n /\n If you don't want to use the trigger slot, you can use this to 'tether' the dropdown to another element.\n * And you will still need to control when the component is opened (using show() / hide() or the `open` prop)\n /\n @Prop() tetherTo: HTMLElement = null;\n\n @Watch('tetherTo')\n handleTetherToChange() {\n this.createPopover();\n this.updateAccessibleTrigger();\n }\n\n /\n The preferred placement of the dropdown panel. Note that the actual placement may vary as needed to keep the panel\n * inside of the viewport.\n /\n @Prop() placement: PopoverPlacement = 'bottom-start';\n\n /\n The distance in pixels from which to offset the panel away from its trigger.\n /\n @Prop() distance = 2;\n\n /\n The distance in pixels from which to offset the panel along its trigger.\n /\n @Prop() skidding = 0;\n\n /\n Enable this option to prevent the panel from being clipped when the component is placed inside a container with\n * `overflow: auto\|scroll`.\n /\n @Prop({ mutable: true }) hoist = false;\n\n @Watch('placement')\n @Watch('distance')\n @Watch('skidding')\n @Watch('hoist')\n handlePopoverOptionsChange() {\n if (!this.popover) return;\n\n this.popover.setOptions({\n strategy: this.hoist ? 'fixed' : 'absolute',\n placement: this.placement,\n skidding: this.skidding,\n distance: this.distance,\n });\n }\n\n /\n Title used to describe the dropdown content for accessibility\n /\n @Prop() dialogTitle!: string;\n\n // Events\n\n /\n Emitted when the dropdown opens. Calling `event.preventDefault()` will prevent it from being opened.\n /\n @Event() nanoShow: EventEmitter;\n\n /\n Emitted after the dropdown opens and all transitions are complete.\n /\n @Event() nanoAfterShow: EventEmitter;\n\n /\n Emitted when the dropdown closes. Calling `event.preventDefault()` will prevent it from being closed.\n /\n @Event() nanoHide: EventEmitter;\n\n /\n Emitted after the dropdown closes and all transitions are complete.\n /\n @Event() nanoAfterHide: EventEmitter;\n\n // this is a massive hack to make stencil expose the `EventEmitter` type in the final build\n // because the `Dropdown` class is used as a type in `nano-datalist`\n /* @internal /\n @Prop() eventType: EventEmitter;\n\n // Listeners\n\n @Listen('nanoOpen')\n secondaryOpen(ev: CustomEvent) {\n if (!(ev.detail as NavItemEventDetail).secondaryMenu) return;\n ev.stopPropagation();\n\n this.panel.classList.add('loading');\n this.panel.addEventListener(\n 'transitionend',\n () => {\n this.panel.classList.remove('loading');\n },\n { once: true }\n );\n\n this.panel.style.minHeight =\n (ev.detail as NavItemEventDetail).secondaryMenu.scrollHeight + 'px';\n }\n\n @Listen('nanoClose')\n secondaryClose(ev: CustomEvent) {\n if (!(ev.detail as NavItemEventDetail).secondaryMenu) return;\n ev.stopPropagation();\n if (!(ev.target as HTMLElement).parentElement) return;\n this.panel.style.minHeight =\n (ev.target as HTMLElement).parentElement.scrollHeight + 'px';\n }\n\n @Listen('nanoSelect')\n handlePanelSelect(event: CustomEvent) {\n const target = event.target as HTMLElement;\n\n // Hide the dropdown when a menu item is selected\n if (\n this.closeOnSelect &&\n target.tagName.toLowerCase() === transformTag('nano-menu')\n )\n this.hide();\n }\n\n // Methods\n\n /* Shows the dropdown panel /\n @Method()\n async show() {\n this.ignoreOpenWatcher = true;\n this.open = true;\n\n const nanoShow = this.nanoShow.emit();\n\n if (nanoShow.defaultPrevented) {\n this.open = false;\n this.ignoreOpenWatcher = false;\n return;\n }\n\n if (typeof this.positioner?.showPopover === 'function') {\n this.hoist = true;\n this.popover.show();\n this.positioner.showPopover();\n } else {\n this.popover.show();\n }\n\n this.ignoreOpenWatcher = false;\n document.addEventListener('mousedown', this.handleDocumentMouseDown);\n document.addEventListener('keydown', this.handleDocumentKeyDown);\n }\n\n /* Hides the dropdown panel /\n @Method()\n async hide() {\n this.ignoreOpenWatcher = true;\n this.open = false;\n\n const nanoHide = this.nanoHide.emit();\n\n if (nanoHide.defaultPrevented) {\n this.open = true;\n this.ignoreOpenWatcher = false;\n return;\n }\n\n if (this.popover) this.popover.hide();\n this.ignoreOpenWatcher = false;\n\n document.removeEventListener('mousedown', this.handleDocumentMouseDown);\n document.removeEventListener('keydown', this.handleDocumentKeyDown);\n\n if (this.accessibleTrigger && this.focusEleInDropDwn()) {\n this.accessibleTrigger.focus();\n }\n\n setTimeout(() => {\n if (!this.open && typeof this.positioner?.hidePopover === 'function') {\n this.positioner.hidePopover();\n }\n }, 300);\n }\n\n // Private methods\n\n /\n Decides if the current active element or element\n * connected to the current event is connected to the Dropdown\n * @param e\n * @returns whether the current focus is within the dropdown\n */\n private focusEleInDropDwn(e?: Event) {\n const activeElement = getActiveElement();\n\n if (e && e.composedPath()?.length) {\n const ddInPath = e.composedPath().includes(this.containingElement);\n if (ddInPath) return ddInPath;\n return e.composedPath().includes(this.accessibleTrigger);\n }\n\n return (\n activeElement &&\n activeElement.closest(this.containingElement.tagName.toLowerCase()) ===\n this.containingElement &&\n activeElement !== this.accessibleTrigger\n );\n }\n\n private togglePanel = () => {\n if (!this.autoOpen) return;\n if (this.open) this.hide();\n else this.show();\n };\n\n // Slotted triggers can be arbitrary content, but we need to link them to the dropdown panel with `aria-haspopup` and\n // `aria-expanded`. These must be applied to the \"accessible trigger\" (the tabbable portion of the trigger element\n // that gets slotted in) so screen readers will understand them. The accessible trigger could be the slotted element,\n private updateAccessibleTrigger() {\n if (!this.didLoad) return;\n\n let accessibleTrigger: HTMLElement;\n this.accessibleTrigger = null;\n\n if (!this.tetherTo) {\n const assignedElements = Array.from(\n this.host.querySelectorAll('[slot=\"trigger\"]')\n );\n accessibleTrigger = assignedElements.map(getNearestTabbableElement)[0];\n } else {\n accessibleTrigger = getNearestTabbableElement(this.tetherTo);\n }\n\n if (accessibleTrigger && !accessibleTrigger.getAttribute('aria-haspopup')) {\n accessibleTrigger.setAttribute('aria-haspopup', 'true');\n accessibleTrigger.setAttribute(\n 'aria-expanded',\n this.open ? 'true' : 'false'\n );\n this.accessibleTrigger = accessibleTrigger;\n }\n }\n\n // Handlers\n\n private handleDocumentKeyDown(event: KeyboardEvent) {\n // Close when escape is pressed\n if (event.key === 'Escape') {\n this.hide();\n return;\n }\n\n // Close when tabbing results in the focus leaving the close element\n if (event.key === 'Tab') {\n setTimeout(() => {\n if (\n document.activeElement &&\n document.activeElement.closest(\n this.containingElement.tagName.toLowerCase()\n ) !== this.containingElement\n ) {\n this.hide();\n return;\n }\n });\n }\n\n // If a menu is present, focus on it when certain keys are pressed\n if (this.menu && ['ArrowDown', 'ArrowUp'].includes(event.key)) {\n // must have menu item, must have pressed down, must be open and must not have focus within dd\n if (!this.open \|\| this.focusEleInDropDwn(event)) return;\n event.preventDefault();\n this.menu.setFocus();\n return;\n }\n\n // All other keys focus the menu and pass the event through to menu (necessary for type-to-search to work)\n const ePath = event.composedPath();\n if (this.menu && ePath.length && !ePath.find((el) => el !== this.menu)) {\n this.menu.dispatchEvent(new KeyboardEvent(event.type, event));\n return;\n }\n }\n\n private handleDocumentMouseDown(event: MouseEvent) {\n // Close when clicking outside of the close element\n if (!this.focusEleInDropDwn(event)) {\n this.hide();\n return;\n }\n }\n\n private handleTriggerKeyDown = (event: KeyboardEvent) => {\n // Open the panel when pressing down or up while focused on the trigger\n if (['ArrowDown', 'ArrowUp', ' '].includes(event.key)) {\n this.show();\n event.preventDefault();\n event.stopPropagation();\n\n if (this.menu) this.menu.setFocus();\n }\n };\n\n private handleTriggerSlotChange = () => {\n this.updateAccessibleTrigger();\n };\n\n private createPopover() {\n if ((!this.tetherTo && !this.trigger) \|\| !this.positioner) return;\n\n if (this.popover) {\n if (this.open) this.hide();\n this.popover.destroy();\n this.popover = null;\n }\n\n this.popover = new Popover(this.tetherTo \|\| this.trigger, this.positioner, {\n strategy: this.hoist ? 'fixed' : 'absolute',\n placement: this.placement,\n distance: this.distance,\n skidding: this.skidding,\n transitionElement: this.panel,\n onAfterHide: () => this.nanoAfterHide.emit(),\n onAfterShow: () => this.nanoAfterShow.emit(),\n onTransitionEnd: () => {\n if (!this.open) {\n this.panel.scrollTop = 0;\n } else if (this.menu) {\n this.menu.showActiveElement();\n }\n },\n });\n // Show on init if open\n if (this.open) {\n this.show();\n }\n }\n\n // Stencil hooks\n\n connectedCallback() {\n this.handleDocumentKeyDown = this.handleDocumentKeyDown.bind(this);\n this.handleDocumentMouseDown = this.handleDocumentMouseDown.bind(this);\n\n if (!this.containingElement) this.containingElement = this.host;\n }\n\n componentDidLoad() {\n this.didLoad = true;\n this.createPopover();\n setTimeout(() => this.updateAccessibleTrigger(), 100);\n }\n\n disconnectedCallback() {\n if (this.host.isConnected) this.hide();\n if (this.popover) this.popover.destroy();\n }\n\n render() {\n return (\n <Host class=\"nano-dropdown\">\n <div\n part=\"base\"\n id={this.dropdownId}\n class={{\n dropdown: true,\n 'dropdown--open': this.open,\n }}\n >\n <span\n part=\"trigger\"\n class=\"dropdown__trigger\"\n ref={(el) => (this.trigger = el)}\n onKeyDown={this.handleTriggerKeyDown}\n onClick={this.togglePanel}\n >\n <slot name=\"trigger\" onSlotchange={this.handleTriggerSlotChange} />\n </span>\n\n <div\n ref={(el) => (this.positioner = el)}\n class=\"dropdown__positioner\"\n popover=\"manual\"\n id={this.dropdownId + '-positioner'}\n >\n <div\n ref={(el) => (this.panel = el)}\n part=\"panel\"\n class={`dropdown__panel ${this.placement.split('-').join(' ')}`}\n aria-hidden={!this.open}\n role={\n this.host.getAttribute('role') === 'group' ? 'group' : 'dialog'\n }\n aria-modal={\n this.host.getAttribute('role') === 'group' ? undefined : 'true'\n }\n aria-labelledby={this.dialogTitle ? this.labelId : undefined}\n >\n {this.dialogTitle && (\n <span\n id={this.labelId}\n class=\"dropdown__accessible-title\"\n aria-live={\n this.host.getAttribute('role') === 'group'\n ? undefined\n : 'polite'\n }\n >\n {this.dialogTitle}\n </span>\n )}\n <slot />\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/cjs/nano-field-validator.cjs.entry.js CHANGED Viewed

@@ -5,8 +5,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-b6fa04fa.js');
-const index$1 = require('./index-7795a8f6.js');
+const index = require('./index-615cdb64.js');
+const index$1 = require('./index-a92a0379.js');
+const renderer = require('./renderer-cd8b6098.js');
 const FieldValidator = class {
     constructor(hostRef) {
@@ -57,8 +58,8 @@ const FieldValidator = class {
     /** Sync up validateOn with all fields */
     validateOnChange() {
         this.nanoFields.forEach((field) => {
-            if (field.tagName === 'NANO-CHECKBOX') {
-                const cbg = field.closest('nano-checkbox-group');
+            if (field.tagName.toLowerCase() === renderer.transformTag('nano-checkbox')) {
+                const cbg = field.closest(renderer.transformTag('nano-checkbox-group'));
                 if (cbg)
                     cbg.validateOn = this.validateOn;
             }
@@ -295,7 +296,7 @@ const FieldValidator = class {
             if (!fieldName.length ||
                 typeof this._store.state[fieldName] === 'undefined')
                 return;
-            if (field.tagName === 'NANO-CHECKBOX' ||
+            if (field.tagName.toLowerCase() === renderer.transformTag('nano-checkbox') ||
                 ['radio', 'checkbox'].includes(field.type)) {
                 const cbs = this.allFields.filter((f) => this.getName(field) === this.getName(f));
                 if (cbs[0].type === 'radio' ||
@@ -329,7 +330,7 @@ const FieldValidator = class {
                 }
                 return;
             }
-            if (field.tagName === 'NANO-FILE-UPLOAD') {
+            if (field.tagName.toLowerCase() === renderer.transformTag('nano-file-upload')) {
                 const ff = field;
                 // this can only work if the field is empty rn... a one-time deal
                 if (!ff.files?.length)
@@ -342,9 +343,9 @@ const FieldValidator = class {
     }
     getValidityTarget(field) {
         let validityTarget = field;
-        if (field.tagName === 'NANO-CHECKBOX') {
+        if (field.tagName.toLowerCase() === renderer.transformTag('nano-checkbox')) {
             // if we have a checkbox-group, set the validation message there
-            const cbg = field.closest('nano-checkbox-group');
+            const cbg = field.closest(renderer.transformTag('nano-checkbox-group'));
             validityTarget = cbg || field;
         }
         return validityTarget;
@@ -362,7 +363,7 @@ const FieldValidator = class {
                 // so let's not overwrite it
                 return;
             }
-            if (field.tagName === 'NANO-CHECKBOX' ||
+            if (field.tagName.toLowerCase() === renderer.transformTag('nano-checkbox') ||
                 ['radio', 'checkbox'].includes(field.type)) {
                 const cb = field;
                 if (cb.type === 'radio' ||
@@ -373,7 +374,7 @@ const FieldValidator = class {
                         this._store.state[fieldName] = cb.value;
                 }
                 else if (this.allFields.filter((f) => this.getName(f) === fieldName &&
-                    (f.tagName === 'NANO-CHECKBOX' ||
+                    (f.tagName.toLowerCase() === renderer.transformTag('nano-checkbox') ||
                         f.type === 'checkbox')).length > 1) {
                     // multiple checkbox type control
                     const currentArr = Array.isArray(this._store.state[fieldName])
@@ -399,7 +400,7 @@ const FieldValidator = class {
                 }
                 return;
             }
-            if (field.tagName === 'NANO-FILE-UPLOAD') {
+            if (field.tagName.toLowerCase() === renderer.transformTag('nano-file-upload')) {
                 const ff = field;
                 if (!this.fileStateEqual(fieldName, ff))
                     this._store.state[fieldName] = ff.files;
@@ -495,15 +496,16 @@ const FieldValidator = class {
         // field update has come programmatically (not from ui),
         // so let's update the underlying ui field
         if (found &&
-            (found.tagName === 'NANO-CHECKBOX' ||
+            (found.tagName.toLowerCase() === renderer.transformTag('nano-checkbox') ||
                 ['radio', 'checkbox'].includes(found.type))) {
             // it's a cb - always change.
             this.storeToFields([found]);
         }
         else if (found &&
-            ((found.tagName === 'NANO-FILE-UPLOAD' &&
+            ((found.tagName.toLowerCase() === renderer.transformTag('nano-file-upload') &&
                 !this.fileStateEqual(key, found)) ||
-                (found.tagName !== 'NANO-FILE-UPLOAD' && found.value !== newVal))) {
+                (found.tagName.toLowerCase() !== renderer.transformTag('nano-file-upload') &&
+                    found.value !== newVal))) {
             // not a cb. Only change if value is different
             this.storeToFields([found]);
         }
@@ -606,7 +608,7 @@ const FieldValidator = class {
             this.activeForm.removeEventListener('invalid', this.handleFormInvalid, true);
     }
     render() {
-        return (index.h(index.Host, { key: 'ccaa19e009870cacff9581f70c88883c55656549' }, this.userForm && index.h("slot", { key: 'bee67c4db80dcc1575d201b98e0fddcb3717ba3c' }), !this.userForm && (index.h("form", { key: '0ec8b6448b2c15142fe0a3c6278c32761bccbc09', ref: (f) => (this.activeForm = f) }, index.h("slot", { key: '59076ca975855dbcc9d313be45329dac1323c177' })))));
+        return (renderer.h(index.Host, { key: '0ef73112ee49ff435479e13de36f9097b501eb37', class: "nano-field-validator" }, this.userForm && renderer.h("slot", { key: 'f95060fd93124376d66412b53c51f529680ed2c8' }), !this.userForm && (renderer.h("form", { key: '05494f5dfdba499b092d12f39a87ebbabd402ea4', ref: (f) => (this.activeForm = f) }, renderer.h("slot", { key: 'bbf842a53b0945e07798dbce9bb928ee34045a63' })))));
     }
     static get watchers() { return {
         "userForm": ["userFormChange"],

package/dist/cjs/nano-field-validator.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"nano-field-validator.entry.cjs.js","mappings":"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","names":["createStore","h","Host"],"sources":["src/components/field-validator/field-validator.tsx"],"sourcesContent":["import {\n Component,\n Prop,\n h,\n Host,\n Element,\n ComponentInterface,\n State,\n Watch,\n Event,\n EventEmitter,\n Method,\n Listen,\n} from '@stencil/core';\nimport { createStore, ObservableMap } from '@stencil/store';\nimport type {\n NanoFormEles,\n NanoFormEvent,\n PlainFormEles,\n PlainFormEvent,\n ValidationState,\n ValidatorValueStore,\n} from './field-validator-interface';\n\n/*\n A toolbox for `nano-...` form fields and form validation.\n * - Easy to add validation across field dependencies - e.g. \"When Field1 contains '123' Field2 must contain '456'\"\n * - Easy access to whole form and individual field validity states\n * - Easy access to form data payload\n * = Access to 2-way, data bound reactive store\n * - Scroll to invalid field on submit\n /\n@Component({\n tag: 'nano-field-validator',\n scoped: true,\n})\nexport class FieldValidator implements ComponentInterface {\n // Internal State\n\n @Element() host: HTMLNanoFieldValidatorElement;\n @State() submitted = false;\n @State() userForm: HTMLFormElement;\n @Watch('userForm')\n userFormChange() {\n if (this.userForm) this.activeForm = this.userForm;\n }\n\n private get activeForm() {\n return this._activeForm;\n }\n private set activeForm(form: HTMLFormElement) {\n // manages event listners on whatever form is used (slotted on created here)\n if (!form) return;\n\n if (this._activeForm) {\n this._activeForm.removeEventListener(\n 'invalid',\n this.handleFormInvalid,\n true\n );\n }\n form.addEventListener('invalid', this.handleFormInvalid, true);\n this._activeForm = form;\n }\n private _activeForm: HTMLFormElement;\n private mo: MutationObserver;\n private allFields: Array<NanoFormEles \| PlainFormEles> = [];\n private nanoFields: NanoFormEles[];\n private plainFields: PlainFormEles[];\n private nanoFieldSelector = `\n nano-input,\n nano-select,\n nano-file-upload,\n nano-date-input,\n nano-checkbox\n `;\n private hasSetStore = false;\n\n // annoyingly, whenever we attempt to `checkValidty()` it fires `invalid` events.\n // this is used to prevent infinite loops / multiple calls\n private internalValidate = false;\n\n // Public API\n\n /* When should the fields perform validation. Will override / sync all nested `nano-...` controls /\n @Prop({ mutable: true }) validateOn?: 'dirty' \| 'submit' \| 'submitThenDirty' =\n 'submitThenDirty';\n\n /* Sync up validateOn with all fields /\n @Watch('validateOn')\n validateOnChange() {\n this.nanoFields.forEach((field) => {\n if (field.tagName === 'NANO-CHECKBOX') {\n const cbg = field.closest('nano-checkbox-group');\n if (cbg) cbg.validateOn = this.validateOn;\n } else {\n (field as Exclude<NanoFormEles, HTMLNanoCheckboxElement>).validateOn =\n this.validateOn;\n }\n });\n }\n\n /* Tries to scroll to the first invalid field on submit /\n @Prop() scrollToInvalid = true;\n\n /* Returns true if any nested fields have been changed @readonly /\n @Prop({ reflect: true })\n get dirty() {\n return this._dirty;\n }\n @State() _dirty = false;\n\n /* Returns true if all the nested fields are currently valid @readonly /\n @Prop({ reflect: true })\n get valid() {\n return this._valid;\n }\n @State() _valid: boolean;\n\n /* The current form state as a stencil store. /\n @Prop() get store(): ObservableMap<ValidatorValueStore> {\n return this._store;\n }\n @State() _store: ObservableMap<ValidatorValueStore>;\n\n /* The current form payload as a reactive proxy. @readonly /\n @Prop()\n get payload() {\n return this._store?.state;\n }\n\n /* Returns true if validation errors will be displayed to the user. @readonly /\n @Prop()\n get showValidation() {\n return (this.validateOn === 'dirty' && this.dirty) \|\| this.submitted;\n }\n\n /* Get the current validation state of all form fields. @readonly\n * ```\n {\n fields: NanoFormEles[];\n valid: boolean;\n validityMessage: string;\n dirty: boolean;\n name: string \| number;\n value: any;\n }[]\n ```\n /\n @Prop()\n get validationState(): ValidationState[] {\n // TODO - migrate nano-fields away from using proprietary methods in a bid to be closer to the spec\n\n // this is big and ugly.\n // why? Cos' it must unify checking validity state for both\n // `nano-...` and plain form fields.\n const validationState: ValidationState[] = [];\n\n this.allFields.forEach(async (field) => {\n const found = validationState.find((v) => v.name === this.getName(field));\n let pf: PlainFormEles;\n let nf: NanoFormEles;\n\n if (found) {\n if ((field as PlainFormEles).validationMessage) {\n // non-nano fields\n pf = field as PlainFormEles;\n found.validityMessage = pf.validationMessage.length\n ? pf.validationMessage\n : found.validityMessage;\n this.internalValidate = true;\n if (found.valid && !pf.checkValidity()) found.valid = false;\n this.internalValidate = false;\n } else if ((field as NanoFormEles).validityMessage) {\n // nano-... fields\n nf = field as NanoFormEles;\n found.validityMessage = nf.validityMessage.length\n ? nf.validityMessage\n : nf.validityMessage;\n if (found.valid && nf.invalid) found.valid = false;\n }\n if (!found.fields.find((f) => f === field)) found.fields.push(field);\n }\n\n let valid: boolean;\n let validityMessage: string;\n\n if ((field as PlainFormEles).checkValidity) {\n pf = field as PlainFormEles;\n this.internalValidate = true;\n valid = pf.checkValidity();\n this.internalValidate = false;\n validityMessage = pf.validationMessage;\n } else {\n nf = field as NanoFormEles;\n valid = !nf.invalid;\n validityMessage = nf.validityMessage;\n }\n\n validationState.push({\n fields: [field],\n name: this.getName(field),\n value: this._store.state[this.getName(field)],\n dirty: false,\n valid,\n validityMessage,\n });\n });\n\n return validationState;\n }\n\n /* By default, `nano-field-validator` will also track all native form field elements.\n * You can add extra web-component form fields to listen to\n * (as long as they match the standard form field spec) by using the `fieldSelector` prop.\n /\n @Prop() extraFieldSelector: string = 'input, select, textarea';\n\n /* A validation callback method.\n * @param field - The field name currently being evaluated\n * @param value - The value of the field currently being evaluated\n * @param fields - an array of all currently observered form fields and values\n * @returns field names mapped to an object of status message and validity e.g.\n * ```js\n * {field1: {msg: `This is invalid!`}, field2: {msg: `This is valid!`, valid: true}}\n * ```\n /\n @Prop() validation: (\n field: string,\n value: string,\n fields: ValidatorValueStore\n ) => { [errorMsg: string]: { fields?: string[]; valid?: boolean } };\n\n /\n Sets the state of the form using an object of key / value pairs.\n * @param state - the state to load in the store\n /\n @Method()\n async setStore(state: ValidatorValueStore) {\n this.hasSetStore = true;\n Object.entries(state).forEach(([key, val]) => {\n this.store.state[key] = val;\n });\n }\n\n /\n Sets custom validity for all / some form fields.\n * @param validity - a validity object of `{fieldName: errorString}` pairs.\n * Set as an empty string to clear the error.\n * @param scrollToInvalid - whether to scroll to the first invalid field.\n * If not present, will follow the value set on `scrollToInvalid` prop.\n * @returns a promise, resolved when all errors are set\n /\n @Method()\n async setCustomValidity(\n validity: { [key: string]: string },\n scrollToInvalid?: boolean\n ) {\n return await Promise.all(\n Object.entries(validity).map(async ([key, err]) => {\n const field = this.allFields.find((f) => this.getName(f) === key);\n if (field) await this.setFieldError(field, err);\n })\n ).finally(() => {\n this.scrollToFirstInvalid(scrollToInvalid);\n });\n }\n\n /\n Clear all custom validation.\n * @returns a promise, resolved when all errors are cleared\n /\n @Method()\n async resetValidity() {\n return await Promise.all(\n this.allFields.map(async (field) => await this.setFieldError(field, ''))\n );\n }\n\n /\n Scrolls to first invalid form field.\n * @param force - forces the scroll behaviour (default). Otherwise will use the default set in `scrollToInvalid` prop\n /\n @Method()\n async scrollToFirstInvalid(force = true) {\n if (!force && !this.scrollToInvalid) return;\n\n setTimeout(() => {\n const invalidField = this.validationState.find((f) => !f.valid);\n if (!invalidField) return;\n invalidField.fields[0].scrollIntoView({\n behavior: 'smooth',\n block: 'nearest',\n });\n }, 200);\n }\n\n /* Fired whenever the payload changes /\n @Event() nanoPayloadChange: EventEmitter<ValidatorValueStore>;\n\n /\n Fired on valid form submission.\n * Note: if you wish to prevent a form from submitting, instead\n * of using / preventing the native `submit` event, use this event\n * ```js\n * ele.addEventListener('nanoSubmit', (e) => {\n * e.preventDefault()\n * })\n * ```\n /\n @Event() nanoSubmit: EventEmitter;\n\n /* Fire on invalid form submission attempt /\n @Event() nanoInvalid: EventEmitter;\n\n // private methods\n\n @Watch('extraFieldSelector')\n attachSlotObserver() {\n if (this.mo) return;\n const mo = (this.mo = new MutationObserver((_entries) => {\n const form = this.host.querySelector('form');\n if (form && form !== this.activeForm) this.activeForm = form;\n this.setupFields();\n }));\n mo.observe(this.host, {\n childList: true,\n attributes: true,\n attributeFilter: ['name'],\n subtree: true,\n });\n }\n\n /\n During spec tests, mockelement props aren't set - only attributes.\n * This irons out that kink\n * @param field\n * @returns the fields name prop or attr\n /\n private getName(field: PlainFormEles \| NanoFormEles) {\n return field.name \|\| field.getAttribute('name');\n }\n\n /* Checks for new `nano-...` fields and adds them to our watch array and value store /\n private setupFields() {\n let nanoFields = Array.from(\n this.host.querySelectorAll<NanoFormEles>(this.nanoFieldSelector)\n );\n\n let plainFields = Array.from(\n this.host.querySelectorAll<PlainFormEles>(this.extraFieldSelector)\n ).filter((e) => !e.closest(this.nanoFieldSelector));\n\n nanoFields = nanoFields.filter(\n (f) => !!this.getName(f) && !!this.getName(f).length\n );\n plainFields = plainFields.filter(\n (f) => !!this.getName(f) && !!this.getName(f).length\n );\n\n // do we have any currently un-watched fields?\n if (\n ![...nanoFields, ...plainFields].filter(\n (f) => !this.allFields.includes(f)\n ).length\n )\n return;\n\n // setup the initial store state / refresh on new fields\n this.nanoFields = nanoFields;\n this.plainFields = plainFields;\n this.allFields = [...nanoFields, ...plainFields];\n\n this.storeToFields(this.allFields);\n\n this.validateOnChange();\n this.fieldsToStore(this.allFields, true);\n this.nanoPayloadChange.emit(this._store.state);\n }\n\n private storeToFields(fields: Array<NanoFormEles \| PlainFormEles>) {\n fields.forEach((field) => {\n const fieldName = this.getName(field);\n if (\n !fieldName.length \|\|\n typeof this._store.state[fieldName] === 'undefined'\n )\n return;\n\n if (\n field.tagName === 'NANO-CHECKBOX' \|\|\n ['radio', 'checkbox'].includes((field as HTMLInputElement).type)\n ) {\n const cbs = this.allFields.filter(\n (f) => this.getName(field) === this.getName(f)\n ) as HTMLNanoCheckboxElement[];\n if (\n cbs[0].type === 'radio' \|\|\n cbs[0].type === 'segment' \|\|\n cbs[0].type === 'segment-pill'\n ) {\n // single radio type control\n cbs.forEach((cb) => {\n if (this._store.state[fieldName] === cb.value) cb.checked = true;\n else cb.checked = false;\n });\n } else if (Array.isArray(this._store.state[fieldName])) {\n // multiple checkbox like controls\n cbs.forEach((cb) => {\n if (this._store.state[fieldName]?.includes(cb.value))\n cb.checked = true;\n else cb.checked = false;\n });\n } else {\n // single checkbox like control\n cbs.forEach((cb) => {\n if (this._store.state[fieldName] === cb.value) cb.checked = true;\n else cb.checked = false;\n });\n }\n return;\n }\n\n if (field.tagName === 'NANO-FILE-UPLOAD') {\n const ff = field as HTMLNanoFileUploadElement;\n // this can only work if the field is empty rn... a one-time deal\n if (!ff.files?.length) ff.files = this._store.state[fieldName];\n return;\n }\n\n // default\n field.value = this._store.state[fieldName];\n });\n }\n\n private getValidityTarget(\n field: PlainFormEles \| NanoFormEles \| HTMLNanoCheckboxGroupElement\n ) {\n let validityTarget = field;\n\n if (field.tagName === 'NANO-CHECKBOX') {\n // if we have a checkbox-group, set the validation message there\n const cbg = field.closest('nano-checkbox-group');\n validityTarget = cbg \|\| field;\n }\n\n return validityTarget;\n }\n\n /* Loops through all `nano-...` fields and extracts their values into our store /\n private fieldsToStore(\n fields: Array<NanoFormEles \| PlainFormEles>,\n init = false\n ) {\n fields.forEach((field) => {\n const fieldName = this.getName(field);\n if (!fieldName.length) return;\n\n if (!!this._store.state[fieldName] && this.hasSetStore && init) {\n // a new field is being added\n // but we already have a value for it\n // via a store that has been actively set\n // so let's not overwrite it\n return;\n }\n\n if (\n field.tagName === 'NANO-CHECKBOX' \|\|\n ['radio', 'checkbox'].includes((field as HTMLInputElement).type)\n ) {\n const cb = field as HTMLNanoCheckboxElement;\n\n if (\n cb.type === 'radio' \|\|\n cb.type === 'segment' \|\|\n cb.type === 'segment-pill'\n ) {\n // radio type control - only one can be checked\n if (cb.checked) this._store.state[fieldName] = cb.value;\n } else if (\n this.allFields.filter(\n (f) =>\n this.getName(f) === fieldName &&\n (f.tagName === 'NANO-CHECKBOX' \|\|\n (f as HTMLInputElement).type === 'checkbox')\n ).length > 1\n ) {\n // multiple checkbox type control\n const currentArr = Array.isArray(this._store.state[fieldName])\n ? this._store.state[fieldName]\n : [];\n if (cb.checked) {\n // checked\n if (!this._store.state[fieldName]?.includes(cb.value)) {\n this._store.state[fieldName] = [...currentArr, cb.value];\n }\n } else {\n // unchecked\n this._store.state[fieldName] = currentArr.filter(\n (v) => v !== cb.value\n );\n }\n } else {\n // single checkbox - on or off\n if (cb.checked) this._store.state[fieldName] = cb.value;\n else this._store.state[fieldName] = '';\n }\n return;\n }\n\n if (field.tagName === 'NANO-FILE-UPLOAD') {\n const ff = field as HTMLNanoFileUploadElement;\n if (!this.fileStateEqual(fieldName, ff))\n this._store.state[fieldName] = ff.files;\n\n return;\n }\n\n // default\n this._store.state[fieldName] = field.value;\n });\n }\n\n /\n Tries to ascertain whether the current model\n * value is the same as the `nano-file-upload` value\n * @param fieldName - the key to access from the data store\n * @param field - the nano-file-upload field to assess against\n * @returns true for equal, false for not equal\n /\n private fileStateEqual(\n fieldName: string \| number,\n field: HTMLNanoFileUploadElement\n ) {\n return (\n JSON.stringify(this._store.state[fieldName]) ===\n JSON.stringify(field.files) \|\|\n this._store.state[fieldName] == field.files\n );\n }\n\n /\n Checks for user defined validations\n * @param key - current key of the data model to validate\n * @param newVal - the newly set, incoming value to validate\n /\n private async validate(key: string \| number, newVal: any) {\n if (!this.validation) return;\n\n const res = this.validation(key as string, newVal, this._store.state);\n\n // no nothing - return\n if (!res) return;\n\n // stencil public methods are async\n // so we must coerce our validation\n // collection loop into a promise\n await Promise.all(\n Object.entries(res).map(async ([msg, validityState]) => {\n return validityState.fields.map(async (fieldName) => {\n // switch on/off validation messages\n const field = this.allFields.find(\n (f) => this.getName(f) === fieldName\n );\n const validityTarget = this.getValidityTarget(field);\n\n if (\n ((validityTarget as NanoFormEles).validityMessage \|\|\n (validityTarget as PlainFormEles).validationMessage) === msg &&\n validityState.valid\n ) {\n // status is now valid - clear the error\n await this.setFieldError(validityTarget, '');\n } else if (!validityState.valid) {\n // status is invalid. Set the error\n await this.setFieldError(validityTarget, msg);\n }\n });\n })\n );\n }\n\n /* Loops through all store entries and checks custom validation /\n private async validateAllFields() {\n // This forces our loop to `await` and finish sequentially ... silly async stencil methods\n await Object.entries(this._store.state).reduce(\n async (memo, [key, value]) => {\n await memo;\n await this.validate(key, value);\n },\n undefined as any\n );\n }\n\n /\n Utility to smooth out setting error messages\n * (it's a different method on `nano-checkbox` 'cos they don't show errors themselves)\n * @param field\n * @param msg\n /\n private async setFieldError(\n field: NanoFormEles \| HTMLNanoCheckboxGroupElement \| PlainFormEles,\n msg: string\n ) {\n const validityTarget = this.getValidityTarget(field);\n\n if (validityTarget['showError']) {\n await (\n validityTarget as Exclude<NanoFormEles, HTMLNanoCheckboxElement>\n ).showError(msg);\n } else if (validityTarget['setError'])\n await (validityTarget as HTMLNanoCheckboxElement).setError(msg);\n else (validityTarget as PlainFormEles).setCustomValidity(msg);\n }\n\n private submitForm() {\n const nanoSubmit = this.nanoSubmit.emit();\n if (nanoSubmit.defaultPrevented) return;\n this.activeForm.submit();\n }\n\n // Event handlers\n\n /\n Fired whenever store values change and potentially checks validity\n * @param key - the key of the store that's just changed\n * @param newVal - the incoming, new value\n /\n private handleStoreChange = async (key: string \| number, newVal: any) => {\n const found = this.allFields.find((field) => this.getName(field) === key);\n\n // field update has come programmatically (not from ui),\n // so let's update the underlying ui field\n if (\n found &&\n (found.tagName === 'NANO-CHECKBOX' \|\|\n ['radio', 'checkbox'].includes((found as HTMLInputElement).type))\n ) {\n // it's a cb - always change.\n this.storeToFields([found]);\n } else if (\n found &&\n ((found.tagName === 'NANO-FILE-UPLOAD' &&\n !this.fileStateEqual(key, found as HTMLNanoFileUploadElement)) \|\|\n (found.tagName !== 'NANO-FILE-UPLOAD' && found.value !== newVal))\n ) {\n // not a cb. Only change if value is different\n this.storeToFields([found]);\n }\n\n if (this.validateOn === 'dirty' && this.dirty) {\n this.internalValidate = true;\n await this.validateAllFields();\n this._valid = this.activeForm.checkValidity();\n this.internalValidate = false;\n }\n this.nanoPayloadChange.emit(this._store.state);\n };\n\n /\n Handles nano field value changes and passes to store\n * @param ev - the incoming change event\n /\n @Listen('nanoChange')\n handleFieldChange(ev: NanoFormEvent) {\n if (!this.nanoFields?.includes(ev.target)) return;\n this._dirty = true;\n this.fieldsToStore([ev.target]);\n }\n\n /\n Handles non-nano field value changes and passes to store\n * @param ev - the incoming change event\n /\n @Listen('input')\n @Listen('change')\n handlePlainFieldChange(ev: PlainFormEvent) {\n if (!this.plainFields.includes(ev.target)) return;\n this.fieldsToStore([ev.target]);\n }\n\n /\n Handles default field validation events\n * @param ev - the invalid event\n /\n private handleFormInvalid = async (ev: Event & { target: PlainFormEles }) => {\n // if it's a non-nano field, we'll let default html5 validation do it's thing\n if (!this.plainFields.includes(ev.target)) {\n ev.preventDefault();\n }\n\n this._valid = false;\n\n // whenever `checkValidity` is called, this handler is in-turn called.\n // this flag is used to stop infinite loops\n if (this.internalValidate) return;\n\n // a submit must have happened to if 'submitThenDirty' turn on 'dirty' checking now\n if (this.validateOn === 'submitThenDirty') this.validateOn = 'dirty';\n this.submitted = true;\n\n await this.validateAllFields();\n this.internalValidate = true;\n this._valid = this.activeForm.checkValidity();\n this.internalValidate = false;\n\n // kinda insane...but if we're only validating on submit, then if the form is currently\n // in an invalid state, when submitting, it will fire an invalid event and not\n // submit the form. So let's test to make sure it is really invalid, and submit if not\n if (this.validateOn === 'submit') {\n if (this._valid) {\n this.submitForm();\n return;\n }\n }\n\n this.scrollToFirstInvalid(false);\n this.nanoInvalid.emit();\n };\n\n /\n stops default form submission, checks if valid, then submits manually\n * @param e - a submit event from the nested form element\n */\n @Listen('submit')\n async handleSubmit(e: Event) {\n e.preventDefault();\n if (this.validateOn === 'submitThenDirty') this.validateOn = 'dirty';\n this.submitted = true;\n await this.validateAllFields();\n\n this.internalValidate = true;\n this._valid = this.activeForm.checkValidity();\n this.internalValidate = false;\n\n if (!this._valid) {\n this.scrollToFirstInvalid(false);\n return;\n }\n this.submitForm();\n }\n\n connectedCallback(): void {\n this.userForm = this.host.querySelector('form');\n this._store = createStore<ValidatorValueStore>({});\n }\n\n componentDidLoad() {\n requestAnimationFrame(() => {\n this.setupFields();\n this.attachSlotObserver();\n this._store.on('set', this.handleStoreChange);\n });\n }\n\n disconnectedCallback() {\n if (this.mo) this.mo.disconnect();\n this._store.reset();\n\n if (this.activeForm)\n this.activeForm.removeEventListener(\n 'invalid',\n this.handleFormInvalid,\n true\n );\n }\n\n render() {\n return (\n <Host>\n {this.userForm && <slot />}\n {!this.userForm && (\n <form ref={(f) => (this.activeForm = f)}>\n <slot />\n </form>\n )}\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"nano-field-validator.entry.cjs.js","mappings":"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","names":["transformTag","createStore","h","Host"],"sources":["src/components/field-validator/field-validator.tsx"],"sourcesContent":["import {\n Component,\n Prop,\n Host,\n Element,\n ComponentInterface,\n State,\n Watch,\n Event,\n EventEmitter,\n Method,\n Listen,\n} from '@stencil/core';\nimport { createStore, ObservableMap } from '@stencil/store';\nimport { h, transformTag } from '../../utils/renderer';\nimport type {\n NanoFormEles,\n NanoFormEvent,\n PlainFormEles,\n PlainFormEvent,\n ValidationState,\n ValidatorValueStore,\n} from './field-validator-interface';\n\n/*\n A toolbox for `nano-...` form fields and form validation.\n * - Easy to add validation across field dependencies - e.g. \"When Field1 contains '123' Field2 must contain '456'\"\n * - Easy access to whole form and individual field validity states\n * - Easy access to form data payload\n * = Access to 2-way, data bound reactive store\n * - Scroll to invalid field on submit\n /\n@Component({\n tag: 'nano-field-validator',\n scoped: true,\n})\nexport class FieldValidator implements ComponentInterface {\n // Internal State\n\n @Element() host: HTMLNanoFieldValidatorElement;\n @State() submitted = false;\n @State() userForm: HTMLFormElement;\n @Watch('userForm')\n userFormChange() {\n if (this.userForm) this.activeForm = this.userForm;\n }\n\n private get activeForm() {\n return this._activeForm;\n }\n private set activeForm(form: HTMLFormElement) {\n // manages event listners on whatever form is used (slotted on created here)\n if (!form) return;\n\n if (this._activeForm) {\n this._activeForm.removeEventListener(\n 'invalid',\n this.handleFormInvalid,\n true\n );\n }\n form.addEventListener('invalid', this.handleFormInvalid, true);\n this._activeForm = form;\n }\n private _activeForm: HTMLFormElement;\n private mo: MutationObserver;\n private allFields: Array<NanoFormEles \| PlainFormEles> = [];\n private nanoFields: NanoFormEles[];\n private plainFields: PlainFormEles[];\n private nanoFieldSelector = `\n nano-input,\n nano-select,\n nano-file-upload,\n nano-date-input,\n nano-checkbox\n `;\n private hasSetStore = false;\n\n // annoyingly, whenever we attempt to `checkValidty()` it fires `invalid` events.\n // this is used to prevent infinite loops / multiple calls\n private internalValidate = false;\n\n // Public API\n\n /* When should the fields perform validation. Will override / sync all nested `nano-...` controls /\n @Prop({ mutable: true }) validateOn?: 'dirty' \| 'submit' \| 'submitThenDirty' =\n 'submitThenDirty';\n\n /* Sync up validateOn with all fields /\n @Watch('validateOn')\n validateOnChange() {\n this.nanoFields.forEach((field) => {\n if (field.tagName.toLowerCase() === transformTag('nano-checkbox')) {\n const cbg = field.closest<HTMLNanoCheckboxGroupElement>(\n transformTag('nano-checkbox-group')\n );\n if (cbg) cbg.validateOn = this.validateOn;\n } else {\n (field as Exclude<NanoFormEles, HTMLNanoCheckboxElement>).validateOn =\n this.validateOn;\n }\n });\n }\n\n /* Tries to scroll to the first invalid field on submit /\n @Prop() scrollToInvalid = true;\n\n /* Returns true if any nested fields have been changed @readonly /\n @Prop({ reflect: true })\n get dirty() {\n return this._dirty;\n }\n @State() _dirty = false;\n\n /* Returns true if all the nested fields are currently valid @readonly /\n @Prop({ reflect: true })\n get valid() {\n return this._valid;\n }\n @State() _valid: boolean;\n\n /* The current form state as a stencil store. /\n @Prop() get store(): ObservableMap<ValidatorValueStore> {\n return this._store;\n }\n @State() _store: ObservableMap<ValidatorValueStore>;\n\n /* The current form payload as a reactive proxy. @readonly /\n @Prop()\n get payload() {\n return this._store?.state;\n }\n\n /* Returns true if validation errors will be displayed to the user. @readonly /\n @Prop()\n get showValidation() {\n return (this.validateOn === 'dirty' && this.dirty) \|\| this.submitted;\n }\n\n /* Get the current validation state of all form fields. @readonly\n * ```\n {\n fields: NanoFormEles[];\n valid: boolean;\n validityMessage: string;\n dirty: boolean;\n name: string \| number;\n value: any;\n }[]\n ```\n /\n @Prop()\n get validationState(): ValidationState[] {\n // TODO - migrate nano-fields away from using proprietary methods in a bid to be closer to the spec\n\n // this is big and ugly.\n // why? Cos' it must unify checking validity state for both\n // `nano-...` and plain form fields.\n const validationState: ValidationState[] = [];\n\n this.allFields.forEach(async (field) => {\n const found = validationState.find((v) => v.name === this.getName(field));\n let pf: PlainFormEles;\n let nf: NanoFormEles;\n\n if (found) {\n if ((field as PlainFormEles).validationMessage) {\n // non-nano fields\n pf = field as PlainFormEles;\n found.validityMessage = pf.validationMessage.length\n ? pf.validationMessage\n : found.validityMessage;\n this.internalValidate = true;\n if (found.valid && !pf.checkValidity()) found.valid = false;\n this.internalValidate = false;\n } else if ((field as NanoFormEles).validityMessage) {\n // nano-... fields\n nf = field as NanoFormEles;\n found.validityMessage = nf.validityMessage.length\n ? nf.validityMessage\n : nf.validityMessage;\n if (found.valid && nf.invalid) found.valid = false;\n }\n if (!found.fields.find((f) => f === field)) found.fields.push(field);\n }\n\n let valid: boolean;\n let validityMessage: string;\n\n if ((field as PlainFormEles).checkValidity) {\n pf = field as PlainFormEles;\n this.internalValidate = true;\n valid = pf.checkValidity();\n this.internalValidate = false;\n validityMessage = pf.validationMessage;\n } else {\n nf = field as NanoFormEles;\n valid = !nf.invalid;\n validityMessage = nf.validityMessage;\n }\n\n validationState.push({\n fields: [field],\n name: this.getName(field),\n value: this._store.state[this.getName(field)],\n dirty: false,\n valid,\n validityMessage,\n });\n });\n\n return validationState;\n }\n\n /* By default, `nano-field-validator` will also track all native form field elements.\n * You can add extra web-component form fields to listen to\n * (as long as they match the standard form field spec) by using the `fieldSelector` prop.\n /\n @Prop() extraFieldSelector: string = 'input, select, textarea';\n\n /* A validation callback method.\n * @param field - The field name currently being evaluated\n * @param value - The value of the field currently being evaluated\n * @param fields - an array of all currently observered form fields and values\n * @returns field names mapped to an object of status message and validity e.g.\n * ```js\n * {field1: {msg: `This is invalid!`}, field2: {msg: `This is valid!`, valid: true}}\n * ```\n /\n @Prop() validation: (\n field: string,\n value: string,\n fields: ValidatorValueStore\n ) => { [errorMsg: string]: { fields?: string[]; valid?: boolean } };\n\n /\n Sets the state of the form using an object of key / value pairs.\n * @param state - the state to load in the store\n /\n @Method()\n async setStore(state: ValidatorValueStore) {\n this.hasSetStore = true;\n Object.entries(state).forEach(([key, val]) => {\n this.store.state[key] = val;\n });\n }\n\n /\n Sets custom validity for all / some form fields.\n * @param validity - a validity object of `{fieldName: errorString}` pairs.\n * Set as an empty string to clear the error.\n * @param scrollToInvalid - whether to scroll to the first invalid field.\n * If not present, will follow the value set on `scrollToInvalid` prop.\n * @returns a promise, resolved when all errors are set\n /\n @Method()\n async setCustomValidity(\n validity: { [key: string]: string },\n scrollToInvalid?: boolean\n ) {\n return await Promise.all(\n Object.entries(validity).map(async ([key, err]) => {\n const field = this.allFields.find((f) => this.getName(f) === key);\n if (field) await this.setFieldError(field, err);\n })\n ).finally(() => {\n this.scrollToFirstInvalid(scrollToInvalid);\n });\n }\n\n /\n Clear all custom validation.\n * @returns a promise, resolved when all errors are cleared\n /\n @Method()\n async resetValidity() {\n return await Promise.all(\n this.allFields.map(async (field) => await this.setFieldError(field, ''))\n );\n }\n\n /\n Scrolls to first invalid form field.\n * @param force - forces the scroll behaviour (default). Otherwise will use the default set in `scrollToInvalid` prop\n /\n @Method()\n async scrollToFirstInvalid(force = true) {\n if (!force && !this.scrollToInvalid) return;\n\n setTimeout(() => {\n const invalidField = this.validationState.find((f) => !f.valid);\n if (!invalidField) return;\n invalidField.fields[0].scrollIntoView({\n behavior: 'smooth',\n block: 'nearest',\n });\n }, 200);\n }\n\n /* Fired whenever the payload changes /\n @Event() nanoPayloadChange: EventEmitter<ValidatorValueStore>;\n\n /\n Fired on valid form submission.\n * Note: if you wish to prevent a form from submitting, instead\n * of using / preventing the native `submit` event, use this event\n * ```js\n * ele.addEventListener('nanoSubmit', (e) => {\n * e.preventDefault()\n * })\n * ```\n /\n @Event() nanoSubmit: EventEmitter;\n\n /* Fire on invalid form submission attempt /\n @Event() nanoInvalid: EventEmitter;\n\n // private methods\n\n @Watch('extraFieldSelector')\n attachSlotObserver() {\n if (this.mo) return;\n const mo = (this.mo = new MutationObserver((_entries) => {\n const form = this.host.querySelector('form');\n if (form && form !== this.activeForm) this.activeForm = form;\n this.setupFields();\n }));\n mo.observe(this.host, {\n childList: true,\n attributes: true,\n attributeFilter: ['name'],\n subtree: true,\n });\n }\n\n /\n During spec tests, mockelement props aren't set - only attributes.\n * This irons out that kink\n * @param field\n * @returns the fields name prop or attr\n /\n private getName(field: PlainFormEles \| NanoFormEles) {\n return field.name \|\| field.getAttribute('name');\n }\n\n /* Checks for new `nano-...` fields and adds them to our watch array and value store /\n private setupFields() {\n let nanoFields = Array.from(\n this.host.querySelectorAll<NanoFormEles>(this.nanoFieldSelector)\n );\n\n let plainFields = Array.from(\n this.host.querySelectorAll<PlainFormEles>(this.extraFieldSelector)\n ).filter((e) => !e.closest(this.nanoFieldSelector));\n\n nanoFields = nanoFields.filter(\n (f) => !!this.getName(f) && !!this.getName(f).length\n );\n plainFields = plainFields.filter(\n (f) => !!this.getName(f) && !!this.getName(f).length\n );\n\n // do we have any currently un-watched fields?\n if (\n ![...nanoFields, ...plainFields].filter(\n (f) => !this.allFields.includes(f)\n ).length\n )\n return;\n\n // setup the initial store state / refresh on new fields\n this.nanoFields = nanoFields;\n this.plainFields = plainFields;\n this.allFields = [...nanoFields, ...plainFields];\n\n this.storeToFields(this.allFields);\n\n this.validateOnChange();\n this.fieldsToStore(this.allFields, true);\n this.nanoPayloadChange.emit(this._store.state);\n }\n\n private storeToFields(fields: Array<NanoFormEles \| PlainFormEles>) {\n fields.forEach((field) => {\n const fieldName = this.getName(field);\n if (\n !fieldName.length \|\|\n typeof this._store.state[fieldName] === 'undefined'\n )\n return;\n\n if (\n field.tagName.toLowerCase() === transformTag('nano-checkbox') \|\|\n ['radio', 'checkbox'].includes((field as HTMLInputElement).type)\n ) {\n const cbs = this.allFields.filter(\n (f) => this.getName(field) === this.getName(f)\n ) as HTMLNanoCheckboxElement[];\n if (\n cbs[0].type === 'radio' \|\|\n cbs[0].type === 'segment' \|\|\n cbs[0].type === 'segment-pill'\n ) {\n // single radio type control\n cbs.forEach((cb) => {\n if (this._store.state[fieldName] === cb.value) cb.checked = true;\n else cb.checked = false;\n });\n } else if (Array.isArray(this._store.state[fieldName])) {\n // multiple checkbox like controls\n cbs.forEach((cb) => {\n if (this._store.state[fieldName]?.includes(cb.value))\n cb.checked = true;\n else cb.checked = false;\n });\n } else {\n // single checkbox like control\n cbs.forEach((cb) => {\n if (this._store.state[fieldName] === cb.value) cb.checked = true;\n else cb.checked = false;\n });\n }\n return;\n }\n\n if (field.tagName.toLowerCase() === transformTag('nano-file-upload')) {\n const ff = field as HTMLNanoFileUploadElement;\n // this can only work if the field is empty rn... a one-time deal\n if (!ff.files?.length) ff.files = this._store.state[fieldName];\n return;\n }\n\n // default\n field.value = this._store.state[fieldName];\n });\n }\n\n private getValidityTarget(\n field: PlainFormEles \| NanoFormEles \| HTMLNanoCheckboxGroupElement\n ) {\n let validityTarget = field;\n\n if (field.tagName.toLowerCase() === transformTag('nano-checkbox')) {\n // if we have a checkbox-group, set the validation message there\n const cbg = field.closest<HTMLNanoCheckboxGroupElement>(\n transformTag('nano-checkbox-group')\n );\n validityTarget = cbg \|\| field;\n }\n\n return validityTarget;\n }\n\n /* Loops through all `nano-...` fields and extracts their values into our store /\n private fieldsToStore(\n fields: Array<NanoFormEles \| PlainFormEles>,\n init = false\n ) {\n fields.forEach((field) => {\n const fieldName = this.getName(field);\n if (!fieldName.length) return;\n\n if (!!this._store.state[fieldName] && this.hasSetStore && init) {\n // a new field is being added\n // but we already have a value for it\n // via a store that has been actively set\n // so let's not overwrite it\n return;\n }\n\n if (\n field.tagName.toLowerCase() === transformTag('nano-checkbox') \|\|\n ['radio', 'checkbox'].includes((field as HTMLInputElement).type)\n ) {\n const cb = field as HTMLNanoCheckboxElement;\n\n if (\n cb.type === 'radio' \|\|\n cb.type === 'segment' \|\|\n cb.type === 'segment-pill'\n ) {\n // radio type control - only one can be checked\n if (cb.checked) this._store.state[fieldName] = cb.value;\n } else if (\n this.allFields.filter(\n (f) =>\n this.getName(f) === fieldName &&\n (f.tagName.toLowerCase() === transformTag('nano-checkbox') \|\|\n (f as HTMLInputElement).type === 'checkbox')\n ).length > 1\n ) {\n // multiple checkbox type control\n const currentArr = Array.isArray(this._store.state[fieldName])\n ? this._store.state[fieldName]\n : [];\n if (cb.checked) {\n // checked\n if (!this._store.state[fieldName]?.includes(cb.value)) {\n this._store.state[fieldName] = [...currentArr, cb.value];\n }\n } else {\n // unchecked\n this._store.state[fieldName] = currentArr.filter(\n (v) => v !== cb.value\n );\n }\n } else {\n // single checkbox - on or off\n if (cb.checked) this._store.state[fieldName] = cb.value;\n else this._store.state[fieldName] = '';\n }\n return;\n }\n\n if (field.tagName.toLowerCase() === transformTag('nano-file-upload')) {\n const ff = field as HTMLNanoFileUploadElement;\n if (!this.fileStateEqual(fieldName, ff))\n this._store.state[fieldName] = ff.files;\n\n return;\n }\n\n // default\n this._store.state[fieldName] = field.value;\n });\n }\n\n /\n Tries to ascertain whether the current model\n * value is the same as the `nano-file-upload` value\n * @param fieldName - the key to access from the data store\n * @param field - the nano-file-upload field to assess against\n * @returns true for equal, false for not equal\n /\n private fileStateEqual(\n fieldName: string \| number,\n field: HTMLNanoFileUploadElement\n ) {\n return (\n JSON.stringify(this._store.state[fieldName]) ===\n JSON.stringify(field.files) \|\|\n this._store.state[fieldName] == field.files\n );\n }\n\n /\n Checks for user defined validations\n * @param key - current key of the data model to validate\n * @param newVal - the newly set, incoming value to validate\n /\n private async validate(key: string \| number, newVal: any) {\n if (!this.validation) return;\n\n const res = this.validation(key as string, newVal, this._store.state);\n\n // no nothing - return\n if (!res) return;\n\n // stencil public methods are async\n // so we must coerce our validation\n // collection loop into a promise\n await Promise.all(\n Object.entries(res).map(async ([msg, validityState]) => {\n return validityState.fields.map(async (fieldName) => {\n // switch on/off validation messages\n const field = this.allFields.find(\n (f) => this.getName(f) === fieldName\n );\n const validityTarget = this.getValidityTarget(field);\n\n if (\n ((validityTarget as NanoFormEles).validityMessage \|\|\n (validityTarget as PlainFormEles).validationMessage) === msg &&\n validityState.valid\n ) {\n // status is now valid - clear the error\n await this.setFieldError(validityTarget, '');\n } else if (!validityState.valid) {\n // status is invalid. Set the error\n await this.setFieldError(validityTarget, msg);\n }\n });\n })\n );\n }\n\n /* Loops through all store entries and checks custom validation /\n private async validateAllFields() {\n // This forces our loop to `await` and finish sequentially ... silly async stencil methods\n await Object.entries(this._store.state).reduce(\n async (memo, [key, value]) => {\n await memo;\n await this.validate(key, value);\n },\n undefined as any\n );\n }\n\n /\n Utility to smooth out setting error messages\n * (it's a different method on `nano-checkbox` 'cos they don't show errors themselves)\n * @param field\n * @param msg\n /\n private async setFieldError(\n field: NanoFormEles \| HTMLNanoCheckboxGroupElement \| PlainFormEles,\n msg: string\n ) {\n const validityTarget = this.getValidityTarget(field);\n\n if (validityTarget['showError']) {\n await (\n validityTarget as Exclude<NanoFormEles, HTMLNanoCheckboxElement>\n ).showError(msg);\n } else if (validityTarget['setError'])\n await (validityTarget as HTMLNanoCheckboxElement).setError(msg);\n else (validityTarget as PlainFormEles).setCustomValidity(msg);\n }\n\n private submitForm() {\n const nanoSubmit = this.nanoSubmit.emit();\n if (nanoSubmit.defaultPrevented) return;\n this.activeForm.submit();\n }\n\n // Event handlers\n\n /\n Fired whenever store values change and potentially checks validity\n * @param key - the key of the store that's just changed\n * @param newVal - the incoming, new value\n /\n private handleStoreChange = async (key: string \| number, newVal: any) => {\n const found = this.allFields.find((field) => this.getName(field) === key);\n\n // field update has come programmatically (not from ui),\n // so let's update the underlying ui field\n if (\n found &&\n (found.tagName.toLowerCase() === transformTag('nano-checkbox') \|\|\n ['radio', 'checkbox'].includes((found as HTMLInputElement).type))\n ) {\n // it's a cb - always change.\n this.storeToFields([found]);\n } else if (\n found &&\n ((found.tagName.toLowerCase() === transformTag('nano-file-upload') &&\n !this.fileStateEqual(key, found as HTMLNanoFileUploadElement)) \|\|\n (found.tagName.toLowerCase() !== transformTag('nano-file-upload') &&\n found.value !== newVal))\n ) {\n // not a cb. Only change if value is different\n this.storeToFields([found]);\n }\n\n if (this.validateOn === 'dirty' && this.dirty) {\n this.internalValidate = true;\n await this.validateAllFields();\n this._valid = this.activeForm.checkValidity();\n this.internalValidate = false;\n }\n this.nanoPayloadChange.emit(this._store.state);\n };\n\n /\n Handles nano field value changes and passes to store\n * @param ev - the incoming change event\n /\n @Listen('nanoChange')\n handleFieldChange(ev: NanoFormEvent) {\n if (!this.nanoFields?.includes(ev.target)) return;\n this._dirty = true;\n this.fieldsToStore([ev.target]);\n }\n\n /\n Handles non-nano field value changes and passes to store\n * @param ev - the incoming change event\n /\n @Listen('input')\n @Listen('change')\n handlePlainFieldChange(ev: PlainFormEvent) {\n if (!this.plainFields.includes(ev.target)) return;\n this.fieldsToStore([ev.target]);\n }\n\n /\n Handles default field validation events\n * @param ev - the invalid event\n /\n private handleFormInvalid = async (ev: Event & { target: PlainFormEles }) => {\n // if it's a non-nano field, we'll let default html5 validation do it's thing\n if (!this.plainFields.includes(ev.target)) {\n ev.preventDefault();\n }\n\n this._valid = false;\n\n // whenever `checkValidity` is called, this handler is in-turn called.\n // this flag is used to stop infinite loops\n if (this.internalValidate) return;\n\n // a submit must have happened to if 'submitThenDirty' turn on 'dirty' checking now\n if (this.validateOn === 'submitThenDirty') this.validateOn = 'dirty';\n this.submitted = true;\n\n await this.validateAllFields();\n this.internalValidate = true;\n this._valid = this.activeForm.checkValidity();\n this.internalValidate = false;\n\n // kinda insane...but if we're only validating on submit, then if the form is currently\n // in an invalid state, when submitting, it will fire an invalid event and not\n // submit the form. So let's test to make sure it is really invalid, and submit if not\n if (this.validateOn === 'submit') {\n if (this._valid) {\n this.submitForm();\n return;\n }\n }\n\n this.scrollToFirstInvalid(false);\n this.nanoInvalid.emit();\n };\n\n /\n stops default form submission, checks if valid, then submits manually\n * @param e - a submit event from the nested form element\n */\n @Listen('submit')\n async handleSubmit(e: Event) {\n e.preventDefault();\n if (this.validateOn === 'submitThenDirty') this.validateOn = 'dirty';\n this.submitted = true;\n await this.validateAllFields();\n\n this.internalValidate = true;\n this._valid = this.activeForm.checkValidity();\n this.internalValidate = false;\n\n if (!this._valid) {\n this.scrollToFirstInvalid(false);\n return;\n }\n this.submitForm();\n }\n\n connectedCallback(): void {\n this.userForm = this.host.querySelector('form');\n this._store = createStore<ValidatorValueStore>({});\n }\n\n componentDidLoad() {\n requestAnimationFrame(() => {\n this.setupFields();\n this.attachSlotObserver();\n this._store.on('set', this.handleStoreChange);\n });\n }\n\n disconnectedCallback() {\n if (this.mo) this.mo.disconnect();\n this._store.reset();\n\n if (this.activeForm)\n this.activeForm.removeEventListener(\n 'invalid',\n this.handleFormInvalid,\n true\n );\n }\n\n render() {\n return (\n <Host class=\"nano-field-validator\">\n {this.userForm && <slot />}\n {!this.userForm && (\n <form ref={(f) => (this.activeForm = f)}>\n <slot />\n </form>\n )}\n </Host>\n );\n }\n}\n"],"version":3}