@bodynarf/react.components 1.12.6 → 1.13.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/changelog.md +54 -0
- package/components/accordion/component/index.d.ts +6 -6
- package/components/accordion/component/index.d.ts.map +1 -1
- package/components/accordion/component/index.js +33 -35
- package/components/accordion/index.d.ts +2 -2
- package/components/accordion/index.js +2 -2
- package/components/accordion/types.d.ts +16 -17
- package/components/accordion/types.d.ts.map +1 -1
- package/components/accordion/types.js +1 -1
- package/components/anchor/component/index.d.ts +7 -5
- package/components/anchor/component/index.d.ts.map +1 -1
- package/components/anchor/component/index.js +23 -20
- package/components/anchor/components/anchorWithIcon/index.d.ts +10 -10
- package/components/anchor/components/anchorWithIcon/index.d.ts.map +1 -1
- package/components/anchor/components/anchorWithIcon/index.js +24 -24
- package/components/anchor/components/simpleAnchor/index.d.ts +4 -5
- package/components/anchor/components/simpleAnchor/index.d.ts.map +1 -1
- package/components/anchor/components/simpleAnchor/index.js +11 -11
- package/components/anchor/index.d.ts +2 -2
- package/components/anchor/index.js +2 -2
- package/components/anchor/types.d.ts +19 -16
- package/components/anchor/types.d.ts.map +1 -1
- package/components/anchor/types.js +1 -1
- package/components/breadcrumbs/component/index.d.ts +8 -8
- package/components/breadcrumbs/component/index.d.ts.map +1 -1
- package/components/breadcrumbs/component/index.js +38 -37
- package/components/breadcrumbs/index.d.ts +2 -2
- package/components/breadcrumbs/index.js +2 -2
- package/components/breadcrumbs/types.d.ts +54 -46
- package/components/breadcrumbs/types.d.ts.map +1 -1
- package/components/breadcrumbs/types.js +1 -1
- package/components/button/component/index.d.ts +9 -8
- package/components/button/component/index.d.ts.map +1 -1
- package/components/button/component/index.js +35 -33
- package/components/button/components/buttonWithIcon/index.d.ts +5 -4
- package/components/button/components/buttonWithIcon/index.d.ts.map +1 -1
- package/components/button/components/buttonWithIcon/index.js +27 -27
- package/components/button/components/simpleButton/index.d.ts +5 -5
- package/components/button/components/simpleButton/index.d.ts.map +1 -1
- package/components/button/components/simpleButton/index.js +11 -11
- package/components/button/index.d.ts +2 -2
- package/components/button/index.js +2 -2
- package/components/button/types.d.ts +71 -37
- package/components/button/types.d.ts.map +1 -1
- package/components/button/types.js +30 -1
- package/components/dropdown/component/index.d.ts +6 -6
- package/components/dropdown/component/index.d.ts.map +1 -1
- package/components/dropdown/component/index.js +12 -12
- package/components/dropdown/components/compact/index.d.ts +10 -10
- package/components/dropdown/components/compact/index.d.ts.map +1 -1
- package/components/dropdown/components/compact/index.js +80 -80
- package/components/dropdown/components/item/index.d.ts +14 -14
- package/components/dropdown/components/item/index.d.ts.map +1 -1
- package/components/dropdown/components/item/index.js +39 -38
- package/components/dropdown/components/label/component/index.d.ts +26 -26
- package/components/dropdown/components/label/component/index.d.ts.map +1 -1
- package/components/dropdown/components/label/component/index.js +16 -16
- package/components/dropdown/components/label/components/empty/index.d.ts +7 -7
- package/components/dropdown/components/label/components/empty/index.d.ts.map +1 -1
- package/components/dropdown/components/label/components/empty/index.js +16 -16
- package/components/dropdown/components/label/components/selected/index.d.ts +7 -7
- package/components/dropdown/components/label/components/selected/index.d.ts.map +1 -1
- package/components/dropdown/components/label/components/selected/index.js +20 -20
- package/components/dropdown/components/label/components/selectedWithIcon/index.d.ts +7 -7
- package/components/dropdown/components/label/components/selectedWithIcon/index.d.ts.map +1 -1
- package/components/dropdown/components/label/components/selectedWithIcon/index.js +28 -28
- package/components/dropdown/components/label/components/withSearch/index.d.ts +15 -15
- package/components/dropdown/components/label/components/withSearch/index.d.ts.map +1 -1
- package/components/dropdown/components/label/components/withSearch/index.js +33 -33
- package/components/dropdown/components/label/index.d.ts +1 -1
- package/components/dropdown/components/label/index.js +1 -1
- package/components/dropdown/components/withLabel/index.d.ts +5 -5
- package/components/dropdown/components/withLabel/index.js +11 -11
- package/components/dropdown/index.d.ts +2 -2
- package/components/dropdown/index.js +2 -2
- package/components/dropdown/types.d.ts +65 -64
- package/components/dropdown/types.d.ts.map +1 -1
- package/components/dropdown/types.js +1 -1
- package/components/file/component/index.d.ts +6 -6
- package/components/file/component/index.d.ts.map +1 -1
- package/components/file/component/index.js +51 -50
- package/components/file/component/styles.scss +13 -0
- package/components/file/index.d.ts +2 -2
- package/components/file/index.js +2 -2
- package/components/file/types.d.ts +31 -31
- package/components/file/types.d.ts.map +1 -1
- package/components/file/types.js +1 -1
- package/components/icon/component/index.d.ts +8 -8
- package/components/icon/component/index.d.ts.map +1 -1
- package/components/icon/component/index.js +23 -28
- package/components/icon/component/style.scss +3 -3
- package/components/icon/index.d.ts +2 -2
- package/components/icon/index.js +2 -2
- package/components/icon/types.d.ts +13 -15
- package/components/icon/types.d.ts.map +1 -1
- package/components/icon/types.js +1 -1
- package/components/index.d.ts +10 -10
- package/components/index.js +10 -10
- package/components/multiselect/component/index.d.ts +7 -7
- package/components/multiselect/component/index.js +13 -13
- package/components/multiselect/components/item/index.d.ts +24 -24
- package/components/multiselect/components/item/index.d.ts.map +1 -1
- package/components/multiselect/components/item/index.js +63 -62
- package/components/multiselect/components/label/component/index.d.ts +19 -19
- package/components/multiselect/components/label/component/index.d.ts.map +1 -1
- package/components/multiselect/components/label/component/index.js +12 -12
- package/components/multiselect/components/label/components/empty/index.d.ts +7 -7
- package/components/multiselect/components/label/components/empty/index.d.ts.map +1 -1
- package/components/multiselect/components/label/components/empty/index.js +16 -16
- package/components/multiselect/components/label/components/nonEmpty/index.d.ts +7 -7
- package/components/multiselect/components/label/components/nonEmpty/index.d.ts.map +1 -1
- package/components/multiselect/components/label/components/nonEmpty/index.js +16 -16
- package/components/multiselect/components/label/index.d.ts +1 -1
- package/components/multiselect/components/label/index.js +1 -1
- package/components/multiselect/components/withLabel/index.d.ts +5 -5
- package/components/multiselect/components/withLabel/index.js +11 -11
- package/components/multiselect/components/withoutLabel/index.d.ts +9 -9
- package/components/multiselect/components/withoutLabel/index.d.ts.map +1 -1
- package/components/multiselect/components/withoutLabel/index.js +85 -84
- package/components/multiselect/index.d.ts +2 -2
- package/components/multiselect/index.js +2 -2
- package/components/multiselect/types.d.ts +32 -40
- package/components/multiselect/types.d.ts.map +1 -1
- package/components/multiselect/types.js +1 -1
- package/components/paginator/component/index.d.ts +8 -8
- package/components/paginator/component/index.d.ts.map +1 -1
- package/components/paginator/component/index.js +65 -70
- package/components/paginator/index.d.ts +2 -2
- package/components/paginator/index.js +2 -2
- package/components/paginator/types.d.ts +54 -54
- package/components/paginator/types.d.ts.map +1 -1
- package/components/paginator/types.js +1 -1
- package/components/primitives/checkbox/component/index.d.ts +5 -6
- package/components/primitives/checkbox/component/index.d.ts.map +1 -1
- package/components/primitives/checkbox/component/index.js +43 -41
- package/components/primitives/checkbox/index.d.ts +2 -2
- package/components/primitives/checkbox/index.js +2 -2
- package/components/primitives/checkbox/types.d.ts +26 -24
- package/components/primitives/checkbox/types.d.ts.map +1 -1
- package/components/primitives/checkbox/types.js +1 -1
- package/components/primitives/color/component/index.d.ts +5 -6
- package/components/primitives/color/component/index.d.ts.map +1 -1
- package/components/primitives/color/component/index.js +10 -10
- package/components/primitives/color/components/picker/index.d.ts +19 -19
- package/components/primitives/color/components/picker/index.d.ts.map +1 -1
- package/components/primitives/color/components/picker/index.js +43 -42
- package/components/primitives/color/components/withLabel/index.d.ts +5 -5
- package/components/primitives/color/components/withLabel/index.d.ts.map +1 -1
- package/components/primitives/color/components/withLabel/index.js +25 -25
- package/components/primitives/color/components/withoutLabel/index.d.ts +5 -5
- package/components/primitives/color/components/withoutLabel/index.d.ts.map +1 -1
- package/components/primitives/color/components/withoutLabel/index.js +21 -21
- package/components/primitives/color/index.d.ts +2 -2
- package/components/primitives/color/index.js +2 -2
- package/components/primitives/color/types.d.ts +23 -23
- package/components/primitives/color/types.d.ts.map +1 -1
- package/components/primitives/color/types.js +1 -1
- package/components/primitives/date/component/index.d.ts +5 -6
- package/components/primitives/date/component/index.d.ts.map +1 -1
- package/components/primitives/date/component/index.js +31 -31
- package/components/primitives/date/index.d.ts +2 -2
- package/components/primitives/date/index.js +2 -2
- package/components/primitives/date/types.d.ts +3 -8
- package/components/primitives/date/types.d.ts.map +1 -1
- package/components/primitives/date/types.js +1 -1
- package/components/primitives/index.d.ts +7 -7
- package/components/primitives/index.js +7 -7
- package/components/primitives/internal/componentWithLabel/index.d.ts +16 -16
- package/components/primitives/internal/componentWithLabel/index.d.ts.map +1 -1
- package/components/primitives/internal/componentWithLabel/index.js +30 -30
- package/components/primitives/internal/hint/index.d.ts +8 -8
- package/components/primitives/internal/hint/index.d.ts.map +1 -1
- package/components/primitives/internal/hint/index.js +49 -48
- package/components/primitives/multiline/component/index.d.ts +4 -5
- package/components/primitives/multiline/component/index.d.ts.map +1 -1
- package/components/primitives/multiline/component/index.js +11 -11
- package/components/primitives/multiline/components/withLabel/index.d.ts +4 -5
- package/components/primitives/multiline/components/withLabel/index.d.ts.map +1 -1
- package/components/primitives/multiline/components/withLabel/index.js +27 -27
- package/components/primitives/multiline/components/withoutLabel/index.d.ts +4 -5
- package/components/primitives/multiline/components/withoutLabel/index.d.ts.map +1 -1
- package/components/primitives/multiline/components/withoutLabel/index.js +27 -27
- package/components/primitives/multiline/index.d.ts +2 -2
- package/components/primitives/multiline/index.js +2 -2
- package/components/primitives/multiline/types.d.ts +8 -10
- package/components/primitives/multiline/types.d.ts.map +1 -1
- package/components/primitives/multiline/types.js +1 -1
- package/components/primitives/number/component/index.d.ts +4 -5
- package/components/primitives/number/component/index.d.ts.map +1 -1
- package/components/primitives/number/component/index.js +11 -11
- package/components/primitives/number/components/withLabel/index.d.ts +4 -5
- package/components/primitives/number/components/withLabel/index.d.ts.map +1 -1
- package/components/primitives/number/components/withLabel/index.js +27 -27
- package/components/primitives/number/components/withoutLabel/index.d.ts +4 -5
- package/components/primitives/number/components/withoutLabel/index.d.ts.map +1 -1
- package/components/primitives/number/components/withoutLabel/index.js +27 -27
- package/components/primitives/number/index.d.ts +2 -2
- package/components/primitives/number/index.js +2 -2
- package/components/primitives/number/types.d.ts +10 -12
- package/components/primitives/number/types.d.ts.map +1 -1
- package/components/primitives/number/types.js +1 -1
- package/components/primitives/password/component/index.d.ts +5 -5
- package/components/primitives/password/component/index.d.ts.map +1 -1
- package/components/primitives/password/component/index.js +12 -12
- package/components/primitives/password/components/withLabel/index.d.ts +3 -3
- package/components/primitives/password/components/withLabel/index.d.ts.map +1 -1
- package/components/primitives/password/components/withLabel/index.js +34 -34
- package/components/primitives/password/components/withoutLabel/index.d.ts +3 -3
- package/components/primitives/password/components/withoutLabel/index.d.ts.map +1 -1
- package/components/primitives/password/components/withoutLabel/index.js +34 -34
- package/components/primitives/password/index.d.ts +2 -2
- package/components/primitives/password/index.js +2 -2
- package/components/primitives/password/types.d.ts +14 -14
- package/components/primitives/password/types.d.ts.map +1 -1
- package/components/primitives/password/types.js +1 -1
- package/components/primitives/text/component/index.d.ts +4 -5
- package/components/primitives/text/component/index.d.ts.map +1 -1
- package/components/primitives/text/component/index.js +11 -11
- package/components/primitives/text/components/withLabel/index.d.ts +4 -5
- package/components/primitives/text/components/withLabel/index.d.ts.map +1 -1
- package/components/primitives/text/components/withLabel/index.js +27 -27
- package/components/primitives/text/components/withoutLabel/index.d.ts +4 -5
- package/components/primitives/text/components/withoutLabel/index.d.ts.map +1 -1
- package/components/primitives/text/components/withoutLabel/index.js +27 -27
- package/components/primitives/text/index.d.ts +2 -2
- package/components/primitives/text/index.js +2 -2
- package/components/primitives/text/types.d.ts +3 -6
- package/components/primitives/text/types.d.ts.map +1 -1
- package/components/primitives/text/types.js +1 -1
- package/components/search/component/index.d.ts +6 -5
- package/components/search/component/index.d.ts.map +1 -1
- package/components/search/component/index.js +41 -40
- package/components/search/index.d.ts +2 -2
- package/components/search/index.js +2 -2
- package/components/search/types.d.ts +41 -41
- package/components/search/types.d.ts.map +1 -1
- package/components/search/types.js +1 -1
- package/components/table/component/index.d.ts +8 -9
- package/components/table/component/index.d.ts.map +1 -1
- package/components/table/component/index.js +28 -29
- package/components/table/components/heading/index.d.ts +14 -12
- package/components/table/components/heading/index.d.ts.map +1 -1
- package/components/table/components/heading/index.js +21 -21
- package/components/table/index.d.ts +2 -2
- package/components/table/index.js +2 -2
- package/components/table/types.d.ts +52 -52
- package/components/table/types.d.ts.map +1 -1
- package/components/table/types.js +1 -1
- package/components/tabs/component/index.d.ts +9 -9
- package/components/tabs/component/index.d.ts.map +1 -1
- package/components/tabs/component/index.js +68 -74
- package/components/tabs/components/item/index.d.ts +11 -12
- package/components/tabs/components/item/index.d.ts.map +1 -1
- package/components/tabs/components/item/index.js +28 -28
- package/components/tabs/index.d.ts +2 -2
- package/components/tabs/index.js +2 -2
- package/components/tabs/types.d.ts +54 -54
- package/components/tabs/types.js +22 -22
- package/components/tag/component/index.d.ts +6 -6
- package/components/tag/component/index.d.ts.map +1 -1
- package/components/tag/component/index.js +32 -32
- package/components/tag/index.d.ts +2 -2
- package/components/tag/index.js +2 -2
- package/components/tag/types.d.ts +24 -26
- package/components/tag/types.d.ts.map +1 -1
- package/components/tag/types.js +1 -1
- package/hooks/index.d.ts +11 -5
- package/hooks/index.d.ts.map +1 -1
- package/hooks/index.js +11 -5
- package/hooks/useComponentOutsideClick.d.ts +11 -11
- package/hooks/useComponentOutsideClick.d.ts.map +1 -1
- package/hooks/useComponentOutsideClick.js +31 -31
- package/hooks/useDebounceHandler.d.ts +17 -17
- package/hooks/useDebounceHandler.d.ts.map +1 -1
- package/hooks/useDebounceHandler.js +30 -30
- package/hooks/useEventListener.d.ts +13 -0
- package/hooks/useEventListener.d.ts.map +1 -0
- package/hooks/useEventListener.js +23 -0
- package/hooks/useInterval.d.ts +12 -0
- package/hooks/useInterval.d.ts.map +1 -0
- package/hooks/useInterval.js +23 -0
- package/hooks/useLocalStorage.d.ts +13 -0
- package/hooks/useLocalStorage.d.ts.map +1 -0
- package/hooks/useLocalStorage.js +23 -0
- package/hooks/useMount.d.ts +11 -11
- package/hooks/useMount.d.ts.map +1 -1
- package/hooks/useMount.js +16 -16
- package/hooks/usePagination.d.ts +19 -19
- package/hooks/usePagination.d.ts.map +1 -1
- package/hooks/usePagination.js +37 -37
- package/hooks/usePrevious.d.ts +12 -0
- package/hooks/usePrevious.d.ts.map +1 -0
- package/hooks/usePrevious.js +18 -0
- package/hooks/useTimeout.d.ts +12 -0
- package/hooks/useTimeout.d.ts.map +1 -0
- package/hooks/useTimeout.js +23 -0
- package/hooks/useUnmount.d.ts +8 -8
- package/hooks/useUnmount.d.ts.map +1 -1
- package/hooks/useUnmount.js +22 -22
- package/hooks/useUpdateEffect.d.ts +16 -0
- package/hooks/useUpdateEffect.d.ts.map +1 -0
- package/hooks/useUpdateEffect.js +25 -0
- package/index.d.ts +4 -4
- package/index.js +4 -4
- package/package.json +12 -10
- package/tsconfig.tsbuildinfo +1 -1
- package/types/{baseElementProps.d.ts → base/baseElementProps.d.ts} +10 -10
- package/types/base/baseElementProps.d.ts.map +1 -0
- package/types/{baseElementProps.js → base/baseElementProps.js} +1 -1
- package/types/{baseInputElementProps.d.ts → base/baseInputElementProps.d.ts} +49 -41
- package/types/base/baseInputElementProps.d.ts.map +1 -0
- package/types/{baseInputElementProps.js → base/baseInputElementProps.js} +1 -1
- package/types/base/blurableElement.d.ts +9 -0
- package/types/base/blurableElement.d.ts.map +1 -0
- package/types/base/blurableElement.js +1 -0
- package/types/base/clickableElement.d.ts +7 -0
- package/types/base/clickableElement.d.ts.map +1 -0
- package/types/base/clickableElement.js +1 -0
- package/types/base/index.d.ts +5 -0
- package/types/base/index.d.ts.map +1 -0
- package/types/base/index.js +4 -0
- package/types/dataAttributes.d.ts +8 -8
- package/types/dataAttributes.d.ts.map +1 -1
- package/types/dataAttributes.js +1 -1
- package/types/elementIcon.d.ts +21 -21
- package/types/elementIcon.d.ts.map +1 -1
- package/types/elementIcon.js +1 -1
- package/types/{elementColor.d.ts → enums/elementColor.d.ts} +17 -17
- package/types/enums/elementColor.d.ts.map +1 -0
- package/types/{elementColor.js → enums/elementColor.js} +18 -18
- package/types/{elementPosition.d.ts → enums/elementPosition.d.ts} +11 -11
- package/types/enums/elementPosition.d.ts.map +1 -0
- package/types/{elementPosition.js → enums/elementPosition.js} +10 -10
- package/types/{elementSize.d.ts → enums/elementSize.d.ts} +11 -11
- package/types/enums/elementSize.d.ts.map +1 -0
- package/types/{elementSize.js → enums/elementSize.js} +12 -12
- package/types/enums/index.d.ts +4 -0
- package/types/enums/index.d.ts.map +1 -0
- package/types/enums/index.js +3 -0
- package/types/hintConfiguration.d.ts +12 -12
- package/types/hintConfiguration.d.ts.map +1 -1
- package/types/hintConfiguration.js +1 -1
- package/types/index.d.ts +7 -10
- package/types/index.d.ts.map +1 -1
- package/types/index.js +7 -10
- package/types/labelConfiguration.d.ts +14 -14
- package/types/labelConfiguration.d.ts.map +1 -1
- package/types/labelConfiguration.js +1 -1
- package/types/validation/index.d.ts +2 -2
- package/types/validation/index.js +2 -2
- package/types/validation/state.d.ts +8 -8
- package/types/validation/state.js +1 -1
- package/types/validation/status.d.ts +9 -9
- package/types/validation/status.js +10 -10
- package/utils/dataAttributes.d.ts +7 -7
- package/utils/dataAttributes.d.ts.map +1 -1
- package/utils/dataAttributes.js +22 -21
- package/utils/index.d.ts +3 -2
- package/utils/index.d.ts.map +1 -1
- package/utils/index.js +3 -2
- package/utils/styles.d.ts +14 -0
- package/utils/styles.d.ts.map +1 -0
- package/utils/styles.js +33 -0
- package/utils/validation.d.ts +10 -10
- package/utils/validation.d.ts.map +1 -1
- package/utils/validation.js +20 -20
- package/bodynarf-react.components-1.12.2.tgz +0 -0
- package/bodynarf-react.components-1.12.3.tgz +0 -0
- package/bodynarf-react.components-1.12.4.tgz +0 -0
- package/types/baseElementProps.d.ts.map +0 -1
- package/types/baseInputElementProps.d.ts.map +0 -1
- package/types/elementColor.d.ts.map +0 -1
- package/types/elementPosition.d.ts.map +0 -1
- package/types/elementSize.d.ts.map +0 -1
|
@@ -1,31 +1,31 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { useCallback } from "react";
|
|
3
|
-
import { generateGuid, getClassName, isNullOrUndefined, isStringEmpty } from "@bodynarf/utils";
|
|
4
|
-
import { ElementSize } from "../../../../types";
|
|
5
|
-
import { getStyleClassName, mapDataAttributes } from "../../../../utils";
|
|
6
|
-
import ComponentWithLabel from "../../internal/componentWithLabel";
|
|
7
|
-
import InternalHint from "../../internal/hint";
|
|
8
|
-
import "./style.scss";
|
|
9
|
-
/** Date input component */
|
|
10
|
-
const DatePicker = ({ defaultValue, onValueChange, validationState, name = generateGuid(), style, size = ElementSize.Normal, readonly = false, disabled = false, rounded = false, loading = false, autoFocus = false, label, onBlur, className, title, data, hint, }) => {
|
|
11
|
-
const onChange = useCallback((event) => onValueChange(isStringEmpty(event.target.value)
|
|
12
|
-
? undefined
|
|
13
|
-
: new Date(event.target.value)), [onValueChange]);
|
|
14
|
-
const elClassName = getClassName([
|
|
15
|
-
className,
|
|
16
|
-
size === ElementSize.Normal ? "" : `is-${size}`,
|
|
17
|
-
getStyleClassName(style, validationState),
|
|
18
|
-
rounded ? "is-rounded" : "",
|
|
19
|
-
"input",
|
|
20
|
-
]);
|
|
21
|
-
const inputContainerClassName = getClassName([
|
|
22
|
-
"control",
|
|
23
|
-
loading ? "is-loading" : "",
|
|
24
|
-
]);
|
|
25
|
-
const stringifiedDefValue = defaultValue?.toISOString().split("T")[0];
|
|
26
|
-
const dataAttributes = isNullOrUndefined(data)
|
|
27
|
-
? undefined
|
|
28
|
-
: mapDataAttributes(data);
|
|
29
|
-
return (_jsxs(ComponentWithLabel, { id: name, size: size, label: label, children: [_jsx("div", { className: inputContainerClassName, children: _jsx("input", { type: "date", id: name, name: name, onBlur: onBlur, readOnly: readonly, disabled: disabled, onChange: onChange, className: elClassName, defaultValue: stringifiedDefValue, autoFocus: autoFocus, title: title, ...dataAttributes }) }), _jsx(InternalHint, { hint: hint, validationState: validationState })] }));
|
|
30
|
-
};
|
|
31
|
-
export default DatePicker;
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { useCallback } from "react";
|
|
3
|
+
import { emptyFn, generateGuid, getClassName, isNullOrUndefined, isStringEmpty } from "@bodynarf/utils";
|
|
4
|
+
import { ElementSize } from "../../../../types";
|
|
5
|
+
import { getStyleClassName, mapDataAttributes } from "../../../../utils";
|
|
6
|
+
import ComponentWithLabel from "../../internal/componentWithLabel";
|
|
7
|
+
import InternalHint from "../../internal/hint";
|
|
8
|
+
import "./style.scss";
|
|
9
|
+
/** Date input component */
|
|
10
|
+
const DatePicker = ({ defaultValue, onValueChange = emptyFn, validationState, name = generateGuid(), style, size = ElementSize.Normal, readonly = false, disabled = false, rounded = false, loading = false, autoFocus = false, label, onBlur, className, title, data, hint, }) => {
|
|
11
|
+
const onChange = useCallback((event) => onValueChange(isStringEmpty(event.target.value)
|
|
12
|
+
? undefined
|
|
13
|
+
: new Date(event.target.value)), [onValueChange]);
|
|
14
|
+
const elClassName = getClassName([
|
|
15
|
+
className,
|
|
16
|
+
size === ElementSize.Normal ? "" : `is-${size}`,
|
|
17
|
+
getStyleClassName(style, validationState),
|
|
18
|
+
rounded ? "is-rounded" : "",
|
|
19
|
+
"input",
|
|
20
|
+
]);
|
|
21
|
+
const inputContainerClassName = getClassName([
|
|
22
|
+
"control",
|
|
23
|
+
loading ? "is-loading" : "",
|
|
24
|
+
]);
|
|
25
|
+
const stringifiedDefValue = defaultValue?.toISOString().split("T")[0];
|
|
26
|
+
const dataAttributes = isNullOrUndefined(data)
|
|
27
|
+
? undefined
|
|
28
|
+
: mapDataAttributes(data);
|
|
29
|
+
return (_jsxs(ComponentWithLabel, { id: name, size: size, label: label, children: [_jsx("div", { className: inputContainerClassName, children: _jsx("input", { type: "date", id: name, name: name, onBlur: onBlur, readOnly: readonly, disabled: disabled, onChange: onChange, className: elClassName, defaultValue: stringifiedDefValue, autoFocus: autoFocus, title: title, ...dataAttributes }) }), _jsx(InternalHint, { hint: hint, validationState: validationState })] }));
|
|
30
|
+
};
|
|
31
|
+
export default DatePicker;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
export { default } from "./component";
|
|
2
|
-
export * from "./types";
|
|
1
|
+
export { default } from "./component";
|
|
2
|
+
export * from "./types";
|
|
3
3
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { default } from "./component";
|
|
2
|
-
export * from "./types";
|
|
1
|
+
export { default } from "./component";
|
|
2
|
+
export * from "./types";
|
|
@@ -1,9 +1,4 @@
|
|
|
1
|
-
import { BaseInputElementProps,
|
|
2
|
-
/** Date input component props type */
|
|
3
|
-
export
|
|
4
|
-
/** Label configuration */
|
|
5
|
-
label: LabelConfiguration;
|
|
6
|
-
/** Focus out event handler */
|
|
7
|
-
onBlur?: () => void;
|
|
8
|
-
}
|
|
1
|
+
import { BaseInputElementProps, BaseNullableInputElementProps, BlurableElement } from "../../../types";
|
|
2
|
+
/** Date input component props type */
|
|
3
|
+
export type DateProps = Omit<BaseNullableInputElementProps<Date>, "placeholder" | "label"> & BlurableElement & Required<Pick<BaseInputElementProps<unknown>, "label">>;
|
|
9
4
|
//# sourceMappingURL=types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/primitives/date/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/primitives/date/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,6BAA6B,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AAEnG,sCAAsC;AACtC,MAAM,MAAM,SAAS,GAAG,IAAI,CACxB,6BAA6B,CAAC,IAAI,CAAC,EACnC,aAAa,GAAG,OAAO,CAC1B,GAAG,eAAe,GAAG,QAAQ,CAAC,IAAI,CAAC,qBAAqB,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC,CAAC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export {};
|
|
1
|
+
export {};
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
export * from "./checkbox";
|
|
2
|
-
export * from "./color";
|
|
3
|
-
export * from "./date";
|
|
4
|
-
export * from "./multiline";
|
|
5
|
-
export * from "./number";
|
|
6
|
-
export * from "./password";
|
|
7
|
-
export * from "./text";
|
|
1
|
+
export * from "./checkbox";
|
|
2
|
+
export * from "./color";
|
|
3
|
+
export * from "./date";
|
|
4
|
+
export * from "./multiline";
|
|
5
|
+
export * from "./number";
|
|
6
|
+
export * from "./password";
|
|
7
|
+
export * from "./text";
|
|
8
8
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
export * from "./checkbox";
|
|
2
|
-
export * from "./color";
|
|
3
|
-
export * from "./date";
|
|
4
|
-
export * from "./multiline";
|
|
5
|
-
export * from "./number";
|
|
6
|
-
export * from "./password";
|
|
7
|
-
export * from "./text";
|
|
1
|
+
export * from "./checkbox";
|
|
2
|
+
export * from "./color";
|
|
3
|
+
export * from "./date";
|
|
4
|
+
export * from "./multiline";
|
|
5
|
+
export * from "./number";
|
|
6
|
+
export * from "./password";
|
|
7
|
+
export * from "./text";
|
|
@@ -1,17 +1,17 @@
|
|
|
1
|
-
import { FC } from "react";
|
|
2
|
-
import { ElementSize, LabelConfiguration } from "../../../../types";
|
|
3
|
-
/** Form input component with label props */
|
|
4
|
-
export
|
|
5
|
-
/** Label configuration */
|
|
6
|
-
label: LabelConfiguration;
|
|
7
|
-
/** Component size */
|
|
8
|
-
size: ElementSize;
|
|
9
|
-
/** Unique component identifier */
|
|
10
|
-
id: string;
|
|
11
|
-
/** Node element with input element */
|
|
12
|
-
children: React.ReactNode;
|
|
13
|
-
};
|
|
14
|
-
/** Form input component with describing label */
|
|
15
|
-
declare const ComponentWithLabel: FC<ComponentWithLabelProps>;
|
|
16
|
-
export default ComponentWithLabel;
|
|
1
|
+
import { FC } from "react";
|
|
2
|
+
import { ElementSize, LabelConfiguration } from "../../../../types";
|
|
3
|
+
/** Form input component with label props */
|
|
4
|
+
export type ComponentWithLabelProps = {
|
|
5
|
+
/** Label configuration */
|
|
6
|
+
label: LabelConfiguration;
|
|
7
|
+
/** Component size */
|
|
8
|
+
size: ElementSize;
|
|
9
|
+
/** Unique component identifier */
|
|
10
|
+
id: string;
|
|
11
|
+
/** Node element with input element */
|
|
12
|
+
children: React.ReactNode;
|
|
13
|
+
};
|
|
14
|
+
/** Form input component with describing label */
|
|
15
|
+
declare const ComponentWithLabel: FC<ComponentWithLabelProps>;
|
|
16
|
+
export default ComponentWithLabel;
|
|
17
17
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/primitives/internal/componentWithLabel/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAI3B,OAAO,EAAE,WAAW,EAAE,kBAAkB,EAAE,MAAM,YAAY,CAAC;AAG7D,4CAA4C;AAC5C,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/primitives/internal/componentWithLabel/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAI3B,OAAO,EAAE,WAAW,EAAE,kBAAkB,EAAE,MAAM,YAAY,CAAC;AAG7D,4CAA4C;AAC5C,MAAM,MAAM,uBAAuB,GAAG;IAClC,0BAA0B;IAC1B,KAAK,EAAE,kBAAkB,CAAC;IAE1B,qBAAqB;IACrB,IAAI,EAAE,WAAW,CAAC;IAElB,kCAAkC;IAClC,EAAE,EAAE,MAAM,CAAC;IAEX,sCAAsC;IACtC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC7B,CAAC;AAEF,iDAAiD;AACjD,QAAA,MAAM,kBAAkB,EAAE,EAAE,CAAC,uBAAuB,CAqEnD,CAAC;AAEF,eAAe,kBAAkB,CAAC"}
|
|
@@ -1,30 +1,30 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { getClassName, getValueOrDefault, isNullish } from "@bodynarf/utils";
|
|
3
|
-
import { ElementSize } from "../../../../types";
|
|
4
|
-
import { mapDataAttributes } from "../../../../utils";
|
|
5
|
-
/** Form input component with describing label */
|
|
6
|
-
const ComponentWithLabel = ({ label, id, size, children, }) => {
|
|
7
|
-
const elSizeClassName = "is-{0}".format(getValueOrDefault(size, ElementSize.Normal));
|
|
8
|
-
const labelClassName = getClassName([
|
|
9
|
-
"label",
|
|
10
|
-
!label.horizontal ? elSizeClassName : "",
|
|
11
|
-
label.className,
|
|
12
|
-
]);
|
|
13
|
-
const dataAttributes = isNullish(label.data)
|
|
14
|
-
? undefined
|
|
15
|
-
: mapDataAttributes(label.data);
|
|
16
|
-
if (label.horizontal) {
|
|
17
|
-
const labelContainerClassName = getClassName([
|
|
18
|
-
"field-label",
|
|
19
|
-
elSizeClassName,
|
|
20
|
-
label.horizontalContainerClassName
|
|
21
|
-
]);
|
|
22
|
-
const fieldContainerClassName = getClassName([
|
|
23
|
-
"field-body",
|
|
24
|
-
label.horizontalFieldContainerClassName
|
|
25
|
-
]);
|
|
26
|
-
return (_jsxs("div", { className: "bbr-field bbr-input field is-horizontal", children: [_jsx("div", { className: labelContainerClassName, children: _jsx("label", { htmlFor: id, className: labelClassName, title: label.title, ...dataAttributes, children: label.caption }) }), _jsx("div", { className: fieldContainerClassName, children: _jsx("div", { className: "field", children: children }) })] }));
|
|
27
|
-
}
|
|
28
|
-
return (_jsxs("div", { className: "bbr-field bbr-input field", children: [_jsx("label", { htmlFor: id, className: labelClassName, title: label.title, ...dataAttributes, children: label.caption }), children] }));
|
|
29
|
-
};
|
|
30
|
-
export default ComponentWithLabel;
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { getClassName, getValueOrDefault, isNullish } from "@bodynarf/utils";
|
|
3
|
+
import { ElementSize } from "../../../../types";
|
|
4
|
+
import { mapDataAttributes } from "../../../../utils";
|
|
5
|
+
/** Form input component with describing label */
|
|
6
|
+
const ComponentWithLabel = ({ label, id, size, children, }) => {
|
|
7
|
+
const elSizeClassName = "is-{0}".format(getValueOrDefault(size, ElementSize.Normal));
|
|
8
|
+
const labelClassName = getClassName([
|
|
9
|
+
"label",
|
|
10
|
+
!label.horizontal ? elSizeClassName : "",
|
|
11
|
+
label.className,
|
|
12
|
+
]);
|
|
13
|
+
const dataAttributes = isNullish(label.data)
|
|
14
|
+
? undefined
|
|
15
|
+
: mapDataAttributes(label.data);
|
|
16
|
+
if (label.horizontal) {
|
|
17
|
+
const labelContainerClassName = getClassName([
|
|
18
|
+
"field-label",
|
|
19
|
+
elSizeClassName,
|
|
20
|
+
label.horizontalContainerClassName
|
|
21
|
+
]);
|
|
22
|
+
const fieldContainerClassName = getClassName([
|
|
23
|
+
"field-body",
|
|
24
|
+
label.horizontalFieldContainerClassName
|
|
25
|
+
]);
|
|
26
|
+
return (_jsxs("div", { className: "bbr-field bbr-input field is-horizontal", children: [_jsx("div", { className: labelContainerClassName, children: _jsx("label", { htmlFor: id, className: labelClassName, title: label.title, ...dataAttributes, children: label.caption }) }), _jsx("div", { className: fieldContainerClassName, children: _jsx("div", { className: "field", children: children }) })] }));
|
|
27
|
+
}
|
|
28
|
+
return (_jsxs("div", { className: "bbr-field bbr-input field", children: [_jsx("label", { htmlFor: id, className: labelClassName, title: label.title, ...dataAttributes, children: label.caption }), children] }));
|
|
29
|
+
};
|
|
30
|
+
export default ComponentWithLabel;
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
|
|
2
|
-
import { BaseInputElementProps } from "../../../../types";
|
|
3
|
-
import "./style.scss";
|
|
4
|
-
/** Props of `InternalHint` */
|
|
5
|
-
|
|
6
|
-
/** Hint component for internal use (as form input elements hints) */
|
|
7
|
-
declare const InternalHint:
|
|
8
|
-
export default InternalHint;
|
|
1
|
+
import { FC } from "react";
|
|
2
|
+
import { BaseInputElementProps } from "../../../../types";
|
|
3
|
+
import "./style.scss";
|
|
4
|
+
/** Props of `InternalHint` */
|
|
5
|
+
type HintProps = Pick<BaseInputElementProps<unknown>, "validationState" | "hint">;
|
|
6
|
+
/** Hint component for internal use (as form input elements hints) */
|
|
7
|
+
declare const InternalHint: FC<HintProps>;
|
|
8
|
+
export default InternalHint;
|
|
9
9
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/primitives/internal/hint/index.tsx"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/primitives/internal/hint/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAI3B,OAAO,EAAE,qBAAqB,EAAqE,MAAM,YAAY,CAAC;AAGtH,OAAO,cAAc,CAAC;AAEtB,8BAA8B;AAC9B,KAAK,SAAS,GAAG,IAAI,CAAC,qBAAqB,CAAC,OAAO,CAAC,EAAE,iBAAiB,GAAG,MAAM,CAAC,CAAC;AAElF,qEAAqE;AACrE,QAAA,MAAM,YAAY,EAAE,EAAE,CAAC,SAAS,CAkD/B,CAAC;AAEF,eAAe,YAAY,CAAC"}
|
|
@@ -1,48 +1,49 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import { getClassName, isNullOrUndefined } from "@bodynarf/utils";
|
|
3
|
-
import { ElementPosition, ElementSize, ValidationStatus } from "../../../../types";
|
|
4
|
-
import Icon from "../../../icon";
|
|
5
|
-
import "./style.scss";
|
|
6
|
-
/** Hint component for internal use (as form input elements hints) */
|
|
7
|
-
const InternalHint = ({ validationState, hint, }) => {
|
|
8
|
-
if (isNullOrUndefined(validationState) && isNullOrUndefined(hint)) {
|
|
9
|
-
return
|
|
10
|
-
}
|
|
11
|
-
const validationStateDefined = !isNullOrUndefined(validationState)
|
|
12
|
-
&& validationState.status !== ValidationStatus.None
|
|
13
|
-
&& validationState.messages.length > 0;
|
|
14
|
-
if (validationStateDefined) {
|
|
15
|
-
const validationClassName = validationState.status === ValidationStatus.Valid
|
|
16
|
-
? "is-success"
|
|
17
|
-
: "is-danger";
|
|
18
|
-
return (_jsx("p", { className: `help m-help ${validationClassName}`, children: validationState.messages.join("\n") }));
|
|
19
|
-
}
|
|
20
|
-
if (isNullOrUndefined(hint)) {
|
|
21
|
-
return
|
|
22
|
-
}
|
|
23
|
-
const className = getClassName([
|
|
24
|
-
"bbr-hint",
|
|
25
|
-
"help",
|
|
26
|
-
"m-help",
|
|
27
|
-
(hint.grey ?? false) ? "has-text-grey" : undefined,
|
|
28
|
-
(hint.italic ?? false) ? "is-italic" : undefined,
|
|
29
|
-
]);
|
|
30
|
-
if (!isNullOrUndefined(hint.icon)) {
|
|
31
|
-
return (_jsx(HintWithIcon, { ...hint, className: className }));
|
|
32
|
-
}
|
|
33
|
-
return (_jsx("p", { className: className, children: hint.content }));
|
|
34
|
-
};
|
|
35
|
-
export default InternalHint;
|
|
36
|
-
/** Hint element with icon */
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
icon.
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
};
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { getClassName, isNullOrUndefined } from "@bodynarf/utils";
|
|
3
|
+
import { ElementPosition, ElementSize, ValidationStatus } from "../../../../types";
|
|
4
|
+
import Icon from "../../../icon";
|
|
5
|
+
import "./style.scss";
|
|
6
|
+
/** Hint component for internal use (as form input elements hints) */
|
|
7
|
+
const InternalHint = ({ validationState, hint, }) => {
|
|
8
|
+
if (isNullOrUndefined(validationState) && isNullOrUndefined(hint)) {
|
|
9
|
+
return null;
|
|
10
|
+
}
|
|
11
|
+
const validationStateDefined = !isNullOrUndefined(validationState)
|
|
12
|
+
&& validationState.status !== ValidationStatus.None
|
|
13
|
+
&& validationState.messages.length > 0;
|
|
14
|
+
if (validationStateDefined) {
|
|
15
|
+
const validationClassName = validationState.status === ValidationStatus.Valid
|
|
16
|
+
? "is-success"
|
|
17
|
+
: "is-danger";
|
|
18
|
+
return (_jsx("p", { className: `help m-help ${validationClassName}`, children: validationState.messages.join("\n") }));
|
|
19
|
+
}
|
|
20
|
+
if (isNullOrUndefined(hint)) {
|
|
21
|
+
return null;
|
|
22
|
+
}
|
|
23
|
+
const className = getClassName([
|
|
24
|
+
"bbr-hint",
|
|
25
|
+
"help",
|
|
26
|
+
"m-help",
|
|
27
|
+
(hint.grey ?? false) ? "has-text-grey" : undefined,
|
|
28
|
+
(hint.italic ?? false) ? "is-italic" : undefined,
|
|
29
|
+
]);
|
|
30
|
+
if (!isNullOrUndefined(hint.icon)) {
|
|
31
|
+
return (_jsx(HintWithIcon, { ...hint, className: className }));
|
|
32
|
+
}
|
|
33
|
+
return (_jsx("p", { className: className, children: hint.content }));
|
|
34
|
+
};
|
|
35
|
+
export default InternalHint;
|
|
36
|
+
/** Hint element with icon */
|
|
37
|
+
// eslint-disable-next-line react/no-multi-comp
|
|
38
|
+
const HintWithIcon = ({ className, content, icon, }) => {
|
|
39
|
+
const iconClassName = getClassName([
|
|
40
|
+
icon.className,
|
|
41
|
+
icon.position === ElementPosition.Right
|
|
42
|
+
? "bbr-icon--right"
|
|
43
|
+
: "bbr-icon--left"
|
|
44
|
+
]);
|
|
45
|
+
if (icon.position === ElementPosition.Right) {
|
|
46
|
+
return (_jsxs("p", { className: className, children: [content, _jsx(Icon, { name: icon.name, className: iconClassName, size: icon.size ?? ElementSize.Small })] }));
|
|
47
|
+
}
|
|
48
|
+
return (_jsxs("p", { className: className, children: [_jsx(Icon, { name: icon.name, className: iconClassName, size: icon.size ?? ElementSize.Small }), content] }));
|
|
49
|
+
};
|
|
@@ -1,6 +1,5 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
export default Multiline;
|
|
1
|
+
import { MultilineProps } from "..";
|
|
2
|
+
/** Multiline textual input component */
|
|
3
|
+
declare const Multiline: (props: MultilineProps) => JSX.Element;
|
|
4
|
+
export default Multiline;
|
|
6
5
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/primitives/multiline/component/index.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/primitives/multiline/component/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,MAAM,IAAI,CAAC;AAIpC,wCAAwC;AACxC,QAAA,MAAM,SAAS,GAAI,OAAO,cAAc,KAAG,GAAG,CAAC,OAK9C,CAAC;AAEF,eAAe,SAAS,CAAC"}
|
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
-
import { isNullOrUndefined } from "@bodynarf/utils";
|
|
3
|
-
import MultilineWithoutLabel from "../components/withoutLabel";
|
|
4
|
-
import MultilineWithLabel from "../components/withLabel";
|
|
5
|
-
/** Multiline textual input component */
|
|
6
|
-
const Multiline = (props) => {
|
|
7
|
-
return isNullOrUndefined(props.label)
|
|
8
|
-
? _jsx(MultilineWithoutLabel, { ...props })
|
|
9
|
-
: _jsx(MultilineWithLabel, { ...props });
|
|
10
|
-
};
|
|
11
|
-
export default Multiline;
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { isNullOrUndefined } from "@bodynarf/utils";
|
|
3
|
+
import MultilineWithoutLabel from "../components/withoutLabel";
|
|
4
|
+
import MultilineWithLabel from "../components/withLabel";
|
|
5
|
+
/** Multiline textual input component */
|
|
6
|
+
const Multiline = (props) => {
|
|
7
|
+
return isNullOrUndefined(props.label)
|
|
8
|
+
? _jsx(MultilineWithoutLabel, { ...props })
|
|
9
|
+
: _jsx(MultilineWithLabel, { ...props });
|
|
10
|
+
};
|
|
11
|
+
export default Multiline;
|
|
@@ -1,6 +1,5 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
export default MultilineWithLabel;
|
|
1
|
+
import { MultilineProps } from "../..";
|
|
2
|
+
/** Multiline textual input component with describing label */
|
|
3
|
+
declare const MultilineWithLabel: ({ defaultValue, onValueChange, validationState, name, size, style, label, placeholder, readonly, disabled, loading, fixed, autoFocus, rows, onBlur, className, title, data, hint, }: MultilineProps) => JSX.Element;
|
|
4
|
+
export default MultilineWithLabel;
|
|
6
5
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/primitives/multiline/components/withLabel/index.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/primitives/multiline/components/withLabel/index.tsx"],"names":[],"mappings":"AASA,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAEvC,8DAA8D;AAC9D,QAAA,MAAM,kBAAkB,GAAI,qLAYzB,cAAc,KAAG,GAAG,CAAC,OAqDvB,CAAC;AAEF,eAAe,kBAAkB,CAAC"}
|
|
@@ -1,27 +1,27 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { useCallback } from "react";
|
|
3
|
-
import { generateGuid, getClassName, isNullOrUndefined } from "@bodynarf/utils";
|
|
4
|
-
import { ElementSize } from "../../../../../types";
|
|
5
|
-
import { getStyleClassName, mapDataAttributes } from "../../../../../utils";
|
|
6
|
-
import ComponentWithLabel from "../../../internal/componentWithLabel";
|
|
7
|
-
import InternalHint from "../../../internal/hint";
|
|
8
|
-
/** Multiline textual input component with describing label */
|
|
9
|
-
const MultilineWithLabel = ({ defaultValue, onValueChange, validationState, name = generateGuid(), size = ElementSize.Normal, style, label, placeholder, readonly = false, disabled = false, loading = false, fixed = false, autoFocus = false, rows, onBlur, className, title, data, hint, }) => {
|
|
10
|
-
const onChange = useCallback((event) => onValueChange(event.target.value), [onValueChange]);
|
|
11
|
-
const elClassName = getClassName([
|
|
12
|
-
className,
|
|
13
|
-
size === ElementSize.Normal ? "" : `is-${size}`,
|
|
14
|
-
getStyleClassName(style, validationState),
|
|
15
|
-
"textarea",
|
|
16
|
-
fixed ? "has-fixed-size" : "",
|
|
17
|
-
]);
|
|
18
|
-
const inputContainerClassName = getClassName([
|
|
19
|
-
"control",
|
|
20
|
-
loading ? "is-loading" : "",
|
|
21
|
-
]);
|
|
22
|
-
const dataAttributes = isNullOrUndefined(data)
|
|
23
|
-
? undefined
|
|
24
|
-
: mapDataAttributes(data);
|
|
25
|
-
return (_jsxs(ComponentWithLabel, { id: name, size: size, label: label, children: [_jsx("div", { className: inputContainerClassName, children: _jsx("textarea", { id: name, name: name, rows: rows, onBlur: onBlur, readOnly: readonly, disabled: disabled, onChange: onChange, autoFocus: autoFocus, className: elClassName, placeholder: placeholder, defaultValue: defaultValue, title: title, ...dataAttributes }) }), _jsx(InternalHint, { hint: hint, validationState: validationState })] }));
|
|
26
|
-
};
|
|
27
|
-
export default MultilineWithLabel;
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { useCallback } from "react";
|
|
3
|
+
import { emptyFn, generateGuid, getClassName, isNullOrUndefined } from "@bodynarf/utils";
|
|
4
|
+
import { ElementSize } from "../../../../../types";
|
|
5
|
+
import { getStyleClassName, mapDataAttributes } from "../../../../../utils";
|
|
6
|
+
import ComponentWithLabel from "../../../internal/componentWithLabel";
|
|
7
|
+
import InternalHint from "../../../internal/hint";
|
|
8
|
+
/** Multiline textual input component with describing label */
|
|
9
|
+
const MultilineWithLabel = ({ defaultValue, onValueChange = emptyFn, validationState, name = generateGuid(), size = ElementSize.Normal, style, label, placeholder, readonly = false, disabled = false, loading = false, fixed = false, autoFocus = false, rows, onBlur, className, title, data, hint, }) => {
|
|
10
|
+
const onChange = useCallback((event) => onValueChange(event.target.value), [onValueChange]);
|
|
11
|
+
const elClassName = getClassName([
|
|
12
|
+
className,
|
|
13
|
+
size === ElementSize.Normal ? "" : `is-${size}`,
|
|
14
|
+
getStyleClassName(style, validationState),
|
|
15
|
+
"textarea",
|
|
16
|
+
fixed ? "has-fixed-size" : "",
|
|
17
|
+
]);
|
|
18
|
+
const inputContainerClassName = getClassName([
|
|
19
|
+
"control",
|
|
20
|
+
loading ? "is-loading" : "",
|
|
21
|
+
]);
|
|
22
|
+
const dataAttributes = isNullOrUndefined(data)
|
|
23
|
+
? undefined
|
|
24
|
+
: mapDataAttributes(data);
|
|
25
|
+
return (_jsxs(ComponentWithLabel, { id: name, size: size, label: label, children: [_jsx("div", { className: inputContainerClassName, children: _jsx("textarea", { id: name, name: name, rows: rows, onBlur: onBlur, readOnly: readonly, disabled: disabled, onChange: onChange, autoFocus: autoFocus, className: elClassName, placeholder: placeholder, defaultValue: defaultValue, title: title, ...dataAttributes }) }), _jsx(InternalHint, { hint: hint, validationState: validationState })] }));
|
|
26
|
+
};
|
|
27
|
+
export default MultilineWithLabel;
|
|
@@ -1,6 +1,5 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
export default MultilineWithoutLabel;
|
|
1
|
+
import { MultilineProps } from "../..";
|
|
2
|
+
/** Multiline textual input component without describing label*/
|
|
3
|
+
declare const MultilineWithoutLabel: ({ onValueChange, defaultValue, validationState, name, placeholder, onBlur, size, style, loading, fixed, autoFocus, rows, className, title, data, hint, }: MultilineProps) => JSX.Element;
|
|
4
|
+
export default MultilineWithoutLabel;
|
|
6
5
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/primitives/multiline/components/withoutLabel/index.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/primitives/multiline/components/withoutLabel/index.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAEvC,gEAAgE;AAChE,QAAA,MAAM,qBAAqB,GAAI,0JAU5B,cAAc,KAAG,GAAG,CAAC,OAkDvB,CAAC;AAEF,eAAe,qBAAqB,CAAC"}
|
|
@@ -1,27 +1,27 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { useCallback } from "react";
|
|
3
|
-
import { generateGuid, getClassName, isNullOrUndefined } from "@bodynarf/utils";
|
|
4
|
-
import { ElementSize } from "../../../../../types";
|
|
5
|
-
import { getStyleClassName, mapDataAttributes } from "../../../../../utils";
|
|
6
|
-
import InternalHint from "../../../internal/hint";
|
|
7
|
-
/** Multiline textual input component without describing label*/
|
|
8
|
-
const MultilineWithoutLabel = ({ onValueChange, defaultValue, validationState, name = generateGuid(), placeholder, onBlur, size = ElementSize.Normal, style, loading = false, fixed = false, autoFocus = false, rows, className, title, data, hint, }) => {
|
|
9
|
-
const onChange = useCallback((event) => onValueChange(event.target.value), [onValueChange]);
|
|
10
|
-
const elClassName = getClassName([
|
|
11
|
-
className,
|
|
12
|
-
size === ElementSize.Normal ? "" : `is-${size}`,
|
|
13
|
-
getStyleClassName(style, validationState),
|
|
14
|
-
"textarea",
|
|
15
|
-
fixed ? "has-fixed-size" : "",
|
|
16
|
-
]);
|
|
17
|
-
const inputContainerClassName = getClassName([
|
|
18
|
-
"control",
|
|
19
|
-
"bbr-input",
|
|
20
|
-
loading ? "is-loading" : "",
|
|
21
|
-
]);
|
|
22
|
-
const dataAttributes = isNullOrUndefined(data)
|
|
23
|
-
? undefined
|
|
24
|
-
: mapDataAttributes(data);
|
|
25
|
-
return (_jsxs("div", { className: "bbr-field field", children: [_jsx("div", { className: inputContainerClassName, children: _jsx("textarea", { id: name, name: name, rows: rows, onBlur: onBlur, onChange: onChange, autoFocus: autoFocus, className: elClassName, placeholder: placeholder, defaultValue: defaultValue, title: title, ...dataAttributes }) }), _jsx(InternalHint, { hint: hint, validationState: validationState })] }));
|
|
26
|
-
};
|
|
27
|
-
export default MultilineWithoutLabel;
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { useCallback } from "react";
|
|
3
|
+
import { emptyFn, generateGuid, getClassName, isNullOrUndefined } from "@bodynarf/utils";
|
|
4
|
+
import { ElementSize } from "../../../../../types";
|
|
5
|
+
import { getStyleClassName, mapDataAttributes } from "../../../../../utils";
|
|
6
|
+
import InternalHint from "../../../internal/hint";
|
|
7
|
+
/** Multiline textual input component without describing label*/
|
|
8
|
+
const MultilineWithoutLabel = ({ onValueChange = emptyFn, defaultValue, validationState, name = generateGuid(), placeholder, onBlur, size = ElementSize.Normal, style, loading = false, fixed = false, autoFocus = false, rows, className, title, data, hint, }) => {
|
|
9
|
+
const onChange = useCallback((event) => onValueChange(event.target.value), [onValueChange]);
|
|
10
|
+
const elClassName = getClassName([
|
|
11
|
+
className,
|
|
12
|
+
size === ElementSize.Normal ? "" : `is-${size}`,
|
|
13
|
+
getStyleClassName(style, validationState),
|
|
14
|
+
"textarea",
|
|
15
|
+
fixed ? "has-fixed-size" : "",
|
|
16
|
+
]);
|
|
17
|
+
const inputContainerClassName = getClassName([
|
|
18
|
+
"control",
|
|
19
|
+
"bbr-input",
|
|
20
|
+
loading ? "is-loading" : "",
|
|
21
|
+
]);
|
|
22
|
+
const dataAttributes = isNullOrUndefined(data)
|
|
23
|
+
? undefined
|
|
24
|
+
: mapDataAttributes(data);
|
|
25
|
+
return (_jsxs("div", { className: "bbr-field field", children: [_jsx("div", { className: inputContainerClassName, children: _jsx("textarea", { id: name, name: name, rows: rows, onBlur: onBlur, onChange: onChange, autoFocus: autoFocus, className: elClassName, placeholder: placeholder, defaultValue: defaultValue, title: title, ...dataAttributes }) }), _jsx(InternalHint, { hint: hint, validationState: validationState })] }));
|
|
26
|
+
};
|
|
27
|
+
export default MultilineWithoutLabel;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
export { default } from "./component";
|
|
2
|
-
export * from "./types";
|
|
1
|
+
export { default } from "./component";
|
|
2
|
+
export * from "./types";
|
|
3
3
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { default } from "./component";
|
|
2
|
-
export * from "./types";
|
|
1
|
+
export { default } from "./component";
|
|
2
|
+
export * from "./types";
|
|
@@ -1,11 +1,9 @@
|
|
|
1
|
-
import {
|
|
2
|
-
/** Multiline textual input component props type */
|
|
3
|
-
export
|
|
4
|
-
/** Is input should be resizable */
|
|
5
|
-
fixed?: boolean;
|
|
6
|
-
/** Number of initial rows count */
|
|
7
|
-
rows?: number;
|
|
8
|
-
|
|
9
|
-
onBlur?: () => void;
|
|
10
|
-
}
|
|
1
|
+
import { BaseNotNullableInputElementProps, BlurableElement } from "../../../types";
|
|
2
|
+
/** Multiline textual input component props type */
|
|
3
|
+
export type MultilineProps = Omit<BaseNotNullableInputElementProps<string>, "rounded"> & BlurableElement & {
|
|
4
|
+
/** Is input should be resizable */
|
|
5
|
+
fixed?: boolean;
|
|
6
|
+
/** Number of initial rows count */
|
|
7
|
+
rows?: number;
|
|
8
|
+
};
|
|
11
9
|
//# sourceMappingURL=types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/primitives/multiline/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/primitives/multiline/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gCAAgC,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AAE/E,mDAAmD;AACnD,MAAM,MAAM,cAAc,GAAG,IAAI,CAAC,gCAAgC,CAAC,MAAM,CAAC,EAAE,SAAS,CAAC,GAChF,eAAe,GACf;IACE,mCAAmC;IACnC,KAAK,CAAC,EAAE,OAAO,CAAC;IAEhB,mCAAmC;IACnC,IAAI,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export {};
|
|
1
|
+
export {};
|