jb-textarea 1.1.3 → 1.1.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +2 -1
- package/dist/JBTextarea.js +1 -1
- package/lib/JBTextarea.scss +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -70,4 +70,5 @@ if you want to set a custom style to this web-component all you need is to set c
|
|
|
70
70
|
| --jb-textarea-max-height | minimum height of text area defualt is `none` |
|
|
71
71
|
| --jb-textarea-placeholder-color | placeholder color defualt is 'initial' |
|
|
72
72
|
| --jb-textarea-placeholder-font-size | placeholder font-size defualt is `initial` |
|
|
73
|
-
| --jb-textarea-label-color | label color defualt is `#1f1735` |
|
|
73
|
+
| --jb-textarea-label-color | label color defualt is `#1f1735` |
|
|
74
|
+
| --jb-textarea-value-color | value color |
|
package/dist/JBTextarea.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
var HTML = "<div class=\"jb-textarea-web-component\">\r\n <label class=\"--hide\"><span class=\"label-value\"></span><span>:</span></label>\r\n <div class=\"textarea-box\">\r\n <textarea class=\"textarea-input\"></textarea>\r\n </div>\r\n <div class=\"message-box\"></div>\r\n</div>";
|
|
2
2
|
|
|
3
|
-
var css_248z = ".jb-textarea-web-component {\n width: 100%;\n margin: var(--jb-textarea-margin, 12px 0); }\n .jb-textarea-web-component label {\n width: 100%;\n margin: 4px 0px;\n display: block;\n font-size: var(--jb-textarea-label-font-size, 0.8em);\n color: #1f1735; }\n .jb-textarea-web-component label.--hide {\n display: none; }\n .jb-textarea-web-component .textarea-box {\n width: 100%;\n box-sizing: border-box;\n border: solid var(--jb-textarea-border-width, 1px) var(--jb-textarea-border-color, #f7f6f6);\n background-color: var(--jb-textarea-bgcolor, #f7f6f6);\n border-bottom: solid var(--jb-textarea-border-botton-width, 3px) var(--jb-textarea-border-color, #f7f6f6);\n border-radius: var(--jb-textarea-border-radius, 16px);\n display: block;\n transition: ease 0.3s all;\n overflow: hidden;\n display: flex;\n justify-content: space-between; }\n .jb-textarea-web-component .textarea-box:focus-within {\n border-color: var(--jb-textarea-border-color-focus, #1e2832); }\n .jb-textarea-web-component .textarea-box textarea {\n border: none;\n width: 100%;\n box-sizing: border-box;\n min-height: var(--jb-textarea-min-height, 80px);\n height: var(--jb-textarea-min-height, 80px);\n max-height: var(--jb-textarea-max-height, none);\n background-color: transparent;\n padding: 6px 12px 4px 12px;\n display: block;\n font-family: inherit;\n font-size: var(--jb-textarea-value-font-size, 1.1em);\n color: #1f1735;\n margin: 0;\n border-radius: 0;\n resize: vertical;\n color: var(--jb-textarea-value-color, initial); }\n .jb-textarea-web-component .textarea-box textarea:focus {\n outline: none; }\n .jb-textarea-web-component .textarea-box textarea::placeholder {\n color: var(--jb-textarea-placeholder-color, initial);\n font-size: var(--jb-textarea-placeholder-font-size, initial); }\n .jb-textarea-web-component .message-box {\n font-size: var(--jb-textarea-message-font-size, 0.7em);\n padding: 2px 8px;\n color: #929292; }\n .jb-textarea-web-component .message-box:empty {\n padding: 0; }\n .jb-textarea-web-component .message-box.error {\n color: var(--jb-textarea-message-error-color, red); }\n\n/*# sourceMappingURL=data:application/json;base64,
|
|
3
|
+
var css_248z = ".jb-textarea-web-component {\n width: 100%;\n margin: var(--jb-textarea-margin, 12px 0); }\n .jb-textarea-web-component label {\n width: 100%;\n margin: 4px 0px;\n display: block;\n font-size: var(--jb-textarea-label-font-size, 0.8em);\n color: var(--jb-textarea-label-color, #1f1735); }\n .jb-textarea-web-component label.--hide {\n display: none; }\n .jb-textarea-web-component .textarea-box {\n width: 100%;\n box-sizing: border-box;\n border: solid var(--jb-textarea-border-width, 1px) var(--jb-textarea-border-color, #f7f6f6);\n background-color: var(--jb-textarea-bgcolor, #f7f6f6);\n border-bottom: solid var(--jb-textarea-border-botton-width, 3px) var(--jb-textarea-border-color, #f7f6f6);\n border-radius: var(--jb-textarea-border-radius, 16px);\n display: block;\n transition: ease 0.3s all;\n overflow: hidden;\n display: flex;\n justify-content: space-between; }\n .jb-textarea-web-component .textarea-box:focus-within {\n border-color: var(--jb-textarea-border-color-focus, #1e2832); }\n .jb-textarea-web-component .textarea-box textarea {\n border: none;\n width: 100%;\n box-sizing: border-box;\n min-height: var(--jb-textarea-min-height, 80px);\n height: var(--jb-textarea-min-height, 80px);\n max-height: var(--jb-textarea-max-height, none);\n background-color: transparent;\n padding: 6px 12px 4px 12px;\n display: block;\n font-family: inherit;\n font-size: var(--jb-textarea-value-font-size, 1.1em);\n color: var(--jb-textarea-value-color, #1f1735);\n margin: 0;\n border-radius: 0;\n resize: vertical;\n color: var(--jb-textarea-value-color, initial); }\n .jb-textarea-web-component .textarea-box textarea:focus {\n outline: none; }\n .jb-textarea-web-component .textarea-box textarea::placeholder {\n color: var(--jb-textarea-placeholder-color, initial);\n font-size: var(--jb-textarea-placeholder-font-size, initial); }\n .jb-textarea-web-component .message-box {\n font-size: var(--jb-textarea-message-font-size, 0.7em);\n padding: 2px 8px;\n color: #929292; }\n .jb-textarea-web-component .message-box:empty {\n padding: 0; }\n .jb-textarea-web-component .message-box.error {\n color: var(--jb-textarea-message-error-color, red); }\n\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkpCVGV4dGFyZWEuc2NzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTtFQUNFLFdBQVc7RUFDWCx5Q0FBeUMsRUFBRTtFQUMzQztJQUNFLFdBQVc7SUFDWCxlQUFlO0lBQ2YsY0FBYztJQUNkLG9EQUFvRDtJQUNwRCw4Q0FBOEMsRUFBRTtJQUNoRDtNQUNFLGFBQWEsRUFBRTtFQUNuQjtJQUNFLFdBQVc7SUFDWCxzQkFBc0I7SUFDdEIsMkZBQTJGO0lBQzNGLHFEQUFxRDtJQUNyRCx5R0FBeUc7SUFDekcscURBQXFEO0lBQ3JELGNBQWM7SUFDZCx5QkFBeUI7SUFDekIsZ0JBQWdCO0lBQ2hCLGFBQWE7SUFDYiw4QkFBOEIsRUFBRTtJQUNoQztNQUNFLDREQUE0RCxFQUFFO0lBQ2hFO01BQ0UsWUFBWTtNQUNaLFdBQVc7TUFDWCxzQkFBc0I7TUFDdEIsK0NBQStDO01BQy9DLDJDQUEyQztNQUMzQywrQ0FBK0M7TUFDL0MsNkJBQTZCO01BQzdCLDBCQUEwQjtNQUMxQixjQUFjO01BQ2Qsb0JBQW9CO01BQ3BCLG9EQUFvRDtNQUNwRCw4Q0FBOEM7TUFDOUMsU0FBUztNQUNULGdCQUFnQjtNQUNoQixnQkFBZ0I7TUFDaEIsOENBQThDLEVBQUU7TUFDaEQ7UUFDRSxhQUFhLEVBQUU7TUFDakI7UUFDRSxvREFBb0Q7UUFDcEQsNERBQTRELEVBQUU7RUFDcEU7SUFDRSxzREFBc0Q7SUFDdEQsZ0JBQWdCO0lBQ2hCLGNBQWMsRUFBRTtJQUNoQjtNQUNFLFVBQVUsRUFBRTtJQUNkO01BQ0Usa0RBQWtELEVBQUUiLCJmaWxlIjoiSkJUZXh0YXJlYS5zY3NzIiwic291cmNlc0NvbnRlbnQiOlsiLmpiLXRleHRhcmVhLXdlYi1jb21wb25lbnQge1xuICB3aWR0aDogMTAwJTtcbiAgbWFyZ2luOiB2YXIoLS1qYi10ZXh0YXJlYS1tYXJnaW4sIDEycHggMCk7IH1cbiAgLmpiLXRleHRhcmVhLXdlYi1jb21wb25lbnQgbGFiZWwge1xuICAgIHdpZHRoOiAxMDAlO1xuICAgIG1hcmdpbjogNHB4IDBweDtcbiAgICBkaXNwbGF5OiBibG9jaztcbiAgICBmb250LXNpemU6IHZhcigtLWpiLXRleHRhcmVhLWxhYmVsLWZvbnQtc2l6ZSwgMC44ZW0pO1xuICAgIGNvbG9yOiB2YXIoLS1qYi10ZXh0YXJlYS1sYWJlbC1jb2xvciwgIzFmMTczNSk7IH1cbiAgICAuamItdGV4dGFyZWEtd2ViLWNvbXBvbmVudCBsYWJlbC4tLWhpZGUge1xuICAgICAgZGlzcGxheTogbm9uZTsgfVxuICAuamItdGV4dGFyZWEtd2ViLWNvbXBvbmVudCAudGV4dGFyZWEtYm94IHtcbiAgICB3aWR0aDogMTAwJTtcbiAgICBib3gtc2l6aW5nOiBib3JkZXItYm94O1xuICAgIGJvcmRlcjogc29saWQgdmFyKC0tamItdGV4dGFyZWEtYm9yZGVyLXdpZHRoLCAxcHgpIHZhcigtLWpiLXRleHRhcmVhLWJvcmRlci1jb2xvciwgI2Y3ZjZmNik7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogdmFyKC0tamItdGV4dGFyZWEtYmdjb2xvciwgI2Y3ZjZmNik7XG4gICAgYm9yZGVyLWJvdHRvbTogc29saWQgdmFyKC0tamItdGV4dGFyZWEtYm9yZGVyLWJvdHRvbi13aWR0aCwgM3B4KSB2YXIoLS1qYi10ZXh0YXJlYS1ib3JkZXItY29sb3IsICNmN2Y2ZjYpO1xuICAgIGJvcmRlci1yYWRpdXM6IHZhcigtLWpiLXRleHRhcmVhLWJvcmRlci1yYWRpdXMsIDE2cHgpO1xuICAgIGRpc3BsYXk6IGJsb2NrO1xuICAgIHRyYW5zaXRpb246IGVhc2UgMC4zcyBhbGw7XG4gICAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIGp1c3RpZnktY29udGVudDogc3BhY2UtYmV0d2VlbjsgfVxuICAgIC5qYi10ZXh0YXJlYS13ZWItY29tcG9uZW50IC50ZXh0YXJlYS1ib3g6Zm9jdXMtd2l0aGluIHtcbiAgICAgIGJvcmRlci1jb2xvcjogdmFyKC0tamItdGV4dGFyZWEtYm9yZGVyLWNvbG9yLWZvY3VzLCAjMWUyODMyKTsgfVxuICAgIC5qYi10ZXh0YXJlYS13ZWItY29tcG9uZW50IC50ZXh0YXJlYS1ib3ggdGV4dGFyZWEge1xuICAgICAgYm9yZGVyOiBub25lO1xuICAgICAgd2lkdGg6IDEwMCU7XG4gICAgICBib3gtc2l6aW5nOiBib3JkZXItYm94O1xuICAgICAgbWluLWhlaWdodDogdmFyKC0tamItdGV4dGFyZWEtbWluLWhlaWdodCwgODBweCk7XG4gICAgICBoZWlnaHQ6IHZhcigtLWpiLXRleHRhcmVhLW1pbi1oZWlnaHQsIDgwcHgpO1xuICAgICAgbWF4LWhlaWdodDogdmFyKC0tamItdGV4dGFyZWEtbWF4LWhlaWdodCwgbm9uZSk7XG4gICAgICBiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgICAgIHBhZGRpbmc6IDZweCAxMnB4IDRweCAxMnB4O1xuICAgICAgZGlzcGxheTogYmxvY2s7XG4gICAgICBmb250LWZhbWlseTogaW5oZXJpdDtcbiAgICAgIGZvbnQtc2l6ZTogdmFyKC0tamItdGV4dGFyZWEtdmFsdWUtZm9udC1zaXplLCAxLjFlbSk7XG4gICAgICBjb2xvcjogdmFyKC0tamItdGV4dGFyZWEtdmFsdWUtY29sb3IsICMxZjE3MzUpO1xuICAgICAgbWFyZ2luOiAwO1xuICAgICAgYm9yZGVyLXJhZGl1czogMDtcbiAgICAgIHJlc2l6ZTogdmVydGljYWw7XG4gICAgICBjb2xvcjogdmFyKC0tamItdGV4dGFyZWEtdmFsdWUtY29sb3IsIGluaXRpYWwpOyB9XG4gICAgICAuamItdGV4dGFyZWEtd2ViLWNvbXBvbmVudCAudGV4dGFyZWEtYm94IHRleHRhcmVhOmZvY3VzIHtcbiAgICAgICAgb3V0bGluZTogbm9uZTsgfVxuICAgICAgLmpiLXRleHRhcmVhLXdlYi1jb21wb25lbnQgLnRleHRhcmVhLWJveCB0ZXh0YXJlYTo6cGxhY2Vob2xkZXIge1xuICAgICAgICBjb2xvcjogdmFyKC0tamItdGV4dGFyZWEtcGxhY2Vob2xkZXItY29sb3IsIGluaXRpYWwpO1xuICAgICAgICBmb250LXNpemU6IHZhcigtLWpiLXRleHRhcmVhLXBsYWNlaG9sZGVyLWZvbnQtc2l6ZSwgaW5pdGlhbCk7IH1cbiAgLmpiLXRleHRhcmVhLXdlYi1jb21wb25lbnQgLm1lc3NhZ2UtYm94IHtcbiAgICBmb250LXNpemU6IHZhcigtLWpiLXRleHRhcmVhLW1lc3NhZ2UtZm9udC1zaXplLCAwLjdlbSk7XG4gICAgcGFkZGluZzogMnB4IDhweDtcbiAgICBjb2xvcjogIzkyOTI5MjsgfVxuICAgIC5qYi10ZXh0YXJlYS13ZWItY29tcG9uZW50IC5tZXNzYWdlLWJveDplbXB0eSB7XG4gICAgICBwYWRkaW5nOiAwOyB9XG4gICAgLmpiLXRleHRhcmVhLXdlYi1jb21wb25lbnQgLm1lc3NhZ2UtYm94LmVycm9yIHtcbiAgICAgIGNvbG9yOiB2YXIoLS1qYi10ZXh0YXJlYS1tZXNzYWdlLWVycm9yLWNvbG9yLCByZWQpOyB9XG4iXX0= */";
|
|
4
4
|
|
|
5
5
|
class JBTextareaWebComponent extends HTMLElement {
|
|
6
6
|
get value() {
|
package/lib/JBTextarea.scss
CHANGED