@carbon/ibm-products 2.42.1-canary.18 → 2.42.1-canary.2

Sign up to get free protection for your applications and to get access to all the features.
Files changed (131) hide show
  1. package/css/index-full-carbon.css +9 -302
  2. package/css/index-full-carbon.css.map +1 -1
  3. package/css/index-full-carbon.min.css +1 -1
  4. package/css/index-full-carbon.min.css.map +1 -1
  5. package/css/index-without-carbon.css +9 -302
  6. package/css/index-without-carbon.css.map +1 -1
  7. package/css/index-without-carbon.min.css +1 -1
  8. package/css/index-without-carbon.min.css.map +1 -1
  9. package/css/index.css +9 -302
  10. package/css/index.css.map +1 -1
  11. package/css/index.min.css +1 -1
  12. package/css/index.min.css.map +1 -1
  13. package/es/components/Carousel/Carousel.d.ts +1 -1
  14. package/es/components/Carousel/Carousel.js +1 -1
  15. package/es/components/Coachmark/CoachmarkDragbar.d.ts +1 -1
  16. package/es/components/Coachmark/CoachmarkDragbar.js +1 -1
  17. package/es/components/Coachmark/CoachmarkHeader.d.ts +1 -1
  18. package/es/components/Coachmark/CoachmarkHeader.js +1 -1
  19. package/es/components/Coachmark/CoachmarkOverlay.d.ts +1 -1
  20. package/es/components/Coachmark/CoachmarkOverlay.js +1 -1
  21. package/es/components/Coachmark/CoachmarkTagline.d.ts +1 -1
  22. package/es/components/Coachmark/CoachmarkTagline.js +1 -1
  23. package/es/components/CoachmarkStack/CoachmarkStackHome.d.ts +1 -1
  24. package/es/components/CoachmarkStack/CoachmarkStackHome.js +2 -2
  25. package/es/components/ConditionBuilder/ConditionBlock/ConditionBlock.d.ts +0 -6
  26. package/es/components/ConditionBuilder/ConditionBlock/ConditionBlock.js +33 -74
  27. package/es/components/ConditionBuilder/ConditionBuilderAdd/ConditionBuilderAdd.d.ts +1 -15
  28. package/es/components/ConditionBuilder/ConditionBuilderAdd/ConditionBuilderAdd.js +12 -95
  29. package/es/components/ConditionBuilder/ConditionBuilderButton/ConditionBuilderButton.d.ts +2 -11
  30. package/es/components/ConditionBuilder/ConditionBuilderButton/ConditionBuilderButton.js +9 -27
  31. package/es/components/ConditionBuilder/ConditionBuilderContent/ConditionBuilderContent.d.ts +0 -5
  32. package/es/components/ConditionBuilder/ConditionBuilderContent/ConditionBuilderContent.js +14 -95
  33. package/es/components/ConditionBuilder/ConditionBuilderContext/ConditionBuilderProvider.d.ts +0 -1
  34. package/es/components/ConditionBuilder/ConditionBuilderContext/ConditionBuilderProvider.js +0 -1
  35. package/es/components/ConditionBuilder/ConditionBuilderContext/translationObject.d.ts +0 -7
  36. package/es/components/ConditionBuilder/ConditionBuilderContext/translationObject.js +1 -8
  37. package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItem.js +1 -1
  38. package/es/components/ConditionBuilder/{ConditionBuilderConnector → ConditionConnector}/ConditionConnector.js +33 -38
  39. package/es/components/ConditionBuilder/ConditionGroupBuilder/ConditionGroupBuilder.js +67 -197
  40. package/es/components/ConditionBuilder/utils/util.d.ts +0 -1
  41. package/es/components/Datagrid/Datagrid/DatagridHeaderRow.js +1 -1
  42. package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/CustomizeColumnsTearsheet.js +4 -7
  43. package/es/components/Datagrid/Datagrid/addons/Filtering/hooks/useFilterContext.d.ts +1 -7
  44. package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditCell/InlineEditCell.d.ts +0 -1
  45. package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditCell/InlineEditCell.js +3 -13
  46. package/es/components/Datagrid/types/index.d.ts +0 -2
  47. package/es/components/Datagrid/useColumnOrder.d.ts +1 -7
  48. package/es/components/Datagrid/useNestedRows.js +0 -17
  49. package/es/components/Datagrid/useOnRowClick.d.ts +1 -8
  50. package/es/components/Datagrid/useOnRowClick.js +1 -2
  51. package/es/components/Datagrid/useRowIsMouseOver.d.ts +1 -2
  52. package/es/components/Datagrid/useRowIsMouseOver.js +1 -1
  53. package/es/components/Datagrid/useSortableColumns.d.ts +3 -10
  54. package/es/components/Datagrid/useSortableColumns.js +2 -3
  55. package/es/components/InterstitialScreenView/InterstitialScreenView.d.ts +1 -1
  56. package/es/components/InterstitialScreenView/InterstitialScreenView.js +1 -1
  57. package/es/components/SidePanel/SidePanel.d.ts +2 -2
  58. package/es/components/SidePanel/SidePanel.js +3 -5
  59. package/es/components/SteppedAnimatedMedia/SteppedAnimatedMedia.d.ts +1 -1
  60. package/es/components/SteppedAnimatedMedia/SteppedAnimatedMedia.js +1 -1
  61. package/es/global/js/package-settings.js +2 -2
  62. package/es/index.d.ts +0 -1
  63. package/es/index.js +0 -1
  64. package/lib/components/Carousel/Carousel.d.ts +1 -1
  65. package/lib/components/Carousel/Carousel.js +1 -1
  66. package/lib/components/Coachmark/CoachmarkDragbar.d.ts +1 -1
  67. package/lib/components/Coachmark/CoachmarkDragbar.js +1 -1
  68. package/lib/components/Coachmark/CoachmarkHeader.d.ts +1 -1
  69. package/lib/components/Coachmark/CoachmarkHeader.js +1 -1
  70. package/lib/components/Coachmark/CoachmarkOverlay.d.ts +1 -1
  71. package/lib/components/Coachmark/CoachmarkOverlay.js +1 -1
  72. package/lib/components/Coachmark/CoachmarkTagline.d.ts +1 -1
  73. package/lib/components/Coachmark/CoachmarkTagline.js +1 -1
  74. package/lib/components/CoachmarkStack/CoachmarkStackHome.d.ts +1 -1
  75. package/lib/components/CoachmarkStack/CoachmarkStackHome.js +2 -2
  76. package/lib/components/ConditionBuilder/ConditionBlock/ConditionBlock.d.ts +0 -6
  77. package/lib/components/ConditionBuilder/ConditionBlock/ConditionBlock.js +32 -73
  78. package/lib/components/ConditionBuilder/ConditionBuilderAdd/ConditionBuilderAdd.d.ts +1 -15
  79. package/lib/components/ConditionBuilder/ConditionBuilderAdd/ConditionBuilderAdd.js +9 -92
  80. package/lib/components/ConditionBuilder/ConditionBuilderButton/ConditionBuilderButton.d.ts +2 -11
  81. package/lib/components/ConditionBuilder/ConditionBuilderButton/ConditionBuilderButton.js +8 -26
  82. package/lib/components/ConditionBuilder/ConditionBuilderContent/ConditionBuilderContent.d.ts +0 -5
  83. package/lib/components/ConditionBuilder/ConditionBuilderContent/ConditionBuilderContent.js +11 -92
  84. package/lib/components/ConditionBuilder/ConditionBuilderContext/ConditionBuilderProvider.d.ts +0 -1
  85. package/lib/components/ConditionBuilder/ConditionBuilderContext/ConditionBuilderProvider.js +0 -1
  86. package/lib/components/ConditionBuilder/ConditionBuilderContext/translationObject.d.ts +0 -7
  87. package/lib/components/ConditionBuilder/ConditionBuilderContext/translationObject.js +1 -8
  88. package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItem.js +1 -1
  89. package/lib/components/ConditionBuilder/{ConditionBuilderConnector → ConditionConnector}/ConditionConnector.js +31 -36
  90. package/lib/components/ConditionBuilder/ConditionGroupBuilder/ConditionGroupBuilder.js +64 -195
  91. package/lib/components/ConditionBuilder/utils/util.d.ts +0 -1
  92. package/lib/components/Datagrid/Datagrid/DatagridHeaderRow.js +1 -1
  93. package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/CustomizeColumnsTearsheet.js +4 -7
  94. package/lib/components/Datagrid/Datagrid/addons/Filtering/hooks/useFilterContext.d.ts +1 -7
  95. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditCell/InlineEditCell.d.ts +0 -1
  96. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditCell/InlineEditCell.js +3 -13
  97. package/lib/components/Datagrid/types/index.d.ts +0 -2
  98. package/lib/components/Datagrid/useColumnOrder.d.ts +1 -7
  99. package/lib/components/Datagrid/useNestedRows.js +0 -17
  100. package/lib/components/Datagrid/useOnRowClick.d.ts +1 -8
  101. package/lib/components/Datagrid/useOnRowClick.js +1 -2
  102. package/lib/components/Datagrid/useRowIsMouseOver.d.ts +1 -2
  103. package/lib/components/Datagrid/useRowIsMouseOver.js +1 -1
  104. package/lib/components/Datagrid/useSortableColumns.d.ts +3 -10
  105. package/lib/components/Datagrid/useSortableColumns.js +2 -3
  106. package/lib/components/InterstitialScreenView/InterstitialScreenView.d.ts +1 -1
  107. package/lib/components/InterstitialScreenView/InterstitialScreenView.js +1 -1
  108. package/lib/components/SidePanel/SidePanel.d.ts +2 -2
  109. package/lib/components/SidePanel/SidePanel.js +3 -5
  110. package/lib/components/SteppedAnimatedMedia/SteppedAnimatedMedia.d.ts +1 -1
  111. package/lib/components/SteppedAnimatedMedia/SteppedAnimatedMedia.js +1 -1
  112. package/lib/global/js/package-settings.js +2 -2
  113. package/lib/index.d.ts +0 -1
  114. package/lib/index.js +0 -1
  115. package/package.json +3 -3
  116. package/scss/components/ConditionBuilder/_condition-builder.scss +1 -21
  117. package/scss/components/ConditionBuilder/styles/_conditionBuilderCondition.scss +3 -22
  118. package/scss/components/ConditionBuilder/styles/_conditionBuilderItem.scss +21 -58
  119. package/scss/components/NonLinearReading/_non-linear-reading.scss +1 -1
  120. package/es/components/ConditionBuilder/ConditionBuilderConnector/GroupConnector.d.ts +0 -2
  121. package/es/components/ConditionBuilder/ConditionBuilderConnector/GroupConnector.js +0 -44
  122. package/es/components/ConditionBuilder/ConditionPreview/ConditionPreview.d.ts +0 -10
  123. package/es/components/ConditionBuilder/ConditionPreview/ConditionPreview.js +0 -69
  124. package/es/feature-flags.js +0 -18
  125. package/lib/components/ConditionBuilder/ConditionBuilderConnector/GroupConnector.d.ts +0 -2
  126. package/lib/components/ConditionBuilder/ConditionBuilderConnector/GroupConnector.js +0 -52
  127. package/lib/components/ConditionBuilder/ConditionPreview/ConditionPreview.d.ts +0 -10
  128. package/lib/components/ConditionBuilder/ConditionPreview/ConditionPreview.js +0 -77
  129. package/lib/feature-flags.js +0 -40
  130. /package/es/components/ConditionBuilder/{ConditionBuilderConnector → ConditionConnector}/ConditionConnector.d.ts +0 -0
  131. /package/lib/components/ConditionBuilder/{ConditionBuilderConnector → ConditionConnector}/ConditionConnector.d.ts +0 -0
@@ -13,8 +13,7 @@ var settings = require('../../settings.js');
13
13
 
14
14
  var useOnRowClick = function useOnRowClick(hooks) {
15
15
  var useInstance = function useInstance(rowInstance) {
16
- var _ref = rowInstance,
17
- onRowClick = _ref.onRowClick;
16
+ var onRowClick = rowInstance.onRowClick;
18
17
  var getRowProps = function getRowProps(props, datagridState) {
19
18
  var isFetching = datagridState.isFetching,
20
19
  row = datagridState.row,
@@ -1,3 +1,2 @@
1
- import { Hooks } from 'react-table';
2
- declare const useRowIsMouseOver: (hooks: Hooks) => void;
3
1
  export default useRowIsMouseOver;
2
+ declare function useRowIsMouseOver(hooks: any): void;
@@ -25,7 +25,7 @@ var useRowIsMouseOver = function useRowIsMouseOver(hooks) {
25
25
  setMouseOverRowIndex = _useState2[1];
26
26
  var onMouseChange = useDebounce(function (datagridState) {
27
27
  var row = datagridState.row;
28
- setMouseOverRowIndex(row === null || row === void 0 ? void 0 : row.index);
28
+ setMouseOverRowIndex(row.index);
29
29
  }, 100);
30
30
  var getRowProps = function getRowProps(props, datagridState) {
31
31
  var onMouseOver = function onMouseOver() {
@@ -1,13 +1,6 @@
1
- /**
2
- * Copyright IBM Corp. 2020, 2024
3
- *
4
- * This source code is licensed under the Apache-2.0 license found in the
5
- * LICENSE file in the root directory of this source tree.
6
- */
7
- import { Hooks } from 'react-table';
8
- export declare const getNewSortOrder: (sortOrder?: boolean | string) => {
9
- newSortDesc: boolean;
1
+ export function getNewSortOrder(sortOrder: any): {
2
+ newSortDesc: undefined;
10
3
  newOrder: string;
11
4
  };
12
- declare const useSortableColumns: (hooks: Hooks) => void;
13
5
  export default useSortableColumns;
6
+ declare function useSortableColumns(hooks: any): void;
@@ -31,7 +31,7 @@ var ordering = {
31
31
  };
32
32
  var getNewSortOrder = function getNewSortOrder(sortOrder) {
33
33
  var order = {
34
- newSortDesc: false,
34
+ newSortDesc: undefined,
35
35
  newOrder: ordering.NONE
36
36
  };
37
37
  if (sortOrder === false || sortOrder === ordering.DESC) {
@@ -146,8 +146,7 @@ var useSortableColumns = function useSortableColumns(hooks) {
146
146
  return (_instance$customizeCo = instance.customizeColumnsProps) !== null && _instance$customizeCo !== void 0 && _instance$customizeCo.isTearsheetOpen ? visibleColumns : _rollupPluginBabelHelpers.toConsumableArray(sortableColumns);
147
147
  };
148
148
  var sortInstanceProps = function sortInstanceProps(instance) {
149
- var _ref3 = instance,
150
- onSort = _ref3.onSort;
149
+ var onSort = instance.onSort;
151
150
  Object.assign(instance, {
152
151
  manualSortBy: !!onSort,
153
152
  isTableSortable: true
@@ -20,7 +20,7 @@ interface InterstitialScreenViewProps extends PropsWithChildren {
20
20
  stepTitle: string;
21
21
  }
22
22
  /**
23
- * An Onboarding component intended to be used as the child elements of the InterstitialScreen component.
23
+ * A Novice to Pro component intended to be used as the child elements of the InterstitialScreen component.
24
24
  */
25
25
  export declare let InterstitialScreenView: React.ForwardRefExoticComponent<InterstitialScreenViewProps & React.RefAttributes<HTMLDivElement>>;
26
26
  export {};
@@ -30,7 +30,7 @@ var _excluded = ["children", "className", "stepTitle"];
30
30
  var blockClass = "".concat(settings.pkg.prefix, "--interstitial-screen-view");
31
31
  var componentName = 'InterstitialScreenView';
32
32
  /**
33
- * An Onboarding component intended to be used as the child elements of the InterstitialScreen component.
33
+ * A Novice to Pro component intended to be used as the child elements of the InterstitialScreen component.
34
34
  */
35
35
  exports.InterstitialScreenView = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
36
36
  var children = _ref.children,
@@ -11,7 +11,7 @@ type SidePanelBaseProps = {
11
11
  /**
12
12
  * Sets the action toolbar buttons
13
13
  */
14
- actionToolbarButtons?: ButtonProps<any>[];
14
+ actionToolbarButtons?: ButtonProps[];
15
15
  /**
16
16
  * The primary actions to be shown in the side panel. Each action is
17
17
  * specified as an object that will render expressive Buttons. Any Button
@@ -20,7 +20,7 @@ type SidePanelBaseProps = {
20
20
  *
21
21
  * See https://react.carbondesignsystem.com/?path=/docs/components-button--default#component-api
22
22
  */
23
- actions?: ButtonProps<any>[];
23
+ actions?: ButtonProps[];
24
24
  /**
25
25
  * Determines if the title will animate on scroll
26
26
  */
@@ -332,12 +332,12 @@ exports.SidePanel = /*#__PURE__*/React__default["default"].forwardRef(function (
332
332
  if (primeFocusEl) {
333
333
  primeFocusEl === null || primeFocusEl === void 0 || primeFocusEl.focus();
334
334
  }
335
- } else if (!slideIn) {
335
+ } else {
336
336
  firstElement === null || firstElement === void 0 || firstElement.focus();
337
337
  }
338
338
  }, 0);
339
339
  }
340
- }, [animationComplete, firstElement, open, selectorPrimaryFocus, slideIn]);
340
+ }, [animationComplete, firstElement, open, selectorPrimaryFocus]);
341
341
  var primaryActionContainerClassNames = cx__default["default"](["".concat(blockClass, "__actions-container"), _rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "__actions-container--condensed"), condensedActions)]);
342
342
  var mainPanelClassNames = cx__default["default"]([blockClass, className, "".concat(blockClass), "".concat(blockClass, "--").concat(size), _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "--right-placement"), placement === 'right'), "".concat(blockClass, "--left-placement"), placement === 'left'), "".concat(blockClass, "--slide-in"), slideIn), "".concat(blockClass, "--has-slug"), slug), "".concat(blockClass, "--condensed-actions"), condensedActions), "".concat(blockClass, "--has-overlay"), includeOverlay)]);
343
343
  var renderTitle = function renderTitle() {
@@ -457,7 +457,7 @@ exports.SidePanel = /*#__PURE__*/React__default["default"].forwardRef(function (
457
457
  placement: placement,
458
458
  shouldReduceMotion: shouldReduceMotion
459
459
  },
460
- onKeyDown: slideIn ? undefined : keyDownListener
460
+ onKeyDown: keyDownListener
461
461
  }), /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, renderHeader(), renderMain()), /*#__PURE__*/React__default["default"].createElement(MotionActionSet, {
462
462
  actions: actions !== null && actions !== void 0 ? actions : [],
463
463
  className: primaryActionContainerClassNames,
@@ -480,7 +480,6 @@ exports.SidePanel.propTypes = {
480
480
  /**
481
481
  * Sets the action toolbar buttons
482
482
  */
483
- /**@ts-ignore */
484
483
  actionToolbarButtons: index["default"].arrayOf(index["default"].shape({
485
484
  label: index["default"].string,
486
485
  leading: index["default"].bool,
@@ -514,7 +513,6 @@ exports.SidePanel.propTypes = {
514
513
  label: index["default"].string,
515
514
  loading: index["default"].bool,
516
515
  // we duplicate this Button prop to improve the DocGen here
517
- /**@ts-ignore */
518
516
  onClick: react.Button.propTypes.onClick
519
517
  })))]),
520
518
  /**
@@ -20,7 +20,7 @@ interface SteppedAnimatedMediaProps {
20
20
  playStep?: number;
21
21
  }
22
22
  /**
23
- * The SteppedAnimatedMedia is an Onboarding internal component and is not intended for general use.
23
+ * The SteppedAnimatedMedia is a Novice to Pro internal component and is not intended for general use.
24
24
  */
25
25
  export declare const SteppedAnimatedMedia: React.ForwardRefExoticComponent<SteppedAnimatedMediaProps & React.RefAttributes<HTMLDivElement>>;
26
26
  export {};
@@ -38,7 +38,7 @@ var defaults = {
38
38
  playStep: 0
39
39
  };
40
40
  /**
41
- * The SteppedAnimatedMedia is an Onboarding internal component and is not intended for general use.
41
+ * The SteppedAnimatedMedia is a Novice to Pro internal component and is not intended for general use.
42
42
  */
43
43
  var SteppedAnimatedMedia = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
44
44
  var className = _ref.className,
@@ -102,7 +102,7 @@ var defaults = {
102
102
  GetStartedCard: false,
103
103
  /* new component flags here - comment used by generate CLI */
104
104
 
105
- // Onboarding components not yet reviewed and released:
105
+ // Novice to pro components not yet reviewed and released:
106
106
  Coachmark: false,
107
107
  CoachmarkBeacon: false,
108
108
  CoachmarkButton: false,
@@ -122,7 +122,7 @@ var defaults = {
122
122
  UserAvatar: false,
123
123
  /* new component flags here - comment used by generate CLI */
124
124
 
125
- // Onboarding components not yet reviewed and released:
125
+ // Novice to pro components not yet reviewed and released:
126
126
  EmptyStateV2: false,
127
127
  Guidebanner: false,
128
128
  GuidebannerElement: false,
package/lib/index.d.ts CHANGED
@@ -4,7 +4,6 @@
4
4
  * This source code is licensed under the Apache-2.0 license found in the
5
5
  * LICENSE file in the root directory of this source tree.
6
6
  */
7
- import './feature-flags';
8
7
  export { pkg } from './settings';
9
8
  export { usePrefix } from './global/js/hooks';
10
9
  export * from './components';
package/lib/index.js CHANGED
@@ -9,7 +9,6 @@
9
9
 
10
10
  Object.defineProperty(exports, '__esModule', { value: true });
11
11
 
12
- require('./feature-flags.js');
13
12
  var settings = require('./settings.js');
14
13
  var reactTable = require('react-table');
15
14
  var usePrefix = require('./global/js/hooks/usePrefix.js');
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@carbon/ibm-products",
3
3
  "description": "Carbon for IBM Products",
4
- "version": "2.42.1-canary.18+07b412455",
4
+ "version": "2.42.1-canary.2+254149c10",
5
5
  "license": "Apache-2.0",
6
6
  "main": "lib/index.js",
7
7
  "module": "es/index.js",
@@ -97,7 +97,7 @@
97
97
  "dependencies": {
98
98
  "@babel/runtime": "^7.23.9",
99
99
  "@carbon/feature-flags": "^0.20.0",
100
- "@carbon/ibm-products-styles": "^2.38.1",
100
+ "@carbon/ibm-products-styles": "^2.38.2-canary.2+254149c10",
101
101
  "@carbon/telemetry": "^0.1.0",
102
102
  "@dnd-kit/core": "^6.0.8",
103
103
  "@dnd-kit/modifiers": "^7.0.0",
@@ -121,5 +121,5 @@
121
121
  "react": "^16.8.6 || ^17.0.1 || ^18.2.0",
122
122
  "react-dom": "^16.8.6 || ^17.0.1 || ^18.2.0"
123
123
  },
124
- "gitHead": "07b4124551093f8dc2f4db978201feecdace2e22"
124
+ "gitHead": "254149c106786ec59a59572b3fc2602fa63637f6"
125
125
  }
@@ -27,9 +27,7 @@ $block-class: #{c4p-settings.$pkg-prefix}--condition-builder;
27
27
  // .#{$block-class} {
28
28
  // // TODO: Styles.
29
29
  // }
30
- .#{$block-class} {
31
- padding: $spacing-06;
32
- }
30
+
33
31
  .#{$block-class}__condition-builder__group {
34
32
  display: flex;
35
33
  }
@@ -49,23 +47,5 @@ $block-class: #{c4p-settings.$pkg-prefix}--condition-builder;
49
47
  }
50
48
  .#{$block-class}__condition-block {
51
49
  display: flex;
52
- width: max-content;
53
50
  flex-direction: row;
54
51
  }
55
- .#{$block-class}__content-container {
56
- display: flex;
57
- flex-direction: column;
58
- row-gap: $spacing-02;
59
- }
60
- .#{$block-class}__heading {
61
- margin-top: $spacing-03;
62
- margin-bottom: $spacing-03;
63
- }
64
- .#{$block-class}__tree
65
- .#{$block-class}__actions-container
66
- .#{$block-class}__condition-wrapper {
67
- flex-direction: column;
68
- }
69
- .#{$block-class}__group-separator {
70
- margin-top: $spacing-02;
71
- }
@@ -1,4 +1,3 @@
1
- @use '@carbon/react/scss/theme' as *;
2
1
  @use '@carbon/react/scss/spacing' as *;
3
2
  @use '@carbon/react/scss/motion';
4
3
  @use '@carbon/styles/scss/components/tag' as *;
@@ -6,7 +5,6 @@
6
5
  @use '../../../global/styles/project-settings' as c4p-settings;
7
6
  @use '@carbon/styles/scss/type';
8
7
  @use '@carbon/styles/scss/type' as *;
9
- @use '@carbon/react/scss/utilities';
10
8
 
11
9
  $block-class: #{c4p-settings.$pkg-prefix}--condition-builder;
12
10
 
@@ -16,17 +14,12 @@ $block-class: #{c4p-settings.$pkg-prefix}--condition-builder;
16
14
  display: inline-flex;
17
15
  }
18
16
 
19
- .#{$block-class} [role='row'] {
20
- position: relative;
21
- outline: none;
22
- }
23
- .#{$block-class} [role='row']:focus::after {
17
+ [role='row']:focus {
24
18
  @include focus-outline.focus-outline('outline');
25
19
 
26
- position: absolute;
27
- content: '';
28
- inset: 0;
20
+ outline-offset: 0;
29
21
  }
22
+
30
23
  .#{$block-class}__condition__deletion-preview
31
24
  .#{$block-class}__button:not(
32
25
  .#{$block-class}__statement-button,
@@ -51,15 +44,3 @@ $block-class: #{c4p-settings.$pkg-prefix}--condition-builder;
51
44
  text-overflow: ellipsis;
52
45
  text-wrap: nowrap;
53
46
  }
54
- .#{$block-class}__group-preview {
55
- opacity: 0.5;
56
- pointer-events: none;
57
- }
58
- .#{$block-class}__connector-disabled {
59
- display: flex;
60
- min-width: $spacing-10;
61
- align-items: center;
62
- background-color: $layer;
63
- color: $text-helper;
64
- padding-inline: $spacing-03;
65
- }
@@ -1,5 +1,3 @@
1
- @use 'sass:list';
2
- @use 'sass:string';
3
1
  @use '@carbon/react/scss/theme' as *;
4
2
  @use '../../../global/styles/project-settings' as c4p-settings;
5
3
  @use '@carbon/styles/scss/type';
@@ -10,11 +8,10 @@
10
8
  @use '@carbon/styles/scss/components/tag';
11
9
 
12
10
  @use '@carbon/styles/scss/type' as *;
13
- @use '@carbon/react/scss/colors' as *;
14
11
 
15
12
  $block-class: #{c4p-settings.$pkg-prefix}--condition-builder;
16
13
 
17
- .#{$block-class}__condition-wrapper * {
14
+ .#{$block-class}__content-container * {
18
15
  @include type-style('body-01');
19
16
  }
20
17
 
@@ -123,7 +120,7 @@ $block-class: #{c4p-settings.$pkg-prefix}--condition-builder;
123
120
  }
124
121
  .#{$block-class}__condition-builder__group.hoveredConnector
125
122
  .#{$block-class}__condition-wrapper
126
- > .#{$block-class}__condition-block
123
+ > .conditionBlockWrapper
127
124
  .#{$block-class}__connector-button {
128
125
  background-color: $layer-hover;
129
126
  }
@@ -152,6 +149,9 @@ $block-class: #{c4p-settings.$pkg-prefix}--condition-builder;
152
149
  padding-right: $spacing-03;
153
150
  padding-left: $spacing-03;
154
151
  }
152
+ .#{$block-class}__conditionWrapper {
153
+ display: flex;
154
+ }
155
155
 
156
156
  .#{$block-class}__multiselectSelectionStatusContainer {
157
157
  display: flex;
@@ -165,59 +165,22 @@ $block-class: #{c4p-settings.$pkg-prefix}--condition-builder;
165
165
  .#{$block-class}__item-option__option:focus {
166
166
  @include focus-outline.focus-outline('outline');
167
167
  }
168
- //need to revamp to a simpler logic
169
- $colors: (
170
- ($purple-70, $purple-60, $purple-50, $purple-40, $purple-30, $purple-20),
171
- ($cyan-70, $cyan-60, $cyan-50, $cyan-40, $cyan-30, $cyan-20),
172
- ($teal-70, $teal-60, $teal-50, $teal-40, $teal-30, $teal-20),
173
- (
174
- $magenta-70,
175
- $magenta-60,
176
- $magenta-50,
177
- $magenta-40,
178
- $magenta-30,
179
- $magenta-20
180
- ),
181
- ($red-70, $red-60, $red-50, $red-40, $red-30, $red-20),
182
- ($orange-70, $orange-60, $orange-50, $orange-40, $orange-30, $orange-20),
183
- ($yellow-70, $yellow-60, $yellow-50, $yellow-40, $yellow-30, $yellow-20),
184
- ($green-70, $green-60, $green-50, $green-40, $green-30, $green-20)
185
- );
186
-
187
- @for $i from 1 through list.length($colors) {
188
- $selector: (
189
- string.unquote(
190
- '.#{$block-class}__content-container > .#{$block-class}__group-wrapper:nth-of-type(#{list.length($colors)}n+#{$i})'
191
- )
192
- );
193
- $group-colors: list.nth($colors, $i);
194
- @each $color in $group-colors {
195
- #{$selector} {
196
- /* stylelint-disable-next-line carbon/theme-token-use */
197
- --#{$block-class}__condition-wrapper-color: #{$color};
198
- }
199
-
200
- $selector: list.append(
201
- $selector,
202
- string.unquote('.#{$block-class}__group')
203
- );
204
- }
205
- }
206
-
207
- .#{$block-class}__tree {
208
- .#{$block-class}__condition-wrapper > :nth-child(n + 3) {
209
- flex-basis: 100%;
210
- }
211
- .#{$block-class}__groupConnector {
212
- background-color: $layer;
213
- }
214
- .#{$block-class}__condition-wrapper > :nth-child(1) .#{$block-class}__button,
215
- .#{$block-class}__condition-wrapper > :nth-child(2) .#{$block-class}__button {
216
- /* stylelint-disable-next-line carbon/theme-token-use */
217
- box-shadow: inset 0 #{$spacing-01} 0 0 var(--#{$block-class}__condition-wrapper-color);
218
- }
219
- }
220
-
168
+ // .#{$block-class}__tree {
169
+ // .#{$block-class}__condition-wrapper > :nth-child(n + 3) {
170
+ // flex-basis: 100%;
171
+ // }
172
+ // .#{$block-class}__groupConnector {
173
+ // background-color: $layer;
174
+ // }
175
+ // .#{$block-class}__condition-wrapper
176
+ // > :nth-child(1)
177
+ // .#{$block-class}__button,
178
+ // .#{$block-class}__condition-wrapper
179
+ // > :nth-child(2)
180
+ // .#{$block-class}__button {
181
+ // box-shadow: inset 0 #{$spacing-01} 0 0 var(--#{$block-class}__condition-wrapper-color);
182
+ // }
183
+ // }
221
184
  .#{$block-class}__groupOperatorConnector {
222
185
  margin-bottom: $spacing-02;
223
186
  }
@@ -104,7 +104,7 @@ $block-class: #{c4p-settings.$pkg-prefix}--non-linear-reading;
104
104
  padding: $spacing-03 $spacing-04;
105
105
  border-left: to-rem(1.25px) solid $text-primary;
106
106
  margin: $spacing-02 0;
107
- // Onboarding does not always use Carbon defaults/tokens
107
+ // Novice to pro does not always use Carbon defaults/tokens
108
108
  // stylelint-disable-next-line carbon/motion-duration-use, carbon/motion-easing-use
109
109
  animation: fade 600ms;
110
110
 
@@ -1,2 +0,0 @@
1
- export default GroupConnector;
2
- declare function GroupConnector(): import("react/jsx-runtime").JSX.Element;
@@ -1,44 +0,0 @@
1
- /**
2
- * Copyright IBM Corp. 2020, 2024
3
- *
4
- * This source code is licensed under the Apache-2.0 license found in the
5
- * LICENSE file in the root directory of this source tree.
6
- */
7
-
8
- import React__default, { useContext } from 'react';
9
- import { ConditionBuilderItem } from '../ConditionBuilderItem/ConditionBuilderItem.js';
10
- import { blockClass, translateWithId, connectorConfig } from '../ConditionBuilderContext/DataConfigs.js';
11
- import { ConditionBuilderItemOption } from '../ConditionBuilderItem/ConditionBuilderItemOption/ConditionBuilderItemOption.js';
12
- import { focusThisField } from '../utils/util.js';
13
- import { ConditionBuilderContext } from '../ConditionBuilderContext/ConditionBuilderProvider.js';
14
-
15
- var GroupConnector = function GroupConnector() {
16
- var _useContext = useContext(ConditionBuilderContext),
17
- rootState = _useContext.rootState;
18
- return /*#__PURE__*/React__default.createElement("div", {
19
- className: "".concat(blockClass, "__group-separator"),
20
- role: "row",
21
- tabIndex: -1,
22
- "aria-level": 1
23
- }, /*#__PURE__*/React__default.createElement(ConditionBuilderItem, {
24
- label: rootState.operator,
25
- title: translateWithId('condition'),
26
- "data-name": "connectorField",
27
- popOverClassName: "".concat(blockClass, "__gap"),
28
- className: "".concat(blockClass, "__statement-button")
29
- }, /*#__PURE__*/React__default.createElement(ConditionBuilderItemOption, {
30
- conditionState: {
31
- value: rootState.operator,
32
- label: translateWithId('condition')
33
- },
34
- onChange: function onChange(v, e) {
35
- focusThisField(e);
36
- },
37
- config: {
38
- options: connectorConfig
39
- }
40
- })));
41
- };
42
- var GroupConnector$1 = GroupConnector;
43
-
44
- export { GroupConnector$1 as default };
@@ -1,10 +0,0 @@
1
- export default ConditionPreview;
2
- declare function ConditionPreview({ previewType }: {
3
- previewType: any;
4
- }): import("react/jsx-runtime").JSX.Element;
5
- declare namespace ConditionPreview {
6
- namespace propTypes {
7
- let previewType: PropTypes.Requireable<string>;
8
- }
9
- }
10
- import PropTypes from 'prop-types';
@@ -1,69 +0,0 @@
1
- /**
2
- * Copyright IBM Corp. 2020, 2024
3
- *
4
- * This source code is licensed under the Apache-2.0 license found in the
5
- * LICENSE file in the root directory of this source tree.
6
- */
7
-
8
- import React__default from 'react';
9
- import PropTypes from '../../../node_modules/prop-types/index.js';
10
- import { blockClass, translateWithId } from '../ConditionBuilderContext/DataConfigs.js';
11
- import { ConditionBuilderItem } from '../ConditionBuilderItem/ConditionBuilderItem.js';
12
- import ConditionConnector from '../ConditionBuilderConnector/ConditionConnector.js';
13
-
14
- var ConditionPreview = function ConditionPreview(_ref) {
15
- var previewType = _ref.previewType;
16
- var getConditionSection = function getConditionSection() {
17
- return /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement(ConditionBuilderItem, {
18
- label: translateWithId('property')
19
- }), /*#__PURE__*/React__default.createElement(ConditionBuilderItem, {
20
- label: translateWithId('operator')
21
- }), /*#__PURE__*/React__default.createElement(ConditionBuilderItem, {
22
- label: translateWithId('value')
23
- }));
24
- };
25
- return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, previewType == 'newGroup' && /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
26
- className: "".concat(blockClass, "__group__row ").concat(blockClass, "__group-preview ")
27
- }, /*#__PURE__*/React__default.createElement(ConditionBuilderItem, {
28
- className: "".concat(blockClass, "__statement-button"),
29
- label: translateWithId('and')
30
- })), /*#__PURE__*/React__default.createElement("div", {
31
- "aria-hidden": true,
32
- className: "".concat(blockClass, "__group ").concat(blockClass, "__condition-wrapper ").concat(blockClass, "__group-preview ").concat(blockClass, "__group-wrapper")
33
- }, /*#__PURE__*/React__default.createElement("div", {
34
- className: "".concat(blockClass, "__gap")
35
- }, /*#__PURE__*/React__default.createElement(ConditionBuilderItem, {
36
- className: "".concat(blockClass, "__statement-button"),
37
- label: translateWithId('if')
38
- })), getConditionSection())), previewType == 'subGroup' && /*#__PURE__*/React__default.createElement("div", {
39
- className: "".concat(blockClass, "__group-preview")
40
- }, /*#__PURE__*/React__default.createElement("div", {
41
- className: "".concat(blockClass, "__condition-block ").concat(blockClass, "__gap")
42
- }, /*#__PURE__*/React__default.createElement(ConditionBuilderItem, {
43
- label: translateWithId('and'),
44
- className: "".concat(blockClass, "__statement-button"),
45
- popOverClassName: "".concat(blockClass, "__gap")
46
- }), /*#__PURE__*/React__default.createElement("div", {
47
- className: "".concat(blockClass, "__group ").concat(blockClass, "__condition-wrapper")
48
- }, /*#__PURE__*/React__default.createElement(ConditionConnector, {
49
- className: "".concat(blockClass, "__gap ").concat(blockClass, "__groupConnector"),
50
- operator: translateWithId('if')
51
- }), getConditionSection()))), previewType == 'condition' && /*#__PURE__*/React__default.createElement("div", {
52
- className: "".concat(blockClass, "__group-preview")
53
- }, /*#__PURE__*/React__default.createElement("div", {
54
- className: "".concat(blockClass, "__condition-block ").concat(blockClass, "__gap")
55
- }, /*#__PURE__*/React__default.createElement(ConditionBuilderItem, {
56
- label: translateWithId('and'),
57
- className: "".concat(blockClass, "__statement-button"),
58
- popOverClassName: "".concat(blockClass, "__gap")
59
- }), getConditionSection())));
60
- };
61
- var ConditionPreview$1 = ConditionPreview;
62
- ConditionPreview.propTypes = {
63
- /**
64
- * type of review to be displayed
65
- */
66
- previewType: PropTypes.oneOf(['condition', 'subGroup', 'newGroup'])
67
- };
68
-
69
- export { ConditionPreview$1 as default };
@@ -1,18 +0,0 @@
1
- /**
2
- * Copyright IBM Corp. 2020, 2024
3
- *
4
- * This source code is licensed under the Apache-2.0 license found in the
5
- * LICENSE file in the root directory of this source tree.
6
- */
7
-
8
- import * as FeatureFlags from '@carbon/feature-flags';
9
-
10
- FeatureFlags.merge({
11
- 'default-portal-target-body': true,
12
- 'enable-datagrid-useInlineEdit': false,
13
- 'enable-datagrid-useEditableCell': false,
14
- 'enable-datagrid-useCustomizeColumns': false,
15
- 'ExampleComponent.secondaryIcon': false,
16
- 'ExampleComponent.useExample': false,
17
- 'enable-example-flag': false
18
- });
@@ -1,2 +0,0 @@
1
- export default GroupConnector;
2
- declare function GroupConnector(): import("react/jsx-runtime").JSX.Element;
@@ -1,52 +0,0 @@
1
- /**
2
- * Copyright IBM Corp. 2020, 2024
3
- *
4
- * This source code is licensed under the Apache-2.0 license found in the
5
- * LICENSE file in the root directory of this source tree.
6
- */
7
-
8
- 'use strict';
9
-
10
- Object.defineProperty(exports, '__esModule', { value: true });
11
-
12
- var React = require('react');
13
- var ConditionBuilderItem = require('../ConditionBuilderItem/ConditionBuilderItem.js');
14
- var DataConfigs = require('../ConditionBuilderContext/DataConfigs.js');
15
- var ConditionBuilderItemOption = require('../ConditionBuilderItem/ConditionBuilderItemOption/ConditionBuilderItemOption.js');
16
- var util = require('../utils/util.js');
17
- var ConditionBuilderProvider = require('../ConditionBuilderContext/ConditionBuilderProvider.js');
18
-
19
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
20
-
21
- var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
22
-
23
- var GroupConnector = function GroupConnector() {
24
- var _useContext = React.useContext(ConditionBuilderProvider.ConditionBuilderContext),
25
- rootState = _useContext.rootState;
26
- return /*#__PURE__*/React__default["default"].createElement("div", {
27
- className: "".concat(DataConfigs.blockClass, "__group-separator"),
28
- role: "row",
29
- tabIndex: -1,
30
- "aria-level": 1
31
- }, /*#__PURE__*/React__default["default"].createElement(ConditionBuilderItem.ConditionBuilderItem, {
32
- label: rootState.operator,
33
- title: DataConfigs.translateWithId('condition'),
34
- "data-name": "connectorField",
35
- popOverClassName: "".concat(DataConfigs.blockClass, "__gap"),
36
- className: "".concat(DataConfigs.blockClass, "__statement-button")
37
- }, /*#__PURE__*/React__default["default"].createElement(ConditionBuilderItemOption.ConditionBuilderItemOption, {
38
- conditionState: {
39
- value: rootState.operator,
40
- label: DataConfigs.translateWithId('condition')
41
- },
42
- onChange: function onChange(v, e) {
43
- util.focusThisField(e);
44
- },
45
- config: {
46
- options: DataConfigs.connectorConfig
47
- }
48
- })));
49
- };
50
- var GroupConnector$1 = GroupConnector;
51
-
52
- exports["default"] = GroupConnector$1;
@@ -1,10 +0,0 @@
1
- export default ConditionPreview;
2
- declare function ConditionPreview({ previewType }: {
3
- previewType: any;
4
- }): import("react/jsx-runtime").JSX.Element;
5
- declare namespace ConditionPreview {
6
- namespace propTypes {
7
- let previewType: PropTypes.Requireable<string>;
8
- }
9
- }
10
- import PropTypes from 'prop-types';