@mgremy/ng-primitives 0.5.0 → 0.6.0

package/fesm2022/mgremy-ng-primitives-toast.mjs

@@ -0,0 +1,34 @@
+import * as i0 from '@angular/core';
+import { inject, Directive } from '@angular/core';
+import { NgpToast } from 'ng-primitives/toast';
+
+const options = ['ngpToast'];
+const error = new Error(`MgnpToast must be used with ${options.join(' / ')}`);
+class MgnpToast {
+    ngpToast = inject(NgpToast, { optional: true });
+    constructor() {
+        if (!this.ngpToast) {
+            console.error(this);
+            throw error;
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MgnpToast, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.1", type: MgnpToast, isStandalone: true, selector: "[ngpToast][mgnpToast]", host: { attributes: { "data-mgnp-component": "mgnp-toast" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MgnpToast, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[ngpToast][mgnpToast]',
+                    standalone: true,
+                    host: {
+                        'data-mgnp-component': 'mgnp-toast'
+                    },
+                }]
+        }], ctorParameters: () => [] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { MgnpToast };
+//# sourceMappingURL=mgremy-ng-primitives-toast.mjs.map

package/fesm2022/mgremy-ng-primitives-toast.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"mgremy-ng-primitives-toast.mjs","sources":["../../../../libs/ng-primitives/toast/src/lib/mgnp-toast/mgnp-toast.directive.ts","../../../../libs/ng-primitives/toast/src/mgremy-ng-primitives-toast.ts"],"sourcesContent":["import { Directive, inject } from '@angular/core';\nimport { NgpToast } from 'ng-primitives/toast';\n\nconst options = ['ngpToast'];\n\nconst error = new Error(`MgnpToast must be used with ${options.join(' / ')}`);\n\n@Directive({\n  selector: '[ngpToast][mgnpToast]',\n  standalone: true,\n  host: {\n    'data-mgnp-component': 'mgnp-toast'\n  },\n})\nexport class MgnpToast {\n  protected readonly ngpToast = inject(NgpToast, { optional: true });\n\n  constructor() {\n    if (!this.ngpToast) {\n      console.error(this);\n      throw error;\n    }\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;AAGA,MAAM,OAAO,GAAG,CAAC,UAAU,CAAC;AAE5B,MAAM,KAAK,GAAG,IAAI,KAAK,CAAC,CAAA,4BAAA,EAA+B,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA,CAAE,CAAC;MAShE,SAAS,CAAA;IACD,QAAQ,GAAG,MAAM,CAAC,QAAQ,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;AAElE,IAAA,WAAA,GAAA;AACE,QAAA,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;AAClB,YAAA,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC;AACnB,YAAA,MAAM,KAAK;QACb;IACF;uGARW,SAAS,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAAT,SAAS,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,uBAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,qBAAA,EAAA,YAAA,EAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;2FAAT,SAAS,EAAA,UAAA,EAAA,CAAA;kBAPrB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,uBAAuB;AACjC,oBAAA,UAAU,EAAE,IAAI;AAChB,oBAAA,IAAI,EAAE;AACJ,wBAAA,qBAAqB,EAAE;AACxB,qBAAA;AACF,iBAAA;;;ACbD;;AAEG;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mgremy/ng-primitives",
-  "version": "0.5.0",
+  "version": "0.6.0",
   "license": "Apache-2.0",
   "homepage": "https://doc.mgremy.xyz/ng-primitives",
   "publishConfig": {
@@ -62,6 +62,10 @@
       "types": "./types/mgremy-ng-primitives-table.d.ts",
       "default": "./fesm2022/mgremy-ng-primitives-table.mjs"
     },
+    "./toast": {
+      "types": "./types/mgremy-ng-primitives-toast.d.ts",
+      "default": "./fesm2022/mgremy-ng-primitives-toast.mjs"
+    },
     "./tooltip": {
       "types": "./types/mgremy-ng-primitives-tooltip.d.ts",
       "default": "./fesm2022/mgremy-ng-primitives-tooltip.mjs"

package/theme/components/accordion.css

@@ -11,7 +11,7 @@
 @utility mgnp-accordion-content {
   overflow: hidden;
   font-size: --spacing(3.5);
-  color: var(--ngo-text-secondary);
+  color: var(--ngp-text-secondary);
 
   @variant data-open {
     animation: accordion-show var(--default-transition-duration) var(--default-transition-timing-function) forwards;
@@ -61,6 +61,10 @@
     color: var(--ngp-text-secondary);
   }
 
+  ng-icon {
+    transition: transform var(--default-transition-duration) var(--default-transition-timing-function);
+  }
+
   @variant data-open {
     ng-icon {
       transform: rotate(180deg);
@@ -70,19 +74,19 @@
 
 @layer base {
   [mgnpAccordion][data-mgnp-component='mgnp-accordion'] {
-    @apply mgnp-accordion;
+    @apply mgnp-accordion transition;
   }
 
   [mgnpAccordionContent][data-mgnp-component='mgnp-accordion-content'] {
-    @apply mgnp-accordion-content;
+    @apply mgnp-accordion-content transition;
   }
 
   [mgnpAccordionItem][data-mgnp-component='mgnp-accordion-item'] {
-    @apply mgnp-accordion-item;
+    @apply mgnp-accordion-item transition;
   }
 
   [ngpAccordionTrigger][mgnpButton][data-mgnp-component='mgnp-button'] {
-    @apply mgnp-accordion-trigger;
+    @apply mgnp-accordion-trigger transition;
   }
 }
 

package/theme/components/button.css

@@ -120,6 +120,10 @@
         --ngp-background: var(--mg-background-ui-inverse);
         --ngp-text-primary: var(--mg-text-inverse);
       }
+
+      @variant data-press {
+        --ngp-background: var(--mg-background-ui-inverse-active);
+      }
     }
 
     @variant data-[mgnp-color=primary] {
@@ -130,6 +134,10 @@
       @variant data-hover {
         --ngp-background: var(--mg-background-primary);
       }
+
+      @variant data-press {
+        --ngp-background: var(--mg-background-primary-inverse-active);
+      }
     }
 
     @variant data-[mgnp-color=secondary] {
@@ -140,6 +148,10 @@
       @variant data-hover {
         --ngp-background: var(--mg-background-secondary);
       }
+
+      @variant data-press {
+        --ngp-background: var(--mg-background-secondary-inverse-active);
+      }
     }
 
     @variant data-[mgnp-color=info] {
@@ -150,6 +162,10 @@
       @variant data-hover {
         --ngp-background: var(--mg-background-info);
       }
+
+      @variant data-press {
+        --ngp-background: var(--mg-background-info-inverse-active);
+      }
     }
 
     @variant data-[mgnp-color=success] {
@@ -160,6 +176,10 @@
       @variant data-hover {
         --ngp-background: var(--mg-background-success);
       }
+
+      @variant data-press {
+        --ngp-background: var(--mg-background-success-inverse-active);
+      }
     }
 
     @variant data-[mgnp-color=warning] {
@@ -170,6 +190,10 @@
       @variant data-hover {
         --ngp-background: var(--mg-background-warning);
       }
+
+      @variant data-press {
+        --ngp-background: var(--mg-background-warning-inverse-active);
+      }
     }
 
     @variant data-[mgnp-color=danger] {
@@ -180,12 +204,16 @@
       @variant data-hover {
         --ngp-background: var(--mg-background-danger);
       }
+
+      @variant data-press {
+        --ngp-background: var(--mg-background-danger-inverse-active);
+      }
     }
   }
 }
 
 @layer base {
   [mgnpButton][data-mgnp-component='mgnp-button'] {
-    @apply mgnp-button;
+    @apply mgnp-button transition;
   }
 }

package/theme/components/combobox.css

@@ -103,23 +103,23 @@
 
 @layer base {
   [mgnpCombobox][data-mgnp-component='mgnp-combobox'] {
-    @apply mgnp-combobox;
+    @apply mgnp-combobox transition;
   }
 
   [mgnpComboboxInput][data-mgnp-component='mgnp-combobox-input'] {
-    @apply mgnp-combobox-input;
+    @apply mgnp-combobox-input transition;
   }
 
   [ngpComboboxButton][mgnpButton][data-mgnp-component='mgnp-button'] {
-    @apply mgnp-combobox-button;
+    @apply mgnp-combobox-button transition;
   }
 
   [mgnpComboboxDropdown][data-mgnp-component='mgnp-combobox-dropdown'] {
-    @apply mgnp-combobox-dropdown;
+    @apply mgnp-combobox-dropdown transition;
   }
 
   [mgnpComboboxOption][data-mgnp-component='mgnp-combobox-option'] {
-    @apply mgnp-combobox-option;
+    @apply mgnp-combobox-option transition;
   }
 }
 

package/theme/components/input.css

@@ -21,6 +21,6 @@
 
 @layer base {
   [mgnpInput][data-mgnp-component='mgnp-input'] {
-    @apply mgnp-input;
+    @apply mgnp-input transition;
   }
 }

package/theme/components/menu.css

@@ -52,11 +52,11 @@
 
 @layer base {
   [mgnpMenu][data-mgnp-component='mgnp-menu'] {
-    @apply mgnp-menu;
+    @apply mgnp-menu transition;
   }
 
   [mgnpMenuItem][data-mgnp-component='mgnp-menu-item'] {
-    @apply mgnp-menu-item;
+    @apply mgnp-menu-item transition;
   }
 }
 

package/theme/components/pagination.css

@@ -4,65 +4,69 @@
     align-items: center;
     gap: --spacing(2);
   }
+}
 
-  [ngpPaginationFirst],
-  [ngpPaginationPrevious],
-  [ngpPaginationButton],
-  [ngpPaginationNext],
-  [ngpPaginationLast] {
-    all: unset;
-    display: flex;
-    cursor: pointer;
-    align-items: center;
-    justify-content: center;
-    outline-style: none;
-    width: --spacing(8);
-    height: --spacing(8);
-    border-radius: var(--radius-lg);
-    font-size: var(--text-sm);
-    font-weight: var(--font-weight-medium);
-    background-color: var(--ngp-background);
-    color: var(--ngp-text-primary);
-    box-shadow: var(--ngp-button-shadow);
+@utility mgnp-pagination-button {
+  all: unset;
+  display: flex;
+  cursor: pointer;
+  align-items: center;
+  justify-content: center;
+  outline-style: none;
+  width: --spacing(8);
+  height: --spacing(8);
+  border-radius: var(--radius-lg);
+  font-size: var(--text-sm);
+  font-weight: var(--font-weight-medium);
+  background-color: var(--ngp-background);
+  color: var(--ngp-text-primary);
+  box-shadow: var(--ngp-button-shadow);
 
-    @variant data-hover {
-      @variant not-data-disabled {
-        @variant not-data-selected {
-          background-color: var(--ngp-background-hover);
-        }
+  @variant data-hover {
+    @variant not-data-disabled {
+      @variant not-data-selected {
+        background-color: var(--ngp-background-hover);
       }
     }
+  }
 
-    @variant data-focus-visible {
-      @variant not-data-disabled {
-        outline: 2px solid var(--ngp-focus-ring);
-      }
+  @variant data-focus-visible {
+    @variant not-data-disabled {
+      outline: 2px solid var(--ngp-focus-ring);
     }
+  }
 
-    @variant data-press {
-      @variant not-data-disabled {
-        @variant not-data-selected {
-          background-color: var(--ngp-background-active);
-        }
+  @variant data-press {
+    @variant not-data-disabled {
+      @variant not-data-selected {
+        background-color: var(--ngp-background-active);
       }
     }
+  }
 
-    @variant data-disabled {
-      cursor: not-allowed;
-      color: #d2d2d2;
-      box-shadow: none;
-      background-color: var(--ngp-background-disabled);
-    }
+  @variant data-disabled {
+    cursor: not-allowed;
+    color: #d2d2d2;
+    box-shadow: none;
+    background-color: var(--ngp-background-disabled);
+  }
 
-    @variant data-selected {
-      background-color: var(--ngp-background-inverse);
-      color: var(--ngp-text-inverse);
-    }
+  @variant data-selected {
+    background-color: var(--ngp-background-inverse);
+    color: var(--ngp-text-inverse);
   }
 }
 
 @layer base {
   [ngpPagination][data-mgnp-component='mgnp-pagination'] {
-    @apply mgnp-pagination;
+    @apply mgnp-pagination transition;
+
+    [ngpPaginationFirst],
+    [ngpPaginationPrevious],
+    [ngpPaginationButton],
+    [ngpPaginationNext],
+    [ngpPaginationLast] {
+      @apply mgnp-pagination-button transition;
+    }
   }
 }

package/theme/components/toast.css

@@ -0,0 +1,124 @@
+@utility mgnp-toast {
+  position: absolute;
+  touch-action: none;
+  box-sizing: border-box;
+  display: inline-flex;
+  align-items: center;
+  justify-content: space-between;
+  height: fit-content;
+  padding: --spacing(3) --spacing(4);
+  border-radius: --spacing(2);
+  width: --spacing(87.5);
+  border: 1px solid var(--ngp-border);
+  background: var(--ngp-background);
+  box-shadow: var(--ngp-shadow);
+  z-index: var(--ngp-toast-z-index);
+  transform: var(--y);
+
+  @variant data-enter {
+    opacity: 1;
+    --y: translateY(0);
+    animation: toast-slide-in var(--default-transition-duration) var(--default-transition-timing-function);
+  }
+
+  @variant data-exit {
+    opacity: 0;
+    transform: translateY(100%);
+    transition:
+      opacity var(--default-transition-duration) var(--default-transition-timing-function),
+      transform var(--default-transition-duration) var(--default-transition-timing-function);
+    --y: translateY(calc(calc(var(--lift) * var(--ngp-toast-gap)) * -1));
+  }
+
+  @variant data-[visible=false] {
+    opacity: 0;
+    pointer-events: none;
+  }
+
+  @variant data-[position-x=end] {
+    right: 0;
+  }
+
+  @variant data-[position-x=start] {
+    left: 0;
+  }
+
+  @variant data-[position-y=top] {
+    top: 0;
+    --lift: 1;
+    --lift-amount: calc(var(--lift) * var(--ngp-toast-gap));
+  }
+
+  @variant data-[position-y=bottom] {
+    bottom: 0;
+    --lift: -1;
+    --lift-amount: calc(var(--lift) * var(--ngp-toast-gap));
+  }
+
+  @variant data-[expanded=true] {
+    --y: translateY(calc(var(--lift) * var(--ngp-toast-offset)));
+    height: auto;
+
+    ::after {
+      content: '';
+      position: absolute;
+      left: 0;
+      height: calc(var(--ngp-toast-gap) + 1px);
+      bottom: 100%;
+      width: 100%;
+    }
+  }
+
+  @variant data-[expanded=false] {
+    @variant data-[front=false] {
+      --scale: var(--ngp-toasts-before) * 0.05 + 1;
+      --y: translateY(calc(var(--lift-amount) * var(--ngp-toasts-before)))
+        scale(calc(-1 * var(--scale)));
+      height: var(--ngp-toast-front-height);
+    }
+  }
+
+  @variant data-[swiping=true] {
+    transform: var(--y) translateY(var(--ngp-toast-swipe-amount-y, 0))
+      translateX(var(--ngp-toast-swipe-amount-x, 0));
+
+    @variant data-[swipe-direction=left] {
+      /* Fade out from -45px to -100px swipe */
+      opacity: calc(1 - clamp(0, ((-1 * var(--ngp-toast-swipe-x, 0px)) - 45) / 55, 1));
+    }
+
+    @variant data-[swipe-direction=right] {
+      /* Fade out from 45px to 100px swipe */
+      opacity: calc(1 - clamp(0, (var(--ngp-toast-swipe-x, 0px) - 45) / 55, 1));
+    }
+
+    @variant data-[swipe-direction=top] {
+      /* Fade out from -45px to -100px swipe */
+      opacity: calc(1 - clamp(0, ((-1 * var(--ngp-toast-swipe-y, 0px)) - 45) / 55, 1));
+    }
+
+    @variant data-[swipe-direction=bottom] {
+      /* Fade out from 45px to 100px swipe */
+      opacity: calc(1 - clamp(0, (var(--ngp-toast-swipe-y, 0px) - 45) / 55, 1));
+    }
+  }
+}
+
+@layer base {
+  [mgnpToast][data-mgnp-component='mgnp-toast'] {
+    @apply mgnp-toast transition;
+  }
+}
+
+@theme {
+  @keyframes toast-slide-in {
+    from {
+      opacity: 0;
+      transform: translateY(100%);
+    }
+    to {
+      opacity: 1;
+      transform: translateY(0);
+    }
+  }
+}

package/theme/components/tooltip.css

@@ -37,11 +37,11 @@
 
 @layer base {
   [mgnpTooltip][data-mgnp-component='mgnp-tooltip'] {
-    @apply mgnp-tooltip;
+    @apply mgnp-tooltip transition;
   }
 
   [mgnpTooltipArrow][data-mgnp-component='mgnp-tooltip-arrow'] {
-    @apply mgnp-tooltip-arrow;
+    @apply mgnp-tooltip-arrow transition;
   }
 }
 

package/theme/mgnp.css

@@ -11,42 +11,49 @@
   --mg-background-ui-hover: var(--color-stone-100);
   --mg-background-ui-active: var(--color-stone-200);
   --mg-background-ui-inverse: var(--color-stone-900);
+  --mg-background-ui-inverse-active: var(--color-stone-700);
   --mg-background-ui-disabled: var(--color-stone-100);
   /* Primary */
   --mg-background-primary: var(--color-blue-400);
   --mg-background-primary-hover: var(--color-blue-500);
   --mg-background-primary-active: var(--color-blue-600);
   --mg-background-primary-inverse: var(--color-blue-900);
+  --mg-background-primary-inverse-active: var(--color-blue-700);
   --mg-background-primary-disabled: var(--color-blue-100);
   /* Secondary */
   --mg-background-secondary: var(--color-emerald-400);
   --mg-background-secondary-hover: var(--color-emerald-500);
   --mg-background-secondary-active: var(--color-emerald-600);
   --mg-background-secondary-inverse: var(--color-emerald-900);
+  --mg-background-secondary-inverse-active: var(--color-emerald-700);
   --mg-background-secondary-disabled: var(--color-emerald-100);
   /* Info */
   --mg-background-info: var(--color-blue-400);
   --mg-background-info-hover: var(--color-blue-500);
   --mg-background-info-active: var(--color-blue-600);
   --mg-background-info-inverse: var(--color-blue-900);
+  --mg-background-info-inverse-active: var(--color-blue-700);
   --mg-background-info-disabled: var(--color-blue-100);
   /* Success */
   --mg-background-success: var(--color-green-400);
   --mg-background-success-hover: var(--color-green-500);
   --mg-background-success-active: var(--color-green-600);
   --mg-background-success-inverse: var(--color-green-900);
+  --mg-background-success-inverse-active: var(--color-green-700);
   --mg-background-success-disabled: var(--color-green-100);
   /* Warning */
   --mg-background-warning: var(--color-yellow-400);
   --mg-background-warning-hover: var(--color-yellow-500);
   --mg-background-warning-active: var(--color-yellow-600);
   --mg-background-warning-inverse: var(--color-yellow-900);
+  --mg-background-warning-inverse-active: var(--color-yellow-700);
   --mg-background-warning-disabled: var(--color-yellow-100);
   /* Danger */
   --mg-background-danger: var(--color-red-400);
   --mg-background-danger-hover: var(--color-red-500);
   --mg-background-danger-active: var(--color-red-600);
   --mg-background-danger-inverse: var(--color-red-900);
+  --mg-background-danger-inverse-active: var(--color-red-700);
   --mg-background-danger-disabled: var(--color-red-100);
 
   /* Border */
@@ -138,6 +145,7 @@
   --background-color-ui-hover: var(--mg-background-ui-hover);
   --background-color-ui-active: var(--mg-background-ui-active);
   --background-color-ui-inverse: var(--mg-background-ui-inverse);
+  --background-color-ui-inverse-active: var(--mg-background-ui-inverse-active);
   --background-color-ui-disabled: var(--mg-background-ui-disabled);
   /* Primary */
   --background-color-primary: var(--mg-background-primary);
@@ -296,42 +304,49 @@
     --mg-background-ui-hover: var(--color-stone-800);
     --mg-background-ui-active: var(--color-stone-700);
     --mg-background-ui-inverse: var(--color-stone-50);
+    --mg-background-ui-inverse-active: var(--color-stone-200);
     --mg-background-ui-disabled: var(--color-stone-900);
     /* Primary */
     --mg-background-primary: var(--color-blue-900);
     --mg-background-primary-hover: var(--color-blue-800);
     --mg-background-primary-active: var(--color-blue-700);
     --mg-background-primary-inverse: var(--color-blue-50);
+    --mg-background-primary-inverse-active: var(--color-blue-600);
     --mg-background-primary-disabled: var(--color-blue-900);
     /* Secondary */
     --mg-background-secondary: var(--color-emerald-900);
     --mg-background-secondary-hover: var(--color-emerald-800);
     --mg-background-secondary-active: var(--color-emerald-700);
     --mg-background-secondary-inverse: var(--color-emerald-50);
+    --mg-background-secondary-inverse-active: var(--color-emerald-600);
     --mg-background-secondary-disabled: var(--color-emerald-900);
     /* Info */
     --mg-background-info: var(--color-blue-900);
     --mg-background-info-hover: var(--color-blue-800);
     --mg-background-info-active: var(--color-blue-700);
     --mg-background-info-inverse: var(--color-blue-50);
+    --mg-background-info-inverse-active: var(--color-blue-600);
     --mg-background-info-disabled: var(--color-blue-900);
     /* Success */
     --mg-background-success: var(--color-green-900);
     --mg-background-success-hover: var(--color-green-800);
     --mg-background-success-active: var(--color-green-700);
     --mg-background-success-inverse: var(--color-green-50);
+    --mg-background-success-inverse-active: var(--color-green-600);
     --mg-background-success-disabled: var(--color-green-900);
     /* Warning */
     --mg-background-warning: var(--color-yellow-900);
     --mg-background-warning-hover: var(--color-yellow-800);
     --mg-background-warning-active: var(--color-yellow-700);
     --mg-background-warning-inverse: var(--color-yellow-50);
+    --mg-background-warning-inverse-active: var(--color-yellow-600);
     --mg-background-warning-disabled: var(--color-yellow-900);
     /* Danger */
     --mg-background-danger: var(--color-red-900);
     --mg-background-danger-hover: var(--color-red-800);
     --mg-background-danger-active: var(--color-red-700);
     --mg-background-danger-inverse: var(--color-red-50);
+    --mg-background-danger-inverse-active: var(--color-red-600);
     --mg-background-danger-disabled: var(--color-red-900);
 
     --mg-background-avatar: rgb(24, 24, 27);

package/theme/ngp_tw.css

@@ -5,6 +5,7 @@
 @import './components/loader.css';
 @import './components/menu.css';
 @import './components/pagination.css';
+@import './components/toast.css';
 @import './components/tooltip.css';
 
 @theme {

package/toast/README.md

@@ -0,0 +1,4 @@
+# @mgremy/ng-primitives/src/lib/toast
+
+Secondary entry point of `@mgremy/ng-primitives`. It can be used by importing from
+`@mgremy/ng-primitives/toast`.

package/types/mgremy-ng-primitives-toast.d.ts

@@ -0,0 +1,11 @@
+import { NgpToast } from 'ng-primitives/toast';
+import * as i0 from '@angular/core';
+
+declare class MgnpToast {
+    protected readonly ngpToast: NgpToast | null;
+    constructor();
+    static ɵfac: i0.ɵɵFactoryDeclaration<MgnpToast, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MgnpToast, "[ngpToast][mgnpToast]", never, {}, {}, never, never, true, never>;
+}
+
+export { MgnpToast };