@carbon/ibm-products-styles 2.76.0 → 2.77.0-rc.0

package/scss/components/CoachmarkOverlayElements/_index.scss

@@ -1,8 +0,0 @@
-//
-// Copyright IBM Corp. 2023, 2024
-//
-// This source code is licensed under the Apache-2.0 license found in the
-// LICENSE file in the root directory of this source tree.
-//
-
-@use './coachmark-overlay-elements';

package/scss/components/CoachmarkStack/_carbon-imports.scss

@@ -1,9 +0,0 @@
-//
-// Copyright IBM Corp. 2023, 2024
-//
-// This source code is licensed under the Apache-2.0 license found in the
-// LICENSE file in the root directory of this source tree.
-//
-
-// Import any Carbon component styles used from CoachmarkStack in this file.
-// CoachmarkStack uses the following Carbon components:

package/scss/components/CoachmarkStack/_coachmark-stack.scss

@@ -1,133 +0,0 @@
-//
-// Copyright IBM Corp. 2023, 2024
-//
-// This source code is licensed under the Apache-2.0 license found in the
-// LICENSE file in the root directory of this source tree.
-//
-
-/* stylelint-disable max-nesting-depth */
-
-// Standard imports.
-@use '../../global/styles/project-settings' as c4p-settings;
-@use '../../global/styles/mixins';
-@use '@carbon/styles/scss/spacing' as *;
-@use '@carbon/styles/scss/motion' as *;
-@use '@carbon/styles/scss/colors' as *;
-@use '@carbon/styles/scss/theme' as *;
-@use '@carbon/layout/scss/convert';
-@use '@carbon/styles/scss/components/button/tokens' as *;
-// Other Carbon settings if needed
-// TODO: @use '@carbon/styles/scss/grid';
-// or
-// TODO: @use '@carbon/styles/scss/grid';
-
-// CoachmarkStack uses the following Carbon for IBM Products components:
-// TODO: @use(s) of IBM Products component styles used by CoachmarkStack
-
-// The block part of our conventional BEM class names (blockClass__E--M).
-
-$elements-block-class: #{c4p-settings.$pkg-prefix}--coachmark-stack-element;
-$overlay-class: #{c4p-settings.$pkg-prefix}--coachmark-overlay;
-$stack-home-class: #{c4p-settings.$pkg-prefix}--coachmark-stacked-home;
-$style-stack-home: #{c4p-settings.$pkg-prefix}--coachmark-stack;
-
-.#{$elements-block-class} {
-  $block: &;
-
-  position: fixed;
-  z-index: 5901;
-  inset-block-end: -100%;
-  inset-inline-end: $spacing-05;
-  //opacity: 0;
-  transform: translateY(100%);
-  visibility: hidden;
-
-  &--is-mounted {
-    inset-block-end: 0;
-    /* stylelint-disable-next-line carbon/motion-easing-use, carbon/motion-duration-use */
-    transition: $duration-fast-02 motion(exit, productive);
-    @media (prefers-reduced-motion) {
-      transition: none;
-    }
-  }
-
-  &--is-visible {
-    opacity: 1;
-    transform: translateY(0);
-    visibility: visible;
-  }
-
-  // Stack the level-one item behind the level-two item.
-  &--is-stacked {
-    overflow: hidden;
-    inset-block-end: 0;
-    pointer-events: none;
-    /* stylelint-disable-next-line function-no-unknown -- to-rem carbon replacement for rem */
-    transform: perspective(convert.to-rem(144px))
-      translate3d(0, calc($spacing-09 * -1), calc($spacing-05 * -1));
-    transform-origin: top center;
-    visibility: visible;
-
-    &__light {
-      /* stylelint-disable-next-line carbon/theme-use */
-      background-color: $gray-90;
-    }
-
-    &__dark {
-      /* stylelint-disable-next-line carbon/theme-use */
-      background-color: $button-tertiary-active;
-    }
-  }
-}
-
-// ALL SUBSEQUENT ITEMS ARE THE "CHILD" STACK ITEMS
-.#{$elements-block-class} ~ .#{$elements-block-class} {
-  z-index: 5902;
-}
-
-// SPECIFIC TO THE HOME ELEMENT
-.#{$stack-home-class} {
-  &__nav-links {
-    margin-block-start: $spacing-04;
-    margin-inline-start: calc(-1 * $spacing-05);
-  }
-
-  &__icon-idea {
-    margin-block-end: $spacing-03;
-  }
-
-  li {
-    display: block;
-    max-inline-size: 100%;
-    white-space: nowrap;
-  }
-
-  button,
-  &__navLinkLabels-tooltip {
-    max-inline-size: 100%;
-
-    .#{c4p-settings.$carbon-prefix}--tooltip-content {
-      color: $text-primary;
-      margin-inline-start: calc($spacing-02 + $spacing-01);
-      max-inline-size: 100%;
-    }
-  }
-
-  &__navLinkLabels-text {
-    display: inline-block;
-    overflow: hidden;
-    max-inline-size: 100%;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-  }
-}
-
-.#{$style-stack-home}--scaled-home {
-  opacity: 0.8;
-  transform: scale(0.9);
-}
-
-.#{$style-stack-home}--unscaled-home {
-  opacity: 1;
-  transform: none;
-}

package/scss/components/CoachmarkStack/_index-with-carbon.scss

@@ -1,9 +0,0 @@
-//
-// Copyright IBM Corp. 2023, 2024
-//
-// This source code is licensed under the Apache-2.0 license found in the
-// LICENSE file in the root directory of this source tree.
-//
-
-@use './carbon-imports';
-@use './coachmark-stack';

package/scss/components/CoachmarkStack/_index.scss

@@ -1,8 +0,0 @@
-//
-// Copyright IBM Corp. 2023, 2024
-//
-// This source code is licensed under the Apache-2.0 license found in the
-// LICENSE file in the root directory of this source tree.
-//
-
-@use './coachmark-stack';

package/scss/components/ComboButton/_carbon-imports.scss

@@ -1,11 +0,0 @@
-//
-// Copyright IBM Corp. 2022, 2022
-//
-// This source code is licensed under the Apache-2.0 license found in the
-// LICENSE file in the root directory of this source tree.
-//
-
-// ComboButton uses the following Carbon components:
-// Button, OverflowMenu
-@use '@carbon/styles/scss/components/button';
-@use '@carbon/styles/scss/components/overflow-menu';

package/scss/components/ComboButton/_combo-button.scss

@@ -1,78 +0,0 @@
-//
-// Copyright IBM Corp. 2020, 2024
-//
-// This source code is licensed under the Apache-2.0 license found in the
-// LICENSE file in the root directory of this source tree.
-//
-
-@use '@carbon/styles/scss/spacing' as *;
-@use '@carbon/styles/scss/theme' as *;
-@use '@carbon/styles/scss/components/button/tokens' as *;
-@use '../../global/styles/project-settings' as c4p-settings;
-
-.#{c4p-settings.$pkg-prefix}--combo-button {
-  position: relative;
-  display: inline-flex;
-}
-
-.#{c4p-settings.$pkg-prefix}--combo-button__action {
-  display: block;
-  overflow-x: hidden;
-  @supports (overflow-inline: hidden) {
-    overflow-inline: hidden;
-  }
-
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-.#{c4p-settings.$pkg-prefix}--combo-button
-  .#{c4p-settings.$pkg-prefix}--combo-button__overflow-menu {
-  background-color: $background-brand;
-  block-size: $spacing-09;
-  border-inline-start: $spacing-01 solid $border-subtle-01;
-  inline-size: $spacing-09;
-}
-
-.#{c4p-settings.$pkg-prefix}--combo-button
-  .#{c4p-settings.$pkg-prefix}--combo-button__overflow-menu.#{c4p-settings.$carbon-prefix}--overflow-menu:hover,
-.#{c4p-settings.$pkg-prefix}--combo-button
-  .#{c4p-settings.$pkg-prefix}--combo-button__overflow-menu.#{c4p-settings.$carbon-prefix}--overflow-menu--open,
-.#{c4p-settings.$pkg-prefix}--combo-button
-  .#{c4p-settings.$carbon-prefix}--overflow-menu.#{c4p-settings.$carbon-prefix}--overflow-menu--open:hover,
-.#{c4p-settings.$pkg-prefix}--combo-button
-  .#{c4p-settings.$carbon-prefix}--overflow-menu.#{c4p-settings.$carbon-prefix}--overflow-menu--open {
-  background-color: $button-primary-hover;
-}
-
-.#{c4p-settings.$pkg-prefix}--combo-button
-  .cds--overflow-menu--flip.cds--overflow-menu-options[data-floating-menu-direction='bottom']::after {
-  block-size: 0;
-  inline-size: 0;
-}
-
-.#{c4p-settings.$pkg-prefix}--combo-button__overflow-menu.#{c4p-settings.$carbon-prefix}--overflow-menu:active {
-  background-color: $button-primary-active;
-}
-
-.#{c4p-settings.$pkg-prefix}--combo-button__overflow-menu__icon {
-  fill: $icon-on-color;
-  pointer-events: none;
-}
-
-.#{c4p-settings.$pkg-prefix}--combo-button__overflow-menu__list.#{c4p-settings.$carbon-prefix}--overflow-menu-options {
-  inline-size: 100%;
-  inset-inline-start: 0;
-}
-
-.#{c4p-settings.$pkg-prefix}--combo-button__overflow-menu__list:after {
-  display: none;
-}
-
-.#{c4p-settings.$pkg-prefix}--combo-button__overflow-menu__item.#{c4p-settings.$carbon-prefix}--overflow-menu-options__btn {
-  max-inline-size: 100%;
-}
-
-.#{c4p-settings.$pkg-prefix}--combo-button__overflow-menu__item__icon {
-  margin-inline-start: auto;
-}

package/scss/components/ComboButton/_index-with-carbon.scss

@@ -1,9 +0,0 @@
-//
-// Copyright IBM Corp. 2022, 2022
-//
-// This source code is licensed under the Apache-2.0 license found in the
-// LICENSE file in the root directory of this source tree.
-//
-
-@use './carbon-imports';
-@use './combo-button';

package/scss/components/ComboButton/_index.scss

@@ -1,10 +0,0 @@
-//
-// Copyright IBM Corp. 2020, 2021
-//
-// This source code is licensed under the Apache-2.0 license found in the
-// LICENSE file in the root directory of this source tree.
-//
-
-// An index file is most useful when you have multiple components
-
-@use './combo-button';

package/scss/components/ConditionBuilder/_carbon-imports.scss

@@ -1,9 +0,0 @@
-//
-// Copyright IBM Corp. 2024, 2024
-//
-// This source code is licensed under the Apache-2.0 license found in the
-// LICENSE file in the root directory of this source tree.
-//
-
-// Import any Carbon component styles used from ConditionBuilder in this file.
-// ConditionBuilder uses the following Carbon components:

package/scss/components/ConditionBuilder/_condition-builder.scss

@@ -1,79 +0,0 @@
-//
-// Copyright IBM Corp. 2024, 2024
-//
-// This source code is licensed under the Apache-2.0 license found in the
-// LICENSE file in the root directory of this source tree.
-//
-
-// Standard imports.
-@use '../../global/styles/project-settings' as c4p-settings;
-@use '../../global/styles/mixins';
-@use '@carbon/styles/scss/spacing' as *;
-@use '@carbon/styles/scss/type' as *;
-@use '@carbon/styles/scss/theme';
-
-@use './styles/index';
-// Other Carbon settings if needed
-// TODO: @use '@carbon/styles/scss/grid';
-// or
-// TODO: @use '@carbon/styles/scss/grid';
-
-// ConditionBuilder uses the following Carbon for IBM Products components:
-// TODO: @use(s) of IBM Products component styles used by ConditionBuilder
-
-// The block part of our conventional BEM class names (blockClass__E--M).
-$block-class: #{c4p-settings.$pkg-prefix}--condition-builder;
-
-.#{$block-class}__condition-builder__group {
-  display: flex;
-}
-
-.#{$block-class}__visible {
-  visibility: visible;
-}
-
-.#{$block-class}__hidden {
-  visibility: hidden;
-}
-
-.#{$block-class}__condition-wrapper {
-  display: flex;
-  flex-flow: row wrap;
-}
-.#{$block-class}__gap {
-  margin-inline-end: $spacing-01;
-}
-.#{$block-class}__gap-bottom {
-  margin-block-end: $spacing-01;
-}
-.#{$block-class}__gap-left {
-  margin-inline-start: $spacing-01;
-}
-.#{$block-class}__condition-block {
-  display: flex;
-  flex-direction: row;
-  inline-size: fit-content;
-}
-.#{$block-class}__content-container {
-  display: flex;
-  flex-direction: column;
-  row-gap: $spacing-02;
-}
-.#{$block-class}__heading {
-  margin-block: $spacing-03;
-}
-.#{$block-class}__Hierarchical
-  .#{$block-class}__actions-container
-  .#{$block-class}__condition-wrapper {
-  flex-direction: column;
-}
-.#{$block-class}__group-separator {
-  margin-block-start: $spacing-02;
-}
-.#{$block-class}__add-group,
-.#{$block-class}__group-separator {
-  inline-size: fit-content;
-}
-.#{$block-class}__tooltip {
-  word-break: break-all;
-}

package/scss/components/ConditionBuilder/_index-with-carbon.scss

@@ -1,9 +0,0 @@
-//
-// Copyright IBM Corp. 2024, 2024
-//
-// This source code is licensed under the Apache-2.0 license found in the
-// LICENSE file in the root directory of this source tree.
-//
-
-@use './carbon-imports';
-@use './condition-builder';

package/scss/components/ConditionBuilder/_index.scss

@@ -1,8 +0,0 @@
-//
-// Copyright IBM Corp. 2024, 2024
-//
-// This source code is licensed under the Apache-2.0 license found in the
-// LICENSE file in the root directory of this source tree.
-//
-
-@use './condition-builder';

package/scss/components/ConditionBuilder/styles/_conditionBuilderCondition.scss

@@ -1,114 +0,0 @@
-/**
- * Copyright IBM Corp. 2024
- *
- * This source code is licensed under the Apache-2.0 license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-@use '@carbon/styles/scss/theme' as *;
-@use '@carbon/styles/scss/spacing' as *;
-@use '@carbon/styles/scss/motion' as *;
-@use '@carbon/styles/scss/components/tag/tokens' as *;
-@use '@carbon/styles/scss/utilities/focus-outline';
-@use '../../../global/styles/project-settings' as c4p-settings;
-@use '@carbon/styles/scss/type';
-@use '@carbon/styles/scss/type' as *;
-@use '@carbon/styles/scss/utilities';
-
-$block-class: #{c4p-settings.$pkg-prefix}--condition-builder;
-
-.#{$block-class}__condition-block,
-.#{$block-class}__condition-block .#{$block-class}__block {
-  position: relative;
-  display: inline-flex;
-}
-
-.#{$block-class} [role='row'] {
-  position: relative;
-  outline: none;
-}
-.#{$block-class} [role='row']:focus::after {
-  @include focus-outline.focus-outline('outline');
-
-  position: absolute;
-  content: '';
-  inset: 0;
-}
-.#{$block-class}__condition__deletion-preview
-  .#{$block-class}__button:not(
-    .#{$block-class}__statement-button,
-    .#{$block-class}__connector-button,
-    .#{$block-class}__add-button,
-    .#{$block-class}__add-condition-sub-group
-  ) {
-  background-color: $tag-background-red;
-  color: $tag-color-red;
-}
-
-.#{$block-class}__condition__deletion-preview
-  .#{$block-class}__button:not(
-    .#{$block-class}__statement-button,
-    .#{$block-class}__connector-button
-  ):hover {
-  background-color: $tag-hover-red;
-}
-
-.#{$block-class}__text-ellipsis {
-  display: block;
-  overflow: hidden;
-  max-inline-size: $spacing-13;
-  text-overflow: ellipsis;
-  text-wrap: nowrap;
-}
-.#{$block-class}__group-preview {
-  block-size: 0;
-  opacity: 0;
-  pointer-events: none;
-  transition: all $duration-moderate-02 motion(exit, expressive);
-  .#{$block-class}__preview-condition {
-    display: flex;
-  }
-}
-.#{$block-class}__group-preview-animate {
-  block-size: auto;
-  color: $text-secondary;
-  opacity: 0.5;
-  pointer-events: none;
-  transition: all $duration-moderate-02 motion(exit, expressive);
-}
-.#{$block-class}__connector--disabled {
-  display: flex;
-  background-color: $layer;
-  color: $text-helper;
-  min-inline-size: $spacing-10;
-  pointer-events: none;
-}
-.#{$block-class}__condition-wrapper
-  > .#{$block-class}__condition-block:last-child
-  > .#{$block-class}__groupConnector {
-  margin-block-end: 0;
-}
-
-.#{$block-class}__readonly {
-  .#{$block-class}__condition-inner-block,
-  .#{$block-class}__connector,
-  .#{$block-class}__action-block,
-  .#{$block-class}__add-condition-wrapper,
-  .#{$block-class}__groupConnector {
-    background: transparent;
-    box-shadow: inset 0 0 0 1px $border-subtle-00;
-
-    button {
-      background: transparent;
-      cursor: default;
-
-      svg {
-        color: $icon-disabled;
-      }
-    }
-  }
-}
-
-.#{$block-class}__condition-inner-block {
-  display: flex;
-}