@pinuts/bsr-uikit-relaunch 0.0.3

package/dist/items/BSRAddressSelector/BSRAutocompleteField.js

@@ -0,0 +1,262 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _react = _interopRequireWildcard(require("react"));
+var _formBuilder = require("@pinuts/form-builder");
+var _reactI18next = require("react-i18next");
+var _react2 = require("@ariakit/react");
+var _withFieldGroup = _interopRequireDefault(require("../../hooks/withFieldGroup.jsx"));
+var _FormFieldWrapper = _interopRequireDefault(require("../FormFieldWrapper/FormFieldWrapper.jsx"));
+var _index = require("../../utils/index.js");
+var _formModule = _interopRequireDefault(require("../../styles/form.module.scss"));
+var _BSRAddressSelectorModule = _interopRequireDefault(require("./BSRAddressSelector.module.scss"));
+var _BSRAddressContext = require("./BSRAddressContext.js");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); } //FIXME this component is too complicated and probably over-engineered.
+// simplify it :)
+const {
+  useFormikContext,
+  useField
+} = _formBuilder.formik;
+let debounceTimeout = null;
+
+/**
+ * Fetches options from the given URL
+ *
+ * @param url
+ * @return {({label: string, value: string}|{label: string, value: string}|{label: string, value: string}|{label: string, value: string}|{label: string, value: string})[]}
+ */
+const fetchOptions = async url => {
+  try {
+    const response = await fetch(url);
+    const data = await response.json();
+    return data;
+  } catch (error) {
+    console.error(error);
+  }
+};
+const BSRAutocompleteField = _ref => {
+  let {
+    config
+  } = _ref;
+  const [t] = (0, _reactI18next.useTranslation)();
+  const {
+    scope,
+    additionalQuery,
+    labelTemplate,
+    inputProps = {},
+    key,
+    viewMode,
+    labelText,
+    groupKey,
+    disabled,
+    readOnly
+  } = config;
+  const {
+    prevSelection,
+    setPrevSelection,
+    selectedOptionId,
+    setSelectedOptionId,
+    triggerCancelCombox,
+    setTriggerCancelCombox,
+    getControllerPath
+  } = (0, _react.useContext)(_BSRAddressContext.BSRAddressContext);
+  const {
+    setFieldValue
+  } = useFormikContext();
+  const [field,, {
+    setValue
+  }] = useField(key);
+  const labelFieldKey = `${key}Label`;
+  const [labelField] = useField(labelFieldKey);
+  const usedValueLabel = labelField?.value;
+  const [fetchedOptions, setFetchedOptions] = (0, _react.useState)([]);
+  const [searchInput, setSearchInput] = (0, _react.useState)('');
+  const [selectedOption, setSelectedOption] = (0, _react.useState)({});
+  const [isFocused, setIsFocused] = (0, _react.useState)(false);
+  const preselectedItemRef = (0, _react.useRef)(null);
+  const inputRef = (0, _react.useRef)(null);
+  const mountedRef = (0, _react.useRef)(true);
+  const cancelButtonRef = (0, _react.useRef)(null);
+  const isInvalid = false;
+  const controllerPath = getControllerPath();
+
+  // nedd this to reset the combobox from outside
+  (0, _react.useEffect)(() => {
+    if (triggerCancelCombox) {
+      cancelButtonRef.current?.click();
+      setTriggerCancelCombox(false);
+    }
+  }, [cancelButtonRef, triggerCancelCombox, setTriggerCancelCombox]);
+  (0, _react.useEffect)(() => {
+    if (mountedRef) {
+      const loadData = async () => {
+        const searchQuery = selectedOptionId || searchInput;
+        const url = `${controllerPath}streetNames/?searchQuery=${encodeURIComponent(searchQuery)}`;
+        try {
+          const dataArr = await fetchOptions(url);
+          // Nur State verändern, wenn Komponente gemounted ist
+          if (mountedRef && dataArr) {
+            setFetchedOptions(dataArr);
+          }
+        } catch (error) {
+          console.error(error);
+        }
+      };
+      if (debounceTimeout) {
+        clearTimeout(debounceTimeout);
+      }
+
+      // set time out for debouncing
+      debounceTimeout = setTimeout(() => {
+        loadData();
+      }, 300);
+    }
+  },
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  [selectedOptionId, scope, additionalQuery, controllerPath, labelTemplate, searchInput]);
+  (0, _react.useEffect)(() => {
+    return () => {
+      mountedRef.current = false;
+    };
+  }, []);
+  const filteredOptions = fetchedOptions; // no filter for now
+
+  (0, _react.useEffect)(() => {
+    const newSelectedOption = fetchedOptions.find(option => option.value === field.value);
+    if (newSelectedOption) {
+      if (newSelectedOption.value === '') {
+        setSearchInput(searchInput);
+        setSelectedOption(newSelectedOption);
+        return;
+      }
+      setSearchInput(newSelectedOption.label);
+      setSelectedOption(newSelectedOption);
+    }
+  }, [field.value, searchInput, fetchedOptions]);
+  const handleOnSelectChange = (0, _react.useCallback)(userInput => {
+    setSearchInput(userInput);
+    const newSelectedOption = filteredOptions.find(option => option.value === userInput);
+    setValue(''); // reset value
+    // set few states to the new selected option, if it exists
+    const [value, label] = newSelectedOption ? [newSelectedOption.value, newSelectedOption.label] : ['', ''];
+    setFieldValue(key, value);
+    setFieldValue(labelFieldKey, label);
+    setSelectedOption(newSelectedOption || {});
+    setSelectedOptionId(newSelectedOption?.value || '');
+
+    // keep previous selection, if new selection is empty
+    if (newSelectedOption) {
+      setPrevSelection(newSelectedOption);
+    }
+  }, [setValue, filteredOptions, key, setSearchInput, setSelectedOptionId, setFieldValue, labelFieldKey, setPrevSelection]);
+  const combobox = (0, _react2.useComboboxStore)({
+    value: selectedOption?.value === '' && (searchInput === selectedOption.label || searchInput === '') ? '' : searchInput || usedValueLabel,
+    setValue: handleOnSelectChange
+  });
+  const handleBlur = (0, _react.useCallback)(() => {
+    setSelectedOptionId('');
+    setIsFocused(false);
+  }, [setSelectedOptionId, setIsFocused]);
+  const resetValues = (0, _react.useCallback)(() => {
+    setSelectedOptionId(' ');
+    setPrevSelection({});
+    setFieldValue(key, '');
+    setFieldValue(groupKey, '');
+    setFieldValue(labelFieldKey, undefined);
+    setTimeout(() => {
+      inputRef.current.select();
+    }, 50);
+  }, [key, setFieldValue, labelFieldKey, groupKey, setSelectedOptionId, setPrevSelection]);
+  const className = (0, _react.useMemo)(() => [_BSRAddressSelectorModule.default.comboboxWrapper, 'ariakit-combobox', 'form-control px-2 py-1', isFocused && 'focused', isInvalid && 'is-invalid'].filter(Boolean).join(' '), [isFocused, isInvalid]);
+  const formControlClassNames = (0, _index.getFormControlClassNames)(disabled, readOnly, disabled, 'w-75',
+  // 'combobox w-75',
+  [_formModule.default.input, field.className].filter(Boolean));
+  const getPreviousSelectedItem = (0, _react.useCallback)(() => {
+    return prevSelection?.value ? prevSelection.value : field.value;
+  }, [prevSelection, field.value]);
+  if (viewMode) {
+    return usedValueLabel?.label || '';
+  }
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_react2.ComboboxProvider, null, /*#__PURE__*/_react.default.createElement("div", {
+    className: className
+  }, /*#__PURE__*/_react.default.createElement(_react2.Combobox, _extends({
+    store: combobox,
+    autoSelect: true,
+    getAutoSelectId: getPreviousSelectedItem,
+    className: formControlClassNames,
+    focusable: true,
+    onBlur: handleBlur,
+    onFocus: event => {
+      setIsFocused(true);
+      event.target.select();
+    },
+    ref: inputRef
+  }, inputProps)), selectedOption.value && /*#__PURE__*/_react.default.createElement(_react2.ComboboxCancel, {
+    className: `btn ${_BSRAddressSelectorModule.default.comboboxCancel || ''}`,
+    store: combobox,
+    render: /*#__PURE__*/_react.default.createElement("button", {
+      type: "button",
+      onClick: resetValues,
+      ref: cancelButtonRef,
+      className: `form-control btn ${_BSRAddressSelectorModule.default.comboboxCancel || ''}`,
+      "aria-label": `${t('aria.deleteField', {
+        label: t(labelText)
+      })}`
+    })
+  }), filteredOptions.length > 0 && /*#__PURE__*/_react.default.createElement(_react2.ComboboxDisclosure, {
+    className: `btn ${_BSRAddressSelectorModule.default.comboboxArrow}`,
+    store: combobox
+  })), filteredOptions.length > 0 && /*#__PURE__*/_react.default.createElement("div", {
+    className: `${_BSRAddressSelectorModule.default.comboboxPopoverWrapper}`
+  }, /*#__PURE__*/_react.default.createElement(_react2.ComboboxPopover, {
+    store: combobox,
+    gutter: 4,
+    focusable: true,
+    className: `${_BSRAddressSelectorModule.default.popover}`,
+    sameWidth: true,
+    autoFocusOnShow: false,
+    initialFocus: preselectedItemRef
+  }, filteredOptions.map((_ref2, index) => {
+    let {
+      value,
+      label
+    } = _ref2;
+    return /*#__PURE__*/_react.default.createElement(_react2.ComboboxItem, {
+      key: `k${value}-${index}`,
+      id: value,
+      value: value,
+      className: `${_BSRAddressSelectorModule.default.comboboxItem} dropdown-item ${value === prevSelection.value ? 'selected' : ''}`,
+      ref: value === prevSelection.value ? preselectedItemRef : undefined
+    }, label);
+  })))));
+};
+BSRAutocompleteField.propTypes = {
+  config: _propTypes.default.shape({
+    controllerPath: _propTypes.default.string,
+    key: _propTypes.default.string.isRequired,
+    groupKey: _propTypes.default.string,
+    labelTemplate: _propTypes.default.string,
+    inputProps: _propTypes.default.instanceOf(Object),
+    scope: _propTypes.default.string,
+    additionalQuery: _propTypes.default.string,
+    doSubmitOnChange: _propTypes.default.bool,
+    readOnly: _propTypes.default.bool,
+    labelText: _propTypes.default.string,
+    viewMode: _propTypes.default.bool,
+    disabled: _propTypes.default.bool
+  }).isRequired
+};
+const HigherOrderAutocompleteField = (0, _withFieldGroup.default)(BSRAutocompleteField);
+const WrappedAutocompleteField = props => {
+  return /*#__PURE__*/_react.default.createElement(_FormFieldWrapper.default, props, /*#__PURE__*/_react.default.createElement(HigherOrderAutocompleteField, props));
+};
+(0, _formBuilder.registerComponent)('BSRAutocompleteField', WrappedAutocompleteField);
+(0, _formBuilder.registerComponent)('BSRAutocompleteFieldBasic', HigherOrderAutocompleteField);
+var _default = exports.default = BSRAutocompleteField;

package/dist/items/BSRAddressSelector/BSRStreetPlzSelector.js

@@ -0,0 +1,127 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _formBuilder = require("@pinuts/form-builder");
+var _reactI18next = require("react-i18next");
+var _GroupInputField = _interopRequireDefault(require("../GroupInputField/GroupInputField.jsx"));
+var _withFieldGroup = _interopRequireDefault(require("../../hooks/withFieldGroup.jsx"));
+var _BSRAddressContext = require("./BSRAddressContext.js");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+// form-builder
+
+const fetchStreetPLz = async (url, selectedStreedAndNumber) => {
+  const response = await fetch(`${url}/plzSet?searchQuery=${encodeURI(selectedStreedAndNumber)}`);
+  const data = await response.json();
+  return data;
+};
+const {
+  useFormikContext
+} = _formBuilder.formik;
+const BSRStreetPlzSelector = props => {
+  const [t] = (0, _reactI18next.useTranslation)();
+  const {
+    values,
+    setFieldValue
+  } = useFormikContext();
+  const {
+    getControllerPath
+  } = (0, _react.useContext)(_BSRAddressContext.BSRAddressContext);
+  const {
+    config
+  } = props;
+  const groupKey = config.groupKey;
+  const labelKey = `${groupKey}Label`;
+  const selectedStreedAndNumberKey = `${groupKey}-streedAndNumber`;
+  const localFieldKey = config.key;
+  const [selectedStreetList, setSelectedStreetList] = (0, _react.useState)(null);
+  const [selectedStreedAndNumber, setSelectedStreedAndNumber] = (0, _react.useState)(null);
+  const [showNoResultsError, setShowNoResultsError] = (0, _react.useState)(false);
+  const [showLoading, setShowLoading] = (0, _react.useState)(false);
+  (0, _react.useEffect)(() => {
+    // set or delete selected street and number, form parent inputs, to state
+    if (values[selectedStreedAndNumberKey] && values[selectedStreedAndNumberKey] !== selectedStreedAndNumber) {
+      setSelectedStreedAndNumber(values[selectedStreedAndNumberKey]);
+    } else if (!values[selectedStreedAndNumberKey] && selectedStreedAndNumber) {
+      setSelectedStreedAndNumber(null);
+      setSelectedStreetList(null);
+      setFieldValue(groupKey, '');
+      setFieldValue(`${labelKey}`, '');
+    }
+  }, [selectedStreedAndNumberKey, values, selectedStreedAndNumber, setSelectedStreedAndNumber, groupKey, labelKey, setFieldValue]);
+  (0, _react.useEffect)(() => {
+    const mainFieldValue = values[groupKey];
+    const selectedRadioValue = values[localFieldKey];
+    if (selectedRadioValue) {
+      if (selectedRadioValue !== mainFieldValue) {
+        setFieldValue(groupKey, selectedRadioValue);
+      }
+      const label = selectedStreetList?.find(option => option.value === selectedRadioValue)?.label;
+      if (label !== values[labelKey]) {
+        setFieldValue(labelKey, label);
+      }
+    } else if (selectedStreetList && selectedStreetList.length > 1) {
+      if (mainFieldValue) {
+        // if main field is set, but radio is not, reset main field
+        setFieldValue(groupKey, '');
+      }
+      // same for label
+      if (values[labelKey]) {
+        setFieldValue(labelKey, '');
+      }
+    }
+  }, [localFieldKey, groupKey, labelKey, values, setFieldValue, selectedStreetList]);
+  (0, _react.useEffect)(() => {
+    if (selectedStreedAndNumber) {
+      const url = getControllerPath() + '/plzSet';
+      setShowLoading(true);
+      fetchStreetPLz(url, selectedStreedAndNumber).catch(console.error).then(data => {
+        const list = data || [];
+        setShowNoResultsError(list.length === 0);
+        setSelectedStreetList(list);
+
+        // if only one result, set it directly, otherwise clear
+        const [value, label] = list.length === 1 ? [list[0].value, list[0].label] : ['', ''];
+        setFieldValue(groupKey, value);
+        setFieldValue(labelKey, label);
+        setShowLoading(false);
+      });
+    }
+  }, [selectedStreedAndNumber, groupKey, labelKey, setFieldValue, getControllerPath]);
+  if (showNoResultsError) {
+    return /*#__PURE__*/_react.default.createElement("p", null, t('bsrAddressSelector.addressNotFound'));
+  }
+  if (showLoading) {
+    return /*#__PURE__*/_react.default.createElement("p", null, t('bsrAddressSelector.loading'));
+  }
+  if (!selectedStreetList || selectedStreetList.length === 0) {
+    return null;
+  }
+  if (selectedStreetList.length === 1) {
+    return /*#__PURE__*/_react.default.createElement("p", null, selectedStreetList[0]?.label);
+  }
+  const newConfig = {
+    ...config,
+    multipleChoice: false,
+    options: selectedStreetList
+  };
+  const newProps = {
+    ...props,
+    config: newConfig
+  };
+  return /*#__PURE__*/_react.default.createElement(_GroupInputField.default, newProps);
+};
+
+// add propTypes
+BSRStreetPlzSelector.propTypes = {
+  config: _propTypes.default.object.isRequired
+};
+const HigherOrderBSRStreetPlzSelector = (0, _withFieldGroup.default)(BSRStreetPlzSelector);
+(0, _formBuilder.registerComponent)('BSRStreetPlzSelector', HigherOrderBSRStreetPlzSelector);
+var _default = exports.default = HigherOrderBSRStreetPlzSelector;

package/dist/items/BSRAddressSelector/HouseNumberSelectField.js

@@ -0,0 +1,105 @@
+// import React, { useEffect, useState } from 'react';
+// import PropTypes from 'prop-types';
+// import { useTranslation } from 'react-i18next';
+//
+// // form-builder
+// import { registerComponent, formik } from '@pinuts/form-builder';
+//
+// import useGetOptionList from '../../hooks/useGetOptionList.js';
+// import { getFormControlClassNames } from '../../utils/getUikitClassNames.js';
+// import FormFieldChildPropTypes from '../FormFieldWrapper/FormFieldChildPropTypes.jsx';
+// import FormFieldWrapper from '../FormFieldWrapper/FormFieldWrapper.jsx';
+// import withFieldGroup from '../../hooks/withFieldGroup.jsx';
+// import styles from '../../styles/form.module.scss';
+//
+// import SelectField from '../SelectField/SelectField.jsx';
+//
+// const { useFormikContext } = formik;
+//
+// const fetchHouseNumbers = async (streetId) => {
+//     const response = await fetch(`http://localhost:8086/cmsbs/rest/de.bsr.adressen.app/streetNo?streetid=${streetId}`);
+//     const data = await response.json();
+//
+//     return data;
+// };
+//
+// const HouseNumberSelectField = (config) => {
+//
+//     const [selectedStreetId, setSelectedStreetId] = useState(null);
+//     const [houseNumberOptions, setHouseNumberOptions] = useState([]);
+//     const {
+//         streedFieldKey,
+//         key,
+//     } = config.config;
+//     const { values, setFieldValue } = useFormikContext();
+//
+//     useEffect(() => {
+//         console.log('values: ' + streedFieldKey, config);
+//         const streetId = values[streedFieldKey] || '';
+//
+//         console.log('values[streedFieldKey]: ', values[streedFieldKey]);
+//         setSelectedStreetId(streetId);
+//
+//         // set number label
+//         if (houseNumberOptions && streetId) {
+//             const numberLabelFieldKey = `${key}Label`;
+//             const numberSelectKey = values[key];
+//             const numberlabel = houseNumberOptions.find(option => option.value === numberSelectKey)?.label;
+//             if (values[numberLabelFieldKey] !== numberlabel) {
+//                 setFieldValue(numberLabelFieldKey, numberlabel);
+//             }
+//         }
+//     }, [values]);
+//
+//     useEffect(() => {
+//         if (selectedStreetId) {
+//             fetchHouseNumbers(selectedStreetId).catch(console.error).then(setHouseNumberOptions);
+//         } else {
+//             setHouseNumberOptions([]);
+//             if (values[key]) {
+//                 setFieldValue(key, '');
+//             }
+//         }
+//     }, [selectedStreetId]);
+//
+//     const newConfig = {
+//         ...config,
+//         options: houseNumberOptions,
+//     };
+//
+//     return (
+//         <SelectField {...newConfig} />
+//     );
+// };
+//
+// HouseNumberSelectField.propTypes = {
+//     ...FormFieldChildPropTypes,
+//
+//     validation: PropTypes.arrayOf(PropTypes.string),
+//     options: PropTypes.arrayOf(
+//         PropTypes.oneOfType([
+//             PropTypes.shape({
+//                 value: PropTypes.oneOfType([
+//                     PropTypes.string,
+//                     PropTypes.number,
+//                 ]),
+//                 label: PropTypes.oneOfType([
+//                     PropTypes.string,
+//                     PropTypes.object,
+//                 ]),
+//             }),
+//             PropTypes.string]),
+//     ).isRequired,
+//     emptyOptionLabel: PropTypes.string,
+//     skipOptions: PropTypes.oneOfType([
+//         PropTypes.arrayOf(PropTypes.string),
+//         PropTypes.string,
+//     ]),
+// };
+//
+//
+// registerComponent('HouseNumberSelectField', HouseNumberSelectField);
+//
+//
+// export default HouseNumberSelectField;
+"use strict";

package/dist/items/Badge/Badge.js

@@ -0,0 +1,33 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _formBuilder = require("@pinuts/form-builder");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+const Badge = _ref => {
+  let {
+    color = 'outline-success',
+    children,
+    className,
+    inputProps = {}
+  } = _ref;
+  if (!children) {
+    return null;
+  }
+  return /*#__PURE__*/_react.default.createElement("div", _extends({
+    className: _formBuilder.utils.getClassNames(['badge d-inline-flex', color, className])
+  }, inputProps), children);
+};
+Badge.propTypes = {
+  className: _propTypes.default.string,
+  color: _propTypes.default.string,
+  inputProps: _propTypes.default.object,
+  children: _propTypes.default.node
+};
+(0, _formBuilder.registerComponent)('Badge', Badge);
+var _default = exports.default = Badge;

package/dist/items/BootstrapInputGroupField/BootstrapInputGroupField.js

@@ -0,0 +1,68 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _formBuilder = require("@pinuts/form-builder");
+var _Form = _interopRequireDefault(require("react-bootstrap/Form"));
+var _InputGroup = _interopRequireDefault(require("react-bootstrap/InputGroup"));
+var _getUikitClassNames = require("../../utils/getUikitClassNames.js");
+var _FormFieldChildPropTypes = _interopRequireDefault(require("../FormFieldWrapper/FormFieldChildPropTypes.jsx"));
+var _FormFieldWrapper = _interopRequireDefault(require("../FormFieldWrapper/FormFieldWrapper.jsx"));
+var _withFieldGroup = _interopRequireDefault(require("../../hooks/withFieldGroup.jsx"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); } // import PropTypes from 'prop-types';
+// form-builder
+const BootstrapInputGroupField = _ref => {
+  let {
+    className,
+    inputProps = {},
+    value,
+    field,
+    onChange = () => {},
+    ariaAttributes,
+    isInvalid,
+    readOnly,
+    disabled,
+    viewMode,
+    fieldIds,
+    leftAddonText,
+    rightAddonText
+  } = _ref;
+  const handleChange = e => onChange(e.target.value);
+  if (viewMode) {
+    return value;
+  }
+  const formControlClassNames = (0, _getUikitClassNames.getFormControlClassNames)(isInvalid, readOnly, disabled, className);
+  const leftAddonId = `${fieldIds.fieldId}-addon-left`;
+  const rightAddonId = `${fieldIds.fieldId}-addon-right`;
+  const describedBy = [ariaAttributes['aria-describedby'], leftAddonText && leftAddonId, rightAddonText && rightAddonId].filter(Boolean).join(' ');
+  return /*#__PURE__*/_react.default.createElement(_InputGroup.default, {
+    className: formControlClassNames
+  }, leftAddonText && /*#__PURE__*/_react.default.createElement(_InputGroup.default.Text, {
+    className: !disabled && !readOnly ? 'bg-transparent' : '',
+    id: leftAddonId
+  }, leftAddonText), /*#__PURE__*/_react.default.createElement(_Form.default.Control, _extends({}, field, ariaAttributes, {
+    "aria-describedby": describedBy
+  }, inputProps, {
+    value: value || '',
+    onChange: handleChange
+  })), rightAddonText && /*#__PURE__*/_react.default.createElement(_InputGroup.default.Text, {
+    className: !disabled && !readOnly ? 'bg-transparent' : '',
+    id: rightAddonId
+  }, rightAddonText));
+};
+BootstrapInputGroupField.propTypes = {
+  ..._FormFieldChildPropTypes.default
+};
+const HigherOrderBootstrapInputGroupField = (0, _withFieldGroup.default)(BootstrapInputGroupField);
+
+// wrap the field label, error message help text and more
+const WrappedBootstrapInputGroupField = props => {
+  return /*#__PURE__*/_react.default.createElement(_FormFieldWrapper.default, props, /*#__PURE__*/_react.default.createElement(HigherOrderBootstrapInputGroupField, props));
+};
+(0, _formBuilder.registerComponent)('BootstrapInputGroupField', WrappedBootstrapInputGroupField);
+(0, _formBuilder.registerComponent)('BootstrapInputGroupFieldBasic', HigherOrderBootstrapInputGroupField);
+var _default = exports.default = HigherOrderBootstrapInputGroupField;

package/dist/items/Button/Button.js

@@ -0,0 +1,70 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _reactI18next = require("react-i18next");
+var _formBuilder = require("@pinuts/form-builder");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+const Button = _ref => {
+  let {
+    className,
+    inputProps = {},
+    color = 'orange',
+    rounded,
+    circular,
+    onClick,
+    ariaLabel,
+    children,
+    ariaAttributes = {},
+    text,
+    type = 'button'
+  } = _ref;
+  const [t] = (0, _reactI18next.useTranslation)();
+  if (!_react.default.Children.count(children) && !text) {
+    return null;
+  }
+  const usedText = text ? t(text) : '';
+  const usedAriaLabel = ariaLabel ? t(ariaLabel) : '';
+
+  // !!! ??? linter: The button type attribute must be specified by a static string or a trivial ternary expression
+  const btnType = type || 'button';
+  /* eslint-disable react/button-has-type */
+
+  return /*#__PURE__*/_react.default.createElement("button", _extends({
+    type: btnType,
+    onClick: onClick,
+    className: _formBuilder.utils.getClassNames(['btn', color && `btn-${color}`, rounded && 'btn-rounded', circular && 'btn-circular', className, ariaAttributes?.['aria-disabled'] && 'disabled']),
+    "aria-label": usedAriaLabel
+  }, ariaAttributes, inputProps), usedText, children);
+  /* eslint-enable react/button-has-type */
+};
+Button.propTypes = {
+  className: _propTypes.default.string,
+  color: _propTypes.default.string,
+  text: _propTypes.default.string,
+  rounded: _propTypes.default.bool,
+  circular: _propTypes.default.bool,
+  inputProps: _propTypes.default.object,
+  onClick: _propTypes.default.func,
+  ariaLabel: _propTypes.default.string.isRequired,
+  ariaAttributes: _propTypes.default.object,
+  children: _propTypes.default.node,
+  type: _propTypes.default.string
+};
+const FormBuilderButton = _ref2 => {
+  let {
+    config = {},
+    ...otherProps
+  } = _ref2;
+  return /*#__PURE__*/_react.default.createElement(Button, _extends({}, otherProps, config));
+};
+FormBuilderButton.propTypes = {
+  config: _propTypes.default.shape(Button.propTypes)
+};
+(0, _formBuilder.registerComponent)('Button', FormBuilderButton);
+var _default = exports.default = Button;