@ballistix.digital/react-components 8.5.5 → 8.6.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.
Files changed (9) hide show
  1. package/dist/index.d.ts +16 -78
  2. package/dist/index.d.ts.map +1 -1
  3. package/dist/index.esm.js +31 -625
  4. package/dist/index.esm.js.map +1 -1
  5. package/dist/index.js +27 -623
  6. package/dist/index.js.map +1 -1
  7. package/dist/lib/tsconfig.tsbuildinfo +1 -0
  8. package/dist/tsconfig.tsbuildinfo +1 -1
  9. package/package.json +21 -22
package/dist/index.js CHANGED
@@ -24,7 +24,6 @@ var $iA2ta$dndkitutilities = require("@dnd-kit/utilities");
24
24
  var $iA2ta$lodashset = require("lodash/set");
25
25
  var $iA2ta$luxon = require("luxon");
26
26
  var $iA2ta$ballistixdigitalreacttailwindcssdatepicker = require("@ballistix.digital/react-tailwindcss-datepicker");
27
- var $iA2ta$formik = require("formik");
28
27
  var $iA2ta$ishotkey = require("is-hotkey");
29
28
  var $iA2ta$slate = require("slate");
30
29
  var $iA2ta$slatehistory = require("slate-history");
@@ -91,12 +90,10 @@ $parcel$export(module.exports, "toTimeValue", () => $dbcba7ef8eeead3b$export$8a6
91
90
  $parcel$export(module.exports, "toUTCDate", () => $dbcba7ef8eeead3b$export$8de20099c30464f2);
92
91
  $parcel$export(module.exports, "DateMenuForm", () => $754fdbc7ee597008$export$2e2bcd8739ae039);
93
92
  $parcel$export(module.exports, "DateRangeMenuForm", () => $7d3977a96c400c32$export$2e2bcd8739ae039);
94
- $parcel$export(module.exports, "__DEPRECATED__CheckboxInputGroupForm", () => $03635ab4c6dbf412$export$2e2bcd8739ae039);
95
93
  $parcel$export(module.exports, "CheckboxInput", () => $831573d0f77f2d6b$export$2e2bcd8739ae039);
96
94
  $parcel$export(module.exports, "SwitchForm", () => $341e1fbf5ffaef7b$export$2e2bcd8739ae039);
97
95
  $parcel$export(module.exports, "RichTextArea", () => $784e2eeeb6b1d65b$export$2e2bcd8739ae039);
98
96
  $parcel$export(module.exports, "FileInputGroupForm", () => $079d45c48b1515dd$export$2e2bcd8739ae039);
99
- $parcel$export(module.exports, "OpeningsHourInputGroupForm", () => $9f6cfd21b337aca9$export$2e2bcd8739ae039);
100
97
  $parcel$export(module.exports, "AddressInputGroupForm", () => $7fcfa1d90c4a7e45$export$2e2bcd8739ae039);
101
98
  $parcel$export(module.exports, "useExcel", () => $22d7e244b9ff5d8c$export$4564041bcff0e281);
102
99
  $parcel$export(module.exports, "useExcelMapper", () => $c1b6e62d8639d990$export$2e2bcd8739ae039);
@@ -1688,7 +1685,7 @@ var $143cee146891bafc$export$2e2bcd8739ae039 = $143cee146891bafc$var$styles;
1688
1685
  var $75cfef1d7ff66e89$var$InputGroupForm = function(props) {
1689
1686
  var _a;
1690
1687
  var _b;
1691
- var name = props.name, _c = props.htmlType, htmlType = _c === void 0 ? 'text' : _c, label = props.label, hint = props.hint, description = props.description, placeholder = props.placeholder, leading = props.leading, trailing = props.trailing, required = props.required, value = props.value, mask = props.mask, min = props.min, max = props.max, maxLength = props.maxLength, rows = props.rows, error = props.error, _d = props.type, type = _d === void 0 ? 'normal' : _d, isDisabled = props.isDisabled, _e = props.isRequired, isRequired = _e === void 0 ? false : _e, _f = props.isTouched, isTouched = _f === void 0 ? false : _f, _g = props.isSolo, isSolo = _g === void 0 ? false : _g, _h = props.isOptionalLabelHidden, isOptionalLabelHidden = _h === void 0 ? false : _h, onChange = props.onChange, onClear = props.onClear, onBlur = props.onBlur, onClick = props.onClick, onKeyDown = props.onKeyDown, setRefOnLoad = props.setRefOnLoad, stylesOverrides = props.styles;
1688
+ var name = props.name, _c = props.htmlType, htmlType = _c === void 0 ? 'text' : _c, label = props.label, hint = props.hint, description = props.description, placeholder = props.placeholder, leading = props.leading, trailing = props.trailing, required = props.required, value = props.value, mask = props.mask, min = props.min, max = props.max, step = props.step, maxLength = props.maxLength, rows = props.rows, error = props.error, _d = props.type, type = _d === void 0 ? 'normal' : _d, isDisabled = props.isDisabled, _e = props.isRequired, isRequired = _e === void 0 ? false : _e, _f = props.isTouched, isTouched = _f === void 0 ? false : _f, _g = props.isSolo, isSolo = _g === void 0 ? false : _g, _h = props.isOptionalLabelHidden, isOptionalLabelHidden = _h === void 0 ? false : _h, onChange = props.onChange, onClear = props.onClear, onBlur = props.onBlur, onClick = props.onClick, onKeyDown = props.onKeyDown, setRefOnLoad = props.setRefOnLoad, stylesOverrides = props.styles;
1692
1689
  var isValid = error === undefined;
1693
1690
  var maskRef = (0, $iA2ta$reactinputmask.useMask)({
1694
1691
  mask: mask === null || mask === void 0 ? void 0 : mask.mask,
@@ -1752,6 +1749,7 @@ var $75cfef1d7ff66e89$var$InputGroupForm = function(props) {
1752
1749
  value: isSolo ? undefined : value,
1753
1750
  min: min,
1754
1751
  max: max,
1752
+ step: step,
1755
1753
  maxLength: maxLength,
1756
1754
  disabled: isDisabled,
1757
1755
  onChange: onChange,
@@ -5832,122 +5830,6 @@ var $754fdbc7ee597008$export$2e2bcd8739ae039 = $754fdbc7ee597008$var$DateMenuFor
5832
5830
 
5833
5831
 
5834
5832
 
5835
-
5836
- var $cfe896cfd0088e03$var$base = {
5837
- container: '',
5838
- sr: 'sr-only',
5839
- list: 'space-y-5',
5840
- item: {
5841
- container: 'relative flex items-start',
5842
- head: 'flex h-6 items-center',
5843
- body: 'ml-3 text-sm leading-6',
5844
- input: 'h-4 w-4 rounded-sm border-gray-300 text-primary-600 focus:ring-primary-600',
5845
- label: 'font-medium text-gray-900',
5846
- description: 'text-gray-500'
5847
- }
5848
- };
5849
- var $cfe896cfd0088e03$var$disabled = {
5850
- item: {
5851
- input: 'block rounded-md border-0 text-gray-900 shadow-xs ring-1 ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-primary-600 disabled:cursor-not-allowed disabled:bg-gray-50 disabled:text-gray-500 disabled:ring-gray-200'
5852
- }
5853
- };
5854
- var $cfe896cfd0088e03$var$styles = {
5855
- base: $cfe896cfd0088e03$var$base,
5856
- disabled: $cfe896cfd0088e03$var$disabled
5857
- };
5858
- var $cfe896cfd0088e03$export$2e2bcd8739ae039 = $cfe896cfd0088e03$var$styles;
5859
-
5860
-
5861
- var $03635ab4c6dbf412$var$CheckboxInputGroupForm = function(props) {
5862
- var name = props.name, form = props.form, options = props.options, values = props.values, isDisabled = props.isDisabled, stylesOverrides = props.styles;
5863
- var handleGenerateStyle = function() {
5864
- var result = (0, $f0c671820c340322$export$e2d2075c69d9100d)((0, $cfe896cfd0088e03$export$2e2bcd8739ae039).base);
5865
- var keys = (0, $27f90b0cff19565d$export$be5d6ab3c5b84767)((0, $cfe896cfd0088e03$export$2e2bcd8739ae039).base);
5866
- keys.forEach(function(key) {
5867
- (0, $iA2ta$lodash.set)(result, key, (0, $622cd2936b18c771$export$4370d69198e9314a)((0, $iA2ta$lodash.get)((0, $cfe896cfd0088e03$export$2e2bcd8739ae039).base, key), // isTouched === true && !isValid && get(defaultStyles.invalid, key),
5868
- isDisabled && (0, $iA2ta$lodash.get)((0, $cfe896cfd0088e03$export$2e2bcd8739ae039).disabled, key), (0, $iA2ta$lodash.get)(stylesOverrides, key)));
5869
- });
5870
- return result;
5871
- };
5872
- var styles = handleGenerateStyle();
5873
- return (0, $iA2ta$reactjsxruntime.jsx)((0, $iA2ta$formik.FormikProvider), {
5874
- value: form,
5875
- children: (0, $iA2ta$reactjsxruntime.jsxs)("div", {
5876
- children: [
5877
- (0, $iA2ta$reactjsxruntime.jsx)("legend", {
5878
- className: styles.sr,
5879
- children: name
5880
- }),
5881
- (0, $iA2ta$reactjsxruntime.jsx)("div", {
5882
- className: styles.list,
5883
- children: (0, $iA2ta$reactjsxruntime.jsx)((0, $iA2ta$formik.FieldArray), {
5884
- name: name,
5885
- render: function(_a) {
5886
- var remove = _a.remove, push = _a.push;
5887
- return (0, $iA2ta$reactjsxruntime.jsx)((0, $iA2ta$reactjsxruntime.Fragment), {
5888
- children: options === null || options === void 0 ? void 0 : options.map(function(option) {
5889
- return (0, $iA2ta$reactjsxruntime.jsxs)("div", {
5890
- className: styles.item.container,
5891
- children: [
5892
- (0, $iA2ta$reactjsxruntime.jsx)("div", {
5893
- className: styles.item.head,
5894
- children: (0, $iA2ta$reactjsxruntime.jsx)("input", {
5895
- id: option.value,
5896
- name: option.value,
5897
- "data-cy": "form-".concat(name, "-checkbox-").concat(option.value),
5898
- "aria-describedby": "".concat(option.value, "-description"),
5899
- type: "checkbox",
5900
- checked: values === null || values === void 0 ? void 0 : values.includes(option.value),
5901
- className: styles.item.input,
5902
- disabled: isDisabled,
5903
- onChange: function(value) {
5904
- var isChecked = value.currentTarget.checked;
5905
- if (isChecked) {
5906
- push(option.value);
5907
- return;
5908
- }
5909
- var findIndex = values.findIndex(function(value) {
5910
- return value === option.value;
5911
- });
5912
- remove(findIndex);
5913
- }
5914
- })
5915
- }),
5916
- (0, $iA2ta$reactjsxruntime.jsxs)("div", {
5917
- className: styles.item.body,
5918
- children: [
5919
- (0, $iA2ta$reactjsxruntime.jsx)("label", {
5920
- htmlFor: "comments",
5921
- className: styles.item.label,
5922
- children: option.title
5923
- }),
5924
- option.description && (0, $iA2ta$reactjsxruntime.jsx)("p", {
5925
- id: "comments-description",
5926
- className: styles.item.description,
5927
- children: option.description
5928
- })
5929
- ]
5930
- })
5931
- ]
5932
- }, option.value);
5933
- })
5934
- });
5935
- }
5936
- })
5937
- })
5938
- ]
5939
- })
5940
- });
5941
- };
5942
- var $03635ab4c6dbf412$export$2e2bcd8739ae039 = $03635ab4c6dbf412$var$CheckboxInputGroupForm;
5943
-
5944
-
5945
-
5946
-
5947
-
5948
-
5949
-
5950
-
5951
5833
  var $5ea6f468291aa318$var$base = {
5952
5834
  container: 'relative flex items-start',
5953
5835
  head: 'flex h-6 items-center select-none',
@@ -6229,6 +6111,7 @@ var $b964d0845ae86974$var$base = {
6229
6111
  },
6230
6112
  area: {
6231
6113
  container: 'overflow-hidden p-4',
6114
+ emptyLine: 'min-h-[1em] leading-none',
6232
6115
  editable: 'leading-7 focus:outline-none prose prose-sm max-w-none prose-headings:font-semibold prose-h1:text-2xl prose-h2:text-xl prose-p:my-3 prose-blockquote:my-3'
6233
6116
  }
6234
6117
  },
@@ -6339,10 +6222,32 @@ var $784e2eeeb6b1d65b$var$applyMarks = function(content, marks) {
6339
6222
  });
6340
6223
  return content;
6341
6224
  };
6225
+ var $784e2eeeb6b1d65b$var$isNodeTextEmpty = function(node) {
6226
+ var _a, _b;
6227
+ if ((0, $iA2ta$slate.Text).isText(node)) return ((_a = node.text) !== null && _a !== void 0 ? _a : '').trim() === '';
6228
+ if ((0, $iA2ta$slate.Editor).isEditor(node) || (0, $iA2ta$slate.Element).isElement(node)) {
6229
+ var children = (_b = node.children) !== null && _b !== void 0 ? _b : [];
6230
+ if ((0, $iA2ta$lodash.isEmpty)(children)) return true;
6231
+ return (0, $iA2ta$lodash.every)(children, function(child) {
6232
+ return $784e2eeeb6b1d65b$var$isNodeTextEmpty(child);
6233
+ });
6234
+ }
6235
+ return true;
6236
+ };
6237
+ var $784e2eeeb6b1d65b$var$isDocumentAllTextEmpty = function(value) {
6238
+ if (!(0, $iA2ta$lodash.isArray)(value) || (0, $iA2ta$lodash.isEmpty)(value)) return true;
6239
+ return (0, $iA2ta$lodash.every)(value, function(node) {
6240
+ return $784e2eeeb6b1d65b$var$isNodeTextEmpty(node);
6241
+ });
6242
+ };
6342
6243
  var $784e2eeeb6b1d65b$var$renderRichNode = function(node, options) {
6343
6244
  if (options === void 0) options = {};
6344
6245
  var attributes = options.attributes, providedChildren = options.children, key = options.key;
6345
6246
  if ((0, $iA2ta$slate.Text).isText(node)) {
6247
+ if (String(providedChildren !== null && providedChildren !== void 0 ? providedChildren : node.text).trim() === '') return (0, $iA2ta$reactjsxruntime.jsx)("div", {
6248
+ className: (0, $b964d0845ae86974$export$2e2bcd8739ae039).editor.area.emptyLine,
6249
+ "aria-hidden": "true"
6250
+ }, key);
6346
6251
  var content = $784e2eeeb6b1d65b$var$applyMarks(providedChildren !== null && providedChildren !== void 0 ? providedChildren : node.text, node);
6347
6252
  return attributes ? (0, $iA2ta$reactjsxruntime.jsx)("span", $784e2eeeb6b1d65b$var$__assign({}, attributes, {
6348
6253
  children: content
@@ -6486,7 +6391,7 @@ var $784e2eeeb6b1d65b$var$RichTextArea = function(_a) {
6486
6391
  generateBlockButton('justify', 'align-justify')
6487
6392
  ]);
6488
6393
  if (!(0, $iA2ta$lodash.isEmpty)(align)) sections.push(align);
6489
- return sections.map(function(group, index) {
6394
+ return (0, $iA2ta$lodash.map)(sections, function(group, index) {
6490
6395
  return (0, $iA2ta$reactjsxruntime.jsxs)((0, $iA2ta$react.Fragment), {
6491
6396
  children: [
6492
6397
  index > 0 && (0, $iA2ta$reactjsxruntime.jsx)("div", {
@@ -6501,7 +6406,7 @@ var $784e2eeeb6b1d65b$var$RichTextArea = function(_a) {
6501
6406
  generateBlockButton,
6502
6407
  styles.editor.toolbar.divider
6503
6408
  ]);
6504
- if (isReadOnly && (0, $iA2ta$lodash.isEmpty)(parsedInitialValue)) return null;
6409
+ if (isReadOnly && ((0, $iA2ta$lodash.isEmpty)(parsedInitialValue) || $784e2eeeb6b1d65b$var$isDocumentAllTextEmpty(parsedInitialValue))) return null;
6505
6410
  return isReadOnly ? (0, $iA2ta$reactjsxruntime.jsx)("div", {
6506
6411
  className: styles.readOnlyWrapper,
6507
6412
  children: (0, $iA2ta$lodash.isArray)(parsedInitialValue) ? (0, $iA2ta$lodash.map)(parsedInitialValue, function(n, i) {
@@ -6879,507 +6784,6 @@ var $079d45c48b1515dd$export$2e2bcd8739ae039 = $079d45c48b1515dd$var$FileInputGr
6879
6784
 
6880
6785
 
6881
6786
 
6882
-
6883
- var $3698b0b0dc32c78c$var$base = {
6884
- container: '',
6885
- head: 'flex justify-between',
6886
- body: 'relative rounded-md py-2',
6887
- foot: '',
6888
- label: 'block font-medium text-gray-900',
6889
- hint: 'text-xs text-gray-500',
6890
- leading: 'pointer-events-none absolute inset-y-0 left-0 flex items-center',
6891
- input: 'block w-full',
6892
- trailing: 'pointer-events-none absolute inset-y-0 right-0 flex items-center',
6893
- description: 'text-gray-400 text-xs mt-1',
6894
- error: 'text-red-500 text-xs mt-1'
6895
- };
6896
- var $3698b0b0dc32c78c$var$leading = {
6897
- input: 'pl-10'
6898
- };
6899
- var $3698b0b0dc32c78c$var$trailing = {};
6900
- var $3698b0b0dc32c78c$var$normal = {
6901
- label: 'leading-6 text-sm mb-2',
6902
- hint: 'leading-6',
6903
- leading: 'pl-3',
6904
- input: 'rounded-md border-gray-200 shadow-xs focus:border-primary-500 focus:ring-primary-500 sm:text-sm placeholder-gray-300',
6905
- trailing: 'pr-3',
6906
- description: 'mt-2 text-sm'
6907
- };
6908
- var $3698b0b0dc32c78c$var$inset = {
6909
- container: 'rounded-md px-3 pt-2.5 pb-1.5 shadow-xs ring-1 ring-inset ring-gray-300 focus-within:ring-2 focus-within:ring-primary-600',
6910
- label: 'text-xs',
6911
- hint: 'text-xs',
6912
- input: 'border-0 ring-0! p-0 text-gray-900 placeholder:text-gray-400 focus:ring-0 sm:text-sm pl-0',
6913
- description: 'hidden'
6914
- };
6915
- var $3698b0b0dc32c78c$var$overlapping = {
6916
- container: 'relative',
6917
- head: ' absolute flex justify-between items-center left-0 -top-2 right-0 mx-2 z-10 w-full',
6918
- label: 'inline-block bg-white px-1 text-xs font-medium text-gray-900 ',
6919
- hint: 'text-xs mr-4 bg-white px-1',
6920
- input: 'block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-xs ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-primary-600 sm:text-sm sm:leading-6',
6921
- description: 'hidden'
6922
- };
6923
- var $3698b0b0dc32c78c$var$pill = {
6924
- head: 'mx-px block px-4 text-sm font-medium leading-6 text-gray-900 mb-1 pr-6',
6925
- foot: 'mx-px block px-4 text-sm font-medium leading-6 text-gray-900 mt-1 pr-6',
6926
- input: 'block w-full rounded-full border-0 px-4 py-1.5 text-gray-900 shadow-xs ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-primary-600 sm:text-sm sm:leading-6',
6927
- trailing: 'pr-2',
6928
- description: 'text-xs'
6929
- };
6930
- var $3698b0b0dc32c78c$var$floored = {
6931
- body: 'relative mt-2',
6932
- label: 'block text-sm font-medium leading-6 text-gray-900',
6933
- input: 'peer block w-full border-0 bg-gray-50 py-1.5 text-gray-900 focus:ring-0 sm:text-sm sm:leading-6 ring-0',
6934
- description: 'text-xs mt-2'
6935
- };
6936
- var $3698b0b0dc32c78c$var$invalid = {
6937
- container: 'ring-red-500',
6938
- input: // 'block w-full border border-transparent text-red-900 ring-1 ring-inset ring-red-300 placeholder:text-red-300 focus:ring-2 focus:ring-inset focus:ring-red-500 sm:leading-6 pr-10',
6939
- 'block w-full border border-transparent text-red-900 ring-1 ring-inset ring-red-300 placeholder:text-red-300 focus:ring-2 focus:ring-inset focus:ring-red-500 pr-10',
6940
- description: 'text-sm text-red-600'
6941
- };
6942
- var $3698b0b0dc32c78c$var$disabled = {
6943
- input: 'block w-full rounded-md border-0 text-gray-900 shadow-xs ring-1 ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-primary-600 disabled:cursor-not-allowed disabled:bg-gray-50 disabled:text-gray-500 disabled:ring-gray-200'
6944
- };
6945
- var $3698b0b0dc32c78c$var$styles = {
6946
- base: $3698b0b0dc32c78c$var$base,
6947
- leading: $3698b0b0dc32c78c$var$leading,
6948
- trailing: $3698b0b0dc32c78c$var$trailing,
6949
- normal: $3698b0b0dc32c78c$var$normal,
6950
- inset: $3698b0b0dc32c78c$var$inset,
6951
- overlapping: $3698b0b0dc32c78c$var$overlapping,
6952
- pill: $3698b0b0dc32c78c$var$pill,
6953
- floored: $3698b0b0dc32c78c$var$floored,
6954
- invalid: $3698b0b0dc32c78c$var$invalid,
6955
- disabled: $3698b0b0dc32c78c$var$disabled
6956
- };
6957
- var $3698b0b0dc32c78c$export$2e2bcd8739ae039 = $3698b0b0dc32c78c$var$styles;
6958
-
6959
-
6960
-
6961
-
6962
-
6963
-
6964
-
6965
-
6966
-
6967
-
6968
-
6969
-
6970
-
6971
- var $17bb03e8d27b8746$var$OpeningHourItem = function(props) {
6972
- var _a, _b, _c;
6973
- var id = props.id, _d = props.lang, lang = _d === void 0 ? 'en' : _d, defaultValue = props.openingHour, dayPlaceholder = props.dayPlaceholder, onCreate = props.onCreate, onUpdate = props.onUpdate, onDelete = props.onDelete;
6974
- var options = (0, $iA2ta$react.useMemo)(function() {
6975
- var values = [
6976
- 'MONDAY',
6977
- 'TUESDAY',
6978
- 'WEDNESDAY',
6979
- 'THURSDAY',
6980
- 'FRIDAY',
6981
- 'SATURDAY',
6982
- 'SUNDAY'
6983
- ];
6984
- var translations = [];
6985
- switch(lang){
6986
- case 'en':
6987
- translations = [
6988
- 'Monday',
6989
- 'Tuesday',
6990
- 'Wednesday',
6991
- 'Thursday',
6992
- 'Friday',
6993
- 'Saturday',
6994
- 'Sunday'
6995
- ];
6996
- break;
6997
- case 'nl':
6998
- translations = [
6999
- 'Maandag',
7000
- 'Dinsdag',
7001
- 'Woensdag',
7002
- 'Donderdag',
7003
- 'Vrijdag',
7004
- 'Zaterdag',
7005
- 'Zondag'
7006
- ];
7007
- break;
7008
- }
7009
- return translations.map(function(translation, index) {
7010
- return {
7011
- label: translation,
7012
- value: values[index]
7013
- };
7014
- });
7015
- }, [
7016
- lang
7017
- ]);
7018
- var isCreating = defaultValue === undefined;
7019
- var initialValues = (0, $iA2ta$react.useMemo)(function() {
7020
- var _a, _b, _c, _d, _e, _f, _g, _h;
7021
- return {
7022
- id: (_a = defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.id) !== null && _a !== void 0 ? _a : id,
7023
- day: {
7024
- label: (_d = options[(_c = (_b = defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.day) !== null && _b !== void 0 ? _b : dayPlaceholder) !== null && _c !== void 0 ? _c : 0]) === null || _d === void 0 ? void 0 : _d.label,
7025
- value: (_g = options[(_f = (_e = defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.day) !== null && _e !== void 0 ? _e : dayPlaceholder) !== null && _f !== void 0 ? _f : 0]) === null || _g === void 0 ? void 0 : _g.value
7026
- },
7027
- closed: (_h = defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.closed) !== null && _h !== void 0 ? _h : false,
7028
- openingTime: (defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.openingTime) ? (0, $iA2ta$luxon.DateTime).fromISO(defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.openingTime).minus({
7029
- hours: 2
7030
- }).toFormat('HH:mm') : '',
7031
- closingTime: (defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.closingTime) ? (0, $iA2ta$luxon.DateTime).fromISO(defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.closingTime).minus({
7032
- hours: 2
7033
- }).toFormat('HH:mm') : ''
7034
- };
7035
- }, [
7036
- dayPlaceholder,
7037
- defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.closed,
7038
- defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.closingTime,
7039
- defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.day,
7040
- defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.id,
7041
- defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.openingTime,
7042
- id,
7043
- options
7044
- ]);
7045
- var toTimeStamp = (0, $iA2ta$react.useCallback)(function(value) {
7046
- if (value === undefined) return undefined;
7047
- var _a = value.split(':'), hours = _a[0], minutes = _a[1];
7048
- return (0, $iA2ta$luxon.DateTime).utc().set({
7049
- hour: Number(hours),
7050
- minute: Number(minutes),
7051
- second: 0,
7052
- millisecond: 0
7053
- }).toISO();
7054
- }, []);
7055
- var onSubmit = (0, $iA2ta$react.useCallback)(function(values) {
7056
- var _a;
7057
- var openingTime = toTimeStamp(values === null || values === void 0 ? void 0 : values.openingTime);
7058
- var closingTime = toTimeStamp(values === null || values === void 0 ? void 0 : values.closingTime);
7059
- var params = {
7060
- id: (_a = defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.id) !== null && _a !== void 0 ? _a : id,
7061
- day: options.findIndex(function(option) {
7062
- var _a;
7063
- return option.value === ((_a = values === null || values === void 0 ? void 0 : values.day) === null || _a === void 0 ? void 0 : _a.value);
7064
- }),
7065
- closed: values === null || values === void 0 ? void 0 : values.closed,
7066
- openingTime: openingTime,
7067
- closingTime: closingTime
7068
- };
7069
- onCreate(params);
7070
- }, [
7071
- defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.id,
7072
- id,
7073
- onCreate,
7074
- options,
7075
- toTimeStamp
7076
- ]);
7077
- var form = (0, $iA2ta$formik.useFormik)({
7078
- initialValues: initialValues,
7079
- onSubmit: onSubmit
7080
- });
7081
- return (0, $iA2ta$reactjsxruntime.jsxs)("div", {
7082
- className: (0, $622cd2936b18c771$export$4370d69198e9314a)('-mt-2 flex gap-4 items-end', !isCreating && 'opacity-100'),
7083
- children: [
7084
- (0, $iA2ta$reactjsxruntime.jsx)("div", {
7085
- className: (0, $a14a274e5b9e799a$export$2e2bcd8739ae039).selectMenu.container,
7086
- children: (0, $iA2ta$reactjsxruntime.jsx)((0, $f3fccf014e1f10d5$export$2e2bcd8739ae039), {
7087
- name: "day",
7088
- //
7089
- isRequired: true,
7090
- isMultiple: false,
7091
- isSearchable: false,
7092
- //
7093
- options: options,
7094
- //
7095
- value: (_a = form === null || form === void 0 ? void 0 : form.values) === null || _a === void 0 ? void 0 : _a.day,
7096
- onChange: function(value) {
7097
- return form.setFieldValue('day', value);
7098
- },
7099
- onBlur: function() {
7100
- var _a, _b, _c;
7101
- form === null || form === void 0 || form.setFieldTouched('day');
7102
- if (!isCreating) {
7103
- var openingTime = toTimeStamp((_a = form.values) === null || _a === void 0 ? void 0 : _a.openingTime);
7104
- var closingTime = toTimeStamp((_b = form.values) === null || _b === void 0 ? void 0 : _b.closingTime);
7105
- var params = {
7106
- id: defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.id,
7107
- day: options.findIndex(function(option) {
7108
- var _a, _b;
7109
- return option.value === ((_b = (_a = form.values) === null || _a === void 0 ? void 0 : _a.day) === null || _b === void 0 ? void 0 : _b.value);
7110
- }),
7111
- closed: (_c = form.values) === null || _c === void 0 ? void 0 : _c.closed,
7112
- openingTime: openingTime,
7113
- closingTime: closingTime
7114
- };
7115
- onUpdate && onUpdate(params);
7116
- }
7117
- },
7118
- onClear: function() {
7119
- return form.setFieldValue('day', null);
7120
- }
7121
- })
7122
- }),
7123
- (0, $iA2ta$reactjsxruntime.jsx)((0, $75cfef1d7ff66e89$export$2e2bcd8739ae039), {
7124
- name: "openingTime",
7125
- htmlType: "time",
7126
- type: "normal",
7127
- //
7128
- isRequired: true,
7129
- isDisabled: form.values.closed,
7130
- //
7131
- value: (_b = form === null || form === void 0 ? void 0 : form.values) === null || _b === void 0 ? void 0 : _b.openingTime,
7132
- onChange: form === null || form === void 0 ? void 0 : form.handleChange,
7133
- onBlur: function(values) {
7134
- var _a, _b, _c;
7135
- form === null || form === void 0 || form.handleBlur(values);
7136
- if (!isCreating) {
7137
- var openingTime = toTimeStamp((_a = form.values) === null || _a === void 0 ? void 0 : _a.openingTime);
7138
- var closingTime = toTimeStamp((_b = form.values) === null || _b === void 0 ? void 0 : _b.closingTime);
7139
- var params = {
7140
- id: values === null || values === void 0 ? void 0 : values.id,
7141
- day: options.findIndex(function(option) {
7142
- var _a, _b;
7143
- return option.value === ((_b = (_a = form.values) === null || _a === void 0 ? void 0 : _a.day) === null || _b === void 0 ? void 0 : _b.value);
7144
- }),
7145
- closed: (_c = form.values) === null || _c === void 0 ? void 0 : _c.closed,
7146
- openingTime: openingTime,
7147
- closingTime: closingTime
7148
- };
7149
- onUpdate && onUpdate(params);
7150
- }
7151
- }
7152
- }),
7153
- (0, $iA2ta$reactjsxruntime.jsx)((0, $75cfef1d7ff66e89$export$2e2bcd8739ae039), {
7154
- name: "closingTime",
7155
- htmlType: "time",
7156
- type: "normal",
7157
- //
7158
- isRequired: true,
7159
- isDisabled: form.values.closed,
7160
- //
7161
- value: (_c = form.values) === null || _c === void 0 ? void 0 : _c.closingTime,
7162
- onChange: form === null || form === void 0 ? void 0 : form.handleChange,
7163
- onBlur: function(values) {
7164
- var _a, _b, _c;
7165
- form === null || form === void 0 || form.handleBlur(values);
7166
- if (!isCreating) {
7167
- var openingTime = toTimeStamp((_a = form.values) === null || _a === void 0 ? void 0 : _a.openingTime);
7168
- var closingTime = toTimeStamp((_b = form.values) === null || _b === void 0 ? void 0 : _b.closingTime);
7169
- var params = {
7170
- id: values === null || values === void 0 ? void 0 : values.id,
7171
- day: options.findIndex(function(option) {
7172
- var _a, _b;
7173
- return option.value === ((_b = (_a = form.values) === null || _a === void 0 ? void 0 : _a.day) === null || _b === void 0 ? void 0 : _b.value);
7174
- }),
7175
- closed: (_c = form.values) === null || _c === void 0 ? void 0 : _c.closed,
7176
- openingTime: openingTime,
7177
- closingTime: closingTime
7178
- };
7179
- onUpdate && onUpdate(params);
7180
- }
7181
- }
7182
- }),
7183
- (0, $iA2ta$reactjsxruntime.jsxs)("div", {
7184
- className: "flex flex-col",
7185
- children: [
7186
- (0, $iA2ta$reactjsxruntime.jsx)("p", {
7187
- className: "text-xs font-medium pb-1 mt-4",
7188
- children: "Closed"
7189
- }),
7190
- (0, $iA2ta$reactjsxruntime.jsxs)((0, $iA2ta$headlessuireact.Switch), {
7191
- checked: form.values.closed,
7192
- onChange: function() {
7193
- var _a, _b, _c, _d;
7194
- form.setFieldValue('closed', !form.values.closed);
7195
- if (!isCreating) {
7196
- var openingTime = toTimeStamp((_a = form.values) === null || _a === void 0 ? void 0 : _a.openingTime);
7197
- var closingTime = toTimeStamp((_b = form.values) === null || _b === void 0 ? void 0 : _b.closingTime);
7198
- var params = {
7199
- id: (_c = form.values) === null || _c === void 0 ? void 0 : _c.id,
7200
- day: options.findIndex(function(option) {
7201
- var _a, _b;
7202
- return option.value === ((_b = (_a = form.values) === null || _a === void 0 ? void 0 : _a.day) === null || _b === void 0 ? void 0 : _b.value);
7203
- }),
7204
- closed: !((_d = form.values) === null || _d === void 0 ? void 0 : _d.closed),
7205
- openingTime: openingTime,
7206
- closingTime: closingTime
7207
- };
7208
- onUpdate && onUpdate(params);
7209
- }
7210
- },
7211
- className: (0, $622cd2936b18c771$export$4370d69198e9314a)((0, $a14a274e5b9e799a$export$2e2bcd8739ae039).control.action, form.values.closed ? 'bg-primary-500' : 'bg-gray-200'),
7212
- children: [
7213
- (0, $iA2ta$reactjsxruntime.jsx)("span", {
7214
- className: (0, $a14a274e5b9e799a$export$2e2bcd8739ae039).control.sr,
7215
- children: "Toggle closed"
7216
- }),
7217
- (0, $iA2ta$reactjsxruntime.jsx)("span", {
7218
- "aria-hidden": "true",
7219
- className: (0, $622cd2936b18c771$export$4370d69198e9314a)((0, $a14a274e5b9e799a$export$2e2bcd8739ae039).control.span, form.values.closed ? 'translate-x-5' : 'translate-x-0')
7220
- })
7221
- ]
7222
- })
7223
- ]
7224
- }),
7225
- !isCreating ? (0, $iA2ta$reactjsxruntime.jsx)((0, $98b8616b6ef0f950$export$2e2bcd8739ae039), {
7226
- size: "sm",
7227
- type: "outline",
7228
- onClick: function() {
7229
- return onDelete && onDelete(form.values.id);
7230
- },
7231
- children: (0, $iA2ta$reactjsxruntime.jsx)((0, $iA2ta$heroiconsreact24outline.XMarkIcon), {
7232
- className: "w-4 h-4"
7233
- })
7234
- }) : (0, $iA2ta$reactjsxruntime.jsx)((0, $98b8616b6ef0f950$export$2e2bcd8739ae039), {
7235
- size: "sm",
7236
- type: "secondary",
7237
- onClick: function() {
7238
- return form.handleSubmit();
7239
- },
7240
- children: (0, $iA2ta$reactjsxruntime.jsx)((0, $iA2ta$heroiconsreact24outline.PlusIcon), {
7241
- className: "w-4 h-4"
7242
- })
7243
- })
7244
- ]
7245
- });
7246
- };
7247
- var $17bb03e8d27b8746$export$2e2bcd8739ae039 = $17bb03e8d27b8746$var$OpeningHourItem;
7248
-
7249
-
7250
- var $a14a274e5b9e799a$var$styles = {
7251
- container: '',
7252
- selectMenu: {
7253
- container: "grow"
7254
- },
7255
- control: {
7256
- container: 'flex items-center',
7257
- label: 'text-sm mr-2 font-medium w-36',
7258
- action: 'relative inline-flex h-6 w-11 shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out focus:outline-hidden focus:ring-2 focus:ring-primary-500 focus:ring-offset-2',
7259
- span: 'pointer-events-none inline-block h-5 w-5 transform rounded-full bg-white shadow-sm ring-0 transition duration-200 ease-in-out',
7260
- sr: 'sr-only'
7261
- }
7262
- };
7263
- var $a14a274e5b9e799a$export$2e2bcd8739ae039 = $a14a274e5b9e799a$var$styles;
7264
-
7265
-
7266
-
7267
-
7268
-
7269
-
7270
- var $9f6cfd21b337aca9$var$OpeningsHourInputGroupForm = function(props) {
7271
- var form = props.form, _a = props.name, name = _a === void 0 ? 'opening-hours-input' : _a, label = props.label, description = props.description, required = props.required, value = props.value, error = props.error, lang = props.lang, isDisabled = props.isDisabled, _b = props.isRequired, isRequired = _b === void 0 ? false : _b, _c = props.isTouched, isTouched = _c === void 0 ? false : _c, onChange = props.onChange, stylesOverrides = props.styles, handleDelete = props.handleDelete;
7272
- var isValid = error === undefined;
7273
- var handleGenerateStyle = function() {
7274
- var result = (0, $f0c671820c340322$export$e2d2075c69d9100d)((0, $3698b0b0dc32c78c$export$2e2bcd8739ae039).base);
7275
- var keys = (0, $27f90b0cff19565d$export$be5d6ab3c5b84767)((0, $3698b0b0dc32c78c$export$2e2bcd8739ae039).base);
7276
- keys.forEach(function(key) {
7277
- (0, $iA2ta$lodash.set)(result, key, (0, $622cd2936b18c771$export$4370d69198e9314a)((0, $iA2ta$lodash.get)((0, $3698b0b0dc32c78c$export$2e2bcd8739ae039).base, key), isTouched === true && !isValid && (0, $iA2ta$lodash.get)((0, $3698b0b0dc32c78c$export$2e2bcd8739ae039).invalid, key), isDisabled && (0, $iA2ta$lodash.get)((0, $3698b0b0dc32c78c$export$2e2bcd8739ae039).disabled, key), (0, $iA2ta$lodash.get)(stylesOverrides, key)));
7278
- });
7279
- return result;
7280
- };
7281
- var styles = handleGenerateStyle();
7282
- (0, $iA2ta$react.useEffect)(function() {
7283
- if (form.values[name]) onChange && onChange(form.values[name]);
7284
- }, [
7285
- form.values,
7286
- name,
7287
- onChange
7288
- ]);
7289
- return (0, $iA2ta$reactjsxruntime.jsxs)("div", {
7290
- className: styles.container,
7291
- children: [
7292
- (0, $iA2ta$reactjsxruntime.jsxs)("div", {
7293
- className: styles.head,
7294
- children: [
7295
- label && (0, $iA2ta$reactjsxruntime.jsx)("label", {
7296
- htmlFor: name,
7297
- className: styles.label,
7298
- children: label
7299
- }),
7300
- !required && !isRequired && typeof label === 'string' && (0, $iA2ta$reactjsxruntime.jsx)("span", {
7301
- className: styles.hint,
7302
- children: "Optional"
7303
- }),
7304
- required && required({
7305
- isRequired: isRequired
7306
- })
7307
- ]
7308
- }),
7309
- (0, $iA2ta$reactjsxruntime.jsx)("div", {
7310
- className: styles.body,
7311
- children: (0, $iA2ta$reactjsxruntime.jsx)((0, $iA2ta$formik.FormikProvider), {
7312
- value: form,
7313
- children: (0, $iA2ta$reactjsxruntime.jsx)((0, $iA2ta$formik.FieldArray), {
7314
- name: name,
7315
- render: function(_a) {
7316
- var _b, _c, _d, _e, _f;
7317
- var remove = _a.remove, push = _a.push, replace = _a.replace;
7318
- return (0, $iA2ta$reactjsxruntime.jsxs)((0, $iA2ta$reactjsxruntime.Fragment), {
7319
- children: [
7320
- (_e = (_d = (_c = (_b = form.values) === null || _b === void 0 ? void 0 : _b[name]) === null || _c === void 0 ? void 0 : _c.map(function(value, index) {
7321
- return {
7322
- index: index,
7323
- value: value
7324
- };
7325
- })) === null || _d === void 0 ? void 0 : _d.sort(function(a, b) {
7326
- return a.value.day < b.value.day ? -1 : 1;
7327
- })) === null || _e === void 0 ? void 0 : _e.map(function(_a) {
7328
- var openingHour = _a.value, index = _a.index;
7329
- return (0, $iA2ta$reactjsxruntime.jsx)((0, $17bb03e8d27b8746$export$2e2bcd8739ae039), {
7330
- id: index,
7331
- openingHour: openingHour,
7332
- lang: lang,
7333
- onCreate: push,
7334
- onUpdate: function(value) {
7335
- return replace(index, value);
7336
- },
7337
- onDelete: function(id) {
7338
- if (id) {
7339
- handleDelete && handleDelete(id);
7340
- remove(index);
7341
- }
7342
- }
7343
- }, "".concat(openingHour.id, "-").concat(index));
7344
- }),
7345
- (0, $iA2ta$reactjsxruntime.jsx)((0, $17bb03e8d27b8746$export$2e2bcd8739ae039), {
7346
- id: "-",
7347
- // Prefill picker with a day later than the day of the last saved opening hour.
7348
- lang: lang,
7349
- dayPlaceholder: value && ((_f = value === null || value === void 0 ? void 0 : value[(value === null || value === void 0 ? void 0 : value.length) - 1]) === null || _f === void 0 ? void 0 : _f.day) + 1,
7350
- onCreate: push
7351
- }, "-")
7352
- ]
7353
- });
7354
- }
7355
- })
7356
- })
7357
- }),
7358
- (0, $iA2ta$reactjsxruntime.jsxs)("div", {
7359
- className: styles.foot,
7360
- children: [
7361
- description && !(error && isTouched) && (0, $iA2ta$reactjsxruntime.jsx)("p", {
7362
- className: styles.description,
7363
- children: description
7364
- }),
7365
- error && isTouched && (0, $iA2ta$reactjsxruntime.jsx)("p", {
7366
- className: styles.error,
7367
- children: error
7368
- })
7369
- ]
7370
- })
7371
- ]
7372
- });
7373
- };
7374
- var $9f6cfd21b337aca9$export$2e2bcd8739ae039 = $9f6cfd21b337aca9$var$OpeningsHourInputGroupForm;
7375
-
7376
-
7377
-
7378
-
7379
-
7380
-
7381
-
7382
-
7383
6787
  var $03b368478cf695f0$var$base = {
7384
6788
  container: '',
7385
6789
  head: 'flex justify-between',