1 line
No EOL
15 KiB
Text
1 line
No EOL
15 KiB
Text
{"version":3,"file":"popup-BXRymj07.js","sources":["../../node_modules/@skeletonlabs/skeleton/dist/utilities/Popup/popup.js"],"sourcesContent":["import { get, writable } from 'svelte/store';\n// Use a store to pass the Floating UI import references\nexport const storePopup = writable(undefined);\nexport function popup(triggerNode, args) {\n // Floating UI Modules\n const { computePosition, autoUpdate, offset, shift, flip, arrow, size, autoPlacement, hide, inline } = get(storePopup);\n // Local State\n const popupState = {\n open: false,\n autoUpdateCleanup: () => { }\n };\n const focusableAllowedList = ':is(a[href], button, input, textarea, select, details, [tabindex]):not([tabindex=\"-1\"])';\n let focusablePopupElements;\n const documentationLink = 'https://www.skeleton.dev/utilities/popups';\n // Elements\n let elemPopup;\n let elemArrow;\n function setDomElements() {\n elemPopup = document.querySelector(`[data-popup=\"${args.target}\"]`) ?? document.createElement('div');\n elemArrow = elemPopup.querySelector(`.arrow`) ?? document.createElement('div');\n }\n setDomElements(); // init\n // Render Floating UI Popup\n function render() {\n // Error handling for required Floating UI modules\n if (!elemPopup)\n throw new Error(`The data-popup=\"${args.target}\" element was not found. ${documentationLink}`);\n if (!computePosition)\n throw new Error(`Floating UI 'computePosition' not found for data-popup=\"${args.target}\". ${documentationLink}`);\n if (!offset)\n throw new Error(`Floating UI 'offset' not found for data-popup=\"${args.target}\". ${documentationLink}`);\n if (!shift)\n throw new Error(`Floating UI 'shift' not found for data-popup=\"${args.target}\". ${documentationLink}`);\n if (!flip)\n throw new Error(`Floating UI 'flip' not found for data-popup=\"${args.target}\". ${documentationLink}`);\n if (!arrow)\n throw new Error(`Floating UI 'arrow' not found for data-popup=\"${args.target}\". ${documentationLink}`);\n // Bundle optional middleware\n const optionalMiddleware = [];\n // https://floating-ui.com/docs/size\n if (size)\n optionalMiddleware.push(size(args.middleware?.size));\n // https://floating-ui.com/docs/autoPlacement\n if (autoPlacement)\n optionalMiddleware.push(autoPlacement(args.middleware?.autoPlacement));\n // https://floating-ui.com/docs/hide\n if (hide)\n optionalMiddleware.push(hide(args.middleware?.hide));\n // https://floating-ui.com/docs/inline\n if (inline)\n optionalMiddleware.push(inline(args.middleware?.inline));\n // Floating UI Compute Position\n // https://floating-ui.com/docs/computePosition\n computePosition(triggerNode, elemPopup, {\n placement: args.placement ?? 'bottom',\n // Middleware - NOTE: the order matters:\n // https://floating-ui.com/docs/middleware#ordering\n middleware: [\n // https://floating-ui.com/docs/offset\n offset(args.middleware?.offset ?? 8),\n // https://floating-ui.com/docs/shift\n shift(args.middleware?.shift ?? { padding: 8 }),\n // https://floating-ui.com/docs/flip\n flip(args.middleware?.flip),\n // https://floating-ui.com/docs/arrow\n arrow(args.middleware?.arrow ?? { element: elemArrow || null }),\n // Implement optional middleware\n ...optionalMiddleware\n ]\n }).then(({ x, y, placement, middlewareData }) => {\n Object.assign(elemPopup.style, {\n left: `${x}px`,\n top: `${y}px`\n });\n // Handle Arrow Placement:\n // https://floating-ui.com/docs/arrow\n if (elemArrow) {\n const { x: arrowX, y: arrowY } = middlewareData.arrow;\n // @ts-expect-error implicit any\n const staticSide = {\n top: 'bottom',\n right: 'left',\n bottom: 'top',\n left: 'right'\n }[placement.split('-')[0]];\n Object.assign(elemArrow.style, {\n left: arrowX != null ? `${arrowX}px` : '',\n top: arrowY != null ? `${arrowY}px` : '',\n right: '',\n bottom: '',\n [staticSide]: '-4px'\n });\n }\n });\n }\n // State Handlers\n function open() {\n if (!elemPopup)\n return;\n // Set open state to on\n popupState.open = true;\n // Return the current state\n if (args.state)\n args.state({ state: popupState.open });\n // Update render settings\n render();\n // Update the DOM\n elemPopup.style.display = 'block';\n elemPopup.style.opacity = '1';\n elemPopup.style.pointerEvents = 'auto';\n // enable popup interactions\n elemPopup.removeAttribute('inert');\n // Trigger Floating UI autoUpdate (open only)\n // https://floating-ui.com/docs/autoUpdate\n popupState.autoUpdateCleanup = autoUpdate(triggerNode, elemPopup, render);\n // Focus the first focusable element within the popup\n focusablePopupElements = Array.from(elemPopup?.querySelectorAll(focusableAllowedList));\n }\n function close(callback) {\n if (!elemPopup)\n return;\n // Set transition duration\n const cssTransitionDuration = parseFloat(window.getComputedStyle(elemPopup).transitionDuration.replace('s', '')) * 1000;\n setTimeout(() => {\n // Set open state to off\n popupState.open = false;\n // Return the current state\n if (args.state)\n args.state({ state: popupState.open });\n // Update the DOM\n elemPopup.style.opacity = '0';\n // disable popup interactions\n elemPopup.setAttribute('inert', '');\n // Cleanup Floating UI autoUpdate (close only)\n if (popupState.autoUpdateCleanup)\n popupState.autoUpdateCleanup();\n // Trigger callback\n if (callback)\n callback();\n }, cssTransitionDuration);\n }\n // Event Handlers\n function toggle() {\n popupState.open === false ? open() : close();\n }\n function onWindowClick(event) {\n // Return if the popup is not yet open\n if (popupState.open === false)\n return;\n // Return if click is the trigger element\n if (triggerNode.contains(event.target))\n return;\n // If click it outside the popup\n if (elemPopup && elemPopup.contains(event.target) === false) {\n close();\n return;\n }\n // Handle Close Query State\n const closeQueryString = args.closeQuery === undefined ? 'a[href], button' : args.closeQuery;\n // Return if no closeQuery is provided\n if (closeQueryString === '')\n return;\n const closableMenuElements = elemPopup?.querySelectorAll(closeQueryString);\n closableMenuElements?.forEach((elem) => {\n if (elem.contains(event.target))\n close();\n });\n }\n // Keyboard Interactions for A11y\n const onWindowKeyDown = (event) => {\n if (popupState.open === false)\n return;\n // Handle keys\n const key = event.key;\n // On Esc key\n if (key === 'Escape') {\n event.preventDefault();\n triggerNode.focus();\n close();\n return;\n }\n // Update focusable elements (important for Autocomplete)\n focusablePopupElements = Array.from(elemPopup?.querySelectorAll(focusableAllowedList));\n // On Tab or ArrowDown key\n const triggerMenuFocused = popupState.open && document.activeElement === triggerNode;\n if (triggerMenuFocused &&\n (key === 'ArrowDown' || key === 'Tab') &&\n focusableAllowedList.length > 0 &&\n focusablePopupElements.length > 0) {\n event.preventDefault();\n focusablePopupElements[0].focus();\n }\n };\n // Event Listeners\n switch (args.event) {\n case 'click':\n triggerNode.addEventListener('click', toggle, true);\n window.addEventListener('click', onWindowClick, true);\n break;\n case 'hover':\n triggerNode.addEventListener('mouseover', open, true);\n triggerNode.addEventListener('mouseleave', () => close(), true);\n break;\n case 'focus-blur':\n triggerNode.addEventListener('focus', toggle, true);\n triggerNode.addEventListener('blur', () => close(), true);\n break;\n case 'focus-click':\n triggerNode.addEventListener('focus', open, true);\n window.addEventListener('click', onWindowClick, true);\n break;\n default:\n throw new Error(`Event value of '${args.event}' is not supported. ${documentationLink}`);\n }\n window.addEventListener('keydown', onWindowKeyDown, true);\n // Render popup on initialization\n render();\n // Lifecycle\n return {\n update(newArgs) {\n close(() => {\n args = newArgs;\n render();\n setDomElements();\n });\n },\n destroy() {\n // Trigger Events\n triggerNode.removeEventListener('click', toggle, true);\n triggerNode.removeEventListener('mouseover', open, true);\n triggerNode.removeEventListener('mouseleave', () => close(), true);\n triggerNode.removeEventListener('focus', toggle, true);\n triggerNode.removeEventListener('focus', open, true);\n triggerNode.removeEventListener('blur', () => close(), true);\n // Window Events\n window.removeEventListener('click', onWindowClick, true);\n window.removeEventListener('keydown', onWindowKeyDown, true);\n }\n };\n}\n"],"names":["storePopup","writable","popup","triggerNode","args","computePosition","autoUpdate","offset","shift","flip","arrow","size","autoPlacement","hide","inline","get","popupState","focusableAllowedList","focusablePopupElements","documentationLink","elemPopup","elemArrow","setDomElements","render","optionalMiddleware","_a","_b","_c","_d","_e","_f","_g","_h","x","y","placement","middlewareData","arrowX","arrowY","staticSide","open","close","callback","cssTransitionDuration","toggle","onWindowClick","event","closeQueryString","closableMenuElements","elem","onWindowKeyDown","key","newArgs"],"mappings":"gFAEY,MAACA,EAAaC,EAAS,MAAS,EACrC,SAASC,EAAMC,EAAaC,EAAM,CAErC,KAAM,CAAE,gBAAAC,EAAiB,WAAAC,EAAY,OAAAC,EAAQ,MAAAC,EAAO,KAAAC,EAAM,MAAAC,EAAO,KAAAC,EAAM,cAAAC,EAAe,KAAAC,EAAM,OAAAC,CAAQ,EAAGC,EAAIf,CAAU,EAE/GgB,EAAa,CACf,KAAM,GACN,kBAAmB,IAAM,CAAG,CACpC,EACUC,EAAuB,0FAC7B,IAAIC,EACJ,MAAMC,EAAoB,4CAE1B,IAAIC,EACAC,EACJ,SAASC,GAAiB,CACtBF,EAAY,SAAS,cAAc,gBAAgBhB,EAAK,MAAM,IAAI,GAAK,SAAS,cAAc,KAAK,EACnGiB,EAAYD,EAAU,cAAc,QAAQ,GAAK,SAAS,cAAc,KAAK,CAChF,CACDE,IAEA,SAASC,GAAS,qBAEd,GAAI,CAACH,EACD,MAAM,IAAI,MAAM,mBAAmBhB,EAAK,MAAM,4BAA4Be,CAAiB,EAAE,EACjG,GAAI,CAACd,EACD,MAAM,IAAI,MAAM,2DAA2DD,EAAK,MAAM,MAAMe,CAAiB,EAAE,EACnH,GAAI,CAACZ,EACD,MAAM,IAAI,MAAM,kDAAkDH,EAAK,MAAM,MAAMe,CAAiB,EAAE,EAC1G,GAAI,CAACX,EACD,MAAM,IAAI,MAAM,iDAAiDJ,EAAK,MAAM,MAAMe,CAAiB,EAAE,EACzG,GAAI,CAACV,EACD,MAAM,IAAI,MAAM,gDAAgDL,EAAK,MAAM,MAAMe,CAAiB,EAAE,EACxG,GAAI,CAACT,EACD,MAAM,IAAI,MAAM,iDAAiDN,EAAK,MAAM,MAAMe,CAAiB,EAAE,EAEzG,MAAMK,EAAqB,CAAA,EAEvBb,GACAa,EAAmB,KAAKb,GAAKc,EAAArB,EAAK,aAAL,YAAAqB,EAAiB,IAAI,CAAC,EAEnDb,GACAY,EAAmB,KAAKZ,GAAcc,EAAAtB,EAAK,aAAL,YAAAsB,EAAiB,aAAa,CAAC,EAErEb,GACAW,EAAmB,KAAKX,GAAKc,EAAAvB,EAAK,aAAL,YAAAuB,EAAiB,IAAI,CAAC,EAEnDb,GACAU,EAAmB,KAAKV,GAAOc,EAAAxB,EAAK,aAAL,YAAAwB,EAAiB,MAAM,CAAC,EAG3DvB,EAAgBF,EAAaiB,EAAW,CACpC,UAAWhB,EAAK,WAAa,SAG7B,WAAY,CAERG,IAAOsB,EAAAzB,EAAK,aAAL,YAAAyB,EAAiB,SAAU,CAAC,EAEnCrB,IAAMsB,EAAA1B,EAAK,aAAL,YAAA0B,EAAiB,QAAS,CAAE,QAAS,EAAG,EAE9CrB,GAAKsB,EAAA3B,EAAK,aAAL,YAAA2B,EAAiB,IAAI,EAE1BrB,IAAMsB,EAAA5B,EAAK,aAAL,YAAA4B,EAAiB,QAAS,CAAE,QAASX,GAAa,KAAM,EAE9D,GAAGG,CACN,CACb,CAAS,EAAE,KAAK,CAAC,CAAE,EAAAS,EAAG,EAAAC,EAAG,UAAAC,EAAW,eAAAC,KAAqB,CAO7C,GANA,OAAO,OAAOhB,EAAU,MAAO,CAC3B,KAAM,GAAGa,CAAC,KACV,IAAK,GAAGC,CAAC,IACzB,CAAa,EAGGb,EAAW,CACX,KAAM,CAAE,EAAGgB,EAAQ,EAAGC,CAAQ,EAAGF,EAAe,MAE1CG,EAAa,CACf,IAAK,SACL,MAAO,OACP,OAAQ,MACR,KAAM,OACT,EAACJ,EAAU,MAAM,GAAG,EAAE,CAAC,CAAC,EACzB,OAAO,OAAOd,EAAU,MAAO,CAC3B,KAAMgB,GAAU,KAAO,GAAGA,CAAM,KAAO,GACvC,IAAKC,GAAU,KAAO,GAAGA,CAAM,KAAO,GACtC,MAAO,GACP,OAAQ,GACR,CAACC,CAAU,EAAG,MAClC,CAAiB,CACJ,CACb,CAAS,CACJ,CAED,SAASC,GAAO,CACPpB,IAGLJ,EAAW,KAAO,GAEdZ,EAAK,OACLA,EAAK,MAAM,CAAE,MAAOY,EAAW,IAAM,CAAA,EAEzCO,IAEAH,EAAU,MAAM,QAAU,QAC1BA,EAAU,MAAM,QAAU,IAC1BA,EAAU,MAAM,cAAgB,OAEhCA,EAAU,gBAAgB,OAAO,EAGjCJ,EAAW,kBAAoBV,EAAWH,EAAaiB,EAAWG,CAAM,EAExEL,EAAyB,MAAM,KAAKE,GAAA,YAAAA,EAAW,iBAAiBH,EAAqB,EACxF,CACD,SAASwB,EAAMC,EAAU,CACrB,GAAI,CAACtB,EACD,OAEJ,MAAMuB,EAAwB,WAAW,OAAO,iBAAiBvB,CAAS,EAAE,mBAAmB,QAAQ,IAAK,EAAE,CAAC,EAAI,IACnH,WAAW,IAAM,CAEbJ,EAAW,KAAO,GAEdZ,EAAK,OACLA,EAAK,MAAM,CAAE,MAAOY,EAAW,IAAM,CAAA,EAEzCI,EAAU,MAAM,QAAU,IAE1BA,EAAU,aAAa,QAAS,EAAE,EAE9BJ,EAAW,mBACXA,EAAW,kBAAiB,EAE5B0B,GACAA,GACP,EAAEC,CAAqB,CAC3B,CAED,SAASC,GAAS,CACd5B,EAAW,OAAS,GAAQwB,EAAM,EAAGC,EAAK,CAC7C,CACD,SAASI,EAAcC,EAAO,CAK1B,GAHI9B,EAAW,OAAS,IAGpBb,EAAY,SAAS2C,EAAM,MAAM,EACjC,OAEJ,GAAI1B,GAAaA,EAAU,SAAS0B,EAAM,MAAM,IAAM,GAAO,CACzDL,IACA,MACH,CAED,MAAMM,EAAmB3C,EAAK,aAAe,OAAY,kBAAoBA,EAAK,WAElF,GAAI2C,IAAqB,GACrB,OACJ,MAAMC,EAAuB5B,GAAA,YAAAA,EAAW,iBAAiB2B,GACzDC,GAAA,MAAAA,EAAsB,QAASC,GAAS,CAChCA,EAAK,SAASH,EAAM,MAAM,GAC1BL,GAChB,EACK,CAED,MAAMS,EAAmBJ,GAAU,CAC/B,GAAI9B,EAAW,OAAS,GACpB,OAEJ,MAAMmC,EAAML,EAAM,IAElB,GAAIK,IAAQ,SAAU,CAClBL,EAAM,eAAc,EACpB3C,EAAY,MAAK,EACjBsC,IACA,MACH,CAEDvB,EAAyB,MAAM,KAAKE,GAAA,YAAAA,EAAW,iBAAiBH,EAAqB,EAE1DD,EAAW,MAAQ,SAAS,gBAAkBb,IAEpEgD,IAAQ,aAAeA,IAAQ,QAChClC,EAAqB,OAAS,GAC9BC,EAAuB,OAAS,IAChC4B,EAAM,eAAc,EACpB5B,EAAuB,CAAC,EAAE,QAEtC,EAEI,OAAQd,EAAK,MAAK,CACd,IAAK,QACDD,EAAY,iBAAiB,QAASyC,EAAQ,EAAI,EAClD,OAAO,iBAAiB,QAASC,EAAe,EAAI,EACpD,MACJ,IAAK,QACD1C,EAAY,iBAAiB,YAAaqC,EAAM,EAAI,EACpDrC,EAAY,iBAAiB,aAAc,IAAMsC,EAAO,EAAE,EAAI,EAC9D,MACJ,IAAK,aACDtC,EAAY,iBAAiB,QAASyC,EAAQ,EAAI,EAClDzC,EAAY,iBAAiB,OAAQ,IAAMsC,EAAO,EAAE,EAAI,EACxD,MACJ,IAAK,cACDtC,EAAY,iBAAiB,QAASqC,EAAM,EAAI,EAChD,OAAO,iBAAiB,QAASK,EAAe,EAAI,EACpD,MACJ,QACI,MAAM,IAAI,MAAM,mBAAmBzC,EAAK,KAAK,uBAAuBe,CAAiB,EAAE,CAC9F,CACD,cAAO,iBAAiB,UAAW+B,EAAiB,EAAI,EAExD3B,IAEO,CACH,OAAO6B,EAAS,CACZX,EAAM,IAAM,CACRrC,EAAOgD,EACP7B,IACAD,GAChB,CAAa,CACJ,EACD,SAAU,CAENnB,EAAY,oBAAoB,QAASyC,EAAQ,EAAI,EACrDzC,EAAY,oBAAoB,YAAaqC,EAAM,EAAI,EACvDrC,EAAY,oBAAoB,aAAc,IAAMsC,EAAO,EAAE,EAAI,EACjEtC,EAAY,oBAAoB,QAASyC,EAAQ,EAAI,EACrDzC,EAAY,oBAAoB,QAASqC,EAAM,EAAI,EACnDrC,EAAY,oBAAoB,OAAQ,IAAMsC,EAAO,EAAE,EAAI,EAE3D,OAAO,oBAAoB,QAASI,EAAe,EAAI,EACvD,OAAO,oBAAoB,UAAWK,EAAiB,EAAI,CAC9D,CACT,CACA","x_google_ignoreList":[0]} |