@carbon/ibmdotcom-web-components 2.15.1 → 2.16.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 +275 -9
- package/dist/dotcom-shell.js +1 -1
- package/dist/dotcom-shell.min.js +1 -1
- package/dist/ibmdotcom-web-components-dotcom-shell.js +1 -1
- package/dist/ibmdotcom-web-components-dotcom-shell.min.js +1 -1
- package/dist/{index-99142b40.js → index-6ab416ae.js} +5 -5
- package/dist/{index-03c48f1e.js → index-6f798488.js} +20 -9
- package/dist/{left-nav-menu-2e404c03.js → left-nav-menu-40ebffa9.js} +1 -1
- package/dist/{left-nav-menu-992dba4e.js → left-nav-menu-629e7752.js} +1 -1
- package/dist/{left-nav-menu-category-heading-49bdf0ea.js → left-nav-menu-category-heading-1886967e.js} +1 -1
- package/dist/{left-nav-menu-category-heading-7a46e8b6.js → left-nav-menu-category-heading-1d965e0a.js} +1 -1
- package/dist/{left-nav-menu-item-b5f3022a.js → left-nav-menu-item-03cf8244.js} +1 -1
- package/dist/{left-nav-menu-item-85504de0.js → left-nav-menu-item-a9c7113f.js} +1 -1
- package/dist/{left-nav-menu-section-16fe3a87.js → left-nav-menu-section-c39512a8.js} +1 -1
- package/dist/{left-nav-menu-section-d0d11510.js → left-nav-menu-section-e9526c5a.js} +1 -1
- package/dist/{left-nav-overlay-43be2e0f.js → left-nav-overlay-59e8851e.js} +1 -1
- package/dist/{left-nav-overlay-e8435b5c.js → left-nav-overlay-60a5eead.js} +1 -1
- package/dist/{megamenu-category-group-0f365f5a.js → megamenu-category-group-60d3805b.js} +1 -1
- package/dist/{megamenu-category-group-copy-f600eb27.js → megamenu-category-group-copy-46df540c.js} +1 -1
- package/dist/{megamenu-category-group-copy-bd0e2529.js → megamenu-category-group-copy-6ae3dfe8.js} +1 -1
- package/dist/{megamenu-category-group-ed0148e2.js → megamenu-category-group-e191e806.js} +1 -1
- package/dist/{megamenu-category-heading-9e4184d9.js → megamenu-category-heading-420838f8.js} +1 -1
- package/dist/{megamenu-category-heading-e73a6d5b.js → megamenu-category-heading-4b2d5ba1.js} +1 -1
- package/dist/{megamenu-category-link-4c1ca891.js → megamenu-category-link-e5f8c975.js} +1 -1
- package/dist/{megamenu-category-link-fc55652f.js → megamenu-category-link-ef739901.js} +1 -1
- package/dist/{megamenu-category-link-group-d22c6c1b.js → megamenu-category-link-group-90b667c2.js} +1 -1
- package/dist/{megamenu-category-link-group-ace0e779.js → megamenu-category-link-group-a85ef70e.js} +1 -1
- package/dist/{megamenu-left-navigation-eead91f9.js → megamenu-left-navigation-0a188f17.js} +1 -1
- package/dist/{megamenu-left-navigation-3b2e1168.js → megamenu-left-navigation-d3619fc8.js} +1 -1
- package/dist/{megamenu-overlay-8b3ba0fb.js → megamenu-overlay-73bf0741.js} +1 -1
- package/dist/{megamenu-overlay-08bd8a36.js → megamenu-overlay-98b82923.js} +1 -1
- package/dist/{megamenu-tab-15629cd2.js → megamenu-tab-320d3677.js} +6 -6
- package/dist/{megamenu-tab-c2aa1eac.js → megamenu-tab-63b4d4a8.js} +14 -19
- package/es/components/back-to-top/__stories__/back-to-top.stories.css.js +1 -1
- package/es/components/countdown/countdown.d.ts +406 -0
- package/es/components/countdown/countdown.js +269 -0
- package/es/components/countdown/countdown.js.map +1 -0
- package/es/components/countdown/index.d.ts +11 -0
- package/es/components/countdown/index.js +18 -0
- package/es/components/countdown/index.js.map +1 -0
- package/es/components/leadspace/leadspace.css.js +1 -1
- package/es/components/masthead/masthead-cart.js +1 -1
- package/es/components/masthead/masthead-cart.js.map +1 -1
- package/es/components/masthead/masthead-l1.js +11 -1
- package/es/components/masthead/masthead-l1.js.map +1 -1
- package/es/components/masthead/megamenu-tab.d.ts +1 -5
- package/es/components/masthead/megamenu-tab.js +10 -16
- package/es/components/masthead/megamenu-tab.js.map +1 -1
- package/es/components/promo-banner/index.d.ts +11 -0
- package/es/components/promo-banner/index.js +18 -0
- package/es/components/promo-banner/index.js.map +1 -0
- package/es/components/promo-banner/promo-banner.css.js +12 -0
- package/es/components/promo-banner/promo-banner.d.ts +385 -0
- package/es/components/promo-banner/promo-banner.js +216 -0
- package/es/components/promo-banner/promo-banner.js.map +1 -0
- package/es/components/star-rating/index.d.ts +11 -0
- package/es/components/star-rating/index.js +18 -0
- package/es/components/star-rating/index.js.map +1 -0
- package/es/components/star-rating/star-rating.css.js +12 -0
- package/es/components/star-rating/star-rating.d.ts +427 -0
- package/es/components/star-rating/star-rating.js +320 -0
- package/es/components/star-rating/star-rating.js.map +1 -0
- package/es/components/structured-list/structured-list-cell.js +1 -1
- package/es/components/structured-list/structured-list-cell.js.map +1 -1
- package/es/components/table-of-contents/table-of-contents-cdn.css.js +1 -1
- package/es/components/table-of-contents/table-of-contents.css.js +1 -1
- package/es/components/tile/index.d.ts +12 -0
- package/es/components/tile/index.js +19 -0
- package/es/components/tile/index.js.map +1 -0
- package/es/components/tile/tile-group.d.ts +21 -0
- package/es/components/tile/tile-group.js +56 -0
- package/es/components/tile/tile-group.js.map +1 -0
- package/es/components/tile/tile.css.js +12 -0
- package/es/components/tile/tile.d.ts +737 -0
- package/es/components/tile/tile.js +225 -0
- package/es/components/tile/tile.js.map +1 -0
- package/es/globals/internal/storybook-decorators.d.ts +31 -0
- package/es/globals/internal/storybook-decorators.js +43 -0
- package/es/globals/internal/storybook-decorators.js.map +1 -0
- package/es/globals/mixins/throttled-input.js +5 -4
- package/es/globals/mixins/throttled-input.js.map +1 -1
- package/es/internal/vendor/@carbon/ibmdotcom-utilities/utilities/settings/settings.js +2 -2
- package/lib/internal/vendor/@carbon/ibmdotcom-utilities/utilities/settings/settings.js +2 -2
- package/package.json +7 -6
- package/scss/components/promo-banner/promo-banner.scss +163 -0
- package/scss/components/star-rating/star-rating.scss +76 -0
- package/scss/components/tile/tile.scss +290 -0
|
@@ -0,0 +1,385 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
*
|
|
4
|
+
* Copyright IBM Corp. 2024
|
|
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 { CTA_TYPE } from '../cta/defs';
|
|
11
|
+
declare const C4DPromoBanner_base: {
|
|
12
|
+
new (...args: any[]): {
|
|
13
|
+
_linkNode: any;
|
|
14
|
+
_handleClick(event: MouseEvent): void;
|
|
15
|
+
ctaType: CTA_TYPE;
|
|
16
|
+
disabled?: boolean;
|
|
17
|
+
download?: string;
|
|
18
|
+
href?: string;
|
|
19
|
+
target?: string;
|
|
20
|
+
formatVideoCaption: any;
|
|
21
|
+
formatVideoDuration: any;
|
|
22
|
+
videoDuration?: number;
|
|
23
|
+
videoName?: string;
|
|
24
|
+
videoDescription?: string;
|
|
25
|
+
videoTitle: any;
|
|
26
|
+
videoThumbnailUrl?: never;
|
|
27
|
+
_renderIcon(): import("lit-html").TemplateResult<1>;
|
|
28
|
+
firstUpdated(): void;
|
|
29
|
+
updated(changedProperties: any): void;
|
|
30
|
+
_checkUrlVideoTrigger(): void;
|
|
31
|
+
_updateVideoThumbnailUrl(width?: string): void;
|
|
32
|
+
accessKey: string;
|
|
33
|
+
readonly accessKeyLabel: string;
|
|
34
|
+
autocapitalize: string;
|
|
35
|
+
dir: string;
|
|
36
|
+
draggable: boolean;
|
|
37
|
+
hidden: boolean;
|
|
38
|
+
inert: boolean;
|
|
39
|
+
innerText: string;
|
|
40
|
+
lang: string;
|
|
41
|
+
readonly offsetHeight: number;
|
|
42
|
+
readonly offsetLeft: number;
|
|
43
|
+
readonly offsetParent: Element | null;
|
|
44
|
+
readonly offsetTop: number;
|
|
45
|
+
readonly offsetWidth: number;
|
|
46
|
+
outerText: string;
|
|
47
|
+
popover: string | null;
|
|
48
|
+
spellcheck: boolean;
|
|
49
|
+
title: string;
|
|
50
|
+
translate: boolean;
|
|
51
|
+
attachInternals(): ElementInternals;
|
|
52
|
+
click(): void;
|
|
53
|
+
hidePopover(): void;
|
|
54
|
+
showPopover(): void;
|
|
55
|
+
togglePopover(force?: boolean): boolean;
|
|
56
|
+
addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
|
|
57
|
+
addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
|
|
58
|
+
removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
|
|
59
|
+
removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
|
|
60
|
+
readonly attributes: NamedNodeMap;
|
|
61
|
+
readonly classList: DOMTokenList;
|
|
62
|
+
className: string;
|
|
63
|
+
readonly clientHeight: number;
|
|
64
|
+
readonly clientLeft: number;
|
|
65
|
+
readonly clientTop: number;
|
|
66
|
+
readonly clientWidth: number;
|
|
67
|
+
id: string;
|
|
68
|
+
readonly localName: string;
|
|
69
|
+
readonly namespaceURI: string | null;
|
|
70
|
+
onfullscreenchange: ((this: Element, ev: Event) => any) | null;
|
|
71
|
+
onfullscreenerror: ((this: Element, ev: Event) => any) | null;
|
|
72
|
+
outerHTML: string;
|
|
73
|
+
readonly ownerDocument: Document;
|
|
74
|
+
readonly part: DOMTokenList;
|
|
75
|
+
readonly prefix: string | null;
|
|
76
|
+
readonly scrollHeight: number;
|
|
77
|
+
scrollLeft: number;
|
|
78
|
+
scrollTop: number;
|
|
79
|
+
readonly scrollWidth: number;
|
|
80
|
+
readonly shadowRoot: ShadowRoot | null;
|
|
81
|
+
slot: string;
|
|
82
|
+
readonly tagName: string;
|
|
83
|
+
attachShadow(init: ShadowRootInit): ShadowRoot;
|
|
84
|
+
checkVisibility(options?: CheckVisibilityOptions): boolean;
|
|
85
|
+
closest<K extends keyof HTMLElementTagNameMap>(selector: K): HTMLElementTagNameMap[K] | null;
|
|
86
|
+
closest<K extends keyof SVGElementTagNameMap>(selector: K): SVGElementTagNameMap[K] | null;
|
|
87
|
+
closest<K extends keyof MathMLElementTagNameMap>(selector: K): MathMLElementTagNameMap[K] | null;
|
|
88
|
+
closest<E extends Element = Element>(selectors: string): E | null;
|
|
89
|
+
computedStyleMap(): StylePropertyMapReadOnly;
|
|
90
|
+
getAttribute(qualifiedName: string): string | null;
|
|
91
|
+
getAttributeNS(namespace: string | null, localName: string): string | null;
|
|
92
|
+
getAttributeNames(): string[];
|
|
93
|
+
getAttributeNode(qualifiedName: string): Attr | null;
|
|
94
|
+
getAttributeNodeNS(namespace: string | null, localName: string): Attr | null;
|
|
95
|
+
getBoundingClientRect(): DOMRect;
|
|
96
|
+
getClientRects(): DOMRectList;
|
|
97
|
+
getElementsByClassName(classNames: string): HTMLCollectionOf<Element>;
|
|
98
|
+
getElementsByTagName<K extends keyof HTMLElementTagNameMap>(qualifiedName: K): HTMLCollectionOf<HTMLElementTagNameMap[K]>;
|
|
99
|
+
getElementsByTagName<K extends keyof SVGElementTagNameMap>(qualifiedName: K): HTMLCollectionOf<SVGElementTagNameMap[K]>;
|
|
100
|
+
getElementsByTagName<K extends keyof MathMLElementTagNameMap>(qualifiedName: K): HTMLCollectionOf<MathMLElementTagNameMap[K]>;
|
|
101
|
+
getElementsByTagName<K extends keyof HTMLElementDeprecatedTagNameMap>(qualifiedName: K): HTMLCollectionOf<HTMLElementDeprecatedTagNameMap[K]>;
|
|
102
|
+
getElementsByTagName(qualifiedName: string): HTMLCollectionOf<Element>;
|
|
103
|
+
getElementsByTagNameNS(namespaceURI: "http://www.w3.org/1999/xhtml", localName: string): HTMLCollectionOf<HTMLElement>;
|
|
104
|
+
getElementsByTagNameNS(namespaceURI: "http://www.w3.org/2000/svg", localName: string): HTMLCollectionOf<SVGElement>;
|
|
105
|
+
getElementsByTagNameNS(namespaceURI: "http://www.w3.org/1998/Math/MathML", localName: string): HTMLCollectionOf<MathMLElement>;
|
|
106
|
+
getElementsByTagNameNS(namespace: string | null, localName: string): HTMLCollectionOf<Element>;
|
|
107
|
+
hasAttribute(qualifiedName: string): boolean;
|
|
108
|
+
hasAttributeNS(namespace: string | null, localName: string): boolean;
|
|
109
|
+
hasAttributes(): boolean;
|
|
110
|
+
hasPointerCapture(pointerId: number): boolean;
|
|
111
|
+
insertAdjacentElement(where: InsertPosition, element: Element): Element | null;
|
|
112
|
+
insertAdjacentHTML(position: InsertPosition, text: string): void;
|
|
113
|
+
insertAdjacentText(where: InsertPosition, data: string): void;
|
|
114
|
+
matches(selectors: string): boolean;
|
|
115
|
+
releasePointerCapture(pointerId: number): void;
|
|
116
|
+
removeAttribute(qualifiedName: string): void;
|
|
117
|
+
removeAttributeNS(namespace: string | null, localName: string): void;
|
|
118
|
+
removeAttributeNode(attr: Attr): Attr;
|
|
119
|
+
requestFullscreen(options?: FullscreenOptions): Promise<void>;
|
|
120
|
+
requestPointerLock(): void;
|
|
121
|
+
scroll(options?: ScrollToOptions): void;
|
|
122
|
+
scroll(x: number, y: number): void;
|
|
123
|
+
scrollBy(options?: ScrollToOptions): void;
|
|
124
|
+
scrollBy(x: number, y: number): void;
|
|
125
|
+
scrollIntoView(arg?: boolean | ScrollIntoViewOptions): void;
|
|
126
|
+
scrollTo(options?: ScrollToOptions): void;
|
|
127
|
+
scrollTo(x: number, y: number): void;
|
|
128
|
+
setAttribute(qualifiedName: string, value: string): void;
|
|
129
|
+
setAttributeNS(namespace: string | null, qualifiedName: string, value: string): void;
|
|
130
|
+
setAttributeNode(attr: Attr): Attr | null;
|
|
131
|
+
setAttributeNodeNS(attr: Attr): Attr | null;
|
|
132
|
+
setHTMLUnsafe(html: string): void;
|
|
133
|
+
setPointerCapture(pointerId: number): void;
|
|
134
|
+
toggleAttribute(qualifiedName: string, force?: boolean): boolean;
|
|
135
|
+
webkitMatchesSelector(selectors: string): boolean;
|
|
136
|
+
readonly baseURI: string;
|
|
137
|
+
readonly childNodes: NodeListOf<ChildNode>;
|
|
138
|
+
readonly firstChild: ChildNode | null;
|
|
139
|
+
readonly isConnected: boolean;
|
|
140
|
+
readonly lastChild: ChildNode | null;
|
|
141
|
+
readonly nextSibling: ChildNode | null;
|
|
142
|
+
readonly nodeName: string;
|
|
143
|
+
readonly nodeType: number;
|
|
144
|
+
nodeValue: string | null;
|
|
145
|
+
readonly parentElement: HTMLElement | null;
|
|
146
|
+
readonly parentNode: ParentNode | null;
|
|
147
|
+
readonly previousSibling: ChildNode | null;
|
|
148
|
+
textContent: string | null;
|
|
149
|
+
appendChild<T extends Node>(node: T): T;
|
|
150
|
+
cloneNode(deep?: boolean): Node;
|
|
151
|
+
compareDocumentPosition(other: Node): number;
|
|
152
|
+
contains(other: Node | null): boolean;
|
|
153
|
+
getRootNode(options?: GetRootNodeOptions): Node;
|
|
154
|
+
hasChildNodes(): boolean;
|
|
155
|
+
insertBefore<T extends Node>(node: T, child: Node | null): T;
|
|
156
|
+
isDefaultNamespace(namespace: string | null): boolean;
|
|
157
|
+
isEqualNode(otherNode: Node | null): boolean;
|
|
158
|
+
isSameNode(otherNode: Node | null): boolean;
|
|
159
|
+
lookupNamespaceURI(prefix: string | null): string | null;
|
|
160
|
+
lookupPrefix(namespace: string | null): string | null;
|
|
161
|
+
normalize(): void;
|
|
162
|
+
removeChild<T extends Node>(child: T): T;
|
|
163
|
+
replaceChild<T extends Node>(node: Node, child: T): T;
|
|
164
|
+
readonly ELEMENT_NODE: 1;
|
|
165
|
+
readonly ATTRIBUTE_NODE: 2;
|
|
166
|
+
readonly TEXT_NODE: 3;
|
|
167
|
+
readonly CDATA_SECTION_NODE: 4;
|
|
168
|
+
readonly ENTITY_REFERENCE_NODE: 5;
|
|
169
|
+
readonly ENTITY_NODE: 6;
|
|
170
|
+
readonly PROCESSING_INSTRUCTION_NODE: 7;
|
|
171
|
+
readonly COMMENT_NODE: 8;
|
|
172
|
+
readonly DOCUMENT_NODE: 9;
|
|
173
|
+
readonly DOCUMENT_TYPE_NODE: 10;
|
|
174
|
+
readonly DOCUMENT_FRAGMENT_NODE: 11;
|
|
175
|
+
readonly NOTATION_NODE: 12;
|
|
176
|
+
readonly DOCUMENT_POSITION_DISCONNECTED: 1;
|
|
177
|
+
readonly DOCUMENT_POSITION_PRECEDING: 2;
|
|
178
|
+
readonly DOCUMENT_POSITION_FOLLOWING: 4;
|
|
179
|
+
readonly DOCUMENT_POSITION_CONTAINS: 8;
|
|
180
|
+
readonly DOCUMENT_POSITION_CONTAINED_BY: 16;
|
|
181
|
+
readonly DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC: 32;
|
|
182
|
+
dispatchEvent(event: Event): boolean;
|
|
183
|
+
ariaAtomic: string | null;
|
|
184
|
+
ariaAutoComplete: string | null;
|
|
185
|
+
ariaBrailleLabel: string | null;
|
|
186
|
+
ariaBrailleRoleDescription: string | null;
|
|
187
|
+
ariaBusy: string | null;
|
|
188
|
+
ariaChecked: string | null;
|
|
189
|
+
ariaColCount: string | null;
|
|
190
|
+
ariaColIndex: string | null;
|
|
191
|
+
ariaColSpan: string | null;
|
|
192
|
+
ariaCurrent: string | null;
|
|
193
|
+
ariaDescription: string | null;
|
|
194
|
+
ariaDisabled: string | null;
|
|
195
|
+
ariaExpanded: string | null;
|
|
196
|
+
ariaHasPopup: string | null;
|
|
197
|
+
ariaHidden: string | null;
|
|
198
|
+
ariaInvalid: string | null;
|
|
199
|
+
ariaKeyShortcuts: string | null;
|
|
200
|
+
ariaLabel: string | null;
|
|
201
|
+
ariaLevel: string | null;
|
|
202
|
+
ariaLive: string | null;
|
|
203
|
+
ariaModal: string | null;
|
|
204
|
+
ariaMultiLine: string | null;
|
|
205
|
+
ariaMultiSelectable: string | null;
|
|
206
|
+
ariaOrientation: string | null;
|
|
207
|
+
ariaPlaceholder: string | null;
|
|
208
|
+
ariaPosInSet: string | null;
|
|
209
|
+
ariaPressed: string | null;
|
|
210
|
+
ariaReadOnly: string | null;
|
|
211
|
+
ariaRequired: string | null;
|
|
212
|
+
ariaRoleDescription: string | null;
|
|
213
|
+
ariaRowCount: string | null;
|
|
214
|
+
ariaRowIndex: string | null;
|
|
215
|
+
ariaRowSpan: string | null;
|
|
216
|
+
ariaSelected: string | null;
|
|
217
|
+
ariaSetSize: string | null;
|
|
218
|
+
ariaSort: string | null;
|
|
219
|
+
ariaValueMax: string | null;
|
|
220
|
+
ariaValueMin: string | null;
|
|
221
|
+
ariaValueNow: string | null;
|
|
222
|
+
ariaValueText: string | null;
|
|
223
|
+
role: string | null;
|
|
224
|
+
animate(keyframes: Keyframe[] | PropertyIndexedKeyframes | null, options?: number | KeyframeAnimationOptions): Animation;
|
|
225
|
+
getAnimations(options?: GetAnimationsOptions): Animation[];
|
|
226
|
+
after(...nodes: (Node | string)[]): void;
|
|
227
|
+
before(...nodes: (Node | string)[]): void;
|
|
228
|
+
remove(): void;
|
|
229
|
+
replaceWith(...nodes: (Node | string)[]): void;
|
|
230
|
+
innerHTML: string;
|
|
231
|
+
readonly nextElementSibling: Element | null;
|
|
232
|
+
readonly previousElementSibling: Element | null;
|
|
233
|
+
readonly childElementCount: number;
|
|
234
|
+
readonly children: HTMLCollection;
|
|
235
|
+
readonly firstElementChild: Element | null;
|
|
236
|
+
readonly lastElementChild: Element | null;
|
|
237
|
+
append(...nodes: (Node | string)[]): void;
|
|
238
|
+
prepend(...nodes: (Node | string)[]): void;
|
|
239
|
+
querySelector<K extends keyof HTMLElementTagNameMap>(selectors: K): HTMLElementTagNameMap[K] | null;
|
|
240
|
+
querySelector<K extends keyof SVGElementTagNameMap>(selectors: K): SVGElementTagNameMap[K] | null;
|
|
241
|
+
querySelector<K extends keyof MathMLElementTagNameMap>(selectors: K): MathMLElementTagNameMap[K] | null;
|
|
242
|
+
querySelector<K extends keyof HTMLElementDeprecatedTagNameMap>(selectors: K): HTMLElementDeprecatedTagNameMap[K] | null;
|
|
243
|
+
querySelector<E extends Element = Element>(selectors: string): E | null;
|
|
244
|
+
querySelectorAll<K extends keyof HTMLElementTagNameMap>(selectors: K): NodeListOf<HTMLElementTagNameMap[K]>;
|
|
245
|
+
querySelectorAll<K extends keyof SVGElementTagNameMap>(selectors: K): NodeListOf<SVGElementTagNameMap[K]>;
|
|
246
|
+
querySelectorAll<K extends keyof MathMLElementTagNameMap>(selectors: K): NodeListOf<MathMLElementTagNameMap[K]>;
|
|
247
|
+
querySelectorAll<K extends keyof HTMLElementDeprecatedTagNameMap>(selectors: K): NodeListOf<HTMLElementDeprecatedTagNameMap[K]>;
|
|
248
|
+
querySelectorAll<E extends Element = Element>(selectors: string): NodeListOf<E>;
|
|
249
|
+
replaceChildren(...nodes: (Node | string)[]): void;
|
|
250
|
+
readonly assignedSlot: HTMLSlotElement | null;
|
|
251
|
+
readonly attributeStyleMap: StylePropertyMap;
|
|
252
|
+
readonly style: CSSStyleDeclaration;
|
|
253
|
+
contentEditable: string;
|
|
254
|
+
enterKeyHint: string;
|
|
255
|
+
inputMode: string;
|
|
256
|
+
readonly isContentEditable: boolean;
|
|
257
|
+
onabort: ((this: GlobalEventHandlers, ev: UIEvent) => any) | null;
|
|
258
|
+
onanimationcancel: ((this: GlobalEventHandlers, ev: AnimationEvent) => any) | null;
|
|
259
|
+
onanimationend: ((this: GlobalEventHandlers, ev: AnimationEvent) => any) | null;
|
|
260
|
+
onanimationiteration: ((this: GlobalEventHandlers, ev: AnimationEvent) => any) | null;
|
|
261
|
+
onanimationstart: ((this: GlobalEventHandlers, ev: AnimationEvent) => any) | null;
|
|
262
|
+
onauxclick: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
|
|
263
|
+
onbeforeinput: ((this: GlobalEventHandlers, ev: InputEvent) => any) | null;
|
|
264
|
+
onbeforetoggle: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
265
|
+
onblur: ((this: GlobalEventHandlers, ev: FocusEvent) => any) | null;
|
|
266
|
+
oncancel: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
267
|
+
oncanplay: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
268
|
+
oncanplaythrough: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
269
|
+
onchange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
270
|
+
onclick: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
|
|
271
|
+
onclose: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
272
|
+
oncontextmenu: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
|
|
273
|
+
oncopy: ((this: GlobalEventHandlers, ev: ClipboardEvent) => any) | null;
|
|
274
|
+
oncuechange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
275
|
+
oncut: ((this: GlobalEventHandlers, ev: ClipboardEvent) => any) | null;
|
|
276
|
+
ondblclick: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
|
|
277
|
+
ondrag: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
|
|
278
|
+
ondragend: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
|
|
279
|
+
ondragenter: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
|
|
280
|
+
ondragleave: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
|
|
281
|
+
ondragover: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
|
|
282
|
+
ondragstart: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
|
|
283
|
+
ondrop: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
|
|
284
|
+
ondurationchange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
285
|
+
onemptied: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
286
|
+
onended: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
287
|
+
onerror: OnErrorEventHandler;
|
|
288
|
+
onfocus: ((this: GlobalEventHandlers, ev: FocusEvent) => any) | null;
|
|
289
|
+
onformdata: ((this: GlobalEventHandlers, ev: FormDataEvent) => any) | null;
|
|
290
|
+
ongotpointercapture: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
|
|
291
|
+
oninput: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
292
|
+
oninvalid: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
293
|
+
onkeydown: ((this: GlobalEventHandlers, ev: KeyboardEvent) => any) | null;
|
|
294
|
+
onkeypress: ((this: GlobalEventHandlers, ev: KeyboardEvent) => any) | null;
|
|
295
|
+
onkeyup: ((this: GlobalEventHandlers, ev: KeyboardEvent) => any) | null;
|
|
296
|
+
onload: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
297
|
+
onloadeddata: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
298
|
+
onloadedmetadata: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
299
|
+
onloadstart: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
300
|
+
onlostpointercapture: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
|
|
301
|
+
onmousedown: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
|
|
302
|
+
onmouseenter: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
|
|
303
|
+
onmouseleave: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
|
|
304
|
+
onmousemove: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
|
|
305
|
+
onmouseout: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
|
|
306
|
+
onmouseover: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
|
|
307
|
+
onmouseup: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
|
|
308
|
+
onpaste: ((this: GlobalEventHandlers, ev: ClipboardEvent) => any) | null;
|
|
309
|
+
onpause: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
310
|
+
onplay: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
311
|
+
onplaying: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
312
|
+
onpointercancel: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
|
|
313
|
+
onpointerdown: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
|
|
314
|
+
onpointerenter: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
|
|
315
|
+
onpointerleave: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
|
|
316
|
+
onpointermove: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
|
|
317
|
+
onpointerout: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
|
|
318
|
+
onpointerover: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
|
|
319
|
+
onpointerup: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
|
|
320
|
+
onprogress: ((this: GlobalEventHandlers, ev: ProgressEvent) => any) | null;
|
|
321
|
+
onratechange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
322
|
+
onreset: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
323
|
+
onresize: ((this: GlobalEventHandlers, ev: UIEvent) => any) | null;
|
|
324
|
+
onscroll: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
325
|
+
onscrollend: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
326
|
+
onsecuritypolicyviolation: ((this: GlobalEventHandlers, ev: SecurityPolicyViolationEvent) => any) | null;
|
|
327
|
+
onseeked: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
328
|
+
onseeking: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
329
|
+
onselect: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
330
|
+
onselectionchange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
331
|
+
onselectstart: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
332
|
+
onslotchange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
333
|
+
onstalled: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
334
|
+
onsubmit: ((this: GlobalEventHandlers, ev: SubmitEvent) => any) | null;
|
|
335
|
+
onsuspend: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
336
|
+
ontimeupdate: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
337
|
+
ontoggle: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
338
|
+
ontouchcancel?: ((this: GlobalEventHandlers, ev: TouchEvent) => any) | null | undefined;
|
|
339
|
+
ontouchend?: ((this: GlobalEventHandlers, ev: TouchEvent) => any) | null | undefined;
|
|
340
|
+
ontouchmove?: ((this: GlobalEventHandlers, ev: TouchEvent) => any) | null | undefined;
|
|
341
|
+
ontouchstart?: ((this: GlobalEventHandlers, ev: TouchEvent) => any) | null | undefined;
|
|
342
|
+
ontransitioncancel: ((this: GlobalEventHandlers, ev: TransitionEvent) => any) | null;
|
|
343
|
+
ontransitionend: ((this: GlobalEventHandlers, ev: TransitionEvent) => any) | null;
|
|
344
|
+
ontransitionrun: ((this: GlobalEventHandlers, ev: TransitionEvent) => any) | null;
|
|
345
|
+
ontransitionstart: ((this: GlobalEventHandlers, ev: TransitionEvent) => any) | null;
|
|
346
|
+
onvolumechange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
347
|
+
onwaiting: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
348
|
+
onwebkitanimationend: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
349
|
+
onwebkitanimationiteration: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
350
|
+
onwebkitanimationstart: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
351
|
+
onwebkittransitionend: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
352
|
+
onwheel: ((this: GlobalEventHandlers, ev: WheelEvent) => any) | null;
|
|
353
|
+
autofocus: boolean;
|
|
354
|
+
readonly dataset: DOMStringMap;
|
|
355
|
+
nonce?: string;
|
|
356
|
+
tabIndex: number;
|
|
357
|
+
blur(): void;
|
|
358
|
+
focus(options?: FocusOptions): void;
|
|
359
|
+
};
|
|
360
|
+
readonly eventRequestVideoData: string;
|
|
361
|
+
readonly eventRunAction: string;
|
|
362
|
+
} & typeof LitElement;
|
|
363
|
+
/**
|
|
364
|
+
* The Promo Banner component.
|
|
365
|
+
* @element c4d-promo-banner
|
|
366
|
+
*/
|
|
367
|
+
declare class C4DPromoBanner extends C4DPromoBanner_base {
|
|
368
|
+
isDesktopVersion: boolean;
|
|
369
|
+
slottedImage: any;
|
|
370
|
+
slottedCta: any;
|
|
371
|
+
handleSlotChange(e: any): void;
|
|
372
|
+
firstUpdated(): void;
|
|
373
|
+
harvestCtaProps(): void;
|
|
374
|
+
/**
|
|
375
|
+
* @inheritdoc
|
|
376
|
+
*/
|
|
377
|
+
_renderIcon(): import("lit-html").TemplateResult<1>;
|
|
378
|
+
_renderMobileLayout(): import("lit-html").TemplateResult<1>;
|
|
379
|
+
_renderDesktopLayout(): import("lit-html").TemplateResult<1>;
|
|
380
|
+
render(): import("lit-html").TemplateResult<1>;
|
|
381
|
+
static get styles(): any;
|
|
382
|
+
}
|
|
383
|
+
export default C4DPromoBanner;
|
|
384
|
+
|
|
385
|
+
//# sourceMappingURL=promo-banner.d.ts.map
|
|
@@ -0,0 +1,216 @@
|
|
|
1
|
+
import _decorate from "@babel/runtime/helpers/esm/decorate";
|
|
2
|
+
let _ = t => t,
|
|
3
|
+
_t,
|
|
4
|
+
_t2,
|
|
5
|
+
_t3,
|
|
6
|
+
_t4;
|
|
7
|
+
/**
|
|
8
|
+
* @license
|
|
9
|
+
*
|
|
10
|
+
* Copyright IBM Corp. 2024
|
|
11
|
+
*
|
|
12
|
+
* This source code is licensed under the Apache-2.0 license found in the
|
|
13
|
+
* LICENSE file in the root directory of this source tree.
|
|
14
|
+
*/
|
|
15
|
+
|
|
16
|
+
import { LitElement, html } from 'lit';
|
|
17
|
+
import { state, queryAssignedNodes } from 'lit/decorators.js';
|
|
18
|
+
import { classMap } from 'lit/directives/class-map.js';
|
|
19
|
+
import { carbonElement as customElement } from '@carbon/web-components/es/globals/decorators/carbon-element.js';
|
|
20
|
+
import { baseFontSize, breakpoints } from '@carbon/layout';
|
|
21
|
+
import styles from "././promo-banner.css.js";
|
|
22
|
+
import settings from '@carbon/ibmdotcom-utilities/es/utilities/settings/settings.js';
|
|
23
|
+
import CTAMixin, { icons as ctaIcons } from "../../component-mixins/cta/cta.js";
|
|
24
|
+
import ifNonEmpty from '@carbon/web-components/es/globals/directives/if-non-empty';
|
|
25
|
+
const {
|
|
26
|
+
stablePrefix: c4dPrefix,
|
|
27
|
+
prefix
|
|
28
|
+
} = settings;
|
|
29
|
+
const breakpoint = parseFloat(breakpoints.lg.width) * baseFontSize;
|
|
30
|
+
const layoutBreakpoint = window.matchMedia(`(min-width: ${breakpoint}px)`);
|
|
31
|
+
|
|
32
|
+
/**
|
|
33
|
+
* The Promo Banner component.
|
|
34
|
+
* @element c4d-promo-banner
|
|
35
|
+
*/
|
|
36
|
+
let C4DPromoBanner = _decorate([customElement(`${c4dPrefix}-promo-banner`)], function (_initialize, _CTAMixin) {
|
|
37
|
+
class C4DPromoBanner extends _CTAMixin {
|
|
38
|
+
constructor(...args) {
|
|
39
|
+
super(...args);
|
|
40
|
+
_initialize(this);
|
|
41
|
+
}
|
|
42
|
+
}
|
|
43
|
+
return {
|
|
44
|
+
F: C4DPromoBanner,
|
|
45
|
+
d: [{
|
|
46
|
+
kind: "field",
|
|
47
|
+
decorators: [state()],
|
|
48
|
+
key: "isDesktopVersion",
|
|
49
|
+
value() {
|
|
50
|
+
return layoutBreakpoint.matches;
|
|
51
|
+
}
|
|
52
|
+
}, {
|
|
53
|
+
kind: "field",
|
|
54
|
+
decorators: [queryAssignedNodes('image', false)],
|
|
55
|
+
key: "slottedImage",
|
|
56
|
+
value: void 0
|
|
57
|
+
}, {
|
|
58
|
+
kind: "field",
|
|
59
|
+
decorators: [queryAssignedNodes('cta', false)],
|
|
60
|
+
key: "slottedCta",
|
|
61
|
+
value: void 0
|
|
62
|
+
}, {
|
|
63
|
+
kind: "method",
|
|
64
|
+
key: "handleSlotChange",
|
|
65
|
+
value: function handleSlotChange(e) {
|
|
66
|
+
var _e$target$name, _e$target;
|
|
67
|
+
this.requestUpdate();
|
|
68
|
+
const slotname = (_e$target$name = e === null || e === void 0 || (_e$target = e.target) === null || _e$target === void 0 ? void 0 : _e$target.name) !== null && _e$target$name !== void 0 ? _e$target$name : '';
|
|
69
|
+
if (slotname === 'cta') {
|
|
70
|
+
this.harvestCtaProps();
|
|
71
|
+
}
|
|
72
|
+
}
|
|
73
|
+
}, {
|
|
74
|
+
kind: "method",
|
|
75
|
+
key: "firstUpdated",
|
|
76
|
+
value: function firstUpdated() {
|
|
77
|
+
layoutBreakpoint.addEventListener('change', e => {
|
|
78
|
+
this.isDesktopVersion = e.matches;
|
|
79
|
+
});
|
|
80
|
+
this.harvestCtaProps();
|
|
81
|
+
}
|
|
82
|
+
}, {
|
|
83
|
+
kind: "method",
|
|
84
|
+
key: "harvestCtaProps",
|
|
85
|
+
value: function harvestCtaProps() {
|
|
86
|
+
const slotted_cta = this.querySelector('[slot="cta"]');
|
|
87
|
+
if (slotted_cta) {
|
|
88
|
+
const {
|
|
89
|
+
_linkNode,
|
|
90
|
+
ctaType,
|
|
91
|
+
disabled,
|
|
92
|
+
download,
|
|
93
|
+
href,
|
|
94
|
+
target
|
|
95
|
+
} = slotted_cta;
|
|
96
|
+
this._linkNode = _linkNode;
|
|
97
|
+
this.ctaType = ctaType;
|
|
98
|
+
this.disabled = disabled;
|
|
99
|
+
this.download = download;
|
|
100
|
+
this.href = href;
|
|
101
|
+
this.target = target;
|
|
102
|
+
this.requestUpdate();
|
|
103
|
+
return;
|
|
104
|
+
}
|
|
105
|
+
this._linkNode = undefined;
|
|
106
|
+
this.ctaType = '';
|
|
107
|
+
this.disabled = false;
|
|
108
|
+
this.download = '';
|
|
109
|
+
this.href = '';
|
|
110
|
+
this.target = '';
|
|
111
|
+
this.requestUpdate();
|
|
112
|
+
}
|
|
113
|
+
|
|
114
|
+
/**
|
|
115
|
+
* @inheritdoc
|
|
116
|
+
*/
|
|
117
|
+
}, {
|
|
118
|
+
kind: "method",
|
|
119
|
+
key: "_renderIcon",
|
|
120
|
+
value: function _renderIcon() {
|
|
121
|
+
var _ctaIcons$ctaType;
|
|
122
|
+
const {
|
|
123
|
+
ctaType
|
|
124
|
+
} = this;
|
|
125
|
+
return html(_t || (_t = _`
|
|
126
|
+
<slot name="icon">
|
|
127
|
+
${0}
|
|
128
|
+
</slot>
|
|
129
|
+
`), (_ctaIcons$ctaType = ctaIcons[ctaType]) === null || _ctaIcons$ctaType === void 0 ? void 0 : _ctaIcons$ctaType.call(ctaIcons, {
|
|
130
|
+
class: `${prefix}--card__cta ${c4dPrefix}-ce--cta__icon`
|
|
131
|
+
}));
|
|
132
|
+
}
|
|
133
|
+
}, {
|
|
134
|
+
kind: "method",
|
|
135
|
+
key: "_renderMobileLayout",
|
|
136
|
+
value: function _renderMobileLayout() {
|
|
137
|
+
const {
|
|
138
|
+
href,
|
|
139
|
+
disabled,
|
|
140
|
+
target,
|
|
141
|
+
download,
|
|
142
|
+
innerText
|
|
143
|
+
} = this;
|
|
144
|
+
const classes = {
|
|
145
|
+
'banner-wrapper': true,
|
|
146
|
+
'no-cta': !href
|
|
147
|
+
};
|
|
148
|
+
return html(_t2 || (_t2 = _`
|
|
149
|
+
<div class="${0}" part="wrapper">
|
|
150
|
+
<div class="banner-content" aria-hidden=${0} part="content">
|
|
151
|
+
<slot></slot>
|
|
152
|
+
</div>
|
|
153
|
+
${0}
|
|
154
|
+
</div>
|
|
155
|
+
`), classMap(classes), true, href ? html(_t3 || (_t3 = _`
|
|
156
|
+
<a
|
|
157
|
+
class="banner-cta"
|
|
158
|
+
href=${0}
|
|
159
|
+
?disabled=${0}
|
|
160
|
+
target=${0}
|
|
161
|
+
download=${0}
|
|
162
|
+
aria-label=${0}
|
|
163
|
+
part="cta">
|
|
164
|
+
<span class="banner-cta-icon" part="icon">
|
|
165
|
+
${0}
|
|
166
|
+
</span>
|
|
167
|
+
</a>
|
|
168
|
+
`), href, ifNonEmpty(disabled), ifNonEmpty(target), ifNonEmpty(download), innerText, this._renderIcon()) : '');
|
|
169
|
+
}
|
|
170
|
+
}, {
|
|
171
|
+
kind: "method",
|
|
172
|
+
key: "_renderDesktopLayout",
|
|
173
|
+
value: function _renderDesktopLayout() {
|
|
174
|
+
const {
|
|
175
|
+
slottedImage,
|
|
176
|
+
slottedCta,
|
|
177
|
+
handleSlotChange
|
|
178
|
+
} = this;
|
|
179
|
+
return html(_t4 || (_t4 = _`
|
|
180
|
+
<div
|
|
181
|
+
class="banner-wrapper"
|
|
182
|
+
@slotchange=${0}
|
|
183
|
+
part="wrapper">
|
|
184
|
+
<div class="banner-image" ?hidden=${0} part="image">
|
|
185
|
+
<slot name="image"></slot>
|
|
186
|
+
</div>
|
|
187
|
+
<div class="banner-content" part="content">
|
|
188
|
+
<slot></slot>
|
|
189
|
+
</div>
|
|
190
|
+
<div class="banner-cta" ?hidden=${0} part="cta">
|
|
191
|
+
<slot name="cta"></slot>
|
|
192
|
+
</div>
|
|
193
|
+
</div>
|
|
194
|
+
`), handleSlotChange, !(slottedImage !== null && slottedImage !== void 0 && slottedImage.length), !(slottedCta !== null && slottedCta !== void 0 && slottedCta.length));
|
|
195
|
+
}
|
|
196
|
+
}, {
|
|
197
|
+
kind: "method",
|
|
198
|
+
key: "render",
|
|
199
|
+
value: function render() {
|
|
200
|
+
const {
|
|
201
|
+
isDesktopVersion
|
|
202
|
+
} = this;
|
|
203
|
+
return isDesktopVersion ? this._renderDesktopLayout() : this._renderMobileLayout();
|
|
204
|
+
}
|
|
205
|
+
}, {
|
|
206
|
+
kind: "get",
|
|
207
|
+
static: true,
|
|
208
|
+
key: "styles",
|
|
209
|
+
value: function () {
|
|
210
|
+
return styles;
|
|
211
|
+
}
|
|
212
|
+
}]
|
|
213
|
+
};
|
|
214
|
+
}, CTAMixin(LitElement));
|
|
215
|
+
export default C4DPromoBanner;
|
|
216
|
+
//# sourceMappingURL=promo-banner.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"promo-banner.js","names":["LitElement","html","state","queryAssignedNodes","classMap","carbonElement","customElement","baseFontSize","breakpoints","styles","settings","CTAMixin","icons","ctaIcons","ifNonEmpty","stablePrefix","c4dPrefix","prefix","breakpoint","parseFloat","lg","width","layoutBreakpoint","window","matchMedia","C4DPromoBanner","_decorate","_initialize","_CTAMixin","constructor","args","F","d","kind","decorators","key","value","matches","handleSlotChange","e","_e$target$name","_e$target","requestUpdate","slotname","target","name","harvestCtaProps","firstUpdated","addEventListener","isDesktopVersion","slotted_cta","querySelector","_linkNode","ctaType","disabled","download","href","undefined","_renderIcon","_ctaIcons$ctaType","_t","_","call","class","_renderMobileLayout","innerText","classes","_t2","_t3","_renderDesktopLayout","slottedImage","slottedCta","_t4","length","render","static"],"sources":["components/promo-banner/promo-banner.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2024\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { LitElement, html } from 'lit';\nimport { state, queryAssignedNodes } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { carbonElement as customElement } from '@carbon/web-components/es/globals/decorators/carbon-element.js';\nimport { baseFontSize, breakpoints } from '@carbon/layout';\nimport styles from './promo-banner.scss';\nimport settings from '@carbon/ibmdotcom-utilities/es/utilities/settings/settings.js';\nimport CTAMixin, {\n icons as ctaIcons,\n CTAMixinImpl,\n} from '../../component-mixins/cta/cta';\nimport ifNonEmpty from '@carbon/web-components/es/globals/directives/if-non-empty';\nimport { CTA_TYPE } from '../cta/defs';\n\nconst { stablePrefix: c4dPrefix, prefix } = settings;\n\nconst breakpoint = parseFloat(breakpoints.lg.width) * baseFontSize;\nconst layoutBreakpoint = window.matchMedia(`(min-width: ${breakpoint}px)`);\n\n/**\n * The Promo Banner component.\n * @element c4d-promo-banner\n */\n@customElement(`${c4dPrefix}-promo-banner`)\nclass C4DPromoBanner extends CTAMixin(LitElement) {\n @state()\n isDesktopVersion = layoutBreakpoint.matches;\n\n @queryAssignedNodes('image', false)\n slottedImage;\n\n @queryAssignedNodes('cta', false)\n slottedCta;\n\n handleSlotChange(e) {\n this.requestUpdate();\n\n const slotname = e?.target?.name ?? '';\n\n if (slotname === 'cta') {\n this.harvestCtaProps();\n }\n }\n\n firstUpdated() {\n layoutBreakpoint.addEventListener('change', (e) => {\n this.isDesktopVersion = e.matches;\n });\n this.harvestCtaProps();\n }\n\n harvestCtaProps() {\n const slotted_cta = this.querySelector('[slot=\"cta\"]');\n\n if (slotted_cta) {\n const { _linkNode, ctaType, disabled, download, href, target } =\n slotted_cta as CTAMixinImpl;\n\n this._linkNode = _linkNode;\n this.ctaType = ctaType;\n this.disabled = disabled;\n this.download = download;\n this.href = href;\n this.target = target;\n this.requestUpdate();\n return;\n }\n\n this._linkNode = undefined;\n this.ctaType = '' as CTA_TYPE;\n this.disabled = false;\n this.download = '';\n this.href = '';\n this.target = '';\n this.requestUpdate();\n }\n\n /**\n * @inheritdoc\n */\n _renderIcon() {\n const { ctaType } = this;\n return html`\n <slot name=\"icon\">\n ${ctaIcons[ctaType]?.({\n class: `${prefix}--card__cta ${c4dPrefix}-ce--cta__icon`,\n })}\n </slot>\n `;\n }\n\n _renderMobileLayout() {\n const { href, disabled, target, download, innerText } = this;\n\n const classes = {\n 'banner-wrapper': true,\n 'no-cta': !href,\n };\n\n return html`\n <div class=\"${classMap(classes)}\" part=\"wrapper\">\n <div class=\"banner-content\" aria-hidden=${true} part=\"content\">\n <slot></slot>\n </div>\n ${href\n ? html`\n <a\n class=\"banner-cta\"\n href=${href}\n ?disabled=${ifNonEmpty(disabled)}\n target=${ifNonEmpty(target)}\n download=${ifNonEmpty(download)}\n aria-label=${innerText}\n part=\"cta\">\n <span class=\"banner-cta-icon\" part=\"icon\">\n ${this._renderIcon()}\n </span>\n </a>\n `\n : ''}\n </div>\n `;\n }\n\n _renderDesktopLayout() {\n const { slottedImage, slottedCta, handleSlotChange } = this;\n return html`\n <div\n class=\"banner-wrapper\"\n @slotchange=${handleSlotChange}\n part=\"wrapper\">\n <div class=\"banner-image\" ?hidden=${!slottedImage?.length} part=\"image\">\n <slot name=\"image\"></slot>\n </div>\n <div class=\"banner-content\" part=\"content\">\n <slot></slot>\n </div>\n <div class=\"banner-cta\" ?hidden=${!slottedCta?.length} part=\"cta\">\n <slot name=\"cta\"></slot>\n </div>\n </div>\n `;\n }\n\n render() {\n const { isDesktopVersion } = this;\n\n return isDesktopVersion\n ? this._renderDesktopLayout()\n : this._renderMobileLayout();\n }\n\n static get styles() {\n return styles;\n }\n}\n\nexport default C4DPromoBanner;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
*
|
|
4
|
+
* Copyright IBM Corp. 2020, 2024
|
|
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 './star-rating';
|
|
10
|
+
|
|
11
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
*
|
|
4
|
+
* Copyright IBM Corp. 2020, 2024
|
|
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
|
+
* @license
|
|
10
|
+
*
|
|
11
|
+
* Copyright IBM Corp. 2020, 2024
|
|
12
|
+
*
|
|
13
|
+
* This source code is licensed under the Apache-2.0 license found in the
|
|
14
|
+
* LICENSE file in the root directory of this source tree.
|
|
15
|
+
*/
|
|
16
|
+
|
|
17
|
+
import "./star-rating.js";
|
|
18
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["components/star-rating/index.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2020, 2024\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport './star-rating';\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,GAPA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,OAAO,kBAAe","ignoreList":[]}
|