@carbon/ibm-products 2.15.2 → 2.17.0-alpha.8

Sign up to get free protection for your applications and to get access to all the features.
Files changed (149) hide show
  1. package/css/config-dev.css +3 -0
  2. package/css/config-dev.css.map +1 -0
  3. package/css/index-full-carbon.css +195 -1
  4. package/css/index-full-carbon.css.map +1 -1
  5. package/css/index-full-carbon.min.css +1 -1
  6. package/css/index-full-carbon.min.css.map +1 -1
  7. package/css/index-without-carbon-released-only.css +1852 -38
  8. package/css/index-without-carbon-released-only.css.map +1 -1
  9. package/css/index-without-carbon-released-only.min.css +1 -1
  10. package/css/index-without-carbon-released-only.min.css.map +1 -1
  11. package/css/index-without-carbon.css +195 -1
  12. package/css/index-without-carbon.css.map +1 -1
  13. package/css/index-without-carbon.min.css +1 -1
  14. package/css/index-without-carbon.min.css.map +1 -1
  15. package/css/index.css +5 -1
  16. package/css/index.css.map +1 -1
  17. package/css/index.min.css +1 -1
  18. package/css/index.min.css.map +1 -1
  19. package/es/components/Datagrid/Datagrid/DatagridContent.js +12 -9
  20. package/es/components/Datagrid/Datagrid/DatagridExpandedRow.js +3 -3
  21. package/es/components/Datagrid/Datagrid/DatagridHeaderRow.js +36 -22
  22. package/es/components/Datagrid/Datagrid/DatagridSelectAll.js +12 -11
  23. package/es/components/Datagrid/Datagrid/DatagridToolbar.js +7 -3
  24. package/es/components/Datagrid/Datagrid/DatagridVirtualBody.js +24 -13
  25. package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/DraggableItemsList.js +2 -2
  26. package/es/components/Datagrid/Datagrid/addons/stateReducer.js +50 -14
  27. package/es/components/Datagrid/Datagrid.docs-page.js +4 -4
  28. package/es/components/Datagrid/Datagrid.stories/StickyActionsColumnStory.js +1 -1
  29. package/es/components/Datagrid/useActionsColumn.js +1 -4
  30. package/es/components/Datagrid/useDatagrid.js +5 -1
  31. package/es/components/Datagrid/useFlexResize.js +19 -9
  32. package/es/components/Datagrid/useInfiniteScroll.js +1 -5
  33. package/es/components/Datagrid/useOnRowClick.js +6 -7
  34. package/es/components/Datagrid/useSelectRows.js +8 -5
  35. package/es/components/Datagrid/useSortableColumns.js +5 -7
  36. package/es/components/EmptyStates/ErrorEmptyState/ErrorEmptyState.js +2 -1
  37. package/es/components/EmptyStates/NoTagsEmptyState/NoTagsEmptyState.js +2 -1
  38. package/es/components/EmptyStates/NotFoundEmptyState/NotFoundEmptyState.js +2 -1
  39. package/es/components/EmptyStates/NotificationsEmptyState/NotificationsEmptyState.js +2 -1
  40. package/es/components/EmptyStates/UnauthorizedEmptyState/UnauthorizedEmptyState.js +2 -1
  41. package/es/components/EmptyStates/assets/ErrorIllustration.js +5 -3
  42. package/es/components/EmptyStates/assets/NoDataIllustration.js +5 -3
  43. package/es/components/EmptyStates/assets/NoTagsIllustration.js +5 -3
  44. package/es/components/EmptyStates/assets/NotFoundIllustration.js +5 -3
  45. package/es/components/EmptyStates/assets/NotificationsIllustration.js +5 -3
  46. package/es/components/EmptyStates/assets/UnauthorizedIllustration.js +5 -3
  47. package/es/components/InlineTip/InlineTip.docs-page.js +13 -0
  48. package/es/components/InlineTip/InlineTip.js +217 -0
  49. package/es/components/InlineTip/InlineTipButton.js +53 -0
  50. package/es/components/InlineTip/InlineTipLink.js +57 -0
  51. package/es/components/InlineTip/index.js +10 -0
  52. package/es/components/InlineTip/utils.js +36 -0
  53. package/es/components/SteppedAnimatedMedia/SteppedAnimatedMedia.docs-page.js +11 -0
  54. package/es/components/SteppedAnimatedMedia/SteppedAnimatedMedia.js +140 -0
  55. package/es/components/SteppedAnimatedMedia/assets/index.js +4 -0
  56. package/es/components/SteppedAnimatedMedia/index.js +8 -0
  57. package/es/global/js/package-settings.js +3 -4
  58. package/lib/components/Datagrid/Datagrid/DatagridContent.js +12 -9
  59. package/lib/components/Datagrid/Datagrid/DatagridExpandedRow.js +3 -3
  60. package/lib/components/Datagrid/Datagrid/DatagridHeaderRow.js +41 -29
  61. package/lib/components/Datagrid/Datagrid/DatagridSelectAll.js +11 -11
  62. package/lib/components/Datagrid/Datagrid/DatagridToolbar.js +7 -3
  63. package/lib/components/Datagrid/Datagrid/DatagridVirtualBody.js +23 -12
  64. package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/DraggableItemsList.js +2 -2
  65. package/lib/components/Datagrid/Datagrid/addons/stateReducer.js +51 -15
  66. package/lib/components/Datagrid/Datagrid.docs-page.js +4 -4
  67. package/lib/components/Datagrid/Datagrid.stories/StickyActionsColumnStory.js +1 -1
  68. package/lib/components/Datagrid/useActionsColumn.js +1 -7
  69. package/lib/components/Datagrid/useDatagrid.js +5 -1
  70. package/lib/components/Datagrid/useFlexResize.js +19 -9
  71. package/lib/components/Datagrid/useInfiniteScroll.js +0 -4
  72. package/lib/components/Datagrid/useOnRowClick.js +6 -7
  73. package/lib/components/Datagrid/useSelectRows.js +8 -5
  74. package/lib/components/Datagrid/useSortableColumns.js +5 -7
  75. package/lib/components/EmptyStates/ErrorEmptyState/ErrorEmptyState.js +2 -1
  76. package/lib/components/EmptyStates/NoTagsEmptyState/NoTagsEmptyState.js +2 -1
  77. package/lib/components/EmptyStates/NotFoundEmptyState/NotFoundEmptyState.js +2 -1
  78. package/lib/components/EmptyStates/NotificationsEmptyState/NotificationsEmptyState.js +2 -1
  79. package/lib/components/EmptyStates/UnauthorizedEmptyState/UnauthorizedEmptyState.js +2 -1
  80. package/lib/components/EmptyStates/assets/ErrorIllustration.js +5 -3
  81. package/lib/components/EmptyStates/assets/NoDataIllustration.js +5 -3
  82. package/lib/components/EmptyStates/assets/NoTagsIllustration.js +5 -3
  83. package/lib/components/EmptyStates/assets/NotFoundIllustration.js +5 -3
  84. package/lib/components/EmptyStates/assets/NotificationsIllustration.js +5 -3
  85. package/lib/components/EmptyStates/assets/UnauthorizedIllustration.js +5 -3
  86. package/lib/components/InlineTip/InlineTip.docs-page.js +23 -0
  87. package/lib/components/InlineTip/InlineTip.js +224 -0
  88. package/lib/components/InlineTip/InlineTipButton.js +57 -0
  89. package/lib/components/InlineTip/InlineTipLink.js +61 -0
  90. package/lib/components/InlineTip/index.js +26 -0
  91. package/lib/components/InlineTip/utils.js +43 -0
  92. package/lib/components/SteppedAnimatedMedia/SteppedAnimatedMedia.docs-page.js +21 -0
  93. package/lib/components/SteppedAnimatedMedia/SteppedAnimatedMedia.js +148 -0
  94. package/lib/components/SteppedAnimatedMedia/assets/index.js +9 -0
  95. package/lib/components/SteppedAnimatedMedia/index.js +12 -0
  96. package/lib/global/js/package-settings.js +3 -4
  97. package/package.json +6 -7
  98. package/scss/components/Datagrid/styles/_datagrid.scss +5 -0
  99. package/scss/components/{TooltipTrigger/_storybook-styles.scss → InlineTip/_index.scss} +2 -0
  100. package/scss/components/InlineTip/_inline-tip.scss +229 -0
  101. package/scss/components/SidePanel/_side-panel.scss +1 -4
  102. package/scss/components/_index-released-only-with-carbon.scss +1 -0
  103. package/scss/components/_index-released-only.scss +1 -0
  104. package/scss/components/_index.scss +1 -0
  105. package/scss/config-dev.scss +3 -0
  106. package/scss/components/APIKeyModal/_storybook-styles.scss +0 -35
  107. package/scss/components/AboutModal/_storybook-styles.scss +0 -29
  108. package/scss/components/ActionBar/_storybook-styles.scss +0 -8
  109. package/scss/components/ActionSet/_storybook-styles.scss +0 -36
  110. package/scss/components/AddSelect/_storybook-styles.scss +0 -6
  111. package/scss/components/BreadcrumbWithOverflow/_storybook-styles.scss +0 -8
  112. package/scss/components/ButtonMenu/_storybook-styles.scss +0 -6
  113. package/scss/components/ButtonSetWithOverflow/_storybook-styles.scss +0 -8
  114. package/scss/components/Card/_storybook-styles.scss +0 -12
  115. package/scss/components/Cascade/_storybook-styles.scss +0 -34
  116. package/scss/components/Checklist/_storybook-styles.scss +0 -13
  117. package/scss/components/CreateFullPage/_storybook-styles.scss +0 -67
  118. package/scss/components/CreateModal/_storybook-styles.scss +0 -54
  119. package/scss/components/CreateSidePanel/_storybook-styles.scss +0 -32
  120. package/scss/components/CreateTearsheet/_storybook-styles.scss +0 -56
  121. package/scss/components/CreateTearsheetNarrow/_storybook-styles.scss +0 -27
  122. package/scss/components/DataSpreadsheet/_storybook-styles.scss +0 -17
  123. package/scss/components/Datagrid/_storybook-styles.scss +0 -157
  124. package/scss/components/EditFullPage/_storybook-styles.scss +0 -10
  125. package/scss/components/EditInPlace/_storybook-styles.scss +0 -15
  126. package/scss/components/EditSidePanel/_storybook-styles.scss +0 -32
  127. package/scss/components/EditTearsheet/_storybook-styles.scss +0 -59
  128. package/scss/components/EditTearsheetNarrow/_storybook-styles.scss +0 -10
  129. package/scss/components/EditUpdateCards/_storybook-styles.scss +0 -55
  130. package/scss/components/EmptyStates/_storybook-styles.scss +0 -6
  131. package/scss/components/ExampleComponent/_storybook-styles.scss +0 -6
  132. package/scss/components/ExportModal/_storybook-styles.scss +0 -6
  133. package/scss/components/ExpressiveCard/_storybook-styles.scss +0 -26
  134. package/scss/components/FilterSummary/_storybook-styles.scss +0 -16
  135. package/scss/components/ImportModal/_storybook-styles.scss +0 -6
  136. package/scss/components/MultiAddSelect/_storybook-styles.scss +0 -6
  137. package/scss/components/NotificationsPanel/_storybook-styles.scss +0 -23
  138. package/scss/components/OptionsTile/_storybook-styles.scss +0 -29
  139. package/scss/components/PageHeader/_storybook-styles.scss +0 -90
  140. package/scss/components/ProductiveCard/_storybook-styles.scss +0 -23
  141. package/scss/components/RemoveModal/_storybook-styles.scss +0 -6
  142. package/scss/components/Saving/_storybook-styles.scss +0 -12
  143. package/scss/components/SidePanel/_storybook-styles.scss +0 -52
  144. package/scss/components/SingleAddSelect/_storybook-styles.scss +0 -6
  145. package/scss/components/StatusIcon/_storybook-styles.scss +0 -6
  146. package/scss/components/TagSet/_storybook-styles.scss +0 -8
  147. package/scss/components/Tearsheet/_storybook-styles.scss +0 -25
  148. package/scss/components/UserProfileImage/_storybook.scss +0 -6
  149. package/scss/components/WebTerminal/_storybook-styles.scss +0 -46
@@ -1,32 +0,0 @@
1
- //
2
- // Copyright IBM Corp. 2021, 2021
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 'ALIAS_STORY_STYLE_CONFIG' as c4p-settings;
9
- @use '@carbon/styles/scss/theme' as *;
10
- @use '@carbon/styles/scss/spacing';
11
- @use '../../global/decorators/side-panel-decorator' as *;
12
-
13
- $block-class: #{c4p-settings.$pkg-prefix}--create-side-panel;
14
- $story-prefix: create-side-panel-stories__;
15
-
16
- .#{$story-prefix}example-container {
17
- display: grid;
18
- align-items: flex-end;
19
- grid-gap: spacing.$spacing-04;
20
- grid-template-columns: 1fr 1fr;
21
- }
22
-
23
- .#{$story-prefix}example-form-group .#{c4p-settings.$carbon-prefix}--label {
24
- margin-bottom: 0;
25
- }
26
-
27
- .#{$block-class} .#{c4p-settings.$carbon-prefix}--number__control-btn::before,
28
- .#{$block-class} .#{c4p-settings.$carbon-prefix}--number__control-btn::after {
29
- background-color: $field-02;
30
- }
31
-
32
- @include side-panel-decorator($story-prefix);
@@ -1,56 +0,0 @@
1
- //
2
- // Copyright IBM Corp. 2021, 2021
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 'ALIAS_STORY_STYLE_CONFIG' as c4p-settings;
9
- @use '@carbon/styles/scss/type';
10
- @use '@carbon/type/scss/font-family';
11
- @use '@carbon/styles/scss/spacing' as *;
12
-
13
- $preview-block-class: #{c4p-settings.$pkg-prefix}--tearsheet-create-multi-step;
14
-
15
- .#{$preview-block-class}__description {
16
- @include type.type-style('body-compact-01');
17
-
18
- padding-bottom: $spacing-04;
19
- }
20
-
21
- p.#{$preview-block-class}__description:last-of-type {
22
- padding-bottom: $spacing-07;
23
- }
24
-
25
- .#{$preview-block-class}__heading {
26
- @include font-family.font-weight('semibold');
27
- }
28
-
29
- .#{$preview-block-class}
30
- .#{c4p-settings.$pkg-prefix}--tearsheet__content
31
- .#{c4p-settings.$carbon-prefix}--form-item {
32
- margin-bottom: $spacing-05;
33
- }
34
-
35
- .#{c4p-settings.$carbon-prefix}--tile-group div {
36
- display: flex;
37
- flex-wrap: wrap;
38
- }
39
-
40
- .#{c4p-settings.$pkg-prefix}--tearsheet-create-multi-step--custom-tile {
41
- width: 280px;
42
- height: 240px;
43
- margin-right: $spacing-05;
44
- }
45
-
46
- .#{c4p-settings.$pkg-prefix}--tearsheet-create-multi-step--custom-tile
47
- .#{c4p-settings.$pkg-prefix}--empty-state__illustration.#{c4p-settings.$pkg-prefix}--empty-state__illustration--lg {
48
- min-width: 120px;
49
- height: 120px;
50
- }
51
-
52
- .#{c4p-settings.$pkg-prefix}--tearsheet-create-multi-step--custom-tile-label {
53
- position: absolute;
54
- bottom: $spacing-05;
55
- left: $spacing-05;
56
- }
@@ -1,27 +0,0 @@
1
- //
2
- // Copyright IBM Corp. 2021, 2021
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 'ALIAS_STORY_STYLE_CONFIG' as c4p-settings;
9
- @use '@carbon/styles/scss/spacing' as *;
10
-
11
- $story-class: #{c4p-settings.$pkg-prefix}--create-tearsheet-narrow--story;
12
-
13
- .#{$story-class}__flex-container {
14
- display: flex;
15
- align-items: baseline;
16
- }
17
-
18
- .#{$story-class}__flex-container .#{c4p-settings.$carbon-prefix}--form-item,
19
- .#{$story-class}__form .#{c4p-settings.$carbon-prefix}--form-item {
20
- margin-bottom: $spacing-05;
21
- }
22
-
23
- .#{$story-class}__flex-container .#{c4p-settings.$carbon-prefix}--form-item,
24
- .#{$story-class}__flex-container
25
- .#{c4p-settings.$carbon-prefix}--dropdown__wrapper.#{c4p-settings.$carbon-prefix}--list-box__wrapper {
26
- width: 50%;
27
- }
@@ -1,17 +0,0 @@
1
- //
2
- // Copyright IBM Corp. 2022, 2022
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
- $story-anchor: 'DataSpreadsheet';
9
-
10
- $story-anchor: 'DataSpreadsheet';
11
- div[data-story-title*='#{$story-anchor}']
12
- .docs-story
13
- > div:first-child
14
- > div:first-child {
15
- overflow: auto;
16
- width: 100%;
17
- }
@@ -1,157 +0,0 @@
1
- //
2
- // Copyright IBM Corp. 2022, 2023
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 '@carbon/styles/scss/theme' as *;
9
- @use '@carbon/styles/scss/type';
10
- @use '@carbon/styles/scss/spacing' as *;
11
- @use '@carbon/styles/scss/components/tooltip';
12
-
13
- @use 'ALIAS_STORY_STYLE_CONFIG' as c4p-settings;
14
-
15
- // TODO: add any additional styles used by Datagrid.stories.js
16
- // helper class for the nested table
17
-
18
- $block-class: #{c4p-settings.$pkg-prefix}--datagrid;
19
-
20
- .sb-show-main.sb-main-centered {
21
- height: 100vh;
22
- }
23
-
24
- .sb-show-main.sb-main-centered #storybook-root {
25
- width: 100%;
26
- height: 100vh;
27
- padding: $spacing-07;
28
- }
29
-
30
- #storybook-root
31
- .#{c4p-settings.$carbon-prefix}--actionable-notification__content {
32
- white-space: pre-wrap;
33
- }
34
-
35
- .carbon-nested-table {
36
- border-bottom: 1px solid $border-subtle-01;
37
-
38
- .#{$block-class}__virtual-scrollbar > div > div:last-child td {
39
- border-bottom: none;
40
- }
41
- }
42
-
43
- .#{$block-class}__panelContent {
44
- display: inline;
45
- }
46
-
47
- /* only for storybook purpose. */
48
- .#{c4p-settings.$pkg-prefix}--side-panel.#{c4p-settings.$pkg-prefix}--side-panel__container {
49
- top: 0;
50
- height: 100%;
51
- }
52
-
53
- .page-content-wrapper.side-panel-open {
54
- .#{$block-class} {
55
- padding-right: $spacing-05;
56
- }
57
- }
58
-
59
- .#{$block-class}__side-panel-sections {
60
- padding-bottom: $spacing-06;
61
- }
62
-
63
- .#{$block-class}__side-panel-link {
64
- padding-top: $spacing-01;
65
- padding-bottom: $spacing-06;
66
- }
67
-
68
- .#{$block-class}__side-panel-section-inner {
69
- display: flex;
70
- padding: $spacing-01 0;
71
- }
72
-
73
- .#{$block-class}__side-panel-label-text {
74
- @include type.type-style('body-compact-01');
75
-
76
- color: $text-secondary;
77
- }
78
-
79
- .#{$block-class}__side-panel-value {
80
- @include type.type-style('body-compact-01');
81
-
82
- padding-left: $spacing-03;
83
- }
84
-
85
- .#{$block-class}__side-panel-section-header {
86
- @include type.type-style('heading-compact-01');
87
-
88
- padding-bottom: $spacing-02;
89
- }
90
-
91
- .#{c4p-settings.$pkg-prefix}--side-panel.#{c4p-settings.$pkg-prefix}--side-panel__container.#{c4p-settings.$pkg-prefix}--side-panel__container-right-placement {
92
- border: 0 none;
93
- box-shadow: none;
94
- }
95
-
96
- .#{c4p-settings.$pkg-prefix}--side-panel__container
97
- .#{c4p-settings.$pkg-prefix}--side-panel__inner-content {
98
- height: 100%;
99
- }
100
-
101
- .#{$block-class}-story__custom-cell-wrapper.#{c4p-settings.$carbon-prefix}--link {
102
- display: block;
103
- overflow: hidden;
104
- text-overflow: ellipsis;
105
- white-space: nowrap;
106
- }
107
-
108
- .#{$block-class}-story__hidden-column-id-snippet {
109
- padding-top: $spacing-07;
110
- }
111
-
112
- .#{$block-class}__mobile-toolbar-modal
113
- .#{c4p-settings.$carbon-prefix}--dropdown__wrapper {
114
- margin-bottom: $spacing-07;
115
- }
116
-
117
- .storybook-#{$block-class}__validation-code-snippet {
118
- @include type.font-family($name: mono);
119
- @include type.type-style('code-01');
120
-
121
- display: inline-block;
122
- padding: 0 $spacing-03;
123
- border: 2px solid transparent;
124
- border-radius: $spacing-02;
125
- margin-right: $spacing-03;
126
- background-color: $field-01;
127
- }
128
-
129
- .#{c4p-settings.$carbon-prefix}--body--with-modal-open {
130
- .#{$block-class}__mobile-toolbar-modal.#{c4p-settings.$carbon-prefix}--modal {
131
- top: -$spacing-07;
132
- left: -$spacing-07;
133
- width: 100vw;
134
- }
135
- }
136
-
137
- $story-anchor: 'Datagrid';
138
- div[data-story-title*='#{$story-anchor}']
139
- .docs-story
140
- > div:first-child
141
- > div:first-child {
142
- overflow: auto;
143
- width: 100%;
144
- }
145
-
146
- .sb--tooltip-trigger {
147
- display: flex;
148
- box-sizing: border-box;
149
- align-items: center;
150
- justify-content: center;
151
- padding: 0;
152
- border: 0;
153
- margin: 0;
154
- background: none;
155
- cursor: pointer;
156
- text-align: start;
157
- }
@@ -1,10 +0,0 @@
1
- //
2
- // Copyright IBM Corp. 2022, 2022
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 '../../global/styles/project-settings';
9
-
10
- // TODO: add any additional styles used by EditFullPage.stories.js
@@ -1,15 +0,0 @@
1
- //
2
- // Copyright IBM Corp. 2022, 2022
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
- @use '../../global/styles/display-box';
8
-
9
- $block-class: 'edit-in-place-example';
10
-
11
- .#{$block-class}__viewport {
12
- // width: 300px; // larger than standard size needed by text input at standard font size (html input attribute size)
13
- // stylelint-disable-next-line carbon/layout-token-use
14
- margin: 100px;
15
- }
@@ -1,32 +0,0 @@
1
- //
2
- // Copyright IBM Corp. 2021, 2021
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 'ALIAS_STORY_STYLE_CONFIG' as c4p-settings;
9
- @use '@carbon/styles/scss/theme' as *;
10
- @use '@carbon/styles/scss/spacing' as *;
11
- @use '../../global/decorators/side-panel-decorator' as *;
12
-
13
- $block-class: #{c4p-settings.$pkg-prefix}--edit-side-panel;
14
- $story-prefix: edit-side-panel-stories__;
15
-
16
- .#{$story-prefix}example-container {
17
- display: grid;
18
- align-items: flex-end;
19
- grid-gap: $spacing-04;
20
- grid-template-columns: 1fr 1fr;
21
- }
22
-
23
- .#{$story-prefix}example-form-group .#{c4p-settings.$carbon-prefix}--label {
24
- margin-bottom: 0;
25
- }
26
-
27
- .#{$block-class} .#{c4p-settings.$carbon-prefix}--number__control-btn::before,
28
- .#{$block-class} .#{c4p-settings.$carbon-prefix}--number__control-btn::after {
29
- background-color: $field-02;
30
- }
31
-
32
- @include side-panel-decorator($story-prefix);
@@ -1,59 +0,0 @@
1
- //
2
- // Copyright IBM Corp. 2022, 2022
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 '@carbon/styles/scss/spacing' as *;
9
- @use '@carbon/styles/scss/type';
10
- @use '@carbon/type/scss/font-family';
11
-
12
- @use 'ALIAS_STORY_STYLE_CONFIG' as c4p-settings;
13
-
14
- // TODO: add any additional styles used by EditTearsheet.stories.js
15
-
16
- $preview-block-class: #{c4p-settings.$pkg-prefix}--tearsheet-edit-multi-form;
17
-
18
- .#{$preview-block-class}__description {
19
- @include type.type-style('body-compact-01');
20
-
21
- padding-bottom: $spacing-04;
22
- }
23
-
24
- p.#{$preview-block-class}__description:last-of-type {
25
- padding-bottom: $spacing-07;
26
- }
27
-
28
- .#{$preview-block-class}__heading {
29
- @include font-family.font-weight('semibold');
30
- }
31
-
32
- .#{$preview-block-class}
33
- .#{c4p-settings.$pkg-prefix}--tearsheet__content
34
- .#{c4p-settings.$carbon-prefix}--form-item {
35
- margin-bottom: $spacing-05;
36
- }
37
-
38
- .#{c4p-settings.$carbon-prefix}--tile-group div {
39
- display: flex;
40
- flex-wrap: wrap;
41
- }
42
-
43
- .#{c4p-settings.$pkg-prefix}--tearsheet-edit-multi-form--custom-tile {
44
- width: 280px;
45
- height: 240px;
46
- margin-right: $spacing-05;
47
- }
48
-
49
- .#{c4p-settings.$pkg-prefix}--tearsheet-edit-multi-form--custom-tile
50
- .#{c4p-settings.$pkg-prefix}--empty-state__illustration.#{c4p-settings.$pkg-prefix}--empty-state__illustration--lg {
51
- min-width: 120px;
52
- height: 120px;
53
- }
54
-
55
- .#{c4p-settings.$pkg-prefix}--tearsheet-edit-multi-form--custom-tile-label {
56
- position: absolute;
57
- bottom: $spacing-05;
58
- left: $spacing-05;
59
- }
@@ -1,10 +0,0 @@
1
- //
2
- // Copyright IBM Corp. 2022, 2022
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 'ALIAS_STORY_STYLE_CONFIG' as c4p-settings;
9
-
10
- // TODO: add any additional styles used by EditTearsheetNarrow.stories.js
@@ -1,55 +0,0 @@
1
- //
2
- // Copyright IBM Corp. 2022, 2022
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 '@carbon/colors/' as *;
9
- @use '@carbon/type/' as *;
10
- @use '@carbon/styles/scss/spacing' as *;
11
- @use 'ALIAS_STORY_STYLE_CONFIG' as c4p-settings;
12
-
13
- // make the root full width to get a better idea of how the cards
14
- // look in a real grid situation
15
- /* stylelint-disable max-nesting-depth */
16
- #root {
17
- width: 100%;
18
- }
19
-
20
- $block-class: #{c4p-settings.$pkg-prefix}--edit-update-cards;
21
-
22
- .#{$block-class} {
23
- textarea,
24
- input,
25
- select {
26
- width: 100%;
27
- height: auto;
28
- padding: 0;
29
- // stylelint-disable-next-line
30
- font-size: type-scale(3);
31
- letter-spacing: 0;
32
- // stylelint-disable-next-line carbon/type-token-use
33
- line-height: 1.5;
34
- }
35
- }
36
- .#{$block-class}--items {
37
- margin-bottom: $spacing-06;
38
-
39
- &:last-child {
40
- margin-bottom: 0;
41
- }
42
- }
43
- .#{$block-class}--icon-text {
44
- display: flex;
45
- align-items: center;
46
-
47
- svg {
48
- margin-right: $spacing-01;
49
-
50
- path {
51
- // stylelint-disable-next-line carbon/theme-token-use
52
- fill: $green-50;
53
- }
54
- }
55
- }
@@ -1,6 +0,0 @@
1
- //
2
- // Copyright IBM Corp. 2020, 2021
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
- //
@@ -1,6 +0,0 @@
1
- //
2
- // Copyright IBM Corp. 2020, 2021
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
- //
@@ -1,6 +0,0 @@
1
- //
2
- // Copyright IBM Corp. 2020, 2021
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
- //
@@ -1,26 +0,0 @@
1
- //
2
- // Copyright IBM Corp. 2020, 2021
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
- // shared card styles can be found in the Card folder
9
- @use '../Card/storybook-styles' as *;
10
- @use 'ALIAS_STORY_STYLE_CONFIG' as c4p-settings;
11
- @use '@carbon/styles/scss/theme' as *;
12
-
13
- $block-class: #{c4p-settings.$pkg-prefix}--card;
14
-
15
- // aspect ratio box styling
16
- .card-story .#{c4p-settings.$carbon-prefix}--aspect-ratio {
17
- display: flex;
18
- align-items: center;
19
- justify-content: center;
20
- background: $layer-accent-01;
21
- }
22
-
23
- .#{$block-class}__media-left .#{$block-class}__media {
24
- width: 100%;
25
- max-width: 300px;
26
- }
@@ -1,16 +0,0 @@
1
- //
2
- // Copyright IBM Corp. 2022, 2022
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
- @use '../../global/styles/display-box' as *;
8
-
9
- #root {
10
- width: 100%;
11
- }
12
-
13
- .preview-position-fix {
14
- max-width: 700px;
15
- margin: 0 auto;
16
- }
@@ -1,6 +0,0 @@
1
- //
2
- // Copyright IBM Corp. 2021, 2021
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
- //
@@ -1,6 +0,0 @@
1
- //
2
- // Copyright IBM Corp. 2022, 2022
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
- //
@@ -1,23 +0,0 @@
1
- //
2
- // Copyright IBM Corp. 2020, 2020
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
- @use '@carbon/styles/scss/theme' as *;
8
- @use '@carbon/styles/scss/themes';
9
- @use 'ALIAS_STORY_STYLE_CONFIG' as c4p-settings;
10
-
11
- $storybook-block-class: #{c4p-settings.$pkg-prefix}--notifications-panel__story;
12
-
13
- .#{$storybook-block-class}--full-height {
14
- height: 100vh;
15
- max-height: var(--doc-story-height); // set in core if needed;
16
- }
17
-
18
- .#{$storybook-block-class}__add {
19
- display: flex;
20
- height: 100%;
21
- align-items: center;
22
- justify-content: center;
23
- }
@@ -1,29 +0,0 @@
1
- //
2
- // Copyright IBM Corp. 2021, 2022
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 'ALIAS_STORY_STYLE_CONFIG' as c4p-settings;
9
- @use '@carbon/styles/scss/spacing' as *;
10
- @use '@carbon/styles/scss/type';
11
-
12
- $block-class: #{c4p-settings.$pkg-prefix}--options-tile;
13
-
14
- .#{$block-class} {
15
- width: 80vw;
16
- min-width: 16rem;
17
- max-width: 48rem;
18
- }
19
-
20
- .#{$block-class}__content p {
21
- @include type.type-style('body-01');
22
-
23
- margin-bottom: $spacing-06;
24
- }
25
-
26
- .#{$block-class}__content
27
- .#{c4p-settings.$carbon-prefix}--dropdown__wrapper:first-of-type {
28
- margin-bottom: $spacing-06;
29
- }