wj-elements 0.7.6 → 0.7.7
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.
- package/dist/custom-elements.json +5500 -5500
- package/dist/packages/wje-img/img.element.d.ts +4 -4
- package/dist/web-types.json +465 -465
- package/dist/wje-breadcrumb.js +7 -3
- package/dist/wje-breadcrumb.js.map +1 -1
- package/dist/wje-chip.js +1 -1
- package/dist/wje-chip.js.map +1 -1
- package/dist/wje-dialog.js +1 -1
- package/dist/wje-dialog.js.map +1 -1
- package/dist/wje-file-upload-item.js +2 -2
- package/dist/wje-file-upload-item.js.map +1 -1
- package/dist/wje-file-upload.js +2 -2
- package/dist/wje-file-upload.js.map +1 -1
- package/dist/wje-img.js +4 -3
- package/dist/wje-img.js.map +1 -1
- package/dist/wje-pagination.js +4 -4
- package/dist/wje-pagination.js.map +1 -1
- package/dist/wje-toast.js +1 -1
- package/dist/wje-toast.js.map +1 -1
- package/dist/wje-toolbar-action.js +1 -1
- package/dist/wje-toolbar-action.js.map +1 -1
- package/package.json +2 -1
package/dist/wje-toast.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"wje-toast.js","sources":["../packages/wje-toast/toast.element.js","../packages/wje-toast/toast.js"],"sourcesContent":["import { default as WJElement, WjElementUtils, event } from '../wje-element/element.js';\nimport styles from './styles/styles.css?inline';\n\nconst DEFAULT_STACK_POSITION = 'top-end';\nconst DEFAULT_STACK_DEPTH = 3;\nconst VALID_STACK_POSITIONS = new Set([\n 'top-start',\n 'top-center',\n 'top-end',\n 'bottom-start',\n 'bottom-center',\n 'bottom-end',\n]);\nconst STACKED_SCALE_STEP = 0.04;\nconst STACKED_MIN_SCALE = 0.88;\nconst STACKED_MIN_OPACITY = 0.72;\nconst STACKED_VISIBLE_SLICE = 16;\nconst STACKED_EXPANDED_MARGIN = '0.5rem';\nconst STACKED_PADDING = '1rem';\nconst STACKED_ENTER_OFFSET = 24;\n\nconst toggleStackExpanded = (stack, expanded) => {\n if (expanded) {\n stack.dataset.expanded = 'true';\n return;\n }\n\n delete stack.dataset.expanded;\n};\n\nconst syncExpandedStackToasts = (stack, expanded) => {\n Array.from(stack.children)\n .filter((child) => child.tagName === 'WJE-TOAST')\n .forEach((toast) => {\n if (expanded) {\n toast.pause?.();\n return;\n }\n\n toast.resume?.();\n });\n};\n\nconst setStackExpandedState = (stack, expanded) => {\n let shouldExpand = stack.dataset.stacked === 'true' && expanded;\n let isExpanded = stack.dataset.expanded === 'true';\n\n if (shouldExpand === isExpanded) {\n return;\n }\n\n toggleStackExpanded(stack, shouldExpand);\n syncExpandedStackToasts(stack, shouldExpand);\n stack.updateToastLayout?.();\n};\n\nconst syncStackExpandedState = (stack) => {\n setStackExpandedState(stack, stack.matches(':hover') || stack.matches(':focus-within'));\n};\n\n/**\n * `Toast` is a custom web component that represents a toast notification.\n * @summary This element represents a toast notification.\n * @documentation https://elements.webjet.sk/components/toast\n * @status stable\n * @augments {WJElement}\n * @csspart native - The native part\n * @slot - The content of the toast.\n * @slot media - The media of the toast.\n * @attribute {string} headline - Specifies the headline text of the toast. Represents the main title or heading displayed in the toast.\n * @attribute {boolean} open - Indicates whether the toast is currently open (visible). A value of `true` shows the toast, while `false` hides it.\n * @attribute {number} duration - Determines the duration (in milliseconds) for which the toast is displayed. After this time, the toast will automatically close unless it is manually closed.\n * @attribute {boolean} closable - Specifies whether the toast can be manually closed by the user. If `true`, the toast will include a close button or mechanism.\n * @attribute {string} color - Defines the color variant of the toast. Supports values such as `primary`, `complete`, `success`, `warning`, `danger`, `info`, and `contrast`.\n * @attribute {boolean} countdown - Indicates whether a countdown is displayed in the toast. When `true`, a visual countdown timer is shown to indicate the remaining time before the toast closes.\n * @attribute {boolean} stacked - Enables a layered toast stack where the newest toast stays visually on top while older ones shrink behind it.\n * @attribute {string} stack-position - Defines where the toast stack is placed on the screen. Supports `top-start`, `top-center`, `top-end`, `bottom-start`, `bottom-center`, and `bottom-end`.\n * @attribute {number} stack-depth - Defines how many visual levels the collapsed stacked toast can show. Older toasts beyond this limit stay at the last reduced level. Default is `3`.\n * @attribute {string} icon - Adds a leading icon into the `media` slot by icon name.\n * @cssproperty [--wje-toast-stack-width=300px] - Defines the width of the toast stack container. Useful for centered stacked toasts and demo layouts.\n * // @fires wje-toast:after-show - Fired after the toast is shown.\n * // @fires wje-toast:after-hide - Fired after the toast is hidden.\n */\n\nexport default class Toast extends WJElement {\n /**\n * Creates an instance of Toast.\n */\n constructor() {\n super();\n\n this.toastStack = this.createToastStack();\n }\n\n /**\n * Set headline value of the toast.\n * @param value\n */\n set headline(value) {\n this.setAttribute('headline', value);\n }\n\n /**\n * Get headline value of the toast.\n * @returns {string}\n */\n get headline() {\n return this.getAttribute('headline');\n }\n\n /**\n * Set open value of the toast.\n * @param value\n */\n set open(value) {\n this.removeAttribute('open');\n\n if (WjElementUtils.stringToBoolean(value)) this.setAttribute('open', value);\n }\n\n /**\n * Get open value of the toast.\n * @returns {boolean}\n */\n get open() {\n return this.hasAttribute('open');\n }\n\n /**\n * Set duration value of the toast.\n * @param value\n */\n set duration(value) {\n this.setAttribute('duration', value);\n }\n\n /**\n * Get duration value of the toast.\n * @returns {number}\n */\n get duration() {\n return +this.getAttribute('duration');\n }\n\n /**\n * Set closable value of the toast.\n * @param value\n */\n set closable(value) {\n this.setAttribute('closable', value || '');\n }\n\n /**\n * Get closable value of the toast.\n * @returns {boolean}\n */\n get closable() {\n return this.hasAttribute('closable');\n }\n\n /**\n * Set color value of the toast.\n * @param value\n */\n set color(value) {\n this.setAttribute('color', value);\n }\n\n /**\n * Get color value of the toast.\n * @returns {string}\n */\n get color() {\n return this.getAttribute('color');\n }\n\n /**\n * Set countdown value of the toast.\n * @param value\n */\n set countdown(value) {\n if (value) this.setAttribute('countdown', value);\n }\n\n /**\n * Get countdown value of the toast.\n * @returns {boolean}\n */\n get countdown() {\n return this.hasAttribute('countdown');\n }\n\n /**\n * Set stacked value of the toast.\n * @param value\n */\n set stacked(value) {\n this.toggleAttribute('stacked', WjElementUtils.stringToBoolean(value));\n }\n\n /**\n * Get stacked value of the toast.\n * @returns {boolean}\n */\n get stacked() {\n return this.hasAttribute('stacked');\n }\n\n /**\n * Set stack depth of the toast.\n * @param value\n */\n set stackDepth(value) {\n if (value === null || value === undefined || value === '') {\n this.removeAttribute('stack-depth');\n return;\n }\n\n this.setAttribute('stack-depth', value);\n }\n\n /**\n * Get stack depth of the toast.\n * @returns {number}\n */\n get stackDepth() {\n let value = Number.parseInt(this.getAttribute('stack-depth'), 10);\n\n if (Number.isFinite(value) && value > 0) {\n return value;\n }\n\n return DEFAULT_STACK_DEPTH;\n }\n\n /**\n * Set stack position of the toast.\n * @param value\n */\n set stackPosition(value) {\n if (!value) {\n this.removeAttribute('stack-position');\n return;\n }\n\n this.setAttribute('stack-position', value);\n }\n\n /**\n * Get stack position of the toast.\n * @returns {string}\n */\n get stackPosition() {\n let value = this.getAttribute('stack-position');\n\n if (VALID_STACK_POSITIONS.has(value)) {\n return value;\n }\n\n if (this.getAttribute('position') === 'bottom') {\n return 'bottom-end';\n }\n\n return DEFAULT_STACK_POSITION;\n }\n\n /**\n * Set icon value of the toast.\n * @param value\n */\n set icon(value) {\n this.setAttribute('icon', value);\n }\n\n /**\n * Get icon value of the toast.\n * @returns {string}\n */\n get icon() {\n return this.getAttribute('icon');\n }\n\n /**\n * Creates a toast stack container.\n * @returns {HTMLDivElement}\n */\n createToastStack() {\n let stack = Object.assign(document.createElement('div'), { className: 'wje-toast-stack' });\n\n stack.addEventListener('mouseenter', () => setStackExpandedState(stack, true));\n stack.addEventListener('mouseleave', () => requestAnimationFrame(() => syncStackExpandedState(stack)));\n stack.addEventListener('focusin', () => setStackExpandedState(stack, true));\n stack.addEventListener('focusout', () => requestAnimationFrame(() => syncStackExpandedState(stack)));\n\n this.syncToastStack(stack);\n\n return stack;\n }\n\n /**\n * Returns the key of the toast stack.\n * @returns {string}\n */\n getToastStackKey() {\n return `${this.stackPosition}:${this.stacked ? `stacked:${this.stackDepth}` : 'default'}`;\n }\n\n /**\n * Applies the stack placement directly on the element so demo/app layout CSS cannot override it accidentally.\n * @param {HTMLDivElement} stack\n */\n applyToastStackPlacement(stack = this.toastStack) {\n const positions = {\n 'top-start': {\n top: '0',\n bottom: 'auto',\n left: '0',\n right: 'auto',\n transform: 'none',\n margin: '0.5rem',\n },\n 'top-center': {\n top: '0',\n bottom: 'auto',\n left: '50%',\n right: 'auto',\n transform: 'translateX(-50%)',\n margin: '0.5rem 0 0',\n },\n 'top-end': {\n top: '0',\n bottom: 'auto',\n left: 'auto',\n right: '0',\n transform: 'none',\n margin: '0.5rem',\n },\n 'bottom-start': {\n top: 'auto',\n bottom: '0',\n left: '0',\n right: 'auto',\n transform: 'none',\n margin: '0 0.5rem 0.5rem',\n },\n 'bottom-center': {\n top: 'auto',\n bottom: '0',\n left: '50%',\n right: 'auto',\n transform: 'translateX(-50%)',\n margin: '0 0 0.5rem',\n },\n 'bottom-end': {\n top: 'auto',\n bottom: '0',\n left: 'auto',\n right: '0',\n transform: 'none',\n margin: '0 0.5rem 0.5rem',\n },\n };\n\n stack.style.removeProperty('inset-inline');\n stack.style.removeProperty('inset-inline-start');\n stack.style.removeProperty('inset-inline-end');\n Object.assign(stack.style, positions[this.stackPosition] || positions[DEFAULT_STACK_POSITION]);\n }\n\n /**\n * Applies the current toast stack configuration to a stack element.\n * @param {HTMLDivElement} stack\n */\n syncToastStack(stack = this.toastStack) {\n stack.dataset.position = this.stackPosition;\n stack.dataset.stackKey = this.getToastStackKey();\n stack.updateToastLayout = () => this.updateToastStack(stack);\n stack.style.display = 'flex';\n stack.style.alignItems = 'stretch';\n stack.style.width = 'min(var(--wje-toast-stack-width, 300px), calc(100vw - 1rem))';\n stack.style.maxWidth = 'calc(100vw - 1rem)';\n stack.style.maxHeight = 'calc(100vh - 1rem)';\n stack.style.zIndex = '9999';\n this.applyToastStackPlacement(stack);\n\n if (this.stacked) {\n stack.dataset.stacked = 'true';\n stack.dataset.stackDepth = String(this.stackDepth);\n } else {\n delete stack.dataset.stacked;\n delete stack.dataset.stackDepth;\n delete stack.dataset.expanded;\n }\n }\n\n /**\n * Clears transient stack styling from a toast.\n * @param {Toast} toast\n */\n clearStackItemStyles(toast) {\n [\n '--wje-toast-stack-scale',\n '--wje-toast-stack-shift',\n '--wje-toast-stack-opacity',\n '--wje-toast-stack-z',\n '--wje-toast-stack-origin',\n '--wje-toast-stack-host-margin-top',\n '--wje-toast-stack-host-margin-bottom',\n 'order',\n 'position',\n 'top',\n 'left',\n 'right',\n 'width',\n 'margin',\n 'margin-top',\n 'margin-bottom',\n ].forEach((property) => toast.style.removeProperty(property));\n }\n\n /**\n * Measures the rendered height of a toast for stack overlap calculations.\n * @param {Toast} toast\n * @returns {number}\n */\n getToastVisualHeight(toast) {\n let hostHeight = toast.getBoundingClientRect().height;\n let nativeHeight = toast.shadowRoot?.querySelector('.native-toast')?.getBoundingClientRect().height || 0;\n\n return Math.max(hostHeight, nativeHeight, toast.offsetHeight || 0);\n }\n\n /**\n * Recomputes the visual order of toasts inside the stack.\n * @param {HTMLDivElement} stack\n */\n updateToastStack(stack = this.toastStack) {\n let toasts = Array.from(stack.children).filter((child) => child.tagName === 'WJE-TOAST');\n let isStacked = stack.dataset.stacked === 'true';\n let isExpanded = stack.dataset.expanded === 'true';\n let isBottomStack = stack.dataset.position?.startsWith('bottom');\n let transformOrigin = stack.dataset.position?.startsWith('bottom') ? 'center bottom' : 'center top';\n let stackHeight = 0;\n\n stack.dataset.count = String(toasts.length);\n stack.style.gap = 'var(--wje-spacing-x-small)';\n stack.style.flexDirection = 'column';\n stack.style.overflow = isStacked ? (isExpanded ? 'auto' : 'visible') : 'auto';\n\n if (isStacked) {\n stack.style.paddingTop = isExpanded ? (isBottomStack ? STACKED_PADDING : '0px') : STACKED_PADDING;\n stack.style.paddingBottom = isExpanded ? (isBottomStack ? '0px' : STACKED_PADDING) : STACKED_PADDING;\n } else {\n stack.style.removeProperty('padding-top');\n stack.style.removeProperty('padding-bottom');\n }\n\n if (!isStacked || isExpanded) {\n stack.style.removeProperty('height');\n }\n\n toasts.forEach((toast, index) => {\n this.clearStackItemStyles(toast);\n\n toast.style.setProperty('--wje-toast-stack-z', String(index + 1));\n\n if (!isStacked) {\n return;\n }\n\n if (isExpanded) {\n let visualOrder = isBottomStack ? index : toasts.length - index - 1;\n let isVisualFirst = visualOrder === 0;\n let isVisualLast = visualOrder === toasts.length - 1;\n\n toast.style.setProperty('--wje-toast-stack-scale', '1.000');\n toast.style.setProperty('--wje-toast-stack-shift', '0px');\n toast.style.setProperty('--wje-toast-stack-opacity', '1.000');\n toast.style.setProperty('--wje-toast-stack-origin', transformOrigin);\n toast.style.order = String(visualOrder);\n toast.style.width = '100%';\n toast.style.setProperty(\n '--wje-toast-stack-host-margin-top',\n isBottomStack && !isVisualFirst ? STACKED_EXPANDED_MARGIN : '0px'\n );\n toast.style.setProperty(\n '--wje-toast-stack-host-margin-bottom',\n !isBottomStack && !isVisualLast ? STACKED_EXPANDED_MARGIN : '0px'\n );\n return;\n }\n\n let toastHeight = this.getToastVisualHeight(toast);\n let maxDepth = Math.max(0, this.stackDepth - 1);\n let visibleLevels = Math.min(toasts.length, this.stackDepth);\n let depth = Math.min(toasts.length - index - 1, maxDepth);\n let visibleIndex = Math.max(0, index - Math.max(0, toasts.length - this.stackDepth));\n let targetTop = isBottomStack\n ? visibleIndex * STACKED_VISIBLE_SLICE\n : (visibleLevels - 1 - visibleIndex) * STACKED_VISIBLE_SLICE;\n let scale = Math.max(STACKED_MIN_SCALE, 1 - depth * STACKED_SCALE_STEP);\n let opacity = Math.max(STACKED_MIN_OPACITY, 1 - depth * 0.08);\n\n toast.style.setProperty('--wje-toast-stack-scale', scale.toFixed(3));\n toast.style.setProperty('--wje-toast-stack-shift', '0px');\n toast.style.setProperty('--wje-toast-stack-opacity', opacity.toFixed(3));\n toast.style.setProperty('--wje-toast-stack-origin', transformOrigin);\n toast.style.position = 'absolute';\n toast.style.top = `${targetTop}px`;\n toast.style.left = '0';\n toast.style.right = '0';\n toast.style.width = '100%';\n toast.style.setProperty('--wje-toast-stack-host-margin-top', '0px');\n toast.style.setProperty('--wje-toast-stack-host-margin-bottom', '0px');\n\n stackHeight = Math.max(stackHeight, targetTop + toastHeight);\n });\n\n if (isStacked && !isExpanded) {\n stack.style.height = `${stackHeight}px`;\n }\n }\n\n /**\n * The class name for the component.\n * @type {string}\n */\n className = 'Toast';\n\n /**\n * Returns the CSS stylesheet for the component.\n * @static\n * @returns {CSSStyleSheet} The CSS stylesheet\n */\n static get cssStyleSheet() {\n return styles;\n }\n\n /**\n * Setup attributes for the Button element.\n */\n setupAttributes() {\n this.isShadowRoot = 'open';\n this.setAriaState({\n role: 'status',\n });\n }\n\n /**\n * Draw method for the toast notification.\n * @returns {object} Document fragment\n */\n draw() {\n let fragment = document.createDocumentFragment();\n\n let native = document.createElement('div');\n native.setAttribute('part', 'native');\n native.classList.add('native-toast');\n\n let mediaSlot = document.createElement('slot');\n mediaSlot.setAttribute('name', 'media');\n mediaSlot.classList.add('media');\n mediaSlot.addEventListener('slotchange', () => {\n if (WjElementUtils.hasSlotContent(this.context, 'media')) {\n mediaSlot.parentElement.classList.add('has-media');\n } else {\n mediaSlot.parentElement.classList.remove('has-media');\n }\n });\n\n let content = document.createElement('div');\n content.classList.add('content');\n content.innerHTML = `<div class=\"headline\">${this.headline}</div><div class=\"message\"><slot></slot></div>`;\n\n let iconX = document.createElement('wje-icon');\n iconX.setAttribute('name', 'x');\n\n let closeBtn = document.createElement('wje-button');\n closeBtn.setAttribute('fill', 'link');\n closeBtn.setAttribute('color', this.color);\n closeBtn.setAttribute('size', 'small');\n closeBtn.classList.add('close');\n closeBtn.setAttribute('aria-label', 'Close');\n\n let countdownEl = document.createElement('div');\n countdownEl.classList.add('countdown');\n\n let countdownBar = document.createElement('div');\n countdownBar.classList.add('countdown-bar');\n\n closeBtn.appendChild(iconX);\n countdownEl.appendChild(countdownBar);\n\n if (this.hasAttribute('icon') && this.icon) {\n let icon = document.createElement('wje-icon');\n icon.setAttribute('name', this.icon);\n icon.setAttribute('color', this.color);\n icon.setAttribute('slot', 'media');\n icon.setAttribute('part', 'icon');\n\n this.appendChild(icon);\n }\n\n native.appendChild(mediaSlot);\n native.appendChild(content);\n\n if (this.closable) native.appendChild(closeBtn);\n\n if (this.hasAttribute('countdown')) native.appendChild(countdownEl);\n\n fragment.appendChild(native);\n\n this.closeBtn = closeBtn;\n this.countdownBar = countdownBar;\n\n return fragment;\n }\n\n /**\n * After draw method for the toast notification.\n */\n afterDraw() {\n this.closeBtn.addEventListener('wje-button:click', this.hide);\n this.addEventListener('mouseenter', this.pause);\n this.addEventListener('mouseleave', this.resume);\n\n if (this.hasAttribute('countdown')) {\n const startWidth = '100%';\n const endWidth = '0';\n\n this.countdownAnimation = this.countdownBar.animate([{ width: startWidth }, { width: endWidth }], {\n duration: this.duration,\n easing: 'linear',\n });\n }\n\n if (this.duration > 0) {\n this.remainingTime = this.duration;\n this.startTimer();\n }\n }\n\n /**\n * Before disconnect method\n * This method is called before the element is disconnected from the document.\n */\n beforeDisconnect() {\n this.closeBtn?.removeEventListener('wje-button:click', this.hide);\n this.removeEventListener('wje-toast:after-hide', this.removeChildAndStack);\n this.removeEventListener('mouseenter', this.pause);\n this.removeEventListener('mouseleave', this.resume);\n\n clearTimeout(this.timeoutID);\n }\n\n /**\n * Starts the timer.\n * This method sets the `startTime` property to the current time and sets\n * the `timeoutID` property to the ID of the timeout. The method also\n * dispatches the `wje-toast:after-hide` custom event when the timeout\n * expires.\n */\n startTimer() {\n this.startTime = Date.now();\n if (this.timeoutID) {\n clearTimeout(this.timeoutID);\n }\n this.isTimerPaused = false;\n this.timeoutID = window.setTimeout(() => {\n this.hide();\n }, this.remainingTime);\n }\n\n /**\n * Stops the timer.\n * This method clears the timeout and calculates the remaining time.\n * The method is called when the toast notification is paused.\n */\n stopTimer() {\n if (!this.timeoutID || this.isTimerPaused) {\n return;\n }\n\n window.clearTimeout(this.timeoutID);\n this.timeoutID = null;\n const elapsedTime = Date.now() - this.startTime;\n this.remainingTime = Math.max(0, this.remainingTime - elapsedTime);\n this.isTimerPaused = true;\n }\n\n /**\n * Resumes the timer.\n * This method resumes the timer if the remaining time is greater\n * than zero. The method is called when the toast notification is resumed.\n */\n resumeTimer() {\n if (this.isTimerPaused && this.remainingTime > 0) {\n this.startTimer();\n }\n }\n\n /**\n * Asynchronously shows the toast notification.\n * This method sets the `open` property to `true` and dispatches the\n * `wje-toast:after-show` custom event. If the toast is already open,\n * the method returns `undefined`.\n */\n show = () => {\n if (this.open) {\n return;\n }\n\n this.open = true;\n event.dispatchCustomEvent(this, 'wje-toast:after-show');\n };\n\n /**\n * Asynchronously hides the toast notification.\n * This method sets the `open` property to `false` and dispatches the\n * `wje-toast:after-hide` custom event. If the toast is already hidden,\n * the method returns `undefined`.\n */\n hide = () => {\n if (!this.open) {\n return;\n }\n\n this.open = false;\n event.dispatchCustomEvent(this, 'wje-toast:after-hide');\n };\n\n /**\n * Pauses the countdown animation and stops the timer.\n */\n pause = () => {\n this.countdownAnimation?.pause();\n this.stopTimer();\n };\n\n /**\n * Resumes the countdown animation and resumes the timer.\n */\n resume = () => {\n if (this.toastStack?.dataset.expanded === 'true') {\n return;\n }\n\n this.countdownAnimation?.play();\n this.resumeTimer();\n };\n\n /**\n * Removes the toast notification and the toast stack.\n *\n * This method removes the toast notification from the toast stack and\n * removes the toast stack from the document body if the toast stack is\n * empty.\n */\n removeChildAndStack() {\n if (this.parentElement === this.toastStack) {\n this.toastStack.removeChild(this);\n }\n\n this.toastStack.style.setProperty('--wje-toast-stack-layout-duration', '0s');\n this.toastStack.style.setProperty('--wje-toast-stack-visual-duration', '0s');\n this.updateToastStack(this.toastStack);\n\n requestAnimationFrame(() => {\n this.toastStack.style.removeProperty('--wje-toast-stack-layout-duration');\n this.toastStack.style.removeProperty('--wje-toast-stack-visual-duration');\n });\n\n if (this.toastStack.querySelector('wje-toast') === null) {\n this.toastStack.remove();\n }\n }\n\n /**\n * Asynchronously starts the toast notification.\n * This method appends the toast notification to the document body and\n * shows the toast notification. The method returns a promise that\n * resolves when the toast notification is shown.\n * @returns {Promise<unknown>}\n */\n start = () => {\n return new Promise((resolve) => {\n let stack = document.body.querySelector(`.wje-toast-stack[data-stack-key=\"${this.getToastStackKey()}\"]`);\n if (stack) {\n this.toastStack = stack;\n } else {\n this.toastStack = this.createToastStack();\n }\n\n this.syncToastStack(this.toastStack);\n\n if (this.toastStack.parentElement === null) {\n document.body.append(this.toastStack);\n }\n\n this.toastStack.append(this);\n if (this.stacked) {\n this.toastStack.style.setProperty('--wje-toast-stack-layout-duration', '0s');\n this.toastStack.style.setProperty('--wje-toast-stack-visual-duration', '0s');\n this.style.setProperty(\n '--wje-toast-enter-offset',\n this.stackPosition.startsWith('bottom') ? `${STACKED_ENTER_OFFSET}px` : `-${STACKED_ENTER_OFFSET}px`\n );\n this.style.visibility = 'hidden';\n this.show();\n this.updateToastStack(this.toastStack);\n } else {\n this.updateToastStack(this.toastStack);\n this.show();\n }\n\n if (this.toastStack.dataset.expanded === 'true') {\n this.pause();\n }\n\n requestAnimationFrame(() => {\n this.updateToastStack(this.toastStack);\n\n if (this.stacked) {\n this.style.removeProperty('visibility');\n this.toastStack.style.removeProperty('--wje-toast-stack-layout-duration');\n this.toastStack.style.removeProperty('--wje-toast-stack-visual-duration');\n\n requestAnimationFrame(() => this.style.setProperty('--wje-toast-enter-offset', '0px'));\n }\n });\n this.updateComplete?.then(() => this.updateToastStack(this.toastStack));\n\n this.addEventListener('wje-toast:after-hide', this.removeChildAndStack);\n\n resolve(this);\n });\n };\n}\n","import Toast from './toast.element.js';\n\nexport default Toast;\n\nToast.define('wje-toast', Toast);\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"wje-toast.js","sources":["../packages/wje-toast/toast.element.js","../packages/wje-toast/toast.js"],"sourcesContent":["import { default as WJElement, WjElementUtils, event } from '../wje-element/element.js';\nimport styles from './styles/styles.css?inline';\n\nconst DEFAULT_STACK_POSITION = 'top-end';\nconst DEFAULT_STACK_DEPTH = 3;\nconst VALID_STACK_POSITIONS = new Set([\n 'top-start',\n 'top-center',\n 'top-end',\n 'bottom-start',\n 'bottom-center',\n 'bottom-end',\n]);\nconst STACKED_SCALE_STEP = 0.04;\nconst STACKED_MIN_SCALE = 0.88;\nconst STACKED_MIN_OPACITY = 0.72;\nconst STACKED_VISIBLE_SLICE = 16;\nconst STACKED_EXPANDED_MARGIN = '0.5rem';\nconst STACKED_PADDING = '1rem';\nconst STACKED_ENTER_OFFSET = 24;\n\nconst toggleStackExpanded = (stack, expanded) => {\n if (expanded) {\n stack.dataset.expanded = 'true';\n return;\n }\n\n delete stack.dataset.expanded;\n};\n\nconst syncExpandedStackToasts = (stack, expanded) => {\n Array.from(stack.children)\n .filter((child) => child.tagName === 'WJE-TOAST')\n .forEach((toast) => {\n if (expanded) {\n toast.pause?.();\n return;\n }\n\n toast.resume?.();\n });\n};\n\nconst setStackExpandedState = (stack, expanded) => {\n let shouldExpand = stack.dataset.stacked === 'true' && expanded;\n let isExpanded = stack.dataset.expanded === 'true';\n\n if (shouldExpand === isExpanded) {\n return;\n }\n\n toggleStackExpanded(stack, shouldExpand);\n syncExpandedStackToasts(stack, shouldExpand);\n stack.updateToastLayout?.();\n};\n\nconst syncStackExpandedState = (stack) => {\n setStackExpandedState(stack, stack.matches(':hover') || stack.matches(':focus-within'));\n};\n\n/**\n * `Toast` is a custom web component that represents a toast notification.\n * @summary This element represents a toast notification.\n * @documentation https://elements.webjet.sk/components/toast\n * @status stable\n * @augments {WJElement}\n * @csspart native - The native part\n * @slot - The content of the toast.\n * @slot media - The media of the toast.\n * @attribute {string} headline - Specifies the headline text of the toast. Represents the main title or heading displayed in the toast.\n * @attribute {boolean} open - Indicates whether the toast is currently open (visible). A value of `true` shows the toast, while `false` hides it.\n * @attribute {number} duration - Determines the duration (in milliseconds) for which the toast is displayed. After this time, the toast will automatically close unless it is manually closed.\n * @attribute {boolean} closable - Specifies whether the toast can be manually closed by the user. If `true`, the toast will include a close button or mechanism.\n * @attribute {string} color - Defines the color variant of the toast. Supports values such as `primary`, `complete`, `success`, `warning`, `danger`, `info`, and `contrast`.\n * @attribute {boolean} countdown - Indicates whether a countdown is displayed in the toast. When `true`, a visual countdown timer is shown to indicate the remaining time before the toast closes.\n * @attribute {boolean} stacked - Enables a layered toast stack where the newest toast stays visually on top while older ones shrink behind it.\n * @attribute {string} stack-position - Defines where the toast stack is placed on the screen. Supports `top-start`, `top-center`, `top-end`, `bottom-start`, `bottom-center`, and `bottom-end`.\n * @attribute {number} stack-depth - Defines how many visual levels the collapsed stacked toast can show. Older toasts beyond this limit stay at the last reduced level. Default is `3`.\n * @attribute {string} icon - Adds a leading icon into the `media` slot by icon name.\n * @cssproperty [--wje-toast-stack-width=300px] - Defines the width of the toast stack container. Useful for centered stacked toasts and demo layouts.\n * // @fires wje-toast:after-show - Fired after the toast is shown.\n * // @fires wje-toast:after-hide - Fired after the toast is hidden.\n */\n\nexport default class Toast extends WJElement {\n /**\n * Creates an instance of Toast.\n */\n constructor() {\n super();\n\n this.toastStack = this.createToastStack();\n }\n\n /**\n * Set headline value of the toast.\n * @param value\n */\n set headline(value) {\n this.setAttribute('headline', value);\n }\n\n /**\n * Get headline value of the toast.\n * @returns {string}\n */\n get headline() {\n return this.getAttribute('headline');\n }\n\n /**\n * Set open value of the toast.\n * @param value\n */\n set open(value) {\n this.removeAttribute('open');\n\n if (WjElementUtils.stringToBoolean(value)) this.setAttribute('open', value);\n }\n\n /**\n * Get open value of the toast.\n * @returns {boolean}\n */\n get open() {\n return this.hasAttribute('open');\n }\n\n /**\n * Set duration value of the toast.\n * @param value\n */\n set duration(value) {\n this.setAttribute('duration', value);\n }\n\n /**\n * Get duration value of the toast.\n * @returns {number}\n */\n get duration() {\n return +this.getAttribute('duration');\n }\n\n /**\n * Set closable value of the toast.\n * @param value\n */\n set closable(value) {\n this.setAttribute('closable', value || '');\n }\n\n /**\n * Get closable value of the toast.\n * @returns {boolean}\n */\n get closable() {\n return this.hasAttribute('closable');\n }\n\n /**\n * Set color value of the toast.\n * @param value\n */\n set color(value) {\n this.setAttribute('color', value);\n }\n\n /**\n * Get color value of the toast.\n * @returns {string}\n */\n get color() {\n return this.getAttribute('color');\n }\n\n /**\n * Set countdown value of the toast.\n * @param value\n */\n set countdown(value) {\n if (value) this.setAttribute('countdown', value);\n }\n\n /**\n * Get countdown value of the toast.\n * @returns {boolean}\n */\n get countdown() {\n return this.hasAttribute('countdown');\n }\n\n /**\n * Set stacked value of the toast.\n * @param value\n */\n set stacked(value) {\n this.toggleAttribute('stacked', WjElementUtils.stringToBoolean(value));\n }\n\n /**\n * Get stacked value of the toast.\n * @returns {boolean}\n */\n get stacked() {\n return this.hasAttribute('stacked');\n }\n\n /**\n * Set stack depth of the toast.\n * @param value\n */\n set stackDepth(value) {\n if (value === null || value === undefined || value === '') {\n this.removeAttribute('stack-depth');\n return;\n }\n\n this.setAttribute('stack-depth', value);\n }\n\n /**\n * Get stack depth of the toast.\n * @returns {number}\n */\n get stackDepth() {\n let value = Number.parseInt(this.getAttribute('stack-depth'), 10);\n\n if (Number.isFinite(value) && value > 0) {\n return value;\n }\n\n return DEFAULT_STACK_DEPTH;\n }\n\n /**\n * Set stack position of the toast.\n * @param value\n */\n set stackPosition(value) {\n if (!value) {\n this.removeAttribute('stack-position');\n return;\n }\n\n this.setAttribute('stack-position', value);\n }\n\n /**\n * Get stack position of the toast.\n * @returns {string}\n */\n get stackPosition() {\n let value = this.getAttribute('stack-position');\n\n if (VALID_STACK_POSITIONS.has(value)) {\n return value;\n }\n\n if (this.getAttribute('position') === 'bottom') {\n return 'bottom-end';\n }\n\n return DEFAULT_STACK_POSITION;\n }\n\n /**\n * Set icon value of the toast.\n * @param value\n */\n set icon(value) {\n this.setAttribute('icon', value);\n }\n\n /**\n * Get icon value of the toast.\n * @returns {string}\n */\n get icon() {\n return this.getAttribute('icon');\n }\n\n /**\n * Creates a toast stack container.\n * @returns {HTMLDivElement}\n */\n createToastStack() {\n let stack = Object.assign(document.createElement('div'), { className: 'wje-toast-stack' });\n\n stack.addEventListener('mouseenter', () => setStackExpandedState(stack, true));\n stack.addEventListener('mouseleave', () => requestAnimationFrame(() => syncStackExpandedState(stack)));\n stack.addEventListener('focusin', () => setStackExpandedState(stack, true));\n stack.addEventListener('focusout', () => requestAnimationFrame(() => syncStackExpandedState(stack)));\n\n this.syncToastStack(stack);\n\n return stack;\n }\n\n /**\n * Returns the key of the toast stack.\n * @returns {string}\n */\n getToastStackKey() {\n return `${this.stackPosition}:${this.stacked ? `stacked:${this.stackDepth}` : 'default'}`;\n }\n\n /**\n * Applies the stack placement directly on the element so demo/app layout CSS cannot override it accidentally.\n * @param {HTMLDivElement} stack\n */\n applyToastStackPlacement(stack = this.toastStack) {\n const positions = {\n 'top-start': {\n top: '0',\n bottom: 'auto',\n left: '0',\n right: 'auto',\n transform: 'none',\n margin: '0.5rem',\n },\n 'top-center': {\n top: '0',\n bottom: 'auto',\n left: '50%',\n right: 'auto',\n transform: 'translateX(-50%)',\n margin: '0.5rem 0 0',\n },\n 'top-end': {\n top: '0',\n bottom: 'auto',\n left: 'auto',\n right: '0',\n transform: 'none',\n margin: '0.5rem',\n },\n 'bottom-start': {\n top: 'auto',\n bottom: '0',\n left: '0',\n right: 'auto',\n transform: 'none',\n margin: '0 0.5rem 0.5rem',\n },\n 'bottom-center': {\n top: 'auto',\n bottom: '0',\n left: '50%',\n right: 'auto',\n transform: 'translateX(-50%)',\n margin: '0 0 0.5rem',\n },\n 'bottom-end': {\n top: 'auto',\n bottom: '0',\n left: 'auto',\n right: '0',\n transform: 'none',\n margin: '0 0.5rem 0.5rem',\n },\n };\n\n stack.style.removeProperty('inset-inline');\n stack.style.removeProperty('inset-inline-start');\n stack.style.removeProperty('inset-inline-end');\n Object.assign(stack.style, positions[this.stackPosition] || positions[DEFAULT_STACK_POSITION]);\n }\n\n /**\n * Applies the current toast stack configuration to a stack element.\n * @param {HTMLDivElement} stack\n */\n syncToastStack(stack = this.toastStack) {\n stack.dataset.position = this.stackPosition;\n stack.dataset.stackKey = this.getToastStackKey();\n stack.updateToastLayout = () => this.updateToastStack(stack);\n stack.style.display = 'flex';\n stack.style.alignItems = 'stretch';\n stack.style.width = 'min(var(--wje-toast-stack-width, 300px), calc(100vw - 1rem))';\n stack.style.maxWidth = 'calc(100vw - 1rem)';\n stack.style.maxHeight = 'calc(100vh - 1rem)';\n stack.style.zIndex = '9999';\n this.applyToastStackPlacement(stack);\n\n if (this.stacked) {\n stack.dataset.stacked = 'true';\n stack.dataset.stackDepth = String(this.stackDepth);\n } else {\n delete stack.dataset.stacked;\n delete stack.dataset.stackDepth;\n delete stack.dataset.expanded;\n }\n }\n\n /**\n * Clears transient stack styling from a toast.\n * @param {Toast} toast\n */\n clearStackItemStyles(toast) {\n [\n '--wje-toast-stack-scale',\n '--wje-toast-stack-shift',\n '--wje-toast-stack-opacity',\n '--wje-toast-stack-z',\n '--wje-toast-stack-origin',\n '--wje-toast-stack-host-margin-top',\n '--wje-toast-stack-host-margin-bottom',\n 'order',\n 'position',\n 'top',\n 'left',\n 'right',\n 'width',\n 'margin',\n 'margin-top',\n 'margin-bottom',\n ].forEach((property) => toast.style.removeProperty(property));\n }\n\n /**\n * Measures the rendered height of a toast for stack overlap calculations.\n * @param {Toast} toast\n * @returns {number}\n */\n getToastVisualHeight(toast) {\n let hostHeight = toast.getBoundingClientRect().height;\n let nativeHeight = toast.shadowRoot?.querySelector('.native-toast')?.getBoundingClientRect().height || 0;\n\n return Math.max(hostHeight, nativeHeight, toast.offsetHeight || 0);\n }\n\n /**\n * Recomputes the visual order of toasts inside the stack.\n * @param {HTMLDivElement} stack\n */\n updateToastStack(stack = this.toastStack) {\n let toasts = Array.from(stack.children).filter((child) => child.tagName === 'WJE-TOAST');\n let isStacked = stack.dataset.stacked === 'true';\n let isExpanded = stack.dataset.expanded === 'true';\n let isBottomStack = stack.dataset.position?.startsWith('bottom');\n let transformOrigin = stack.dataset.position?.startsWith('bottom') ? 'center bottom' : 'center top';\n let stackHeight = 0;\n\n stack.dataset.count = String(toasts.length);\n stack.style.gap = 'var(--wje-spacing-x-small)';\n stack.style.flexDirection = 'column';\n stack.style.overflow = isStacked ? (isExpanded ? 'auto' : 'visible') : 'auto';\n\n if (isStacked) {\n stack.style.paddingTop = isExpanded ? (isBottomStack ? STACKED_PADDING : '0px') : STACKED_PADDING;\n stack.style.paddingBottom = isExpanded ? (isBottomStack ? '0px' : STACKED_PADDING) : STACKED_PADDING;\n } else {\n stack.style.removeProperty('padding-top');\n stack.style.removeProperty('padding-bottom');\n }\n\n if (!isStacked || isExpanded) {\n stack.style.removeProperty('height');\n }\n\n toasts.forEach((toast, index) => {\n this.clearStackItemStyles(toast);\n\n toast.style.setProperty('--wje-toast-stack-z', String(index + 1));\n\n if (!isStacked) {\n return;\n }\n\n if (isExpanded) {\n let visualOrder = isBottomStack ? index : toasts.length - index - 1;\n let isVisualFirst = visualOrder === 0;\n let isVisualLast = visualOrder === toasts.length - 1;\n\n toast.style.setProperty('--wje-toast-stack-scale', '1.000');\n toast.style.setProperty('--wje-toast-stack-shift', '0px');\n toast.style.setProperty('--wje-toast-stack-opacity', '1.000');\n toast.style.setProperty('--wje-toast-stack-origin', transformOrigin);\n toast.style.order = String(visualOrder);\n toast.style.width = '100%';\n toast.style.setProperty(\n '--wje-toast-stack-host-margin-top',\n isBottomStack && !isVisualFirst ? STACKED_EXPANDED_MARGIN : '0px'\n );\n toast.style.setProperty(\n '--wje-toast-stack-host-margin-bottom',\n !isBottomStack && !isVisualLast ? STACKED_EXPANDED_MARGIN : '0px'\n );\n return;\n }\n\n let toastHeight = this.getToastVisualHeight(toast);\n let maxDepth = Math.max(0, this.stackDepth - 1);\n let visibleLevels = Math.min(toasts.length, this.stackDepth);\n let depth = Math.min(toasts.length - index - 1, maxDepth);\n let visibleIndex = Math.max(0, index - Math.max(0, toasts.length - this.stackDepth));\n let targetTop = isBottomStack\n ? visibleIndex * STACKED_VISIBLE_SLICE\n : (visibleLevels - 1 - visibleIndex) * STACKED_VISIBLE_SLICE;\n let scale = Math.max(STACKED_MIN_SCALE, 1 - depth * STACKED_SCALE_STEP);\n let opacity = Math.max(STACKED_MIN_OPACITY, 1 - depth * 0.08);\n\n toast.style.setProperty('--wje-toast-stack-scale', scale.toFixed(3));\n toast.style.setProperty('--wje-toast-stack-shift', '0px');\n toast.style.setProperty('--wje-toast-stack-opacity', opacity.toFixed(3));\n toast.style.setProperty('--wje-toast-stack-origin', transformOrigin);\n toast.style.position = 'absolute';\n toast.style.top = `${targetTop}px`;\n toast.style.left = '0';\n toast.style.right = '0';\n toast.style.width = '100%';\n toast.style.setProperty('--wje-toast-stack-host-margin-top', '0px');\n toast.style.setProperty('--wje-toast-stack-host-margin-bottom', '0px');\n\n stackHeight = Math.max(stackHeight, targetTop + toastHeight);\n });\n\n if (isStacked && !isExpanded) {\n stack.style.height = `${stackHeight}px`;\n }\n }\n\n /**\n * The class name for the component.\n * @type {string}\n */\n className = 'Toast';\n\n /**\n * Returns the CSS stylesheet for the component.\n * @static\n * @returns {CSSStyleSheet} The CSS stylesheet\n */\n static get cssStyleSheet() {\n return styles;\n }\n\n /**\n * Setup attributes for the Button element.\n */\n setupAttributes() {\n this.isShadowRoot = 'open';\n this.setAriaState({\n role: 'status',\n });\n }\n\n /**\n * Draw method for the toast notification.\n * @returns {object} Document fragment\n */\n draw() {\n let fragment = document.createDocumentFragment();\n\n let native = document.createElement('div');\n native.setAttribute('part', 'native');\n native.classList.add('native-toast');\n\n let mediaSlot = document.createElement('slot');\n mediaSlot.setAttribute('name', 'media');\n mediaSlot.classList.add('media');\n mediaSlot.addEventListener('slotchange', () => {\n if (WjElementUtils.hasSlotContent(this.context, 'media')) {\n mediaSlot.parentElement.classList.add('has-media');\n } else {\n mediaSlot.parentElement.classList.remove('has-media');\n }\n });\n\n let content = document.createElement('div');\n content.classList.add('content');\n content.innerHTML = `<div class=\"headline\">${this.headline}</div><div class=\"message\"><slot></slot></div>`;\n\n let iconX = document.createElement('wje-icon');\n iconX.setAttribute('name', 'x');\n\n let closeBtn = document.createElement('wje-button');\n closeBtn.setAttribute('fill', 'link');\n closeBtn.setAttribute('color', this.color);\n closeBtn.setAttribute('size', 'small');\n closeBtn.classList.add('close');\n closeBtn.setAttribute('label', 'Close');\n\n let countdownEl = document.createElement('div');\n countdownEl.classList.add('countdown');\n\n let countdownBar = document.createElement('div');\n countdownBar.classList.add('countdown-bar');\n\n closeBtn.appendChild(iconX);\n countdownEl.appendChild(countdownBar);\n\n if (this.hasAttribute('icon') && this.icon) {\n let icon = document.createElement('wje-icon');\n icon.setAttribute('name', this.icon);\n icon.setAttribute('color', this.color);\n icon.setAttribute('slot', 'media');\n icon.setAttribute('part', 'icon');\n\n this.appendChild(icon);\n }\n\n native.appendChild(mediaSlot);\n native.appendChild(content);\n\n if (this.closable) native.appendChild(closeBtn);\n\n if (this.hasAttribute('countdown')) native.appendChild(countdownEl);\n\n fragment.appendChild(native);\n\n this.closeBtn = closeBtn;\n this.countdownBar = countdownBar;\n\n return fragment;\n }\n\n /**\n * After draw method for the toast notification.\n */\n afterDraw() {\n this.closeBtn.addEventListener('wje-button:click', this.hide);\n this.addEventListener('mouseenter', this.pause);\n this.addEventListener('mouseleave', this.resume);\n\n if (this.hasAttribute('countdown')) {\n const startWidth = '100%';\n const endWidth = '0';\n\n this.countdownAnimation = this.countdownBar.animate([{ width: startWidth }, { width: endWidth }], {\n duration: this.duration,\n easing: 'linear',\n });\n }\n\n if (this.duration > 0) {\n this.remainingTime = this.duration;\n this.startTimer();\n }\n }\n\n /**\n * Before disconnect method\n * This method is called before the element is disconnected from the document.\n */\n beforeDisconnect() {\n this.closeBtn?.removeEventListener('wje-button:click', this.hide);\n this.removeEventListener('wje-toast:after-hide', this.removeChildAndStack);\n this.removeEventListener('mouseenter', this.pause);\n this.removeEventListener('mouseleave', this.resume);\n\n clearTimeout(this.timeoutID);\n }\n\n /**\n * Starts the timer.\n * This method sets the `startTime` property to the current time and sets\n * the `timeoutID` property to the ID of the timeout. The method also\n * dispatches the `wje-toast:after-hide` custom event when the timeout\n * expires.\n */\n startTimer() {\n this.startTime = Date.now();\n if (this.timeoutID) {\n clearTimeout(this.timeoutID);\n }\n this.isTimerPaused = false;\n this.timeoutID = window.setTimeout(() => {\n this.hide();\n }, this.remainingTime);\n }\n\n /**\n * Stops the timer.\n * This method clears the timeout and calculates the remaining time.\n * The method is called when the toast notification is paused.\n */\n stopTimer() {\n if (!this.timeoutID || this.isTimerPaused) {\n return;\n }\n\n window.clearTimeout(this.timeoutID);\n this.timeoutID = null;\n const elapsedTime = Date.now() - this.startTime;\n this.remainingTime = Math.max(0, this.remainingTime - elapsedTime);\n this.isTimerPaused = true;\n }\n\n /**\n * Resumes the timer.\n * This method resumes the timer if the remaining time is greater\n * than zero. The method is called when the toast notification is resumed.\n */\n resumeTimer() {\n if (this.isTimerPaused && this.remainingTime > 0) {\n this.startTimer();\n }\n }\n\n /**\n * Asynchronously shows the toast notification.\n * This method sets the `open` property to `true` and dispatches the\n * `wje-toast:after-show` custom event. If the toast is already open,\n * the method returns `undefined`.\n */\n show = () => {\n if (this.open) {\n return;\n }\n\n this.open = true;\n event.dispatchCustomEvent(this, 'wje-toast:after-show');\n };\n\n /**\n * Asynchronously hides the toast notification.\n * This method sets the `open` property to `false` and dispatches the\n * `wje-toast:after-hide` custom event. If the toast is already hidden,\n * the method returns `undefined`.\n */\n hide = () => {\n if (!this.open) {\n return;\n }\n\n this.open = false;\n event.dispatchCustomEvent(this, 'wje-toast:after-hide');\n };\n\n /**\n * Pauses the countdown animation and stops the timer.\n */\n pause = () => {\n this.countdownAnimation?.pause();\n this.stopTimer();\n };\n\n /**\n * Resumes the countdown animation and resumes the timer.\n */\n resume = () => {\n if (this.toastStack?.dataset.expanded === 'true') {\n return;\n }\n\n this.countdownAnimation?.play();\n this.resumeTimer();\n };\n\n /**\n * Removes the toast notification and the toast stack.\n *\n * This method removes the toast notification from the toast stack and\n * removes the toast stack from the document body if the toast stack is\n * empty.\n */\n removeChildAndStack() {\n if (this.parentElement === this.toastStack) {\n this.toastStack.removeChild(this);\n }\n\n this.toastStack.style.setProperty('--wje-toast-stack-layout-duration', '0s');\n this.toastStack.style.setProperty('--wje-toast-stack-visual-duration', '0s');\n this.updateToastStack(this.toastStack);\n\n requestAnimationFrame(() => {\n this.toastStack.style.removeProperty('--wje-toast-stack-layout-duration');\n this.toastStack.style.removeProperty('--wje-toast-stack-visual-duration');\n });\n\n if (this.toastStack.querySelector('wje-toast') === null) {\n this.toastStack.remove();\n }\n }\n\n /**\n * Asynchronously starts the toast notification.\n * This method appends the toast notification to the document body and\n * shows the toast notification. The method returns a promise that\n * resolves when the toast notification is shown.\n * @returns {Promise<unknown>}\n */\n start = () => {\n return new Promise((resolve) => {\n let stack = document.body.querySelector(`.wje-toast-stack[data-stack-key=\"${this.getToastStackKey()}\"]`);\n if (stack) {\n this.toastStack = stack;\n } else {\n this.toastStack = this.createToastStack();\n }\n\n this.syncToastStack(this.toastStack);\n\n if (this.toastStack.parentElement === null) {\n document.body.append(this.toastStack);\n }\n\n this.toastStack.append(this);\n if (this.stacked) {\n this.toastStack.style.setProperty('--wje-toast-stack-layout-duration', '0s');\n this.toastStack.style.setProperty('--wje-toast-stack-visual-duration', '0s');\n this.style.setProperty(\n '--wje-toast-enter-offset',\n this.stackPosition.startsWith('bottom') ? `${STACKED_ENTER_OFFSET}px` : `-${STACKED_ENTER_OFFSET}px`\n );\n this.style.visibility = 'hidden';\n this.show();\n this.updateToastStack(this.toastStack);\n } else {\n this.updateToastStack(this.toastStack);\n this.show();\n }\n\n if (this.toastStack.dataset.expanded === 'true') {\n this.pause();\n }\n\n requestAnimationFrame(() => {\n this.updateToastStack(this.toastStack);\n\n if (this.stacked) {\n this.style.removeProperty('visibility');\n this.toastStack.style.removeProperty('--wje-toast-stack-layout-duration');\n this.toastStack.style.removeProperty('--wje-toast-stack-visual-duration');\n\n requestAnimationFrame(() => this.style.setProperty('--wje-toast-enter-offset', '0px'));\n }\n });\n this.updateComplete?.then(() => this.updateToastStack(this.toastStack));\n\n this.addEventListener('wje-toast:after-hide', this.removeChildAndStack);\n\n resolve(this);\n });\n };\n}\n","import Toast from './toast.element.js';\n\nexport default Toast;\n\nToast.define('wje-toast', Toast);\n"],"names":[],"mappings":"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"}
|
|
@@ -110,7 +110,7 @@ const _ToolbarAction = class _ToolbarAction extends WJElement {
|
|
|
110
110
|
let trigger = document.createElement("wje-button");
|
|
111
111
|
trigger.setAttribute("slot", "trigger");
|
|
112
112
|
trigger.setAttribute("fill", "link");
|
|
113
|
-
trigger.setAttribute("
|
|
113
|
+
trigger.setAttribute("label", "Show more actions");
|
|
114
114
|
trigger.innerHTML = '<wje-icon name="dots"></wje-icon>';
|
|
115
115
|
let menu = document.createElement("wje-menu");
|
|
116
116
|
menu.setAttribute("variant", "context");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"wje-toolbar-action.js","sources":["../packages/wje-toolbar-action/toolbar-action.element.js","../packages/wje-toolbar-action/toolbar-action.js"],"sourcesContent":["import { default as WJElement } from '../wje-element/element.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * `ToolbarAction` is a custom web component that represents a toolbar action.\n * @summary This element represents a toolbar action.\n * @documentation https://elements.webjet.sk/components/toolbar-action\n * @status stable\n * @augments {WJElement}\n * @csspart native - The native toolbar action wrapper.\n * @slot - The default slot for the toolbar action.\n * @tag wje-toolbar-action\n */\nexport default class ToolbarAction extends WJElement {\n static BREAKPOINTS = {\n sm: 576,\n md: 768,\n lg: 992,\n xl: 1200,\n '2xl': 1450,\n xxl: 1450,\n };\n\n /**\n * Creates an instance of ToolbarAction.\n */\n constructor() {\n super();\n this._managedHiddenActions = new WeakSet();\n this._isCollapsedByBreakpoint = null;\n this._managedOverflowNodes = new WeakSet();\n this._overflowRetryFrame = null;\n this._applyOverflowFrame = null;\n this._observedDropdown = null;\n }\n\n /**\n * The class name for the component.\n * @type {string}\n */\n className = 'ToolbarAction';\n\n /**\n * Returns the CSS stylesheet for the component.\n * @static\n * @returns {CSSStyleSheet} The CSS stylesheet\n */\n static get cssStyleSheet() {\n return styles;\n }\n\n /**\n * Returns the list of observed attributes.\n * @static\n * @returns {Array} An empty array\n */\n static get observedAttributes() {\n return ['breakpoint', 'max-items', 'visible-items'];\n }\n\n /**\n * Sets the collapse breakpoint token or value.\n * @param {string} value Breakpoint token or CSS size.\n */\n set breakpoint(value) {\n if (value) this.setAttribute('breakpoint', value);\n else this.removeAttribute('breakpoint');\n }\n\n /**\n * Gets the collapse breakpoint token or value.\n * @returns {string}\n */\n get breakpoint() {\n return this.getAttribute('breakpoint') || '';\n }\n\n /**\n * Sets the maximum number of visible actions.\n * @param {number|string} value The maximum number of visible actions.\n */\n set maxItems(value) {\n this.setAttribute('max-items', value || 0);\n }\n\n /**\n * Gets the maximum number of visible actions.\n * @returns {number}\n */\n get maxItems() {\n return +this.getAttribute('max-items') || 0;\n }\n\n /**\n * Sets the responsive visible action count.\n * @param {number|string} value The visible action count.\n */\n set visibleItems(value) {\n if (value === null || value === undefined || value === '') {\n this.removeAttribute('visible-items');\n return;\n }\n\n this.setAttribute('visible-items', value);\n }\n\n /**\n * Gets the responsive visible action count.\n * @returns {number|null}\n */\n get visibleItems() {\n if (!this.hasAttribute('visible-items')) return null;\n const value = +this.getAttribute('visible-items');\n return Number.isFinite(value) ? value : null;\n }\n\n /**\n * Sets up the attributes for the component.\n */\n setupAttributes() {\n this.isShadowRoot = 'open';\n }\n\n /**\n * Draws the component for the toolbar action.\n * @returns {object} Document fragment\n */\n draw() {\n let fragment = document.createDocumentFragment();\n\n let slot = document.createElement('slot');\n\n let element = document.createElement('div');\n element.setAttribute('part', 'native');\n element.classList.add('native-toolbar-action');\n\n let dropdown = document.createElement('wje-dropdown');\n dropdown.setAttribute('placement', 'bottom-end');\n dropdown.setAttribute('collapsible', '');\n dropdown.classList.add('toolbar-action-more');\n dropdown.hidden = true;\n\n let trigger = document.createElement('wje-button');\n trigger.setAttribute('slot', 'trigger');\n trigger.setAttribute('fill', 'link');\n trigger.setAttribute('aria-label', 'Show more actions');\n trigger.innerHTML = '<wje-icon name=\"dots\"></wje-icon>';\n\n let menu = document.createElement('wje-menu');\n menu.setAttribute('variant', 'context');\n\n dropdown.append(trigger, menu);\n\n element.appendChild(slot);\n element.appendChild(dropdown);\n\n fragment.appendChild(element);\n\n this.defaultSlot = slot;\n this.native = element;\n this.moreDropdown = dropdown;\n this.moreMenu = menu;\n\n return fragment;\n }\n\n /**\n * Applies the current visible action limit after the component is drawn.\n */\n afterDraw() {\n this.onSlotChange = () => {\n this.observeExistingDropdown();\n this.scheduleOverflow();\n };\n this.defaultSlot?.addEventListener('slotchange', this.onSlotChange);\n this.handleResize = () => this.handleBreakpointResize();\n\n if (this.getBreakpointWidth()) {\n window.addEventListener('resize', this.handleResize);\n }\n\n this.observeExistingDropdown();\n this.scheduleOverflow(true);\n }\n\n /**\n * Removes listeners after disconnect.\n */\n afterDisconnect() {\n this.defaultSlot?.removeEventListener('slotchange', this.onSlotChange);\n window.removeEventListener('resize', this.handleResize);\n this._isCollapsedByBreakpoint = null;\n\n if (this._overflowRetryFrame) {\n cancelAnimationFrame(this._overflowRetryFrame);\n this._overflowRetryFrame = null;\n }\n\n if (this._applyOverflowFrame) {\n cancelAnimationFrame(this._applyOverflowFrame);\n this._applyOverflowFrame = null;\n }\n\n this._dropdownObserver?.disconnect();\n this._dropdownObserver = null;\n this._observedDropdown = null;\n }\n\n /**\n * Schedules overflow application after layout settles.\n * @param {boolean} [doubleFrame] Wait an extra frame for initial render/hydration.\n */\n scheduleOverflow(doubleFrame = false) {\n if (this._applyOverflowFrame) return;\n\n this._applyOverflowFrame = requestAnimationFrame(() => {\n this._applyOverflowFrame = null;\n\n if (doubleFrame) {\n this.scheduleOverflow(false);\n return;\n }\n\n this.applyOverflow();\n });\n }\n\n /**\n * Returns the actions for the toolbar action.\n * @returns {Array<HTMLElement>} Managed toolbar actions.\n */\n getActions() {\n return this.getAssignedElements().filter(\n (element) =>\n element.getAttribute('slot') !== 'trigger' &&\n (element.tagName?.toLowerCase() === 'wje-button' || element.hasAttribute('data-toolbar-action'))\n );\n }\n\n /**\n * Returns direct children assigned to the default slot.\n * @returns {Array<HTMLElement>}\n */\n getAssignedElements() {\n return this.defaultSlot?.assignedElements?.() || Array.from(this.children);\n }\n\n /**\n * Returns an existing top-level dropdown if present.\n * @returns {HTMLElement|null}\n */\n getExistingDropdown() {\n return this.getAssignedElements().find((element) => element.tagName?.toLowerCase() === 'wje-dropdown') || null;\n }\n\n /**\n * Observes the external dropdown for late menu/content changes.\n */\n observeExistingDropdown() {\n const dropdown = this.getExistingDropdown();\n\n if (dropdown === this._observedDropdown) return;\n\n this._dropdownObserver?.disconnect();\n this._dropdownObserver = null;\n this._observedDropdown = dropdown;\n\n if (!dropdown || typeof MutationObserver !== 'function') return;\n\n this._dropdownObserver = new MutationObserver(() => this.scheduleOverflow());\n this._dropdownObserver.observe(dropdown, {\n childList: true,\n subtree: false,\n });\n }\n\n /**\n * Returns the dropdown that should receive overflow items.\n * @returns {HTMLElement}\n */\n getOverflowDropdown() {\n return this.getExistingDropdown() || this.moreDropdown;\n }\n\n /**\n * Returns the menu used for overflow items.\n * @returns {HTMLElement|null}\n */\n getOverflowMenu() {\n const existingDropdown = this.getExistingDropdown();\n\n if (existingDropdown) {\n return (\n Array.from(existingDropdown.children).find((element) => element.tagName?.toLowerCase() === 'wje-menu') ||\n null\n );\n }\n\n return this.moreMenu;\n }\n\n /**\n * Gets the number of actions that should stay visible.\n * @returns {number}\n */\n getVisibleLimit() {\n const actions = this.getActions();\n\n if (this.isCollapsedByBreakpoint()) {\n return 0;\n }\n\n const maxItems = this.maxItems > 0 ? this.maxItems : actions.length;\n const visibleItems = this.visibleItems;\n const limit = visibleItems === null ? maxItems : Math.min(visibleItems, maxItems);\n\n return Math.max(0, Math.min(limit, actions.length));\n }\n\n /**\n * Returns whether the toolbar action should collapse based on the configured breakpoint.\n * @returns {boolean}\n */\n shouldCollapseByBreakpoint() {\n const breakpointWidth = this.getBreakpointWidth();\n\n if (!breakpointWidth) return false;\n\n return window.innerWidth < breakpointWidth;\n }\n\n /**\n * Returns the cached breakpoint collapse state.\n * @returns {boolean}\n */\n isCollapsedByBreakpoint() {\n if (!this.getBreakpointWidth()) {\n this._isCollapsedByBreakpoint = false;\n return false;\n }\n\n const nextState = this.shouldCollapseByBreakpoint();\n this._isCollapsedByBreakpoint = nextState;\n\n return nextState;\n }\n\n /**\n * Reacts to viewport resize only when the breakpoint mode actually changes.\n * @returns {void}\n */\n handleBreakpointResize() {\n if (!this.getBreakpointWidth()) return;\n\n const nextState = this.shouldCollapseByBreakpoint();\n\n if (this._isCollapsedByBreakpoint === nextState) return;\n\n this._isCollapsedByBreakpoint = nextState;\n this.scheduleOverflow();\n }\n\n /**\n * Resolves the configured breakpoint to a pixel width.\n * @returns {number|null}\n */\n getBreakpointWidth() {\n if (!this.breakpoint) return null;\n\n const token = this.breakpoint.trim().toLowerCase();\n const cssValue = getComputedStyle(this).getPropertyValue(`--wje-toolbar-action-breakpoint-${token}`).trim();\n const namedBreakpoint = ToolbarAction.BREAKPOINTS[token];\n\n if (cssValue) {\n const cssNumber = parseFloat(cssValue);\n if (Number.isFinite(cssNumber)) return cssNumber;\n }\n\n if (Number.isFinite(namedBreakpoint)) {\n return namedBreakpoint;\n }\n\n const directNumber = parseFloat(token);\n return Number.isFinite(directNumber) ? directNumber : null;\n }\n\n /**\n * Updates visible actions and the overflow dropdown.\n * @returns {void}\n */\n applyOverflow() {\n const actions = this.getActions();\n const visibleLimit = this.getVisibleLimit();\n const overflowActions = actions.slice(visibleLimit);\n const existingDropdown = this.getExistingDropdown();\n const overflowMenu = this.getOverflowMenu();\n\n if (this._overflowRetryFrame) {\n cancelAnimationFrame(this._overflowRetryFrame);\n this._overflowRetryFrame = null;\n }\n\n this.restoreManagedActions(actions);\n this.restoreManagedOverflowContent();\n\n if (existingDropdown && overflowActions.length > 0 && !overflowMenu) {\n this._overflowRetryFrame = requestAnimationFrame(() => {\n this._overflowRetryFrame = null;\n this.scheduleOverflow();\n });\n\n return;\n }\n\n if (!existingDropdown) {\n this.moreMenu?.replaceChildren();\n }\n\n overflowActions.forEach((action) => {\n action.hidden = true;\n action.style.display = 'none';\n this._managedHiddenActions.add(action);\n });\n\n if (overflowMenu && existingDropdown && overflowActions.length > 0 && overflowMenu.children.length > 0) {\n overflowMenu.append(this.createOverflowDivider());\n }\n\n overflowActions.forEach((action) => {\n overflowMenu?.append(this.createMenuItem(action));\n });\n\n if (!existingDropdown && this.moreDropdown) {\n this.moreDropdown.hidden = overflowActions.length === 0;\n } else if (existingDropdown && this.moreDropdown) {\n this.moreDropdown.hidden = true;\n }\n }\n\n /**\n * Restores buttons hidden by this component.\n * @param {Array<HTMLElement>} actions Toolbar buttons.\n */\n restoreManagedActions(actions = this.getActions()) {\n actions.forEach((action) => {\n if (this._managedHiddenActions.has(action)) {\n action.hidden = false;\n action.style.removeProperty('display');\n this._managedHiddenActions.delete(action);\n }\n });\n }\n\n /**\n * Removes overflow menu nodes that were previously injected by this component.\n */\n restoreManagedOverflowContent() {\n const dropdown = this.getExistingDropdown();\n\n if (!dropdown) return;\n\n const menu = this.getOverflowMenu();\n if (!menu) return;\n\n Array.from(menu.children).forEach((child) => {\n if (this._managedOverflowNodes.has(child)) {\n child.remove();\n this._managedOverflowNodes.delete(child);\n }\n });\n }\n\n /**\n * Creates a dropdown menu proxy for an overflowed button.\n * @param {HTMLElement} action The original action button.\n * @returns {HTMLElement}\n */\n createMenuItem(action) {\n let menuItem = document.createElement('wje-menu-item');\n menuItem.replaceChildren(...Array.from(action.childNodes).map((node) => this.cloneActionMenuNode(node)));\n\n const label = this.getActionLabel(action);\n if (!menuItem.textContent.trim() && label) {\n menuItem.append(document.createTextNode(label));\n }\n\n if (label) {\n menuItem.setAttribute('aria-label', label);\n }\n\n if (action.hasAttribute('disabled') || action.getAttribute('aria-disabled') === 'true') {\n menuItem.setAttribute('disabled', '');\n }\n\n menuItem.addEventListener('wje-menu-item:click', (e) => this.handleMenuItemClick(e, action));\n menuItem.addEventListener('click', (e) => this.handleMenuItemClick(e, action));\n this._managedOverflowNodes.add(menuItem);\n\n return menuItem;\n }\n\n /**\n * Clones action content for menu usage and normalizes button icon slots.\n * @param {Node} node The source action child node.\n * @returns {Node}\n */\n cloneActionMenuNode(node) {\n const clone = node.cloneNode(true);\n\n if (clone.nodeType === Node.ELEMENT_NODE) {\n this.normalizeActionMenuIconSlot(clone);\n }\n\n return clone;\n }\n\n /**\n * Moves button-only icon slots to the menu item start slot.\n * @param {Element} element The cloned action content node.\n */\n normalizeActionMenuIconSlot(element) {\n if (element.tagName?.toLowerCase() !== 'wje-icon') return;\n\n const slot = element.getAttribute('slot');\n if (!slot || slot === 'icon-only') {\n element.setAttribute('slot', 'start');\n }\n }\n\n /**\n * Resolves readable text for a toolbar action copied into an overflow menu.\n * @param {HTMLElement} action The original action element.\n * @returns {string}\n */\n getActionLabel(action) {\n if (!action) return '';\n\n const explicitLabel = ['aria-label', 'title', 'label', 'data-label', 'tooltip']\n .map((attr) => action.getAttribute(attr)?.trim())\n .find((value) => value && value !== 'true');\n\n if (explicitLabel) return explicitLabel;\n\n return action.textContent.trim();\n }\n\n /**\n * Creates a divider separating existing dropdown actions from responsive overflow actions.\n * @returns {HTMLElement}\n */\n createOverflowDivider() {\n const divider = document.createElement('wje-divider');\n this._managedOverflowNodes.add(divider);\n return divider;\n }\n\n /**\n * Forwards menu item activation to the original button.\n * @param {Event} e The menu event.\n * @param {HTMLElement} action The original action button.\n */\n handleMenuItemClick(e, action) {\n e.preventDefault?.();\n e.stopPropagation();\n\n if (!action || action.hasAttribute('disabled') || action.getAttribute('aria-disabled') === 'true') return;\n\n action.click();\n }\n\n /**\n * Measures action widths while preserving current overflow state.\n * @returns {{count: number, widths: number[], gap: number, moreWidth: number, getWidthForCount: Function}}\n */\n measureActionMetrics() {\n const actions = this.getActions();\n const hasExistingDropdown = !!this.getExistingDropdown();\n\n this.restoreManagedActions(actions);\n\n const widths = actions.map((action) => action.getBoundingClientRect().width);\n const style = this.native ? getComputedStyle(this.native) : null;\n const gap = style ? parseFloat(style.columnGap || style.gap || '0') || 0 : 0;\n const moreWidth = this.measureMoreWidth();\n\n this.applyOverflow();\n\n return {\n count: actions.length,\n widths,\n gap,\n moreWidth,\n getWidthForCount: (visibleCount) => {\n const count = Math.max(0, Math.min(visibleCount, actions.length));\n const overflowCount = actions.length - count;\n const visibleWidth = widths.slice(0, count).reduce((sum, width) => sum + width, 0);\n const visibleGaps = Math.max(count - 1, 0) * gap;\n const usesDropdown = hasExistingDropdown || overflowCount > 0;\n const moreGap = count > 0 && usesDropdown ? gap : 0;\n\n return visibleWidth + visibleGaps + (usesDropdown ? moreWidth + moreGap : 0);\n },\n };\n }\n\n /**\n * Measures the overflow dropdown trigger.\n * @returns {number}\n */\n measureMoreWidth() {\n const dropdown = this.getOverflowDropdown();\n if (!dropdown) return 48;\n\n const isInternalDropdown = dropdown === this.moreDropdown;\n const wasHidden = dropdown.hidden;\n const previousVisibility = dropdown.style.visibility;\n\n if (isInternalDropdown && wasHidden) {\n dropdown.hidden = false;\n dropdown.style.visibility = 'hidden';\n }\n\n const width = dropdown.getBoundingClientRect().width || 48;\n\n if (isInternalDropdown && wasHidden) {\n dropdown.hidden = true;\n dropdown.style.visibility = previousVisibility;\n }\n\n if (dropdown === this.moreDropdown && this.getExistingDropdown()) {\n this.moreDropdown.hidden = true;\n }\n\n return width;\n }\n}\n","import ToolbarAction from './toolbar-action.element.js';\n\nexport default ToolbarAction;\n\nToolbarAction.define('wje-toolbar-action', ToolbarAction);\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"wje-toolbar-action.js","sources":["../packages/wje-toolbar-action/toolbar-action.element.js","../packages/wje-toolbar-action/toolbar-action.js"],"sourcesContent":["import { default as WJElement } from '../wje-element/element.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * `ToolbarAction` is a custom web component that represents a toolbar action.\n * @summary This element represents a toolbar action.\n * @documentation https://elements.webjet.sk/components/toolbar-action\n * @status stable\n * @augments {WJElement}\n * @csspart native - The native toolbar action wrapper.\n * @slot - The default slot for the toolbar action.\n * @tag wje-toolbar-action\n */\nexport default class ToolbarAction extends WJElement {\n static BREAKPOINTS = {\n sm: 576,\n md: 768,\n lg: 992,\n xl: 1200,\n '2xl': 1450,\n xxl: 1450,\n };\n\n /**\n * Creates an instance of ToolbarAction.\n */\n constructor() {\n super();\n this._managedHiddenActions = new WeakSet();\n this._isCollapsedByBreakpoint = null;\n this._managedOverflowNodes = new WeakSet();\n this._overflowRetryFrame = null;\n this._applyOverflowFrame = null;\n this._observedDropdown = null;\n }\n\n /**\n * The class name for the component.\n * @type {string}\n */\n className = 'ToolbarAction';\n\n /**\n * Returns the CSS stylesheet for the component.\n * @static\n * @returns {CSSStyleSheet} The CSS stylesheet\n */\n static get cssStyleSheet() {\n return styles;\n }\n\n /**\n * Returns the list of observed attributes.\n * @static\n * @returns {Array} An empty array\n */\n static get observedAttributes() {\n return ['breakpoint', 'max-items', 'visible-items'];\n }\n\n /**\n * Sets the collapse breakpoint token or value.\n * @param {string} value Breakpoint token or CSS size.\n */\n set breakpoint(value) {\n if (value) this.setAttribute('breakpoint', value);\n else this.removeAttribute('breakpoint');\n }\n\n /**\n * Gets the collapse breakpoint token or value.\n * @returns {string}\n */\n get breakpoint() {\n return this.getAttribute('breakpoint') || '';\n }\n\n /**\n * Sets the maximum number of visible actions.\n * @param {number|string} value The maximum number of visible actions.\n */\n set maxItems(value) {\n this.setAttribute('max-items', value || 0);\n }\n\n /**\n * Gets the maximum number of visible actions.\n * @returns {number}\n */\n get maxItems() {\n return +this.getAttribute('max-items') || 0;\n }\n\n /**\n * Sets the responsive visible action count.\n * @param {number|string} value The visible action count.\n */\n set visibleItems(value) {\n if (value === null || value === undefined || value === '') {\n this.removeAttribute('visible-items');\n return;\n }\n\n this.setAttribute('visible-items', value);\n }\n\n /**\n * Gets the responsive visible action count.\n * @returns {number|null}\n */\n get visibleItems() {\n if (!this.hasAttribute('visible-items')) return null;\n const value = +this.getAttribute('visible-items');\n return Number.isFinite(value) ? value : null;\n }\n\n /**\n * Sets up the attributes for the component.\n */\n setupAttributes() {\n this.isShadowRoot = 'open';\n }\n\n /**\n * Draws the component for the toolbar action.\n * @returns {object} Document fragment\n */\n draw() {\n let fragment = document.createDocumentFragment();\n\n let slot = document.createElement('slot');\n\n let element = document.createElement('div');\n element.setAttribute('part', 'native');\n element.classList.add('native-toolbar-action');\n\n let dropdown = document.createElement('wje-dropdown');\n dropdown.setAttribute('placement', 'bottom-end');\n dropdown.setAttribute('collapsible', '');\n dropdown.classList.add('toolbar-action-more');\n dropdown.hidden = true;\n\n let trigger = document.createElement('wje-button');\n trigger.setAttribute('slot', 'trigger');\n trigger.setAttribute('fill', 'link');\n trigger.setAttribute('label', 'Show more actions');\n trigger.innerHTML = '<wje-icon name=\"dots\"></wje-icon>';\n\n let menu = document.createElement('wje-menu');\n menu.setAttribute('variant', 'context');\n\n dropdown.append(trigger, menu);\n\n element.appendChild(slot);\n element.appendChild(dropdown);\n\n fragment.appendChild(element);\n\n this.defaultSlot = slot;\n this.native = element;\n this.moreDropdown = dropdown;\n this.moreMenu = menu;\n\n return fragment;\n }\n\n /**\n * Applies the current visible action limit after the component is drawn.\n */\n afterDraw() {\n this.onSlotChange = () => {\n this.observeExistingDropdown();\n this.scheduleOverflow();\n };\n this.defaultSlot?.addEventListener('slotchange', this.onSlotChange);\n this.handleResize = () => this.handleBreakpointResize();\n\n if (this.getBreakpointWidth()) {\n window.addEventListener('resize', this.handleResize);\n }\n\n this.observeExistingDropdown();\n this.scheduleOverflow(true);\n }\n\n /**\n * Removes listeners after disconnect.\n */\n afterDisconnect() {\n this.defaultSlot?.removeEventListener('slotchange', this.onSlotChange);\n window.removeEventListener('resize', this.handleResize);\n this._isCollapsedByBreakpoint = null;\n\n if (this._overflowRetryFrame) {\n cancelAnimationFrame(this._overflowRetryFrame);\n this._overflowRetryFrame = null;\n }\n\n if (this._applyOverflowFrame) {\n cancelAnimationFrame(this._applyOverflowFrame);\n this._applyOverflowFrame = null;\n }\n\n this._dropdownObserver?.disconnect();\n this._dropdownObserver = null;\n this._observedDropdown = null;\n }\n\n /**\n * Schedules overflow application after layout settles.\n * @param {boolean} [doubleFrame] Wait an extra frame for initial render/hydration.\n */\n scheduleOverflow(doubleFrame = false) {\n if (this._applyOverflowFrame) return;\n\n this._applyOverflowFrame = requestAnimationFrame(() => {\n this._applyOverflowFrame = null;\n\n if (doubleFrame) {\n this.scheduleOverflow(false);\n return;\n }\n\n this.applyOverflow();\n });\n }\n\n /**\n * Returns the actions for the toolbar action.\n * @returns {Array<HTMLElement>} Managed toolbar actions.\n */\n getActions() {\n return this.getAssignedElements().filter(\n (element) =>\n element.getAttribute('slot') !== 'trigger' &&\n (element.tagName?.toLowerCase() === 'wje-button' || element.hasAttribute('data-toolbar-action'))\n );\n }\n\n /**\n * Returns direct children assigned to the default slot.\n * @returns {Array<HTMLElement>}\n */\n getAssignedElements() {\n return this.defaultSlot?.assignedElements?.() || Array.from(this.children);\n }\n\n /**\n * Returns an existing top-level dropdown if present.\n * @returns {HTMLElement|null}\n */\n getExistingDropdown() {\n return this.getAssignedElements().find((element) => element.tagName?.toLowerCase() === 'wje-dropdown') || null;\n }\n\n /**\n * Observes the external dropdown for late menu/content changes.\n */\n observeExistingDropdown() {\n const dropdown = this.getExistingDropdown();\n\n if (dropdown === this._observedDropdown) return;\n\n this._dropdownObserver?.disconnect();\n this._dropdownObserver = null;\n this._observedDropdown = dropdown;\n\n if (!dropdown || typeof MutationObserver !== 'function') return;\n\n this._dropdownObserver = new MutationObserver(() => this.scheduleOverflow());\n this._dropdownObserver.observe(dropdown, {\n childList: true,\n subtree: false,\n });\n }\n\n /**\n * Returns the dropdown that should receive overflow items.\n * @returns {HTMLElement}\n */\n getOverflowDropdown() {\n return this.getExistingDropdown() || this.moreDropdown;\n }\n\n /**\n * Returns the menu used for overflow items.\n * @returns {HTMLElement|null}\n */\n getOverflowMenu() {\n const existingDropdown = this.getExistingDropdown();\n\n if (existingDropdown) {\n return (\n Array.from(existingDropdown.children).find((element) => element.tagName?.toLowerCase() === 'wje-menu') ||\n null\n );\n }\n\n return this.moreMenu;\n }\n\n /**\n * Gets the number of actions that should stay visible.\n * @returns {number}\n */\n getVisibleLimit() {\n const actions = this.getActions();\n\n if (this.isCollapsedByBreakpoint()) {\n return 0;\n }\n\n const maxItems = this.maxItems > 0 ? this.maxItems : actions.length;\n const visibleItems = this.visibleItems;\n const limit = visibleItems === null ? maxItems : Math.min(visibleItems, maxItems);\n\n return Math.max(0, Math.min(limit, actions.length));\n }\n\n /**\n * Returns whether the toolbar action should collapse based on the configured breakpoint.\n * @returns {boolean}\n */\n shouldCollapseByBreakpoint() {\n const breakpointWidth = this.getBreakpointWidth();\n\n if (!breakpointWidth) return false;\n\n return window.innerWidth < breakpointWidth;\n }\n\n /**\n * Returns the cached breakpoint collapse state.\n * @returns {boolean}\n */\n isCollapsedByBreakpoint() {\n if (!this.getBreakpointWidth()) {\n this._isCollapsedByBreakpoint = false;\n return false;\n }\n\n const nextState = this.shouldCollapseByBreakpoint();\n this._isCollapsedByBreakpoint = nextState;\n\n return nextState;\n }\n\n /**\n * Reacts to viewport resize only when the breakpoint mode actually changes.\n * @returns {void}\n */\n handleBreakpointResize() {\n if (!this.getBreakpointWidth()) return;\n\n const nextState = this.shouldCollapseByBreakpoint();\n\n if (this._isCollapsedByBreakpoint === nextState) return;\n\n this._isCollapsedByBreakpoint = nextState;\n this.scheduleOverflow();\n }\n\n /**\n * Resolves the configured breakpoint to a pixel width.\n * @returns {number|null}\n */\n getBreakpointWidth() {\n if (!this.breakpoint) return null;\n\n const token = this.breakpoint.trim().toLowerCase();\n const cssValue = getComputedStyle(this).getPropertyValue(`--wje-toolbar-action-breakpoint-${token}`).trim();\n const namedBreakpoint = ToolbarAction.BREAKPOINTS[token];\n\n if (cssValue) {\n const cssNumber = parseFloat(cssValue);\n if (Number.isFinite(cssNumber)) return cssNumber;\n }\n\n if (Number.isFinite(namedBreakpoint)) {\n return namedBreakpoint;\n }\n\n const directNumber = parseFloat(token);\n return Number.isFinite(directNumber) ? directNumber : null;\n }\n\n /**\n * Updates visible actions and the overflow dropdown.\n * @returns {void}\n */\n applyOverflow() {\n const actions = this.getActions();\n const visibleLimit = this.getVisibleLimit();\n const overflowActions = actions.slice(visibleLimit);\n const existingDropdown = this.getExistingDropdown();\n const overflowMenu = this.getOverflowMenu();\n\n if (this._overflowRetryFrame) {\n cancelAnimationFrame(this._overflowRetryFrame);\n this._overflowRetryFrame = null;\n }\n\n this.restoreManagedActions(actions);\n this.restoreManagedOverflowContent();\n\n if (existingDropdown && overflowActions.length > 0 && !overflowMenu) {\n this._overflowRetryFrame = requestAnimationFrame(() => {\n this._overflowRetryFrame = null;\n this.scheduleOverflow();\n });\n\n return;\n }\n\n if (!existingDropdown) {\n this.moreMenu?.replaceChildren();\n }\n\n overflowActions.forEach((action) => {\n action.hidden = true;\n action.style.display = 'none';\n this._managedHiddenActions.add(action);\n });\n\n if (overflowMenu && existingDropdown && overflowActions.length > 0 && overflowMenu.children.length > 0) {\n overflowMenu.append(this.createOverflowDivider());\n }\n\n overflowActions.forEach((action) => {\n overflowMenu?.append(this.createMenuItem(action));\n });\n\n if (!existingDropdown && this.moreDropdown) {\n this.moreDropdown.hidden = overflowActions.length === 0;\n } else if (existingDropdown && this.moreDropdown) {\n this.moreDropdown.hidden = true;\n }\n }\n\n /**\n * Restores buttons hidden by this component.\n * @param {Array<HTMLElement>} actions Toolbar buttons.\n */\n restoreManagedActions(actions = this.getActions()) {\n actions.forEach((action) => {\n if (this._managedHiddenActions.has(action)) {\n action.hidden = false;\n action.style.removeProperty('display');\n this._managedHiddenActions.delete(action);\n }\n });\n }\n\n /**\n * Removes overflow menu nodes that were previously injected by this component.\n */\n restoreManagedOverflowContent() {\n const dropdown = this.getExistingDropdown();\n\n if (!dropdown) return;\n\n const menu = this.getOverflowMenu();\n if (!menu) return;\n\n Array.from(menu.children).forEach((child) => {\n if (this._managedOverflowNodes.has(child)) {\n child.remove();\n this._managedOverflowNodes.delete(child);\n }\n });\n }\n\n /**\n * Creates a dropdown menu proxy for an overflowed button.\n * @param {HTMLElement} action The original action button.\n * @returns {HTMLElement}\n */\n createMenuItem(action) {\n let menuItem = document.createElement('wje-menu-item');\n menuItem.replaceChildren(...Array.from(action.childNodes).map((node) => this.cloneActionMenuNode(node)));\n\n const label = this.getActionLabel(action);\n if (!menuItem.textContent.trim() && label) {\n menuItem.append(document.createTextNode(label));\n }\n\n if (label) {\n menuItem.setAttribute('aria-label', label);\n }\n\n if (action.hasAttribute('disabled') || action.getAttribute('aria-disabled') === 'true') {\n menuItem.setAttribute('disabled', '');\n }\n\n menuItem.addEventListener('wje-menu-item:click', (e) => this.handleMenuItemClick(e, action));\n menuItem.addEventListener('click', (e) => this.handleMenuItemClick(e, action));\n this._managedOverflowNodes.add(menuItem);\n\n return menuItem;\n }\n\n /**\n * Clones action content for menu usage and normalizes button icon slots.\n * @param {Node} node The source action child node.\n * @returns {Node}\n */\n cloneActionMenuNode(node) {\n const clone = node.cloneNode(true);\n\n if (clone.nodeType === Node.ELEMENT_NODE) {\n this.normalizeActionMenuIconSlot(clone);\n }\n\n return clone;\n }\n\n /**\n * Moves button-only icon slots to the menu item start slot.\n * @param {Element} element The cloned action content node.\n */\n normalizeActionMenuIconSlot(element) {\n if (element.tagName?.toLowerCase() !== 'wje-icon') return;\n\n const slot = element.getAttribute('slot');\n if (!slot || slot === 'icon-only') {\n element.setAttribute('slot', 'start');\n }\n }\n\n /**\n * Resolves readable text for a toolbar action copied into an overflow menu.\n * @param {HTMLElement} action The original action element.\n * @returns {string}\n */\n getActionLabel(action) {\n if (!action) return '';\n\n const explicitLabel = ['aria-label', 'title', 'label', 'data-label', 'tooltip']\n .map((attr) => action.getAttribute(attr)?.trim())\n .find((value) => value && value !== 'true');\n\n if (explicitLabel) return explicitLabel;\n\n return action.textContent.trim();\n }\n\n /**\n * Creates a divider separating existing dropdown actions from responsive overflow actions.\n * @returns {HTMLElement}\n */\n createOverflowDivider() {\n const divider = document.createElement('wje-divider');\n this._managedOverflowNodes.add(divider);\n return divider;\n }\n\n /**\n * Forwards menu item activation to the original button.\n * @param {Event} e The menu event.\n * @param {HTMLElement} action The original action button.\n */\n handleMenuItemClick(e, action) {\n e.preventDefault?.();\n e.stopPropagation();\n\n if (!action || action.hasAttribute('disabled') || action.getAttribute('aria-disabled') === 'true') return;\n\n action.click();\n }\n\n /**\n * Measures action widths while preserving current overflow state.\n * @returns {{count: number, widths: number[], gap: number, moreWidth: number, getWidthForCount: Function}}\n */\n measureActionMetrics() {\n const actions = this.getActions();\n const hasExistingDropdown = !!this.getExistingDropdown();\n\n this.restoreManagedActions(actions);\n\n const widths = actions.map((action) => action.getBoundingClientRect().width);\n const style = this.native ? getComputedStyle(this.native) : null;\n const gap = style ? parseFloat(style.columnGap || style.gap || '0') || 0 : 0;\n const moreWidth = this.measureMoreWidth();\n\n this.applyOverflow();\n\n return {\n count: actions.length,\n widths,\n gap,\n moreWidth,\n getWidthForCount: (visibleCount) => {\n const count = Math.max(0, Math.min(visibleCount, actions.length));\n const overflowCount = actions.length - count;\n const visibleWidth = widths.slice(0, count).reduce((sum, width) => sum + width, 0);\n const visibleGaps = Math.max(count - 1, 0) * gap;\n const usesDropdown = hasExistingDropdown || overflowCount > 0;\n const moreGap = count > 0 && usesDropdown ? gap : 0;\n\n return visibleWidth + visibleGaps + (usesDropdown ? moreWidth + moreGap : 0);\n },\n };\n }\n\n /**\n * Measures the overflow dropdown trigger.\n * @returns {number}\n */\n measureMoreWidth() {\n const dropdown = this.getOverflowDropdown();\n if (!dropdown) return 48;\n\n const isInternalDropdown = dropdown === this.moreDropdown;\n const wasHidden = dropdown.hidden;\n const previousVisibility = dropdown.style.visibility;\n\n if (isInternalDropdown && wasHidden) {\n dropdown.hidden = false;\n dropdown.style.visibility = 'hidden';\n }\n\n const width = dropdown.getBoundingClientRect().width || 48;\n\n if (isInternalDropdown && wasHidden) {\n dropdown.hidden = true;\n dropdown.style.visibility = previousVisibility;\n }\n\n if (dropdown === this.moreDropdown && this.getExistingDropdown()) {\n this.moreDropdown.hidden = true;\n }\n\n return width;\n }\n}\n","import ToolbarAction from './toolbar-action.element.js';\n\nexport default ToolbarAction;\n\nToolbarAction.define('wje-toolbar-action', ToolbarAction);\n"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "wj-elements",
|
|
3
3
|
"description": "WebJET Elements is a modern set of user interface tools harnessing the power of web components designed to simplify web application development.",
|
|
4
|
-
"version": "0.7.
|
|
4
|
+
"version": "0.7.7",
|
|
5
5
|
"homepage": "https://github.com/lencys/wj-elements",
|
|
6
6
|
"author": "Lukáš Ondrejček <lukas.ondrejcek@gmail.com>",
|
|
7
7
|
"license": "MIT",
|
|
@@ -58,6 +58,7 @@
|
|
|
58
58
|
"test:dialog": "web-test-runner --files packages/wje-dialog/dialog.test.js",
|
|
59
59
|
"test:dropdown": "web-test-runner --files packages/wje-dropdown/dropdown.test.js",
|
|
60
60
|
"test:file-upload": "web-test-runner --files packages/wje-file-upload/file-upload.test.js",
|
|
61
|
+
"test:file-upload-item": "web-test-runner --files packages/wje-file-upload-item/file-upload-item.test.js",
|
|
61
62
|
"test:format-digital": "web-test-runner --files packages/wje-format-digital/format-digital.test.js",
|
|
62
63
|
"test:img": "web-test-runner --files packages/wje-img/img.test.js",
|
|
63
64
|
"test:img-comparer": "web-test-runner --files packages/wje-img-comparer/img-comparer.test.js",
|