@carbon/ibm-products-web-components 0.29.0 → 0.30.0-rc.0

package/scss/components/truncated-text/truncated-text.scss

@@ -1,110 +0,0 @@
-/*
-* Copyright IBM Corp. 2025, 2025
-*
-* This source code is licensed under the Apache-2.0 license found in the
-* LICENSE file in the root directory of this source tree.
-*/
-
-// $css--plex: true !default;
-
-@use 'sass:map';
-@use '@carbon/styles/scss/utilities' as *;
-@use '@carbon/styles/scss/spacing' as *;
-@use '@carbon/styles/scss/theme' as *;
-@use '@carbon/styles/scss/motion' as *;
-@use '@carbon/styles/scss/config';
-
-$prefix: 'c4p';
-$carbon-prefix: config.$prefix;
-$block-class: #{$prefix}--truncated-text;
-
-// Common reset button style
-%reset-button {
-  border: none;
-  cursor: pointer;
-  font: inherit;
-  line-height: inherit;
-}
-
-// Mixin for directional gradients
-@mixin gradient-bg($direction, $color) {
-  background: linear-gradient($direction, rgba(255, 255, 255, 0) 0%, $color 0%);
-}
-
-:host(#{$prefix}-truncated-text) {
-  display: block;
-  inline-size: 100%;
-
-  .#{$block-class}_transition {
-    @media (prefers-reduced-motion: no-preference) {
-      transition: max-height $duration-fast-02 motion(standard, productive);
-    }
-  }
-
-  .#{$block-class}_content {
-    display: -webkit-box;
-    overflow: hidden;
-    -webkit-box-orient: vertical;
-    -webkit-line-clamp: var(--line-clamp, 0);
-    text-overflow: clip;
-    white-space: normal;
-
-    &:focus {
-      @include focus-outline('outline');
-    }
-  }
-
-  .#{$block-class}_content--closing {
-    -webkit-line-clamp: none;
-  }
-
-  #{$carbon-prefix}-tooltip {
-    display: inline-flex;
-  }
-
-  button:focus,
-  .#{$block-class}_button-expand:focus,
-  .#{$block-class}_button-collapse:focus {
-    @include focus-outline('outline');
-  }
-}
-
-.#{$block-class}_button-expand,
-.#{$block-class}_button-collapse {
-  @extend %reset-button;
-
-  padding: 0 $spacing-01;
-  color: $link-primary;
-
-  &.#{$block-class}_button-hide {
-    display: none;
-  }
-}
-
-.#{$block-class}_button-expand {
-  &.#{$block-class}_button-layered {
-    background-color: $layer;
-  }
-
-  // Gradient LTR
-  &:dir(ltr)::before {
-    @include gradient-bg(90deg, $background);
-  }
-
-  &.#{$block-class}_button-layered:dir(ltr)::before {
-    @include gradient-bg(90deg, $layer);
-  }
-
-  // Gradient RTL
-  &:dir(rtl)::before {
-    @include gradient-bg(270deg, $background);
-  }
-
-  &.#{$block-class}_button-layered:dir(rtl)::before {
-    @include gradient-bg(270deg, $layer);
-  }
-}
-
-.#{$block-class}_button-collapse {
-  background-color: transparent;
-}

package/scss/components/user-avatar/user-avatar.scss

@@ -1,119 +0,0 @@
-/*
-* Copyright IBM Corp. 2025, 2025
-*
-* This source code is licensed under the Apache-2.0 license found in the
-* LICENSE file in the root directory of this source tree.
-*/
-
-$css--plex: true !default;
-
-/* Other Carbon settings. */
-@use '@carbon/styles/scss/reset';
-@use '@carbon/styles/scss/breakpoint' as *;
-@use '@carbon/styles/scss/config' as *;
-@use '@carbon/styles/scss/motion' as *;
-@use '@carbon/styles/scss/spacing' as *;
-@use '@carbon/styles/scss/theme' as *;
-@use '@carbon/styles/scss/type';
-@use '@carbon/styles/scss/colors' as *;
-@use '@carbon/styles/scss/layout' as *;
-@use '@carbon/styles/scss/utilities';
-@use 'sass:map';
-
-@use '@carbon/ibm-products-styles/scss/components/UserAvatar' as *;
-
-$prefix: 'c4p';
-$carbon-prefix: 'cds';
-
-$block-class: #{$prefix}--user-avatar;
-
-:host(#{$prefix}-user-avatar) {
-  display: inline-block;
-
-  .#{$block-class} {
-    box-sizing: border-box;
-  }
-}
-
-:host(#{$prefix}-user-avatar) .#{$block-class}--xl {
-  ::slotted([slot='rendericon']) {
-    block-size: $spacing-07;
-    inline-size: $spacing-07;
-  }
-}
-:host(#{$prefix}-user-avatar) .#{$block-class}--lg {
-  ::slotted([slot='rendericon']) {
-    block-size: $spacing-06;
-    inline-size: $spacing-06;
-  }
-}
-:host(#{$prefix}-user-avatar) .#{$block-class}--md {
-  ::slotted([slot='rendericon']) {
-    block-size: $spacing-04 + $spacing-03;
-    inline-size: $spacing-04 + $spacing-03;
-  }
-}
-:host(#{$prefix}-user-avatar) .#{$block-class}--sm {
-  ::slotted([slot='rendericon']) {
-    block-size: $spacing-05;
-    inline-size: $spacing-05;
-  }
-}
-
-:host(#{$prefix}-user-avatar) .#{$block-class}__tooltip-trigger {
-  padding: 0;
-  border: 0;
-  background: none;
-  outline: none;
-}
-
-:host(#{$prefix}-user-avatar) .#{$block-class}__tooltip-content {
-  --cds-tooltip-padding-block: #{$spacing-01};
-
-  &:focus-within {
-    outline: $spacing-01 solid $focus;
-    outline-offset: 1px;
-  }
-}
-
-@mixin setBgColor($color) {
-  // stylelint-disable-next-line carbon/theme-use
-  background-color: $color;
-}
-
-//this mixin allows you to set background color based on the lighter themes such as g10 and white
-@mixin setLightBg($order, $color) {
-  :host(#{$prefix}-user-avatar) .#{$block-class}--#{$order},
-  :host(#{$prefix}-user-avatar[theme='light']) .#{$block-class}--#{$order} {
-    @include setBgColor($color);
-  }
-}
-@mixin setDarkBg($order, $color) {
-  :host(#{$prefix}-user-avatar[theme='dark']) .#{$block-class}--#{$order} {
-    @include setBgColor($color);
-  }
-}
-@include setLightBg(order-1-cyan, $cyan-60);
-@include setLightBg(order-2-gray, $gray-60);
-@include setLightBg(order-3-green, $green-60);
-@include setLightBg(order-4-magenta, $magenta-60);
-@include setLightBg(order-5-purple, $purple-60);
-@include setLightBg(order-6-teal, $teal-60);
-@include setLightBg(order-7-cyan, $cyan-80);
-@include setLightBg(order-8-gray, $gray-80);
-@include setLightBg(order-9-green, $green-80);
-@include setLightBg(order-10-magenta, $magenta-80);
-@include setLightBg(order-11-purple, $purple-80);
-@include setLightBg(order-12-teal, $teal-80);
-@include setDarkBg(order-1-cyan, $cyan-50);
-@include setDarkBg(order-2-gray, $gray-50);
-@include setDarkBg(order-3-green, $green-50);
-@include setDarkBg(order-4-magenta, $magenta-50);
-@include setDarkBg(order-5-purple, $purple-50);
-@include setDarkBg(order-6-teal, $teal-50);
-@include setDarkBg(order-7-cyan, $cyan-30);
-@include setDarkBg(order-8-gray, $gray-30);
-@include setDarkBg(order-9-green, $green-30);
-@include setDarkBg(order-10-magenta, $magenta-30);
-@include setDarkBg(order-11-purple, $purple-30);
-@include setDarkBg(order-12-teal, $teal-30);