smoothly 0.1.119 → 0.2.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/smoothly-accordion_51.cjs.entry.js +73 -54
- package/dist/cjs/smoothly.cjs.js +1 -1
- package/dist/collection/components/app/style.css +24 -24
- package/dist/collection/components/button/style.css +1 -2
- package/dist/collection/components/calendar/style.css +2 -3
- package/dist/collection/components/input/index.js +72 -9
- package/dist/collection/components/input-date/index.js +1 -1
- package/dist/collection/components/input-date/style.css +2 -3
- package/dist/collection/components/input-date-range/index.js +2 -2
- package/dist/collection/components/input-demo/index.js +2 -1
- package/dist/collection/components/item/style.css +2 -3
- package/dist/collection/components/select-demo/style.css +1 -1
- package/dist/collection/components/selector/style.css +0 -2
- package/dist/collection/components/tab/style.css +3 -4
- package/dist/collection/components/tab-switch/index.js +1 -0
- package/dist/collection/components/tab-switch/style.css +1 -1
- package/dist/collection/components/table/cell/style.css +3 -1
- package/dist/collection/components/table/demo/index.js +38 -32
- package/dist/collection/components/table/expandable/cell/index.js +8 -9
- package/dist/collection/components/table/expandable/cell/style.css +38 -1
- package/dist/collection/components/table/expandable/row/index.js +84 -21
- package/dist/collection/components/table/expandable/row/style.css +35 -4
- package/dist/collection/components/table/header/index.js +22 -2
- package/dist/collection/components/table/header/style.css +5 -3
- package/dist/collection/components/table/index.js +33 -1
- package/dist/collection/components/table/row/index.js +20 -84
- package/dist/collection/components/table/row/style.css +2 -8
- package/dist/collection/components/table/style.css +8 -3
- package/dist/custom-elements/index.js +79 -60
- package/dist/esm/loader.js +1 -1
- package/dist/esm/smoothly-accordion_51.entry.js +73 -54
- package/dist/esm/smoothly.js +1 -1
- package/dist/smoothly/p-9d6a20c4.entry.js +1 -0
- package/dist/smoothly/smoothly.esm.js +1 -1
- package/dist/types/components/input/index.d.ts +10 -3
- package/dist/types/components/table/expandable/cell/index.d.ts +2 -2
- package/dist/types/components/table/expandable/row/index.d.ts +9 -4
- package/dist/types/components/table/header/index.d.ts +1 -0
- package/dist/types/components/table/index.d.ts +3 -0
- package/dist/types/components/table/row/index.d.ts +3 -9
- package/dist/types/components.d.ts +14 -7
- package/package.json +2 -2
- package/dist/smoothly/p-991517e4.entry.js +0 -1
|
@@ -1649,7 +1649,7 @@ const SmoothlyAccordionItem$1 = class extends HTMLElement {
|
|
|
1649
1649
|
static get style() { return styleCss$K; }
|
|
1650
1650
|
};
|
|
1651
1651
|
|
|
1652
|
-
const styleCss$J = "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
|
|
1652
|
+
const styleCss$J = "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}";
|
|
1653
1653
|
|
|
1654
1654
|
const SmoothlyApp$1 = class extends HTMLElement {
|
|
1655
1655
|
constructor() {
|
|
@@ -1715,7 +1715,7 @@ const SmoothlyBacktotop$1 = class extends HTMLElement {
|
|
|
1715
1715
|
static get style() { return styleCss$I; }
|
|
1716
1716
|
};
|
|
1717
1717
|
|
|
1718
|
-
const styleCss$H = "[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{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}";
|
|
1718
|
+
const styleCss$H = "[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}";
|
|
1719
1719
|
|
|
1720
1720
|
const SmoothlyButton$1 = class extends HTMLElement {
|
|
1721
1721
|
constructor() {
|
|
@@ -47463,7 +47463,9 @@ const SmoothlyInput$1 = class extends HTMLElement {
|
|
|
47463
47463
|
constructor() {
|
|
47464
47464
|
super();
|
|
47465
47465
|
this.__registerHost();
|
|
47466
|
-
this.
|
|
47466
|
+
this.smoothlyBlur = createEvent(this, "smoothlyBlur", 7);
|
|
47467
|
+
this.smoothlyChange = createEvent(this, "smoothlyChange", 7);
|
|
47468
|
+
this.smoothlyInput = createEvent(this, "smoothlyInput", 7);
|
|
47467
47469
|
this.keepFocusOnReRender = false;
|
|
47468
47470
|
this.type = "text";
|
|
47469
47471
|
this.required = false;
|
|
@@ -47472,6 +47474,7 @@ const SmoothlyInput$1 = class extends HTMLElement {
|
|
|
47472
47474
|
this.maxLength = Number.POSITIVE_INFINITY;
|
|
47473
47475
|
this.autocomplete = true;
|
|
47474
47476
|
this.disabled = false;
|
|
47477
|
+
this.readonly = false;
|
|
47475
47478
|
}
|
|
47476
47479
|
get formatter() {
|
|
47477
47480
|
let result;
|
|
@@ -47494,8 +47497,11 @@ const SmoothlyInput$1 = class extends HTMLElement {
|
|
|
47494
47497
|
this.lastValue = value;
|
|
47495
47498
|
this.state = Object.assign(Object.assign({}, this.state), { value: this.newState({ value: this.formatter.toString(value), selection: this.state.selection }).value });
|
|
47496
47499
|
}
|
|
47497
|
-
if (value != before)
|
|
47498
|
-
|
|
47500
|
+
if (value != before) {
|
|
47501
|
+
if (typeof value == "string")
|
|
47502
|
+
value = value.trim();
|
|
47503
|
+
this.smoothlyInput.emit({ name: this.name, value });
|
|
47504
|
+
}
|
|
47499
47505
|
}
|
|
47500
47506
|
onCurrency() {
|
|
47501
47507
|
this.state = Object.assign(Object.assign({}, this.state), { value: this.newState({ value: this.formatter.toString(this.value), selection: this.state.selection }).value, pattern: this.newState({ value: this.formatter.toString(this.value), selection: this.state.selection }).pattern });
|
|
@@ -47544,8 +47550,14 @@ const SmoothlyInput$1 = class extends HTMLElement {
|
|
|
47544
47550
|
const after = this.formatter.format(dist.StateEditor.copy(this.formatter.unformat(dist.StateEditor.copy(Object.assign({}, this.state)))));
|
|
47545
47551
|
this.updateBackend(after, this.inputElement);
|
|
47546
47552
|
}
|
|
47547
|
-
onBlur(event) {
|
|
47553
|
+
onBlur(event) {
|
|
47554
|
+
this.smoothlyBlur.emit();
|
|
47555
|
+
if (this.initialValue != this.value)
|
|
47556
|
+
this.smoothlyChange.emit({ name: this.name, value: this.value });
|
|
47557
|
+
this.initialValue = undefined;
|
|
47558
|
+
}
|
|
47548
47559
|
onFocus(event) {
|
|
47560
|
+
this.initialValue = this.value;
|
|
47549
47561
|
const after = this.formatter.format(dist.StateEditor.copy(this.formatter.unformat(dist.StateEditor.copy(Object.assign({}, this.state)))));
|
|
47550
47562
|
if (event.target)
|
|
47551
47563
|
this.updateBackend(after, event.target);
|
|
@@ -47621,8 +47633,10 @@ const SmoothlyInput$1 = class extends HTMLElement {
|
|
|
47621
47633
|
return value;
|
|
47622
47634
|
}
|
|
47623
47635
|
processKey(event, backend) {
|
|
47624
|
-
|
|
47625
|
-
|
|
47636
|
+
if (!this.readonly) {
|
|
47637
|
+
const after = dist.Action.apply(this.formatter, this.state, event);
|
|
47638
|
+
this.updateBackend(after, backend);
|
|
47639
|
+
}
|
|
47626
47640
|
}
|
|
47627
47641
|
updateBackend(after, backend) {
|
|
47628
47642
|
if (after.value != backend.value)
|
|
@@ -47637,7 +47651,7 @@ const SmoothlyInput$1 = class extends HTMLElement {
|
|
|
47637
47651
|
}
|
|
47638
47652
|
render() {
|
|
47639
47653
|
var _a, _b, _c, _d, _e, _f, _g;
|
|
47640
|
-
return (h(Host, { class: { "has-value": ((_a = this.state) === null || _a === void 0 ? void 0 : _a.value) != undefined && ((_b = this.state) === null || _b === void 0 ? void 0 : _b.value) != "" }, onclick: () => { var _a; return (_a = this.inputElement) === null || _a === void 0 ? void 0 : _a.focus(); } }, h("div", null, h("input", { name: this.name, type: (_c = this.state) === null || _c === void 0 ? void 0 : _c.type, placeholder: this.placeholder, required: this.required, autocomplete: this.autocomplete ? (_d = this.state) === null || _d === void 0 ? void 0 : _d.autocomplete : "off", disabled: this.disabled, pattern: ((_e = this.state) === null || _e === void 0 ? void 0 : _e.pattern) && ((_f = this.state) === null || _f === void 0 ? void 0 : _f.pattern.source), value: (_g = this.state) === null || _g === void 0 ? void 0 : _g.value, onInput: (e) => this.onInput(e), onFocus: e => this.onFocus(e), onClick: e => this.onClick(e), onBlur: e => this.onBlur(e), onKeyDown: e => this.onKeyDown(e), ref: (el) => (this.inputElement = el), onPaste: e => this.onPaste(e) }), h("label", { htmlFor: this.name }, h("slot", null)), h("smoothly-icon", { name: "alert-circle", color: "danger", fill: "clear", size: "small" }))));
|
|
47654
|
+
return (h(Host, { class: { "has-value": ((_a = this.state) === null || _a === void 0 ? void 0 : _a.value) != undefined && ((_b = this.state) === null || _b === void 0 ? void 0 : _b.value) != "" }, onclick: () => { var _a; return (_a = this.inputElement) === null || _a === void 0 ? void 0 : _a.focus(); } }, h("div", null, h("input", { name: this.name, type: (_c = this.state) === null || _c === void 0 ? void 0 : _c.type, placeholder: this.placeholder, required: this.required, autocomplete: this.autocomplete ? (_d = this.state) === null || _d === void 0 ? void 0 : _d.autocomplete : "off", disabled: this.disabled, readOnly: this.readonly, pattern: ((_e = this.state) === null || _e === void 0 ? void 0 : _e.pattern) && ((_f = this.state) === null || _f === void 0 ? void 0 : _f.pattern.source), value: (_g = this.state) === null || _g === void 0 ? void 0 : _g.value, onInput: (e) => this.onInput(e), onFocus: e => this.onFocus(e), onClick: e => this.onClick(e), onBlur: e => this.onBlur(e), onKeyDown: e => this.onKeyDown(e), ref: (el) => (this.inputElement = el), onPaste: e => this.onPaste(e) }), h("label", { htmlFor: this.name }, h("slot", null)), h("smoothly-icon", { name: "alert-circle", color: "danger", fill: "clear", size: "small" }))));
|
|
47641
47655
|
}
|
|
47642
47656
|
static get watchers() { return {
|
|
47643
47657
|
"value": ["valueWatcher"],
|
|
@@ -47650,7 +47664,7 @@ function getLocale() {
|
|
|
47650
47664
|
return dist$2.Locale.is(result) ? result : dist$2.Language.is(result) ? dist$2.Locale.toLocale(result) : undefined;
|
|
47651
47665
|
}
|
|
47652
47666
|
|
|
47653
|
-
const styleCss$w = ".sc-smoothly-input-date-h{position:relative}nav.sc-smoothly-input-date{position:absolute;z-index:10;top:3.5em;background-color:rgb(var(--smoothly-default-shade));max-width:22em}.sc-smoothly-input-date-h>div.sc-smoothly-input-date{position:fixed;top:0px;left:0px;right:0px;bottom:0px;width:100vw;height:100vh;z-index:2}.sc-smoothly-input-date-h>nav.sc-smoothly-input-date>.arrow.sc-smoothly-input-date{position:absolute;z-index:9;transform:translate(2em,
|
|
47667
|
+
const styleCss$w = ".sc-smoothly-input-date-h{position:relative}nav.sc-smoothly-input-date{position:absolute;z-index:10;top:3.5em;background-color:rgb(var(--smoothly-default-shade));max-width:22em}.sc-smoothly-input-date-h>div.sc-smoothly-input-date{position:fixed;top:0px;left:0px;right:0px;bottom:0px;width:100vw;height:100vh;z-index:2}.sc-smoothly-input-date-h>nav.sc-smoothly-input-date>.arrow.sc-smoothly-input-date{position:absolute;z-index:9;transform:translate(2em, -0.55em) rotate(45deg);width:1em;height:1em;background-color:rgb(var(--smoothly-default-shade))}";
|
|
47654
47668
|
|
|
47655
47669
|
const InputDate = class extends HTMLElement {
|
|
47656
47670
|
constructor() {
|
|
@@ -47668,7 +47682,7 @@ const InputDate = class extends HTMLElement {
|
|
|
47668
47682
|
render() {
|
|
47669
47683
|
var _a;
|
|
47670
47684
|
return [
|
|
47671
|
-
h("smoothly-input", { onClick: () => (this.open = !this.open), disabled: this.disabled, type: "date", value: this.value,
|
|
47685
|
+
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)),
|
|
47672
47686
|
this.open && !this.disabled
|
|
47673
47687
|
? [
|
|
47674
47688
|
h("div", { onClick: () => (this.open = false) }),
|
|
@@ -47714,7 +47728,7 @@ const InputDateRange = class extends HTMLElement {
|
|
|
47714
47728
|
render() {
|
|
47715
47729
|
var _a;
|
|
47716
47730
|
return [
|
|
47717
|
-
h("section", { onClick: () => (this.open = !this.open) }, h("smoothly-input", { type: "date", value: this.start, showLabel: this.showLabel,
|
|
47731
|
+
h("section", { onClick: () => (this.open = !this.open) }, h("smoothly-input", { type: "date", value: this.start, showLabel: this.showLabel, onSmoothlyInput: e => (this.start = e.detail.value) }, "from"), h("span", null, "\u2013"), h("smoothly-input", { type: "date", showLabel: this.showLabel, value: this.end, onSmoothlyInput: e => (this.end = e.detail.value) }, "to")),
|
|
47718
47732
|
this.open ? h("div", { onClick: () => (this.open = false) }) : [],
|
|
47719
47733
|
this.open ? (h("nav", null, h("div", { class: "arrow" }), h("smoothly-calendar", { doubleInput: true, value: (_a = this.value) !== null && _a !== void 0 ? _a : dist$2.Date.now(), onValueChanged: event => {
|
|
47720
47734
|
this.value = event.detail;
|
|
@@ -47735,7 +47749,7 @@ const SmoothlyInputDemo$1 = class extends HTMLElement {
|
|
|
47735
47749
|
}
|
|
47736
47750
|
render() {
|
|
47737
47751
|
return [
|
|
47738
|
-
h("form", { action: "done", style: { position: "relative" } }, h("header", null, h("h5", null, "Address")), h("main", null, h("smoothly-input", { type: "text", name: "name" }, "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"))),
|
|
47752
|
+
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"))),
|
|
47739
47753
|
h("smoothly-backtotop", null),
|
|
47740
47754
|
];
|
|
47741
47755
|
}
|
|
@@ -47773,7 +47787,7 @@ const MonthSelector = class extends HTMLElement {
|
|
|
47773
47787
|
static get style() { return styleCss$u; }
|
|
47774
47788
|
};
|
|
47775
47789
|
|
|
47776
|
-
const styleCss$t = "[selected].sc-smoothly-item-h{background-color:rgb(var(--smoothly-primary-shade));color:rgb(var(--smoothly-primary-contrast))}.sc-smoothly-item-h{padding
|
|
47790
|
+
const styleCss$t = "[selected].sc-smoothly-item-h{background-color:rgb(var(--smoothly-primary-shade));color:rgb(var(--smoothly-primary-contrast))}.sc-smoothly-item-h{padding: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))}";
|
|
47777
47791
|
|
|
47778
47792
|
const Item = class extends HTMLElement {
|
|
47779
47793
|
constructor() {
|
|
@@ -48748,6 +48762,7 @@ const SmoothlyTabSwitch$1 = class extends HTMLElement {
|
|
|
48748
48762
|
this.__registerHost();
|
|
48749
48763
|
}
|
|
48750
48764
|
openChanged(event) {
|
|
48765
|
+
event.stopPropagation();
|
|
48751
48766
|
this.selectedElement = event.target;
|
|
48752
48767
|
this.selectedElement.open = true;
|
|
48753
48768
|
this.element.after(event.detail);
|
|
@@ -48766,12 +48781,16 @@ const SmoothlyTabSwitch$1 = class extends HTMLElement {
|
|
|
48766
48781
|
static get style() { return styleCss$a; }
|
|
48767
48782
|
};
|
|
48768
48783
|
|
|
48769
|
-
const styleCss$9 = ".sc-smoothly-table-h{display:table;text-align:left;border
|
|
48784
|
+
const styleCss$9 = ".sc-smoothly-table-h{display:table;text-align:left;border:1px solid rgb(var(--smoothly-dark-color));width:80%;box-sizing:border-box;background-color:rgb(var(--smoothly-default-color));margin:1rem 9.5%;padding-bottom:0.5rem}.slot-detail.sc-smoothly-table>div.sc-smoothly-table{padding:10rem 0;margin-left:10rem}";
|
|
48770
48785
|
|
|
48771
48786
|
const Table = class extends HTMLElement {
|
|
48772
48787
|
constructor() {
|
|
48773
48788
|
super();
|
|
48774
48789
|
this.__registerHost();
|
|
48790
|
+
this.loadMore = createEvent(this, "loadMore", 7);
|
|
48791
|
+
}
|
|
48792
|
+
handleEvents(event) {
|
|
48793
|
+
event.stopPropagation();
|
|
48775
48794
|
}
|
|
48776
48795
|
render() {
|
|
48777
48796
|
return [h("slot", null)];
|
|
@@ -48780,7 +48799,7 @@ const Table = class extends HTMLElement {
|
|
|
48780
48799
|
static get style() { return styleCss$9; }
|
|
48781
48800
|
};
|
|
48782
48801
|
|
|
48783
|
-
const styleCss$8 = ".sc-smoothly-table-cell-h{display:table-cell;padding:0.
|
|
48802
|
+
const styleCss$8 = ".sc-smoothly-table-cell-h{display:table-cell;vertical-align:middle;line-height:1.5rem;padding:0.2rem 0 0.2rem 1rem}";
|
|
48784
48803
|
|
|
48785
48804
|
const TableCell = class extends HTMLElement {
|
|
48786
48805
|
constructor() {
|
|
@@ -48802,21 +48821,21 @@ const TableDemo = class extends HTMLElement {
|
|
|
48802
48821
|
}
|
|
48803
48822
|
render() {
|
|
48804
48823
|
return [
|
|
48805
|
-
h("smoothly-table", null, h("smoothly-table-row", null, h("smoothly-table-header", null, "Header A"), h("smoothly-table-header", null, "Header B"), h("smoothly-table-header", null, "Header C")), h("smoothly-table-
|
|
48806
|
-
h("smoothly-table", null, h("smoothly-table-row", null, h("smoothly-table-header", null, "Header
|
|
48824
|
+
h("smoothly-table", null, h("smoothly-table-row", null, h("smoothly-table-header", null, "Header A"), h("smoothly-table-header", null, "Header B"), h("smoothly-table-header", null, "Header C"), h("smoothly-table-header", null, "Header D"), h("smoothly-table-header", null)), h("smoothly-table-row", null, h("smoothly-table-expandable-cell", null, "normal row (exp.cell)", h("div", { slot: "detail" }, "expandable cell 1 content")), h("smoothly-table-expandable-cell", null, "expandable cell", h("div", { slot: "detail" }, "expandable cell 2 content")), h("smoothly-table-expandable-cell", null, "expandable cell", h("div", { slot: "detail" }, "expandable cell 3 content")), h("smoothly-table-expandable-cell", null, "expandable cell", h("div", { slot: "detail" }, "expandable cell 4 content"))), h("smoothly-table-row", null, h("smoothly-table-cell", null, "normal row (nor.cell)\""), h("smoothly-table-cell", null, "normal cell"), h("smoothly-table-expandable-cell", null, "expandable cell", h("div", { slot: "detail" }, "expandable cell details.")), h("smoothly-table-expandable-cell", null, "expandable cell", h("div", { slot: "detail" }, "expandable cell details."))), h("smoothly-table-expandable-row", null, h("smoothly-table-cell", null, "expandable row (nor.cell)"), h("smoothly-table-cell", null, "Normal cell"), h("smoothly-table-cell", null, "normal cell"), h("smoothly-table-cell", null, "Normal cell"), h("div", { slot: "detail" }, "expandable row content"))),
|
|
48825
|
+
h("smoothly-table", null, h("smoothly-table-row", null, h("smoothly-table-header", null, "Header A"), h("smoothly-table-header", null)), h("smoothly-table-expandable-row", null, "A Content", h("div", { slot: "detail" }, h("smoothly-tab-switch", null, h("smoothly-tab", { label: "1", open: true }, h("smoothly-table", null, h("smoothly-table-row", null, h("smoothly-table-header", null, "Header B"), h("smoothly-table-header", null)), h("smoothly-table-expandable-row", null, h("smoothly-table-cell", null, "B Content")))))))),
|
|
48807
48826
|
];
|
|
48808
48827
|
}
|
|
48809
48828
|
static get style() { return styleCss$7; }
|
|
48810
48829
|
};
|
|
48811
48830
|
|
|
48812
|
-
const styleCss$6 = ".sc-smoothly-table-expandable-cell-h{display:table-cell;padding:0.
|
|
48831
|
+
const styleCss$6 = ".sc-smoothly-table-expandable-cell-h{display:table-cell;vertical-align:middle;line-height:1.5em;cursor:pointer;padding:0.2em 0 0.2em;border-style:solid solid none solid;border-width:2px;border-color:rgb(var(--smoothly-default-color))}.hide.sc-smoothly-table-expandable-cell{display:none}[open].sc-smoothly-table-expandable-cell-h{position:relative;z-index:3;background-color:rgb(var(--smoothly-default-color));border-style:solid solid none solid;border-width:2px;border-color:rgb(var(--smoothly-dark-color))}.slot-detail.sc-smoothly-table-expandable-cell{position:relative;background-color:rgb(var(--smoothly-default-color));width:104%;left:-2%;border-left-style:solid;border-left-color:rgb(var(--smoothly-tertiary-color));box-shadow:0px 0px 5px 4px rgb(var(--smoothly-dark-color), 0.5);box-sizing:border-box;padding:0.5rem 2%}.sc-smoothly-table-expandable-cell-h smoothly-icon.sc-smoothly-table-expandable-cell{width:0.6rem;height:1rem;float:left;padding-left:0.2rem;padding-right:0.2rem;padding-bottom:0.5rem;transition:transform 0.2s}[open].sc-smoothly-table-expandable-cell-h smoothly-icon.sc-smoothly-table-expandable-cell{transform:rotate(90deg)}";
|
|
48813
48832
|
|
|
48814
48833
|
const TableExpandableCell = class extends HTMLElement {
|
|
48815
48834
|
constructor() {
|
|
48816
48835
|
super();
|
|
48817
48836
|
this.__registerHost();
|
|
48818
48837
|
this.expansionOpen = createEvent(this, "expansionOpen", 7);
|
|
48819
|
-
this.
|
|
48838
|
+
this.expansionLoad = createEvent(this, "expansionLoad", 7);
|
|
48820
48839
|
this.align = "left";
|
|
48821
48840
|
}
|
|
48822
48841
|
openChanged(value) {
|
|
@@ -48830,7 +48849,7 @@ const TableExpandableCell = class extends HTMLElement {
|
|
|
48830
48849
|
this.open = !this.open;
|
|
48831
48850
|
}
|
|
48832
48851
|
componentDidLoad() {
|
|
48833
|
-
this.
|
|
48852
|
+
this.expansionLoad.emit();
|
|
48834
48853
|
}
|
|
48835
48854
|
componentDidRender() {
|
|
48836
48855
|
if (this.beginOpen) {
|
|
@@ -48839,7 +48858,7 @@ const TableExpandableCell = class extends HTMLElement {
|
|
|
48839
48858
|
}
|
|
48840
48859
|
}
|
|
48841
48860
|
render() {
|
|
48842
|
-
return (h(Host, { style: { textAlign: this.align } }, h("slot", null), h("tr", { ref: e => (this.expansionElement = e) }, h("td", { colSpan:
|
|
48861
|
+
return (h(Host, { style: { textAlign: this.align } }, h("slot", null), h("smoothly-icon", { name: "chevron-forward", size: "tiny" }), h("tr", { ref: e => (this.expansionElement = e) }, h("td", { colSpan: 999, class: !this.open ? "hide" : "" }, h("div", { class: "slot-detail" }, h("slot", { name: "detail" }))))));
|
|
48843
48862
|
}
|
|
48844
48863
|
get element() { return this; }
|
|
48845
48864
|
static get watchers() { return {
|
|
@@ -48848,33 +48867,39 @@ const TableExpandableCell = class extends HTMLElement {
|
|
|
48848
48867
|
static get style() { return styleCss$6; }
|
|
48849
48868
|
};
|
|
48850
48869
|
|
|
48851
|
-
const styleCss$5 = ".sc-smoothly-table-expandable-row-h{display:table-row;border:1px solid rgb(var(--smoothly-default-color));cursor:pointer}.sc-smoothly-table-expandable-row
|
|
48870
|
+
const styleCss$5 = ".sc-smoothly-table-expandable-row-h{display:table-row;border:1px solid rgb(var(--smoothly-default-color));cursor:pointer;box-sizing:border-box}.hide.sc-smoothly-table-expandable-row{display:none}.slot-detail.sc-smoothly-table-expandable-row{position:relative;background-color:rgb(var(--smoothly-default-color));width:104%;left:-2%;border-left-style:solid;border-left-color:rgb(var(--smoothly-tertiary-color));box-shadow:0px 0px 5px 2px rgb(var(--smoothly-dark-color), 0.5);box-sizing:border-box;padding:0.5rem 2%}.sc-smoothly-table-expandable-row-h smoothly-icon.sc-smoothly-table-expandable-row{width:0.6rem;height:1rem;float:left;padding-left:0.2rem;padding-right:0.2rem;padding-bottom:0.5rem;transition:transform 0.2s}[open].sc-smoothly-table-expandable-row-h smoothly-icon.sc-smoothly-table-expandable-row{transform:rotate(90deg)}[open].sc-smoothly-table-expandable-row-h smoothly-table-cell.sc-smoothly-table-expandable-row{padding-bottom:0.5rem}[open].sc-smoothly-table-expandable-row-h{position:relative;z-index:3;background-color:rgb(var(--smoothly-default-color));border-style:solid;border-width:5px;box-shadow:inset 2px 0px 0px 0px rgb(var(--smoothly-dark-color)), inset 0px 2px 0px 0px rgb(var(--smoothly-dark-color)), inset -2px 0px 0px 0px rgb(var(--smoothly-dark-color)), inset 0px 0px 0px 2px rgb(var(--smoothly-default-color))}";
|
|
48852
48871
|
|
|
48853
48872
|
const TableExpandableRow = class extends HTMLElement {
|
|
48854
48873
|
constructor() {
|
|
48855
48874
|
super();
|
|
48856
48875
|
this.__registerHost();
|
|
48857
|
-
this.
|
|
48876
|
+
this.expansionOpen = createEvent(this, "expansionOpen", 7);
|
|
48877
|
+
this.align = "left";
|
|
48858
48878
|
}
|
|
48859
|
-
|
|
48860
|
-
this.
|
|
48879
|
+
openChanged(value) {
|
|
48880
|
+
if (this.expansionElement)
|
|
48881
|
+
this.element.after(this.expansionElement);
|
|
48861
48882
|
}
|
|
48862
|
-
|
|
48863
|
-
this.
|
|
48864
|
-
|
|
48865
|
-
|
|
48866
|
-
|
|
48867
|
-
|
|
48868
|
-
|
|
48883
|
+
onClick(e) {
|
|
48884
|
+
this.open = !this.open;
|
|
48885
|
+
e.stopPropagation();
|
|
48886
|
+
}
|
|
48887
|
+
componentDidRender() {
|
|
48888
|
+
this.expansionOpen.emit(this.expansionElement);
|
|
48889
|
+
if (this.expansionElement && this.open)
|
|
48890
|
+
this.element.after(this.expansionElement);
|
|
48869
48891
|
}
|
|
48870
48892
|
render() {
|
|
48871
|
-
return (h(Host,
|
|
48893
|
+
return (h(Host, { style: { textAlign: this.align } }, h("slot", null), h("smoothly-table-cell", null, h("smoothly-icon", { name: "chevron-forward", size: "tiny" })), h("tr", { ref: e => (this.expansionElement = e) }, h("td", { colSpan: 999, class: !this.open ? "hide" : "" }, h("div", { class: "slot-detail" }, h("slot", { name: "detail" }))))));
|
|
48872
48894
|
}
|
|
48873
48895
|
get element() { return this; }
|
|
48896
|
+
static get watchers() { return {
|
|
48897
|
+
"open": ["openChanged"]
|
|
48898
|
+
}; }
|
|
48874
48899
|
static get style() { return styleCss$5; }
|
|
48875
48900
|
};
|
|
48876
48901
|
|
|
48877
|
-
const styleCss$4 = ".sc-smoothly-table-header-h{display:table-cell;
|
|
48902
|
+
const styleCss$4 = ".sc-smoothly-table-header-h{display:table-cell;line-height:2.5rem;background-color:rgb(var(--smoothly-color-shade));border-bottom:1px solid rgb(var(--smoothly-dark-color));padding-left:1rem;font-weight:bold;margin-bottom:5rem}";
|
|
48878
48903
|
|
|
48879
48904
|
const TableHeader = class extends HTMLElement {
|
|
48880
48905
|
constructor() {
|
|
@@ -48882,40 +48907,34 @@ const TableHeader = class extends HTMLElement {
|
|
|
48882
48907
|
this.__registerHost();
|
|
48883
48908
|
}
|
|
48884
48909
|
render() {
|
|
48885
|
-
return h("slot", null);
|
|
48910
|
+
return (h(Host, null, h("slot", null)));
|
|
48886
48911
|
}
|
|
48887
48912
|
static get style() { return styleCss$4; }
|
|
48888
48913
|
};
|
|
48889
48914
|
|
|
48890
|
-
const styleCss$3 = ".sc-smoothly-table-row-h{display:table-row;border:1px solid rgb(var(--smoothly-dark-color), 0.5);cursor:
|
|
48915
|
+
const styleCss$3 = ".sc-smoothly-table-row-h{display:table-row;border:1px solid rgb(var(--smoothly-dark-color), 0.5);cursor:default}.hide.sc-smoothly-table-row{display:none}";
|
|
48891
48916
|
|
|
48892
48917
|
const TableRow = class extends HTMLElement {
|
|
48893
48918
|
constructor() {
|
|
48894
48919
|
super();
|
|
48895
48920
|
this.__registerHost();
|
|
48896
|
-
this.
|
|
48897
|
-
this.align = "left";
|
|
48898
|
-
}
|
|
48899
|
-
openChanged(value) {
|
|
48900
|
-
if (this.expansionElement)
|
|
48901
|
-
this.element.after(this.expansionElement);
|
|
48921
|
+
this.expansions = [];
|
|
48902
48922
|
}
|
|
48903
|
-
|
|
48904
|
-
this.
|
|
48905
|
-
e.stopPropagation();
|
|
48923
|
+
onExpansionLoad(event) {
|
|
48924
|
+
this.expansions.push(event.target);
|
|
48906
48925
|
}
|
|
48907
|
-
|
|
48908
|
-
this.
|
|
48909
|
-
|
|
48910
|
-
|
|
48926
|
+
onExpansionOpen(event) {
|
|
48927
|
+
this.expansions.forEach(cell => {
|
|
48928
|
+
if (cell != event.target)
|
|
48929
|
+
cell.open = false;
|
|
48930
|
+
});
|
|
48931
|
+
if (event.detail)
|
|
48932
|
+
this.element.after(event.detail);
|
|
48911
48933
|
}
|
|
48912
48934
|
render() {
|
|
48913
|
-
return
|
|
48935
|
+
return h("slot", null);
|
|
48914
48936
|
}
|
|
48915
48937
|
get element() { return this; }
|
|
48916
|
-
static get watchers() { return {
|
|
48917
|
-
"open": ["openChanged"]
|
|
48918
|
-
}; }
|
|
48919
48938
|
static get style() { return styleCss$3; }
|
|
48920
48939
|
};
|
|
48921
48940
|
|
|
@@ -49039,7 +49058,7 @@ const SmoothlyFrame = /*@__PURE__*/proxyCustomElement(SmoothlyFrame$1, [2,"smoot
|
|
|
49039
49058
|
const SmoothlyGoogleFont = /*@__PURE__*/proxyCustomElement(SmoothlyGoogleFont$1, [2,"smoothly-google-font",{"value":[1]}]);
|
|
49040
49059
|
const SmoothlyIcon = /*@__PURE__*/proxyCustomElement(SmoothlyIcon$1, [2,"smoothly-icon",{"color":[513],"fill":[513],"name":[1],"size":[513],"toolTip":[1,"tool-tip"],"document":[32]}]);
|
|
49041
49060
|
const SmoothlyIconDemo = /*@__PURE__*/proxyCustomElement(SmoothlyIconDemo$1, [2,"smoothly-icon-demo"]);
|
|
49042
|
-
const SmoothlyInput = /*@__PURE__*/proxyCustomElement(SmoothlyInput$1, [6,"smoothly-input",{"name":[513],"value":[1032],"type":[513],"required":[1540],"minLength":[1026,"min-length"],"showLabel":[516,"show-label"],"maxLength":[1026,"max-length"],"autocomplete":[1028],"pattern":[1040],"placeholder":[1025],"disabled":[1028],"currency":[513]}]);
|
|
49061
|
+
const SmoothlyInput = /*@__PURE__*/proxyCustomElement(SmoothlyInput$1, [6,"smoothly-input",{"name":[513],"value":[1032],"type":[513],"required":[1540],"minLength":[1026,"min-length"],"showLabel":[516,"show-label"],"maxLength":[1026,"max-length"],"autocomplete":[1028],"pattern":[1040],"placeholder":[1025],"disabled":[1028],"readonly":[1028],"currency":[513],"initialValue":[32]}]);
|
|
49043
49062
|
const SmoothlyInputDate = /*@__PURE__*/proxyCustomElement(InputDate, [6,"smoothly-input-date",{"value":[1025],"open":[1028],"max":[1025],"min":[1025],"disabled":[1028]},[[0,"dateSet","dateSetHandler"]]]);
|
|
49044
49063
|
const SmoothlyInputDateRange = /*@__PURE__*/proxyCustomElement(InputDateRange, [2,"smoothly-input-date-range",{"value":[1025],"start":[1025],"end":[1025],"max":[1025],"min":[1025],"open":[1028],"showLabel":[516,"show-label"]},[[0,"startChanged","onStartChanged"],[0,"endChanged","onEndChanged"],[0,"dateRangeSet","onDateRangeSet"]]]);
|
|
49045
49064
|
const SmoothlyInputDemo = /*@__PURE__*/proxyCustomElement(SmoothlyInputDemo$1, [0,"smoothly-input-demo"]);
|
|
@@ -49065,13 +49084,13 @@ const SmoothlySubmit = /*@__PURE__*/proxyCustomElement(SmoothlySubmit$1, [6,"smo
|
|
|
49065
49084
|
const SmoothlySvg = /*@__PURE__*/proxyCustomElement(SmoothlySvg$1, [2,"smoothly-svg",{"url":[513],"size":[513],"color":[1]}]);
|
|
49066
49085
|
const SmoothlyTab = /*@__PURE__*/proxyCustomElement(SmoothlyTab$1, [6,"smoothly-tab",{"label":[1],"open":[1540]},[[0,"click","onClick"]]]);
|
|
49067
49086
|
const SmoothlyTabSwitch = /*@__PURE__*/proxyCustomElement(SmoothlyTabSwitch$1, [6,"smoothly-tab-switch",{"selectedElement":[32]},[[0,"expansionOpen","openChanged"]]]);
|
|
49068
|
-
const SmoothlyTable = /*@__PURE__*/proxyCustomElement(Table, [6,"smoothly-table"]);
|
|
49087
|
+
const SmoothlyTable = /*@__PURE__*/proxyCustomElement(Table, [6,"smoothly-table",null,[[0,"expansionLoad","handleEvents"],[0,"expansionOpen","handleEvents"]]]);
|
|
49069
49088
|
const SmoothlyTableCell = /*@__PURE__*/proxyCustomElement(TableCell, [6,"smoothly-table-cell"]);
|
|
49070
49089
|
const SmoothlyTableDemo = /*@__PURE__*/proxyCustomElement(TableDemo, [2,"smoothly-table-demo"]);
|
|
49071
|
-
const SmoothlyTableExpandableCell = /*@__PURE__*/proxyCustomElement(TableExpandableCell, [6,"smoothly-table-expandable-cell",{"align":[1],"open":[1540]
|
|
49072
|
-
const SmoothlyTableExpandableRow = /*@__PURE__*/proxyCustomElement(TableExpandableRow, [6,"smoothly-table-expandable-row",
|
|
49073
|
-
const SmoothlyTableHeader = /*@__PURE__*/proxyCustomElement(TableHeader, [6,"smoothly-table-header"]);
|
|
49074
|
-
const SmoothlyTableRow = /*@__PURE__*/proxyCustomElement(TableRow, [6,"smoothly-table-row",
|
|
49090
|
+
const SmoothlyTableExpandableCell = /*@__PURE__*/proxyCustomElement(TableExpandableCell, [6,"smoothly-table-expandable-cell",{"align":[1],"open":[1540]},[[0,"click","onClick"]]]);
|
|
49091
|
+
const SmoothlyTableExpandableRow = /*@__PURE__*/proxyCustomElement(TableExpandableRow, [6,"smoothly-table-expandable-row",{"align":[1],"open":[1540]},[[0,"click","onClick"]]]);
|
|
49092
|
+
const SmoothlyTableHeader = /*@__PURE__*/proxyCustomElement(TableHeader, [6,"smoothly-table-header",{"name":[1]}]);
|
|
49093
|
+
const SmoothlyTableRow = /*@__PURE__*/proxyCustomElement(TableRow, [6,"smoothly-table-row",null,[[0,"expansionLoad","onExpansionLoad"],[0,"expansionOpen","onExpansionOpen"]]]);
|
|
49075
49094
|
const SmoothlyTrigger = /*@__PURE__*/proxyCustomElement(SmoothlyTrigger$1, [6,"smoothly-trigger",{"color":[513],"expand":[513],"fill":[513],"disabled":[516],"type":[513],"name":[1],"value":[8]},[[0,"click","onClick"]]]);
|
|
49076
49095
|
const SmoothlyTriggerSink = /*@__PURE__*/proxyCustomElement(SmoothlyTriggerSink$1, [6,"smoothly-trigger-sink",{"context":[16],"destination":[1],"filter":[1]},[[0,"trigger","TriggerListener"]]]);
|
|
49077
49096
|
const SmoothlyTriggerSource = /*@__PURE__*/proxyCustomElement(SmoothlyTriggerSource$1, [6,"smoothly-trigger-source",{"listen":[1]}]);
|
package/dist/esm/loader.js
CHANGED
|
@@ -10,7 +10,7 @@ const patchEsm = () => {
|
|
|
10
10
|
const defineCustomElements = (win, options) => {
|
|
11
11
|
if (typeof window === 'undefined') return Promise.resolve();
|
|
12
12
|
return patchEsm().then(() => {
|
|
13
|
-
return bootstrapLazy([["smoothly-google-font",[[2,"smoothly-google-font",{"value":[1]}]]],["smoothly-radio-group",[[4,"smoothly-radio-group",{"orientation":[513]}]]],["smoothly-reorder",[[0,"smoothly-reorder"]]],["smoothly-trigger-sink",[[6,"smoothly-trigger-sink",{"context":[16],"destination":[1],"filter":[1]},[[0,"trigger","TriggerListener"]]]]],["smoothly-trigger-source",[[6,"smoothly-trigger-source",{"listen":[1]}]]],["smoothly-accordion_51",[[0,"smoothly-app-demo",{"baseUrl":[1,"base-url"]}],[0,"smoothly-input-demo"],[2,"smoothly-select-demo",null,[[0,"selectionChanged","handleSelectionChanged"]]],[0,"smoothly-display-demo"],[2,"smoothly-table-demo"],[4,"smoothly-app",{"color":[1]}],[0,"smoothly-dialog-demo"],[2,"smoothly-icon-demo"],[6,"smoothly-button",{"color":[513],"expand":[513],"fill":[513],"disabled":[516],"type":[513],"link":[1],"download":[4]}],[4,"smoothly-room",{"label":[1],"icon":[1],"path":[1],"to":[1]}],[2,"smoothly-input-date-range",{"value":[1025],"start":[1025],"end":[1025],"max":[1025],"min":[1025],"open":[1028],"showLabel":[516,"show-label"]},[[0,"startChanged","onStartChanged"],[0,"endChanged","onEndChanged"],[0,"dateRangeSet","onDateRangeSet"]]],[6,"smoothly-notifier",{"notices":[32]},[[0,"notice","onNotice"],[0,"remove","onRemove"]]],[1,"smoothly-picker",{"maxMenuHeight":[1,"max-menu-height"],"maxHeight":[1,"max-height"],"emptyMenuLabel":[1025,"empty-menu-label"],"multiple":[516],"optionStyle":[8,"option-style"],"options":[16],"labelSetting":[513,"label-setting"],"label":[513],"selections":[1040],"selectNoneName":[1025,"select-none-name"],"selectionName":[1025,"selection-name"],"isOpen":[32]},[[0,"optionSelect","optionSelectHander"]]],[6,"smoothly-dialog",{"color":[513],"open":[1540],"closable":[516],"header":[513]},[[0,"trigger","TriggerListener"]]],[2,"smoothly-backtotop",{"opacity":[1],"bottom":[1],"right":[1],"visible":[32]}],[2,"smoothly-checkbox",{"selectAll":[4,"select-all"],"size":[1],"intermediate":[1540],"selected":[1540],"disabled":[1540],"t":[32]}],[6,"smoothly-submit",{"processing":[1540],"color":[513],"expand":[513],"fill":[513],"disabled":[516],"prevent":[4],"submit":[64]},[[0,"click","handleSubmit"]]],[0,"smoothly-urlencoded",{"data":[1]}],[6,"smoothly-accordion",{"value":[1025]},[[0,"smoothlyOpen","handleOpenClose"],[0,"smoothlyClose","handleOpenClose"],[0,"smoothlyAccordionItemDidLoad","onAccordionItemDidLoad"],[0,"smoothlyAccordionItemDidUnload","onAccordionItemDidUnload"]]],[6,"smoothly-accordion-item",{"name":[1],"brand":[1],"open":[1540]}],[2,"smoothly-display-amount",{"amount":[8],"currency":[1]}],[2,"smoothly-frame",{"url":[1],"name":[1],"origin":[1],"send":[64]}],[6,"smoothly-popup",{"visible":[1540],"direction":[1537],"cssVariables":[32]}],[6,"smoothly-quiet",{"color":[1]}],[6,"smoothly-radio",{"name":[1],"value":[1],"checked":[1540],"tabIndex":[2,"tab-index"]}],[6,"smoothly-select",{"identifier":[1],"background":[513],"value":[1025]}],[2,"smoothly-skeleton",{"widths":[16],"width":[1],"color":[1],"period":[2],"distance":[1],"align":[513]}],[2,"smoothly-svg",{"url":[513],"size":[513],"color":[1]}],[6,"smoothly-
|
|
13
|
+
return bootstrapLazy([["smoothly-google-font",[[2,"smoothly-google-font",{"value":[1]}]]],["smoothly-radio-group",[[4,"smoothly-radio-group",{"orientation":[513]}]]],["smoothly-reorder",[[0,"smoothly-reorder"]]],["smoothly-trigger-sink",[[6,"smoothly-trigger-sink",{"context":[16],"destination":[1],"filter":[1]},[[0,"trigger","TriggerListener"]]]]],["smoothly-trigger-source",[[6,"smoothly-trigger-source",{"listen":[1]}]]],["smoothly-accordion_51",[[0,"smoothly-app-demo",{"baseUrl":[1,"base-url"]}],[0,"smoothly-input-demo"],[2,"smoothly-select-demo",null,[[0,"selectionChanged","handleSelectionChanged"]]],[0,"smoothly-display-demo"],[2,"smoothly-table-demo"],[4,"smoothly-app",{"color":[1]}],[0,"smoothly-dialog-demo"],[2,"smoothly-icon-demo"],[6,"smoothly-button",{"color":[513],"expand":[513],"fill":[513],"disabled":[516],"type":[513],"link":[1],"download":[4]}],[4,"smoothly-room",{"label":[1],"icon":[1],"path":[1],"to":[1]}],[2,"smoothly-input-date-range",{"value":[1025],"start":[1025],"end":[1025],"max":[1025],"min":[1025],"open":[1028],"showLabel":[516,"show-label"]},[[0,"startChanged","onStartChanged"],[0,"endChanged","onEndChanged"],[0,"dateRangeSet","onDateRangeSet"]]],[6,"smoothly-notifier",{"notices":[32]},[[0,"notice","onNotice"],[0,"remove","onRemove"]]],[1,"smoothly-picker",{"maxMenuHeight":[1,"max-menu-height"],"maxHeight":[1,"max-height"],"emptyMenuLabel":[1025,"empty-menu-label"],"multiple":[516],"optionStyle":[8,"option-style"],"options":[16],"labelSetting":[513,"label-setting"],"label":[513],"selections":[1040],"selectNoneName":[1025,"select-none-name"],"selectionName":[1025,"selection-name"],"isOpen":[32]},[[0,"optionSelect","optionSelectHander"]]],[6,"smoothly-dialog",{"color":[513],"open":[1540],"closable":[516],"header":[513]},[[0,"trigger","TriggerListener"]]],[6,"smoothly-table-expandable-row",{"align":[1],"open":[1540]},[[0,"click","onClick"]]],[2,"smoothly-backtotop",{"opacity":[1],"bottom":[1],"right":[1],"visible":[32]}],[2,"smoothly-checkbox",{"selectAll":[4,"select-all"],"size":[1],"intermediate":[1540],"selected":[1540],"disabled":[1540],"t":[32]}],[6,"smoothly-submit",{"processing":[1540],"color":[513],"expand":[513],"fill":[513],"disabled":[516],"prevent":[4],"submit":[64]},[[0,"click","handleSubmit"]]],[6,"smoothly-table-expandable-cell",{"align":[1],"open":[1540]},[[0,"click","onClick"]]],[0,"smoothly-urlencoded",{"data":[1]}],[6,"smoothly-accordion",{"value":[1025]},[[0,"smoothlyOpen","handleOpenClose"],[0,"smoothlyClose","handleOpenClose"],[0,"smoothlyAccordionItemDidLoad","onAccordionItemDidLoad"],[0,"smoothlyAccordionItemDidUnload","onAccordionItemDidUnload"]]],[6,"smoothly-accordion-item",{"name":[1],"brand":[1],"open":[1540]}],[2,"smoothly-display",{"type":[1],"value":[8],"currency":[1],"country":[1]}],[2,"smoothly-display-amount",{"amount":[8],"currency":[1]}],[2,"smoothly-frame",{"url":[1],"name":[1],"origin":[1],"send":[64]}],[6,"smoothly-popup",{"visible":[1540],"direction":[1537],"cssVariables":[32]}],[6,"smoothly-quiet",{"color":[1]}],[6,"smoothly-radio",{"name":[1],"value":[1],"checked":[1540],"tabIndex":[2,"tab-index"]}],[6,"smoothly-select",{"identifier":[1],"background":[513],"value":[1025]}],[2,"smoothly-skeleton",{"widths":[16],"width":[1],"color":[1],"period":[2],"distance":[1],"align":[513]}],[2,"smoothly-svg",{"url":[513],"size":[513],"color":[1]}],[6,"smoothly-table",null,[[0,"expansionLoad","handleEvents"],[0,"expansionOpen","handleEvents"]]],[6,"smoothly-table-header",{"name":[1]}],[6,"smoothly-table-row",null,[[0,"expansionLoad","onExpansionLoad"],[0,"expansionOpen","onExpansionOpen"]]],[6,"smoothly-input-date",{"value":[1025],"open":[1028],"max":[1025],"min":[1025],"disabled":[1028]},[[0,"dateSet","dateSetHandler"]]],[2,"smoothly-notification",{"notice":[16],"tick":[32]},[[0,"trigger","onTrigger"]]],[1,"smoothly-menu-options",{"emptyMenuLabel":[1025,"empty-menu-label"],"maxMenuHeight":[1,"max-menu-height"],"order":[4],"optionStyle":[8,"option-style"],"options":[1040],"resetHighlightOnOptionsChange":[1028,"reset-highlight-on-options-change"],"filteredOptions":[32],"highlightIndex":[32],"moveHighlight":[64],"setHighlight":[64],"getHighlighted":[64],"filterOptions":[64]},[[0,"optionHover","optionHoverHandler"]]],[2,"smoothly-display-date-time",{"datetime":[1]}],[6,"smoothly-tab",{"label":[1],"open":[1540]},[[0,"click","onClick"]]],[6,"smoothly-tab-switch",{"selectedElement":[32]},[[0,"expansionOpen","openChanged"]]],[6,"smoothly-table-cell"],[0,"smoothly-tuple",{"tuple":[16]}],[1,"smoothly-option",{"aliases":[513],"dataHighlight":[1540,"data-highlight"],"name":[1537],"value":[1537],"divider":[1540]}],[2,"smoothly-spinner",{"active":[516],"size":[513]}],[2,"smoothly-calendar",{"month":[1025],"value":[1025],"start":[1025],"end":[1025],"max":[1025],"min":[1025],"doubleInput":[516,"double-input"],"firstSelected":[32]}],[6,"smoothly-input",{"name":[513],"value":[1032],"type":[513],"required":[1540],"minLength":[1026,"min-length"],"showLabel":[516,"show-label"],"maxLength":[1026,"max-length"],"autocomplete":[1028],"pattern":[1040],"placeholder":[1025],"disabled":[1028],"readonly":[1028],"currency":[513],"initialValue":[32],"getFormData":[64],"setKeepFocusOnReRender":[64],"setSelectionRange":[64]}],[2,"smoothly-input-month",{"value":[1025]}],[6,"smoothly-selector",{"opened":[32],"selectedElement":[32],"missing":[32],"filter":[32]},[[0,"click","onClick"],[0,"itemSelected","onItemSelected"],[0,"keydown","onKeyDown"]]],[6,"smoothly-item",{"value":[8],"selected":[1540],"filter":[64]},[[0,"click","onClick"]]],[6,"smoothly-trigger",{"color":[513],"expand":[513],"fill":[513],"disabled":[516],"type":[513],"name":[1],"value":[8]},[[0,"click","onClick"]]],[2,"smoothly-icon",{"color":[513],"fill":[513],"name":[1],"size":[513],"toolTip":[1,"tool-tip"],"document":[32]}]]]], options);
|
|
14
14
|
});
|
|
15
15
|
};
|
|
16
16
|
|