npm - smoothly - Versions diffs - 1.2.1-alpha.61 → 1.2.1-alpha.62 - Mend

smoothly 1.2.1-alpha.61 → 1.2.1-alpha.62

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 (464) hide show

package/dist/collection/components/display/demo/index.js CHANGED Viewed

@@ -11,35 +11,35 @@ export class SmoothlyDisplayDemo {
     }
     render() {
         return [
-            h("main", { key: 'fd051f67ea55f254181be2b43716e84e00cabb05' }, h("fieldset", { key: 'bea8026fe521ec050e1780416fa9e32989b2afa4' }, h("h2", { key: 'ef4c1a656d67796afc8f9c5c9db63c04f96aab4c' }, "Smoothly display"), h("dl", { key: '8deda943fa8ead28b6df1b007907f6d9dbf66d85' }, h("dt", { key: 'caf0ad2fe220cdb62d47140efd9684998246e2c3' }, "Duration"), h("dd", { key: 'f1c4659bf36f0a327fabba9314042dace342c13b' }, h("div", { key: '30872a9bd82d2814a82cf53ec42f3a7b3fe13b3a' }, h("div", { key: '5f733cc2b6a745712e246479c59b8aa3daf11312' }, h("smoothly-display", { key: '1998b9c2061fa468aa9fffe4d733a8a683baae05', style: { display: "inline" }, type: "duration", value: { hours: 13, minutes: 100 } }), " h"), h("div", { key: '159344fc77844facc8960a4f71a99813623a7763' }, h("smoothly-display", { key: 'd0f14a4f05e1b9353b9a0b389c17e3fbd7537b1b', style: { display: "inline" }, type: "duration", value: { hours: 8 } }), " h"), h("div", { key: 'cc65ac80578b939be2d3802fd3a5ded8fbf5b384' }, h("smoothly-display", { key: '489a7d80e18f1bb9d26eb8e807467f0cd8e0e1dc', style: { display: "inline" }, type: "duration", value: { minutes: 3 } }), " h"), h("div", { key: 'a7d5607906b992f698a00d293872dd5cfc65ad42' }, h("smoothly-display", { key: 'b868bb9a2ce5b8b0bab62e4ab90f5ed8172b2dc1', style: { display: "inline" }, type: "duration", value: { hours: -13, minutes: 100 } }), " h"), h("div", { key: 'bf53f2aae5ab5cdb6f7d98aba73a9e382fb98bd6' }, h("smoothly-display", { key: 'd27e664c4d0007dccfae976a13b3c3e202d7052b', style: { display: "inline" }, type: "duration", value: { hours: -8 } }), " h"), h("div", { key: '7e7ab059fe4ce79836b9b3c63a212e5ab9e4b36c' }, h("smoothly-display", { key: '388670fcb5c8371244c4112d0cf5f0050b59b134', style: { display: "inline" }, type: "duration", value: {} }), " h"), h("div", { key: 'e34c143b748072810cec75427ee497bfa25f92d7' }, h("smoothly-display", { key: 'bc74a20668e2b2b8e5561ebcd79fcff63c7886d7', style: { display: "inline" }, type: "duration", value: { minutes: -3 } }), " h"))), h("dt", { key: '04d7d7e6d8695b50afd0c80d7b8123d22a96a0a0' }, "text"), h("dd", { key: '0a51fa2990fa85c8154e2a14ad374252104d8658' }, h("smoothly-display", { key: '75b7cf9296c52cda27db01cc201b4417e2f19288', type: "text", value: "text" })), h("dt", { key: '3c9fa1e7b2eda3a838d779885ad48073a1e7ca78' }, "postal code"), h("dd", { key: 'adcfacf0c296667c4a98919fc64ff1b6823f253c' }, h("smoothly-display", { key: 'f35d166fc0ae74f26d9dab3ce217edf1e8df348e', type: "postal-code", value: "752 31" })), h("dt", { key: '5dd7df04105283e70182a8c24d69c7abc1632a0e' }, "password"), h("dd", { key: 'd785701c8d5e6ce9dddfe618b91f113b1cc47694' }, h("smoothly-display", { key: 'd9a04bc3d9c62eebf4b8fa192ee43544e25f48ec', type: "password", value: "password" })), h("dt", { key: '72a245580c0d67958d821918a64634089badf6e0' }, "email"), h("dd", { key: '4e2129c4690821e35017a025378a52a82d9c6e12' }, h("smoothly-display", { key: '6f60bb0a22b496b52f76d72c25f9c4959c275174', type: "email", value: "test@example.com" })), h("dt", { key: 'b47e6d91ac2ad5839eff3f2ed72793406c447381' }, "price"), h("dd", { key: '5ed6dc4d1894989f8c59e85a9d6b3474b1838d46' }, h("smoothly-display", { key: '88d50f738cc333ee0284011ded0e5bc2eb90eb01', type: "price", value: "13.37", currency: "SEK" })), h("dt", { key: '52b377e012d006448361e4190e85238eab82f425' }, "price without decimals"), h("dd", { key: '2d070cde97c125943423c28dd37a1bec7f1bf521' }, h("smoothly-display", { key: 'a63703e7aa73188db4b78d2378f2e30d491b35d7', type: "price", value: 200, currency: "SEK", toInteger: true })), h("dt", { key: '10348b35a582998ee6107a2b5c55a589e0d8c66d' }, "price with decimals if they are set, otherwise no decimal"), h("dd", { key: 'da178ce35a352086c815f4cfac4096e34abbaef7' }, h("smoothly-display", { key: '08b7c0ba00f0b9b57d1ea8cc4b537bf6b632c2b0', type: "price", value: 200.2, currency: "SEK", toInteger: true })), h("dt", { key: 'd7db59b325e85da3458ac99916b9bcf67ea567ff' }, "price with decimals"), h("dd", { key: '526c59b42c339389a0839a0ee96299d184850d2c' }, h("smoothly-display", { key: '2d7ebb7450b5eb08ee6ff7ada84034db4cfb06ab', type: "price", value: 200.2, currency: "SEK" })), h("dt", { key: '0417d708b6db96a1a3d08ccb552dc3704383f498' }, "percent"), h("dd", { key: '8c35ad31827aeddb6b205a7009e9987d317a813c' }, h("smoothly-display", { key: 'ebd4dd2565a20e48d31724b44d11b5cb44ae5277', type: "percent", value: "42" })), h("dt", { key: '65a23b48dbed3e8e7b50725148acd17891e19ddd' }, "phone"), h("dd", { key: '515ed149215811c8434f340256f8b4d331763db9' }, h("smoothly-display", { key: '6b7422b4b8387e74ef38aba7e8567f11b263cf9a', type: "phone", value: "0101881108" })), h("dt", { key: 'c1fe3e553de1313a579833275f43246d0673f812' }, "card number"), h("dd", { key: '6078440f5880b8442e388517f42660362841db2a' }, h("smoothly-display", { key: '6eb5a018d0d6f7f8458955369481294408d4fdf4', type: "card-number", value: "4111111111111111" })), h("dt", { key: '4ac0a352835d49083a89465d7fea27f951d2c4ac' }, "card expires"), h("dd", { key: 'db0cbb3b0795b19ffbf184da0dd2625eb8fb8918' }, h("smoothly-display", { key: 'd9ee4dc173460f0952d77053d12c68fce7feddc6', type: "card-expires", value: "7/22" })), h("dt", { key: '515cacce3dca652dfba9bf5528211576231495e5' }, "card csc"), h("dd", { key: '9f6c2d8490963f09828993d42ee16b9ffc5e0d0f' }, h("smoothly-display", { key: '1afda51b0213c77cf3b353bade47671790475112', type: "card-csc", value: "987" })), h("dt", { key: 'e7204fbb88672bf46f9551d7cf50e750cc8bbb38' }, "date"), h("dd", { key: '34fcebf482a696d179efbccc0708b8e71e8726d1' }, h("smoothly-display", { key: 'a55391a66ccc1cf033a2519fdf3b75c2510cb11f', type: "date", value: "2022-07-07" })), h("dt", { key: '4a818e58e65af6b0b27d090fb53909f4030a0442' }, "date time"), h("dd", { key: '18874fbe62d3f0d4758fbcb3ea56c28698285c23' }, h("smoothly-display", { key: '137a6be8368b02ec204b5baa82bf455f69a2fded', type: "date-time", format: {
+            h("main", { key: '21fb2b79f1e444d11b25150a336ce64e74f94386' }, h("fieldset", { key: '8b8ef87a351e4cb8754f44f74ad31185db62b0cb' }, h("h2", { key: 'e466ccf59ad1f4e2a41c8dd1b1d85da6b37c8f95' }, "Smoothly display"), h("dl", { key: 'acb593cb9a73566cc3defcc55eede3a7710a42b0' }, h("dt", { key: '9ccdcb7f5e3f55ea39d78b8ed6e75edb5f4a4c96' }, "Duration"), h("dd", { key: 'b7c93ccc874874faabe5e313ba204795a19adfc0' }, h("div", { key: 'd6e3d99849191e6d8effae216348bd634a4114b2' }, h("div", { key: 'bb64f8e9518218a499d0e52b5df759b31093e0e0' }, h("smoothly-display", { key: '151b7ca20847a1e41701d3c93ad780a222f990fb', style: { display: "inline" }, type: "duration", value: { hours: 13, minutes: 100 } }), " h"), h("div", { key: '72035e5cab01fd9a06d2782ba1255c2f86cbfdac' }, h("smoothly-display", { key: '0f4723aac6e41aa4a7e29b0456e4661066b28985', style: { display: "inline" }, type: "duration", value: { hours: 8 } }), " h"), h("div", { key: '1346fe1098e87dab09ae4268fab19f7eb18cd949' }, h("smoothly-display", { key: '5e70c627fe2dc9e1d65cfec40fa63a36d419466f', style: { display: "inline" }, type: "duration", value: { minutes: 3 } }), " h"), h("div", { key: '24beed45ab0c2cb2703d97ddecb72b767f19d989' }, h("smoothly-display", { key: 'a57ee2a431537bffe6d8a630c2466e342a10f089', style: { display: "inline" }, type: "duration", value: { hours: -13, minutes: 100 } }), " h"), h("div", { key: '44f65151109d00905e996e9205d71588ecabaea3' }, h("smoothly-display", { key: '5c0a01aca2d99cb82c66701d4c7d7de26043d987', style: { display: "inline" }, type: "duration", value: { hours: -8 } }), " h"), h("div", { key: '18cbc082f3d8f71f3ba6c6b7eb3a977b13d45268' }, h("smoothly-display", { key: 'a5bbf74186f51ce22f6eceb8396f215e7b0fc297', style: { display: "inline" }, type: "duration", value: {} }), " h"), h("div", { key: '1d2361cec57f38f40636641702f92100ebcd9122' }, h("smoothly-display", { key: 'a561ef92252a23064e7f7f7ffca3314a099329f2', style: { display: "inline" }, type: "duration", value: { minutes: -3 } }), " h"))), h("dt", { key: 'ab7b23c9c2ad57ceb6a2ce75d8f0a4e93439e610' }, "text"), h("dd", { key: '8913158f3f3a5c4012ae94a3f1b38442fcb5aff2' }, h("smoothly-display", { key: '13d54b85dcf178d480c8c834c79c47231c785aa6', type: "text", value: "text" })), h("dt", { key: 'e3c43484f7cc87eb9bf67d6474bc9552dbd643bd' }, "postal code"), h("dd", { key: '0df2d428a7847b3ddf436d2e9db2fe367f41df80' }, h("smoothly-display", { key: '8550c5ee46cc4e0c1bb956b2dbf8a62c452aee30', type: "postal-code", value: "752 31" })), h("dt", { key: '1b06810c083306938ce8d25b5582a15cb066b085' }, "password"), h("dd", { key: 'b078c56b5a9d62e23b9d9b8ab6cd4d10798aa726' }, h("smoothly-display", { key: '773204df4456963fbcc5cc26416c40f8111e43d0', type: "password", value: "password" })), h("dt", { key: '38c93b73ae2830ef7995f9c6d93d62c1ba019680' }, "email"), h("dd", { key: '3f822f17d630c3388155a66e97e0bbb6fb7c3951' }, h("smoothly-display", { key: 'f31678fe3df819cdc266876c54a1d810e9fbf9e8', type: "email", value: "test@example.com" })), h("dt", { key: '9abf27aa6b2a6ffc035f14adc1204e620d8061ce' }, "price"), h("dd", { key: '15a0e06145971b2c14abb0250cbb7edcea81483b' }, h("smoothly-display", { key: '256922cd4e8c86be1707c1ddc9d9e8550fe7b5b3', type: "price", value: "13.37", currency: "SEK" })), h("dt", { key: '84e0e9b898c72e2390a5b50cc2445a988a845a60' }, "price without decimals"), h("dd", { key: '3979f33c43640eb1376a533755cc39ac1a8c17b3' }, h("smoothly-display", { key: '04afd00d763536c5b1faa310074726f346914114', type: "price", value: 200, currency: "SEK", toInteger: true })), h("dt", { key: '28c9ddc91d2ceb52a7bd60577570a0ece1ef1704' }, "price with decimals if they are set, otherwise no decimal"), h("dd", { key: 'e2ae34d84db38387ee3d81b474a606b7b3d40742' }, h("smoothly-display", { key: 'a8c053147e77e15ba5a6a7d372d24d0948d67bd0', type: "price", value: 200.2, currency: "SEK", toInteger: true })), h("dt", { key: 'a42173872dac85db0f822c70e69baef5a244b4ef' }, "price with decimals"), h("dd", { key: '4034e3ca1bde5f9ba3f5cdca710d3757b7e12955' }, h("smoothly-display", { key: '0a07c33c6bf9b14aeafcbbff3e9f6d2817eb7230', type: "price", value: 200.2, currency: "SEK" })), h("dt", { key: '701bee2385a94b38bf90f58b3dc4fb65458188e6' }, "percent"), h("dd", { key: 'e1b856b2059122d2c80e5c242bb95429bca4caeb' }, h("smoothly-display", { key: '2682ebd78e2753fc2b1d558e00cf10eec0449c83', type: "percent", value: "42" })), h("dt", { key: 'd6504232e42d7bd6fb239b24f8065677bfe7f5ce' }, "phone"), h("dd", { key: '3b2cf4c53cf6b6fba8687ab994d6ded634d60046' }, h("smoothly-display", { key: '1cb2c5406dfbec1db57c05be5f59f828b005cb17', type: "phone", value: "0101881108" })), h("dt", { key: '94ee7083b2d5eef22e7ff0e15c460f6fd863db9e' }, "card number"), h("dd", { key: '97954e5e4d12f6be04096006d51ea6c9ac3e7fa3' }, h("smoothly-display", { key: '027c2522274e6e23f6cda08da141b24432671837', type: "card-number", value: "4111111111111111" })), h("dt", { key: '77cda0ed14b7a75ef02966d1b29bf94b6d5fe6ef' }, "card expires"), h("dd", { key: 'e2c1cbe5353efc0bea8435181499188bcdf8d051' }, h("smoothly-display", { key: '4aab5bf769fb89cadd2bf3fbb279a219e668c85d', type: "card-expires", value: "7/22" })), h("dt", { key: 'ecb64258605dbce40b3b6b8f51ec1922046ecd44' }, "card csc"), h("dd", { key: 'b37ef76653942f81a110df017f26c4c5699f32ad' }, h("smoothly-display", { key: 'e9cb2787e18d88f2cde4559c90f8ad9d45889d51', type: "card-csc", value: "987" })), h("dt", { key: 'f028f598bc51de708361494c66264047b8ab777e' }, "date"), h("dd", { key: '8900bb90156489b4cc9d22c663c9a2f5f80b1062' }, h("smoothly-display", { key: 'c31d4cf0631bf5495c9286bcc87a37c056ac6308', type: "date", value: "2022-07-07" })), h("dt", { key: 'a9df319e34d74e6ec9ef36e9f9128cda2df9043b' }, "date time"), h("dd", { key: 'f57d07c19738d28a60e0138cc827218a0f1ef7af' }, h("smoothly-display", { key: '663d9cfa4235e90f6a8231b9c7c7d6d0bd4beb4b', type: "date-time", format: {
                     year: "numeric",
                     month: "short",
                     day: "numeric",
                     hour: "numeric",
                     minute: "numeric",
                     second: "numeric",
-                }, value: "2022-07-07T02:02:02Z" })), h("dd", { key: '81829d196bd5886e41d896369a9c20a0e9ac6475' }, h("smoothly-display", { key: '69d3bce166d11def43480659575c51c171c22a45', type: "date-time", format: {
+                }, value: "2022-07-07T02:02:02Z" })), h("dd", { key: '664a74d91f65917bff18734fd100347533fb9b4e' }, h("smoothly-display", { key: '456469ffdc5ccdea880ad86f92b9a29c183dcdba', type: "date-time", format: {
                     year: "2-digit",
                     month: "long",
                     day: "2-digit",
                     hour: "2-digit",
                     minute: "2-digit",
                     second: "2-digit",
-                }, value: "2022-07-07T02:02:02Z" })), h("dd", { key: '9f8913ccf6eb9aa0320ccc96c5f63d1368e03cb5' }, h("smoothly-display", { key: '440dec80b84e484440f55e568d018a46ebdcc199', type: "date-time", format: {
+                }, value: "2022-07-07T02:02:02Z" })), h("dd", { key: '6714499c457900dee5e2cd5bedbba3ef7083b749' }, h("smoothly-display", { key: '4fea3c22e9402170205a5019a17850576fbb06f7', type: "date-time", format: {
                     year: "numeric",
                     month: "2-digit",
                     day: "2-digit",
                     hour: "numeric",
                     minute: "numeric",
                     second: "numeric",
-                }, value: "2022-07-07T12:22:24Z" })), h("dd", { key: 'ca5f7e206cf42b4bee3e885c8dd6fb5ce1fb414e' }, h("smoothly-display", { key: 'c2258980a847c8d2ac8c77a47e7a5772bce08ec8', type: "date-time", format: {
+                }, value: "2022-07-07T12:22:24Z" })), h("dd", { key: '79c14cffa0634ab2af6fd3ba014d081e28e38319' }, h("smoothly-display", { key: 'd5559326f39e2f5bc8311135176b5eedb4ed2870', type: "date-time", format: {
                     year: "numeric",
                     month: "numeric",
                     day: "numeric",
                     hour: "numeric",
                     minute: "numeric",
                     second: "numeric",
-                }, value: "2022-07-07T12:22:24Z" })), h("dd", { key: '8b99f1ea1299e7001053e7b9deece7e6a15e2542' }, h("smoothly-display", { key: '89c93cace88996c65faa0791cc0ffd7a4e9e083a', type: "date-time", format: { year: "numeric", month: "short", day: "numeric" }, value: "2022-07-07T00:00+02:00" })), h("dd", { key: '570142486b7ab93ddd59d9f418a60d700c7817d5' }, h("smoothly-display", { key: '63dfcf83183fba060fceed447d4bcdd0c30eb5a9', type: "date-time", format: { year: "2-digit", month: "numeric", day: "numeric" }, value: "2022-07-07T00:00+02:00" })), h("dd", { key: '4cc6f5ba3ddd1b339d5fb015de456abae54aab43' }, h("smoothly-display", { key: '6c2f659af73220903642fd0807d1151f204ba837', type: "date-time", format: {
+                }, value: "2022-07-07T12:22:24Z" })), h("dd", { key: '419b427db910e49fd541de31e95c7dd3dbd2811e' }, h("smoothly-display", { key: 'ebd569c36dd017c14523ee1efc8925c622f7747e', type: "date-time", format: { year: "numeric", month: "short", day: "numeric" }, value: "2022-07-07T00:00+02:00" })), h("dd", { key: '6df381d322a21b50ad70fc41fee8800721ca0889' }, h("smoothly-display", { key: '1ace79e51e8285e5124158f567a73508833bdcb4', type: "date-time", format: { year: "2-digit", month: "numeric", day: "numeric" }, value: "2022-07-07T00:00+02:00" })), h("dd", { key: 'dbdc1a002cab9e951678621ad394c1237e91f3f1' }, h("smoothly-display", { key: '529e5cd2b7f4bde6b06dfb51832cb4cb498c3447', type: "date-time", format: {
                     year: "2-digit",
                     month: "numeric",
                     day: "numeric",
@@ -47,21 +47,21 @@ export class SmoothlyDisplayDemo {
                     minute: "2-digit",
                     second: "2-digit",
                     timeZone: "Europe/Stockholm",
-                }, value: "2022-07-07T12:15Z" })), h("dt", { key: 'cb48cb11e0a8400291f08caa821b53cb443f8f12' }, "Display JSON"), h("dd", { key: '5f88f3eedffc8993d747898f9bf5dc9da06dbfb1' }, h("smoothly-display-demo-json", { key: '695a426dd6523dbac16fe830167f21e095499760' })))), h("h2", { key: 'e847b40c54e9c2343c3c572802732594110a3520' }, "With labels"), h("dd", { key: 'fa442318099a443bbc08f8b989993184afe12f57' }, h("smoothly-display", { key: 'e0b37f5c62a577c16805b7b3793a397ade55944e', label: "Today", type: "date", value: isoly.Date.now() }), h("smoothly-display", { key: 'e17917bd5c0ba53f198a218ac5377feb64a3219c', label: "Total amount", type: "price", currency: "SEK", value: 6789 }), h("smoothly-display", { key: 'd8c0252e5b772d1328adcaff951d2394b4da4fdf', label: "Total amount", type: "price", currency: "GBP", value: 678.9 }), h("smoothly-display", { key: '3a020e58a1fbac08de20efa83040a6d2fff73d40', label: "Logs", type: "json", value: [
+                }, value: "2022-07-07T12:15Z" })), h("dt", { key: 'd7b788672f67fbf1d0528f604ef1e77673d2e69f' }, "Display JSON"), h("dd", { key: '87a892e6845db8618efd46d571e8a90f30ce1e6d' }, h("smoothly-display-demo-json", { key: 'f66473975507a01af105282f01f640c1baaa88ae' })))), h("h2", { key: '084965cafe76cf10bac4804c82ea460c0960f7da' }, "With labels"), h("dd", { key: '395e03618fc767dcca6b12386286a97c83882686' }, h("smoothly-display", { key: 'd5f90cfeaad01ea046ed543f54e70b089c91463d', label: "Today", type: "date", value: isoly.Date.now() }), h("smoothly-display", { key: '3333769695dd0b7e0d54fd729f2b3b59dc34737c', label: "Total amount", type: "price", currency: "SEK", value: 6789 }), h("smoothly-display", { key: '57070580aa9096b1d273bb7cb51a6ac82e22f9ca', label: "Total amount", type: "price", currency: "GBP", value: 678.9 }), h("smoothly-display", { key: 'b4af7875200f61caf1c51f969c61362af7b3d402', label: "Logs", type: "json", value: [
                     { type: "trace", message: "Hello" },
                     { type: "error", message: "Oh no!" },
-                ] })), h("fieldset", { key: '08d6ad86a6d79ff873156f7cb4d84360d8e92f38' }, h("h2", { key: '91450decd67bdc21c204adaa7f95d9d0d2f64107' }, "Test of different kinds of notifier"), h("button", { key: 'ded2972233a8361b91b75c8386ca3f3299735959', onClick: () => this.noticeWarning(Notice.warn("This is a test warning notice.")) }, "warning"), h("button", { key: '833fe76b9edaa48c4db0aed015bfd310936bd01a', onClick: () => this.noticeWarning(Notice.succeeded("This is a test success notice.")) }, "success"), h("button", { key: '5f74587f60215db920ea6a0b9a01702642e61745', onClick: () => this.noticeWarning(Notice.failed("This is a test danger notice.")) }, "danger"), h("button", { key: 'ed76217b6f2a5f84ecc04a04ebc13c1441958b39', onClick: () => this.noticeWarning(Notice.execute("This is a test execute notice.", () => new Promise(resolve => window.setTimeout(() => resolve([true, "This went great"]), 3000)))) }, "execute"), h("button", { key: '7f7b974a4ed5528d8d226d380233e219203553bc', onClick: () => this.noticeWarning(Notice.delay("This is a test delay notice.", () => new Promise(resolve => window.setTimeout(() => resolve([true, "This went great"]), 3000)))) }, "delay")), h("fieldset", { key: '287c9ce5ae199417e9883b2d10c7f74e755ec0f1' }, h("h2", { key: '14379ccb8cc02c5041a11ba85b15785a4fd87711' }, "Smoothly spinner"), h("div", { key: '71d53a5d93355f097f377cf0665c299fe85746e8', style: { width: "fit-content" } }, "Large", h("smoothly-spinner", { key: '90c1716af136d85de144eba53912ca479b66fc5b', size: "large", style: {
+                ] })), h("fieldset", { key: '411e5133a5c4bf2d36ad1c6b00cf549e769d7665' }, h("h2", { key: '536dd0526204b6d389c670c576f32bca45c3630e' }, "Test of different kinds of notifier"), h("button", { key: '2faebb0bcea77262e0a18b5e8a375bef7b5de11b', onClick: () => this.noticeWarning(Notice.warn("This is a test warning notice.")) }, "warning"), h("button", { key: '21181f519f1bfe818fcc084596be2317fe541968', onClick: () => this.noticeWarning(Notice.succeeded("This is a test success notice.")) }, "success"), h("button", { key: 'c67c4056842c761165115333bb079165609208f1', onClick: () => this.noticeWarning(Notice.failed("This is a test danger notice.")) }, "danger"), h("button", { key: 'a42b0b8a77b40fa6ddea705306634489abaec09b', onClick: () => this.noticeWarning(Notice.execute("This is a test execute notice.", () => new Promise(resolve => window.setTimeout(() => resolve([true, "This went great"]), 3000)))) }, "execute"), h("button", { key: 'd651ea26abb9ce9dd336b45ded8849fc4a00c56a', onClick: () => this.noticeWarning(Notice.delay("This is a test delay notice.", () => new Promise(resolve => window.setTimeout(() => resolve([true, "This went great"]), 3000)))) }, "delay")), h("fieldset", { key: '91b1d46f457a5261ddff3a1bc67db822190f0591' }, h("h2", { key: 'd46c2765def7f55a8bd225dbd9f1c5379029878b' }, "Smoothly spinner"), h("div", { key: 'efb40135dbbbd78e6ba4c9927ff212178a3da9eb', style: { width: "fit-content" } }, "Large", h("smoothly-spinner", { key: '70616018eb896ff0bd28744b504fec5c416f1b45', size: "large", style: {
                     "--spinner-background": "200,255,200",
                     "--spinner-background-opacity": "0.2",
                     "--spinner-color": "0,130,0",
-                } })), h("div", { key: '00116592b1fedd953169ba090ae1eabe66d0004c', style: { width: "fit-content" } }, "Medium", h("smoothly-spinner", { key: 'f44f16aad9e875a4f6c6cb52e19d63c3e18bc54e', size: "medium" })), h("div", { key: '276cc0c4292e553e316bbb2c6571322254d02fec', style: { width: "fit-content" } }, "Small", h("smoothly-spinner", { key: '29ad8c5f2e641f534e47926d9a349b95a6ed57fa', size: "small" })), h("div", { key: '3b7ae3e4d2825d284f1035ad48cbe40ddf6e0a58' }, "Icon sized spinner on button", Color.types.map(color => (h("smoothly-button", { size: "icon", color: color, shape: "rounded", onClick: () => {
+                } })), h("div", { key: '585aff079f29aaeb3319268ebcf3857bec165942', style: { width: "fit-content" } }, "Medium", h("smoothly-spinner", { key: 'd46336b4e6fe98d2d2958c3047747b07d7999fe8', size: "medium" })), h("div", { key: '47db1735399b1b59e582b94229c4fdc51389b51d', style: { width: "fit-content" } }, "Small", h("smoothly-spinner", { key: '8292ad153260c3cd3d26ad597effa2356e913ca9', size: "small" })), h("div", { key: '45ed5bea68185714286757dfa56d14b5987c3a19' }, "Icon sized spinner on button", Color.types.map(color => (h("smoothly-button", { size: "icon", color: color, shape: "rounded", onClick: () => {
                     this.downloadingSpinner = true;
                     setTimeout(() => (this.downloadingSpinner = false), 3000);
-                } }, !this.downloadingSpinner && h("smoothly-icon", { name: "download-outline" }), this.downloadingSpinner && (h("smoothly-spinner", { size: "icon", style: { "--spinner-background-opacity": "0" } })))))), h("h3", { key: '843b2f5e627f47b215f5eee7d3d05243a1c97d60' }, "Spinner with overlay"), h("div", { key: '4cafd9c2da4f233b64ba69a6af18327f4964803d', style: { position: "relative", height: "10em" } }, "Large Overlay Spinner", h("smoothly-spinner", { key: 'a6900ad94f8782fe773be6f3855a064c5380f655', overlay: true, size: "large", style: {
+                } }, !this.downloadingSpinner && h("smoothly-icon", { name: "download-outline" }), this.downloadingSpinner && (h("smoothly-spinner", { size: "icon", style: { "--spinner-background-opacity": "0" } })))))), h("h3", { key: 'd793d083180c7ce2cdaed3edc8d9b3aa88b827b3' }, "Spinner with overlay"), h("div", { key: '4e84a2f337c94398e86eab3dbfb055906e6e3640', style: { position: "relative", height: "10em" } }, "Large Overlay Spinner", h("smoothly-spinner", { key: 'f82d069b8d3ebf5f9a13e53e1ad7c60b19d21778', overlay: true, size: "large", style: {
                     "--spinner-background": "255,200,255",
                     "--spinner-background-opacity": "0.5",
                     "--spinner-color": "0,130,0",
-                } })), h("div", { key: 'd233b7953c8566ab93037535154b411e6bfb1ad7', style: { position: "relative", height: "10em" } }, "Medium Overlay Spinner", h("smoothly-spinner", { key: '402db5d2b36be4c7093b63103301a1b46e40724e', overlay: true, color: "secondary", size: "medium" })), h("div", { key: '8a51fcf96de1038ff02ca71935b3078a72e9079f', style: { position: "relative", height: "10em" } }, "Small Overlay Spinner", h("smoothly-spinner", { key: '11aaae43faab5dae96f5918793d6d916e00d702c', overlay: true, size: "small" }))), h("fieldset", { key: '2ff86804c0ada8b13a4170c50f373797318be0ba' }, h("h2", { key: 'd39356dc6bb76b9657be182941851cc34ffb2917' }, "Smoothly summary"), h("smoothly-summary", { key: '145d770dbf9fc62a7131ecce8a840394f2c6c928' }, h("p", { key: 'b744a54d201d6d8187c5581bc5ce771210960d23', slot: "summary" }, "Some title"), h("p", { key: 'c3e00a06d0f17788dc2aaf381ee0f01e3bc765c4', slot: "content" }, "Some content")), h("smoothly-summary", { key: 'd1e49a025fb7bfc33c6aa9c086cfc21dba5997d8', size: "large" }, h("p", { key: '81e1f3ea4d8ea14e8f98aacc7afd7503f54dd88d', slot: "summary" }, "Some title"), h("p", { key: '0d6a0d2031fc8c22844237d0a45f25b77388d9a6', slot: "content" }, "Some content")), h("smoothly-summary", { key: '0a931fcf97d133c2611c2260fd677598c30b5c21', color: "danger", fill: "clear" }, h("div", { key: '1bfaeb10d07c0bd6b5891d4487b3c9c052d6fc27', slot: "summary", style: { display: "flex", gap: "0.3rem" } }, h("span", { key: '0496d3e725519d1f5579164b904c8cafce3d4188' }, "Person"), h("smoothly-icon", { key: 'd5764dbbd79f22646223e988895996b53693ae3a', name: "person", color: "light", fill: "clear", size: "tiny" })), h("p", { key: '6041f619692580c37081547d082a99d611738ee2', slot: "content" }, "Some person information.")), h("smoothly-summary", { key: '0b5d1771123017cfe0aef1c03116e42eeb677f6f', color: "danger", fill: "clear", open: true }, h("p", { key: '41b5c81feda26d37aab0d42093de072484c53045', slot: "summary" }, "Some other title"), h("p", { key: 'cfeffe7c6a6fcc9d321af580eb7a550f23ab1e52', slot: "content" }, "A lot more content, yes please. A lot more content, yes please. A lot more content, yes please. A lot more content, yes please. A lot more content, yes please.A lot more content, yes please. A lot more content, yes please. A lot more content, yes please. A lot more content, yes please.")), h("h2", { key: 'd8997ff0e0fa943190e3e2df2af01ea62e9f3a04' }, "Label"), labels.map(l => (h("smoothly-label", { hue: l.hue, description: l.description, shape: "rectangle" }, l.name))), h("smoothly-label", { key: '5535ae27abc079bb5e5d95945daa228bf38a9ac0', color: "primary", description: "Using colors", shape: "rectangle" }, "Primary"))),
+                } })), h("div", { key: 'd7403378fc9b34cef1a918ef9cc5ea7f27e81723', style: { position: "relative", height: "10em" } }, "Medium Overlay Spinner", h("smoothly-spinner", { key: 'e93ef55fe61481db7105153ece6ff80c498b8fad', overlay: true, color: "secondary", size: "medium" })), h("div", { key: 'c93c240c27abe1b38914b1af37eb374715038fd1', style: { position: "relative", height: "10em" } }, "Small Overlay Spinner", h("smoothly-spinner", { key: '7519fb4f9bfaf9e4f3792833db59d9617d64240c', overlay: true, size: "small" }))), h("fieldset", { key: '94281d9137b942eb9d25b110d923608d66f4151f' }, h("h2", { key: '12c705c2f5cdaf7a2dbcf4f71067aa1563156b53' }, "Smoothly summary"), h("smoothly-summary", { key: 'a94bc08481df51edee165c5f3ff4b0b6b524100b' }, h("p", { key: '7697067b2742d7527b91c1e57dc252d5bc047b95', slot: "summary" }, "Some title"), h("p", { key: 'bf1b7cabdb250a6eb6401ea6a4f6f4fe56d4be95', slot: "content" }, "Some content")), h("smoothly-summary", { key: '4a59074a291f48dbc2079eba28859176e139d145', size: "large" }, h("p", { key: '29d101a62f8928b7226b4539fb133d6fb45582f0', slot: "summary" }, "Some title"), h("p", { key: '24ca49ed27372ecf26904fe72e944c3f561b47f6', slot: "content" }, "Some content")), h("smoothly-summary", { key: 'd3b8dd90214c6adcaeb5cfee6d36d805c83c7322', color: "danger", fill: "clear" }, h("div", { key: '0db1d4d0d722605b00aa5a4fdbce3a701287ce8e', slot: "summary", style: { display: "flex", gap: "0.3rem" } }, h("span", { key: '2742c8dfb4e5ad70f433ed708424c64da93130fd' }, "Person"), h("smoothly-icon", { key: '84059e999cea916c17ccbb87acab606d3b23e15b', name: "person", color: "light", fill: "clear", size: "tiny" })), h("p", { key: '67818f7de2e59494d452d89a89b2437a4f66cf72', slot: "content" }, "Some person information.")), h("smoothly-summary", { key: '0f80219dc807486f83f6cae09e2240892608e00c', color: "danger", fill: "clear", open: true }, h("p", { key: 'e8cdfc372f68dbd7d1d04abe20e3744bfec51820', slot: "summary" }, "Some other title"), h("p", { key: 'a7a9ca8f540ce7847c51f788617e999df999dc1c', slot: "content" }, "A lot more content, yes please. A lot more content, yes please. A lot more content, yes please. A lot more content, yes please. A lot more content, yes please.A lot more content, yes please. A lot more content, yes please. A lot more content, yes please. A lot more content, yes please.")), h("h2", { key: '3533e4642ed7300f49ac9d7aeaad55d40b1c598d' }, "Label"), labels.map(l => (h("smoothly-label", { hue: l.hue, description: l.description, shape: "rectangle" }, l.name))), h("smoothly-label", { key: '82e99f058b45ee8eaaeeb5d855856ad3fb1d8f61', color: "primary", description: "Using colors", shape: "rectangle" }, "Primary"))),
         ];
     }
     static get is() { return "smoothly-display-demo"; }

package/dist/collection/components/display/demo/json/index.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { h, Host } from "@stencil/core";
 export class SmoothlyDisplayDemoJson {
     render() {
-        return (h(Host, { key: '67b8c263dfe7d72e1072ba3d630ea74f0a05788a' }, [0, 1, 3, undefined].map(colapseDepth => [
+        return (h(Host, { key: 'ea329526023da3b7329d8b7bd1cb34316542fd93' }, [0, 1, 3, undefined].map(colapseDepth => [
             h("div", null, "collapseDepth=", colapseDepth !== null && colapseDepth !== void 0 ? colapseDepth : "undefined"),
             h("div", null, h("smoothly-display", { type: "json", value: json, collapseDepth: colapseDepth })),
         ])));

package/dist/collection/components/display/index.js CHANGED Viewed

@@ -19,16 +19,16 @@ export class SmoothlyDisplay {
         const type = this.type;
         switch (type) {
             case "json":
-                result = h("smoothly-display-json", { key: '2ff64bd2ea031cbb472c41bcb52fcf696f524a73', value: this.value, collapseDepth: this.collapseDepth });
+                result = h("smoothly-display-json", { key: '1ede546f9829aea0f9b8c319db98df10e07b04a3', value: this.value, collapseDepth: this.collapseDepth });
                 break;
             default:
                 result = tidily.format(this.value, type);
                 break;
             case "email":
-                result = h("a", { key: 'b9bc9827de58ab167a50e439ed60d0a5f9f3f2e3', href: "mailto:" + this.value }, tidily.format(this.value, type));
+                result = h("a", { key: 'c6047f436091639f6302be22f62610c0515a4009', href: "mailto:" + this.value }, tidily.format(this.value, type));
                 break;
             case "phone":
-                result = h("a", { key: '184af93546b3f1c7f074593ac1d0ea4dc2713341', href: "tel:" + this.value }, tidily.format(this.value, type, this.country));
+                result = h("a", { key: 'b62431225a51efb22037598e4227671e863be3c3', href: "tel:" + this.value }, tidily.format(this.value, type, this.country));
                 break;
             case "postal-code":
                 result = tidily.format(this.value, type, this.country);

package/dist/collection/components/display/json/index.js CHANGED Viewed

@@ -6,7 +6,7 @@ export class SmoothlyDisplayJson {
         this.collapseDepth = undefined;
     }
     render() {
-        return h(JsonValue, { key: '84df0d521b30c3c44e38baee43e6c76334875ae8', value: this.value, collapseDepth: this.collapseDepth });
+        return h(JsonValue, { key: 'a817223386521cc073aeab087efc636977b65e0a', value: this.value, collapseDepth: this.collapseDepth });
     }
     static get is() { return "smoothly-display-json"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/display/json/object/index.js CHANGED Viewed

@@ -25,9 +25,9 @@ export class SmoothlyDisplayJsonObject {
     }
     render() {
         const nextCollapseDepth = typeof this.collapseDepth == "number" ? Math.max(this.collapseDepth - 1, 0) : undefined;
-        return (h(Host, { key: '096aba61e52c82b8fbddfa73b76ad5378898997b', class: { empty: this.empty, open: this.open } }, h("span", { key: '23b082be0c70e647b622f876ce92a91aebcdfcd5', class: "open-bracket", onClick: () => (this.open = !this.open), "data-length": this.length }, this.openBracket), h("span", { key: '851efa46e336cdcd39eb20b08106b37cf3189c53', class: "content" }, Array.isArray(this.value)
+        return (h(Host, { key: '2878d58011daeccd9d1e3383f1081883f08ec598', class: { empty: this.empty, open: this.open } }, h("span", { key: '8e07de6271113ae7c223c44a2193162071cf9eaf', class: "open-bracket", onClick: () => (this.open = !this.open), "data-length": this.length }, this.openBracket), h("span", { key: 'c850ca12c687165a5f752a1e3315a0d7bd947971', class: "content" }, Array.isArray(this.value)
             ? this.value.map(v => (h("div", { class: "indent" }, h(JsonValue, { value: v, collapseDepth: nextCollapseDepth }), h("span", { class: "comma" }, ","))))
-            : Object.entries(this.value).map(([k, v]) => (h("div", { class: "indent" }, h("smoothly-display-json-record-key", { value: k }), ":", " ", h(JsonValue, { value: v, collapseDepth: nextCollapseDepth }), h("span", { class: "comma" }, ","))))), h("span", { key: '51e3c086f6abc497cb759819eeee405d696769c0' }, this.closeBracket)));
+            : Object.entries(this.value).map(([k, v]) => (h("div", { class: "indent" }, h("smoothly-display-json-record-key", { value: k }), ":", " ", h(JsonValue, { value: v, collapseDepth: nextCollapseDepth }), h("span", { class: "comma" }, ","))))), h("span", { key: '462371f02f42cbc4787b7a7a4eb0ff0b4598d326' }, this.closeBracket)));
     }
     static get is() { return "smoothly-display-json-object"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/display/json/object/key/index.js CHANGED Viewed

@@ -4,7 +4,7 @@ export class SmoothlyDisplayJsonRecordKey {
         this.value = undefined;
     }
     render() {
-        return h(Host, { key: 'e7e589428127bdfdc3a226523417e256788003f9' }, "\"", this.value, "\"");
+        return h(Host, { key: '525fa15610e18dc3073cc4c28b1acf559a4c4a8a' }, "\"", this.value, "\"");
     }
     static get is() { return "smoothly-display-json-record-key"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/display/json/primitive/index.js CHANGED Viewed

@@ -4,7 +4,7 @@ export class SmoothlyDisplayJsonPrimitive {
         this.value = undefined;
     }
     render() {
-        return h(Host, { key: '7fb3f1eae3a5a4e958aff79b218347ad089810cd', class: this.value == null ? "null" : typeof this.value }, "" + JSON.stringify(this.value));
+        return h(Host, { key: '171404fee1a7bdd8ecd7beb0032c136e4e2652d8', class: this.value == null ? "null" : typeof this.value }, "" + JSON.stringify(this.value));
     }
     static get is() { return "smoothly-display-json-primitive"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/filter/field/index.js CHANGED Viewed

@@ -17,7 +17,7 @@ export class SmoothlyFilterField {
         this.value = event.detail.filter;
     }
     render() {
-        return (h(Host, { key: '101fba7d3f376e7b556425daf64c5ac8932fefbc' }, h("smoothly-input", { key: 'b0652849fec0e9748b289cc5b6a1dd556906fbba', name: "filter", ref: e => (this.input = e), value: this.criteria.toString(), onSmoothlyInputLooks: e => e.stopPropagation(), onSmoothlyKeydown: e => {
+        return (h(Host, { key: '247786bb8724ddcd5344cc02bb4f36e13737e43e' }, h("smoothly-input", { key: '3b8088c08cf3a7671b8b9b33e48ac133b7d4fe14', name: "filter", ref: e => (this.input = e), value: this.criteria.toString(), onSmoothlyInputLooks: e => e.stopPropagation(), onSmoothlyKeydown: e => {
                 e.stopPropagation();
                 e.detail.key == "Enter" && this.filterFieldEmit();
             }, onSmoothlyBlur: e => e.stopPropagation(), onSmoothlyFormDisable: e => e.stopPropagation(), onSmoothlyInputLoad: e => e.stopPropagation(), onSmoothlyChange: e => e.stopPropagation(), onSmoothlyInput: e => {

package/dist/collection/components/filter/index.js CHANGED Viewed

@@ -36,11 +36,11 @@ export class SmoothlyFilter {
         this.filters.forEach(update => update(this.criteria));
     }
     render() {
-        return (h(Host, { key: '458866acba458b727749aab418c5d07b009f0886' }, h("slot", { key: '6deb9fb89f67c8adc89c88b67762b3200953ed29', name: "bar" }), h("smoothly-filter-field", { key: 'f3c3c18a6385b7abfeb82ec2320312f0a13f439e', criteria: this.criteria, ref: e => (this.field = e) }), this.criteria.toString() != "" && (h("smoothly-icon", { key: '5e7586e48cd66190af3d48ab013c1af4ff006acf', name: "close", toolTip: "Clear all filters", size: "small", onClick: () => {
+        return (h(Host, { key: 'd0758e4b4003774f8d64ea98dd189c9d1bc4dfb7' }, h("slot", { key: '326730f0a2cdc4efe92f75be74f50e9d0afc2337', name: "bar" }), h("smoothly-filter-field", { key: '771a0da9c7c28810fb8b9c3eae4e0b2d6a8d629a', criteria: this.criteria, ref: e => (this.field = e) }), this.criteria.toString() != "" && (h("smoothly-icon", { key: 'f0699e512b801b2a82a4b6a75764455c4f6ff970', name: "close", toolTip: "Clear all filters", size: "small", onClick: () => {
                 this.clear();
-            } })), h("div", { key: '742d3c1ab86806412d5ab95bf19249feffb2cd35', class: this.expanded ? "container arrow-top" : "hidden" }, h("slot", { key: 'e8837329167c794efbcbb255ca9c50def503ef3f', name: "detail" })), h("smoothly-icon", { key: '0ebf30bb6797347fa77dec156f48c4b0a9d22e89', name: this.expanded ? "options" : "options-outline", toolTip: (this.expanded ? "Hide" : "Show") + " additional filters", size: "small", onClick: () => {
+            } })), h("div", { key: '4ed85c23a785b8f5a96d97acee1ec4bcdf11ccf1', class: this.expanded ? "container arrow-top" : "hidden" }, h("slot", { key: 'd41a7a8ed289625aa1f9de25b19a39cda75b6c29', name: "detail" })), h("smoothly-icon", { key: '534e48505b05d18bdbbc6d5817ef4f10d8c9f045', name: this.expanded ? "options" : "options-outline", toolTip: (this.expanded ? "Hide" : "Show") + " additional filters", size: "small", onClick: () => {
                 this.expanded = !this.expanded;
-            } }), h("div", { key: '31f476a863f44affca3c643529331e769f9658a0', class: this.expanded ? "close" : "hidden", onClick: () => (this.expanded = !this.expanded) })));
+            } }), h("div", { key: '52289b92ffc7b5f53e287c5c875ec3605ee307a2', class: this.expanded ? "close" : "hidden", onClick: () => (this.expanded = !this.expanded) })));
     }
     static get is() { return "smoothly-filter"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/filter/input/index.js CHANGED Viewed

@@ -63,7 +63,7 @@ export class SmoothlyFilterInput {
             (rest.length == 0 || (!!criteria.criteria && this.findInstanceOf(criteria.criteria, rest.join(".")))));
     }
     render() {
-        return (h("smoothly-input", { key: '90646ba0c33a81236352bc130c9139d652473b64', name: this.property, value: this.needle, type: this.type, placeholder: this.placeholder, onSmoothlyBlur: e => e.stopPropagation(), onSmoothlyFormDisable: e => e.stopPropagation(), onSmoothlyInputLoad: e => e.stopPropagation(), onSmoothlyChange: e => e.stopPropagation(), onSmoothlyInput: e => this.inputHandler(e) }, this.label, h("slot", { key: 'f6ba39d46857fb3ac409c9ae4cc404b0dca9a7bd' })));
+        return (h("smoothly-input", { key: 'b9c0bad8ca30d5e45e9686b52f8536cf8b0f3a29', name: this.property, value: this.needle, type: this.type, placeholder: this.placeholder, onSmoothlyBlur: e => e.stopPropagation(), onSmoothlyFormDisable: e => e.stopPropagation(), onSmoothlyInputLoad: e => e.stopPropagation(), onSmoothlyChange: e => e.stopPropagation(), onSmoothlyInput: e => this.inputHandler(e) }, this.label, h("slot", { key: 'b6bda14b39abfb507ce5a83f0cf95efb218d7c36' })));
     }
     static get is() { return "smoothly-filter-input"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/filter/select/index.js CHANGED Viewed

@@ -99,7 +99,7 @@ export class SmoothlyFilterSelect {
         return result && this.property.split(".").reduceRight((r, e) => selectively.property(e, r), result);
     }
     render() {
-        return (h("smoothly-input-select", { key: '7880e87f45d9227a6663854c8eb427ac39f0bce8', ref: e => (this.selectElement = e), name: this.property, looks: this.looks, multiple: this.multiple, menuHeight: this.menuHeight, onSmoothlyInputLooks: e => e.stopPropagation(), onSmoothlyItemSelect: e => e.stopPropagation(), onSmoothlyInput: e => this.selectHandler(e) }, this.label && (h("span", { key: 'b1ec133090f874ce79645ba2e82718d78590282c', slot: "label" }, [this.label.slice(0, 1).toUpperCase(), this.label.slice(1, this.label.length)].join(""))), h("slot", { key: '3b2dd729d7e0a9fc272d7bdaeb5ae35916afdac6', name: "items" })));
+        return (h("smoothly-input-select", { key: '9107d3913b3e08208538db9de5d27e9b8107c816', ref: e => (this.selectElement = e), name: this.property, looks: this.looks, multiple: this.multiple, menuHeight: this.menuHeight, onSmoothlyInputLooks: e => e.stopPropagation(), onSmoothlyItemSelect: e => e.stopPropagation(), onSmoothlyInput: e => this.selectHandler(e) }, this.label && (h("span", { key: '63b6cea56be4665c27dcb4822bd55700b1e62a7e', slot: "label" }, [this.label.slice(0, 1).toUpperCase(), this.label.slice(1, this.label.length)].join(""))), h("slot", { key: '30843b98d8e72b9eb258dfc6f12e58e5b49394ce', name: "items" })));
     }
     static get is() { return "smoothly-filter-select"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/filter/toggle/index.js CHANGED Viewed

@@ -72,7 +72,7 @@ export class SmoothlyFilterToggle {
             (rest.length == 0 || (!!check.criteria && this.findInstanceOf(check.criteria, rest.join(".")))));
     }
     render() {
-        return (h("smoothly-icon", { key: '2fc0a0d6ad73406cacdb79964618ec4a97f7cfdf', fill: "clear", color: this.active ? "success" : "medium", name: (this.active ? `${this.icon}` : `${this.icon}-outline`), toolTip: this.toolTip, onClick: () => this.activeHandler(true) }));
+        return (h("smoothly-icon", { key: '087ba0fc1cce503a6cf10665e89ca279075fcee7', fill: "clear", color: this.active ? "success" : "medium", name: (this.active ? `${this.icon}` : `${this.icon}-outline`), toolTip: this.toolTip, onClick: () => this.activeHandler(true) }));
     }
     static get is() { return "smoothly-filter-toggle"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/form/demo/all/index.js CHANGED Viewed

@@ -1,9 +1,9 @@
 import { h, Host } from "@stencil/core";
 export class SmoothlyFormDemoAll {
     render() {
-        return (h(Host, { key: '0385c6c02d1a129cae00d079094839f60b9e4d59' }, h("h2", { key: '9ab19de22f878f88a3f0f7dec246645f22621374' }, "All inputs"), h("smoothly-form", { key: '0afb15a06693181711b9002415e0729db1042c3a', looks: "grid", type: "create", readonly: true, action: "https://api.toiletapi.com/upload/6b12fd2f-e896-46f9-b38f-25cf42cee4b4", onSmoothlyFormSubmit: e => {
+        return (h(Host, { key: '4aafdec8d02db081953d370ef8d76e2088bf1102' }, h("h2", { key: 'e8e4e41a8363fd24b1edc5a9e97a3b2c25858fe8' }, "All inputs"), h("smoothly-form", { key: '2c8e99228944bacb529312d309b10b9f3dba8e43', looks: "grid", type: "create", readonly: true, action: "https://api.toiletapi.com/upload/6b12fd2f-e896-46f9-b38f-25cf42cee4b4", onSmoothlyFormSubmit: e => {
                 Object.entries(e.detail.value).forEach(([key, value]) => console.log(key, value));
-            } }, h("smoothly-input", { key: 'ee53cbde0c7bfe23cd594857fc835cdbc8997be8', readonly: true, name: "First Name", value: "John" }, "First name"), h("smoothly-input", { key: 'e8dabfb02d84e6fef81d6a411f354cded4a13125', showLabel: false, name: "Last name", value: "Doe" }, "Last name", h("smoothly-input-clear", { key: '554eceb647a10c6449a6146a8d43e7642c7da09f', size: "icon", slot: "end" })), h("smoothly-input", { key: 'c225f9078d26f1814063e40fd0de1e3df43275cf', type: "phone", name: "Phone", value: "777888999" }, "Phone", h("smoothly-input-reset", { key: '6eba87e2b65d2b8153415bd9bdca31dd0a230acc', size: "icon", slot: "end" })), h("smoothly-input-radio", { key: '661e2df9a57c25869211d817490083593bf4a7a6', clearable: true, name: "radioFirstInput" }, h("label", { key: '4745c265ffa3c99361d95ea171d8775aa70aa906', slot: "label" }, "Clearable"), h("smoothly-input-radio-item", { key: 'aa8efcfd71159c207606f1b7f4006124647f4da4', value: "first" }, "Label 1"), h("smoothly-input-radio-item", { key: 'b9003abf9da82573c37f4c863035518fe1bde187', selected: true, value: "second" }, "Label 2"), h("smoothly-input-radio-item", { key: '756a1f483a05e675abd69b4f59a3596b873b373d', value: "third" }, "Label 3")), h("smoothly-input-color", { key: '9696ab6161de5d76d8c7c1a880cbaf170a1fe981', name: "color" }, "Color"), h("smoothly-input-select", { key: '0aef27d0a847e0871b35d31567f3ebc4f1cc39b1', multiple: true, menuHeight: "7.5items", placeholder: "Select...", name: "select-month" }, h("label", { key: '6845e4016112205e5eca824be16ff117989e1c63', slot: "label" }, "Month multiple select"), h("smoothly-item", { key: 'b4d7da0babc1128898c40f40d403b8319a916b0e', value: "1" }, "January"), h("smoothly-item", { key: '4d29813b606c9830ca2985ff183188dfde019552', value: "2" }, "February"), h("smoothly-item", { key: '891c359e70a28f486d13cc70d7e8302d974ffd44', value: "3" }, "March"), h("smoothly-item", { key: '9fc4b6a56010f4e56ea3bad24653fa3c1164db37', value: "4" }, "April"), h("smoothly-item", { key: 'c1fc515cb9bdbbe2b4fbb574b53a546d7eaa4de3', value: "5" }, "May"), h("smoothly-item", { key: 'c7a3cf81a4f8878a823a1b0ef80e0bc205a0382c', value: "6" }, "June"), h("smoothly-item", { key: 'b59a01fcca7308602d6b064741d53e234692a66d', value: "7" }, "July"), h("smoothly-item", { key: '480b0c43f48a9afd806736ef9db90c1335401138', value: "8" }, "August"), h("smoothly-item", { key: '622289d68d83608692fa991eda21e10cf377c425', value: "9" }, "September"), h("smoothly-item", { key: '3720fbaf17cc74d5f1f503167e4d7d954ab4719d', value: "10" }, "October"), h("smoothly-item", { key: '4805352a3e5800b1385ccfbe3d18bd11cf7f35b1', value: "11" }, "November"), h("smoothly-item", { key: '78b77bd55d5fdd9e386feb2775ab783db46d4dfc', value: "12" }, "December")), h("smoothly-input-select", { key: 'f49f1ed662791f05f0916a390025a73be1fb2538', name: "select-icon", clearable: false, showSelected: false }, h("smoothly-item", { key: '734cd3e250cc78ba9e6f2e18e626574fbcf453b0', value: "folder", selected: true }, h("smoothly-icon", { key: 'f7feaa7a33f71d80e723afc4a779742247fd8b66', size: "small", name: "folder-outline" })), h("smoothly-item", { key: 'c712dbf6b6ff8f067c19f8f23cf47ee3544f1348', value: "camera" }, h("smoothly-icon", { key: 'a8a9d32cc749a88c8e4455e3f3c81a492a7d7278', size: "small", name: "camera-outline" }))), h("smoothly-input-checkbox", { key: 'a60e0866e5e7cb6ff1c218fb56dd2c4b1df1935a', name: "checkbox" }, "Check the box"), h("smoothly-input-checkbox", { key: '5655599fb6b1426a1c6e18843cda6dac48613c47', name: "checkbox2", checked: true }, "Check the box 2"), h("smoothly-input-range", { key: '8ad6d3fc94a13809380c2085ac7b594d627987f6', step: 1, name: "range3", value: 20, label: "Range" }), h("smoothly-input", { key: '3eadfff18e15a71158da0e172d6615117e2f7508', name: "pets.0.name" }, "First Pet's Name"), h("smoothly-input-range", { key: '38fa8ab54b31e88279525a45e639fa83ba7623d2', name: "pets.0.age", max: 100, step: 1, label: "First Pet's Age" }), h("smoothly-input", { key: '13e749bd9bb697cd65e2d308c3a1f430621bcf25', name: "pets.1.name" }, "Second Pet's Name"), h("smoothly-input-range", { key: 'd7ce9434254e3c8fe95d316ff8ea0d733a21ed1a', name: "pets.1.age", max: 100, step: 1, label: "Second Pet's Age" }), h("smoothly-input", { key: 'cad73bed3fefb8ecfccf69a60af7d6eaecade27e', name: "pets.2.name" }, "Third Pet's Name"), h("smoothly-input-range", { key: '2b522b38ef71ba8bd5cc3677a88ee7ce14ed8a79', name: "pets.2.age", max: 100, step: 1, label: "Third Pet's Age" }), h("smoothly-input-file", { key: 'f6855448a3e5acca833a25e857a9081fe3b44a94', name: "profile", placeholder: "Click or drag your profile picture here..." }, h("span", { key: '2ec12ef414b0faaf4ebd318108c18cc06d85b9a9', slot: "label" }, "Profile"), h("smoothly-icon", { key: '6e498f13b43e45472ab3ae1284061506bb6a3852', slot: "button", name: "person-circle-outline", size: "tiny", fill: "default" })), h("smoothly-input", { key: '66c13d36dd68e936cec4964a6497d23cc4e34f12', type: "duration", name: "duration", value: {} }, "Duration"), h("smoothly-input-clear", { key: 'ae92ab8da0139b9b2cd99c4713dbcb33c0990225', fill: "default", type: "form", color: "warning", slot: "clear", size: "icon", shape: "rounded" }), h("smoothly-input-edit", { key: '1af80f87c16cc87698fe93eaf6666eb830f60dce', fill: "default", type: "form", color: "tertiary", slot: "edit", size: "icon", shape: "rounded" }), h("smoothly-input-reset", { key: 'e254e07931e20103f7517766a91762465c6e6b50', fill: "default", type: "form", color: "warning", slot: "reset", size: "icon", shape: "rounded" }), h("smoothly-input-submit", { key: '4e847f15c8f56d8d81fb8f55fda2dc78f075755b', delete: true, slot: "delete", color: "danger", size: "icon", shape: "rounded" }), h("smoothly-input-submit", { key: '14c7ea0a41f3a6f6da212886e390af8d49d47108', fill: "default", color: "success", slot: "submit", size: "icon", shape: "rounded" }))));
+            } }, h("smoothly-input", { key: '5453b9a059c8210c3311476842b7391f045667ab', readonly: true, name: "First Name", value: "John" }, "First name"), h("smoothly-input", { key: '90e31870a59bc198001b433647d2464a8686c019', showLabel: false, name: "Last name", value: "Doe" }, "Last name", h("smoothly-input-clear", { key: 'a9a8375a554d460964cf1f8d2d83599e378143c0', size: "icon", slot: "end" })), h("smoothly-input", { key: 'f1af6f8f2c4c244a61bc4b7e2b2402c15bd36040', type: "phone", name: "Phone", value: "777888999" }, "Phone", h("smoothly-input-reset", { key: 'b07098fb565faa815121b1ac12d2f19c5dae383f', size: "icon", slot: "end" })), h("smoothly-input-radio", { key: 'a7a55e86d8c37219a8f689ae44f249fa4b147357', clearable: true, name: "radioFirstInput" }, h("label", { key: '3efcc33f30a7f52c4e287ddadf136b7bff33a383', slot: "label" }, "Clearable"), h("smoothly-input-radio-item", { key: 'bcdd7d2d5a7e3f9164f3970330ca517922ba1cc9', value: "first" }, "Label 1"), h("smoothly-input-radio-item", { key: 'b90c7edce08ca75afc2abd72b91db9e7ec30621a', selected: true, value: "second" }, "Label 2"), h("smoothly-input-radio-item", { key: 'dfa717cfb10099f10c66810054e9c51874272c9a', value: "third" }, "Label 3")), h("smoothly-input-color", { key: '28c439cbcb81a7f3480e67d956cf28b0cdff18c0', name: "color" }, "Color"), h("smoothly-input-select", { key: '9d832b5471b3703173f92d0b2536af790ec872e2', multiple: true, menuHeight: "7.5items", placeholder: "Select...", name: "select-month" }, h("label", { key: 'bcc8d409a8d0fbfbdd7edc757958b3a43c2121b8', slot: "label" }, "Month multiple select"), h("smoothly-item", { key: '9270263fc0907a95fa4fda20faab20724463eccc', value: "1" }, "January"), h("smoothly-item", { key: 'df50a7b49930b58947e4ada4787fe0f3b9c7959b', value: "2" }, "February"), h("smoothly-item", { key: 'c9c9ed6fa3f64f2bb2a7f7ce7a8e3e6ec973a71b', value: "3" }, "March"), h("smoothly-item", { key: '1a4df13779efe8c8c61f2e57c39684690a7e677a', value: "4" }, "April"), h("smoothly-item", { key: 'c03f5dfebd422e4a81af772ab5ac5ddb08edecbd', value: "5" }, "May"), h("smoothly-item", { key: '1238d99c2295fa52c22e67076b9714d12cc19cba', value: "6" }, "June"), h("smoothly-item", { key: '46256dc03ebe9f2bebf360dfc51778aa1fa3f231', value: "7" }, "July"), h("smoothly-item", { key: '0d2d6530ef9a48579bf014197fa29c1778138b2d', value: "8" }, "August"), h("smoothly-item", { key: 'c454e4f74973b4e4919c8ea40576d174ec7c9762', value: "9" }, "September"), h("smoothly-item", { key: '6a410dc5b68b3fbd123531b99bad22d7ed9c0bce', value: "10" }, "October"), h("smoothly-item", { key: '5214628e65ea539a77a14eeb2bbfe4270fb03033', value: "11" }, "November"), h("smoothly-item", { key: '2ab1330f7b25c711d6d50239cff5f8c417addca6', value: "12" }, "December")), h("smoothly-input-select", { key: 'a1493892d87ab651e53780905807570b50b91d07', name: "select-icon", clearable: false, showSelected: false }, h("smoothly-item", { key: '61df0c697952bff56da044b3f29748926e58967a', value: "folder", selected: true }, h("smoothly-icon", { key: '0e54b6ca59fccab56e3ed55aa03862a263eb7e55', size: "small", name: "folder-outline" })), h("smoothly-item", { key: '5c3321c5142c69b3065b32a6b55a34aecfab33be', value: "camera" }, h("smoothly-icon", { key: 'cccbfdb9939b3d16a885d6605436fc54c1da3019', size: "small", name: "camera-outline" }))), h("smoothly-input-checkbox", { key: 'f2bd24855f068fb7add590cb87f4050a3c18c17f', name: "checkbox" }, "Check the box"), h("smoothly-input-checkbox", { key: '59a3654cf275543968911fa8dba440c1667496f9', name: "checkbox2", checked: true }, "Check the box 2"), h("smoothly-input-range", { key: '45ed118690207280f2c26768d0da1b7801b24bf2', step: 1, name: "range3", value: 20, label: "Range" }), h("smoothly-input", { key: '4d597c188035beeec5adc9ccef43bdf9e3eb2427', name: "pets.0.name" }, "First Pet's Name"), h("smoothly-input-range", { key: '9a9310130e8c940f4ec771aa6753e8f7231a7228', name: "pets.0.age", max: 100, step: 1, label: "First Pet's Age" }), h("smoothly-input", { key: '2c6cd64ce3a290205856e2442a1ef199a46d1cff', name: "pets.1.name" }, "Second Pet's Name"), h("smoothly-input-range", { key: 'e90157d8dfae3668bc67aa5646f2176754b08347', name: "pets.1.age", max: 100, step: 1, label: "Second Pet's Age" }), h("smoothly-input", { key: '26ee4906aa12fc145f24a45fbe4e0e6ac4f828e7', name: "pets.2.name" }, "Third Pet's Name"), h("smoothly-input-range", { key: '9c313148e3134d81f9ffbe76bb50ddea1e5f82e3', name: "pets.2.age", max: 100, step: 1, label: "Third Pet's Age" }), h("smoothly-input-file", { key: '471cde92dd3f9b6deb214d85fc689c4451ee2aac', name: "profile", placeholder: "Click or drag your profile picture here..." }, h("span", { key: '9baf5b9e972d897d55296c4bc870b2c22df72caa', slot: "label" }, "Profile"), h("smoothly-icon", { key: '15b62211482dedb406cc0fe9979b2ea845ba8fb6', slot: "button", name: "person-circle-outline", size: "tiny", fill: "default" })), h("smoothly-input", { key: '60578f6da664c305319c8f04d30a1c05eae33a06', type: "duration", name: "duration", value: {} }, "Duration"), h("smoothly-input-clear", { key: '8a9f189bacdba4054cbe6f4f21cd11c5246b5abb', fill: "default", type: "form", color: "warning", slot: "clear", size: "icon", shape: "rounded" }), h("smoothly-input-edit", { key: '480cf7b27cbdc2047f126677eb425a1576e98314', fill: "default", type: "form", color: "tertiary", slot: "edit", size: "icon", shape: "rounded" }), h("smoothly-input-reset", { key: 'e3b3fb9fbf3a7999c76d81c85629170dd5efd6c3', fill: "default", type: "form", color: "warning", slot: "reset", size: "icon", shape: "rounded" }), h("smoothly-input-submit", { key: 'db4bb9254a75878098844e4804a6121f053f631b', delete: true, slot: "delete", color: "danger", size: "icon", shape: "rounded" }), h("smoothly-input-submit", { key: '57b118fb1b4852b39baf424c3f69f1fa00bea891', fill: "default", color: "success", slot: "submit", size: "icon", shape: "rounded" }))));
     }
     static get is() { return "smoothly-form-demo-all"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/form/demo/card/index.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { h, Host } from "@stencil/core";
 export class SmoothlyFormDemoCard {
     render() {
-        return (h(Host, { key: 'de64604dbfaa81289d06fb7f035e266385a24c53' }, h("h2", { key: 'de36abc60544d5f6023d06933c2234cf04887253' }, "Card"), h("smoothly-form", { key: '51aefd9496fd4cb72a61a6e922db326633bd1928', looks: "grid", onSmoothlyFormSubmit: (e) => alert(JSON.stringify(e.detail)) }, h("smoothly-input", { key: 'c9cd0695bd416621f1758ece4b54e68e32c5d24a', type: "card-number", name: "card" }, "Card #"), h("smoothly-input-submit", { key: 'b63581365b31bc1e0dfd1c5650a59a4dc32bcfe7', size: "icon", slot: "submit", color: "success", fill: "solid" }), h("smoothly-input", { key: '494e6dd5232f5b3d2906cdfe1c4953518b5a7abe', type: "card-expires", name: "expires" }, "Expires"), h("smoothly-input", { key: 'f4244649c75f5f6b9495aa5ee32a21ac23931d9a', type: "card-csc", name: "csc" }, "CVV/CVC"), h("smoothly-input", { key: 'f71a28674d61243e44710511f648e77cd3186d89', type: "text", name: "name.first" }, "First Name"), h("smoothly-input", { key: 'a5b116a0c499895eeb8a0819d7db8573aa7e4b26', type: "text", name: "name.last" }, "Last Name"))));
+        return (h(Host, { key: 'e6e9b32074fdf87dab50af3c1f904ac6861964ef' }, h("h2", { key: 'd4512eea73d23fb396db207b58fd437b282ba6d1' }, "Card"), h("smoothly-form", { key: '96adcef6dba1a152573a391a8d020fba1c498b2e', looks: "grid", onSmoothlyFormSubmit: (e) => alert(JSON.stringify(e.detail)) }, h("smoothly-input", { key: 'c7e9dd627c326a133cdc3833d8aa9bee1fe3cd85', type: "card-number", name: "card" }, "Card #"), h("smoothly-input-submit", { key: 'e5d11e876a9ad1171ce24aefa7f104fc51948df3', size: "icon", slot: "submit", color: "success", fill: "solid" }), h("smoothly-input", { key: 'b7193c79148812850e1d31970f6696da9c8a1083', type: "card-expires", name: "expires" }, "Expires"), h("smoothly-input", { key: '69e610530f2d65909289c3a957df8c182613e9f4', type: "card-csc", name: "csc" }, "CVV/CVC"), h("smoothly-input", { key: '4f9685d7d83dff346e4660c25886193030395e73', type: "text", name: "name.first" }, "First Name"), h("smoothly-input", { key: '73f829b49a411a438f2228d17679671a0075335d', type: "text", name: "name.last" }, "Last Name"))));
     }
     static get is() { return "smoothly-form-demo-card"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/form/demo/controlled/index.js CHANGED Viewed

@@ -31,7 +31,7 @@ export class SmoothlyFormDemoControlled {
         event.detail.result(false);
     }
     render() {
-        return (h(Host, { key: 'e312871aa3d76c94091e33d4ca6594a12de64673' }, h("h2", { key: '01f69f3ac2f7aa936b97604c9ed9f2006b72d845' }, "Controlled"), h("smoothly-form", { key: '999072a4a6bab7ee0d00810e4677fe96948a5591', readonly: true, looks: "grid", onSmoothlyFormSubmit: e => this.submitHandler(e) }, h("smoothly-input", { key: '132707e9e475d5b2621528410998ef2b3a9ff589', type: "text", name: "name", value: this.name }, "Name"), h("smoothly-input-select", { key: 'f99fdb9c0389f9aa0d41ca19345a59f81626a789', name: "currency" }, h("span", { key: '07e163ae48a752ea46818ced40c54f6c02b20291', slot: "label" }, "Currency"), this.currencies.map(currency => (h("smoothly-item", { selected: currency == this.currency, value: currency }, currency)))), h("smoothly-input", { key: 'a4541576d6174d00edc35dc30d16e7107f8e787e' }, "Dummy"), h("smoothly-input-month", { key: '52795ebfac126f55b07a670ed1c5d74e408e317c', name: "date", value: this.date, next: true, previous: true }, h("span", { key: '6c2020021f005783a25136f68c873d5536b87d71', slot: "year-label" }, "Year"), h("span", { key: 'ff7c8e28d5c0dd2cb503613a0ecdd3f0f1b14e97', slot: "month-label" }, "Month")), h("smoothly-input-edit", { key: '3762d99e64f8fd135050b3e174db72fa3dfa776c', slot: "edit", size: "icon", color: "primary", fill: "default" }), h("smoothly-input-reset", { key: '3c65df079fb6cf79a9c9f9dcf8d078e53a9b211f', slot: "reset", size: "icon", color: "warning", fill: "default" }), h("smoothly-input-submit", { key: '89ebbedc35474bdcd13d210dd64f2fbeda3efc76', slot: "submit", size: "icon", color: "success" }))));
+        return (h(Host, { key: 'ef92c785b3365355b8ba811433b79938d060a5a4' }, h("h2", { key: '306ca5c5065a7a6e92ddf920fc987bf61228ab42' }, "Controlled"), h("smoothly-form", { key: '92248470b1409209b278951fdd4235cab8b6dc08', readonly: true, looks: "grid", onSmoothlyFormSubmit: e => this.submitHandler(e) }, h("smoothly-input", { key: '57d2c32977ca8b036f4d645ba9487df62d396073', type: "text", name: "name", value: this.name }, "Name"), h("smoothly-input-select", { key: '9e29c5a6cb0b31b23fbe5e4db5c915e11b61eb10', name: "currency" }, h("span", { key: 'bae8a234efdf2ff5964797acb15ace498cdb2265', slot: "label" }, "Currency"), this.currencies.map(currency => (h("smoothly-item", { selected: currency == this.currency, value: currency }, currency)))), h("smoothly-input", { key: 'd178a9307c618462ef461009da95292fd6f11b2f' }, "Dummy"), h("smoothly-input-month", { key: '724c1e722dc1356525201c391321ecce06580ef4', name: "date", value: this.date, next: true, previous: true }, h("span", { key: '93fb5f06e98380c3a26435e560cbbfdff67369ef', slot: "year-label" }, "Year"), h("span", { key: '29ff08b4c11e66ddd5529b872ba310189ce460d5', slot: "month-label" }, "Month")), h("smoothly-input-edit", { key: '869f2703a94250f47169d0f532995ee239479387', slot: "edit", size: "icon", color: "primary", fill: "default" }), h("smoothly-input-reset", { key: '6801450e28506323ec1e963540acf491419b48d2', slot: "reset", size: "icon", color: "warning", fill: "default" }), h("smoothly-input-submit", { key: '7c5df04fd4720162adaea05387260f3132e940bf', slot: "submit", size: "icon", color: "success" }))));
     }
     static get is() { return "smoothly-form-demo-controlled"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/form/demo/date/index.js CHANGED Viewed

@@ -21,7 +21,7 @@ export class SmoothlyFormDemoDate {
         event.detail.result(false);
     }
     render() {
-        return (h(Host, { key: 'c855ac16e0490761f1c8613aea19ad2408170f61' }, h("h2", { key: '3668f293c8ab4980e4e25782d6ca17afdf0eacbc' }, "Date input"), h("smoothly-form", { key: 'cc403e758e981e551901533b40623aed9fb89437', looks: "border", type: "create", validator: this.validator, onSmoothlyFormSubmit: e => this.submitHandler(e) }, h("smoothly-input-date", { key: '4b3aa55a1ad49138fa2894c4f953cd5c3ea18551', name: "date" }, "Date"), h("smoothly-input-submit", { key: 'da1083abf5b98c967835443321cb4e3dfef52003', slot: "submit" }, h("smoothly-icon", { key: '892de2aea93d01e62effcb14d25e78ea00778b14', name: "checkmark-outline" })))));
+        return (h(Host, { key: '22f4ed40b5848bc4784005b35f4601ade0ce4aac' }, h("h2", { key: 'c894900036aa83547c5b92acde5fa1dc2e56030f' }, "Date input"), h("smoothly-form", { key: 'd0ac14b67b826e1b731b397c76d78f2999b946ec', looks: "border", type: "create", validator: this.validator, onSmoothlyFormSubmit: e => this.submitHandler(e) }, h("smoothly-input-date", { key: '74557c8d42c7091413536585a6eedef8cc464ca1', name: "date" }, "Date"), h("smoothly-input-submit", { key: '283d86091ece17e31f8a9818ee281335836a314e', slot: "submit" }, h("smoothly-icon", { key: '189942a7dd92dd1166b83edfe8987cd3e18d8a39', name: "checkmark-outline" })))));
     }
     static get is() { return "smoothly-form-demo-date"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/form/demo/date-range/index.js CHANGED Viewed

@@ -21,7 +21,7 @@ export class SmoothlyFormDemoDateRange {
         event.detail.result(false);
     }
     render() {
-        return (h(Host, { key: '8268dbce8002112c47995db37c6c4db5dfbd5b53' }, h("h2", { key: 'aa3db2510b5e19dde1f362870a29ee9c8d2199e6' }, "Date-range input"), h("smoothly-form", { key: '1f79aa6badf665f27a4e16cf8694f07e6159a7ce', looks: "border", type: "create", validator: this.validator, onSmoothlyFormSubmit: e => this.submitHandler(e) }, h("smoothly-input-date-range", { key: '0844d7c580ebaebf4b0241446d1a8c73621a3441', name: "range" }, "Range"), h("smoothly-input-submit", { key: '530f99ec11e4ae634852572a1e39e4aa3a221f43', slot: "submit" }, h("smoothly-icon", { key: 'eec2006e62c67157029dd9bf1c79be6f4fb8bee7', name: "checkmark-outline" })))));
+        return (h(Host, { key: '68aae8530e210936e6ee1cb52e65835cb5376088' }, h("h2", { key: 'ab56927aa4b3ffb87ad6ccda58ae62933c210ed7' }, "Date-range input"), h("smoothly-form", { key: 'b1901ddc4170e4f0cd5fd3a2685ba98230a519a4', looks: "border", type: "create", validator: this.validator, onSmoothlyFormSubmit: e => this.submitHandler(e) }, h("smoothly-input-date-range", { key: '02ddba37b9f1a82f494717bbcdac1b86aff508b5', name: "range" }, "Range"), h("smoothly-input-submit", { key: '91c4c3b390da5f50236ab9afbd53c1b005a7a90a', slot: "submit" }, h("smoothly-icon", { key: 'ddecec0e052bf335197963a0e85345a4396d3976', name: "checkmark-outline" })))));
     }
     static get is() { return "smoothly-form-demo-date-range"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/form/demo/index.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { h, Host } from "@stencil/core";
 export class SmoothlyFormDemo {
     render() {
-        return (h(Host, { key: '8e9b91eba4771356a02e26aa874149e9aec1e49e' }, h("div", { key: '322a7b8c4053c5307e09aedc034aec3bd58cfa40' }, h("smoothly-form-demo-all", { key: '36cff0fce86410559185639407888e064aa7f6f5' }), h("smoothly-form-demo-pet", { key: '8ac19a250eae3f03b36b7eefa4bb0b8fcef9bc67' }), h("smoothly-form-demo-card", { key: 'e92a4974e434fc122a4d6a9036031c19eb8fbdce' }), h("smoothly-form-demo-login", { key: '0551748193b700acbc0ef91afe2e330ac67c1ec6' }), h("smoothly-form-demo-prices", { key: '98e1cd3159817b7943b0fcab4b8e455527679aef' }), h("smoothly-form-demo-typed", { key: 'ee3a5a705e8295e6f030201876e8e9e6e0b17ce5' }), h("smoothly-form-demo-transparent", { key: 'f245050d3f3838922c51ab02a6fc7c51d030be49' }), h("smoothly-form-demo-date", { key: 'b9dab7e216a735a7d4a71e63e9dcdcbb261d35b9' }), h("smoothly-form-demo-schedule", { key: '5f7073b2b7d9ec29a787d1c47a54261d7a312735' }), h("smoothly-form-demo-date-range", { key: '6d0c60c7aac3037d3d697e1440ce3643fd107298' }), h("smoothly-form-demo-controlled", { key: 'e307e69e96b98c85cd15f6e1e68facd7a86ebcb0' }))));
+        return (h(Host, { key: 'c5b442e2dc17139d030550d2595b2ce07c0c03ca' }, h("div", { key: '5a453eff769ea4cef9f474ae7bd22cfdae97e66d' }, h("smoothly-form-demo-all", { key: '1b771b6dbcdcf463b968518ee933bcf511adc25d' }), h("smoothly-form-demo-pet", { key: '9154d737dda44b49c7b1a4ddb3dfb7c2dc69bb4c' }), h("smoothly-form-demo-card", { key: 'b91fb0a14460ddf0074e55b4b31de8871ad41d47' }), h("smoothly-form-demo-login", { key: 'f0bc618e065739efda66c9eadb31d22785068e17' }), h("smoothly-form-demo-prices", { key: 'b9c08280b8cdb857ffbd5c443f5693e2b22a7cd5' }), h("smoothly-form-demo-typed", { key: 'e0a2cab7330a378e9aa8cec545f3aea804a0ff10' }), h("smoothly-form-demo-transparent", { key: '7cad7cf997da8d3cdfd40689a074fd746338eccc' }), h("smoothly-form-demo-date", { key: '1d8567528f1c8f3d5178b57e197b7818b7244dcf' }), h("smoothly-form-demo-schedule", { key: '0c96e9f297face51f234e8c377933468607d5ccd' }), h("smoothly-form-demo-date-range", { key: 'e1409719e74987f69cb66e689a88484f3a662ef8' }), h("smoothly-form-demo-controlled", { key: '09d09373a678c6754be06e7795870ad8344bfe55' }))));
     }
     static get is() { return "smoothly-form-demo"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/form/demo/login/index.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { h, Host } from "@stencil/core";
 export class SmoothlyFormDemoLogin {
     render() {
-        return (h(Host, { key: '805689f0a9b1f399f36da3a4375f79a65d350f61' }, h("h2", { key: '6afdfc52c85ba2c2a43b90aafc5509f66976ebea' }, "Login"), h("smoothly-form", { key: 'e671b3b795cffd38b35254cb29700ce1bdcd14ea', looks: "border" }, h("smoothly-input", { key: 'e89a85e6321bafaa4dd4d13ba69b6ad0201a3eea', type: "text", name: "username" }, "Username"), h("smoothly-input", { key: '68c7a62b137d8e7c05da4d55a72482be1afc2b0c', type: "password", name: "password" }, "Password"), h("smoothly-input-reset", { key: '90bc800f57c53038c16f6337c19adf38c97d00b4', slot: "reset", type: "form", size: "icon", color: "warning" }), h("smoothly-input-submit", { key: '2f7f66e7fb38ea1ba846745bbc352b9fa15e4ec9', slot: "submit" }))));
+        return (h(Host, { key: '914cd546393dcc39159cb968565a77afb574538f' }, h("h2", { key: '7fee155ff0311666f0061bfe0b0292d7418150f1' }, "Login"), h("smoothly-form", { key: 'f3237c61ebb16e0f7715a87e3a949705fa6979ab', looks: "border" }, h("smoothly-input", { key: '0ed97ea010760f27c89e4c78d3b00dca898b4d98', type: "text", name: "username" }, "Username"), h("smoothly-input", { key: '039a6e17d6e359a93639ec99442b8cd93c91a1e1', type: "password", name: "password" }, "Password"), h("smoothly-input-reset", { key: 'e64d6a94c00b458d0d7c5e5b77a5f8b3a0fc316f', slot: "reset", type: "form", size: "icon", color: "warning" }), h("smoothly-input-submit", { key: '886ea445167ab3281130390594d3e165e7676b4b', slot: "submit" }))));
     }
     static get is() { return "smoothly-form-demo-login"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/form/demo/pet/index.js CHANGED Viewed

@@ -8,10 +8,10 @@ export class SmoothlyFormDemoPet {
     }
     render() {
         var _a, _b;
-        return (h(Host, { key: '50d7eaf7522daa10b3f5832a87fff8674b162dea' }, h("h2", { key: '1262eb5e63ca5d7874f776837470a88bf5b8769e' }, "Pet"), h("h3", { key: '48e2bedbc5a62495d3b6f75dcc94b1b81b746e33' }, "Value"), h("smoothly-form", { key: '2d2f7c7ce198228e17c7e7ae1e507d7a97d73ff0', looks: "border", onSmoothlyFormSubmit: (e) => alert(JSON.stringify(e.detail)), onSmoothlyFormInput: e => (this.value = Object.assign({}, e.detail)) }, h("smoothly-input", { key: 'd5b952488d27c212a51bb0f19c07f32a4b02bdc2', type: "text", name: "name.first" }, "Name"), h("smoothly-input", { key: '160482d107ee5fbb66e6e9be4dd17549085ec66b', type: "integer", name: "age" }, "Age (Years)"), h("smoothly-input-checkbox", { key: '1a3a7229c18eb1adff2ab0f80fc79b3c02e5c6fe', name: "hasOwner", onSmoothlyInputLoad: e => e.stopPropagation(), onSmoothlyInput: e => {
+        return (h(Host, { key: 'ca731e714eb7d3c9027c8eaacccf0ef611917de7' }, h("h2", { key: '6b4198cb4bc6f85810f4559fcfa97b8aa1948d76' }, "Pet"), h("h3", { key: '8877db7feccc2c437df73f4b9d1df2c0d9e9397f' }, "Value"), h("smoothly-form", { key: '817548dbe700db117d066032605e83e89bae52f9', looks: "border", onSmoothlyFormSubmit: (e) => alert(JSON.stringify(e.detail)), onSmoothlyFormInput: e => (this.value = Object.assign({}, e.detail)) }, h("smoothly-input", { key: '159422b05784af942138ba2b73c663988a981795', type: "text", name: "name.first" }, "Name"), h("smoothly-input", { key: 'a63d1fee5a11efff76f921e18cf7905473a41715', type: "integer", name: "age" }, "Age (Years)"), h("smoothly-input-checkbox", { key: '8ad23527074d579b7ba39e9d39ba25c458173114', name: "hasOwner", onSmoothlyInputLoad: e => e.stopPropagation(), onSmoothlyInput: e => {
                 this.hasOwner = e.detail.hasOwner;
                 e.stopPropagation();
-            } }, "Has Owner"), this.hasOwner && (h(Fragment, { key: 'c358b2d9b6b7160187ffc2005c31acb2e245e195' }, h("smoothly-input", { key: '181824a1a8c9336a6281a2c75c0dca8dd1efec5d', type: "text", name: "owner.firstName", value: this.owner.firstName, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { firstName: e.detail["owner.firstName"] })) }, "Owner First Name"), h("smoothly-input", { key: '48c584e660552cbcb6b8591cb76db4ad82a1574a', type: "text", name: "owner.lastName", value: this.owner.lastName, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { lastName: e.detail["owner.lastName"] })) }, "Owner Last Name"), h("smoothly-input-file", { key: '0337e5784fda5203110240ce57a59999b95eb0b6', name: "owner.picture" }, h("span", { key: '376e9b3c74bd3c91b7c4830088214d6f25d97b2f', slot: "label" }, "Owner picture")), h("smoothly-input-date", { key: 'a46ac3dcf0f642c3e73a05e372b89c3d2bc05af4', name: "owner.birthday", value: this.owner.birthday, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { birthday: e.detail["owner.birthday"] })) }, "Owner birthday"), h("smoothly-input-date-range", { key: '091a40ffac1d94fb84ab34fafe53e6f3fdc4eb2e', name: "owner.ownedRange", start: (_a = this.owner.ownedRange) === null || _a === void 0 ? void 0 : _a.start, end: (_b = this.owner.ownedRange) === null || _b === void 0 ? void 0 : _b.end, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { ownedRange: e.detail["owner.ownedRange"] })) }, "Owner ownedRange"), h("smoothly-input-range", { key: '481c3e71f7fa1c4a6212c2a7793b29520a0a4a7a', name: "owner.height", step: 1, max: 250, value: this.owner.height, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { height: e.detail["owner.height"] })) }, "Owner's Height"), h("smoothly-input-select", { key: '2a1d02d5822bba65319793184fca0bb0c228b09f', name: "owner.favoriteHat" }, h("span", { key: '3b0d1c7ab9d640a6beb7386d3fcf32d01c4862bd', slot: "label" }, "Owner's Favorite Hat"), ["🎩 top hat", "🧢 cap", "👒 sun hat", "❌ none"].map((value, index) => (h("smoothly-item", { value: value, key: index, selected: this.owner.favoriteHat == value }, value)))), h("smoothly-input-color", { key: '0213d002d04794540650094b87c2f51dc4c79dcc', name: "owner.favoriteColor", value: this.owner.favoriteColor ? RGB.toHex(this.owner.favoriteColor) : undefined, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { favoriteColor: e.detail["owner.favoriteColor"] })) }, "Owner's Favorite Color"), h("smoothly-input-radio", { key: '779bc55c0302cfbdd760fcca76d4218d248f04bc', name: "owner.favoritePizza", value: this.owner.favoritePizza, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { favoritePizza: e.detail["owner.favoritePizza"] })) }, h("span", { key: '95dc274f29b977810e20393866165337f5e8b375', slot: "label" }, "Owner's Favorite Pizza"), ["vesuvio", "capricciosa", "quattro formaggi"].map((value, index) => (h("smoothly-input-radio-item", { value: value, key: index }, value)))), h("smoothly-input-checkbox", { key: '6c54742a964b261f6149eff7a3f8f8f99def63eb', name: "owner.hasPet", checked: this.owner.hasPet, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { hasPet: e.detail["owner.hasPet"] })) }, "Has Pet"))), h("smoothly-summary", { key: 'd0e0717f5ab5654263f61b19b9aaaeb744884f2b' }, h("span", { key: 'de40ea4e5537031fa91affb4282ee438282f3051', slot: "summary" }, "Summary"), h("div", { key: 'b416d9370549c02235eee7757fd9fc1d42004394', slot: "content" }, h("smoothly-input", { key: '7351bc85a7388f5f8b77f6b1d528c566c3fa97a5', type: "price", name: "summary.price", currency: "EUR" }, "Summary Price"), h("smoothly-input-file", { key: '9f296928fd94ac6f35a1614595da37b3995b107f', name: "summary.picture" }, h("span", { key: 'd7fe9c0f53565bef390c8503a58f6f50868610a7', slot: "label" }, "Summary picture")), h("smoothly-input-date", { key: '44c483cf3c8f71be268d90d5f468a49c22cd2f8b', name: "summary.birthday" }, "Summary birthday"), h("smoothly-input-date-range", { key: 'b5124dfc4e7816e7ba4f820a5aca3d14af0fb837', name: "summary.ownedRange" }, "Summary ownedRange"), h("smoothly-input-range", { key: 'ea62f55332b6b3e125903d3c6baa380689ed864e', name: "summary.height", label: "Height" }), h("smoothly-input-select", { key: '99ffc93ca528a13281fe6dd188139b638f5c8ba5', name: "summary.favoriteHat" }, h("span", { key: '0da54511b795b429e768a119074d5392abaf2b9c', slot: "label" }, "Summary's Favorite Hat"), ["🎩 top hat", "🧢 cap", "👒 sun hat", "❌ none"].map((value, index) => (h("smoothly-item", { value: value, key: index }, value)))), h("smoothly-input-month", { key: '3419ad81154cb4af9bb372c3045925456d4fe7fd', name: "summary.month" }, h("span", { key: '6794ccd25d220bdb0612adcfeb9389885c53ebb6', slot: "month-label" }, "Summary month")), h("smoothly-input-color", { key: 'bd5a2efeee77428de15a54f85f3f23f44e8ca024', name: "summary.color" }, "Summary Color"), h("smoothly-input-radio", { key: '21ede19a4f9112977e253fb51cea2aa39ad819f6', name: "summary.favoritePizza" }, h("span", { key: '889b43b3ee59c109fab04a38dde1ea7a804c84f9', slot: "label" }, "Summary's Favorite Pizza"), ["vesuvio", "capricciosa", "quattro formaggi"].map((value, index) => (h("smoothly-input-radio-item", { value: value, key: index }, value)))), h("smoothly-input-checkbox", { key: '47a39cc2ddd1d4745b25125b59d3a85f7f68b6c1', name: "summary.hasPet" }, "Has Pet"))), h("smoothly-tabs", { key: 'bff4910b703b19ac81799c63704a47c79690dec1' }, h("smoothly-tab", { key: '03a01fc8534e7228be5a042fc2f1a605700c6019', label: "Dog" }, h("smoothly-input", { key: 'b70ec959c8415429276bac30aac2f799eaad9e48', type: "text", name: "dog.breed" }, "Breed"), h("smoothly-input-file", { key: '098a0dec9bd010569eca48f0736ed354d478e4c2', name: "dog.picture" }, h("span", { key: '089b32a2ff3926d59b9ce01e8a0f73f0eddde01b', slot: "label" }, "Dog picture")), h("smoothly-input-date", { key: 'd365a6a7c8cbc7df81f12cc2be3d1b5958d694bd', name: "dog.birthday" }, "Dog birthday"), h("smoothly-input-date-range", { key: 'b063302e3f366a53071cf0fb2e5d87e39c5d9a44', name: "dog.dateRange" }, "Dog date range"), h("smoothly-input-select", { key: 'd2c7c1c0ef6ef428bf667a3d61f752761c0936dc', name: "dog.favoriteHat" }, h("span", { key: '82759482ed126788312fd90fb7500bd4622eab32', slot: "label" }, "Dog's Favorite Hat"), ["🎩 top hat", "🧢 cap", "👒 sun hat", "❌ none"].map((value, index) => (h("smoothly-item", { value: value, key: index }, value)))), h("smoothly-input-color", { key: 'bc0ee988a7e70ce19d1735811283c268ae9eed04', name: "dog.favoriteColor" }, "Dog's Favorite Color"), h("smoothly-input-radio", { key: 'e84dd8ad3145a438fb640bfcd168991450021c64', name: "dog.favoritePizza" }, h("span", { key: '18907f9eac1bafbabcde910add33cf33d5b23a2c', slot: "label" }, "Dog's Favorite Pizza"), ["vesuvio", "capricciosa", "quattro formaggi"].map((value, index) => (h("smoothly-input-radio-item", { value: value, key: index }, value)))), h("smoothly-input-checkbox", { key: '53ae41ef70927bb4ec0f9ee52f6d702606d9f367', name: "dog.hasPet" }, "Has Pet")), h("smoothly-tab", { key: 'ecda137898640fb248b79cceff42f25c5f854160', label: "Cat", open: true }, h("smoothly-input", { key: '897f0578ab304103685a1adabc231cd14d15312a', name: "cat.favoriteFood" }, "Favorite Food"))), h("smoothly-input-submit", { key: '4e99398ce10eb1629fb24d5552e050a543614e45', size: "icon", slot: "submit", color: "success", fill: "solid" })), h("smoothly-display", { key: 'a9f5819004771a10f89f1d1cdc63fe2be8ab3777', type: "json", value: this.value })));
+            } }, "Has Owner"), this.hasOwner && (h(Fragment, { key: 'fc45ad128e8f79b37745c32f67d1ba7e8b1c4fbf' }, h("smoothly-input", { key: '86d389e5e7b0d28d0df399400085729f6471716c', type: "text", name: "owner.firstName", value: this.owner.firstName, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { firstName: e.detail["owner.firstName"] })) }, "Owner First Name"), h("smoothly-input", { key: 'cd62d7fb931c4400103fcc9d9a053a05fa85e487', type: "text", name: "owner.lastName", value: this.owner.lastName, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { lastName: e.detail["owner.lastName"] })) }, "Owner Last Name"), h("smoothly-input-file", { key: 'a2896030432f228ad920cdeb4ba5858622ec80c5', name: "owner.picture" }, h("span", { key: '24617088152871d9ccdaec6090a8f373d91f23bd', slot: "label" }, "Owner picture")), h("smoothly-input-date", { key: '0401cc3c3323b07f71276a072319a30325200c3a', name: "owner.birthday", value: this.owner.birthday, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { birthday: e.detail["owner.birthday"] })) }, "Owner birthday"), h("smoothly-input-date-range", { key: '157925e70ec5003e368a04d598974017ed09ebb4', name: "owner.ownedRange", start: (_a = this.owner.ownedRange) === null || _a === void 0 ? void 0 : _a.start, end: (_b = this.owner.ownedRange) === null || _b === void 0 ? void 0 : _b.end, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { ownedRange: e.detail["owner.ownedRange"] })) }, "Owner ownedRange"), h("smoothly-input-range", { key: 'ddb0c2ce68a4217fc9888bd5cfd1ba23f86070c7', name: "owner.height", step: 1, max: 250, value: this.owner.height, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { height: e.detail["owner.height"] })) }, "Owner's Height"), h("smoothly-input-select", { key: 'c8c5da0249521e8531c89a7b8b3ac763d87efb41', name: "owner.favoriteHat" }, h("span", { key: 'a80454815d98de8211d0811be4f4e010eb5fea1d', slot: "label" }, "Owner's Favorite Hat"), ["🎩 top hat", "🧢 cap", "👒 sun hat", "❌ none"].map((value, index) => (h("smoothly-item", { value: value, key: index, selected: this.owner.favoriteHat == value }, value)))), h("smoothly-input-color", { key: 'e89472883061c53b0f8eb697ee7780fddd438426', name: "owner.favoriteColor", value: this.owner.favoriteColor ? RGB.toHex(this.owner.favoriteColor) : undefined, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { favoriteColor: e.detail["owner.favoriteColor"] })) }, "Owner's Favorite Color"), h("smoothly-input-radio", { key: '50c7b642ea08b27fd6f2a29d1cd1985b13f14789', name: "owner.favoritePizza", value: this.owner.favoritePizza, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { favoritePizza: e.detail["owner.favoritePizza"] })) }, h("span", { key: 'baa6df6905dd70e4572b91ee17d599c75a593c91', slot: "label" }, "Owner's Favorite Pizza"), ["vesuvio", "capricciosa", "quattro formaggi"].map((value, index) => (h("smoothly-input-radio-item", { value: value, key: index }, value)))), h("smoothly-input-checkbox", { key: '5bb00bd662f3c4e537ce4fd107845b8d5abf09fd', name: "owner.hasPet", checked: this.owner.hasPet, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { hasPet: e.detail["owner.hasPet"] })) }, "Has Pet"))), h("smoothly-summary", { key: '4a3fc4cd07aa3873945c3ab974f99d037e3fbbda' }, h("span", { key: '0afdd64ca5682fbffd32bd276ad1754347be7c22', slot: "summary" }, "Summary"), h("div", { key: '495ef4c2d75d1643bc4f60dba3ce24d4b59cbe74', slot: "content" }, h("smoothly-input", { key: 'b62901460412b55658e0ecf9684dcf228c9b8aeb', type: "price", name: "summary.price", currency: "EUR" }, "Summary Price"), h("smoothly-input-file", { key: 'f5bbe653d7d76f849d407ed5412e7fd74738cf67', name: "summary.picture" }, h("span", { key: 'f895d5cd3508e1d0584c4b0f27b55a782f400185', slot: "label" }, "Summary picture")), h("smoothly-input-date", { key: '0954c449c3dde1535e41b5b7ef8c68769c41bc92', name: "summary.birthday" }, "Summary birthday"), h("smoothly-input-date-range", { key: '517776b35be90839508d52ef064ab6f60666ac04', name: "summary.ownedRange" }, "Summary ownedRange"), h("smoothly-input-range", { key: '9177373ede95dd28367e3da1ee1f1f9320f8d3b3', name: "summary.height", label: "Height" }), h("smoothly-input-select", { key: 'b49a7896448c2d40440e5ab6cec301d73d873669', name: "summary.favoriteHat" }, h("span", { key: '50efd70498341500f18cbc37beaaa36fabb8dfa1', slot: "label" }, "Summary's Favorite Hat"), ["🎩 top hat", "🧢 cap", "👒 sun hat", "❌ none"].map((value, index) => (h("smoothly-item", { value: value, key: index }, value)))), h("smoothly-input-month", { key: '3855402ed77dd5d6e8e2e3e5d83928df72846a6e', name: "summary.month" }, h("span", { key: '2a19d1c8ca76b2a9e161c1ddff12574157074994', slot: "month-label" }, "Summary month")), h("smoothly-input-color", { key: '5860b2f19faf59a89dc7ec927580eec8c87cbb4a', name: "summary.color" }, "Summary Color"), h("smoothly-input-radio", { key: 'ed742b746ecd09c0a68b239b020a0d5c98a055a7', name: "summary.favoritePizza" }, h("span", { key: '658d7669cad7375204a0b8da4e811859d79ce8ac', slot: "label" }, "Summary's Favorite Pizza"), ["vesuvio", "capricciosa", "quattro formaggi"].map((value, index) => (h("smoothly-input-radio-item", { value: value, key: index }, value)))), h("smoothly-input-checkbox", { key: '5b6e99bdbf96c73a979dbf896e283e04c7e5914c', name: "summary.hasPet" }, "Has Pet"))), h("smoothly-tabs", { key: '4f491e665758c320d52b1296eb9bb7497697b626' }, h("smoothly-tab", { key: 'a0bf8af72607a286852fc39001708de27bf2e150', label: "Dog" }, h("smoothly-input", { key: 'ad8d73982d3791688cac56360b7924747af0110e', type: "text", name: "dog.breed" }, "Breed"), h("smoothly-input-file", { key: '8e5248bf2108046ca6cbdd8ec0185d2cb9aec86c', name: "dog.picture" }, h("span", { key: 'a4250a2ad68960d8842266cab470a91809c7b245', slot: "label" }, "Dog picture")), h("smoothly-input-date", { key: '106416b67980f12d5c22166e24824835118bccf6', name: "dog.birthday" }, "Dog birthday"), h("smoothly-input-date-range", { key: '2a1b7a1cf995ef931b8780d97f3170f7b854dc17', name: "dog.dateRange" }, "Dog date range"), h("smoothly-input-select", { key: '68446eaab3c5f035c03b408496d2a2f259e2c632', name: "dog.favoriteHat" }, h("span", { key: 'a22bf81ce8b12b752652a7605679c8aee1daf783', slot: "label" }, "Dog's Favorite Hat"), ["🎩 top hat", "🧢 cap", "👒 sun hat", "❌ none"].map((value, index) => (h("smoothly-item", { value: value, key: index }, value)))), h("smoothly-input-color", { key: 'bead816b30d4577c2888420696cca1ab5aa67e66', name: "dog.favoriteColor" }, "Dog's Favorite Color"), h("smoothly-input-radio", { key: '4b92479885ffe3f6457946214192c5301298d421', name: "dog.favoritePizza" }, h("span", { key: '01ee08918c28deac0d27058f2eca7bcf73d7fe1a', slot: "label" }, "Dog's Favorite Pizza"), ["vesuvio", "capricciosa", "quattro formaggi"].map((value, index) => (h("smoothly-input-radio-item", { value: value, key: index }, value)))), h("smoothly-input-checkbox", { key: 'cda0f160b8e813fec7d648a2451b3ba033bfa0c4', name: "dog.hasPet" }, "Has Pet")), h("smoothly-tab", { key: '796d71378bcf2258a379332b2d48569435ad0bf7', label: "Cat", open: true }, h("smoothly-input", { key: '751076dda5a70f296b5bb4304b7b66003134e098', name: "cat.favoriteFood" }, "Favorite Food"))), h("smoothly-input-submit", { key: '5c8b9b8a08e1eff68c8b6420423d61fcdc4fe3c3', size: "icon", slot: "submit", color: "success", fill: "solid" })), h("smoothly-display", { key: '5ce4e16973896ff5e73e0a31697e5f4bb9471465', type: "json", value: this.value })));
     }
     static get is() { return "smoothly-form-demo-pet"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/form/demo/prices/index.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { h, Host } from "@stencil/core";
 export class SmoothlyFormDemoPrices {
     render() {
-        return (h(Host, { key: 'fefcedbfe8f22921bea912762f1f6d8caf6ea3e4' }, h("h2", { key: 'c18e909d513549a9a8cc28b2b1d8982b96703343' }, "Prices"), h("smoothly-form", { key: '1eb8cab4a08f19f246c5cd46362452b416db1573', looks: "line" }, h("smoothly-input", { key: '75439c727baa6c39b500deec470d0a32953fddc7', type: "price", name: "no" }, "No currency"), h("smoothly-input", { key: '11b3a7ab0e4dd1626e7efea03c56ba4c1c5e9c27', type: "price", name: "crowns", currency: "SEK", toInteger: true }, "SEK (toInteger)"), h("smoothly-input", { key: '837b810384d7818df18c2ed9d6d08eb965124627', type: "price", name: "usDollar", currency: "USD" }, "USD"), h("smoothly-input", { key: '6ffb11da5cecbbeeef8b6482cbe3cee39e16b6ef', type: "price", name: "pounds", currency: "GBP" }, "GBP"), h("smoothly-input", { key: '4409191ea5b5b0ded31bffc9408927c36bb1bd3b', type: "price", name: "peso", currency: "UYW" }, "UYW"), h("smoothly-input", { key: '8dc492d719d9e2eabba22c402e0349fc5aa7dc9f', type: "price", name: "iceland", currency: "ISK" }, "ISK"), h("smoothly-input", { key: '2def9348a43704dafc21e3738de05d074f189285', type: "price", name: "Palladium", currency: "XPD" }, "XPD (Palladium)"), h("smoothly-input-reset", { key: 'da33915fca3ae802948b1911462f68a10a82bf4c', slot: "reset", fill: "default", type: "form", color: "warning" }), h("smoothly-input-submit", { key: '17cee57859fab71ce0e86141330c361fa06630d0', slot: "submit" }))));
+        return (h(Host, { key: '9d7de2edf91d84fd944b0787aaae43abf274ac49' }, h("h2", { key: '643d7d413bbe2dfd46e26fe227527e6c089c5cc6' }, "Prices"), h("smoothly-form", { key: '8208d0a84ce3af46be9b9eb93652b3664ee643c8', looks: "line" }, h("smoothly-input", { key: 'e68ccdf92d114eebb5354f58254fc7e934dd8018', type: "price", name: "no" }, "No currency"), h("smoothly-input", { key: 'e4def726dbfe3e26c9292359f684eaad919fbf9c', type: "price", name: "crowns", currency: "SEK", toInteger: true }, "SEK (toInteger)"), h("smoothly-input", { key: 'd8519a00bf2f6f73cad691e7f5b1ef1bc465cadf', type: "price", name: "usDollar", currency: "USD" }, "USD"), h("smoothly-input", { key: 'bcc8cc63fbe4b674327e8216b65ae8861a70b1ca', type: "price", name: "pounds", currency: "GBP" }, "GBP"), h("smoothly-input", { key: '4c25cadee15865ebac7e336685c97f354a16c142', type: "price", name: "peso", currency: "UYW" }, "UYW"), h("smoothly-input", { key: '7928b1a081003be0858728f5bca227e040fecff2', type: "price", name: "iceland", currency: "ISK" }, "ISK"), h("smoothly-input", { key: '4bcd0d6eeb77f290dbeb16a29dded1481ff53bdc', type: "price", name: "Palladium", currency: "XPD" }, "XPD (Palladium)"), h("smoothly-input-reset", { key: '1223ba4cf3d7ab1cb6ab43ec706d54f5561741ea', slot: "reset", fill: "default", type: "form", color: "warning" }), h("smoothly-input-submit", { key: 'a10a2e58fb28cfb12318a0915badf62254658221', slot: "submit" }))));
     }
     static get is() { return "smoothly-form-demo-prices"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/form/demo/schedule/index.js CHANGED Viewed

@@ -14,7 +14,7 @@ var TimeTable;
 })(TimeTable || (TimeTable = {}));
 export class SmoothlyFormDemoPrices {
     render() {
-        return (h(Host, { key: '8676cb9b188b2378d815226827e2f7426f514deb' }, h("h2", { key: 'e11dc90193d5f06378378c07412f7e8a842c6ec1' }, "Schedule"), h("smoothly-form", { key: '5875dcd80af050a71d7434fb2f84f18446436dbf', looks: "line", validator: TimeTable.type }, h("smoothly-input-date", { key: '0551573f423a5022499d7d3a25fe6815e75e8554', name: "schedule.0.date" }, "Date"), h("smoothly-input", { key: '4889b711330406e9902beff8b8cc5a22d018978a', name: "schedule.0.amount", type: "price" }, "Amount"), h("smoothly-input-date", { key: '9c2e767a364b4d29ec745fff9cf6a185403208b3', name: "schedule.1.date" }, "Date"), h("smoothly-input", { key: '279a1c6e7a5aad5525347c609ae74f7295182102', name: "schedule.1.amount", type: "price" }, "Amount"), h("smoothly-input-date", { key: '8a8c4e848347f3eb01c7f987926b1a4439665bff', name: "schedule.2.date" }, "Date"), h("smoothly-input", { key: 'cea7149a54447cc79ea1bfacdebc539323eb4377', name: "schedule.2.amount", type: "price" }, "Amount"), h("smoothly-input-reset", { key: 'fe5f1fddbaa59572935420bb42aaab83106278ad', slot: "reset", fill: "default", type: "form", color: "warning" }), h("smoothly-input-submit", { key: 'f435d61a9cbe0aaf693763d86a3babb93ec9acde', slot: "submit" }))));
+        return (h(Host, { key: '8779c231cfea2a0488329c8384180b2ce6653c77' }, h("h2", { key: '7701101473e77f81f83d217cd9da07ddf3719917' }, "Schedule"), h("smoothly-form", { key: '4bd3b21b816df424c8d24d6ef3aa8481f866faa7', looks: "line", validator: TimeTable.type }, h("smoothly-input-date", { key: '581aeb5c592bb6d136aced229b57b323a4d22157', name: "schedule.0.date" }, "Date"), h("smoothly-input", { key: 'd5d8a372a1c75ba95d309f9bd88421f7515adc98', name: "schedule.0.amount", type: "price" }, "Amount"), h("smoothly-input-date", { key: '433e2853f54b231a2a055707034e6044864b308e', name: "schedule.1.date" }, "Date"), h("smoothly-input", { key: 'fdae625f6319f7ce39dc60ef54f40814aa413b9a', name: "schedule.1.amount", type: "price" }, "Amount"), h("smoothly-input-date", { key: '871ce952af55714bff595bfcc1792f8904489b68', name: "schedule.2.date" }, "Date"), h("smoothly-input", { key: 'ad3fd48a4325c79923b50c5631347d607eed16b5', name: "schedule.2.amount", type: "price" }, "Amount"), h("smoothly-input-reset", { key: '76c80fbd2868d82ccc3620937c50aaade8a6c91d', slot: "reset", fill: "default", type: "form", color: "warning" }), h("smoothly-input-submit", { key: '8d7cd8f3f3a8ee14c3b3210543874522d5bee3d9', slot: "submit" }))));
     }
     static get is() { return "smoothly-form-demo-schedule"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/form/demo/transparent/index.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { h, Host } from "@stencil/core";
 export class SmoothlyFormDemoTransparent {
     render() {
-        return (h(Host, { key: '56bb25aa930390f6f18deef5a7f11cd60743c8c1' }, h("h2", { key: '6b02cc5c2ab9dd9ce512ea709a6e8c318803f806' }, "Transparent"), h("smoothly-form", { key: 'eb5a7a12b66c950c6cfb6b63279d6d3d0fb3c9e9', looks: "transparent", onSmoothlyFormSubmit: e => console.log(e.detail.value) }, h("smoothly-input-file", { key: '7af20181794d27a18c0657525c6feeac396bb830', name: "file" }, h("span", { key: '2ee590e2395504e7ba95985b3c3cbce3f7704df1', slot: "label" }, "File"), h("smoothly-icon", { key: 'c6fb9a872fb7c4486c31b11ce40fd147304fd7e6', slot: "button", name: "folder-open-outline", size: "small" })), h("smoothly-input", { key: '221c41fee6498fd25c075c1025b4c09ca63a88f3', type: "duration", looks: "transparent", placeholder: "h:mm" }, "Input"), h("smoothly-input-date", { key: 'b14c619d972e6233ad58a200fb6bb9d5554cf17f' }, "Date"), h("smoothly-input-date-range", { key: '2a4f0cb951dc7f72e48fa102a5cfc598c6a9a229' }, "Date Range"), h("smoothly-input-select", { key: '411bc52358b29c5216d52950902a5204f420ebd6', name: "transport" }, h("smoothly-item", { key: 'cc29561b22ff405cb5fa0f8d3341d0967ef657f7', value: "plane" }, h("smoothly-icon", { key: '040582665fba3aae4cede769c68963223ee83091', name: "airplane-outline" })), h("smoothly-item", { key: '22657c50d58b142833a6a429273ce3d774e0b5e0', value: "car" }, h("smoothly-icon", { key: 'ccce5f3ffdf89c5a2845857c2c0f0f770f464e96', name: "car-outline" })), h("smoothly-item", { key: '1b10530f7bc4499c821ed533ab6a36cb85f3d7e4', value: "bus", selected: true }, h("smoothly-icon", { key: '23b2876323a8f5d806e5fb668b2639c11b4c2705', name: "bus-outline" }))), h("smoothly-input-submit", { key: '15f781edd28f7dfe12c8557866afd2475ee9e4ba', icon: "checkbox-outline" }))));
+        return (h(Host, { key: '53a31c785dc06bb1865af601f2272eea264bcf45' }, h("h2", { key: 'c5f0b6d091ac14b6c536ac86408101b965835a65' }, "Transparent"), h("smoothly-form", { key: 'f5ea31b4f975357c68d26736154b7a5c50674bb8', looks: "transparent", onSmoothlyFormSubmit: e => console.log(e.detail.value) }, h("smoothly-input-file", { key: '1ba3016a6b22095e36a12045acfb6a7122b326b0', name: "file" }, h("span", { key: 'ca7092555b9cae88390cbb594d46b91b97b46aa3', slot: "label" }, "File"), h("smoothly-icon", { key: 'c2b4022eb8dc04cc244d70e7fa9fb493cfd06fa3', slot: "button", name: "folder-open-outline", size: "small" })), h("smoothly-input", { key: 'a0e13fe8040012c94419c63cc49623a621843451', type: "duration", looks: "transparent", placeholder: "h:mm" }, "Input"), h("smoothly-input-date", { key: '0f6e14d465889d70de386972c19de0beee90517e' }, "Date"), h("smoothly-input-date-range", { key: 'f399d3172c129018ba86e217f8e2cb2534165340' }, "Date Range"), h("smoothly-input-select", { key: '85c77b434a7296389e6050257053f9d31e564cee', name: "transport" }, h("smoothly-item", { key: 'f0c1dcf75073173bd2be1171d2a783ec6ed0d22c', value: "plane" }, h("smoothly-icon", { key: 'f666fd4254963626e7cde15a41c33b5b7aa0cce4', name: "airplane-outline" })), h("smoothly-item", { key: 'e9ab4adb7f56fdd26faf7fe8f315a73066743e94', value: "car" }, h("smoothly-icon", { key: '01e19307755adb4a0d31fcdc6356a3c549315e5d', name: "car-outline" })), h("smoothly-item", { key: 'f624fbb5cd65bfd15117899389571d922df254b1', value: "bus", selected: true }, h("smoothly-icon", { key: 'c400375975272b95de64403e81f35d62247819c3', name: "bus-outline" }))), h("smoothly-input-submit", { key: '83ecdfad32bb44f5aee22bd9ed7fa08adbec348c', icon: "checkbox-outline" }))));
     }
     static get is() { return "smoothly-form-demo-transparent"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/form/demo/typed/index.js CHANGED Viewed

@@ -3,7 +3,7 @@ import { isoly } from "isoly";
 import { Contact } from "./Contact";
 export class SmoothlyFormDemoTyped {
     render() {
-        return (h(Host, { key: '589d8de4c0b6b7e857a7a4ddbbbbc9a2e860d502' }, h("h2", { key: 'd402f921eaccf3321e04df59c96e9d32aec67582' }, "Typed Contact"), h("smoothly-form", { key: 'fd0c811ba55c3aab606a8ac8575e5d36968b556a', validator: Contact.type }, h("smoothly-input", { key: '86f4b7aec26301e5b74e65c36d7a10d29e32f441', name: "name.first" }, "First Name"), h("smoothly-input", { key: '61ffe1927a42f0f7a7ae49e158485c99dc8581bc', name: "name.middle" }, "Middle Name (optional)"), h("smoothly-input", { key: 'dc5620803aeecca0a640ff675b970f6faa98b8ab', name: "name.last" }, "Last Name"), h("smoothly-input", { key: '1dea7fc4ba31c47ad39bcb57238b360a7df0f74d', name: "age", type: "integer" }, "Age (18-120)"), h("smoothly-input-select", { key: '83f5df5e7d8d96600a9eb6b38762d25c5c5098ae', name: "country" }, h("span", { key: '00666ef0610990ac0cf1e11635db1b7beffaeb59', slot: "label" }, "Country"), isoly.CountryCode.Alpha2.values.map(country => (h("smoothly-item", { value: country }, isoly.CountryCode.Name.en.from(country))))), h("smoothly-input-date", { key: '3e95f926e1a84109cae654429f747a979972c372', name: "birthday" }, "Date of birth"), h("smoothly-input-reset", { key: 'b4c35bb7106d310df2ad78e6eee3c89e393730d1', slot: "reset", type: "form", size: "icon", color: "warning" }), h("smoothly-input-submit", { key: 'c9fdb24ebc4f4ec46bae6b097259dad7b1487ff7', slot: "submit", size: "icon", color: "success" }))));
+        return (h(Host, { key: '7436ace22d5c15d63af957d69be005e2112052de' }, h("h2", { key: '08458d0241d08780ec24a72a127e8c0cc93f3aa1' }, "Typed Contact"), h("smoothly-form", { key: '16232cad107da9e5f472e960dca4f4a0b953b7bd', validator: Contact.type }, h("smoothly-input", { key: 'd7561d6eab24a5a0f1bc29c970d32f5eb72fba80', name: "name.first" }, "First Name"), h("smoothly-input", { key: 'cf44c5b7b47bcb8d3adcb82b8ea1d06e64b15f8d', name: "name.middle" }, "Middle Name (optional)"), h("smoothly-input", { key: 'b6d253c5b17c453b4bc73dc4c90efefc7d63edce', name: "name.last" }, "Last Name"), h("smoothly-input", { key: '0165cecb177e1c269c2a0db4e926306271d8a6be', name: "age", type: "integer" }, "Age (18-120)"), h("smoothly-input-select", { key: '3f30a15dbe4de0a5b0584cb8cf2dc48f6b9de077', name: "country" }, h("span", { key: '375090b3654e3351a1fffa1a85d3444c3374d82c', slot: "label" }, "Country"), isoly.CountryCode.Alpha2.values.map(country => (h("smoothly-item", { value: country }, isoly.CountryCode.Name.en.from(country))))), h("smoothly-input-date", { key: '8127e66c92cbec9e91019cd7fd3a5f82d7923bc5', name: "birthday" }, "Date of birth"), h("smoothly-input-reset", { key: '2c305f958cb25930100f182475d79fbeb69552f3', slot: "reset", type: "form", size: "icon", color: "warning" }), h("smoothly-input-submit", { key: '83e6fb1099c61c68bcdac8465d51b0cb91fb1722', slot: "submit", size: "icon", color: "success" }))));
     }
     static get is() { return "smoothly-form-demo-typed"; }
     static get encapsulation() { return "scoped"; }