@dreamcommerce/aurora 2.4.3 → 2.4.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/build/cjs/packages/aurora/src/components/controls/hoc/control_cell_selector/index.js +2 -2
- package/build/cjs/packages/aurora/src/components/controls/hoc/control_checkbox/index.js +2 -2
- package/build/cjs/packages/aurora/src/components/controls/hoc/control_checkbox_switch/index.js +2 -2
- package/build/cjs/packages/aurora/src/components/controls/hoc/control_color_picker/index.js +3 -3
- package/build/cjs/packages/aurora/src/components/controls/hoc/control_date_picker/index.js +4 -4
- package/build/cjs/packages/aurora/src/components/controls/hoc/control_file_picker/index.js +2 -2
- package/build/cjs/packages/aurora/src/components/controls/hoc/control_input/index.js +2 -2
- package/build/cjs/packages/aurora/src/components/controls/hoc/control_multi_select/index.js +2 -2
- package/build/cjs/packages/aurora/src/components/controls/hoc/control_radio/index.js +2 -2
- package/build/cjs/packages/aurora/src/components/controls/hoc/control_radio_group/index.js +2 -2
- package/build/cjs/packages/aurora/src/components/controls/hoc/control_range/index.js +2 -2
- package/build/cjs/packages/aurora/src/components/controls/hoc/control_select/index.js +2 -2
- package/build/cjs/packages/aurora/src/components/controls/hoc/control_tags_selector/index.js +2 -2
- package/build/cjs/packages/aurora/src/components/controls/hoc/control_textarea/index.js +2 -2
- package/build/cjs/packages/aurora/src/components/date_picker/components/common_ranges.js +1 -1
- package/build/cjs/packages/aurora/src/components/date_picker/components/days_grid.js +1 -1
- package/build/cjs/packages/aurora/src/components/date_picker/components/label.js +2 -2
- package/build/cjs/packages/aurora/src/components/date_picker/components/month_controller.js +3 -3
- package/build/cjs/packages/aurora/src/components/date_picker/components/month_year_picker/components/month_view.js +2 -2
- package/build/cjs/packages/aurora/src/components/date_picker/components/month_year_picker/components/month_year_controller.js +1 -1
- package/build/cjs/packages/aurora/src/components/date_picker/components/month_year_picker/components/month_year_picker_context_manager.js +1 -1
- package/build/cjs/packages/aurora/src/components/date_picker/components/month_year_picker/components/years_view.js +2 -2
- package/build/cjs/packages/aurora/src/components/date_picker/components/pure_date_picker.js +2 -2
- package/build/cjs/packages/aurora/src/components/date_picker/components/single_day.js +2 -2
- package/build/cjs/packages/aurora/src/components/date_picker/hoc/range_picker.js +2 -2
- package/build/cjs/packages/aurora/src/components/date_picker/hoc/single_date_picker.js +1 -1
- package/build/cjs/packages/aurora/src/components/date_picker/index.js +1 -1
- package/build/cjs/packages/aurora/src/components/dropdown/components/content.js +8 -10
- package/build/cjs/packages/aurora/src/components/dropdown/components/content.js.map +1 -1
- package/build/cjs/packages/aurora/src/components/dropdown/components/option_multiple.js +1 -1
- package/build/cjs/packages/aurora/src/components/dropdown/components/select.js +1 -1
- package/build/cjs/packages/aurora/src/components/dropdown/css_classes.js +6 -2
- package/build/cjs/packages/aurora/src/components/dropdown/css_classes.js.map +1 -1
- package/build/cjs/packages/aurora/src/components/hint/index.js +19 -15
- package/build/cjs/packages/aurora/src/components/hint/index.js.map +1 -1
- package/build/cjs/packages/aurora/src/css/date_picker/main.module.less.js +2 -2
- package/build/cjs/packages/aurora/src/css/dropdown/main.module.less.js +2 -2
- package/build/cjs/packages/aurora/src/css/hint/main.module.less.js +3 -3
- package/build/cjs/packages/aurora/src/index.js +10 -10
- package/build/esm/packages/aurora/src/components/controls/hoc/control_cell_selector/index.js +2 -2
- package/build/esm/packages/aurora/src/components/controls/hoc/control_checkbox/index.js +2 -2
- package/build/esm/packages/aurora/src/components/controls/hoc/control_checkbox_switch/index.js +2 -2
- package/build/esm/packages/aurora/src/components/controls/hoc/control_color_picker/index.js +3 -3
- package/build/esm/packages/aurora/src/components/controls/hoc/control_date_picker/index.js +4 -4
- package/build/esm/packages/aurora/src/components/controls/hoc/control_file_picker/index.js +2 -2
- package/build/esm/packages/aurora/src/components/controls/hoc/control_input/index.js +2 -2
- package/build/esm/packages/aurora/src/components/controls/hoc/control_multi_select/index.js +2 -2
- package/build/esm/packages/aurora/src/components/controls/hoc/control_radio/index.js +2 -2
- package/build/esm/packages/aurora/src/components/controls/hoc/control_radio_group/index.js +2 -2
- package/build/esm/packages/aurora/src/components/controls/hoc/control_range/index.js +2 -2
- package/build/esm/packages/aurora/src/components/controls/hoc/control_select/index.js +2 -2
- package/build/esm/packages/aurora/src/components/controls/hoc/control_tags_selector/index.js +2 -2
- package/build/esm/packages/aurora/src/components/controls/hoc/control_textarea/index.js +2 -2
- package/build/esm/packages/aurora/src/components/controls/types.d.ts +1 -5
- package/build/esm/packages/aurora/src/components/controls/types.js +1 -1
- package/build/esm/packages/aurora/src/components/controls/types.js.map +1 -1
- package/build/esm/packages/aurora/src/components/date_picker/components/common_ranges.js +2 -2
- package/build/esm/packages/aurora/src/components/date_picker/components/days_grid.js +4 -4
- package/build/esm/packages/aurora/src/components/date_picker/components/label.js +3 -3
- package/build/esm/packages/aurora/src/components/date_picker/components/month_controller.js +7 -7
- package/build/esm/packages/aurora/src/components/date_picker/components/month_year_picker/components/month_view.js +3 -3
- package/build/esm/packages/aurora/src/components/date_picker/components/month_year_picker/components/month_year_controller.js +5 -5
- package/build/esm/packages/aurora/src/components/date_picker/components/month_year_picker/components/month_year_picker_context_manager.js +1 -1
- package/build/esm/packages/aurora/src/components/date_picker/components/month_year_picker/components/years_view.js +3 -3
- package/build/esm/packages/aurora/src/components/date_picker/components/pure_date_picker.js +4 -4
- package/build/esm/packages/aurora/src/components/date_picker/components/single_day.js +4 -4
- package/build/esm/packages/aurora/src/components/date_picker/hoc/range_picker.js +4 -4
- package/build/esm/packages/aurora/src/components/date_picker/hoc/single_date_picker.js +2 -2
- package/build/esm/packages/aurora/src/components/date_picker/index.js +1 -1
- package/build/esm/packages/aurora/src/components/dropdown/components/content.js +8 -11
- package/build/esm/packages/aurora/src/components/dropdown/components/content.js.map +1 -1
- package/build/esm/packages/aurora/src/components/dropdown/components/option_multiple.js +1 -1
- package/build/esm/packages/aurora/src/components/dropdown/components/select.js +1 -1
- package/build/esm/packages/aurora/src/components/dropdown/css_classes.d.ts +2 -0
- package/build/esm/packages/aurora/src/components/dropdown/css_classes.js +5 -3
- package/build/esm/packages/aurora/src/components/dropdown/css_classes.js.map +1 -1
- package/build/esm/packages/aurora/src/components/hint/index.d.ts +3 -3
- package/build/esm/packages/aurora/src/components/hint/index.js +21 -17
- package/build/esm/packages/aurora/src/components/hint/index.js.map +1 -1
- package/build/esm/packages/aurora/src/css/date_picker/main.module.less.js +2 -2
- package/build/esm/packages/aurora/src/css/dropdown/main.module.less.js +2 -2
- package/build/esm/packages/aurora/src/css/hint/main.module.less.js +3 -3
- package/build/esm/packages/aurora/src/hooks/use_fixed_child_position.js +31 -34
- package/build/esm/packages/aurora/src/hooks/use_fixed_child_position.js.map +1 -1
- package/build/esm/packages/aurora/src/index.js +5 -5
- package/package.json +1 -1
- package/build/cjs/packages/aurora/src/hooks/use_fixed_child_position.js +0 -40
- package/build/cjs/packages/aurora/src/hooks/use_fixed_child_position.js.map +0 -1
|
@@ -3,31 +3,35 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
var React = require('react');
|
|
6
|
+
var index = require('../dropdown/context/index.js');
|
|
6
7
|
var classNames = require('../../utilities/styles/classNames.js');
|
|
7
8
|
var main_module = require('../../css/hint/main.module.less.js');
|
|
9
|
+
var use_toggle = require('../dropdown/hooks/use_toggle.js');
|
|
10
|
+
var index$1 = require('../dropdown/index.js');
|
|
8
11
|
var icon_hint = require('../../assets/icon_hint.js');
|
|
9
|
-
var use_fixed_child_position = require('../../hooks/use_fixed_child_position.js');
|
|
10
12
|
|
|
11
13
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
12
14
|
|
|
13
15
|
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
14
16
|
|
|
15
|
-
const Hint = ({ hint,
|
|
16
|
-
const
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
hPosition === 'right' && 'hint_right',
|
|
21
|
-
hPosition === 'center' && 'hint_horizontal-center',
|
|
22
|
-
vPosition === 'top' && 'hint_top'
|
|
23
|
-
], main_module['default']);
|
|
24
|
-
const hintContentRef = React.useRef(null);
|
|
25
|
-
const { onMouseEnter, style } = use_fixed_child_position.useFixedChildPosition({ useFixed: fixed, vPosition, hPosition, childRef: hintContentRef });
|
|
17
|
+
const Hint = ({ hint, vPosition = 'top', yellow, hPosition = 'right', spacingLeft, spacingRight, iconClass, Icon, onToggle }) => {
|
|
18
|
+
const wrapperRef = React.useRef(null);
|
|
19
|
+
const [isOpen, toggleDropdown] = use_toggle.useToggle(false, onToggle);
|
|
20
|
+
const value = React__default['default'].useMemo(() => ({ wrapperRef, isOpen, toggleDropdown }), [isOpen, toggleDropdown]);
|
|
21
|
+
const containerClassName = classNames.classNames(['hint', spacingLeft && 'hint_spacing-left', spacingRight && 'hint_spacing-right'], main_module['default']);
|
|
26
22
|
const contentClassName = classNames.classNames(['hint__content', yellow && 'hint__content_yellow'], main_module['default']);
|
|
27
23
|
const IconComponent = Icon || icon_hint['default'];
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
24
|
+
const handleOnMouseEnter = () => {
|
|
25
|
+
toggleDropdown();
|
|
26
|
+
};
|
|
27
|
+
const handleOnMouseLeave = () => {
|
|
28
|
+
toggleDropdown();
|
|
29
|
+
};
|
|
30
|
+
return (React__default['default'].createElement(index.DropdownContext.Provider, { value: value },
|
|
31
|
+
React__default['default'].createElement("span", { className: containerClassName, ref: wrapperRef, onMouseEnter: handleOnMouseEnter, onMouseLeave: handleOnMouseLeave },
|
|
32
|
+
React__default['default'].createElement(IconComponent, { className: iconClass }),
|
|
33
|
+
React__default['default'].createElement(index$1['default'].Content, { cssClass: contentClassName, headerComponent: "", arrowSide: hPosition === 'left' ? 'right' : 'left', horizontalPosition: hPosition === 'right' ? 'left' : 'right', verticalPosition: vPosition === 'top' ? 'top' : 'bottom' },
|
|
34
|
+
React__default['default'].createElement("span", null, hint)))));
|
|
31
35
|
};
|
|
32
36
|
|
|
33
37
|
exports.default = Hint;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
1
|
+
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
@@ -5,8 +5,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
5
5
|
var styleInject_es = require('../../../../../external/style-inject/dist/style-inject.es.js');
|
|
6
6
|
|
|
7
7
|
var css_248z = "/* font colors */\n/* actions */\n/* background */\n/* errors */\n/* borders */\n/* grid */\n/* scrollBar */\n/* sizes */\n@media screen and (min-width: 577px) {\n .main-module_date-picker__ZqlVj {\n max-width: 16rem;\n }\n}\n@media screen and (max-width: 576px) {\n .main-module_date-picker__ZqlVj,\n .main-module_range-picker__2nqS6 {\n display: flex;\n flex-direction: column;\n flex-grow: 1;\n }\n .main-module_date-picker__container__3Jt5v {\n flex-grow: 1;\n }\n .main-module_range-picker__2nqS6 .main-module_date-picker__container__3Jt5v:nth-child(1) {\n flex-grow: 1;\n }\n .main-module_range-picker__2nqS6 .main-module_date-picker__container__3Jt5v:nth-child(2) {\n display: none;\n }\n}\n.main-module_date-picker__container__3Jt5v {\n width: 100%;\n background: #ffffff;\n}\n.main-module_date-picker__common-ranges__3aEeE {\n margin: 0 1rem;\n}\n.main-module_date-picker__controller__1csI7 {\n display: flex;\n align-items: center;\n margin: 0.5rem 1rem;\n}\n.main-module_date-picker__controller-arrow__2ip9A {\n border-color: #135cc8;\n border-style: solid;\n width: 0.5rem;\n height: 0.5rem;\n cursor: pointer;\n border-bottom-width: 1px;\n border-right-width: 1px;\n border-top-width: 0;\n border-left-width: 0;\n}\n.main-module_date-picker__controller-arrow_left__1FemM {\n transform: rotate(135deg);\n}\n.main-module_date-picker__controller-arrow_right__2e84W {\n transform: rotate(-45deg);\n}\n.main-module_date-picker__controller-title__3wWrg {\n cursor: pointer;\n text-transform: capitalize;\n text-align: center;\n color: #135cc8;\n flex-grow: 1;\n display: block;\n}\n.main-module_date-picker__label-icon__38IQW {\n height: 1.5rem;\n fill: #135cc8;\n}\n.main-module_date-picker__days-grid__3VC3X {\n width: 100%;\n}\n.main-module_date-picker__days-grid-row__32HHK {\n display: -ms-grid;\n display: grid;\n margin: auto;\n padding: 0.5rem 1rem 0;\n -ms-grid-columns: auto auto auto auto auto auto auto;\n grid-template-columns: auto auto auto auto auto auto auto;\n}\n.main-module_date-picker__days-grid-week-name__k47gT {\n text-align: center;\n text-transform: capitalize;\n color: #abb4cd;\n}\n.main-module_date-picker__day-text_today__2dJSg {\n color: #2d3748;\n background-color: rgba(245, 245, 245, 0.5);\n border-radius: 1rem;\n}\n.main-module_date-picker__day-text_selected__2shDu {\n background: white;\n border: 2px solid #3c83ec;\n color: #5c657e;\n transition: 0.1s color;\n}\n.main-module_date-picker__day-text_rounded-borders__3JVfx {\n display: inline-flex;\n justify-content: center;\n align-items: center;\n width: 2rem;\n height: calc(2rem - 4px);\n border-radius: 1rem;\n}\n.main-module_date-picker__day-text_navigation__nAkfO {\n background: #5c657e;\n color: #ffffff;\n}\n.main-module_date-picker__day__2qClw {\n width: 2rem;\n height: 2rem;\n justify-content: center;\n -ms-grid-column-align: center;\n justify-self: center;\n align-items: center;\n display: inline-flex;\n color: #5c657e;\n text-align: center;\n cursor: pointer;\n}\n.main-module_date-picker__day_blocked__1reCa {\n color: #cccccc;\n}\n.main-module_date-picker__day_in-range__sRkO_ {\n transition: 0.3s background-color, 0.2s color;\n background: #3c83ec;\n color: #ffffff;\n}\n.main-module_date-picker__day_proposed__3Wv7O {\n background-color: #6fb9f7;\n}\n.main-module_date-picker__day_navigation__39Z6G {\n background: #5c657e;\n color: #ffffff;\n}\n.main-module_date-picker__day_range-end-left__2nlsF {\n background: linear-gradient(to left, #3c83ec, #3c83ec 50%, #ffffff 50%);\n border-bottom-right-radius: 0;\n border-top-right-radius: 0;\n}\n.main-module_date-picker__day_range-end-left-proposed__38kpH {\n background: linear-gradient(to left, #6fb9f7, #6fb9f7 50%, #ffffff 50%);\n}\n.main-module_date-picker__day_range-end-right__1137l {\n border-bottom-left-radius: 0;\n border-top-left-radius: 0;\n background: linear-gradient(to right, #3c83ec, #3c83ec 50%, #ffffff 50%);\n}\n.main-module_date-picker__day_range-end-right-proposed__HBi_C {\n background: linear-gradient(to right, #6fb9f7, #6fb9f7 50%, #ffffff 50%);\n}\n.main-module_date-picker__month-table__1Edhl {\n display: -ms-grid;\n display: grid;\n -ms-grid-columns: 4fr 4fr 4fr;\n grid-template-columns: 4fr 4fr 4fr;\n}\n.main-module_date-picker__month-table-item__1nkBu {\n text-align: center;\n padding: 0.5rem;\n color: #5c657e;\n text-transform: capitalize;\n cursor: pointer;\n}\n.main-module_date-picker__month-table-item_selected__2kb5V {\n font-weight: 600;\n color: #3c83ec;\n border-radius: 1.5rem;\n}\n.main-module_range-picker__2nqS6 {\n flex-grow: 1;\n}\n.main-module_range-picker__container__Z23eL {\n display: flex;\n flex-grow: 1;\n}\n";
|
|
8
|
-
var
|
|
8
|
+
var styles = {"date-picker":"main-module_date-picker__ZqlVj","range-picker":"main-module_range-picker__2nqS6","date-picker__container":"main-module_date-picker__container__3Jt5v","date-picker__common-ranges":"main-module_date-picker__common-ranges__3aEeE","date-picker__controller":"main-module_date-picker__controller__1csI7","date-picker__controller-arrow":"main-module_date-picker__controller-arrow__2ip9A","date-picker__controller-arrow_left":"main-module_date-picker__controller-arrow_left__1FemM","date-picker__controller-arrow_right":"main-module_date-picker__controller-arrow_right__2e84W","date-picker__controller-title":"main-module_date-picker__controller-title__3wWrg","date-picker__label-icon":"main-module_date-picker__label-icon__38IQW","date-picker__days-grid":"main-module_date-picker__days-grid__3VC3X","date-picker__days-grid-row":"main-module_date-picker__days-grid-row__32HHK","date-picker__days-grid-week-name":"main-module_date-picker__days-grid-week-name__k47gT","date-picker__day-text_today":"main-module_date-picker__day-text_today__2dJSg","date-picker__day-text_selected":"main-module_date-picker__day-text_selected__2shDu","date-picker__day-text_rounded-borders":"main-module_date-picker__day-text_rounded-borders__3JVfx","date-picker__day-text_navigation":"main-module_date-picker__day-text_navigation__nAkfO","date-picker__day":"main-module_date-picker__day__2qClw","date-picker__day_blocked":"main-module_date-picker__day_blocked__1reCa","date-picker__day_in-range":"main-module_date-picker__day_in-range__sRkO_","date-picker__day_proposed":"main-module_date-picker__day_proposed__3Wv7O","date-picker__day_navigation":"main-module_date-picker__day_navigation__39Z6G","date-picker__day_range-end-left":"main-module_date-picker__day_range-end-left__2nlsF","date-picker__day_range-end-left-proposed":"main-module_date-picker__day_range-end-left-proposed__38kpH","date-picker__day_range-end-right":"main-module_date-picker__day_range-end-right__1137l","date-picker__day_range-end-right-proposed":"main-module_date-picker__day_range-end-right-proposed__HBi_C","date-picker__month-table":"main-module_date-picker__month-table__1Edhl","date-picker__month-table-item":"main-module_date-picker__month-table-item__1nkBu","date-picker__month-table-item_selected":"main-module_date-picker__month-table-item_selected__2kb5V","range-picker__container":"main-module_range-picker__container__Z23eL"};
|
|
9
9
|
styleInject_es['default'](css_248z);
|
|
10
10
|
|
|
11
|
-
exports.default =
|
|
11
|
+
exports.default = styles;
|
|
12
12
|
//# sourceMappingURL=main.module.less.js.map
|
|
@@ -4,8 +4,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
var styleInject_es = require('../../../../../external/style-inject/dist/style-inject.es.js');
|
|
6
6
|
|
|
7
|
-
var css_248z = "/* font colors */\n/* actions */\n/* background */\n/* errors */\n/* borders */\n/* grid */\n/* scrollBar */\n/* sizes */\n/** Form Variables */\n/** Errors */\n@media (max-width: 576px) {\n .main-module_dropdown__content__X9kz_ {\n display: flex;\n flex-direction: column;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n }\n .main-module_dropdown__header__kvhNn {\n display: block;\n }\n .main-module_dropdown__header-title__7NXxw {\n margin-left: 0.5rem;\n }\n}\n@media (min-width: 576px) {\n .main-module_dropdown__header__kvhNn {\n display: none;\n }\n}\n.main-module_dropdown__36KKf {\n position: relative;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n}\n.main-module_dropdown__content__X9kz_ {\n flex: 0 0 auto;\n position: absolute;\n top: 0;\n left: 0;\n z-index: 1200;\n width: auto;\n padding: 0.5rem 0;\n background-color: #ffffff;\n border-radius: 3px;\n box-shadow: 0 0px 10px 0 rgba(0, 0, 0, 0.2);\n}\n.main-module_dropdown__content__X9kz_::before {\n content: '';\n display: block;\n position: absolute;\n top: -14px;\n left: 7px;\n border-width: 7px;\n border-style: solid;\n border-color: transparent transparent #ffffff transparent;\n}\n.main-
|
|
8
|
-
var cssClasses = {"dropdown__content":"main-module_dropdown__content__X9kz_","dropdown__header":"main-module_dropdown__header__kvhNn","dropdown__header-title":"main-module_dropdown__header-title__7NXxw","dropdown":"main-module_dropdown__36KKf","
|
|
7
|
+
var css_248z = "/* font colors */\n/* actions */\n/* background */\n/* errors */\n/* borders */\n/* grid */\n/* scrollBar */\n/* sizes */\n/** Form Variables */\n/** Errors */\n@media (max-width: 576px) {\n .main-module_dropdown__content__X9kz_ {\n display: flex;\n flex-direction: column;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n }\n .main-module_dropdown__header__kvhNn {\n display: block;\n }\n .main-module_dropdown__header-title__7NXxw {\n margin-left: 0.5rem;\n }\n}\n@media (min-width: 576px) {\n .main-module_dropdown__header__kvhNn {\n display: none;\n }\n}\n.main-module_dropdown__36KKf {\n position: relative;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n}\n.main-module_dropdown__content__X9kz_ {\n flex: 0 0 auto;\n position: absolute;\n top: 0;\n left: 0;\n z-index: 1200;\n width: auto;\n padding: 0.5rem 0;\n background-color: #ffffff;\n border-radius: 3px;\n box-shadow: 0 0px 10px 0 rgba(0, 0, 0, 0.2);\n}\n.main-module_dropdown__content__X9kz_::before {\n content: '';\n display: block;\n position: absolute;\n top: -14px;\n left: 7px;\n border-width: 7px;\n border-style: solid;\n border-color: transparent transparent #ffffff transparent;\n}\n.main-module_dropdown__content_arrow-right__2dhyy::before {\n right: 7px;\n left: auto;\n}\n.main-module_dropdown__content_arrow-bottom__mY8R9::before {\n top: auto;\n bottom: -14px;\n border-color: #ffffff transparent transparent transparent;\n}\n.main-module_dropdown__item-with-hover__3g-Za {\n pointer-events: all;\n}\n.main-module_dropdown__item-with-hover__3g-Za:hover {\n background-color: #f5f7ff;\n}\n.main-module_dropdown__list__2bd_r {\n flex: 0 0 auto;\n padding: 0;\n width: 100%;\n min-width: 20rem;\n text-align: left;\n font-size: 14px;\n font-size: 1rem;\n}\n.main-module_dropdown__list__2bd_r > li {\n list-style: none;\n}\n.main-module_dropdown__list-head__2Uyb0 {\n padding: 0.5rem 0 0.5rem 1rem;\n}\n.main-module_dropdown__list_with-scroll__KP9yO {\n scrollbar-color: #79829c #ffffff;\n scrollbar-width: thin;\n max-height: 280px;\n overflow-y: auto;\n}\n.main-module_dropdown__list_with-scroll__KP9yO::-webkit-scrollbar {\n width: 7px;\n}\n.main-module_dropdown__list_with-scroll__KP9yO::-webkit-scrollbar-track {\n background-color: #ffffff;\n}\n.main-module_dropdown__list_with-scroll__KP9yO::-webkit-scrollbar-track:hover {\n background-color: #f3f4f8;\n}\n.main-module_dropdown__list_with-scroll__KP9yO::-webkit-scrollbar-thumb {\n background-color: #5c657e;\n}\n.main-module_dropdown__list_with-scroll__KP9yO::-webkit-scrollbar-thumb:hover {\n background-color: #2d3748;\n}\n.main-module_dropdown__list-item__1u185 {\n display: block;\n padding: 0.5rem 1rem;\n cursor: default;\n}\n.main-module_dropdown__list-item__1u185:hover {\n background-color: #f5f7ff;\n}\n.main-module_dropdown__list-item_selected__2GYQr {\n background-color: #f5f7ff;\n}\n.main-module_dropdown__list-item_disabled__1Psh7 {\n color: #abb4cd;\n}\n.main-module_dropdown__list-item_readonly__3bbj0 {\n color: #abb4cd;\n}\n.main-module_dropdown__search__1Moob {\n padding: 0.5rem 1rem 0.5rem;\n}\n.main-module_dropdown__header__kvhNn {\n margin: calc(1rem * 0.5) 1rem;\n}\n.main-module_dropdown__header-content__10Zg9 {\n display: flex;\n flex-direction: row;\n align-items: center;\n}\n.main-module_dropdown__header-icon__30vfb {\n margin-right: 1rem;\n color: #abb4cd;\n font-size: 10px;\n font-size: 0.7142857142857143rem;\n}\n.main-module_dropdown__header-title__7NXxw {\n font-weight: 600;\n color: #5c657e;\n}\n.main-module_dropdown__error__1oS0H {\n display: flex;\n align-items: center;\n color: #e60c54;\n gap: 6px;\n padding: 0.5rem 1rem;\n}\n.main-module_dropdown__error-icon__3OLzE {\n fill: #e60c54;\n}\n.main-module_dropdown__additional-info__1aTtM {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 0.5rem 1rem;\n}\n.main-module_select__1ocPo {\n position: relative;\n display: flex;\n flex: 0 2 auto;\n align-items: center;\n width: 100%;\n}\n.main-module_select__1ocPo::after {\n content: '';\n position: absolute;\n display: block;\n right: 0.715em;\n width: 7px;\n height: 7px;\n transform: translateY(-25%) rotate(-45deg);\n border-width: 0 0 1px 1px;\n border-style: solid;\n border-color: #3c83ec;\n}\n.main-module_select__1ocPo input {\n width: 100%;\n text-overflow: ellipsis;\n}\n.main-module_dropdown-enter__2RGtd,\n.main-module_modal-enter__I5ELD {\n opacity: 0;\n transform: translate3d(0, -2rem, 0);\n}\n.main-module_mask-enter__32s5F {\n opacity: 0;\n}\n.main-module_dropdown-enter-active__ob1fb,\n.main-module_modal-enter-active__3BMYq {\n opacity: 1;\n transform: translate3d(0, 0, 0);\n transition: transform 0.2s, opacity 0.2s;\n}\n.main-module_mask-enter-active__1WgVf {\n opacity: 1;\n transition: opacity 0.1s;\n}\n.main-module_dropdown-exit__3b2wX,\n.main-module_modal-exit__y2N_F {\n opacity: 1;\n transform: translate3d(0, 0, 0);\n}\n.main-module_mask-exit__325a4 {\n opacity: 1;\n}\n.main-module_dropdown-exit-active__22rth,\n.main-module_modal-exit-active__ID7ce {\n opacity: 0;\n transform: translate3d(0, -2rem, 0);\n transition: transform 0.2s, opacity 0.2s;\n}\n.main-module_mask-exit-active__2qs-r {\n opacity: 0;\n transition: opacity 0.1s;\n}\n";
|
|
8
|
+
var cssClasses = {"dropdown__content":"main-module_dropdown__content__X9kz_","dropdown__header":"main-module_dropdown__header__kvhNn","dropdown__header-title":"main-module_dropdown__header-title__7NXxw","dropdown":"main-module_dropdown__36KKf","dropdown__content_arrow-right":"main-module_dropdown__content_arrow-right__2dhyy","dropdown__content_arrow-bottom":"main-module_dropdown__content_arrow-bottom__mY8R9","dropdown__item-with-hover":"main-module_dropdown__item-with-hover__3g-Za","dropdown__list":"main-module_dropdown__list__2bd_r","dropdown__list-head":"main-module_dropdown__list-head__2Uyb0","dropdown__list_with-scroll":"main-module_dropdown__list_with-scroll__KP9yO","dropdown__list-item":"main-module_dropdown__list-item__1u185","dropdown__list-item_selected":"main-module_dropdown__list-item_selected__2GYQr","dropdown__list-item_disabled":"main-module_dropdown__list-item_disabled__1Psh7","dropdown__list-item_readonly":"main-module_dropdown__list-item_readonly__3bbj0","dropdown__search":"main-module_dropdown__search__1Moob","dropdown__header-content":"main-module_dropdown__header-content__10Zg9","dropdown__header-icon":"main-module_dropdown__header-icon__30vfb","dropdown__error":"main-module_dropdown__error__1oS0H","dropdown__error-icon":"main-module_dropdown__error-icon__3OLzE","dropdown__additional-info":"main-module_dropdown__additional-info__1aTtM","select":"main-module_select__1ocPo","dropdown-enter":"main-module_dropdown-enter__2RGtd","modal-enter":"main-module_modal-enter__I5ELD","mask-enter":"main-module_mask-enter__32s5F","dropdown-enter-active":"main-module_dropdown-enter-active__ob1fb","modal-enter-active":"main-module_modal-enter-active__3BMYq","mask-enter-active":"main-module_mask-enter-active__1WgVf","dropdown-exit":"main-module_dropdown-exit__3b2wX","modal-exit":"main-module_modal-exit__y2N_F","mask-exit":"main-module_mask-exit__325a4","dropdown-exit-active":"main-module_dropdown-exit-active__22rth","modal-exit-active":"main-module_modal-exit-active__ID7ce","mask-exit-active":"main-module_mask-exit-active__2qs-r"};
|
|
9
9
|
styleInject_es['default'](css_248z);
|
|
10
10
|
|
|
11
11
|
exports.default = cssClasses;
|
|
@@ -4,9 +4,9 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
var styleInject_es = require('../../../../../external/style-inject/dist/style-inject.es.js');
|
|
6
6
|
|
|
7
|
-
var css_248z = "/* font colors */\n/* actions */\n/* background */\n/* errors */\n/* borders */\n/* grid */\n/* scrollBar */\n/* sizes */\n.main-module_hint__3cahT {\n
|
|
8
|
-
var
|
|
7
|
+
var css_248z = "/* font colors */\n/* actions */\n/* background */\n/* errors */\n/* borders */\n/* grid */\n/* scrollBar */\n/* sizes */\n.main-module_hint__3cahT {\n vertical-align: middle;\n}\n.main-module_hint_spacing-left__1dKcO {\n margin-left: 1rem;\n}\n.main-module_hint_spacing-right__2dV0Q {\n margin-right: 1rem;\n}\n.main-module_hint__3cahT:hover span {\n color: #3c83ec;\n}\n.main-module_hint__content__IIh3W {\n min-width: 258px;\n max-width: 500px;\n padding: 1rem !important;\n box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.2) !important;\n}\n.main-module_hint__content_yellow__3NyBP {\n background-color: #fff6cc;\n}\n.main-module_hint__content_yellow__3NyBP.main-module_dropdown__content_top__1bZPH::before {\n border-color: #fff6cc transparent transparent transparent;\n}\n.main-module_hint__content_yellow__3NyBP.main-module_dropdown__content_bottom__10hXS::before {\n border-color: transparent transparent #fff6cc transparent;\n}\n";
|
|
8
|
+
var cssClasses = {"hint":"main-module_hint__3cahT","hint_spacing-left":"main-module_hint_spacing-left__1dKcO","hint_spacing-right":"main-module_hint_spacing-right__2dV0Q","hint__content":"main-module_hint__content__IIh3W","hint__content_yellow":"main-module_hint__content_yellow__3NyBP","dropdown__content_top":"main-module_dropdown__content_top__1bZPH","dropdown__content_bottom":"main-module_dropdown__content_bottom__10hXS"};
|
|
9
9
|
styleInject_es['default'](css_248z);
|
|
10
10
|
|
|
11
|
-
exports.default =
|
|
11
|
+
exports.default = cssClasses;
|
|
12
12
|
//# sourceMappingURL=main.module.less.js.map
|
|
@@ -12,17 +12,17 @@ var icon_tick = require('./assets/icon_tick.js');
|
|
|
12
12
|
var index$8 = require('./components/stack/index.js');
|
|
13
13
|
var index$7 = require('./components/label/index.js');
|
|
14
14
|
var index$9 = require('./components/controls/index.js');
|
|
15
|
-
var index$C = require('./components/hint/index.js');
|
|
16
|
-
var index$B = require('./components/controls/hoc/control_cell_selector/index.js');
|
|
17
|
-
var index$b = require('./components/controls/hoc/control_checkbox/index.js');
|
|
18
|
-
var index$c = require('./components/controls/hoc/control_checkbox_switch/index.js');
|
|
19
15
|
var icon_arrow = require('./assets/icon_arrow.js');
|
|
16
|
+
var index$b = require('./components/controls/hoc/control_checkbox/index.js');
|
|
20
17
|
var use_toggle = require('./components/dropdown/hooks/use_toggle.js');
|
|
21
18
|
var index$4 = require('./components/dropdown/index.js');
|
|
19
|
+
var index$C = require('./components/hint/index.js');
|
|
20
|
+
var index$B = require('./components/controls/hoc/control_cell_selector/index.js');
|
|
21
|
+
var index$c = require('./components/controls/hoc/control_checkbox_switch/index.js');
|
|
22
22
|
var index$l = require('./components/controls/hoc/control_color_picker/index.js');
|
|
23
|
-
var icon_calendar = require('./assets/icon_calendar.js');
|
|
24
23
|
var index$5 = require('./components/dropdown/hoc/select/index.js');
|
|
25
24
|
var index$j = require('./components/date_picker/index.js');
|
|
25
|
+
var icon_calendar = require('./assets/icon_calendar.js');
|
|
26
26
|
var index$m = require('./components/controls/hoc/control_date_picker/index.js');
|
|
27
27
|
var index$A = require('./components/file_picker/index.js');
|
|
28
28
|
var index$n = require('./components/controls/hoc/control_file_picker/index.js');
|
|
@@ -90,17 +90,17 @@ exports.IconTick = icon_tick['default'];
|
|
|
90
90
|
exports.Stack = index$8['default'];
|
|
91
91
|
exports.Label = index$7['default'];
|
|
92
92
|
exports.Control = index$9['default'];
|
|
93
|
-
exports.Hint = index$C['default'];
|
|
94
|
-
exports.ControlCellSelector = index$B['default'];
|
|
95
|
-
exports.ControlCheckbox = index$b['default'];
|
|
96
|
-
exports.ControlCheckboxSwitch = index$c['default'];
|
|
97
93
|
exports.IconArrow = icon_arrow['default'];
|
|
94
|
+
exports.ControlCheckbox = index$b['default'];
|
|
98
95
|
exports.useToggle = use_toggle.useToggle;
|
|
99
96
|
exports.Dropdown = index$4['default'];
|
|
97
|
+
exports.Hint = index$C['default'];
|
|
98
|
+
exports.ControlCellSelector = index$B['default'];
|
|
99
|
+
exports.ControlCheckboxSwitch = index$c['default'];
|
|
100
100
|
exports.ControlColorPicker = index$l['default'];
|
|
101
|
-
exports.IconCalendar = icon_calendar['default'];
|
|
102
101
|
exports.Select = index$5['default'];
|
|
103
102
|
exports.Datepicker = index$j['default'];
|
|
103
|
+
exports.IconCalendar = icon_calendar['default'];
|
|
104
104
|
exports.ControlDatepicker = index$m['default'];
|
|
105
105
|
exports.FilePicker = index$A['default'];
|
|
106
106
|
exports.ControlFilePicker = index$n['default'];
|
package/build/esm/packages/aurora/src/components/controls/hoc/control_cell_selector/index.js
CHANGED
|
@@ -3,11 +3,11 @@ import Control from '../../index.js';
|
|
|
3
3
|
import CellSelector from '../../components/cell_selector.js';
|
|
4
4
|
import Hint from '../../../hint/index.js';
|
|
5
5
|
|
|
6
|
-
const ControlCellSelector = ({ label, isRequired, id, name, errors, onChange, cols, initialSelected, rows, withValueOffset, className, hint,
|
|
6
|
+
const ControlCellSelector = ({ label, isRequired, id, name, errors, onChange, cols, initialSelected, rows, withValueOffset, className, hint, labelAdditionalInfo }) => {
|
|
7
7
|
return (React.createElement(Control, { errors: errors, name: name, id: id },
|
|
8
8
|
(label || hint) && (React.createElement(Control.Label, { id: id, isRequired: isRequired, additionalInfo: labelAdditionalInfo },
|
|
9
9
|
label,
|
|
10
|
-
hint && React.createElement(Hint, {
|
|
10
|
+
hint && React.createElement(Hint, { spacingLeft: true, hint: hint }))),
|
|
11
11
|
React.createElement(Control.Content, null,
|
|
12
12
|
React.createElement(Control.Element, null,
|
|
13
13
|
React.createElement(CellSelector, { name: name, onChange: onChange, cols: cols, initialSelected: initialSelected, rows: rows, withValueOffset: withValueOffset, className: className }))),
|
|
@@ -15,7 +15,7 @@ import Hint from '../../../hint/index.js';
|
|
|
15
15
|
* />
|
|
16
16
|
* )
|
|
17
17
|
*/
|
|
18
|
-
const ControlCheckbox = ({ id, hint,
|
|
18
|
+
const ControlCheckbox = ({ id, hint, labelAdditionalInfo, label, name, value, initiallyChecked, disabled, onChange, isRequired, errors }) => {
|
|
19
19
|
return (React.createElement(Control, { errors: errors, name: name, id: id },
|
|
20
20
|
React.createElement(Control.Content, null,
|
|
21
21
|
React.createElement(Control.Element, { type: "checkbox" },
|
|
@@ -23,7 +23,7 @@ const ControlCheckbox = ({ id, hint, hintOptions = { isFixed: true }, labelAddit
|
|
|
23
23
|
React.createElement(Label, { isRequired: isRequired, htmlFor: id, additionalInfo: labelAdditionalInfo },
|
|
24
24
|
label,
|
|
25
25
|
" ",
|
|
26
|
-
hint && React.createElement(Hint, {
|
|
26
|
+
hint && React.createElement(Hint, { hint: hint, spacingLeft: true })))),
|
|
27
27
|
React.createElement(Control.Errors, null)));
|
|
28
28
|
};
|
|
29
29
|
|
package/build/esm/packages/aurora/src/components/controls/hoc/control_checkbox_switch/index.js
CHANGED
|
@@ -15,14 +15,14 @@ import Hint from '../../../hint/index.js';
|
|
|
15
15
|
* />
|
|
16
16
|
* )
|
|
17
17
|
*/
|
|
18
|
-
const ControlCheckboxSwitch = ({ id, label, name, hint,
|
|
18
|
+
const ControlCheckboxSwitch = ({ id, label, name, hint, value, initiallyChecked, disabled, onChange, errors, labelAdditionalInfo }) => {
|
|
19
19
|
return (React.createElement(Control, { errors: errors, name: name, id: id },
|
|
20
20
|
React.createElement(Control.Content, null,
|
|
21
21
|
React.createElement(Control.Element, { type: "checkbox" },
|
|
22
22
|
React.createElement(Control.CheckboxSwitch, { id: id, name: name, value: value, initiallyChecked: initiallyChecked, disabled: disabled, onChange: onChange }),
|
|
23
23
|
React.createElement(Label, { htmlFor: id, additionalInfo: labelAdditionalInfo },
|
|
24
24
|
label,
|
|
25
|
-
hint && React.createElement(Hint, {
|
|
25
|
+
hint && React.createElement(Hint, { hint: hint, spacingLeft: true })))),
|
|
26
26
|
React.createElement(Control.Errors, null)));
|
|
27
27
|
};
|
|
28
28
|
|
|
@@ -4,9 +4,9 @@ import { useColorPicker } from '../../../color_picker/use_color_picker.js';
|
|
|
4
4
|
import withTranslation from '../../../../utilities/translation/with_translation.js';
|
|
5
5
|
import { PureColorPicker } from '../../../color_picker/index.js';
|
|
6
6
|
import Control from '../../index.js';
|
|
7
|
+
import Dropdown from '../../../dropdown/index.js';
|
|
7
8
|
import Hint from '../../../hint/index.js';
|
|
8
9
|
import ColorPickerLabel from '../../../color_picker/components/label.js';
|
|
9
|
-
import Dropdown from '../../../dropdown/index.js';
|
|
10
10
|
|
|
11
11
|
/**
|
|
12
12
|
* @component
|
|
@@ -20,7 +20,7 @@ import Dropdown from '../../../dropdown/index.js';
|
|
|
20
20
|
* />
|
|
21
21
|
* )
|
|
22
22
|
*/
|
|
23
|
-
const ControlColorPicker = ({ initialColor = '#FFFFFF', name, isRequired, label, id, onChange, hideChooseCancelButtons, errors, hint,
|
|
23
|
+
const ControlColorPicker = ({ initialColor = '#FFFFFF', name, isRequired, label, id, onChange, hideChooseCancelButtons, errors, hint, labelAdditionalInfo }) => {
|
|
24
24
|
const colorPickerContext = useColorPicker({ initialColorHex: initialColor, onChange });
|
|
25
25
|
return (React.createElement(ColorPickerContext.Provider, { value: colorPickerContext },
|
|
26
26
|
React.createElement(Dropdown, null,
|
|
@@ -28,7 +28,7 @@ const ControlColorPicker = ({ initialColor = '#FFFFFF', name, isRequired, label,
|
|
|
28
28
|
React.createElement(Control, { errors: errors, name: name, id: id },
|
|
29
29
|
(label || hint) && (React.createElement(Control.Label, { id: id, isRequired: isRequired, additionalInfo: labelAdditionalInfo },
|
|
30
30
|
label,
|
|
31
|
-
hint && React.createElement(Hint, {
|
|
31
|
+
hint && React.createElement(Hint, { hint: hint, spacingLeft: true }))),
|
|
32
32
|
React.createElement(Control.Content, null,
|
|
33
33
|
React.createElement(Control.Element, null,
|
|
34
34
|
React.createElement(ColorPickerLabel, { name: name || '', isRequired: isRequired, id: id, label: label }))),
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import React, { useEffect } from 'react';
|
|
2
2
|
import withTranslation from '../../../../utilities/translation/with_translation.js';
|
|
3
3
|
import Control from '../../index.js';
|
|
4
|
-
import Hint from '../../../hint/index.js';
|
|
5
4
|
import Dropdown from '../../../dropdown/index.js';
|
|
6
|
-
import
|
|
7
|
-
import DatepickerLabel from '../../../date_picker/components/label.js';
|
|
5
|
+
import Hint from '../../../hint/index.js';
|
|
8
6
|
import useValueController from '../../../date_picker/hooks/use_value_controller.js';
|
|
7
|
+
import DatepickerContext from '../../../date_picker/context/value_controller_context.js';
|
|
9
8
|
import { RangePicker } from '../../../date_picker/hoc/range_picker.js';
|
|
10
9
|
import { SingleDatepicker } from '../../../date_picker/hoc/single_date_picker.js';
|
|
10
|
+
import DatepickerLabel from '../../../date_picker/components/label.js';
|
|
11
11
|
|
|
12
12
|
const DatepickerViews = {
|
|
13
13
|
single: SingleDatepicker,
|
|
@@ -46,7 +46,7 @@ const ControlDatepicker = ({ onChange, label, name, isRequired, id = 'datepicker
|
|
|
46
46
|
React.createElement(Control, { errors: errors, name: name, id: id },
|
|
47
47
|
(label || hint) && (React.createElement(Control.Label, { id: id, isRequired: isRequired, additionalInfo: labelAdditionalInfo },
|
|
48
48
|
label,
|
|
49
|
-
hint && React.createElement(Hint, {
|
|
49
|
+
hint && React.createElement(Hint, { hint: hint, spacingLeft: true }))),
|
|
50
50
|
React.createElement(Control.Content, null,
|
|
51
51
|
React.createElement(Control.Element, null,
|
|
52
52
|
React.createElement(DatepickerLabel, { name: name, id: id }))),
|
|
@@ -3,11 +3,11 @@ import Control from '../../index.js';
|
|
|
3
3
|
import Hint from '../../../hint/index.js';
|
|
4
4
|
import FilePicker from '../../../file_picker/index.js';
|
|
5
5
|
|
|
6
|
-
const ControlFilePicker = ({ label, isRequired, id, name, onChange, allowedExtensions, initialFile, className, errors, hint,
|
|
6
|
+
const ControlFilePicker = ({ label, isRequired, id, name, onChange, allowedExtensions, initialFile, className, errors, hint, labelAdditionalInfo }) => {
|
|
7
7
|
return (React.createElement(Control, { errors: errors, name: name, id: id },
|
|
8
8
|
(label || hint) && (React.createElement(Control.Label, { id: id, isRequired: isRequired, additionalInfo: labelAdditionalInfo },
|
|
9
9
|
label,
|
|
10
|
-
hint && React.createElement(Hint, {
|
|
10
|
+
hint && React.createElement(Hint, { hint: hint, spacingLeft: true }))),
|
|
11
11
|
React.createElement(Control.Content, null,
|
|
12
12
|
React.createElement(Control.Element, null,
|
|
13
13
|
React.createElement(FilePicker, { id: id, name: name, onChange: onChange, allowedExtensions: allowedExtensions, initialFile: initialFile, className: className }))),
|
|
@@ -17,11 +17,11 @@ import Hint from '../../../hint/index.js';
|
|
|
17
17
|
* />
|
|
18
18
|
* )
|
|
19
19
|
*/
|
|
20
|
-
const ControlInput = ({ label, isRequired, id, name, value, placeholder, prefix, postfix, disabled, onChange, onKeyPress, onKeyUp, hint,
|
|
20
|
+
const ControlInput = ({ label, isRequired, id, name, value, placeholder, prefix, postfix, disabled, onChange, onKeyPress, onKeyUp, hint, errors, labelAdditionalInfo, additionalInfo, ...props }) => {
|
|
21
21
|
return (React.createElement(Control, { errors: errors, name: name, id: id },
|
|
22
22
|
(label || hint) && (React.createElement(Control.Label, { id: id, isRequired: isRequired, additionalInfo: labelAdditionalInfo },
|
|
23
23
|
label,
|
|
24
|
-
hint && React.createElement(Hint, {
|
|
24
|
+
hint && React.createElement(Hint, { hint: hint, spacingLeft: true }))),
|
|
25
25
|
React.createElement(Control.Content, null,
|
|
26
26
|
React.createElement(Control.Element, { prefix: prefix, postfix: postfix },
|
|
27
27
|
React.createElement(Control.Input, { id: id, name: name, value: value, placeholder: placeholder, disabled: disabled, onChange: onChange, onKeyPress: onKeyPress, onKeyUp: onKeyUp, ...props }))),
|
|
@@ -3,11 +3,11 @@ import Control from '../../index.js';
|
|
|
3
3
|
import Hint from '../../../hint/index.js';
|
|
4
4
|
import Multiple from '../../../dropdown/hoc/multiselect/index.js';
|
|
5
5
|
|
|
6
|
-
const ControlMultiSelect = ({ label, isRequired, id, name, defaultValues, options, isWithGroups, isWithSearch, defaultIsOpen, defaultCloseOnClick, isReadonly, isDisabled, onChange, onToggle, errors, hint,
|
|
6
|
+
const ControlMultiSelect = ({ label, isRequired, id, name, defaultValues, options, isWithGroups, isWithSearch, defaultIsOpen, defaultCloseOnClick, isReadonly, isDisabled, onChange, onToggle, errors, hint, hasCloseIcon, labelAdditionalInfo }) => {
|
|
7
7
|
return (React.createElement(Control, { errors: errors, name: name, id: id },
|
|
8
8
|
(label || hint) && (React.createElement(Control.Label, { id: id, isRequired: isRequired, additionalInfo: labelAdditionalInfo },
|
|
9
9
|
label,
|
|
10
|
-
hint && React.createElement(Hint, {
|
|
10
|
+
hint && React.createElement(Hint, { hint: hint, spacingLeft: true }))),
|
|
11
11
|
React.createElement(Control.Content, null,
|
|
12
12
|
React.createElement(Control.Element, null,
|
|
13
13
|
React.createElement(Multiple, { key: name, name: name, options: options, defaultValues: defaultValues, isWithGroups: isWithGroups, isWithSearch: isWithSearch, defaultIsOpen: defaultIsOpen, defaultCloseOnClick: defaultCloseOnClick, isReadonly: isReadonly, isDisabled: isDisabled, onChange: onChange, onToggle: onToggle, hasCloseIcon: hasCloseIcon }))),
|
|
@@ -16,7 +16,7 @@ import Hint from '../../../hint/index.js';
|
|
|
16
16
|
* />
|
|
17
17
|
* )
|
|
18
18
|
*/
|
|
19
|
-
const ControlRadio = ({ id, label, hint,
|
|
19
|
+
const ControlRadio = ({ id, label, hint, name, value, defaultChecked, checked, disabled, onClick, errors, labelAdditionalInfo }) => {
|
|
20
20
|
return (React.createElement(Control, { errors: errors, name: name, id: id },
|
|
21
21
|
React.createElement(Control.Content, null,
|
|
22
22
|
React.createElement(Control.Element, { type: "radio", verticalPosition: labelAdditionalInfo ? VERTICAL_POSITION.top : undefined },
|
|
@@ -24,7 +24,7 @@ const ControlRadio = ({ id, label, hint, hintOptions = { isFixed: true }, name,
|
|
|
24
24
|
React.createElement(Label, { additionalInfo: labelAdditionalInfo, htmlFor: id },
|
|
25
25
|
label,
|
|
26
26
|
" ",
|
|
27
|
-
hint && React.createElement(Hint, {
|
|
27
|
+
hint && React.createElement(Hint, { hint: hint, spacingLeft: true })))),
|
|
28
28
|
React.createElement(Control.Errors, null)));
|
|
29
29
|
};
|
|
30
30
|
|
|
@@ -3,11 +3,11 @@ import Control from '../../index.js';
|
|
|
3
3
|
import Hint from '../../../hint/index.js';
|
|
4
4
|
import ControlRadio from '../control_radio/index.js';
|
|
5
5
|
|
|
6
|
-
const ControlRadioGroup = ({ id, name, onClick, checkedValue, defaultCheckedValue, label, hint,
|
|
6
|
+
const ControlRadioGroup = ({ id, name, onClick, checkedValue, defaultCheckedValue, label, hint, options, errors, isRequired, labelAdditionalInfo }) => {
|
|
7
7
|
return (React.createElement(Control, { errors: errors, name: name, id: id },
|
|
8
8
|
(label || hint) && (React.createElement(Control.Label, { id: id, isRequired: isRequired, additionalInfo: labelAdditionalInfo },
|
|
9
9
|
label,
|
|
10
|
-
hint && React.createElement(Hint, {
|
|
10
|
+
hint && React.createElement(Hint, { hint: hint, spacingLeft: true }))),
|
|
11
11
|
options.map(({ value, label, hint, disabled }) => (React.createElement(ControlRadio, { key: `RadioGroup${id}-RadioElement-${value}`, label: label, id: `RadioGroup${id}-Radio-${value}`, value: value, hint: hint, disabled: disabled, name: name, defaultChecked: defaultCheckedValue ? defaultCheckedValue === value : undefined, checked: checkedValue ? checkedValue === value : undefined, onClick: onClick }))),
|
|
12
12
|
React.createElement(Control.Errors, null)));
|
|
13
13
|
};
|
|
@@ -3,11 +3,11 @@ import Control from '../../index.js';
|
|
|
3
3
|
import Hint from '../../../hint/index.js';
|
|
4
4
|
import Range from '../../../range/index.js';
|
|
5
5
|
|
|
6
|
-
const ControlRange = ({ label, hint,
|
|
6
|
+
const ControlRange = ({ label, hint, isRequired, id, name, isDisabled, onChange, initialValue, step, max, min, errors, labelAdditionalInfo }) => {
|
|
7
7
|
return (React.createElement(Control, { errors: errors, name: name, id: id },
|
|
8
8
|
(label || hint) && (React.createElement(Control.Label, { id: id, isRequired: isRequired, additionalInfo: labelAdditionalInfo },
|
|
9
9
|
label,
|
|
10
|
-
hint && React.createElement(Hint, {
|
|
10
|
+
hint && React.createElement(Hint, { hint: hint, spacingLeft: true }))),
|
|
11
11
|
React.createElement(Control.Content, null,
|
|
12
12
|
React.createElement(Control.Element, null,
|
|
13
13
|
React.createElement(Range, { initialValue: initialValue, key: name, name: name, isDisabled: isDisabled, onChange: onChange, max: max, min: min, step: step }))),
|
|
@@ -18,11 +18,11 @@ import Select from '../../../dropdown/hoc/select/index.js';
|
|
|
18
18
|
* />
|
|
19
19
|
* )
|
|
20
20
|
*/
|
|
21
|
-
const ControlSelect = ({ label, isRequired, id, name, defaultValues, options, isWithGroups, isWithSearch, defaultIsOpen, defaultCloseOnClick, isReadonly, isDisabled, onChange, onToggle, errors, hint,
|
|
21
|
+
const ControlSelect = ({ label, isRequired, id, name, defaultValues, options, isWithGroups, isWithSearch, defaultIsOpen, defaultCloseOnClick, isReadonly, isDisabled, onChange, onToggle, errors, hint, placeholder, additionalInfo, onScroll, innerAdditionalContent, hasCloseIcon, labelAdditionalInfo }) => {
|
|
22
22
|
return (React.createElement(Control, { errors: errors, name: name, id: id },
|
|
23
23
|
(label || hint) && (React.createElement(Control.Label, { id: id, isRequired: isRequired, additionalInfo: labelAdditionalInfo },
|
|
24
24
|
label,
|
|
25
|
-
hint && React.createElement(Hint, {
|
|
25
|
+
hint && React.createElement(Hint, { hint: hint, spacingLeft: true }))),
|
|
26
26
|
React.createElement(Control.Content, null,
|
|
27
27
|
React.createElement(Control.Element, null,
|
|
28
28
|
React.createElement(Select, { key: name, name: name, options: options, defaultValues: defaultValues, isWithGroups: isWithGroups, isWithSearch: isWithSearch, defaultIsOpen: defaultIsOpen, defaultCloseOnClick: defaultCloseOnClick, isReadonly: isReadonly, isDisabled: isDisabled, placeholder: placeholder, onChange: onChange, onToggle: onToggle, onScroll: onScroll, innerAdditionalContent: innerAdditionalContent, hasCloseIcon: hasCloseIcon }))),
|
package/build/esm/packages/aurora/src/components/controls/hoc/control_tags_selector/index.js
CHANGED
|
@@ -3,11 +3,11 @@ import Control from '../../index.js';
|
|
|
3
3
|
import Hint from '../../../hint/index.js';
|
|
4
4
|
import TagsSelector from '../../../tags_selector/index.js';
|
|
5
5
|
|
|
6
|
-
const ControlTagsSelector = ({ id, name, label, isRequired, placeholder, minTagLength, withList, defaultTags, defaultListTags, onChange, onListItemClick, errors, hint,
|
|
6
|
+
const ControlTagsSelector = ({ id, name, label, isRequired, placeholder, minTagLength, withList, defaultTags, defaultListTags, onChange, onListItemClick, errors, hint, labelAdditionalInfo }) => {
|
|
7
7
|
return (React.createElement(Control, { errors: errors, name: name, id: id },
|
|
8
8
|
(label || hint) && (React.createElement(Control.Label, { id: id, isRequired: isRequired, additionalInfo: labelAdditionalInfo },
|
|
9
9
|
label,
|
|
10
|
-
hint && React.createElement(Hint, {
|
|
10
|
+
hint && React.createElement(Hint, { hint: hint, spacingLeft: true }))),
|
|
11
11
|
React.createElement(Control.Content, null,
|
|
12
12
|
React.createElement(Control.Element, null,
|
|
13
13
|
React.createElement(TagsSelector, { id: id, name: name, placeholder: placeholder, minTagLength: minTagLength, withList: withList, defaultTags: defaultTags, tagsListValue: defaultListTags, onChange: onChange, onListItemClick: onListItemClick }))),
|
|
@@ -17,11 +17,11 @@ import Hint from '../../../hint/index.js';
|
|
|
17
17
|
* />
|
|
18
18
|
* )
|
|
19
19
|
*/
|
|
20
|
-
const ControlTextarea = React.forwardRef(({ label, isRequired, id, name, value, defaultValue, placeholder, disabled, readOnly, onChange, onFocus, onBlur, onKeyPress, errors, hint,
|
|
20
|
+
const ControlTextarea = React.forwardRef(({ label, isRequired, id, name, value, defaultValue, placeholder, disabled, readOnly, onChange, onFocus, onBlur, onKeyPress, errors, hint, labelAdditionalInfo }, ref) => {
|
|
21
21
|
return (React.createElement(Control, { errors: errors, name: name, id: id },
|
|
22
22
|
(label || hint) && (React.createElement(Control.Label, { id: id, isRequired: isRequired, additionalInfo: labelAdditionalInfo },
|
|
23
23
|
label,
|
|
24
|
-
hint && React.createElement(Hint, {
|
|
24
|
+
hint && React.createElement(Hint, { hint: hint, spacingLeft: true }))),
|
|
25
25
|
React.createElement(Control.Content, null,
|
|
26
26
|
React.createElement(Control.Element, null,
|
|
27
27
|
React.createElement(Control.Textarea, { id: id, name: name, value: value, defaultValue: defaultValue, placeholder: placeholder, disabled: disabled, readOnly: readOnly, onChange: onChange, onFocus: onFocus, onBlur: onBlur, onKeyPress: onKeyPress, ref: ref }))),
|
|
@@ -3,8 +3,8 @@ import { IMultiSelectProps, ISelectProps } from "../dropdown/types";
|
|
|
3
3
|
import { IColorPickerProps } from "../color_picker/types";
|
|
4
4
|
import { IFilePicker } from "../file_picker/types";
|
|
5
5
|
import { IRange } from "../range/types";
|
|
6
|
-
import { TVerticalPosition } from "../../typings/general";
|
|
7
6
|
import React from 'react';
|
|
7
|
+
import { TVerticalPosition } from "../../typings/general";
|
|
8
8
|
export declare type TControlErrors = string[] | null | undefined;
|
|
9
9
|
export interface IControlContext {
|
|
10
10
|
errors?: TControlErrors;
|
|
@@ -33,13 +33,9 @@ export interface IControlProps {
|
|
|
33
33
|
interface IControlCommonProps {
|
|
34
34
|
errors?: TControlErrors;
|
|
35
35
|
hint?: string;
|
|
36
|
-
hintOptions?: TControlHintOptions;
|
|
37
36
|
isRequired?: boolean;
|
|
38
37
|
additionalInfo?: string | ReactNode;
|
|
39
38
|
}
|
|
40
|
-
interface TControlHintOptions {
|
|
41
|
-
isFixed: boolean;
|
|
42
|
-
}
|
|
43
39
|
export interface IContentProps {
|
|
44
40
|
children: ReactNode;
|
|
45
41
|
}
|
|
@@ -3,6 +3,6 @@ import '@auroraComponents/dropdown/types';
|
|
|
3
3
|
import '@auroraComponents/color_picker/types';
|
|
4
4
|
import '@auroraComponents/file_picker/types';
|
|
5
5
|
import '@auroraComponents/range/types';
|
|
6
|
-
import '@auroraTypings/general';
|
|
7
6
|
import 'react';
|
|
7
|
+
import '@auroraTypings/general';
|
|
8
8
|
//# sourceMappingURL=types.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../../../src/components/controls/types.ts"],"names":[],"mappings":"AAAA,OAA4F,OAAO,CAAC;AACpG,OAAgD,kCAAkC,CAAC;AAEnF,OAAkC,sCAAsC,CAAC;AACzE,OAA4B,qCAAqC,CAAC;AAClE,OAAuB,+BAA+B,CAAC;AACvD,
|
|
1
|
+
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../../../src/components/controls/types.ts"],"names":[],"mappings":"AAAA,OAA4F,OAAO,CAAC;AACpG,OAAgD,kCAAkC,CAAC;AAEnF,OAAkC,sCAAsC,CAAC;AACzE,OAA4B,qCAAqC,CAAC;AAClE,OAAuB,+BAA+B,CAAC;AACvD,OAAkB,OAAO,CAAC;AAC1B,OAAkC,wBAAwB,CAAC"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import React, { useContext, useRef } from 'react';
|
|
2
2
|
import { useTranslation } from '../../../../../../external/react-i18next/dist/es/useTranslation.js';
|
|
3
3
|
import DatepickerContext from '../context/value_controller_context.js';
|
|
4
|
+
import styles from '../../../css/date_picker/main.module.less.js';
|
|
4
5
|
import { cssDatePickerCommonRanges } from '../css_classes.js';
|
|
5
|
-
import cssClasses from '../../../css/date_picker/main.module.less.js';
|
|
6
6
|
import Select from '../../dropdown/hoc/select/index.js';
|
|
7
7
|
import { getRanges } from '../utilities.js';
|
|
8
8
|
|
|
@@ -15,7 +15,7 @@ const CommonRanges = () => {
|
|
|
15
15
|
const onChange = ({ value }) => {
|
|
16
16
|
setValue(dateRanges[value]);
|
|
17
17
|
};
|
|
18
|
-
return (React.createElement("div", { className:
|
|
18
|
+
return (React.createElement("div", { className: styles[cssDatePickerCommonRanges], ref: ref },
|
|
19
19
|
React.createElement(Select, { name: "common-ranges", options: availableOptions, onChange: onChange, portalContainer: ref })));
|
|
20
20
|
};
|
|
21
21
|
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import React, { useContext } from 'react';
|
|
2
2
|
import DatepickerContext from '../context/value_controller_context.js';
|
|
3
3
|
import MonthYearNavigationContext from '../context/month_year_navigation_context.js';
|
|
4
|
+
import styles from '../../../css/date_picker/main.module.less.js';
|
|
4
5
|
import { cssDatePickerDaysGrid, cssDatePickerDaysGridRow, cssDatePickerDaysGridWeekName } from '../css_classes.js';
|
|
5
|
-
import cssClasses from '../../../css/date_picker/main.module.less.js';
|
|
6
6
|
import SingleDay from './single_day.js';
|
|
7
7
|
import useDateNames from '../hooks/use_date_names.js';
|
|
8
8
|
|
|
@@ -12,9 +12,9 @@ const DaysGrid = () => {
|
|
|
12
12
|
const firstWeekDay = (new Date(year, month, 1).getDay() + 6) % 7;
|
|
13
13
|
const { updateDate } = useContext(DatepickerContext);
|
|
14
14
|
const { weekNameShortcuts } = useDateNames();
|
|
15
|
-
return (React.createElement("div", { className:
|
|
16
|
-
React.createElement("div", { className:
|
|
17
|
-
React.createElement("div", { className: `${
|
|
15
|
+
return (React.createElement("div", { className: styles[cssDatePickerDaysGrid] },
|
|
16
|
+
React.createElement("div", { className: styles[cssDatePickerDaysGridRow] }, weekNameShortcuts.map((weekName, index) => (React.createElement("div", { className: styles[cssDatePickerDaysGridWeekName], key: `week-name-${index}` }, weekName)))),
|
|
17
|
+
React.createElement("div", { className: `${styles[cssDatePickerDaysGridRow]} ${animationClassName}` },
|
|
18
18
|
Array.from(Array(firstWeekDay).keys()).map((_, index) => (React.createElement("div", { key: `empty-day-${index}` }))),
|
|
19
19
|
Array.from(Array(daysInMonth).keys()).map((_, index) => (React.createElement(SingleDay, { date: index + 1, month: month, year: year, updateDate: updateDate, key: `day-${index}` }))))));
|
|
20
20
|
};
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
import React, { useContext } from 'react';
|
|
2
2
|
import InputWrapper from '../../controls/components/input_wrapper.js';
|
|
3
3
|
import DatepickerContext from '../context/value_controller_context.js';
|
|
4
|
-
import
|
|
4
|
+
import styles from '../../../css/date_picker/main.module.less.js';
|
|
5
5
|
import { cssDatePickerLabelIcon } from '../css_classes.js';
|
|
6
|
-
import
|
|
6
|
+
import IconCalendar from '../../../assets/icon_calendar.js';
|
|
7
7
|
|
|
8
8
|
const DatepickerLabel = ({ name }) => {
|
|
9
9
|
const { readable, inputValue } = useContext(DatepickerContext);
|
|
10
10
|
return (React.createElement(React.Fragment, null,
|
|
11
|
-
React.createElement(InputWrapper, { value: readable, preElements: React.createElement(IconCalendar, { className:
|
|
11
|
+
React.createElement(InputWrapper, { value: readable, preElements: React.createElement(IconCalendar, { className: styles[cssDatePickerLabelIcon] }) }),
|
|
12
12
|
React.createElement("input", { type: "hidden", name: name, value: inputValue })));
|
|
13
13
|
};
|
|
14
14
|
|