Class TJSInputText

A generic input type has issues w/ 2-way binding w/ Svelte. https://github.com/sveltejs/svelte/issues/3921

A "hack" is used to set the type on the input element: {...{ type }}

Only use this component for text inputs presently. More work to come.

CSS Variables:

--tjs-input-appearance
--tjs-input-background
--tjs-input-border
--tjs-input-border-radius
--tjs-input-border-disabled
--tjs-input-box-shadow-focus
--tjs-input-box-shadow-focus-visible
--tjs-input-caret-color
--tjs-input-color
--tjs-input-color-disabled
--tjs-input-cursor
--tjs-input-cursor-disabled
--tjs-input-flex
--tjs-input-font-family
--tjs-input-font-size
--tjs-input-height
--tjs-input-line-height
--tjs-input-padding
--tjs-input-placeholder-color
--tjs-input-outline-focus-visible
--tjs-input-outline-offset
--tjs-input-overflow
--tjs-input-text-align
--tjs-input-transition-focus-visible
--tjs-input-value-invalid-color
--tjs-input-width

--tjs-input-text-appearance
--tjs-input-text-background
--tjs-input-text-border
--tjs-input-text-border-radius
--tjs-input-text-border-disabled
--tjs-input-text-box-shadow-focus
--tjs-input-text-box-shadow-focus-visible
--tjs-input-text-caret-color
--tjs-input-text-color
--tjs-input-text-color-disabled
--tjs-input-text-cursor
--tjs-input-text-cursor-disabled
--tjs-input-text-flex
--tjs-input-text-font-family
--tjs-input-text-font-size
--tjs-input-text-height
--tjs-input-text-line-height
--tjs-input-text-outline-focus-visible
--tjs-input-text-outline-offset
--tjs-input-text-overflow
--tjs-input-text-padding
--tjs-input-text-placeholder-color
--tjs-input-text-text-align
--tjs-input-text-transition-focus-visible
--tjs-input-text-value-invalid-color
--tjs-input-text-width
Copy