@recursyve/nice-ui-kit.v2 18.0.0-beta.144 → 20.0.0-beta.146

package/package.json

@@ -1,12 +1,10 @@
 {
   "name": "@recursyve/nice-ui-kit.v2",
-  "version": "18.0.0-beta.144",
+  "version": "20.0.0-beta.146",
   "exports": {
     ".": {
       "sass": "./_index.scss",
       "types": "./index.d.ts",
-      "esm2022": "./esm2022/recursyve-nice-ui-kit.v2.mjs",
-      "esm": "./esm2022/recursyve-nice-ui-kit.v2.mjs",
       "default": "./fesm2022/recursyve-nice-ui-kit.v2.mjs"
     },
     "./package.json": {
@@ -14,13 +12,13 @@
     }
   },
   "peerDependencies": {
-    "@angular/cdk": "^18.0.0",
-    "@angular/common": "^18.0.0",
-    "@angular/core": "^18.0.0",
-    "@angular/forms": "^18.0.0",
-    "@angular/material": "^18.0.0",
-    "@recursyve/ngx-form-generator": ">= 18.0.0-beta.50",
-    "ngx-mask": "^18.0.0",
+    "@angular/cdk": "^20.0.0",
+    "@angular/common": "^20.0.0",
+    "@angular/core": "^20.0.0",
+    "@angular/forms": "^20.0.0",
+    "@angular/material": "^20.0.0",
+    "@recursyve/ngx-form-generator": ">= 20.0.0-beta.50",
+    "ngx-mask": "^20.0.0",
     "perfect-scrollbar": "^1.5.5",
     "uuid": ">= 9.0.0"
   },

package/src/lib/components/base-form/base-form.theme.scss

@@ -1,7 +1,8 @@
+@use "sass:map";
 @use "@angular/material" as mat;
 
 @mixin nice-base-form-theme($theme) {
-    $accent: map-get($theme, accent);
+    $accent: map.get($theme, accent);
 
     .nice-form {
         .mat-step-icon-selected {

package/src/lib/components/chip-list/chip-list.theme.scss

@@ -1,8 +1,8 @@
 @use "../../nice.utils" as nice;
-@import "components/item-list/item-list.theme";
+@use "./components/item-list/item-list.theme" as item;
 
 @mixin nice-chip-list-theme($theme) {
-    @include nice-item-list-theme($theme);
+    @include item.nice-item-list-theme($theme);
 
     nice-chip-list {
         @apply w-full;

package/src/lib/components/date-range-picker/date-range-picker.theme.scss

@@ -1,9 +1,10 @@
+@use "sass:map";
 @use "@angular/material" as mat;
 
 @mixin nice-date-picker-theme($theme) {
-    $accent: map-get($theme, accent);
-    $background: map-get($theme, background);
-    $foreground: map-get($theme, foreground);
+    $accent: map.get($theme, accent);
+    $background: map.get($theme, background);
+    $foreground: map.get($theme, foreground);
 
     mat-calendar.nice-date-range-picker {
         .mat-calendar-body-in-range::before {
@@ -15,7 +16,7 @@
         .from-to {
             @apply flex;
 
-            color: map-get($foreground, text);
+            color: map.get($foreground, text);
         }
 
         .nice-date-picker-container {
@@ -32,7 +33,7 @@
     }
 
     nice-range-preset {
-        background-color: map-get($background, background);
+        background-color: map.get($background, background);
 
         button {
             .mat-button-focus-overlay {

package/src/lib/components/horizontal-stepper/horizontal-stepper.theme.scss

@@ -1,8 +1,9 @@
+@use "sass:map";
 @use "@angular/material" as mat;
 
 @mixin nice-horizontal-stepper-theme($theme) {
-    $primary: map-get($theme, primary);
-    $accent: map-get($theme, accent);
+    $primary: map.get($theme, primary);
+    $accent: map.get($theme, accent);
 
     nice-horizontal-stepper {
         .step {

package/src/lib/components/navigation/vertical/vertical.theme.scss

@@ -1,13 +1,13 @@
-@import "./styles/appearances/default.theme";
-@import "./styles/appearances/compact.theme";
-@import "./styles/appearances/dense.theme";
-@import "./styles/appearances/thin.theme";
+@use "./styles/appearances/default.theme" as default;
+@use "./styles/appearances/compact.theme" as compact;
+@use "./styles/appearances/dense.theme" as dense;
+@use "./styles/appearances/thin.theme" as thin;
 
 @mixin nice-vertical-navigation-theme() {
-    @include nice-vertical-navigation-default-theme();
-    @include nice-vertical-navigation-compact-theme();
-    @include nice-vertical-navigation-dense-theme();
-    @include nice-vertical-navigation-thin-theme();
+    @include default.nice-vertical-navigation-default-theme();
+    @include compact.nice-vertical-navigation-compact-theme();
+    @include dense.nice-vertical-navigation-dense-theme();
+    @include thin.nice-vertical-navigation-thin-theme();
 
     .nice-vertical-navigation-item-tooltips {
         background-color: var(--nice-bg-tooltip);

package/src/lib/components/toggle-button-group/toggle-button-group.theme.scss

@@ -1,15 +1,16 @@
+@use "sass:map";
 @use "@angular/material" as mat;
 
 @mixin nice-toggle-button-group-theme($theme) {
-    $background: map-get($theme, background);
-    $foreground: map-get($theme, foreground);
-    $accent: map-get($theme, accent);
-    $primary: map-get($theme, primary);
-    $warn: map-get($theme, warn);
+    $background: map.get($theme, background);
+    $foreground: map.get($theme, foreground);
+    $accent: map.get($theme, accent);
+    $primary: map.get($theme, primary);
+    $warn: map.get($theme, warn);
 
     nice-toggle-button-group {
         .toggle-button-group {
-            background-color: map-get($background, status-bar);
+            background-color: map.get($background, status-bar);
 
             .toggle-button {
                 &.selected {
@@ -33,7 +34,7 @@
                 }
 
                 .toggle-button-inner {
-                    color: map-get($foreground, disabled);
+                    color: map.get($foreground, disabled);
                 }
             }
         }

package/src/lib/nice.theme.scss

@@ -4,32 +4,32 @@
 /** Configure the Angular Material density **/
 // @include all-component-densities(-2);
 
-@import "./components/alert/alert.theme";
-@import "./components/assets-carousel/assets-carousel.theme";
-@import "./components/base-form/base-form.theme";
-@import "./components/card/card.theme";
-@import "./components/collapsable/collapsable.theme";
-@import "./components/date-range-picker/date-range-picker.theme";
-@import "./components/drawer/drawer.theme";
-@import "./components/horizontal-stepper/horizontal-stepper.theme";
-@import "./components/navigation/horizontal/horizontal.theme";
-@import "./components/navigation/vertical/vertical.theme";
-@import "./components/toggle-button-group/toggle-button-group.theme";
-@import "./components/chip-list/chip-list.theme";
-@import "./directives/chip-list/chip-list-items/chip-list-items.theme";
+@use "./components/alert/alert.theme" as alert;
+@use "./components/assets-carousel/assets-carousel.theme" as assets-carousel;
+@use "./components/base-form/base-form.theme" as base-form;
+@use "./components/card/card.theme" as card;
+@use "./components/collapsable/collapsable.theme" as collapsable;
+@use "./components/date-range-picker/date-range-picker.theme" as date-range-picker;
+@use "./components/drawer/drawer.theme" as drawer;
+@use "./components/horizontal-stepper/horizontal-stepper.theme" as horizontal-stepper;
+@use "./components/navigation/horizontal/horizontal.theme" as horizontal-navigation;
+@use "./components/navigation/vertical/vertical.theme" as vertical-navigation;
+@use "./components/toggle-button-group/toggle-button-group.theme" as toggle-button-group;
+@use "./components/chip-list/chip-list.theme" as chip-list;
+@use "./directives/chip-list/chip-list-items/chip-list-items.theme" as chip-list-items;
 
 @mixin nice-components-theme($theme) {
-    @include nice-alert-theme($theme);
-    @include nice-assets-carousel-theme($theme);
-    @include nice-base-form-theme($theme);
-    @include nice-card-theme($theme);
-    @include nice-collapsable-theme($theme);
-    @include nice-date-picker-theme($theme);
-    @include nice-drawer-theme($theme);
-    @include nice-horizontal-stepper-theme($theme);
-    @include nice-toggle-button-group-theme($theme);
-    @include nice-chip-list-theme($theme);
-    @include nice-chip-list-items-theme($theme);
+    @include alert.nice-alert-theme($theme);
+    @include assets-carousel.nice-assets-carousel-theme($theme);
+    @include base-form.nice-base-form-theme($theme);
+    @include card.nice-card-theme($theme);
+    @include collapsable.nice-collapsable-theme($theme);
+    @include date-range-picker.nice-date-picker-theme($theme);
+    @include drawer.nice-drawer-theme($theme);
+    @include horizontal-stepper.nice-horizontal-stepper-theme($theme);
+    @include toggle-button-group.nice-toggle-button-group-theme($theme);
+    @include chip-list.nice-chip-list-theme($theme);
+    @include chip-list-items.nice-chip-list-items-theme($theme);
 }
 
 @mixin nice-custom-theme($theme) {
@@ -67,8 +67,8 @@
             thead {
                 tr {
                     th {
-                        color: map-get($foreground, secondary-text);
-                        border-bottom: 1px solid map-get($foreground, divider);
+                        color: map.get($foreground, secondary-text);
+                        border-bottom: 1px solid map.get($foreground, divider);
                     }
                 }
             }
@@ -76,7 +76,7 @@
             tbody {
                 tr {
                     td {
-                        border-bottom: 1px solid map-get($foreground, divider);
+                        border-bottom: 1px solid map.get($foreground, divider);
                     }
                 }
             }
@@ -206,83 +206,73 @@ $palettes: ();
     set. We can just create one light and one dark theme and then switch the
     CSS Custom Properties to dynamically switch the colors. */
 @function nice-light-theme() {
+    $typography: mat.m2-define-typography-config(
+            $font-family: theme('fontFamily.sans'),
+            $headline-1: mat.m2-define-typography-level(1.875rem, 2.25rem, 800, theme('fontFamily.sans')),
+            $headline-2: mat.m2-define-typography-level(1.25rem, 1.75rem, 700, theme('fontFamily.sans')),
+            $headline-3: mat.m2-define-typography-level(1.125rem, 1.75rem, 600, theme('fontFamily.sans')),
+            $headline-4: mat.m2-define-typography-level(0.875rem, 1.25rem, 600, theme('fontFamily.sans')),
+            $headline-5: mat.m2-define-typography-level(0.875rem, 1.5rem, 400, theme('fontFamily.sans')),
+            $headline-6: mat.m2-define-typography-level(0.875rem, 1.5rem, 400, theme('fontFamily.sans')),
+            $subtitle-1: mat.m2-define-typography-level(1rem, 1.75rem, 400, theme('fontFamily.sans')),
+            $subtitle-2: mat.m2-define-typography-level(0.875rem, 1.25rem, 600, theme('fontFamily.sans')),
+            $body-1: mat.m2-define-typography-level(0.875rem, 1.5rem, 400, theme('fontFamily.sans')),
+            $body-2: mat.m2-define-typography-level(0.875rem, 1.5rem, 400, theme('fontFamily.sans')),
+            $caption: mat.m2-define-typography-level(0.75rem, 1rem, 400, theme('fontFamily.sans')),
+            $button: mat.m2-define-typography-level(0.875rem, 0.875rem, 500, theme('fontFamily.sans')),
+            $overline: mat.m2-define-typography-level(0.75rem, 2rem, 500, theme('fontFamily.sans'))
+    );
+
     $base-light-theme: mat.m2-define-light-theme((
-            color: ($palettes)
+            color: ($palettes),
+            typography: $typography
     ));
 
-    $light-theme: (
-            color: (
-                    primary: map.get(map.get($base-light-theme, color), primary),
-                    accent: map.get(map.get($base-light-theme, color), accent),
-                    warn: map.get(map.get($base-light-theme, color), warn),
-                    is-dark: map.get(map.get($base-light-theme, color), is-dark),
-                    foreground: $foreground-light,
-                    background: $background-light
-            ),
-            typography: null,
+    $light-theme: map.merge($base-light-theme, (
             density: null,
-            primary: map.get(map.get($base-light-theme, color), primary),
-            accent: map.get(map.get($base-light-theme, color), accent),
-            warn: map.get(map.get($base-light-theme, color), warn),
-            is-dark: map.get(map.get($base-light-theme, color), is-dark),
             foreground: $foreground-light,
             background: $background-light
-    );
+    ));
 
-    @return $light-theme;
+    @return $base-light-theme;
 }
 
 @function nice-dark-theme() {
+    $typography: mat.m2-define-typography-config(
+            $font-family: theme('fontFamily.sans'),
+            $headline-1: mat.m2-define-typography-level(1.875rem, 2.25rem, 800, theme('fontFamily.sans')),
+            $headline-2: mat.m2-define-typography-level(1.25rem, 1.75rem, 700, theme('fontFamily.sans')),
+            $headline-3: mat.m2-define-typography-level(1.125rem, 1.75rem, 600, theme('fontFamily.sans')),
+            $headline-4: mat.m2-define-typography-level(0.875rem, 1.25rem, 600, theme('fontFamily.sans')),
+            $headline-5: mat.m2-define-typography-level(0.875rem, 1.5rem, 400, theme('fontFamily.sans')),
+            $headline-6: mat.m2-define-typography-level(0.875rem, 1.5rem, 400, theme('fontFamily.sans')),
+            $subtitle-1: mat.m2-define-typography-level(1rem, 1.75rem, 400, theme('fontFamily.sans')),
+            $subtitle-2: mat.m2-define-typography-level(0.875rem, 1.25rem, 600, theme('fontFamily.sans')),
+            $body-1: mat.m2-define-typography-level(0.875rem, 1.5rem, 400, theme('fontFamily.sans')),
+            $body-2: mat.m2-define-typography-level(0.875rem, 1.5rem, 400, theme('fontFamily.sans')),
+            $caption: mat.m2-define-typography-level(0.75rem, 1rem, 400, theme('fontFamily.sans')),
+            $button: mat.m2-define-typography-level(0.875rem, 0.875rem, 500, theme('fontFamily.sans')),
+            $overline: mat.m2-define-typography-level(0.75rem, 2rem, 500, theme('fontFamily.sans'))
+    );
+
     $base-dark-theme: mat.m2-define-dark-theme((
-            color: ($palettes)
+            color: ($palettes),
+            typography: $typography
     ));
 
-    $dark-theme: (
-            color: (
-                    primary: map.get(map.get($base-dark-theme, color), primary),
-                    accent: map.get(map.get($base-dark-theme, color), accent),
-                    warn: map.get(map.get($base-dark-theme, color), warn),
-                    is-dark: map.get(map.get($base-dark-theme, color), is-dark),
-                    foreground: $foreground-dark,
-                    background: $background-dark
-            ),
-            typography: null,
+    $dark-theme: map.merge($base-dark-theme, (
             density: null,
-            primary: map.get(map.get($base-dark-theme, color), primary),
-            accent: map.get(map.get($base-dark-theme, color), accent),
-            warn: map.get(map.get($base-dark-theme, color), warn),
-            is-dark: map.get(map.get($base-dark-theme, color), is-dark),
-            foreground: $foreground-dark,
-            background: $background-dark
-    );
+            foreground: $foreground-light,
+            background: $background-light
+    ));
 
     @return $dark-theme;
 }
 
 @mixin core() {
     /** Include the core Angular Material styles */
-    @include mat.core();
-    /* Create a base theme without any color to set the density and typography */
-    @include mat.all-component-themes((
-            color: null,
-            density: 0,
-            typography: mat.m2-define-typography-config(
-                $font-family: theme('fontFamily.sans'),
-                $headline-1: mat.m2-define-typography-level(1.875rem, 2.25rem, 800, theme('fontFamily.sans')),
-                $headline-2: mat.m2-define-typography-level(1.25rem, 1.75rem, 700, theme('fontFamily.sans')),
-                $headline-3: mat.m2-define-typography-level(1.125rem, 1.75rem, 600, theme('fontFamily.sans')),
-                $headline-4: mat.m2-define-typography-level(0.875rem, 1.25rem, 600, theme('fontFamily.sans')),
-                $headline-5: mat.m2-define-typography-level(0.875rem, 1.5rem, 400, theme('fontFamily.sans')),
-                $headline-6: mat.m2-define-typography-level(0.875rem, 1.5rem, 400, theme('fontFamily.sans')),
-                $subtitle-1: mat.m2-define-typography-level(1rem, 1.75rem, 400, theme('fontFamily.sans')),
-                $subtitle-2: mat.m2-define-typography-level(0.875rem, 1.25rem, 600, theme('fontFamily.sans')),
-                $body-1: mat.m2-define-typography-level(0.875rem, 1.5rem, 400, theme('fontFamily.sans')),
-                $body-2: mat.m2-define-typography-level(0.875rem, 1.5rem, 400, theme('fontFamily.sans')),
-                $caption: mat.m2-define-typography-level(0.75rem, 1rem, 400, theme('fontFamily.sans')),
-                $button: mat.m2-define-typography-level(0.875rem, 0.875rem, 500, theme('fontFamily.sans')),
-                $overline: mat.m2-define-typography-level(0.75rem, 2rem, 500, theme('fontFamily.sans'))
-            )
-    ));
+    @include mat.elevation-classes();
+    @include mat.app-background();
 
     body.light,
     body .light {
@@ -290,6 +280,7 @@ $palettes: ();
         @include mat.all-component-themes($light-theme);
         @include nice-components-theme($light-theme);
         @include nice-custom-theme($light-theme);
+
         .cdk-overlay-dark-backdrop {
             background: hsla(0, 0%, 100%, .36);
         }
@@ -301,11 +292,12 @@ $palettes: ();
         @include mat.all-component-themes($dark-theme);
         @include nice-components-theme($dark-theme);
         @include nice-custom-theme($dark-theme);
+
         .cdk-overlay-dark-backdrop {
             background: hsla(0, 0%, 20%, .50);
         }
     }
 
-    @include nice-horizontal-navigation-theme();
-    @include nice-vertical-navigation-theme();
+    @include horizontal-navigation.nice-horizontal-navigation-theme();
+    @include vertical-navigation.nice-vertical-navigation-theme();
 }

package/src/lib/nice.utils.scss

@@ -1,3 +1,5 @@
+@use "sass:map";
+
 // Material theming tools
 
 // Media step breakpoint mixin based on Angular Material lib
@@ -27,7 +29,7 @@ $helper-breakpoints: (
 );
 
 @mixin media-breakpoint($breakpointName) {
-    $mediaQuery: map-get($breakpoints, $breakpointName);
+    $mediaQuery: map.get($breakpoints, $breakpointName);
 
     @if ($mediaQuery == null) {
         @content

package/styles/main.scss

@@ -1,5 +1,5 @@
 /* 1. Overrides */
-@import "overrides/angular-material";
-@import "overrides/fullcalendar";
-@import "overrides/perfect-scrollbar";
-@import "overrides/quill";
+@use "overrides/angular-material";
+@use "overrides/fullcalendar";
+@use "overrides/perfect-scrollbar";
+@use "overrides/quill";

package/styles/nice.scss

@@ -1,3 +1,5 @@
+@use "sass:map";
+
 // Material theming tools
 
 // Media step breakpoint mixin based on Angular Material lib
@@ -27,7 +29,7 @@ $helper-breakpoints: (
 );
 
 @mixin media-breakpoint($breakpointName) {
-    $mediaQuery: map-get($breakpoints, $breakpointName);
+    $mediaQuery: map.get($breakpoints, $breakpointName);
 
     @if ($mediaQuery == null) {
         @content

package/styles/overrides/angular-material.scss

@@ -1466,7 +1466,7 @@ table {
         }
 
         .mdc-checkbox__mixedmark {
-            --mdc-checkbox-selected-checkmark-color: var(--nice-on-accent) #{!important};
+            --mat-checkbox-selected-checkmark-color: var(--nice-on-accent) #{!important};
         }
     }
 
@@ -1476,7 +1476,7 @@ table {
         }
 
         .mdc-checkbox__mixedmark {
-            --mdc-checkbox-selected-checkmark-color: var(--nice-on-primary) #{!important};
+            --mat-checkbox-selected-checkmark-color: var(--nice-on-primary) #{!important};
         }
     }
 
@@ -1486,7 +1486,7 @@ table {
         }
 
         .mdc-checkbox__mixedmark {
-            --mdc-checkbox-selected-checkmark-color: var(--nice-on-warn) #{!important};
+            --mat-checkbox-selected-checkmark-color: var(--nice-on-warn) #{!important};
         }
     }
 }

package/esm2022/lib/animations/defaults.mjs

@@ -1,32 +0,0 @@
-import { animate, animation, style, transition, trigger, useAnimation } from "@angular/animations";
-export class NiceAnimationCurves {
-    static { this.STANDARD_CURVE = "cubic-bezier(0.4, 0.0, 0.2, 1)"; }
-    static { this.DECELERATION_CURVE = "cubic-bezier(0.0, 0.0, 0.2, 1)"; }
-    static { this.ACCELERATION_CURVE = "cubic-bezier(0.4, 0.0, 1, 1)"; }
-    static { this.SHARP_CURVE = "cubic-bezier(0.4, 0.0, 0.6, 1)"; }
-}
-export class NiceAnimationDurations {
-    static { this.COMPLEX = "375ms"; }
-    static { this.ENTERING = "225ms"; }
-    static { this.EXITING = "195ms"; }
-}
-const customAnimation = animation([
-    style({
-        opacity: "{{opacity}}",
-        transform: "scale({{scale}}) translate3d({{x}}, {{y}}, {{z}})"
-    }),
-    animate("{{duration}} {{delay}} cubic-bezier(0.0, 0.0, 0.2, 1)", style("*"))
-], {
-    params: {
-        duration: "200ms",
-        delay: "0ms",
-        opacity: "0",
-        scale: "1",
-        x: "0",
-        y: "0",
-        z: "0"
-    }
-});
-const defaultAnimation = trigger("animate", [transition("void => *", [useAnimation(customAnimation)])]);
-export { defaultAnimation };
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGVmYXVsdHMuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uaWNlLXVpLWtpdC12Mi9zcmMvbGliL2FuaW1hdGlvbnMvZGVmYXVsdHMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLFVBQVUsRUFBRSxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0scUJBQXFCLENBQUM7QUFFbkcsTUFBTSxPQUFPLG1CQUFtQjthQUNyQixtQkFBYyxHQUFHLGdDQUFnQyxDQUFDO2FBQ2xELHVCQUFrQixHQUFHLGdDQUFnQyxDQUFDO2FBQ3RELHVCQUFrQixHQUFHLDhCQUE4QixDQUFDO2FBQ3BELGdCQUFXLEdBQUcsZ0NBQWdDLENBQUM7O0FBRzFELE1BQU0sT0FBTyxzQkFBc0I7YUFDeEIsWUFBTyxHQUFHLE9BQU8sQ0FBQzthQUNsQixhQUFRLEdBQUcsT0FBTyxDQUFDO2FBQ25CLFlBQU8sR0FBRyxPQUFPLENBQUM7O0FBRzdCLE1BQU0sZUFBZSxHQUFHLFNBQVMsQ0FBQztJQUM5QixLQUFLLENBQUM7UUFDRixPQUFPLEVBQUUsYUFBYTtRQUN0QixTQUFTLEVBQUUsbURBQW1EO0tBQ2pFLENBQUM7SUFDRixPQUFPLENBQUMsdURBQXVELEVBQUUsS0FBSyxDQUFDLEdBQUcsQ0FBQyxDQUFDO0NBQy9FLEVBQUU7SUFDQyxNQUFNLEVBQUU7UUFDSixRQUFRLEVBQUUsT0FBTztRQUNqQixLQUFLLEVBQUUsS0FBSztRQUNaLE9BQU8sRUFBRSxHQUFHO1FBQ1osS0FBSyxFQUFFLEdBQUc7UUFDVixDQUFDLEVBQUUsR0FBRztRQUNOLENBQUMsRUFBRSxHQUFHO1FBQ04sQ0FBQyxFQUFFLEdBQUc7S0FDVDtDQUNKLENBQUMsQ0FBQztBQUVILE1BQU0sZ0JBQWdCLEdBQUcsT0FBTyxDQUFDLFNBQVMsRUFBRSxDQUFDLFVBQVUsQ0FBQyxXQUFXLEVBQUUsQ0FBQyxZQUFZLENBQUMsZUFBZSxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQztBQUV4RyxPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGFuaW1hdGUsIGFuaW1hdGlvbiwgc3R5bGUsIHRyYW5zaXRpb24sIHRyaWdnZXIsIHVzZUFuaW1hdGlvbiB9IGZyb20gXCJAYW5ndWxhci9hbmltYXRpb25zXCI7XG5cbmV4cG9ydCBjbGFzcyBOaWNlQW5pbWF0aW9uQ3VydmVzIHtcbiAgICBzdGF0aWMgU1RBTkRBUkRfQ1VSVkUgPSBcImN1YmljLWJlemllcigwLjQsIDAuMCwgMC4yLCAxKVwiO1xuICAgIHN0YXRpYyBERUNFTEVSQVRJT05fQ1VSVkUgPSBcImN1YmljLWJlemllcigwLjAsIDAuMCwgMC4yLCAxKVwiO1xuICAgIHN0YXRpYyBBQ0NFTEVSQVRJT05fQ1VSVkUgPSBcImN1YmljLWJlemllcigwLjQsIDAuMCwgMSwgMSlcIjtcbiAgICBzdGF0aWMgU0hBUlBfQ1VSVkUgPSBcImN1YmljLWJlemllcigwLjQsIDAuMCwgMC42LCAxKVwiO1xufVxuXG5leHBvcnQgY2xhc3MgTmljZUFuaW1hdGlvbkR1cmF0aW9ucyB7XG4gICAgc3RhdGljIENPTVBMRVggPSBcIjM3NW1zXCI7XG4gICAgc3RhdGljIEVOVEVSSU5HID0gXCIyMjVtc1wiO1xuICAgIHN0YXRpYyBFWElUSU5HID0gXCIxOTVtc1wiO1xufVxuXG5jb25zdCBjdXN0b21BbmltYXRpb24gPSBhbmltYXRpb24oW1xuICAgIHN0eWxlKHtcbiAgICAgICAgb3BhY2l0eTogXCJ7e29wYWNpdHl9fVwiLFxuICAgICAgICB0cmFuc2Zvcm06IFwic2NhbGUoe3tzY2FsZX19KSB0cmFuc2xhdGUzZCh7e3h9fSwge3t5fX0sIHt7en19KVwiXG4gICAgfSksXG4gICAgYW5pbWF0ZShcInt7ZHVyYXRpb259fSB7e2RlbGF5fX0gY3ViaWMtYmV6aWVyKDAuMCwgMC4wLCAwLjIsIDEpXCIsIHN0eWxlKFwiKlwiKSlcbl0sIHtcbiAgICBwYXJhbXM6IHtcbiAgICAgICAgZHVyYXRpb246IFwiMjAwbXNcIixcbiAgICAgICAgZGVsYXk6IFwiMG1zXCIsXG4gICAgICAgIG9wYWNpdHk6IFwiMFwiLFxuICAgICAgICBzY2FsZTogXCIxXCIsXG4gICAgICAgIHg6IFwiMFwiLFxuICAgICAgICB5OiBcIjBcIixcbiAgICAgICAgejogXCIwXCJcbiAgICB9XG59KTtcblxuY29uc3QgZGVmYXVsdEFuaW1hdGlvbiA9IHRyaWdnZXIoXCJhbmltYXRlXCIsIFt0cmFuc2l0aW9uKFwidm9pZCA9PiAqXCIsIFt1c2VBbmltYXRpb24oY3VzdG9tQW5pbWF0aW9uKV0pXSk7XG5cbmV4cG9ydCB7IGRlZmF1bHRBbmltYXRpb24gfTtcbiJdfQ==

package/esm2022/lib/animations/expand-collapse.mjs

@@ -1,21 +0,0 @@
-import { animate, state, style, transition, trigger } from "@angular/animations";
-import { NiceAnimationCurves, NiceAnimationDurations } from "./defaults";
-// -----------------------------------------------------------------------------------------------------
-// @ Expand / collapse
-// -----------------------------------------------------------------------------------------------------
-const expandCollapse = trigger("expandCollapse", [
-    state("void, collapsed", style({
-        height: "0"
-    })),
-    state("*, expanded", style("*")),
-    // Prevent the transition if the state is false
-    transition("void <=> false, collapsed <=> false, expanded <=> false", []),
-    // Transition
-    transition("void <=> *, collapsed <=> expanded", animate("{{timings}}"), {
-        params: {
-            timings: `${NiceAnimationDurations.ENTERING} ${NiceAnimationCurves.DECELERATION_CURVE}`
-        }
-    })
-]);
-export { expandCollapse };
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZXhwYW5kLWNvbGxhcHNlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmljZS11aS1raXQtdjIvc3JjL2xpYi9hbmltYXRpb25zL2V4cGFuZC1jb2xsYXBzZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsT0FBTyxFQUFFLEtBQUssRUFBRSxLQUFLLEVBQUUsVUFBVSxFQUFFLE9BQU8sRUFBRSxNQUFNLHFCQUFxQixDQUFDO0FBQ2pGLE9BQU8sRUFBRSxtQkFBbUIsRUFBRSxzQkFBc0IsRUFBRSxNQUFNLFlBQVksQ0FBQztBQUV6RSx3R0FBd0c7QUFDeEcsc0JBQXNCO0FBQ3RCLHdHQUF3RztBQUN4RyxNQUFNLGNBQWMsR0FBRyxPQUFPLENBQUMsZ0JBQWdCLEVBQzNDO0lBQ0ksS0FBSyxDQUFDLGlCQUFpQixFQUNuQixLQUFLLENBQUM7UUFDRixNQUFNLEVBQUUsR0FBRztLQUNkLENBQUMsQ0FDTDtJQUVELEtBQUssQ0FBQyxhQUFhLEVBQ2YsS0FBSyxDQUFDLEdBQUcsQ0FBQyxDQUNiO0lBRUQsK0NBQStDO0lBQy9DLFVBQVUsQ0FBQyx5REFBeUQsRUFBRSxFQUFFLENBQUM7SUFFekUsYUFBYTtJQUNiLFVBQVUsQ0FBQyxvQ0FBb0MsRUFDM0MsT0FBTyxDQUFDLGFBQWEsQ0FBQyxFQUN0QjtRQUNJLE1BQU0sRUFBRTtZQUNKLE9BQU8sRUFBRSxHQUFHLHNCQUFzQixDQUFDLFFBQVEsSUFBSSxtQkFBbUIsQ0FBQyxrQkFBa0IsRUFBRTtTQUMxRjtLQUNKLENBQ0o7Q0FDSixDQUNKLENBQUM7QUFFRixPQUFPLEVBQUUsY0FBYyxFQUFFLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBhbmltYXRlLCBzdGF0ZSwgc3R5bGUsIHRyYW5zaXRpb24sIHRyaWdnZXIgfSBmcm9tIFwiQGFuZ3VsYXIvYW5pbWF0aW9uc1wiO1xuaW1wb3J0IHsgTmljZUFuaW1hdGlvbkN1cnZlcywgTmljZUFuaW1hdGlvbkR1cmF0aW9ucyB9IGZyb20gXCIuL2RlZmF1bHRzXCI7XG5cbi8vIC0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tXG4vLyBAIEV4cGFuZCAvIGNvbGxhcHNlXG4vLyAtLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLVxuY29uc3QgZXhwYW5kQ29sbGFwc2UgPSB0cmlnZ2VyKFwiZXhwYW5kQ29sbGFwc2VcIixcbiAgICBbXG4gICAgICAgIHN0YXRlKFwidm9pZCwgY29sbGFwc2VkXCIsXG4gICAgICAgICAgICBzdHlsZSh7XG4gICAgICAgICAgICAgICAgaGVpZ2h0OiBcIjBcIlxuICAgICAgICAgICAgfSlcbiAgICAgICAgKSxcblxuICAgICAgICBzdGF0ZShcIiosIGV4cGFuZGVkXCIsXG4gICAgICAgICAgICBzdHlsZShcIipcIilcbiAgICAgICAgKSxcblxuICAgICAgICAvLyBQcmV2ZW50IHRoZSB0cmFuc2l0aW9uIGlmIHRoZSBzdGF0ZSBpcyBmYWxzZVxuICAgICAgICB0cmFuc2l0aW9uKFwidm9pZCA8PT4gZmFsc2UsIGNvbGxhcHNlZCA8PT4gZmFsc2UsIGV4cGFuZGVkIDw9PiBmYWxzZVwiLCBbXSksXG5cbiAgICAgICAgLy8gVHJhbnNpdGlvblxuICAgICAgICB0cmFuc2l0aW9uKFwidm9pZCA8PT4gKiwgY29sbGFwc2VkIDw9PiBleHBhbmRlZFwiLFxuICAgICAgICAgICAgYW5pbWF0ZShcInt7dGltaW5nc319XCIpLFxuICAgICAgICAgICAge1xuICAgICAgICAgICAgICAgIHBhcmFtczoge1xuICAgICAgICAgICAgICAgICAgICB0aW1pbmdzOiBgJHtOaWNlQW5pbWF0aW9uRHVyYXRpb25zLkVOVEVSSU5HfSAke05pY2VBbmltYXRpb25DdXJ2ZXMuREVDRUxFUkFUSU9OX0NVUlZFfWBcbiAgICAgICAgICAgICAgICB9XG4gICAgICAgICAgICB9XG4gICAgICAgIClcbiAgICBdXG4pO1xuXG5leHBvcnQgeyBleHBhbmRDb2xsYXBzZSB9O1xuIl19