@safe-stars/components
Version:
React component library for buying Telegram Stars in Telegram Mini Apps via Safe Stars.
259 lines (225 loc) • 7.21 kB
JavaScript
import { i as v, r as g, h, a as p, x as u } from "./index-B5pm1jHN.js";
import { n as t, c as w, U as m } from "./if-defined-CTZGcMnO.js";
import "./index-CIwP1liu.js";
const S = {
URLS: {
FAQ: "https://walletconnect.com/faq"
}
}, f = v`
a {
border: 1px solid var(--wui-color-gray-glass-010);
border-radius: var(--wui-border-radius-3xl);
}
wui-image {
border-radius: var(--wui-border-radius-3xl);
overflow: hidden;
}
a.disabled > wui-icon:not(.image-icon),
a.disabled > wui-image {
filter: grayscale(1);
}
a[data-variant='fill'] {
color: var(--wui-color-inverse-100);
background-color: var(--wui-color-accent-100);
}
a[data-variant='shade'],
a[data-variant='shadeSmall'] {
background-color: transparent;
background-color: var(--wui-color-gray-glass-010);
color: var(--wui-color-fg-200);
}
a[data-variant='success'] {
column-gap: var(--wui-spacing-xxs);
border: 1px solid var(--wui-color-success-glass-010);
background-color: var(--wui-color-success-glass-010);
color: var(--wui-color-success-100);
}
a[data-variant='error'] {
column-gap: var(--wui-spacing-xxs);
border: 1px solid var(--wui-color-error-glass-010);
background-color: var(--wui-color-error-glass-010);
color: var(--wui-color-error-100);
}
a[data-variant='transparent'] {
column-gap: var(--wui-spacing-xxs);
background-color: transparent;
color: var(--wui-color-fg-150);
}
a[data-variant='transparent'],
a[data-variant='success'],
a[data-variant='shadeSmall'],
a[data-variant='error'] {
padding: 7px var(--wui-spacing-s) 7px 10px;
}
a[data-variant='transparent']:has(wui-text:first-child),
a[data-variant='success']:has(wui-text:first-child),
a[data-variant='shadeSmall']:has(wui-text:first-child),
a[data-variant='error']:has(wui-text:first-child) {
padding: 7px var(--wui-spacing-s);
}
a[data-variant='fill'],
a[data-variant='shade'] {
column-gap: var(--wui-spacing-xs);
padding: var(--wui-spacing-xxs) var(--wui-spacing-m) var(--wui-spacing-xxs)
var(--wui-spacing-xs);
}
a[data-variant='fill']:has(wui-text:first-child),
a[data-variant='shade']:has(wui-text:first-child) {
padding: 9px var(--wui-spacing-m) 9px var(--wui-spacing-m);
}
a[data-variant='fill'] > wui-image,
a[data-variant='shade'] > wui-image {
width: 24px;
height: 24px;
}
a[data-variant='fill'] > wui-image {
box-shadow: inset 0 0 0 1px var(--wui-color-accent-090);
}
a[data-variant='shade'] > wui-image,
a[data-variant='shadeSmall'] > wui-image {
box-shadow: inset 0 0 0 1px var(--wui-color-gray-glass-010);
}
a[data-variant='fill'] > wui-icon:not(.image-icon),
a[data-variant='shade'] > wui-icon:not(.image-icon) {
width: 14px;
height: 14px;
}
a[data-variant='transparent'] > wui-image,
a[data-variant='success'] > wui-image,
a[data-variant='shadeSmall'] > wui-image,
a[data-variant='error'] > wui-image {
width: 14px;
height: 14px;
}
a[data-variant='transparent'] > wui-icon:not(.image-icon),
a[data-variant='success'] > wui-icon:not(.image-icon),
a[data-variant='shadeSmall'] > wui-icon:not(.image-icon),
a[data-variant='error'] > wui-icon:not(.image-icon) {
width: 12px;
height: 12px;
}
a[data-variant='fill']:focus-visible {
background-color: var(--wui-color-accent-090);
}
a[data-variant='shade']:focus-visible,
a[data-variant='shadeSmall']:focus-visible {
background-color: var(--wui-color-gray-glass-015);
}
a[data-variant='transparent']:focus-visible {
background-color: var(--wui-color-gray-glass-005);
}
a[data-variant='success']:focus-visible {
background-color: var(--wui-color-success-glass-015);
}
a[data-variant='error']:focus-visible {
background-color: var(--wui-color-error-glass-015);
}
a.disabled {
color: var(--wui-color-gray-glass-015);
background-color: var(--wui-color-gray-glass-015);
pointer-events: none;
}
(hover: hover) and (pointer: fine) {
a[data-variant='fill']:hover {
background-color: var(--wui-color-accent-090);
}
a[data-variant='shade']:hover,
a[data-variant='shadeSmall']:hover {
background-color: var(--wui-color-gray-glass-015);
}
a[data-variant='transparent']:hover {
background-color: var(--wui-color-gray-glass-005);
}
a[data-variant='success']:hover {
background-color: var(--wui-color-success-glass-015);
}
a[data-variant='error']:hover {
background-color: var(--wui-color-error-glass-015);
}
}
a[data-variant='fill']:active {
background-color: var(--wui-color-accent-080);
}
a[data-variant='shade']:active,
a[data-variant='shadeSmall']:active {
background-color: var(--wui-color-gray-glass-020);
}
a[data-variant='transparent']:active {
background-color: var(--wui-color-gray-glass-010);
}
a[data-variant='success']:active {
background-color: var(--wui-color-success-glass-020);
}
a[data-variant='error']:active {
background-color: var(--wui-color-error-glass-020);
}
`;
var r = function(s, o, e, n) {
var c = arguments.length, i = c < 3 ? o : n === null ? n = Object.getOwnPropertyDescriptor(o, e) : n, l;
if (typeof Reflect == "object" && typeof Reflect.decorate == "function") i = Reflect.decorate(s, o, e, n);
else for (var d = s.length - 1; d >= 0; d--) (l = s[d]) && (i = (c < 3 ? l(i) : c > 3 ? l(o, e, i) : l(o, e)) || i);
return c > 3 && i && Object.defineProperty(o, e, i), i;
};
let a = class extends p {
constructor() {
super(...arguments), this.variant = "fill", this.imageSrc = void 0, this.imageIcon = void 0, this.imageIconSize = "md", this.disabled = !1, this.icon = "externalLink", this.href = "", this.text = void 0;
}
render() {
const e = this.variant === "success" || this.variant === "transparent" || this.variant === "shadeSmall" ? "small-600" : "paragraph-600";
return u`
<a
rel="noreferrer"
target="_blank"
href=${this.href}
class=${this.disabled ? "disabled" : ""}
data-variant=${this.variant}
>
${this.imageTemplate()}
<wui-text variant=${e} color="inherit">
${this.title ? this.title : m.getHostName(this.href)}
</wui-text>
<wui-icon name=${this.icon} color="inherit" size="inherit"></wui-icon>
</a>
`;
}
imageTemplate() {
return this.imageSrc ? u`<wui-image src=${this.imageSrc}></wui-image>` : this.imageIcon ? u`<wui-icon
name=${this.imageIcon}
color="inherit"
size=${this.imageIconSize}
class="image-icon"
></wui-icon>` : null;
}
};
a.styles = [g, h, f];
r([
t()
], a.prototype, "variant", void 0);
r([
t()
], a.prototype, "imageSrc", void 0);
r([
t()
], a.prototype, "imageIcon", void 0);
r([
t()
], a.prototype, "imageIconSize", void 0);
r([
t({ type: Boolean })
], a.prototype, "disabled", void 0);
r([
t()
], a.prototype, "icon", void 0);
r([
t()
], a.prototype, "href", void 0);
r([
t()
], a.prototype, "text", void 0);
a = r([
w("wui-chip")
], a);
export {
S as N
};
//# sourceMappingURL=index-BrIc_apC.js.map