@nuralyui/toast 0.0.14 → 0.0.15
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/bundle.js +2 -2
- package/index.js.map +1 -1
- package/package.json +1 -1
- package/react.js.map +1 -1
- package/toast.component.d.ts +1 -1
- package/toast.component.js.map +1 -1
- package/toast.style.js.map +1 -1
- package/toast.types.js.map +1 -1
package/bundle.js
CHANGED
|
@@ -337,9 +337,9 @@ import{css as t,LitElement as o,html as a,nothing as r}from"lit";import{property
|
|
|
337
337
|
* Copyright 2023 Nuraly, Laabidi Aymen
|
|
338
338
|
* SPDX-License-Identifier: MIT
|
|
339
339
|
*/
|
|
340
|
-
var y=function(t,o,a,r){for(var s,n=arguments.length,i=n<3?o:null===r?r=Object.getOwnPropertyDescriptor(o,a):r,e=t.length-1;e>=0;e--)(s=t[e])&&(i=(n<3?s(i):n>3?s(o,a,i):s(o,a))||i);return n>3&&i&&Object.defineProperty(o,a,i),i};let f=class extends(c(o)){constructor(){super(...arguments),this.requiredComponents=["nr-icon","nr-button"],this.position="top-right",this.maxToasts=5,this.defaultDuration=5e3,this.animation="fade",this.stack=!0,this.autoDismiss=!0,this.toasts=[],this.timeouts=new Map}show(t){var o,a,r;const s="string"==typeof t?{text:t}:t,n={id:this.generateId(),timestamp:Date.now(),text:s.text,content:s.content,type:s.type||"default",duration:null!==(o=s.duration)&&void 0!==o?o:this.defaultDuration,autoDismiss:null!==(a=s.autoDismiss)&&void 0!==a?a:this.autoDismiss,closable:null===(r=s.closable)||void 0===r||r,icon:s.icon||this.getDefaultIcon(s.type),customClass:s.customClass,button:s.button,onClose:s.onClose,onClick:s.onClick};if(this.stack?this.toasts.length>=this.maxToasts&&this.removeToast(this.toasts[0].id):this.clearAll(),this.toasts=[...this.toasts,n],this.emitToastEvent("nr-toast-show",n,"show"),n.autoDismiss&&n.duration&&n.duration>0){const t=window.setTimeout((
|
|
340
|
+
var y=function(t,o,a,r){for(var s,n=arguments.length,i=n<3?o:null===r?r=Object.getOwnPropertyDescriptor(o,a):r,e=t.length-1;e>=0;e--)(s=t[e])&&(i=(n<3?s(i):n>3?s(o,a,i):s(o,a))||i);return n>3&&i&&Object.defineProperty(o,a,i),i};let f=class extends(c(o)){constructor(){super(...arguments),this.requiredComponents=["nr-icon","nr-button"],this.position="top-right",this.maxToasts=5,this.defaultDuration=5e3,this.animation="fade",this.stack=!0,this.autoDismiss=!0,this.toasts=[],this.timeouts=new Map}show(t){var o,a,r;const s="string"==typeof t?{text:t}:t,n={id:this.generateId(),timestamp:Date.now(),text:s.text,content:s.content,type:s.type||"default",duration:null!==(o=s.duration)&&void 0!==o?o:this.defaultDuration,autoDismiss:null!==(a=s.autoDismiss)&&void 0!==a?a:this.autoDismiss,closable:null===(r=s.closable)||void 0===r||r,icon:s.icon||this.getDefaultIcon(s.type),customClass:s.customClass,button:s.button,onClose:s.onClose,onClick:s.onClick};if(this.stack?this.toasts.length>=this.maxToasts&&this.removeToast(this.toasts[0].id):this.clearAll(),this.toasts=[...this.toasts,n],this.emitToastEvent("nr-toast-show",n,"show"),n.autoDismiss&&n.duration&&n.duration>0){const t=window.setTimeout(()=>{this.removeToast(n.id)},n.duration);this.timeouts.set(n.id,t)}return n.id}success(t,o){return this.show({text:t,type:"success",duration:o})}error(t,o){return this.show({text:t,type:"error",duration:o})}warning(t,o){return this.show({text:t,type:"warning",duration:o})}info(t,o){return this.show({text:t,type:"info",duration:o})}removeToast(t){const o=this.toasts.find(o=>o.id===t);if(!o)return;o.removing=!0,this.requestUpdate();const a=this.timeouts.get(t);a&&(clearTimeout(a),this.timeouts.delete(t)),setTimeout(()=>{var a;this.toasts=this.toasts.filter(o=>o.id!==t),this.emitToastEvent("nr-toast-close",o,"close"),null===(a=o.onClose)||void 0===a||a.call(o)},300)}clearAll(){this.toasts.forEach(t=>{const o=this.timeouts.get(t.id);o&&clearTimeout(o)}),this.timeouts.clear(),this.toasts=[]}handleToastClick(t){var o;this.emitToastEvent("nr-toast-click",t,"click"),null===(o=t.onClick)||void 0===o||o.call(t)}handleCloseClick(t,o){t.stopPropagation(),this.removeToast(o.id)}getDefaultIcon(t){switch(t){case"success":return"check-circle";case"error":return"x-circle";case"warning":return"alert-triangle";case"info":return"info";default:return""}}generateId(){return`toast-${Date.now()}-${Math.random().toString(36).substr(2,9)}`}getAnimationClass(t){const o=t.removing?"out":"in";return`toast--${this.animation}-${o}`}emitToastEvent(t,o,a){this.dispatchEvent(new CustomEvent(t,{detail:{toast:o,action:a},bubbles:!0,composed:!0}))}disconnectedCallback(){super.disconnectedCallback(),this.clearAll()}render(){return a`
|
|
341
341
|
<div class="toast-container">
|
|
342
|
-
${e(this.toasts,
|
|
342
|
+
${e(this.toasts,t=>t.id,t=>this.renderToast(t))}
|
|
343
343
|
</div>
|
|
344
344
|
`}renderToast(t){const o={toast:!0,[`toast--${t.type}`]:!0,[this.getAnimationClass(t)]:!0,[t.customClass||""]:!!t.customClass};return a`
|
|
345
345
|
<div
|
package/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/toast/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,cAAc,sBAAsB,CAAC;AACrC,cAAc,kBAAkB,CAAC;AACjC,cAAc,wBAAwB,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2023 Nuraly, Laabidi Aymen\n * SPDX-License-Identifier: MIT\n */\n\nexport * from './toast.component.js';\nexport * from './toast.types.js';\nexport * from './controllers/index.js';\n\n"]}
|
package/package.json
CHANGED
package/react.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"react.js","sourceRoot":"","sources":["
|
|
1
|
+
{"version":3,"file":"react.js","sourceRoot":"","sources":["../../../../src/components/toast/react.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAClD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACtD,MAAM,CAAC,MAAM,OAAO,GAAG,eAAe,CAAC;IACrC,OAAO,EAAE,UAAU;IACnB,YAAY,EAAE,cAAc;IAC5B,KAAK,EAAE,KAAK;IACZ,MAAM,EAAE;QACN,eAAe,EAAE,eAAe;QAChC,gBAAgB,EAAE,gBAAgB;QAClC,gBAAgB,EAAE,gBAAgB;KACnC;CACF,CAAC,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2023 Nuraly, Laabidi Aymen\n * SPDX-License-Identifier: MIT\n */\nimport { createComponent } from '@lit-labs/react';\nimport * as React from 'react';\nimport { NrToastElement } from './toast.component.js';\nexport const NrToast = createComponent({\n tagName: 'nr-toast',\n elementClass: NrToastElement,\n react: React,\n events: {\n 'nr-toast-show': 'nr-toast-show',\n 'nr-toast-close': 'nr-toast-close',\n 'nr-toast-click': 'nr-toast-click',\n },\n});\n\n"]}
|
package/toast.component.d.ts
CHANGED
|
@@ -144,7 +144,7 @@ export declare class NrToastElement extends NrToastElement_base {
|
|
|
144
144
|
*/
|
|
145
145
|
private emitToastEvent;
|
|
146
146
|
disconnectedCallback(): void;
|
|
147
|
-
render(): import("lit").TemplateResult<1>;
|
|
147
|
+
render(): import("lit-html").TemplateResult<1>;
|
|
148
148
|
private renderToast;
|
|
149
149
|
private renderButton;
|
|
150
150
|
}
|
package/toast.component.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"toast.component.js","sourceRoot":"","sources":["../../../src/components/toast/toast.component.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license\n * Copyright 2023 Nuraly, Laabidi Aymen\n * SPDX-License-Identifier: MIT\n */\n\nimport { LitElement, html, nothing } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { repeat } from 'lit/directives/repeat.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { styles } from './toast.style.js';\nimport { NuralyUIBaseMixin } from '@nuralyui/common/mixins';\nimport {\n ToastType,\n ToastPosition,\n ToastAnimation,\n ToastConfig,\n ToastItem,\n ToastEventDetail,\n ToastButton,\n DEFAULT_TOAST_DURATION,\n DEFAULT_MAX_TOASTS,\n EMPTY_STRING\n} from './toast.types.js';\n\n// Import required components\n\n/**\n * Toast notification component for displaying temporary messages.\n * \n * Provides a flexible notification system with multiple types, positions, and animations.\n * Supports stacking multiple toasts, auto-dismiss (enabled by default), action buttons, \n * custom HTML content, and manual closing.\n * \n * @example\n * ```html\n * <!-- Basic usage with auto-dismiss -->\n * <nr-toast position=\"top-right\"></nr-toast>\n * \n * <!-- Disable auto-dismiss to require manual closing -->\n * <nr-toast position=\"top-right\" auto-dismiss=\"false\"></nr-toast>\n * \n * <!-- Programmatic usage -->\n * <script>\n * const toast = document.querySelector('nr-toast');\n * toast.show({ text: 'Success!', type: 'success' });\n * toast.show({ text: 'Error occurred', type: 'error', duration: 7000 });\n * \n * // Disable auto-dismiss for specific toast\n * toast.show({ text: 'Persistent message', autoDismiss: false });\n * \n * // Toast with action button\n * toast.show({\n * text: 'Item deleted',\n * type: 'success',\n * button: {\n * label: 'Undo',\n * onClick: () => console.log('Undo clicked'),\n * type: 'primary'\n * }\n * });\n * \n * // Custom HTML content (GDPR consent example)\n * toast.show({\n * content: html`\n * <div>\n * <h4>Cookie Consent</h4>\n * <p>We use cookies to improve your experience.</p>\n * <div style=\"display: flex; gap: 0.5rem; margin-top: 0.5rem;\">\n * <nr-button size=\"small\" type=\"primary\">Accept</nr-button>\n * <nr-button size=\"small\" type=\"secondary\">Decline</nr-button>\n * </div>\n * </div>\n * `,\n * autoDismiss: false,\n * closable: true\n * });\n * </script>\n * ```\n * \n * @fires nr-toast-show - Toast shown\n * @fires nr-toast-close - Toast closed\n * @fires nr-toast-click - Toast clicked\n * \n * @cssproperty --nuraly-z-index-toast - Toast z-index\n * @cssproperty --nuraly-toast-default-background - Default toast background\n * @cssproperty --nuraly-toast-success-background - Success toast background\n * @cssproperty --nuraly-toast-error-background - Error toast background\n * @cssproperty --nuraly-toast-warning-background - Warning toast background\n * @cssproperty --nuraly-toast-info-background - Info toast background\n */\n@customElement('nr-toast')\nexport class NrToastElement extends NuralyUIBaseMixin(LitElement) {\n static override styles = styles;\n\n override requiredComponents = ['nr-icon', 'nr-button'];\n\n /** Position of toast container on screen */\n @property({ type: String, reflect: true })\n position: ToastPosition = ToastPosition.TopRight;\n\n /** Maximum number of toasts to display */\n @property({ type: Number })\n maxToasts = DEFAULT_MAX_TOASTS;\n\n /** Default duration for toasts in milliseconds */\n @property({ type: Number })\n defaultDuration = DEFAULT_TOAST_DURATION;\n\n /** Animation type for toasts */\n @property({ type: String })\n animation: ToastAnimation = ToastAnimation.Fade;\n\n /** Whether to stack toasts or replace */\n @property({ type: Boolean })\n stack = true;\n\n /** Auto dismiss toasts after duration (default: true) */\n @property({ type: Boolean })\n autoDismiss = true;\n\n /** Internal state: active toasts */\n @state()\n private toasts: ToastItem[] = [];\n\n /** Timeout map for auto-dismiss */\n private timeouts = new Map<string, number>();\n\n /**\n * Show a new toast notification\n * @param config - Toast configuration\n * @returns Toast ID for manual control\n */\n show(config: string | ToastConfig): string {\n const toastConfig: ToastConfig = typeof config === 'string' \n ? { text: config }\n : config;\n\n const toast: ToastItem = {\n id: this.generateId(),\n timestamp: Date.now(),\n text: toastConfig.text,\n content: toastConfig.content,\n type: toastConfig.type || ToastType.Default,\n duration: toastConfig.duration ?? this.defaultDuration,\n autoDismiss: toastConfig.autoDismiss ?? this.autoDismiss,\n closable: toastConfig.closable ?? true,\n icon: toastConfig.icon || this.getDefaultIcon(toastConfig.type),\n customClass: toastConfig.customClass,\n button: toastConfig.button,\n onClose: toastConfig.onClose,\n onClick: toastConfig.onClick,\n };\n\n // Handle max toasts\n if (!this.stack) {\n this.clearAll();\n } else if (this.toasts.length >= this.maxToasts) {\n this.removeToast(this.toasts[0].id);\n }\n\n // Add toast\n this.toasts = [...this.toasts, toast];\n\n // Emit show event\n this.emitToastEvent('nr-toast-show', toast, 'show');\n\n // Set auto-dismiss timeout\n if (toast.autoDismiss && toast.duration && toast.duration > 0) {\n const timeoutId = window.setTimeout(() => {\n this.removeToast(toast.id);\n }, toast.duration);\n this.timeouts.set(toast.id, timeoutId);\n }\n\n return toast.id;\n }\n\n /**\n * Show success toast\n */\n success(text: string, duration?: number): string {\n return this.show({ text, type: ToastType.Success, duration });\n }\n\n /**\n * Show error toast\n */\n error(text: string, duration?: number): string {\n return this.show({ text, type: ToastType.Error, duration });\n }\n\n /**\n * Show warning toast\n */\n warning(text: string, duration?: number): string {\n return this.show({ text, type: ToastType.Warning, duration });\n }\n\n /**\n * Show info toast\n */\n info(text: string, duration?: number): string {\n return this.show({ text, type: ToastType.Info, duration });\n }\n\n /**\n * Remove a specific toast\n */\n removeToast(id: string): void {\n const toast = this.toasts.find(t => t.id === id);\n if (!toast) return;\n\n // Mark as removing for animation\n toast.removing = true;\n this.requestUpdate();\n\n // Clear timeout\n const timeoutId = this.timeouts.get(id);\n if (timeoutId) {\n clearTimeout(timeoutId);\n this.timeouts.delete(id);\n }\n\n // Remove after animation\n setTimeout(() => {\n this.toasts = this.toasts.filter(t => t.id !== id);\n \n // Emit close event\n this.emitToastEvent('nr-toast-close', toast, 'close');\n \n // Call onClose callback\n toast.onClose?.();\n }, 300); // Animation duration\n }\n\n /**\n * Clear all toasts\n */\n clearAll(): void {\n this.toasts.forEach(toast => {\n const timeoutId = this.timeouts.get(toast.id);\n if (timeoutId) {\n clearTimeout(timeoutId);\n }\n });\n this.timeouts.clear();\n this.toasts = [];\n }\n\n /**\n * Handle toast click\n */\n private handleToastClick(toast: ToastItem): void {\n this.emitToastEvent('nr-toast-click', toast, 'click');\n toast.onClick?.();\n }\n\n /**\n * Handle close button click\n */\n private handleCloseClick(event: Event, toast: ToastItem): void {\n event.stopPropagation();\n this.removeToast(toast.id);\n }\n\n /**\n * Get default icon for toast type\n */\n private getDefaultIcon(type?: ToastType): string {\n switch (type) {\n case ToastType.Success:\n return 'check-circle';\n case ToastType.Error:\n return 'x-circle';\n case ToastType.Warning:\n return 'alert-triangle';\n case ToastType.Info:\n return 'info';\n default:\n return EMPTY_STRING;\n }\n }\n\n /**\n * Generate unique ID\n */\n private generateId(): string {\n return `toast-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;\n }\n\n /**\n * Get animation class\n */\n private getAnimationClass(toast: ToastItem): string {\n const isRemoving = toast.removing;\n const suffix = isRemoving ? 'out' : 'in';\n return `toast--${this.animation}-${suffix}`;\n }\n\n /**\n * Emit toast event\n */\n private emitToastEvent(eventName: string, toast: ToastItem, action: ToastEventDetail['action']): void {\n this.dispatchEvent(new CustomEvent<ToastEventDetail>(eventName, {\n detail: { toast, action },\n bubbles: true,\n composed: true\n }));\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n this.clearAll();\n }\n\n override render() {\n return html`\n <div class=\"toast-container\">\n ${repeat(\n this.toasts,\n toast => toast.id,\n toast => this.renderToast(toast)\n )}\n </div>\n `;\n }\n\n private renderToast(toast: ToastItem) {\n const classes = {\n 'toast': true,\n [`toast--${toast.type}`]: true,\n [this.getAnimationClass(toast)]: true,\n [toast.customClass || EMPTY_STRING]: !!toast.customClass,\n };\n\n return html`\n <div\n class=${classMap(classes)}\n @click=${() => this.handleToastClick(toast)}\n role=\"alert\"\n aria-live=\"polite\"\n >\n ${toast.icon ? html`\n <div class=\"toast__icon\">\n <nr-icon name=${toast.icon} size=\"medium\"></nr-icon>\n </div>\n ` : nothing}\n \n <div class=\"toast__content\">\n ${toast.content \n ? toast.content \n : html`\n <div class=\"toast__text\">${toast.text}</div>\n ${toast.button ? this.renderButton(toast.button) : nothing}\n `\n }\n </div>\n \n ${toast.closable ? html`\n <button\n class=\"toast__close\"\n @click=${(e: Event) => this.handleCloseClick(e, toast)}\n aria-label=\"Close notification\"\n type=\"button\"\n >\n <nr-icon name=\"x\" size=\"small\"></nr-icon>\n </button>\n ` : nothing}\n </div>\n `;\n }\n\n private renderButton(button: ToastButton) {\n const handleButtonClick = (e: Event) => {\n e.stopPropagation();\n button.onClick(e);\n };\n\n return html`\n <div class=\"toast__button\">\n <nr-button\n type=${button.type || 'default'}\n size=${button.size || 'small'}\n ?disabled=${button.disabled || false}\n @click=${handleButtonClick}\n >\n ${button.icon ? html`<nr-icon slot=\"icon-left\" name=${button.icon}></nr-icon>` : nothing}\n ${button.label}\n </nr-button>\n </div>\n `;\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"toast.component.js","sourceRoot":"","sources":["../../../../src/components/toast/toast.component.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license\n * Copyright 2023 Nuraly, Laabidi Aymen\n * SPDX-License-Identifier: MIT\n */\n\nimport { LitElement, html, nothing } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { repeat } from 'lit/directives/repeat.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { styles } from './toast.style.js';\nimport { NuralyUIBaseMixin } from '@nuralyui/common/mixins';\nimport {\n ToastType,\n ToastPosition,\n ToastAnimation,\n ToastConfig,\n ToastItem,\n ToastEventDetail,\n ToastButton,\n DEFAULT_TOAST_DURATION,\n DEFAULT_MAX_TOASTS,\n EMPTY_STRING\n} from './toast.types.js';\n\n// Import required components\n\n/**\n * Toast notification component for displaying temporary messages.\n * \n * Provides a flexible notification system with multiple types, positions, and animations.\n * Supports stacking multiple toasts, auto-dismiss (enabled by default), action buttons, \n * custom HTML content, and manual closing.\n * \n * @example\n * ```html\n * <!-- Basic usage with auto-dismiss -->\n * <nr-toast position=\"top-right\"></nr-toast>\n * \n * <!-- Disable auto-dismiss to require manual closing -->\n * <nr-toast position=\"top-right\" auto-dismiss=\"false\"></nr-toast>\n * \n * <!-- Programmatic usage -->\n * <script>\n * const toast = document.querySelector('nr-toast');\n * toast.show({ text: 'Success!', type: 'success' });\n * toast.show({ text: 'Error occurred', type: 'error', duration: 7000 });\n * \n * // Disable auto-dismiss for specific toast\n * toast.show({ text: 'Persistent message', autoDismiss: false });\n * \n * // Toast with action button\n * toast.show({\n * text: 'Item deleted',\n * type: 'success',\n * button: {\n * label: 'Undo',\n * onClick: () => console.log('Undo clicked'),\n * type: 'primary'\n * }\n * });\n * \n * // Custom HTML content (GDPR consent example)\n * toast.show({\n * content: html`\n * <div>\n * <h4>Cookie Consent</h4>\n * <p>We use cookies to improve your experience.</p>\n * <div style=\"display: flex; gap: 0.5rem; margin-top: 0.5rem;\">\n * <nr-button size=\"small\" type=\"primary\">Accept</nr-button>\n * <nr-button size=\"small\" type=\"secondary\">Decline</nr-button>\n * </div>\n * </div>\n * `,\n * autoDismiss: false,\n * closable: true\n * });\n * </script>\n * ```\n * \n * @fires nr-toast-show - Toast shown\n * @fires nr-toast-close - Toast closed\n * @fires nr-toast-click - Toast clicked\n * \n * @cssproperty --nuraly-z-index-toast - Toast z-index\n * @cssproperty --nuraly-toast-default-background - Default toast background\n * @cssproperty --nuraly-toast-success-background - Success toast background\n * @cssproperty --nuraly-toast-error-background - Error toast background\n * @cssproperty --nuraly-toast-warning-background - Warning toast background\n * @cssproperty --nuraly-toast-info-background - Info toast background\n */\n@customElement('nr-toast')\nexport class NrToastElement extends NuralyUIBaseMixin(LitElement) {\n static override styles = styles;\n\n override requiredComponents = ['nr-icon', 'nr-button'];\n\n /** Position of toast container on screen */\n @property({ type: String, reflect: true })\n position: ToastPosition = ToastPosition.TopRight;\n\n /** Maximum number of toasts to display */\n @property({ type: Number })\n maxToasts = DEFAULT_MAX_TOASTS;\n\n /** Default duration for toasts in milliseconds */\n @property({ type: Number })\n defaultDuration = DEFAULT_TOAST_DURATION;\n\n /** Animation type for toasts */\n @property({ type: String })\n animation: ToastAnimation = ToastAnimation.Fade;\n\n /** Whether to stack toasts or replace */\n @property({ type: Boolean })\n stack = true;\n\n /** Auto dismiss toasts after duration (default: true) */\n @property({ type: Boolean })\n autoDismiss = true;\n\n /** Internal state: active toasts */\n @state()\n private toasts: ToastItem[] = [];\n\n /** Timeout map for auto-dismiss */\n private timeouts = new Map<string, number>();\n\n /**\n * Show a new toast notification\n * @param config - Toast configuration\n * @returns Toast ID for manual control\n */\n show(config: string | ToastConfig): string {\n const toastConfig: ToastConfig = typeof config === 'string' \n ? { text: config }\n : config;\n\n const toast: ToastItem = {\n id: this.generateId(),\n timestamp: Date.now(),\n text: toastConfig.text,\n content: toastConfig.content,\n type: toastConfig.type || ToastType.Default,\n duration: toastConfig.duration ?? this.defaultDuration,\n autoDismiss: toastConfig.autoDismiss ?? this.autoDismiss,\n closable: toastConfig.closable ?? true,\n icon: toastConfig.icon || this.getDefaultIcon(toastConfig.type),\n customClass: toastConfig.customClass,\n button: toastConfig.button,\n onClose: toastConfig.onClose,\n onClick: toastConfig.onClick,\n };\n\n // Handle max toasts\n if (!this.stack) {\n this.clearAll();\n } else if (this.toasts.length >= this.maxToasts) {\n this.removeToast(this.toasts[0].id);\n }\n\n // Add toast\n this.toasts = [...this.toasts, toast];\n\n // Emit show event\n this.emitToastEvent('nr-toast-show', toast, 'show');\n\n // Set auto-dismiss timeout\n if (toast.autoDismiss && toast.duration && toast.duration > 0) {\n const timeoutId = window.setTimeout(() => {\n this.removeToast(toast.id);\n }, toast.duration);\n this.timeouts.set(toast.id, timeoutId);\n }\n\n return toast.id;\n }\n\n /**\n * Show success toast\n */\n success(text: string, duration?: number): string {\n return this.show({ text, type: ToastType.Success, duration });\n }\n\n /**\n * Show error toast\n */\n error(text: string, duration?: number): string {\n return this.show({ text, type: ToastType.Error, duration });\n }\n\n /**\n * Show warning toast\n */\n warning(text: string, duration?: number): string {\n return this.show({ text, type: ToastType.Warning, duration });\n }\n\n /**\n * Show info toast\n */\n info(text: string, duration?: number): string {\n return this.show({ text, type: ToastType.Info, duration });\n }\n\n /**\n * Remove a specific toast\n */\n removeToast(id: string): void {\n const toast = this.toasts.find(t => t.id === id);\n if (!toast) return;\n\n // Mark as removing for animation\n toast.removing = true;\n this.requestUpdate();\n\n // Clear timeout\n const timeoutId = this.timeouts.get(id);\n if (timeoutId) {\n clearTimeout(timeoutId);\n this.timeouts.delete(id);\n }\n\n // Remove after animation\n setTimeout(() => {\n this.toasts = this.toasts.filter(t => t.id !== id);\n \n // Emit close event\n this.emitToastEvent('nr-toast-close', toast, 'close');\n \n // Call onClose callback\n toast.onClose?.();\n }, 300); // Animation duration\n }\n\n /**\n * Clear all toasts\n */\n clearAll(): void {\n this.toasts.forEach(toast => {\n const timeoutId = this.timeouts.get(toast.id);\n if (timeoutId) {\n clearTimeout(timeoutId);\n }\n });\n this.timeouts.clear();\n this.toasts = [];\n }\n\n /**\n * Handle toast click\n */\n private handleToastClick(toast: ToastItem): void {\n this.emitToastEvent('nr-toast-click', toast, 'click');\n toast.onClick?.();\n }\n\n /**\n * Handle close button click\n */\n private handleCloseClick(event: Event, toast: ToastItem): void {\n event.stopPropagation();\n this.removeToast(toast.id);\n }\n\n /**\n * Get default icon for toast type\n */\n private getDefaultIcon(type?: ToastType): string {\n switch (type) {\n case ToastType.Success:\n return 'check-circle';\n case ToastType.Error:\n return 'x-circle';\n case ToastType.Warning:\n return 'alert-triangle';\n case ToastType.Info:\n return 'info';\n default:\n return EMPTY_STRING;\n }\n }\n\n /**\n * Generate unique ID\n */\n private generateId(): string {\n return `toast-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;\n }\n\n /**\n * Get animation class\n */\n private getAnimationClass(toast: ToastItem): string {\n const isRemoving = toast.removing;\n const suffix = isRemoving ? 'out' : 'in';\n return `toast--${this.animation}-${suffix}`;\n }\n\n /**\n * Emit toast event\n */\n private emitToastEvent(eventName: string, toast: ToastItem, action: ToastEventDetail['action']): void {\n this.dispatchEvent(new CustomEvent<ToastEventDetail>(eventName, {\n detail: { toast, action },\n bubbles: true,\n composed: true\n }));\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n this.clearAll();\n }\n\n override render() {\n return html`\n <div class=\"toast-container\">\n ${repeat(\n this.toasts,\n toast => toast.id,\n toast => this.renderToast(toast)\n )}\n </div>\n `;\n }\n\n private renderToast(toast: ToastItem) {\n const classes = {\n 'toast': true,\n [`toast--${toast.type}`]: true,\n [this.getAnimationClass(toast)]: true,\n [toast.customClass || EMPTY_STRING]: !!toast.customClass,\n };\n\n return html`\n <div\n class=${classMap(classes)}\n @click=${() => this.handleToastClick(toast)}\n role=\"alert\"\n aria-live=\"polite\"\n >\n ${toast.icon ? html`\n <div class=\"toast__icon\">\n <nr-icon name=${toast.icon} size=\"medium\"></nr-icon>\n </div>\n ` : nothing}\n \n <div class=\"toast__content\">\n ${toast.content \n ? toast.content \n : html`\n <div class=\"toast__text\">${toast.text}</div>\n ${toast.button ? this.renderButton(toast.button) : nothing}\n `\n }\n </div>\n \n ${toast.closable ? html`\n <button\n class=\"toast__close\"\n @click=${(e: Event) => this.handleCloseClick(e, toast)}\n aria-label=\"Close notification\"\n type=\"button\"\n >\n <nr-icon name=\"x\" size=\"small\"></nr-icon>\n </button>\n ` : nothing}\n </div>\n `;\n }\n\n private renderButton(button: ToastButton) {\n const handleButtonClick = (e: Event) => {\n e.stopPropagation();\n button.onClick(e);\n };\n\n return html`\n <div class=\"toast__button\">\n <nr-button\n type=${button.type || 'default'}\n size=${button.size || 'small'}\n ?disabled=${button.disabled || false}\n @click=${handleButtonClick}\n >\n ${button.icon ? html`<nr-icon slot=\"icon-left\" name=${button.icon}></nr-icon>` : nothing}\n ${button.label}\n </nr-button>\n </div>\n `;\n }\n}\n"]}
|
package/toast.style.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"toast.style.js","sourceRoot":"","sources":["
|
|
1
|
+
{"version":3,"file":"toast.style.js","sourceRoot":"","sources":["../../../../src/components/toast/toast.style.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmUxB,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2023 Nuraly, Laabidi Aymen\n * SPDX-License-Identifier: MIT\n */\n\nimport { css } from 'lit';\n\n/**\n * Toast component styles for the Hybrid UI Library\n * Using shared CSS variables from /src/shared/themes/\n * \n * This file contains all the styling for the nr-toast component with\n * clean CSS variable usage without local fallbacks and proper theme switching support.\n */\nexport const styles = css`\n :host {\n display: block;\n position: fixed;\n z-index: var(--nuraly-z-index-toast);\n pointer-events: none;\n \n /* Force CSS custom property inheritance to ensure theme switching works properly */\n color: var(--nuraly-color-text);\n font-family: var(--nuraly-font-family);\n }\n\n /* Container positioning */\n :host([position=\"top-right\"]) {\n top: var(--nuraly-spacing-4);\n right: var(--nuraly-spacing-4);\n }\n\n :host([position=\"top-left\"]) {\n top: var(--nuraly-spacing-4);\n left: var(--nuraly-spacing-4);\n }\n\n :host([position=\"top-center\"]) {\n top: var(--nuraly-spacing-4);\n left: 50%;\n transform: translateX(-50%);\n }\n\n :host([position=\"bottom-right\"]) {\n bottom: var(--nuraly-spacing-4);\n right: var(--nuraly-spacing-4);\n }\n\n :host([position=\"bottom-left\"]) {\n bottom: var(--nuraly-spacing-4);\n left: var(--nuraly-spacing-4);\n }\n\n :host([position=\"bottom-center\"]) {\n bottom: var(--nuraly-spacing-4);\n left: 50%;\n transform: translateX(-50%);\n }\n\n .toast-container {\n display: flex;\n flex-direction: column;\n gap: var(--nuraly-toast-stack-gap);\n min-width: var(--nuraly-toast-min-width);\n max-width: var(--nuraly-toast-max-width);\n }\n\n .toast {\n display: flex;\n align-items: start;\n gap: var(--nuraly-toast-gap);\n padding: var(--nuraly-toast-padding-vertical) var(--nuraly-toast-padding-horizontal);\n background-color: var(--nuraly-color-background);\n color: var(--nuraly-color-text);\n border: 1px solid var(--nuraly-color-border);\n border-radius: var(--nuraly-border-radius-toast);\n box-shadow: var(--nuraly-shadow-toast);\n pointer-events: auto;\n cursor: default;\n transition: all var(--nuraly-transition-fast) ease;\n position: relative;\n overflow: hidden;\n }\n\n .toast:hover {\n box-shadow: var(--nuraly-shadow-toast-hover);\n }\n\n /* Toast type variants */\n .toast--default {\n background-color: var(--nuraly-toast-default-background);\n border-color: var(--nuraly-toast-default-border);\n color: var(--nuraly-toast-default-text);\n }\n\n .toast--success {\n background-color: var(--nuraly-toast-success-background);\n border-color: var(--nuraly-toast-success-border);\n color: var(--nuraly-toast-success-text);\n }\n\n .toast--error {\n background-color: var(--nuraly-toast-error-background);\n border-color: var(--nuraly-toast-error-border);\n color: var(--nuraly-toast-error-text);\n }\n\n .toast--warning {\n background-color: var(--nuraly-toast-warning-background);\n border-color: var(--nuraly-toast-warning-border);\n color: var(--nuraly-toast-warning-text);\n }\n\n .toast--info {\n background-color: var(--nuraly-toast-info-background);\n border-color: var(--nuraly-toast-info-border);\n color: var(--nuraly-toast-info-text);\n }\n\n /* Toast icon */\n .toast__icon {\n flex-shrink: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n margin-top: 0.125rem; /* Slight adjustment for better visual alignment */\n }\n\n .toast__icon nr-icon {\n color: inherit;\n }\n\n /* Toast content */\n .toast__content {\n flex: 1;\n display: flex;\n flex-direction: column;\n gap: var(--nuraly-spacing-2);\n min-width: 0;\n }\n\n .toast__text {\n font-size: var(--nuraly-font-size-sm);\n line-height: 1.5;\n word-break: break-word;\n }\n\n /* Toast button */\n .toast__button {\n display: flex;\n align-items: center;\n margin-top: var(--nuraly-spacing-1);\n }\n\n .toast__button nr-button {\n flex-shrink: 0;\n }\n\n /* Close button */\n .toast__close {\n flex-shrink: 0;\n min-width: var(--nuraly-toast-close-size);\n min-height: var(--nuraly-toast-close-size);\n padding: 0;\n border: none;\n background: transparent;\n color: currentColor;\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: var(--nuraly-border-radius-small);\n transition: all var(--nuraly-transition-fast) ease;\n opacity: var(--nuraly-toast-close-opacity);\n }\n\n .toast__close:hover {\n opacity: var(--nuraly-toast-close-opacity-hover);\n background-color: var(--nuraly-toast-close-hover-background);\n }\n\n .toast__close:focus {\n outline: var(--nuraly-focus-outline);\n outline-offset: var(--nuraly-focus-outline-offset);\n }\n\n .toast__close nr-icon {\n color: inherit;\n }\n\n /* Animations */\n @keyframes toast-fade-in {\n from {\n opacity: 0;\n transform: translateY(-1rem);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n }\n\n @keyframes toast-fade-out {\n from {\n opacity: 1;\n transform: translateY(0);\n }\n to {\n opacity: 0;\n transform: translateY(-1rem);\n }\n }\n\n @keyframes toast-slide-in-right {\n from {\n opacity: 0;\n transform: translateX(100%);\n }\n to {\n opacity: 1;\n transform: translateX(0);\n }\n }\n\n @keyframes toast-slide-out-right {\n from {\n opacity: 1;\n transform: translateX(0);\n }\n to {\n opacity: 0;\n transform: translateX(100%);\n }\n }\n\n @keyframes toast-slide-in-left {\n from {\n opacity: 0;\n transform: translateX(-100%);\n }\n to {\n opacity: 1;\n transform: translateX(0);\n }\n }\n\n @keyframes toast-slide-out-left {\n from {\n opacity: 1;\n transform: translateX(0);\n }\n to {\n opacity: 0;\n transform: translateX(-100%);\n }\n }\n\n @keyframes toast-bounce-in {\n 0% {\n opacity: 0;\n transform: scale(0.3);\n }\n 50% {\n transform: scale(1.05);\n }\n 70% {\n transform: scale(0.9);\n }\n 100% {\n opacity: 1;\n transform: scale(1);\n }\n }\n\n @keyframes toast-bounce-out {\n 0% {\n transform: scale(1);\n }\n 25% {\n transform: scale(0.95);\n }\n 50% {\n opacity: 1;\n transform: scale(1.1);\n }\n 100% {\n opacity: 0;\n transform: scale(0.3);\n }\n }\n\n /* Animation classes */\n .toast--fade-in {\n animation: toast-fade-in var(--nuraly-transition-toast) ease;\n }\n\n .toast--fade-out {\n animation: toast-fade-out var(--nuraly-transition-toast) ease;\n }\n\n .toast--slide-in {\n animation: toast-slide-in-right var(--nuraly-transition-toast) ease;\n }\n\n .toast--slide-out {\n animation: toast-slide-out-right var(--nuraly-transition-toast) ease;\n }\n\n .toast--bounce-in {\n animation: toast-bounce-in var(--nuraly-transition-toast) ease;\n }\n\n .toast--bounce-out {\n animation: toast-bounce-out var(--nuraly-transition-toast) ease;\n }\n\n /* Position-specific slide animations */\n :host([position=\"top-left\"]) .toast--slide-in,\n :host([position=\"bottom-left\"]) .toast--slide-in {\n animation: toast-slide-in-left var(--nuraly-transition-toast) ease;\n }\n\n :host([position=\"top-left\"]) .toast--slide-out,\n :host([position=\"bottom-left\"]) .toast--slide-out {\n animation: toast-slide-out-left var(--nuraly-transition-toast) ease;\n }\n\n /* Progress bar for duration indicator */\n .toast__progress {\n position: absolute;\n bottom: 0;\n left: 0;\n height: var(--nuraly-toast-progress-height);\n background-color: currentColor;\n opacity: var(--nuraly-toast-progress-opacity);\n transition: width linear;\n }\n`;\n"]}
|
package/toast.types.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"toast.types.js","sourceRoot":"","sources":["
|
|
1
|
+
{"version":3,"file":"toast.types.js","sourceRoot":"","sources":["../../../../src/components/toast/toast.types.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAoJH,MAAM,CAAC,MAAM,YAAY,GAAG,EAAE,CAAC;AAC/B,MAAM,CAAC,MAAM,sBAAsB,kCAAuB,CAAC;AAC3D,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAC,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2023 Nuraly, Laabidi Aymen\n * SPDX-License-Identifier: MIT\n */\n\nimport { TemplateResult } from 'lit';\n\n/**\n * Toast type variants\n */\nexport const enum ToastType {\n Default = 'default',\n Success = 'success',\n Error = 'error',\n Warning = 'warning',\n Info = 'info',\n}\n\n/**\n * Toast position on screen\n */\nexport const enum ToastPosition {\n TopRight = 'top-right',\n TopLeft = 'top-left',\n TopCenter = 'top-center',\n BottomRight = 'bottom-right',\n BottomLeft = 'bottom-left',\n BottomCenter = 'bottom-center',\n}\n\n/**\n * Toast animation types\n */\nexport const enum ToastAnimation {\n Fade = 'fade',\n Slide = 'slide',\n Bounce = 'bounce',\n}\n\n/**\n * Predefined duration values in milliseconds\n */\nexport const enum ToastDuration {\n Short = 3000,\n Medium = 5000,\n Long = 7000,\n}\n\n/**\n * Toast action button configuration\n */\nexport interface ToastButton {\n /** Button label text */\n label: string;\n \n /** Button click handler */\n onClick: (event: Event) => void;\n \n /** Button type/variant */\n type?: 'default' | 'primary' | 'secondary' | 'tertiary' | 'danger' | 'ghost';\n \n /** Button size */\n size?: 'small' | 'medium' | 'large';\n \n /** Whether button is disabled */\n disabled?: boolean;\n \n /** Icon name for button */\n icon?: string;\n}\n\n/**\n * Individual toast configuration\n */\nexport interface ToastConfig {\n /** Toast message text */\n text?: string;\n \n /** Custom HTML content (overrides text) */\n content?: TemplateResult;\n \n /** Toast type/variant */\n type?: ToastType;\n \n /** Duration in milliseconds */\n duration?: number;\n \n /** Auto dismiss after duration (default: true) */\n autoDismiss?: boolean;\n \n /** Show close button */\n closable?: boolean;\n \n /** Icon name to display */\n icon?: string;\n \n /** Custom CSS class */\n customClass?: string;\n \n /** Action button configuration */\n button?: ToastButton;\n \n /** Callback when toast is closed */\n onClose?: () => void;\n \n /** Callback when toast is clicked */\n onClick?: () => void;\n}\n\n/**\n * Internal toast item with metadata\n */\nexport interface ToastItem extends ToastConfig {\n /** Unique identifier */\n id: string;\n \n /** Creation timestamp */\n timestamp: number;\n \n /** Whether toast is being removed */\n removing?: boolean;\n}\n\n/**\n * Toast container configuration\n */\nexport interface ToastContainerConfig {\n /** Position on screen */\n position?: ToastPosition;\n \n /** Maximum number of toasts to show */\n maxToasts?: number;\n \n /** Default duration */\n defaultDuration?: number;\n \n /** Animation type */\n animation?: ToastAnimation;\n \n /** Stack toasts or replace */\n stack?: boolean;\n}\n\n/**\n * Toast event detail\n */\nexport interface ToastEventDetail {\n toast: ToastItem;\n action: 'show' | 'close' | 'click';\n}\n\nexport const EMPTY_STRING = '';\nexport const DEFAULT_TOAST_DURATION = ToastDuration.Medium;\nexport const DEFAULT_MAX_TOASTS = 5;\n"]}
|