@porscheinformatik/material-addons 17.0.2 → 17.1.0

package/public_api.d.ts

@@ -5,10 +5,6 @@ export * from './lib/button/button.module';
 export * from './lib/readonly/readonly-form-field.module';
 export * from './lib/readonly/readonly-form-field-wrapper/readonly-form-field-wrapper.component';
 export * from './lib/readonly/readonly-form-field/readonly-form-field.component';
-export * from './lib/toolbar/toolbar.module';
-export * from './lib/toolbar/toolbar.component';
-export * from './lib/toolbar/toolbar.service';
-export * from './lib/toolbar/toolbar-action.interface';
 export * from './lib/numeric-field/numeric-field';
 export * from './lib/numeric-field/numeric-field.module';
 export * from './lib/numeric-field/number-format.service';
@@ -26,14 +22,22 @@ export * from './lib/stepper/stepper.component';
 export * from './lib/stepper/step-header/step-header.component';
 export * from './lib/stepper/mad-stepper-animation';
 export * from './lib/stepper/stepper.module';
-export * from './lib/content-panel/content-header/content-header.component';
-export * from './lib/content-panel/content-panel-container/content-panel-container.component';
-export * from './lib/content-panel/content-panel-container-content/content-panel-container-content.component';
-export * from './lib/content-panel/content-panel-container-footer/content-panel-container-footer.component';
-export * from './lib/content-panel/main-container/main-container.component';
-export * from './lib/content-panel/content-panel.module';
-export * from './lib/flowbar/flowbar.component';
-export * from './lib/flowbar/flowbar.module';
+export * from './lib/layout/content-panel/content-header/content-header.component';
+export * from './lib//layout/content-panel/content-panel-container/content-panel-container.component';
+export * from './lib//layout/content-panel/content-panel-container-content/content-panel-container-content.component';
+export * from './lib//layout/content-panel/content-panel-container-footer/content-panel-container-footer.component';
+export * from './lib//layout/content-panel/content-panel-container-sidebar/content-panel-container-sidebar.component';
+export * from './lib//layout/content-panel/main-container/main-container.component';
+export * from './lib//layout/content-panel/content-panel.module';
+export * from './lib/layout/flowbar/flowbar.component';
+export * from './lib/layout/flowbar/flowbar.module';
+export * from './lib/layout/sidebar/sidebar.component';
+export * from './lib/layout/sidebar/sidebar-item/sidebar-item.component';
+export * from './lib/layout/sidebar/sidebar.module';
+export * from './lib/layout/toolbar/toolbar.module';
+export * from './lib/layout/toolbar/toolbar.component';
+export * from './lib/layout/toolbar/toolbar.service';
+export * from './lib/layout/toolbar/toolbar-action.interface';
 export * from './lib/material-addons.module';
 export * from './lib/file-upload/file-upload.component';
 //# sourceMappingURL=public_api.d.ts.map

package/public_api.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"public_api.d.ts","sourceRoot":"","sources":["../../projects/material-addons/src/public_api.ts"],"names":[],"mappings":"AAGA,cAAc,+DAA+D,CAAC;AAC9E,cAAc,4DAA4D,CAAC;AAC3E,cAAc,qBAAqB,CAAC;AACpC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,2CAA2C,CAAC;AAC1D,cAAc,kFAAkF,CAAC;AACjG,cAAc,kEAAkE,CAAC;AACjF,cAAc,8BAA8B,CAAC;AAC7C,cAAc,iCAAiC,CAAC;AAChD,cAAc,+BAA+B,CAAC;AAC9C,cAAc,wCAAwC,CAAC;AACvD,cAAc,mCAAmC,CAAC;AAClD,cAAc,0CAA0C,CAAC;AACzD,cAAc,2CAA2C,CAAC;AAC1D,cAAc,iBAAiB,CAAC;AAChC,cAAc,wBAAwB,CAAC;AACvC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,oCAAoC,CAAC;AACnD,cAAc,mBAAmB,CAAC;AAClC,cAAc,0BAA0B,CAAC;AACzC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,oCAAoC,CAAC;AACnD,cAAc,+CAA+C,CAAC;AAC9D,cAAc,4CAA4C,CAAC;AAC3D,cAAc,iCAAiC,CAAC;AAChD,cAAc,iDAAiD,CAAC;AAChE,cAAc,qCAAqC,CAAC;AACpD,cAAc,8BAA8B,CAAC;AAC7C,cAAc,6DAA6D,CAAC;AAC5E,cAAc,+EAA+E,CAAC;AAC9F,cAAc,+FAA+F,CAAC;AAC9G,cAAc,6FAA6F,CAAC;AAC5G,cAAc,6DAA6D,CAAC;AAC5E,cAAc,0CAA0C,CAAC;AACzD,cAAc,iCAAiC,CAAC;AAChD,cAAc,8BAA8B,CAAC;AAC7C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,yCAAyC,CAAC"}
+{"version":3,"file":"public_api.d.ts","sourceRoot":"","sources":["../../projects/material-addons/src/public_api.ts"],"names":[],"mappings":"AAGA,cAAc,+DAA+D,CAAC;AAC9E,cAAc,4DAA4D,CAAC;AAC3E,cAAc,qBAAqB,CAAC;AACpC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,2CAA2C,CAAC;AAC1D,cAAc,kFAAkF,CAAC;AACjG,cAAc,kEAAkE,CAAC;AAEjF,cAAc,mCAAmC,CAAC;AAClD,cAAc,0CAA0C,CAAC;AACzD,cAAc,2CAA2C,CAAC;AAC1D,cAAc,iBAAiB,CAAC;AAChC,cAAc,wBAAwB,CAAC;AACvC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,oCAAoC,CAAC;AACnD,cAAc,mBAAmB,CAAC;AAClC,cAAc,0BAA0B,CAAC;AACzC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,oCAAoC,CAAC;AACnD,cAAc,+CAA+C,CAAC;AAC9D,cAAc,4CAA4C,CAAC;AAC3D,cAAc,iCAAiC,CAAC;AAChD,cAAc,iDAAiD,CAAC;AAChE,cAAc,qCAAqC,CAAC;AACpD,cAAc,8BAA8B,CAAC;AAE7C,cAAc,oEAAoE,CAAC;AACnF,cAAc,uFAAuF,CAAC;AACtG,cAAc,uGAAuG,CAAC;AACtH,cAAc,qGAAqG,CAAC;AACpH,cAAc,uGAAuG,CAAC;AACtH,cAAc,qEAAqE,CAAC;AACpF,cAAc,kDAAkD,CAAC;AAEjE,cAAc,wCAAwC,CAAC;AACvD,cAAc,qCAAqC,CAAC;AAEpD,cAAc,wCAAwC,CAAC;AACvD,cAAc,0DAA0D,CAAC;AACzE,cAAc,qCAAqC,CAAC;AAEpD,cAAc,qCAAqC,CAAC;AACpD,cAAc,wCAAwC,CAAC;AACvD,cAAc,sCAAsC,CAAC;AACrD,cAAc,+CAA+C,CAAC;AAE9D,cAAc,8BAA8B,CAAC;AAC7C,cAAc,yCAAyC,CAAC"}

package/themes/carcat.scss

@@ -0,0 +1,38 @@
+@use 'sass:map';
+@use '@angular/material' as mat;
+@use './common/theme' as theme;
+@use './common/styles' as common;
+@use './common/button';
+
+$theme-name: 'poba';
+
+$primary-palette: (
+  50: #79c6e6,
+  100: #64bfe6,
+  200: #39b3e8,
+  300: #11a6e6,
+  400: #078dc6,
+  500: #0072a3,
+  600: #005579,
+  700: #00374f,
+  800: #001a25,
+  900: black,
+  A100: #4cb7e6,
+  A200: #23b7e8,
+  A400: #0098d9,
+  A700: #005073,
+  contrast: common.$contrast,
+  background-color: #fcfcfc,
+  warn-color: #ad7600,
+  error-color: #c21d00,
+  info-color: #005073,
+  success-color: #3c8500,
+);
+
+@include mat.core();
+
+$custom-theme: theme.build-custom-theme($theme-name, $primary-palette, common.$default-palette);
+
+@include mat.all-component-themes($custom-theme);
+@include mat.all-component-typographies($custom-theme);
+@include common.theme($theme-name, $custom-theme);

package/themes/common/button.scss

@@ -0,0 +1,34 @@
+.mdc-button.mad-uppercase {
+  text-transform: uppercase;
+}
+
+.mad-outline.mat-mdc-outlined-button:not(:disabled) {
+  --mdc-outlined-button-outline-color: var(--mdc-outlined-button-label-text-color);
+}
+
+.mad-button-group {
+  button,
+  a {
+    border-left-width: 0;
+    border-radius: 0;
+
+    &:first-child {
+      border-left-width: var(--mdc-outlined-button-outline-width, 1px);
+      border-bottom-left-radius: var(--mdc-outlined-button-container-shape, var(--mdc-shape-small, 4px));
+      border-top-left-radius: var(--mdc-outlined-button-container-shape, var(--mdc-shape-small, 4px));
+    }
+
+    &:last-child {
+      border-bottom-right-radius: var(--mdc-outlined-button-container-shape, var(--mdc-shape-small, 4px));
+      border-top-right-radius: var(--mdc-outlined-button-container-shape, var(--mdc-shape-small, 4px));
+    }
+
+    &:disabled:has(+ button:not(:disabled)) {
+      border-right-width: 0;
+    }
+
+    &:disabled + button:not(:disabled) {
+      border-left-width: var(--mdc-outlined-button-outline-width, 1px);
+    }
+  }
+}

package/themes/common/styles.scss

@@ -1,7 +1,10 @@
+@use 'sass:map';
 @use '@angular/material' as mat;
+@use './theme';
+
+@import 'material-icons/iconfont/material-icons.css';
+@import 'roboto-fontface/css/roboto/roboto-fontface.css';
 
-@include mat.all-component-typographies();
-@include mat.all-component-densities(-2);
 @include mat.core();
 
 //TODO Contrasts should be part of the themes!
@@ -22,42 +25,42 @@ $contrast: (
   A700: rgba(black, 0.87),
 );
 
-@function get-main-color($color-scheme) {
-  @return map-get($color-scheme, 500);
-}
-
-@function get-selection-background($color-scheme) {
-  @return map-get($color-scheme, 50);
-}
-
-@function get-table-hover-color($color) {
-  @return rgba($color, 0.08);
-}
-
-@function get-background-color($color-scheme) {
-  @return map-get($color-scheme, background-color);
-}
-
-
-
-@mixin build-custom-theme($primary-palette, $warn-palette: mat.$red-palette, $theme-name: 'undefined') {
-  $material-addons-colors-primary: mat.define-palette($primary-palette);
-  $material-addons-colors-warn: mat.define-palette($warn-palette);
-  //$material-addons-theme: mat.define-light-theme($material-addons-colors-primary, $material-addons-colors-primary, $material-addons-colors-warn);
-
-  $material-addons-theme: mat.define-light-theme((
-    color: (
-      primary: $material-addons-colors-primary,
-      accent: $material-addons-colors-primary,
-      warn: $material-addons-colors-warn,
-    )
-  ));
-
-  $hover-color: mat.define-palette($primary-palette, 50);
+$default-palette: (
+  panel-background-color: #e8e8e8,
+  panel-border-color: #cccccc,
+  panel-select-background: white,
+);
 
-  @include mat.all-component-themes($material-addons-theme);
-  //setting the density for the components
-  //@include mat.form-field-density(-5);
+@mixin color($theme-name, $theme) {
+  $main-primary: theme.get-main-color();
+  $selection-background: theme.get-selection-background();
+  $table-hover-color: theme.get-table-hover-color($main-primary);
+  $background-color: theme.get-background-color();
+  $warn-color: map-get(theme.$primary-palette, warn-color);
+  $hover-color: map-get(theme.$primary-palette, 50);
+  $panel-color: map-get(theme.$primary-palette, 900);
+  $panel-background-color: theme.map-get-or-default(theme.$primary-palette, panel-background-color);
+  $panel-border-color: theme.map-get-or-default(theme.$primary-palette, panel-border-color);
+  $panel-select-background: theme.map-get-or-default(theme.$primary-palette, panel-select-background);
+
+  // Remark: when we style the addons components there is no theme set, yet. So we have multiple possibilities:
+  // a) include the components in the mixin (so it gets styled when the theme is set)
+  // b) use the theme-functions (e.g. see nav-child.component.scss)
+  // c) use css-variables which are overwritten at runtime (what we currently prefer)
+
+  :root {
+    --main-primary: #{$main-primary};
+    --selection-background: #{$selection-background};
+    --hover-color: #{$hover-color};
+    --table-hover-color: #{$table-hover-color};
+    --warn-color: #{$warn-color};
+    --background-color: #{$background-color};
+    --panel-color: #{$panel-color};
+    --panel-background-color: #{$panel-background-color};
+    --panel-border-color: #{$panel-border-color};
+    --panel-select-background: #{$panel-select-background};
+    --mdc-protected-button-label-text-color: #{$main-primary};
+  }
 
   @if variable-exists(table-hover-color) {
     .clickable-table-row:hover,
@@ -73,6 +76,10 @@ $contrast: (
       color: $warn-color;
     }
 
+    .mat-chip.mat-standard-chip.mat-warn {
+      color: $warn-color;
+      border: 1px solid $warn-color;
+    }
   } @else {
     @warn 'variable $warn-color in theme #{$theme-name} is not defined';
   }
@@ -81,6 +88,13 @@ $contrast: (
     .mat-mdc-outlined-button {
       border-color: $main-primary !important;
     }
+    .mat-chip-selected {
+      border: 1px solid $main-primary !important;
+      color: $main-primary !important;
+    }
+    .mat-stroked-button {
+      border-color: $main-primary !important;
+    }
     .selected-drag-list {
       border-color: $main-primary !important;
     }
@@ -90,11 +104,32 @@ $contrast: (
   } @else {
     @warn 'variable $main-primary  in theme #{$theme-name} is not defined';
   }
+
+  .mat-chip-selected {
+    background-color: white !important;
+  }
+}
+
+@mixin typography($theme-name, $theme) {
+  $typography-config: mat.get-typography-config($theme);
+
+  // set custom typography styles here
+}
+
+@mixin theme($theme-name, $theme) {
+  $color-config: mat.get-color-config($theme-name, $theme);
+  @if $color-config != null {
+    @include color($theme-name, $theme);
+  }
+
+  $typography-config: mat.get-typography-config($theme-name, $theme);
+  @if $typography-config != null {
+    @include typography($theme-name, $theme);
+  }
 }
 
 body {
   margin: 0;
-  font-family: Roboto, 'Helvetica Neue', sans-serif;
 }
 
 a {
@@ -110,6 +145,12 @@ table {
   width: 100%;
 }
 
+app-root {
+  display: flex;
+  flex-direction: column;
+  height: 100vh;
+}
+
 .mat-mdc-input-element:disabled {
   cursor: auto;
   color: black;
@@ -206,7 +247,11 @@ mad-danger-button {
 .mat-mdc-raised-button,
 .mat-mdc-outlined-button,
 .mat-mdc-icon-button {
-  text-transform: uppercase;
+  text-transform: uppercase !important;
+}
+
+.mat-icon {
+  vertical-align: middle;
 }
 
 .toolbar-title {
@@ -245,6 +290,16 @@ mad-danger-button {
   padding-right: 16px;
 }
 
+.mat-chip.mat-standard-chip {
+  background-color: white;
+  color: rgba(0, 0, 0, 0.87);
+  border: 1px solid rgba(0, 0, 0, 0.4);
+}
+
+.mat-chip.mat-standard-chip.mat-warn {
+  background-color: white;
+}
+
 .mat-mdc-tab-group {
   max-width: 100%;
 }
@@ -276,6 +331,77 @@ mad-danger-button {
   margin: 0 !important;
 }
 
+mat-icon.mat-icon.narrow-icon {
+  margin-right: 0;
+  margin-left: 0;
+}
+
+button.mat-mdc-menu-item {
+  min-height: 38px;
+}
+
+.mat-toolbar {
+  background-color: var(--panel-select-background);
+
+  .mat-mdc-button {
+    min-width: 0;
+    padding: 0;
+    margin: 0 5px;
+  }
+}
+
+.drop-down {
+  mat-icon.mat-icon.notranslate {
+    padding: 0;
+    margin: 0;
+  }
+
+  .mat-mdc-outlined-button:not(:disabled) {
+    color: var(--mdc-outlined-button-label-text-color, inherit);
+    border-color: var(--mdc-outlined-button-, inherit);
+  }
+
+  &::after {
+    content: '\02C7';
+    font-size: 2em !important;
+    padding-top: 15px;
+    padding-left: 3px;
+  }
+}
+
+// full page
+.top-nav-bar {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  z-index: 2;
+}
+
+//maybe we have different navs for desktop, mobile,...
+.top-main-nav {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  padding: 4px 16px;
+  background-color: white;
+
+  > .mat-mdc-button {
+    &:last-child {
+      margin-left: auto;
+    }
+  }
+}
+
+.flex-spacer {
+  flex-grow: 1;
+}
+
+.logo {
+  height: 26px;
+  margin-right: 20px;
+}
+
 @mixin ellipsis-text-overflow {
   text-overflow: ellipsis;
   overflow: hidden;
@@ -293,6 +419,7 @@ mad-danger-button {
     width: 0 !important;
     height: 0 !important;
   }
+
   mat-paginator {
     display: none !important;
     height: 0 !important;
@@ -336,7 +463,9 @@ mad-danger-button {
   .content {
     color: black !important;
   }
-  .mdc-notched-outline__leading, .mdc-notched-outline__notch, .mdc-notched-outline__trailing {
+  .mdc-notched-outline__leading,
+  .mdc-notched-outline__notch,
+  .mdc-notched-outline__trailing {
     border: none !important;
   }
 }

package/themes/common/theme.scss

@@ -0,0 +1,57 @@
+@use 'sass:map';
+@use '@angular/material' as mat;
+
+$primary-palette: undefined;
+$accent-palette: undefined;
+$warn-palette: undefined;
+$default-palette: undefined;
+$is-dark-theme: undefined;
+
+$typography: mat.define-typography-config(
+  $font-family: 'Roboto, Helvetica Neue, sans-serif',
+);
+
+@function build-custom-theme($theme-name, $primary-palette, $default-colors, $warn-palette: mat.$red-palette) {
+  $material-addons-colors-primary: mat.define-palette($primary-palette);
+  $material-addons-colors-warn: mat.define-palette($warn-palette);
+  $material-addons-theme: mat.define-light-theme(
+    (
+      color: (
+        primary: $material-addons-colors-primary,
+        accent: $material-addons-colors-primary,
+        warn: $material-addons-colors-warn,
+      ),
+      typography: $typography,
+    )
+  );
+
+  $color-config: mat.get-color-config($material-addons-theme);
+  $primary-palette: map.get($color-config, 'primary') !global;
+  $accent-palette: map.get($color-config, 'accent') !global;
+  $warn-palette: map.get($color-config, 'warn') !global;
+  $default-palette: $default-colors !global;
+  $is-dark-theme: map.get($color-config, 'is-dark') !global;
+
+  @return $material-addons-theme;
+}
+
+@function get-main-color() {
+  @return map-get($primary-palette, 500);
+}
+
+@function get-selection-background() {
+  @return map-get($primary-palette, 50);
+}
+
+@function get-table-hover-color($color) {
+  @return rgba($color, 0.08);
+}
+
+@function get-background-color() {
+  @return map-get($primary-palette, background-color);
+}
+
+@function map-get-or-default($theme-map, $key) {
+  $key-exists: map-has-key($theme-map, $key);
+  @return map-get(if($key-exists, $theme-map, $default-palette), $key);
+}

package/themes/pbv.scss

@@ -1,4 +1,8 @@
-@import './common/styles';
+@use 'sass:map';
+@use '@angular/material' as mat;
+@use './common/theme' as theme;
+@use './common/styles' as common;
+@use './common/button';
 
 $theme-name: 'pbv';
 
@@ -17,12 +21,12 @@ $primary-palette: (
   A200: #3b98ff,
   A400: #087eff,
   A700: #0071ee,
-  contrast: $contrast,
+  contrast: common.$contrast,
   background-color: #fafafa,
-  warn-color: #AD7600,
-  error-color: #C21D00,
-  info-color: #00648F,
-  success-color: #3C8500
+  warn-color: #ad7600,
+  error-color: #c21d00,
+  info-color: #00648f,
+  success-color: #3c8500,
 );
 
 $warn-palette: (
@@ -40,27 +44,13 @@ $warn-palette: (
   A200: #ff667a,
   A400: #ff334e,
   A700: #ff1a38,
-  contrast: $contrast,
+  contrast: common.$contrast,
 );
 
-$main-primary: get-main-color($primary-palette);
-$selection-background: get-selection-background($primary-palette);
-$table-hover-color: get-table-hover-color($main-primary);
-$background-color: get-background-color($primary-palette);
+@include mat.core();
 
-$warn-color: get-main-color($warn-palette);
-$error-color: map-get($primary-palette, error-color);
-$info-color: map-get($primary-palette, info-color);
-$success-color: map-get($primary-palette, success-color);
-
-:root {
-  --main-primary: #{$main-primary};
-  --selection-background: #{$selection-background};
-  --table-hover-color: #{$table-hover-color};
-  --warn-color: #{$warn-color};
-  --background-color: #{$background-color};
-}
-
-
-@include build-custom-theme($primary-palette, $warn-palette, $theme-name);
+$custom-theme: theme.build-custom-theme($theme-name, $primary-palette, common.$default-palette, $warn-palette);
 
+@include mat.all-component-themes($custom-theme);
+@include mat.all-component-typographies($custom-theme);
+@include common.theme($theme-name, $custom-theme);

package/themes/poa.scss

@@ -1,4 +1,8 @@
-@import './common/styles';
+@use 'sass:map';
+@use '@angular/material' as mat;
+@use './common/theme' as theme;
+@use './common/styles' as common;
+@use './common/button';
 
 $theme-name: 'poa';
 
@@ -17,49 +21,36 @@ $primary-palette: (
   A200: #adfcff,
   A400: #86faff,
   A700: #16f7ff,
-  contrast: $contrast,
+  contrast: common.$contrast,
   background-color: #fafafa,
-  warn-color: #AD7600,
-  error-color: #C21D00,
-  info-color: #00648F,
-  success-color: #3c8500
+  warn-color: #ad7600,
+  error-color: #c21d00,
+  info-color: #00648f,
+  success-color: #3c8500,
 );
 
 $warn-palette: (
-  50 : #f8e4e0,
-  100 : #edbbb3,
-  200 : #e18e80,
-  300 : #d4614d,
-  400 : #cb3f26,
-  500 : #c21d00,
-  600 : #bc1a00,
-  700 : #b41500,
-  800 : #ac1100,
-  900 : #9f0a00,
-  A100 : #ffcbc9,
-  A200 : #ff9996,
-  A400 : #ff6763,
-  A700 : #ff4e4a,
-  contrast: $contrast,
+  50: #f8e4e0,
+  100: #edbbb3,
+  200: #e18e80,
+  300: #d4614d,
+  400: #cb3f26,
+  500: #c21d00,
+  600: #bc1a00,
+  700: #b41500,
+  800: #ac1100,
+  900: #9f0a00,
+  A100: #ffcbc9,
+  A200: #ff9996,
+  A400: #ff6763,
+  A700: #ff4e4a,
+  contrast: common.$contrast,
 );
 
-$main-primary: get-main-color($primary-palette);
-$selection-background: get-selection-background($primary-palette);
-$table-hover-color: get-table-hover-color($main-primary);
-$background-color: get-background-color($primary-palette);
+@include mat.core();
 
-$warn-color: get-main-color($warn-palette);
-$error-color: map-get($primary-palette, error-color);
-$info-color: map-get($primary-palette, info-color);
-$success-color: map-get($primary-palette, success-color);
+$custom-theme: theme.build-custom-theme($theme-name, $primary-palette, common.$default-palette);
 
-
-:root {
-  --main-primary: #{$main-primary};
-  --selection-background: #{$selection-background};
-  --table-hover-color: #{$table-hover-color};
-  --warn-color: #{$warn-color};
-  --background-color: #{$background-color};
-}
-
-@include build-custom-theme($primary-palette, $warn-palette, $theme-name);
+@include mat.all-component-themes($custom-theme);
+@include mat.all-component-typographies($custom-theme);
+@include common.theme($theme-name, $custom-theme);

package/esm2022/lib/content-panel/content-header/content-header.component.mjs

@@ -1,11 +0,0 @@
-import { Component } from '@angular/core';
-import * as i0 from "@angular/core";
-export class ContentHeaderComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.4", ngImport: i0, type: ContentHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.4", type: ContentHeaderComponent, selector: "mad-content-header", ngImport: i0, template: "<div class=\"content-header\">\n    <ng-content></ng-content>\n</div>\n", styles: [".content-header{padding-right:.5rem}\n"] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImport: i0, type: ContentHeaderComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'mad-content-header', template: "<div class=\"content-header\">\n    <ng-content></ng-content>\n</div>\n", styles: [".content-header{padding-right:.5rem}\n"] }]
-        }] });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29udGVudC1oZWFkZXIuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbWF0ZXJpYWwtYWRkb25zL3NyYy9saWIvY29udGVudC1wYW5lbC9jb250ZW50LWhlYWRlci9jb250ZW50LWhlYWRlci5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9tYXRlcmlhbC1hZGRvbnMvc3JjL2xpYi9jb250ZW50LXBhbmVsL2NvbnRlbnQtaGVhZGVyL2NvbnRlbnQtaGVhZGVyLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxlQUFlLENBQUM7O0FBTzFDLE1BQU0sT0FBTyxzQkFBc0I7OEdBQXRCLHNCQUFzQjtrR0FBdEIsc0JBQXNCLDBEQ1BuQyx5RUFHQTs7MkZESWEsc0JBQXNCO2tCQUxsQyxTQUFTOytCQUNFLG9CQUFvQiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdtYWQtY29udGVudC1oZWFkZXInLFxuICB0ZW1wbGF0ZVVybDogJy4vY29udGVudC1oZWFkZXIuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9jb250ZW50LWhlYWRlci5jb21wb25lbnQuc2NzcyddLFxufSlcbmV4cG9ydCBjbGFzcyBDb250ZW50SGVhZGVyQ29tcG9uZW50IHt9XG4iLCI8ZGl2IGNsYXNzPVwiY29udGVudC1oZWFkZXJcIj5cbiAgICA8bmctY29udGVudD48L25nLWNvbnRlbnQ+XG48L2Rpdj5cbiJdfQ==

package/esm2022/lib/content-panel/content-panel-container/content-panel-container.component.mjs

@@ -1,11 +0,0 @@
-import { Component } from '@angular/core';
-import * as i0 from "@angular/core";
-export class ContentPanelContainerComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.4", ngImport: i0, type: ContentPanelContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.4", type: ContentPanelContainerComponent, selector: "mad-content-panel-container", ngImport: i0, template: "<div class=\"content-panel-outer-wrapper\">\n    <ng-content select=\"mad-content-panel-container-content\"></ng-content>\n    <ng-content select=\"mad-content-panel-container-footer\"></ng-content>\n</div>\n", styles: [":host{position:relative;overflow:hidden;display:flex;flex:1 1 auto;min-height:.05rem}.content-panel-outer-wrapper{display:flex;flex:1 1 auto;flex-direction:column}\n"] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImport: i0, type: ContentPanelContainerComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'mad-content-panel-container', template: "<div class=\"content-panel-outer-wrapper\">\n    <ng-content select=\"mad-content-panel-container-content\"></ng-content>\n    <ng-content select=\"mad-content-panel-container-footer\"></ng-content>\n</div>\n", styles: [":host{position:relative;overflow:hidden;display:flex;flex:1 1 auto;min-height:.05rem}.content-panel-outer-wrapper{display:flex;flex:1 1 auto;flex-direction:column}\n"] }]
-        }] });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29udGVudC1wYW5lbC1jb250YWluZXIuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbWF0ZXJpYWwtYWRkb25zL3NyYy9saWIvY29udGVudC1wYW5lbC9jb250ZW50LXBhbmVsLWNvbnRhaW5lci9jb250ZW50LXBhbmVsLWNvbnRhaW5lci5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9tYXRlcmlhbC1hZGRvbnMvc3JjL2xpYi9jb250ZW50LXBhbmVsL2NvbnRlbnQtcGFuZWwtY29udGFpbmVyL2NvbnRlbnQtcGFuZWwtY29udGFpbmVyLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxlQUFlLENBQUM7O0FBTzFDLE1BQU0sT0FBTyw4QkFBOEI7OEdBQTlCLDhCQUE4QjtrR0FBOUIsOEJBQThCLG1FQ1AzQyxrTkFJQTs7MkZER2EsOEJBQThCO2tCQUwxQyxTQUFTOytCQUNFLDZCQUE2QiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdtYWQtY29udGVudC1wYW5lbC1jb250YWluZXInLFxuICB0ZW1wbGF0ZVVybDogJy4vY29udGVudC1wYW5lbC1jb250YWluZXIuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9jb250ZW50LXBhbmVsLWNvbnRhaW5lci5jb21wb25lbnQuc2NzcyddLFxufSlcbmV4cG9ydCBjbGFzcyBDb250ZW50UGFuZWxDb250YWluZXJDb21wb25lbnQge31cbiIsIjxkaXYgY2xhc3M9XCJjb250ZW50LXBhbmVsLW91dGVyLXdyYXBwZXJcIj5cbiAgICA8bmctY29udGVudCBzZWxlY3Q9XCJtYWQtY29udGVudC1wYW5lbC1jb250YWluZXItY29udGVudFwiPjwvbmctY29udGVudD5cbiAgICA8bmctY29udGVudCBzZWxlY3Q9XCJtYWQtY29udGVudC1wYW5lbC1jb250YWluZXItZm9vdGVyXCI+PC9uZy1jb250ZW50PlxuPC9kaXY+XG4iXX0=

package/esm2022/lib/content-panel/content-panel-container-content/content-panel-container-content.component.mjs

@@ -1,11 +0,0 @@
-import { Component } from '@angular/core';
-import * as i0 from "@angular/core";
-export class ContentPanelContainerContentComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.4", ngImport: i0, type: ContentPanelContainerContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.4", type: ContentPanelContainerContentComponent, selector: "mad-content-panel-container-content", ngImport: i0, template: "<ng-content></ng-content>", styles: [":host{flex:1 1 auto;overflow-y:auto;border-top:.05rem solid #cccccc;padding:1rem;height:1rem}\n"] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImport: i0, type: ContentPanelContainerContentComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'mad-content-panel-container-content', template: "<ng-content></ng-content>", styles: [":host{flex:1 1 auto;overflow-y:auto;border-top:.05rem solid #cccccc;padding:1rem;height:1rem}\n"] }]
-        }] });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29udGVudC1wYW5lbC1jb250YWluZXItY29udGVudC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9tYXRlcmlhbC1hZGRvbnMvc3JjL2xpYi9jb250ZW50LXBhbmVsL2NvbnRlbnQtcGFuZWwtY29udGFpbmVyLWNvbnRlbnQvY29udGVudC1wYW5lbC1jb250YWluZXItY29udGVudC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9tYXRlcmlhbC1hZGRvbnMvc3JjL2xpYi9jb250ZW50LXBhbmVsL2NvbnRlbnQtcGFuZWwtY29udGFpbmVyLWNvbnRlbnQvY29udGVudC1wYW5lbC1jb250YWluZXItY29udGVudC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sZUFBZSxDQUFDOztBQU8xQyxNQUFNLE9BQU8scUNBQXFDOzhHQUFyQyxxQ0FBcUM7a0dBQXJDLHFDQUFxQywyRUNQbEQsMkJBQXlCOzsyRkRPWixxQ0FBcUM7a0JBTGpELFNBQVM7K0JBQ0UscUNBQXFDIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ21hZC1jb250ZW50LXBhbmVsLWNvbnRhaW5lci1jb250ZW50JyxcbiAgdGVtcGxhdGVVcmw6ICcuL2NvbnRlbnQtcGFuZWwtY29udGFpbmVyLWNvbnRlbnQuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9jb250ZW50LXBhbmVsLWNvbnRhaW5lci1jb250ZW50LmNvbXBvbmVudC5zY3NzJ10sXG59KVxuZXhwb3J0IGNsYXNzIENvbnRlbnRQYW5lbENvbnRhaW5lckNvbnRlbnRDb21wb25lbnQge31cbiIsIjxuZy1jb250ZW50PjwvbmctY29udGVudD4iXX0=