@carbon/ibm-products-web-components 0.10.0-rc.0 → 0.11.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 +250 -0
- package/es/components/about-modal/about-modal.d.ts +392 -0
- package/es/components/about-modal/about-modal.js +143 -0
- package/es/components/about-modal/about-modal.js.map +1 -0
- package/es/components/about-modal/about-modal.scss.js +13 -0
- package/es/components/about-modal/about-modal.scss.js.map +1 -0
- package/es/components/about-modal/about-modal.test.d.ts +7 -0
- package/es/components/about-modal/about-modal.test.js +87 -0
- package/es/components/about-modal/about-modal.test.js.map +1 -0
- package/es/components/about-modal/defs.d.ts +8 -0
- package/es/components/about-modal/defs.js +8 -0
- package/es/components/about-modal/defs.js.map +1 -0
- package/es/components/about-modal/index.d.ts +9 -0
- package/es/components/about-modal/index.js +9 -0
- package/es/components/about-modal/index.js.map +1 -0
- package/es/components/side-panel/side-panel.js +64 -63
- 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/side-panel/side-panel.test.js +2 -3
- package/es/components/side-panel/side-panel.test.js.map +1 -1
- package/es/components/tearsheet/tearsheet.js +37 -37
- package/es/components/tearsheet/tearsheet.js.map +1 -1
- package/es/components/tearsheet/tearsheet.scss.js +1 -1
- package/es/components/tearsheet/tearsheet.test.js +2 -3
- package/es/components/tearsheet/tearsheet.test.js.map +1 -1
- package/es/components/user-avatar/user-avatar.d.ts +5 -0
- package/es/components/user-avatar/user-avatar.js +21 -19
- package/es/components/user-avatar/user-avatar.js.map +1 -1
- package/es/components/user-avatar/user-avatar.scss.js +1 -1
- package/es/index.d.ts +1 -0
- package/es/index.js +1 -0
- package/es/index.js.map +1 -1
- package/es/package.json.js +1 -1
- package/lib/components/about-modal/about-modal.d.ts +392 -0
- package/lib/components/about-modal/about-modal.test.d.ts +7 -0
- package/lib/components/about-modal/defs.d.ts +8 -0
- package/lib/components/about-modal/defs.js +10 -0
- package/lib/components/about-modal/defs.js.map +1 -0
- package/lib/components/about-modal/index.d.ts +9 -0
- package/lib/components/user-avatar/user-avatar.d.ts +5 -0
- package/lib/index.d.ts +1 -0
- package/package.json +14 -12
- package/scss/components/about-modal/about-modal.scss +117 -0
- package/scss/components/about-modal/story-styles.scss +34 -0
- package/scss/components/user-avatar/user-avatar.scss +17 -0
@@ -0,0 +1,143 @@
|
|
1
|
+
/**
|
2
|
+
* Copyright IBM Corp. 2024
|
3
|
+
*
|
4
|
+
* This source code is licensed under the Apache-2.0 license found in the
|
5
|
+
* LICENSE file in the root directory of this source tree.
|
6
|
+
*/
|
7
|
+
|
8
|
+
import { __decorate } from 'tslib';
|
9
|
+
import { LitElement, html } from 'lit';
|
10
|
+
import { property, state, query } from 'lit/decorators.js';
|
11
|
+
import { prefix } from '../../globals/settings.js';
|
12
|
+
import HostListenerMixin from '@carbon/web-components/es/globals/mixins/host-listener.js';
|
13
|
+
import '@carbon/web-components/es/components/modal/index.js';
|
14
|
+
import styles from './about-modal.scss.js';
|
15
|
+
import { carbonElement } from '@carbon/web-components/es/globals/decorators/carbon-element.js';
|
16
|
+
|
17
|
+
/**
|
18
|
+
* @license
|
19
|
+
*
|
20
|
+
* Copyright IBM Corp. 2025
|
21
|
+
*
|
22
|
+
* This source code is licensed under the Apache-2.0 license found in the
|
23
|
+
* LICENSE file in the root directory of this source tree.
|
24
|
+
*/
|
25
|
+
const blockClass = `${prefix}--about-modal`;
|
26
|
+
/**
|
27
|
+
* About Modal.
|
28
|
+
*
|
29
|
+
* @element c4p-about-modal
|
30
|
+
* @csspart dialog The dialog.
|
31
|
+
* @fires c4p-about-modal-beingclosed
|
32
|
+
* The custom event fired before this about modal is being closed upon a user gesture.
|
33
|
+
* Cancellation of this event stops the user-initiated action of closing this about modal.
|
34
|
+
* @fires c4p-about-modal-closed - The custom event fired after this about modal is closed upon a user gesture.
|
35
|
+
*/
|
36
|
+
let CDSAboutModal = class CDSAboutModal extends HostListenerMixin(LitElement) {
|
37
|
+
constructor() {
|
38
|
+
super(...arguments);
|
39
|
+
/**
|
40
|
+
* Determines if About Modal is open or not.
|
41
|
+
*/
|
42
|
+
this.open = true;
|
43
|
+
/**
|
44
|
+
* Determines if About Modal is open or not.
|
45
|
+
*/
|
46
|
+
this.closeIconDescription = 'close';
|
47
|
+
/**
|
48
|
+
* To check if the modal body is overflowing or not.
|
49
|
+
*/
|
50
|
+
this.isOverflowing = false;
|
51
|
+
this._handleClose = () => {
|
52
|
+
this.open = false;
|
53
|
+
};
|
54
|
+
}
|
55
|
+
firstUpdated() {
|
56
|
+
this._checkOverflow();
|
57
|
+
}
|
58
|
+
updated() {
|
59
|
+
this._checkOverflow();
|
60
|
+
}
|
61
|
+
render() {
|
62
|
+
const { open, closeIconDescription, _handleClose: handleClose, logo, title, version, additionalInfo, content, links, copyrightText, } = this;
|
63
|
+
return html `
|
64
|
+
<cds-modal ?open=${open}>
|
65
|
+
<div class=${`${blockClass}__logo`}>${logo}</div>
|
66
|
+
<cds-modal-header>
|
67
|
+
<cds-modal-close-button
|
68
|
+
@click=${handleClose}
|
69
|
+
close-button-label=${closeIconDescription}
|
70
|
+
></cds-modal-close-button>
|
71
|
+
<cds-modal-heading>${title}</cds-modal-heading>
|
72
|
+
</cds-modal-header>
|
73
|
+
<cds-modal-body
|
74
|
+
class="${this.isOverflowing ? `${blockClass}-scroll-content` : ''}"
|
75
|
+
>
|
76
|
+
<div class=${`${blockClass}__body-content`}>
|
77
|
+
<div class=${`${blockClass}__version`}>${version}</div>
|
78
|
+
${links &&
|
79
|
+
links.length > 0 &&
|
80
|
+
html ` <div class=${`${blockClass}__links-container`}>
|
81
|
+
${links.map((link) => link)}
|
82
|
+
</div>`}
|
83
|
+
${content &&
|
84
|
+
html `<p class=${`${blockClass}__content`}>${content}</p>`}
|
85
|
+
${copyrightText &&
|
86
|
+
html `
|
87
|
+
<p class=${`${blockClass}__copyright-text`}>${copyrightText}</p>
|
88
|
+
`}
|
89
|
+
</div>
|
90
|
+
</cds-modal-body>
|
91
|
+
${additionalInfo &&
|
92
|
+
html ` <cds-modal-footer> ${additionalInfo} </cds-modal-footer> `}
|
93
|
+
</cds-modal>
|
94
|
+
`;
|
95
|
+
}
|
96
|
+
_checkOverflow() {
|
97
|
+
if (this.container) {
|
98
|
+
this.isOverflowing =
|
99
|
+
this.container.scrollHeight > this.container.clientHeight;
|
100
|
+
}
|
101
|
+
}
|
102
|
+
};
|
103
|
+
CDSAboutModal.styles = styles; // `styles` here is a `CSSResult` generated by custom WebPack loader
|
104
|
+
__decorate([
|
105
|
+
property({ reflect: true, type: Boolean })
|
106
|
+
], CDSAboutModal.prototype, "open", void 0);
|
107
|
+
__decorate([
|
108
|
+
property({ type: String })
|
109
|
+
], CDSAboutModal.prototype, "closeIconDescription", void 0);
|
110
|
+
__decorate([
|
111
|
+
property({ type: String })
|
112
|
+
], CDSAboutModal.prototype, "copyrightText", void 0);
|
113
|
+
__decorate([
|
114
|
+
property()
|
115
|
+
], CDSAboutModal.prototype, "logo", void 0);
|
116
|
+
__decorate([
|
117
|
+
property({ type: String })
|
118
|
+
], CDSAboutModal.prototype, "version", void 0);
|
119
|
+
__decorate([
|
120
|
+
property()
|
121
|
+
], CDSAboutModal.prototype, "title", void 0);
|
122
|
+
__decorate([
|
123
|
+
property()
|
124
|
+
], CDSAboutModal.prototype, "additionalInfo", void 0);
|
125
|
+
__decorate([
|
126
|
+
property()
|
127
|
+
], CDSAboutModal.prototype, "content", void 0);
|
128
|
+
__decorate([
|
129
|
+
property()
|
130
|
+
], CDSAboutModal.prototype, "links", void 0);
|
131
|
+
__decorate([
|
132
|
+
state()
|
133
|
+
], CDSAboutModal.prototype, "isOverflowing", void 0);
|
134
|
+
__decorate([
|
135
|
+
query('cds-modal-body')
|
136
|
+
], CDSAboutModal.prototype, "container", void 0);
|
137
|
+
CDSAboutModal = __decorate([
|
138
|
+
carbonElement(`${prefix}-about-modal`)
|
139
|
+
], CDSAboutModal);
|
140
|
+
var CDSAboutModal$1 = CDSAboutModal;
|
141
|
+
|
142
|
+
export { CDSAboutModal$1 as default };
|
143
|
+
//# sourceMappingURL=about-modal.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"about-modal.js","sources":["../../../src/components/about-modal/about-modal.ts"],"sourcesContent":[null],"names":["customElement"],"mappings":"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"}
|