smoothly 1.0.0-alpha.21 → 1.0.0-alpha.211

package/dist/collection/components/display-demo/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/display-demo/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Event, EventEmitter, h } from \"@stencil/core\"\nimport { Notice } from \"../../model\"\n@Component({\n\ttag: \"smoothly-display-demo\",\n})\nexport class SmoothlyDisplayDemo {\n\t@Event() notice: EventEmitter<Notice>\n\tprivate noticeWarning(notice: Notice) {\n\t\tconsole.log(\"emit\", notice)\n\t\tthis.notice.emit(notice)\n\t}\n\trender() {\n\t\treturn [\n\t\t\t<main>\n\t\t\t\t<fieldset>\n\t\t\t\t\t<h2>Smoothly display</h2>\n\t\t\t\t\t<smoothly-display-date-time datetime=\"2019-08-15T08:08:17.65Z\"></smoothly-display-date-time>\n\t\t\t\t\t<dl>\n\t\t\t\t\t\t<dt>text</dt>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display type=\"text\" value=\"text\"></smoothly-display>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dt>postal code</dt>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display type=\"postal-code\" value=\"752 31\"></smoothly-display>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dt>password</dt>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display type=\"password\" value=\"password\"></smoothly-display>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dt>email</dt>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display type=\"email\" value=\"test@example.com\"></smoothly-display>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dt>price</dt>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display type=\"price\" value=\"13.37\" currency=\"SEK\"></smoothly-display>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dt>display amount without decimals</dt>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display-amount amount={200} currency=\"SEK\" toInteger={true}></smoothly-display-amount>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dt>display amount with decimals if they are set, otherwise no decimal</dt>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display-amount amount={200.20} currency=\"SEK\" toInteger={true}></smoothly-display-amount>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dt>display amount with decimals</dt>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display-amount amount={200.20} currency=\"SEK\"></smoothly-display-amount>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dt>percent</dt>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display type=\"percent\" value=\"42\"></smoothly-display>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dt>phone</dt>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display type=\"phone\" value=\"0101881108\"></smoothly-display>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dt>card number</dt>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display type=\"card-number\" value=\"4111111111111111\"></smoothly-display>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dt>card expires</dt>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display type=\"card-expires\" value=\"7/22\"></smoothly-display>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dt>card csc</dt>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display type=\"card-csc\" value=\"987\"></smoothly-display>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dt>date</dt>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display type=\"date\" value=\"2022-07-07\"></smoothly-display>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dt>date time</dt>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display type=\"date-time\" format={{year: \"numeric\", month: \"short\", day: \"numeric\", hour: \"numeric\", minute: \"numeric\", second: \"numeric\"}} value=\"2022-07-07T02:02:02Z\"></smoothly-display>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display 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\"></smoothly-display>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display type=\"date-time\" format={{year: \"numeric\", month: \"2-digit\", day: \"2-digit\", hour: \"numeric\", minute: \"numeric\", second: \"numeric\"}} value=\"2022-07-07T12:22:24Z\"></smoothly-display>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display type=\"date-time\" format={{year: \"numeric\", month: \"numeric\", day: \"numeric\", hour: \"numeric\", minute: \"numeric\", second: \"numeric\"}} value=\"2022-07-07T12:22:24Z\"></smoothly-display>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display type=\"date-time\" format={{year: \"numeric\", month: \"short\", day: \"numeric\"}} value=\"2022-07-07T00:00+02:00\"></smoothly-display>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display type=\"date-time\" format={{year: \"2-digit\", month: \"numeric\", day: \"numeric\"}} value=\"2022-07-07T00:00+02:00\"></smoothly-display>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display type=\"date-time\" format={{year: \"2-digit\", month: \"numeric\", day: \"numeric\", hour: \"2-digit\", minute: \"2-digit\", second: \"2-digit\", timeZone:\"+01:00\"}} value=\"2022-07-07T12:15Z\"></smoothly-display>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dt>Deprecated display date time</dt>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display-date-time datetime=\"2019-01-31T20:01:34\"></smoothly-display-date-time>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dt>Display amount</dt>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display-amount currency=\"SEK\" amount=\"1289.5\"></smoothly-display-amount>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dt>Quiet</dt>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-quiet color=\"dark\">-</smoothly-quiet>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t</dl>\n\t\t\t\t</fieldset>\n\t\t\t\t<fieldset>\n\t\t\t\t\t<h2>Smoothly skeleton</h2>\n\t\t\t\t\t<smoothly-skeleton period={3} distance=\"20rem\" width=\"20rem\"></smoothly-skeleton>\n\t\t\t\t\t<smoothly-skeleton period={3} distance=\"20rem\" color=\"200,200,255\"></smoothly-skeleton>\n\t\t\t\t\t<smoothly-skeleton period={3} distance=\"20rem\" color=\"var(--smoothly-warning-color)\"></smoothly-skeleton>\n\t\t\t\t\t<smoothly-skeleton period={3} distance=\"20rem\" ></smoothly-skeleton>\n\t\t\t\t\t<smoothly-skeleton align=\"center\" period={3} distance=\"20rem\" width=\"20rem\"></smoothly-skeleton>\n\t\t\t\t\t<smoothly-skeleton align=\"center\" period={3} distance=\"20rem\" ></smoothly-skeleton>\n\t\t\t\t\t<smoothly-skeleton align=\"center\" period={3} distance=\"20rem\" ></smoothly-skeleton>\n\t\t\t\t\t<smoothly-skeleton align=\"center\" period={3} distance=\"20rem\" ></smoothly-skeleton>\n\t\t\t\t\t<smoothly-skeleton align=\"right\" period={3} distance=\"20rem\" width=\"20rem\"></smoothly-skeleton>\n\t\t\t\t\t<smoothly-skeleton align=\"right\" period={3} distance=\"20rem\" ></smoothly-skeleton>\n\t\t\t\t\t<smoothly-skeleton align=\"right\" period={3} distance=\"20rem\" ></smoothly-skeleton>\n\t\t\t\t\t<smoothly-skeleton align=\"right\" period={3} distance=\"20rem\" ></smoothly-skeleton>\n\t\t\t\t</fieldset>\n\t\t\t\t<fieldset>\n\t\t\t\t\t<h2>Smoothly URL encoded</h2>\n\t\t\t\t\t<smoothly-urlencoded data=\"hej=hopp&tjena=moss\"></smoothly-urlencoded>\n\t\t\t\t</fieldset>\n\t\t\t\t<fieldset>\n\t\t\t\t\t<h2>Smoothly popup</h2>\n\t\t\t\t\t<div style={{display: \"flex\", justifyContent: \"space-between\"}}>\n\t\t\t\t\t\t<smoothly-popup direction=\"down\">\n\t\t\t\t\t\t\tClick for popup\n\t\t\t\t\t\t\t<span slot=\"popup\" color=\"dark\" style={{whiteSpace: \"nowrap\"}}>Some popup stuff that has a lot of text</span>\n\t\t\t\t\t\t</smoothly-popup>\n\t\t\t\t\t\t<smoothly-popup direction=\"down\">\n\t\t\t\t\t\t\tClick for popup\n\t\t\t\t\t\t\t<span slot=\"popup\" color=\"dark\" style={{whiteSpace: \"nowrap\"}}>Some popup with a bunch of text.</span>\n\t\t\t\t\t\t</smoothly-popup>\n\t\t\t\t\t</div>\n\t\t\t\t\t<smoothly-popup>\n\t\t\t\t\t\t<div>Popup, click me</div>\n\t\t\t\t\t\t<div color=\"dark\" slot=\"popup\">\n\t\t\t\t\t\t\t1 line popup\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</smoothly-popup>\n\t\t\t\t</fieldset>\n\t\t\t\t<fieldset>\n\t\t\t\t<h2>Test of different kinds of notifier</h2>\n\t\t\t\t\t<button onClick={() => this.noticeWarning(Notice.warn(\"This is a test warning notice.\"))}>warning</button>\n\t\t\t\t\t<button onClick={() => this.noticeWarning(Notice.succeded(\"This is a test success notice.\"))}>success</button>\n\t\t\t\t\t<button onClick={() => this.noticeWarning(Notice.failed(\"This is a test danger notice.\"))}>danger</button>\n\t\t\t\t\t<button\n\t\t\t\t\t\tonClick={() =>\n\t\t\t\t\t\t\tthis.noticeWarning(\n\t\t\t\t\t\t\t\tNotice.execute(\n\t\t\t\t\t\t\t\t\t\"This is a test execute notice.\",\n\t\t\t\t\t\t\t\t\t() =>\n\t\t\t\t\t\t\t\t\t\tnew Promise<[boolean, string]>(resolve =>\n\t\t\t\t\t\t\t\t\t\t\twindow.setTimeout(() => resolve([true, \"This went great\"]), 3000)\n\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t}>\n\t\t\t\t\t\texecute\n\t\t\t\t\t</button>\n\t\t\t\t\t<button\n\t\t\t\t\t\tonClick={() =>\n\t\t\t\t\t\t\tthis.noticeWarning(\n\t\t\t\t\t\t\t\tNotice.delay(\n\t\t\t\t\t\t\t\t\t\"This is a test delay notice.\",\n\t\t\t\t\t\t\t\t\t() =>\n\t\t\t\t\t\t\t\t\t\tnew Promise<[boolean, string]>(resolve =>\n\t\t\t\t\t\t\t\t\t\t\twindow.setTimeout(() => resolve([true, \"This went great\"]), 3000)\n\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t}>\n\t\t\t\t\t\tdelay\n\t\t\t\t\t</button>\n\t\t\t\t</fieldset>\n\t\t\t\t<fieldset>\n\t\t\t\t\t<h2>Smoothly spinner</h2>\n\t\t\t\t\t<div style={{position: \"relative\", height: \"10em\"}}>Large Spinner<smoothly-spinner active size=\"large\" style={{\"--background-color\": \"255,255,255\", \"--background-opacity\": \"0.2\", \"--spinner-color\": \"0,130,0\", }}></smoothly-spinner></div>\n\t\t\t\t\t<div style={{position: \"relative\", height: \"10em\"}}>Medium Spinner<smoothly-spinner active size=\"medium\"></smoothly-spinner></div>\n\t\t\t\t\t<div style={{position: \"relative\", height: \"10em\"}}>Small Spinner<smoothly-spinner active size=\"small\"></smoothly-spinner></div>\n\t\t\t\t\t<div style={{position: \"absolute\", left: \"500px\", top: \"150px\" }}><smoothly-svg url=\"https://theme.payfunc.com/intergiro/animated-logo.svg\"></smoothly-svg></div>\n\t\t\t\t</fieldset>\n\t\t\t\t<fieldset>\n\t\t\t\t\t<h2>Smoothly summary</h2>\n\t\t\t\t\t<smoothly-summary color=\"light\" fill=\"clear\" size=\"large\">\n\t\t\t\t\t\t<p slot=\"summary\">Some title</p>\n\t\t\t\t\t\t<p slot=\"content\">Some content</p>\n\t\t\t\t\t</smoothly-summary>\n\t\t\t\t\t<smoothly-summary color=\"light\" fill=\"clear\" size=\"large\">\n\t\t\t\t\t\t<p slot=\"summary\">Some title</p>\n\t\t\t\t\t\t<p slot=\"content\">Some content</p>\n\t\t\t\t\t</smoothly-summary>\n\t\t\t\t\t<smoothly-summary color=\"danger\" fill=\"clear\">\n\t\t\t\t\t\t<div slot=\"summary\" style={{display: \"flex\", gap: \"0.3rem\"}}><span>Person</span><smoothly-icon name=\"person\" color=\"light\" fill=\"clear\" size=\"tiny\"></smoothly-icon></div>\n\t\t\t\t\t\t<p slot=\"content\">Some person information.</p>\n\t\t\t\t\t</smoothly-summary>\n\t\t\t\t\t<smoothly-summary color=\"danger\" fill=\"clear\">\n\t\t\t\t\t\t<p slot=\"summary\">Some other title</p>\n\t\t\t\t\t\t<p 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.</p>\n\t\t\t\t\t</smoothly-summary>\n\t\t\t\t</fieldset>\n\t\t\t</main>,\n\t\t]\n\t}\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/display-demo/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Event, EventEmitter, h } from \"@stencil/core\"\nimport { Notice } from \"../../model\"\n@Component({\n\ttag: \"smoothly-display-demo\",\n})\nexport class SmoothlyDisplayDemo {\n\t@Event() notice: EventEmitter<Notice>\n\tprivate noticeWarning(notice: Notice) {\n\t\tconsole.log(\"emit\", notice)\n\t\tthis.notice.emit(notice)\n\t}\n\trender() {\n\t\treturn [\n\t\t\t<main>\n\t\t\t\t<fieldset>\n\t\t\t\t\t<h2>Smoothly display</h2>\n\t\t\t\t\t<dl>\n\t\t\t\t\t\t<dt>Duration</dt>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t\t<smoothly-display type=\"duration\" value={{ hours: 13, minutes: 100 }} />\n\t\t\t\t\t\t\t\t<smoothly-display type=\"duration\" value={{ hours: 8 }} />\n\t\t\t\t\t\t\t\t<smoothly-display type=\"duration\" value={{ minutes: 3 }} />\n\t\t\t\t\t\t\t\t<smoothly-display type=\"duration\" value={{ hours: -13, minutes: 100 }} />\n\t\t\t\t\t\t\t\t<smoothly-display type=\"duration\" value={{ hours: -8 }} />\n\t\t\t\t\t\t\t\t<smoothly-display type=\"duration\" value={{ minutes: -3 }} />\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dt>text</dt>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display type=\"text\" value=\"text\"></smoothly-display>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dt>postal code</dt>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display type=\"postal-code\" value=\"752 31\"></smoothly-display>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dt>password</dt>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display type=\"password\" value=\"password\"></smoothly-display>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dt>email</dt>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display type=\"email\" value=\"test@example.com\"></smoothly-display>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dt>price</dt>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display type=\"price\" value=\"13.37\" currency=\"SEK\"></smoothly-display>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dt>display amount without decimals</dt>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display-amount amount={200} currency=\"SEK\" toInteger={true}></smoothly-display-amount>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dt>display amount with decimals if they are set, otherwise no decimal</dt>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display-amount amount={200.20} currency=\"SEK\" toInteger={true}></smoothly-display-amount>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dt>display amount with decimals</dt>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display-amount amount={200.20} currency=\"SEK\"></smoothly-display-amount>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dt>percent</dt>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display type=\"percent\" value=\"42\"></smoothly-display>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dt>phone</dt>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display type=\"phone\" value=\"0101881108\"></smoothly-display>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dt>card number</dt>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display type=\"card-number\" value=\"4111111111111111\"></smoothly-display>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dt>card expires</dt>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display type=\"card-expires\" value=\"7/22\"></smoothly-display>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dt>card csc</dt>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display type=\"card-csc\" value=\"987\"></smoothly-display>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dt>date</dt>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display type=\"date\" value=\"2022-07-07\"></smoothly-display>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dt>date time</dt>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display type=\"date-time\" format={{year: \"numeric\", month: \"short\", day: \"numeric\", hour: \"numeric\", minute: \"numeric\", second: \"numeric\"}} value=\"2022-07-07T02:02:02Z\"></smoothly-display>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display 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\"></smoothly-display>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display type=\"date-time\" format={{year: \"numeric\", month: \"2-digit\", day: \"2-digit\", hour: \"numeric\", minute: \"numeric\", second: \"numeric\"}} value=\"2022-07-07T12:22:24Z\"></smoothly-display>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display type=\"date-time\" format={{year: \"numeric\", month: \"numeric\", day: \"numeric\", hour: \"numeric\", minute: \"numeric\", second: \"numeric\"}} value=\"2022-07-07T12:22:24Z\"></smoothly-display>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display type=\"date-time\" format={{year: \"numeric\", month: \"short\", day: \"numeric\"}} value=\"2022-07-07T00:00+02:00\"></smoothly-display>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display type=\"date-time\" format={{year: \"2-digit\", month: \"numeric\", day: \"numeric\"}} value=\"2022-07-07T00:00+02:00\"></smoothly-display>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display type=\"date-time\" format={{year: \"2-digit\", month: \"numeric\", day: \"numeric\", hour: \"2-digit\", minute: \"2-digit\", second: \"2-digit\", timeZone:\"Europe/Stockholm\"}} value=\"2022-07-07T12:15Z\"></smoothly-display>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dt>Deprecated display date time</dt>\n\t\t\t\t\t\t<dt>Display amount</dt>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-display-amount currency=\"SEK\" amount=\"1289.5\"></smoothly-display-amount>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t\t<dt>Quiet</dt>\n\t\t\t\t\t\t<dd>\n\t\t\t\t\t\t\t<smoothly-quiet color=\"dark\">-</smoothly-quiet>\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t</dl>\n\t\t\t\t</fieldset>\n\t\t\t\t<fieldset>\n\t\t\t\t\t<h2>Smoothly skeleton</h2>\n\t\t\t\t\t<smoothly-skeleton period={3} distance=\"20rem\" width=\"20rem\"></smoothly-skeleton>\n\t\t\t\t\t<smoothly-skeleton period={3} distance=\"20rem\" color=\"200,200,255\"></smoothly-skeleton>\n\t\t\t\t\t<smoothly-skeleton period={3} distance=\"20rem\" color=\"var(--smoothly-warning-color)\"></smoothly-skeleton>\n\t\t\t\t\t<smoothly-skeleton period={3} distance=\"20rem\" ></smoothly-skeleton>\n\t\t\t\t\t<smoothly-skeleton align=\"center\" period={3} distance=\"20rem\" width=\"20rem\"></smoothly-skeleton>\n\t\t\t\t\t<smoothly-skeleton align=\"center\" period={3} distance=\"20rem\" ></smoothly-skeleton>\n\t\t\t\t\t<smoothly-skeleton align=\"center\" period={3} distance=\"20rem\" ></smoothly-skeleton>\n\t\t\t\t\t<smoothly-skeleton align=\"center\" period={3} distance=\"20rem\" ></smoothly-skeleton>\n\t\t\t\t\t<smoothly-skeleton align=\"right\" period={3} distance=\"20rem\" width=\"20rem\"></smoothly-skeleton>\n\t\t\t\t\t<smoothly-skeleton align=\"right\" period={3} distance=\"20rem\" ></smoothly-skeleton>\n\t\t\t\t\t<smoothly-skeleton align=\"right\" period={3} distance=\"20rem\" ></smoothly-skeleton>\n\t\t\t\t\t<smoothly-skeleton align=\"right\" period={3} distance=\"20rem\" ></smoothly-skeleton>\n\t\t\t\t</fieldset>\n\t\t\t\t<fieldset>\n\t\t\t\t\t<h2>Smoothly URL encoded</h2>\n\t\t\t\t\t<smoothly-urlencoded data=\"hej=hopp&tjena=moss\"></smoothly-urlencoded>\n\t\t\t\t</fieldset>\n\t\t\t\t<fieldset>\n\t\t\t\t\t<h2>Smoothly popup</h2>\n\t\t\t\t\t<div style={{display: \"flex\", justifyContent: \"space-between\"}}>\n\t\t\t\t\t\t<smoothly-popup direction=\"down\">\n\t\t\t\t\t\t\tClick for popup\n\t\t\t\t\t\t\t<span slot=\"popup\" color=\"dark\" style={{whiteSpace: \"nowrap\"}}>Some popup stuff that has a lot of text</span>\n\t\t\t\t\t\t</smoothly-popup>\n\t\t\t\t\t\t<smoothly-popup direction=\"down\">\n\t\t\t\t\t\t\tClick for popup\n\t\t\t\t\t\t\t<span slot=\"popup\" color=\"dark\" style={{whiteSpace: \"nowrap\"}}>Some popup with a bunch of text.</span>\n\t\t\t\t\t\t</smoothly-popup>\n\t\t\t\t\t</div>\n\t\t\t\t\t<smoothly-popup>\n\t\t\t\t\t\t<div>Popup, click me</div>\n\t\t\t\t\t\t<div color=\"dark\" slot=\"popup\">\n\t\t\t\t\t\t\t1 line popup\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</smoothly-popup>\n\t\t\t\t</fieldset>\n\t\t\t\t<fieldset>\n\t\t\t\t<h2>Test of different kinds of notifier</h2>\n\t\t\t\t\t<button onClick={() => this.noticeWarning(Notice.warn(\"This is a test warning notice.\"))}>warning</button>\n\t\t\t\t\t<button onClick={() => this.noticeWarning(Notice.succeeded(\"This is a test success notice.\"))}>success</button>\n\t\t\t\t\t<button onClick={() => this.noticeWarning(Notice.failed(\"This is a test danger notice.\"))}>danger</button>\n\t\t\t\t\t<button\n\t\t\t\t\t\tonClick={() =>\n\t\t\t\t\t\t\tthis.noticeWarning(\n\t\t\t\t\t\t\t\tNotice.execute(\n\t\t\t\t\t\t\t\t\t\"This is a test execute notice.\",\n\t\t\t\t\t\t\t\t\t() =>\n\t\t\t\t\t\t\t\t\t\tnew Promise<[boolean, string]>(resolve =>\n\t\t\t\t\t\t\t\t\t\t\twindow.setTimeout(() => resolve([true, \"This went great\"]), 3000)\n\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t}>\n\t\t\t\t\t\texecute\n\t\t\t\t\t</button>\n\t\t\t\t\t<button\n\t\t\t\t\t\tonClick={() =>\n\t\t\t\t\t\t\tthis.noticeWarning(\n\t\t\t\t\t\t\t\tNotice.delay(\n\t\t\t\t\t\t\t\t\t\"This is a test delay notice.\",\n\t\t\t\t\t\t\t\t\t() =>\n\t\t\t\t\t\t\t\t\t\tnew Promise<[boolean, string]>(resolve =>\n\t\t\t\t\t\t\t\t\t\t\twindow.setTimeout(() => resolve([true, \"This went great\"]), 3000)\n\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t}>\n\t\t\t\t\t\tdelay\n\t\t\t\t\t</button>\n\t\t\t\t</fieldset>\n\t\t\t\t<fieldset>\n\t\t\t\t\t<h2>Smoothly spinner</h2>\n\t\t\t\t\t<div style={{position: \"relative\", height: \"10em\"}}>Large Spinner<smoothly-spinner active size=\"large\" style={{\"--background-color\": \"255,255,255\", \"--background-opacity\": \"0.2\", \"--spinner-color\": \"0,130,0\", }}></smoothly-spinner></div>\n\t\t\t\t\t<div style={{position: \"relative\", height: \"10em\"}}>Medium Spinner<smoothly-spinner active size=\"medium\"></smoothly-spinner></div>\n\t\t\t\t\t<div style={{position: \"relative\", height: \"10em\"}}>Small Spinner<smoothly-spinner active size=\"small\"></smoothly-spinner></div>\n\t\t\t\t\t<div style={{position: \"absolute\", left: \"500px\", top: \"150px\" }}><smoothly-svg url=\"https://theme.payfunc.com/intergiro/animated-logo.svg\"></smoothly-svg></div>\n\t\t\t\t</fieldset>\n\t\t\t\t<fieldset>\n\t\t\t\t\t<h2>Smoothly summary</h2>\n\t\t\t\t\t<smoothly-summary>\n\t\t\t\t\t\t<p slot=\"summary\">Some title</p>\n\t\t\t\t\t\t<p slot=\"content\">Some content</p>\n\t\t\t\t\t</smoothly-summary>\n\t\t\t\t\t<smoothly-summary size=\"large\">\n\t\t\t\t\t\t<p slot=\"summary\">Some title</p>\n\t\t\t\t\t\t<p slot=\"content\">Some content</p>\n\t\t\t\t\t</smoothly-summary>\n\t\t\t\t\t<smoothly-summary color=\"danger\" fill=\"clear\">\n\t\t\t\t\t\t<div slot=\"summary\" style={{display: \"flex\", gap: \"0.3rem\"}}><span>Person</span><smoothly-icon name=\"person\" color=\"light\" fill=\"clear\" size=\"tiny\"></smoothly-icon></div>\n\t\t\t\t\t\t<p slot=\"content\">Some person information.</p>\n\t\t\t\t\t</smoothly-summary>\n\t\t\t\t\t<smoothly-summary color=\"danger\" fill=\"clear\" open>\n\t\t\t\t\t\t<p slot=\"summary\">Some other title</p>\n\t\t\t\t\t\t<p 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.</p>\n\t\t\t\t\t</smoothly-summary>\n\t\t\t\t\t<h2>Label</h2>\n\t\t\t\t\t{labels.map(l => <smoothly-label hue={l.hue} description={l.description} shape={\"rectangle\"}>{l.name}</smoothly-label>)}\n\t\t\t\t</fieldset>\n\t\t\t</main>,\n\t\t]\n\t}\n}\nconst labels = [{\n\tname: \"2fa\",\n\thue: 120,\n\tdescription: \"User has two factor authentication enabled.\",\n},\n{\nname: \"expired\",\nhue: 240,\ndescription: \"User's password has expired.\",\n},\n{\nname: \"inactive\",\nhue: 60,\ndescription: \"User is inactive.\",\n}]\n"]}

package/dist/collection/components/filter/Filter.js

@@ -0,0 +1,17 @@
+import { isly } from "isly";
+const EventEmitter = isly.object({ emit: isly.function() });
+export var Filter;
+(function (Filter) {
+  let Element;
+  (function (Element) {
+    Element.type = isly.object({
+      property: isly.string().optional(),
+      properties: isly.record(isly.string(), isly.string()).optional(),
+    });
+  })(Element = Filter.Element || (Filter.Element = {}));
+  Filter.type = Element.type.extend({
+    smoothlyFilterUpdate: EventEmitter,
+    smoothlyFilterManipulate: EventEmitter,
+  });
+})(Filter || (Filter = {}));
+//# sourceMappingURL=Filter.js.map

package/dist/collection/components/filter/Filter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Filter.js","sourceRoot":"","sources":["../../../src/components/filter/Filter.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,IAAI,EAAE,MAAM,MAAM,CAAA;AAE3B,MAAM,YAAY,GAAG,IAAI,CAAC,MAAM,CAAe,EAAE,IAAI,EAAE,IAAI,CAAC,QAAQ,EAAwB,EAAE,CAAC,CAAA;AAK/F,MAAM,KAAW,MAAM,CAiBtB;AAjBD,WAAiB,MAAM;EAOtB,IAAiB,OAAO,CAKvB;EALD,WAAiB,OAAO;IACV,YAAI,GAAG,IAAI,CAAC,MAAM,CAAU;MACxC,QAAQ,EAAE,IAAI,CAAC,MAAM,EAAE,CAAC,QAAQ,EAAE;MAClC,UAAU,EAAE,IAAI,CAAC,MAAM,CAAyB,IAAI,CAAC,MAAM,EAAE,EAAE,IAAI,CAAC,MAAM,EAAE,CAAC,CAAC,QAAQ,EAAE;KACxF,CAAC,CAAA;EACH,CAAC,EALgB,OAAO,GAAP,cAAO,KAAP,cAAO,QAKvB;EACY,WAAI,GAAG,OAAO,CAAC,IAAI,CAAC,MAAM,CAAS;IAC/C,oBAAoB,EAAE,YAAY;IAClC,wBAAwB,EAAE,YAAY;GACtC,CAAC,CAAA;AACH,CAAC,EAjBgB,MAAM,KAAN,MAAM,QAiBtB","sourcesContent":["import { EventEmitter } from \"@stencil/core\"\nimport { selectively } from \"selectively\"\nimport { isly } from \"isly\"\n\nconst EventEmitter = isly.object<EventEmitter>({ emit: isly.function<EventEmitter[\"emit\"]>() })\nexport interface Filter extends Filter.Element {\n\tsmoothlyFilterUpdate: EventEmitter<Filter.Update>\n\tsmoothlyFilterManipulate: EventEmitter<Filter.Manipulate>\n}\nexport namespace Filter {\n\texport type Manipulate = (criteria: selectively.Criteria) => selectively.Criteria\n\texport type Update = (expression: selectively.Criteria) => void\n\texport interface Element {\n\t\tproperty?: string\n\t\tproperties?: Record<string, string>\n\t}\n\texport namespace Element {\n\t\texport const type = isly.object<Element>({\n\t\t\tproperty: isly.string().optional(),\n\t\t\tproperties: isly.record<Record<string, string>>(isly.string(), isly.string()).optional(),\n\t\t})\n\t}\n\texport const type = Element.type.extend<Filter>({\n\t\tsmoothlyFilterUpdate: EventEmitter,\n\t\tsmoothlyFilterManipulate: EventEmitter,\n\t})\n}\n"]}

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

@@ -0,0 +1,105 @@
+import { h, Host } from "@stencil/core";
+import { selectively } from "selectively";
+export class SmoothlyFilterField {
+  constructor() {
+    this.criteria = undefined;
+  }
+  async clear() {
+    var _a;
+    await ((_a = this.input) === null || _a === void 0 ? void 0 : _a.clear());
+  }
+  filterFieldEmit() {
+    var _a;
+    this.smoothlyFilterField.emit(selectively.parse((_a = this.input) === null || _a === void 0 ? void 0 : _a.value));
+  }
+  render() {
+    return (h(Host, { onKeyDown: (e) => e.key == "Enter" && this.filterFieldEmit() }, h("smoothly-input", { name: "filter", ref: e => (this.input = e), value: this.criteria.toString(), onSmoothlyInputLooks: e => e.stopPropagation(), onSmoothlyBlur: e => {
+        e.stopPropagation();
+        this.filterFieldEmit();
+      }, onSmoothlyFormDisable: e => e.stopPropagation(), onSmoothlyInputLoad: e => e.stopPropagation(), onSmoothlyChange: e => e.stopPropagation(), onSmoothlyInput: e => {
+        e.stopPropagation();
+      } }, "Filter")));
+  }
+  static get is() { return "smoothly-filter-field"; }
+  static get encapsulation() { return "scoped"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["style.css"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["style.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "criteria": {
+        "type": "any",
+        "mutable": false,
+        "complexType": {
+          "original": "selectively.Criteria",
+          "resolved": "Helper[] | Rule | number | string | { [property: string]: Helper | Helper[]; }",
+          "references": {
+            "selectively": {
+              "location": "import",
+              "path": "selectively"
+            }
+          }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "criteria",
+        "reflect": false
+      }
+    };
+  }
+  static get events() {
+    return [{
+        "method": "smoothlyFilterField",
+        "name": "smoothlyFilterField",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "complexType": {
+          "original": "selectively.Rule",
+          "resolved": "Rule",
+          "references": {
+            "selectively": {
+              "location": "import",
+              "path": "selectively"
+            }
+          }
+        }
+      }];
+  }
+  static get methods() {
+    return {
+      "clear": {
+        "complexType": {
+          "signature": "() => Promise<void>",
+          "parameters": [],
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
+          },
+          "return": "Promise<void>"
+        },
+        "docs": {
+          "text": "",
+          "tags": []
+        }
+      }
+    };
+  }
+}
+//# sourceMappingURL=index.js.map

package/dist/collection/components/filter/field/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/filter/field/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAgB,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,eAAe,CAAA;AACrF,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAA;AAOzC,MAAM,OAAO,mBAAmB;;;;EAK/B,KAAK,CAAC,KAAK;;IACV,MAAM,CAAA,MAAA,IAAI,CAAC,KAAK,0CAAE,KAAK,EAAE,CAAA,CAAA;EAC1B,CAAC;EACD,eAAe;;IACd,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,MAAA,IAAI,CAAC,KAAK,0CAAE,KAAK,CAAC,CAAC,CAAA;EACpE,CAAC;EACD,MAAM;IACL,OAAO,CACN,EAAC,IAAI,IAAC,SAAS,EAAE,CAAC,CAAgB,EAAE,EAAE,CAAC,CAAC,CAAC,GAAG,IAAI,OAAO,IAAI,IAAI,CAAC,eAAe,EAAE;MAChF,sBACC,IAAI,EAAC,QAAQ,EACb,GAAG,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,KAAK,GAAG,CAAC,CAAC,EAC1B,KAAK,EAAE,IAAI,CAAC,QAAQ,CAAC,QAAQ,EAAE,EAC/B,oBAAoB,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,eAAe,EAAE,EAC9C,cAAc,EAAE,CAAC,CAAC,EAAE;UACnB,CAAC,CAAC,eAAe,EAAE,CAAA;UACnB,IAAI,CAAC,eAAe,EAAE,CAAA;QACvB,CAAC,EACD,qBAAqB,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,eAAe,EAAE,EAC/C,mBAAmB,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,eAAe,EAAE,EAC7C,gBAAgB,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,eAAe,EAAE,EAC1C,eAAe,EAAE,CAAC,CAAC,EAAE;UACpB,CAAC,CAAC,eAAe,EAAE,CAAA;QACpB,CAAC,aAEe,CACX,CACP,CAAA;EACF,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACD","sourcesContent":["import { Component, Event, EventEmitter, h, Host, Method, Prop } from \"@stencil/core\"\nimport { selectively } from \"selectively\"\n\n@Component({\n\ttag: \"smoothly-filter-field\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyFilterField {\n\tinput: HTMLSmoothlyInputElement | undefined\n\t@Prop() criteria: selectively.Criteria\n\t@Event() smoothlyFilterField: EventEmitter<selectively.Rule>\n\t@Method()\n\tasync clear(): Promise<void> {\n\t\tawait this.input?.clear()\n\t}\n\tfilterFieldEmit() {\n\t\tthis.smoothlyFilterField.emit(selectively.parse(this.input?.value))\n\t}\n\trender() {\n\t\treturn (\n\t\t\t<Host onKeyDown={(e: KeyboardEvent) => e.key == \"Enter\" && this.filterFieldEmit()}>\n\t\t\t\t<smoothly-input\n\t\t\t\t\tname=\"filter\"\n\t\t\t\t\tref={e => (this.input = e)}\n\t\t\t\t\tvalue={this.criteria.toString()}\n\t\t\t\t\tonSmoothlyInputLooks={e => e.stopPropagation()}\n\t\t\t\t\tonSmoothlyBlur={e => {\n\t\t\t\t\t\te.stopPropagation()\n\t\t\t\t\t\tthis.filterFieldEmit()\n\t\t\t\t\t}}\n\t\t\t\t\tonSmoothlyFormDisable={e => e.stopPropagation()}\n\t\t\t\t\tonSmoothlyInputLoad={e => e.stopPropagation()}\n\t\t\t\t\tonSmoothlyChange={e => e.stopPropagation()}\n\t\t\t\t\tonSmoothlyInput={e => {\n\t\t\t\t\t\te.stopPropagation()\n\t\t\t\t\t}}>\n\t\t\t\t\tFilter\n\t\t\t\t</smoothly-input>\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"]}

package/dist/collection/components/filter/field/style.css

@@ -0,0 +1,4 @@
+:host {
+	flex-grow: 5;
+}
+

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

@@ -1,46 +1,49 @@
-import { h } from "@stencil/core";
-import * as selectively from "selectively";
-import { create as selectivelyCreate } from "selectively";
-import { Clearable } from "./Clearable";
+import { h, Host } from "@stencil/core";
+import { selectively } from "selectively";
+import { Filter } from "./Filter";
 export class SmoothlyFilter {
   constructor() {
-    this.inputs = new Map();
-    this.placeholder = undefined;
+    this.updating = false;
+    this.filters = new Set();
+    this.detailChildren = undefined;
+    this.criteria = selectively.and();
     this.expanded = false;
-    this.freeSearchValue = undefined;
-    this.criteria = {};
-    this.inputValue = undefined;
   }
-  filterHandler(event) {
+  updateHandler(event) {
     event.stopPropagation();
-    if (Clearable.is(event.target)) {
-      const target = event.target;
-      Object.keys(event.detail).forEach(key => this.inputs.set(key, target));
+    if (Filter.Element.type.is(event.target))
+      this.filters.add(event.detail);
+  }
+  manipulateHandler(event) {
+    event.stopPropagation();
+    this.updating = true;
+    this.criteria = event.detail(this.criteria);
+    this.smoothlyFilter.emit(this.criteria);
+    this.filters.forEach(update => update(this.criteria));
+    this.updating = false;
+  }
+  filterFieldHandler(event) {
+    event.stopPropagation();
+    if (!this.updating) {
+      this.smoothlyFilter.emit((this.criteria = selectively.and(event.detail)));
+      this.filters.forEach(update => update(this.criteria));
     }
-    !this.freeSearchValue
-      ? this.filters.emit((this.criteria = Object.assign(Object.assign({}, this.criteria), event.detail)))
-      : this.filters.emit(selectively.and(selectively.any(selectively.includes(this.freeSearchValue)), (this.criteria = Object.assign(Object.assign({}, this.criteria), event.detail))));
   }
-  onKeyDown() {
+  clear() {
     var _a;
-    this.freeSearchValue = (_a = this.freeSearchElement) === null || _a === void 0 ? void 0 : _a.value;
-    this.inputValue = selectively.includes(this.freeSearchValue);
-    this.filters.emit(selectively.any(this.inputValue));
-  }
-  async clear(event) {
-    new Set(this.inputs.values()).forEach(input => input.clear());
-    this.filters.emit((this.criteria = {}));
+    (_a = this.field) === null || _a === void 0 ? void 0 : _a.clear();
+    this.smoothlyFilter.emit((this.criteria = selectively.and()));
+    this.filters.forEach(update => update(this.criteria));
   }
   render() {
-    return [
-      h("smoothly-form", { looks: "border" }, h("smoothly-input", { name: "filter", ref: element => (this.freeSearchElement = element), value: selectivelyCreate(this.criteria).stringify(), onKeyDown: () => this.onKeyDown(), placeholder: this.placeholder }, h("section", { slot: "start" }, h("slot", { name: "start" })), h("slot", null), h("section", { slot: "end" }, h("smoothly-button", { size: "flexible", onClick: e => this.clear(e) }, h("smoothly-icon", { class: Object.keys(this.criteria).length >= 1 ? "btn clear" : "btn hidden", name: "close", size: "tiny" })), h("smoothly-button", { size: "flexible", class: "btn", onClick: () => {
-          this.expanded = !this.expanded;
-        } }, this.expanded ? (h("smoothly-icon", { name: "options", size: "small" })) : (h("smoothly-icon", { name: "options-outline", size: "small" })))))),
-      h("section", { hidden: !this.expanded, class: this.expanded ? "container arrow-top" : "hidden" }, h("div", { hidden: !this.expanded, class: this.expanded ? "container-wrapper" : "hidden" }, this.expanded && h("slot", { name: "filter" }))),
-    ];
+    return (h(Host, null, h("slot", { name: "bar" }), h("smoothly-filter-field", { criteria: this.criteria, ref: e => (this.field = e) }), this.criteria.toString() != "" && (h("smoothly-icon", { name: "close", toolTip: "Clear all filters", size: "small", onClick: () => {
+        this.clear();
+      } })), h("div", { class: this.expanded ? "container arrow-top" : "hidden" }, h("slot", { name: "detail" })), h("smoothly-icon", { name: this.expanded ? "options" : "options-outline", toolTip: (this.expanded ? "Hide" : "Show") + " additional filters", size: "small", onClick: () => {
+        this.expanded = !this.expanded;
+      } }), h("div", { class: this.expanded ? "close" : "hidden", onClick: () => (this.expanded = !this.expanded) })));
   }
   static get is() { return "smoothly-filter"; }
-  static get encapsulation() { return "shadow"; }
+  static get encapsulation() { return "scoped"; }
   static get originalStyleUrls() {
     return {
       "$": ["style.css"]
@@ -51,83 +54,17 @@ export class SmoothlyFilter {
       "$": ["style.css"]
     };
   }
-  static get properties() {
-    return {
-      "placeholder": {
-        "type": "string",
-        "mutable": true,
-        "complexType": {
-          "original": "string | undefined",
-          "resolved": "string | undefined",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "placeholder",
-        "reflect": false
-      },
-      "criteria": {
-        "type": "unknown",
-        "mutable": true,
-        "complexType": {
-          "original": "Record<string, Criteria>",
-          "resolved": "{ [x: string]: Criteria; }",
-          "references": {
-            "Record": {
-              "location": "global"
-            },
-            "Criteria": {
-              "location": "import",
-              "path": "selectively"
-            }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "defaultValue": "{}"
-      },
-      "inputValue": {
-        "type": "any",
-        "mutable": true,
-        "complexType": {
-          "original": "Criteria",
-          "resolved": "Helper[] | Rule | number | string | { [property: string]: Helper | Helper[]; }",
-          "references": {
-            "Criteria": {
-              "location": "import",
-              "path": "selectively"
-            }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "input-value",
-        "reflect": false
-      }
-    };
-  }
   static get states() {
     return {
-      "expanded": {},
-      "freeSearchValue": {}
+      "detailChildren": {},
+      "criteria": {},
+      "expanded": {}
     };
   }
   static get events() {
     return [{
-        "method": "filters",
-        "name": "filters",
+        "method": "smoothlyFilter",
+        "name": "smoothlyFilter",
         "bubbles": true,
         "cancelable": true,
         "composed": true,
@@ -136,10 +73,10 @@ export class SmoothlyFilter {
           "text": ""
         },
         "complexType": {
-          "original": "Criteria",
+          "original": "selectively.Criteria",
           "resolved": "Helper[] | Rule | number | string | { [property: string]: Helper | Helper[]; }",
           "references": {
-            "Criteria": {
+            "selectively": {
               "location": "import",
               "path": "selectively"
             }
@@ -147,36 +84,22 @@ export class SmoothlyFilter {
         }
       }];
   }
-  static get methods() {
-    return {
-      "clear": {
-        "complexType": {
-          "signature": "(event: MouseEvent) => Promise<void>",
-          "parameters": [{
-              "tags": [],
-              "text": ""
-            }],
-          "references": {
-            "Promise": {
-              "location": "global"
-            },
-            "MouseEvent": {
-              "location": "global"
-            }
-          },
-          "return": "Promise<void>"
-        },
-        "docs": {
-          "text": "",
-          "tags": []
-        }
-      }
-    };
-  }
   static get listeners() {
     return [{
-        "name": "filter",
-        "method": "filterHandler",
+        "name": "smoothlyFilterUpdate",
+        "method": "updateHandler",
+        "target": undefined,
+        "capture": false,
+        "passive": false
+      }, {
+        "name": "smoothlyFilterManipulate",
+        "method": "manipulateHandler",
+        "target": undefined,
+        "capture": false,
+        "passive": false
+      }, {
+        "name": "smoothlyFilterField",
+        "method": "filterFieldHandler",
         "target": undefined,
         "capture": false,
         "passive": false

package/dist/collection/components/filter/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/filter/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Event, EventEmitter, h, Listen, Method, Prop, State } from \"@stencil/core\"\nimport * as selectively from \"selectively\"\nimport { create as selectivelyCreate, Criteria } from \"selectively\"\nimport { Clearable } from \"./Clearable\"\n\n@Component({\n\ttag: \"smoothly-filter\",\n\tstyleUrl: \"style.css\",\n\tshadow: true,\n})\nexport class SmoothlyFilter {\n\tprivate freeSearchElement?: HTMLSmoothlyInputElement\n\tprivate inputs = new Map<string, Clearable>()\n\t@Prop({ mutable: true }) placeholder: string | undefined\n\t@State() expanded = false\n\t@State() freeSearchValue: string\n\t@Prop({ mutable: true }) criteria: Record<string, Criteria> = {}\n\t@Prop({ mutable: true }) inputValue: Criteria\n\n\t@Listen(\"filter\")\n\tfilterHandler(event: CustomEvent<Record<string, Criteria>>) {\n\t\tevent.stopPropagation()\n\n\t\tif (Clearable.is(event.target)) {\n\t\t\tconst target = event.target\n\t\t\tObject.keys(event.detail).forEach(key => this.inputs.set(key, target))\n\t\t}\n\t\t!this.freeSearchValue\n\t\t\t? this.filters.emit((this.criteria = { ...this.criteria, ...event.detail }))\n\t\t\t: this.filters.emit(\n\t\t\t\t\tselectively.and(\n\t\t\t\t\t\tselectively.any(selectively.includes(this.freeSearchValue)),\n\t\t\t\t\t\t(this.criteria = { ...this.criteria, ...event.detail })\n\t\t\t\t\t)\n\t\t\t  )\n\t}\n\t@Event() filters: EventEmitter<Criteria>\n\tonKeyDown() {\n\t\tthis.freeSearchValue = this.freeSearchElement?.value\n\t\tthis.inputValue = selectively.includes(this.freeSearchValue)\n\t\tthis.filters.emit(selectively.any(this.inputValue))\n\t}\n\n\t@Method()\n\tasync clear(event: MouseEvent): Promise<void> {\n\t\tnew Set(this.inputs.values()).forEach(input => input.clear())\n\t\tthis.filters.emit((this.criteria = {}))\n\t}\n\n\trender() {\n\t\treturn [\n\t\t\t<smoothly-form looks=\"border\">\n\t\t\t\t<smoothly-input\n\t\t\t\t\tname=\"filter\"\n\t\t\t\t\tref={element => (this.freeSearchElement = element)}\n\t\t\t\t\tvalue={selectivelyCreate(this.criteria).stringify()}\n\t\t\t\t\tonKeyDown={() => this.onKeyDown()}\n\t\t\t\t\tplaceholder={this.placeholder}>\n\t\t\t\t\t<section slot=\"start\">\n\t\t\t\t\t\t<slot name=\"start\" />\n\t\t\t\t\t</section>\n\t\t\t\t\t<slot />\n\t\t\t\t\t<section slot=\"end\">\n\t\t\t\t\t\t<smoothly-button size=\"flexible\" onClick={e => this.clear(e)}>\n\t\t\t\t\t\t\t<smoothly-icon\n\t\t\t\t\t\t\t\tclass={Object.keys(this.criteria).length >= 1 ? \"btn clear\" : \"btn hidden\"}\n\t\t\t\t\t\t\t\tname=\"close\"\n\t\t\t\t\t\t\t\tsize=\"tiny\"\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</smoothly-button>\n\t\t\t\t\t\t<smoothly-button\n\t\t\t\t\t\t\tsize=\"flexible\"\n\t\t\t\t\t\t\tclass=\"btn\"\n\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\tthis.expanded = !this.expanded\n\t\t\t\t\t\t\t}}>\n\t\t\t\t\t\t\t{this.expanded ? (\n\t\t\t\t\t\t\t\t<smoothly-icon name=\"options\" size=\"small\" />\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<smoothly-icon name=\"options-outline\" size=\"small\" />\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</smoothly-button>\n\t\t\t\t\t</section>\n\t\t\t\t</smoothly-input>\n\t\t\t</smoothly-form>,\n\n\t\t\t<section hidden={!this.expanded} class={this.expanded ? \"container arrow-top\" : \"hidden\"}>\n\t\t\t\t<div hidden={!this.expanded} class={this.expanded ? \"container-wrapper\" : \"hidden\"}>\n\t\t\t\t\t{this.expanded && <slot name=\"filter\" />}\n\t\t\t\t</div>\n\t\t\t</section>,\n\t\t]\n\t}\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/filter/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Event, EventEmitter, h, Host, Listen, State } from \"@stencil/core\"\nimport { selectively } from \"selectively\"\nimport { Filter } from \"./Filter\"\n\n@Component({\n\ttag: \"smoothly-filter\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyFilter {\n\tfield: HTMLSmoothlyFilterFieldElement | undefined\n\tupdating = false\n\tfilters: Set<Filter.Update> = new Set<Filter.Update>() // maybe set?\n\t@State() detailChildren?: boolean\n\t@State() criteria: selectively.Criteria = selectively.and()\n\t@State() expanded = false\n\t@Event() smoothlyFilter: EventEmitter<selectively.Criteria>\n\n\t@Listen(\"smoothlyFilterUpdate\")\n\tupdateHandler(event: CustomEvent<Filter.Update>) {\n\t\tevent.stopPropagation()\n\t\tif (Filter.Element.type.is(event.target))\n\t\t\tthis.filters.add(event.detail)\n\t}\n\t@Listen(\"smoothlyFilterManipulate\")\n\tmanipulateHandler(event: CustomEvent<Filter.Manipulate>) {\n\t\tevent.stopPropagation()\n\t\tthis.updating = true\n\t\tthis.criteria = event.detail(this.criteria)\n\t\tthis.smoothlyFilter.emit(this.criteria)\n\t\tthis.filters.forEach(update => update(this.criteria))\n\t\tthis.updating = false\n\t}\n\t@Listen(\"smoothlyFilterField\")\n\tfilterFieldHandler(event: CustomEvent<selectively.Criteria>) {\n\t\tevent.stopPropagation()\n\t\tif (!this.updating) {\n\t\t\tthis.smoothlyFilter.emit((this.criteria = selectively.and(event.detail)))\n\t\t\tthis.filters.forEach(update => update(this.criteria))\n\t\t}\n\t}\n\tclear(): void {\n\t\tthis.field?.clear()\n\t\tthis.smoothlyFilter.emit((this.criteria = selectively.and()))\n\t\tthis.filters.forEach(update => update(this.criteria))\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<slot name=\"bar\" />\n\t\t\t\t<smoothly-filter-field criteria={this.criteria} ref={e => (this.field = e)} />\n\t\t\t\t{this.criteria.toString() != \"\" && (\n\t\t\t\t\t<smoothly-icon\n\t\t\t\t\t\tname={\"close\"}\n\t\t\t\t\t\ttoolTip={\"Clear all filters\"}\n\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\tthis.clear()\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t\t<div class={this.expanded ? \"container arrow-top\" : \"hidden\"}>\n\t\t\t\t\t<slot name=\"detail\" />\n\t\t\t\t</div>\n\t\t\t\t<smoothly-icon\n\t\t\t\t\tname={this.expanded ? \"options\" : \"options-outline\"}\n\t\t\t\t\ttoolTip={(this.expanded ? \"Hide\" : \"Show\") + \" additional filters\"}\n\t\t\t\t\tsize=\"small\"\n\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\tthis.expanded = !this.expanded\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<div class={this.expanded ? \"close\" : \"hidden\"} onClick={() => (this.expanded = !this.expanded)} />\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"]}