smoothly 0.2.4 → 0.2.7
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 +25 -19
- package/dist/cjs/smoothly.cjs.js +1 -1
- package/dist/collection/components/picker/index.js +50 -13
- package/dist/collection/components/select-demo/index.js +3 -0
- package/dist/collection/components/tab/style.css +7 -11
- package/dist/collection/components/tab-switch/style.css +2 -1
- package/dist/collection/components/table/cell/style.css +2 -2
- package/dist/collection/components/table/demo/index.js +11 -9
- package/dist/collection/components/table/expandable/cell/index.js +3 -2
- package/dist/collection/components/table/expandable/cell/style.css +22 -26
- package/dist/collection/components/table/expandable/row/index.js +1 -2
- package/dist/collection/components/table/expandable/row/style.css +18 -24
- package/dist/collection/components/table/header/style.css +0 -1
- package/dist/collection/components/table/row/style.css +1 -1
- package/dist/collection/components/table/style.css +3 -8
- package/dist/custom-elements/index.js +26 -20
- package/dist/esm/loader.js +1 -1
- package/dist/esm/smoothly-accordion_51.entry.js +25 -19
- package/dist/esm/smoothly.js +1 -1
- package/dist/smoothly/{p-a302008c.entry.js → p-9d825b5a.entry.js} +1 -1
- package/dist/smoothly/smoothly.esm.js +1 -1
- package/dist/types/components/picker/index.d.ts +2 -0
- package/dist/types/components.d.ts +4 -0
- package/package.json +1 -1
|
@@ -1,14 +1,9 @@
|
|
|
1
1
|
:host {
|
|
2
2
|
display: table;
|
|
3
|
-
|
|
3
|
+
border-collapse: collapse;
|
|
4
4
|
border: 1px solid rgb(var(--smoothly-dark-color));
|
|
5
|
-
width: 80
|
|
5
|
+
width: var(--table-width, 80%);
|
|
6
6
|
box-sizing: border-box;
|
|
7
7
|
background-color: rgb(var(--smoothly-default-color));
|
|
8
|
-
margin:
|
|
9
|
-
padding-bottom: 0.5rem;
|
|
10
|
-
}
|
|
11
|
-
.slot-detail > div {
|
|
12
|
-
padding: 10rem 0;
|
|
13
|
-
margin-left: 10rem;
|
|
8
|
+
margin: auto;
|
|
14
9
|
}
|
|
@@ -48057,6 +48057,8 @@ const SmoothlyPicker$1 = class extends HTMLElement {
|
|
|
48057
48057
|
this.menuClose = createEvent(this, "menuClose", 7);
|
|
48058
48058
|
this.notice = createEvent(this, "notice", 7);
|
|
48059
48059
|
this.keepFocusOnReRender = false;
|
|
48060
|
+
this.disabled = false;
|
|
48061
|
+
this.readonly = false;
|
|
48060
48062
|
this.emptyMenuLabel = "No Options";
|
|
48061
48063
|
this.multiple = false;
|
|
48062
48064
|
this.mutable = false;
|
|
@@ -48181,10 +48183,12 @@ const SmoothlyPicker$1 = class extends HTMLElement {
|
|
|
48181
48183
|
}
|
|
48182
48184
|
}
|
|
48183
48185
|
onClick() {
|
|
48184
|
-
this.
|
|
48185
|
-
|
|
48186
|
-
|
|
48187
|
-
|
|
48186
|
+
if (!(this.readonly || this.disabled)) {
|
|
48187
|
+
this.isOpen = !this.isOpen;
|
|
48188
|
+
this.inputElement.focus();
|
|
48189
|
+
this.highlightDefault();
|
|
48190
|
+
this.filterOptions();
|
|
48191
|
+
}
|
|
48188
48192
|
}
|
|
48189
48193
|
onBlur() {
|
|
48190
48194
|
this.inputElement.value = "";
|
|
@@ -48216,13 +48220,12 @@ const SmoothlyPicker$1 = class extends HTMLElement {
|
|
|
48216
48220
|
: []),
|
|
48217
48221
|
...((_d = this.options) !== null && _d !== void 0 ? _d : []),
|
|
48218
48222
|
];
|
|
48219
|
-
return (h(Host, { style: cssVariables, "has-selection": this.selections.length > 0, "is-open": this.isOpen ? "" : undefined, onMouseDown: (e) => e.preventDefault(), onClick: () => this.onClick() }, h("div", null, h("smoothly-icon", { class: "search", name: "search-outline", size: "tiny" }), h("label",
|
|
48223
|
+
return (h(Host, { style: cssVariables, "has-selection": this.selections.length > 0, "is-open": this.isOpen ? "" : undefined, onMouseDown: (e) => e.preventDefault(), onClick: () => this.onClick() }, h("div", null, h("smoothly-icon", { part: "search", class: "search", name: "search-outline", size: "tiny" }), h("label", { part: "label-element" }, this.label), h("input", { part: "input", disabled: this.disabled, readonly: this.readonly, type: "text", ref: (el) => (this.inputElement = el ? el : this.inputElement), onFocus: () => this.highlightDefault(), onBlur: () => this.onBlur(), placeholder: this.selections.length > 3
|
|
48220
48224
|
? this.selections.length.toString() + " " + this.selectionName
|
|
48221
|
-
: this.selections.map(selection => selection.name).join(", "), onKeyDown: e => this.onKeyDown(e), onInput: (e) => this.onInput(e) }), h("smoothly-icon", { class: "down", name: "chevron-down", size: "tiny" }), h("smoothly-icon", { class: "up", name: "chevron-up", size: "tiny" })), h("smoothly-menu-options", { style: { width: "100%" }, optionStyle: Object.assign({}, this.optionStyle), order: false, emptyMenuLabel: this.emptyMenuLabel, newOptionLabel: this.newOptionLabel, "max-menu-height": this.maxMenuHeight, mutable: this.mutable, ref: (el) => (this.menuElement = el !== null && el !== void 0 ? el : this.menuElement), onClick: e => e.stopPropagation(), resetHighlightOnOptionsChange: false, options: options })));
|
|
48225
|
+
: this.selections.map(selection => selection.name).join(", "), onKeyDown: e => this.onKeyDown(e), onInput: (e) => this.onInput(e) }), h("smoothly-icon", { part: "chevron", class: "down", name: "chevron-down", size: "tiny" }), h("smoothly-icon", { part: "chevron", class: "up", name: "chevron-up", size: "tiny" })), h("smoothly-menu-options", { part: "menu-options", style: { width: "100%" }, optionStyle: Object.assign({}, this.optionStyle), order: false, emptyMenuLabel: this.emptyMenuLabel, newOptionLabel: this.newOptionLabel, "max-menu-height": this.maxMenuHeight, mutable: this.mutable, ref: (el) => (this.menuElement = el !== null && el !== void 0 ? el : this.menuElement), onClick: e => e.stopPropagation(), resetHighlightOnOptionsChange: false, options: options })));
|
|
48222
48226
|
}
|
|
48223
48227
|
get element() { return this; }
|
|
48224
48228
|
static get watchers() { return {
|
|
48225
|
-
"selections": ["isOpenChangeHandler"],
|
|
48226
48229
|
"isOpen": ["isOpenChangeHandler"]
|
|
48227
48230
|
}; }
|
|
48228
48231
|
static get style() { return styleCss$o; }
|
|
@@ -48522,6 +48525,9 @@ const SmoothlySelectDemo$1 = class extends HTMLElement {
|
|
|
48522
48525
|
{ name: "Dragon", value: "dragon" },
|
|
48523
48526
|
{ name: "Kraken", value: "kraken" },
|
|
48524
48527
|
] }),
|
|
48528
|
+
h("br", null),
|
|
48529
|
+
h("smoothly-picker", { label: "readonly", readonly: true, options: [{ name: "readonly", value: "readonly" }] }),
|
|
48530
|
+
h("br", null),
|
|
48525
48531
|
h("smoothly-tab-switch", null, h("smoothly-tab", { label: "test1", open: true }, "Hello world!"), h("smoothly-tab", { label: "test2" }, "this is a test message!"), h("smoothly-tab", { label: "test3" }, "this is a test message again!")),
|
|
48526
48532
|
];
|
|
48527
48533
|
}
|
|
@@ -48769,7 +48775,7 @@ const SmoothlySvg$1 = class extends HTMLElement {
|
|
|
48769
48775
|
static get style() { return styleCss$c; }
|
|
48770
48776
|
};
|
|
48771
48777
|
|
|
48772
|
-
const styleCss$b = "
|
|
48778
|
+
const styleCss$b = "[open].sc-smoothly-tab-h{border-bottom:3px solid rgb(var(--smoothly-primary-color));box-sizing:border-box;margin-bottom:-3px}.hide.sc-smoothly-tab{display:none}label.sc-smoothly-tab{display:block;padding:.5rem;background-color:transparent;width:auto}";
|
|
48773
48779
|
|
|
48774
48780
|
const SmoothlyTab$1 = class extends HTMLElement {
|
|
48775
48781
|
constructor() {
|
|
@@ -48800,7 +48806,7 @@ const SmoothlyTab$1 = class extends HTMLElement {
|
|
|
48800
48806
|
static get style() { return styleCss$b; }
|
|
48801
48807
|
};
|
|
48802
48808
|
|
|
48803
|
-
const styleCss$a = ".sc-smoothly-tab-switch-h{display:flex;flex-direction:row;
|
|
48809
|
+
const styleCss$a = ".sc-smoothly-tab-switch-h{display:flex;flex-direction:row;justify-content:space-around;border-bottom:3px solid rgb(var(--smoothly-default-shade))}";
|
|
48804
48810
|
|
|
48805
48811
|
const SmoothlyTabSwitch$1 = class extends HTMLElement {
|
|
48806
48812
|
constructor() {
|
|
@@ -48827,7 +48833,7 @@ const SmoothlyTabSwitch$1 = class extends HTMLElement {
|
|
|
48827
48833
|
static get style() { return styleCss$a; }
|
|
48828
48834
|
};
|
|
48829
48835
|
|
|
48830
|
-
const styleCss$9 = ".sc-smoothly-table-h{display:table;
|
|
48836
|
+
const styleCss$9 = ".sc-smoothly-table-h{display:table;border-collapse:collapse;border:1px solid rgb(var(--smoothly-dark-color));width:var(--table-width, 80%);box-sizing:border-box;background-color:rgb(var(--smoothly-default-color));margin:auto}";
|
|
48831
48837
|
|
|
48832
48838
|
const Table = class extends HTMLElement {
|
|
48833
48839
|
constructor() {
|
|
@@ -48845,7 +48851,7 @@ const Table = class extends HTMLElement {
|
|
|
48845
48851
|
static get style() { return styleCss$9; }
|
|
48846
48852
|
};
|
|
48847
48853
|
|
|
48848
|
-
const styleCss$8 = ".sc-smoothly-table-cell-h{display:table-cell;
|
|
48854
|
+
const styleCss$8 = ".sc-smoothly-table-cell-h{display:table-cell;line-height:1.5rem;white-space:nowrap;padding:0.3rem 0 0.3rem 1rem}";
|
|
48849
48855
|
|
|
48850
48856
|
const TableCell = class extends HTMLElement {
|
|
48851
48857
|
constructor() {
|
|
@@ -48867,14 +48873,14 @@ const TableDemo = class extends HTMLElement {
|
|
|
48867
48873
|
}
|
|
48868
48874
|
render() {
|
|
48869
48875
|
return [
|
|
48870
|
-
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")
|
|
48871
|
-
h("smoothly-table", null, h("smoothly-table-row", null, h("smoothly-table-header", null, "Header A"), h("smoothly-table-
|
|
48876
|
+
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-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"))),
|
|
48877
|
+
h("smoothly-table", null, h("smoothly-table-row", null, h("smoothly-table-header", null, "Header A")), h("smoothly-table-expandable-row", null, h("smoothly-table-cell", null, "A Content"), h("div", { slot: "detail" }, h("smoothly-tab-switch", null, h("smoothly-tab", { label: "innertable 1", open: true }, h("smoothly-table", null, h("smoothly-table-row", null, h("smoothly-table-header", null, "Header B")), h("smoothly-table-expandable-row", null, "B Content"))), h("smoothly-tab", { label: "innertable 2" }, h("smoothly-table", null, h("smoothly-table-row", null, h("smoothly-table-header", null, "Header C")), h("smoothly-table-expandable-row", null, h("smoothly-table-cell", null, "C Content")))))))),
|
|
48872
48878
|
];
|
|
48873
48879
|
}
|
|
48874
48880
|
static get style() { return styleCss$7; }
|
|
48875
48881
|
};
|
|
48876
48882
|
|
|
48877
|
-
const styleCss$6 = ".sc-smoothly-table-expandable-cell-h{display:table-cell;
|
|
48883
|
+
const styleCss$6 = ".sc-smoothly-table-expandable-cell-h{display:table-cell;padding:0.3rem 0 0.3rem 0;cursor:pointer;line-height:1.5rem}[open].sc-smoothly-table-expandable-cell-h{position:relative;z-index:3;background-color:rgb(var(--smoothly-default-color));border:2px solid rgb(var(--smoothly-dark-color));border-bottom:none}.sc-smoothly-table-expandable-cell-h smoothly-icon.sc-smoothly-table-expandable-cell{width:0.6rem;float:left;padding:0 0.3rem;transition:transform 0.2s}[open].sc-smoothly-table-expandable-cell-h smoothly-icon.sc-smoothly-table-expandable-cell{transform:rotate(90deg)}aside.sc-smoothly-table-expandable-cell{display:flex}.hide.sc-smoothly-table-expandable-cell{display:none}.slot-detail.sc-smoothly-table-expandable-cell{position:relative;background-color:rgb(var(--smoothly-default-color));width:104%;left:-2%;border-left:2px solid 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%}";
|
|
48878
48884
|
|
|
48879
48885
|
const TableExpandableCell = class extends HTMLElement {
|
|
48880
48886
|
constructor() {
|
|
@@ -48904,7 +48910,7 @@ const TableExpandableCell = class extends HTMLElement {
|
|
|
48904
48910
|
}
|
|
48905
48911
|
}
|
|
48906
48912
|
render() {
|
|
48907
|
-
return (h(Host, { style: { textAlign: this.align } }, h("
|
|
48913
|
+
return (h(Host, { style: { textAlign: this.align } }, h("aside", null, h("smoothly-icon", { name: "chevron-forward", size: "tiny" }), h("slot", null)), h("tr", { ref: e => (this.expansionElement = e) }, h("td", { colSpan: 999, class: !this.open ? "hide" : "" }, h("div", { class: "slot-detail" }, h("slot", { name: "detail" }))))));
|
|
48908
48914
|
}
|
|
48909
48915
|
get element() { return this; }
|
|
48910
48916
|
static get watchers() { return {
|
|
@@ -48913,7 +48919,7 @@ const TableExpandableCell = class extends HTMLElement {
|
|
|
48913
48919
|
static get style() { return styleCss$6; }
|
|
48914
48920
|
};
|
|
48915
48921
|
|
|
48916
|
-
const styleCss$5 = ".sc-smoothly-table-expandable-row-h{display:table-row;
|
|
48922
|
+
const styleCss$5 = ".sc-smoothly-table-expandable-row-h{display:table-row;cursor:pointer;line-height:1.5rem}[open].sc-smoothly-table-expandable-row-h{position:relative;z-index:3;background-color:rgb(var(--smoothly-default-color));border:2px solid rgb(var(--smoothly-dark-color));border-bottom:none}.sc-smoothly-table-expandable-row-h smoothly-icon.sc-smoothly-table-expandable-row{width:0.6rem;height:1rem;margin-top:-1rem;margin-left:-1rem;transition:transform 0.2s}[open].sc-smoothly-table-expandable-row-h smoothly-icon.sc-smoothly-table-expandable-row{transform:rotate(90deg)}.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 4px 2px rgb(var(--smoothly-dark-color));box-sizing:border-box;padding:0.5rem 2%}";
|
|
48917
48923
|
|
|
48918
48924
|
const TableExpandableRow = class extends HTMLElement {
|
|
48919
48925
|
constructor() {
|
|
@@ -48936,7 +48942,7 @@ const TableExpandableRow = class extends HTMLElement {
|
|
|
48936
48942
|
this.element.after(this.expansionElement);
|
|
48937
48943
|
}
|
|
48938
48944
|
render() {
|
|
48939
|
-
return (h(Host, { style: { textAlign: this.align } }, h("slot", null), h("smoothly-
|
|
48945
|
+
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" }))))));
|
|
48940
48946
|
}
|
|
48941
48947
|
get element() { return this; }
|
|
48942
48948
|
static get watchers() { return {
|
|
@@ -48945,7 +48951,7 @@ const TableExpandableRow = class extends HTMLElement {
|
|
|
48945
48951
|
static get style() { return styleCss$5; }
|
|
48946
48952
|
};
|
|
48947
48953
|
|
|
48948
|
-
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
|
|
48954
|
+
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}";
|
|
48949
48955
|
|
|
48950
48956
|
const TableHeader = class extends HTMLElement {
|
|
48951
48957
|
constructor() {
|
|
@@ -48958,7 +48964,7 @@ const TableHeader = class extends HTMLElement {
|
|
|
48958
48964
|
static get style() { return styleCss$4; }
|
|
48959
48965
|
};
|
|
48960
48966
|
|
|
48961
|
-
const styleCss$3 = ".sc-smoothly-table-row-h{display:table-row;
|
|
48967
|
+
const styleCss$3 = ".sc-smoothly-table-row-h{display:table-row;cursor:default;line-height:1.5rem}.hide.sc-smoothly-table-row{display:none}";
|
|
48962
48968
|
|
|
48963
48969
|
const TableRow = class extends HTMLElement {
|
|
48964
48970
|
constructor() {
|
|
@@ -49114,7 +49120,7 @@ const SmoothlyMenuOptions = /*@__PURE__*/proxyCustomElement(SmoothlyMenuOptions$
|
|
|
49114
49120
|
const SmoothlyNotification = /*@__PURE__*/proxyCustomElement(Notification, [2,"smoothly-notification",{"notice":[16],"tick":[32]},[[0,"trigger","onTrigger"]]]);
|
|
49115
49121
|
const SmoothlyNotifier = /*@__PURE__*/proxyCustomElement(Notifier, [6,"smoothly-notifier",{"notices":[32]},[[0,"notice","onNotice"],[0,"remove","onRemove"]]]);
|
|
49116
49122
|
const SmoothlyOption = /*@__PURE__*/proxyCustomElement(SmoothlyOption$1, [1,"smoothly-option",{"aliases":[513],"dataHighlight":[1540,"data-highlight"],"name":[1537],"value":[1537],"divider":[1540],"new":[4]}]);
|
|
49117
|
-
const SmoothlyPicker = /*@__PURE__*/proxyCustomElement(SmoothlyPicker$1, [1,"smoothly-picker",{"maxMenuHeight":[1,"max-menu-height"],"maxHeight":[1,"max-height"],"emptyMenuLabel":[1025,"empty-menu-label"],"multiple":[516],"mutable":[4],"optionStyle":[8,"option-style"],"options":[16],"labelSetting":[513,"label-setting"],"label":[513],"selections":[1040],"selectNoneName":[1025,"select-none-name"],"selectAllName":[1025,"select-all-name"],"selectionName":[1025,"selection-name"],"newOptionLabel":[1025,"new-option-label"],"valueValidator":[16],"isOpen":[32],"empty":[32]},[[0,"optionSelect","optionSelectHandler"],[0,"optionAdd","optionAddHandler"],[0,"menuEmpty","emptyHandler"]]]);
|
|
49123
|
+
const SmoothlyPicker = /*@__PURE__*/proxyCustomElement(SmoothlyPicker$1, [1,"smoothly-picker",{"disabled":[516],"readonly":[516],"maxMenuHeight":[1,"max-menu-height"],"maxHeight":[1,"max-height"],"emptyMenuLabel":[1025,"empty-menu-label"],"multiple":[516],"mutable":[4],"optionStyle":[8,"option-style"],"options":[16],"labelSetting":[513,"label-setting"],"label":[513],"selections":[1040],"selectNoneName":[1025,"select-none-name"],"selectAllName":[1025,"select-all-name"],"selectionName":[1025,"selection-name"],"newOptionLabel":[1025,"new-option-label"],"valueValidator":[16],"isOpen":[32],"empty":[32]},[[0,"optionSelect","optionSelectHandler"],[0,"optionAdd","optionAddHandler"],[0,"menuEmpty","emptyHandler"]]]);
|
|
49118
49124
|
const SmoothlyPopup = /*@__PURE__*/proxyCustomElement(SmoothlyPopup$1, [6,"smoothly-popup",{"visible":[1540],"direction":[1537],"cssVariables":[32]}]);
|
|
49119
49125
|
const SmoothlyQuiet = /*@__PURE__*/proxyCustomElement(SmoothlyQuiet$1, [6,"smoothly-quiet",{"color":[1]}]);
|
|
49120
49126
|
const SmoothlyRadio = /*@__PURE__*/proxyCustomElement(SmoothlyRadio$1, [6,"smoothly-radio",{"name":[1],"value":[1],"checked":[1540],"tabIndex":[2,"tab-index"]}]);
|
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],"mutable":[4],"optionStyle":[8,"option-style"],"options":[16],"labelSetting":[513,"label-setting"],"label":[513],"selections":[1040],"selectNoneName":[1025,"select-none-name"],"selectAllName":[1025,"select-all-name"],"selectionName":[1025,"selection-name"],"newOptionLabel":[1025,"new-option-label"],"valueValidator":[16],"isOpen":[32],"empty":[32]},[[0,"optionSelect","optionSelectHandler"],[0,"optionAdd","optionAddHandler"],[0,"menuEmpty","emptyHandler"]]],[6,"smoothly-dialog",{"color":[513],"open":[1540],"closable":[516],"header":[513]},[[0,"trigger","TriggerListener"]]],[
|
|
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",{"disabled":[516],"readonly":[516],"maxMenuHeight":[1,"max-menu-height"],"maxHeight":[1,"max-height"],"emptyMenuLabel":[1025,"empty-menu-label"],"multiple":[516],"mutable":[4],"optionStyle":[8,"option-style"],"options":[16],"labelSetting":[513,"label-setting"],"label":[513],"selections":[1040],"selectNoneName":[1025,"select-none-name"],"selectAllName":[1025,"select-all-name"],"selectionName":[1025,"selection-name"],"newOptionLabel":[1025,"new-option-label"],"valueValidator":[16],"isOpen":[32],"empty":[32]},[[0,"optionSelect","optionSelectHandler"],[0,"optionAdd","optionAddHandler"],[0,"menuEmpty","emptyHandler"]]],[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"]]],[6,"smoothly-table-expandable-cell",{"align":[1],"open":[1540]},[[0,"click","onClick"]]],[6,"smoothly-table-expandable-row",{"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-cell"],[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"]]],[1,"smoothly-menu-options",{"emptyMenuLabel":[1025,"empty-menu-label"],"newOptionLabel":[1,"new-option-label"],"maxMenuHeight":[1,"max-menu-height"],"order":[4],"optionStyle":[8,"option-style"],"options":[1040],"resetHighlightOnOptionsChange":[1028,"reset-highlight-on-options-change"],"mutable":[4],"filteredOptions":[32],"highlightIndex":[32],"keyword":[32],"moveHighlight":[64],"setHighlight":[64],"getHighlighted":[64],"filterOptions":[64]},[[0,"optionHover","optionHoverHandler"]]],[2,"smoothly-notification",{"notice":[16],"tick":[32]},[[0,"trigger","onTrigger"]]],[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"]]],[0,"smoothly-tuple",{"tuple":[16]}],[1,"smoothly-option",{"aliases":[513],"dataHighlight":[1540,"data-highlight"],"name":[1537],"value":[1537],"divider":[1540],"new":[4]}],[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
|
|
|
@@ -46467,6 +46467,8 @@ const SmoothlyPicker = class {
|
|
|
46467
46467
|
this.menuClose = createEvent(this, "menuClose", 7);
|
|
46468
46468
|
this.notice = createEvent(this, "notice", 7);
|
|
46469
46469
|
this.keepFocusOnReRender = false;
|
|
46470
|
+
this.disabled = false;
|
|
46471
|
+
this.readonly = false;
|
|
46470
46472
|
this.emptyMenuLabel = "No Options";
|
|
46471
46473
|
this.multiple = false;
|
|
46472
46474
|
this.mutable = false;
|
|
@@ -46591,10 +46593,12 @@ const SmoothlyPicker = class {
|
|
|
46591
46593
|
}
|
|
46592
46594
|
}
|
|
46593
46595
|
onClick() {
|
|
46594
|
-
this.
|
|
46595
|
-
|
|
46596
|
-
|
|
46597
|
-
|
|
46596
|
+
if (!(this.readonly || this.disabled)) {
|
|
46597
|
+
this.isOpen = !this.isOpen;
|
|
46598
|
+
this.inputElement.focus();
|
|
46599
|
+
this.highlightDefault();
|
|
46600
|
+
this.filterOptions();
|
|
46601
|
+
}
|
|
46598
46602
|
}
|
|
46599
46603
|
onBlur() {
|
|
46600
46604
|
this.inputElement.value = "";
|
|
@@ -46626,13 +46630,12 @@ const SmoothlyPicker = class {
|
|
|
46626
46630
|
: []),
|
|
46627
46631
|
...((_d = this.options) !== null && _d !== void 0 ? _d : []),
|
|
46628
46632
|
];
|
|
46629
|
-
return (h(Host, { style: cssVariables, "has-selection": this.selections.length > 0, "is-open": this.isOpen ? "" : undefined, onMouseDown: (e) => e.preventDefault(), onClick: () => this.onClick() }, h("div", null, h("smoothly-icon", { class: "search", name: "search-outline", size: "tiny" }), h("label",
|
|
46633
|
+
return (h(Host, { style: cssVariables, "has-selection": this.selections.length > 0, "is-open": this.isOpen ? "" : undefined, onMouseDown: (e) => e.preventDefault(), onClick: () => this.onClick() }, h("div", null, h("smoothly-icon", { part: "search", class: "search", name: "search-outline", size: "tiny" }), h("label", { part: "label-element" }, this.label), h("input", { part: "input", disabled: this.disabled, readonly: this.readonly, type: "text", ref: (el) => (this.inputElement = el ? el : this.inputElement), onFocus: () => this.highlightDefault(), onBlur: () => this.onBlur(), placeholder: this.selections.length > 3
|
|
46630
46634
|
? this.selections.length.toString() + " " + this.selectionName
|
|
46631
|
-
: this.selections.map(selection => selection.name).join(", "), onKeyDown: e => this.onKeyDown(e), onInput: (e) => this.onInput(e) }), h("smoothly-icon", { class: "down", name: "chevron-down", size: "tiny" }), h("smoothly-icon", { class: "up", name: "chevron-up", size: "tiny" })), h("smoothly-menu-options", { style: { width: "100%" }, optionStyle: Object.assign({}, this.optionStyle), order: false, emptyMenuLabel: this.emptyMenuLabel, newOptionLabel: this.newOptionLabel, "max-menu-height": this.maxMenuHeight, mutable: this.mutable, ref: (el) => (this.menuElement = el !== null && el !== void 0 ? el : this.menuElement), onClick: e => e.stopPropagation(), resetHighlightOnOptionsChange: false, options: options })));
|
|
46635
|
+
: this.selections.map(selection => selection.name).join(", "), onKeyDown: e => this.onKeyDown(e), onInput: (e) => this.onInput(e) }), h("smoothly-icon", { part: "chevron", class: "down", name: "chevron-down", size: "tiny" }), h("smoothly-icon", { part: "chevron", class: "up", name: "chevron-up", size: "tiny" })), h("smoothly-menu-options", { part: "menu-options", style: { width: "100%" }, optionStyle: Object.assign({}, this.optionStyle), order: false, emptyMenuLabel: this.emptyMenuLabel, newOptionLabel: this.newOptionLabel, "max-menu-height": this.maxMenuHeight, mutable: this.mutable, ref: (el) => (this.menuElement = el !== null && el !== void 0 ? el : this.menuElement), onClick: e => e.stopPropagation(), resetHighlightOnOptionsChange: false, options: options })));
|
|
46632
46636
|
}
|
|
46633
46637
|
get element() { return getElement(this); }
|
|
46634
46638
|
static get watchers() { return {
|
|
46635
|
-
"selections": ["isOpenChangeHandler"],
|
|
46636
46639
|
"isOpen": ["isOpenChangeHandler"]
|
|
46637
46640
|
}; }
|
|
46638
46641
|
};
|
|
@@ -46815,6 +46818,9 @@ const SmoothlySelectDemo = class {
|
|
|
46815
46818
|
{ name: "Dragon", value: "dragon" },
|
|
46816
46819
|
{ name: "Kraken", value: "kraken" },
|
|
46817
46820
|
] }),
|
|
46821
|
+
h("br", null),
|
|
46822
|
+
h("smoothly-picker", { label: "readonly", readonly: true, options: [{ name: "readonly", value: "readonly" }] }),
|
|
46823
|
+
h("br", null),
|
|
46818
46824
|
h("smoothly-tab-switch", null, h("smoothly-tab", { label: "test1", open: true }, "Hello world!"), h("smoothly-tab", { label: "test2" }, "this is a test message!"), h("smoothly-tab", { label: "test3" }, "this is a test message again!")),
|
|
46819
46825
|
];
|
|
46820
46826
|
}
|
|
@@ -47057,7 +47063,7 @@ const SmoothlySvg = class {
|
|
|
47057
47063
|
};
|
|
47058
47064
|
SmoothlySvg.style = styleCss$a;
|
|
47059
47065
|
|
|
47060
|
-
const styleCss$9 = "
|
|
47066
|
+
const styleCss$9 = "[open].sc-smoothly-tab-h{border-bottom:3px solid rgb(var(--smoothly-primary-color));box-sizing:border-box;margin-bottom:-3px}.hide.sc-smoothly-tab{display:none}label.sc-smoothly-tab{display:block;padding:.5rem;background-color:transparent;width:auto}";
|
|
47061
47067
|
|
|
47062
47068
|
const SmoothlyTab = class {
|
|
47063
47069
|
constructor(hostRef) {
|
|
@@ -47087,7 +47093,7 @@ const SmoothlyTab = class {
|
|
|
47087
47093
|
};
|
|
47088
47094
|
SmoothlyTab.style = styleCss$9;
|
|
47089
47095
|
|
|
47090
|
-
const styleCss$8 = ".sc-smoothly-tab-switch-h{display:flex;flex-direction:row;
|
|
47096
|
+
const styleCss$8 = ".sc-smoothly-tab-switch-h{display:flex;flex-direction:row;justify-content:space-around;border-bottom:3px solid rgb(var(--smoothly-default-shade))}";
|
|
47091
47097
|
|
|
47092
47098
|
const SmoothlyTabSwitch = class {
|
|
47093
47099
|
constructor(hostRef) {
|
|
@@ -47113,7 +47119,7 @@ const SmoothlyTabSwitch = class {
|
|
|
47113
47119
|
};
|
|
47114
47120
|
SmoothlyTabSwitch.style = styleCss$8;
|
|
47115
47121
|
|
|
47116
|
-
const styleCss$7 = ".sc-smoothly-table-h{display:table;
|
|
47122
|
+
const styleCss$7 = ".sc-smoothly-table-h{display:table;border-collapse:collapse;border:1px solid rgb(var(--smoothly-dark-color));width:var(--table-width, 80%);box-sizing:border-box;background-color:rgb(var(--smoothly-default-color));margin:auto}";
|
|
47117
47123
|
|
|
47118
47124
|
const Table = class {
|
|
47119
47125
|
constructor(hostRef) {
|
|
@@ -47130,7 +47136,7 @@ const Table = class {
|
|
|
47130
47136
|
};
|
|
47131
47137
|
Table.style = styleCss$7;
|
|
47132
47138
|
|
|
47133
|
-
const styleCss$6 = ".sc-smoothly-table-cell-h{display:table-cell;
|
|
47139
|
+
const styleCss$6 = ".sc-smoothly-table-cell-h{display:table-cell;line-height:1.5rem;white-space:nowrap;padding:0.3rem 0 0.3rem 1rem}";
|
|
47134
47140
|
|
|
47135
47141
|
const TableCell = class {
|
|
47136
47142
|
constructor(hostRef) {
|
|
@@ -47150,14 +47156,14 @@ const TableDemo = class {
|
|
|
47150
47156
|
}
|
|
47151
47157
|
render() {
|
|
47152
47158
|
return [
|
|
47153
|
-
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")
|
|
47154
|
-
h("smoothly-table", null, h("smoothly-table-row", null, h("smoothly-table-header", null, "Header A"), h("smoothly-table-
|
|
47159
|
+
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-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"))),
|
|
47160
|
+
h("smoothly-table", null, h("smoothly-table-row", null, h("smoothly-table-header", null, "Header A")), h("smoothly-table-expandable-row", null, h("smoothly-table-cell", null, "A Content"), h("div", { slot: "detail" }, h("smoothly-tab-switch", null, h("smoothly-tab", { label: "innertable 1", open: true }, h("smoothly-table", null, h("smoothly-table-row", null, h("smoothly-table-header", null, "Header B")), h("smoothly-table-expandable-row", null, "B Content"))), h("smoothly-tab", { label: "innertable 2" }, h("smoothly-table", null, h("smoothly-table-row", null, h("smoothly-table-header", null, "Header C")), h("smoothly-table-expandable-row", null, h("smoothly-table-cell", null, "C Content")))))))),
|
|
47155
47161
|
];
|
|
47156
47162
|
}
|
|
47157
47163
|
};
|
|
47158
47164
|
TableDemo.style = styleCss$5;
|
|
47159
47165
|
|
|
47160
|
-
const styleCss$4 = ".sc-smoothly-table-expandable-cell-h{display:table-cell;
|
|
47166
|
+
const styleCss$4 = ".sc-smoothly-table-expandable-cell-h{display:table-cell;padding:0.3rem 0 0.3rem 0;cursor:pointer;line-height:1.5rem}[open].sc-smoothly-table-expandable-cell-h{position:relative;z-index:3;background-color:rgb(var(--smoothly-default-color));border:2px solid rgb(var(--smoothly-dark-color));border-bottom:none}.sc-smoothly-table-expandable-cell-h smoothly-icon.sc-smoothly-table-expandable-cell{width:0.6rem;float:left;padding:0 0.3rem;transition:transform 0.2s}[open].sc-smoothly-table-expandable-cell-h smoothly-icon.sc-smoothly-table-expandable-cell{transform:rotate(90deg)}aside.sc-smoothly-table-expandable-cell{display:flex}.hide.sc-smoothly-table-expandable-cell{display:none}.slot-detail.sc-smoothly-table-expandable-cell{position:relative;background-color:rgb(var(--smoothly-default-color));width:104%;left:-2%;border-left:2px solid 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%}";
|
|
47161
47167
|
|
|
47162
47168
|
const TableExpandableCell = class {
|
|
47163
47169
|
constructor(hostRef) {
|
|
@@ -47186,7 +47192,7 @@ const TableExpandableCell = class {
|
|
|
47186
47192
|
}
|
|
47187
47193
|
}
|
|
47188
47194
|
render() {
|
|
47189
|
-
return (h(Host, { style: { textAlign: this.align } }, h("
|
|
47195
|
+
return (h(Host, { style: { textAlign: this.align } }, h("aside", null, h("smoothly-icon", { name: "chevron-forward", size: "tiny" }), h("slot", null)), h("tr", { ref: e => (this.expansionElement = e) }, h("td", { colSpan: 999, class: !this.open ? "hide" : "" }, h("div", { class: "slot-detail" }, h("slot", { name: "detail" }))))));
|
|
47190
47196
|
}
|
|
47191
47197
|
get element() { return getElement(this); }
|
|
47192
47198
|
static get watchers() { return {
|
|
@@ -47195,7 +47201,7 @@ const TableExpandableCell = class {
|
|
|
47195
47201
|
};
|
|
47196
47202
|
TableExpandableCell.style = styleCss$4;
|
|
47197
47203
|
|
|
47198
|
-
const styleCss$3 = ".sc-smoothly-table-expandable-row-h{display:table-row;
|
|
47204
|
+
const styleCss$3 = ".sc-smoothly-table-expandable-row-h{display:table-row;cursor:pointer;line-height:1.5rem}[open].sc-smoothly-table-expandable-row-h{position:relative;z-index:3;background-color:rgb(var(--smoothly-default-color));border:2px solid rgb(var(--smoothly-dark-color));border-bottom:none}.sc-smoothly-table-expandable-row-h smoothly-icon.sc-smoothly-table-expandable-row{width:0.6rem;height:1rem;margin-top:-1rem;margin-left:-1rem;transition:transform 0.2s}[open].sc-smoothly-table-expandable-row-h smoothly-icon.sc-smoothly-table-expandable-row{transform:rotate(90deg)}.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 4px 2px rgb(var(--smoothly-dark-color));box-sizing:border-box;padding:0.5rem 2%}";
|
|
47199
47205
|
|
|
47200
47206
|
const TableExpandableRow = class {
|
|
47201
47207
|
constructor(hostRef) {
|
|
@@ -47217,7 +47223,7 @@ const TableExpandableRow = class {
|
|
|
47217
47223
|
this.element.after(this.expansionElement);
|
|
47218
47224
|
}
|
|
47219
47225
|
render() {
|
|
47220
|
-
return (h(Host, { style: { textAlign: this.align } }, h("slot", null), h("smoothly-
|
|
47226
|
+
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" }))))));
|
|
47221
47227
|
}
|
|
47222
47228
|
get element() { return getElement(this); }
|
|
47223
47229
|
static get watchers() { return {
|
|
@@ -47226,7 +47232,7 @@ const TableExpandableRow = class {
|
|
|
47226
47232
|
};
|
|
47227
47233
|
TableExpandableRow.style = styleCss$3;
|
|
47228
47234
|
|
|
47229
|
-
const styleCss$2 = ".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
|
|
47235
|
+
const styleCss$2 = ".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}";
|
|
47230
47236
|
|
|
47231
47237
|
const TableHeader = class {
|
|
47232
47238
|
constructor(hostRef) {
|
|
@@ -47238,7 +47244,7 @@ const TableHeader = class {
|
|
|
47238
47244
|
};
|
|
47239
47245
|
TableHeader.style = styleCss$2;
|
|
47240
47246
|
|
|
47241
|
-
const styleCss$1 = ".sc-smoothly-table-row-h{display:table-row;
|
|
47247
|
+
const styleCss$1 = ".sc-smoothly-table-row-h{display:table-row;cursor:default;line-height:1.5rem}.hide.sc-smoothly-table-row{display:none}";
|
|
47242
47248
|
|
|
47243
47249
|
const TableRow = class {
|
|
47244
47250
|
constructor(hostRef) {
|
package/dist/esm/smoothly.js
CHANGED
|
@@ -13,5 +13,5 @@ const patchBrowser = () => {
|
|
|
13
13
|
};
|
|
14
14
|
|
|
15
15
|
patchBrowser().then(options => {
|
|
16
|
-
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],"mutable":[4],"optionStyle":[8,"option-style"],"options":[16],"labelSetting":[513,"label-setting"],"label":[513],"selections":[1040],"selectNoneName":[1025,"select-none-name"],"selectAllName":[1025,"select-all-name"],"selectionName":[1025,"selection-name"],"newOptionLabel":[1025,"new-option-label"],"valueValidator":[16],"isOpen":[32],"empty":[32]},[[0,"optionSelect","optionSelectHandler"],[0,"optionAdd","optionAddHandler"],[0,"menuEmpty","emptyHandler"]]],[6,"smoothly-dialog",{"color":[513],"open":[1540],"closable":[516],"header":[513]},[[0,"trigger","TriggerListener"]]],[
|
|
16
|
+
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",{"disabled":[516],"readonly":[516],"maxMenuHeight":[1,"max-menu-height"],"maxHeight":[1,"max-height"],"emptyMenuLabel":[1025,"empty-menu-label"],"multiple":[516],"mutable":[4],"optionStyle":[8,"option-style"],"options":[16],"labelSetting":[513,"label-setting"],"label":[513],"selections":[1040],"selectNoneName":[1025,"select-none-name"],"selectAllName":[1025,"select-all-name"],"selectionName":[1025,"selection-name"],"newOptionLabel":[1025,"new-option-label"],"valueValidator":[16],"isOpen":[32],"empty":[32]},[[0,"optionSelect","optionSelectHandler"],[0,"optionAdd","optionAddHandler"],[0,"menuEmpty","emptyHandler"]]],[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"]]],[6,"smoothly-table-expandable-cell",{"align":[1],"open":[1540]},[[0,"click","onClick"]]],[6,"smoothly-table-expandable-row",{"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-cell"],[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"]]],[1,"smoothly-menu-options",{"emptyMenuLabel":[1025,"empty-menu-label"],"newOptionLabel":[1,"new-option-label"],"maxMenuHeight":[1,"max-menu-height"],"order":[4],"optionStyle":[8,"option-style"],"options":[1040],"resetHighlightOnOptionsChange":[1028,"reset-highlight-on-options-change"],"mutable":[4],"filteredOptions":[32],"highlightIndex":[32],"keyword":[32],"moveHighlight":[64],"setHighlight":[64],"getHighlighted":[64],"filterOptions":[64]},[[0,"optionHover","optionHoverHandler"]]],[2,"smoothly-notification",{"notice":[16],"tick":[32]},[[0,"trigger","onTrigger"]]],[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"]]],[0,"smoothly-tuple",{"tuple":[16]}],[1,"smoothly-option",{"aliases":[513],"dataHighlight":[1540,"data-highlight"],"name":[1537],"value":[1537],"divider":[1540],"new":[4]}],[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);
|
|
17
17
|
});
|