@vaadin/card 24.7.0-alpha6 → 24.7.0-alpha8
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/package.json +8 -7
- package/src/vaadin-card.d.ts +29 -3
- package/web-types.json +1 -1
- package/web-types.lit.json +1 -1
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@vaadin/card",
|
|
3
|
-
"version": "24.7.0-
|
|
3
|
+
"version": "24.7.0-alpha8",
|
|
4
4
|
"publishConfig": {
|
|
5
5
|
"access": "public"
|
|
6
6
|
},
|
|
@@ -34,14 +34,15 @@
|
|
|
34
34
|
"web-component"
|
|
35
35
|
],
|
|
36
36
|
"dependencies": {
|
|
37
|
-
"@vaadin/component-base": "24.7.0-
|
|
38
|
-
"@vaadin/vaadin-lumo-styles": "24.7.0-
|
|
39
|
-
"@vaadin/vaadin-material-styles": "24.7.0-
|
|
40
|
-
"@vaadin/vaadin-themable-mixin": "24.7.0-
|
|
37
|
+
"@vaadin/component-base": "24.7.0-alpha8",
|
|
38
|
+
"@vaadin/vaadin-lumo-styles": "24.7.0-alpha8",
|
|
39
|
+
"@vaadin/vaadin-material-styles": "24.7.0-alpha8",
|
|
40
|
+
"@vaadin/vaadin-themable-mixin": "24.7.0-alpha8",
|
|
41
41
|
"lit": "^3.0.0"
|
|
42
42
|
},
|
|
43
43
|
"devDependencies": {
|
|
44
|
-
"@vaadin/chai-plugins": "24.7.0-
|
|
44
|
+
"@vaadin/chai-plugins": "24.7.0-alpha8",
|
|
45
|
+
"@vaadin/test-runner-commands": "24.7.0-alpha8",
|
|
45
46
|
"@vaadin/testing-helpers": "^1.1.0",
|
|
46
47
|
"sinon": "^18.0.0"
|
|
47
48
|
},
|
|
@@ -49,5 +50,5 @@
|
|
|
49
50
|
"web-types.json",
|
|
50
51
|
"web-types.lit.json"
|
|
51
52
|
],
|
|
52
|
-
"gitHead": "
|
|
53
|
+
"gitHead": "d015035192480fcc8cc9df5d00a950f177b83c32"
|
|
53
54
|
}
|
package/src/vaadin-card.d.ts
CHANGED
|
@@ -7,13 +7,39 @@ import { ElementMixin } from '@vaadin/component-base/src/element-mixin.js';
|
|
|
7
7
|
import { ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';
|
|
8
8
|
|
|
9
9
|
/**
|
|
10
|
-
* `<vaadin-card>` is a
|
|
10
|
+
* `<vaadin-card>` is a versatile container for grouping related content and actions.
|
|
11
|
+
* It presents information in a structured and visually appealing manner, with
|
|
12
|
+
* customization options to fit various design requirements.
|
|
11
13
|
*
|
|
12
14
|
* ```html
|
|
13
|
-
* <vaadin-card>
|
|
14
|
-
* <
|
|
15
|
+
* <vaadin-card theme="outlined cover-media">
|
|
16
|
+
* <img slot="media" width="200" src="..." alt="">
|
|
17
|
+
* <div slot="title">Lapland</div>
|
|
18
|
+
* <div slot="subtitle">The Exotic North</div>
|
|
19
|
+
* <div>Lapland is the northern-most region of Finland and an active outdoor destination.</div>
|
|
20
|
+
* <vaadin-button slot="footer">Book Vacation</vaadin-button>
|
|
15
21
|
* </vaadin-card>
|
|
16
22
|
* ```
|
|
23
|
+
*
|
|
24
|
+
* ### Styling
|
|
25
|
+
*
|
|
26
|
+
* The following shadow DOM parts are available for styling:
|
|
27
|
+
*
|
|
28
|
+
* Part name | Description
|
|
29
|
+
* ----------|-------------
|
|
30
|
+
* `media` | The container for the media element (e.g., image, video, icon). Shown above of before the card content.
|
|
31
|
+
* `header` | The container for title and subtitle - or for custom header content - and header prefix and suffix elements.
|
|
32
|
+
* `content` | The container for the card content (usually text content).
|
|
33
|
+
* `footer` | The container for footer elements. This part is always at the bottom of the card.
|
|
34
|
+
*
|
|
35
|
+
* The following custom properties are available for styling:
|
|
36
|
+
*
|
|
37
|
+
* Custom property | Description | Default
|
|
38
|
+
* ----------------|-------------|-------------
|
|
39
|
+
* `--vaadin-card-padding` | The space between the card edge and its content. Needs to a unified value for all edges, i.e., a single length value. | `1em`
|
|
40
|
+
* `--vaadin-card-gap` | The space between content elements within the card. | `1em`
|
|
41
|
+
*
|
|
42
|
+
* See [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.
|
|
17
43
|
*/
|
|
18
44
|
declare class Card extends ElementMixin(ThemableMixin(HTMLElement)) {}
|
|
19
45
|
|
package/web-types.json
CHANGED