@jotyping/jap-ds 0.1.5-alpha → 0.1.7-alpha
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.
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { unsafeCSS as
|
|
2
|
-
import { property as
|
|
1
|
+
import { unsafeCSS as f, LitElement as y, html as n } from "/Users/jo/Documents/dev/Web/026-jap-ds/jap/node_modules/lit/index.js";
|
|
2
|
+
import { property as o, customElement as u } from "/Users/jo/Documents/dev/Web/026-jap-ds/jap/node_modules/lit/decorators.js";
|
|
3
3
|
import "../flash/jap-flash.js";
|
|
4
4
|
import "../footer/jap-footer.js";
|
|
5
5
|
import "../header/jap-header.js";
|
|
@@ -11,41 +11,46 @@ import "../link/jap-link.js";
|
|
|
11
11
|
import "../modal/jap-modal.js";
|
|
12
12
|
import "../navigation/jap-navigation.js";
|
|
13
13
|
import "../tag/jap-tag.js";
|
|
14
|
-
import
|
|
15
|
-
var
|
|
16
|
-
for (var
|
|
17
|
-
(
|
|
18
|
-
return
|
|
14
|
+
import h from "./jap-button.scss.js";
|
|
15
|
+
var c = Object.defineProperty, g = Object.getOwnPropertyDescriptor, r = (a, p, i, s) => {
|
|
16
|
+
for (var e = s > 1 ? void 0 : s ? g(p, i) : p, l = a.length - 1, m; l >= 0; l--)
|
|
17
|
+
(m = a[l]) && (e = (s ? m(p, i, e) : m(e)) || e);
|
|
18
|
+
return s && e && c(p, i, e), e;
|
|
19
19
|
};
|
|
20
|
-
let
|
|
20
|
+
let t = class extends y {
|
|
21
21
|
constructor() {
|
|
22
|
-
super(...arguments), this.type = "primary", this.active = !1, this.isLink = !1, this.href = "";
|
|
22
|
+
super(...arguments), this.type = "primary", this.active = !1, this.isLink = !1, this.href = "", this.target = "_blank";
|
|
23
23
|
}
|
|
24
24
|
render() {
|
|
25
25
|
return n`
|
|
26
|
-
${this.isLink ? n`<a href
|
|
26
|
+
${this.isLink ? n`<a class=${this.type} href=${this.href} target=${this.target}
|
|
27
|
+
><slot></slot
|
|
28
|
+
></a>` : n`<button class=${this.type}>
|
|
27
29
|
<slot></slot>
|
|
28
30
|
</button>`}
|
|
29
31
|
`;
|
|
30
32
|
}
|
|
31
33
|
};
|
|
32
|
-
|
|
34
|
+
t.styles = f(h);
|
|
33
35
|
r([
|
|
34
|
-
|
|
35
|
-
],
|
|
36
|
+
o({ type: String, reflect: !0 })
|
|
37
|
+
], t.prototype, "type", 2);
|
|
36
38
|
r([
|
|
37
|
-
|
|
38
|
-
],
|
|
39
|
+
o({ type: Boolean, reflect: !0 })
|
|
40
|
+
], t.prototype, "active", 2);
|
|
39
41
|
r([
|
|
40
|
-
|
|
41
|
-
],
|
|
42
|
+
o({ type: Boolean, reflect: !0 })
|
|
43
|
+
], t.prototype, "isLink", 2);
|
|
42
44
|
r([
|
|
43
|
-
|
|
44
|
-
],
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
],
|
|
45
|
+
o({ type: String, reflect: !0 })
|
|
46
|
+
], t.prototype, "href", 2);
|
|
47
|
+
r([
|
|
48
|
+
o({ type: String, reflect: !0 })
|
|
49
|
+
], t.prototype, "target", 2);
|
|
50
|
+
t = r([
|
|
51
|
+
u("jap-button")
|
|
52
|
+
], t);
|
|
48
53
|
export {
|
|
49
|
-
|
|
54
|
+
t as JapButton
|
|
50
55
|
};
|
|
51
56
|
//# sourceMappingURL=jap-button.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"jap-button.js","sources":["../../../src/components/button/jap-button.ts"],"sourcesContent":["import { LitElement, html, unsafeCSS } from \"lit\";\nimport { customElement, property } from \"lit/decorators.js\";\nimport \"@/components\";\nimport style from \"./jap-button.scss?inline\";\n\n@customElement(\"jap-button\")\nexport class JapButton extends LitElement {\n static styles = unsafeCSS(style);\n\n /**\n * Button type, can be \"primary\" or \"secondary\".\n */\n @property({ type: String, reflect: true })\n type: \"primary\" | \"secondary\" = \"primary\";\n\n /**\n * Active state\n */\n @property({ type: Boolean, reflect: true })\n active = false;\n\n /**\n * Active state\n */\n @property({ type: Boolean, reflect: true })\n isLink = false;\n\n /**\n * Href in isLink case\n */\n @property({ type: String, reflect: true })\n href = \"\";\n\n render() {\n return html`\n ${this.isLink\n ? html`<a href
|
|
1
|
+
{"version":3,"file":"jap-button.js","sources":["../../../src/components/button/jap-button.ts"],"sourcesContent":["import { LitElement, html, unsafeCSS } from \"lit\";\nimport { customElement, property } from \"lit/decorators.js\";\nimport \"@/components\";\nimport style from \"./jap-button.scss?inline\";\n\n@customElement(\"jap-button\")\nexport class JapButton extends LitElement {\n static styles = unsafeCSS(style);\n\n /**\n * Button type, can be \"primary\" or \"secondary\".\n */\n @property({ type: String, reflect: true })\n type: \"primary\" | \"secondary\" = \"primary\";\n\n /**\n * Active state\n */\n @property({ type: Boolean, reflect: true })\n active = false;\n\n /**\n * Active state\n */\n @property({ type: Boolean, reflect: true })\n isLink = false;\n\n /**\n * Href in isLink case\n */\n @property({ type: String, reflect: true })\n href = \"\";\n\n /**\n * Href in isLink case\n */\n @property({ type: String, reflect: true })\n target: \"_self\" | \"_blank\" = \"_blank\";\n\n render() {\n return html`\n ${this.isLink\n ? html`<a class=${this.type} href=${this.href} target=${this.target}\n ><slot></slot\n ></a>`\n : html`<button class=${this.type}>\n <slot></slot>\n </button>`}\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n \"jap-button\": JapButton;\n }\n}\n"],"names":["JapButton","LitElement","html","unsafeCSS","style","__decorateClass","property","customElement"],"mappings":";;;;;;;;;;;;;;;;;;;AAMO,IAAMA,IAAN,cAAwBC,EAAW;AAAA,EAAnC,cAAA;AAAA,UAAA,GAAA,SAAA,GAOL,KAAA,OAAgC,WAMhC,KAAA,SAAS,IAMT,KAAA,SAAS,IAMT,KAAA,OAAO,IAMP,KAAA,SAA6B;AAAA,EAAA;AAAA,EAE7B,SAAS;AACP,WAAOC;AAAA,QACH,KAAK,SACHA,aAAgB,KAAK,IAAI,SAAS,KAAK,IAAI,WAAW,KAAK,MAAM;AAAA;AAAA,mBAGjEA,kBAAqB,KAAK,IAAI;AAAA;AAAA,oBAEpB;AAAA;AAAA,EAElB;AACF;AA5CaF,EACJ,SAASG,EAAUC,CAAK;AAM/BC,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GAN9BN,EAOX,WAAA,QAAA,CAAA;AAMAK,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAZ/BN,EAaX,WAAA,UAAA,CAAA;AAMAK,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAlB/BN,EAmBX,WAAA,UAAA,CAAA;AAMAK,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GAxB9BN,EAyBX,WAAA,QAAA,CAAA;AAMAK,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GA9B9BN,EA+BX,WAAA,UAAA,CAAA;AA/BWA,IAANK,EAAA;AAAA,EADNE,EAAc,YAAY;AAAA,GACdP,CAAA;"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
const o = '@font-face{font-family:Satoshi-Regular;src:url(/assets/Satoshi-Regular.woff2) format("woff2"),url(/assets/Satoshi-Regular.woff) format("woff");font-weight:400;font-display:swap;font-style:normal}@font-face{font-family:Satoshi-Italic;src:url(/assets/Satoshi-Italic.woff2) format("woff2"),url(/assets/Satoshi-Italic.woff) format("woff");font-weight:400;font-display:swap;font-style:italic}@font-face{font-family:Satoshi-Bold;src:url(/assets/Satoshi-Bold.woff2) format("woff2"),url(/assets/Satoshi-Bold.woff) format("woff");font-weight:700;font-display:swap;font-style:normal}@font-face{font-family:Satoshi-Black;src:url(/assets/Satoshi-Black.woff2) format("woff2"),url(/assets/Satoshi-Black.woff) format("woff");font-weight:900;font-display:swap;font-style:normal}:host{display:inline-block}:host([active]) button.primary{color:#3a3a3a;background-color:#fff}:host([active]) button.secondary{color:#3a3a3a;background-color:#fff;outline:3px solid #3a3a3a;outline-offset:-3px}:host([active]) button.secondary:hover{outline:4px solid #3a3a3a;outline-offset:-4px}button{font-family:Satoshi-Bold,sans-serif;font-size:24px;line-height:42px;padding:0 20px;border-radius:28px;cursor:pointer;transition:background-color .3s;height:56px;border:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}button.primary{color:#3a3a3a;background-color:#fff;outline:3px solid #3a3a3a;outline-offset:-3px}button.primary:hover{outline:4px solid #3a3a3a;outline-offset:-4px}button.secondary{color:#3a3a3a;background-color:#fff;outline:1px solid #f3f3f3;outline-offset:-1px}button.secondary:hover{outline:3px solid #f3f3f3;outline-offset:-3px}';
|
|
1
|
+
const o = '@font-face{font-family:Satoshi-Regular;src:url(/assets/Satoshi-Regular.woff2) format("woff2"),url(/assets/Satoshi-Regular.woff) format("woff");font-weight:400;font-display:swap;font-style:normal}@font-face{font-family:Satoshi-Italic;src:url(/assets/Satoshi-Italic.woff2) format("woff2"),url(/assets/Satoshi-Italic.woff) format("woff");font-weight:400;font-display:swap;font-style:italic}@font-face{font-family:Satoshi-Bold;src:url(/assets/Satoshi-Bold.woff2) format("woff2"),url(/assets/Satoshi-Bold.woff) format("woff");font-weight:700;font-display:swap;font-style:normal}@font-face{font-family:Satoshi-Black;src:url(/assets/Satoshi-Black.woff2) format("woff2"),url(/assets/Satoshi-Black.woff) format("woff");font-weight:900;font-display:swap;font-style:normal}:host{display:inline-block}:host([active]) button.primary{color:#3a3a3a;background-color:#fff}:host([active]) button.secondary{color:#3a3a3a;background-color:#fff;outline:3px solid #3a3a3a;outline-offset:-3px}:host([active]) button.secondary:hover{outline:4px solid #3a3a3a;outline-offset:-4px}a{display:flex;flex-direction:row;align-items:center;text-decoration:none}button,a{font-family:Satoshi-Bold,sans-serif;font-size:24px;line-height:42px;padding:0 20px;border-radius:28px;cursor:pointer;transition:background-color .3s;height:56px;border:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}button.primary,a.primary{color:#3a3a3a;background-color:#fff;outline:3px solid #3a3a3a;outline-offset:-3px}button.primary:hover,a.primary:hover{outline:4px solid #3a3a3a;outline-offset:-4px}button.secondary,a.secondary{color:#3a3a3a;background-color:#fff;outline:1px solid #f3f3f3;outline-offset:-1px}button.secondary:hover,a.secondary:hover{outline:3px solid #f3f3f3;outline-offset:-3px}';
|
|
2
2
|
export {
|
|
3
3
|
o as default
|
|
4
4
|
};
|