smoothly 0.1.80 → 0.1.84
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/{generate-14aca5d2.js → generate-a6821b82.js} +2 -2
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/{smoothly-accordion_46.cjs.entry.js → smoothly-accordion_47.cjs.entry.js} +81 -67
- package/dist/cjs/smoothly-calendar.cjs.entry.js +17 -16
- package/dist/cjs/smoothly-display-demo.cjs.entry.js +1 -1
- package/dist/cjs/smoothly-input-date-range.cjs.entry.js +1 -1
- package/dist/cjs/smoothly-input-date.cjs.entry.js +1 -1
- package/dist/cjs/smoothly-input-month.cjs.entry.js +1 -1
- package/dist/cjs/smoothly-quiet.cjs.entry.js +19 -0
- package/dist/cjs/smoothly-select-demo.cjs.entry.js +2 -2
- package/dist/cjs/smoothly.cjs.js +1 -1
- package/dist/collection/collection-manifest.json +1 -0
- package/dist/collection/components/calendar/generate.js +2 -2
- package/dist/collection/components/calendar/index.js +59 -14
- package/dist/collection/components/calendar/style.css +7 -1
- package/dist/collection/components/display-demo/index.js +4 -1
- package/dist/collection/components/input-date/index.js +45 -1
- package/dist/collection/components/input-date-range/index.js +45 -1
- package/dist/collection/components/quiet/index.js +34 -0
- package/dist/collection/components/quiet/style.css +3 -0
- package/dist/collection/components/select-demo/index.js +2 -2
- package/dist/custom-elements/index.d.ts +6 -0
- package/dist/custom-elements/index.js +86 -70
- package/dist/{smoothly/generate-be25a8d1.js → esm/generate-776b3b0f.js} +2 -2
- package/dist/esm/loader.js +1 -1
- package/dist/esm/{smoothly-accordion_46.entry.js → smoothly-accordion_47.entry.js} +81 -68
- package/dist/esm/smoothly-calendar.entry.js +17 -16
- package/dist/esm/smoothly-display-demo.entry.js +1 -1
- package/dist/esm/smoothly-input-date-range.entry.js +1 -1
- package/dist/esm/smoothly-input-date.entry.js +1 -1
- package/dist/esm/smoothly-input-month.entry.js +1 -1
- package/dist/esm/smoothly-quiet.entry.js +15 -0
- package/dist/esm/smoothly-select-demo.entry.js +2 -2
- package/dist/esm/smoothly.js +1 -1
- package/dist/{esm/generate-be25a8d1.js → smoothly/generate-776b3b0f.js} +2 -2
- package/dist/smoothly/p-5ca32c49.entry.js +1 -0
- package/dist/smoothly/smoothly-calendar.entry.js +17 -16
- package/dist/smoothly/smoothly-display-demo.entry.js +1 -1
- package/dist/smoothly/smoothly-input-date-range.entry.js +1 -1
- package/dist/smoothly/smoothly-input-date.entry.js +1 -1
- package/dist/smoothly/smoothly-input-month.entry.js +1 -1
- package/dist/smoothly/smoothly-quiet.entry.js +15 -0
- package/dist/smoothly/smoothly-select-demo.entry.js +2 -2
- package/dist/smoothly/smoothly.esm.js +1 -1
- package/dist/types/components/calendar/index.d.ts +3 -0
- package/dist/types/components/input-date/index.d.ts +2 -0
- package/dist/types/components/input-date-range/index.d.ts +2 -0
- package/dist/types/components/quiet/index.d.ts +4 -0
- package/dist/types/components.d.ts +27 -0
- package/package.json +1 -1
- package/dist/smoothly/p-ebb15db5.entry.js +0 -1
|
@@ -2,7 +2,7 @@ import { r as registerInstance, h, a as getElement, c as createEvent, H as Host
|
|
|
2
2
|
import { A as App, N as Notice } from './Notice-d87d90f7.js';
|
|
3
3
|
import { T as Trigger, M as Message } from './Trigger-d7b181ec.js';
|
|
4
4
|
|
|
5
|
-
const styleCss$
|
|
5
|
+
const styleCss$D = "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}";
|
|
6
6
|
|
|
7
7
|
let SmoothlyAccordion = class {
|
|
8
8
|
constructor(hostRef) {
|
|
@@ -48,9 +48,9 @@ let SmoothlyAccordion = class {
|
|
|
48
48
|
"value": ["valueChanged"]
|
|
49
49
|
}; }
|
|
50
50
|
};
|
|
51
|
-
SmoothlyAccordion.style = styleCss$
|
|
51
|
+
SmoothlyAccordion.style = styleCss$D;
|
|
52
52
|
|
|
53
|
-
const styleCss$
|
|
53
|
+
const styleCss$C = ".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))}";
|
|
54
54
|
|
|
55
55
|
let SmoothlyAccordionItem = class {
|
|
56
56
|
constructor(hostRef) {
|
|
@@ -95,9 +95,9 @@ let SmoothlyAccordionItem = class {
|
|
|
95
95
|
"open": ["openChanged"]
|
|
96
96
|
}; }
|
|
97
97
|
};
|
|
98
|
-
SmoothlyAccordionItem.style = styleCss$
|
|
98
|
+
SmoothlyAccordionItem.style = styleCss$C;
|
|
99
99
|
|
|
100
|
-
const styleCss$
|
|
100
|
+
const styleCss$B = "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-shade);--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:1.6cm;background-color:rgb(var(--smoothly-app-background));color:rgb(var(--smoothly-app-color));fill:rgb(var(--smoothly-app-color));stroke:rgb(var(--smoothly-app-color));display:flex;justify-content:space-between;align-items:center;box-shadow:0 2px 5px 0 rgba(var(--smoothly-app-shadow))}smoothly-app>smoothly-notifier>header a{color:inherit;text-decoration:inherit}smoothly-app>smoothly-notifier>header>nav{flex-shrink:0}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:inline-block;height:100%;margin:0}smoothly-app>smoothly-notifier>header>h1 a{overflow:hidden;user-select:none}smoothly-app>smoothly-notifier>header>nav>ul>li a{line-height:1.6cm}smoothly-app>smoothly-notifier>header>h1 a,smoothly-app>smoothly-notifier>header>nav>ul>li a{display:inline-block;height:100%;padding:0 0.4cm;text-decoration:none;font-weight:bold}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{position:relative;top:0.2cm}smoothly-app>smoothly-notifier>header>nav>ul>li>a:hover>smoothly-icon,smoothly-app>smoothly-notifier>header>nav>ul>li>a.active>smoothly-icon,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{background-color:rgb(var(--smoothly-app-hover-background));color:rgb(var(--smoothly-app-hover-color));stroke:rgb(var(--smoothly-app-hover-color));fill:rgb(var(--smoothly-app-hover-color))}smoothly-app>smoothly-notifier>content{position:relative;top:1.6cm}";
|
|
101
101
|
|
|
102
102
|
let SmoothlyApp = class {
|
|
103
103
|
constructor(hostRef) {
|
|
@@ -107,7 +107,7 @@ let SmoothlyApp = class {
|
|
|
107
107
|
return (h("smoothly-notifier", null, h("slot", null)));
|
|
108
108
|
}
|
|
109
109
|
};
|
|
110
|
-
SmoothlyApp.style = styleCss$
|
|
110
|
+
SmoothlyApp.style = styleCss$B;
|
|
111
111
|
|
|
112
112
|
let SmoothlyAppDemo = class {
|
|
113
113
|
constructor(hostRef) {
|
|
@@ -18750,12 +18750,12 @@ function months(current) {
|
|
|
18750
18750
|
const day = new globalThis.Date(current);
|
|
18751
18751
|
const result = [];
|
|
18752
18752
|
for (let i = 0; i < 12; i++) {
|
|
18753
|
-
day.setMonth(i);
|
|
18753
|
+
day.setMonth(i, 28);
|
|
18754
18754
|
const date = dist$4.Date.create(day);
|
|
18755
18755
|
result.push({
|
|
18756
18756
|
date,
|
|
18757
18757
|
name: day.toLocaleString(undefined, { month: "long" }),
|
|
18758
|
-
selected: date == current,
|
|
18758
|
+
selected: date.substr(0, 7) == current.substr(0, 7),
|
|
18759
18759
|
});
|
|
18760
18760
|
}
|
|
18761
18761
|
return result;
|
|
@@ -18777,7 +18777,7 @@ function years(current) {
|
|
|
18777
18777
|
return result;
|
|
18778
18778
|
}
|
|
18779
18779
|
|
|
18780
|
-
const styleCss$
|
|
18780
|
+
const styleCss$A = ".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)}";
|
|
18781
18781
|
|
|
18782
18782
|
let Calendar = class {
|
|
18783
18783
|
constructor(hostRef) {
|
|
@@ -18794,6 +18794,18 @@ let Calendar = class {
|
|
|
18794
18794
|
onEnd(next) {
|
|
18795
18795
|
this.endChanged.emit(next);
|
|
18796
18796
|
}
|
|
18797
|
+
onClick(date) {
|
|
18798
|
+
this.valueChanged.emit((this.value = date));
|
|
18799
|
+
this.clickCounter += 1;
|
|
18800
|
+
if (this.clickCounter % 2 == 1)
|
|
18801
|
+
this.start = this.end = date;
|
|
18802
|
+
else {
|
|
18803
|
+
if (this.start && date > this.start)
|
|
18804
|
+
this.end = date;
|
|
18805
|
+
else
|
|
18806
|
+
this.start = date;
|
|
18807
|
+
}
|
|
18808
|
+
}
|
|
18797
18809
|
render() {
|
|
18798
18810
|
var _a, _b;
|
|
18799
18811
|
return [
|
|
@@ -18803,24 +18815,13 @@ let Calendar = class {
|
|
|
18803
18815
|
} }),
|
|
18804
18816
|
h("table", null, h("thead", null, h("tr", null, weekdays().map(day => (h("th", null, day))))), month((_b = this.month) !== null && _b !== void 0 ? _b : this.value).map(week => (h("tr", null, week.map(date => {
|
|
18805
18817
|
var _a, _b, _c;
|
|
18806
|
-
return (h("td", { tabindex: 1, onClick: () =>
|
|
18807
|
-
this.valueChanged.emit((this.value = date));
|
|
18808
|
-
this.clickCounter += 1;
|
|
18809
|
-
if (this.clickCounter % 2 == 1)
|
|
18810
|
-
this.start = this.end = date;
|
|
18811
|
-
else {
|
|
18812
|
-
if (this.start && date > this.start)
|
|
18813
|
-
this.end = date;
|
|
18814
|
-
else
|
|
18815
|
-
this.start = date;
|
|
18816
|
-
}
|
|
18817
|
-
}, class: (date == this.value ? ["selected"] : [])
|
|
18818
|
+
return (h("td", { tabindex: 1, onClick: (this.min || this.max) && (date < this.min || date > this.max) ? undefined : () => this.onClick(date), class: (date == this.value ? ["selected"] : [])
|
|
18818
18819
|
.concat(...(date == dist$4.Date.now() ? ["today"] : []), dist$4.Date.firstOfMonth((_a = this.month) !== null && _a !== void 0 ? _a : this.value) == dist$4.Date.firstOfMonth(date) ? ["currentMonth"] : [], this.doubleInput
|
|
18819
|
-
?
|
|
18820
|
-
dist$4.Date.parse(date) <= dist$4.Date.parse((_c = this.end) !== null && _c !== void 0 ? _c : "")
|
|
18820
|
+
? date >= ((_b = this.start) !== null && _b !== void 0 ? _b : "") && date <= ((_c = this.end) !== null && _c !== void 0 ? _c : "")
|
|
18821
18821
|
? ["dateRange"]
|
|
18822
18822
|
: []
|
|
18823
18823
|
: "")
|
|
18824
|
+
.concat(...(this.min || this.max ? (date < this.min || date > this.max ? ["disable"] : []) : ""))
|
|
18824
18825
|
.join(" ") }, date.substring(8, 10)));
|
|
18825
18826
|
}))))),
|
|
18826
18827
|
];
|
|
@@ -18831,7 +18832,7 @@ let Calendar = class {
|
|
|
18831
18832
|
"end": ["onEnd"]
|
|
18832
18833
|
}; }
|
|
18833
18834
|
};
|
|
18834
|
-
Calendar.style = styleCss$
|
|
18835
|
+
Calendar.style = styleCss$A;
|
|
18835
18836
|
|
|
18836
18837
|
var CallingCode_1$1 = createCommonjsModule(function (module, exports) {
|
|
18837
18838
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
@@ -37243,7 +37244,7 @@ function create(language) {
|
|
|
37243
37244
|
}, language);
|
|
37244
37245
|
}
|
|
37245
37246
|
|
|
37246
|
-
const styleCss$
|
|
37247
|
+
const styleCss$z = ".sc-smoothly-checkbox-h{display:block}[hidden].sc-smoothly-checkbox-h{display:none}smoothly-icon.sc-smoothly-checkbox{cursor:pointer}[disabled].sc-smoothly-checkbox-h smoothly-icon.sc-smoothly-checkbox{stroke:rgba(var(--smoothly-color-contrast), 0.3)}";
|
|
37247
37248
|
|
|
37248
37249
|
let SmoothlyCheckbox = class {
|
|
37249
37250
|
constructor(hostRef) {
|
|
@@ -37268,9 +37269,9 @@ let SmoothlyCheckbox = class {
|
|
|
37268
37269
|
}
|
|
37269
37270
|
get element() { return getElement(this); }
|
|
37270
37271
|
};
|
|
37271
|
-
SmoothlyCheckbox.style = styleCss$
|
|
37272
|
+
SmoothlyCheckbox.style = styleCss$z;
|
|
37272
37273
|
|
|
37273
|
-
const styleCss$
|
|
37274
|
+
const styleCss$y = ".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}";
|
|
37274
37275
|
|
|
37275
37276
|
let SmoothlyDialog = class {
|
|
37276
37277
|
constructor(hostRef) {
|
|
@@ -37297,7 +37298,7 @@ let SmoothlyDialog = class {
|
|
|
37297
37298
|
}
|
|
37298
37299
|
render() { return h(Host, this.hostData(), this.__stencil_render()); }
|
|
37299
37300
|
};
|
|
37300
|
-
SmoothlyDialog.style = styleCss$
|
|
37301
|
+
SmoothlyDialog.style = styleCss$y;
|
|
37301
37302
|
|
|
37302
37303
|
let SmoothlyDialogDemo = class {
|
|
37303
37304
|
constructor(hostRef) {
|
|
@@ -56944,7 +56945,7 @@ Object.defineProperty(exports, "StateEditor", { enumerable: true, get: function
|
|
|
56944
56945
|
//# sourceMappingURL=index.js.map
|
|
56945
56946
|
});
|
|
56946
56947
|
|
|
56947
|
-
const styleCss$
|
|
56948
|
+
const styleCss$x = ".sc-smoothly-display-h{display:block}[hidden].sc-smoothly-display-h{display:none}";
|
|
56948
56949
|
|
|
56949
56950
|
let SmoothlyDisplay = class {
|
|
56950
56951
|
constructor(hostRef) {
|
|
@@ -56973,9 +56974,9 @@ let SmoothlyDisplay = class {
|
|
|
56973
56974
|
return result;
|
|
56974
56975
|
}
|
|
56975
56976
|
};
|
|
56976
|
-
SmoothlyDisplay.style = styleCss$
|
|
56977
|
+
SmoothlyDisplay.style = styleCss$x;
|
|
56977
56978
|
|
|
56978
|
-
const styleCss$
|
|
56979
|
+
const styleCss$w = ".sc-smoothly-display-amount-h{display:block}[hidden].sc-smoothly-display-amount-h{display:none}";
|
|
56979
56980
|
|
|
56980
56981
|
let SmoothlyDisplayAmount = class {
|
|
56981
56982
|
constructor(hostRef) {
|
|
@@ -57023,9 +57024,9 @@ let SmoothlyDisplayAmount = class {
|
|
|
57023
57024
|
];
|
|
57024
57025
|
}
|
|
57025
57026
|
};
|
|
57026
|
-
SmoothlyDisplayAmount.style = styleCss$
|
|
57027
|
+
SmoothlyDisplayAmount.style = styleCss$w;
|
|
57027
57028
|
|
|
57028
|
-
const styleCss$
|
|
57029
|
+
const styleCss$v = ".sc-smoothly-display-date-time-h{display:block}[hidden].sc-smoothly-display-date-time-h{display:none}";
|
|
57029
57030
|
|
|
57030
57031
|
let SmoothlyDisplayDateTime = class {
|
|
57031
57032
|
constructor(hostRef) {
|
|
@@ -57036,7 +57037,7 @@ let SmoothlyDisplayDateTime = class {
|
|
|
57036
57037
|
return [datetime[0], " ", datetime[1]];
|
|
57037
57038
|
}
|
|
57038
57039
|
};
|
|
57039
|
-
SmoothlyDisplayDateTime.style = styleCss$
|
|
57040
|
+
SmoothlyDisplayDateTime.style = styleCss$v;
|
|
57040
57041
|
|
|
57041
57042
|
let SmoothlyDisplayDemo = class {
|
|
57042
57043
|
constructor(hostRef) {
|
|
@@ -57049,12 +57050,12 @@ let SmoothlyDisplayDemo = class {
|
|
|
57049
57050
|
}
|
|
57050
57051
|
render() {
|
|
57051
57052
|
return [
|
|
57052
|
-
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("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")),
|
|
57053
|
+
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-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")),
|
|
57053
57054
|
];
|
|
57054
57055
|
}
|
|
57055
57056
|
};
|
|
57056
57057
|
|
|
57057
|
-
const styleCss$
|
|
57058
|
+
const styleCss$u = ".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}";
|
|
57058
57059
|
|
|
57059
57060
|
let SmoothlyFrame = class {
|
|
57060
57061
|
constructor(hostRef) {
|
|
@@ -57093,9 +57094,9 @@ let SmoothlyFrame = class {
|
|
|
57093
57094
|
}
|
|
57094
57095
|
get element() { return getElement(this); }
|
|
57095
57096
|
};
|
|
57096
|
-
SmoothlyFrame.style = styleCss$
|
|
57097
|
+
SmoothlyFrame.style = styleCss$u;
|
|
57097
57098
|
|
|
57098
|
-
const styleCss$
|
|
57099
|
+
const styleCss$t = "[size].sc-smoothly-icon-h{background:none}.sc-smoothly-icon-h{display:block}[hidden].sc-smoothly-icon-h{display:none}[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}";
|
|
57099
57100
|
|
|
57100
57101
|
let SmoothlyIcon = class {
|
|
57101
57102
|
constructor(hostRef) {
|
|
@@ -57138,9 +57139,9 @@ let SmoothlyIcon = class {
|
|
|
57138
57139
|
render() { return h(Host, this.hostData(), this.__stencil_render()); }
|
|
57139
57140
|
};
|
|
57140
57141
|
SmoothlyIcon.cache = {};
|
|
57141
|
-
SmoothlyIcon.style = styleCss$
|
|
57142
|
+
SmoothlyIcon.style = styleCss$t;
|
|
57142
57143
|
|
|
57143
|
-
const styleCss$
|
|
57144
|
+
const styleCss$s = "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}";
|
|
57144
57145
|
|
|
57145
57146
|
let SmoothlyIconDemo = class {
|
|
57146
57147
|
constructor(hostRef) {
|
|
@@ -57622,9 +57623,9 @@ let SmoothlyIconDemo = class {
|
|
|
57622
57623
|
];
|
|
57623
57624
|
}
|
|
57624
57625
|
};
|
|
57625
|
-
SmoothlyIconDemo.style = styleCss$
|
|
57626
|
+
SmoothlyIconDemo.style = styleCss$s;
|
|
57626
57627
|
|
|
57627
|
-
const styleCss$
|
|
57628
|
+
const styleCss$r = ".sc-smoothly-input-h{display:block;position:relative}[hidden].sc-smoothly-input-h{display:none}label.sc-smoothly-input{position:absolute;left:0.4em;top:0.6em;color:rgb(var(--smoothly-text-tint));opacity:0.8;user-select:none;cursor:inherit;transition:font-size 0.1s;transition-timing-function:ease}input.sc-smoothly-input{padding:1em 0.2em 0.2em 0.2em;width:calc(100% - 0.4em);background:none;border:0;z-index:1;position:relative;font-size:1rem;font-family:var(--smoothly-font-family)}smoothly-icon.sc-smoothly-input{display:none;position:absolute;right:0.2em;top:0.6em}input.sc-smoothly-input:invalid+smoothly-icon.sc-smoothly-input{display:block}.has-value.sc-smoothly-input-h>label.sc-smoothly-input{top:0.3em;top:0.4em;font-size:60%;z-index:0}.sc-smoothly-input-h:focus-within>label.sc-smoothly-input{top:0.3em;top:0.4em;font-size:60%;z-index:0}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 30px unset inset !important;-webkit-box-shadow:0 0 0 30px unset inset !important}input.sc-smoothly-input:-webkit-autofill{-webkit-text-fill-color:unset !important}input.sc-smoothly-input:-internal-autofill-previewed,input.sc-smoothly-input:-internal-autofill-selected,textarea.sc-smoothly-input:-internal-autofill-previewed,textarea.sc-smoothly-input:-internal-autofill-selected,select.sc-smoothly-input:-internal-autofill-previewed,select.sc-smoothly-input:-internal-autofill-selected{background-color:none !important;background-image:none !important;color:unset !important}";
|
|
57628
57629
|
|
|
57629
57630
|
let SmoothlyInput = class {
|
|
57630
57631
|
constructor(hostRef) {
|
|
@@ -57781,9 +57782,9 @@ let SmoothlyInput = class {
|
|
|
57781
57782
|
"value": ["valueWatcher"]
|
|
57782
57783
|
}; }
|
|
57783
57784
|
};
|
|
57784
|
-
SmoothlyInput.style = styleCss$
|
|
57785
|
+
SmoothlyInput.style = styleCss$r;
|
|
57785
57786
|
|
|
57786
|
-
const styleCss$
|
|
57787
|
+
const styleCss$q = ".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;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))}";
|
|
57787
57788
|
|
|
57788
57789
|
let InputDate = class {
|
|
57789
57790
|
constructor(hostRef) {
|
|
@@ -57801,16 +57802,16 @@ let InputDate = class {
|
|
|
57801
57802
|
this.open ? (h("nav", null, h("div", { class: "arrow" }), h("smoothly-calendar", { doubleInput: false, value: (_a = this.value) !== null && _a !== void 0 ? _a : dist$4.Date.now(), onValueChanged: event => {
|
|
57802
57803
|
this.value = event.detail;
|
|
57803
57804
|
event.stopPropagation();
|
|
57804
|
-
} }))) : ([]),
|
|
57805
|
+
}, max: this.max, min: this.min }))) : ([]),
|
|
57805
57806
|
];
|
|
57806
57807
|
}
|
|
57807
57808
|
static get watchers() { return {
|
|
57808
57809
|
"value": ["onStart"]
|
|
57809
57810
|
}; }
|
|
57810
57811
|
};
|
|
57811
|
-
InputDate.style = styleCss$
|
|
57812
|
+
InputDate.style = styleCss$q;
|
|
57812
57813
|
|
|
57813
|
-
const styleCss$
|
|
57814
|
+
const styleCss$p = ".sc-smoothly-input-date-range-h{position:relative;display:block}.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;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, -.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;flex-direction:row;align-items:center}.sc-smoothly-input-date-range-h>smoothly-input.sc-smoothly-input-date-range{padding:0}";
|
|
57814
57815
|
|
|
57815
57816
|
let InputDateRange = class {
|
|
57816
57817
|
constructor(hostRef) {
|
|
@@ -57839,7 +57840,7 @@ let InputDateRange = class {
|
|
|
57839
57840
|
this.open ? (h("nav", null, h("div", { class: "arrow" }), h("smoothly-calendar", { doubleInput: true, value: (_a = this.value) !== null && _a !== void 0 ? _a : dist$4.Date.now(), onValueChanged: event => {
|
|
57840
57841
|
this.value = event.detail;
|
|
57841
57842
|
event.stopPropagation();
|
|
57842
|
-
} }))) : ([]),
|
|
57843
|
+
}, max: this.max, min: this.min }))) : ([]),
|
|
57843
57844
|
];
|
|
57844
57845
|
}
|
|
57845
57846
|
static get watchers() { return {
|
|
@@ -57849,7 +57850,7 @@ let InputDateRange = class {
|
|
|
57849
57850
|
"end": ["onClose"]
|
|
57850
57851
|
}; }
|
|
57851
57852
|
};
|
|
57852
|
-
InputDateRange.style = styleCss$
|
|
57853
|
+
InputDateRange.style = styleCss$p;
|
|
57853
57854
|
|
|
57854
57855
|
let SmoothlyInputDemo = class {
|
|
57855
57856
|
constructor(hostRef) {
|
|
@@ -57860,7 +57861,7 @@ let SmoothlyInputDemo = class {
|
|
|
57860
57861
|
}
|
|
57861
57862
|
};
|
|
57862
57863
|
|
|
57863
|
-
const styleCss$
|
|
57864
|
+
const styleCss$o = ".sc-smoothly-input-month-h{display:flex;justify-content:space-between;font-size:large}smoothly-icon.sc-smoothly-input-month{font-size:smaller}";
|
|
57864
57865
|
|
|
57865
57866
|
let MonthSelector = class {
|
|
57866
57867
|
constructor(hostRef) {
|
|
@@ -57889,9 +57890,9 @@ let MonthSelector = class {
|
|
|
57889
57890
|
"value": ["onValueChanged"]
|
|
57890
57891
|
}; }
|
|
57891
57892
|
};
|
|
57892
|
-
MonthSelector.style = styleCss$
|
|
57893
|
+
MonthSelector.style = styleCss$o;
|
|
57893
57894
|
|
|
57894
|
-
const styleCss$
|
|
57895
|
+
const styleCss$n = "[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))}";
|
|
57895
57896
|
|
|
57896
57897
|
let Item = class {
|
|
57897
57898
|
constructor(hostRef) {
|
|
@@ -57925,9 +57926,9 @@ let Item = class {
|
|
|
57925
57926
|
"selected": ["onSelectedChanged"]
|
|
57926
57927
|
}; }
|
|
57927
57928
|
};
|
|
57928
|
-
Item.style = styleCss$
|
|
57929
|
+
Item.style = styleCss$n;
|
|
57929
57930
|
|
|
57930
|
-
const styleCss$
|
|
57931
|
+
const styleCss$m = ":host{max-height:300px;width:85%;max-height:var(--max-menu-height);border:1px solid black;box-sizing:border-box;background-color:rgb(var(--smoothly-default-shade));overflow-y:auto;cursor:pointer}div:last-child:not(:empty){padding:0.5em 1em;font-style:italic}";
|
|
57931
57932
|
|
|
57932
57933
|
let SmoothlyMenuOptions = class {
|
|
57933
57934
|
constructor(hostRef) {
|
|
@@ -58026,9 +58027,9 @@ let SmoothlyMenuOptions = class {
|
|
|
58026
58027
|
"options": ["optionsChangeHandler"]
|
|
58027
58028
|
}; }
|
|
58028
58029
|
};
|
|
58029
|
-
SmoothlyMenuOptions.style = styleCss$
|
|
58030
|
+
SmoothlyMenuOptions.style = styleCss$m;
|
|
58030
58031
|
|
|
58031
|
-
const styleCss$
|
|
58032
|
+
const styleCss$l = ".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}";
|
|
58032
58033
|
|
|
58033
58034
|
let Notification = class {
|
|
58034
58035
|
constructor(hostRef) {
|
|
@@ -58086,9 +58087,9 @@ let Notification = class {
|
|
|
58086
58087
|
"notice": ["onUpdatedNotice"]
|
|
58087
58088
|
}; }
|
|
58088
58089
|
};
|
|
58089
|
-
Notification.style = styleCss$
|
|
58090
|
+
Notification.style = styleCss$l;
|
|
58090
58091
|
|
|
58091
|
-
const styleCss$
|
|
58092
|
+
const styleCss$k = ".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:3}";
|
|
58092
58093
|
|
|
58093
58094
|
let Notifier = class {
|
|
58094
58095
|
constructor(hostRef) {
|
|
@@ -58108,9 +58109,9 @@ let Notifier = class {
|
|
|
58108
58109
|
];
|
|
58109
58110
|
}
|
|
58110
58111
|
};
|
|
58111
|
-
Notifier.style = styleCss$
|
|
58112
|
+
Notifier.style = styleCss$k;
|
|
58112
58113
|
|
|
58113
|
-
const styleCss$
|
|
58114
|
+
const styleCss$j = ":host{display:flex;flex-direction:row;align-items:center;justify-content:space-between;padding:0.5em 1em}:host([data-highlight]){background-color:rgb(var(--smoothly-primary-color));color:rgb(var(--smoothly-primary-contrast));stroke:rgb(var(--smoothly-primary-contrast));fill:rgb(var(--smoothly-primary-contrast))}:host([data-highlight]) div:last-child{color:rgba(var(--smoothly-primary-contrast), 0.8)}:host div:last-child{color:rgba(var(--smoothly-default-contrast), 0.8);font-style:italic}";
|
|
58114
58115
|
|
|
58115
58116
|
let SmoothlyOption = class {
|
|
58116
58117
|
constructor(hostRef) {
|
|
@@ -58133,9 +58134,9 @@ let SmoothlyOption = class {
|
|
|
58133
58134
|
}
|
|
58134
58135
|
get element() { return getElement(this); }
|
|
58135
58136
|
};
|
|
58136
|
-
SmoothlyOption.style = styleCss$
|
|
58137
|
+
SmoothlyOption.style = styleCss$j;
|
|
58137
58138
|
|
|
58138
|
-
const styleCss$
|
|
58139
|
+
const styleCss$i = ":host{--background-color:var(--smoothly-secondary-tint), 1;--color:var(--smoothly-secondary-contrast);--border-color:var(--smoothly-secondary-contrast), 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;width:100%;cursor:pointer;--intergiro-transition:all 200ms cubic-bezier(0.645, 0.045, 0.355, 1);transition:var(--intergiro-transition)}:host>div{display:flex;min-height:3em;background-color:rgba(var(--background-color));align-items: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 1em;font-family:var(--smoothly-font-family);font-size:1.05em}:host>div input::placeholder{opacity:1;text-overflow:ellipsis}: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{position:absolute;top:1em;left:1em;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{transform:translateY(-1.2em) scale(0.7)}: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(:not([is-open])) smoothly-icon[data-arrow=up]{display:none}:host([is-open]) smoothly-icon[data-arrow=down]{display:none}:host(:not([has-selection])) smoothly-icon:not([data-arrow]){display:none}:host smoothly-menu-options{position:absolute;z-index:1}:host(:not([is-open]))>smoothly-menu-options{display:none}";
|
|
58139
58140
|
|
|
58140
58141
|
let SmoothlyPicker = class {
|
|
58141
58142
|
constructor(hostRef) {
|
|
@@ -58271,9 +58272,9 @@ let SmoothlyPicker = class {
|
|
|
58271
58272
|
"isOpen": ["isOpenChangeHander"]
|
|
58272
58273
|
}; }
|
|
58273
58274
|
};
|
|
58274
|
-
SmoothlyPicker.style = styleCss$
|
|
58275
|
+
SmoothlyPicker.style = styleCss$i;
|
|
58275
58276
|
|
|
58276
|
-
const styleCss$
|
|
58277
|
+
const styleCss$h = ".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}";
|
|
58277
58278
|
|
|
58278
58279
|
let SmoothlyPopup = class {
|
|
58279
58280
|
constructor(hostRef) {
|
|
@@ -58302,7 +58303,19 @@ let SmoothlyPopup = class {
|
|
|
58302
58303
|
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" }))));
|
|
58303
58304
|
}
|
|
58304
58305
|
};
|
|
58305
|
-
SmoothlyPopup.style = styleCss$
|
|
58306
|
+
SmoothlyPopup.style = styleCss$h;
|
|
58307
|
+
|
|
58308
|
+
const styleCss$g = ".sc-smoothly-quiet-h{opacity:0.5}";
|
|
58309
|
+
|
|
58310
|
+
let SmoothlyQuiet = class {
|
|
58311
|
+
constructor(hostRef) {
|
|
58312
|
+
registerInstance(this, hostRef);
|
|
58313
|
+
}
|
|
58314
|
+
render() {
|
|
58315
|
+
return (h(Host, { color: this.color }, h("slot", null)));
|
|
58316
|
+
}
|
|
58317
|
+
};
|
|
58318
|
+
SmoothlyQuiet.style = styleCss$g;
|
|
58306
58319
|
|
|
58307
58320
|
const styleCss$f = ".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))}";
|
|
58308
58321
|
|
|
@@ -58379,8 +58392,8 @@ let SmoothlySelectDemo = class {
|
|
|
58379
58392
|
h("smoothly-select", { identifier: "currency" }, this.currencies.map(option => this.currency == option ? (h("option", { value: option, selected: true }, option)) : (h("option", { value: option }, option)))),
|
|
58380
58393
|
h("smoothly-select", { identifier: "language" }, h("optgroup", { label: "Nordic" }, h("option", { value: "sv" }, "Swedish"), h("option", { value: "da", selected: true }, "Danish"), h("option", { value: "no" }, "Norwegian")), h("optgroup", { label: "Other" }, h("option", { value: "en" }, "English"))),
|
|
58381
58394
|
h("smoothly-select", { identifier: "quantity", ref: e => (this.quantityElement = e) }, h("option", { value: "1" }, "1"), h("option", { value: "2" }, "2"), h("option", { value: "3" }, "3")),
|
|
58382
|
-
h("smoothly-input-date",
|
|
58383
|
-
h("smoothly-input-date-range",
|
|
58395
|
+
h("smoothly-input-date", { max: "2021-12-30", min: "2021-10-10" }, "Date"),
|
|
58396
|
+
h("smoothly-input-date-range", { max: "2021-12-30", min: "2021-10-10" }),
|
|
58384
58397
|
h("smoothly-selector", null, h("smoothly-item", { value: "1" }, "January"), h("smoothly-item", { value: "2" }, "February"), h("smoothly-item", { value: "3" }, "March"), h("smoothly-item", { value: "4" }, "April"), h("smoothly-item", { value: "5" }, "May"), h("smoothly-item", { value: "6" }, "June"), h("smoothly-item", { value: "7" }, "July"), h("smoothly-item", { value: "8" }, "August"), h("smoothly-item", { value: "9" }, "September"), h("smoothly-item", { value: "10" }, "October"), h("smoothly-item", { value: "11" }, "November"), h("smoothly-item", { value: "12" }, "December")),
|
|
58385
58398
|
h("button", { onClick: () => this.alertf() }, "press here"),
|
|
58386
58399
|
h("smoothly-picker", { label: "Filter", "empty-menu-label": "Sorry, we're out of options.", "max-height": "58px", multiple: true, options: [
|
|
@@ -58887,4 +58900,4 @@ let Urlencoded = class {
|
|
|
58887
58900
|
}
|
|
58888
58901
|
};
|
|
58889
58902
|
|
|
58890
|
-
export { SmoothlyAccordion as smoothly_accordion, SmoothlyAccordionItem as smoothly_accordion_item, SmoothlyApp as smoothly_app, SmoothlyAppDemo as smoothly_app_demo, 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, SmoothlyRadio as smoothly_radio, SmoothlyRoom as smoothly_room, SmoothlySelect as smoothly_select, SmoothlySelectDemo as smoothly_select_demo, Selector as smoothly_selector, 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 };
|
|
58903
|
+
export { SmoothlyAccordion as smoothly_accordion, SmoothlyAccordionItem as smoothly_accordion_item, SmoothlyApp as smoothly_app, SmoothlyAppDemo as smoothly_app_demo, 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, 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 };
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { r as registerInstance, i as createEvent, h, j as getElement } from './index-02a70ac1.js';
|
|
2
2
|
import { d as dist } from './index-a28d88cf.js';
|
|
3
|
-
import { w as weekdays, m as month } from './generate-
|
|
3
|
+
import { w as weekdays, m as month } from './generate-776b3b0f.js';
|
|
4
4
|
import './_commonjsHelpers-8fe71198.js';
|
|
5
5
|
|
|
6
|
-
const styleCss = ".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):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))}";
|
|
6
|
+
const styleCss = ".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)}";
|
|
7
7
|
|
|
8
8
|
let Calendar = class {
|
|
9
9
|
constructor(hostRef) {
|
|
@@ -20,6 +20,18 @@ let Calendar = class {
|
|
|
20
20
|
onEnd(next) {
|
|
21
21
|
this.endChanged.emit(next);
|
|
22
22
|
}
|
|
23
|
+
onClick(date) {
|
|
24
|
+
this.valueChanged.emit((this.value = date));
|
|
25
|
+
this.clickCounter += 1;
|
|
26
|
+
if (this.clickCounter % 2 == 1)
|
|
27
|
+
this.start = this.end = date;
|
|
28
|
+
else {
|
|
29
|
+
if (this.start && date > this.start)
|
|
30
|
+
this.end = date;
|
|
31
|
+
else
|
|
32
|
+
this.start = date;
|
|
33
|
+
}
|
|
34
|
+
}
|
|
23
35
|
render() {
|
|
24
36
|
var _a, _b;
|
|
25
37
|
return [
|
|
@@ -29,24 +41,13 @@ let Calendar = class {
|
|
|
29
41
|
} }),
|
|
30
42
|
h("table", null, h("thead", null, h("tr", null, weekdays().map(day => (h("th", null, day))))), month((_b = this.month) !== null && _b !== void 0 ? _b : this.value).map(week => (h("tr", null, week.map(date => {
|
|
31
43
|
var _a, _b, _c;
|
|
32
|
-
return (h("td", { tabindex: 1, onClick: () =>
|
|
33
|
-
this.valueChanged.emit((this.value = date));
|
|
34
|
-
this.clickCounter += 1;
|
|
35
|
-
if (this.clickCounter % 2 == 1)
|
|
36
|
-
this.start = this.end = date;
|
|
37
|
-
else {
|
|
38
|
-
if (this.start && date > this.start)
|
|
39
|
-
this.end = date;
|
|
40
|
-
else
|
|
41
|
-
this.start = date;
|
|
42
|
-
}
|
|
43
|
-
}, class: (date == this.value ? ["selected"] : [])
|
|
44
|
+
return (h("td", { tabindex: 1, onClick: (this.min || this.max) && (date < this.min || date > this.max) ? undefined : () => this.onClick(date), class: (date == this.value ? ["selected"] : [])
|
|
44
45
|
.concat(...(date == dist.Date.now() ? ["today"] : []), dist.Date.firstOfMonth((_a = this.month) !== null && _a !== void 0 ? _a : this.value) == dist.Date.firstOfMonth(date) ? ["currentMonth"] : [], this.doubleInput
|
|
45
|
-
?
|
|
46
|
-
dist.Date.parse(date) <= dist.Date.parse((_c = this.end) !== null && _c !== void 0 ? _c : "")
|
|
46
|
+
? date >= ((_b = this.start) !== null && _b !== void 0 ? _b : "") && date <= ((_c = this.end) !== null && _c !== void 0 ? _c : "")
|
|
47
47
|
? ["dateRange"]
|
|
48
48
|
: []
|
|
49
49
|
: "")
|
|
50
|
+
.concat(...(this.min || this.max ? (date < this.min || date > this.max ? ["disable"] : []) : ""))
|
|
50
51
|
.join(" ") }, date.substring(8, 10)));
|
|
51
52
|
}))))),
|
|
52
53
|
];
|
|
@@ -12,7 +12,7 @@ let SmoothlyDisplayDemo = class {
|
|
|
12
12
|
}
|
|
13
13
|
render() {
|
|
14
14
|
return [
|
|
15
|
-
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("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")),
|
|
15
|
+
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-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")),
|
|
16
16
|
];
|
|
17
17
|
}
|
|
18
18
|
};
|
|
@@ -31,7 +31,7 @@ let InputDateRange = class {
|
|
|
31
31
|
this.open ? (h("nav", null, h("div", { class: "arrow" }), h("smoothly-calendar", { doubleInput: true, value: (_a = this.value) !== null && _a !== void 0 ? _a : dist.Date.now(), onValueChanged: event => {
|
|
32
32
|
this.value = event.detail;
|
|
33
33
|
event.stopPropagation();
|
|
34
|
-
} }))) : ([]),
|
|
34
|
+
}, max: this.max, min: this.min }))) : ([]),
|
|
35
35
|
];
|
|
36
36
|
}
|
|
37
37
|
static get watchers() { return {
|
|
@@ -20,7 +20,7 @@ let InputDate = class {
|
|
|
20
20
|
this.open ? (h("nav", null, h("div", { class: "arrow" }), h("smoothly-calendar", { doubleInput: false, value: (_a = this.value) !== null && _a !== void 0 ? _a : dist.Date.now(), onValueChanged: event => {
|
|
21
21
|
this.value = event.detail;
|
|
22
22
|
event.stopPropagation();
|
|
23
|
-
} }))) : ([]),
|
|
23
|
+
}, max: this.max, min: this.min }))) : ([]),
|
|
24
24
|
];
|
|
25
25
|
}
|
|
26
26
|
static get watchers() { return {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { r as registerInstance, i as createEvent, h } from './index-02a70ac1.js';
|
|
2
2
|
import { d as dist } from './index-a28d88cf.js';
|
|
3
|
-
import { y as years, a as months } from './generate-
|
|
3
|
+
import { y as years, a as months } from './generate-776b3b0f.js';
|
|
4
4
|
import './_commonjsHelpers-8fe71198.js';
|
|
5
5
|
|
|
6
6
|
const styleCss = ".sc-smoothly-input-month-h{display:flex;justify-content:space-between;font-size:large}smoothly-icon.sc-smoothly-input-month{font-size:smaller}";
|