smoothly 0.2.10 → 0.2.11
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/{Notice-a540b9fb.js → index-2a011313.js} +380 -4
- package/dist/cjs/index.cjs.js +9 -372
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/{smoothly-accordion_51.cjs.entry.js → smoothly-accordion_50.cjs.entry.js} +90 -108
- package/dist/cjs/smoothly-svg.cjs.entry.js +41 -0
- package/dist/cjs/smoothly.cjs.js +1 -1
- package/dist/collection/components/App.js +9 -4
- package/dist/collection/components/app-demo/index.js +10 -0
- package/dist/collection/components/display-demo/index.js +16 -12
- package/dist/collection/components/input-date/index.js +18 -1
- package/dist/collection/components/input-demo/index.js +3 -1
- package/dist/collection/components/room/index.js +7 -3
- package/dist/collection/components/submit/Data.js +12 -0
- package/dist/collection/components/submit/index.js +10 -4
- package/dist/collection/index.js +1 -1
- package/dist/custom-elements/index.js +33 -11
- package/dist/esm/{Notice-4d3fbaaf.js → index-1d438ba2.js} +380 -5
- package/dist/esm/index.js +2 -372
- package/dist/esm/loader.js +1 -1
- package/dist/esm/{smoothly-accordion_51.entry.js → smoothly-accordion_50.entry.js} +90 -107
- package/dist/esm/smoothly-svg.entry.js +37 -0
- package/dist/esm/smoothly.js +1 -1
- package/dist/smoothly/index.esm.js +1 -1
- package/dist/smoothly/p-76e88859.js +1 -0
- package/dist/smoothly/p-8aefcb54.entry.js +1 -0
- package/dist/smoothly/p-956089d5.entry.js +1 -0
- package/dist/smoothly/smoothly.esm.js +1 -1
- package/dist/types/components/App.d.ts +1 -0
- package/dist/types/components/input-date/index.d.ts +1 -0
- package/dist/types/components/room/index.d.ts +1 -1
- package/dist/types/components/submit/Data.d.ts +7 -0
- package/dist/types/components/submit/index.d.ts +2 -3
- package/dist/types/components.d.ts +6 -3
- package/dist/types/index.d.ts +1 -1
- package/package.json +1 -1
- package/dist/smoothly/p-d8a81a07.js +0 -1
- package/dist/smoothly/p-fbcf1356.entry.js +0 -1
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { r as registerInstance, h, a as getElement, c as createEvent, H as Host } from './index-4d9efff8.js';
|
|
2
|
-
import { A as App, N as Notice } from './
|
|
2
|
+
import { r as redirect, A as App, N as Notice } from './index-1d438ba2.js';
|
|
3
3
|
import { T as Trigger, M as Message } from './Trigger-327e506e.js';
|
|
4
4
|
import './GoogleFont-8474516b.js';
|
|
5
5
|
|
|
6
|
-
const styleCss$
|
|
6
|
+
const styleCss$G = "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}";
|
|
7
7
|
|
|
8
8
|
const SmoothlyAccordion = class {
|
|
9
9
|
constructor(hostRef) {
|
|
@@ -49,9 +49,9 @@ const SmoothlyAccordion = class {
|
|
|
49
49
|
"value": ["valueChanged"]
|
|
50
50
|
}; }
|
|
51
51
|
};
|
|
52
|
-
SmoothlyAccordion.style = styleCss$
|
|
52
|
+
SmoothlyAccordion.style = styleCss$G;
|
|
53
53
|
|
|
54
|
-
const styleCss$
|
|
54
|
+
const styleCss$F = ".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))}";
|
|
55
55
|
|
|
56
56
|
const SmoothlyAccordionItem = class {
|
|
57
57
|
constructor(hostRef) {
|
|
@@ -96,9 +96,9 @@ const SmoothlyAccordionItem = class {
|
|
|
96
96
|
"open": ["openChanged"]
|
|
97
97
|
}; }
|
|
98
98
|
};
|
|
99
|
-
SmoothlyAccordionItem.style = styleCss$
|
|
99
|
+
SmoothlyAccordionItem.style = styleCss$F;
|
|
100
100
|
|
|
101
|
-
const styleCss$
|
|
101
|
+
const styleCss$E = "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:5rem;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;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{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:3.8rem}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:2.1rem;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:3.9rem}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:2.3rem;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>main{position:relative;top:5.6rem}";
|
|
102
102
|
|
|
103
103
|
const SmoothlyApp = class {
|
|
104
104
|
constructor(hostRef) {
|
|
@@ -108,14 +108,18 @@ const SmoothlyApp = class {
|
|
|
108
108
|
return (h("smoothly-notifier", null, h("slot", null)));
|
|
109
109
|
}
|
|
110
110
|
};
|
|
111
|
-
SmoothlyApp.style = styleCss$
|
|
111
|
+
SmoothlyApp.style = styleCss$E;
|
|
112
112
|
|
|
113
113
|
const SmoothlyAppDemo = class {
|
|
114
114
|
constructor(hostRef) {
|
|
115
115
|
registerInstance(this, hostRef);
|
|
116
116
|
}
|
|
117
117
|
render() {
|
|
118
|
-
return (h(App, { label: "Smoothly Demo" }, h("a", { slot: "nav-start", href: "display" }, "Display"), h("a", { slot: "nav-start", href: "https://google.com" }, "External"), h("smoothly-room", { path: "" }, h("smoothly-input", { type: "text" }, "Default"), h("div", { style: { padding: "1em", maxWidth: "12em" } }, h("smoothly-button", { fill: "solid", color: "danger", link: "https://google.com" }, "open"), h("smoothly-button", { fill: "solid", color: "danger", link: "https://www.w3.org/WAI/ER/tests/xhtml/testfiles/resources/pdf/dummy.pdf", download: true }, "download"), h("smoothly-button", { fill: "solid", color: "danger", onClick: () => alert("clicked") }, "action"), h("smoothly-button", { type: "link", fill: "clear", color: "danger", onClick: () => alert("clicked") }, "action link"))), h("smoothly-room", { path: "input", label: "Input" }, h("smoothly-input-demo", null)), h("smoothly-room", { path: "dialog", label: "Dialog" }, h("smoothly-dialog-demo", null)), h("smoothly-room", { path: "display", label: "Display", icon: "eye-outline" }, h("smoothly-display-demo", null)), h("smoothly-room", { path: "table", label: "Table" }, h("smoothly-table-demo", null)), h("smoothly-room", { path: "select", label: "Select" }, h("smoothly-select-demo", null)), h("smoothly-room", { path: "icon", label: "Icon" }, h("smoothly-icon-demo", null)), h("smoothly-room", { path: "
|
|
118
|
+
return (h(App, { label: "Smoothly Demo" }, h("a", { slot: "nav-start", href: "display" }, "Display"), h("a", { slot: "nav-start", href: "https://google.com" }, "External"), h("smoothly-room", { path: "" }, h("smoothly-input", { type: "text" }, "Default"), h("div", { style: { padding: "1em", maxWidth: "12em" } }, h("smoothly-button", { fill: "solid", color: "danger", link: "https://google.com" }, "open"), h("smoothly-button", { fill: "solid", color: "danger", link: "https://www.w3.org/WAI/ER/tests/xhtml/testfiles/resources/pdf/dummy.pdf", download: true }, "download"), h("smoothly-button", { fill: "solid", color: "danger", onClick: () => alert("clicked") }, "action"), h("smoothly-button", { type: "link", fill: "clear", color: "danger", onClick: () => alert("clicked") }, "action link"))), h("smoothly-room", { path: "input", label: "Input" }, h("smoothly-input-demo", null)), h("smoothly-room", { path: "dialog", label: "Dialog" }, h("smoothly-dialog-demo", null)), h("smoothly-room", { path: "display", label: "Display", icon: "eye-outline" }, h("smoothly-display-demo", null)), h("smoothly-room", { path: "table", label: "Table" }, h("smoothly-table-demo", null)), h("smoothly-room", { path: "select", label: "Select" }, h("smoothly-select-demo", null)), h("smoothly-room", { path: "icon", label: "Icon" }, h("smoothly-icon-demo", null)), h("smoothly-room", { path: "/redirect", label: "Redirect" }, h("smoothly-button", { style: { "max-width": "300px" }, onClick: () => {
|
|
119
|
+
redirect("/routing/pathParameter1");
|
|
120
|
+
} }, "Internal"), h("smoothly-button", { style: { "max-width": "300px" }, onClick: () => {
|
|
121
|
+
redirect("https://google.com");
|
|
122
|
+
} }, "External")), h("smoothly-room", { path: /^\/routing\/\w+\/?/, label: "No effect" }, h("h2", null, "Regex routing")), h("smoothly-room", { path: "old", label: "Old", to: "select" }), h("span", { slot: "header", style: { width: "100%", maxWidth: "500px" } }, h("smoothly-picker", { label: "All Animals Selected", style: { minWidth: "100px" }, labelSetting: "hide", "empty-menu-label": "Sorry, we're out of options.", "max-height": "58px", multiple: true, "select-none-name": "Select All", options: [
|
|
119
123
|
{ name: "Big Dog", value: "dog", aliases: ["WOFF"] },
|
|
120
124
|
{ name: "Cat Stevens", value: "cat", aliases: ["moew"], right: "🐈" },
|
|
121
125
|
{ name: "Noble Pig", value: "pig", right: "🐷" },
|
|
@@ -131,7 +135,7 @@ const SmoothlyAppDemo = class {
|
|
|
131
135
|
}
|
|
132
136
|
};
|
|
133
137
|
|
|
134
|
-
const styleCss$
|
|
138
|
+
const styleCss$D = ".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}";
|
|
135
139
|
|
|
136
140
|
const SmoothlyBacktotop = class {
|
|
137
141
|
constructor(hostRef) {
|
|
@@ -159,9 +163,9 @@ const SmoothlyBacktotop = class {
|
|
|
159
163
|
}) }, h("smoothly-icon", { name: "chevron-up-outline" })));
|
|
160
164
|
}
|
|
161
165
|
};
|
|
162
|
-
SmoothlyBacktotop.style = styleCss$
|
|
166
|
+
SmoothlyBacktotop.style = styleCss$D;
|
|
163
167
|
|
|
164
|
-
const styleCss$
|
|
168
|
+
const styleCss$C = "[type=link].sc-smoothly-button-h{display:inline}.sc-smoothly-button-h:not([type=link]){display:block}.sc-smoothly-button-h{margin:1em;border-style:solid;border-width:1px;border-radius:3px}[hidden].sc-smoothly-button-h{display:none}[disabled].sc-smoothly-button-h{opacity:0.5}a.sc-smoothly-button,button.sc-smoothly-button{display:block;border-color:transparent;background-color:transparent;padding:0.2em 0.3em;font-size:110%;font-weight:400}.sc-smoothly-button-h:not([disabled]):hover,.sc-smoothly-button-h:not([disabled]):focus,.sc-smoothly-button-h:not([disabled]):active{border-color:var(--smoothly-button-border)}[type=button].sc-smoothly-button-h>a.sc-smoothly-button{display:block;text-align:center;text-decoration:inherit}[type=button].sc-smoothly-button-h>a.sc-smoothly-button{width:calc(100% - 0.6em)}.sc-smoothly-button-h>button.sc-smoothly-button{width:100%}[expand=fill].sc-smoothly-button-h{width:100%;border-left:none;border-right:none}";
|
|
165
169
|
|
|
166
170
|
const SmoothlyButton = class {
|
|
167
171
|
constructor(hostRef) {
|
|
@@ -182,7 +186,7 @@ const SmoothlyButton = class {
|
|
|
182
186
|
return result;
|
|
183
187
|
}
|
|
184
188
|
};
|
|
185
|
-
SmoothlyButton.style = styleCss$
|
|
189
|
+
SmoothlyButton.style = styleCss$C;
|
|
186
190
|
|
|
187
191
|
var CallingCode$1;
|
|
188
192
|
(function (CallingCode) {
|
|
@@ -6302,7 +6306,7 @@ function years(current) {
|
|
|
6302
6306
|
return result;
|
|
6303
6307
|
}
|
|
6304
6308
|
|
|
6305
|
-
const styleCss$
|
|
6309
|
+
const styleCss$B = ".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)}";
|
|
6306
6310
|
|
|
6307
6311
|
const Calendar = class {
|
|
6308
6312
|
constructor(hostRef) {
|
|
@@ -6385,7 +6389,7 @@ const Calendar = class {
|
|
|
6385
6389
|
"end": ["onEnd"]
|
|
6386
6390
|
}; }
|
|
6387
6391
|
};
|
|
6388
|
-
Calendar.style = styleCss$
|
|
6392
|
+
Calendar.style = styleCss$B;
|
|
6389
6393
|
|
|
6390
6394
|
var CallingCode;
|
|
6391
6395
|
(function (CallingCode) {
|
|
@@ -12325,7 +12329,7 @@ function create(language) {
|
|
|
12325
12329
|
}, language);
|
|
12326
12330
|
}
|
|
12327
12331
|
|
|
12328
|
-
const styleCss$
|
|
12332
|
+
const styleCss$A = ".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)}";
|
|
12329
12333
|
|
|
12330
12334
|
const SmoothlyCheckbox = class {
|
|
12331
12335
|
constructor(hostRef) {
|
|
@@ -12352,9 +12356,9 @@ const SmoothlyCheckbox = class {
|
|
|
12352
12356
|
}
|
|
12353
12357
|
get element() { return getElement(this); }
|
|
12354
12358
|
};
|
|
12355
|
-
SmoothlyCheckbox.style = styleCss$
|
|
12359
|
+
SmoothlyCheckbox.style = styleCss$A;
|
|
12356
12360
|
|
|
12357
|
-
const styleCss$
|
|
12361
|
+
const styleCss$z = ".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}";
|
|
12358
12362
|
|
|
12359
12363
|
const SmoothlyDialog = class {
|
|
12360
12364
|
constructor(hostRef) {
|
|
@@ -12381,7 +12385,7 @@ const SmoothlyDialog = class {
|
|
|
12381
12385
|
}
|
|
12382
12386
|
render() { return h(Host, this.hostData(), this.__stencil_render()); }
|
|
12383
12387
|
};
|
|
12384
|
-
SmoothlyDialog.style = styleCss$
|
|
12388
|
+
SmoothlyDialog.style = styleCss$z;
|
|
12385
12389
|
|
|
12386
12390
|
const SmoothlyDialogDemo = class {
|
|
12387
12391
|
constructor(hostRef) {
|
|
@@ -32602,7 +32606,7 @@ Object.defineProperty(exports, "StateEditor", { enumerable: true, get: function
|
|
|
32602
32606
|
//# sourceMappingURL=index.js.map
|
|
32603
32607
|
});
|
|
32604
32608
|
|
|
32605
|
-
const styleCss$
|
|
32609
|
+
const styleCss$y = ".sc-smoothly-display-h{display:block}[hidden].sc-smoothly-display-h{display:none}";
|
|
32606
32610
|
|
|
32607
32611
|
const SmoothlyDisplay = class {
|
|
32608
32612
|
constructor(hostRef) {
|
|
@@ -32644,9 +32648,9 @@ function getLocale$1() {
|
|
|
32644
32648
|
const result = navigator.language;
|
|
32645
32649
|
return Locale$1.is(result) ? result : Language$1.is(result) ? Locale$1.toLocale(result) : undefined;
|
|
32646
32650
|
}
|
|
32647
|
-
SmoothlyDisplay.style = styleCss$
|
|
32651
|
+
SmoothlyDisplay.style = styleCss$y;
|
|
32648
32652
|
|
|
32649
|
-
const styleCss$
|
|
32653
|
+
const styleCss$x = ".sc-smoothly-display-amount-h{display:block}[hidden].sc-smoothly-display-amount-h{display:none}";
|
|
32650
32654
|
|
|
32651
32655
|
const SmoothlyDisplayAmount = class {
|
|
32652
32656
|
constructor(hostRef) {
|
|
@@ -32694,9 +32698,9 @@ const SmoothlyDisplayAmount = class {
|
|
|
32694
32698
|
];
|
|
32695
32699
|
}
|
|
32696
32700
|
};
|
|
32697
|
-
SmoothlyDisplayAmount.style = styleCss$
|
|
32701
|
+
SmoothlyDisplayAmount.style = styleCss$x;
|
|
32698
32702
|
|
|
32699
|
-
const styleCss$
|
|
32703
|
+
const styleCss$w = ".sc-smoothly-display-date-time-h{display:block}[hidden].sc-smoothly-display-date-time-h{display:none}";
|
|
32700
32704
|
|
|
32701
32705
|
const SmoothlyDisplayDateTime = class {
|
|
32702
32706
|
constructor(hostRef) {
|
|
@@ -32710,7 +32714,7 @@ const SmoothlyDisplayDateTime = class {
|
|
|
32710
32714
|
return [datetime[0], " ", datetime[1]];
|
|
32711
32715
|
}
|
|
32712
32716
|
};
|
|
32713
|
-
SmoothlyDisplayDateTime.style = styleCss$
|
|
32717
|
+
SmoothlyDisplayDateTime.style = styleCss$w;
|
|
32714
32718
|
|
|
32715
32719
|
const SmoothlyDisplayDemo = class {
|
|
32716
32720
|
constructor(hostRef) {
|
|
@@ -32723,12 +32727,12 @@ const SmoothlyDisplayDemo = class {
|
|
|
32723
32727
|
}
|
|
32724
32728
|
render() {
|
|
32725
32729
|
return [
|
|
32726
|
-
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, "date"), h("dd", null, h("smoothly-display", { type: "date", value: "2022-07-07" })), 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")
|
|
32730
|
+
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, "date"), h("dd", null, h("smoothly-display", { type: "date", value: "2022-07-07" })), h("dt", null, "date time"), h("dd", null, h("smoothly-display", { type: "date-time", format: { year: "numeric", month: "short", day: "numeric", hour: "numeric", minute: "numeric", second: "numeric" }, value: "2022-07-07T02:02:02Z" })), h("dd", null, h("smoothly-display", { type: "date-time", format: { year: "2-digit", month: "long", day: "2-digit", hour: "2-digit", minute: "2-digit", second: "2-digit" }, value: "2022-07-07T02:02:02Z" })), h("dd", null, h("smoothly-display", { type: "date-time", format: { year: "numeric", month: "2-digit", day: "2-digit", hour: "numeric", minute: "numeric", second: "numeric" }, value: "2022-07-07T12:22:24Z" })), h("dd", null, h("smoothly-display", { type: "date-time", format: { year: "numeric", month: "numeric", day: "numeric", hour: "numeric", minute: "numeric", second: "numeric" }, value: "2022-07-07T12:22:24Z" })), h("dd", null, h("smoothly-display", { type: "date-time", format: { year: "numeric", month: "short", day: "numeric" }, value: "2022-07-07T00:00+02:00" })), h("dd", null, h("smoothly-display", { type: "date-time", format: { year: "2-digit", month: "numeric", day: "numeric" }, value: "2022-07-07T00:00+02:00" })), h("dd", null, h("smoothly-display", { type: "date-time", format: { year: "2-digit", month: "numeric", day: "numeric", hour: "2-digit", minute: "2-digit", second: "2-digit", timeZone: "+01:00" }, value: "2022-07-07T12:15Z" })), 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")),
|
|
32727
32731
|
];
|
|
32728
32732
|
}
|
|
32729
32733
|
};
|
|
32730
32734
|
|
|
32731
|
-
const styleCss$
|
|
32735
|
+
const styleCss$v = ".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}";
|
|
32732
32736
|
|
|
32733
32737
|
const SmoothlyFrame = class {
|
|
32734
32738
|
constructor(hostRef) {
|
|
@@ -32767,9 +32771,9 @@ const SmoothlyFrame = class {
|
|
|
32767
32771
|
}
|
|
32768
32772
|
get element() { return getElement(this); }
|
|
32769
32773
|
};
|
|
32770
|
-
SmoothlyFrame.style = styleCss$
|
|
32774
|
+
SmoothlyFrame.style = styleCss$v;
|
|
32771
32775
|
|
|
32772
|
-
const styleCss$
|
|
32776
|
+
const styleCss$u = "[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}";
|
|
32773
32777
|
|
|
32774
32778
|
const SmoothlyIcon = class {
|
|
32775
32779
|
constructor(hostRef) {
|
|
@@ -32812,9 +32816,9 @@ const SmoothlyIcon = class {
|
|
|
32812
32816
|
render() { return h(Host, this.hostData(), this.__stencil_render()); }
|
|
32813
32817
|
};
|
|
32814
32818
|
SmoothlyIcon.cache = {};
|
|
32815
|
-
SmoothlyIcon.style = styleCss$
|
|
32819
|
+
SmoothlyIcon.style = styleCss$u;
|
|
32816
32820
|
|
|
32817
|
-
const styleCss$
|
|
32821
|
+
const styleCss$t = "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}";
|
|
32818
32822
|
|
|
32819
32823
|
const SmoothlyIconDemo = class {
|
|
32820
32824
|
constructor(hostRef) {
|
|
@@ -33296,9 +33300,9 @@ const SmoothlyIconDemo = class {
|
|
|
33296
33300
|
];
|
|
33297
33301
|
}
|
|
33298
33302
|
};
|
|
33299
|
-
SmoothlyIconDemo.style = styleCss$
|
|
33303
|
+
SmoothlyIconDemo.style = styleCss$t;
|
|
33300
33304
|
|
|
33301
|
-
const styleCss$
|
|
33305
|
+
const styleCss$s = ".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.7em 0.3em 0.7em 0.4em}input.sc-smoothly-input{padding:1.2em 0.3em 0.2em 0.4em;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)))}";
|
|
33302
33306
|
|
|
33303
33307
|
const SmoothlyInput = class {
|
|
33304
33308
|
constructor(hostRef) {
|
|
@@ -33502,9 +33506,9 @@ function getLocale() {
|
|
|
33502
33506
|
const result = navigator.language;
|
|
33503
33507
|
return Locale$1.is(result) ? result : Language$1.is(result) ? Locale$1.toLocale(result) : undefined;
|
|
33504
33508
|
}
|
|
33505
|
-
SmoothlyInput.style = styleCss$
|
|
33509
|
+
SmoothlyInput.style = styleCss$s;
|
|
33506
33510
|
|
|
33507
|
-
const styleCss$
|
|
33511
|
+
const styleCss$r = ".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, -0.55em) rotate(45deg);width:1em;height:1em;background-color:rgb(var(--smoothly-default-shade))}";
|
|
33508
33512
|
|
|
33509
33513
|
const InputDate = class {
|
|
33510
33514
|
constructor(hostRef) {
|
|
@@ -33521,7 +33525,7 @@ const InputDate = class {
|
|
|
33521
33525
|
render() {
|
|
33522
33526
|
var _a;
|
|
33523
33527
|
return [
|
|
33524
|
-
h("smoothly-input", { onClick: () => (this.open = !this.open), disabled: this.disabled, type: "date", value: this.value, onSmoothlyInput: e => (this.value = e.detail.value) }, h("slot", null)),
|
|
33528
|
+
h("smoothly-input", { name: this.name, onClick: () => (this.open = !this.open), disabled: this.disabled, type: "date", value: this.value, onSmoothlyInput: e => (this.value = e.detail.value) }, h("slot", null)),
|
|
33525
33529
|
this.open && !this.disabled
|
|
33526
33530
|
? [
|
|
33527
33531
|
h("div", { onClick: () => (this.open = false) }),
|
|
@@ -33537,9 +33541,9 @@ const InputDate = class {
|
|
|
33537
33541
|
"value": ["onStart"]
|
|
33538
33542
|
}; }
|
|
33539
33543
|
};
|
|
33540
|
-
InputDate.style = styleCss$
|
|
33544
|
+
InputDate.style = styleCss$r;
|
|
33541
33545
|
|
|
33542
|
-
const styleCss$
|
|
33546
|
+
const styleCss$q = ".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}";
|
|
33543
33547
|
|
|
33544
33548
|
const InputDateRange = class {
|
|
33545
33549
|
constructor(hostRef) {
|
|
@@ -33578,7 +33582,7 @@ const InputDateRange = class {
|
|
|
33578
33582
|
"value": ["onValue"]
|
|
33579
33583
|
}; }
|
|
33580
33584
|
};
|
|
33581
|
-
InputDateRange.style = styleCss$
|
|
33585
|
+
InputDateRange.style = styleCss$q;
|
|
33582
33586
|
|
|
33583
33587
|
const SmoothlyInputDemo = class {
|
|
33584
33588
|
constructor(hostRef) {
|
|
@@ -33586,13 +33590,13 @@ const SmoothlyInputDemo = class {
|
|
|
33586
33590
|
}
|
|
33587
33591
|
render() {
|
|
33588
33592
|
return [
|
|
33589
|
-
h("form", { action: "done", style: { position: "relative" } }, h("header", null, h("h5", null, "Address")), h("main", null, h("smoothly-input", { type: "text", name: "name", readonly: true, value: "Readonly", onSmoothlyBlur: () => console.log("smoothly blur") }, "Readonly"), h("smoothly-input", { type: "text", name: "name", onSmoothlyChange: e => console.log("smoothly change event") }, "Name"), h("smoothly-input", { type: "date", name: "date" }, "Date"), h("smoothly-input", { type: "date-time", name: "date-time" }, "Date-Time"), h("smoothly-input", { type: "divisor", name: "divisor" }, "Divisor"), h("smoothly-input", { type: "text", name: "street", value: "street" }, "Street"), h("smoothly-input", { type: "card-number", name: "card" }, "Card #"), h("smoothly-input", { type: "card-expires", name: "card", style: { width: "calc(60% - 2px)" } }, "Expires"), h("smoothly-input", { type: "card-csc", name: "card", style: { width: "calc(40% - 1px)", borderLeft: "none" } }, "CVV/CVC"), h("smoothly-radio", { name: "option", value: "1" }, "option 1"), h("smoothly-radio", { name: "option", value: "2", checked: true }, "option 2"), h("smoothly-radio", { name: "option", value: "3" }, "option 3"), h("smoothly-accordion", null, h("smoothly-accordion-item", { name: "A", open: true }, h("smoothly-radio", { name: "a", value: "1" }, "a 1"), h("smoothly-radio", { name: "a", value: "2", checked: true }, "a 2"), h("smoothly-radio", { name: "a", value: "3" }, "a 3")), h("smoothly-accordion-item", { name: "B" }, h("smoothly-radio", { name: "b", value: "1" }, "b 1"), h("smoothly-radio", { name: "b", value: "2" }, "b 2"), h("smoothly-radio", { name: "b", value: "3" }, "b 3"))), h("smoothly-display-amount", { currency: "SEK", amount: "1289.5" }), h("smoothly-display-date-time", { datetime: "2019-01-31T20:01:34" }), h("smoothly-checkbox", { selectAll: true, intermediate: true }), h("smoothly-checkbox", null), h("smoothly-checkbox", { disabled: true }), h("smoothly-address-display", { value: '{ "countryCode": "SE", "street": "Korkstigen 2", "zipCode": "654 31", "city": "Fejksala" }' }), h("smoothly-address", { editable: false, value: '{ "countryCode": "SE", "street": "Stigv\u00E4gen 34", "zipCode": "123 45", "city": "Hobbiton" }' }), h("smoothly-addresses", { allowed: "billing delivery visit", editable: true, value: '{ "billing": { "countryCode": "SE", "street": "Rundslingan 3", "zipCode": "987 65", "city": "Klotby" }, "visit": { "countryCode": "SE", "street": "G\u00E5ngbanan 34", "zipCode": "543 21", "city": "Trasktr\u00E4sk" } }' }), h("smoothly-input", { type: "postal-code", name: "zip", style: { width: "calc(60% - 2px)" } }, "ZipCode"), h("smoothly-input", { type: "text", name: "testing" }, "Texttest"), h("smoothly-input", { type: "password", name: "password" }, "Password"), h("smoothly-input", { type: "email", name: "email" }, "Email"), h("smoothly-input", { type: "price", currency: "SEK", name: "price" }, "Price"), h("smoothly-input", { type: "percent", name: "percent" }, "Percent"), h("smoothly-input", { type: "phone", name: "phone" }, "Phone"), h("smoothly-input-date", null, "Date")), h("footer", null, h("smoothly-submit", { expand: "block", onSubmit: (e) => alert(e), color: "success" }, "Submit"), h("smoothly-trigger", { expand: "block", color: "success", onClick: (e) => console.log(e.detail) }, "Trigger"))),
|
|
33593
|
+
h("form", { action: "done", style: { position: "relative" } }, h("header", null, h("h5", null, "Address")), h("main", null, h("smoothly-input", { type: "text", name: "name", readonly: true, value: "Readonly", onSmoothlyBlur: () => console.log("smoothly blur") }, "Readonly"), h("smoothly-input", { type: "text", name: "name.last", onSmoothlyChange: e => console.log("smoothly change event") }, "Name"), h("smoothly-input", { type: "text", name: "name.first", onSmoothlyChange: e => console.log("smoothly change event") }, "Name"), h("smoothly-input-date", null), h("smoothly-input", { type: "date", name: "date" }, "Date"), h("smoothly-input", { type: "date-time", name: "date-time" }, "Date-Time"), h("smoothly-input", { type: "divisor", name: "divisor" }, "Divisor"), h("smoothly-input", { type: "text", name: "street", value: "street" }, "Street"), h("smoothly-input", { type: "card-number", name: "card" }, "Card #"), h("smoothly-input", { type: "card-expires", name: "card", style: { width: "calc(60% - 2px)" } }, "Expires"), h("smoothly-input", { type: "card-csc", name: "card", style: { width: "calc(40% - 1px)", borderLeft: "none" } }, "CVV/CVC"), h("smoothly-radio", { name: "option", value: "1" }, "option 1"), h("smoothly-radio", { name: "option", value: "2", checked: true }, "option 2"), h("smoothly-radio", { name: "option", value: "3" }, "option 3"), h("smoothly-accordion", null, h("smoothly-accordion-item", { name: "A", open: true }, h("smoothly-radio", { name: "a", value: "1" }, "a 1"), h("smoothly-radio", { name: "a", value: "2", checked: true }, "a 2"), h("smoothly-radio", { name: "a", value: "3" }, "a 3")), h("smoothly-accordion-item", { name: "B" }, h("smoothly-radio", { name: "b", value: "1" }, "b 1"), h("smoothly-radio", { name: "b", value: "2" }, "b 2"), h("smoothly-radio", { name: "b", value: "3" }, "b 3"))), h("smoothly-display-amount", { currency: "SEK", amount: "1289.5" }), h("smoothly-display-date-time", { datetime: "2019-01-31T20:01:34" }), h("smoothly-checkbox", { selectAll: true, intermediate: true }), h("smoothly-checkbox", null), h("smoothly-checkbox", { disabled: true }), h("smoothly-address-display", { value: '{ "countryCode": "SE", "street": "Korkstigen 2", "zipCode": "654 31", "city": "Fejksala" }' }), h("smoothly-address", { editable: false, value: '{ "countryCode": "SE", "street": "Stigv\u00E4gen 34", "zipCode": "123 45", "city": "Hobbiton" }' }), h("smoothly-addresses", { allowed: "billing delivery visit", editable: true, value: '{ "billing": { "countryCode": "SE", "street": "Rundslingan 3", "zipCode": "987 65", "city": "Klotby" }, "visit": { "countryCode": "SE", "street": "G\u00E5ngbanan 34", "zipCode": "543 21", "city": "Trasktr\u00E4sk" } }' }), h("smoothly-input", { type: "postal-code", name: "zip", style: { width: "calc(60% - 2px)" } }, "ZipCode"), h("smoothly-input", { type: "text", name: "testing" }, "Texttest"), h("smoothly-input", { type: "password", name: "password" }, "Password"), h("smoothly-input", { type: "email", name: "email" }, "Email"), h("smoothly-input", { type: "price", currency: "SEK", name: "price" }, "Price"), h("smoothly-input", { type: "percent", name: "percent" }, "Percent"), h("smoothly-input", { type: "phone", name: "phone" }, "Phone"), h("smoothly-input-date", null, "Date")), h("footer", null, h("smoothly-submit", { expand: "block", onSubmit: (e) => alert(e), color: "success" }, "Submit"), h("smoothly-trigger", { expand: "block", color: "success", onClick: (e) => console.log(e.detail) }, "Trigger"))),
|
|
33590
33594
|
h("smoothly-backtotop", null),
|
|
33591
33595
|
];
|
|
33592
33596
|
}
|
|
33593
33597
|
};
|
|
33594
33598
|
|
|
33595
|
-
const styleCss$
|
|
33599
|
+
const styleCss$p = ".sc-smoothly-input-month-h{display:flex;justify-content:space-between;font-size:large}smoothly-icon.sc-smoothly-input-month{font-size:smaller}";
|
|
33596
33600
|
|
|
33597
33601
|
const MonthSelector = class {
|
|
33598
33602
|
constructor(hostRef) {
|
|
@@ -33621,9 +33625,9 @@ const MonthSelector = class {
|
|
|
33621
33625
|
"value": ["onValueChanged"]
|
|
33622
33626
|
}; }
|
|
33623
33627
|
};
|
|
33624
|
-
MonthSelector.style = styleCss$
|
|
33628
|
+
MonthSelector.style = styleCss$p;
|
|
33625
33629
|
|
|
33626
|
-
const styleCss$
|
|
33630
|
+
const styleCss$o = "[selected].sc-smoothly-item-h{background-color:rgb(var(--smoothly-primary-shade));color:rgb(var(--smoothly-primary-contrast))}.sc-smoothly-item-h{padding:0.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))}";
|
|
33627
33631
|
|
|
33628
33632
|
const Item = class {
|
|
33629
33633
|
constructor(hostRef) {
|
|
@@ -33657,9 +33661,9 @@ const Item = class {
|
|
|
33657
33661
|
"selected": ["onSelectedChanged"]
|
|
33658
33662
|
}; }
|
|
33659
33663
|
};
|
|
33660
|
-
Item.style = styleCss$
|
|
33664
|
+
Item.style = styleCss$o;
|
|
33661
33665
|
|
|
33662
|
-
const styleCss$
|
|
33666
|
+
const styleCss$n = ":host{max-height:18.75rem;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 1.5rem 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}";
|
|
33663
33667
|
|
|
33664
33668
|
const SmoothlyMenuOptions = class {
|
|
33665
33669
|
constructor(hostRef) {
|
|
@@ -33763,9 +33767,9 @@ const SmoothlyMenuOptions = class {
|
|
|
33763
33767
|
"options": ["optionsChangeHandler"]
|
|
33764
33768
|
}; }
|
|
33765
33769
|
};
|
|
33766
|
-
SmoothlyMenuOptions.style = styleCss$
|
|
33770
|
+
SmoothlyMenuOptions.style = styleCss$n;
|
|
33767
33771
|
|
|
33768
|
-
const styleCss$
|
|
33772
|
+
const styleCss$m = ".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}";
|
|
33769
33773
|
|
|
33770
33774
|
const Notification = class {
|
|
33771
33775
|
constructor(hostRef) {
|
|
@@ -33823,9 +33827,9 @@ const Notification = class {
|
|
|
33823
33827
|
"notice": ["onUpdatedNotice"]
|
|
33824
33828
|
}; }
|
|
33825
33829
|
};
|
|
33826
|
-
Notification.style = styleCss$
|
|
33830
|
+
Notification.style = styleCss$m;
|
|
33827
33831
|
|
|
33828
|
-
const styleCss$
|
|
33832
|
+
const styleCss$l = ".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}";
|
|
33829
33833
|
|
|
33830
33834
|
const Notifier = class {
|
|
33831
33835
|
constructor(hostRef) {
|
|
@@ -33845,9 +33849,9 @@ const Notifier = class {
|
|
|
33845
33849
|
];
|
|
33846
33850
|
}
|
|
33847
33851
|
};
|
|
33848
|
-
Notifier.style = styleCss$
|
|
33852
|
+
Notifier.style = styleCss$l;
|
|
33849
33853
|
|
|
33850
|
-
const styleCss$
|
|
33854
|
+
const styleCss$k = ":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))}::slotted([slot=left]){display:flex;align-items:center;gap:1ch}";
|
|
33851
33855
|
|
|
33852
33856
|
const SmoothlyOption = class {
|
|
33853
33857
|
constructor(hostRef) {
|
|
@@ -33874,9 +33878,9 @@ const SmoothlyOption = class {
|
|
|
33874
33878
|
}
|
|
33875
33879
|
get element() { return getElement(this); }
|
|
33876
33880
|
};
|
|
33877
|
-
SmoothlyOption.style = styleCss$
|
|
33881
|
+
SmoothlyOption.style = styleCss$k;
|
|
33878
33882
|
|
|
33879
|
-
const styleCss$
|
|
33883
|
+
const styleCss$j = ":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:2.5rem;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:2.5rem;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.6rem;font-family:var(--smoothly-font-family);font-size:1.05rem}: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.1rem;padding-bottom:0.1rem}label{padding-left:0.6rem;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:1rem;height:1rem}: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.8rem}smoothly-icon.up,smoothly-icon.down{display:flex;align-self:center;padding-right:0.8rem;stroke:rgb(var(--smoothly-primary-shade))}:host smoothly-menu-options{margin-top:0.5rem;padding-top:0.5rem;padding-bottom:0.5rem;position:absolute;z-index:1}:host(:not([is-open]))>smoothly-menu-options{display:none}";
|
|
33880
33884
|
|
|
33881
33885
|
const SmoothlyPicker = class {
|
|
33882
33886
|
constructor(hostRef) {
|
|
@@ -34056,9 +34060,9 @@ const SmoothlyPicker = class {
|
|
|
34056
34060
|
"isOpen": ["isOpenChangeHandler"]
|
|
34057
34061
|
}; }
|
|
34058
34062
|
};
|
|
34059
|
-
SmoothlyPicker.style = styleCss$
|
|
34063
|
+
SmoothlyPicker.style = styleCss$j;
|
|
34060
34064
|
|
|
34061
|
-
const styleCss$
|
|
34065
|
+
const styleCss$i = ".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}";
|
|
34062
34066
|
|
|
34063
34067
|
const SmoothlyPopup = class {
|
|
34064
34068
|
constructor(hostRef) {
|
|
@@ -34087,9 +34091,9 @@ const SmoothlyPopup = class {
|
|
|
34087
34091
|
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" }))));
|
|
34088
34092
|
}
|
|
34089
34093
|
};
|
|
34090
|
-
SmoothlyPopup.style = styleCss$
|
|
34094
|
+
SmoothlyPopup.style = styleCss$i;
|
|
34091
34095
|
|
|
34092
|
-
const styleCss$
|
|
34096
|
+
const styleCss$h = ".sc-smoothly-quiet-h{opacity:0.5}";
|
|
34093
34097
|
|
|
34094
34098
|
const SmoothlyQuiet = class {
|
|
34095
34099
|
constructor(hostRef) {
|
|
@@ -34099,9 +34103,9 @@ const SmoothlyQuiet = class {
|
|
|
34099
34103
|
return (h(Host, { color: this.color }, h("slot", null)));
|
|
34100
34104
|
}
|
|
34101
34105
|
};
|
|
34102
|
-
SmoothlyQuiet.style = styleCss$
|
|
34106
|
+
SmoothlyQuiet.style = styleCss$h;
|
|
34103
34107
|
|
|
34104
|
-
const styleCss$
|
|
34108
|
+
const styleCss$g = ".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))}";
|
|
34105
34109
|
|
|
34106
34110
|
const SmoothlyRadio = class {
|
|
34107
34111
|
constructor(hostRef) {
|
|
@@ -34120,7 +34124,7 @@ const SmoothlyRadio = class {
|
|
|
34120
34124
|
];
|
|
34121
34125
|
}
|
|
34122
34126
|
};
|
|
34123
|
-
SmoothlyRadio.style = styleCss$
|
|
34127
|
+
SmoothlyRadio.style = styleCss$g;
|
|
34124
34128
|
|
|
34125
34129
|
const SmoothlyRoom = class {
|
|
34126
34130
|
constructor(hostRef) {
|
|
@@ -34131,7 +34135,7 @@ const SmoothlyRoom = class {
|
|
|
34131
34135
|
}
|
|
34132
34136
|
};
|
|
34133
34137
|
|
|
34134
|
-
const styleCss$
|
|
34138
|
+
const styleCss$f = ".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}";
|
|
34135
34139
|
|
|
34136
34140
|
const SmoothlySelect = class {
|
|
34137
34141
|
constructor(hostRef) {
|
|
@@ -34153,9 +34157,9 @@ const SmoothlySelect = class {
|
|
|
34153
34157
|
];
|
|
34154
34158
|
}
|
|
34155
34159
|
};
|
|
34156
|
-
SmoothlySelect.style = styleCss$
|
|
34160
|
+
SmoothlySelect.style = styleCss$f;
|
|
34157
34161
|
|
|
34158
|
-
const styleCss$
|
|
34162
|
+
const styleCss$e = ".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}";
|
|
34159
34163
|
|
|
34160
34164
|
const SmoothlySelectDemo = class {
|
|
34161
34165
|
constructor(hostRef) {
|
|
@@ -34242,9 +34246,9 @@ const SmoothlySelectDemo = class {
|
|
|
34242
34246
|
];
|
|
34243
34247
|
}
|
|
34244
34248
|
};
|
|
34245
|
-
SmoothlySelectDemo.style = styleCss$
|
|
34249
|
+
SmoothlySelectDemo.style = styleCss$e;
|
|
34246
34250
|
|
|
34247
|
-
const styleCss$
|
|
34251
|
+
const styleCss$d = ".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:1.25rem;border-radius:0.3rem;padding:0.3rem;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}";
|
|
34248
34252
|
|
|
34249
34253
|
const Selector = class {
|
|
34250
34254
|
constructor(hostRef) {
|
|
@@ -34354,9 +34358,9 @@ function isItem(value) {
|
|
|
34354
34358
|
(typeof value.selected == "boolean" || value.selected == undefined) &&
|
|
34355
34359
|
typeof value.filter == "function");
|
|
34356
34360
|
}
|
|
34357
|
-
Selector.style = styleCss$
|
|
34361
|
+
Selector.style = styleCss$d;
|
|
34358
34362
|
|
|
34359
|
-
const styleCss$
|
|
34363
|
+
const styleCss$c = ".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)}}";
|
|
34360
34364
|
|
|
34361
34365
|
const SmoothlySkeleton = class {
|
|
34362
34366
|
constructor(hostRef) {
|
|
@@ -34374,9 +34378,9 @@ const SmoothlySkeleton = class {
|
|
|
34374
34378
|
return h(Host, { style: cssVariables });
|
|
34375
34379
|
}
|
|
34376
34380
|
};
|
|
34377
|
-
SmoothlySkeleton.style = styleCss$
|
|
34381
|
+
SmoothlySkeleton.style = styleCss$c;
|
|
34378
34382
|
|
|
34379
|
-
const styleCss$
|
|
34383
|
+
const styleCss$b = ".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)}}";
|
|
34380
34384
|
|
|
34381
34385
|
const SmoothlySpinner = class {
|
|
34382
34386
|
constructor(hostRef) {
|
|
@@ -34391,9 +34395,22 @@ const SmoothlySpinner = class {
|
|
|
34391
34395
|
} }, 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" }))));
|
|
34392
34396
|
}
|
|
34393
34397
|
};
|
|
34394
|
-
SmoothlySpinner.style = styleCss$
|
|
34398
|
+
SmoothlySpinner.style = styleCss$b;
|
|
34395
34399
|
|
|
34396
|
-
|
|
34400
|
+
var Data;
|
|
34401
|
+
(function (Data) {
|
|
34402
|
+
function set(data, [head, ...tail], value) {
|
|
34403
|
+
const current = data[head];
|
|
34404
|
+
return Object.assign(Object.assign({}, data), { [head]: !tail.length ? value : set(typeof current == "object" ? current : {}, tail, value) });
|
|
34405
|
+
}
|
|
34406
|
+
Data.set = set;
|
|
34407
|
+
function deepen(data) {
|
|
34408
|
+
return Object.entries(data).reduce((result, [name, value]) => set(result, name.split("."), value), {});
|
|
34409
|
+
}
|
|
34410
|
+
Data.deepen = deepen;
|
|
34411
|
+
})(Data || (Data = {}));
|
|
34412
|
+
|
|
34413
|
+
const styleCss$a = ".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}";
|
|
34397
34414
|
|
|
34398
34415
|
const SmoothlySubmit = class {
|
|
34399
34416
|
constructor(hostRef) {
|
|
@@ -34424,7 +34441,7 @@ const SmoothlySubmit = class {
|
|
|
34424
34441
|
result[element.name] = element.value;
|
|
34425
34442
|
}
|
|
34426
34443
|
}
|
|
34427
|
-
this.submitEvent.emit(result);
|
|
34444
|
+
this.submitEvent.emit(Data.deepen(result));
|
|
34428
34445
|
this.processing = false;
|
|
34429
34446
|
}
|
|
34430
34447
|
}
|
|
@@ -34444,41 +34461,7 @@ const SmoothlySubmit = class {
|
|
|
34444
34461
|
function hasNameAndValue(element) {
|
|
34445
34462
|
return (typeof element.name == "string" && typeof element.value == "string");
|
|
34446
34463
|
}
|
|
34447
|
-
SmoothlySubmit.style = styleCss$
|
|
34448
|
-
|
|
34449
|
-
const styleCss$a = ".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))}";
|
|
34450
|
-
|
|
34451
|
-
const SmoothlySvg = class {
|
|
34452
|
-
constructor(hostRef) {
|
|
34453
|
-
registerInstance(this, hostRef);
|
|
34454
|
-
this.defaultSizes = {
|
|
34455
|
-
large: { height: "50rem", width: "50rem" },
|
|
34456
|
-
medium: { height: "30rem", width: "30rem" },
|
|
34457
|
-
small: { height: "10rem", width: "10rem" },
|
|
34458
|
-
tiny: { height: "5rem", width: "5rem" },
|
|
34459
|
-
};
|
|
34460
|
-
}
|
|
34461
|
-
render() {
|
|
34462
|
-
const height = this.size
|
|
34463
|
-
? typeof this.size == "object"
|
|
34464
|
-
? this.size.height
|
|
34465
|
-
: this.defaultSizes[this.size].height
|
|
34466
|
-
: "10rem";
|
|
34467
|
-
const width = this.size
|
|
34468
|
-
? typeof this.size == "object"
|
|
34469
|
-
? this.size.width
|
|
34470
|
-
: this.defaultSizes[this.size].width
|
|
34471
|
-
: "10rem";
|
|
34472
|
-
return (h(Host, { style: {
|
|
34473
|
-
"min-height": height,
|
|
34474
|
-
"min-width": width,
|
|
34475
|
-
"--size-height": height,
|
|
34476
|
-
"--size-width": width,
|
|
34477
|
-
"--color": this.color,
|
|
34478
|
-
} }, h("object", { height: height, width: width, type: "image/svg+xml", data: this.url })));
|
|
34479
|
-
}
|
|
34480
|
-
};
|
|
34481
|
-
SmoothlySvg.style = styleCss$a;
|
|
34464
|
+
SmoothlySubmit.style = styleCss$a;
|
|
34482
34465
|
|
|
34483
34466
|
const styleCss$9 = "[open].sc-smoothly-tab-h{border-bottom:3px solid rgb(var(--smoothly-primary-color));box-sizing:border-box;margin-bottom:-3px}.hide.sc-smoothly-tab{display:none}label.sc-smoothly-tab{display:block;padding:.5rem;background-color:transparent;width:auto}";
|
|
34484
34467
|
|
|
@@ -34736,4 +34719,4 @@ const Urlencoded = class {
|
|
|
34736
34719
|
}
|
|
34737
34720
|
};
|
|
34738
34721
|
|
|
34739
|
-
export { SmoothlyAccordion as smoothly_accordion, SmoothlyAccordionItem as smoothly_accordion_item, SmoothlyApp as smoothly_app, SmoothlyAppDemo as smoothly_app_demo, SmoothlyBacktotop as smoothly_backtotop, SmoothlyButton as smoothly_button, Calendar as smoothly_calendar, SmoothlyCheckbox as smoothly_checkbox, SmoothlyDialog as smoothly_dialog, SmoothlyDialogDemo as smoothly_dialog_demo, SmoothlyDisplay as smoothly_display, SmoothlyDisplayAmount as smoothly_display_amount, SmoothlyDisplayDateTime as smoothly_display_date_time, SmoothlyDisplayDemo as smoothly_display_demo, SmoothlyFrame as smoothly_frame, SmoothlyIcon as smoothly_icon, SmoothlyIconDemo as smoothly_icon_demo, SmoothlyInput as smoothly_input, InputDate as smoothly_input_date, InputDateRange as smoothly_input_date_range, SmoothlyInputDemo as smoothly_input_demo, MonthSelector as smoothly_input_month, Item as smoothly_item, SmoothlyMenuOptions as smoothly_menu_options, Notification as smoothly_notification, Notifier as smoothly_notifier, SmoothlyOption as smoothly_option, SmoothlyPicker as smoothly_picker, SmoothlyPopup as smoothly_popup, SmoothlyQuiet as smoothly_quiet, SmoothlyRadio as smoothly_radio, SmoothlyRoom as smoothly_room, SmoothlySelect as smoothly_select, SmoothlySelectDemo as smoothly_select_demo, Selector as smoothly_selector, SmoothlySkeleton as smoothly_skeleton, SmoothlySpinner as smoothly_spinner, SmoothlySubmit as smoothly_submit,
|
|
34722
|
+
export { SmoothlyAccordion as smoothly_accordion, SmoothlyAccordionItem as smoothly_accordion_item, SmoothlyApp as smoothly_app, SmoothlyAppDemo as smoothly_app_demo, SmoothlyBacktotop as smoothly_backtotop, SmoothlyButton as smoothly_button, Calendar as smoothly_calendar, SmoothlyCheckbox as smoothly_checkbox, SmoothlyDialog as smoothly_dialog, SmoothlyDialogDemo as smoothly_dialog_demo, SmoothlyDisplay as smoothly_display, SmoothlyDisplayAmount as smoothly_display_amount, SmoothlyDisplayDateTime as smoothly_display_date_time, SmoothlyDisplayDemo as smoothly_display_demo, SmoothlyFrame as smoothly_frame, SmoothlyIcon as smoothly_icon, SmoothlyIconDemo as smoothly_icon_demo, SmoothlyInput as smoothly_input, InputDate as smoothly_input_date, InputDateRange as smoothly_input_date_range, SmoothlyInputDemo as smoothly_input_demo, MonthSelector as smoothly_input_month, Item as smoothly_item, SmoothlyMenuOptions as smoothly_menu_options, Notification as smoothly_notification, Notifier as smoothly_notifier, SmoothlyOption as smoothly_option, SmoothlyPicker as smoothly_picker, SmoothlyPopup as smoothly_popup, SmoothlyQuiet as smoothly_quiet, SmoothlyRadio as smoothly_radio, SmoothlyRoom as smoothly_room, SmoothlySelect as smoothly_select, SmoothlySelectDemo as smoothly_select_demo, Selector as smoothly_selector, SmoothlySkeleton as smoothly_skeleton, SmoothlySpinner as smoothly_spinner, SmoothlySubmit as smoothly_submit, SmoothlyTab as smoothly_tab, SmoothlyTabSwitch as smoothly_tab_switch, Table as smoothly_table, TableCell as smoothly_table_cell, TableDemo as smoothly_table_demo, TableExpandableCell as smoothly_table_expandable_cell, TableExpandableRow as smoothly_table_expandable_row, TableHeader as smoothly_table_header, TableRow as smoothly_table_row, SmoothlyTrigger as smoothly_trigger, SmoothlyTuple as smoothly_tuple, Urlencoded as smoothly_urlencoded };
|