infinity-forge 0.34.9 → 0.35.0
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/dist/ui/components/form/input-date-picker/index.d.ts +1 -0
- package/dist/ui/components/form/input-date-picker/index.js +6 -5
- package/dist/ui/components/form/input-date-picker/index.js.map +1 -1
- package/dist/ui/components/form/input-date-picker/styles.js +1 -1
- package/dist/ui/components/form/input-date-picker/styles.js.map +1 -1
- package/package.json +1 -1
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { ReactDatePickerProps } from 'react-datepicker';
|
|
2
2
|
import { InputProps } from '../interfaces.js';
|
|
3
3
|
export declare function DatePickerInput(props: InputProps & {
|
|
4
|
+
hasIcon?: boolean;
|
|
4
5
|
typePicker: 'month' | 'normal' | 'year';
|
|
5
6
|
} & Partial<ReactDatePickerProps>): import("react/jsx-runtime").JSX.Element;
|
|
@@ -41,12 +41,13 @@ exports.DatePickerInput = void 0;
|
|
|
41
41
|
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
42
42
|
var moment_1 = __importDefault(require("moment"));
|
|
43
43
|
var formik_1 = require("formik");
|
|
44
|
-
var react_datepicker_1 = __importStar(require("react-datepicker"));
|
|
45
44
|
var locale_1 = require("date-fns/locale");
|
|
46
|
-
|
|
45
|
+
var react_datepicker_1 = __importStar(require("react-datepicker"));
|
|
46
|
+
var ui_1 = require("../../../../ui/index.js");
|
|
47
47
|
var input_control_1 = require("../input-control/index.js");
|
|
48
48
|
var date_picket_lib_css_1 = require("./date_picket_lib_css.js");
|
|
49
49
|
var S = __importStar(require("./styles.js"));
|
|
50
|
+
(0, react_datepicker_1.registerLocale)('ptBR', locale_1.ptBR);
|
|
50
51
|
function DatePickerInput(props) {
|
|
51
52
|
var _a = (0, formik_1.useField)({ name: props.name }), field = _a[0], _ = _a[1], handlers = _a[2];
|
|
52
53
|
var configs = {
|
|
@@ -64,9 +65,9 @@ function DatePickerInput(props) {
|
|
|
64
65
|
};
|
|
65
66
|
var activeConfig = configs[props.typePicker];
|
|
66
67
|
var value = (0, moment_1.default)(field.value || new Date()).format(activeConfig.dateFormat);
|
|
67
|
-
return ((0, jsx_runtime_1.jsx)(input_control_1.InputControl, __assign({}, props, { children: (0, jsx_runtime_1.jsx)(date_picket_lib_css_1.InputDatePickerCSS, { children: (0, jsx_runtime_1.jsx)(S.InputDatePicker, { children: (0, jsx_runtime_1.jsx)(react_datepicker_1.default, __assign({}, props, activeConfig, { locale:
|
|
68
|
-
|
|
69
|
-
|
|
68
|
+
return ((0, jsx_runtime_1.jsx)(input_control_1.InputControl, __assign({}, props, { children: (0, jsx_runtime_1.jsx)(date_picket_lib_css_1.InputDatePickerCSS, { children: (0, jsx_runtime_1.jsx)(S.InputDatePicker, { children: (0, jsx_runtime_1.jsxs)("div", { className: 'date_picker_container', children: [props.hasIcon && (0, jsx_runtime_1.jsx)(ui_1.Icon, { name: 'IconCalendar' }), (0, jsx_runtime_1.jsx)(react_datepicker_1.default, __assign({}, props, activeConfig, { locale: 'ptBR', placeholderText: value, onChange: function (val) { return handlers.setValue(val); }, value: value, onKeyDown: function (e) {
|
|
69
|
+
e.preventDefault();
|
|
70
|
+
} }))] }) }) }) })));
|
|
70
71
|
}
|
|
71
72
|
exports.DatePickerInput = DatePickerInput;
|
|
72
73
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/ui/components/form/input-date-picker/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,kDAA2B;AAC3B,iCAAiC;AACjC,mEAAmF;AAEnF,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/ui/components/form/input-date-picker/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,kDAA2B;AAC3B,iCAAiC;AACjC,0CAAsC;AACtC,mEAAmF;AAEnF,2BAA2B;AAC3B,kDAA+C;AAC/C,6DAA0D;AAI1D,0CAA6B;AAE7B,IAAA,iCAAc,EAAC,MAAM,EAAE,aAAI,CAAC,CAAA;AAE5B,SAAgB,eAAe,CAC7B,KAAkH;IAE5G,IAAA,KAAuB,IAAA,iBAAQ,EAAC,EAAE,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,CAAC,EAApD,KAAK,QAAA,EAAE,CAAC,QAAA,EAAE,QAAQ,QAAkC,CAAA;IAE3D,IAAM,OAAO,GAAG;QACd,MAAM,EAAE;YACN,UAAU,EAAE,YAAY;SACzB;QACD,KAAK,EAAE;YACL,UAAU,EAAE,SAAS;YACrB,mBAAmB,EAAE,IAAI;SAC1B;QACD,IAAI,EAAE;YACJ,UAAU,EAAE,MAAM;YAClB,cAAc,EAAE,IAAI;SACrB;KACF,CAAA;IAED,IAAM,YAAY,GAAG,OAAO,CAAC,KAAK,CAAC,UAAU,CAAC,CAAA;IAE9C,IAAM,KAAK,GAAG,IAAA,gBAAM,EAAC,KAAK,CAAC,KAAK,IAAI,IAAI,IAAI,EAAE,CAAC,CAAC,MAAM,CAAC,YAAY,CAAC,UAAU,CAAC,CAAA;IAE/E,OAAO,CACL,uBAAC,4BAAY,eAAK,KAAK,cACrB,uBAAC,wCAAkB,cACjB,uBAAC,CAAC,CAAC,eAAe,cAChB,iCAAK,SAAS,EAAC,uBAAuB,aACnC,KAAK,CAAC,OAAO,IAAI,uBAAC,SAAI,IAAC,IAAI,EAAC,cAAc,GAAG,EAE9C,uBAAC,0BAAU,eACJ,KAAa,EACd,YAAY,IAChB,MAAM,EAAE,MAAM,EACd,eAAe,EAAE,KAAK,EACtB,QAAQ,EAAE,UAAC,GAAG,IAAK,OAAA,QAAQ,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAtB,CAAsB,EACzC,KAAK,EAAE,KAAK,EACZ,SAAS,EAAE,UAAC,CAAC;gCACX,CAAC,CAAC,cAAc,EAAE,CAAA;4BACpB,CAAC,IACD,IACE,GACY,GACD,IACR,CAChB,CAAA;AACH,CAAC;AA9CD,0CA8CC"}
|
|
@@ -9,6 +9,6 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
9
9
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
10
10
|
exports.InputDatePicker = void 0;
|
|
11
11
|
var styled_components_1 = __importDefault(require("styled-components"));
|
|
12
|
-
exports.InputDatePicker = (0, styled_components_1.default)(
|
|
12
|
+
exports.InputDatePicker = (0, styled_components_1.default)('div')(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n .date_picker_container {\n position: relative;\n border-radius: 4px;\n background-color: #000;\n\n > svg {\n top: 50%;\n transform: translateY(-50%);\n position: absolute;\n z-index: 1;\n left: 7px;\n width: 17px;\n height: auto;\n fill: #fff;\n }\n\n > svg + .react-datepicker-wrapper {\n padding-left: 20px;\n }\n\n .react-datepicker-wrapper {\n width: 100%;\n\n input {\n border: 0;\n color: #ffff;\n background-color: transparent;\n }\n }\n\n .react-datepicker-popper {\n width: 100%;\n max-width: 400px;\n .react-datepicker__month-wrapper {\n display: flex;\n\n .react-datepicker__month-text {\n width: 100%;\n height: 25px;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 13px;\n }\n }\n\n .react-datepicker__triangle {\n fill: #fff;\n color: #fff;\n }\n\n .react-datepicker__header {\n background-color: #fff;\n }\n\n .react-datepicker {\n width: 100%;\n\n .react-datepicker__month-container {\n width: 100%;\n }\n\n .react-datepicker-year-header {\n font-size: 15px;\n width: 100%;\n }\n\n .react-datepicker__navigation--previous,\n .react-datepicker__navigation--next {\n transition: 0.2s;\n\n &:hover {\n background-color: #cccccc47;\n transition: 0.2s;\n }\n }\n\n .react-datepicker__navigation-icon--next::before {\n left: -2px;\n }\n\n .react-datepicker__navigation-icon--previous::before {\n right: -2px;\n }\n\n .react-datepicker__year-read-view--down-arrow,\n .react-datepicker__month-read-view--down-arrow,\n .react-datepicker__month-year-read-view--down-arrow,\n .react-datepicker__navigation-icon::before {\n border-color: #111;\n border-style: solid;\n border-width: 2px 2px 0 0;\n height: 8px;\n top: 8px;\n width: 8px;\n }\n }\n }\n }\n\n input.react-datepicker-ignore-onclickoutside {\n background-color: #ffff;\n color: #2b2b2b;\n }\n"], ["\n .date_picker_container {\n position: relative;\n border-radius: 4px;\n background-color: #000;\n\n > svg {\n top: 50%;\n transform: translateY(-50%);\n position: absolute;\n z-index: 1;\n left: 7px;\n width: 17px;\n height: auto;\n fill: #fff;\n }\n\n > svg + .react-datepicker-wrapper {\n padding-left: 20px;\n }\n\n .react-datepicker-wrapper {\n width: 100%;\n\n input {\n border: 0;\n color: #ffff;\n background-color: transparent;\n }\n }\n\n .react-datepicker-popper {\n width: 100%;\n max-width: 400px;\n .react-datepicker__month-wrapper {\n display: flex;\n\n .react-datepicker__month-text {\n width: 100%;\n height: 25px;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 13px;\n }\n }\n\n .react-datepicker__triangle {\n fill: #fff;\n color: #fff;\n }\n\n .react-datepicker__header {\n background-color: #fff;\n }\n\n .react-datepicker {\n width: 100%;\n\n .react-datepicker__month-container {\n width: 100%;\n }\n\n .react-datepicker-year-header {\n font-size: 15px;\n width: 100%;\n }\n\n .react-datepicker__navigation--previous,\n .react-datepicker__navigation--next {\n transition: 0.2s;\n\n &:hover {\n background-color: #cccccc47;\n transition: 0.2s;\n }\n }\n\n .react-datepicker__navigation-icon--next::before {\n left: -2px;\n }\n\n .react-datepicker__navigation-icon--previous::before {\n right: -2px;\n }\n\n .react-datepicker__year-read-view--down-arrow,\n .react-datepicker__month-read-view--down-arrow,\n .react-datepicker__month-year-read-view--down-arrow,\n .react-datepicker__navigation-icon::before {\n border-color: #111;\n border-style: solid;\n border-width: 2px 2px 0 0;\n height: 8px;\n top: 8px;\n width: 8px;\n }\n }\n }\n }\n\n input.react-datepicker-ignore-onclickoutside {\n background-color: #ffff;\n color: #2b2b2b;\n }\n"])));
|
|
13
13
|
var templateObject_1;
|
|
14
14
|
//# sourceMappingURL=styles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../../src/ui/components/form/input-date-picker/styles.ts"],"names":[],"mappings":";;;;;;;;;;AAAA,
|
|
1
|
+
{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../../src/ui/components/form/input-date-picker/styles.ts"],"names":[],"mappings":";;;;;;;;;;AAAA,wEAAsC;AAEzB,QAAA,eAAe,GAAG,IAAA,2BAAM,EAAC,KAAK,CAAC,+1EAAA,4xEAyG3C,KAAA"}
|