@carbon/web-components 2.55.0 → 2.56.0-rc.0

package/lib/components/data-table/table.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"table.d.ts","sourceRoot":"","sources":["../../../src/components/data-table/table.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"table.d.ts","sourceRoot":"","sources":["../../../src/components/data-table/table.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carbon/web-components",
   "description": "Web components for the Carbon Design System",
-  "version": "2.55.0",
+  "version": "2.56.0-rc.0",
   "license": "Apache-2.0",
   "main": "es/index.js",
   "module": "es/index.js",
@@ -66,8 +66,8 @@
   },
   "dependencies": {
     "@carbon/icon-helpers": "10.47.0",
-    "@carbon/icons": "^11.81.0",
-    "@carbon/styles": "^1.107.0",
+    "@carbon/icons": "^11.82.0-rc.0",
+    "@carbon/styles": "^1.108.0-rc.0",
     "@carbon/utilities": "^0.17.0",
     "@floating-ui/dom": "^1.6.3",
     "@ibm/telemetry-js": "^1.10.2",
@@ -126,5 +126,5 @@
       }
     ]
   },
-  "gitHead": "2d98f4ee9914fa44acba58f62599c3f5382acad0"
+  "gitHead": "b23ca747c33b76557a54aa88b6df70bc76f55da9"
 }

package/scss/components/button/button.scss

@@ -230,7 +230,6 @@ $css--plex: true !default;
       block-size: $spacing-05;
       content: '';
       inline-size: rem(1px);
-      inset-block-start: rem(15px);
       inset-inline-start: 0;
       opacity: var(--divider-opacity);
       transition: opacity $duration-fast-02 motion(standard, productive);
@@ -241,26 +240,3 @@ $css--plex: true !default;
     }
   }
 }
-
-:host(#{$prefix}-button.#{$prefix}--batch-summary__cancel[size='sm']) {
-  button.#{$prefix}--btn {
-    block-size: $spacing-07;
-    min-block-size: auto;
-    padding-block: 0.375rem;
-
-    &::before {
-      inset-block-start: rem(8px);
-    }
-  }
-}
-
-:host(#{$prefix}-button.#{$prefix}--batch-summary__cancel[size='lg']) {
-  button.#{$prefix}--btn {
-    block-size: $spacing-09;
-    min-block-size: auto;
-
-    &::before {
-      inset-block-start: rem(15px);
-    }
-  }
-}

package/scss/components/data-table/_table-action.scss

@@ -15,6 +15,7 @@
 @use '@carbon/styles/scss/components/data-table/data-table';
 @use '@carbon/styles/scss/components/data-table/action';
 @use '@carbon/styles/scss/layout' as *;
+@use '@carbon/styles/scss/utilities/layout';
 //
 // Table toolbar
 //
@@ -26,41 +27,21 @@
   z-index: 1;
 }
 
-:host(#{$prefix}-table-toolbar[size='xs']),
-:host(#{$prefix}-table-toolbar[size='sm']) {
-  @extend .#{$prefix}--table-toolbar--sm;
-}
-
 :host(#{$prefix}-table-toolbar-content) {
   @extend .#{$prefix}--toolbar-content;
 
   ::slotted(#{$prefix}-overflow-menu) {
     display: flex;
-    block-size: $spacing-09;
+    block-size: layout.size('height');
     cursor: pointer;
-    inline-size: $spacing-09;
+    inline-size: layout.size('height');
     transition: background-color $duration-fast-02 motion(entrance, productive);
   }
 }
 
-:host(#{$prefix}-table-toolbar-content[size='xs']),
-:host(#{$prefix}-table-toolbar-content[size='sm']) {
-  ::slotted(#{$prefix}-table-toolbar-search),
-  ::slotted(#{$prefix}-overflow-menu),
-  ::slotted(#{$prefix}-button) {
-    block-size: $spacing-07;
-    min-block-size: $spacing-07;
-  }
-
-  ::slotted(#{$prefix}-table-toolbar-search),
-  ::slotted(#{$prefix}-overflow-menu) {
-    inline-size: $spacing-07;
-  }
-}
-
 :host(#{$prefix}-table-toolbar-content[has-batch-actions]) {
   clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
-  transform: translate3d(0, $spacing-09, 0);
+  transform: translate3d(0, layout.size('height'), 0);
   transition:
     transform $duration-fast-02 motion(standard, productive),
     clip-path $duration-fast-02 motion(standard, productive);
@@ -70,67 +51,13 @@
   @extend .#{$prefix}--toolbar-action;
   @extend .#{$prefix}--toolbar-search-container-expandable;
 
-  &:hover {
-    background-color: $field-hover;
-  }
-
   flex: none;
+  block-size: layout.size('height');
+  inline-size: layout.size('height');
   transition: flex 175ms $standard-easing;
 
-  .#{$prefix}--search {
-    block-size: 100%;
-    inline-size: 100%;
-
-    .#{$prefix}--search-magnifier {
-      cursor: pointer;
-      inset-inline-start: 0;
-      pointer-events: all;
-      transition: background $duration-fast-02 motion(entrance, productive);
-
-      &-icon {
-        block-size: auto;
-        inline-size: auto;
-      }
-    }
-
-    .#{$prefix}--search-input {
-      border-block-end: 0;
-    }
-
-    .#{$prefix}--search-close {
-      block-size: $spacing-09;
-      inline-size: $spacing-09;
-
-      &::before {
-        background-color: $background-hover;
-        inline-size: 0;
-      }
-
-      :hover {
-        background-color: none;
-      }
-    }
-
-    :hover {
-      background-color: none;
-    }
-  }
-
-  svg {
-    inset-inline-start: 0;
-  }
-}
-
-:host(#{$prefix}-table-toolbar-search[size='xs']),
-:host(#{$prefix}-table-toolbar-search[size='sm']) {
-  .#{$prefix}--search-close {
-    block-size: rem(32px);
-    inline-size: rem(32px);
-  }
-
-  svg {
-    padding: 0;
-    inset-inline-start: $spacing-03;
+  .#{$prefix}--search-input {
+    border-block-end: 0;
   }
 }
 
@@ -140,15 +67,8 @@
   flex: auto;
 }
 
-:host(#{$prefix}-table-toolbar-search[size='xs'][expanded]),
-:host(#{$prefix}-table-toolbar-search[size='sm'][expanded]) {
-  svg {
-    inset-inline-start: $spacing-05;
-  }
-}
-
-:host(#{$prefix}-table-toolbar-search[persistent]:hover) {
-  .#{$prefix}--search-input {
+:host(#{$prefix}-table-toolbar-search:hover) {
+  .#{$prefix}--search {
     background-color: $field-hover;
   }
 }
@@ -157,103 +77,27 @@
   @extend .#{$prefix}--batch-actions;
 
   box-sizing: border-box;
+  block-size: layout.size('height');
+  min-block-size: layout.size('height');
   overflow-x: auto;
-}
-
-:host(#{$prefix}-table-batch-actions[active]) {
-  @extend .#{$prefix}--batch-actions--active;
-}
-
-:host(#{$prefix}-table-batch-actions[size='xs']),
-:host(#{$prefix}-table-batch-actions[size='sm']) {
-  block-size: $spacing-07;
-  min-block-size: $spacing-07;
-
-  .#{$prefix}--batch-summary {
-    block-size: $spacing-07;
-    min-block-size: $spacing-07;
-
-    &__para {
-      padding: 0;
-      margin: 0;
-      block-size: $spacing-07;
-      line-height: $spacing-07;
-    }
-  }
-
-  .#{$prefix}--action-list {
-    block-size: $spacing-07;
-  }
-
-  .#{$prefix}--btn--primary.#{$prefix}--batch-summary__cancel {
-    block-size: $spacing-07;
-    min-block-size: auto;
-    padding-block: 0.375rem;
-
-    &::before {
-      inset-block-start: rem(8px);
-    }
-  }
-}
-
-:host(#{$prefix}-table-batch-actions[size='md']),
-:host(#{$prefix}-table-batch-actions[size='lg']),
-:host(#{$prefix}-table-batch-actions[size='xl']) {
-  block-size: $spacing-09;
-  min-block-size: $spacing-09;
 
   .#{$prefix}--batch-summary {
-    block-size: $spacing-09;
-    min-block-size: $spacing-09;
+    block-size: layout.size('height');
+    min-block-size: layout.size('height');
 
     &__para {
-      padding: 0;
-      margin: 0;
-      block-size: $spacing-09;
-      line-height: $spacing-09;
+      block-size: layout.size('height');
+      line-height: layout.size('height');
     }
   }
 
   .#{$prefix}--action-list {
-    block-size: $spacing-09;
+    block-size: layout.size('height');
   }
-
-  .#{$prefix}--btn--primary.#{$prefix}--batch-summary__cancel {
-    block-size: $spacing-09;
-    min-block-size: auto;
-
-    &::before {
-      inset-block-start: rem(15px);
-    }
-  }
-}
-
-:host(#{$prefix}-table-toolbar-content[has-batch-actions][size='xs']),
-:host(#{$prefix}-table-toolbar-content[has-batch-actions][size='sm']) {
-  transform: translate3d(0, $spacing-07, 0);
 }
 
-:host(#{$prefix}-table-toolbar-content[has-batch-actions][size='md']),
-:host(#{$prefix}-table-toolbar-content[has-batch-actions][size='lg']),
-:host(#{$prefix}-table-toolbar-content[has-batch-actions][size='xl']) {
-  transform: translate3d(0, $spacing-09, 0);
+:host(#{$prefix}-table-batch-actions[active]) {
+  @extend .#{$prefix}--batch-actions--active;
 }
 
-:host(#{$prefix}-table-batch-actions) {
-  .#{$prefix}--btn--primary.#{$prefix}--batch-summary__cancel {
-    --divider-opacity: 1;
-
-    &::before {
-      @media (prefers-reduced-motion: reduce) {
-        transition: none;
-      }
-
-      opacity: var(--divider-opacity);
-      transition: opacity $duration-fast-02 motion(standard, productive);
-    }
-
-    &:hover::before {
-      opacity: 0;
-    }
-  }
-}
+@include emit-layout-tokens-to-shadow-host(#{$prefix}-table-toolbar);

package/scss/components/data-table/_table-sizes.scss

@@ -1,5 +1,5 @@
 //
-// Copyright IBM Corp. 2019, 2024
+// Copyright IBM Corp. 2019, 2026
 //
 // This source code is licensed under the Apache-2.0 license found in the
 // LICENSE file in the root directory of this source tree.
@@ -147,38 +147,6 @@
   }
 }
 
-// Small persistent toolbar
-:host(#{$prefix}-table-toolbar[size='xs']),
-:host(#{$prefix}-table-toolbar-content[size='xs']) {
-  &,
-  ::slotted(#{$prefix}-table-toolbar-search),
-  ::slotted(#{$prefix}-overflow-menu),
-  ::slotted(#{$prefix}-button) {
-    block-size: $spacing-07;
-    min-block-size: $spacing-07;
-  }
-  ::slotted(#{$prefix}-table-toolbar-search),
-  ::slotted(#{$prefix}-overflow-menu) {
-    inline-size: $spacing-07;
-  }
-}
-
-:host(#{$prefix}-table-toolbar[size='sm']),
-:host(#{$prefix}-table-toolbar-content[size='sm']) {
-  &,
-  ::slotted(#{$prefix}-table-toolbar-search),
-  ::slotted(#{$prefix}-overflow-menu),
-  ::slotted(#{$prefix}-button) {
-    block-size: $spacing-07;
-    min-block-size: $spacing-07;
-  }
-
-  ::slotted(#{$prefix}-table-toolbar-search),
-  ::slotted(#{$prefix}-overflow-menu) {
-    inline-size: $spacing-07;
-  }
-}
-
 //
 // "selection" and "expandable" sizes
 //

package/scss/components/fluid-form/fluid-form.scss

@@ -19,6 +19,6 @@ $css--plex: true !default;
   --cds-field: var(--cds-field-01);
 
   .#{$prefix}--form--fluid {
-    margin-inline: -$spacing-05 - $spacing-05;
+    margin-inline: -$spacing-03 - $spacing-03;
   }
 }