smoothly 0.3.5 → 0.3.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.
Files changed (103) hide show
  1. package/dist/cjs/{index-3efe2a41.js → index-3fb97927.js} +467 -269
  2. package/dist/cjs/{index-2a011313.js → index-7b75b331.js} +1 -1
  3. package/dist/cjs/index.cjs.js +2 -2
  4. package/dist/cjs/loader.cjs.js +3 -3
  5. package/dist/cjs/smoothly-accordion_53.cjs.entry.js +68 -26
  6. package/dist/cjs/smoothly-google-font.cjs.entry.js +1 -1
  7. package/dist/cjs/smoothly-radio-group.cjs.entry.js +1 -1
  8. package/dist/cjs/smoothly-reorder.cjs.entry.js +1 -1
  9. package/dist/cjs/smoothly-trigger-sink.cjs.entry.js +1 -1
  10. package/dist/cjs/smoothly-trigger-source.cjs.entry.js +1 -1
  11. package/dist/cjs/smoothly.cjs.js +3 -3
  12. package/dist/collection/collection-manifest.json +2 -2
  13. package/dist/collection/components/App.js +38 -46
  14. package/dist/collection/components/accordion/index.js +65 -55
  15. package/dist/collection/components/accordion-item/index.js +133 -131
  16. package/dist/collection/components/app/index.js +37 -32
  17. package/dist/collection/components/app-demo/index.js +39 -68
  18. package/dist/collection/components/backtotop/index.js +73 -66
  19. package/dist/collection/components/button/index.js +144 -141
  20. package/dist/collection/components/calendar/index.js +277 -268
  21. package/dist/collection/components/checkbox/index.js +120 -110
  22. package/dist/collection/components/dialog/index.js +97 -93
  23. package/dist/collection/components/dialog-demo/index.js +2 -3
  24. package/dist/collection/components/display/index.js +108 -102
  25. package/dist/collection/components/display-amount/index.js +68 -63
  26. package/dist/collection/components/display-date-time/index.js +35 -30
  27. package/dist/collection/components/display-demo/index.js +23 -129
  28. package/dist/collection/components/frame/index.js +134 -124
  29. package/dist/collection/components/google-font/index.js +26 -24
  30. package/dist/collection/components/icon/index.js +116 -107
  31. package/dist/collection/components/icon-demo/index.js +11 -7
  32. package/dist/collection/components/input/index.js +364 -355
  33. package/dist/collection/components/input-date/index.js +165 -156
  34. package/dist/collection/components/input-date-range/index.js +220 -213
  35. package/dist/collection/components/input-demo/index.js +2 -87
  36. package/dist/collection/components/input-month/index.js +65 -57
  37. package/dist/collection/components/item/index.js +101 -87
  38. package/dist/collection/components/menu-options/index.js +287 -275
  39. package/dist/collection/components/notification/index.js +74 -63
  40. package/dist/collection/components/notifier/index.js +31 -23
  41. package/dist/collection/components/option/index.js +227 -223
  42. package/dist/collection/components/picker/index.js +404 -397
  43. package/dist/collection/components/popup/index.js +73 -69
  44. package/dist/collection/components/quiet/index.js +33 -28
  45. package/dist/collection/components/radio/index.js +98 -91
  46. package/dist/collection/components/radio-button/index.js +92 -83
  47. package/dist/collection/components/radio-button/item/index.js +91 -66
  48. package/dist/collection/components/radio-button/item/style.css +9 -15
  49. package/dist/collection/components/radio-group/index.js +33 -27
  50. package/dist/collection/components/reorder/index.js +28 -23
  51. package/dist/collection/components/room/index.js +73 -71
  52. package/dist/collection/components/select/index.js +82 -75
  53. package/dist/collection/components/select-demo/index.js +24 -42
  54. package/dist/collection/components/selector/index.js +71 -68
  55. package/dist/collection/components/skeleton/index.js +112 -106
  56. package/dist/collection/components/spinner/index.js +50 -46
  57. package/dist/collection/components/submit/index.js +174 -163
  58. package/dist/collection/components/svg/index.js +65 -60
  59. package/dist/collection/components/tab/index.js +84 -75
  60. package/dist/collection/components/tab-switch/index.js +32 -23
  61. package/dist/collection/components/table/cell/index.js +12 -9
  62. package/dist/collection/components/table/demo/index.js +13 -59
  63. package/dist/collection/components/table/expandable/cell/index.js +100 -95
  64. package/dist/collection/components/table/expandable/row/index.js +85 -79
  65. package/dist/collection/components/table/header/index.js +33 -28
  66. package/dist/collection/components/table/index.js +44 -36
  67. package/dist/collection/components/table/row/index.js +26 -20
  68. package/dist/collection/components/trigger/index.js +174 -166
  69. package/dist/collection/components/trigger-sink/index.js +73 -65
  70. package/dist/collection/components/trigger-source/index.js +71 -63
  71. package/dist/collection/components/tuple/index.js +19 -17
  72. package/dist/collection/components/urlencoded/index.js +22 -20
  73. package/dist/collection/model/Listenable.js +4 -2
  74. package/dist/custom-elements/index.js +67 -25
  75. package/dist/esm/{index-1d438ba2.js → index-3b463176.js} +1 -1
  76. package/dist/esm/{index-4d9efff8.js → index-fcf8bdd3.js} +467 -269
  77. package/dist/esm/index.js +2 -2
  78. package/dist/esm/loader.js +3 -3
  79. package/dist/esm/polyfills/css-shim.js +1 -1
  80. package/dist/esm/smoothly-accordion_53.entry.js +68 -26
  81. package/dist/esm/smoothly-google-font.entry.js +1 -1
  82. package/dist/esm/smoothly-radio-group.entry.js +1 -1
  83. package/dist/esm/smoothly-reorder.entry.js +1 -1
  84. package/dist/esm/smoothly-trigger-sink.entry.js +1 -1
  85. package/dist/esm/smoothly-trigger-source.entry.js +1 -1
  86. package/dist/esm/smoothly.js +3 -3
  87. package/dist/smoothly/index.esm.js +1 -1
  88. package/dist/smoothly/{p-d5d4832d.entry.js → p-0833f25c.entry.js} +1 -1
  89. package/dist/smoothly/{p-919ae3e8.entry.js → p-2bf8c660.entry.js} +1 -1
  90. package/dist/smoothly/{p-8e4e941e.entry.js → p-3bd18eea.entry.js} +1 -1
  91. package/dist/smoothly/{p-9bc77fba.entry.js → p-a1c137fc.entry.js} +1 -1
  92. package/dist/smoothly/p-af26b4ed.entry.js +1 -0
  93. package/dist/smoothly/p-af90d05a.js +2 -0
  94. package/dist/smoothly/{p-76e88859.js → p-e5191036.js} +1 -1
  95. package/dist/smoothly/{p-7a5eda51.entry.js → p-f67259c5.entry.js} +1 -1
  96. package/dist/smoothly/smoothly.esm.js +1 -1
  97. package/dist/types/components/radio-button/item/index.d.ts +2 -0
  98. package/dist/types/components.d.ts +3 -1
  99. package/dist/types/stencil-public-runtime.d.ts +15 -4
  100. package/loader/package.json +1 -0
  101. package/package.json +6 -6
  102. package/dist/smoothly/p-191ee4b8.js +0 -2
  103. package/dist/smoothly/p-78b676aa.entry.js +0 -1
@@ -1,4 +1,4 @@
1
- import { Component, Element, Event, h, Prop } from "@stencil/core";
1
+ import { h } from "@stencil/core";
2
2
  import { Message, Trigger } from "../../model";
3
3
  export class SmoothlyTriggerSource {
4
4
  componentDidLoad() {
@@ -14,71 +14,79 @@ export class SmoothlyTriggerSource {
14
14
  }
15
15
  static get is() { return "smoothly-trigger-source"; }
16
16
  static get encapsulation() { return "scoped"; }
17
- static get originalStyleUrls() { return {
18
- "$": ["style.css"]
19
- }; }
20
- static get styleUrls() { return {
21
- "$": ["style.css"]
22
- }; }
23
- static get properties() { return {
24
- "listen": {
25
- "type": "string",
26
- "mutable": false,
27
- "complexType": {
28
- "original": "string",
29
- "resolved": "string",
30
- "references": {}
31
- },
32
- "required": false,
33
- "optional": false,
34
- "docs": {
35
- "tags": [],
36
- "text": ""
37
- },
38
- "attribute": "listen",
39
- "reflect": false
40
- }
41
- }; }
42
- static get events() { return [{
43
- "method": "trigger",
44
- "name": "trigger",
45
- "bubbles": true,
46
- "cancelable": true,
47
- "composed": true,
48
- "docs": {
49
- "tags": [],
50
- "text": ""
51
- },
52
- "complexType": {
53
- "original": "Trigger",
54
- "resolved": "Trigger",
55
- "references": {
56
- "Trigger": {
57
- "location": "import",
58
- "path": "../../model"
17
+ static get originalStyleUrls() {
18
+ return {
19
+ "$": ["style.css"]
20
+ };
21
+ }
22
+ static get styleUrls() {
23
+ return {
24
+ "$": ["style.css"]
25
+ };
26
+ }
27
+ static get properties() {
28
+ return {
29
+ "listen": {
30
+ "type": "string",
31
+ "mutable": false,
32
+ "complexType": {
33
+ "original": "string",
34
+ "resolved": "string",
35
+ "references": {}
36
+ },
37
+ "required": false,
38
+ "optional": false,
39
+ "docs": {
40
+ "tags": [],
41
+ "text": ""
42
+ },
43
+ "attribute": "listen",
44
+ "reflect": false
45
+ }
46
+ };
47
+ }
48
+ static get events() {
49
+ return [{
50
+ "method": "trigger",
51
+ "name": "trigger",
52
+ "bubbles": true,
53
+ "cancelable": true,
54
+ "composed": true,
55
+ "docs": {
56
+ "tags": [],
57
+ "text": ""
58
+ },
59
+ "complexType": {
60
+ "original": "Trigger",
61
+ "resolved": "Trigger",
62
+ "references": {
63
+ "Trigger": {
64
+ "location": "import",
65
+ "path": "../../model"
66
+ }
59
67
  }
60
68
  }
61
- }
62
- }, {
63
- "method": "message",
64
- "name": "message",
65
- "bubbles": true,
66
- "cancelable": true,
67
- "composed": true,
68
- "docs": {
69
- "tags": [],
70
- "text": ""
71
- },
72
- "complexType": {
73
- "original": "Message<any>",
74
- "resolved": "Message<any>",
75
- "references": {
76
- "Message": {
77
- "location": "import",
78
- "path": "../../model"
69
+ }, {
70
+ "method": "message",
71
+ "name": "message",
72
+ "bubbles": true,
73
+ "cancelable": true,
74
+ "composed": true,
75
+ "docs": {
76
+ "tags": [],
77
+ "text": ""
78
+ },
79
+ "complexType": {
80
+ "original": "Message<any>",
81
+ "resolved": "Message<any>",
82
+ "references": {
83
+ "Message": {
84
+ "location": "import",
85
+ "path": "../../model"
86
+ }
79
87
  }
80
88
  }
81
- }
82
- }]; }
89
+ }];
90
+ }
83
91
  static get elementRef() { return "element"; }
84
92
  }
@@ -1,24 +1,26 @@
1
- import { Component, h, Prop } from "@stencil/core";
1
+ import { h } from "@stencil/core";
2
2
  export class SmoothlyTuple {
3
3
  render() {
4
4
  return [h("b", null, this.tuple[0]), ": ", this.tuple[1], h("br", null)];
5
5
  }
6
6
  static get is() { return "smoothly-tuple"; }
7
- static get properties() { return {
8
- "tuple": {
9
- "type": "unknown",
10
- "mutable": false,
11
- "complexType": {
12
- "original": "[string, string]",
13
- "resolved": "[string, string]",
14
- "references": {}
15
- },
16
- "required": false,
17
- "optional": false,
18
- "docs": {
19
- "tags": [],
20
- "text": ""
7
+ static get properties() {
8
+ return {
9
+ "tuple": {
10
+ "type": "unknown",
11
+ "mutable": false,
12
+ "complexType": {
13
+ "original": "[string, string]",
14
+ "resolved": "[string, string]",
15
+ "references": {}
16
+ },
17
+ "required": false,
18
+ "optional": false,
19
+ "docs": {
20
+ "tags": [],
21
+ "text": ""
22
+ }
21
23
  }
22
- }
23
- }; }
24
+ };
25
+ }
24
26
  }
@@ -1,4 +1,4 @@
1
- import { Component, h, Prop } from "@stencil/core";
1
+ import { h } from "@stencil/core";
2
2
  export class Urlencoded {
3
3
  render() {
4
4
  return this.data
@@ -7,23 +7,25 @@ export class Urlencoded {
7
7
  .map(tuple => h("smoothly-tuple", { tuple: tuple }));
8
8
  }
9
9
  static get is() { return "smoothly-urlencoded"; }
10
- static get properties() { return {
11
- "data": {
12
- "type": "string",
13
- "mutable": false,
14
- "complexType": {
15
- "original": "string",
16
- "resolved": "string",
17
- "references": {}
18
- },
19
- "required": false,
20
- "optional": false,
21
- "docs": {
22
- "tags": [],
23
- "text": ""
24
- },
25
- "attribute": "data",
26
- "reflect": false
27
- }
28
- }; }
10
+ static get properties() {
11
+ return {
12
+ "data": {
13
+ "type": "string",
14
+ "mutable": false,
15
+ "complexType": {
16
+ "original": "string",
17
+ "resolved": "string",
18
+ "references": {}
19
+ },
20
+ "required": false,
21
+ "optional": false,
22
+ "docs": {
23
+ "tags": [],
24
+ "text": ""
25
+ },
26
+ "attribute": "data",
27
+ "reflect": false
28
+ }
29
+ };
30
+ }
29
31
  }
@@ -1,6 +1,8 @@
1
1
  var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
2
- if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
3
- if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
2
+ if (kind === "a" && !f)
3
+ throw new TypeError("Private accessor was defined without a getter");
4
+ if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
5
+ throw new TypeError("Cannot read private member from an object whose class did not declare it");
4
6
  return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
5
7
  };
6
8
  var _Listenable_listeners;
@@ -5628,22 +5628,33 @@ var Date$2;
5628
5628
  return Date.create(result);
5629
5629
  }
5630
5630
  Date.lastOfWeek = lastOfWeek;
5631
- function getYear(time) {
5632
- return Number.parseInt(time.substring(0, 4));
5631
+ function getYear(date) {
5632
+ return Number.parseInt(date.substring(0, 4));
5633
5633
  }
5634
5634
  Date.getYear = getYear;
5635
- function getMonth(time) {
5636
- return Number.parseInt(time.substring(5, 7));
5635
+ function getMonth(date) {
5636
+ return Number.parseInt(date.substring(5, 7));
5637
5637
  }
5638
5638
  Date.getMonth = getMonth;
5639
- function getDay(time) {
5640
- return Number.parseInt(time.substring(8, 10));
5639
+ function getDay(date) {
5640
+ return Number.parseInt(date.substring(8, 10));
5641
5641
  }
5642
5642
  Date.getDay = getDay;
5643
- function getWeekDay(time) {
5644
- return new globalThis.Date(time).getDay();
5643
+ function getWeekDay(date) {
5644
+ return new globalThis.Date(date).getDay();
5645
5645
  }
5646
5646
  Date.getWeekDay = getWeekDay;
5647
+ function nextWeekday(date, days = 1, holidays = []) {
5648
+ const holidaySet = new Set(holidays);
5649
+ let result = next(date, days);
5650
+ let weekday = getWeekDay(result);
5651
+ while (weekday == 6 || weekday == 0 || holidaySet.has(result)) {
5652
+ result = next(result, weekday == 6 ? 2 : 1);
5653
+ weekday = getWeekDay(result);
5654
+ }
5655
+ return result;
5656
+ }
5657
+ Date.nextWeekday = nextWeekday;
5647
5658
  function span(date, relative) {
5648
5659
  return {
5649
5660
  years: getYear(date) - getYear(relative),
@@ -5652,6 +5663,14 @@ var Date$2;
5652
5663
  };
5653
5664
  }
5654
5665
  Date.span = span;
5666
+ Date.epochStart = "0000-01-01";
5667
+ Date.epochEnd = "9999-12-31";
5668
+ function invert(date) {
5669
+ return `${(9999 - getYear(date)).toFixed(0).padStart(4, "0")}-${(13 - getMonth(date))
5670
+ .toFixed(0)
5671
+ .padStart(2, "0")}-${(32 - getDay(date)).toFixed(0).padStart(2, "0")}`;
5672
+ }
5673
+ Date.invert = invert;
5655
5674
  })(Date$2 || (Date$2 = {}));
5656
5675
 
5657
5676
  var DateRange$1;
@@ -5749,29 +5768,28 @@ var DateTime$1;
5749
5768
  return (v[0] >= "0" && v[0] <= "5" && v[1] >= "0" && v[1] <= "9") || v == "60" || v == "61";
5750
5769
  }
5751
5770
  function is(value) {
5752
- const length = value.length;
5753
5771
  return (typeof value == "string" &&
5754
- length >= 13 &&
5755
- length <= 29 &&
5772
+ value.length >= 13 &&
5773
+ value.length <= 29 &&
5756
5774
  Date$2.is(value.substring(0, 10)) &&
5757
5775
  value[10] == "T" &&
5758
5776
  isHours(value.substring(11, 13)) &&
5759
- (length == 13 ||
5777
+ (value.length == 13 ||
5760
5778
  TimeZone.is(value.substring(13)) ||
5761
5779
  (value[13] == ":" &&
5762
- length >= 16 &&
5780
+ value.length >= 16 &&
5763
5781
  isMinutes(value.substring(14, 16)) &&
5764
- (length == 16 ||
5782
+ (value.length == 16 ||
5765
5783
  TimeZone.is(value.substring(16)) ||
5766
5784
  (value[16] == ":" &&
5767
- length >= 19 &&
5785
+ value.length >= 19 &&
5768
5786
  isSeconds(value.substring(17, 19)) &&
5769
- (length == 19 ||
5787
+ (value.length == 19 ||
5770
5788
  TimeZone.is(value.substring(19)) ||
5771
5789
  (value[19] == "." &&
5772
- length >= 23 &&
5790
+ value.length >= 23 &&
5773
5791
  [...value.substring(20, 23)].every(c => c >= "0" && c <= "9") &&
5774
- (length == 23 || TimeZone.is(value.substring(23))))))))));
5792
+ (value.length == 23 || TimeZone.is(value.substring(23))))))))));
5775
5793
  }
5776
5794
  DateTime.is = is;
5777
5795
  function parse(value) {
@@ -5989,7 +6007,9 @@ var DateTime$1;
5989
6007
  DateTime.previousHour = previousHour;
5990
6008
  function nextDay(time, days = 1) {
5991
6009
  const result = parse(time);
6010
+ const offset = result.getTimezoneOffset();
5992
6011
  result.setDate(result.getDate() + days);
6012
+ result.setMinutes(result.getMinutes() + offset - result.getTimezoneOffset());
5993
6013
  return DateTime.create(result);
5994
6014
  }
5995
6015
  DateTime.nextDay = nextDay;
@@ -5999,7 +6019,9 @@ var DateTime$1;
5999
6019
  DateTime.previousDay = previousDay;
6000
6020
  function nextMonth(time, months = 1) {
6001
6021
  const result = parse(time);
6022
+ const offset = result.getTimezoneOffset();
6002
6023
  result.setMonth(result.getMonth() + months);
6024
+ result.setMinutes(result.getMinutes() + offset - result.getTimezoneOffset());
6003
6025
  return DateTime.create(result);
6004
6026
  }
6005
6027
  DateTime.nextMonth = nextMonth;
@@ -6063,6 +6085,16 @@ var DateTime$1;
6063
6085
  };
6064
6086
  }
6065
6087
  DateTime.span = span;
6088
+ DateTime.epochStart = "0000-01-01T00:00:00.000Z";
6089
+ DateTime.epochEnd = "9999-12-31T23:59:59.999Z";
6090
+ function invert(time) {
6091
+ return `${Date$2.invert(getDate(time))}T${(24 - getHour(time)).toFixed(0).padStart(2, "0")}:${(60 - getMinute(time))
6092
+ .toFixed(0)
6093
+ .padStart(2, "0")}:${(60 - getSecond(time)).toFixed(0).padStart(2, "0")}.${(999 - getMillisecond(time))
6094
+ .toFixed(0)
6095
+ .padStart(3, "0")}Z`;
6096
+ }
6097
+ DateTime.invert = invert;
6066
6098
  })(DateTime$1 || (DateTime$1 = {}));
6067
6099
 
6068
6100
  class Transcoder$1 {
@@ -7806,7 +7838,7 @@ var TimeSpan$1;
7806
7838
  }
7807
7839
  TimeSpan.is = is;
7808
7840
  function toHours(value, round) {
7809
- const result = (value.milliseconds ?? 0) / (60 * 60 * 1000) +
7841
+ const result = (dateToMilliseconds(value) + (value.milliseconds ?? 0)) / (60 * 60 * 1000) +
7810
7842
  (value.seconds ?? 0) / (60 * 60) +
7811
7843
  (value.minutes ?? 0) / 60 +
7812
7844
  (value.hours ?? 0);
@@ -7814,7 +7846,7 @@ var TimeSpan$1;
7814
7846
  }
7815
7847
  TimeSpan.toHours = toHours;
7816
7848
  function toMinutes(value, round) {
7817
- const result = (value.milliseconds ?? 0) / (60 * 1000) +
7849
+ const result = (dateToMilliseconds(value) + (value.milliseconds ?? 0)) / (60 * 1000) +
7818
7850
  (value.seconds ?? 0) / 60 +
7819
7851
  (value.minutes ?? 0) +
7820
7852
  (value.hours ?? 0) * 60;
@@ -7822,12 +7854,16 @@ var TimeSpan$1;
7822
7854
  }
7823
7855
  TimeSpan.toMinutes = toMinutes;
7824
7856
  function toSeconds(value, round) {
7825
- const result = (value.milliseconds ?? 0) / 1000 + (value.seconds ?? 0) + (value.minutes ?? 0) * 60 + (value.hours ?? 0) * 60 * 60;
7857
+ const result = (dateToMilliseconds(value) + (value.milliseconds ?? 0)) / 1000 +
7858
+ (value.seconds ?? 0) +
7859
+ (value.minutes ?? 0) * 60 +
7860
+ (value.hours ?? 0) * 60 * 60;
7826
7861
  return performRound$1(result, round);
7827
7862
  }
7828
7863
  TimeSpan.toSeconds = toSeconds;
7829
7864
  function toMilliseconds(value, round) {
7830
- const result = (value.milliseconds ?? 0) +
7865
+ const result = dateToMilliseconds(value) +
7866
+ (value.milliseconds ?? 0) +
7831
7867
  (value.seconds ?? 0) * 1000 +
7832
7868
  (value.minutes ?? 0) * 60 * 1000 +
7833
7869
  (value.hours ?? 0) * 60 * 60 * 1000;
@@ -7835,6 +7871,12 @@ var TimeSpan$1;
7835
7871
  }
7836
7872
  TimeSpan.toMilliseconds = toMilliseconds;
7837
7873
  })(TimeSpan$1 || (TimeSpan$1 = {}));
7874
+ function dateToMilliseconds(span) {
7875
+ const now = Date.UTC(0, 0);
7876
+ const date = new Date(now);
7877
+ const future = Date.UTC(date.getUTCFullYear() + (span.years ?? 0), date.getUTCMonth() + (span.months ?? 0), date.getUTCDate() + (span.days ?? 0), date.getUTCHours(), date.getUTCMinutes(), date.getUTCSeconds(), date.getUTCMilliseconds());
7878
+ return future.valueOf() - date.valueOf();
7879
+ }
7838
7880
  function performRound$1(value, round) {
7839
7881
  return !round
7840
7882
  ? value
@@ -35213,7 +35255,7 @@ const SmoothlyInputDemo$1 = class extends HTMLElement {
35213
35255
  }
35214
35256
  render() {
35215
35257
  return [
35216
- h("form", { action: "done", style: { position: "relative" } }, h("header", null, h("h5", null, "Form")), h("main", null, h("fieldset", null, h("h2", null, "Smoothly Iput"), h("h3", null, "Card"), h("smoothly-input", { type: "text", name: "name", readonly: true, value: "Readonly", onSmoothlyBlur: () => console.log("smoothly blur") }, "Readonly"), h("smoothly-input", { type: "text", name: "name.last", onSmoothlyChange: e => console.log("smoothly change event") }, "Name"), h("smoothly-input", { type: "text", name: "name.first", onSmoothlyChange: e => console.log("smoothly change event") }, "Name"), h("smoothly-input-date", null), h("smoothly-input", { type: "date", name: "date" }, "Date"), h("smoothly-input", { type: "date-time", name: "date-time" }, "Date-Time"), h("smoothly-input", { type: "divisor", name: "divisor" }, "Divisor"), h("smoothly-input", { type: "text", name: "street", value: "street" }, "Street"), h("smoothly-input", { type: "card-number", name: "card" }, "Card #"), h("smoothly-input", { type: "card-expires", name: "card", style: { width: "calc(60% - 2px)" } }, "Expires"), h("smoothly-input", { type: "card-csc", name: "card", style: { width: "calc(40% - 1px)", borderLeft: "none" } }, "CVV/CVC"), h("h3", null, "Contact"), 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("fieldset", null, h("h2", null, "Smoothly Radio"), h("h3", null, "Deselectable Radio List with button"), h("smoothly-radio-button", { deselectable: true, decoration: "button" }, h("smoothly-radio-button-item", { value: { some: "content", yes: "sir" } }, h("span", null, "Option 1"), h("span", { slot: "expansion" }, "Some description.")), h("smoothly-radio-button-item", { value: { some: "thing", yes: "miss" } }, h("span", null, "Option 2"), h("span", { slot: "expansion" }, "Some other description.")), h("smoothly-radio-button-item", { value: { some: "one", yes: "kid" } }, h("span", null, "Option 3"))), h("h3", null, "Radio List with button"), h("smoothly-radio-button", { decoration: "button" }, h("smoothly-radio-button-item", { value: { some: "content", yes: "sir" } }, h("span", null, "Option 1"), h("span", { slot: "expansion" }, "Some description.")), h("smoothly-radio-button-item", { value: { some: "thing", yes: "miss" } }, h("span", null, "Option 2"), h("span", { slot: "expansion" }, "Some other description.")), h("smoothly-radio-button-item", { value: { some: "one", yes: "kid" } }, h("span", null, "Option 3"))), h("h3", null, "Radio List without button"), h("smoothly-radio-button", null, h("smoothly-radio-button-item", { value: { some: "content", yes: "sir" }, selected: true }, h("span", null, "Option 1"), h("span", { slot: "expansion" }, "Some description.")), h("smoothly-radio-button-item", { value: { some: "thing", yes: "miss" } }, h("span", null, "Option 2"), h("span", { slot: "expansion" }, "Some other description.")), h("smoothly-radio-button-item", { value: { some: "one", yes: "kid" } }, h("span", null, "Option 3"))), 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("fieldset", null, h("h2", null, "Smoothly Accordion"), 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("fieldset", null, h("h2", null, "Smoothly checkbox"), h("smoothly-checkbox", { selectAll: true, intermediate: true }), h("smoothly-checkbox", null), h("smoothly-checkbox", { disabled: true })), h("fieldset", null, h("h2", null, "Smoothly addresses"), 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("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"))),
35258
+ h("form", { action: "done", style: { position: "relative" } }, h("header", null, h("h5", null, "Form")), h("main", null, h("fieldset", null, h("h2", null, "Smoothly Iput"), h("h3", null, "Card"), h("smoothly-input", { type: "text", name: "name", readonly: true, value: "Readonly", onSmoothlyBlur: () => console.log("smoothly blur") }, "Readonly"), h("smoothly-input", { type: "text", name: "name.last", onSmoothlyChange: e => console.log("smoothly change event") }, "Name"), h("smoothly-input", { type: "text", name: "name.first", onSmoothlyChange: e => console.log("smoothly change event") }, "Name"), h("smoothly-input-date", null), h("smoothly-input", { type: "date", name: "date" }, "Date"), h("smoothly-input", { type: "date-time", name: "date-time" }, "Date-Time"), h("smoothly-input", { type: "divisor", name: "divisor" }, "Divisor"), h("smoothly-input", { type: "text", name: "street", value: "street" }, "Street"), h("smoothly-input", { type: "card-number", name: "card" }, "Card #"), h("smoothly-input", { type: "card-expires", name: "card", style: { width: "calc(60% - 2px)" } }, "Expires"), h("smoothly-input", { type: "card-csc", name: "card", style: { width: "calc(40% - 1px)", borderLeft: "none" } }, "CVV/CVC"), h("h3", null, "Contact"), 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("fieldset", null, h("h2", null, "Smoothly Radio"), h("h3", null, "Deselectable Radio List with button"), h("smoothly-radio-button", { deselectable: true, decoration: "button" }, h("smoothly-radio-button-item", { value: { some: "content", yes: "sir" } }, h("span", null, "Option 1"), h("span", { slot: "expansion" }, "Some description.")), h("smoothly-radio-button-item", { value: { some: "thing", yes: "miss" } }, h("span", null, "Option 2"), h("span", { slot: "expansion" }, "Some other description.")), h("smoothly-radio-button-item", { value: { some: "one", yes: "kid" } }, h("span", null, "Option 3"))), h("h3", null, "Radio List with button"), h("smoothly-radio-button", { decoration: "button" }, h("smoothly-radio-button-item", { value: { some: "content", yes: "sir" } }, h("span", null, "Option 1"), h("span", { slot: "expansion" }, "Some description.")), h("smoothly-radio-button-item", { value: { some: "thing", yes: "miss" } }, h("span", null, "Option 2"), h("span", { slot: "expansion" }, "Some other description.")), h("smoothly-radio-button-item", { value: { some: "one", yes: "kid" } }, h("span", null, "Option 3"))), h("h3", null, "Radio List ", h("b", null, "without button")), h("smoothly-radio-button", null, h("smoothly-radio-button-item", { value: { some: "content", yes: "sir" }, selected: true, color: "light" }, h("span", null, "Option 1"), h("span", { slot: "expansion" }, "Some description.")), h("smoothly-radio-button-item", { value: { some: "thing", yes: "miss" }, color: "light" }, h("span", null, "Option 2"), h("span", { slot: "expansion" }, "Some other description.")), h("smoothly-radio-button-item", { value: { some: "one", yes: "kid" }, color: "light" }, h("span", null, "Option 3"))), 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("fieldset", null, h("h2", null, "Smoothly Accordion"), 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("fieldset", null, h("h2", null, "Smoothly checkbox"), h("smoothly-checkbox", { selectAll: true, intermediate: true }), h("smoothly-checkbox", null), h("smoothly-checkbox", { disabled: true })), h("fieldset", null, h("h2", null, "Smoothly addresses"), 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("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"))),
35217
35259
  h("smoothly-backtotop", null),
35218
35260
  ];
35219
35261
  }
@@ -35796,7 +35838,7 @@ const SmoothlyRadioButton$1 = class extends HTMLElement {
35796
35838
  static get style() { return styleCss$m; }
35797
35839
  };
35798
35840
 
35799
- const styleCss$l = "smoothly-radio-button[decoration=radio] .sc-smoothly-radio-button-item-h{background:rgb(var(--smoothly-primary-shade));color:rgb(var(--smoothly-primary-contrast));transition:0.2s}smoothly-radio-button[decoration=radio] .sc-smoothly-radio-button-item-h>header.sc-smoothly-radio-button-item{padding:0.5rem}smoothly-radio-button[decoration=radio] .sc-smoothly-radio-button-item-h>header.sc-smoothly-radio-button-item>smoothly-icon.sc-smoothly-radio-button-item{display:none}smoothly-radio-button[decoration=radio] [selected].sc-smoothly-radio-button-item-h>header.sc-smoothly-radio-button-item{color:rgb(var(--smoothly-primary-contrast));background:rgb(var(--smoothly-primary-color))}smoothly-radio-button[decoration=radio].sc-smoothly-radio-button-item-s>[slot=expansion]::before,smoothly-radio-button[decoration=radio] .sc-smoothly-radio-button-item-s>[slot=expansion]::before{content:unset}@media screen and (min-width: 900px){smoothly-radio-button[decoration=radio] .sc-smoothly-radio-button-item-h:hover{background:rgb(var(--smoothly-primary-color));cursor:pointer}}smoothly-radio-button[decoration=button] .sc-smoothly-radio-button-item-h{margin-bottom:0.5rem}smoothly-radio-button[decoration=button] .sc-smoothly-radio-button-item-h:last-child{margin-bottom:0}smoothly-radio-button[decoration=button] .sc-smoothly-radio-button-item-h>header.sc-smoothly-radio-button-item>smoothly-icon.sc-smoothly-radio-button-item{margin-right:0.5rem;border-radius:100%;font-size:1.3rem;display:flex;background:rgb(var(--smoothly-light-color));transition:0.2s}smoothly-radio-button[decoration=button] [selected].sc-smoothly-radio-button-item-h>header.sc-smoothly-radio-button-item>smoothly-icon.sc-smoothly-radio-button-item{color:rgb(var(--smoothly-success-color));background:rgb(var(--smoothly-success-shade))}smoothly-radio-button[decoration=button].sc-smoothly-radio-button-item-s>[slot=expansion],smoothly-radio-button[decoration=button] .sc-smoothly-radio-button-item-s>[slot=expansion]{background:rgb(var(--smoothly-primary-color));color:rgb(var(--smoothly-primary-contrast));border-radius:5px;margin-top:0.5rem}smoothly-radio-button[decoration=button].sc-smoothly-radio-button-item-s>[slot=expansion]::before,smoothly-radio-button[decoration=button] .sc-smoothly-radio-button-item-s>[slot=expansion]::before{content:\"\\25B2\";position:absolute;top:-0.8rem;left:3rem;color:rgb(var(--smoothly-primary-color))}@media screen and (min-width: 900px){smoothly-radio-button[decoration=button] .sc-smoothly-radio-button-item-h>header.sc-smoothly-radio-button-item:hover>smoothly-icon.sc-smoothly-radio-button-item{background:rgb(var(--smoothly-success-color));cursor:pointer}smoothly-radio-button[deselectable] [selected].sc-smoothly-radio-button-item-h>header.sc-smoothly-radio-button-item:hover>smoothly-icon.sc-smoothly-radio-button-item{background:rgb(var(--smoothly-warning-shade));color:rgb(var(--smoothly-warning-color));cursor:pointer}}.sc-smoothly-radio-button-item-h{display:block}.sc-smoothly-radio-button-item-h>header.sc-smoothly-radio-button-item{display:flex;align-items:center}.sc-smoothly-radio-button-item-s>[slot=expansion]{display:none;background:rgb(var(--smoothly-primary-tint));color:rgb(var(--smoothly-primary-contrast));padding:0;position:relative;transition:0.1s}[selected].sc-smoothly-radio-button-item-s>[slot=expansion]{display:block;padding:0.5rem}";
35841
+ const styleCss$l = "smoothly-radio-button[decoration=radio] .sc-smoothly-radio-button-item-h{transition:0.2s}smoothly-radio-button[decoration=radio] .sc-smoothly-radio-button-item-h>header.sc-smoothly-radio-button-item{padding:0.5rem}smoothly-radio-button[decoration=radio] .sc-smoothly-radio-button-item-h>header.sc-smoothly-radio-button-item>smoothly-icon.sc-smoothly-radio-button-item{display:none}smoothly-radio-button[decoration=radio] [selected].sc-smoothly-radio-button-item-h>header.sc-smoothly-radio-button-item{color:rgb(var(--smoothly-secondary-contrast));background:rgb(var(--smoothly-secondary-color))}smoothly-radio-button[decoration=radio].sc-smoothly-radio-button-item-s>[slot=expansion]::before,smoothly-radio-button[decoration=radio] .sc-smoothly-radio-button-item-s>[slot=expansion]::before{content:unset}@media screen and (min-width: 900px){smoothly-radio-button[decoration=radio] .sc-smoothly-radio-button-item-h:hover{background:rgb(var(--smoothly-secondary-shade));cursor:pointer}}smoothly-radio-button[decoration=button] .sc-smoothly-radio-button-item-h{padding:0.3rem}smoothly-radio-button[decoration=button] .sc-smoothly-radio-button-item-h>header.sc-smoothly-radio-button-item>smoothly-icon.sc-smoothly-radio-button-item{margin-right:0.5rem;border-radius:100%;font-size:1.3rem;display:flex;background:rgb(var(--smoothly-light-color));transition:0.2s}smoothly-radio-button[decoration=button] [selected].sc-smoothly-radio-button-item-h>header.sc-smoothly-radio-button-item>smoothly-icon.sc-smoothly-radio-button-item{color:rgb(var(--smoothly-success-color));background:rgb(var(--smoothly-success-shade))}smoothly-radio-button[decoration=button].sc-smoothly-radio-button-item-s>[slot=expansion],smoothly-radio-button[decoration=button] .sc-smoothly-radio-button-item-s>[slot=expansion]{background:rgb(var(--smoothly-secondary-color));color:rgb(var(--smoothly-secondary-contrast));border-radius:5px;margin-top:0.5rem}smoothly-radio-button[decoration=button].sc-smoothly-radio-button-item-s>[slot=expansion]::before,smoothly-radio-button[decoration=button] .sc-smoothly-radio-button-item-s>[slot=expansion]::before{content:\"\\25B2\";position:absolute;top:-0.8rem;left:3rem;color:rgb(var(--smoothly-secondary-color))}@media screen and (min-width: 900px){smoothly-radio-button[decoration=button] .sc-smoothly-radio-button-item-h>header.sc-smoothly-radio-button-item:hover>smoothly-icon.sc-smoothly-radio-button-item{background:rgb(var(--smoothly-success-color));cursor:pointer}smoothly-radio-button[deselectable] [selected].sc-smoothly-radio-button-item-h>header.sc-smoothly-radio-button-item:hover>smoothly-icon.sc-smoothly-radio-button-item{background:rgb(var(--smoothly-warning-shade));color:rgb(var(--smoothly-warning-color));cursor:pointer}}.sc-smoothly-radio-button-item-h{display:block}.sc-smoothly-radio-button-item-h>header.sc-smoothly-radio-button-item{display:flex;align-items:center}.sc-smoothly-radio-button-item-s>[slot=expansion]{display:none;background:rgb(var(--smoothly-secondary-tint));color:rgb(var(--smoothly-secondary-contrast));padding:0;position:relative;transition:0.1s}[selected].sc-smoothly-radio-button-item-s>[slot=expansion]{display:block;padding:0.5rem}";
35800
35842
 
35801
35843
  const SmoothlyRadioButtonItem$1 = class extends HTMLElement {
35802
35844
  constructor() {
@@ -36660,7 +36702,7 @@ const SmoothlyPopup = /*@__PURE__*/proxyCustomElement(SmoothlyPopup$1, [6,"smoot
36660
36702
  const SmoothlyQuiet = /*@__PURE__*/proxyCustomElement(SmoothlyQuiet$1, [6,"smoothly-quiet",{"color":[1]}]);
36661
36703
  const SmoothlyRadio = /*@__PURE__*/proxyCustomElement(SmoothlyRadio$1, [6,"smoothly-radio",{"name":[1],"value":[1],"checked":[1540],"tabIndex":[2,"tab-index"]}]);
36662
36704
  const SmoothlyRadioButton = /*@__PURE__*/proxyCustomElement(SmoothlyRadioButton$1, [6,"smoothly-radio-button",{"value":[1032],"deselectable":[516],"decoration":[513]},[[2,"radioItemSelectInternal","radioSelectHandler"]]]);
36663
- const SmoothlyRadioButtonItem = /*@__PURE__*/proxyCustomElement(SmoothlyRadioButtonItem$1, [6,"smoothly-radio-button-item",{"value":[8],"selected":[1540]}]);
36705
+ const SmoothlyRadioButtonItem = /*@__PURE__*/proxyCustomElement(SmoothlyRadioButtonItem$1, [6,"smoothly-radio-button-item",{"value":[8],"selected":[1540],"color":[513]}]);
36664
36706
  const SmoothlyRadioGroup = /*@__PURE__*/proxyCustomElement(SmoothlyToggleGroup, [4,"smoothly-radio-group",{"orientation":[513]}]);
36665
36707
  const SmoothlyReorder = /*@__PURE__*/proxyCustomElement(SmoothlyReorder$1, [0,"smoothly-reorder"]);
36666
36708
  const SmoothlyRoom = /*@__PURE__*/proxyCustomElement(SmoothlyRoom$1, [4,"smoothly-room",{"label":[1],"icon":[1],"path":[1],"to":[1]}]);
@@ -1,4 +1,4 @@
1
- import { g as getRenderingRef, f as forceUpdate, h } from './index-4d9efff8.js';
1
+ import { g as getRenderingRef, f as forceUpdate, h } from './index-fcf8bdd3.js';
2
2
 
3
3
  const appendToMap = (map, propName, value) => {
4
4
  const items = map.get(propName);