smoothly 1.0.0-alpha.13 → 1.0.0-alpha.131

package/dist/collection/components/input/demo/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/input/demo/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Listen } from \"@stencil/core\"\nimport { isoly } from \"isoly\"\n@Component({\n\ttag: \"smoothly-input-demo\",\n\tstyleUrl: \"style.css\",\n})\nexport class SmoothlyInputDemo {\n\tprivate selectElement: HTMLSmoothlyInputSelectElement\n\n\t@Listen(\"selectionChanged\")\n\thandleSelectionChanged(event: CustomEvent<{ identifier: string; value: string }>) {\n\t\tconsole.log(\"selectionChanged\", event.detail)\n\t}\n\n\trender() {\n\t\treturn [\n\t\t\t<h2>Duration</h2>,\n\t\t\t<smoothly-form looks=\"border\">\n\t\t\t\t<smoothly-input\n\t\t\t\t\tname=\"duration\"\n\t\t\t\t\ttype=\"duration\"\n\t\t\t\t\tplaceholder=\"hh:mm\"\n\t\t\t\t\tvalue={{ hours: 5, minutes: 30 }}\n\t\t\t\t\tonSmoothlyInput={e => console.log(e.detail.duration)}>\n\t\t\t\t\tDuration\n\t\t\t\t</smoothly-input>\n\t\t\t\t<smoothly-input\n\t\t\t\t\tname=\"duration\"\n\t\t\t\t\ttype=\"duration\"\n\t\t\t\t\tvalue={{ hours: 5, minutes: 30 }}\n\t\t\t\t\tplaceholder=\"hh:mm\"\n\t\t\t\t\tonSmoothlyInput={e => console.log(e.detail.duration)}>\n\t\t\t\t\tVaraktighet\n\t\t\t\t</smoothly-input>\n\t\t\t</smoothly-form>,\n\t\t\t<h2>Submit</h2>,\n\t\t\t<smoothly-form looks=\"border\">\n\t\t\t\t<smoothly-input type=\"email\" name=\"email\">\n\t\t\t\t\tEmail\n\t\t\t\t</smoothly-input>\n\t\t\t\t<smoothly-input type=\"password\" name=\"password\">\n\t\t\t\t\tPassword\n\t\t\t\t</smoothly-input>\n\t\t\t\t<smoothly-input-clear fill=\"default\" type=\"form\" color=\"danger\" slot=\"clear\">\n\t\t\t\t\tClear\n\t\t\t\t</smoothly-input-clear>\n\t\t\t\t<smoothly-submit slot=\"submit\">Submit</smoothly-submit>\n\t\t\t</smoothly-form>,\n\n\t\t\t<h4>Clear</h4>,\n\t\t\t<smoothly-form looks=\"border\">\n\t\t\t\t<smoothly-input name=\"First Name\">First name</smoothly-input>\n\t\t\t\t<smoothly-input name=\"Last name\">\n\t\t\t\t\tLast name\n\t\t\t\t\t<smoothly-input-clear slot=\"end\">\n\t\t\t\t\t\t<smoothly-icon name=\"close\" />\n\t\t\t\t\t</smoothly-input-clear>\n\t\t\t\t</smoothly-input>\n\t\t\t\t<smoothly-input type=\"phone\" name=\"Phone\">\n\t\t\t\t\tPhone\n\t\t\t\t\t<smoothly-input-clear slot=\"end\">\n\t\t\t\t\t\t<smoothly-icon name=\"close\" />\n\t\t\t\t\t</smoothly-input-clear>\n\t\t\t\t</smoothly-input>\n\t\t\t\t<smoothly-input-clear fill=\"default\" type=\"form\" color=\"danger\" slot=\"submit\">\n\t\t\t\t\tClear\n\t\t\t\t</smoothly-input-clear>\n\t\t\t</smoothly-form>,\n\n\t\t\t<h2>Border</h2>,\n\t\t\t<smoothly-form looks=\"border\">\n\t\t\t\t<smoothly-input type=\"email\" name=\"email\">\n\t\t\t\t\tEmail\n\t\t\t\t</smoothly-input>\n\t\t\t\t<smoothly-input type=\"password\" name=\"password\">\n\t\t\t\t\tPassword\n\t\t\t\t</smoothly-input>\n\t\t\t\t<smoothly-submit slot=\"submit\" onSubmit={(e: Event) => alert(e)} color=\"success\" fill=\"solid\">\n\t\t\t\t\tSend\n\t\t\t\t</smoothly-submit>\n\t\t\t</smoothly-form>,\n\t\t\t<h2>Grid</h2>,\n\t\t\t<h4>Contact</h4>,\n\t\t\t<smoothly-form looks=\"grid\" method=\"GET\" action=\"https://webhook.site/85bb78f6-b450-4a74-81ac-d7cac6e94bbe\">\n\t\t\t\t<smoothly-input type=\"text\" name=\"name.last\">\n\t\t\t\t\tFirst Name\n\t\t\t\t</smoothly-input>\n\t\t\t\t<smoothly-input type=\"text\" name=\"name.first\">\n\t\t\t\t\tLast Name\n\t\t\t\t</smoothly-input>\n\t\t\t\t<smoothly-input type=\"text\" name=\"street\" value=\"Torgny Segerstedts Allé 87\">\n\t\t\t\t\tStreet\n\t\t\t\t</smoothly-input>\n\t\t\t\t<smoothly-input type=\"postal-code\" name=\"zip\">\n\t\t\t\t\tZipCode\n\t\t\t\t</smoothly-input>\n\t\t\t\t<smoothly-input type=\"text\" name=\"city\">\n\t\t\t\t\tCity\n\t\t\t\t</smoothly-input>\n\t\t\t\t<smoothly-input type=\"text\" name=\"countryCode\">\n\t\t\t\t\tCountryCode\n\t\t\t\t</smoothly-input>\n\t\t\t\t<smoothly-input type=\"phone\" name=\"phone\">\n\t\t\t\t\tPhone\n\t\t\t\t</smoothly-input>\n\t\t\t\t<smoothly-input type=\"email\" name=\"email\">\n\t\t\t\t\tEmail\n\t\t\t\t</smoothly-input>\n\t\t\t\t<smoothly-submit slot=\"submit\" color=\"success\" fill=\"solid\">\n\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" slot=\"start\"></smoothly-icon>\n\t\t\t\t\tSubmit\n\t\t\t\t</smoothly-submit>\n\t\t\t</smoothly-form>,\n\t\t\t<h4>Card</h4>,\n\t\t\t<smoothly-form looks=\"grid\" onSmoothlyFormSubmit={(e: CustomEvent) => alert(JSON.stringify(e.detail))}>\n\t\t\t\t<smoothly-input type=\"card-number\" name=\"card\">\n\t\t\t\t\tCard #\n\t\t\t\t</smoothly-input>\n\t\t\t\t<smoothly-submit size=\"icon\" slot=\"submit\" color=\"success\" fill=\"solid\">\n\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\"></smoothly-icon>\n\t\t\t\t</smoothly-submit>\n\t\t\t\t<smoothly-input type=\"card-expires\" name=\"expires\">\n\t\t\t\t\tExpires\n\t\t\t\t</smoothly-input>\n\t\t\t\t<smoothly-input type=\"card-csc\" name=\"csc\">\n\t\t\t\t\tCVV/CVC\n\t\t\t\t</smoothly-input>\n\t\t\t\t<smoothly-input type=\"text\" name=\"name.first\">\n\t\t\t\t\tFirst Name\n\t\t\t\t</smoothly-input>\n\t\t\t\t<smoothly-input type=\"text\" name=\"name.last\">\n\t\t\t\t\tLast Name\n\t\t\t\t</smoothly-input>\n\t\t\t</smoothly-form>,\n\t\t\t<h4>Contact</h4>,\n\t\t\t<smoothly-form looks=\"grid\">\n\t\t\t\t<smoothly-input type=\"email\" name=\"email\">\n\t\t\t\t\tEmail\n\t\t\t\t</smoothly-input>\n\t\t\t\t<smoothly-input type=\"password\" name=\"password\">\n\t\t\t\t\tPassword\n\t\t\t\t</smoothly-input>\n\t\t\t\t<smoothly-input type=\"price\" currency=\"SEK\" name=\"price\">\n\t\t\t\t\tPrice\n\t\t\t\t</smoothly-input>\n\t\t\t\t<smoothly-input type=\"percent\" name=\"percent\">\n\t\t\t\t\tPercent\n\t\t\t\t</smoothly-input>\n\t\t\t\t<smoothly-submit slot=\"submit\" color=\"success\" fill=\"solid\" size=\"icon\">\n\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\"></smoothly-icon>\n\t\t\t\t</smoothly-submit>\n\t\t\t</smoothly-form>,\n\t\t\t<h4>Random</h4>,\n\t\t\t<smoothly-form looks=\"grid\">\n\t\t\t\t<smoothly-input\n\t\t\t\t\ttype=\"text\"\n\t\t\t\t\tname=\"name\"\n\t\t\t\t\treadonly={true}\n\t\t\t\t\tvalue={\"Readonly\"}\n\t\t\t\t\tonSmoothlyBlur={() => console.log(\"smoothly blur\")}\n\t\t\t\t\tstyle={{ width: \"100%\" }}>\n\t\t\t\t\tReadonly\n\t\t\t\t</smoothly-input>\n\t\t\t\t<smoothly-input type=\"text\" name=\"testing\">\n\t\t\t\t\tTextTest\n\t\t\t\t</smoothly-input>\n\t\t\t\t<smoothly-input type=\"date-time\" name=\"date-time\">\n\t\t\t\t\tDate-Time\n\t\t\t\t</smoothly-input>\n\t\t\t\t<smoothly-input type=\"divisor\" name=\"divisor\">\n\t\t\t\t\tDivisor\n\t\t\t\t</smoothly-input>\n\t\t\t\t<smoothly-input type=\"date\" name=\"date\">\n\t\t\t\t\tDate\n\t\t\t\t</smoothly-input>\n\t\t\t\t<smoothly-input-date name=\"some-date\">Calendar</smoothly-input-date>\n\t\t\t</smoothly-form>,\n\t\t\t<h2>Line</h2>,\n\t\t\t<smoothly-form looks=\"line\">\n\t\t\t\t<smoothly-input type=\"text\" name=\"name.last\" onSmoothlyChange={e => console.log(\"smoothly change event\")}>\n\t\t\t\t\tFirst Name\n\t\t\t\t</smoothly-input>\n\t\t\t\t<smoothly-input type=\"text\" name=\"name.first\" onSmoothlyChange={e => console.log(\"smoothly change event\")}>\n\t\t\t\t\tLast Name\n\t\t\t\t</smoothly-input>\n\t\t\t\t<smoothly-submit slot=\"submit\" fill=\"solid\" onSubmit={(e: Event) => alert(e)} color=\"success\">\n\t\t\t\t\tSend\n\t\t\t\t</smoothly-submit>\n\t\t\t</smoothly-form>,\n\t\t\t<h2>Input Alternatives</h2>,\n\t\t\t<smoothly-form looks=\"border\">\n\t\t\t\t<smoothly-input type=\"text\" name=\"name.last\" onSmoothlyChange={e => console.log(\"smoothly change event\")}>\n\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" slot=\"start\"></smoothly-icon>\n\t\t\t\t\tFirst Name\n\t\t\t\t</smoothly-input>\n\t\t\t\t<smoothly-input type=\"text\" name=\"name.first\" onSmoothlyChange={e => console.log(\"smoothly change event\")}>\n\t\t\t\t\tLast Name\n\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" slot=\"end\"></smoothly-icon>\n\t\t\t\t</smoothly-input>\n\t\t\t\t<smoothly-input\n\t\t\t\t\ttype=\"text\"\n\t\t\t\t\tname=\"name.first\"\n\t\t\t\t\tplaceholder=\"Smith\"\n\t\t\t\t\tonSmoothlyChange={e => console.log(\"smoothly change event\")}>\n\t\t\t\t\tLast Name\n\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" slot=\"end\"></smoothly-icon>\n\t\t\t\t</smoothly-input>\n\t\t\t\t<smoothly-input placeholder=\"test\"></smoothly-input>\n\t\t\t\t<smoothly-submit slot=\"submit\" fill=\"solid\" onSubmit={(e: Event) => alert(e)} color=\"success\">\n\t\t\t\t\tSend\n\t\t\t\t</smoothly-submit>\n\t\t\t</smoothly-form>,\n\t\t\t<h4>Smoothly checkboxes</h4>,\n\t\t\t<smoothly-form>\n\t\t\t\t<div>\n\t\t\t\t\t<smoothly-checkbox>\n\t\t\t\t\t\tCheck me\n\t\t\t\t\t\t<div slot=\"expansion\">Some context</div>\n\t\t\t\t\t</smoothly-checkbox>\n\t\t\t\t\t<smoothly-checkbox>Label</smoothly-checkbox>\n\t\t\t\t\t<smoothly-checkbox disabled={true} />\n\t\t\t\t</div>\n\t\t\t</smoothly-form>,\n\t\t\t<h4>Smoothly Radio Buttons</h4>,\n\t\t\t<smoothly-form onSmoothlyFormSubmit={e => console.log(e.detail)}>\n\t\t\t\t<smoothly-radio-button name=\"radioButtonDemo\" deselectable decoration=\"button\">\n\t\t\t\t\t<smoothly-radio-button-item value={\"test\"}>\n\t\t\t\t\t\tOption 1<div slot=\"expansion\">Some description.</div>\n\t\t\t\t\t</smoothly-radio-button-item>\n\t\t\t\t\t<smoothly-radio-button-item value={{ some: \"thing\", yes: \"miss\" }}>\n\t\t\t\t\t\tOption 2<div slot=\"expansion\">Some other description.</div>\n\t\t\t\t\t</smoothly-radio-button-item>\n\t\t\t\t\t<smoothly-radio-button-item value={{ some: \"one\", yes: \"kid\" }}>\n\t\t\t\t\t\tOption 3<div slot=\"expansion\">Some third description.</div>\n\t\t\t\t\t</smoothly-radio-button-item>\n\t\t\t\t</smoothly-radio-button>\n\t\t\t\t<smoothly-submit slot=\"submit\" color=\"success\" fill=\"solid\" size=\"icon\">\n\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\"></smoothly-icon>\n\t\t\t\t</smoothly-submit>\n\t\t\t</smoothly-form>,\n\t\t\t<h4>Radio List without button 1</h4>,\n\t\t\t<smoothly-form>\n\t\t\t\t<smoothly-radio-button name=\"RadioListWithoutButton\">\n\t\t\t\t\t<smoothly-radio-button-item value={{ some: \"content\", yes: \"sir\" }} selected color=\"light\">\n\t\t\t\t\t\t<span>Option 1</span>\n\t\t\t\t\t\t<span slot=\"expansion\">Some description.</span>\n\t\t\t\t\t</smoothly-radio-button-item>\n\t\t\t\t\t<smoothly-radio-button-item value={{ some: \"thing\", yes: \"miss\" }} color=\"light\">\n\t\t\t\t\t\t<span>Option 2</span>\n\t\t\t\t\t\t<span slot=\"expansion\">Some other description.</span>\n\t\t\t\t\t</smoothly-radio-button-item>\n\t\t\t\t\t<smoothly-radio-button-item value={{ some: \"one\", yes: \"kid\" }} color=\"light\">\n\t\t\t\t\t\t<span>Option 3</span>\n\t\t\t\t\t\t<span slot=\"expansion\">Some third description.</span>\n\t\t\t\t\t</smoothly-radio-button-item>\n\t\t\t\t</smoothly-radio-button>\n\t\t\t\t<smoothly-submit slot=\"submit\" color=\"success\" fill=\"solid\" size=\"icon\">\n\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\"></smoothly-icon>\n\t\t\t\t</smoothly-submit>\n\t\t\t</smoothly-form>,\n\t\t\t<h4>Radio List without button 2</h4>,\n\t\t\t<smoothly-form>\n\t\t\t\t<smoothly-radio name=\"option\" value=\"1a\" style={{ width: \"100%\" }}>\n\t\t\t\t\toption 1\n\t\t\t\t</smoothly-radio>\n\t\t\t\t<smoothly-radio name=\"option\" value=\"2a\" checked style={{ width: \"100%\" }}>\n\t\t\t\t\toption 2\n\t\t\t\t</smoothly-radio>\n\t\t\t\t<smoothly-radio name=\"option\" value=\"3a\" style={{ width: \"100%\" }}>\n\t\t\t\t\toption 3\n\t\t\t\t</smoothly-radio>\n\t\t\t</smoothly-form>,\n\t\t\t<h4>Smoothly Accordion</h4>,\n\t\t\t<smoothly-form>\n\t\t\t\t<smoothly-accordion>\n\t\t\t\t\t<smoothly-accordion-item name=\"A\" open>\n\t\t\t\t\t\t<smoothly-radio name=\"a\" value=\"1b\">\n\t\t\t\t\t\t\ta 1\n\t\t\t\t\t\t</smoothly-radio>\n\t\t\t\t\t\t<smoothly-radio name=\"a\" value=\"2b\" checked>\n\t\t\t\t\t\t\ta 2\n\t\t\t\t\t\t</smoothly-radio>\n\t\t\t\t\t\t<smoothly-radio name=\"a\" value=\"3b\">\n\t\t\t\t\t\t\ta 3\n\t\t\t\t\t\t</smoothly-radio>\n\t\t\t\t\t</smoothly-accordion-item>\n\t\t\t\t\t<smoothly-accordion-item name=\"B\">\n\t\t\t\t\t\t<smoothly-radio name=\"b\" value=\"1c\">\n\t\t\t\t\t\t\tb 1\n\t\t\t\t\t\t</smoothly-radio>\n\t\t\t\t\t\t<smoothly-radio name=\"b\" value=\"2c\">\n\t\t\t\t\t\t\tb 2\n\t\t\t\t\t\t</smoothly-radio>\n\t\t\t\t\t\t<smoothly-radio name=\"b\" value=\"3c\">\n\t\t\t\t\t\t\tb 3\n\t\t\t\t\t\t</smoothly-radio>\n\t\t\t\t\t</smoothly-accordion-item>\n\t\t\t\t</smoothly-accordion>\n\t\t\t\t<smoothly-submit slot=\"submit\" color=\"success\" fill=\"solid\" size=\"icon\">\n\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\"></smoothly-icon>\n\t\t\t\t</smoothly-submit>\n\t\t\t</smoothly-form>,\n\t\t\t<h4>Smoothly Picker</h4>,\n\t\t\t<smoothly-picker-demo />,\n\n\t\t\t<smoothly-back-to-top />,\n\t\t\t<h4>Smoothly Date</h4>,\n\t\t\t<smoothly-input-date>Date</smoothly-input-date>,\n\t\t\t<smoothly-input-date showLabel={false} value=\"2021-10-28\" max=\"2021-12-30\" min=\"2021-10-10\">\n\t\t\t\tDate\n\t\t\t</smoothly-input-date>,\n\t\t\t<smoothly-form looks=\"grid\" onSmoothlyFormSubmit={e => console.log(e.detail)}>\n\t\t\t\t<smoothly-input-date-range\n\t\t\t\t\tname=\"testing\"\n\t\t\t\t\tstart={isoly.Date.now()}\n\t\t\t\t\tend={isoly.Date.nextMonth(isoly.Date.now())}\n\t\t\t\t\tmin=\"2021-10-10\"\n\t\t\t\t\tmax=\"2024-12-30\"></smoothly-input-date-range>\n\t\t\t\t<smoothly-input-clear type=\"form\" color=\"danger\" fill=\"solid\" slot=\"clear\">\n\t\t\t\t\tClear\n\t\t\t\t</smoothly-input-clear>\n\t\t\t\t<smoothly-submit slot=\"submit\">submit daterange</smoothly-submit>\n\t\t\t</smoothly-form>,\n\n\t\t\t<smoothly-input-date-range\n\t\t\t\tlooks=\"grid\"\n\t\t\t\tstart={isoly.Date.now()}\n\t\t\t\tend={isoly.Date.nextMonth(isoly.Date.now())}\n\t\t\t\tmin=\"2021-10-10\"\n\t\t\t\tmax=\"2025-12-30\"\n\t\t\t\tshowLabel={false}\n\t\t\t\tstyle={{\n\t\t\t\t\t\"--border-radius\": \"4px\",\n\t\t\t\t\t\"--padding\": \"0 0.75em\",\n\t\t\t\t\t\"--input-width\": \"12ch\",\n\t\t\t\t}}></smoothly-input-date-range>,\n\t\t\t<br />,\n\t\t\t<h4>Smoothly Selector</h4>,\n\t\t\t<smoothly-input-select type=\"icon\" initialValue=\"folder\" showSelected={false}>\n\t\t\t\t<smoothly-item value=\"folder\">\n\t\t\t\t\t<smoothly-icon color=\"dark\" name=\"folder-outline\" />\n\t\t\t\t</smoothly-item>\n\t\t\t\t<smoothly-item value=\"camera\">\n\t\t\t\t\t<smoothly-icon color=\"dark\" name=\"camera-outline\" />\n\t\t\t\t</smoothly-item>\n\t\t\t</smoothly-input-select>,\n\t\t\t<br />,\n\t\t\t<smoothly-input-select\n\t\t\t\tlooks=\"line\"\n\t\t\t\tinitialPrompt=\"Select...\"\n\t\t\t\tref={(element: HTMLSmoothlyInputSelectElement) => (this.selectElement = element)}>\n\t\t\t\t<smoothly-item value=\"1\">January</smoothly-item>\n\t\t\t\t<smoothly-item value=\"2\">February</smoothly-item>\n\t\t\t\t<smoothly-item value=\"3\">March</smoothly-item>\n\t\t\t\t<smoothly-item value=\"4\">April</smoothly-item>\n\t\t\t\t<smoothly-item value=\"5\">May</smoothly-item>\n\t\t\t\t<smoothly-item value=\"6\">June</smoothly-item>\n\t\t\t\t<smoothly-item value=\"7\">July</smoothly-item>\n\t\t\t\t<smoothly-item value=\"8\">August</smoothly-item>\n\t\t\t\t<smoothly-item value=\"9\">September</smoothly-item>\n\t\t\t\t<smoothly-item value=\"10\">October</smoothly-item>\n\t\t\t\t<smoothly-item value=\"11\">November</smoothly-item>\n\t\t\t\t<smoothly-item value=\"12\">December</smoothly-item>\n\t\t\t</smoothly-input-select>,\n\t\t\t<button onClick={async () => this.selectElement.reset()}>Reset select</button>,\n\t\t\t<br />,\n\t\t\t<smoothly-form looks=\"grid\" onSmoothlyFormSubmit={e => console.log(\"Submitted\", e.detail)}>\n\t\t\t\t<smoothly-input type=\"text\" name=\"text\">\n\t\t\t\t\tText\n\t\t\t\t</smoothly-input>\n\t\t\t\t<div>\n\t\t\t\t\t<smoothly-input-file placeholder=\"Select or drag a file here\" name=\"file\">\n\t\t\t\t\t\t<span slot=\"label\">Testing file input</span>\n\t\t\t\t\t\t<smoothly-icon slot=\"button\" name=\"folder-outline\" />\n\t\t\t\t\t</smoothly-input-file>\n\t\t\t\t</div>\n\t\t\t\t<smoothly-input-file camera=\"back\" placeholder=\"Capture a photo\" name=\"image\">\n\t\t\t\t\t<span slot=\"label\">Testing camera photo</span>\n\t\t\t\t\t<smoothly-icon slot=\"button\" name=\"camera-outline\" />\n\t\t\t\t</smoothly-input-file>\n\t\t\t\t<smoothly-input-clear type=\"form\" color=\"danger\" fill=\"solid\" slot=\"clear\">\n\t\t\t\t\tClear\n\t\t\t\t</smoothly-input-clear>\n\t\t\t\t<smoothly-submit slot=\"submit\">Submit</smoothly-submit>\n\t\t\t</smoothly-form>,\n\t\t\t<br />,\n\t\t\t<smoothly-form looks=\"line\" onSmoothlyFormSubmit={e => console.log(\"form input\", e.detail)}>\n\t\t\t\t<smoothly-input name=\"text\">Input</smoothly-input>\n\t\t\t\t<smoothly-input-file camera=\"back\" placeholder=\"Capture a photo\" name=\"image\">\n\t\t\t\t\t<span slot=\"label\">Testing camera photo</span>\n\t\t\t\t\t<smoothly-icon slot=\"button\" name=\"camera-outline\" />\n\t\t\t\t</smoothly-input-file>\n\t\t\t\t<smoothly-picker name=\"picker\">\n\t\t\t\t\t<span slot=\"label\">Shape</span>\n\t\t\t\t\t<span slot=\"search\">Search</span>\n\t\t\t\t\t<smoothly-picker-option value={\"circle\"}>\n\t\t\t\t\t\t<span slot=\"label\">Circle</span>\n\t\t\t\t\t\t<smoothly-icon size=\"tiny\" name=\"ellipse-outline\" />\n\t\t\t\t\t</smoothly-picker-option>\n\t\t\t\t\t<smoothly-picker-option value={\"cube\"}>\n\t\t\t\t\t\t<span slot={\"label\"}>Cube</span>\n\t\t\t\t\t\t<smoothly-icon size=\"tiny\" name=\"cube-outline\" />\n\t\t\t\t\t</smoothly-picker-option>\n\t\t\t\t\t<smoothly-picker-option value={\"square\"} selected>\n\t\t\t\t\t\t<span slot={\"label\"}>Square</span>\n\t\t\t\t\t\t<smoothly-icon size=\"tiny\" name=\"square-outline\" />\n\t\t\t\t\t</smoothly-picker-option>\n\t\t\t\t</smoothly-picker>\n\t\t\t\t<smoothly-input-select\n\t\t\t\t\tname=\"select\"\n\t\t\t\t\tinitialPrompt=\"Select...\"\n\t\t\t\t\tref={(element: HTMLSmoothlyInputSelectElement) => (this.selectElement = element)}>\n\t\t\t\t\t<smoothly-item value=\"1\">January</smoothly-item>\n\t\t\t\t\t<smoothly-item value=\"2\">February</smoothly-item>\n\t\t\t\t\t<smoothly-item value=\"3\">March</smoothly-item>\n\t\t\t\t\t<smoothly-item value=\"4\">April</smoothly-item>\n\t\t\t\t\t<smoothly-item value=\"5\">May</smoothly-item>\n\t\t\t\t\t<smoothly-item value=\"6\">June</smoothly-item>\n\t\t\t\t\t<smoothly-item value=\"7\">July</smoothly-item>\n\t\t\t\t\t<smoothly-item value=\"8\">August</smoothly-item>\n\t\t\t\t\t<smoothly-item value=\"9\">September</smoothly-item>\n\t\t\t\t\t<smoothly-item value=\"10\">October</smoothly-item>\n\t\t\t\t\t<smoothly-item value=\"11\">November</smoothly-item>\n\t\t\t\t\t<smoothly-item value=\"12\">December</smoothly-item>\n\t\t\t\t</smoothly-input-select>\n\t\t\t\t<smoothly-input-date-range\n\t\t\t\t\tname=\"date-range\"\n\t\t\t\t\tstart={isoly.Date.now()}\n\t\t\t\t\tend={isoly.Date.nextMonth(isoly.Date.now())}\n\t\t\t\t\tmin=\"2021-10-10\"\n\t\t\t\t\tmax=\"2025-12-30\"\n\t\t\t\t\tshowLabel={false}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\"--border-radius\": \"4px\",\n\t\t\t\t\t\t\"--padding\": \"0 0.75em\",\n\t\t\t\t\t\t\"--input-width\": \"12ch\",\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<smoothly-input-date name=\"date\" value=\"2021-10-28\" max=\"2021-12-30\" min=\"2021-10-10\">\n\t\t\t\t\tDate\n\t\t\t\t</smoothly-input-date>\n\t\t\t\t<smoothly-submit slot=\"submit\" color=\"success\" fill=\"solid\" size=\"icon\">\n\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" fill=\"solid\" size=\"medium\" />\n\t\t\t\t</smoothly-submit>\n\t\t\t</smoothly-form>,\n\t\t\t<h4>Form with spinner showcase</h4>,\n\t\t\t<smoothly-form looks=\"line\" processing={true} onSmoothlyFormSubmit={e => console.log(\"form input\", e.detail)}>\n\t\t\t\t<smoothly-input name=\"text\">Input</smoothly-input>\n\t\t\t\t<smoothly-input-file camera=\"back\" placeholder=\"Capture a photo\" name=\"image\">\n\t\t\t\t\t<span slot=\"label\">Testing camera photo</span>\n\t\t\t\t\t<smoothly-icon slot=\"button\" name=\"camera-outline\" />\n\t\t\t\t</smoothly-input-file>\n\t\t\t\t<smoothly-picker name=\"picker\">\n\t\t\t\t\t<span slot=\"label\">Shape</span>\n\t\t\t\t\t<span slot=\"search\">Search</span>\n\t\t\t\t\t<smoothly-picker-option value={\"circle\"}>\n\t\t\t\t\t\t<span slot=\"label\">Circle</span>\n\t\t\t\t\t\t<smoothly-icon size=\"tiny\" name=\"ellipse-outline\" />\n\t\t\t\t\t</smoothly-picker-option>\n\t\t\t\t\t<smoothly-picker-option value={\"cube\"}>\n\t\t\t\t\t\t<span slot={\"label\"}>Cube</span>\n\t\t\t\t\t\t<smoothly-icon size=\"tiny\" name=\"cube-outline\" />\n\t\t\t\t\t</smoothly-picker-option>\n\t\t\t\t\t<smoothly-picker-option value={\"square\"} selected>\n\t\t\t\t\t\t<span slot={\"label\"}>Square</span>\n\t\t\t\t\t\t<smoothly-icon size=\"tiny\" name=\"square-outline\" />\n\t\t\t\t\t</smoothly-picker-option>\n\t\t\t\t</smoothly-picker>\n\t\t\t\t<smoothly-input-select\n\t\t\t\t\tname=\"select\"\n\t\t\t\t\tinitialPrompt=\"Select...\"\n\t\t\t\t\tref={(element: HTMLSmoothlyInputSelectElement) => (this.selectElement = element)}>\n\t\t\t\t\t<smoothly-item value=\"1\">January</smoothly-item>\n\t\t\t\t\t<smoothly-item value=\"2\">February</smoothly-item>\n\t\t\t\t\t<smoothly-item value=\"3\">March</smoothly-item>\n\t\t\t\t\t<smoothly-item value=\"4\">April</smoothly-item>\n\t\t\t\t\t<smoothly-item value=\"5\">May</smoothly-item>\n\t\t\t\t\t<smoothly-item value=\"6\">June</smoothly-item>\n\t\t\t\t\t<smoothly-item value=\"7\">July</smoothly-item>\n\t\t\t\t\t<smoothly-item value=\"8\">August</smoothly-item>\n\t\t\t\t\t<smoothly-item value=\"9\">September</smoothly-item>\n\t\t\t\t\t<smoothly-item value=\"10\">October</smoothly-item>\n\t\t\t\t\t<smoothly-item value=\"11\">November</smoothly-item>\n\t\t\t\t\t<smoothly-item value=\"12\">December</smoothly-item>\n\t\t\t\t</smoothly-input-select>\n\t\t\t\t<smoothly-input-date-range\n\t\t\t\t\tname=\"date-range\"\n\t\t\t\t\tstart={isoly.Date.now()}\n\t\t\t\t\tend={isoly.Date.nextMonth(isoly.Date.now())}\n\t\t\t\t\tmin=\"2021-10-10\"\n\t\t\t\t\tmax=\"2025-12-30\"\n\t\t\t\t\tshowLabel={false}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\"--border-radius\": \"4px\",\n\t\t\t\t\t\t\"--padding\": \"0 0.75em\",\n\t\t\t\t\t\t\"--input-width\": \"12ch\",\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<smoothly-input-date name=\"date\" value=\"2021-10-28\" max=\"2021-12-30\" min=\"2021-10-10\">\n\t\t\t\t\tDate\n\t\t\t\t</smoothly-input-date>\n\t\t\t\t<smoothly-submit slot=\"submit\" color=\"success\" fill=\"solid\" size=\"icon\">\n\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" fill=\"solid\" size=\"medium\" />\n\t\t\t\t</smoothly-submit>\n\t\t\t</smoothly-form>,\n\t\t]\n\t}\n}\n"]}

package/dist/collection/components/{input-demo → input/demo}/style.css

@@ -1,4 +1,5 @@
 smoothly-input-demo {
 	display: block;
 	margin: 2em;
+	margin-bottom: 20rem;
 }

package/dist/collection/components/input/file/index.js

@@ -0,0 +1,305 @@
+import { h, Host } from "@stencil/core";
+export class SmoothlyInputFile {
+  constructor() {
+    this.transfer = new DataTransfer();
+    this.dragging = false;
+    this.accept = undefined;
+    this.color = undefined;
+    this.looks = "plain";
+    this.camera = undefined;
+    this.name = undefined;
+    this.showLabel = true;
+    this.value = undefined;
+    this.placeholder = undefined;
+  }
+  componentWillLoad() {
+    this.smoothlyInputLooks.emit((looks, color) => ((this.looks = looks), !this.color && (this.color = color)));
+  }
+  async clear() {
+    this.value = undefined;
+  }
+  render() {
+    var _a, _b, _c;
+    return (h(Host, { class: { dragging: this.dragging }, onDragOver: (event) => (event.preventDefault(), event.stopPropagation()), onDragEnter: () => (this.dragging = true) }, h("label", null, h("slot", { name: "label" })), h("div", { class: "input" }, h("smoothly-button", { color: this.color, fill: "clear", size: "flexible", onClick: event => { var _a; return (event.stopPropagation(), (_a = this.input) === null || _a === void 0 ? void 0 : _a.click()); } }, h("slot", { name: "button" })), h("span", { onClick: event => { var _a; return (event.stopPropagation(), (_a = this.input) === null || _a === void 0 ? void 0 : _a.click()); } }, (_b = (_a = this.value) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : this.placeholder), h("div", { class: "mask", onDrop: event => {
+        var _a;
+        return (event.preventDefault(),
+          event.stopPropagation(),
+          (this.dragging = false),
+          ((_a = event.dataTransfer) === null || _a === void 0 ? void 0 : _a.files.length) &&
+            (this.smoothlyInput.emit({ [this.name]: (this.value = event.dataTransfer.files[0]) }),
+              this.smoothlyChange.emit({ [this.name]: (this.value = event.dataTransfer.files[0]) })));
+      }, onDragLeave: event => (event.stopPropagation(), (this.dragging = false)) }), h("input", { ref: element => (this.input = element), type: "file", capture: this.camera == "back" ? "environment" : "user", accept: (_c = this.accept) !== null && _c !== void 0 ? _c : (!this.camera ? undefined : "image/jpeg"), files: (this.transfer.items.clear(), this.value && this.transfer.items.add(this.value), this.transfer.files), onInput: event => {
+        var _a, _b, _c;
+        return (event.stopPropagation(),
+          ((_b = (_a = this.input) === null || _a === void 0 ? void 0 : _a.files) === null || _b === void 0 ? void 0 : _b.length) && this.smoothlyInput.emit({ [this.name]: (this.value = (_c = this.input) === null || _c === void 0 ? void 0 : _c.files[0]) }));
+      }, onChange: event => {
+        var _a, _b, _c;
+        return (event.stopPropagation(),
+          ((_b = (_a = this.input) === null || _a === void 0 ? void 0 : _a.files) === null || _b === void 0 ? void 0 : _b.length) &&
+            this.smoothlyChange.emit({ [this.name]: (this.value = (_c = this.input) === null || _c === void 0 ? void 0 : _c.files[0]) }));
+      } })), h("slot", null)));
+  }
+  static get is() { return "smoothly-input-file"; }
+  static get encapsulation() { return "scoped"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["style.css"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["style.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "accept": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string | undefined",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "accept",
+        "reflect": false
+      },
+      "color": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "Color",
+          "resolved": "\"danger\" | \"dark\" | \"default\" | \"light\" | \"medium\" | \"primary\" | \"secondary\" | \"success\" | \"tertiary\" | \"warning\" | undefined",
+          "references": {
+            "Color": {
+              "location": "import",
+              "path": "../../../model"
+            }
+          }
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "color",
+        "reflect": true
+      },
+      "looks": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "Looks",
+          "resolved": "\"border\" | \"grid\" | \"line\" | \"plain\"",
+          "references": {
+            "Looks": {
+              "location": "import",
+              "path": "../Looks"
+            }
+          }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "looks",
+        "reflect": true,
+        "defaultValue": "\"plain\""
+      },
+      "camera": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "\"front\" | \"back\"",
+          "resolved": "\"back\" | \"front\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "camera",
+        "reflect": true
+      },
+      "name": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "name",
+        "reflect": true
+      },
+      "showLabel": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "show-label",
+        "reflect": true,
+        "defaultValue": "true"
+      },
+      "value": {
+        "type": "unknown",
+        "mutable": true,
+        "complexType": {
+          "original": "File",
+          "resolved": "File | undefined",
+          "references": {
+            "File": {
+              "location": "global"
+            }
+          }
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        }
+      },
+      "placeholder": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "string | undefined",
+          "resolved": "string | undefined",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "placeholder",
+        "reflect": true
+      }
+    };
+  }
+  static get states() {
+    return {
+      "dragging": {}
+    };
+  }
+  static get events() {
+    return [{
+        "method": "smoothlyInputLooks",
+        "name": "smoothlyInputLooks",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "complexType": {
+          "original": "(looks: Looks, color: Color) => void",
+          "resolved": "(looks: Looks, color: Color) => void",
+          "references": {
+            "Looks": {
+              "location": "import",
+              "path": "../Looks"
+            },
+            "Color": {
+              "location": "import",
+              "path": "../../../model"
+            }
+          }
+        }
+      }, {
+        "method": "smoothlyInput",
+        "name": "smoothlyInput",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "complexType": {
+          "original": "Record<string, File>",
+          "resolved": "{ [x: string]: File; }",
+          "references": {
+            "Record": {
+              "location": "global"
+            },
+            "File": {
+              "location": "global"
+            }
+          }
+        }
+      }, {
+        "method": "smoothlyChange",
+        "name": "smoothlyChange",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "complexType": {
+          "original": "Record<string, File>",
+          "resolved": "{ [x: string]: File; }",
+          "references": {
+            "Record": {
+              "location": "global"
+            },
+            "File": {
+              "location": "global"
+            }
+          }
+        }
+      }];
+  }
+  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/input/file/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/input/file/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAgB,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAA;AAW5F,MAAM,OAAO,iBAAiB;;IACrB,aAAQ,GAAiB,IAAI,YAAY,EAAE,CAAA;oBAE/B,KAAK;;;iBAG8B,OAAO;;;qBAGzB,IAAI;;;;EAOzC,iBAAiB;IAChB,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,CAAC,KAAK,EAAE,KAAK,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC,CAAC,CAAC,CAAA;EAC5G,CAAC;EAGD,KAAK,CAAC,KAAK;IACV,IAAI,CAAC,KAAK,GAAG,SAAS,CAAA;EACvB,CAAC;EACD,MAAM;;IACL,OAAO,CACN,EAAC,IAAI,IACJ,KAAK,EAAE,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,EAClC,UAAU,EAAE,CAAC,KAAY,EAAE,EAAE,CAAC,CAAC,KAAK,CAAC,cAAc,EAAE,EAAE,KAAK,CAAC,eAAe,EAAE,CAAC,EAC/E,WAAW,EAAE,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;MACzC;QACC,YAAM,IAAI,EAAE,OAAO,GAAI,CAChB;MACR,WAAK,KAAK,EAAC,OAAO;QACjB,uBACC,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,IAAI,EAAE,OAAO,EACb,IAAI,EAAC,UAAU,EACf,OAAO,EAAE,KAAK,CAAC,EAAE,WAAC,OAAA,CAAC,KAAK,CAAC,eAAe,EAAE,EAAE,MAAA,IAAI,CAAC,KAAK,0CAAE,KAAK,EAAE,CAAC,CAAA,EAAA;UAChE,YAAM,IAAI,EAAE,QAAQ,GAAI,CACP;QAClB,YAAM,OAAO,EAAE,KAAK,CAAC,EAAE,WAAC,OAAA,CAAC,KAAK,CAAC,eAAe,EAAE,EAAE,MAAA,IAAI,CAAC,KAAK,0CAAE,KAAK,EAAE,CAAC,CAAA,EAAA,IACpE,MAAA,MAAA,IAAI,CAAC,KAAK,0CAAE,IAAI,mCAAI,IAAI,CAAC,WAAW,CAC/B;QACP,WACC,KAAK,EAAE,MAAM,EACb,MAAM,EAAE,KAAK,CAAC,EAAE;;YAAC,OAAA,CAChB,KAAK,CAAC,cAAc,EAAE;cACtB,KAAK,CAAC,eAAe,EAAE;cACvB,CAAC,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;cACvB,CAAA,MAAA,KAAK,CAAC,YAAY,0CAAE,KAAK,CAAC,MAAM;gBAC/B,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;kBACrF,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CACvF,CAAA;WAAA,EACD,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,CAAC,KAAK,CAAC,eAAe,EAAE,EAAE,CAAC,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC,CAAC,GACvE;QACF,aACC,GAAG,EAAE,OAAO,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,KAAK,GAAG,OAAO,CAAC,EACtC,IAAI,EAAE,MAAM,EACZ,OAAO,EAAE,IAAI,CAAC,MAAM,IAAI,MAAM,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,MAAM,EACvD,MAAM,EAAE,MAAA,IAAI,CAAC,MAAM,mCAAI,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,YAAY,CAAC,EAChE,KAAK,EACJ,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,KAAK,EAAE,EAAE,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,EAEtG,OAAO,EAAE,KAAK,CAAC,EAAE;;YAAC,OAAA,CACjB,KAAK,CAAC,eAAe,EAAE;cACvB,CAAA,MAAA,MAAA,IAAI,CAAC,KAAK,0CAAE,KAAK,0CAAE,MAAM,KAAI,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,GAAG,MAAA,IAAI,CAAC,KAAK,0CAAE,KAAK,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAC1G,CAAA;WAAA,EACD,QAAQ,EAAE,KAAK,CAAC,EAAE;;YAAC,OAAA,CAClB,KAAK,CAAC,eAAe,EAAE;cACvB,CAAA,MAAA,MAAA,IAAI,CAAC,KAAK,0CAAE,KAAK,0CAAE,MAAM;gBACxB,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,GAAG,MAAA,IAAI,CAAC,KAAK,0CAAE,KAAK,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAC/E,CAAA;WAAA,GACA,CACG;MACN,eAAQ,CACF,CACP,CAAA;EACF,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACD","sourcesContent":["import { Component, Event, EventEmitter, h, Host, Method, Prop, State } from \"@stencil/core\"\nimport { Color } from \"../../../model\"\nimport { Clearable } from \"../Clearable\"\nimport { Input } from \"../Input\"\nimport { Looks } from \"../Looks\"\n\n@Component({\n\ttag: \"smoothly-input-file\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyInputFile implements Clearable, Input {\n\tprivate transfer: DataTransfer = new DataTransfer()\n\tprivate input?: HTMLInputElement\n\t@State() dragging = false\n\t@Prop() accept?: string\n\t@Prop({ reflect: true, mutable: true }) color?: Color\n\t@Prop({ reflect: true, mutable: true }) looks: Looks = \"plain\"\n\t@Prop({ reflect: true }) camera: \"front\" | \"back\"\n\t@Prop({ reflect: true }) name: string\n\t@Prop({ reflect: true }) showLabel = true\n\t@Prop({ mutable: true }) value?: File\n\t@Prop({ mutable: true, reflect: true }) placeholder: string | undefined\n\t@Event() smoothlyInputLooks: EventEmitter<(looks: Looks, color: Color) => void>\n\t@Event() smoothlyInput: EventEmitter<Record<string, File>>\n\t@Event() smoothlyChange: EventEmitter<Record<string, File>>\n\n\tcomponentWillLoad() {\n\t\tthis.smoothlyInputLooks.emit((looks, color) => ((this.looks = looks), !this.color && (this.color = color)))\n\t}\n\n\t@Method()\n\tasync clear(): Promise<void> {\n\t\tthis.value = undefined\n\t}\n\trender() {\n\t\treturn (\n\t\t\t<Host\n\t\t\t\tclass={{ dragging: this.dragging }}\n\t\t\t\tonDragOver={(event: Event) => (event.preventDefault(), event.stopPropagation())}\n\t\t\t\tonDragEnter={() => (this.dragging = true)}>\n\t\t\t\t<label>\n\t\t\t\t\t<slot name={\"label\"} />\n\t\t\t\t</label>\n\t\t\t\t<div class=\"input\">\n\t\t\t\t\t<smoothly-button\n\t\t\t\t\t\tcolor={this.color}\n\t\t\t\t\t\tfill={\"clear\"}\n\t\t\t\t\t\tsize=\"flexible\"\n\t\t\t\t\t\tonClick={event => (event.stopPropagation(), this.input?.click())}>\n\t\t\t\t\t\t<slot name={\"button\"} />\n\t\t\t\t\t</smoothly-button>\n\t\t\t\t\t<span onClick={event => (event.stopPropagation(), this.input?.click())}>\n\t\t\t\t\t\t{this.value?.name ?? this.placeholder}\n\t\t\t\t\t</span>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclass={\"mask\"}\n\t\t\t\t\t\tonDrop={event => (\n\t\t\t\t\t\t\tevent.preventDefault(),\n\t\t\t\t\t\t\tevent.stopPropagation(),\n\t\t\t\t\t\t\t(this.dragging = false),\n\t\t\t\t\t\t\tevent.dataTransfer?.files.length &&\n\t\t\t\t\t\t\t\t(this.smoothlyInput.emit({ [this.name]: (this.value = event.dataTransfer.files[0]) }),\n\t\t\t\t\t\t\t\tthis.smoothlyChange.emit({ [this.name]: (this.value = event.dataTransfer.files[0]) }))\n\t\t\t\t\t\t)}\n\t\t\t\t\t\tonDragLeave={event => (event.stopPropagation(), (this.dragging = false))}\n\t\t\t\t\t/>\n\t\t\t\t\t<input\n\t\t\t\t\t\tref={element => (this.input = element)}\n\t\t\t\t\t\ttype={\"file\"}\n\t\t\t\t\t\tcapture={this.camera == \"back\" ? \"environment\" : \"user\"}\n\t\t\t\t\t\taccept={this.accept ?? (!this.camera ? undefined : \"image/jpeg\")}\n\t\t\t\t\t\tfiles={\n\t\t\t\t\t\t\t(this.transfer.items.clear(), this.value && this.transfer.items.add(this.value), this.transfer.files)\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonInput={event => (\n\t\t\t\t\t\t\tevent.stopPropagation(),\n\t\t\t\t\t\t\tthis.input?.files?.length && this.smoothlyInput.emit({ [this.name]: (this.value = this.input?.files[0]) })\n\t\t\t\t\t\t)}\n\t\t\t\t\t\tonChange={event => (\n\t\t\t\t\t\t\tevent.stopPropagation(),\n\t\t\t\t\t\t\tthis.input?.files?.length &&\n\t\t\t\t\t\t\t\tthis.smoothlyChange.emit({ [this.name]: (this.value = this.input?.files[0]) })\n\t\t\t\t\t\t)}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t\t<slot />\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"]}

package/dist/collection/components/input/file/style.css

@@ -0,0 +1,85 @@
+:host {
+	box-sizing: border-box;
+}
+:host[looks="border"]::slotted(smoothly-picker-menu smoothly-input),
+:host[looks="border"] {
+	border: rgb(var(--text-color, var(--smoothly-color-contrast))) solid 1px;
+}
+:host[looks="line"]::slotted(smoothly-picker-menu smoothly-input),
+:host[looks="line"] {
+	border-bottom: rgb(var(--text-color, var(--smoothly-color-contrast))) solid 1px;
+}
+:host[looks="grid"]::slotted(smoothly-picker-menu smoothly-input),
+:host[looks="grid"] {
+	border: rgba(var(--text-color, var(--smoothly-color-contrast)), .5) solid .5px;
+}
+
+
+:host {
+	display: flex;
+	align-items: center;
+	flex-wrap: wrap;
+	overflow: hidden;
+	position: relative;
+	width: 100%;
+	padding-left: 0.4rem;
+		background-color: rgb(var(--background-color,var(--smoothly-color-shade)))
+}
+.mask {
+	position: absolute;
+	top: 0;
+	bottom: 0;
+	left: 0;
+	right: 0;
+	background-color: rgb(var(--text-color ,var(--smoothly-color-contrast)), 0.3);
+}
+
+:host:not(.dragging) .mask {
+	display: none;
+}
+input {
+	overflow: hidden;
+	height: 0;
+	width: 0;
+	padding:0
+}
+.input {
+	display: flex;
+	align-items:center;
+	padding-left: 0.4rem;
+	padding-bottom: 0.2rem;
+}
+smoothly-button {
+	margin: 0;
+	border: none;
+}
+label {
+	padding-left: 0.4rem;
+	padding-top: 0.4rem;
+	display: flex;
+	width: 100%;
+	align-items: baseline;
+	justify-content: flex-start;
+	color: rgb(var(--text-color, var(--smoothly-color-contrast)));
+	cursor: inherit;
+
+}
+label::slotted(*) {
+	display: block;
+	width: 100%;
+	font-size: 0.65em;
+	opacity: 0.8;
+}
+:host:not([show-label]) label {
+	display: none;
+}
+smoothly-icon {
+	display: none;
+	position: absolute;
+	right: 0.2em;
+	top: 0.6em;
+}
+span {
+	cursor: pointer;
+	padding-left: 0.5rem;
+}