math-main-components 0.0.40 → 0.0.41
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.
@@ -1,5 +1,5 @@
|
|
1
1
|
import React, { MouseEvent } from 'react';
|
2
|
-
export declare function InputText({ title, name, placeholder, defaultValue, autoFocus, type, width, available, onInput }: {
|
2
|
+
export declare function InputText({ title, name, placeholder, defaultValue, autoFocus, type, width, marginBottom, available, onInput }: {
|
3
3
|
title: string;
|
4
4
|
name: string;
|
5
5
|
placeholder?: string;
|
@@ -7,6 +7,7 @@ export declare function InputText({ title, name, placeholder, defaultValue, auto
|
|
7
7
|
autoFocus?: boolean;
|
8
8
|
type?: string;
|
9
9
|
width?: string;
|
10
|
+
marginBottom?: string;
|
10
11
|
available?: boolean;
|
11
12
|
onInput?: (event: MouseEvent<HTMLInputElement>) => void;
|
12
13
|
}): React.JSX.Element;
|
package/dist/index.cjs.js
CHANGED
@@ -341,14 +341,14 @@ var css_248z$d = ".styles-module_container__zcXGF {\n display: flex;\n width:
|
|
341
341
|
var styles$d = {"container":"styles-module_container__zcXGF","input":"styles-module_input__Tpth8","not_available":"styles-module_not_available__CRXjB","label":"styles-module_label__appHO","label_text":"styles-module_label_text__-sKjY","with_title":"styles-module_with_title__L3eGj","valid":"styles-module_valid__zWcOz"};
|
342
342
|
styleInject(css_248z$d);
|
343
343
|
|
344
|
-
function InputText({ title, name, placeholder = "", defaultValue = "", autoFocus = false, type = "text", width = "100%", available = true, onInput = (event) => { } }) {
|
344
|
+
function InputText({ title, name, placeholder = "", defaultValue = "", autoFocus = false, type = "text", width = "100%", marginBottom, available = true, onInput = (event) => { } }) {
|
345
345
|
const [value, setValue] = React.useState(defaultValue);
|
346
346
|
const inputElement = React.useCallback((element) => {
|
347
347
|
if (element && autoFocus)
|
348
348
|
element.focus();
|
349
349
|
}, [autoFocus]);
|
350
350
|
return (React__default["default"].createElement(React__default["default"].Fragment, null,
|
351
|
-
React__default["default"].createElement("div", { className: styles$d.container, style: { width } },
|
351
|
+
React__default["default"].createElement("div", { className: styles$d.container, style: { width, marginBottom } },
|
352
352
|
React__default["default"].createElement("input", { className: `${styles$d.input} ${title != undefined ? styles$d.with_title : styles$d.without_title} ${value.length > 0 || defaultValue.length > 0 ? styles$d.valid : styles$d.not_valid} ${available ? styles$d.available : styles$d.not_available}`, name: name, type: type, placeholder: placeholder, ref: inputElement, defaultValue: defaultValue, onInput: (event) => {
|
353
353
|
setValue(event.target.value);
|
354
354
|
onInput(event);
|
@@ -628,7 +628,7 @@ function Table({ items, title = "Titel", actions = [], moreActions }) {
|
|
628
628
|
action.title)))))));
|
629
629
|
}
|
630
630
|
|
631
|
-
var css_248z$1 = ".styles-module_container__ItBx0 {\n display: flex;\n flex-direction: row;\n gap: 6px;\n align-items: center;\n color: grey;\n padding: 5px 12px;\n border-radius: 20px;\n}\n.styles-module_container__ItBx0:hover span {\n background: linear-gradient(to
|
631
|
+
var css_248z$1 = ".styles-module_container__ItBx0 {\n display: flex;\n flex-direction: row;\n gap: 6px;\n align-items: center;\n color: grey;\n padding: 5px 12px;\n border-radius: 20px;\n}\n.styles-module_container__ItBx0:hover span {\n background: linear-gradient(to top, #0075FF 30%, rgb(130, 169, 237) 70%, #0050ab 80%);\n -webkit-background-clip: text;\n background-clip: text;\n -webkit-text-fill-color: transparent;\n text-fill-color: transparent;\n background-size: auto 400%;\n animation: styles-module_textShine__ELfW9 3s ease-in-out infinite alternate;\n}\n\n.styles-module_container__ItBx0 a {\n display: flex;\n flex-direction: row;\n gap: 6px;\n align-items: center;\n color: grey;\n padding: 5px 12px;\n border-radius: 20px;\n transition: 0.2s ease-in-out;\n}\n\n@keyframes styles-module_textShine__ELfW9 {\n 0% {\n background-position: 0% 50%;\n }\n 100% {\n background-position: 100% 50%;\n }\n}";
|
632
632
|
var styles$1 = {"container":"styles-module_container__ItBx0","textShine":"styles-module_textShine__ELfW9"};
|
633
633
|
styleInject(css_248z$1);
|
634
634
|
|
package/dist/index.esm.js
CHANGED
@@ -333,14 +333,14 @@ var css_248z$d = ".styles-module_container__zcXGF {\n display: flex;\n width:
|
|
333
333
|
var styles$d = {"container":"styles-module_container__zcXGF","input":"styles-module_input__Tpth8","not_available":"styles-module_not_available__CRXjB","label":"styles-module_label__appHO","label_text":"styles-module_label_text__-sKjY","with_title":"styles-module_with_title__L3eGj","valid":"styles-module_valid__zWcOz"};
|
334
334
|
styleInject(css_248z$d);
|
335
335
|
|
336
|
-
function InputText({ title, name, placeholder = "", defaultValue = "", autoFocus = false, type = "text", width = "100%", available = true, onInput = (event) => { } }) {
|
336
|
+
function InputText({ title, name, placeholder = "", defaultValue = "", autoFocus = false, type = "text", width = "100%", marginBottom, available = true, onInput = (event) => { } }) {
|
337
337
|
const [value, setValue] = useState(defaultValue);
|
338
338
|
const inputElement = useCallback((element) => {
|
339
339
|
if (element && autoFocus)
|
340
340
|
element.focus();
|
341
341
|
}, [autoFocus]);
|
342
342
|
return (React.createElement(React.Fragment, null,
|
343
|
-
React.createElement("div", { className: styles$d.container, style: { width } },
|
343
|
+
React.createElement("div", { className: styles$d.container, style: { width, marginBottom } },
|
344
344
|
React.createElement("input", { className: `${styles$d.input} ${title != undefined ? styles$d.with_title : styles$d.without_title} ${value.length > 0 || defaultValue.length > 0 ? styles$d.valid : styles$d.not_valid} ${available ? styles$d.available : styles$d.not_available}`, name: name, type: type, placeholder: placeholder, ref: inputElement, defaultValue: defaultValue, onInput: (event) => {
|
345
345
|
setValue(event.target.value);
|
346
346
|
onInput(event);
|
@@ -620,7 +620,7 @@ function Table({ items, title = "Titel", actions = [], moreActions }) {
|
|
620
620
|
action.title)))))));
|
621
621
|
}
|
622
622
|
|
623
|
-
var css_248z$1 = ".styles-module_container__ItBx0 {\n display: flex;\n flex-direction: row;\n gap: 6px;\n align-items: center;\n color: grey;\n padding: 5px 12px;\n border-radius: 20px;\n}\n.styles-module_container__ItBx0:hover span {\n background: linear-gradient(to
|
623
|
+
var css_248z$1 = ".styles-module_container__ItBx0 {\n display: flex;\n flex-direction: row;\n gap: 6px;\n align-items: center;\n color: grey;\n padding: 5px 12px;\n border-radius: 20px;\n}\n.styles-module_container__ItBx0:hover span {\n background: linear-gradient(to top, #0075FF 30%, rgb(130, 169, 237) 70%, #0050ab 80%);\n -webkit-background-clip: text;\n background-clip: text;\n -webkit-text-fill-color: transparent;\n text-fill-color: transparent;\n background-size: auto 400%;\n animation: styles-module_textShine__ELfW9 3s ease-in-out infinite alternate;\n}\n\n.styles-module_container__ItBx0 a {\n display: flex;\n flex-direction: row;\n gap: 6px;\n align-items: center;\n color: grey;\n padding: 5px 12px;\n border-radius: 20px;\n transition: 0.2s ease-in-out;\n}\n\n@keyframes styles-module_textShine__ELfW9 {\n 0% {\n background-position: 0% 50%;\n }\n 100% {\n background-position: 100% 50%;\n }\n}";
|
624
624
|
var styles$1 = {"container":"styles-module_container__ItBx0","textShine":"styles-module_textShine__ELfW9"};
|
625
625
|
styleInject(css_248z$1);
|
626
626
|
|