@carbon/ibm-products-web-components 0.21.1 → 0.22.0-rc.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/custom-elements.json +102 -15
- package/es/components/about-modal/about-modal.d.ts +19 -3
- package/es/components/about-modal/about-modal.js +33 -2
- package/es/components/about-modal/about-modal.js.map +1 -1
- package/es/components/interstitial-screen/interstitial-screen-body-item.scss.js +1 -1
- package/es/components/interstitial-screen/interstitial-screen-body.d.ts +2 -0
- package/es/components/interstitial-screen/interstitial-screen-body.js +30 -6
- package/es/components/interstitial-screen/interstitial-screen-body.js.map +1 -1
- package/es/components/interstitial-screen/interstitial-screen-body.scss.js +1 -1
- package/es/components/interstitial-screen/interstitial-screen-footer.d.ts +3 -0
- package/es/components/interstitial-screen/interstitial-screen-footer.js +32 -3
- package/es/components/interstitial-screen/interstitial-screen-footer.js.map +1 -1
- package/es/components/interstitial-screen/interstitial-screen-footer.scss.js +1 -1
- package/es/components/interstitial-screen/interstitial-screen-header.d.ts +2 -0
- package/es/components/interstitial-screen/interstitial-screen-header.js +17 -1
- package/es/components/interstitial-screen/interstitial-screen-header.js.map +1 -1
- package/es/components/interstitial-screen/interstitial-screen.d.ts +9 -5
- package/es/components/interstitial-screen/interstitial-screen.js +45 -22
- package/es/components/interstitial-screen/interstitial-screen.js.map +1 -1
- package/es/components/interstitial-screen/interstitial-screen.test.d.ts +1 -0
- package/es/components/interstitial-screen/interstitial-screen.test.js +329 -0
- package/es/components/interstitial-screen/interstitial-screen.test.js.map +1 -0
- package/es/components/notification-panel/notification-panel.d.ts +6 -1
- package/es/components/notification-panel/notification-panel.js +27 -8
- package/es/components/notification-panel/notification-panel.js.map +1 -1
- package/es/components/notification-panel/notification-panel.test.js +53 -0
- package/es/components/notification-panel/notification-panel.test.js.map +1 -1
- package/es/components/options-tile/options-tile.d.ts +9 -2
- package/es/components/options-tile/options-tile.js +26 -12
- package/es/components/options-tile/options-tile.js.map +1 -1
- package/es/components/options-tile/options-tile.scss.js +1 -1
- package/es/components/options-tile/options-tile.test.js +7 -7
- package/es/components/options-tile/options-tile.test.js.map +1 -1
- package/es/components/page-header/_story-assets/set-of-tags/index.d.ts +9 -0
- package/es/components/page-header/_story-assets/set-of-tags/index.js +9 -0
- package/es/components/page-header/_story-assets/set-of-tags/index.js.map +1 -0
- package/es/components/page-header/_story-assets/set-of-tags/set-of-tags.d.ts +40 -0
- package/es/components/page-header/_story-assets/set-of-tags/set-of-tags.js +260 -0
- package/es/components/page-header/_story-assets/set-of-tags/set-of-tags.js.map +1 -0
- package/es/components/page-header/_story-assets/set-of-tags/set-of-tags.scss.js +13 -0
- package/es/components/page-header/_story-assets/set-of-tags/set-of-tags.scss.js.map +1 -0
- package/es/components/page-header/_story-assets/set-of-tags/utils.d.ts +23 -0
- package/es/components/page-header/_story-assets/set-of-tags/utils.js +44 -0
- package/es/components/page-header/_story-assets/set-of-tags/utils.js.map +1 -0
- package/es/components/page-header/context.d.ts +1 -0
- package/es/components/page-header/context.js +1 -0
- package/es/components/page-header/context.js.map +1 -1
- package/es/components/page-header/page-header-breadcrumb.d.ts +1 -0
- package/es/components/page-header/page-header-breadcrumb.js +14 -2
- package/es/components/page-header/page-header-breadcrumb.js.map +1 -1
- package/es/components/page-header/page-header-content.d.ts +1 -0
- package/es/components/page-header/page-header-content.js +12 -2
- package/es/components/page-header/page-header-content.js.map +1 -1
- package/es/components/page-header/page-header-title-breadcrumb.js +6 -0
- package/es/components/page-header/page-header-title-breadcrumb.js.map +1 -1
- package/es/components/page-header/page-header.d.ts +2 -0
- package/es/components/page-header/page-header.js +33 -1
- package/es/components/page-header/page-header.js.map +1 -1
- package/es/components/page-header/page-header.scss.js +1 -1
- package/es/components/side-panel/_story-assets/index.js +4 -0
- package/es/components/side-panel/_story-assets/index.js.map +1 -1
- package/es/components/side-panel/side-panel.d.ts +12 -13
- package/es/components/side-panel/side-panel.js +59 -89
- package/es/components/side-panel/side-panel.js.map +1 -1
- package/es/components/side-panel/side-panel.scss.js +1 -1
- package/es/components/truncated-text/truncated-text.js +25 -7
- package/es/components/truncated-text/truncated-text.js.map +1 -1
- package/es/components/truncated-text/truncated-text.scss.js +1 -1
- package/es/node_modules/@carbon/utilities/es/overflowHandler/overflowHandler.js +11 -0
- package/es/node_modules/@carbon/utilities/es/overflowHandler/overflowHandler.js.map +1 -0
- package/es/packages/ibm-products-web-components/package.json.js +1 -1
- package/es/utilities/carousel/carousel.d.ts +6 -0
- package/es/utilities/carousel/carousel.js +133 -2
- package/es/utilities/carousel/carousel.js.map +1 -1
- package/es/utilities/carousel/types.d.ts +1 -0
- package/es-custom/components/about-modal/about-modal.d.ts +19 -3
- package/es-custom/components/about-modal/about-modal.js +33 -2
- package/es-custom/components/about-modal/about-modal.js.map +1 -1
- package/es-custom/components/interstitial-screen/interstitial-screen-body-item.scss.js +1 -1
- package/es-custom/components/interstitial-screen/interstitial-screen-body.d.ts +2 -0
- package/es-custom/components/interstitial-screen/interstitial-screen-body.js +30 -6
- package/es-custom/components/interstitial-screen/interstitial-screen-body.js.map +1 -1
- package/es-custom/components/interstitial-screen/interstitial-screen-body.scss.js +1 -1
- package/es-custom/components/interstitial-screen/interstitial-screen-footer.d.ts +3 -0
- package/es-custom/components/interstitial-screen/interstitial-screen-footer.js +32 -3
- package/es-custom/components/interstitial-screen/interstitial-screen-footer.js.map +1 -1
- package/es-custom/components/interstitial-screen/interstitial-screen-footer.scss.js +1 -1
- package/es-custom/components/interstitial-screen/interstitial-screen-header.d.ts +2 -0
- package/es-custom/components/interstitial-screen/interstitial-screen-header.js +17 -1
- package/es-custom/components/interstitial-screen/interstitial-screen-header.js.map +1 -1
- package/es-custom/components/interstitial-screen/interstitial-screen.d.ts +9 -5
- package/es-custom/components/interstitial-screen/interstitial-screen.js +45 -22
- package/es-custom/components/interstitial-screen/interstitial-screen.js.map +1 -1
- package/es-custom/components/interstitial-screen/interstitial-screen.test.d.ts +1 -0
- package/es-custom/components/interstitial-screen/interstitial-screen.test.js +329 -0
- package/es-custom/components/interstitial-screen/interstitial-screen.test.js.map +1 -0
- package/es-custom/components/notification-panel/notification-panel.d.ts +6 -1
- package/es-custom/components/notification-panel/notification-panel.js +27 -8
- package/es-custom/components/notification-panel/notification-panel.js.map +1 -1
- package/es-custom/components/notification-panel/notification-panel.test.js +53 -0
- package/es-custom/components/notification-panel/notification-panel.test.js.map +1 -1
- package/es-custom/components/options-tile/options-tile.d.ts +9 -2
- package/es-custom/components/options-tile/options-tile.js +26 -12
- package/es-custom/components/options-tile/options-tile.js.map +1 -1
- package/es-custom/components/options-tile/options-tile.scss.js +1 -1
- package/es-custom/components/options-tile/options-tile.test.js +7 -7
- package/es-custom/components/options-tile/options-tile.test.js.map +1 -1
- package/es-custom/components/page-header/_story-assets/set-of-tags/index.d.ts +9 -0
- package/es-custom/components/page-header/_story-assets/set-of-tags/index.js +9 -0
- package/es-custom/components/page-header/_story-assets/set-of-tags/index.js.map +1 -0
- package/es-custom/components/page-header/_story-assets/set-of-tags/set-of-tags.d.ts +40 -0
- package/es-custom/components/page-header/_story-assets/set-of-tags/set-of-tags.js +260 -0
- package/es-custom/components/page-header/_story-assets/set-of-tags/set-of-tags.js.map +1 -0
- package/es-custom/components/page-header/_story-assets/set-of-tags/set-of-tags.scss.js +13 -0
- package/es-custom/components/page-header/_story-assets/set-of-tags/set-of-tags.scss.js.map +1 -0
- package/es-custom/components/page-header/_story-assets/set-of-tags/utils.d.ts +23 -0
- package/es-custom/components/page-header/_story-assets/set-of-tags/utils.js +44 -0
- package/es-custom/components/page-header/_story-assets/set-of-tags/utils.js.map +1 -0
- package/es-custom/components/page-header/context.d.ts +1 -0
- package/es-custom/components/page-header/context.js +1 -0
- package/es-custom/components/page-header/context.js.map +1 -1
- package/es-custom/components/page-header/page-header-breadcrumb.d.ts +1 -0
- package/es-custom/components/page-header/page-header-breadcrumb.js +14 -2
- package/es-custom/components/page-header/page-header-breadcrumb.js.map +1 -1
- package/es-custom/components/page-header/page-header-content.d.ts +1 -0
- package/es-custom/components/page-header/page-header-content.js +12 -2
- package/es-custom/components/page-header/page-header-content.js.map +1 -1
- package/es-custom/components/page-header/page-header-title-breadcrumb.js +6 -0
- package/es-custom/components/page-header/page-header-title-breadcrumb.js.map +1 -1
- package/es-custom/components/page-header/page-header.d.ts +2 -0
- package/es-custom/components/page-header/page-header.js +33 -1
- package/es-custom/components/page-header/page-header.js.map +1 -1
- package/es-custom/components/page-header/page-header.scss.js +1 -1
- package/es-custom/components/side-panel/_story-assets/index.js +4 -0
- package/es-custom/components/side-panel/_story-assets/index.js.map +1 -1
- package/es-custom/components/side-panel/side-panel.d.ts +12 -13
- package/es-custom/components/side-panel/side-panel.js +59 -89
- package/es-custom/components/side-panel/side-panel.js.map +1 -1
- package/es-custom/components/side-panel/side-panel.scss.js +1 -1
- package/es-custom/components/truncated-text/truncated-text.js +25 -7
- package/es-custom/components/truncated-text/truncated-text.js.map +1 -1
- package/es-custom/components/truncated-text/truncated-text.scss.js +1 -1
- package/es-custom/node_modules/@carbon/utilities/es/overflowHandler/overflowHandler.js +11 -0
- package/es-custom/node_modules/@carbon/utilities/es/overflowHandler/overflowHandler.js.map +1 -0
- package/es-custom/packages/ibm-products-web-components/package.json.js +1 -1
- package/es-custom/utilities/carousel/carousel.d.ts +6 -0
- package/es-custom/utilities/carousel/carousel.js +133 -2
- package/es-custom/utilities/carousel/carousel.js.map +1 -1
- package/es-custom/utilities/carousel/types.d.ts +1 -0
- package/lib/components/about-modal/about-modal.d.ts +19 -3
- package/lib/components/interstitial-screen/interstitial-screen-body.d.ts +2 -0
- package/lib/components/interstitial-screen/interstitial-screen-footer.d.ts +3 -0
- package/lib/components/interstitial-screen/interstitial-screen-header.d.ts +2 -0
- package/lib/components/interstitial-screen/interstitial-screen.d.ts +9 -5
- package/lib/components/interstitial-screen/interstitial-screen.test.d.ts +1 -0
- package/lib/components/notification-panel/notification-panel.d.ts +6 -1
- package/lib/components/options-tile/options-tile.d.ts +9 -2
- package/lib/components/page-header/_story-assets/set-of-tags/index.d.ts +9 -0
- package/lib/components/page-header/_story-assets/set-of-tags/set-of-tags.d.ts +40 -0
- package/lib/components/page-header/_story-assets/set-of-tags/utils.d.ts +23 -0
- package/lib/components/page-header/context.d.ts +1 -0
- package/lib/components/page-header/page-header-breadcrumb.d.ts +1 -0
- package/lib/components/page-header/page-header-content.d.ts +1 -0
- package/lib/components/page-header/page-header.d.ts +2 -0
- package/lib/components/side-panel/side-panel.d.ts +12 -13
- package/lib/utilities/carousel/carousel.d.ts +6 -0
- package/lib/utilities/carousel/types.d.ts +1 -0
- package/package.json +4 -3
- package/scss/components/interstitial-screen/interstitial-screen-body-item.scss +1 -1
- package/scss/components/interstitial-screen/interstitial-screen-body.scss +0 -1
- package/scss/components/interstitial-screen/interstitial-screen-footer.scss +0 -1
- package/scss/components/options-tile/options-tile.scss +8 -2
- package/scss/components/options-tile/story-styles.scss +21 -0
- package/scss/components/page-header/_story-assets/set-of-tags/set-of-tags.scss +94 -0
- package/scss/components/page-header/page-header.scss +69 -33
- package/scss/components/truncated-text/truncated-text.scss +4 -0
@@ -13,6 +13,12 @@ import { registerSwipeEvents } from './swipeEvents.js';
|
|
13
13
|
* This source code is licensed under the Apache-2.0 license found in the
|
14
14
|
* LICENSE file in the root directory of this source tree.
|
15
15
|
*/
|
16
|
+
/**
|
17
|
+
* Initializes a carousel with the given configuration.
|
18
|
+
* @param carouselContainer - The HTMLElement representing the carousel container.
|
19
|
+
* @param config - Optional configuration object.
|
20
|
+
* @returns An object containing methods to control the carousel.
|
21
|
+
*/
|
16
22
|
const initCarousel = (carouselContainer, config) => {
|
17
23
|
const prefix = 'carousel';
|
18
24
|
let viewIndexStack = [0];
|
@@ -20,9 +26,26 @@ const initCarousel = (carouselContainer, config) => {
|
|
20
26
|
const refs = {};
|
21
27
|
const minHeight = 10; // 10 rem
|
22
28
|
const { onViewChangeStart, onViewChangeEnd, excludeSwipeSupport } = config || {};
|
29
|
+
/**
|
30
|
+
* Registers an HTMLElement at a specific index in the refs array.
|
31
|
+
*
|
32
|
+
* @param {number} index - The index at which to register the HTMLElement.
|
33
|
+
* @param {HTMLElement} ref - The HTMLElement to register.
|
34
|
+
*
|
35
|
+
* @example
|
36
|
+
* registerRef(0, document.getElementById('myElement'));
|
37
|
+
*/
|
23
38
|
const registerRef = (index, ref) => {
|
24
39
|
refs[index] = ref;
|
25
40
|
};
|
41
|
+
/**
|
42
|
+
* Wraps all child elements of a given container into a new div with the specified class.
|
43
|
+
* If an element with the specified class already exists as a child of the container, the function does nothing.
|
44
|
+
*
|
45
|
+
* @param {HTMLElement} container - The container element to wrap child elements of.
|
46
|
+
* @param {string} wrapperClass - The class name to apply to the new wrapper div.
|
47
|
+
* @returns {void}
|
48
|
+
*/
|
26
49
|
const wrapAllItems = (container, wrapperClass) => {
|
27
50
|
if (container.querySelector(`.${wrapperClass}`)) {
|
28
51
|
return;
|
@@ -40,6 +63,10 @@ const initCarousel = (carouselContainer, config) => {
|
|
40
63
|
elem: refs[id],
|
41
64
|
}));
|
42
65
|
};
|
66
|
+
/**
|
67
|
+
* Retrieves the current carousel response based on the view index stack and reference objects.
|
68
|
+
* @returns {CarouselResponse} - An object containing carousel response details.
|
69
|
+
*/
|
43
70
|
const getCallbackResponse = () => {
|
44
71
|
const totalRefs = Object.keys(refs).length;
|
45
72
|
const lastElementRef = refs[totalRefs - 1];
|
@@ -51,11 +78,27 @@ const initCarousel = (carouselContainer, config) => {
|
|
51
78
|
historyStack: historicalData,
|
52
79
|
};
|
53
80
|
};
|
81
|
+
/**
|
82
|
+
* Handles the start of a transition in the application.
|
83
|
+
* This function is responsible for capturing the current state of the view index stack
|
84
|
+
* and invoking a callback function if it exists.
|
85
|
+
*
|
86
|
+
* @function handleTransitionStart
|
87
|
+
* @returns {void}
|
88
|
+
*/
|
54
89
|
const handleTransitionStart = () => {
|
55
90
|
previousViewIndexStack = [...viewIndexStack];
|
56
91
|
const callbackData = getCallbackResponse();
|
57
92
|
onViewChangeStart === null || onViewChangeStart === void 0 ? void 0 : onViewChangeStart(callbackData);
|
58
93
|
};
|
94
|
+
/**
|
95
|
+
* Handles the 'transitionend' event for a given element.
|
96
|
+
* This function checks if the element has a 'data-index' attribute and if its value matches the current view index.
|
97
|
+
* If both conditions are met, it calls the 'onViewChangeEnd' callback with the response from 'getCallbackResponse'.
|
98
|
+
*
|
99
|
+
* @param {HTMLElement | null} el - The element to handle the 'transitionend' event for.
|
100
|
+
* @returns {void}
|
101
|
+
*/
|
59
102
|
const handleTransitionEnd = (el) => {
|
60
103
|
if (!el) {
|
61
104
|
return;
|
@@ -67,11 +110,24 @@ const initCarousel = (carouselContainer, config) => {
|
|
67
110
|
onViewChangeEnd === null || onViewChangeEnd === void 0 ? void 0 : onViewChangeEnd(callbackData);
|
68
111
|
}
|
69
112
|
};
|
113
|
+
/**
|
114
|
+
* A utility function to sanitize an index value.
|
115
|
+
* This function ensures the index stays within the bounds of the refs array.
|
116
|
+
*
|
117
|
+
* @param {number} idx - The index to be sanitized.
|
118
|
+
* @returns {number} - The sanitized index.
|
119
|
+
*/
|
70
120
|
const sanitizeIndex = (idx) => {
|
71
121
|
const floorVal = 0;
|
72
122
|
const ceilVal = Object.keys(refs).length - 1;
|
73
123
|
return Math.max(floorVal, Math.min(idx, ceilVal));
|
74
124
|
};
|
125
|
+
/**
|
126
|
+
* Handles the 'transitionend' event for a given element.
|
127
|
+
* This function checks if the element has a 'data-index' attribute and if its value matches the current view index.
|
128
|
+
* If both conditions are met, it calls the 'onViewChangeEnd' callback with the response from 'getCallbackResponse'.
|
129
|
+
* @returns {void}
|
130
|
+
*/
|
75
131
|
const transitionToViewIndex = (idx) => {
|
76
132
|
const sanitizedIndex = sanitizeIndex(idx);
|
77
133
|
if (viewIndexStack[0] !== sanitizedIndex) {
|
@@ -83,6 +139,16 @@ const initCarousel = (carouselContainer, config) => {
|
|
83
139
|
const transitionComplete = (ref) => {
|
84
140
|
handleTransitionEnd(ref);
|
85
141
|
};
|
142
|
+
/**
|
143
|
+
* Attaches class names to an HTMLElement based on given conditions.
|
144
|
+
*
|
145
|
+
* @param {HTMLElement} viewItem - The HTML element to which class names will be added.
|
146
|
+
* @param {boolean} isInViewStack - Indicates if the view item is in the view stack.
|
147
|
+
* @param {boolean} isActive - Indicates if the view item is active.
|
148
|
+
* @param {boolean} isBeingRecycledOut - Indicates if the view item is being recycled out.
|
149
|
+
* @param {boolean} isBeingRecycledIn - Indicates if the view item is being recycled in.
|
150
|
+
* @returns {void}
|
151
|
+
*/
|
86
152
|
const attachClassNames = (viewItem, isInViewStack, isActive, isBeingRecycledOut, isBeingRecycledIn) => {
|
87
153
|
viewItem.classList.add(`${prefix}__view`);
|
88
154
|
viewItem.classList.toggle(`${prefix}__view-in-stack`, isInViewStack && !isActive);
|
@@ -100,6 +166,12 @@ const initCarousel = (carouselContainer, config) => {
|
|
100
166
|
const remToPx = (rem) => {
|
101
167
|
return (rem * parseFloat(getComputedStyle(document.documentElement).fontSize));
|
102
168
|
};
|
169
|
+
/**
|
170
|
+
* Updates the height of the items wrapper in a carousel based on the smallest item height and a threshold height.
|
171
|
+
* This function ensures that the items wrapper does not have a height smaller than the threshold, adjusting the item height if necessary.
|
172
|
+
*
|
173
|
+
* @param {number} itemHeightSmallest - The smallest height of an item in pixels.
|
174
|
+
*/
|
103
175
|
const updateHeightForWrapper = (itemHeightSmallest) => {
|
104
176
|
const thresholdHeight = remToPx(minHeight);
|
105
177
|
const containerHeight = carouselContainer.clientHeight;
|
@@ -113,6 +185,10 @@ const initCarousel = (carouselContainer, config) => {
|
|
113
185
|
}
|
114
186
|
}
|
115
187
|
};
|
188
|
+
/**
|
189
|
+
* Performs animation on view items based on their state in the view index stack.
|
190
|
+
* @param {boolean} isInitial - A flag indicating if this is the initial animation.
|
191
|
+
*/
|
116
192
|
const performAnimation = (isInitial) => {
|
117
193
|
let itemHeightSmallest = 0;
|
118
194
|
Array.from(viewItems).forEach((viewItem, index) => {
|
@@ -145,6 +221,8 @@ const initCarousel = (carouselContainer, config) => {
|
|
145
221
|
transitionComplete(viewItem);
|
146
222
|
}
|
147
223
|
};
|
224
|
+
// store reference on the element for later removal
|
225
|
+
viewItem._carouselListener = listener;
|
148
226
|
viewItem.addEventListener('animationend', listener);
|
149
227
|
viewItem.addEventListener('transitionend', listener);
|
150
228
|
viewItem.setAttribute('data-index', index.toString());
|
@@ -154,10 +232,22 @@ const initCarousel = (carouselContainer, config) => {
|
|
154
232
|
handleTransitionEnd(Array.from(viewItems)[0]);
|
155
233
|
}
|
156
234
|
};
|
235
|
+
/**
|
236
|
+
* A utility function to navigate to the next view in the stack.
|
237
|
+
* This function increments the current view index and transitions to the new index.
|
238
|
+
*
|
239
|
+
* @returns {void} - This function does not return any value.
|
240
|
+
*/
|
157
241
|
const navigateNext = () => {
|
158
242
|
const targetViewIndex = viewIndexStack[0] + 1;
|
159
243
|
transitionToViewIndex(targetViewIndex);
|
160
244
|
};
|
245
|
+
/**
|
246
|
+
* Navigates to the previous view in the view stack.
|
247
|
+
* @function navigatePrev
|
248
|
+
* @description This function checks if there is a previous view in the stack. If so, it triggers a transition start, removes the current view from the stack, and performs an animation to transition to the previous view.
|
249
|
+
* @returns {void} - This function does not return a value.
|
250
|
+
*/
|
161
251
|
const navigatePrev = () => {
|
162
252
|
if (viewIndexStack.length - 1 >= 1) {
|
163
253
|
handleTransitionStart();
|
@@ -165,22 +255,62 @@ const initCarousel = (carouselContainer, config) => {
|
|
165
255
|
performAnimation(false);
|
166
256
|
}
|
167
257
|
};
|
258
|
+
/**
|
259
|
+
* A function that transitions the view to a specified index.
|
260
|
+
*
|
261
|
+
* @param {number} index - The index to transition to.
|
262
|
+
* @returns {void} - This function does not return a value.
|
263
|
+
*/
|
168
264
|
const goToIndex = (index) => {
|
169
265
|
transitionToViewIndex(index);
|
170
266
|
};
|
267
|
+
/**
|
268
|
+
* Retrieves the currently active item and its index from the view index stack and references.
|
269
|
+
* @returns An object containing the index and the corresponding item reference.
|
270
|
+
*/
|
171
271
|
const getActiveItem = () => {
|
172
272
|
return {
|
173
273
|
index: viewIndexStack[0],
|
174
274
|
item: refs[viewIndexStack[0]],
|
175
275
|
};
|
176
276
|
};
|
277
|
+
/**
|
278
|
+
* Resets the view index stack and performs an animation.
|
279
|
+
*
|
280
|
+
* @returns {void}
|
281
|
+
*/
|
177
282
|
const reset = () => {
|
178
283
|
viewIndexStack = [0];
|
179
284
|
performAnimation(false);
|
180
285
|
};
|
286
|
+
/**
|
287
|
+
* Removes event listeners for 'animationend' and 'transitionend' events from all elements with references stored in the `refs` object.
|
288
|
+
* Also registers swipe events if `excludeSwipeSupport` is false.
|
289
|
+
*/
|
181
290
|
const destroyEvents = () => {
|
182
|
-
|
291
|
+
Object.values(refs).forEach((el) => {
|
292
|
+
if (el && el._carouselListener) {
|
293
|
+
el.removeEventListener('animationend', el._carouselListener);
|
294
|
+
el.removeEventListener('transitionend', el._carouselListener);
|
295
|
+
}
|
296
|
+
});
|
297
|
+
if (!excludeSwipeSupport) {
|
298
|
+
registerSwipeEvents(carouselContainer, navigateNext, navigatePrev, true);
|
299
|
+
}
|
183
300
|
};
|
301
|
+
/**
|
302
|
+
* Retrieves carousel items from a given container element.
|
303
|
+
* If the container has a 'slot' element, it fetches all elements assigned to that slot.
|
304
|
+
* Otherwise, it fetches all direct children of the container.
|
305
|
+
*
|
306
|
+
* @param {HTMLElement} container - The container element from which to extract carousel items.
|
307
|
+
* @returns {HTMLElement[]} An array of HTMLElements representing the carousel items.
|
308
|
+
*
|
309
|
+
* @example
|
310
|
+
* const carouselContainer = document.querySelector('.carousel-container');
|
311
|
+
* const carouselItems = getCarouselItems(carouselContainer);
|
312
|
+
* console.log(carouselItems); // Logs the carousel items as HTMLElements
|
313
|
+
*/
|
184
314
|
const getCarouselItems = (container) => {
|
185
315
|
const slot = container.querySelector('slot');
|
186
316
|
return slot
|
@@ -202,7 +332,8 @@ const initCarousel = (carouselContainer, config) => {
|
|
202
332
|
reset,
|
203
333
|
goToIndex,
|
204
334
|
getActiveItem,
|
205
|
-
destroyEvents
|
335
|
+
destroyEvents,
|
336
|
+
allViews: refs,
|
206
337
|
};
|
207
338
|
};
|
208
339
|
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"carousel.js","sources":["../../../src/utilities/carousel/carousel.ts"],"sourcesContent":[null],"names":[],"mappings":";;;;;;;;;AAAA;;;;;AAKG;
|
1
|
+
{"version":3,"file":"carousel.js","sources":["../../../src/utilities/carousel/carousel.ts"],"sourcesContent":[null],"names":[],"mappings":"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"}
|
@@ -32,5 +32,6 @@ interface InitCarousel {
|
|
32
32
|
goToIndex: (index: number) => void;
|
33
33
|
getActiveItem: () => ActiveItem;
|
34
34
|
destroyEvents: (() => void) | null;
|
35
|
+
allViews: Record<number, HTMLElement | null>;
|
35
36
|
}
|
36
37
|
export type { CarouselStackHistory, CarouselResponse, InitCarousel };
|
@@ -39,9 +39,11 @@ declare const CDSAboutModal_base: {
|
|
39
39
|
hidePopover(): void;
|
40
40
|
showPopover(): void;
|
41
41
|
togglePopover(force?: boolean): boolean;
|
42
|
-
addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options
|
43
|
-
|
44
|
-
|
42
|
+
addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options
|
43
|
+
/**
|
44
|
+
* Determines if About Modal is open or not.
|
45
|
+
*/
|
46
|
+
?: boolean | AddEventListenerOptions): void;
|
45
47
|
addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
|
46
48
|
removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
|
47
49
|
removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
|
@@ -366,6 +368,9 @@ declare const CDSAboutModal_base: {
|
|
366
368
|
* @csspart dialog The dialog.
|
367
369
|
* The custom event fired before this about modal is being closed upon a user gesture.
|
368
370
|
* Cancellation of this event stops the user-initiated action of closing this about modal.
|
371
|
+
* @fires c4p-about-modal-beingclosed
|
372
|
+
* The custom event fired before this about modal is being closed upon a user gesture.
|
373
|
+
* Cancellation of this event stops the user-initiated action of closing this about modal.
|
369
374
|
* @fires c4p-about-modal-closed - The custom event fired after this about modal is closed upon a user gesture.
|
370
375
|
*/
|
371
376
|
declare class CDSAboutModal extends CDSAboutModal_base {
|
@@ -414,6 +419,12 @@ declare class CDSAboutModal extends CDSAboutModal_base {
|
|
414
419
|
updated(): void;
|
415
420
|
render(): import("lit-html").TemplateResult<1>;
|
416
421
|
private _handleKeydown;
|
422
|
+
/**
|
423
|
+
* Handles `click` event on this element.
|
424
|
+
*
|
425
|
+
* @param event The event.
|
426
|
+
*/
|
427
|
+
private _handleOutsideClick;
|
417
428
|
/**
|
418
429
|
* Handles user-initiated close request of this About Modal.
|
419
430
|
*
|
@@ -425,6 +436,11 @@ declare class CDSAboutModal extends CDSAboutModal_base {
|
|
425
436
|
* The name of the custom event fired after this About Modal is closed upon a user gesture.
|
426
437
|
*/
|
427
438
|
static get eventClose(): string;
|
439
|
+
/**
|
440
|
+
* The name of the custom event fired before this About modal is being closed upon a user gesture.
|
441
|
+
* Cancellation of this event stops the user-initiated action of closing this About modal.
|
442
|
+
*/
|
443
|
+
static get eventBeforeClose(): string;
|
428
444
|
static styles: any;
|
429
445
|
}
|
430
446
|
export default CDSAboutModal;
|
@@ -363,6 +363,7 @@ declare const CDSInterstitialScreenBody_base: {
|
|
363
363
|
* @fires c4p-on-after-step-change - The name of the custom event fired at the end of the step change.
|
364
364
|
*/
|
365
365
|
declare class CDSInterstitialScreenBody extends CDSInterstitialScreenBody_base {
|
366
|
+
slot: string;
|
366
367
|
stepType: 'single' | 'multi';
|
367
368
|
private carouselAPI;
|
368
369
|
private carouselElement;
|
@@ -370,6 +371,7 @@ declare class CDSInterstitialScreenBody extends CDSInterstitialScreenBody_base {
|
|
370
371
|
private _initCarousel;
|
371
372
|
private onViewChangeStart;
|
372
373
|
private onViewChangeEnd;
|
374
|
+
private updateAriaHiddenTabIndex;
|
373
375
|
render(): import("lit-html").TemplateResult<1>;
|
374
376
|
static styles: any;
|
375
377
|
/**
|
@@ -6,6 +6,7 @@
|
|
6
6
|
* This source code is licensed under the Apache-2.0 license found in the
|
7
7
|
* LICENSE file in the root directory of this source tree.
|
8
8
|
*/
|
9
|
+
import { PropertyValues } from 'lit';
|
9
10
|
import '@carbon/web-components/es/components/button/index.js';
|
10
11
|
import '@carbon/web-components/es/components/inline-loading/inline-loading.js';
|
11
12
|
import { CDSModalFooter } from '@carbon/web-components/es/index.js';
|
@@ -383,6 +384,7 @@ declare class CDSInterstitialScreenFooter extends CDSInterstitialScreenFooter_ba
|
|
383
384
|
* The label for the start button.
|
384
385
|
*/
|
385
386
|
startButtonLabel: string;
|
387
|
+
slot: string;
|
386
388
|
/**
|
387
389
|
* Enables support for asynchronous validation or user confirmation before proceeding
|
388
390
|
* to the next interstitial step. When set to true, the component will wait for an external
|
@@ -392,6 +394,7 @@ declare class CDSInterstitialScreenFooter extends CDSInterstitialScreenFooter_ba
|
|
392
394
|
*/
|
393
395
|
asyncAction: any;
|
394
396
|
loadingAction: any;
|
397
|
+
protected updated(_changedProperties: PropertyValues): void;
|
395
398
|
private _handleUserInitiatedClose;
|
396
399
|
private handleSkip;
|
397
400
|
private handleStart;
|
@@ -365,6 +365,7 @@ declare class CDSInterstitialScreenHeader extends CDSInterstitialScreenHeader_ba
|
|
365
365
|
* Provide an optional title to be applied to the header.
|
366
366
|
*/
|
367
367
|
headerTitle: string;
|
368
|
+
slot: string;
|
368
369
|
/**
|
369
370
|
* Tooltip text and aria label for the Close button icon.
|
370
371
|
*/
|
@@ -384,6 +385,7 @@ declare class CDSInterstitialScreenHeader extends CDSInterstitialScreenHeader_ba
|
|
384
385
|
* @param triggeredBy The element that triggered this close request.
|
385
386
|
*/
|
386
387
|
private _handleUserInitiatedClose;
|
388
|
+
getElementForAriaLive: () => import("lit-html").TemplateResult<1>;
|
387
389
|
getProgressIndicatorContent(stepDetails: any): import("lit-html").TemplateResult<1>;
|
388
390
|
getTitleContent(): import("lit-html").TemplateResult<1>;
|
389
391
|
getHeaderContent(): import("lit-html").TemplateResult<1>;
|
@@ -391,19 +391,23 @@ declare class CDSInterstitialScreen extends CDSInterstitialScreen_base {
|
|
391
391
|
* @ignore
|
392
392
|
*/
|
393
393
|
modalBody: HTMLElement;
|
394
|
-
private header;
|
395
|
-
private body;
|
396
|
-
private footer;
|
397
394
|
private _wasOpen;
|
398
395
|
connectedCallback(): void;
|
396
|
+
disconnectedCallback(): void;
|
399
397
|
firstUpdated(): void;
|
400
398
|
updated(changedProps: Map<string | number | symbol, unknown>): void;
|
401
399
|
private dispatchInItializeEvent;
|
400
|
+
/**
|
401
|
+
* Handles `click` event on this element.
|
402
|
+
*
|
403
|
+
* @param event The event.
|
404
|
+
*/
|
405
|
+
private _handleOutsideClick;
|
402
406
|
private setDisableActionButtons;
|
403
407
|
_handleClose(e: any): void;
|
404
|
-
renderFullScreen(): import("lit-html").TemplateResult<1
|
408
|
+
renderFullScreen(): import("lit-html").TemplateResult<1>;
|
405
409
|
renderModal(): import("lit-html").TemplateResult<1>;
|
406
|
-
render(): import("lit-html").TemplateResult<1
|
410
|
+
render(): import("lit-html").TemplateResult<1> | typeof nothing;
|
407
411
|
static styles: any;
|
408
412
|
static get eventOnInterstitialOpened(): string;
|
409
413
|
/**
|
@@ -0,0 +1 @@
|
|
1
|
+
import './index';
|
@@ -10,6 +10,7 @@ import { LitElement } from 'lit';
|
|
10
10
|
import '@carbon/web-components/es/components/button/index.js';
|
11
11
|
import '@carbon/web-components/es/components/toggle/index.js';
|
12
12
|
import '@carbon/web-components/es/components/icon-button/index.js';
|
13
|
+
import '@carbon-labs/wc-empty-state/es/index.js';
|
13
14
|
declare const CDSNotificationPanel_base: {
|
14
15
|
new (...args: any[]): {
|
15
16
|
_handles: Set<import("@carbon/web-components/es/globals/internal/handle").default>;
|
@@ -392,6 +393,10 @@ declare class CDSNotificationPanel extends CDSNotificationPanel_base {
|
|
392
393
|
* Sets the label text for the "Dismiss all" button in the Notification panel
|
393
394
|
*/
|
394
395
|
dismissAllLabel: any;
|
396
|
+
/**
|
397
|
+
* Sets the empty state label text when there are no notifications
|
398
|
+
*/
|
399
|
+
emptyStateLabel: any;
|
395
400
|
/**
|
396
401
|
* Sets the label text for the "Do Not Disturb" toggle in the Notification panel
|
397
402
|
*/
|
@@ -446,7 +451,7 @@ declare class CDSNotificationPanel extends CDSNotificationPanel_base {
|
|
446
451
|
*/
|
447
452
|
static get eventClickOutside(): string;
|
448
453
|
/**
|
449
|
-
* The name of the custom event fired after
|
454
|
+
* The name of the custom event fired after dismiss all button click
|
450
455
|
*/
|
451
456
|
static get eventDismissAll(): string;
|
452
457
|
/**
|
@@ -8,6 +8,7 @@
|
|
8
8
|
*/
|
9
9
|
import { LitElement } from 'lit';
|
10
10
|
import '@carbon/web-components/es/components/button/index.js';
|
11
|
+
import '@carbon/web-components/es/components/layer/index.js';
|
11
12
|
export declare const blockClass = "c4p--options-tile";
|
12
13
|
declare const CDSOptionsTile_base: {
|
13
14
|
new (...args: any[]): {
|
@@ -367,9 +368,9 @@ declare const CDSOptionsTile_base: {
|
|
367
368
|
* */
|
368
369
|
declare class CDSOptionsTile extends CDSOptionsTile_base {
|
369
370
|
/**
|
370
|
-
*
|
371
|
+
* Determines if the tile is open by default
|
371
372
|
*/
|
372
|
-
|
373
|
+
defaultOpen?: boolean;
|
373
374
|
/**
|
374
375
|
* Determines the size of the header
|
375
376
|
*/
|
@@ -382,6 +383,12 @@ declare class CDSOptionsTile extends CDSOptionsTile_base {
|
|
382
383
|
* Text for the title
|
383
384
|
*/
|
384
385
|
titleText: string;
|
386
|
+
/**
|
387
|
+
* Using the native toggle event handler in details can cause an infinite loop
|
388
|
+
* when setting the native open attribute. To combat this, the open state is kept
|
389
|
+
* here and only referenced internally.
|
390
|
+
*/
|
391
|
+
private _open;
|
385
392
|
static get eventOpen(): string;
|
386
393
|
static get eventClose(): string;
|
387
394
|
private _toggle;
|
@@ -0,0 +1,40 @@
|
|
1
|
+
/**
|
2
|
+
* @license
|
3
|
+
*
|
4
|
+
* Copyright IBM Corp. 2025, 2025
|
5
|
+
*
|
6
|
+
* This source code is licensed under the Apache-2.0 license found in the
|
7
|
+
* LICENSE file in the root directory of this source tree.
|
8
|
+
*/
|
9
|
+
import { LitElement } from 'lit';
|
10
|
+
import '@carbon/web-components/es/components/tag/index.js';
|
11
|
+
import '@carbon/web-components/es/components/link/index.js';
|
12
|
+
import '@carbon/web-components/es/components/modal/index.js';
|
13
|
+
import '@carbon/web-components/es/components/search/index.js';
|
14
|
+
import { TagType } from './utils';
|
15
|
+
export default class SetOfTags extends LitElement {
|
16
|
+
hiddenTags: TagType[];
|
17
|
+
tagsData: TagType[];
|
18
|
+
private container;
|
19
|
+
private offset;
|
20
|
+
private isPopoverOpen;
|
21
|
+
private modalOpen;
|
22
|
+
private searchString;
|
23
|
+
private overflowHandler;
|
24
|
+
private resizeObserver;
|
25
|
+
connectedCallback(): void;
|
26
|
+
firstUpdated(): void;
|
27
|
+
updated(changedProperties: Map<string, unknown>): void;
|
28
|
+
disconnectedCallback(): void;
|
29
|
+
private setupOverflowHandler;
|
30
|
+
private handleTogglePopover;
|
31
|
+
private handleDocumentClick;
|
32
|
+
private handleDismiss;
|
33
|
+
render(): import("lit-html").TemplateResult<1>;
|
34
|
+
static styles: any;
|
35
|
+
}
|
36
|
+
declare global {
|
37
|
+
interface HTMLElementTagNameMap {
|
38
|
+
'set-of-tags': SetOfTags;
|
39
|
+
}
|
40
|
+
}
|
@@ -0,0 +1,23 @@
|
|
1
|
+
/**
|
2
|
+
* @license
|
3
|
+
*
|
4
|
+
* Copyright IBM Corp. 2025, 2025
|
5
|
+
*
|
6
|
+
* This source code is licensed under the Apache-2.0 license found in the
|
7
|
+
* LICENSE file in the root directory of this source tree.
|
8
|
+
*/
|
9
|
+
import { TAG_TYPE, TAG_SIZE } from '@carbon/web-components/es/components/tag/defs';
|
10
|
+
export interface TagType {
|
11
|
+
type: TAG_TYPE;
|
12
|
+
text: string;
|
13
|
+
size: TAG_SIZE;
|
14
|
+
onClose?: () => void;
|
15
|
+
}
|
16
|
+
interface GenerateTagsOptions {
|
17
|
+
count: number;
|
18
|
+
size?: TAG_SIZE;
|
19
|
+
dismissible?: boolean;
|
20
|
+
}
|
21
|
+
export declare function generateTags({ count, size, dismissible, }: GenerateTagsOptions): TagType[];
|
22
|
+
export declare const tagsData: TagType[];
|
23
|
+
export {};
|
@@ -381,14 +381,6 @@ declare class CDSSidePanel extends CDSSidePanel_base {
|
|
381
381
|
* The element that had focus before this side-panel gets open.
|
382
382
|
*/
|
383
383
|
private _launcher;
|
384
|
-
/**
|
385
|
-
* Node to track focus going outside of side-panel content.
|
386
|
-
*/
|
387
|
-
private _startSentinelNode;
|
388
|
-
/**
|
389
|
-
* Node to track focus going outside of side-panel content.
|
390
|
-
*/
|
391
|
-
private _endSentinelNode;
|
392
384
|
/**
|
393
385
|
* Node to track side panel.
|
394
386
|
*/
|
@@ -408,13 +400,20 @@ declare class CDSSidePanel extends CDSSidePanel_base {
|
|
408
400
|
_actionsCount: number;
|
409
401
|
_slugCloseSize: string;
|
410
402
|
/**
|
411
|
-
*
|
403
|
+
* Get focusable elements.
|
412
404
|
*
|
413
|
-
*
|
414
|
-
*
|
415
|
-
* @
|
405
|
+
* Querying all tabbable items.
|
406
|
+
*
|
407
|
+
* @returns {{first: HTMLElement, last: HTMLElement, all: HTMLElement[]}} Returns an object with various elements.
|
408
|
+
*/
|
409
|
+
private getFocusable;
|
410
|
+
/**
|
411
|
+
* Handle the keydown event.
|
412
|
+
* Trap the focus inside the side-panel by tracking keydown.key == `Tab`
|
413
|
+
*
|
414
|
+
* @param {KeyboardEvent} event The keyboard event object.
|
416
415
|
*/
|
417
|
-
|
416
|
+
protected _handleHostKeydown: (event: KeyboardEvent) => void;
|
418
417
|
private _handleKeydown;
|
419
418
|
private _reducedMotion;
|
420
419
|
/**
|
@@ -5,4 +5,10 @@
|
|
5
5
|
* LICENSE file in the root directory of this source tree.
|
6
6
|
*/
|
7
7
|
import { InitCarousel, Config } from './types';
|
8
|
+
/**
|
9
|
+
* Initializes a carousel with the given configuration.
|
10
|
+
* @param carouselContainer - The HTMLElement representing the carousel container.
|
11
|
+
* @param config - Optional configuration object.
|
12
|
+
* @returns An object containing methods to control the carousel.
|
13
|
+
*/
|
8
14
|
export declare const initCarousel: (carouselContainer: HTMLElement, config?: Config) => InitCarousel;
|