ng-configcat-publicapi-ui 4.2.2 → 5.0.0

package/src/css/vars/flag.scss

@@ -0,0 +1,146 @@
+@mixin render-css-vars {
+  :root {
+    --flag-tutorial-background: #d9e8fa;
+
+    --flag-box-background: #dee5f0;
+    --flag-box-border: #c9c9c9;
+    --flag-box-control-background: #f2f4f8;
+    --flag-box-control: #878787;
+    --flag-box-control-border: 1px solid #c9c9c9;
+    --flag-box-control-button-border: 1px dashed #a8a8a8;
+    --flag-box-control-hover: #ececec;
+    --flag-box-rule-background: #f2f4f8;
+    --flag-box-rule-border-color: #c9c9c9;
+    --flag-box-rule-border: 1px solid var(--flag-box-rule-border-color);
+    --flag-box-rule-control-background: #f3f3f3;
+    --flag-box-rule-control-border: 1px dashed #a8a8a8;
+    --flag-box-rule-divider-color: var(--mat-divider-color);
+    --flag-box-rule-list-chip: #f1f1f1;
+    --flag-box-rule-list-chip-validation-error-background: var(--error-text-color);
+
+    --flag-validation-error: var(--error-text-color);
+    --flag-action-icon: #6b6b6b;
+    --flag-description: #464646;
+
+    --flag-delete: #e63838;
+    --flag-delete-background: #f3f3f3;
+
+    --flag-add-tag-hover: #444444;
+    --flag-add-tag-hover-background: #dce1ee;
+    --flag-add-tag-border: #bdbdbd;
+
+    --flag-quick-glance-on: #0f8f11;
+    --flag-quick-glance-off: #be0b0b;
+    --flag-quick-glance-other: #4881b9;
+
+    --flag-chip-background: #d1e3fa;
+
+    --flag-enter-sign: #cccccc;
+    --flag-delete-btn: #b1b1b1;
+
+    --flag-bool-slider-on: #71c95b;
+    --flag-bool-slider-off: #ff5252;
+    --flag-bool-slider-remaining: white;
+
+    --flag-search-bar-icon-background: #f0f0f0;
+    --flag-search-bar-icon-border: #d4d4d4;
+    --flag-search-bar-search-icon-color: #4d4d4d;
+
+    --flag-tag-filter-chip-remove-color: var(--flag-search-bar-search-icon-color);
+    --flag-tag-filter-chip-remove-opacity: 0.5;
+
+    --flag-expand-collapse-translate: translate(-50%, -34%);
+
+    --flag-meta: #6e6e6e;
+
+    --flag-v1-box-border: #d4d4d4;
+    --flag-v1-box-background: #f3f3f3;
+    --flag-v1-colored-berry: white;
+    --flag-v1-colored-berry-background: #5c6bc0;
+    --flag-v1-key-background: lightgray;
+    --flag-v1-rule-border: #d5d5d5;
+    --flag-v1-rule-background: white;
+    --flag-v1-chip-background: #67b1fc3d;
+    --flag-v1-targeting-button: #363636;
+    --flag-v1-targeting-button-background: #d9eadc;
+    --flag-v1-targeting-button-hover-background: #bad0be;
+    --flag-v1-targeting-button-disabled-background: white;
+    --flag-v1-targeting-button-disabled: #b3b3b3;
+    --flag-v1-rule-hover-background: #dbedff;
+    --flag-v1-input-border: #e5e5e5;
+    --flag-v1-colored-berry-opacity: 0.5;
+
+    [data-theme="dark"] {
+      --flag-tutorial-background: #3180ee23;
+
+      --flag-box-background: #1f242b;
+      --flag-box-border: #303644;
+      --flag-box-control: #c4c4c4;
+      --flag-box-control-background: #343a49;
+      --flag-box-control-border: none;
+      --flag-box-control-button-border: none;
+      --flag-box-control-hover: #3e4558;
+
+      --flag-box-rule-background: #2e333f;
+      --flag-box-rule-border-color: #303644;
+      --flag-box-rule-border: none;
+      --flag-box-rule-control-background: var(--flag-box-rule-background);
+      --flag-box-rule-control-border: 1px dashed #555d6e;
+      --flag-box-rule-divider-color: #3b444d;
+      --flag-box-rule-list-chip: #3a404e;
+      --flag-box-rule-list-chip-validation-error-background: var(--error-text-color);
+
+      --flag-validation-error: var(--error-text-color);
+      --flag-action-icon: var(--action-icon-button-color);
+      --flag-description: #d3d3d3;
+
+      --flag-delete: #fd4b4b;
+      --flag-delete-background: #202020;
+
+      --flag-add-tag-hover: #dbdbdb;
+      --flag-add-tag-hover-background: #32373f;
+      --flag-add-tag-border: #464d5e;
+
+      --flag-quick-glance-on: #56c258;
+      --flag-quick-glance-off: #d45555;
+      --flag-quick-glance-other: #77b7f8;
+
+      --flag-chip-background: #40526b;
+
+      --flag-enter-sign: #4c5361;
+      --flag-delete-btn: #747f99;
+
+      --flag-bool-slider-on: #5ca12e;
+      --flag-bool-slider-off: #e04f4f;
+      --flag-bool-slider-remaining: white;
+
+      --flag-search-bar-icon-background: var(--input-background);
+      --flag-search-bar-icon-border: var(--input-border-color);
+      --flag-search-bar-search-icon-color: var(--text-color);
+
+      --flag-tag-filter-chip-remove-color: var(--flag-search-bar-search-icon-color);
+      --flag-tag-filter-chip-remove-opacity: 0.6;
+
+      --flag-expand-collapse-translate: translate(-50%, -36%);
+
+      --flag-meta: #b1b1b1;
+
+      --flag-v1-box-border: #303644;
+      --flag-v1-box-background: #1f242b;
+      --flag-v1-colored-berry: white;
+      --flag-v1-colored-berry-background: #6b7cdb;
+      --flag-v1-key-background: #343a42;
+      --flag-v1-rule-border: #303644;
+      --flag-v1-rule-background: var(--input-background);
+      --flag-v1-chip-background: #3c4d64;
+      --flag-v1-targeting-button: var(--text-color);
+      --flag-v1-targeting-button-background: #3f6346;
+      --flag-v1-targeting-button-hover-background: #547e5d;
+      --flag-v1-targeting-button-disabled-background: #797979;
+      --flag-v1-targeting-button-disabled: #d4d4d4;
+      --flag-v1-rule-hover-background: #20242e;
+      --flag-v1-input-border: #3a414b;
+      --flag-v1-colored-berry-opacity: 0.7;
+    }
+  }
+}

package/src/css/vars/header.scss

@@ -0,0 +1,24 @@
+@mixin render-css-vars {
+  :root {
+    --header-text-color: white;
+    --header-background-base: #f8912c;
+    --header-background: linear-gradient(to right, var(--header-background-base), #f14321);
+    --header-border-color: #e84c28;
+    --header-logo-cat-fill: #ed1c24;
+    --header-dropdown-border-color: #ececec;
+
+    [data-theme="dark"] {
+      --header-background-base: #733a83;
+      --header-background: linear-gradient(90deg, #af3356 0%, #8c3fa2 35%, #37359c 100%);
+      --header-border-color: #30363d;
+      --header-logo-cat-fill: black;
+      --header-dropdown-border-color: #cecece;
+    }
+  }
+}
+
+@mixin colors {
+  background: var(--header-background-base);
+  background: var(--header-background);
+  border-bottom: 1px solid var(--header-border-color);
+}

package/src/css/vars/icon.scss

@@ -0,0 +1,33 @@
+@mixin render-css-vars {
+  :root {
+    --info-icon-color: #7fb2ff;
+    --warn-icon-color: #ff9900;
+    --error-icon-color: red;
+    --success-icon-color: #4caf50;
+    --info-icon-content: '\e88e';
+    --warn-icon-content: '\e002';
+    --error-icon-content: '\e000';
+    --success-icon-content: '\e86c';
+
+    [data-theme='dark'] {
+      --info-icon-color: #6b9fee;
+      --warn-icon-color: #ec8e00;
+      --error-icon-color: #dd4848;
+      --success-icon-color: #50c053;
+    }
+  }
+}
+
+@mixin mat-icon {
+  font-family: 'Material Icons';
+  direction: ltr;
+  display: inline-block;
+  font-size: 24px;
+  font-style: normal;
+  font-weight: normal;
+  letter-spacing: normal;
+  line-height: 1;
+  text-transform: none;
+  white-space: nowrap;
+  word-wrap: normal;
+}

package/src/css/vars/logo.scss

@@ -0,0 +1,19 @@
+@mixin render-css-vars {
+  :root {
+    --lang-logo-inactive-correction-filter-1: grayscale(1);
+    --lang-logo-inactive-correction-filter-2: grayscale(1) brightness(200%);
+    --lang-logo-inactive-correction-filter-3: grayscale(1) brightness(100%);
+    --lang-logo-inactive-correction-filter-4: grayscale(1) opacity(60%);
+    --lang-logo-inactive-correction-filter-5: grayscale(1) brightness(50%);
+    --lang-logo-inactive-correction-filter-6: grayscale(1) brightness(80%);
+
+    [data-theme='dark'] {
+      --lang-logo-inactive-correction-filter-1: grayscale(1);
+      --lang-logo-inactive-correction-filter-2: grayscale(1) brightness(150%);
+      --lang-logo-inactive-correction-filter-3: grayscale(1) brightness(200%);
+      --lang-logo-inactive-correction-filter-4: grayscale(1) opacity(60%);
+      --lang-logo-inactive-correction-filter-5: grayscale(1) brightness(150%);
+      --lang-logo-inactive-correction-filter-6: grayscale(1);
+    }
+  }
+}

package/src/css/vars/notification.scss

@@ -0,0 +1,38 @@
+@use "sass:color";
+
+$notification-box-success-color: #45a748;
+$notification-box-info-color: #5684b8;
+$notification-box-warn-color: #c57b35;
+$notification-box-error-color: #dd484a;
+
+$notification-box-success-color-dark: #3f7a44;
+$notification-box-info-color-dark: #48638a;
+$notification-box-warn-color-dark: #ac5d1c;
+$notification-box-error-color-dark: #9c2f2f;
+
+@mixin render-css-vars {
+  :root {
+    --notification-font-color: #e3e3e3;
+    --notification-success-background-color: #{$notification-box-success-color};
+    --notification-info-background-color: #{$notification-box-info-color};
+    --notification-warn-background-color: #{$notification-box-warn-color};
+    --notification-error-background-color: #{$notification-box-error-color};
+
+    --notification-success-icon-color: #{color.adjust($notification-box-success-color, $lightness: 35%)};
+    --notification-info-icon-color: #{color.adjust($notification-box-info-color, $lightness: 35%)};
+    --notification-warn-icon-color: #{color.adjust($notification-box-warn-color, $lightness: 33%)};
+    --notification-error-icon-color: #{color.adjust($notification-box-error-color, $lightness: 28%)};
+
+    [data-theme="dark"] {
+      --notification-success-background-color: #{$notification-box-success-color-dark};
+      --notification-info-background-color: #{$notification-box-info-color-dark};
+      --notification-warn-background-color: #{$notification-box-warn-color-dark};
+      --notification-error-background-color: #{$notification-box-error-color-dark};
+
+      --notification-success-icon-color: #{color.adjust($notification-box-success-color, $lightness: 30%)};
+      --notification-info-icon-color: #{color.adjust($notification-box-info-color, $lightness: 30%)};
+      --notification-warn-icon-color: #{color.adjust($notification-box-warn-color, $lightness: 30%)};
+      --notification-error-icon-color: #{color.adjust($notification-box-error-color, $lightness: 28%)};
+    }
+  }
+}

package/src/css/vars/overview.scss

@@ -0,0 +1,51 @@
+@use 'sass:color';
+
+$overview-box-text-color: #333;
+$overview-box-add-text-color: color.adjust($overview-box-text-color, $alpha: -0.4);
+$overview-box-add-text-disabled-color: color.adjust($overview-box-text-color, $alpha: -0.7);
+
+$overview-box-text-color-dark: #cacaca;
+$overview-box-add-text-color-dark: color.adjust($overview-box-text-color-dark, $alpha: -0.4);
+$overview-box-add-text-disabled-color-dark: color.adjust($overview-box-text-color-dark, $alpha: -0.7);
+
+@mixin render-css-vars {
+  :root {
+    --overview-box-background-color: var(--panel-content-box-background-color);
+    --overview-box-config-header-color: #ddebf8;
+    --overview-box-config-header-hover-color: #b9d4ef;
+    --overview-box-config-hover-background-color: #f3f3f3;
+    --overview-box-config-icon-circle-background-color: #5f9fde;
+    --overview-box-env-header-color: #efefef;
+    --overview-box-missing-description-note-color: #999;
+    --overview-box-text-color: #{$overview-box-text-color};
+    --overview-box-add-text-color: #{$overview-box-add-text-color};
+    --overview-box-add-text-disabled-color: #{$overview-box-add-text-disabled-color};
+    --overview-box-header-icon-color: white;
+    --overview-box-title-color: var(--text-color);
+    --overview-validation-error: #ed5251;
+    --overview-box-product-header-background-color: #264653;
+    --overview-box-product-header-color: white;
+    --overview-box-product-header-circle-background-color: #2a9d8f;
+    --overview-box-status-text-color: gray;
+
+    [data-theme='dark'] {
+      --overview-box-background-color: #242931;
+      --overview-box-config-header-color: #333a44;
+      --overview-box-config-header-hover-color: #3c4450;
+      --overview-box-config-hover-background-color: #292f38;
+      --overview-box-config-icon-circle-background-color: #5f9fde;
+      --overview-box-env-header-color: #333a44;
+      --overview-box-missing-description-note-color: #999;
+      --overview-box-text-color: #{$overview-box-text-color-dark};
+      --overview-box-add-text-color: #{$overview-box-add-text-color-dark};
+      --overview-box-add-text-disabled-color: #{$overview-box-add-text-disabled-color-dark};
+      --overview-box-header-icon-color: white;
+      --overview-box-title-color: var(--text-color);
+      --overview-validation-error: #ed5251;
+      --overview-box-product-header-background-color: #264653;
+      --overview-box-product-header-color: white;
+      --overview-box-product-header-circle-background-color: #2a9d8f;
+      --overview-box-status-text-color: #a0a0a0;
+    }
+  }
+}

package/src/css/vars/prism.scss

@@ -0,0 +1,44 @@
+@use 'sass:color';
+
+$prism-background: #f6f8fa;
+$prism-background-dark: #20262c;
+
+@mixin render-css-vars {
+  :root {
+    --prism-foreground: #111b27;
+    --prism-background: #{$prism-background};
+    --prism-selection: #8da1b9;
+    --prism-token-comment: #8c98a7;
+    --prism-token-punctuation: #111b27;
+    --prism-token-delimiter: #006d6d;
+    --prism-token-constant: #755f00;
+    --prism-token-property: #005a8e;
+    --prism-token-string: #116b00;
+    --prism-token-regex: #af00af;
+    --prism-token-class: #7c00aa;
+    --prism-token-operator: #a04900;
+    --prism-token-important: #c22f2e;
+    --prism-token-this: #005a8e;
+    --prism-line-number-foreground: #8da1b9da;
+    --prism-line-number-separator: #{color.adjust($prism-background, $lightness: -10%)};
+
+    [data-theme='dark'] {
+      --prism-foreground: #e3eaf2;
+      --prism-background: #{$prism-background-dark};
+      --prism-selection: #3c526d;
+      --prism-token-comment: #8da1b9;
+      --prism-token-punctuation: #e3eaf2;
+      --prism-token-delimiter: #66cccc;
+      --prism-token-constant: #e6d37a;
+      --prism-token-property: #6cb8e6;
+      --prism-token-string: #91d076;
+      --prism-token-regex: #f4adf4;
+      --prism-token-class: #c699e3;
+      --prism-token-operator: #e9ae7e;
+      --prism-token-important: #cd6660;
+      --prism-token-this: #6cb8e6;
+      --prism-line-number-foreground: #75879eda;
+      --prism-line-number-separator: #{color.adjust($prism-background-dark, $lightness: 10%)};
+    }
+  }
+}

package/src/css/vars/sidenav.scss

@@ -0,0 +1,42 @@
+@mixin render-css-vars {
+  :root {
+    --sidenav-background-color: #1d2227;
+    --sidenav-text-color: #dfdfdf;
+    --sidenav-border-color: #2f343a;
+    --sidenav-item-hover-background-color: #2d3a44;
+    --sidenav-item-collapsed-background-color: #2a9d8f;
+    --sidenav-organization-background-color: #292e35;
+    --sidenav-organization-hover-background-color: #2d3a44;
+    --sidenav-product-color: #dfdfdf;
+    --sidenav-secondary-color: #ababb3;
+    --sidenav-search-background-color: #101214;
+    --sidenav-search-border-color: #34393d;
+    --sidenav-search-focus-border-color: #14497e;
+    --sidenav-scrollbar-color: #6a7583;
+    --sidenav-cta-background-color: #c04949;
+    --sidenav-cta-active-background-color: #b95835;
+    --sidenav-cello-badge-background-color: #cf2a27;
+    --sidenav-cello-badge-text-color: white;
+    --sidenav-right-border: none;
+
+    [data-theme='dark'] {
+      --sidenav-background-color: #15191d;
+      --sidenav-text-color: #ececec;
+      --sidenav-border-color: #24272c;
+      --sidenav-item-hover-background-color: #2e3942;
+      --sidenav-item-collapsed-background-color: #2a9d8f;
+      --sidenav-organization-background-color: #15191d;
+      --sidenav-organization-hover-background-color: #272f35;
+      --sidenav-product-color: #cecece;
+      --sidenav-secondary-color: #ababb3;
+      --sidenav-search-background-color: #101214;
+      --sidenav-search-focus-border-color: #14497e;
+      --sidenav-scrollbar-color: #40464e;
+      --sidenav-cta-background-color: #c04949;
+      --sidenav-cta-active-background-color: #b95835;
+      --sidenav-cello-badge-background-color: #cf2a27;
+      --sidenav-cello-badge-text-color: white;
+      --sidenav-right-border: 1px solid var(--panel-border-color);
+    }
+  }
+}

package/src/css/vars/theme.scss

@@ -0,0 +1,78 @@
+@use '@angular/material' as mat;
+@use 'sass:map';
+
+$primary-color: #e78b00;
+$primary-color-dark: #ee9d22;
+
+$input-background: white;
+$input-background-dark: #1a1d22;
+$text-color: black;
+$text-color-dark: #e3e3e3;
+
+$contrast-dark-primary-text: rgba(black, 0.87);
+$contrast-light-primary-text: white;
+$dark-theme-primary-color-palette: (
+  50: #f8f1e0,
+  100: #efdab1,
+  200: #e5c37f,
+  300: #dcab4f,
+  400: #d69b2d,
+  500: #d18c15,
+  600: #cd8110,
+  700: #c7740a,
+  800: #c06606,
+  900: #b55103,
+  A100: #ecbe60,
+  A200: #d69b2d,
+  A400: #d88f10,
+  A700: #bd5a0e,
+  contrast: (
+    50: $contrast-dark-primary-text,
+    100: $contrast-dark-primary-text,
+    200: $contrast-dark-primary-text,
+    300: $contrast-dark-primary-text,
+    400: $contrast-dark-primary-text,
+    500: $contrast-dark-primary-text,
+    600: $contrast-dark-primary-text,
+    700: $contrast-dark-primary-text,
+    800: $contrast-light-primary-text,
+    900: $contrast-light-primary-text,
+    A100: $contrast-dark-primary-text,
+    A200: $contrast-dark-primary-text,
+    A400: $contrast-dark-primary-text,
+    A700: $contrast-light-primary-text,
+  ),
+);
+
+$dark-theme-warn-color-palette: (
+  50: #ffebee,
+  100: #ffcdd2,
+  200: #ef9a9a,
+  300: #e57373,
+  400: #cf4747,
+  500: #f44336,
+  600: #e53935,
+  700: #d32f2f,
+  800: #c62828,
+  900: #b71c1c,
+  A100: #ff8a80,
+  A200: #ff5252,
+  A400: #ff1744,
+  A700: #d50000,
+  contrast: (
+    50: $contrast-dark-primary-text,
+    100: $contrast-dark-primary-text,
+    200: $contrast-dark-primary-text,
+    300: $contrast-dark-primary-text,
+    400: $contrast-light-primary-text,
+    500: $contrast-light-primary-text,
+    600: $contrast-light-primary-text,
+    700: $contrast-light-primary-text,
+    800: $contrast-light-primary-text,
+    900: $contrast-light-primary-text,
+    A100: $contrast-dark-primary-text,
+    A200: $contrast-light-primary-text,
+    A400: $contrast-light-primary-text,
+    A700: $contrast-light-primary-text,
+  )
+);

package/src/public-api.scss

@@ -0,0 +1,208 @@
+@use "sass:meta";
+/* You can add global styles to this file, and also import other style files */
+
+@use "@angular/material" as mat;
+@use "./css/variables.scss";
+@use "./css/theme.scss";
+
+@include mat.button-density(0);
+@include mat.icon-button-density(-2);
+@include mat.form-field-density(-2);
+@include mat.checkbox-density(-3);
+
+@include meta.load-css("./css/table.scss");
+@include meta.load-css("./css/controls.scss");
+@include meta.load-css("css/dialog.scss");
+@include meta.load-css("css/tooltip.scss");
+@include meta.load-css("./css/button.scss");
+@include meta.load-css("./css/snackbar.scss");
+@include meta.load-css("./css/icon.scss");
+
+html {
+  overflow: -moz-scrollbars-vertical;
+  overflow-y: scroll;
+
+  body {
+    margin: 0;
+    color-scheme: var(--color-scheme);
+    font-family: Montserrat, Roboto, "Helvetica Neue", sans-serif;
+    font-size: 13px;
+    background-color: var(--page-background-color);
+    color: var(--text-color);
+
+    a {
+      color: var(--link-color);
+      text-decoration: none;
+    }
+
+    h3 {
+      font-weight: 700;
+    }
+
+    .mat-mdc-standard-chip .mdc-evolution-chip__text-label {
+      font-size: 12px;
+    }
+
+    .hide-menu-overflow-text {
+      .mat-mdc-menu-item-text {
+        max-width: 100%;
+        overflow: hidden;
+        text-overflow: ellipsis;
+      }
+    }
+
+    .menu-long-text-and {
+      min-width: 300px;
+    }
+
+    .menu-with-icon {
+      .mat-mdc-menu-item-text {
+        max-width: 90%;
+      }
+    }
+
+    .mat-mdc-menu-content {
+      .mat-mdc-menu-item {
+        vertical-align: middle !important;
+        min-height: 38px !important;
+        line-height: 38px !important;
+        padding: 0 20px 0 16px !important;
+
+        .mat-icon {
+          font-size: 18px !important;
+          height: 18px !important;
+          width: 18px !important;
+          margin-right: 8px !important;
+          color: var(--menu-icon-color);
+        }
+
+        .mat-mdc-menu-ripple {
+          height: 38px !important;
+          min-height: 38px !important;
+        }
+
+        &[disabled] {
+          pointer-events: none;
+        }
+      }
+    }
+
+    .mat-mdc-tab-group {
+      .mat-mdc-tab-header {
+        border-bottom: 1px solid var(--tab-border-bottom-color);
+
+        .mdc-tab__text-label {
+          letter-spacing: 0.25px;
+        }
+      }
+
+      &.small-header {
+        .mat-mdc-tab {
+          min-width: 64px !important;
+          padding: 0 3px !important;
+          margin: 0 3px !important;
+        }
+      }
+    }
+
+    .small-chip-input {
+      .chip-container {
+        min-width: 0;
+      }
+
+      .mdc-evolution-chip-set .mdc-evolution-chip {
+        margin-top: 1px;
+        margin-bottom: 1px;
+        margin-left: 4px;
+        height: 22px;
+
+        .mdc-evolution-chip__cell--primary,
+        .mdc-evolution-chip__action--primary,
+        .mat-mdc-chip-action-label {
+          white-space: nowrap;
+          overflow: hidden;
+          text-overflow: ellipsis;
+        }
+      }
+    }
+
+    code.highlight {
+      font-size: 12px;
+      padding: 2px 5px;
+      border-radius: 5px;
+      color: var(--text-color);
+      background-color: var(--code-highlight-background-color);
+    }
+
+    .dedicated-warning {
+      color: var(--error-text-color);
+    }
+
+    .reorder-button {
+      mat-icon {
+        color: var(--reorder-icon-color);
+      }
+    }
+
+    .reorder-header {
+      display: flex;
+      align-items: center;
+      gap: 5px;
+
+      @extend .reorder-button;
+    }
+
+    .color-shape {
+      width: 14px;
+      height: 14px;
+      margin-right: 12px;
+      border-radius: 50%;
+    }
+
+    a.color-picker-button {
+      margin-left: 3px;
+      cursor: pointer;
+      border-radius: 50%;
+
+      .color-shape {
+        margin: 10px;
+      }
+    }
+
+    .success-foreground {
+      color: var(--success-text-color);
+    }
+
+    .success-background {
+      background-color: var(--success-text-color);
+    }
+
+    .error-foreground {
+      color: var(--error-text-color);
+    }
+
+    .error-background {
+      background-color: var(--error-text-color);
+    }
+  }
+}
+
+/* clears the 'X' from Internet Explorer */
+input.hide-clear[type="search"]::-ms-clear,
+input.hide-clear[type="search"]::-ms-reveal {
+  display: none;
+  width: 0;
+  height: 0;
+}
+
+/* clears the 'X' from Chrome */
+input.hide-clear[type="search"]::-webkit-search-decoration,
+input.hide-clear[type="search"]::-webkit-search-cancel-button,
+input.hide-clear[type="search"]::-webkit-search-results-button,
+input.hide-clear[type="search"]::-webkit-search-results-decoration {
+  display: none;
+}
+
+.add-btn span[matchipaction][aria-disabled="false"] {
+  cursor: pointer;
+}

package/esm2022/lib/_directives/index.mjs

@@ -1,2 +0,0 @@
-export * from './input-display-normalizer.directive';
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZy1jb25maWdjYXQtcHVibGljYXBpLXVpL3NyYy9saWIvX2RpcmVjdGl2ZXMvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsY0FBYyxzQ0FBc0MsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImV4cG9ydCAqIGZyb20gJy4vaW5wdXQtZGlzcGxheS1ub3JtYWxpemVyLmRpcmVjdGl2ZSc7XG4iXX0=