@cds/core 6.10.0 → 6.11.0

package/tokens/tokens.js

@@ -258,6 +258,7 @@ export const globalColorConstruction700 = 'var(--cds-global-color-construction-7
 export const globalColorConstruction800 = 'var(--cds-global-color-construction-800)';
 export const globalColorConstruction900 = 'var(--cds-global-color-construction-900)';
 export const globalColorConstruction1000 = 'var(--cds-global-color-construction-1000)';
+export const globalColorConstruction1100 = 'var(--cds-global-color-construction-1100)';
 export const globalColorGray0 = 'var(--cds-global-color-gray-0)';
 export const globalColorGray50 = 'var(--cds-global-color-gray-50)';
 export const globalColorGray100 = 'var(--cds-global-color-gray-100)';
@@ -392,6 +393,8 @@ export const aliasObjectInteractionBackground = 'var(--cds-alias-object-interact
 export const aliasObjectInteractionBackgroundHover = 'var(--cds-alias-object-interaction-background-hover)';
 export const aliasObjectInteractionBackgroundActive = 'var(--cds-alias-object-interaction-background-active)';
 export const aliasObjectInteractionBackgroundSelected = 'var(--cds-alias-object-interaction-background-selected)';
+export const aliasObjectInteractionBackgroundSelectedHover = 'var(--cds-alias-object-interaction-background-selected-hover)';
+export const aliasObjectInteractionBackgroundSelectedActive = 'var(--cds-alias-object-interaction-background-selected-active)';
 export const aliasObjectInteractionBackgroundDisabled = 'var(--cds-alias-object-interaction-background-disabled)';
 export const aliasObjectInteractionBackgroundHighlight = 'var(--cds-alias-object-interaction-background-highlight)';
 export const aliasObjectInteractionColor = 'var(--cds-alias-object-interaction-color)';
@@ -426,6 +429,7 @@ export const aliasObjectContainerBackgroundDark = 'var(--cds-alias-object-contai
 export const aliasObjectContainerBackgroundInverse = 'var(--cds-alias-object-container-background-inverse)';
 export const aliasObjectContainerBackgroundInverseTint = 'var(--cds-alias-object-container-background-inverse-tint)';
 export const aliasObjectContainerBackgroundInverseShade = 'var(--cds-alias-object-container-background-inverse-shade)';
+export const aliasObjectContainerBackdropBackground = 'var(--cds-alias-object-container-backdrop-background)';
 export const aliasObjectContainerBorderColor = 'var(--cds-alias-object-container-border-color)';
 export const aliasStatusInfo = 'var(--cds-alias-status-info)';
 export const aliasStatusInfoTint = 'var(--cds-alias-status-info-tint)';

package/tokens/tokens.json

@@ -423,14 +423,14 @@
     "value": [
       9,
       100,
-      22
+      28
     ]
   },
   "globalColorRed1000": {
     "value": [
-      7,
-      10,
-      17
+      9,
+      100,
+      22
     ]
   },
   "globalColorOchre50": {
@@ -808,14 +808,14 @@
     "value": [
       160,
       70,
-      21
+      18
     ]
   },
   "globalColorJade1000": {
     "value": [
       160,
       69,
-      19
+      14
     ]
   },
   "globalColorYellow50": {
@@ -891,8 +891,8 @@
   "globalColorYellow1000": {
     "value": [
       40,
-      32,
-      14
+      100,
+      13
     ]
   },
   "globalColorLime50": {
@@ -1672,6 +1672,13 @@
       15
     ]
   },
+  "globalColorConstruction1100": {
+    "value": [
+      200,
+      31,
+      13
+    ]
+  },
   "globalColorGray0": {
     "value": [
       0,
@@ -2231,12 +2238,20 @@
   "aliasObjectInteractionBackgroundHover": {
     "value": [
       198,
-      100,
-      95
+      36,
+      96
     ],
-    "alias": "globalColorBlue50"
+    "alias": "globalColorConstruction50"
   },
   "aliasObjectInteractionBackgroundActive": {
+    "value": [
+      198,
+      20,
+      91
+    ],
+    "alias": "globalColorConstruction100"
+  },
+  "aliasObjectInteractionBackgroundSelected": {
     "value": [
       198,
       100,
@@ -2244,13 +2259,21 @@
     ],
     "alias": "globalColorBlue75"
   },
-  "aliasObjectInteractionBackgroundSelected": {
+  "aliasObjectInteractionBackgroundSelectedHover": {
     "value": [
       198,
-      100,
-      95
+      20,
+      91
     ],
-    "alias": "globalColorBlue50"
+    "alias": "globalColorConstruction100"
+  },
+  "aliasObjectInteractionBackgroundSelectedActive": {
+    "value": [
+      198,
+      14,
+      82
+    ],
+    "alias": "globalColorConstruction200"
   },
   "aliasObjectInteractionBackgroundDisabled": {
     "value": [
@@ -2392,7 +2415,7 @@
     "value": [
       9,
       100,
-      22
+      28
     ],
     "alias": "globalColorRed900"
   },
@@ -2519,6 +2542,9 @@
     ],
     "alias": "globalColorConstruction300"
   },
+  "aliasObjectContainerBackdropBackground": {
+    "value": "hsla(0, 0%, 100%, 0.6)"
+  },
   "aliasObjectContainerBorderColor": {
     "value": [
       198,
@@ -2635,7 +2661,7 @@
     "value": [
       9,
       100,
-      22
+      28
     ],
     "alias": "globalColorRed900"
   },

package/tokens/tokens.scss

@@ -293,6 +293,7 @@ $cds-global-color-construction-700: var(--cds-global-color-construction-700) !de
 $cds-global-color-construction-800: var(--cds-global-color-construction-800) !default;
 $cds-global-color-construction-900: var(--cds-global-color-construction-900) !default;
 $cds-global-color-construction-1000: var(--cds-global-color-construction-1000) !default;
+$cds-global-color-construction-1100: var(--cds-global-color-construction-1100) !default;
 $cds-global-color-gray-0: var(--cds-global-color-gray-0) !default;
 $cds-global-color-gray-50: var(--cds-global-color-gray-50) !default;
 $cds-global-color-gray-100: var(--cds-global-color-gray-100) !default;
@@ -470,6 +471,8 @@ $cds-alias-object-interaction-background: var(--cds-alias-object-interaction-bac
 $cds-alias-object-interaction-background-hover: var(--cds-alias-object-interaction-background-hover) !default;
 $cds-alias-object-interaction-background-active: var(--cds-alias-object-interaction-background-active) !default;
 $cds-alias-object-interaction-background-selected: var(--cds-alias-object-interaction-background-selected) !default;
+$cds-alias-object-interaction-background-selected-hover: var(--cds-alias-object-interaction-background-selected-hover) !default;
+$cds-alias-object-interaction-background-selected-active: var(--cds-alias-object-interaction-background-selected-active) !default;
 $cds-alias-object-interaction-background-disabled: var(--cds-alias-object-interaction-background-disabled) !default;
 $cds-alias-object-interaction-background-highlight: var(--cds-alias-object-interaction-background-highlight) !default;
 $cds-alias-object-interaction-color: var(--cds-alias-object-interaction-color) !default;
@@ -504,6 +507,7 @@ $cds-alias-object-container-background-dark: var(--cds-alias-object-container-ba
 $cds-alias-object-container-background-inverse: var(--cds-alias-object-container-background-inverse) !default;
 $cds-alias-object-container-background-inverse-tint: var(--cds-alias-object-container-background-inverse-tint) !default;
 $cds-alias-object-container-background-inverse-shade: var(--cds-alias-object-container-background-inverse-shade) !default;
+$cds-alias-object-container-backdrop-background: var(--cds-alias-object-container-backdrop-background) !default;
 $cds-alias-object-container-border-color: var(--cds-alias-object-container-border-color) !default;
 $cds-alias-status-info: var(--cds-alias-status-info) !default;
 $cds-alias-status-info-tint: var(--cds-alias-status-info-tint) !default;

package/tree-view/tree-item.element.scss.js

@@ -1,2 +1,2 @@
-import{css as o}from"lit";var t=o`:host{--animation-duration:var(--cds-global-animation-duration-secondary, 0.3s);--animation-easing:var(--cds-global-animation-easing-primary, cubic-bezier(0, 0.99, 0, 0.99));--background:var(--cds-alias-object-app-background, var(--cds-global-color-construction-25, #fcfdfd));--color:var(--cds-global-typography-color-400, var(--cds-global-color-construction-900, #21333b));--focus-width:var(--cds-alias-object-border-width-300, calc(3 * 1rem / var(--cds-global-base, 20)));--font-size:var(--cds-global-typography-font-size-3, calc(13 * 1rem / var(--cds-global-base, 20)));--font-weight:var(--cds-global-typography-body-font-weight, 400);cursor:pointer}.private-host{cursor:inherit}.item-children{overflow:hidden}.item-content{background:var(--background);border-left:var(--focus-width) solid transparent;color:var(--color);font-size:var(--font-size);font-weight:var(--font-weight);min-height:var(--cds-alias-object-interaction-touch-target,calc(36 * 1rem / var(--cds-global-base,20)))}.item-content:hover{--background:var(--cds-alias-object-interaction-background-hover, var(--cds-global-color-blue-50, #e6f7ff));--color:var(--cds-alias-object-interaction-color-hover, var(--cds-global-color-construction-1000, #1b2b32))}.lhs-container{width:var(--cds-global-space-7,calc(16 * 1rem / var(--cds-global-base,20)))}:host(:focus) .item-content{border-color:var(--cds-alias-object-interaction-background-hover,var(--cds-global-color-blue-50,#e6f7ff));outline-offset:calc(var(--cds-alias-object-interaction-outline-offset,1px)*-2);outline:var(--cds-alias-object-interaction-outline,Highlight solid 2px)}:host(:focus) .item-content:active{--background:var(--cds-alias-object-interaction-background-active, var(--cds-global-color-blue-75, #e0f6ff));--color:var(--cds-alias-object-interaction-color-active, var(--cds-global-color-construction-1000, #1b2b32))}@media (-webkit-min-device-pixel-ratio:0){:host(:focus) .item-content{outline:var(--cds-alias-object-interaction-outline-webkit,5px auto -webkit-focus-ring-color)}}:host([selected]) .item-content{--background:var(--cds-alias-object-interaction-background-selected, var(--cds-global-color-blue-50, #e6f7ff))}:host([disabled]) .item-content{--background:var(--cds-alias-object-interaction-background-disabled, var(--cds-global-color-white, white))!important;--color:var(--cds-alias-object-interaction-color-disabled, var(--cds-global-color-construction-300, #aeb8bc))!important;border-color:var(--cds-alias-object-interaction-color-disabled,var(--cds-global-color-construction-300,#aeb8bc))!important;cursor:not-allowed}:host([cds-motion=off])>.private-host>.item-children{height:0}:host([cds-motion=off][expanded])>.private-host>.item-children{height:auto}:host([cds-motion][_cds-animation-status=ready]:not([cds-motion=off]))>.private-host>.item-children{height:0}:host([cds-motion][expanded][_cds-animation-status=ready]:not([cds-motion=off]))>.private-host>.item-children{height:auto!important;transform:none}`;export{t as default};
+import{css as o}from"lit";var t=o`:host{--animation-duration:var(--cds-global-animation-duration-secondary, 0.3s);--animation-easing:var(--cds-global-animation-easing-primary, cubic-bezier(0, 0.99, 0, 0.99));--background:var(--cds-alias-object-app-background, var(--cds-global-color-construction-25, #fcfdfd));--color:var(--cds-global-typography-color-400, var(--cds-global-color-construction-900, #21333b));--focus-width:var(--cds-alias-object-border-width-300, calc(3 * 1rem / var(--cds-global-base, 20)));--font-size:var(--cds-global-typography-font-size-3, calc(13 * 1rem / var(--cds-global-base, 20)));--font-weight:var(--cds-global-typography-body-font-weight, 400);cursor:pointer}.private-host{cursor:inherit}.item-children{overflow:hidden}.item-content{background:var(--background);border-left:var(--focus-width) solid transparent;color:var(--color);font-size:var(--font-size);font-weight:var(--font-weight);min-height:var(--cds-alias-object-interaction-touch-target,calc(36 * 1rem / var(--cds-global-base,20)))}.item-content:hover{--background:var(--cds-alias-object-interaction-background-hover, var(--cds-global-color-construction-50, #f1f6f8));--color:var(--cds-alias-object-interaction-color-hover, var(--cds-global-color-construction-1000, #1b2b32))}.lhs-container{width:var(--cds-global-space-7,calc(16 * 1rem / var(--cds-global-base,20)))}:host(:focus) .item-content{border-color:var(--cds-alias-object-interaction-background-hover,var(--cds-global-color-construction-50,#f1f6f8));outline-offset:calc(var(--cds-alias-object-interaction-outline-offset,1px)*-2);outline:var(--cds-alias-object-interaction-outline,Highlight solid 2px)}:host(:focus) .item-content:active{--background:var(--cds-alias-object-interaction-background-active, var(--cds-global-color-construction-100, #e3eaed));--color:var(--cds-alias-object-interaction-color-active, var(--cds-global-color-construction-1000, #1b2b32))}@media (-webkit-min-device-pixel-ratio:0){:host(:focus) .item-content{outline:var(--cds-alias-object-interaction-outline-webkit,5px auto -webkit-focus-ring-color)}}:host([selected]) .item-content{--background:var(--cds-alias-object-interaction-background-selected, var(--cds-global-color-blue-75, #e0f6ff))}:host([disabled]) .item-content{--background:var(--cds-alias-object-interaction-background-disabled, var(--cds-global-color-white, white))!important;--color:var(--cds-alias-object-interaction-color-disabled, var(--cds-global-color-construction-300, #aeb8bc))!important;border-color:var(--cds-alias-object-interaction-color-disabled,var(--cds-global-color-construction-300,#aeb8bc))!important;cursor:not-allowed}:host([cds-motion=off])>.private-host>.item-children{height:0}:host([cds-motion=off][expanded])>.private-host>.item-children{height:auto}:host([cds-motion][_cds-animation-status=ready]:not([cds-motion=off]))>.private-host>.item-children{height:0}:host([cds-motion][expanded][_cds-animation-status=ready]:not([cds-motion=off]))>.private-host>.item-children{height:auto!important;transform:none}`;export{t as default};
 //# sourceMappingURL=tree-item.element.scss.js.map