@jumpgroup/jump-design-system 0.2.6 → 0.2.7
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/dist/cjs/jump-badge.cjs.entry.js +1 -1
- package/dist/cjs/jump-badge.cjs.entry.js.map +1 -1
- package/dist/cjs/jump-button.cjs.entry.js +1 -1
- package/dist/cjs/jump-button.cjs.entry.js.map +1 -1
- package/dist/cjs/jump-card.cjs.entry.js +1 -1
- package/dist/cjs/jump-card.cjs.entry.js.map +1 -1
- package/dist/cjs/jump-design-system.cjs.js +1 -1
- package/dist/cjs/jump-icon.cjs.entry.js +3 -2
- package/dist/cjs/jump-icon.cjs.entry.js.map +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/components/jump-badge/jump-badge.css +1 -0
- package/dist/collection/components/jump-button/jump-button.css +1 -4
- package/dist/collection/components/jump-card/jump-card.css +0 -49
- package/dist/collection/components/jump-icon/jump-icon.css +18 -4
- package/dist/collection/components/jump-icon/jump-icon.js +19 -1
- package/dist/collection/components/jump-icon/jump-icon.js.map +1 -1
- package/dist/collection/components/jump-icon/jump-icon.stories.js +14 -4
- package/dist/collection/components/jump-icon/jump-icon.stories.js.map +1 -1
- package/dist/components/jump-badge.js +1 -1
- package/dist/components/jump-badge.js.map +1 -1
- package/dist/components/jump-button.js +1 -1
- package/dist/components/jump-button.js.map +1 -1
- package/dist/components/jump-card.js +1 -1
- package/dist/components/jump-card.js.map +1 -1
- package/dist/components/jump-icon2.js +5 -3
- package/dist/components/jump-icon2.js.map +1 -1
- package/dist/esm/jump-badge.entry.js +1 -1
- package/dist/esm/jump-badge.entry.js.map +1 -1
- package/dist/esm/jump-button.entry.js +1 -1
- package/dist/esm/jump-button.entry.js.map +1 -1
- package/dist/esm/jump-card.entry.js +1 -1
- package/dist/esm/jump-card.entry.js.map +1 -1
- package/dist/esm/jump-design-system.js +1 -1
- package/dist/esm/jump-icon.entry.js +3 -2
- package/dist/esm/jump-icon.entry.js.map +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/jump-design-system/jump-design-system.esm.js +1 -1
- package/dist/jump-design-system/jump-design-system.esm.js.map +1 -1
- package/dist/jump-design-system/p-02914b1e.entry.js +2 -0
- package/dist/jump-design-system/p-02914b1e.entry.js.map +1 -0
- package/dist/jump-design-system/p-e69ee35f.entry.js +2 -0
- package/dist/jump-design-system/p-e69ee35f.entry.js.map +1 -0
- package/dist/jump-design-system/p-ed65e359.entry.js +2 -0
- package/dist/jump-design-system/p-ed65e359.entry.js.map +1 -0
- package/dist/jump-design-system/{p-36c7c94d.entry.js → p-fa148b53.entry.js} +57 -57
- package/dist/jump-design-system/{p-36c7c94d.entry.js.map → p-fa148b53.entry.js.map} +1 -1
- package/dist/jump-design-system-elements.json +4 -0
- package/dist/types/components/jump-icon/jump-icon.d.ts +4 -0
- package/dist/types/components/jump-icon/jump-icon.stories.d.ts +3 -1
- package/dist/types/components.d.ts +8 -0
- package/package.json +1 -1
- package/dist/jump-design-system/p-700b96b4.entry.js +0 -2
- package/dist/jump-design-system/p-700b96b4.entry.js.map +0 -1
- package/dist/jump-design-system/p-9ad27c08.entry.js +0 -2
- package/dist/jump-design-system/p-9ad27c08.entry.js.map +0 -1
- package/dist/jump-design-system/p-c8244738.entry.js +0 -2
- package/dist/jump-design-system/p-c8244738.entry.js.map +0 -1
package/dist/cjs/loader.cjs.js
CHANGED
|
@@ -8,7 +8,7 @@ const appGlobals = require('./app-globals-3a1e7e63.js');
|
|
|
8
8
|
const defineCustomElements = async (win, options) => {
|
|
9
9
|
if (typeof window === 'undefined') return undefined;
|
|
10
10
|
await appGlobals.globalScripts();
|
|
11
|
-
return index.bootstrapLazy([["jump-pagination.cjs",[[0,"jump-pagination",{"pagLabel":[1,"pag-label"],"last":[2],"showFirstAndLast":[4,"show-first-and-last"],"current":[32]},null,{"current":["watchcurrent"]}]]],["jump-pagination-table.cjs",[[0,"jump-pagination-table",{"elementsRanges":[16],"elPerPage":[2,"el-per-page"],"pagLabel":[513,"pag-label"],"labelElementsPerPage":[513,"label-elements-per-page"],"total":[514],"first":[514],"last":[514],"showFirstAndLast":[516,"show-first-and-last"]},null,{"elPerPage":["elPerPageChanged"]}]]],["jump-badge.cjs",[[0,"jump-badge",{"label":[1],"variant":[1]}]]],["jump-button.cjs",[[1,"jump-button",{"disabled":[4],"variant":[1],"outline":[4],"size":[1],"full":[4],"pill":[4],"text":[4],"onlyIcon":[4,"only-icon"],"href":[1],"target":[1],"type":[1],"name":[1],"value":[1],"ariaLabel":[1,"aria-label"],"class":[1],"buttonId":[1,"button-id"]}]]],["jump-card.cjs",[[4,"jump-card",{"horizontal":[4],"dark":[4],"shadow":[4],"border":[4],"borderRadius":[4,"border-radius"],"topBorderContentRadius":[4,"top-border-content-radius"],"boxed":[4],"roundedMedia":[4,"rounded-media"],"imgSrc":[1,"img-src"],"imgAlt":[1,"img-alt"],"videoSrc":[1,"video-src"]}]]],["jump-tab.cjs",[[1,"jump-tab",{"activeTab":[1,"active-tab"],"tabNames":[16]}]]],["jump-icon.cjs",[[0,"jump-icon",{"name":[1],"class":[1]}]]]], options);
|
|
11
|
+
return index.bootstrapLazy([["jump-pagination.cjs",[[0,"jump-pagination",{"pagLabel":[1,"pag-label"],"last":[2],"showFirstAndLast":[4,"show-first-and-last"],"current":[32]},null,{"current":["watchcurrent"]}]]],["jump-pagination-table.cjs",[[0,"jump-pagination-table",{"elementsRanges":[16],"elPerPage":[2,"el-per-page"],"pagLabel":[513,"pag-label"],"labelElementsPerPage":[513,"label-elements-per-page"],"total":[514],"first":[514],"last":[514],"showFirstAndLast":[516,"show-first-and-last"]},null,{"elPerPage":["elPerPageChanged"]}]]],["jump-badge.cjs",[[0,"jump-badge",{"label":[1],"variant":[1]}]]],["jump-button.cjs",[[1,"jump-button",{"disabled":[4],"variant":[1],"outline":[4],"size":[1],"full":[4],"pill":[4],"text":[4],"onlyIcon":[4,"only-icon"],"href":[1],"target":[1],"type":[1],"name":[1],"value":[1],"ariaLabel":[1,"aria-label"],"class":[1],"buttonId":[1,"button-id"]}]]],["jump-card.cjs",[[4,"jump-card",{"horizontal":[4],"dark":[4],"shadow":[4],"border":[4],"borderRadius":[4,"border-radius"],"topBorderContentRadius":[4,"top-border-content-radius"],"boxed":[4],"roundedMedia":[4,"rounded-media"],"imgSrc":[1,"img-src"],"imgAlt":[1,"img-alt"],"videoSrc":[1,"video-src"]}]]],["jump-tab.cjs",[[1,"jump-tab",{"activeTab":[1,"active-tab"],"tabNames":[16]}]]],["jump-icon.cjs",[[0,"jump-icon",{"name":[1],"class":[1],"size":[1]}]]]], options);
|
|
12
12
|
};
|
|
13
13
|
|
|
14
14
|
exports.setNonce = index.setNonce;
|
|
@@ -35,7 +35,7 @@
|
|
|
35
35
|
font-family: var(--ff-primary, "Arial"), sans-serif;
|
|
36
36
|
font-weight: var(--fw-700, 700);
|
|
37
37
|
font-size: var(--fs-400, 1rem);
|
|
38
|
-
line-height:
|
|
38
|
+
line-height: 1;
|
|
39
39
|
align-items: center;
|
|
40
40
|
gap: var(--jump-button-gap, 0.5rem);
|
|
41
41
|
text-decoration: none;
|
|
@@ -87,19 +87,16 @@
|
|
|
87
87
|
:host button[data-size=small],
|
|
88
88
|
:host a[data-size=small] {
|
|
89
89
|
font-size: var(--fs-300, 0.875rem);
|
|
90
|
-
line-height: var(--lh-300, 1.2);
|
|
91
90
|
--jump-button-padding: 0.65rem 1rem;
|
|
92
91
|
}
|
|
93
92
|
:host button[data-size=medium],
|
|
94
93
|
:host a[data-size=medium] {
|
|
95
94
|
font-size: var(--fs-400, 1rem);
|
|
96
|
-
line-height: var(--lh-400, 1.3);
|
|
97
95
|
--jump-button-padding: 0.75rem 1.25rem;
|
|
98
96
|
}
|
|
99
97
|
:host button[data-size=large],
|
|
100
98
|
:host a[data-size=large] {
|
|
101
99
|
font-size: var(--fs-500, 1.125rem);
|
|
102
|
-
line-height: var(--lh-500, 1.4);
|
|
103
100
|
--jump-button-padding: 1rem 1.5rem;
|
|
104
101
|
}
|
|
105
102
|
:host button[data-outline],
|
|
@@ -1,52 +1,3 @@
|
|
|
1
|
-
:root {
|
|
2
|
-
/*BASE COLOR RULES*/
|
|
3
|
-
--neutral-grey-background: #eeeeee;
|
|
4
|
-
--neutral-grey-disabled: #cbcbcb;
|
|
5
|
-
--neutral-grey-primary: #282828;
|
|
6
|
-
--neutral-grey-secondary: #707070;
|
|
7
|
-
--neutral-white: #ffffff;
|
|
8
|
-
--primary-hard: #e75a50;
|
|
9
|
-
--primary-soft: #ffeae9;
|
|
10
|
-
--primary-standard: #fa7268;
|
|
11
|
-
--secondary-hard: #435171;
|
|
12
|
-
--secondary-soft: #dde3ed;
|
|
13
|
-
--secondary-standard: #5e79ba;
|
|
14
|
-
--status-danger-hard: #ba250a;
|
|
15
|
-
--status-danger-soft: #fdd3d1;
|
|
16
|
-
--status-danger-standard: #d72c0d;
|
|
17
|
-
--status-interaction-hard: #22559e;
|
|
18
|
-
--status-interaction-soft: #f2f7fe;
|
|
19
|
-
--status-interaction-standard: #2c6ecb;
|
|
20
|
-
--status-success-hard: #156048;
|
|
21
|
-
--status-success-soft: #f1f8f5;
|
|
22
|
-
--status-success-standard: #1d7f60;
|
|
23
|
-
--status-warning-hard: #987100;
|
|
24
|
-
--status-warning-soft: #fef5ea;
|
|
25
|
-
--status-warning-standard: #b98900;
|
|
26
|
-
/*TYPOGRAPHY RULES*/
|
|
27
|
-
--ff-primary: "Inter";
|
|
28
|
-
--ff-secondary: "Prompt";
|
|
29
|
-
--lh-300: 1.25rem;
|
|
30
|
-
--lh-400: 1.5rem;
|
|
31
|
-
--lh-500: 1.625rem;
|
|
32
|
-
--lh-600: 2rem;
|
|
33
|
-
--lh-700: 2.75rem;
|
|
34
|
-
--lh-800: 3.5rem;
|
|
35
|
-
--lh-850: 4.375rem;
|
|
36
|
-
--lh-900: 5.5rem;
|
|
37
|
-
--fs-300: 0.875rem;
|
|
38
|
-
--fs-400: 1rem;
|
|
39
|
-
--fs-500: 1.125rem;
|
|
40
|
-
--fs-600: 1.5rem;
|
|
41
|
-
--fs-700: 2.25rem;
|
|
42
|
-
--fs-800: 3rem;
|
|
43
|
-
--fs-850: 3.75rem;
|
|
44
|
-
--fs-900: 4.5rem;
|
|
45
|
-
--fw-300: 300;
|
|
46
|
-
--fw-400: 400;
|
|
47
|
-
--fw-900: 700;
|
|
48
|
-
}
|
|
49
|
-
|
|
50
1
|
jump-card {
|
|
51
2
|
display: flex;
|
|
52
3
|
flex-direction: column;
|
|
@@ -1,7 +1,21 @@
|
|
|
1
|
-
|
|
1
|
+
jump-icon {
|
|
2
2
|
display: inline-flex;
|
|
3
|
+
--jump-icon-width: var(--fs-400, 1rem);
|
|
4
|
+
--jump-icon-height: var(--fs-400, 1rem);
|
|
3
5
|
}
|
|
4
|
-
|
|
5
|
-
width:
|
|
6
|
-
height:
|
|
6
|
+
jump-icon svg {
|
|
7
|
+
width: var(--jump-icon-width);
|
|
8
|
+
height: var(--jump-icon-height);
|
|
9
|
+
}
|
|
10
|
+
jump-icon.small svg {
|
|
11
|
+
--jump-icon-width: var(--fs-400, 1rem);
|
|
12
|
+
--jump-icon-height: var(--fs-400, 1rem);
|
|
13
|
+
}
|
|
14
|
+
jump-icon.medium svg {
|
|
15
|
+
--jump-icon-width: var(--fs-500, 1.125rem);
|
|
16
|
+
--jump-icon-height: var(--fs-500, 1.125rem);
|
|
17
|
+
}
|
|
18
|
+
jump-icon.large svg {
|
|
19
|
+
--jump-icon-width: var(--fs-600, 1.5rem);
|
|
20
|
+
--jump-icon-height: var(--fs-600, 1.5rem);
|
|
7
21
|
}
|
|
@@ -4,12 +4,13 @@ export class JumpIcon {
|
|
|
4
4
|
constructor() {
|
|
5
5
|
this.name = undefined;
|
|
6
6
|
this.class = undefined;
|
|
7
|
+
this.size = undefined;
|
|
7
8
|
}
|
|
8
9
|
componentDidLoad() {
|
|
9
10
|
feather.replace();
|
|
10
11
|
}
|
|
11
12
|
render() {
|
|
12
|
-
return (h(Host, { key: '
|
|
13
|
+
return (h(Host, { key: '69247a6f3ad9817e9e768998277e5aa8dfceac73' }, h("i", { key: '92bd5adbe5e02ed7c272514a91d929975b1d93d3', "data-feather": this.name, class: this.class })));
|
|
13
14
|
}
|
|
14
15
|
static get is() { return "jump-icon"; }
|
|
15
16
|
static get originalStyleUrls() {
|
|
@@ -57,6 +58,23 @@ export class JumpIcon {
|
|
|
57
58
|
},
|
|
58
59
|
"attribute": "class",
|
|
59
60
|
"reflect": false
|
|
61
|
+
},
|
|
62
|
+
"size": {
|
|
63
|
+
"type": "string",
|
|
64
|
+
"mutable": false,
|
|
65
|
+
"complexType": {
|
|
66
|
+
"original": "string",
|
|
67
|
+
"resolved": "string",
|
|
68
|
+
"references": {}
|
|
69
|
+
},
|
|
70
|
+
"required": false,
|
|
71
|
+
"optional": false,
|
|
72
|
+
"docs": {
|
|
73
|
+
"tags": [],
|
|
74
|
+
"text": "Size of the icon"
|
|
75
|
+
},
|
|
76
|
+
"attribute": "size",
|
|
77
|
+
"reflect": false
|
|
60
78
|
}
|
|
61
79
|
};
|
|
62
80
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"jump-icon.js","sourceRoot":"","sources":["../../../src/components/jump-icon/jump-icon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AACzD,OAAO,OAAO,MAAM,eAAe,CAAC;AAOpC,MAAM,OAAO,QAAQ
|
|
1
|
+
{"version":3,"file":"jump-icon.js","sourceRoot":"","sources":["../../../src/components/jump-icon/jump-icon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AACzD,OAAO,OAAO,MAAM,eAAe,CAAC;AAOpC,MAAM,OAAO,QAAQ;;;;;;IAiBnB,gBAAgB;QACd,OAAO,CAAC,OAAO,EAAE,CAAC;IACpB,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,0EAAiB,IAAI,CAAC,IAAI,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,GAAM,CAC9C,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAEF","sourcesContent":["import { Component, Host, Prop, h } from '@stencil/core';\nimport feather from 'feather-icons';\n\n@Component({\n tag: 'jump-icon',\n styleUrl: 'jump-icon.scss',\n shadow: false,\n})\nexport class JumpIcon {\n /**\n * Name of the icon\n **/\n @Prop() name: string;\n\n /**\n * Additional classes\n **/\n @Prop() class: string;\n\n /**\n * Size of the icon\n **/\n @Prop() size: string;\n\n\n componentDidLoad() {\n feather.replace();\n }\n\n render() {\n return (\n <Host>\n <i data-feather={this.name} class={this.class}></i>\n </Host>\n );\n }\n\n}\n"]}
|
|
@@ -13,13 +13,23 @@ export default {
|
|
|
13
13
|
name: 'Classi aggiuntive',
|
|
14
14
|
control: 'text',
|
|
15
15
|
description: 'Aggiungi classi aggiuntive all\'icona (separate da spazio)'
|
|
16
|
-
}
|
|
16
|
+
},
|
|
17
17
|
}
|
|
18
18
|
};
|
|
19
19
|
const Template = (args) => `<jump-icon class="${args.class}" name="${args.name}"></jump-icon>`;
|
|
20
|
-
export const
|
|
21
|
-
|
|
20
|
+
export const IconSmall = Template.bind({});
|
|
21
|
+
IconSmall.args = {
|
|
22
|
+
name: Object.keys(feather.icons)[0],
|
|
23
|
+
class: 'small',
|
|
24
|
+
};
|
|
25
|
+
export const IconMedium = Template.bind({});
|
|
26
|
+
IconMedium.args = {
|
|
27
|
+
name: Object.keys(feather.icons)[0],
|
|
28
|
+
class: 'medium',
|
|
29
|
+
};
|
|
30
|
+
export const IconLarge = Template.bind({});
|
|
31
|
+
IconLarge.args = {
|
|
22
32
|
name: Object.keys(feather.icons)[0],
|
|
23
|
-
class: '',
|
|
33
|
+
class: 'large',
|
|
24
34
|
};
|
|
25
35
|
//# sourceMappingURL=jump-icon.stories.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"jump-icon.stories.js","sourceRoot":"","sources":["../../../src/components/jump-icon/jump-icon.stories.ts"],"names":[],"mappings":"AAAA,OAAO,OAAO,MAAM,eAAe,CAAC;AAEpC,eAAe;IACb,KAAK,EAAE,iBAAiB;IACxB,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,QAAQ,EAAE;QACR,IAAI,EAAE;YACJ,IAAI,EAAE,YAAY;YAClB,OAAO,EAAE,QAAQ;YACjB,OAAO,EAAE,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC;YACnC,WAAW,EAAE,kDAAkD;SAChE;QACD,KAAK,EAAE;YACL,IAAI,EAAE,mBAAmB;YACzB,OAAO,EAAE,MAAM;YACf,WAAW,EAAE,4DAA4D;SAC1E;KACF;CACF,CAAC;AAEF,MAAM,QAAQ,GAAG,CAAC,IAAI,EAAE,EAAE,CAAC,qBAAqB,IAAI,CAAC,KAAK,WAAW,IAAI,CAAC,IAAI,gBAAgB,CAAC;AAE/F,MAAM,CAAC,MAAM,
|
|
1
|
+
{"version":3,"file":"jump-icon.stories.js","sourceRoot":"","sources":["../../../src/components/jump-icon/jump-icon.stories.ts"],"names":[],"mappings":"AAAA,OAAO,OAAO,MAAM,eAAe,CAAC;AAEpC,eAAe;IACb,KAAK,EAAE,iBAAiB;IACxB,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,QAAQ,EAAE;QACR,IAAI,EAAE;YACJ,IAAI,EAAE,YAAY;YAClB,OAAO,EAAE,QAAQ;YACjB,OAAO,EAAE,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC;YACnC,WAAW,EAAE,kDAAkD;SAChE;QACD,KAAK,EAAE;YACL,IAAI,EAAE,mBAAmB;YACzB,OAAO,EAAE,MAAM;YACf,WAAW,EAAE,4DAA4D;SAC1E;KACF;CACF,CAAC;AAEF,MAAM,QAAQ,GAAG,CAAC,IAAI,EAAE,EAAE,CAAC,qBAAqB,IAAI,CAAC,KAAK,WAAW,IAAI,CAAC,IAAI,gBAAgB,CAAC;AAE/F,MAAM,CAAC,MAAM,SAAS,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC3C,SAAS,CAAC,IAAI,GAAG;IACf,IAAI,EAAE,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;IACnC,KAAK,EAAE,OAAO;CACf,CAAC;AACF,MAAM,CAAC,MAAM,UAAU,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC5C,UAAU,CAAC,IAAI,GAAG;IAChB,IAAI,EAAE,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;IACnC,KAAK,EAAE,QAAQ;CAChB,CAAC;AACF,MAAM,CAAC,MAAM,SAAS,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC3C,SAAS,CAAC,IAAI,GAAG;IACf,IAAI,EAAE,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;IACnC,KAAK,EAAE,OAAO;CACf,CAAC","sourcesContent":["import feather from 'feather-icons';\n\nexport default {\n title: 'Components/Icon',\n tags: ['autodocs'],\n argTypes: {\n name: {\n name: 'Nome Icona',\n control: 'select',\n options: Object.keys(feather.icons),\n description: 'Seleziona il nome dell\\'icona dal menu a tendina'\n },\n class: {\n name: 'Classi aggiuntive',\n control: 'text',\n description: 'Aggiungi classi aggiuntive all\\'icona (separate da spazio)'\n },\n }\n};\n\nconst Template = (args) => `<jump-icon class=\"${args.class}\" name=\"${args.name}\"></jump-icon>`;\n\nexport const IconSmall = Template.bind({});\nIconSmall.args = {\n name: Object.keys(feather.icons)[0],\n class: 'small',\n};\nexport const IconMedium = Template.bind({});\nIconMedium.args = {\n name: Object.keys(feather.icons)[0],\n class: 'medium',\n};\nexport const IconLarge = Template.bind({});\nIconLarge.args = {\n name: Object.keys(feather.icons)[0],\n class: 'large',\n};"]}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
|
|
2
2
|
|
|
3
|
-
const jumpBadgeCss = "jump-badge{--jump-badge-background:var(--primary-standard);--jump-badge-color:#fff;--jump-bafge-border-radius:50px;display:inline-flex;color:var(--jump-badge-color);background-color:var(--jump-badge-background);align-items:center;justify-content:center;font-size:var(--fs-300);font-weight:var(--fw-900);line-height:1;border-radius:var(--jump-bafge-border-radius);border:solid 1px var(--jump-bafge-border-radius);white-space:nowrap;padding:0.35em 0.6em;user-select:none;cursor:inherit}jump-badge[variant=primary]{--jump-badge-background:var(--primary-standard)}jump-badge[variant=secondary]{--jump-badge-background:var(--secondary-standard)}";
|
|
3
|
+
const jumpBadgeCss = "jump-badge{--jump-badge-background:var(--primary-standard);--jump-badge-color:#fff;--jump-bafge-border-radius:50px;display:inline-flex;color:var(--jump-badge-color);background-color:var(--jump-badge-background);align-items:center;justify-content:center;font-family:var(--ff-primary, \"Arial\"), sans-serif;font-size:var(--fs-300);font-weight:var(--fw-900);line-height:1;border-radius:var(--jump-bafge-border-radius);border:solid 1px var(--jump-bafge-border-radius);white-space:nowrap;padding:0.35em 0.6em;user-select:none;cursor:inherit}jump-badge[variant=primary]{--jump-badge-background:var(--primary-standard)}jump-badge[variant=secondary]{--jump-badge-background:var(--secondary-standard)}";
|
|
4
4
|
const JumpBadgeStyle0 = jumpBadgeCss;
|
|
5
5
|
|
|
6
6
|
const AppBadge = /*@__PURE__*/ proxyCustomElement(class AppBadge extends HTMLElement {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"jump-badge.js","mappings":";;AAAA,MAAM,YAAY,GAAG,
|
|
1
|
+
{"file":"jump-badge.js","mappings":";;AAAA,MAAM,YAAY,GAAG,urBAAurB,CAAC;AAC7sB,wBAAe,YAAY;;MCMd,QAAQ;;;;qBAIK,EAAE;uBAKe,SAAS;;IAElD,MAAM;QACJ,QACE,EAAC,IAAI,qDAAC,OAAO,EAAE,IAAI,CAAC,OAAO,IACxB,IAAI,CAAC,KAAK,CACN,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/jump-badge/jump-badge.scss?tag=jump-badge","src/components/jump-badge/jump-badge.tsx"],"sourcesContent":["jump-badge {\n --jump-badge-background: var(--primary-standard);\n --jump-badge-color: #fff;\n --jump-bafge-border-radius: 50px;\n\n display: inline-flex;\n color: var(--jump-badge-color);\n background-color: var(--jump-badge-background);\n align-items: center;\n justify-content: center;\n font-family: var(--ff-primary, 'Arial'), sans-serif;\n font-size: var(--fs-300);\n font-weight: var(--fw-900);\n line-height: 1;\n border-radius: var(--jump-bafge-border-radius);\n border: solid 1px var(--jump-bafge-border-radius);\n white-space: nowrap;\n padding: 0.35em 0.6em;\n user-select: none;\n cursor: inherit;\n\n &[variant='primary'] {\n --jump-badge-background: var(--primary-standard);\n }\n\n &[variant='secondary'] {\n --jump-badge-background: var(--secondary-standard);\n }\n}\n","import { Component, Host, h, Prop } from '@stencil/core';\n\n@Component({\n tag: 'jump-badge',\n styleUrl: 'jump-badge.scss',\n shadow: false,\n})\nexport class AppBadge {\n /**\n * Indicates the label of the badge\n */\n @Prop() label: string = '';\n\n /**\n * Indicates the variant of the badge\n */\n @Prop() variant: 'primary'|'secondary' = 'primary';\n\n render() {\n return (\n <Host variant={this.variant}>\n {this.label}\n </Host>\n );\n }\n\n}\n"],"version":3}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
|
|
2
2
|
|
|
3
|
-
const jumpButtonCss = ":host button,:host a{background-color:transparent;border:none;padding:0;margin:0;font:inherit;color:inherit;cursor:pointer}:host{--jump-button-color:#ffffff;--jump-button-color-disabled:#cbcbcb;--jump-button-background:var(--primary-standard);--jump-button-background-outline:transparent;--jump-button-color-hover:#ffffff;--jump-button-background-hover:var(--primary-hard);--jump-button-border-radius:var(--border-radius-1, 0.1875rem) var(--border-radius-1, 0.1875rem) var(--border-radius-1, 0.1875rem) var(--border-radius-1, 0.1875rem);--jump-button-padding:1rem 1.25rem}:host button{display:flex}:host a{display:inline-flex;box-sizing:border-box}:host button,:host a{background-color:var(--jump-button-background);border-radius:var(--jump-button-border-radius);color:var(--jump-button-color);position:relative;font-family:var(--ff-primary, \"Arial\"), sans-serif;font-weight:var(--fw-700, 700);font-size:var(--fs-400, 1rem);line-height:
|
|
3
|
+
const jumpButtonCss = ":host button,:host a{background-color:transparent;border:none;padding:0;margin:0;font:inherit;color:inherit;cursor:pointer}:host{--jump-button-color:#ffffff;--jump-button-color-disabled:#cbcbcb;--jump-button-background:var(--primary-standard);--jump-button-background-outline:transparent;--jump-button-color-hover:#ffffff;--jump-button-background-hover:var(--primary-hard);--jump-button-border-radius:var(--border-radius-1, 0.1875rem) var(--border-radius-1, 0.1875rem) var(--border-radius-1, 0.1875rem) var(--border-radius-1, 0.1875rem);--jump-button-padding:1rem 1.25rem}:host button{display:flex}:host a{display:inline-flex;box-sizing:border-box}:host button,:host a{background-color:var(--jump-button-background);border-radius:var(--jump-button-border-radius);color:var(--jump-button-color);position:relative;font-family:var(--ff-primary, \"Arial\"), sans-serif;font-weight:var(--fw-700, 700);font-size:var(--fs-400, 1rem);line-height:1;align-items:center;gap:var(--jump-button-gap, 0.5rem);text-decoration:none;padding:var(--jump-button-padding)}:host button:hover,:host a:hover{background-color:var(--jump-button-background-hover);color:var(--jump-button-color-hover)}:host button[data-variant=primary],:host a[data-variant=primary]{--jump-button-color:var(--neutral-white);--jump-button-background:var(--primary-standard);--jump-button-color-hover:var(--neutral-white);--jump-button-background-hover:var(--primary-hard)}:host button[data-variant=secondary],:host a[data-variant=secondary]{--jump-button-color:var(--neutral-white);--jump-button-background:var(--secondary-standard);--jump-button-color-hover:var(--neutral-white);--jump-button-background-hover:var(--secondary-hard)}:host button[data-variant=neutral],:host a[data-variant=neutral]{--jump-button-color:var(--neutral-white);--jump-button-background:var(--neutral-grey-secondary);--jump-button-color-hover:var(--neutral-white);--jump-button-background-hover:var(--neutral-grey-primary)}:host button[data-variant=white],:host a[data-variant=white]{--jump-button-color:var(--neutral-grey-primary);--jump-button-background:var(--neutral-white);--jump-button-color-hover:var(--neutral-grey-primary);--jump-button-background-hover:var(--neutral-grey-background)}:host button[disabled],:host a[disabled]{--jump-button-background:var(--jump-button-color-disabled);--jump-button-background-hover:var(--jump-button-color-disabled);cursor:not-allowed}:host button[data-pill],:host a[data-pill]{border-radius:100rem}:host button[data-size=small],:host a[data-size=small]{font-size:var(--fs-300, 0.875rem);--jump-button-padding:0.65rem 1rem}:host button[data-size=medium],:host a[data-size=medium]{font-size:var(--fs-400, 1rem);--jump-button-padding:0.75rem 1.25rem}:host button[data-size=large],:host a[data-size=large]{font-size:var(--fs-500, 1.125rem);--jump-button-padding:1rem 1.5rem}:host button[data-outline],:host a[data-outline]{background-color:var(--jump-button-background-outline);border:1px solid var(--jump-button-background);color:var(--jump-button-background)}:host button[data-outline]:hover,:host a[data-outline]:hover{background-color:var(--jump-button-background-hover);border:1px solid var(--jump-button-background-hover);color:var(--jump-button-color-hover)}:host button[data-text],:host a[data-text]{background-color:transparent;border:none;color:var(--jump-button-background);padding:0}:host button[data-text]:hover,:host a[data-text]:hover{background-color:transparent;border:none;color:var(--jump-button-background-hover)}:host button[data-only-icon],:host a[data-only-icon]{--jump-button-padding:0.5rem}:host button[data-only-icon][data-size=small],:host a[data-only-icon][data-size=small]{--jump-button-padding:0.5rem}:host button[data-only-icon][data-size=medium],:host a[data-only-icon][data-size=medium]{--jump-button-padding:0.875rem}:host button[data-only-icon][data-size=large],:host a[data-only-icon][data-size=large]{--jump-button-padding:1rem}:host button[data-full],:host a[data-full]{width:100%;justify-content:center}:host button.chat,:host a.chat{--jump-button-color:var(--neutral-white);--jump-button-background:hsla(133, 54%, 58%, 1);--jump-button-color-hover:var(--neutral-white);--jump-button-background-hover:hsla(161, 63%, 31%, 1)}";
|
|
4
4
|
const JumpButtonStyle0 = jumpButtonCss;
|
|
5
5
|
|
|
6
6
|
const JumpButton$1 = /*@__PURE__*/ proxyCustomElement(class JumpButton extends HTMLElement {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"jump-button.js","mappings":";;AAAA,MAAM,aAAa,GAAG,
|
|
1
|
+
{"file":"jump-button.js","mappings":";;AAAA,MAAM,aAAa,GAAG,4oIAA4oI,CAAC;AACnqI,yBAAe,aAAa;;MCMfA,YAAU;;;;;wBAIO,KAAK;uBAK0B,SAAS;uBAKzC,KAAK;oBAKT,QAAQ;oBAKP,KAAK;oBAKL,KAAK;oBAKL,KAAK;wBAKD,KAAK;;;oBAeS,QAAQ;oBAK3B,SAAS;qBAKR,SAAS;yBAKL,SAAS;qBAKb,SAAS;wBAKN,SAAS;;IAEpC,iBAAiB;QACf,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,MAAM,GAAG,OAAO,CAAC;KACjD;IAED,MAAM;QAEJ,QACE,EAAC,IAAI,uDACF,IAAI,CAAC,IAAI,IACR,SAAG,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,EAAE,EAAE,IAAI,CAAC,QAAQ,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,kBAAgB,IAAI,CAAC,OAAO,kBAAgB,IAAI,CAAC,OAAO,eAAa,IAAI,CAAC,IAAI,eAAa,IAAI,CAAC,IAAI,eAAa,IAAI,CAAC,IAAI,eAAa,IAAI,CAAC,IAAI,oBAAkB,IAAI,CAAC,QAAQ,gBAAc,IAAI,CAAC,SAAS,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,IACtR,YAAM,IAAI,EAAC,QAAQ,GAAQ,EAC1B,CAAC,IAAI,CAAC,QAAQ,IAAI,eAAa,EAChC,YAAM,IAAI,EAAC,QAAQ,GAAQ,CACzB,KAEJ,cAAQ,EAAE,EAAE,IAAI,CAAC,QAAQ,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,kBAAgB,IAAI,CAAC,OAAO,kBAAgB,IAAI,CAAC,OAAO,eAAa,IAAI,CAAC,IAAI,eAAa,IAAI,CAAC,IAAI,eAAa,IAAI,CAAC,IAAI,eAAa,IAAI,CAAC,IAAI,oBAAkB,IAAI,CAAC,QAAQ,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,gBAAc,IAAI,CAAC,SAAS,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,IACnU,YAAM,IAAI,EAAC,QAAQ,GAAQ,EAC1B,CAAC,IAAI,CAAC,QAAQ,IAAI,eAAa,EAChC,YAAM,IAAI,EAAC,QAAQ,GAAQ,CACpB,CACV,CACI,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["JumpButton"],"sources":["src/components/jump-button/jump-button.scss?tag=jump-button&encapsulation=shadow","src/components/jump-button/jump-button.tsx"],"sourcesContent":["%reset-button {\n background-color: transparent;\n border: none;\n padding: 0;\n margin: 0;\n font: inherit;\n color: inherit;\n cursor: pointer;\n}\n\n:host {\n --jump-button-color: #ffffff;\n --jump-button-color-disabled: #cbcbcb;\n --jump-button-background: var(--primary-standard);\n --jump-button-background-outline: transparent;\n --jump-button-color-hover: #ffffff;\n --jump-button-background-hover: var(--primary-hard);\n --jump-button-border-radius: var(--border-radius-1, 0.1875rem) var(--border-radius-1, 0.1875rem) var(--border-radius-1, 0.1875rem) var(--border-radius-1, 0.1875rem);\n --jump-button-padding: 1rem 1.25rem;\n\n button {\n display: flex;\n }\n\n a {\n display: inline-flex;\n box-sizing: border-box;\n }\n\n button,\n a {\n @extend %reset-button;\n background-color: var(--jump-button-background);\n border-radius: var(--jump-button-border-radius);\n color: var(--jump-button-color);\n position: relative;\n font-family: var(--ff-primary, 'Arial'), sans-serif;\n font-weight: var(--fw-700, 700);\n font-size: var(--fs-400, 1rem);\n // line-height: var(--lh-400, 1.3);\n line-height: 1;\n align-items: center;\n gap: var(--jump-button-gap, 0.5rem);\n text-decoration: none;\n\n //TODO: internal padding of the button\n padding: var(--jump-button-padding);\n\n // TODO: gestire il focus con un outline\n &:hover {\n background-color: var(--jump-button-background-hover);\n color: var(--jump-button-color-hover);\n }\n\n &[data-variant='primary'] {\n --jump-button-color: var(--neutral-white);\n --jump-button-background: var(--primary-standard);\n --jump-button-color-hover: var(--neutral-white);\n --jump-button-background-hover: var(--primary-hard);\n }\n\n &[data-variant='secondary'] {\n --jump-button-color: var(--neutral-white);\n --jump-button-background: var(--secondary-standard);\n --jump-button-color-hover: var(--neutral-white);\n --jump-button-background-hover: var(--secondary-hard);\n }\n\n &[data-variant='neutral'] {\n --jump-button-color: var(--neutral-white);\n --jump-button-background: var(--neutral-grey-secondary);\n --jump-button-color-hover: var(--neutral-white);\n --jump-button-background-hover: var(--neutral-grey-primary);\n }\n\n &[data-variant='white'] {\n --jump-button-color: var(--neutral-grey-primary);\n --jump-button-background: var(--neutral-white);\n --jump-button-color-hover: var(--neutral-grey-primary);\n --jump-button-background-hover: var(--neutral-grey-background);\n }\n\n &[disabled] {\n --jump-button-background: var(--jump-button-color-disabled);\n --jump-button-background-hover: var(--jump-button-color-disabled);\n cursor: not-allowed;\n }\n\n &[data-pill] {\n border-radius: 100rem;\n }\n\n &[data-size='small'] {\n font-size: var(--fs-300, 0.875rem);\n --jump-button-padding: 0.65rem 1rem;\n }\n\n &[data-size='medium'] {\n font-size: var(--fs-400, 1rem);\n --jump-button-padding: 0.75rem 1.25rem;\n }\n\n &[data-size='large'] {\n font-size: var(--fs-500, 1.125rem);\n --jump-button-padding: 1rem 1.5rem;\n }\n\n &[data-outline] {\n background-color: var(--jump-button-background-outline);\n border: 1px solid var(--jump-button-background);\n color: var(--jump-button-background);\n &:hover {\n background-color: var(--jump-button-background-hover);\n border: 1px solid var(--jump-button-background-hover);\n color: var(--jump-button-color-hover);\n }\n }\n\n &[data-text] {\n background-color: transparent;\n border: none;\n color: var(--jump-button-background);\n padding: 0;\n &:hover {\n background-color: transparent;\n border: none;\n color: var(--jump-button-background-hover);\n }\n }\n\n &[data-only-icon] {\n --jump-button-padding: 0.5rem;\n }\n\n &[data-only-icon][data-size='small'] {\n --jump-button-padding: 0.5rem;\n }\n &[data-only-icon][data-size='medium'] {\n --jump-button-padding: 0.875rem;\n }\n &[data-only-icon][data-size='large'] {\n --jump-button-padding: 1rem;\n }\n\n &[data-full] {\n width: 100%;\n justify-content: center;\n }\n\n &.chat {\n --jump-button-color: var(--neutral-white);\n --jump-button-background: hsla(133, 54%, 58%, 1);\n --jump-button-color-hover: var(--neutral-white);\n --jump-button-background-hover: hsla(161, 63%, 31%, 1);\n }\n }\n}\n","import { Component, Host, h, Prop } from '@stencil/core';\n\n@Component({\n tag: 'jump-button',\n styleUrl: 'jump-button.scss',\n shadow: true,\n})\nexport class JumpButton {\n /**\n * Set the button as disabled; Vale solo per i bottoni\n */\n @Prop() disabled: boolean = false;\n\n /**\n * Indicates the variant of the button\n */\n @Prop() variant: 'primary'|'secondary'|'white'|'neutral' = 'primary';\n\n /**\n * Indicates the button as outline\n */\n @Prop() outline: boolean = false;\n\n /**\n * Indicates the size of the button\n */\n @Prop() size: string = 'medium';\n\n /**\n * Indicates if the button is full width\n */\n @Prop() full: boolean = false;\n\n /**\n * Indicates the button as pill\n */\n @Prop() pill: boolean = false;\n\n /**\n * Indicates the button as text\n */\n @Prop() text: boolean = false;\n\n /**\n * Indicates the button as only icon\n **/\n @Prop() onlyIcon: boolean = false;\n\n /**\n * Indicates if button becames a anchor\n **/\n @Prop() href: string;\n\n /**\n * Indicates the type of anchor's target \n **/\n @Prop() target: '_blank' | '_parent' | '_self' | '_top'\n\n /**\n * Indicates type button\n **/\n @Prop() type: 'button'|'submit'|'reset' = 'button';\n\n /**\n * Indicates the name that the sender button will send\n **/\n @Prop() name: string = undefined;\n\n /**\n * Indicates the value that the sender button will send\n **/\n @Prop() value: string = undefined;\n\n /**\n * Indicates the value of text alternative to an element that has no visible text on the screen\n **/\n @Prop() ariaLabel: string = undefined;\n\n /**\n * Indicates classes of the component\n **/\n @Prop() class: string = undefined;\n\n /**\n * Indicates classes of the component\n **/\n @Prop() buttonId: string = undefined;\n\n componentWillLoad() {\n this.target = this.href ? this.target : '_self';\n }\n\n render() {\n \n return (\n <Host>\n {this.href ? (\n <a href={this.href} id={this.buttonId} class={this.class} data-variant={this.variant} data-outline={this.outline} data-size={this.size} data-full={this.full} data-pill={this.pill} data-text={this.text} data-only-icon={this.onlyIcon} aria-label={this.ariaLabel} target={this.target}>\n <slot name=\"prefix\"></slot>\n {!this.onlyIcon && <slot></slot>}\n <slot name=\"suffix\"></slot>\n </a>\n ) : ( \n <button id={this.buttonId} class={this.class} data-variant={this.variant} data-outline={this.outline} data-size={this.size} data-full={this.full} data-pill={this.pill} data-text={this.text} data-only-icon={this.onlyIcon} disabled={this.disabled} aria-label={this.ariaLabel} type={this.type} name={this.name} value={this.value}>\n <slot name=\"prefix\"></slot>\n {!this.onlyIcon && <slot></slot> }\n <slot name=\"suffix\"></slot>\n </button>\n )}\n </Host>\n );\n }\n\n}\n"],"version":3}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
|
|
2
2
|
|
|
3
|
-
const jumpCardCss = "
|
|
3
|
+
const jumpCardCss = "jump-card{display:flex;flex-direction:column;position:relative;--jump-card-max-width-horizontal:100%;--jump-card-color:var(--neutral-grey-primary);--jump-card-background:#fff;--jump-card-color-dark:#fff;--jump-card-border-color:var(--neutral-grey-background);--jump-card-border-radius:6px;--jump-card-border-top-radius:1rem;--jump-card-top-border-body-radius:1.5rem 1rem;--jump-card-padding:1rem 1.25rem;font-family:var(--ff-primary, \"Arial\"), sans-serif;line-height:var(--lh-400, 1.3);background-color:var(--jump-card-background);color:var(--jump-card-color);overflow:hidden}jump-card img,jump-card video{aspect-ratio:4/3;overflow:hidden;position:relative;object-fit:cover}jump-card .Content{padding:1.5rem 1rem;display:flex;flex-direction:column;gap:0.75rem;flex:1;background-color:var(--jump-card-background)}jump-card[dark]{background-color:var(--neutral-grey-primary);color:var(--jump-card-color-dark)}jump-card[dark] .Content{background-color:var(--neutral-grey-primary);color:var(--jump-card-color-dark)}jump-card[border]{border:1px solid var(--jump-card-border-color)}jump-card[border-radius]{border-radius:var(--jump-card-border-radius)}jump-card[top-border-content-radius]{border-radius:var(--jump-card-border-top-radius)}jump-card[top-border-content-radius] .Content{border-top-left-radius:var(--jump-card-border-top-radius);border-top-right-radius:var(--jump-card-border-top-radius);margin-top:-1rem;z-index:2}jump-card[boxed]{border-radius:var(--jump-card-border-radius)}jump-card[boxed] img,jump-card[boxed] video{border-radius:var(--jump-card-border-radius);background-color:var(--jump-card-background);margin:0.5rem 0.5rem 0}jump-card[horizontal]{flex-direction:row;gap:0.5rem;align-items:center;max-width:var(--jump-card-max-width-horizontal)}jump-card[rounded-media]{align-items:center;justify-content:center;text-align:center;background-color:transparent}jump-card[rounded-media] img,jump-card[rounded-media] video{background-color:transparent;border-radius:50%;aspect-ratio:1;width:100%;flex:0 1 40%}jump-card[rounded-media] .Content{background-color:transparent;align-items:center}jump-card[rounded-media][horizontal]{text-align:left}jump-card[rounded-media][horizontal] .Content{align-items:flex-start}jump-card[shadow]{box-shadow:0px 2px 25px 0px hsla(0, 0%, 0%, 0.1)}";
|
|
4
4
|
const JumpCardStyle0 = jumpCardCss;
|
|
5
5
|
|
|
6
6
|
const AppCard = /*@__PURE__*/ proxyCustomElement(class AppCard extends HTMLElement {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"jump-card.js","mappings":";;AAAA,MAAM,WAAW,GAAG,
|
|
1
|
+
{"file":"jump-card.js","mappings":";;AAAA,MAAM,WAAW,GAAG,uvEAAuvE,CAAC;AAC5wE,uBAAe,WAAW;;MCMb,OAAO;;;;0BAIY,KAAK;oBAKX,KAAK;;;4BAeG,KAAK;sCAKK,KAAK;qBAKtB,KAAK;4BAKE,KAAK;sBAKZ,EAAE;sBAKF,EAAE;wBAKA,EAAE;;IAE7B,MAAM;QACJ,QACE,EAAC,IAAI,qDAAC,UAAU,EAAE,IAAI,CAAC,UAAU,mBAAiB,IAAI,CAAC,YAAY,mBAAiB,IAAI,CAAC,YAAY,+BAA6B,IAAI,CAAC,sBAAsB,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,IACvN,IAAI,CAAC,MAAM,IAAI,CAAC,IAAI,CAAC,QAAQ,GAAG,WAAK,GAAG,EAAE,IAAI,CAAC,MAAM,EAAE,GAAG,EAAE,IAAI,CAAC,MAAM,GAAQ,GAAG,EAAE,EACpF,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,MAAM;YAC5B,aAAO,QAAQ,UACb,cAAQ,GAAG,EAAE,IAAI,CAAC,QAAQ,EAAE,IAAI,EAAC,WAAW,GAAE,EAC9C,cAAQ,GAAG,EAAE,IAAI,CAAC,QAAQ,EAAE,IAAI,EAAC,WAAW,GAAE,EAC9C,cAAQ,GAAG,EAAE,IAAI,CAAC,QAAQ,EAAE,IAAI,EAAC,YAAY,GAAE,CACzC,GAAG,EAAE,EACf,4DAAK,KAAK,EAAC,SAAS,IAClB,6DAAM,IAAI,EAAC,MAAM,GAAQ,EACzB,6DAAM,IAAI,EAAC,QAAQ,GAAQ,CACvB,CACD,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/jump-card/jump-card.scss?tag=jump-card","src/components/jump-card/jump-card.tsx"],"sourcesContent":["jump-card {\n display: flex;\n flex-direction: column;\n position: relative;\n // --jump-card-max-width: 320px;\n --jump-card-max-width-horizontal: 100%;\n --jump-card-color: var(--neutral-grey-primary);\n --jump-card-background: #fff;\n --jump-card-color-dark: #fff;\n --jump-card-border-color: var(--neutral-grey-background);\n --jump-card-border-radius: 6px;\n --jump-card-border-top-radius: 1rem;\n --jump-card-top-border-body-radius: 1.5rem 1rem;\n --jump-card-padding: 1rem 1.25rem;\n\n font-family: var(--ff-primary, 'Arial'), sans-serif;\n line-height: var(--lh-400, 1.3);\n background-color: var(--jump-card-background);\n color: var(--jump-card-color);\n // max-width: var(--jump-card-max-width);\n overflow: hidden;\n\n img,\n video {\n aspect-ratio: 4/3;\n overflow: hidden;\n position: relative;\n object-fit: cover;\n }\n\n .Content {\n padding: 1.5rem 1rem;\n display: flex;\n flex-direction: column;\n gap: 0.75rem;\n flex: 1;\n background-color: var(--jump-card-background);\n }\n\n &[dark] {\n background-color: var(--neutral-grey-primary);\n color: var(--jump-card-color-dark);\n\n .Content {\n background-color: var(--neutral-grey-primary);\n color: var(--jump-card-color-dark);\n }\n }\n\n &[border] {\n border: 1px solid var(--jump-card-border-color);\n }\n\n &[border-radius] {\n border-radius: var(--jump-card-border-radius);\n }\n\n &[top-border-content-radius] {\n border-radius: var(--jump-card-border-top-radius);\n\n .Content {\n border-top-left-radius: var(--jump-card-border-top-radius);\n border-top-right-radius: var(--jump-card-border-top-radius);\n margin-top: -1rem;\n z-index: 2;\n }\n }\n\n &[boxed] {\n border-radius: var(--jump-card-border-radius);\n\n img,\n video {\n border-radius: var(--jump-card-border-radius);\n background-color: var(--jump-card-background);\n margin: 0.5rem 0.5rem 0;\n }\n }\n\n &[horizontal] {\n flex-direction: row;\n gap: 0.5rem;\n align-items: center;\n max-width: var(--jump-card-max-width-horizontal);\n }\n\n &[rounded-media] {\n align-items: center;\n justify-content: center;\n text-align: center;\n background-color: transparent;\n\n img,\n video {\n background-color: transparent;\n border-radius: 50%;\n aspect-ratio: 1;\n width: 100%;\n flex: 0 1 40%;\n }\n\n .Content {\n background-color: transparent;\n align-items: center;\n }\n }\n\n &[rounded-media][horizontal] {\n text-align: left;\n\n .Content {\n align-items: flex-start;\n }\n }\n\n &[shadow] {\n box-shadow: 0px 2px 25px 0px hsla(0, 0%, 0%, 0.1);\n }\n}\n","import { Component, Host, h, Prop } from '@stencil/core';\n\n@Component({\n tag: 'jump-card',\n styleUrl: 'jump-card.scss',\n shadow: false,\n})\nexport class AppCard {\n /**\n * Indicates if the card is horizontal\n */\n @Prop() horizontal: boolean = false;\n\n /**\n * Indicates if the card is horizontal\n */\n @Prop() dark: boolean = false;\n\n /**\n * Indicates if card has shadow\n */\n @Prop() shadow: boolean;\n\n /**\n * Indicates if card has borders\n */\n @Prop() border: boolean;\n\n /**\n * Indicates if borders of the entire card are rounded\n */\n @Prop() borderRadius: boolean = false;\n\n /**\n * Indicates if border top of the body is rounded; Not compatible with boxed\n */\n @Prop() topBorderContentRadius: boolean = false;\n\n /**\n * Indicates if media has padding; Not compatible with roundedMedia\n */\n @Prop() boxed: boolean = false;\n\n /**\n * Indicates if image is rounded and there isnt a bg\n */\n @Prop() roundedMedia: boolean = false;\n\n /**\n * Indicates the imgSrc of the card\n */\n @Prop() imgSrc: string = '';\n\n /**\n * Indicates the img's alt of the card\n */\n @Prop() imgAlt: string = '';\n\n /**\n * Indicates the videoSrc of the card\n */\n @Prop() videoSrc: string = '';\n\n render() {\n return (\n <Host horizontal={this.horizontal} border-radius={this.borderRadius} rounded-media={this.roundedMedia} top-border-content-radius={this.topBorderContentRadius} boxed={this.boxed} shadow={this.shadow} border={this.border}>\n {this.imgSrc && !this.videoSrc ? <img src={this.imgSrc} alt={this.imgAlt}></img> : ''}\n {this.videoSrc && !this.imgSrc ? \n <video autoplay> \n <source src={this.videoSrc} type=\"video/mp4\"/> \n <source src={this.videoSrc} type=\"video/mov\"/> \n <source src={this.videoSrc} type=\"video/webm\"/> \n </video> : ''}\n <div class=\"Content\">\n <slot name=\"body\"></slot>\n <slot name=\"footer\"></slot>\n </div>\n </Host>\n );\n }\n\n}\n"],"version":3}
|
|
@@ -2394,7 +2394,7 @@ module.exports = __webpack_require__(/*! /home/runner/work/feather/feather/src/i
|
|
|
2394
2394
|
|
|
2395
2395
|
const feather = /*@__PURE__*/getDefaultExportFromCjs(feather$1.exports);
|
|
2396
2396
|
|
|
2397
|
-
const jumpIconCss = "
|
|
2397
|
+
const jumpIconCss = "jump-icon{display:inline-flex;--jump-icon-width:var(--fs-400, 1rem);--jump-icon-height:var(--fs-400, 1rem)}jump-icon svg{width:var(--jump-icon-width);height:var(--jump-icon-height)}jump-icon.small svg{--jump-icon-width:var(--fs-400, 1rem);--jump-icon-height:var(--fs-400, 1rem)}jump-icon.medium svg{--jump-icon-width:var(--fs-500, 1.125rem);--jump-icon-height:var(--fs-500, 1.125rem)}jump-icon.large svg{--jump-icon-width:var(--fs-600, 1.5rem);--jump-icon-height:var(--fs-600, 1.5rem)}";
|
|
2398
2398
|
const JumpIconStyle0 = jumpIconCss;
|
|
2399
2399
|
|
|
2400
2400
|
const JumpIcon = /*@__PURE__*/ proxyCustomElement(class JumpIcon extends HTMLElement {
|
|
@@ -2403,17 +2403,19 @@ const JumpIcon = /*@__PURE__*/ proxyCustomElement(class JumpIcon extends HTMLEle
|
|
|
2403
2403
|
this.__registerHost();
|
|
2404
2404
|
this.name = undefined;
|
|
2405
2405
|
this.class = undefined;
|
|
2406
|
+
this.size = undefined;
|
|
2406
2407
|
}
|
|
2407
2408
|
componentDidLoad() {
|
|
2408
2409
|
feather.replace();
|
|
2409
2410
|
}
|
|
2410
2411
|
render() {
|
|
2411
|
-
return (h(Host, { key: '
|
|
2412
|
+
return (h(Host, { key: '69247a6f3ad9817e9e768998277e5aa8dfceac73' }, h("i", { key: '92bd5adbe5e02ed7c272514a91d929975b1d93d3', "data-feather": this.name, class: this.class })));
|
|
2412
2413
|
}
|
|
2413
2414
|
static get style() { return JumpIconStyle0; }
|
|
2414
2415
|
}, [0, "jump-icon", {
|
|
2415
2416
|
"name": [1],
|
|
2416
|
-
"class": [1]
|
|
2417
|
+
"class": [1],
|
|
2418
|
+
"size": [1]
|
|
2417
2419
|
}]);
|
|
2418
2420
|
function defineCustomElement() {
|
|
2419
2421
|
if (typeof customElements === "undefined") {
|