@carbon/ibm-products 2.0.0-rc.6 → 2.0.0-rc.8

package/scss/components/InlineEditV2/_inline-edit-v2.scss

@@ -0,0 +1,83 @@
+//
+// 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.
+//
+
+// Standard imports.
+@use '@carbon/styles/scss/spacing' as *;
+@use '@carbon/styles/scss/theme' as *;
+@use '../../global/styles/project-settings' as *;
+@use '@carbon/styles/scss/type';
+
+$block-class: #{$pkg-prefix}--inline-edit-v2;
+$carbon-input: #{$carbon-prefix}--text-input;
+
+.#{$block-class} {
+  display: flex;
+  align-items: center;
+  background: transparent;
+  cursor: pointer;
+}
+
+.#{$block-class}-readonly {
+  cursor: not-allowed;
+}
+
+.#{$block-class}:hover {
+  background: $field-01;
+}
+
+.#{$block-class}:hover .#{$block-class}__btn-edit {
+  visibility: visible;
+}
+
+.#{$block-class}__btn-edit {
+  visibility: hidden;
+}
+
+.#{$block-class}-focused {
+  background: $field-01;
+  outline: 2px solid $focus;
+}
+
+.#{$block-class}__text-input {
+  flex: 1;
+}
+
+.#{$block-class}__text-input-label {
+  display: none;
+}
+
+.#{$block-class}__warning-icon {
+  /* stylelint-disable-next-line carbon/layout-token-use */
+  margin-right: 0.4375rem;
+  color: $support-error;
+}
+
+.#{$block-class}__warning-text {
+  @include type.type-style('label-01');
+
+  margin-top: $spacing-03;
+  color: $support-error;
+}
+
+// overrides
+.#{$block-class}__text-input.#{$carbon-input} {
+  border: none;
+  background: transparent;
+  cursor: pointer;
+  outline: none;
+}
+
+.#{$block-class}-readonly .#{$block-class}__text-input.#{$carbon-input},
+.#{$block-class}-readonly
+  .#{$carbon-prefix}--btn.#{$carbon-prefix}--btn--icon-only.#{$carbon-prefix}--tooltip__trigger {
+  cursor: not-allowed;
+}
+
+.#{$block-class}__text-input.#{$carbon-input}:focus,
+.#{$block-class}__text-input.#{$carbon-input}:active {
+  outline: none;
+}

package/scss/components/InlineEditV2/_storybook-styles.scss

@@ -0,0 +1,9 @@
+//
+// 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.
+//
+.inline-edit-v2-example {
+  width: 15rem;
+}

package/scss/components/PageHeader/_page-header.scss

@@ -466,10 +466,6 @@ $right-section-alt-width: 100% - $left-section-alt-width;
     vertical-align: middle;
   }
 
-  .#{$block-class}__title-wrapper {
-    @include type.type-style('productive-heading-04');
-  }
-
   .#{$block-class}__page-actions {
     flex: 0 0 100%;
     margin-top: $spacing-05;

package/scss/components/_index-released-only-with-carbon.scss

@@ -21,7 +21,7 @@
 @use './ExportModal/index-with-carbon' as *;
 @use './ExpressiveCard/index-with-carbon' as *;
 @use './HTTPErrors/index-with-carbon' as *;
-@use './InlineEdit/index-with-carbon' as *;
+@use './InlineEditV1/index-with-carbon' as *;
 @use './ImportModal/index-with-carbon' as *;
 @use './NotificationsPanel/index-with-carbon' as *;
 @use './PageHeader/index-with-carbon' as *;

package/scss/components/_index-released-only.scss

@@ -21,7 +21,7 @@
 @use './ExportModal';
 @use './ExpressiveCard';
 @use './HTTPErrors';
-@use './InlineEdit';
+@use './InlineEditV1';
 @use './ImportModal';
 @use './NotificationsPanel';
 @use './PageHeader';

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

@@ -42,7 +42,8 @@
 @use './UserProfileImage/index-with-carbon' as *;
 @use './EditSidePanel/index-with-carbon' as *;
 @use './OptionsTile/index-with-carbon' as *;
-@use './InlineEdit/index-with-carbon' as *;
+@use './InlineEditV1/index-with-carbon' as *;
+@use './InlineEditV2/index-with-carbon' as *;
 @use './DataSpreadsheet/index-with-carbon' as *;
 @use './Datagrid/index-with-carbon' as *;
 @use './EditUpdateCards/index-with-carbon' as *;

package/scss/components/_index.scss

@@ -42,7 +42,8 @@
 @use './UserProfileImage';
 @use './EditSidePanel';
 @use './OptionsTile';
-@use './InlineEdit';
+@use './InlineEditV1';
+@use './InlineEditV2';
 @use './DataSpreadsheet';
 @use './Datagrid';
 @use './EditTearsheet';