smoothly 0.1.110 → 0.1.111
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/loader.cjs.js +1 -1
- package/dist/cjs/{smoothly-accordion_49.cjs.entry.js → smoothly-accordion_50.cjs.entry.js} +100 -65
- package/dist/cjs/smoothly-display-demo.cjs.entry.js +1 -1
- package/dist/cjs/smoothly-notifier.cjs.entry.js +1 -1
- package/dist/cjs/smoothly-svg.cjs.entry.js +41 -0
- package/dist/cjs/smoothly.cjs.js +1 -1
- package/dist/collection/collection-manifest.json +1 -0
- package/dist/collection/components/display-demo/index.js +3 -1
- package/dist/collection/components/notifier/style.css +1 -1
- package/dist/collection/components/svg/index.js +92 -0
- package/dist/collection/components/svg/style.css +11 -0
- package/dist/custom-elements/index.d.ts +6 -0
- package/dist/custom-elements/index.js +107 -70
- package/dist/esm/loader.js +1 -1
- package/dist/esm/{smoothly-accordion_49.entry.js → smoothly-accordion_50.entry.js} +100 -66
- package/dist/esm/smoothly-display-demo.entry.js +1 -1
- package/dist/esm/smoothly-notifier.entry.js +1 -1
- package/dist/esm/smoothly-svg.entry.js +37 -0
- package/dist/esm/smoothly.js +1 -1
- package/dist/smoothly/{p-075d2106.entry.js → p-16bd3296.entry.js} +1 -1
- package/dist/smoothly/smoothly-display-demo.entry.js +1 -1
- package/dist/smoothly/smoothly-notifier.entry.js +1 -1
- package/dist/smoothly/smoothly-svg.entry.js +37 -0
- package/dist/smoothly/smoothly.esm.js +1 -1
- package/dist/types/components/svg/index.d.ts +10 -0
- package/dist/types/components.d.ts +19 -0
- package/package.json +1 -1
|
@@ -2381,7 +2381,7 @@ var Cosmetic;
|
|
|
2381
2381
|
|
|
2382
2382
|
const globalScripts = () => {};
|
|
2383
2383
|
|
|
2384
|
-
const styleCss$
|
|
2384
|
+
const styleCss$K = "smoothly-accordion-item.sc-smoothly-accordion{border:1px solid rgb(var(--smoothly-dark-color));border-bottom:none}smoothly-accordion-item.sc-smoothly-accordion:first-of-type{border-top-left-radius:4px;border-top-right-radius:4px;margin-top:0.4em}smoothly-accordion-item.sc-smoothly-accordion:last-of-type{border-bottom-left-radius:4px;border-bottom-right-radius:4px;border-bottom:1px solid rgb(var(--smoothly-dark-color));margin-bottom:0.6em}smoothly-accordion-item[open].sc-smoothly-accordion{border-color:rgb(var(--smoothly-primary-color));border-bottom:1px solid rgb(var(--smoothly-primary-color))}smoothly-accordion-item[open].sc-smoothly-accordion+smoothly-accordion-item.sc-smoothly-accordion{border-top:none}";
|
|
2385
2385
|
|
|
2386
2386
|
let SmoothlyAccordion$1 = class extends HTMLElement {
|
|
2387
2387
|
constructor() {
|
|
@@ -2427,10 +2427,10 @@ let SmoothlyAccordion$1 = class extends HTMLElement {
|
|
|
2427
2427
|
static get watchers() { return {
|
|
2428
2428
|
"value": ["valueChanged"]
|
|
2429
2429
|
}; }
|
|
2430
|
-
static get style() { return styleCss$
|
|
2430
|
+
static get style() { return styleCss$K; }
|
|
2431
2431
|
};
|
|
2432
2432
|
|
|
2433
|
-
const styleCss$
|
|
2433
|
+
const styleCss$J = ".sc-smoothly-accordion-item-h{display:block}[hidden].sc-smoothly-accordion-item-h{display:none}details.sc-smoothly-accordion-item{padding:0}details.sc-smoothly-accordion-item>summary.sc-smoothly-accordion-item>span.sc-smoothly-accordion-item{float:right;margin:0.2em;font-size:60%}details.sc-smoothly-accordion-item>summary.sc-smoothly-accordion-item{font-size:120%;list-style-type:none;cursor:pointer;padding:0.4em;color:rgb(var(--smoothly-text-tint))}details.sc-smoothly-accordion-item>fieldset.sc-smoothly-accordion-item{border:none;margin:0;padding:0}[open].sc-smoothly-accordion-item-h>details.sc-smoothly-accordion-item>summary.sc-smoothly-accordion-item{color:rgb(var(--smoothly-primary-contrast));background:rgb(var(--smoothly-primary-color))}details.sc-smoothly-accordion-item>summary.sc-smoothly-accordion-item::-webkit-details-marker{display:none}details.sc-smoothly-accordion-item>summary.sc-smoothly-accordion-item>svg.sc-smoothly-accordion-item{width:1em;height:auto;margin-bottom:-0.2em;margin-right:0.4em}[open].sc-smoothly-accordion-item-h>details.sc-smoothly-accordion-item>summary.sc-smoothly-accordion-item>svg.sc-smoothly-accordion-item{fill:rgb(var(--smoothly-primary-contrast))}.sc-smoothly-accordion-item-h:not([open])>details.sc-smoothly-accordion-item>summary.sc-smoothly-accordion-item>svg.sc-smoothly-accordion-item{fill:rgb(var(--smoothly-text-tint))}";
|
|
2434
2434
|
|
|
2435
2435
|
let SmoothlyAccordionItem$1 = class extends HTMLElement {
|
|
2436
2436
|
constructor() {
|
|
@@ -2475,10 +2475,10 @@ let SmoothlyAccordionItem$1 = class extends HTMLElement {
|
|
|
2475
2475
|
static get watchers() { return {
|
|
2476
2476
|
"open": ["openChanged"]
|
|
2477
2477
|
}; }
|
|
2478
|
-
static get style() { return styleCss$
|
|
2478
|
+
static get style() { return styleCss$J; }
|
|
2479
2479
|
};
|
|
2480
2480
|
|
|
2481
|
-
const styleCss$
|
|
2481
|
+
const styleCss$I = "smoothly-app{display:block;scrollbar-width:none}smoothly-app[hidden]{display:none}smoothly-app[color=default],smoothly-app:not([color]){--smoothly-app-background:var(--smoothly-default-color);--smoothly-app-color:var(--smoothly-default-contrast);--smoothly-app-hover-background:var(--smoothly-primary-color);--smoothly-app-hover-color:var(--smoothly-primary-contrast);--smoothly-app-shadow:var(--smoothly-default-shadow)}smoothly-app[color=primary]{--smoothly-app-background:var(--smoothly-primary-shade);--smoothly-app-color:var(--smoothly-primary-contrast);--smoothly-app-hover-background:var(--smoothly-secondary-color);--smoothly-app-hover-color:var(--smoothly-secondary-contrast);--smoothly-app-shadow:var(--smoothly-primary-shadow)}smoothly-app[color=secondary]{--smoothly-app-background:var(--smoothly-secondary-shade);--smoothly-app-color:var(--smoothly-secondary-contrast);--smoothly-app-hover-background:var(--smoothly-primary-color);--smoothly-app-hover-color:var(--smoothly-primary-contrast);--smoothly-app-shadow:var(--smoothly-secondary-shadow)}smoothly-app[color=tertiary],smoothly-app[color=success],smoothly-app[color=warning],smoothly-app[color=danger]{--smoothly-app-background:var(--smoothly-color-shade);--smoothly-app-color:var(--smoothly-color-contrast);--smoothly-app-hover-background:var(--smoothly-default-shade);--smoothly-app-hover-color:var(--smoothly-default-contrast);--smoothly-app-shadow:var(--smoothly-color-shadow)}smoothly-app>smoothly-notifier>header{position:fixed;top:0;left:0;width:100%;z-index:5;height:90px;background-color:rgb(var(--smoothly-app-background));color:rgba(var(--smoothly-medium-color));fill:rgb(var(--smoothly-medium-color));stroke:rgb(var(--smoothly-medium-color));display:flex;font-size:18px;justify-content:space-between;align-items:center;box-shadow:0 2px 5px 0 rgba(var(--smoothly-app-shadow));border-bottom:1px solid rgba(var(--smoothly-dark-color))}smoothly-app>smoothly-notifier>header a{color:inherit;text-decoration:inherit}smoothly-app>smoothly-notifier>header>nav{flex-shrink:0;width:100%;flex-shrink:2}smoothly-app>smoothly-notifier>header>h1,smoothly-app>smoothly-notifier>header>nav,smoothly-app>smoothly-notifier>header>nav>ul,smoothly-app>smoothly-notifier>header>nav>ul>li,smoothly-app>smoothly-notifier>header>nav>ul>li>*:not(a){display:flex;height:100%;margin:0}smoothly-app>smoothly-notifier>header>h1{margin-left:60px}smoothly-app>smoothly-notifier>header>h1>a{overflow:hidden;user-select:none;height:200%;display:flex;align-self:center;size:100%;background-position-y:center}smoothly-app>smoothly-notifier>header>nav>ul>li a{line-height:1.6cm}smoothly-app>smoothly-notifier>header>nav>ul{width:100%}smoothly-app>smoothly-notifier>header>[slot=\"header\"]{display:flex;margin-right:34.25px;justify-content:flex-end;border:0}smoothly-app>smoothly-notifier>header>[slot=\"header\"]>a{display:flex;align-self:center;border-width:0;align-items:center;margin-right:62.25px}smoothly-app>smoothly-notifier>header>[slot=\"header\"]>a>smoothly-icon{fill:rgb(var(--smoothly-primary-shade));stroke:rgb(var(--smoothly-primary-shade));color:rgb(var(--smoothly-primary-shade))}smoothly-app>smoothly-notifier>header>nav>ul>li a{display:flex;height:36px;margin:0 0.4cm;text-decoration:none}smoothly-app>smoothly-notifier>header>nav>ul>li>a{display:flex;align-items:center;align-self:center;margin-bottom:2px}smoothly-app>smoothly-notifier>header>nav>ul>li smoothly-trigger.sc-smoothly-trigger-h{border:0}smoothly-app>smoothly-notifier>header>nav>ul>li>a>smoothly-icon>svg{fill:rgb(var(--smoothly-medium-color));stroke:rgb(var(--smoothly-medium-color));color:rgb(var(--smoothly-medium-color));align-items:center;display:flex}smoothly-app>smoothly-notifier>header>nav>ul>li>a:hover>smoothly-icon>svg,smoothly-app>smoothly-notifier>header>nav>ul>li>a.active>smoothly-icon>svg{color:rgb(var(--smoothly-app-color));stroke:rgb(var(--smoothly-app-color));fill:rgb(var(--smoothly-app-color))}smoothly-app>smoothly-notifier>header>nav>ul>li>smoothly-trigger.active a>smoothly-icon,smoothly-app>smoothly-notifier>header>nav>ul>li>smoothly-trigger:hover a>smoothly-icon,smoothly-app>smoothly-notifier>header>nav>ul>li a:hover,smoothly-app>smoothly-notifier>header>nav>ul>li a.active{border-bottom:2px solid rgb(var(--smoothly-app-color));margin-bottom:0px;border-bottom-width:2px;color:rgb(var(--smoothly-app-color));stroke:rgb(var(--smoothly-app-color));fill:rgb(var(--smoothly-app-color))}smoothly-app>smoothly-notifier>content{position:relative;top:90px}";
|
|
2482
2482
|
|
|
2483
2483
|
let SmoothlyApp$1 = class extends HTMLElement {
|
|
2484
2484
|
constructor() {
|
|
@@ -2488,7 +2488,7 @@ let SmoothlyApp$1 = class extends HTMLElement {
|
|
|
2488
2488
|
render() {
|
|
2489
2489
|
return (h("smoothly-notifier", null, h("slot", null)));
|
|
2490
2490
|
}
|
|
2491
|
-
static get style() { return styleCss$
|
|
2491
|
+
static get style() { return styleCss$I; }
|
|
2492
2492
|
};
|
|
2493
2493
|
|
|
2494
2494
|
let SmoothlyAppDemo$1 = class extends HTMLElement {
|
|
@@ -2513,7 +2513,7 @@ let SmoothlyAppDemo$1 = class extends HTMLElement {
|
|
|
2513
2513
|
}
|
|
2514
2514
|
};
|
|
2515
2515
|
|
|
2516
|
-
const styleCss$
|
|
2516
|
+
const styleCss$H = ".sc-smoothly-backtotop-h{background-color:rgba(var(--smoothly-default-color), 1);opacity:var(--opacity);pointer-events:var(--pointer-events);transition:opacity 400ms;z-index:3;border-radius:50%;box-shadow:var(--smoothly-shadow);height:3rem;width:3rem;position:fixed;bottom:var(--bottom);right:var(--right);outline:none;cursor:pointer;display:flex;justify-content:center;align-items:center}";
|
|
2517
2517
|
|
|
2518
2518
|
let SmoothlyBacktotop$1 = class extends HTMLElement {
|
|
2519
2519
|
constructor() {
|
|
@@ -2541,7 +2541,7 @@ let SmoothlyBacktotop$1 = class extends HTMLElement {
|
|
|
2541
2541
|
behavior: "smooth",
|
|
2542
2542
|
}) }, h("smoothly-icon", { name: "chevron-up-outline" })));
|
|
2543
2543
|
}
|
|
2544
|
-
static get style() { return styleCss$
|
|
2544
|
+
static get style() { return styleCss$H; }
|
|
2545
2545
|
};
|
|
2546
2546
|
|
|
2547
2547
|
var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
|
|
@@ -21490,7 +21490,7 @@ function years(current) {
|
|
|
21490
21490
|
return result;
|
|
21491
21491
|
}
|
|
21492
21492
|
|
|
21493
|
-
const styleCss$
|
|
21493
|
+
const styleCss$G = ".sc-smoothly-calendar-h{display:block;--other-month-opacity:0.5}.sc-smoothly-calendar-h>smoothly-input-month.sc-smoothly-calendar{width:calc(100% - 1em);padding:0.5em 0.5em 0 0.5em}th.sc-smoothly-calendar,td.sc-smoothly-calendar{text-align:center;padding:0.5em;min-width:2em;background-color:rgb(var(--smoothly-default-shade));cursor:pointer;user-select:none}td.currentMonth.sc-smoothly-calendar{color:rgb(var(--smoothly-default-contrast))}td.sc-smoothly-calendar:not(.currentMonth){color:rgba(var(--smoothly-default-contrast), var(--other-month-opacity))}td.sc-smoothly-calendar:nth-child(6):not(.currentMonth).selected,td.sc-smoothly-calendar:nth-child(6):not(.currentMonth).dateRange,td.sc-smoothly-calendar:nth-child(7):not(.currentMonth).selected,td.sc-smoothly-calendar:nth-child(7):not(.currentMonth).dateRange{color:rgba(var(--smoothly-default-contrast))}td.sc-smoothly-calendar:nth-child(6),td.sc-smoothly-calendar:nth-child(7){color:rgb(var(--smoothly-danger-tint))}td.sc-smoothly-calendar:nth-child(6):not(.currentMonth),td.sc-smoothly-calendar:nth-child(7):not(.currentMonth){color:rgba(var(--smoothly-danger-tint), var(--other-month-opacity))}td.sc-smoothly-calendar:not(.selected,.disable).sc-smoothly-calendar:hover{color:rgb(var(--smoothly-primary-contrast));background:rgb(var(--smoothly-primary-tint))}td.selected.sc-smoothly-calendar{color:rgb(var(--smoothly-primary-contrast));background:rgb(var(--smoothly-primary-color))}td.sc-smoothly-calendar:not(.selected,.dateRange).sc-smoothly-calendar:not(:hover).today{background:rgb(var(--smoothly-dark-tint));color:rgb(var(--smoothly-dark-contrast))}td.dateRange.sc-smoothly-calendar{color:rgb(var(--smoothly-primary-contrast));background:rgb(var(--smoothly-primary-tint))}td.disable.sc-smoothly-calendar{cursor:not-allowed;background-color:rgb(var(--smoothly-default-tint), 0.5);color:rgb(var(--smoothly-default-contrast), 0.5)}";
|
|
21494
21494
|
|
|
21495
21495
|
let Calendar = class extends HTMLElement {
|
|
21496
21496
|
constructor() {
|
|
@@ -21573,7 +21573,7 @@ let Calendar = class extends HTMLElement {
|
|
|
21573
21573
|
"start": ["onStart"],
|
|
21574
21574
|
"end": ["onEnd"]
|
|
21575
21575
|
}; }
|
|
21576
|
-
static get style() { return styleCss$
|
|
21576
|
+
static get style() { return styleCss$G; }
|
|
21577
21577
|
};
|
|
21578
21578
|
|
|
21579
21579
|
var CallingCode_1 = createCommonjsModule(function (module, exports) {
|
|
@@ -40210,7 +40210,7 @@ function create(language) {
|
|
|
40210
40210
|
}, language);
|
|
40211
40211
|
}
|
|
40212
40212
|
|
|
40213
|
-
const styleCss$
|
|
40213
|
+
const styleCss$F = ".sc-smoothly-checkbox-h{display:block}[hidden].sc-smoothly-checkbox-h{display:none}smoothly-icon.sc-smoothly-checkbox{cursor:pointer}smoothly-icon.sc-smoothly-checkbox:nth-child(2){position:absolute;transform:scaleX(0.6)}[disabled].sc-smoothly-checkbox-h smoothly-icon.sc-smoothly-checkbox{stroke:rgba(var(--smoothly-color-contrast), 0.3)}";
|
|
40214
40214
|
|
|
40215
40215
|
let SmoothlyCheckbox$1 = class extends HTMLElement {
|
|
40216
40216
|
constructor() {
|
|
@@ -40237,10 +40237,10 @@ let SmoothlyCheckbox$1 = class extends HTMLElement {
|
|
|
40237
40237
|
];
|
|
40238
40238
|
}
|
|
40239
40239
|
get element() { return this; }
|
|
40240
|
-
static get style() { return styleCss$
|
|
40240
|
+
static get style() { return styleCss$F; }
|
|
40241
40241
|
};
|
|
40242
40242
|
|
|
40243
|
-
const styleCss$
|
|
40243
|
+
const styleCss$E = ".sc-smoothly-dialog-h{display:block;position:fixed;left:0;top:0;width:100%;height:100%;z-index:1;background:rgba(var(--smoothly-default-color), var(--smoothly-semitransparent)) !important}[hidden].sc-smoothly-dialog-h{display:none}.sc-smoothly-dialog-h>header.sc-smoothly-dialog{border-top-left-radius:8px;border-top-right-radius:8px;margin-top:2em;color:rgb(var(--smoothly-primary-contrast));background:rgb(var(--smoothly-primary-color));border-color:rgb(var(--smoothly-primary-color))}.sc-smoothly-dialog-h:not([header]) header.sc-smoothly-dialog{border:none}.sc-smoothly-dialog-h>*.sc-smoothly-dialog{position:relative;color:rgb(var(--smoothly-default-contrast));background-color:rgb(var(--smoothly-default-color));border-color:rgb(var(--smoothly-color));border-width:1px;border-style:solid;max-width:40em;width:calc(100vw - 4em - 2px);max-height:calc(100vh - 6em - 2px);height:auto;margin-left:auto;margin-right:auto;border-collapse:collapse}.sc-smoothly-dialog-h>main.sc-smoothly-dialog{border-bottom-left-radius:8px;border-bottom-right-radius:8px;margin-bottom:2em;border:1px solid rgb(var(--smoothly-default-contrast));box-sizing:border-box;overflow:hidden}.sc-smoothly-dialog-h:not([header]) main.sc-smoothly-dialog{border-radius:8px}.sc-smoothly-dialog-h>*.sc-smoothly-dialog>smoothly-trigger.sc-smoothly-dialog{position:absolute;right:-2em;top:-2em;z-index:1;border-color:transparent}.sc-smoothly-dialog-h>*.sc-smoothly-dialog>smoothly-trigger.sc-smoothly-dialog:hover{border-color:transparent}.sc-smoothly-dialog-h smoothly-icon.sc-smoothly-dialog{background-color:rgb(var(--smoothly-color));border-radius:50%}.sc-smoothly-dialog-h>*.sc-smoothly-dialog>*.sc-smoothly-dialog{margin:10px}";
|
|
40244
40244
|
|
|
40245
40245
|
let SmoothlyDialog$1 = class extends HTMLElement {
|
|
40246
40246
|
constructor() {
|
|
@@ -40266,7 +40266,7 @@ let SmoothlyDialog$1 = class extends HTMLElement {
|
|
|
40266
40266
|
h("main", null, h("slot", null)),
|
|
40267
40267
|
];
|
|
40268
40268
|
}
|
|
40269
|
-
static get style() { return styleCss$
|
|
40269
|
+
static get style() { return styleCss$E; }
|
|
40270
40270
|
render() { return h(Host, this.hostData(), this.__stencil_render()); }
|
|
40271
40271
|
};
|
|
40272
40272
|
|
|
@@ -41946,7 +41946,7 @@ Object.defineProperty(exports, "StateEditor", { enumerable: true, get: function
|
|
|
41946
41946
|
|
|
41947
41947
|
const index = /*@__PURE__*/getDefaultExportFromCjs(dist);
|
|
41948
41948
|
|
|
41949
|
-
const styleCss$
|
|
41949
|
+
const styleCss$D = ".sc-smoothly-display-h{display:block}[hidden].sc-smoothly-display-h{display:none}";
|
|
41950
41950
|
|
|
41951
41951
|
let SmoothlyDisplay$1 = class extends HTMLElement {
|
|
41952
41952
|
constructor() {
|
|
@@ -41975,10 +41975,10 @@ let SmoothlyDisplay$1 = class extends HTMLElement {
|
|
|
41975
41975
|
}
|
|
41976
41976
|
return result;
|
|
41977
41977
|
}
|
|
41978
|
-
static get style() { return styleCss$
|
|
41978
|
+
static get style() { return styleCss$D; }
|
|
41979
41979
|
};
|
|
41980
41980
|
|
|
41981
|
-
const styleCss$
|
|
41981
|
+
const styleCss$C = ".sc-smoothly-display-amount-h{display:block}[hidden].sc-smoothly-display-amount-h{display:none}";
|
|
41982
41982
|
|
|
41983
41983
|
let SmoothlyDisplayAmount$1 = class extends HTMLElement {
|
|
41984
41984
|
constructor() {
|
|
@@ -42026,10 +42026,10 @@ let SmoothlyDisplayAmount$1 = class extends HTMLElement {
|
|
|
42026
42026
|
this.currency,
|
|
42027
42027
|
];
|
|
42028
42028
|
}
|
|
42029
|
-
static get style() { return styleCss$
|
|
42029
|
+
static get style() { return styleCss$C; }
|
|
42030
42030
|
};
|
|
42031
42031
|
|
|
42032
|
-
const styleCss$
|
|
42032
|
+
const styleCss$B = ".sc-smoothly-display-date-time-h{display:block}[hidden].sc-smoothly-display-date-time-h{display:none}";
|
|
42033
42033
|
|
|
42034
42034
|
let SmoothlyDisplayDateTime$1 = class extends HTMLElement {
|
|
42035
42035
|
constructor() {
|
|
@@ -42040,7 +42040,7 @@ let SmoothlyDisplayDateTime$1 = class extends HTMLElement {
|
|
|
42040
42040
|
const datetime = this.datetime.split("T");
|
|
42041
42041
|
return [datetime[0], " ", datetime[1]];
|
|
42042
42042
|
}
|
|
42043
|
-
static get style() { return styleCss$
|
|
42043
|
+
static get style() { return styleCss$B; }
|
|
42044
42044
|
};
|
|
42045
42045
|
|
|
42046
42046
|
let SmoothlyDisplayDemo$1 = class extends HTMLElement {
|
|
@@ -42055,12 +42055,12 @@ let SmoothlyDisplayDemo$1 = class extends HTMLElement {
|
|
|
42055
42055
|
}
|
|
42056
42056
|
render() {
|
|
42057
42057
|
return [
|
|
42058
|
-
h("main", null, h("smoothly-popup", null, h("div", null, "Popup, click me"), h("div", { color: "dark", slot: "popup" }, "1 line popup")), h("smoothly-display-date-time", { datetime: "2019-08-15T08:08:17.65Z" }), h("dl", null, h("dt", null, "text"), h("dd", null, h("smoothly-display", { type: "text", value: "text" })), h("dt", null, "postal code"), h("dd", null, h("smoothly-display", { type: "postal-code", value: "752 31" })), h("dt", null, "password"), h("dd", null, h("smoothly-display", { type: "password", value: "password" })), h("dt", null, "email"), h("dd", null, h("smoothly-display", { type: "email", value: "test@example.com" })), h("dt", null, "price"), h("dd", null, h("smoothly-display", { type: "price", value: "13.37", currency: "SEK" })), h("dt", null, "percent"), h("dd", null, h("smoothly-display", { type: "percent", value: "42" })), h("dt", null, "phone"), h("dd", null, h("smoothly-display", { type: "phone", value: "0101881108" })), h("dt", null, "card number"), h("dd", null, h("smoothly-display", { type: "card-number", value: "4111111111111111" })), h("dt", null, "card expires"), h("dd", null, h("smoothly-display", { type: "card-expires", value: "7/22" })), h("dt", null, "card csc"), h("dd", null, h("smoothly-display", { type: "card-csc", value: "987" })), h("dt", null, "Quiet"), h("dd", null, h("smoothly-quiet", { color: "dark" }, "-"))), h("smoothly-skeleton", { period: 3, distance: "20rem", width: "20rem" }), h("smoothly-skeleton", { period: 3, distance: "20rem", color: "200,200,255" }), h("smoothly-skeleton", { period: 3, distance: "20rem", color: "var(--smoothly-warning-color)" }), h("smoothly-skeleton", { period: 3, distance: "20rem" }), h("smoothly-skeleton", { align: "center", period: 3, distance: "20rem", width: "20rem" }), h("smoothly-skeleton", { align: "center", period: 3, distance: "20rem" }), h("smoothly-skeleton", { align: "center", period: 3, distance: "20rem" }), h("smoothly-skeleton", { align: "center", period: 3, distance: "20rem" }), h("smoothly-skeleton", { align: "right", period: 3, distance: "20rem", width: "20rem" }), h("smoothly-skeleton", { align: "right", period: 3, distance: "20rem" }), h("smoothly-skeleton", { align: "right", period: 3, distance: "20rem" }), h("smoothly-skeleton", { align: "right", period: 3, distance: "20rem" }), h("smoothly-urlencoded", { data: "hej=hopp&tjena=moss" }), h("div", { style: { display: "flex", justifyContent: "space-between" } }, h("smoothly-popup", { direction: "down" }, "Click for popup", h("span", { slot: "popup", color: "dark", style: { whiteSpace: "nowrap" } }, "Some popup stuff that has a lot of text")), h("smoothly-popup", { direction: "down" }, "Click for popup", h("span", { slot: "popup", color: "dark", style: { whiteSpace: "nowrap" } }, "Some popup with a bunch of text."))), h("p", null, "Test of diffrent kinds of notifier:"), h("button", { onClick: () => this.noticeWarning(Notice.warn("This is a test warning notice.")) }, "warning"), h("button", { onClick: () => this.noticeWarning(Notice.succeded("This is a test success notice.")) }, "success"), h("button", { onClick: () => this.noticeWarning(Notice.failed("This is a test danger notice.")) }, "danger"), h("button", { onClick: () => this.noticeWarning(Notice.execute("This is a test execute notice.", () => new Promise(resolve => window.setTimeout(() => resolve([true, "This went great"]), 3000)))) }, "execute"), h("button", { onClick: () => this.noticeWarning(Notice.delay("This is a test delay notice.", () => new Promise(resolve => window.setTimeout(() => resolve([true, "This went great"]), 3000)))) }, "delay"), h("div", { style: { position: "relative", height: "10em" } }, "Large Spinner", h("smoothly-spinner", { active: true, size: "large", style: { "--background-color": "255,255,255", "--background-opacity": "0.2", "--spinner-color": "0,130,0", } })), h("div", { style: { position: "relative", height: "10em" } }, "Medium Spinner", h("smoothly-spinner", { active: true, size: "medium" })), h("div", { style: { position: "relative", height: "10em" } }, "Small Spinner", h("smoothly-spinner", { active: true, size: "small" }))),
|
|
42058
|
+
h("main", null, h("smoothly-popup", null, h("div", null, "Popup, click me"), h("div", { color: "dark", slot: "popup" }, "1 line popup")), h("smoothly-display-date-time", { datetime: "2019-08-15T08:08:17.65Z" }), h("dl", null, h("dt", null, "text"), h("dd", null, h("smoothly-display", { type: "text", value: "text" })), h("dt", null, "postal code"), h("dd", null, h("smoothly-display", { type: "postal-code", value: "752 31" })), h("dt", null, "password"), h("dd", null, h("smoothly-display", { type: "password", value: "password" })), h("dt", null, "email"), h("dd", null, h("smoothly-display", { type: "email", value: "test@example.com" })), h("dt", null, "price"), h("dd", null, h("smoothly-display", { type: "price", value: "13.37", currency: "SEK" })), h("dt", null, "percent"), h("dd", null, h("smoothly-display", { type: "percent", value: "42" })), h("dt", null, "phone"), h("dd", null, h("smoothly-display", { type: "phone", value: "0101881108" })), h("dt", null, "card number"), h("dd", null, h("smoothly-display", { type: "card-number", value: "4111111111111111" })), h("dt", null, "card expires"), h("dd", null, h("smoothly-display", { type: "card-expires", value: "7/22" })), h("dt", null, "card csc"), h("dd", null, h("smoothly-display", { type: "card-csc", value: "987" })), h("dt", null, "Quiet"), h("dd", null, h("smoothly-quiet", { color: "dark" }, "-"))), h("smoothly-skeleton", { period: 3, distance: "20rem", width: "20rem" }), h("smoothly-skeleton", { period: 3, distance: "20rem", color: "200,200,255" }), h("smoothly-skeleton", { period: 3, distance: "20rem", color: "var(--smoothly-warning-color)" }), h("smoothly-skeleton", { period: 3, distance: "20rem" }), h("smoothly-skeleton", { align: "center", period: 3, distance: "20rem", width: "20rem" }), h("smoothly-skeleton", { align: "center", period: 3, distance: "20rem" }), h("smoothly-skeleton", { align: "center", period: 3, distance: "20rem" }), h("smoothly-skeleton", { align: "center", period: 3, distance: "20rem" }), h("smoothly-skeleton", { align: "right", period: 3, distance: "20rem", width: "20rem" }), h("smoothly-skeleton", { align: "right", period: 3, distance: "20rem" }), h("smoothly-skeleton", { align: "right", period: 3, distance: "20rem" }), h("smoothly-skeleton", { align: "right", period: 3, distance: "20rem" }), h("smoothly-urlencoded", { data: "hej=hopp&tjena=moss" }), h("div", { style: { display: "flex", justifyContent: "space-between" } }, h("smoothly-popup", { direction: "down" }, "Click for popup", h("span", { slot: "popup", color: "dark", style: { whiteSpace: "nowrap" } }, "Some popup stuff that has a lot of text")), h("smoothly-popup", { direction: "down" }, "Click for popup", h("span", { slot: "popup", color: "dark", style: { whiteSpace: "nowrap" } }, "Some popup with a bunch of text."))), h("p", null, "Test of diffrent kinds of notifier:"), h("button", { onClick: () => this.noticeWarning(Notice.warn("This is a test warning notice.")) }, "warning"), h("button", { onClick: () => this.noticeWarning(Notice.succeded("This is a test success notice.")) }, "success"), h("button", { onClick: () => this.noticeWarning(Notice.failed("This is a test danger notice.")) }, "danger"), h("button", { onClick: () => this.noticeWarning(Notice.execute("This is a test execute notice.", () => new Promise(resolve => window.setTimeout(() => resolve([true, "This went great"]), 3000)))) }, "execute"), h("button", { onClick: () => this.noticeWarning(Notice.delay("This is a test delay notice.", () => new Promise(resolve => window.setTimeout(() => resolve([true, "This went great"]), 3000)))) }, "delay"), h("div", { style: { position: "relative", height: "10em" } }, "Large Spinner", h("smoothly-spinner", { active: true, size: "large", style: { "--background-color": "255,255,255", "--background-opacity": "0.2", "--spinner-color": "0,130,0", } })), h("div", { style: { position: "relative", height: "10em" } }, "Medium Spinner", h("smoothly-spinner", { active: true, size: "medium" })), h("div", { style: { position: "relative", height: "10em" } }, "Small Spinner", h("smoothly-spinner", { active: true, size: "small" })), h("div", { style: { position: "absolute", left: "500px", top: "150px" } }, h("smoothly-svg", { url: "https://theme.payfunc.com/intergiro/animated-logo.svg" }))),
|
|
42059
42059
|
];
|
|
42060
42060
|
}
|
|
42061
42061
|
};
|
|
42062
42062
|
|
|
42063
|
-
const styleCss$
|
|
42063
|
+
const styleCss$A = ".sc-smoothly-frame-h{display:block;width:100%;height:100%}[hidden].sc-smoothly-frame-h{display:none}.sc-smoothly-frame-h>iframe.sc-smoothly-frame{border:none;padding:none;margin:none}";
|
|
42064
42064
|
|
|
42065
42065
|
let SmoothlyFrame$1 = class extends HTMLElement {
|
|
42066
42066
|
constructor() {
|
|
@@ -42099,7 +42099,7 @@ let SmoothlyFrame$1 = class extends HTMLElement {
|
|
|
42099
42099
|
return h("iframe", { src: this.url + "#" + window.location.origin, height: "100%", width: "100%" });
|
|
42100
42100
|
}
|
|
42101
42101
|
get element() { return this; }
|
|
42102
|
-
static get style() { return styleCss$
|
|
42102
|
+
static get style() { return styleCss$A; }
|
|
42103
42103
|
};
|
|
42104
42104
|
|
|
42105
42105
|
let SmoothlyGoogleFont$1 = class extends HTMLElement {
|
|
@@ -42112,7 +42112,7 @@ let SmoothlyGoogleFont$1 = class extends HTMLElement {
|
|
|
42112
42112
|
}
|
|
42113
42113
|
};
|
|
42114
42114
|
|
|
42115
|
-
const styleCss$
|
|
42115
|
+
const styleCss$z = "[size].sc-smoothly-icon-h{background:none}.sc-smoothly-icon-h{display:block}[hidden].sc-smoothly-icon-h{display:none}[size=tiny].sc-smoothly-icon-h{width:1.2em;height:1.2em}[size=small].sc-smoothly-icon-h{width:1.4em;height:1.4em}[size=medium].sc-smoothly-icon-h{width:1.8em;height:1.8em}[size=large].sc-smoothly-icon-h{width:2.8em;height:2.8em}[size=xlarge].sc-smoothly-icon-h{width:4em;height:4em}";
|
|
42116
42116
|
|
|
42117
42117
|
let SmoothlyIcon$1 = class extends HTMLElement {
|
|
42118
42118
|
constructor() {
|
|
@@ -42153,12 +42153,12 @@ let SmoothlyIcon$1 = class extends HTMLElement {
|
|
|
42153
42153
|
static get watchers() { return {
|
|
42154
42154
|
"name": ["loadDocument"]
|
|
42155
42155
|
}; }
|
|
42156
|
-
static get style() { return styleCss$
|
|
42156
|
+
static get style() { return styleCss$z; }
|
|
42157
42157
|
render() { return h(Host, this.hostData(), this.__stencil_render()); }
|
|
42158
42158
|
};
|
|
42159
42159
|
SmoothlyIcon$1.cache = {};
|
|
42160
42160
|
|
|
42161
|
-
const styleCss$
|
|
42161
|
+
const styleCss$y = "icon-demo.sc-smoothly-icon-demo{display:block}icon-demo[hidden].sc-smoothly-icon-demo{display:none}icon-demo.sc-smoothly-icon-demo>content.sc-smoothly-icon-demo{display:flex;flex-flow:row wrap}icon-demo.sc-smoothly-icon-demo>content.sc-smoothly-icon-demo>*.sc-smoothly-icon-demo{margin:1cm}";
|
|
42162
42162
|
|
|
42163
42163
|
let SmoothlyIconDemo$1 = class extends HTMLElement {
|
|
42164
42164
|
constructor() {
|
|
@@ -42640,10 +42640,10 @@ let SmoothlyIconDemo$1 = class extends HTMLElement {
|
|
|
42640
42640
|
.map(name => (h("smoothly-icon", { name: name, toolTip: name })))),
|
|
42641
42641
|
];
|
|
42642
42642
|
}
|
|
42643
|
-
static get style() { return styleCss$
|
|
42643
|
+
static get style() { return styleCss$y; }
|
|
42644
42644
|
};
|
|
42645
42645
|
|
|
42646
|
-
const styleCss$
|
|
42646
|
+
const styleCss$x = ".sc-smoothly-input-h{display:block;position:relative;font-weight:var(--smoothly-font-weight);padding:var(--padding);overflow:hidden;background-color:rgb(var(--background-color));color:rgb(var(--text-color, var(--smoothly-default-contrast)))}[hidden].sc-smoothly-input-h{display:none}.sc-smoothly-input-h>div.sc-smoothly-input{position:relative;width:100%;height:100%}label.sc-smoothly-input{position:absolute;left:0.4em;top:0.6em;color:rgb(var(--text-color, var(--smoothly-default-contrast)));opacity:0.8;user-select:none;cursor:inherit;transition:transform 0.1s;transform-origin:top left;transition-timing-function:ease}.sc-smoothly-input-h:not([show-label]) label.sc-smoothly-input{display:none}.sc-smoothly-input-h:not([show-label]) input.sc-smoothly-input{padding:0.6em 0.2em 0.6em 0.2em}input.sc-smoothly-input{padding:1em 0.2em 0.2em 0.2em;box-sizing:border-box;width:100%;height:100%;background:none;border:0;z-index:1;position:relative;font-size:1rem;font-family:var(--smoothly-font-family);background-color:rgb(var(--background-color))}smoothly-icon.sc-smoothly-input{display:none;position:absolute;right:0.2em;top:0.6em}input.sc-smoothly-input:invalid+label.sc-smoothly-input+smoothly-icon.sc-smoothly-input{display:block}.sc-smoothly-input-h>div.sc-smoothly-input>label.sc-smoothly-input{z-index:1;pointer-events:none}.has-value.sc-smoothly-input-h>div.sc-smoothly-input>label.sc-smoothly-input,.sc-smoothly-input-h:focus-within>div.sc-smoothly-input>label.sc-smoothly-input{top:0.4em;transform:scale(0.6)}input.sc-smoothly-input:focus{outline:none}input.sc-smoothly-input:-webkit-autofill,input.sc-smoothly-input:-webkit-autofill:hover,input.sc-smoothly-input:-webkit-autofill:focus,input.sc-smoothly-input:-webkit-autofill:active{box-shadow:0 0 0 40em rgb(var(--background-color)) inset;-webkit-box-shadow:0 0 0 40em rgb(var(--background-color)) inset}input.sc-smoothly-input:-webkit-autofill,input.sc-smoothly-input:-webkit-autofill+label.sc-smoothly-input{-webkit-text-fill-color:rgb(var(--text-color, var(--smoothly-default-contrast)))}";
|
|
42647
42647
|
|
|
42648
42648
|
let SmoothlyInput$1 = class extends HTMLElement {
|
|
42649
42649
|
constructor() {
|
|
@@ -42829,14 +42829,14 @@ let SmoothlyInput$1 = class extends HTMLElement {
|
|
|
42829
42829
|
"value": ["valueWatcher"],
|
|
42830
42830
|
"currency": ["onCurrency"]
|
|
42831
42831
|
}; }
|
|
42832
|
-
static get style() { return styleCss$
|
|
42832
|
+
static get style() { return styleCss$x; }
|
|
42833
42833
|
};
|
|
42834
42834
|
function getLocale() {
|
|
42835
42835
|
const result = navigator.language;
|
|
42836
42836
|
return dist$3.Locale.is(result) ? result : dist$3.Language.is(result) ? dist$3.Locale.toLocale(result) : undefined;
|
|
42837
42837
|
}
|
|
42838
42838
|
|
|
42839
|
-
const styleCss$
|
|
42839
|
+
const styleCss$w = ".sc-smoothly-input-date-h{position:relative}nav.sc-smoothly-input-date{position:absolute;z-index:10;top:3.5em;background-color:rgb(var(--smoothly-default-shade));max-width:22em}.sc-smoothly-input-date-h>div.sc-smoothly-input-date{position:fixed;top:0px;left:0px;right:0px;bottom:0px;width:100vw;height:100vh;z-index:2}.sc-smoothly-input-date-h>nav.sc-smoothly-input-date>.arrow.sc-smoothly-input-date{position:absolute;z-index:9;transform:translate(2em, -.55em) rotate(45deg);width:1em;height:1em;background-color:rgb(var(--smoothly-default-shade))}";
|
|
42840
42840
|
|
|
42841
42841
|
let InputDate = class extends HTMLElement {
|
|
42842
42842
|
constructor() {
|
|
@@ -42869,10 +42869,10 @@ let InputDate = class extends HTMLElement {
|
|
|
42869
42869
|
static get watchers() { return {
|
|
42870
42870
|
"value": ["onStart"]
|
|
42871
42871
|
}; }
|
|
42872
|
-
static get style() { return styleCss$
|
|
42872
|
+
static get style() { return styleCss$w; }
|
|
42873
42873
|
};
|
|
42874
42874
|
|
|
42875
|
-
const styleCss$
|
|
42875
|
+
const styleCss$v = ".sc-smoothly-input-date-range-h{position:relative;display:block;width:fit-content}.sc-smoothly-input-date-range-h>nav.sc-smoothly-input-date-range{position:absolute;z-index:10;top:3.5em;background-color:rgb(var(--smoothly-default-shade));max-width:22em}.sc-smoothly-input-date-range-h>div.sc-smoothly-input-date-range{position:fixed;top:0px;left:0px;right:0px;bottom:0px;width:100vw;height:100vh;z-index:2}.sc-smoothly-input-date-range-h>nav.sc-smoothly-input-date-range>.arrow.sc-smoothly-input-date-range{position:absolute;z-index:9;transform:translate(10em, -0.55em) rotate(45deg);width:1em;height:1em;background-color:rgb(var(--smoothly-default-shade))}.sc-smoothly-input-date-range-h>section.sc-smoothly-input-date-range{display:flex;background-color:var(--background, transparent);border-radius:0.25rem;cursor:pointer}smoothly-input.sc-smoothly-input-date-range{border-radius:var(--border-radius, none);background-color:transparent;width:var(--input-width)}span.sc-smoothly-input-date-range{padding:0.5em 0.2em 0.5em 0.2em;align-self:center}";
|
|
42876
42876
|
|
|
42877
42877
|
let InputDateRange = class extends HTMLElement {
|
|
42878
42878
|
constructor() {
|
|
@@ -42911,7 +42911,7 @@ let InputDateRange = class extends HTMLElement {
|
|
|
42911
42911
|
static get watchers() { return {
|
|
42912
42912
|
"value": ["onValue"]
|
|
42913
42913
|
}; }
|
|
42914
|
-
static get style() { return styleCss$
|
|
42914
|
+
static get style() { return styleCss$v; }
|
|
42915
42915
|
};
|
|
42916
42916
|
|
|
42917
42917
|
let SmoothlyInputDemo$1 = class extends HTMLElement {
|
|
@@ -42927,7 +42927,7 @@ let SmoothlyInputDemo$1 = class extends HTMLElement {
|
|
|
42927
42927
|
}
|
|
42928
42928
|
};
|
|
42929
42929
|
|
|
42930
|
-
const styleCss$
|
|
42930
|
+
const styleCss$u = ".sc-smoothly-input-month-h{display:flex;justify-content:space-between;font-size:large}smoothly-icon.sc-smoothly-input-month{font-size:smaller}";
|
|
42931
42931
|
|
|
42932
42932
|
let MonthSelector = class extends HTMLElement {
|
|
42933
42933
|
constructor() {
|
|
@@ -42956,10 +42956,10 @@ let MonthSelector = class extends HTMLElement {
|
|
|
42956
42956
|
static get watchers() { return {
|
|
42957
42957
|
"value": ["onValueChanged"]
|
|
42958
42958
|
}; }
|
|
42959
|
-
static get style() { return styleCss$
|
|
42959
|
+
static get style() { return styleCss$u; }
|
|
42960
42960
|
};
|
|
42961
42961
|
|
|
42962
|
-
const styleCss$
|
|
42962
|
+
const styleCss$t = "[selected].sc-smoothly-item-h{background-color:rgb(var(--smoothly-primary-shade));color:rgb(var(--smoothly-primary-contrast))}.sc-smoothly-item-h{padding:.5em;cursor:pointer;background-color:rgb(var(--smoothly-default-shade));color:rgb(var(--smoothly-default-contrast));border:rgb(var(--smoothly-default-shade) solid 1px)}.sc-smoothly-item-h:hover{background-color:rgb(var(--smoothly-primary-color));color:rgb(var(--smoothly-primary-contrast))}";
|
|
42963
42963
|
|
|
42964
42964
|
let Item = class extends HTMLElement {
|
|
42965
42965
|
constructor() {
|
|
@@ -42993,10 +42993,10 @@ let Item = class extends HTMLElement {
|
|
|
42993
42993
|
static get watchers() { return {
|
|
42994
42994
|
"selected": ["onSelectedChanged"]
|
|
42995
42995
|
}; }
|
|
42996
|
-
static get style() { return styleCss$
|
|
42996
|
+
static get style() { return styleCss$t; }
|
|
42997
42997
|
};
|
|
42998
42998
|
|
|
42999
|
-
const styleCss$
|
|
42999
|
+
const styleCss$s = ":host{max-height:300px;width:85%;max-height:var(--max-menu-height);box-sizing:border-box;background-color:rgb(var(--smoothly-default-color));border-radius:0.25em;color:rgb(var(--smoothly-primary-color));stroke:rgb(var(--smoothly-primary-color));fill:rgb(var(--smoothly-primary-color));box-shadow:0px 2px 24px rgba(64, 60, 57, 0.08), inset 0px 0px 1px rgba(64, 60, 57, 0.4);overflow-y:auto;cursor:pointer}:host:first-child{margin:10em}";
|
|
43000
43000
|
|
|
43001
43001
|
let SmoothlyMenuOptions$1 = class extends HTMLElement {
|
|
43002
43002
|
constructor() {
|
|
@@ -43096,10 +43096,10 @@ let SmoothlyMenuOptions$1 = class extends HTMLElement {
|
|
|
43096
43096
|
static get watchers() { return {
|
|
43097
43097
|
"options": ["optionsChangeHandler"]
|
|
43098
43098
|
}; }
|
|
43099
|
-
static get style() { return styleCss$
|
|
43099
|
+
static get style() { return styleCss$s; }
|
|
43100
43100
|
};
|
|
43101
43101
|
|
|
43102
|
-
const styleCss$
|
|
43102
|
+
const styleCss$r = ".sc-smoothly-notification-h{display:block;min-width:32.6%;min-height:3em;border-radius:5px;margin:0.5em}[hidden].sc-smoothly-notification-h{display:none}smoothly-trigger.sc-smoothly-notification{float:right;text-align:right;margin-right:0.2em}";
|
|
43103
43103
|
|
|
43104
43104
|
let Notification = class extends HTMLElement {
|
|
43105
43105
|
constructor() {
|
|
@@ -43157,10 +43157,10 @@ let Notification = class extends HTMLElement {
|
|
|
43157
43157
|
static get watchers() { return {
|
|
43158
43158
|
"notice": ["onUpdatedNotice"]
|
|
43159
43159
|
}; }
|
|
43160
|
-
static get style() { return styleCss$
|
|
43160
|
+
static get style() { return styleCss$r; }
|
|
43161
43161
|
};
|
|
43162
43162
|
|
|
43163
|
-
const styleCss$
|
|
43163
|
+
const styleCss$q = ".sc-smoothly-notifier-h{display:block}[hidden].sc-smoothly-notifier-h{display:none}.sc-smoothly-notifier-h>aside.sc-smoothly-notifier{display:flex;flex-wrap:wrap-reverse;align-content:stretch;justify-content:flex-start;position:fixed;bottom:3em;left:0;text-align:center;width:100%;z-index:100}";
|
|
43164
43164
|
|
|
43165
43165
|
let Notifier = class extends HTMLElement {
|
|
43166
43166
|
constructor() {
|
|
@@ -43180,10 +43180,10 @@ let Notifier = class extends HTMLElement {
|
|
|
43180
43180
|
h("aside", null, this.notices.map(n => (h("smoothly-notification", { notice: n })))),
|
|
43181
43181
|
];
|
|
43182
43182
|
}
|
|
43183
|
-
static get style() { return styleCss$
|
|
43183
|
+
static get style() { return styleCss$q; }
|
|
43184
43184
|
};
|
|
43185
43185
|
|
|
43186
|
-
const styleCss$
|
|
43186
|
+
const styleCss$p = ":host{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;padding:0.7em 1em;margin-left:1px;margin-right:1px;background-color:transparent;position:relative}:host([data-highlight]){background-color:rgb(var(--smoothly-default-shade))}:host>div.middle{padding-left:0.5em;flex-shrink:1;width:100%}:host([divider]){margin-bottom:0.5em}::slotted([slot=right]){font-style:italic;white-space:nowrap}:host([divider])::after{position:absolute;height:1px;width:100%;left:0;bottom:-0.25em;content:\"\";background-color:rgba(var(--smoothly-dark-color))}";
|
|
43187
43187
|
|
|
43188
43188
|
let SmoothlyOption$1 = class extends HTMLElement {
|
|
43189
43189
|
constructor() {
|
|
@@ -43208,10 +43208,10 @@ let SmoothlyOption$1 = class extends HTMLElement {
|
|
|
43208
43208
|
return (h(Host, { onMouseDown: (e) => this.onSelect(e), onMouseOver: (e) => this.onHover(e) }, h("slot", { name: "left" }), h("div", { class: "middle" }, this.name), h("slot", { name: "right" })));
|
|
43209
43209
|
}
|
|
43210
43210
|
get element() { return this; }
|
|
43211
|
-
static get style() { return styleCss$
|
|
43211
|
+
static get style() { return styleCss$p; }
|
|
43212
43212
|
};
|
|
43213
43213
|
|
|
43214
|
-
const styleCss$
|
|
43214
|
+
const styleCss$o = ":host{--background-color:var(--smoothly-default-color), 1;--color:var(--smoothly-secondary-contrast);--border-color:var(--smoothly-default-shade), 1;--border-highlight-color:var(--smoothly-secondary-contrast), 1;--label-color:var(--smoothly-secondary-contrast), 0.8;--selected-item-border-radius:0.25rem;--selected-item-background-color:var(--smoothly-secondary-color), 1;--selected-item-color:255, 255, 255, 1}:host{display:block;position:relative;background-color:rgba(var(--background-color));width:100%;cursor:pointer;--intergiro-transition:border-color 200ms cubic-bezier(0.645, 0.045, 0.355, 1);transition:var(--intergiro-transition);border:1px solid rgb(var(--border-color));margin:1px;height:40px;border-radius:0.25rem}:host(:focus-within){border-color:rgb(var(--smoothly-primary-shade));border-width:2px;margin:0px}:host>div{display:flex;background-color:transparent;min-height:40px;align-items:center;align-self:center;border:none;max-height:var(--max-height)}:host>div .icons>smoothly-icon{flex-shrink:0;padding-left:0.6em;stroke:rgba(var(--color), 0.4);fill:rgba(var(--color), 0.4);width:1.5em !important;height:1.5em !important}:host>div .icons>smoothly-icon:hover{fill:rgba(var(--color), 1)}:host>div input{width:100%;background-color:transparent;outline:none;border:none;cursor:pointer;color:rgb(var(--color));padding:0 0.6em;font-family:var(--smoothly-font-family);font-size:1.05em}:host>div input::placeholder{opacity:1;text-overflow:ellipsis}:host([is-open])>div input{color:rgb(var(--smoothly-medium-color))}:host(:not(:focus-within)[multiple]) ul>li:last-child{position:absolute;pointer-events:none}:host([label=\"\"]) ul,:host:not([label]) ul,:host([label-setting=hide]) ul{padding-top:0.1em;padding-bottom:0.1em}label{padding-left:0.6em;white-space:nowrap;color:rgba(var(--label-color));transition:var(--intergiro-transition);font-family:var(--smoothly-font-family);pointer-events:none;transform-origin:left}:host([has-selection]) label{display:var(--label-display)}:host([has-selection]) label,:host(:focus-within) label{display:none}:host(:hover) smoothly-icon[data-arrow],:host(:focus-within) smoothly-icon[data-arrow]{stroke:rgba(var(--color), 1)}:host smoothly-icon[data-arrow]{pointer-events:none}:host smoothly-icon{flex-shrink:0;width:1em;height:1em}:host(:not([is-open])) smoothly-icon.up,:host([is-open]) smoothly-icon.down{display:none}smoothly-icon.search{display:flex;align-self:center;padding-left:0.8em}smoothly-icon.up,smoothly-icon.down{display:flex;align-self:center;padding-right:0.8em;stroke:rgb(var(--smoothly-primary-shade))}:host smoothly-menu-options{margin-top:0.5em;padding-top:0.5em;padding-bottom:0.5em;position:absolute;z-index:1}:host(:not([is-open]))>smoothly-menu-options{display:none}";
|
|
43215
43215
|
|
|
43216
43216
|
let SmoothlyPicker$1 = class extends HTMLElement {
|
|
43217
43217
|
constructor() {
|
|
@@ -43354,10 +43354,10 @@ let SmoothlyPicker$1 = class extends HTMLElement {
|
|
|
43354
43354
|
"selections": ["isOpenChangeHander"],
|
|
43355
43355
|
"isOpen": ["isOpenChangeHander"]
|
|
43356
43356
|
}; }
|
|
43357
|
-
static get style() { return styleCss$
|
|
43357
|
+
static get style() { return styleCss$o; }
|
|
43358
43358
|
};
|
|
43359
43359
|
|
|
43360
|
-
const styleCss$
|
|
43360
|
+
const styleCss$n = ".sc-smoothly-popup-h{display:inline-flex;position:relative}[hidden].sc-smoothly-popup-h{display:none}.sc-smoothly-popup-h:not([visible]) aside.sc-smoothly-popup{display:none}.sc-smoothly-popup-h aside.sc-smoothly-popup{display:inline;position:absolute;padding:0.3em;left:var(--left);right:var(--right);background-color:rgb(238, 238, 238);border-color:rgb(238, 238, 238);border-style:solid;border-width:0.1em;border-radius:0.6em;z-index:3}[direction=down].sc-smoothly-popup-h aside.sc-smoothly-popup{top:2.2em;box-shadow:6px 5px 9px -9px black, 5px 6px 9px -9px black}[direction=up].sc-smoothly-popup-h aside.sc-smoothly-popup{bottom:2.2em;box-shadow:-6px -5px 9px -9px black, -5px -6px 9px -9px black}.sc-smoothly-popup-h:not([visible]) .background.sc-smoothly-popup{display:none}.sc-smoothly-popup-h .background.sc-smoothly-popup{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:2}.sc-smoothly-popup-h:not([visible]) .arrow.sc-smoothly-popup{display:none}.sc-smoothly-popup-h .arrow.sc-smoothly-popup{background-color:rgb(238, 238, 238);border-color:rgb(238, 238, 238);z-index:2;content:\"\";position:absolute;width:12px;height:12px;transform:rotate(45deg);left:calc(var(--left) + 1em);right:calc(var(--right) + 1em)}[direction=down].sc-smoothly-popup-h .arrow.sc-smoothly-popup{top:2em;border-top-style:solid;border-top-width:1px;border-left-style:solid;border-left-width:1px}[direction=up].sc-smoothly-popup-h .arrow.sc-smoothly-popup{bottom:2em;border-bottom-style:solid;border-bottom-width:1px;border-right-style:solid;border-right-width:1px}.sc-smoothly-popup-h .pointer.sc-smoothly-popup{cursor:pointer}";
|
|
43361
43361
|
|
|
43362
43362
|
let SmoothlyPopup$1 = class extends HTMLElement {
|
|
43363
43363
|
constructor() {
|
|
@@ -43386,10 +43386,10 @@ let SmoothlyPopup$1 = class extends HTMLElement {
|
|
|
43386
43386
|
render() {
|
|
43387
43387
|
return (h(Host, { style: Object.assign({}, this.cssVariables) }, h("content", { class: "pointer", onClick: () => this.onClick() }, h("slot", null)), h("div", { class: "background", onClick: () => this.onClick() }), h("div", { class: "arrow", onClick: () => this.onClick() }), h("aside", { ref: el => (this.aside = el) }, h("slot", { name: "popup" }))));
|
|
43388
43388
|
}
|
|
43389
|
-
static get style() { return styleCss$
|
|
43389
|
+
static get style() { return styleCss$n; }
|
|
43390
43390
|
};
|
|
43391
43391
|
|
|
43392
|
-
const styleCss$
|
|
43392
|
+
const styleCss$m = ".sc-smoothly-quiet-h{opacity:0.5}";
|
|
43393
43393
|
|
|
43394
43394
|
let SmoothlyQuiet$1 = class extends HTMLElement {
|
|
43395
43395
|
constructor() {
|
|
@@ -43399,10 +43399,10 @@ let SmoothlyQuiet$1 = class extends HTMLElement {
|
|
|
43399
43399
|
render() {
|
|
43400
43400
|
return (h(Host, { color: this.color }, h("slot", null)));
|
|
43401
43401
|
}
|
|
43402
|
-
static get style() { return styleCss$
|
|
43402
|
+
static get style() { return styleCss$m; }
|
|
43403
43403
|
};
|
|
43404
43404
|
|
|
43405
|
-
const styleCss$
|
|
43405
|
+
const styleCss$l = ".sc-smoothly-radio-h{display:block;position:relative}[hidden].sc-smoothly-radio-h{display:none}label.sc-smoothly-radio{display:block;width:calc(100% - 2 * 0.4em);padding:0.2em 0.4em 0.2em 0.4em}input[type=radio].sc-smoothly-radio{position:absolute;left:0;top:0;width:calc(100%);height:100%;margin:0;appearance:none;-webkit-appearance:none}input[type=radio].sc-smoothly-radio~label.sc-smoothly-radio{border:1px solid rgb(var(--smoothly-default-color));color:rgba(var(--smoothly-default-contrast), 0.5);background:rgb(var(--smoothly-default-color))}input[type=radio].sc-smoothly-radio:checked~label.sc-smoothly-radio{background-color:rgb(var(--smoothly-default-shade));color:rgb(var(--smoothly-default-contrast))}";
|
|
43406
43406
|
|
|
43407
43407
|
let SmoothlyRadio$1 = class extends HTMLElement {
|
|
43408
43408
|
constructor() {
|
|
@@ -43421,10 +43421,10 @@ let SmoothlyRadio$1 = class extends HTMLElement {
|
|
|
43421
43421
|
h("label", { htmlFor: this.value }, h("slot", null)),
|
|
43422
43422
|
];
|
|
43423
43423
|
}
|
|
43424
|
-
static get style() { return styleCss$
|
|
43424
|
+
static get style() { return styleCss$l; }
|
|
43425
43425
|
};
|
|
43426
43426
|
|
|
43427
|
-
const styleCss$
|
|
43427
|
+
const styleCss$k = "smoothly-radio-group{display:flex;position:relative;color:none !important;background:none !important;margin:0.5em 0}smoothly-radio-group[hidden]{display:none}smoothly-radio-group[orientation=vertical] *:not(:first-of-type)>input[type=radio]~label{border-top:none}smoothly-radio-group:not([orientation=vertical]) *:not(:first-of-type)>input[type=radio]~label{border-left:none}smoothly-radio-group[orientation=vertical]{flex-direction:column}smoothly-radio-group[orientation=vertical] :first-of-type>input[type=radio]~label{border-radius:4px 4px 0 0}smoothly-radio-group[orientation=vertical] :last-of-type>input[type=radio]~label{border-radius:0 0 4px 4px}smoothly-radio-group:not([orientation=vertical]){flex-direction:row}smoothly-radio-group:not([orientation=vertical]) :first-of-type>input[type=radio]~label{border-radius:4px 0 0 4px}smoothly-radio-group:not([orientation=vertical]) :last-of-type>input[type=radio]~label{border-radius:0 4px 4px 0}";
|
|
43428
43428
|
|
|
43429
43429
|
let SmoothlyToggleGroup = class extends HTMLElement {
|
|
43430
43430
|
constructor() {
|
|
@@ -43435,10 +43435,10 @@ let SmoothlyToggleGroup = class extends HTMLElement {
|
|
|
43435
43435
|
render() {
|
|
43436
43436
|
return h("slot", null);
|
|
43437
43437
|
}
|
|
43438
|
-
static get style() { return styleCss$
|
|
43438
|
+
static get style() { return styleCss$k; }
|
|
43439
43439
|
};
|
|
43440
43440
|
|
|
43441
|
-
const styleCss$
|
|
43441
|
+
const styleCss$j = "smoothly-reorder>*{cursor:move;transition:transform 0.3s}smoothly-reorder>*.dragging{transition:none;box-shadow:0 0 10px rgba(var(--smoothly-dark-color));z-index:1;user-select:none}";
|
|
43442
43442
|
|
|
43443
43443
|
let SmoothlyReorder$1 = class extends HTMLElement {
|
|
43444
43444
|
constructor() {
|
|
@@ -43532,7 +43532,7 @@ let SmoothlyReorder$1 = class extends HTMLElement {
|
|
|
43532
43532
|
});
|
|
43533
43533
|
}
|
|
43534
43534
|
get element() { return this; }
|
|
43535
|
-
static get style() { return styleCss$
|
|
43535
|
+
static get style() { return styleCss$j; }
|
|
43536
43536
|
};
|
|
43537
43537
|
|
|
43538
43538
|
let SmoothlyRoom$1 = class extends HTMLElement {
|
|
@@ -43545,7 +43545,7 @@ let SmoothlyRoom$1 = class extends HTMLElement {
|
|
|
43545
43545
|
}
|
|
43546
43546
|
};
|
|
43547
43547
|
|
|
43548
|
-
const styleCss$
|
|
43548
|
+
const styleCss$i = ".sc-smoothly-select-h{display:block}[hidden].sc-smoothly-select-h{display:none}select.sc-smoothly-select{min-width:1.5em;padding-top:0.5em;border:none;-webkit-appearance:none;background-color:rgb(var(--smoothly-color));padding:0.3em}select.sc-smoothly-select>option.sc-smoothly-select{background-color:inherit}select.sc-smoothly-select:focus{outline:none}";
|
|
43549
43549
|
|
|
43550
43550
|
let SmoothlySelect$1 = class extends HTMLElement {
|
|
43551
43551
|
constructor() {
|
|
@@ -43567,10 +43567,10 @@ let SmoothlySelect$1 = class extends HTMLElement {
|
|
|
43567
43567
|
h("select", { ref: e => (this.selectElement = e), id: this.identifier, onChange: () => this.optionSelected(), style: { background: this.background } }, h("slot", null)),
|
|
43568
43568
|
];
|
|
43569
43569
|
}
|
|
43570
|
-
static get style() { return styleCss$
|
|
43570
|
+
static get style() { return styleCss$i; }
|
|
43571
43571
|
};
|
|
43572
43572
|
|
|
43573
|
-
const styleCss$
|
|
43573
|
+
const styleCss$h = ".sc-smoothly-select-demo-h{display:block}[hidden].sc-smoothly-select-demo-h{display:none}button.sc-smoothly-select-demo:focus{outline:none}smoothly-selector.sc-smoothly-select-demo{outline:none}";
|
|
43574
43574
|
|
|
43575
43575
|
let SmoothlySelectDemo$1 = class extends HTMLElement {
|
|
43576
43576
|
constructor() {
|
|
@@ -43647,10 +43647,10 @@ let SmoothlySelectDemo$1 = class extends HTMLElement {
|
|
|
43647
43647
|
h("smoothly-tab-switch", null, h("smoothly-tab", { label: "test1", open: true }, "Hello world!"), h("smoothly-tab", { label: "test2" }, "this is a test message!"), h("smoothly-tab", { label: "test3" }, "this is a test message again!")),
|
|
43648
43648
|
];
|
|
43649
43649
|
}
|
|
43650
|
-
static get style() { return styleCss$
|
|
43650
|
+
static get style() { return styleCss$h; }
|
|
43651
43651
|
};
|
|
43652
43652
|
|
|
43653
|
-
const styleCss$
|
|
43653
|
+
const styleCss$g = ".sc-smoothly-selector-h{position:relative;height:100%}.sc-smoothly-selector-h>main.sc-smoothly-selector,.sc-smoothly-selector-h>main.sc-smoothly-selector>*.sc-smoothly-selector{height:100%;display:flex;align-items:center}.sc-smoothly-selector-h>div.sc-smoothly-selector>nav.sc-smoothly-selector{display:flex;flex-direction:column;position:absolute;z-index:10}.sc-smoothly-selector-h>aside.sc-smoothly-selector{position:absolute;top:0;left:5em;z-index:10;background-color:rgb(var(--smoothly-tertiary-color));color:rgb(var(--smoothly-tertiary-contrast));height:20px;border-radius:5px;padding:5px;display:flex;align-items:center}.missing.sc-smoothly-selector-h>aside.sc-smoothly-selector{background-color:rgb(var(--smoothly-warning-color));color:rgb(var(--smoothly-warning-contast))}.hidden.sc-smoothly-selector{display:none}.sc-smoothly-selector-h>section.sc-smoothly-selector{position:fixed;top:0px;left:0px;width:100vw;height:100vh;z-index:10}";
|
|
43654
43654
|
|
|
43655
43655
|
let Selector = class extends HTMLElement {
|
|
43656
43656
|
constructor() {
|
|
@@ -43755,7 +43755,7 @@ let Selector = class extends HTMLElement {
|
|
|
43755
43755
|
"selectedElement": ["onSelectedChange"],
|
|
43756
43756
|
"filter": ["onFilterChange"]
|
|
43757
43757
|
}; }
|
|
43758
|
-
static get style() { return styleCss$
|
|
43758
|
+
static get style() { return styleCss$g; }
|
|
43759
43759
|
};
|
|
43760
43760
|
function isItem(value) {
|
|
43761
43761
|
return (typeof value == "object" &&
|
|
@@ -43763,7 +43763,7 @@ function isItem(value) {
|
|
|
43763
43763
|
typeof value.filter == "function");
|
|
43764
43764
|
}
|
|
43765
43765
|
|
|
43766
|
-
const styleCss$
|
|
43766
|
+
const styleCss$f = ".sc-smoothly-skeleton-h{display:block;height:1rem}.sc-smoothly-skeleton-h::before{content:\"\";display:block;width:var(--width);height:100%;border-radius:0.4rem;background-image:linear-gradient(90deg, rgb(var(--color, var(--smoothly-dark-color))) 0, transparent 2.5rem, rgb(var(--color, var(--smoothly-dark-color))) 5rem);background-size:calc(var(--distance) + 5rem);animation-duration:var(--period, 1.6s);animation-iteration-count:infinite;animation-timing-function:linear;animation-name:shine-lines-left}@keyframes shine-lines-left{0%{background-position:-5rem}40%,100%{background-position:var(--distance)}}[align=center].sc-smoothly-skeleton-h::before{margin:0 auto;animation-name:shine-lines-center}@keyframes shine-lines-center{0%{background-position:calc((var(--width) - var(--distance)) / 2 - 5rem)}40%,100%{background-position:calc(var(--width) + (var(--distance) - var(--width)) / 2)}}[align=right].sc-smoothly-skeleton-h::before{margin:0;margin-left:auto;animation-name:shine-lines-right}@keyframes shine-lines-right{0%{background-position:calc(var(--width) - var(--distance) - 5rem)}40%,100%{background-position:var(--width)}}";
|
|
43767
43767
|
|
|
43768
43768
|
let SmoothlySkeleton$1 = class extends HTMLElement {
|
|
43769
43769
|
constructor() {
|
|
@@ -43781,10 +43781,10 @@ let SmoothlySkeleton$1 = class extends HTMLElement {
|
|
|
43781
43781
|
const cssVariables = Object.assign(Object.assign({ "--width": this.width, "--distance": (_a = this.distance) !== null && _a !== void 0 ? _a : "10rem" }, (this.color ? { "--color": this.color } : undefined)), (this.period ? { "--period": this.period + "s" } : undefined));
|
|
43782
43782
|
return h(Host, { style: cssVariables });
|
|
43783
43783
|
}
|
|
43784
|
-
static get style() { return styleCss$
|
|
43784
|
+
static get style() { return styleCss$f; }
|
|
43785
43785
|
};
|
|
43786
43786
|
|
|
43787
|
-
const styleCss$
|
|
43787
|
+
const styleCss$e = ".sc-smoothly-spinner-h:not([active]){display:none}[hidden].sc-smoothly-spinner-h{display:none}.sc-smoothly-spinner-h{display:block;stroke:rgb(var(--spinner-color, var(--smoothly-primary-tint)));position:absolute;inset:0;width:100%;height:100%;background-color:rgba(var(--background-color, var(--smoothly-default-color)), var(--background-opacity, var(--smoothly-semitransparent, 0.8)))}.sc-smoothly-spinner-h svg.sc-smoothly-spinner{position:absolute;left:calc(50% - var(--size) / 2);top:calc(50% - var(--size) / 2);width:var(--size);animation:SPIN-SVG 1.4s linear infinite}.sc-smoothly-spinner-h svg.sc-smoothly-spinner circle.sc-smoothly-spinner{transform-origin:center;animation:SPIN-CIRCLE 1.4s ease-in-out infinite;stroke-dasharray:187;stroke-dashoffset:0}@keyframes SPIN-SVG{0%{transform:rotate(0deg)}100%{transform:rotate(270deg)}}@keyframes SPIN-CIRCLE{0%{stroke-dashoffset:187}50%{stroke-dashoffset:46.75;transform:rotate(135deg)}100%{stroke-dashoffset:187;transform:rotate(450deg)}}";
|
|
43788
43788
|
|
|
43789
43789
|
let SmoothlySpinner$1 = class extends HTMLElement {
|
|
43790
43790
|
constructor() {
|
|
@@ -43799,10 +43799,10 @@ let SmoothlySpinner$1 = class extends HTMLElement {
|
|
|
43799
43799
|
"--size": this.size == "large" ? "5em" : this.size == "medium" ? "3em" : "1.2em",
|
|
43800
43800
|
} }, h("svg", { class: "spinner", viewBox: `0 0 ${60 + strokeWidth} ${60 + strokeWidth}`, xmlns: "http://www.w3.org/2000/svg" }, h("circle", { class: "path", fill: "none", "stroke-width": strokeWidth, "stroke-linecap": "round", cx: `${30 + strokeWidth / 2}`, cy: `${30 + strokeWidth / 2}`, r: "30" }))));
|
|
43801
43801
|
}
|
|
43802
|
-
static get style() { return styleCss$
|
|
43802
|
+
static get style() { return styleCss$e; }
|
|
43803
43803
|
};
|
|
43804
43804
|
|
|
43805
|
-
const styleCss$
|
|
43805
|
+
const styleCss$d = ".sc-smoothly-submit-h{display:block;border-width:1px;border-style:solid;border-radius:3px}[hidden].sc-smoothly-submit-h{display:none}[disabled].sc-smoothly-submit-h{opacity:0.5}button.sc-smoothly-submit{padding:0.2em 0.3em;font-size:110%;font-weight:400}[processing].sc-smoothly-submit-h{border-color:rgb(var(--smoothly-light-color))}[processing].sc-smoothly-submit-h>button.sc-smoothly-submit{color:rgb(var(--smoothly-light-contrast));background:rgb(var(--smoothly-light-color))}.sc-smoothly-submit-h:not([processing]):not([disabled]):hover,.sc-smoothly-submit-h:not([processing]):not([disabled]):focus,.sc-smoothly-submit-h:not([processing]):not([disabled]):active{border-color:rgb(var(--smoothly-submit-border))}[expand=fill].sc-smoothly-submit-h>button.sc-smoothly-submit,[expand=block].sc-smoothly-submit-h>button.sc-smoothly-submit{width:100%}[expand=fill].sc-smoothly-submit-h{border-left:none;border-right:none}";
|
|
43806
43806
|
|
|
43807
43807
|
let SmoothlySubmit$1 = class extends HTMLElement {
|
|
43808
43808
|
constructor() {
|
|
@@ -43850,12 +43850,47 @@ let SmoothlySubmit$1 = class extends HTMLElement {
|
|
|
43850
43850
|
h("button", { type: "submit", disabled: this.disabled || this.processing, ref: (element) => (this.button = element) }, h("slot", null)),
|
|
43851
43851
|
];
|
|
43852
43852
|
}
|
|
43853
|
-
static get style() { return styleCss$
|
|
43853
|
+
static get style() { return styleCss$d; }
|
|
43854
43854
|
};
|
|
43855
43855
|
function hasNameAndValue(element) {
|
|
43856
43856
|
return (typeof element.name == "string" && typeof element.value == "string");
|
|
43857
43857
|
}
|
|
43858
43858
|
|
|
43859
|
+
const styleCss$c = ".sc-smoothly-svg-h{display:block;min-width:var(--size-width);min-height:var(--size-height);background-color:rgb(var(--color))}object.sc-smoothly-svg{min-width:var(--size-width);min-height:var(--size-height);background-color:rgb(var(--color))}";
|
|
43860
|
+
|
|
43861
|
+
let SmoothlySvg$1 = class extends HTMLElement {
|
|
43862
|
+
constructor() {
|
|
43863
|
+
super();
|
|
43864
|
+
this.__registerHost();
|
|
43865
|
+
this.defaultSizes = {
|
|
43866
|
+
large: { height: "50rem", width: "50rem" },
|
|
43867
|
+
medium: { height: "30rem", width: "30rem" },
|
|
43868
|
+
small: { height: "10rem", width: "10rem" },
|
|
43869
|
+
tiny: { height: "5rem", width: "5rem" },
|
|
43870
|
+
};
|
|
43871
|
+
}
|
|
43872
|
+
render() {
|
|
43873
|
+
const height = this.size
|
|
43874
|
+
? typeof this.size == "object"
|
|
43875
|
+
? this.size.height
|
|
43876
|
+
: this.defaultSizes[this.size].height
|
|
43877
|
+
: "10rem";
|
|
43878
|
+
const width = this.size
|
|
43879
|
+
? typeof this.size == "object"
|
|
43880
|
+
? this.size.width
|
|
43881
|
+
: this.defaultSizes[this.size].width
|
|
43882
|
+
: "10rem";
|
|
43883
|
+
return (h(Host, { style: {
|
|
43884
|
+
"min-height": height,
|
|
43885
|
+
"min-width": width,
|
|
43886
|
+
"--size-height": height,
|
|
43887
|
+
"--size-width": width,
|
|
43888
|
+
"--color": this.color,
|
|
43889
|
+
} }, h("object", { height: height, width: width, type: "image/svg+xml", data: this.url })));
|
|
43890
|
+
}
|
|
43891
|
+
static get style() { return styleCss$c; }
|
|
43892
|
+
};
|
|
43893
|
+
|
|
43859
43894
|
const styleCss$b = ".sc-smoothly-tab-h:not([open])>label.sc-smoothly-tab{background-color:rgb(var(--smoothly-dark-shade))}.hide.sc-smoothly-tab{display:none}label.sc-smoothly-tab{display:block;padding:1em;background-color:rgb(var(--smoothly-default-shade));border-top-left-radius:5px;border-top-right-radius:5px;width:100px}div.sc-smoothly-tab{background-color:rgb(var(--smoothly-default-shade));padding:1em}";
|
|
43860
43895
|
|
|
43861
43896
|
let SmoothlyTab$1 = class extends HTMLElement {
|
|
@@ -44237,6 +44272,7 @@ const SmoothlySelector = /*@__PURE__*/proxyCustomElement(Selector, [6,"smoothly-
|
|
|
44237
44272
|
const SmoothlySkeleton = /*@__PURE__*/proxyCustomElement(SmoothlySkeleton$1, [2,"smoothly-skeleton",{"widths":[16],"width":[1],"color":[1],"period":[2],"distance":[1],"align":[513]}]);
|
|
44238
44273
|
const SmoothlySpinner = /*@__PURE__*/proxyCustomElement(SmoothlySpinner$1, [2,"smoothly-spinner",{"active":[516],"size":[513]}]);
|
|
44239
44274
|
const SmoothlySubmit = /*@__PURE__*/proxyCustomElement(SmoothlySubmit$1, [6,"smoothly-submit",{"processing":[1540],"color":[513],"expand":[513],"fill":[513],"disabled":[516],"prevent":[4]},[[0,"click","handleSubmit"]]]);
|
|
44275
|
+
const SmoothlySvg = /*@__PURE__*/proxyCustomElement(SmoothlySvg$1, [2,"smoothly-svg",{"url":[513],"size":[513],"color":[1]}]);
|
|
44240
44276
|
const SmoothlyTab = /*@__PURE__*/proxyCustomElement(SmoothlyTab$1, [6,"smoothly-tab",{"label":[1],"open":[1540]},[[0,"click","onClick"]]]);
|
|
44241
44277
|
const SmoothlyTabSwitch = /*@__PURE__*/proxyCustomElement(SmoothlyTabSwitch$1, [6,"smoothly-tab-switch",{"selectedElement":[32]},[[0,"expansionOpen","openChanged"]]]);
|
|
44242
44278
|
const SmoothlyTable = /*@__PURE__*/proxyCustomElement(Table, [6,"smoothly-table",null,[[0,"sort","onSort"]]]);
|
|
@@ -44294,6 +44330,7 @@ const defineCustomElements = (opts) => {
|
|
|
44294
44330
|
SmoothlySkeleton,
|
|
44295
44331
|
SmoothlySpinner,
|
|
44296
44332
|
SmoothlySubmit,
|
|
44333
|
+
SmoothlySvg,
|
|
44297
44334
|
SmoothlyTab,
|
|
44298
44335
|
SmoothlyTabSwitch,
|
|
44299
44336
|
SmoothlyTable,
|
|
@@ -44316,4 +44353,4 @@ const defineCustomElements = (opts) => {
|
|
|
44316
44353
|
}
|
|
44317
44354
|
};
|
|
44318
44355
|
|
|
44319
|
-
export { App, ClientIdentifier, Cosmetic, GoogleFont, Message, Notice, SmoothlyAccordion, SmoothlyAccordionItem, SmoothlyApp, SmoothlyAppDemo, SmoothlyBacktotop, SmoothlyCalendar, SmoothlyCheckbox, SmoothlyDialog, SmoothlyDialogDemo, SmoothlyDisplay, SmoothlyDisplayAmount, SmoothlyDisplayDateTime, SmoothlyDisplayDemo, SmoothlyFrame, SmoothlyGoogleFont, SmoothlyIcon, SmoothlyIconDemo, SmoothlyInput, SmoothlyInputDate, SmoothlyInputDateRange, SmoothlyInputDemo, SmoothlyInputMonth, SmoothlyItem, SmoothlyMenuOptions, SmoothlyNotification, SmoothlyNotifier, SmoothlyOption, SmoothlyPicker, SmoothlyPopup, SmoothlyQuiet, SmoothlyRadio, SmoothlyRadioGroup, SmoothlyReorder, SmoothlyRoom, SmoothlySelect, SmoothlySelectDemo, SmoothlySelector, SmoothlySkeleton, SmoothlySpinner, SmoothlySubmit, SmoothlyTab, SmoothlyTabSwitch, SmoothlyTable, SmoothlyTableCell, SmoothlyTableDemo, SmoothlyTableExpandableCell, SmoothlyTableExpandableRow, SmoothlyTableHeader, SmoothlyTableRow, SmoothlyTrigger, SmoothlyTriggerSink, SmoothlyTriggerSource, SmoothlyTuple, SmoothlyUrlencoded, Trigger, defineCustomElements };
|
|
44356
|
+
export { App, ClientIdentifier, Cosmetic, GoogleFont, Message, Notice, SmoothlyAccordion, SmoothlyAccordionItem, SmoothlyApp, SmoothlyAppDemo, SmoothlyBacktotop, SmoothlyCalendar, SmoothlyCheckbox, SmoothlyDialog, SmoothlyDialogDemo, SmoothlyDisplay, SmoothlyDisplayAmount, SmoothlyDisplayDateTime, SmoothlyDisplayDemo, SmoothlyFrame, SmoothlyGoogleFont, SmoothlyIcon, SmoothlyIconDemo, SmoothlyInput, SmoothlyInputDate, SmoothlyInputDateRange, SmoothlyInputDemo, SmoothlyInputMonth, SmoothlyItem, SmoothlyMenuOptions, SmoothlyNotification, SmoothlyNotifier, SmoothlyOption, SmoothlyPicker, SmoothlyPopup, SmoothlyQuiet, SmoothlyRadio, SmoothlyRadioGroup, SmoothlyReorder, SmoothlyRoom, SmoothlySelect, SmoothlySelectDemo, SmoothlySelector, SmoothlySkeleton, SmoothlySpinner, SmoothlySubmit, SmoothlySvg, SmoothlyTab, SmoothlyTabSwitch, SmoothlyTable, SmoothlyTableCell, SmoothlyTableDemo, SmoothlyTableExpandableCell, SmoothlyTableExpandableRow, SmoothlyTableHeader, SmoothlyTableRow, SmoothlyTrigger, SmoothlyTriggerSink, SmoothlyTriggerSource, SmoothlyTuple, SmoothlyUrlencoded, Trigger, defineCustomElements };
|