chore(deps): update taiga-ui dev infra to v0.156.0 (#8827)

Co-authored-by: taiga-family-bot <[email protected]>
taiga-family · Sep 4, 2024 · bb19998 · bb19998
1 parent 3a66401
commit bb19998
Show file tree

Hide file tree

Showing 38 changed files with 1,364 additions and 2,091 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -146,15 +146,15 @@
         "@nx/jest": "19.6.5",
         "@nx/workspace": "19.6.5",
         "@schematics/angular": "16.2.15",
-        "@taiga-ui/browserslist-config": "0.154.0",
-        "@taiga-ui/commitlint-config": "0.154.0",
-        "@taiga-ui/cspell-config": "0.154.0",
+        "@taiga-ui/browserslist-config": "0.156.0",
+        "@taiga-ui/commitlint-config": "0.156.0",
+        "@taiga-ui/cspell-config": "0.156.0",
         "@taiga-ui/design-tokens": "0.133.0",
-        "@taiga-ui/eslint-plugin-experience": "0.154.0",
+        "@taiga-ui/eslint-plugin-experience": "0.156.0",
         "@taiga-ui/event-plugins": "4.0.2",
-        "@taiga-ui/prettier-config": "0.154.0",
-        "@taiga-ui/stylelint-config": "0.154.0",
-        "@taiga-ui/tsconfig": "0.154.0",
+        "@taiga-ui/prettier-config": "0.156.0",
+        "@taiga-ui/stylelint-config": "0.156.0",
+        "@taiga-ui/tsconfig": "0.156.0",
         "@types/glob": "8.1.0",
         "@types/loader-utils": "2.0.6",
         "@types/node": "22.5.3",

diff --git a/projects/addon-charts/components/bar-chart/bar-chart.style.less b/projects/addon-charts/components/bar-chart/bar-chart.style.less
@@ -21,7 +21,7 @@
 
         &:hover,
         &.t-wrapper_hovered {
-            background-color: rgb(0 0 0 / 0.05);
+            background-color: rgb(0 0 0 / 5%);
         }
     }
 }

diff --git a/projects/addon-charts/components/line-chart/line-chart.style.less b/projects/addon-charts/components/line-chart/line-chart.style.less
@@ -39,7 +39,7 @@
     margin: -0.25rem;
     box-shadow:
         0 0 0 2px currentColor,
-        0 0.0625rem 0.1875rem 0.125rem rgb(0 0 0 / 0.1);
+        0 0.0625rem 0.1875rem 0.125rem rgb(0 0 0 / 10%);
     outline: none;
     pointer-events: none;
 

diff --git a/projects/addon-doc/components/example/example.style.less b/projects/addon-doc/components/example/example.style.less
@@ -64,7 +64,7 @@
     margin-top: 1.5rem;
     border: 1px solid var(--tui-border-normal);
     border-radius: var(--tui-radius-m);
-    box-shadow: 0 0.125rem 0.1875rem rgb(0 0 0 / 0.1);
+    box-shadow: 0 0.125rem 0.1875rem rgb(0 0 0 / 10%);
     overflow: hidden;
 
     @media @tui-mobile {

diff --git a/projects/addon-mobile/styles/android/switch.less b/projects/addon-mobile/styles/android/switch.less
@@ -36,9 +36,9 @@ input[tuiSwitch] {
         transform: none;
         outline: none;
         box-shadow:
-            0 0.0625rem 0.0625rem rgb(0 0 0 / 0.24),
-            0 0 0.0625rem rgb(0 0 0 / 0.12),
-            inset 0 0.0625rem rgb(255 255 255 / 0.12) !important;
+            0 0.0625rem 0.0625rem rgb(0 0 0 / 24%),
+            0 0 0.0625rem rgb(0 0 0 / 12%),
+            inset 0 0.0625rem rgb(255 255 255 / 12%) !important;
     }
 
     &:checked {

diff --git a/projects/addon-mobile/styles/ios/switch.less b/projects/addon-mobile/styles/ios/switch.less
@@ -21,8 +21,8 @@ input[tuiSwitch] {
         transform: scale(0.871);
         outline: none;
         box-shadow:
-            0 0.25rem 0.125rem rgb(0 0 0 / 0.06),
-            0 0.25rem 0.5rem rgb(0 0 0 / 0.15) !important;
+            0 0.25rem 0.125rem rgb(0 0 0 / 6%),
+            0 0.25rem 0.5rem rgb(0 0 0 / 15%) !important;
     }
 
     &:active::after {

diff --git a/projects/addon-table/components/table/td/td.style.less b/projects/addon-table/components/table/td/td.style.less
@@ -50,7 +50,7 @@
         left: 100%;
         inline-size: 0.3125rem;
         pointer-events: none;
-        background: rgb(237 237 237 / 0.7);
+        background: rgb(237 237 237 / 70%);
         opacity: 0;
     }
 
@@ -60,7 +60,7 @@
 }
 
 :host-context([tuiTheme='dark'])::after {
-    background: rgb(60 60 60 / 0.9);
+    background: rgb(60 60 60 / 90%);
 }
 
 :host-context(table._stuck) {

diff --git a/projects/addon-table/components/table/th/th.style.less b/projects/addon-table/components/table/th/th.style.less
@@ -14,7 +14,7 @@
     cursor: default;
     padding: 0 0.75rem;
     box-sizing: border-box;
-    box-shadow: 0 0.3125rem rgb(237 237 237 / 0);
+    box-shadow: 0 0.3125rem rgb(237 237 237 / 0%);
     border: 1px solid var(--tui-border-normal);
     // Create new viewport for fixed positioning
     filter: opacity(1);
@@ -46,7 +46,7 @@
             bottom: 0;
             inline-size: 0.3125rem;
             pointer-events: none;
-            background: rgb(237 237 237 / 0.7);
+            background: rgb(237 237 237 / 70%);
             opacity: 0;
         }
     }
@@ -83,19 +83,19 @@
 }
 
 :host-context(thead[tuiThead]._stuck) {
-    box-shadow: 0 0.3125rem rgb(237 237 237 / 0.7);
+    box-shadow: 0 0.3125rem rgb(237 237 237 / 70%);
 }
 
 :host-context([tuiTheme='dark'])._sticky::after {
-    background: rgb(60 60 60 / 0.9);
+    background: rgb(60 60 60 / 90%);
 }
 
 :host-context([tuiTheme='dark'] thead[tuiThead]._stuck) {
-    box-shadow: 0 0.3125rem rgb(60 60 60 / 0.9);
+    box-shadow: 0 0.3125rem rgb(60 60 60 / 90%);
 }
 
 :host-context([tuiTheme='dark'] thead[tuiThead]._stuck):first-child {
-    box-shadow: 0.0625rem 0.3125rem rgb(60 60 60 / 0.9);
+    box-shadow: 0.0625rem 0.3125rem rgb(60 60 60 / 90%);
 }
 
 :host-context(table[data-size='l'] thead[tuiThead] tr:nth-child(2)) {

diff --git a/projects/core/components/dialog/dialog.style.less b/projects/core/components/dialog/dialog.style.less
@@ -165,11 +165,11 @@
 
     :host:not([data-size='fullscreen']):not([data-size='page']) & {
         animation: tuiFadeIn var(--tui-duration);
-        background: rgb(104 104 104 / 0.96);
+        background: rgb(104 104 104 / 96%);
         color: var(--tui-background-base);
 
         &:hover {
-            background: rgb(159 159 159 / 0.86);
+            background: rgb(159 159 159 / 86%);
         }
     }
 

diff --git a/projects/core/directives/hint/hint.style.less b/projects/core/directives/hint/hint.style.less
@@ -34,8 +34,8 @@
     &[data-appearance='dark'] {
         background: var(--tui-background-accent-opposite-hover);
         color: var(--tui-background-base);
-        filter: drop-shadow(0 0 0.125rem rgb(0 0 0 / 0.16)) drop-shadow(0 1.5rem 1rem rgb(0 0 0 / 0.03))
-            drop-shadow(0 0.75rem 0.75rem rgb(0 0 0 / 0.04)) drop-shadow(0 0.25rem 0.375rem rgb(0 0 0 / 0.05));
+        filter: drop-shadow(0 0 0.125rem rgb(0 0 0 / 16%)) drop-shadow(0 1.5rem 1rem rgb(0 0 0 / 3%))
+            drop-shadow(0 0.75rem 0.75rem rgb(0 0 0 / 4%)) drop-shadow(0 0.25rem 0.375rem rgb(0 0 0 / 5%));
     }
 
     &:not([style*='top']) {

diff --git a/projects/core/styles/theme/appearance/floating.less b/projects/core/styles/theme/appearance/floating.less
@@ -2,8 +2,8 @@
 
 [tuiAppearance][data-appearance='floating'] {
     background: #fff;
-    color: rgb(0 0 0 / 0.8);
-    box-shadow: 0 0.25rem 1.25rem rgb(0 0 0 / 0.1);
+    color: rgb(0 0 0 / 80%);
+    box-shadow: 0 0.25rem 1.25rem rgb(0 0 0 / 10%);
 
     .appearance-hover({
         box-shadow: 0 0.875rem 2.625rem rgba(0, 0, 0, 0.14);

diff --git a/projects/core/styles/theme/appearance/glass.less b/projects/core/styles/theme/appearance/glass.less
@@ -1,11 +1,11 @@
 @import '@taiga-ui/core/styles/taiga-ui-local.less';
 
 [tuiAppearance][data-appearance='glass'] {
-    background: rgb(0 0 0 / 0.4);
+    background: rgb(0 0 0 / 40%);
     color: #fff;
     backdrop-filter: blur(1rem);
 
-    --tui-border-focus: rgb(255 255 255 / 0.64);
+    --tui-border-focus: rgb(255 255 255 / 64%);
 
     .appearance-hover({
         background: rgba(0, 0, 0, 0.48);
@@ -18,7 +18,7 @@
 
 [tuiTheme='dark'] [tuiAppearance][data-appearance='glass'],
 [tuiTheme='dark'][tuiAppearance][data-appearance='glass'] {
-    background: rgb(255 255 255 / 0.3);
+    background: rgb(255 255 255 / 30%);
 
     .appearance-hover({
         background: rgba(255, 255, 255, 0.4);

diff --git a/projects/core/styles/theme/appearance/opposite.less b/projects/core/styles/theme/appearance/opposite.less
@@ -1,7 +1,7 @@
 @import '@taiga-ui/core/styles/taiga-ui-local.less';
 
 [tuiAppearance][data-appearance='opposite'] {
-    --tui-border-focus: rgb(255 255 255 / 0.64);
+    --tui-border-focus: rgb(255 255 255 / 64%);
 
     background: var(--tui-background-accent-opposite);
     color: var(--tui-background-base);
@@ -17,5 +17,5 @@
 
 [tuiTheme='dark'] [tuiAppearance][data-appearance='opposite'],
 [tuiTheme='dark'][tuiAppearance][data-appearance='opposite'] {
-    --tui-border-focus: rgb(51 51 51 / 0.48);
+    --tui-border-focus: rgb(51 51 51 / 48%);
 }
diff --git a/projects/core/styles/theme/appearance/textfield.less b/projects/core/styles/theme/appearance/textfield.less
@@ -3,7 +3,7 @@
 [tuiAppearance][data-appearance='textfield'] {
     .transition(~'box-shadow, background, outline-color, border-color');
 
-    --t-shadow: 0 0.125rem 0.1875rem rgb(0 0 0 / 0.1);
+    --t-shadow: 0 0.125rem 0.1875rem rgb(0 0 0 / 10%);
 
     background-color: var(--tui-background-base);
     color: var(--tui-text-primary);

diff --git a/projects/core/styles/theme/palette.less b/projects/core/styles/theme/palette.less
@@ -2,40 +2,40 @@
     // Backgrounds
     --tui-background-base: #222;
     --tui-background-base-alt: #333;
-    --tui-background-neutral-1: rgb(255 255 255 / 0.08);
-    --tui-background-neutral-1-hover: rgb(255 255 255 / 0.16);
-    --tui-background-neutral-1-pressed: rgb(255 255 255 / 0.24);
-    --tui-background-neutral-2: rgb(255 255 255 / 0.24);
-    --tui-background-neutral-2-hover: rgb(255 255 255 / 0.32);
-    --tui-background-neutral-2-pressed: rgb(255 255 255 / 0.4);
+    --tui-background-neutral-1: rgb(255 255 255 / 8%);
+    --tui-background-neutral-1-hover: rgb(255 255 255 / 16%);
+    --tui-background-neutral-1-pressed: rgb(255 255 255 / 24%);
+    --tui-background-neutral-2: rgb(255 255 255 / 24%);
+    --tui-background-neutral-2-hover: rgb(255 255 255 / 32%);
+    --tui-background-neutral-2-pressed: rgb(255 255 255 / 40%);
     --tui-background-accent-opposite: #fff;
     --tui-background-accent-opposite-hover: #f6f6f6;
     --tui-background-accent-opposite-pressed: #ededed;
     --tui-background-elevation-1: #222;
     --tui-background-elevation-2: #222;
     // Other
     --tui-service-autofill-background: rgb(85 74 42);
-    --tui-border-normal: rgb(255 255 255 / 0.14);
-    --tui-border-hover: rgb(255 255 255 / 0.6);
-    --tui-border-focus: rgb(255 255 255 / 0.64);
+    --tui-border-normal: rgb(255 255 255 / 14%);
+    --tui-border-hover: rgb(255 255 255 / 60%);
+    --tui-border-focus: rgb(255 255 255 / 64%);
     // Statuses
-    --tui-status-negative: rgb(255 140 103 / 1);
-    --tui-status-negative-pale: rgb(244 87 37 / 0.32);
-    --tui-status-negative-pale-hover: rgb(244 87 37 / 0.4);
+    --tui-status-negative: rgb(255 140 103 / 100%);
+    --tui-status-negative-pale: rgb(244 87 37 / 32%);
+    --tui-status-negative-pale-hover: rgb(244 87 37 / 40%);
     --tui-status-positive: rgb(74 201 155);
-    --tui-status-positive-pale: rgb(74 201 155 / 0.32);
-    --tui-status-positive-pale-hover: rgb(74 201 155 / 0.4);
+    --tui-status-positive-pale: rgb(74 201 155 / 32%);
+    --tui-status-positive-pale-hover: rgb(74 201 155 / 40%);
     --tui-status-warning: rgb(255 199 0);
-    --tui-status-warning-pale: rgb(255 199 0 / 0.32);
-    --tui-status-warning-pale-hover: rgb(255 199 0 / 0.4);
+    --tui-status-warning-pale: rgb(255 199 0 / 32%);
+    --tui-status-warning-pale-hover: rgb(255 199 0 / 40%);
     --tui-status-info: rgb(112 182 246);
-    --tui-status-info-pale: rgb(112 182 246 / 0.32);
-    --tui-status-info-pale-hover: rgb(112 182 246 / 0.4);
+    --tui-status-info-pale: rgb(112 182 246 / 32%);
+    --tui-status-info-pale-hover: rgb(112 182 246 / 40%);
     --tui-status-neutral: rgb(149 155 164);
     // Text
-    --tui-text-primary: rgb(255 255 255 / 1);
-    --tui-text-secondary: rgb(255 255 255 / 0.72);
-    --tui-text-tertiary: rgb(255 255 255 / 0.6);
+    --tui-text-primary: rgb(255 255 255 / 100%);
+    --tui-text-secondary: rgb(255 255 255 / 72%);
+    --tui-text-tertiary: rgb(255 255 255 / 60%);
     --tui-text-action: #6788ff;
     --tui-text-action-hover: #526ed3;
     --tui-text-positive: #44c596;
@@ -49,12 +49,12 @@
     // Backgrounds
     --tui-background-base: #fff;
     --tui-background-base-alt: #f6f6f6;
-    --tui-background-neutral-1: rgb(0 0 0 / 0.04);
-    --tui-background-neutral-1-hover: rgb(0 0 0 / 0.08);
-    --tui-background-neutral-1-pressed: rgb(0 0 0 / 0.12);
-    --tui-background-neutral-2: rgb(0 0 0 / 0.08);
-    --tui-background-neutral-2-hover: rgb(0 0 0 / 0.1);
-    --tui-background-neutral-2-pressed: rgb(0 0 0 / 0.14);
+    --tui-background-neutral-1: rgb(0 0 0 / 4%);
+    --tui-background-neutral-1-hover: rgb(0 0 0 / 8%);
+    --tui-background-neutral-1-pressed: rgb(0 0 0 / 12%);
+    --tui-background-neutral-2: rgb(0 0 0 / 8%);
+    --tui-background-neutral-2-hover: rgb(0 0 0 / 10%);
+    --tui-background-neutral-2-pressed: rgb(0 0 0 / 14%);
     --tui-background-accent-1: #526ed3;
     --tui-background-accent-1-hover: #6c86e2;
     --tui-background-accent-1-pressed: #314692;
@@ -68,29 +68,29 @@
     --tui-background-elevation-2: #fff;
     // Other
     --tui-service-autofill-background: #fff5c0;
-    --tui-service-selection-background: rgb(112 182 246 / 0.12);
-    --tui-service-backdrop: rgb(0 0 0 / 0.75);
-    --tui-border-normal: rgb(0 0 0 / 0.1);
-    --tui-border-hover: rgb(0 0 0 / 0.16);
-    --tui-border-focus: rgb(51 51 51 / 0.64);
+    --tui-service-selection-background: rgb(112 182 246 / 12%);
+    --tui-service-backdrop: rgb(0 0 0 / 75%);
+    --tui-border-normal: rgb(0 0 0 / 10%);
+    --tui-border-hover: rgb(0 0 0 / 16%);
+    --tui-border-focus: rgb(51 51 51 / 64%);
     // Statuses
-    --tui-status-negative: rgb(244 87 37 / 1);
-    --tui-status-negative-pale: rgb(244 87 37 / 0.12);
-    --tui-status-negative-pale-hover: rgb(244 87 37 / 0.24);
-    --tui-status-positive: rgb(74 201 155 / 1);
-    --tui-status-positive-pale: rgb(74 201 155 / 0.12);
-    --tui-status-positive-pale-hover: rgb(74 201 155 / 0.24);
-    --tui-status-warning: rgb(255 199 0 / 1);
-    --tui-status-warning-pale: rgb(255 199 0 / 0.12);
-    --tui-status-warning-pale-hover: rgb(255 199 0 / 0.24);
-    --tui-status-info: rgb(112 182 246 / 1);
-    --tui-status-info-pale: rgb(112 182 246 / 0.12);
-    --tui-status-info-pale-hover: rgb(112 182 246 / 0.24);
+    --tui-status-negative: rgb(244 87 37 / 100%);
+    --tui-status-negative-pale: rgb(244 87 37 / 12%);
+    --tui-status-negative-pale-hover: rgb(244 87 37 / 24%);
+    --tui-status-positive: rgb(74 201 155 / 100%);
+    --tui-status-positive-pale: rgb(74 201 155 / 12%);
+    --tui-status-positive-pale-hover: rgb(74 201 155 / 24%);
+    --tui-status-warning: rgb(255 199 0 / 100%);
+    --tui-status-warning-pale: rgb(255 199 0 / 12%);
+    --tui-status-warning-pale-hover: rgb(255 199 0 / 24%);
+    --tui-status-info: rgb(112 182 246 / 100%);
+    --tui-status-info-pale: rgb(112 182 246 / 12%);
+    --tui-status-info-pale-hover: rgb(112 182 246 / 24%);
     --tui-status-neutral: rgb(121 129 140);
     // Text
-    --tui-text-primary: rgb(27 31 59 / 1);
-    --tui-text-secondary: rgb(27 31 59 / 0.65);
-    --tui-text-tertiary: rgb(27 31 59 / 0.4);
+    --tui-text-primary: rgb(27 31 59 / 100%);
+    --tui-text-secondary: rgb(27 31 59 / 65%);
+    --tui-text-tertiary: rgb(27 31 59 / 40%);
     --tui-text-primary-on-accent-1: #fff;
     --tui-text-primary-on-accent-2: #fff;
     --tui-text-action: #526ed3;
@@ -124,9 +124,9 @@
     --tui-chart-categorical-21: #3682db;
     --tui-chart-categorical-22: #34b41f;
     // Shadows
-    --tui-shadow-small: 0 0.25rem 1.25rem rgb(0 0 0 / 0.1);
-    --tui-shadow-small-hover: 0 1rem 2.5rem rgb(0 0 0 / 0.14);
-    --tui-shadow-medium: 0 0.375rem 2rem rgb(0 0 0 / 0.12);
-    --tui-shadow-medium-hover: 0 1.25rem 4rem rgb(0 0 0 / 0.18);
-    --tui-shadow-popup: 0 1.25rem 3rem rgb(0 0 0 / 0.2);
+    --tui-shadow-small: 0 0.25rem 1.25rem rgb(0 0 0 / 10%);
+    --tui-shadow-small-hover: 0 1rem 2.5rem rgb(0 0 0 / 14%);
+    --tui-shadow-medium: 0 0.375rem 2rem rgb(0 0 0 / 12%);
+    --tui-shadow-medium-hover: 0 1.25rem 4rem rgb(0 0 0 / 18%);
+    --tui-shadow-popup: 0 1.25rem 3rem rgb(0 0 0 / 20%);
 }
diff --git a/projects/core/styles/theme/wrapper.less b/projects/core/styles/theme/wrapper.less
@@ -51,7 +51,7 @@
 
     background: var(--tui-background-base);
     color: var(--tui-text-primary);
-    box-shadow: 0 0.125rem 0.1875rem rgb(0 0 0 / 0.1);
+    box-shadow: 0 0.125rem 0.1875rem rgb(0 0 0 / 10%);
 
     &::after {
         .transition(color);

diff --git a/projects/demo/src/modules/app/landing/index.less b/projects/demo/src/modules/app/landing/index.less
@@ -6,7 +6,7 @@
     }
 
     50% {
-        color: rgb(0 0 0 / 0.2);
+        color: rgb(0 0 0 / 20%);
     }
 
     100% {
@@ -319,7 +319,7 @@
     inline-size: 1.875rem;
     block-size: 4.0625rem;
     border-radius: 1.25rem;
-    border: 3px solid rgb(0 0 0 / 0.2);
+    border: 3px solid rgb(0 0 0 / 20%);
     cursor: pointer;
     background: none;
     outline: none;

diff --git a/projects/demo/src/modules/components/axes/examples/2/index.less b/projects/demo/src/modules/components/axes/examples/2/index.less
@@ -26,7 +26,7 @@
     cursor: pointer;
 
     &:hover {
-        background-color: rgb(0 0 0 / 0.05);
+        background-color: rgb(0 0 0 / 5%);
     }
 }