smoothly 1.0.0 → 1.0.1-alpha.1

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

@@ -5,7 +5,7 @@ export class SmoothlyInputDemo {
     this.duration = { hours: 8 };
   }
   render() {
-    return (h(Host, null, h("h2", null, "Select"), h("div", { class: "select-div" }, h("smoothly-input-select", { name: "select-dessert", looks: "border", onSmoothlyInput: e => console.log(e.detail) }, h("label", { slot: "label" }, "Select with reset button"), h("smoothly-item", { value: "1" }, "Ice cream"), h("smoothly-item", { value: "2" }, "Sponge cake"), h("smoothly-item", { value: "3" }, "Cookie"), h("smoothly-item", { value: "4" }, "Croissant"), h("smoothly-item", { value: "5" }, "Chocolate fondue"), h("smoothly-input-reset", { size: "icon", slot: "end" }, h("smoothly-icon", { name: "refresh-outline" }))), h("smoothly-input-select", { multiple: true, name: "select-dessert-multiple", looks: "border", onSmoothlyInput: e => console.log(e.detail) }, h("label", { slot: "label" }, "Select multiple with reset button"), h("smoothly-item", { value: "ice cream" }, "Ice cream"), h("smoothly-item", { value: "sponge cake" }, "Sponge cake"), h("smoothly-item", { selected: true, value: "cookie" }, "Cookie"), h("smoothly-item", { value: "croissant" }, "Croissant"), h("smoothly-item", { selected: true, value: "chocolate fondue" }, "Chocolate fondue"), h("smoothly-input-reset", { size: "icon", slot: "end" }, h("smoothly-icon", { name: "refresh-outline" }))), h("smoothly-input-select", { name: "select-icon", clearable: false, showSelected: false, onSmoothlyInput: e => console.log("Form Readonly", e.detail) }, h("smoothly-item", { value: "folder", selected: true }, h("smoothly-icon", { size: "small", name: "folder-outline" })), h("smoothly-item", { value: "camera" }, h("smoothly-icon", { size: "small", name: "camera-outline" })))), h("h2", null, "Delayed"), h("smoothly-input", { name: "Delayed", delay: 2 }, "Delayed"), h("h2", null, "Editable form and Input with Clear and Reset - Readonly"), h("smoothly-form", { looks: "grid", type: "create", readonly: true, action: "https://api.toiletapi.com/upload/6b12fd2f-e896-46f9-b38f-25cf42cee4b4" }, h("smoothly-input", { readonly: true, name: "First Name", value: "John" }, "First name"), h("smoothly-input", { name: "Last name", value: "Doe" }, "Last name", h("smoothly-input-clear", { size: "icon", slot: "end" }, h("smoothly-icon", { name: "close" }))), h("smoothly-input", { type: "phone", name: "Phone", value: "777888999" }, "Phone", h("smoothly-input-reset", { size: "icon", slot: "end" }, h("smoothly-icon", { name: "refresh-outline" }))), h("smoothly-input-radio", { clearable: true, name: "radioFirstInput" }, h("p", { slot: "label" }, "Clearable"), h("smoothly-input-radio-item", { slot: "options", value: "first" }, "Label 1"), h("smoothly-input-radio-item", { selected: true, slot: "options", value: "second" }, "Label 2"), h("smoothly-input-radio-item", { slot: "options", value: "third" }, "Label 3")), h("smoothly-input-select", { menuHeight: "7.5items", placeholder: "Select...", multiple: true, name: "select-month" }, h("label", { slot: "label" }, "Month"), h("smoothly-item", { value: "1" }, "January"), h("smoothly-item", { value: "2" }, "February"), h("smoothly-item", { value: "3" }, "March"), h("smoothly-item", { value: "4" }, "April"), h("smoothly-item", { value: "5" }, "May"), h("smoothly-item", { value: "6" }, "June"), h("smoothly-item", { value: "7" }, "July"), h("smoothly-item", { value: "8" }, "August"), h("smoothly-item", { value: "9" }, "September"), h("smoothly-item", { value: "10" }, "October"), h("smoothly-item", { value: "11" }, "November"), h("smoothly-item", { value: "12" }, "December")), h("smoothly-input-select", { name: "select-icon", clearable: false, showSelected: false }, h("smoothly-item", { value: "folder", selected: true }, h("smoothly-icon", { size: "small", name: "folder-outline" })), h("smoothly-item", { value: "camera" }, h("smoothly-icon", { size: "small", name: "camera-outline" }))), h("smoothly-input-checkbox", { name: "checkbox" }, "Check the box"), h("smoothly-input-checkbox", { name: "checkbox2", checked: true }, "Check the box 2"), h("smoothly-input-range", { step: 1, name: "range3", value: 20000 }, "Select"), h("smoothly-picker", { multiple: true, name: "animals" }, h("span", { slot: "label" }, "Animals"), h("span", { slot: "search" }, "Search"), h("smoothly-picker-option", { selected: true, value: "cat" }, "Cat"), h("smoothly-picker-option", { value: "dog" }, "Dog"), h("smoothly-picker-option", { value: "fish" }, "Fish")), h("smoothly-input-edit", { fill: "default", type: "button", color: "tertiary", slot: "edit", size: "icon", shape: "rounded" }), h("smoothly-input-reset", { fill: "default", type: "form", color: "warning", slot: "reset", size: "icon", shape: "rounded" }), h("smoothly-input-submit", { delete: true, slot: "clear", color: "danger", size: "icon", shape: "rounded" }), h("smoothly-input-submit", { fill: "default", type: "button", color: "success", slot: "submit", size: "icon", shape: "rounded" }, h("smoothly-icon", { name: "checkmark-outline", fill: "solid", size: "tiny" }))), h("h2", null, "Editable form and Input with Clear and Reset - Editable"), h("smoothly-form", { looks: "grid", type: "create", action: "https://api.toiletapi.com/upload/6b12fd2f-e896-46f9-b38f-25cf42cee4b4" }, h("smoothly-input", { readonly: true, name: "First Name", value: "John" }, "First name"), h("smoothly-input", { name: "Last name", value: "Doe" }, "Last name", h("smoothly-input-clear", { size: "icon", slot: "end" }, h("smoothly-icon", { name: "close" }))), h("smoothly-input", { type: "phone", name: "Phone", value: "777888999" }, "Phone", h("smoothly-input-reset", { size: "icon", slot: "end" }, h("smoothly-icon", { name: "refresh-outline" }))), h("smoothly-input-radio", { clearable: true, name: "radioFirstInput" }, h("p", { slot: "label" }, "Clearable"), h("smoothly-input-radio-item", { slot: "options", value: "first" }, "Label 1"), h("smoothly-input-radio-item", { selected: true, slot: "options", value: "second" }, "Label 2"), h("smoothly-input-radio-item", { slot: "options", value: "third" }, "Label 3")), h("smoothly-input-select", { multiple: true, menuHeight: "7.5items", placeholder: "Select...", name: "select-month" }, h("label", { slot: "label" }, "Month multiple select"), h("smoothly-item", { value: "1" }, "January"), h("smoothly-item", { value: "2" }, "February"), h("smoothly-item", { value: "3" }, "March"), h("smoothly-item", { value: "4" }, "April"), h("smoothly-item", { value: "5" }, "May"), h("smoothly-item", { value: "6" }, "June"), h("smoothly-item", { value: "7" }, "July"), h("smoothly-item", { value: "8" }, "August"), h("smoothly-item", { value: "9" }, "September"), h("smoothly-item", { value: "10" }, "October"), h("smoothly-item", { value: "11" }, "November"), h("smoothly-item", { value: "12" }, "December")), h("smoothly-input-select", { name: "select-icon", clearable: false, showSelected: false }, h("smoothly-item", { value: "folder", selected: true }, h("smoothly-icon", { size: "small", name: "folder-outline" })), h("smoothly-item", { value: "camera" }, h("smoothly-icon", { size: "small", name: "camera-outline" }))), h("smoothly-input-checkbox", { name: "checkbox" }, "Check the box"), h("smoothly-input-checkbox", { name: "checkbox2", checked: true }, "Check the box 2"), h("smoothly-input-range", { step: 1, name: "range3", value: 20000 }, "Select"), h("smoothly-picker", { multiple: true, name: "animals" }, h("span", { slot: "label" }, "Animals"), h("span", { slot: "search" }, "Search"), h("smoothly-picker-option", { selected: true, value: "cat" }, "Cat"), h("smoothly-picker-option", { value: "dog" }, "Dog"), h("smoothly-picker-option", { value: "fish" }, "Fish")), h("smoothly-input-edit", { fill: "default", type: "button", color: "tertiary", slot: "edit", size: "icon", shape: "rounded" }), h("smoothly-input-reset", { fill: "default", type: "form", color: "warning", slot: "reset", size: "icon", shape: "rounded" }), h("smoothly-input-submit", { delete: true, slot: "clear", color: "danger", size: "icon", shape: "rounded" }), h("smoothly-input-submit", { fill: "default", type: "button", color: "success", slot: "submit", size: "icon", shape: "rounded" }, h("smoothly-icon", { name: "checkmark-outline", fill: "solid", size: "tiny" }))), h("h2", null, "Color"), h("smoothly-form", { looks: "border" }, h("smoothly-input-color", { name: "color" })), h("h2", null, "Range"), h("smoothly-form", { looks: "border" }, h("smoothly-input-range", { step: 1, name: "range", outputSide: "right" }, "Select and so"), h("smoothly-input-range", { step: 1, name: "range2" }, "Select with really really long label", h("smoothly-icon", { name: "checkmark-circle", slot: "start" }), h("smoothly-input-clear", { size: "icon", slot: "end" }, h("smoothly-icon", { name: "close" }))), h("smoothly-input-range", { step: 1, name: "range3" }, "Select")), h("h2", null, "Duration"), h("smoothly-form", { looks: "border" }, h("smoothly-input", { name: "duration", type: "duration", placeholder: "hh:mm", value: this.duration, onSmoothlyInput: e => {
+    return (h(Host, null, h("h2", null, "Controlled form"), h("smoothly-input-demo-controlled-form", null), h("h2", null, "Create form defaulting type"), h("smoothly-form", { looks: "line", action: "https://api.toiletapi.com/6b12fd2f-e896-46f9-b38f-25cf42cee4b4" }, h("smoothly-input", { type: "text", name: "name" }, "Name"), h("smoothly-input-reset", { slot: "reset", type: "form", size: "icon", color: "warning", fill: "default" }), h("smoothly-input-submit", { slot: "submit", size: "icon", color: "success" })), h("h2", null, "Select"), h("div", { class: "select-div" }, h("smoothly-input-select", { name: "select-dessert", looks: "border", onSmoothlyInput: e => console.log(e.detail) }, h("label", { slot: "label" }, "Select with reset button"), h("smoothly-item", { value: "1" }, "Ice cream"), h("smoothly-item", { value: "2" }, "Sponge cake"), h("smoothly-item", { value: "3" }, "Cookie"), h("smoothly-item", { value: "4" }, "Croissant"), h("smoothly-item", { value: "5" }, "Chocolate fondue"), h("smoothly-input-reset", { size: "icon", slot: "end" }, h("smoothly-icon", { name: "refresh-outline" }))), h("smoothly-input-select", { multiple: true, name: "select-dessert-multiple", looks: "border", onSmoothlyInput: e => console.log(e.detail) }, h("label", { slot: "label" }, "Select multiple with reset button"), h("smoothly-item", { value: "ice cream" }, "Ice cream"), h("smoothly-item", { value: "sponge cake" }, "Sponge cake"), h("smoothly-item", { selected: true, value: "cookie" }, "Cookie"), h("smoothly-item", { value: "croissant" }, "Croissant"), h("smoothly-item", { selected: true, value: "chocolate fondue" }, "Chocolate fondue"), h("smoothly-input-reset", { size: "icon", slot: "end" }, h("smoothly-icon", { name: "refresh-outline" }))), h("smoothly-input-select", { name: "select-icon", clearable: false, showSelected: false, onSmoothlyInput: e => console.log("Form Readonly", e.detail) }, h("smoothly-item", { value: "folder", selected: true }, h("smoothly-icon", { size: "small", name: "folder-outline" })), h("smoothly-item", { value: "camera" }, h("smoothly-icon", { size: "small", name: "camera-outline" })))), h("h2", null, "Delayed"), h("smoothly-input", { name: "Delayed", delay: 2 }, "Delayed"), h("h2", null, "Editable form and Input with Clear and Reset - Readonly"), h("smoothly-form", { looks: "grid", readonly: true, action: "https://api.toiletapi.com/6b12fd2f-e896-46f9-b38f-25cf42cee4b4" }, h("smoothly-input", { readonly: true, name: "First Name", value: "John" }, "First name"), h("smoothly-input", { name: "Last name", value: "Doe" }, "Last name", h("smoothly-input-clear", { size: "icon", slot: "end" }, h("smoothly-icon", { name: "close" }))), h("smoothly-input", { type: "phone", name: "Phone", value: "777888999" }, "Phone", h("smoothly-input-reset", { size: "icon", slot: "end" }, h("smoothly-icon", { name: "refresh-outline" }))), h("smoothly-input-radio", { clearable: true, name: "radioFirstInput" }, h("p", { slot: "label" }, "Clearable"), h("smoothly-input-radio-item", { slot: "options", value: "first" }, "Label 1"), h("smoothly-input-radio-item", { selected: true, slot: "options", value: "second" }, "Label 2"), h("smoothly-input-radio-item", { slot: "options", value: "third" }, "Label 3")), h("smoothly-input-select", { menuHeight: "7.5items", placeholder: "Select...", multiple: true, name: "select-month" }, h("label", { slot: "label" }, "Month"), h("smoothly-item", { value: "1" }, "January"), h("smoothly-item", { value: "2" }, "February"), h("smoothly-item", { value: "3" }, "March"), h("smoothly-item", { value: "4" }, "April"), h("smoothly-item", { value: "5" }, "May"), h("smoothly-item", { value: "6" }, "June"), h("smoothly-item", { value: "7" }, "July"), h("smoothly-item", { value: "8" }, "August"), h("smoothly-item", { value: "9" }, "September"), h("smoothly-item", { value: "10" }, "October"), h("smoothly-item", { value: "11" }, "November"), h("smoothly-item", { value: "12" }, "December")), h("smoothly-input-select", { name: "select-icon", clearable: false, showSelected: false }, h("smoothly-item", { value: "folder", selected: true }, h("smoothly-icon", { size: "small", name: "folder-outline" })), h("smoothly-item", { value: "camera" }, h("smoothly-icon", { size: "small", name: "camera-outline" }))), h("smoothly-input-checkbox", { name: "checkbox" }, "Check the box"), h("smoothly-input-checkbox", { name: "checkbox2", checked: true }, "Check the box 2"), h("smoothly-input-range", { step: 1, name: "range3", value: 20000 }, "Select"), h("smoothly-picker", { multiple: true, name: "animals" }, h("span", { slot: "label" }, "Animals"), h("span", { slot: "search" }, "Search"), h("smoothly-picker-option", { selected: true, value: "cat" }, "Cat"), h("smoothly-picker-option", { value: "dog" }, "Dog"), h("smoothly-picker-option", { value: "fish" }, "Fish")), h("smoothly-input-edit", { fill: "default", type: "button", color: "tertiary", slot: "edit", size: "icon", shape: "rounded" }), h("smoothly-input-reset", { fill: "default", type: "form", color: "warning", slot: "reset", size: "icon", shape: "rounded" }), h("smoothly-input-submit", { delete: true, slot: "clear", color: "danger", size: "icon", shape: "rounded" }), h("smoothly-input-submit", { fill: "default", type: "button", color: "success", slot: "submit", size: "icon", shape: "rounded" }, h("smoothly-icon", { name: "checkmark-outline", fill: "solid", size: "tiny" }))), h("h2", null, "Editable form and Input with Clear and Reset - Editable"), h("smoothly-form", { looks: "grid", type: "create", action: "https://api.toiletapi.com/upload/6b12fd2f-e896-46f9-b38f-25cf42cee4b4" }, h("smoothly-input", { readonly: true, name: "First Name", value: "John" }, "First name"), h("smoothly-input", { name: "Last name", value: "Doe" }, "Last name", h("smoothly-input-clear", { size: "icon", slot: "end" }, h("smoothly-icon", { name: "close" }))), h("smoothly-input", { type: "phone", name: "Phone", value: "777888999" }, "Phone", h("smoothly-input-reset", { size: "icon", slot: "end" }, h("smoothly-icon", { name: "refresh-outline" }))), h("smoothly-input-radio", { clearable: true, name: "radioFirstInput" }, h("p", { slot: "label" }, "Clearable"), h("smoothly-input-radio-item", { slot: "options", value: "first" }, "Label 1"), h("smoothly-input-radio-item", { selected: true, slot: "options", value: "second" }, "Label 2"), h("smoothly-input-radio-item", { slot: "options", value: "third" }, "Label 3")), h("smoothly-input-select", { multiple: true, menuHeight: "7.5items", placeholder: "Select...", name: "select-month" }, h("label", { slot: "label" }, "Month multiple select"), h("smoothly-item", { value: "1" }, "January"), h("smoothly-item", { value: "2" }, "February"), h("smoothly-item", { value: "3" }, "March"), h("smoothly-item", { value: "4" }, "April"), h("smoothly-item", { value: "5" }, "May"), h("smoothly-item", { value: "6" }, "June"), h("smoothly-item", { value: "7" }, "July"), h("smoothly-item", { value: "8" }, "August"), h("smoothly-item", { value: "9" }, "September"), h("smoothly-item", { value: "10" }, "October"), h("smoothly-item", { value: "11" }, "November"), h("smoothly-item", { value: "12" }, "December")), h("smoothly-input-select", { name: "select-icon", clearable: false, showSelected: false }, h("smoothly-item", { value: "folder", selected: true }, h("smoothly-icon", { size: "small", name: "folder-outline" })), h("smoothly-item", { value: "camera" }, h("smoothly-icon", { size: "small", name: "camera-outline" }))), h("smoothly-input-checkbox", { name: "checkbox" }, "Check the box"), h("smoothly-input-checkbox", { name: "checkbox2", checked: true }, "Check the box 2"), h("smoothly-input-range", { step: 1, name: "range3", value: 20000 }, "Select"), h("smoothly-picker", { multiple: true, name: "animals" }, h("span", { slot: "label" }, "Animals"), h("span", { slot: "search" }, "Search"), h("smoothly-picker-option", { selected: true, value: "cat" }, "Cat"), h("smoothly-picker-option", { value: "dog" }, "Dog"), h("smoothly-picker-option", { value: "fish" }, "Fish")), h("smoothly-input-edit", { fill: "default", type: "button", color: "tertiary", slot: "edit", size: "icon", shape: "rounded" }), h("smoothly-input-reset", { fill: "default", type: "form", color: "warning", slot: "reset", size: "icon", shape: "rounded" }), h("smoothly-input-submit", { delete: true, slot: "clear", color: "danger", size: "icon", shape: "rounded" }), h("smoothly-input-submit", { fill: "default", type: "button", color: "success", slot: "submit", size: "icon", shape: "rounded" }, h("smoothly-icon", { name: "checkmark-outline", fill: "solid", size: "tiny" }))), h("h2", null, "Color"), h("smoothly-form", { looks: "border" }, h("smoothly-input-color", { name: "color" })), h("h2", null, "Range"), h("smoothly-form", { looks: "border" }, h("smoothly-input-range", { step: 1, name: "range", outputSide: "right" }, "Select and so"), h("smoothly-input-range", { step: 1, name: "range2" }, "Select with really really long label", h("smoothly-icon", { name: "checkmark-circle", slot: "start" }), h("smoothly-input-clear", { size: "icon", slot: "end" }, h("smoothly-icon", { name: "close" }))), h("smoothly-input-range", { step: 1, name: "range3" }, "Select")), h("h2", null, "Duration"), h("smoothly-form", { looks: "border" }, h("smoothly-input", { name: "duration", type: "duration", placeholder: "hh:mm", value: this.duration, onSmoothlyInput: e => {
         const duration = e.detail.duration;
         console.log("event duration", duration);
         this.duration = duration;
@@ -21,7 +21,7 @@ export class SmoothlyInputDemo {
         "--border-radius": "4px",
         "--padding": "0 0.75em",
         "--input-width": "12ch",
-      } }), h("smoothly-input-date", { name: "date", value: "2021-10-28", max: "2021-12-30", min: "2021-10-10" }, "Date"), h("smoothly-submit", { slot: "submit", color: "success", fill: "solid", size: "icon" }, h("smoothly-icon", { name: "checkmark-circle", fill: "solid", size: "medium" }))), h("h4", null, "Form with spinner showcase"), h("smoothly-form", { looks: "line", processing: true, onSmoothlyFormSubmit: e => console.log("form input", e.detail) }, h("smoothly-input", { name: "text" }, "Input"), h("smoothly-input-file", { camera: "back", placeholder: "Capture a photo", name: "image" }, h("span", { slot: "label" }, "Testing camera photo"), h("smoothly-icon", { slot: "button", name: "camera-outline" })), h("smoothly-picker", { name: "picker" }, h("span", { slot: "label" }, "Shape"), h("span", { slot: "search" }, "Search"), h("smoothly-picker-option", { value: "circle" }, h("span", { slot: "label" }, "Circle"), h("smoothly-icon", { size: "tiny", name: "ellipse-outline" })), h("smoothly-picker-option", { value: "cube" }, h("span", { slot: "label" }, "Cube"), h("smoothly-icon", { size: "tiny", name: "cube-outline" })), h("smoothly-picker-option", { value: "square", selected: true }, h("span", { slot: "label" }, "Square"), h("smoothly-icon", { size: "tiny", name: "square-outline" }))), h("smoothly-input-select", { name: "select", placeholder: "Select..." }, h("smoothly-item", { value: "1" }, "January"), h("smoothly-item", { value: "2" }, "February"), h("smoothly-item", { value: "3" }, "March"), h("smoothly-item", { value: "4" }, "April"), h("smoothly-item", { value: "5" }, "May"), h("smoothly-item", { value: "6" }, "June"), h("smoothly-item", { value: "7" }, "July"), h("smoothly-item", { value: "8" }, "August"), h("smoothly-item", { value: "9" }, "September"), h("smoothly-item", { value: "10" }, "October"), h("smoothly-item", { value: "11" }, "November"), h("smoothly-item", { value: "12" }, "December")), h("smoothly-input-date-range", { name: "date-range", start: isoly.Date.now(), end: isoly.Date.nextMonth(isoly.Date.now()), min: "2021-10-10", max: "2025-12-30", showLabel: false, style: {
+      } }), h("smoothly-input-date", { name: "date", value: "2021-10-28", max: "2021-12-30", min: "2021-10-10" }, "Date"), h("smoothly-submit", { slot: "submit", color: "success", fill: "solid", size: "icon" }, h("smoothly-icon", { name: "checkmark-circle", fill: "solid", size: "medium" }))), h("h4", null, "Form with spinner showcase"), h("smoothly-form", { looks: "line", onSmoothlyFormSubmit: e => console.log("form input", e.detail) }, h("smoothly-input", { name: "text" }, "Input"), h("smoothly-input-file", { camera: "back", placeholder: "Capture a photo", name: "image" }, h("span", { slot: "label" }, "Testing camera photo"), h("smoothly-icon", { slot: "button", name: "camera-outline" })), h("smoothly-picker", { name: "picker" }, h("span", { slot: "label" }, "Shape"), h("span", { slot: "search" }, "Search"), h("smoothly-picker-option", { value: "circle" }, h("span", { slot: "label" }, "Circle"), h("smoothly-icon", { size: "tiny", name: "ellipse-outline" })), h("smoothly-picker-option", { value: "cube" }, h("span", { slot: "label" }, "Cube"), h("smoothly-icon", { size: "tiny", name: "cube-outline" })), h("smoothly-picker-option", { value: "square", selected: true }, h("span", { slot: "label" }, "Square"), h("smoothly-icon", { size: "tiny", name: "square-outline" }))), h("smoothly-input-select", { name: "select", placeholder: "Select..." }, h("smoothly-item", { value: "1" }, "January"), h("smoothly-item", { value: "2" }, "February"), h("smoothly-item", { value: "3" }, "March"), h("smoothly-item", { value: "4" }, "April"), h("smoothly-item", { value: "5" }, "May"), h("smoothly-item", { value: "6" }, "June"), h("smoothly-item", { value: "7" }, "July"), h("smoothly-item", { value: "8" }, "August"), h("smoothly-item", { value: "9" }, "September"), h("smoothly-item", { value: "10" }, "October"), h("smoothly-item", { value: "11" }, "November"), h("smoothly-item", { value: "12" }, "December")), h("smoothly-input-date-range", { name: "date-range", start: isoly.Date.now(), end: isoly.Date.nextMonth(isoly.Date.now()), min: "2021-10-10", max: "2025-12-30", showLabel: false, style: {
         "--border-radius": "4px",
         "--padding": "0 0.75em",
         "--input-width": "12ch",

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/input/demo/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Host, State } from \"@stencil/core\"\nimport { isoly } from \"isoly\"\n\n@Component({\n\ttag: \"smoothly-input-demo\",\n\tstyleUrl: \"style.css\",\n})\nexport class SmoothlyInputDemo {\n\t@State() duration: isoly.TimeSpan = { hours: 8 }\n\n\trender() {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<h2>Select</h2>\n\t\t\t\t<div class=\"select-div\">\n\t\t\t\t\t<smoothly-input-select name=\"select-dessert\" looks=\"border\" onSmoothlyInput={e => console.log(e.detail)}>\n\t\t\t\t\t\t<label slot=\"label\">Select with reset button</label>\n\t\t\t\t\t\t<smoothly-item value=\"1\">Ice cream</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"2\">Sponge cake</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"3\">Cookie</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"4\">Croissant</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"5\">Chocolate fondue</smoothly-item>\n\t\t\t\t\t\t<smoothly-input-reset size=\"icon\" slot=\"end\">\n\t\t\t\t\t\t\t<smoothly-icon name=\"refresh-outline\" />\n\t\t\t\t\t\t</smoothly-input-reset>\n\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t<smoothly-input-select\n\t\t\t\t\t\tmultiple\n\t\t\t\t\t\tname=\"select-dessert-multiple\"\n\t\t\t\t\t\tlooks=\"border\"\n\t\t\t\t\t\tonSmoothlyInput={e => console.log(e.detail)}>\n\t\t\t\t\t\t<label slot=\"label\">Select multiple with reset button</label>\n\t\t\t\t\t\t<smoothly-item value=\"ice cream\">Ice cream</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"sponge cake\">Sponge cake</smoothly-item>\n\t\t\t\t\t\t<smoothly-item selected value=\"cookie\">\n\t\t\t\t\t\t\tCookie\n\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"croissant\">Croissant</smoothly-item>\n\t\t\t\t\t\t<smoothly-item selected value=\"chocolate fondue\">\n\t\t\t\t\t\t\tChocolate fondue\n\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t<smoothly-input-reset size=\"icon\" slot=\"end\">\n\t\t\t\t\t\t\t<smoothly-icon name=\"refresh-outline\" />\n\t\t\t\t\t\t</smoothly-input-reset>\n\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t<smoothly-input-select\n\t\t\t\t\t\tname=\"select-icon\"\n\t\t\t\t\t\tclearable={false}\n\t\t\t\t\t\tshowSelected={false}\n\t\t\t\t\t\tonSmoothlyInput={e => console.log(\"Form Readonly\", e.detail)}>\n\t\t\t\t\t\t<smoothly-item value=\"folder\" selected>\n\t\t\t\t\t\t\t<smoothly-icon size=\"small\" name=\"folder-outline\" />\n\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"camera\">\n\t\t\t\t\t\t\t<smoothly-icon size=\"small\" name=\"camera-outline\" />\n\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t</div>\n\n\t\t\t\t<h2>Delayed</h2>\n\t\t\t\t<smoothly-input name=\"Delayed\" delay={2}>\n\t\t\t\t\tDelayed\n\t\t\t\t</smoothly-input>\n\t\t\t\t<h2>Editable form and Input with Clear and Reset - Readonly</h2>\n\t\t\t\t<smoothly-form\n\t\t\t\t\tlooks=\"grid\"\n\t\t\t\t\ttype=\"create\"\n\t\t\t\t\treadonly\n\t\t\t\t\taction=\"https://api.toiletapi.com/upload/6b12fd2f-e896-46f9-b38f-25cf42cee4b4\">\n\t\t\t\t\t<smoothly-input readonly name=\"First Name\" value=\"John\">\n\t\t\t\t\t\tFirst name\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input name=\"Last name\" value=\"Doe\">\n\t\t\t\t\t\tLast name\n\t\t\t\t\t\t<smoothly-input-clear size=\"icon\" slot=\"end\">\n\t\t\t\t\t\t\t<smoothly-icon name=\"close\" />\n\t\t\t\t\t\t</smoothly-input-clear>\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"phone\" name=\"Phone\" value={\"777888999\"}>\n\t\t\t\t\t\tPhone\n\t\t\t\t\t\t<smoothly-input-reset size=\"icon\" slot=\"end\">\n\t\t\t\t\t\t\t<smoothly-icon name=\"refresh-outline\" />\n\t\t\t\t\t\t</smoothly-input-reset>\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input-radio clearable name=\"radioFirstInput\">\n\t\t\t\t\t\t<p slot=\"label\">Clearable</p>\n\t\t\t\t\t\t<smoothly-input-radio-item slot=\"options\" value={\"first\"}>\n\t\t\t\t\t\t\tLabel 1\n\t\t\t\t\t\t</smoothly-input-radio-item>\n\t\t\t\t\t\t<smoothly-input-radio-item selected slot=\"options\" value={\"second\"}>\n\t\t\t\t\t\t\tLabel 2\n\t\t\t\t\t\t</smoothly-input-radio-item>\n\t\t\t\t\t\t<smoothly-input-radio-item slot=\"options\" value={\"third\"}>\n\t\t\t\t\t\t\tLabel 3\n\t\t\t\t\t\t</smoothly-input-radio-item>\n\t\t\t\t\t</smoothly-input-radio>\n\t\t\t\t\t<smoothly-input-select menuHeight=\"7.5items\" placeholder=\"Select...\" multiple name=\"select-month\">\n\t\t\t\t\t\t<label slot=\"label\">Month</label>\n\t\t\t\t\t\t<smoothly-item value=\"1\">January</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"2\">February</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"3\">March</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"4\">April</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"5\">May</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"6\">June</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"7\">July</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"8\">August</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"9\">September</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"10\">October</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"11\">November</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"12\">December</smoothly-item>\n\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t<smoothly-input-select name=\"select-icon\" clearable={false} showSelected={false}>\n\t\t\t\t\t\t<smoothly-item value=\"folder\" selected>\n\t\t\t\t\t\t\t<smoothly-icon size=\"small\" name=\"folder-outline\" />\n\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"camera\">\n\t\t\t\t\t\t\t<smoothly-icon size=\"small\" name=\"camera-outline\" />\n\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t<smoothly-input-checkbox name=\"checkbox\">Check the box</smoothly-input-checkbox>\n\t\t\t\t\t<smoothly-input-checkbox name=\"checkbox2\" checked>\n\t\t\t\t\t\tCheck the box 2\n\t\t\t\t\t</smoothly-input-checkbox>\n\t\t\t\t\t<smoothly-input-range step={1} name=\"range3\" value={20000}>\n\t\t\t\t\t\tSelect\n\t\t\t\t\t</smoothly-input-range>\n\t\t\t\t\t<smoothly-picker multiple name=\"animals\">\n\t\t\t\t\t\t<span slot=\"label\">Animals</span>\n\t\t\t\t\t\t<span slot=\"search\">Search</span>\n\t\t\t\t\t\t<smoothly-picker-option selected value={\"cat\"}>\n\t\t\t\t\t\t\tCat\n\t\t\t\t\t\t</smoothly-picker-option>\n\t\t\t\t\t\t<smoothly-picker-option value={\"dog\"}>Dog</smoothly-picker-option>\n\t\t\t\t\t\t<smoothly-picker-option value={\"fish\"}>Fish</smoothly-picker-option>\n\t\t\t\t\t</smoothly-picker>\n\t\t\t\t\t<smoothly-input-edit fill=\"default\" type=\"button\" color=\"tertiary\" slot=\"edit\" size=\"icon\" shape=\"rounded\" />\n\t\t\t\t\t<smoothly-input-reset fill=\"default\" type=\"form\" color=\"warning\" slot=\"reset\" size=\"icon\" shape=\"rounded\" />\n\t\t\t\t\t<smoothly-input-submit delete slot=\"clear\" color=\"danger\" size=\"icon\" shape=\"rounded\" />\n\t\t\t\t\t<smoothly-input-submit fill=\"default\" type=\"button\" color=\"success\" slot=\"submit\" size=\"icon\" shape=\"rounded\">\n\t\t\t\t\t\t<smoothly-icon name=\"checkmark-outline\" fill=\"solid\" size=\"tiny\" />\n\t\t\t\t\t</smoothly-input-submit>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h2>Editable form and Input with Clear and Reset - Editable</h2>\n\t\t\t\t<smoothly-form\n\t\t\t\t\tlooks=\"grid\"\n\t\t\t\t\ttype=\"create\"\n\t\t\t\t\taction=\"https://api.toiletapi.com/upload/6b12fd2f-e896-46f9-b38f-25cf42cee4b4\">\n\t\t\t\t\t<smoothly-input readonly name=\"First Name\" value=\"John\">\n\t\t\t\t\t\tFirst name\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input name=\"Last name\" value=\"Doe\">\n\t\t\t\t\t\tLast name\n\t\t\t\t\t\t<smoothly-input-clear size=\"icon\" slot=\"end\">\n\t\t\t\t\t\t\t<smoothly-icon name=\"close\" />\n\t\t\t\t\t\t</smoothly-input-clear>\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"phone\" name=\"Phone\" value={\"777888999\"}>\n\t\t\t\t\t\tPhone\n\t\t\t\t\t\t<smoothly-input-reset size=\"icon\" slot=\"end\">\n\t\t\t\t\t\t\t<smoothly-icon name=\"refresh-outline\" />\n\t\t\t\t\t\t</smoothly-input-reset>\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input-radio clearable name=\"radioFirstInput\">\n\t\t\t\t\t\t<p slot=\"label\">Clearable</p>\n\t\t\t\t\t\t<smoothly-input-radio-item slot=\"options\" value={\"first\"}>\n\t\t\t\t\t\t\tLabel 1\n\t\t\t\t\t\t</smoothly-input-radio-item>\n\t\t\t\t\t\t<smoothly-input-radio-item selected slot=\"options\" value={\"second\"}>\n\t\t\t\t\t\t\tLabel 2\n\t\t\t\t\t\t</smoothly-input-radio-item>\n\t\t\t\t\t\t<smoothly-input-radio-item slot=\"options\" value={\"third\"}>\n\t\t\t\t\t\t\tLabel 3\n\t\t\t\t\t\t</smoothly-input-radio-item>\n\t\t\t\t\t</smoothly-input-radio>\n\t\t\t\t\t<smoothly-input-select multiple menuHeight=\"7.5items\" placeholder=\"Select...\" name=\"select-month\">\n\t\t\t\t\t\t<label slot=\"label\">Month multiple select</label>\n\t\t\t\t\t\t<smoothly-item value=\"1\">January</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"2\">February</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"3\">March</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"4\">April</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"5\">May</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"6\">June</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"7\">July</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"8\">August</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"9\">September</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"10\">October</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"11\">November</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"12\">December</smoothly-item>\n\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t<smoothly-input-select name=\"select-icon\" clearable={false} showSelected={false}>\n\t\t\t\t\t\t<smoothly-item value=\"folder\" selected>\n\t\t\t\t\t\t\t<smoothly-icon size=\"small\" name=\"folder-outline\" />\n\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"camera\">\n\t\t\t\t\t\t\t<smoothly-icon size=\"small\" name=\"camera-outline\" />\n\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t<smoothly-input-checkbox name=\"checkbox\">Check the box</smoothly-input-checkbox>\n\t\t\t\t\t<smoothly-input-checkbox name=\"checkbox2\" checked>\n\t\t\t\t\t\tCheck the box 2\n\t\t\t\t\t</smoothly-input-checkbox>\n\t\t\t\t\t<smoothly-input-range step={1} name=\"range3\" value={20000}>\n\t\t\t\t\t\tSelect\n\t\t\t\t\t</smoothly-input-range>\n\t\t\t\t\t<smoothly-picker multiple name=\"animals\">\n\t\t\t\t\t\t<span slot=\"label\">Animals</span>\n\t\t\t\t\t\t<span slot=\"search\">Search</span>\n\t\t\t\t\t\t<smoothly-picker-option selected value={\"cat\"}>\n\t\t\t\t\t\t\tCat\n\t\t\t\t\t\t</smoothly-picker-option>\n\t\t\t\t\t\t<smoothly-picker-option value={\"dog\"}>Dog</smoothly-picker-option>\n\t\t\t\t\t\t<smoothly-picker-option value={\"fish\"}>Fish</smoothly-picker-option>\n\t\t\t\t\t</smoothly-picker>\n\t\t\t\t\t<smoothly-input-edit fill=\"default\" type=\"button\" color=\"tertiary\" slot=\"edit\" size=\"icon\" shape=\"rounded\" />\n\t\t\t\t\t<smoothly-input-reset fill=\"default\" type=\"form\" color=\"warning\" slot=\"reset\" size=\"icon\" shape=\"rounded\" />\n\t\t\t\t\t<smoothly-input-submit delete slot=\"clear\" color=\"danger\" size=\"icon\" shape=\"rounded\" />\n\t\t\t\t\t<smoothly-input-submit fill=\"default\" type=\"button\" color=\"success\" slot=\"submit\" size=\"icon\" shape=\"rounded\">\n\t\t\t\t\t\t<smoothly-icon name=\"checkmark-outline\" fill=\"solid\" size=\"tiny\" />\n\t\t\t\t\t</smoothly-input-submit>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h2>Color</h2>\n\t\t\t\t<smoothly-form looks=\"border\">\n\t\t\t\t\t<smoothly-input-color name=\"color\"></smoothly-input-color>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h2>Range</h2>\n\t\t\t\t<smoothly-form looks=\"border\">\n\t\t\t\t\t<smoothly-input-range step={1} name=\"range\" outputSide=\"right\">\n\t\t\t\t\t\tSelect and so\n\t\t\t\t\t</smoothly-input-range>\n\t\t\t\t\t<smoothly-input-range step={1} name=\"range2\">\n\t\t\t\t\t\tSelect with really really long label\n\t\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" slot=\"start\" />\n\t\t\t\t\t\t<smoothly-input-clear size=\"icon\" slot=\"end\">\n\t\t\t\t\t\t\t<smoothly-icon name=\"close\" />\n\t\t\t\t\t\t</smoothly-input-clear>\n\t\t\t\t\t</smoothly-input-range>\n\t\t\t\t\t<smoothly-input-range step={1} name=\"range3\">\n\t\t\t\t\t\tSelect\n\t\t\t\t\t</smoothly-input-range>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h2>Duration</h2>\n\t\t\t\t<smoothly-form looks=\"border\">\n\t\t\t\t\t<smoothly-input\n\t\t\t\t\t\tname=\"duration\"\n\t\t\t\t\t\ttype=\"duration\"\n\t\t\t\t\t\tplaceholder=\"hh:mm\"\n\t\t\t\t\t\tvalue={this.duration}\n\t\t\t\t\t\tonSmoothlyInput={e => {\n\t\t\t\t\t\t\tconst duration = e.detail.duration\n\t\t\t\t\t\t\tconsole.log(\"event duration\", duration)\n\t\t\t\t\t\t\tthis.duration = duration\n\t\t\t\t\t\t}}>\n\t\t\t\t\t\tDuration\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input\n\t\t\t\t\t\tname=\"duration\"\n\t\t\t\t\t\ttype=\"duration\"\n\t\t\t\t\t\tvalue={this.duration}\n\t\t\t\t\t\tplaceholder=\"-hh:mm\"\n\t\t\t\t\t\tonSmoothlyInput={e => {\n\t\t\t\t\t\t\tconst duration = e.detail.duration\n\t\t\t\t\t\t\tconsole.log(\"event duration\", duration)\n\t\t\t\t\t\t\tthis.duration = duration\n\t\t\t\t\t\t}}>\n\t\t\t\t\t\tDuration\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h2>Transparent inputs</h2>\n\t\t\t\t<smoothly-form looks={\"transparent\"}>\n\t\t\t\t\t<smoothly-input-file name={\"file\"}>\n\t\t\t\t\t\t<span slot={\"label\"}>File</span>\n\t\t\t\t\t\t<smoothly-icon slot={\"button\"} name={\"folder-open-outline\"} size={\"small\"} />\n\t\t\t\t\t</smoothly-input-file>\n\t\t\t\t\t<smoothly-input type={\"duration\"} looks={\"transparent\"} placeholder={\"h:mm\"}>\n\t\t\t\t\t\tInput\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-picker>\n\t\t\t\t\t\t<span slot={\"label\"}>Picker</span>\n\t\t\t\t\t\t<span slot={\"search\"}>Search</span>\n\t\t\t\t\t\t<smoothly-picker-option value={\"circle\"}>\n\t\t\t\t\t\t\t<smoothly-icon name={\"ellipse-outline\"} />\n\t\t\t\t\t\t</smoothly-picker-option>\n\t\t\t\t\t\t<smoothly-picker-option value={\"square\"}>\n\t\t\t\t\t\t\t<smoothly-icon name={\"square-outline\"} />\n\t\t\t\t\t\t</smoothly-picker-option>\n\t\t\t\t\t</smoothly-picker>\n\t\t\t\t\t<smoothly-input-date>Date</smoothly-input-date>\n\t\t\t\t\t<smoothly-input-date-range>Date Range</smoothly-input-date-range>\n\t\t\t\t\t<smoothly-input-select name={\"transport\"}>\n\t\t\t\t\t\t<smoothly-item value={\"plane\"}>\n\t\t\t\t\t\t\t<smoothly-icon name={\"airplane-outline\"} />\n\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value={\"car\"}>\n\t\t\t\t\t\t\t<smoothly-icon name={\"car-outline\"} />\n\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value={\"bus\"} selected>\n\t\t\t\t\t\t\t<smoothly-icon name={\"bus-outline\"} />\n\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t</smoothly-form>\n\n\t\t\t\t<h2>Submit</h2>\n\t\t\t\t<smoothly-form looks=\"border\">\n\t\t\t\t\t<smoothly-input type=\"email\" name=\"email\">\n\t\t\t\t\t\tEmail\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"password\" name=\"password\">\n\t\t\t\t\t\tPassword\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input-clear fill=\"default\" type=\"form\" color=\"danger\" slot=\"clear\">\n\t\t\t\t\t\tClear\n\t\t\t\t\t</smoothly-input-clear>\n\t\t\t\t\t<smoothly-submit slot=\"submit\">Submit</smoothly-submit>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h2>Prices</h2>\n\t\t\t\t<smoothly-form looks=\"border\">\n\t\t\t\t\t<smoothly-input type=\"price\" name=\"no\">\n\t\t\t\t\t\tNo currency\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"price\" name=\"crowns\" currency=\"SEK\">\n\t\t\t\t\t\tSEK\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"price\" name=\"usDollar\" currency=\"USD\">\n\t\t\t\t\t\tUSD\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"price\" name=\"pounds\" currency=\"GBP\">\n\t\t\t\t\t\tGBP\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"price\" name=\"peso\" currency=\"UYW\">\n\t\t\t\t\t\tUYW\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"price\" name=\"iceland\" currency=\"ISK\">\n\t\t\t\t\t\tISK\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"price\" name=\"Palladium\" currency=\"XPD\">\n\t\t\t\t\t\t{\"XPD (Palladium)\"}\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input-clear fill=\"default\" type=\"form\" color=\"danger\" slot=\"clear\">\n\t\t\t\t\t\tClear\n\t\t\t\t\t</smoothly-input-clear>\n\t\t\t\t\t<smoothly-submit slot=\"submit\">Submit</smoothly-submit>\n\t\t\t\t</smoothly-form>\n\n\t\t\t\t<h4>Clear</h4>\n\t\t\t\t<smoothly-form looks=\"border\">\n\t\t\t\t\t<smoothly-input name=\"First Name\" value=\"John\">\n\t\t\t\t\t\tFirst name\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input name=\"Last name\" value=\"Doe\">\n\t\t\t\t\t\tLast name\n\t\t\t\t\t\t<smoothly-input-clear size=\"icon\" slot=\"end\">\n\t\t\t\t\t\t\t<smoothly-icon name=\"close\" />\n\t\t\t\t\t\t</smoothly-input-clear>\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"phone\" name=\"Phone\">\n\t\t\t\t\t\tPhone\n\t\t\t\t\t\t<smoothly-input-clear slot=\"end\">\n\t\t\t\t\t\t\t<smoothly-icon name=\"close\" />\n\t\t\t\t\t\t</smoothly-input-clear>\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input-clear fill=\"default\" type=\"form\" color=\"danger\" slot=\"submit\">\n\t\t\t\t\t\tClear\n\t\t\t\t\t</smoothly-input-clear>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h2>Identifier</h2>\n\t\t\t\t<smoothly-form looks=\"border\">\n\t\t\t\t\t<smoothly-input type=\"identifier-code\">Code</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"identifier-attribute\">Attribute</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"identifier-snake\">Snake</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"identifier-pascal\">Pascal</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"identifier-camel\">Camel</smoothly-input>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h2>Border</h2>\n\t\t\t\t<smoothly-form looks=\"border\">\n\t\t\t\t\t<smoothly-input type=\"email\" name=\"email\">\n\t\t\t\t\t\tEmail\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"password\" name=\"password\">\n\t\t\t\t\t\tPassword\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-submit slot=\"submit\" onSubmit={(e: Event) => alert(e)} color=\"success\" fill=\"solid\">\n\t\t\t\t\t\tSend\n\t\t\t\t\t</smoothly-submit>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h2>Grid</h2>\n\t\t\t\t<h4>Contact</h4>\n\t\t\t\t<smoothly-form looks=\"grid\" action=\"https://webhook.site/85bb78f6-b450-4a74-81ac-d7cac6e94bbe\">\n\t\t\t\t\t<smoothly-input type=\"text\" name=\"name.last\">\n\t\t\t\t\t\tFirst Name\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"text\" name=\"name.first\">\n\t\t\t\t\t\tLast Name\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"text\" name=\"street\" value=\"Torgny Segerstedts Allé 87\">\n\t\t\t\t\t\tStreet\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"postal-code\" name=\"zip\">\n\t\t\t\t\t\tZipCode\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"text\" name=\"city\">\n\t\t\t\t\t\tCity\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"text\" name=\"countryCode\">\n\t\t\t\t\t\tCountryCode\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"phone\" name=\"phone\">\n\t\t\t\t\t\tPhone\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"email\" name=\"email\">\n\t\t\t\t\t\tEmail\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-submit slot=\"submit\" color=\"success\" fill=\"solid\">\n\t\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" slot=\"start\"></smoothly-icon>\n\t\t\t\t\t\tSubmit\n\t\t\t\t\t</smoothly-submit>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h4>Card</h4>\n\t\t\t\t<smoothly-form looks=\"grid\" onSmoothlyFormSubmit={(e: CustomEvent) => alert(JSON.stringify(e.detail))}>\n\t\t\t\t\t<smoothly-input type=\"card-number\" name=\"card\">\n\t\t\t\t\t\tCard #\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-submit size=\"icon\" slot=\"submit\" color=\"success\" fill=\"solid\">\n\t\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\"></smoothly-icon>\n\t\t\t\t\t</smoothly-submit>\n\t\t\t\t\t<smoothly-input type=\"card-expires\" name=\"expires\">\n\t\t\t\t\t\tExpires\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"card-csc\" name=\"csc\">\n\t\t\t\t\t\tCVV/CVC\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"text\" name=\"name.first\">\n\t\t\t\t\t\tFirst Name\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"text\" name=\"name.last\">\n\t\t\t\t\t\tLast Name\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h4>Contact</h4>\n\t\t\t\t<smoothly-form looks=\"grid\">\n\t\t\t\t\t<smoothly-input type=\"email\" name=\"email\">\n\t\t\t\t\t\tEmail\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"password\" name=\"password\">\n\t\t\t\t\t\tPassword\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"price\" currency=\"SEK\" name=\"price\">\n\t\t\t\t\t\tPrice\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"percent\" name=\"percent\">\n\t\t\t\t\t\tPercent\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-submit slot=\"submit\" color=\"success\" fill=\"solid\" size=\"icon\">\n\t\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\"></smoothly-icon>\n\t\t\t\t\t</smoothly-submit>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h4>Random</h4>\n\t\t\t\t<smoothly-form looks=\"grid\">\n\t\t\t\t\t<smoothly-input\n\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\tname=\"name\"\n\t\t\t\t\t\treadonly={true}\n\t\t\t\t\t\tvalue={\"Readonly\"}\n\t\t\t\t\t\tonSmoothlyBlur={() => console.log(\"smoothly blur\")}\n\t\t\t\t\t\tstyle={{ width: \"100%\" }}>\n\t\t\t\t\t\tReadonly\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"text\" name=\"testing\">\n\t\t\t\t\t\tTextTest\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"date-time\" name=\"date-time\">\n\t\t\t\t\t\tDate-Time\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"divisor\" name=\"divisor\">\n\t\t\t\t\t\tDivisor\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"date\" name=\"date\">\n\t\t\t\t\t\tDate\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input-date name=\"some-date\">Calendar</smoothly-input-date>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h2>Line</h2>\n\t\t\t\t<smoothly-form looks=\"line\" action=\"https://api.toiletapi.com/upload/6b12fd2f-e896-46f9-b38f-25cf42cee4b4\">\n\t\t\t\t\t<smoothly-input type=\"text\" name=\"name.last\" onSmoothlyChange={e => console.log(\"smoothly change event\")}>\n\t\t\t\t\t\tFirst Name\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"text\" name=\"name.first\" onSmoothlyChange={e => console.log(\"smoothly change event\")}>\n\t\t\t\t\t\tLast Name\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-submit slot=\"submit\" fill=\"solid\" onSubmit={(e: Event) => alert(e)} color=\"success\">\n\t\t\t\t\t\tSend\n\t\t\t\t\t</smoothly-submit>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h2>Input Alternatives</h2>\n\t\t\t\t<smoothly-form looks=\"border\">\n\t\t\t\t\t<smoothly-input type=\"text\" name=\"name.last\" onSmoothlyChange={e => console.log(\"smoothly change event\")}>\n\t\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" slot=\"start\"></smoothly-icon>\n\t\t\t\t\t\tFirst Name\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"text\" name=\"name.first\" onSmoothlyChange={e => console.log(\"smoothly change event\")}>\n\t\t\t\t\t\tLast Name\n\t\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" slot=\"end\"></smoothly-icon>\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input\n\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\tname=\"name.first\"\n\t\t\t\t\t\tplaceholder=\"Smith\"\n\t\t\t\t\t\tonSmoothlyChange={e => console.log(\"smoothly change event\")}>\n\t\t\t\t\t\tLast Name\n\t\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" slot=\"end\"></smoothly-icon>\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input placeholder=\"test\"></smoothly-input>\n\t\t\t\t\t<smoothly-submit slot=\"submit\" fill=\"solid\" onSubmit={(e: Event) => alert(e)} color=\"success\">\n\t\t\t\t\t\tSend\n\t\t\t\t\t</smoothly-submit>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h4>Smoothly checkboxes</h4>\n\t\t\t\t<smoothly-form>\n\t\t\t\t\t<div class=\"checkbox-group\">\n\t\t\t\t\t\t<smoothly-input-checkbox disabled name=\"first-checkbox\">\n\t\t\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" slot=\"start\" size=\"tiny\" />\n\t\t\t\t\t\t\tFirst\n\t\t\t\t\t\t</smoothly-input-checkbox>\n\t\t\t\t\t\t<smoothly-input-checkbox name=\"second-checkbox\" checked>\n\t\t\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" slot=\"start\" size=\"tiny\" />\n\t\t\t\t\t\t\tsecond\n\t\t\t\t\t\t\t<smoothly-input-clear size=\"icon\" slot=\"end\">\n\t\t\t\t\t\t\t\t<smoothly-icon name=\"close\" />\n\t\t\t\t\t\t\t</smoothly-input-clear>\n\t\t\t\t\t\t</smoothly-input-checkbox>\n\t\t\t\t\t\t<smoothly-input-checkbox name=\"third-checkbox\">3rd</smoothly-input-checkbox>\n\t\t\t\t\t</div>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h4>Smoothly Radio Buttons</h4>\n\t\t\t\t<smoothly-form onSmoothlyFormSubmit={e => console.log(e.detail)} looks=\"border\">\n\t\t\t\t\t<smoothly-input-radio clearable name=\"radioFirstInput\">\n\t\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" slot=\"start\" />\n\t\t\t\t\t\t<smoothly-input-clear size=\"icon\" slot=\"end\">\n\t\t\t\t\t\t\t<smoothly-icon name=\"close\" />\n\t\t\t\t\t\t</smoothly-input-clear>\n\t\t\t\t\t\t<p slot=\"label\">Clearable</p>\n\t\t\t\t\t\t<smoothly-input-radio-item slot=\"options\" value={\"first\"}>\n\t\t\t\t\t\t\tLabel 1\n\t\t\t\t\t\t</smoothly-input-radio-item>\n\t\t\t\t\t\t<smoothly-input-radio-item selected slot=\"options\" value={\"second\"}>\n\t\t\t\t\t\t\tLabel 2\n\t\t\t\t\t\t</smoothly-input-radio-item>\n\t\t\t\t\t\t<smoothly-input-radio-item slot=\"options\" value={\"third\"}>\n\t\t\t\t\t\t\tLabel 3\n\t\t\t\t\t\t</smoothly-input-radio-item>\n\t\t\t\t\t</smoothly-input-radio>\n\t\t\t\t\t<smoothly-input-radio name=\"radioSecondInput\">\n\t\t\t\t\t\t<p slot=\"label\">Not clearable</p>\n\t\t\t\t\t\t<smoothly-input-radio-item slot=\"options\" value={\"first\"}>\n\t\t\t\t\t\t\tLabel 1\n\t\t\t\t\t\t</smoothly-input-radio-item>\n\t\t\t\t\t\t<smoothly-input-radio-item slot=\"options\" value={\"second\"}>\n\t\t\t\t\t\t\tLabel 2\n\t\t\t\t\t\t</smoothly-input-radio-item>\n\t\t\t\t\t\t<smoothly-input-radio-item slot=\"options\" value={\"third\"}>\n\t\t\t\t\t\t\tLabel 3\n\t\t\t\t\t\t</smoothly-input-radio-item>\n\t\t\t\t\t\t<smoothly-input-radio-item slot=\"options\" value={\"fourth\"}>\n\t\t\t\t\t\t\tLabel 4\n\t\t\t\t\t\t</smoothly-input-radio-item>\n\t\t\t\t\t\t<smoothly-input-radio-item slot=\"options\" value={\"fifth\"}>\n\t\t\t\t\t\t\tLabel 5\n\t\t\t\t\t\t</smoothly-input-radio-item>\n\t\t\t\t\t\t<smoothly-input-radio-item slot=\"options\" value={\"sixth\"}>\n\t\t\t\t\t\t\tLabel 6\n\t\t\t\t\t\t</smoothly-input-radio-item>\n\t\t\t\t\t</smoothly-input-radio>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h4>Smoothly Picker</h4>\n\t\t\t\t<smoothly-picker-demo />\n\t\t\t\t<smoothly-back-to-top />\n\t\t\t\t<h4>Smoothly Date</h4>\n\t\t\t\t<smoothly-input-date>Date</smoothly-input-date>\n\t\t\t\t<smoothly-input-date showLabel={false} 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-form looks=\"grid\" onSmoothlyFormSubmit={e => console.log(e.detail)}>\n\t\t\t\t\t<smoothly-input-date-range\n\t\t\t\t\t\tname=\"testing\"\n\t\t\t\t\t\tstart={isoly.Date.now()}\n\t\t\t\t\t\tend={isoly.Date.nextMonth(isoly.Date.now())}\n\t\t\t\t\t\tmin=\"2021-10-10\"\n\t\t\t\t\t\tmax=\"2024-12-30\"></smoothly-input-date-range>\n\t\t\t\t\t<smoothly-input-clear type=\"form\" color=\"danger\" fill=\"solid\" slot=\"clear\">\n\t\t\t\t\t\tClear\n\t\t\t\t\t</smoothly-input-clear>\n\t\t\t\t\t<smoothly-submit slot=\"submit\">submit daterange</smoothly-submit>\n\t\t\t\t</smoothly-form>\n\n\t\t\t\t<smoothly-input-date-range\n\t\t\t\t\tlooks=\"grid\"\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}}></smoothly-input-date-range>\n\n\t\t\t\t<smoothly-form looks=\"grid\" onSmoothlyFormSubmit={e => console.log(\"Submitted\", e.detail)}>\n\t\t\t\t\t<smoothly-input type=\"text\" name=\"text\">\n\t\t\t\t\t\tText\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<smoothly-input-file placeholder=\"Select or drag a file here\" name=\"file\">\n\t\t\t\t\t\t\t<span slot=\"label\">Testing file input</span>\n\t\t\t\t\t\t\t<smoothly-icon slot=\"button\" name=\"folder-outline\" />\n\t\t\t\t\t\t</smoothly-input-file>\n\t\t\t\t\t</div>\n\t\t\t\t\t<smoothly-input-file camera=\"back\" placeholder=\"Capture a photo\" name=\"image\">\n\t\t\t\t\t\t<span slot=\"label\">Testing camera photo</span>\n\t\t\t\t\t\t<smoothly-icon slot=\"button\" name=\"camera-outline\" />\n\t\t\t\t\t</smoothly-input-file>\n\t\t\t\t\t<smoothly-input-clear type=\"form\" color=\"danger\" fill=\"solid\" slot=\"clear\">\n\t\t\t\t\t\tClear\n\t\t\t\t\t</smoothly-input-clear>\n\t\t\t\t\t<smoothly-submit slot=\"submit\">Submit</smoothly-submit>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<br />\n\t\t\t\t<smoothly-form looks=\"line\" onSmoothlyFormSubmit={e => console.log(\"form input\", e.detail)}>\n\t\t\t\t\t<smoothly-input name=\"text\">Input</smoothly-input>\n\t\t\t\t\t<smoothly-input-file camera=\"back\" placeholder=\"Capture a photo\" name=\"image\">\n\t\t\t\t\t\t<span slot=\"label\">Testing camera photo</span>\n\t\t\t\t\t\t<smoothly-icon slot=\"button\" name=\"camera-outline\" />\n\t\t\t\t\t</smoothly-input-file>\n\t\t\t\t\t<smoothly-picker name=\"picker\">\n\t\t\t\t\t\t<span slot=\"label\">Shape</span>\n\t\t\t\t\t\t<span slot=\"search\">Search</span>\n\t\t\t\t\t\t<smoothly-picker-option value={\"circle\"}>\n\t\t\t\t\t\t\t<span slot=\"label\">Circle</span>\n\t\t\t\t\t\t\t<smoothly-icon size=\"tiny\" name=\"ellipse-outline\" />\n\t\t\t\t\t\t</smoothly-picker-option>\n\t\t\t\t\t\t<smoothly-picker-option value={\"cube\"}>\n\t\t\t\t\t\t\t<span slot={\"label\"}>Cube</span>\n\t\t\t\t\t\t\t<smoothly-icon size=\"tiny\" name=\"cube-outline\" />\n\t\t\t\t\t\t</smoothly-picker-option>\n\t\t\t\t\t\t<smoothly-picker-option value={\"square\"} selected>\n\t\t\t\t\t\t\t<span slot={\"label\"}>Square</span>\n\t\t\t\t\t\t\t<smoothly-icon size=\"tiny\" name=\"square-outline\" />\n\t\t\t\t\t\t</smoothly-picker-option>\n\t\t\t\t\t</smoothly-picker>\n\t\t\t\t\t<smoothly-input-select name=\"select\" placeholder=\"Select...\" menuHeight=\"7.5items\">\n\t\t\t\t\t\t<smoothly-item value=\"1\">January</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"2\">February</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"3\">March</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"4\">April</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"5\">May</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"6\">June</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"7\">July</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"8\">August</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"9\">September</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"10\">October</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"11\">November</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"12\">December</smoothly-item>\n\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t<smoothly-input-date-range\n\t\t\t\t\t\tname=\"date-range\"\n\t\t\t\t\t\tstart={isoly.Date.now()}\n\t\t\t\t\t\tend={isoly.Date.nextMonth(isoly.Date.now())}\n\t\t\t\t\t\tmin=\"2021-10-10\"\n\t\t\t\t\t\tmax=\"2025-12-30\"\n\t\t\t\t\t\tshowLabel={false}\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\"--border-radius\": \"4px\",\n\t\t\t\t\t\t\t\"--padding\": \"0 0.75em\",\n\t\t\t\t\t\t\t\"--input-width\": \"12ch\",\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\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\t\tDate\n\t\t\t\t\t</smoothly-input-date>\n\t\t\t\t\t<smoothly-submit slot=\"submit\" color=\"success\" fill=\"solid\" size=\"icon\">\n\t\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" fill=\"solid\" size=\"medium\" />\n\t\t\t\t\t</smoothly-submit>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h4>Form with spinner showcase</h4>\n\t\t\t\t<smoothly-form looks=\"line\" processing={true} onSmoothlyFormSubmit={e => console.log(\"form input\", e.detail)}>\n\t\t\t\t\t<smoothly-input name=\"text\">Input</smoothly-input>\n\t\t\t\t\t<smoothly-input-file camera=\"back\" placeholder=\"Capture a photo\" name=\"image\">\n\t\t\t\t\t\t<span slot=\"label\">Testing camera photo</span>\n\t\t\t\t\t\t<smoothly-icon slot=\"button\" name=\"camera-outline\" />\n\t\t\t\t\t</smoothly-input-file>\n\t\t\t\t\t<smoothly-picker name=\"picker\">\n\t\t\t\t\t\t<span slot=\"label\">Shape</span>\n\t\t\t\t\t\t<span slot=\"search\">Search</span>\n\t\t\t\t\t\t<smoothly-picker-option value={\"circle\"}>\n\t\t\t\t\t\t\t<span slot=\"label\">Circle</span>\n\t\t\t\t\t\t\t<smoothly-icon size=\"tiny\" name=\"ellipse-outline\" />\n\t\t\t\t\t\t</smoothly-picker-option>\n\t\t\t\t\t\t<smoothly-picker-option value={\"cube\"}>\n\t\t\t\t\t\t\t<span slot={\"label\"}>Cube</span>\n\t\t\t\t\t\t\t<smoothly-icon size=\"tiny\" name=\"cube-outline\" />\n\t\t\t\t\t\t</smoothly-picker-option>\n\t\t\t\t\t\t<smoothly-picker-option value={\"square\"} selected>\n\t\t\t\t\t\t\t<span slot={\"label\"}>Square</span>\n\t\t\t\t\t\t\t<smoothly-icon size=\"tiny\" name=\"square-outline\" />\n\t\t\t\t\t\t</smoothly-picker-option>\n\t\t\t\t\t</smoothly-picker>\n\t\t\t\t\t<smoothly-input-select name=\"select\" placeholder=\"Select...\">\n\t\t\t\t\t\t<smoothly-item value=\"1\">January</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"2\">February</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"3\">March</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"4\">April</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"5\">May</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"6\">June</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"7\">July</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"8\">August</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"9\">September</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"10\">October</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"11\">November</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"12\">December</smoothly-item>\n\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t<smoothly-input-date-range\n\t\t\t\t\t\tname=\"date-range\"\n\t\t\t\t\t\tstart={isoly.Date.now()}\n\t\t\t\t\t\tend={isoly.Date.nextMonth(isoly.Date.now())}\n\t\t\t\t\t\tmin=\"2021-10-10\"\n\t\t\t\t\t\tmax=\"2025-12-30\"\n\t\t\t\t\t\tshowLabel={false}\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\"--border-radius\": \"4px\",\n\t\t\t\t\t\t\t\"--padding\": \"0 0.75em\",\n\t\t\t\t\t\t\t\"--input-width\": \"12ch\",\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\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\t\tDate\n\t\t\t\t\t</smoothly-input-date>\n\t\t\t\t\t<smoothly-submit slot=\"submit\" color=\"success\" fill=\"solid\" size=\"icon\">\n\t\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" fill=\"solid\" size=\"medium\" />\n\t\t\t\t\t</smoothly-submit>\n\t\t\t\t</smoothly-form>\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/input/demo/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Host, State } from \"@stencil/core\"\nimport { isoly } from \"isoly\"\n\n@Component({\n\ttag: \"smoothly-input-demo\",\n\tstyleUrl: \"style.css\",\n})\nexport class SmoothlyInputDemo {\n\t@State() duration: isoly.TimeSpan = { hours: 8 }\n\n\trender() {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<h2>Controlled form</h2>\n\t\t\t\t<smoothly-input-demo-controlled-form />\n\t\t\t\t<h2>Create form defaulting type</h2>\n\t\t\t\t<smoothly-form looks={\"line\"} action={\"https://api.toiletapi.com/6b12fd2f-e896-46f9-b38f-25cf42cee4b4\"}>\n\t\t\t\t\t<smoothly-input type={\"text\"} name={\"name\"}>\n\t\t\t\t\t\tName\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input-reset slot={\"reset\"} type={\"form\"} size={\"icon\"} color={\"warning\"} fill={\"default\"} />\n\t\t\t\t\t<smoothly-input-submit slot={\"submit\"} size={\"icon\"} color={\"success\"} />\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h2>Select</h2>\n\t\t\t\t<div class=\"select-div\">\n\t\t\t\t\t<smoothly-input-select name=\"select-dessert\" looks=\"border\" onSmoothlyInput={e => console.log(e.detail)}>\n\t\t\t\t\t\t<label slot=\"label\">Select with reset button</label>\n\t\t\t\t\t\t<smoothly-item value=\"1\">Ice cream</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"2\">Sponge cake</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"3\">Cookie</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"4\">Croissant</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"5\">Chocolate fondue</smoothly-item>\n\t\t\t\t\t\t<smoothly-input-reset size=\"icon\" slot=\"end\">\n\t\t\t\t\t\t\t<smoothly-icon name=\"refresh-outline\" />\n\t\t\t\t\t\t</smoothly-input-reset>\n\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t<smoothly-input-select\n\t\t\t\t\t\tmultiple\n\t\t\t\t\t\tname=\"select-dessert-multiple\"\n\t\t\t\t\t\tlooks=\"border\"\n\t\t\t\t\t\tonSmoothlyInput={e => console.log(e.detail)}>\n\t\t\t\t\t\t<label slot=\"label\">Select multiple with reset button</label>\n\t\t\t\t\t\t<smoothly-item value=\"ice cream\">Ice cream</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"sponge cake\">Sponge cake</smoothly-item>\n\t\t\t\t\t\t<smoothly-item selected value=\"cookie\">\n\t\t\t\t\t\t\tCookie\n\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"croissant\">Croissant</smoothly-item>\n\t\t\t\t\t\t<smoothly-item selected value=\"chocolate fondue\">\n\t\t\t\t\t\t\tChocolate fondue\n\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t<smoothly-input-reset size=\"icon\" slot=\"end\">\n\t\t\t\t\t\t\t<smoothly-icon name=\"refresh-outline\" />\n\t\t\t\t\t\t</smoothly-input-reset>\n\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t<smoothly-input-select\n\t\t\t\t\t\tname=\"select-icon\"\n\t\t\t\t\t\tclearable={false}\n\t\t\t\t\t\tshowSelected={false}\n\t\t\t\t\t\tonSmoothlyInput={e => console.log(\"Form Readonly\", e.detail)}>\n\t\t\t\t\t\t<smoothly-item value=\"folder\" selected>\n\t\t\t\t\t\t\t<smoothly-icon size=\"small\" name=\"folder-outline\" />\n\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"camera\">\n\t\t\t\t\t\t\t<smoothly-icon size=\"small\" name=\"camera-outline\" />\n\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t</div>\n\n\t\t\t\t<h2>Delayed</h2>\n\t\t\t\t<smoothly-input name=\"Delayed\" delay={2}>\n\t\t\t\t\tDelayed\n\t\t\t\t</smoothly-input>\n\t\t\t\t<h2>Editable form and Input with Clear and Reset - Readonly</h2>\n\t\t\t\t<smoothly-form looks=\"grid\" readonly action=\"https://api.toiletapi.com/6b12fd2f-e896-46f9-b38f-25cf42cee4b4\">\n\t\t\t\t\t<smoothly-input readonly name=\"First Name\" value=\"John\">\n\t\t\t\t\t\tFirst name\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input name=\"Last name\" value=\"Doe\">\n\t\t\t\t\t\tLast name\n\t\t\t\t\t\t<smoothly-input-clear size=\"icon\" slot=\"end\">\n\t\t\t\t\t\t\t<smoothly-icon name=\"close\" />\n\t\t\t\t\t\t</smoothly-input-clear>\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"phone\" name=\"Phone\" value={\"777888999\"}>\n\t\t\t\t\t\tPhone\n\t\t\t\t\t\t<smoothly-input-reset size=\"icon\" slot=\"end\">\n\t\t\t\t\t\t\t<smoothly-icon name=\"refresh-outline\" />\n\t\t\t\t\t\t</smoothly-input-reset>\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input-radio clearable name=\"radioFirstInput\">\n\t\t\t\t\t\t<p slot=\"label\">Clearable</p>\n\t\t\t\t\t\t<smoothly-input-radio-item slot=\"options\" value={\"first\"}>\n\t\t\t\t\t\t\tLabel 1\n\t\t\t\t\t\t</smoothly-input-radio-item>\n\t\t\t\t\t\t<smoothly-input-radio-item selected slot=\"options\" value={\"second\"}>\n\t\t\t\t\t\t\tLabel 2\n\t\t\t\t\t\t</smoothly-input-radio-item>\n\t\t\t\t\t\t<smoothly-input-radio-item slot=\"options\" value={\"third\"}>\n\t\t\t\t\t\t\tLabel 3\n\t\t\t\t\t\t</smoothly-input-radio-item>\n\t\t\t\t\t</smoothly-input-radio>\n\t\t\t\t\t<smoothly-input-select menuHeight=\"7.5items\" placeholder=\"Select...\" multiple name=\"select-month\">\n\t\t\t\t\t\t<label slot=\"label\">Month</label>\n\t\t\t\t\t\t<smoothly-item value=\"1\">January</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"2\">February</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"3\">March</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"4\">April</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"5\">May</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"6\">June</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"7\">July</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"8\">August</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"9\">September</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"10\">October</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"11\">November</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"12\">December</smoothly-item>\n\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t<smoothly-input-select name=\"select-icon\" clearable={false} showSelected={false}>\n\t\t\t\t\t\t<smoothly-item value=\"folder\" selected>\n\t\t\t\t\t\t\t<smoothly-icon size=\"small\" name=\"folder-outline\" />\n\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"camera\">\n\t\t\t\t\t\t\t<smoothly-icon size=\"small\" name=\"camera-outline\" />\n\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t<smoothly-input-checkbox name=\"checkbox\">Check the box</smoothly-input-checkbox>\n\t\t\t\t\t<smoothly-input-checkbox name=\"checkbox2\" checked>\n\t\t\t\t\t\tCheck the box 2\n\t\t\t\t\t</smoothly-input-checkbox>\n\t\t\t\t\t<smoothly-input-range step={1} name=\"range3\" value={20000}>\n\t\t\t\t\t\tSelect\n\t\t\t\t\t</smoothly-input-range>\n\t\t\t\t\t<smoothly-picker multiple name=\"animals\">\n\t\t\t\t\t\t<span slot=\"label\">Animals</span>\n\t\t\t\t\t\t<span slot=\"search\">Search</span>\n\t\t\t\t\t\t<smoothly-picker-option selected value={\"cat\"}>\n\t\t\t\t\t\t\tCat\n\t\t\t\t\t\t</smoothly-picker-option>\n\t\t\t\t\t\t<smoothly-picker-option value={\"dog\"}>Dog</smoothly-picker-option>\n\t\t\t\t\t\t<smoothly-picker-option value={\"fish\"}>Fish</smoothly-picker-option>\n\t\t\t\t\t</smoothly-picker>\n\t\t\t\t\t<smoothly-input-edit fill=\"default\" type=\"button\" color=\"tertiary\" slot=\"edit\" size=\"icon\" shape=\"rounded\" />\n\t\t\t\t\t<smoothly-input-reset fill=\"default\" type=\"form\" color=\"warning\" slot=\"reset\" size=\"icon\" shape=\"rounded\" />\n\t\t\t\t\t<smoothly-input-submit delete slot=\"clear\" color=\"danger\" size=\"icon\" shape=\"rounded\" />\n\t\t\t\t\t<smoothly-input-submit fill=\"default\" type=\"button\" color=\"success\" slot=\"submit\" size=\"icon\" shape=\"rounded\">\n\t\t\t\t\t\t<smoothly-icon name=\"checkmark-outline\" fill=\"solid\" size=\"tiny\" />\n\t\t\t\t\t</smoothly-input-submit>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h2>Editable form and Input with Clear and Reset - Editable</h2>\n\t\t\t\t<smoothly-form\n\t\t\t\t\tlooks=\"grid\"\n\t\t\t\t\ttype=\"create\"\n\t\t\t\t\taction=\"https://api.toiletapi.com/upload/6b12fd2f-e896-46f9-b38f-25cf42cee4b4\">\n\t\t\t\t\t<smoothly-input readonly name=\"First Name\" value=\"John\">\n\t\t\t\t\t\tFirst name\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input name=\"Last name\" value=\"Doe\">\n\t\t\t\t\t\tLast name\n\t\t\t\t\t\t<smoothly-input-clear size=\"icon\" slot=\"end\">\n\t\t\t\t\t\t\t<smoothly-icon name=\"close\" />\n\t\t\t\t\t\t</smoothly-input-clear>\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"phone\" name=\"Phone\" value={\"777888999\"}>\n\t\t\t\t\t\tPhone\n\t\t\t\t\t\t<smoothly-input-reset size=\"icon\" slot=\"end\">\n\t\t\t\t\t\t\t<smoothly-icon name=\"refresh-outline\" />\n\t\t\t\t\t\t</smoothly-input-reset>\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input-radio clearable name=\"radioFirstInput\">\n\t\t\t\t\t\t<p slot=\"label\">Clearable</p>\n\t\t\t\t\t\t<smoothly-input-radio-item slot=\"options\" value={\"first\"}>\n\t\t\t\t\t\t\tLabel 1\n\t\t\t\t\t\t</smoothly-input-radio-item>\n\t\t\t\t\t\t<smoothly-input-radio-item selected slot=\"options\" value={\"second\"}>\n\t\t\t\t\t\t\tLabel 2\n\t\t\t\t\t\t</smoothly-input-radio-item>\n\t\t\t\t\t\t<smoothly-input-radio-item slot=\"options\" value={\"third\"}>\n\t\t\t\t\t\t\tLabel 3\n\t\t\t\t\t\t</smoothly-input-radio-item>\n\t\t\t\t\t</smoothly-input-radio>\n\t\t\t\t\t<smoothly-input-select multiple menuHeight=\"7.5items\" placeholder=\"Select...\" name=\"select-month\">\n\t\t\t\t\t\t<label slot=\"label\">Month multiple select</label>\n\t\t\t\t\t\t<smoothly-item value=\"1\">January</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"2\">February</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"3\">March</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"4\">April</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"5\">May</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"6\">June</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"7\">July</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"8\">August</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"9\">September</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"10\">October</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"11\">November</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"12\">December</smoothly-item>\n\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t<smoothly-input-select name=\"select-icon\" clearable={false} showSelected={false}>\n\t\t\t\t\t\t<smoothly-item value=\"folder\" selected>\n\t\t\t\t\t\t\t<smoothly-icon size=\"small\" name=\"folder-outline\" />\n\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"camera\">\n\t\t\t\t\t\t\t<smoothly-icon size=\"small\" name=\"camera-outline\" />\n\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t<smoothly-input-checkbox name=\"checkbox\">Check the box</smoothly-input-checkbox>\n\t\t\t\t\t<smoothly-input-checkbox name=\"checkbox2\" checked>\n\t\t\t\t\t\tCheck the box 2\n\t\t\t\t\t</smoothly-input-checkbox>\n\t\t\t\t\t<smoothly-input-range step={1} name=\"range3\" value={20000}>\n\t\t\t\t\t\tSelect\n\t\t\t\t\t</smoothly-input-range>\n\t\t\t\t\t<smoothly-picker multiple name=\"animals\">\n\t\t\t\t\t\t<span slot=\"label\">Animals</span>\n\t\t\t\t\t\t<span slot=\"search\">Search</span>\n\t\t\t\t\t\t<smoothly-picker-option selected value={\"cat\"}>\n\t\t\t\t\t\t\tCat\n\t\t\t\t\t\t</smoothly-picker-option>\n\t\t\t\t\t\t<smoothly-picker-option value={\"dog\"}>Dog</smoothly-picker-option>\n\t\t\t\t\t\t<smoothly-picker-option value={\"fish\"}>Fish</smoothly-picker-option>\n\t\t\t\t\t</smoothly-picker>\n\t\t\t\t\t<smoothly-input-edit fill=\"default\" type=\"button\" color=\"tertiary\" slot=\"edit\" size=\"icon\" shape=\"rounded\" />\n\t\t\t\t\t<smoothly-input-reset fill=\"default\" type=\"form\" color=\"warning\" slot=\"reset\" size=\"icon\" shape=\"rounded\" />\n\t\t\t\t\t<smoothly-input-submit delete slot=\"clear\" color=\"danger\" size=\"icon\" shape=\"rounded\" />\n\t\t\t\t\t<smoothly-input-submit fill=\"default\" type=\"button\" color=\"success\" slot=\"submit\" size=\"icon\" shape=\"rounded\">\n\t\t\t\t\t\t<smoothly-icon name=\"checkmark-outline\" fill=\"solid\" size=\"tiny\" />\n\t\t\t\t\t</smoothly-input-submit>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h2>Color</h2>\n\t\t\t\t<smoothly-form looks=\"border\">\n\t\t\t\t\t<smoothly-input-color name=\"color\"></smoothly-input-color>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h2>Range</h2>\n\t\t\t\t<smoothly-form looks=\"border\">\n\t\t\t\t\t<smoothly-input-range step={1} name=\"range\" outputSide=\"right\">\n\t\t\t\t\t\tSelect and so\n\t\t\t\t\t</smoothly-input-range>\n\t\t\t\t\t<smoothly-input-range step={1} name=\"range2\">\n\t\t\t\t\t\tSelect with really really long label\n\t\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" slot=\"start\" />\n\t\t\t\t\t\t<smoothly-input-clear size=\"icon\" slot=\"end\">\n\t\t\t\t\t\t\t<smoothly-icon name=\"close\" />\n\t\t\t\t\t\t</smoothly-input-clear>\n\t\t\t\t\t</smoothly-input-range>\n\t\t\t\t\t<smoothly-input-range step={1} name=\"range3\">\n\t\t\t\t\t\tSelect\n\t\t\t\t\t</smoothly-input-range>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h2>Duration</h2>\n\t\t\t\t<smoothly-form looks=\"border\">\n\t\t\t\t\t<smoothly-input\n\t\t\t\t\t\tname=\"duration\"\n\t\t\t\t\t\ttype=\"duration\"\n\t\t\t\t\t\tplaceholder=\"hh:mm\"\n\t\t\t\t\t\tvalue={this.duration}\n\t\t\t\t\t\tonSmoothlyInput={e => {\n\t\t\t\t\t\t\tconst duration = e.detail.duration\n\t\t\t\t\t\t\tconsole.log(\"event duration\", duration)\n\t\t\t\t\t\t\tthis.duration = duration\n\t\t\t\t\t\t}}>\n\t\t\t\t\t\tDuration\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input\n\t\t\t\t\t\tname=\"duration\"\n\t\t\t\t\t\ttype=\"duration\"\n\t\t\t\t\t\tvalue={this.duration}\n\t\t\t\t\t\tplaceholder=\"-hh:mm\"\n\t\t\t\t\t\tonSmoothlyInput={e => {\n\t\t\t\t\t\t\tconst duration = e.detail.duration\n\t\t\t\t\t\t\tconsole.log(\"event duration\", duration)\n\t\t\t\t\t\t\tthis.duration = duration\n\t\t\t\t\t\t}}>\n\t\t\t\t\t\tDuration\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h2>Transparent inputs</h2>\n\t\t\t\t<smoothly-form looks={\"transparent\"}>\n\t\t\t\t\t<smoothly-input-file name={\"file\"}>\n\t\t\t\t\t\t<span slot={\"label\"}>File</span>\n\t\t\t\t\t\t<smoothly-icon slot={\"button\"} name={\"folder-open-outline\"} size={\"small\"} />\n\t\t\t\t\t</smoothly-input-file>\n\t\t\t\t\t<smoothly-input type={\"duration\"} looks={\"transparent\"} placeholder={\"h:mm\"}>\n\t\t\t\t\t\tInput\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-picker>\n\t\t\t\t\t\t<span slot={\"label\"}>Picker</span>\n\t\t\t\t\t\t<span slot={\"search\"}>Search</span>\n\t\t\t\t\t\t<smoothly-picker-option value={\"circle\"}>\n\t\t\t\t\t\t\t<smoothly-icon name={\"ellipse-outline\"} />\n\t\t\t\t\t\t</smoothly-picker-option>\n\t\t\t\t\t\t<smoothly-picker-option value={\"square\"}>\n\t\t\t\t\t\t\t<smoothly-icon name={\"square-outline\"} />\n\t\t\t\t\t\t</smoothly-picker-option>\n\t\t\t\t\t</smoothly-picker>\n\t\t\t\t\t<smoothly-input-date>Date</smoothly-input-date>\n\t\t\t\t\t<smoothly-input-date-range>Date Range</smoothly-input-date-range>\n\t\t\t\t\t<smoothly-input-select name={\"transport\"}>\n\t\t\t\t\t\t<smoothly-item value={\"plane\"}>\n\t\t\t\t\t\t\t<smoothly-icon name={\"airplane-outline\"} />\n\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value={\"car\"}>\n\t\t\t\t\t\t\t<smoothly-icon name={\"car-outline\"} />\n\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value={\"bus\"} selected>\n\t\t\t\t\t\t\t<smoothly-icon name={\"bus-outline\"} />\n\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t</smoothly-form>\n\n\t\t\t\t<h2>Submit</h2>\n\t\t\t\t<smoothly-form looks=\"border\">\n\t\t\t\t\t<smoothly-input type=\"email\" name=\"email\">\n\t\t\t\t\t\tEmail\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"password\" name=\"password\">\n\t\t\t\t\t\tPassword\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input-clear fill=\"default\" type=\"form\" color=\"danger\" slot=\"clear\">\n\t\t\t\t\t\tClear\n\t\t\t\t\t</smoothly-input-clear>\n\t\t\t\t\t<smoothly-submit slot=\"submit\">Submit</smoothly-submit>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h2>Prices</h2>\n\t\t\t\t<smoothly-form looks=\"border\">\n\t\t\t\t\t<smoothly-input type=\"price\" name=\"no\">\n\t\t\t\t\t\tNo currency\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"price\" name=\"crowns\" currency=\"SEK\">\n\t\t\t\t\t\tSEK\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"price\" name=\"usDollar\" currency=\"USD\">\n\t\t\t\t\t\tUSD\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"price\" name=\"pounds\" currency=\"GBP\">\n\t\t\t\t\t\tGBP\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"price\" name=\"peso\" currency=\"UYW\">\n\t\t\t\t\t\tUYW\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"price\" name=\"iceland\" currency=\"ISK\">\n\t\t\t\t\t\tISK\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"price\" name=\"Palladium\" currency=\"XPD\">\n\t\t\t\t\t\t{\"XPD (Palladium)\"}\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input-clear fill=\"default\" type=\"form\" color=\"danger\" slot=\"clear\">\n\t\t\t\t\t\tClear\n\t\t\t\t\t</smoothly-input-clear>\n\t\t\t\t\t<smoothly-submit slot=\"submit\">Submit</smoothly-submit>\n\t\t\t\t</smoothly-form>\n\n\t\t\t\t<h4>Clear</h4>\n\t\t\t\t<smoothly-form looks=\"border\">\n\t\t\t\t\t<smoothly-input name=\"First Name\" value=\"John\">\n\t\t\t\t\t\tFirst name\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input name=\"Last name\" value=\"Doe\">\n\t\t\t\t\t\tLast name\n\t\t\t\t\t\t<smoothly-input-clear size=\"icon\" slot=\"end\">\n\t\t\t\t\t\t\t<smoothly-icon name=\"close\" />\n\t\t\t\t\t\t</smoothly-input-clear>\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"phone\" name=\"Phone\">\n\t\t\t\t\t\tPhone\n\t\t\t\t\t\t<smoothly-input-clear slot=\"end\">\n\t\t\t\t\t\t\t<smoothly-icon name=\"close\" />\n\t\t\t\t\t\t</smoothly-input-clear>\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input-clear fill=\"default\" type=\"form\" color=\"danger\" slot=\"submit\">\n\t\t\t\t\t\tClear\n\t\t\t\t\t</smoothly-input-clear>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h2>Identifier</h2>\n\t\t\t\t<smoothly-form looks=\"border\">\n\t\t\t\t\t<smoothly-input type=\"identifier-code\">Code</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"identifier-attribute\">Attribute</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"identifier-snake\">Snake</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"identifier-pascal\">Pascal</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"identifier-camel\">Camel</smoothly-input>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h2>Border</h2>\n\t\t\t\t<smoothly-form looks=\"border\">\n\t\t\t\t\t<smoothly-input type=\"email\" name=\"email\">\n\t\t\t\t\t\tEmail\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"password\" name=\"password\">\n\t\t\t\t\t\tPassword\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-submit slot=\"submit\" onSubmit={(e: Event) => alert(e)} color=\"success\" fill=\"solid\">\n\t\t\t\t\t\tSend\n\t\t\t\t\t</smoothly-submit>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h2>Grid</h2>\n\t\t\t\t<h4>Contact</h4>\n\t\t\t\t<smoothly-form looks=\"grid\" action=\"https://webhook.site/85bb78f6-b450-4a74-81ac-d7cac6e94bbe\">\n\t\t\t\t\t<smoothly-input type=\"text\" name=\"name.last\">\n\t\t\t\t\t\tFirst Name\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"text\" name=\"name.first\">\n\t\t\t\t\t\tLast Name\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"text\" name=\"street\" value=\"Torgny Segerstedts Allé 87\">\n\t\t\t\t\t\tStreet\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"postal-code\" name=\"zip\">\n\t\t\t\t\t\tZipCode\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"text\" name=\"city\">\n\t\t\t\t\t\tCity\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"text\" name=\"countryCode\">\n\t\t\t\t\t\tCountryCode\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"phone\" name=\"phone\">\n\t\t\t\t\t\tPhone\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"email\" name=\"email\">\n\t\t\t\t\t\tEmail\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-submit slot=\"submit\" color=\"success\" fill=\"solid\">\n\t\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" slot=\"start\"></smoothly-icon>\n\t\t\t\t\t\tSubmit\n\t\t\t\t\t</smoothly-submit>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h4>Card</h4>\n\t\t\t\t<smoothly-form looks=\"grid\" onSmoothlyFormSubmit={(e: CustomEvent) => alert(JSON.stringify(e.detail))}>\n\t\t\t\t\t<smoothly-input type=\"card-number\" name=\"card\">\n\t\t\t\t\t\tCard #\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-submit size=\"icon\" slot=\"submit\" color=\"success\" fill=\"solid\">\n\t\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\"></smoothly-icon>\n\t\t\t\t\t</smoothly-submit>\n\t\t\t\t\t<smoothly-input type=\"card-expires\" name=\"expires\">\n\t\t\t\t\t\tExpires\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"card-csc\" name=\"csc\">\n\t\t\t\t\t\tCVV/CVC\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"text\" name=\"name.first\">\n\t\t\t\t\t\tFirst Name\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"text\" name=\"name.last\">\n\t\t\t\t\t\tLast Name\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h4>Contact</h4>\n\t\t\t\t<smoothly-form looks=\"grid\">\n\t\t\t\t\t<smoothly-input type=\"email\" name=\"email\">\n\t\t\t\t\t\tEmail\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"password\" name=\"password\">\n\t\t\t\t\t\tPassword\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"price\" currency=\"SEK\" name=\"price\">\n\t\t\t\t\t\tPrice\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"percent\" name=\"percent\">\n\t\t\t\t\t\tPercent\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-submit slot=\"submit\" color=\"success\" fill=\"solid\" size=\"icon\">\n\t\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\"></smoothly-icon>\n\t\t\t\t\t</smoothly-submit>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h4>Random</h4>\n\t\t\t\t<smoothly-form looks=\"grid\">\n\t\t\t\t\t<smoothly-input\n\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\tname=\"name\"\n\t\t\t\t\t\treadonly={true}\n\t\t\t\t\t\tvalue={\"Readonly\"}\n\t\t\t\t\t\tonSmoothlyBlur={() => console.log(\"smoothly blur\")}\n\t\t\t\t\t\tstyle={{ width: \"100%\" }}>\n\t\t\t\t\t\tReadonly\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"text\" name=\"testing\">\n\t\t\t\t\t\tTextTest\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"date-time\" name=\"date-time\">\n\t\t\t\t\t\tDate-Time\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"divisor\" name=\"divisor\">\n\t\t\t\t\t\tDivisor\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"date\" name=\"date\">\n\t\t\t\t\t\tDate\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input-date name=\"some-date\">Calendar</smoothly-input-date>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h2>Line</h2>\n\t\t\t\t<smoothly-form looks=\"line\" action=\"https://api.toiletapi.com/upload/6b12fd2f-e896-46f9-b38f-25cf42cee4b4\">\n\t\t\t\t\t<smoothly-input type=\"text\" name=\"name.last\" onSmoothlyChange={e => console.log(\"smoothly change event\")}>\n\t\t\t\t\t\tFirst Name\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"text\" name=\"name.first\" onSmoothlyChange={e => console.log(\"smoothly change event\")}>\n\t\t\t\t\t\tLast Name\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-submit slot=\"submit\" fill=\"solid\" onSubmit={(e: Event) => alert(e)} color=\"success\">\n\t\t\t\t\t\tSend\n\t\t\t\t\t</smoothly-submit>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h2>Input Alternatives</h2>\n\t\t\t\t<smoothly-form looks=\"border\">\n\t\t\t\t\t<smoothly-input type=\"text\" name=\"name.last\" onSmoothlyChange={e => console.log(\"smoothly change event\")}>\n\t\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" slot=\"start\"></smoothly-icon>\n\t\t\t\t\t\tFirst Name\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"text\" name=\"name.first\" onSmoothlyChange={e => console.log(\"smoothly change event\")}>\n\t\t\t\t\t\tLast Name\n\t\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" slot=\"end\"></smoothly-icon>\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input\n\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\tname=\"name.first\"\n\t\t\t\t\t\tplaceholder=\"Smith\"\n\t\t\t\t\t\tonSmoothlyChange={e => console.log(\"smoothly change event\")}>\n\t\t\t\t\t\tLast Name\n\t\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" slot=\"end\"></smoothly-icon>\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input placeholder=\"test\"></smoothly-input>\n\t\t\t\t\t<smoothly-submit slot=\"submit\" fill=\"solid\" onSubmit={(e: Event) => alert(e)} color=\"success\">\n\t\t\t\t\t\tSend\n\t\t\t\t\t</smoothly-submit>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h4>Smoothly checkboxes</h4>\n\t\t\t\t<smoothly-form>\n\t\t\t\t\t<div class=\"checkbox-group\">\n\t\t\t\t\t\t<smoothly-input-checkbox disabled name=\"first-checkbox\">\n\t\t\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" slot=\"start\" size=\"tiny\" />\n\t\t\t\t\t\t\tFirst\n\t\t\t\t\t\t</smoothly-input-checkbox>\n\t\t\t\t\t\t<smoothly-input-checkbox name=\"second-checkbox\" checked>\n\t\t\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" slot=\"start\" size=\"tiny\" />\n\t\t\t\t\t\t\tsecond\n\t\t\t\t\t\t\t<smoothly-input-clear size=\"icon\" slot=\"end\">\n\t\t\t\t\t\t\t\t<smoothly-icon name=\"close\" />\n\t\t\t\t\t\t\t</smoothly-input-clear>\n\t\t\t\t\t\t</smoothly-input-checkbox>\n\t\t\t\t\t\t<smoothly-input-checkbox name=\"third-checkbox\">3rd</smoothly-input-checkbox>\n\t\t\t\t\t</div>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h4>Smoothly Radio Buttons</h4>\n\t\t\t\t<smoothly-form onSmoothlyFormSubmit={e => console.log(e.detail)} looks=\"border\">\n\t\t\t\t\t<smoothly-input-radio clearable name=\"radioFirstInput\">\n\t\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" slot=\"start\" />\n\t\t\t\t\t\t<smoothly-input-clear size=\"icon\" slot=\"end\">\n\t\t\t\t\t\t\t<smoothly-icon name=\"close\" />\n\t\t\t\t\t\t</smoothly-input-clear>\n\t\t\t\t\t\t<p slot=\"label\">Clearable</p>\n\t\t\t\t\t\t<smoothly-input-radio-item slot=\"options\" value={\"first\"}>\n\t\t\t\t\t\t\tLabel 1\n\t\t\t\t\t\t</smoothly-input-radio-item>\n\t\t\t\t\t\t<smoothly-input-radio-item selected slot=\"options\" value={\"second\"}>\n\t\t\t\t\t\t\tLabel 2\n\t\t\t\t\t\t</smoothly-input-radio-item>\n\t\t\t\t\t\t<smoothly-input-radio-item slot=\"options\" value={\"third\"}>\n\t\t\t\t\t\t\tLabel 3\n\t\t\t\t\t\t</smoothly-input-radio-item>\n\t\t\t\t\t</smoothly-input-radio>\n\t\t\t\t\t<smoothly-input-radio name=\"radioSecondInput\">\n\t\t\t\t\t\t<p slot=\"label\">Not clearable</p>\n\t\t\t\t\t\t<smoothly-input-radio-item slot=\"options\" value={\"first\"}>\n\t\t\t\t\t\t\tLabel 1\n\t\t\t\t\t\t</smoothly-input-radio-item>\n\t\t\t\t\t\t<smoothly-input-radio-item slot=\"options\" value={\"second\"}>\n\t\t\t\t\t\t\tLabel 2\n\t\t\t\t\t\t</smoothly-input-radio-item>\n\t\t\t\t\t\t<smoothly-input-radio-item slot=\"options\" value={\"third\"}>\n\t\t\t\t\t\t\tLabel 3\n\t\t\t\t\t\t</smoothly-input-radio-item>\n\t\t\t\t\t\t<smoothly-input-radio-item slot=\"options\" value={\"fourth\"}>\n\t\t\t\t\t\t\tLabel 4\n\t\t\t\t\t\t</smoothly-input-radio-item>\n\t\t\t\t\t\t<smoothly-input-radio-item slot=\"options\" value={\"fifth\"}>\n\t\t\t\t\t\t\tLabel 5\n\t\t\t\t\t\t</smoothly-input-radio-item>\n\t\t\t\t\t\t<smoothly-input-radio-item slot=\"options\" value={\"sixth\"}>\n\t\t\t\t\t\t\tLabel 6\n\t\t\t\t\t\t</smoothly-input-radio-item>\n\t\t\t\t\t</smoothly-input-radio>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h4>Smoothly Picker</h4>\n\t\t\t\t<smoothly-picker-demo />\n\t\t\t\t<smoothly-back-to-top />\n\t\t\t\t<h4>Smoothly Date</h4>\n\t\t\t\t<smoothly-input-date>Date</smoothly-input-date>\n\t\t\t\t<smoothly-input-date showLabel={false} 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-form looks=\"grid\" onSmoothlyFormSubmit={e => console.log(e.detail)}>\n\t\t\t\t\t<smoothly-input-date-range\n\t\t\t\t\t\tname=\"testing\"\n\t\t\t\t\t\tstart={isoly.Date.now()}\n\t\t\t\t\t\tend={isoly.Date.nextMonth(isoly.Date.now())}\n\t\t\t\t\t\tmin=\"2021-10-10\"\n\t\t\t\t\t\tmax=\"2024-12-30\"></smoothly-input-date-range>\n\t\t\t\t\t<smoothly-input-clear type=\"form\" color=\"danger\" fill=\"solid\" slot=\"clear\">\n\t\t\t\t\t\tClear\n\t\t\t\t\t</smoothly-input-clear>\n\t\t\t\t\t<smoothly-submit slot=\"submit\">submit daterange</smoothly-submit>\n\t\t\t\t</smoothly-form>\n\n\t\t\t\t<smoothly-input-date-range\n\t\t\t\t\tlooks=\"grid\"\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}}></smoothly-input-date-range>\n\n\t\t\t\t<smoothly-form looks=\"grid\" onSmoothlyFormSubmit={e => console.log(\"Submitted\", e.detail)}>\n\t\t\t\t\t<smoothly-input type=\"text\" name=\"text\">\n\t\t\t\t\t\tText\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<smoothly-input-file placeholder=\"Select or drag a file here\" name=\"file\">\n\t\t\t\t\t\t\t<span slot=\"label\">Testing file input</span>\n\t\t\t\t\t\t\t<smoothly-icon slot=\"button\" name=\"folder-outline\" />\n\t\t\t\t\t\t</smoothly-input-file>\n\t\t\t\t\t</div>\n\t\t\t\t\t<smoothly-input-file camera=\"back\" placeholder=\"Capture a photo\" name=\"image\">\n\t\t\t\t\t\t<span slot=\"label\">Testing camera photo</span>\n\t\t\t\t\t\t<smoothly-icon slot=\"button\" name=\"camera-outline\" />\n\t\t\t\t\t</smoothly-input-file>\n\t\t\t\t\t<smoothly-input-clear type=\"form\" color=\"danger\" fill=\"solid\" slot=\"clear\">\n\t\t\t\t\t\tClear\n\t\t\t\t\t</smoothly-input-clear>\n\t\t\t\t\t<smoothly-submit slot=\"submit\">Submit</smoothly-submit>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<br />\n\t\t\t\t<smoothly-form looks=\"line\" onSmoothlyFormSubmit={e => console.log(\"form input\", e.detail)}>\n\t\t\t\t\t<smoothly-input name=\"text\">Input</smoothly-input>\n\t\t\t\t\t<smoothly-input-file camera=\"back\" placeholder=\"Capture a photo\" name=\"image\">\n\t\t\t\t\t\t<span slot=\"label\">Testing camera photo</span>\n\t\t\t\t\t\t<smoothly-icon slot=\"button\" name=\"camera-outline\" />\n\t\t\t\t\t</smoothly-input-file>\n\t\t\t\t\t<smoothly-picker name=\"picker\">\n\t\t\t\t\t\t<span slot=\"label\">Shape</span>\n\t\t\t\t\t\t<span slot=\"search\">Search</span>\n\t\t\t\t\t\t<smoothly-picker-option value={\"circle\"}>\n\t\t\t\t\t\t\t<span slot=\"label\">Circle</span>\n\t\t\t\t\t\t\t<smoothly-icon size=\"tiny\" name=\"ellipse-outline\" />\n\t\t\t\t\t\t</smoothly-picker-option>\n\t\t\t\t\t\t<smoothly-picker-option value={\"cube\"}>\n\t\t\t\t\t\t\t<span slot={\"label\"}>Cube</span>\n\t\t\t\t\t\t\t<smoothly-icon size=\"tiny\" name=\"cube-outline\" />\n\t\t\t\t\t\t</smoothly-picker-option>\n\t\t\t\t\t\t<smoothly-picker-option value={\"square\"} selected>\n\t\t\t\t\t\t\t<span slot={\"label\"}>Square</span>\n\t\t\t\t\t\t\t<smoothly-icon size=\"tiny\" name=\"square-outline\" />\n\t\t\t\t\t\t</smoothly-picker-option>\n\t\t\t\t\t</smoothly-picker>\n\t\t\t\t\t<smoothly-input-select name=\"select\" placeholder=\"Select...\" menuHeight=\"7.5items\">\n\t\t\t\t\t\t<smoothly-item value=\"1\">January</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"2\">February</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"3\">March</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"4\">April</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"5\">May</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"6\">June</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"7\">July</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"8\">August</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"9\">September</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"10\">October</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"11\">November</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"12\">December</smoothly-item>\n\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t<smoothly-input-date-range\n\t\t\t\t\t\tname=\"date-range\"\n\t\t\t\t\t\tstart={isoly.Date.now()}\n\t\t\t\t\t\tend={isoly.Date.nextMonth(isoly.Date.now())}\n\t\t\t\t\t\tmin=\"2021-10-10\"\n\t\t\t\t\t\tmax=\"2025-12-30\"\n\t\t\t\t\t\tshowLabel={false}\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\"--border-radius\": \"4px\",\n\t\t\t\t\t\t\t\"--padding\": \"0 0.75em\",\n\t\t\t\t\t\t\t\"--input-width\": \"12ch\",\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\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\t\tDate\n\t\t\t\t\t</smoothly-input-date>\n\t\t\t\t\t<smoothly-submit slot=\"submit\" color=\"success\" fill=\"solid\" size=\"icon\">\n\t\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" fill=\"solid\" size=\"medium\" />\n\t\t\t\t\t</smoothly-submit>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h4>Form with spinner showcase</h4>\n\t\t\t\t<smoothly-form looks=\"line\" onSmoothlyFormSubmit={e => console.log(\"form input\", e.detail)}>\n\t\t\t\t\t<smoothly-input name=\"text\">Input</smoothly-input>\n\t\t\t\t\t<smoothly-input-file camera=\"back\" placeholder=\"Capture a photo\" name=\"image\">\n\t\t\t\t\t\t<span slot=\"label\">Testing camera photo</span>\n\t\t\t\t\t\t<smoothly-icon slot=\"button\" name=\"camera-outline\" />\n\t\t\t\t\t</smoothly-input-file>\n\t\t\t\t\t<smoothly-picker name=\"picker\">\n\t\t\t\t\t\t<span slot=\"label\">Shape</span>\n\t\t\t\t\t\t<span slot=\"search\">Search</span>\n\t\t\t\t\t\t<smoothly-picker-option value={\"circle\"}>\n\t\t\t\t\t\t\t<span slot=\"label\">Circle</span>\n\t\t\t\t\t\t\t<smoothly-icon size=\"tiny\" name=\"ellipse-outline\" />\n\t\t\t\t\t\t</smoothly-picker-option>\n\t\t\t\t\t\t<smoothly-picker-option value={\"cube\"}>\n\t\t\t\t\t\t\t<span slot={\"label\"}>Cube</span>\n\t\t\t\t\t\t\t<smoothly-icon size=\"tiny\" name=\"cube-outline\" />\n\t\t\t\t\t\t</smoothly-picker-option>\n\t\t\t\t\t\t<smoothly-picker-option value={\"square\"} selected>\n\t\t\t\t\t\t\t<span slot={\"label\"}>Square</span>\n\t\t\t\t\t\t\t<smoothly-icon size=\"tiny\" name=\"square-outline\" />\n\t\t\t\t\t\t</smoothly-picker-option>\n\t\t\t\t\t</smoothly-picker>\n\t\t\t\t\t<smoothly-input-select name=\"select\" placeholder=\"Select...\">\n\t\t\t\t\t\t<smoothly-item value=\"1\">January</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"2\">February</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"3\">March</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"4\">April</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"5\">May</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"6\">June</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"7\">July</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"8\">August</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"9\">September</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"10\">October</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"11\">November</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"12\">December</smoothly-item>\n\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t<smoothly-input-date-range\n\t\t\t\t\t\tname=\"date-range\"\n\t\t\t\t\t\tstart={isoly.Date.now()}\n\t\t\t\t\t\tend={isoly.Date.nextMonth(isoly.Date.now())}\n\t\t\t\t\t\tmin=\"2021-10-10\"\n\t\t\t\t\t\tmax=\"2025-12-30\"\n\t\t\t\t\t\tshowLabel={false}\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\"--border-radius\": \"4px\",\n\t\t\t\t\t\t\t\"--padding\": \"0 0.75em\",\n\t\t\t\t\t\t\t\"--input-width\": \"12ch\",\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\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\t\tDate\n\t\t\t\t\t</smoothly-input-date>\n\t\t\t\t\t<smoothly-submit slot=\"submit\" color=\"success\" fill=\"solid\" size=\"icon\">\n\t\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" fill=\"solid\" size=\"medium\" />\n\t\t\t\t\t</smoothly-submit>\n\t\t\t\t</smoothly-form>\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"]}

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

@@ -27,11 +27,11 @@ export class SmoothlyInputSubmit {
   }
   clickHandler() {
     var _a;
-    (_a = this.parent) === null || _a === void 0 ? void 0 : _a.submit(this.delete);
+    !this.disabled && ((_a = this.parent) === null || _a === void 0 ? void 0 : _a.submit(this.delete));
   }
   render() {
     var _a, _b;
-    return (h(Host, { title: this.toolTip }, this.delete == true ? (h("smoothly-button-confirm", { disabled: this.disabled, size: this.size, shape: this.shape, expand: this.expand, type: this.type, color: (_a = this.color) !== null && _a !== void 0 ? _a : "danger", fill: this.fill }, h("slot", null), h("smoothly-icon", { name: "trash-outline", fill: "solid", size: "tiny" }))) : (h("smoothly-button", { disabled: this.disabled, size: this.size, type: this.type, shape: this.shape, expand: this.expand, color: (_b = this.color) !== null && _b !== void 0 ? _b : "success", fill: this.fill }, h("slot", null), h("smoothly-icon", { name: "checkmark-outline", fill: "solid" })))));
+    return (h(Host, { title: this.toolTip }, this.delete == true ? (h("smoothly-button-confirm", { disabled: this.disabled, size: this.size, shape: this.shape, expand: this.expand, type: this.type, color: (_a = this.color) !== null && _a !== void 0 ? _a : "danger", fill: this.fill, onSmoothlyConfirm: () => this.clickHandler() }, h("slot", null), h("smoothly-icon", { name: "trash-outline", fill: "solid", size: "tiny" }))) : (h("smoothly-button", { disabled: this.disabled, size: this.size, type: this.type, shape: this.shape, expand: this.expand, color: (_b = this.color) !== null && _b !== void 0 ? _b : "success", fill: this.fill, onClick: () => this.clickHandler() }, h("slot", null), h("smoothly-icon", { name: "checkmark-outline", fill: "solid", size: "tiny" })))));
   }
   static get is() { return "smoothly-input-submit"; }
   static get encapsulation() { return "scoped"; }
@@ -62,7 +62,7 @@ export class SmoothlyInputSubmit {
           "text": ""
         },
         "attribute": "delete",
-        "reflect": false,
+        "reflect": true,
         "defaultValue": "false"
       },
       "color": {
@@ -256,14 +256,5 @@ export class SmoothlyInputSubmit {
         }
       }];
   }
-  static get listeners() {
-    return [{
-        "name": "click",
-        "method": "clickHandler",
-        "target": undefined,
-        "capture": false,
-        "passive": false
-      }];
-  }
 }
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/input/submit/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, ComponentWillLoad, Event, EventEmitter, h, Host, Listen, Prop, VNode } from \"@stencil/core\"\nimport { Color, Fill } from \"../../../model\"\nimport { Editable } from \"../Editable\"\nimport { Submittable } from \"../Submittable\"\n\n@Component({\n\ttag: \"smoothly-input-submit\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyInputSubmit implements ComponentWillLoad {\n\tprivate parent?: Submittable & Editable\n\t@Prop() delete = false\n\t@Prop() color?: Color\n\t@Prop({ reflect: true }) expand?: \"block\" | \"full\"\n\t@Prop({ reflect: true }) fill?: Fill\n\t@Prop({ reflect: true, mutable: true }) disabled = false\n\t@Prop({ reflect: true, mutable: true }) display = false\n\t@Prop({ reflect: true }) shape?: \"rounded\"\n\t@Prop({ reflect: true }) type: \"link\" | \"button\" = \"button\"\n\t@Prop({ reflect: true }) size: \"flexible\" | \"small\" | \"large\" | \"icon\"\n\t@Prop() toolTip = this.delete ? \"Remove\" : \"Submit\"\n\t@Event() smoothlyInputLoad: EventEmitter<(parent: HTMLElement) => void>\n\tcomponentWillLoad(): void {\n\t\tthis.smoothlyInputLoad.emit(parent => {\n\t\t\tif (Submittable.is(parent) && Editable.type.is(parent)) {\n\t\t\t\tthis.parent = parent\n\t\t\t\tparent.listen(\"changed\", async p => {\n\t\t\t\t\tthis.display = !p.readonly\n\t\t\t\t\tthis.disabled = p.readonly ? true : Object.values(p.value).filter(val => val).length < 1 ? true : !p.changed\n\t\t\t\t})\n\t\t\t}\n\t\t})\n\t}\n\t@Listen(\"click\")\n\tclickHandler() {\n\t\tthis.parent?.submit(this.delete)\n\t}\n\n\trender(): VNode | VNode[] {\n\t\treturn (\n\t\t\t<Host title={this.toolTip}>\n\t\t\t\t{this.delete == true ? (\n\t\t\t\t\t<smoothly-button-confirm\n\t\t\t\t\t\tdisabled={this.disabled}\n\t\t\t\t\t\tsize={this.size}\n\t\t\t\t\t\tshape={this.shape}\n\t\t\t\t\t\texpand={this.expand}\n\t\t\t\t\t\ttype={this.type}\n\t\t\t\t\t\tcolor={this.color ?? \"danger\"}\n\t\t\t\t\t\tfill={this.fill}>\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t\t<smoothly-icon name=\"trash-outline\" fill=\"solid\" size=\"tiny\" />\n\t\t\t\t\t</smoothly-button-confirm>\n\t\t\t\t) : (\n\t\t\t\t\t<smoothly-button\n\t\t\t\t\t\tdisabled={this.disabled}\n\t\t\t\t\t\tsize={this.size}\n\t\t\t\t\t\ttype={this.type}\n\t\t\t\t\t\tshape={this.shape}\n\t\t\t\t\t\texpand={this.expand}\n\t\t\t\t\t\tcolor={this.color ?? \"success\"}\n\t\t\t\t\t\tfill={this.fill}>\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t\t<smoothly-icon name=\"checkmark-outline\" fill=\"solid\" />\n\t\t\t\t\t</smoothly-button>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/input/submit/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, ComponentWillLoad, Event, EventEmitter, h, Host, Prop, VNode } from \"@stencil/core\"\nimport { Color, Fill } from \"../../../model\"\nimport { Editable } from \"../Editable\"\nimport { Submittable } from \"../Submittable\"\n\n@Component({\n\ttag: \"smoothly-input-submit\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyInputSubmit implements ComponentWillLoad {\n\tprivate parent?: Submittable & Editable\n\t@Prop({ reflect: true }) delete = false\n\t@Prop() color?: Color\n\t@Prop({ reflect: true }) expand?: \"block\" | \"full\"\n\t@Prop({ reflect: true }) fill?: Fill\n\t@Prop({ reflect: true, mutable: true }) disabled = false\n\t@Prop({ reflect: true, mutable: true }) display = false\n\t@Prop({ reflect: true }) shape?: \"rounded\"\n\t@Prop({ reflect: true }) type: \"link\" | \"button\" = \"button\"\n\t@Prop({ reflect: true }) size: \"flexible\" | \"small\" | \"large\" | \"icon\"\n\t@Prop() toolTip = this.delete ? \"Remove\" : \"Submit\"\n\t@Event() smoothlyInputLoad: EventEmitter<(parent: HTMLElement) => void>\n\tcomponentWillLoad(): void {\n\t\tthis.smoothlyInputLoad.emit(parent => {\n\t\t\tif (Submittable.is(parent) && Editable.type.is(parent)) {\n\t\t\t\tthis.parent = parent\n\t\t\t\tparent.listen(\"changed\", async p => {\n\t\t\t\t\tthis.display = !p.readonly\n\t\t\t\t\tthis.disabled = p.readonly ? true : Object.values(p.value).filter(val => val).length < 1 ? true : !p.changed\n\t\t\t\t})\n\t\t\t}\n\t\t})\n\t}\n\tclickHandler() {\n\t\t!this.disabled && this.parent?.submit(this.delete)\n\t}\n\n\trender(): VNode | VNode[] {\n\t\treturn (\n\t\t\t<Host title={this.toolTip}>\n\t\t\t\t{this.delete == true ? (\n\t\t\t\t\t<smoothly-button-confirm\n\t\t\t\t\t\tdisabled={this.disabled}\n\t\t\t\t\t\tsize={this.size}\n\t\t\t\t\t\tshape={this.shape}\n\t\t\t\t\t\texpand={this.expand}\n\t\t\t\t\t\ttype={this.type}\n\t\t\t\t\t\tcolor={this.color ?? \"danger\"}\n\t\t\t\t\t\tfill={this.fill}\n\t\t\t\t\t\tonSmoothlyConfirm={() => this.clickHandler()}>\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t\t<smoothly-icon name=\"trash-outline\" fill=\"solid\" size=\"tiny\" />\n\t\t\t\t\t</smoothly-button-confirm>\n\t\t\t\t) : (\n\t\t\t\t\t<smoothly-button\n\t\t\t\t\t\tdisabled={this.disabled}\n\t\t\t\t\t\tsize={this.size}\n\t\t\t\t\t\ttype={this.type}\n\t\t\t\t\t\tshape={this.shape}\n\t\t\t\t\t\texpand={this.expand}\n\t\t\t\t\t\tcolor={this.color ?? \"success\"}\n\t\t\t\t\t\tfill={this.fill}\n\t\t\t\t\t\tonClick={() => this.clickHandler()}>\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t\t<smoothly-icon name=\"checkmark-outline\" fill=\"solid\" size=\"tiny\" />\n\t\t\t\t\t</smoothly-button>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"]}

package/dist/collection/model/Submit.js

@@ -0,0 +1,14 @@
+import { isly } from "isly";
+import { Data } from "./Data";
+export var Submit;
+(function (Submit) {
+  Submit.types = ["update", "change", "fetch", "create", "remove"];
+  Submit.type = isly.object({
+    type: isly.string(Submit.types).optional(),
+    result: isly.function(),
+    value: Data.type,
+  });
+  Submit.is = Submit.type.is;
+  Submit.flaw = Submit.type.flaw;
+})(Submit || (Submit = {}));
+//# sourceMappingURL=Submit.js.map

package/dist/collection/model/Submit.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Submit.js","sourceRoot":"","sources":["../../src/model/Submit.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,MAAM,CAAA;AAC3B,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAO7B,MAAM,KAAW,MAAM,CAStB;AATD,WAAiB,MAAM;EACT,YAAK,GAAG,CAAC,QAAQ,EAAE,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAE,QAAQ,CAAU,CAAA;EAClE,WAAI,GAAG,IAAI,CAAC,MAAM,CAAS;IACvC,IAAI,EAAE,IAAI,CAAC,MAAM,CAAC,OAAA,KAAK,CAAC,CAAC,QAAQ,EAAE;IACnC,MAAM,EAAE,IAAI,CAAC,QAAQ,EAAE;IACvB,KAAK,EAAE,IAAI,CAAC,IAAI;GAChB,CAAC,CAAA;EACW,SAAE,GAAG,OAAA,IAAI,CAAC,EAAE,CAAA;EACZ,WAAI,GAAG,OAAA,IAAI,CAAC,IAAI,CAAA;AAC9B,CAAC,EATgB,MAAM,KAAN,MAAM,QAStB","sourcesContent":["import { isly } from \"isly\"\nimport { Data } from \"./Data\"\n\nexport interface Submit {\n\ttype?: typeof Submit.types[number]\n\tresult: (result: boolean) => void\n\tvalue: Data\n}\nexport namespace Submit {\n\texport const types = [\"update\", \"change\", \"fetch\", \"create\", \"remove\"] as const\n\texport const type = isly.object<Submit>({\n\t\ttype: isly.string(types).optional(),\n\t\tresult: isly.function(),\n\t\tvalue: Data.type,\n\t})\n\texport const is = type.is\n\texport const flaw = type.flaw\n}\n"]}

package/dist/collection/model/index.js

@@ -8,4 +8,5 @@ export { Listenable } from "./Listenable";
 export { StateBase } from "./StateBase";
 export { redirect } from "./redirect";
 export { Data } from "./Data";
+export { Submit } from "./Submit";
 //# sourceMappingURL=index.js.map

package/dist/collection/model/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/model/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAE/B,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AACzC,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAC7B,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAA;AACnC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AAEjC,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAA;AACnC,OAAO,EAAE,UAAU,EAAkD,MAAM,cAAc,CAAA;AACzF,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AACvC,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA","sourcesContent":["export { Autocomplete } from \"./Autocomplete\"\nexport { Color } from \"./Color\"\nexport { Fill } from \"./Fill\"\nexport { GoogleFont } from \"./GoogleFont\"\nexport { Icon } from \"./Icon\"\nexport { Message } from \"./Message\"\nexport { Notice } from \"./Notice\"\nexport { Option } from \"./Option\"\nexport { Trigger } from \"./Trigger\"\nexport { Listenable, HasListenable, WithListenable, CanBeListenable } from \"./Listenable\"\nexport { StateBase } from \"./StateBase\"\nexport { redirect } from \"./redirect\"\nexport { Data } from \"./Data\"\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/model/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAE/B,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AACzC,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAC7B,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAA;AACnC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AAEjC,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAA;AACnC,OAAO,EAAE,UAAU,EAAkD,MAAM,cAAc,CAAA;AACzF,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AACvC,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAC7B,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA","sourcesContent":["export { Autocomplete } from \"./Autocomplete\"\nexport { Color } from \"./Color\"\nexport { Fill } from \"./Fill\"\nexport { GoogleFont } from \"./GoogleFont\"\nexport { Icon } from \"./Icon\"\nexport { Message } from \"./Message\"\nexport { Notice } from \"./Notice\"\nexport { Option } from \"./Option\"\nexport { Trigger } from \"./Trigger\"\nexport { Listenable, HasListenable, WithListenable, CanBeListenable } from \"./Listenable\"\nexport { StateBase } from \"./StateBase\"\nexport { redirect } from \"./redirect\"\nexport { Data } from \"./Data\"\nexport { Submit } from \"./Submit\"\n"]}

package/dist/collection/smoothly.js

@@ -1,3 +1,3 @@
-export { Color, GoogleFont, Message, Notice, Trigger, Listenable, Icon, StateBase, Data, redirect, } from "./model";
+export { Color, GoogleFont, Message, Notice, Trigger, Listenable, Icon, StateBase, Data, redirect, Submit, } from "./model";
 export { Cosmetic } from "./utilities";
 //# sourceMappingURL=smoothly.js.map

package/dist/collection/smoothly.js.map

@@ -1 +1 @@
-{"version":3,"file":"smoothly.js","sourceRoot":"","sources":["../src/smoothly.ts"],"names":[],"mappings":"AACA,OAAO,EAEN,KAAK,EAEL,UAAU,EACV,OAAO,EACP,MAAM,EACN,OAAO,EAEP,UAAU,EAIV,IAAI,EACJ,SAAS,EACT,IAAI,EACJ,QAAQ,GACR,MAAM,SAAS,CAAA;AAChB,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA","sourcesContent":["export { Components, JSX } from \"./components\"\nexport {\n\tAutocomplete,\n\tColor,\n\tFill,\n\tGoogleFont,\n\tMessage,\n\tNotice,\n\tTrigger,\n\tOption,\n\tListenable,\n\tHasListenable,\n\tWithListenable,\n\tCanBeListenable,\n\tIcon,\n\tStateBase,\n\tData,\n\tredirect,\n} from \"./model\"\nexport { Cosmetic } from \"./utilities\"\n"]}
+{"version":3,"file":"smoothly.js","sourceRoot":"","sources":["../src/smoothly.ts"],"names":[],"mappings":"AACA,OAAO,EAEN,KAAK,EAEL,UAAU,EACV,OAAO,EACP,MAAM,EACN,OAAO,EAEP,UAAU,EAIV,IAAI,EACJ,SAAS,EACT,IAAI,EACJ,QAAQ,EACR,MAAM,GACN,MAAM,SAAS,CAAA;AAChB,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA","sourcesContent":["export { Components, JSX } from \"./components\"\nexport {\n\tAutocomplete,\n\tColor,\n\tFill,\n\tGoogleFont,\n\tMessage,\n\tNotice,\n\tTrigger,\n\tOption,\n\tListenable,\n\tHasListenable,\n\tWithListenable,\n\tCanBeListenable,\n\tIcon,\n\tStateBase,\n\tData,\n\tredirect,\n\tSubmit,\n} from \"./model\"\nexport { Cosmetic } from \"./utilities\"\n"]}

package/dist/custom-elements/index.d.ts

@@ -242,6 +242,12 @@ export const SmoothlyInputDemo: {
   new (): SmoothlyInputDemo;
 };
 
+interface SmoothlyInputDemoControlledForm extends Components.SmoothlyInputDemoControlledForm, HTMLElement {}
+export const SmoothlyInputDemoControlledForm: {
+  prototype: SmoothlyInputDemoControlledForm;
+  new (): SmoothlyInputDemoControlledForm;
+};
+
 interface SmoothlyInputEdit extends Components.SmoothlyInputEdit, HTMLElement {}
 export const SmoothlyInputEdit: {
   prototype: SmoothlyInputEdit;