@timum/booking 1.2.7 → 1.2.8

package/README.md

@@ -28,9 +28,9 @@ This documentation guides you through all the customization capabilities.
     - [Cancelation Related](#cancelation_related)
     - [Data Fetching Related](#data_fetching_related)
   - [Localisation](#localisation)
-  - [How to Define Fields](#how_to_define_fields)
-    - [Anatomy of a Field](#anatomy_of_a_field)
-  - [An Example](#an_example)
+  - [Booking Form Fields](#bookingFormFields)
+    - [Custom Fields](#customFields)
+  - [Custom Field Example](#CustomFieldExample)
     - [The Scenario](#the_scenario)
     - [The Implementation](#the_implementation)
 
@@ -67,7 +67,7 @@ Add the following code to your webpage:
 ```html
 <div id="bookingjs" style="margin: 32px"></div>
 <script type="module">
-  import * as timum from 'https://cdn.jsdelivr.net/npm/@timum/booking@0.8.0/build/timum-booking.js';
+  import * as timum from 'https://cdn.jsdelivr.net/npm/@timum/booking@1.2.8/build/timum-booking.js';
 
   timum.init({ ref: 'booking-widget-demo-resource@timum' });
 </script>
@@ -82,7 +82,7 @@ Alternatively, you can add `ref` to your url as a parameter. This allows you to
 ```html
 <div id="bookingjs" style="margin: 32px"></div>
 <script type="module">
-  import * as timum from 'https://cdn.jsdelivr.net/npm/@timum/booking@0.8.0/build/timum-booking.js';
+  import * as timum from 'https://cdn.jsdelivr.net/npm/@timum/booking@1.2.8/build/timum-booking.js';
 
   timum.init(); //<- no need for the reference here
 </script>
@@ -334,7 +334,7 @@ All Booking related callbacks receive a <em>single obejct</em> as argument conta
         untouchedEnd: ISO String e.g: "2023-01-27T09:35:00+01:00" as the server sent it
         }
   ```
-- a `data` looking like this:
+- a `data` object looking like this:
 
 ```javascript
  {
@@ -343,13 +343,13 @@ All Booking related callbacks receive a <em>single obejct</em> as argument conta
    email: 'string',
    agbs: 'bool'
 
-   // plus whatever optional and/or custom fields you yourself has defined.
+   // plus whatever optional and/or custom fields you yourself have defined.
    // -> so the makeup of this object changes depending on your settings.
  }
 
 ```
 
-Additionally, `createBookingFailed` and `createBookingSuccessfull` also have a RTKQ `response` object in their respecive argument. See [here](https://redux-toolkit.js.org/rtk-query/usage-with-typescript#type-safe-error-handling) for a reference.
+Additionally, `createBookingFailed` and `createBookingSuccessfull` also have a RTKQ `response` object in their respective argument. See [here](https://redux-toolkit.js.org/rtk-query/usage-with-typescript#type-safe-error-handling) for a reference.
 
 <a name=”cancelation_related”></a>
 
@@ -559,9 +559,9 @@ localization: {
 },
 ```
 
-<a name=”how_to_define_fields”></a>
+<a name=”bookingFormFields”></a>
 
-#### How to define fields
+#### Booking Form Fields
 
 You can customize the information you request from customers before booking by defining fields. The minimum required fields for timum are firstName, lastName, email, and agbs. By default, timum also requests mobile and message fields, but you can add your own fields as well.
 
@@ -622,9 +622,15 @@ The standard configuration can be overridden except for the aforementioned field
   },
 ```
 
-<a name=”anatomy_of_a_field”></a>
+<a name=”customFields”></a>
 
-##### Anatomy of a field
+##### Custom Fields
+
+If the values retrieved via custom fields need to be transferred to timum backend as additional booking information, set the parameter `sendCustomValuesInMessage`. With this, the values of custom fields are attached to the customer message. They will be visible to the customer as well in booking confirmation mailings.
+
+  `sendCustomValuesInMessage: true, // necessary to transmit custom field values as part of the customer message`
+
+Anatomy of a custom booking form field:
 
 ```
   <fieldName> : {
@@ -641,6 +647,10 @@ The standard configuration can be overridden except for the aforementioned field
   }
 ```
 
+fieldName
+
+  - define a field name
+
 Depending on the type there are additional properties you can/must specify:
 
 - Type `text`:
@@ -665,9 +675,9 @@ Type `select`:
 
 - options: array of objects with structure { title: string, key: string }. The title is displayed and the key is passed in the data object to callbacks.
 
-<a name=”an_example”></a>
+<a name=”CustomFieldExample”></a>
 
-### An Example
+### Custom Field Example
 
 Here is an example tying all of the aforementioned concepts together.
 And [here](https://jsfiddle.net/timum/wov6pLk7/) is a fiddle containing the very example detailed in this chapter.
@@ -682,12 +692,12 @@ It is necessary to determine the gender of customers for a specific purpose. The
 
 #### The Implementation
 
-This is the base configuration. As it is it uses the standard field configuration shown in [How to define fields](#howToDefineFields).
+This is the base configuration. As it uses the standard field configuration shown in [Booking form fields](#bookingFormFields) :
 
 ```html
 <div id="bookingjs" style="margin: 32px"></div>
 <script type="module">
-  import * as timum from 'https://cdn.jsdelivr.net/npm/@timum/booking@0.8.0/build/timum-booking.js';
+  import * as timum from 'https://cdn.jsdelivr.net/npm/@timum/booking@1.2.8/build/timum-booking.js';
 
   timum.init({ ref: 'booking-widget-demo-resource@timum' });
 </script>
@@ -698,11 +708,12 @@ Let's add the necessary changes:
 ```html
 <div id="bookingjs" style="margin: 32px"></div>
 <script type="module">
-  import * as timum from 'https://cdn.jsdelivr.net/npm/@timum/booking@0.8.0/build/timum-booking.js';
+  import * as timum from 'https://cdn.jsdelivr.net/npm/@timum/booking@1.2.8/build/timum-booking.js';
 
   timum.init(
   {
     ref: 'booking-widget-demo-resource@timum',
+
     fields: {
       // set these fields to undefined explicitly in order to remove them
       message: undefined,
@@ -756,7 +767,8 @@ Let's add the necessary changes:
             (value) => value === true
           ),
       },
-    }
+    },
+    sendCustomValuesInMessage: true, // necessary to transmit custom field values as part of the customer message
 
     // now we need to add the new translation keys and their translations.
 
@@ -787,7 +799,7 @@ Let's add the necessary changes:
             },
         }
       }
-    }
+    },
 
     // the following callback consumes the customers input, allowing you to act on
     //the entered gender value.

package/build/{index-be92daab.js → index-02ba7778.js}

@@ -1,4 +1,4 @@
-import { D as e, F as l, E as t } from "./index-ce93f3a6.js";
+import { D as e, F as l, E as t } from "./index-6afb67dd.js";
 export {
   e as default,
   l as getTableRowUtilityClass,

package/build/{index-90d17811.js → index-0d873894.js}

@@ -1,4 +1,4 @@
-import { o as e, q as s, p as t } from "./index-ce93f3a6.js";
+import { o as e, q as s, p as t } from "./index-6afb67dd.js";
 export {
   e as default,
   s as getTableCellUtilityClass,

package/build/{index-d0ca0177.js → index-0e122624.js}

@@ -1,4 +1,4 @@
-import { k as e, n as l, m as t } from "./index-ce93f3a6.js";
+import { k as e, n as l, m as t } from "./index-6afb67dd.js";
 export {
   e as default,
   l as getTableBodyUtilityClass,

package/build/{index-6c98a490.js → index-1b2c9a99.js}

@@ -1,4 +1,4 @@
-import { b as a, B as e, g as l } from "./index-ce93f3a6.js";
+import { b as a, B as e, g as l } from "./index-6afb67dd.js";
 export {
   a as buttonClasses,
   e as default,

package/build/{index-a5d163ff.js → index-3e56055e.js}

@@ -1,4 +1,4 @@
-import { r as b, s as f, u as m, v as F, w as d, _ as C, x as l, y as n, z as T, A as v, C as x } from "./index-ce93f3a6.js";
+import { r as b, s as f, u as m, v as F, w as d, _ as C, x as l, y as n, z as T, A as v, C as x } from "./index-6afb67dd.js";
 function y(o) {
   return b("MuiTableFooter", o);
 }

package/build/{index-ea0cf155.js → index-50cab4e1.js}

@@ -1,4 +1,4 @@
-import { h as e, j as l, i as t } from "./index-ce93f3a6.js";
+import { h as e, j as l, i as t } from "./index-6afb67dd.js";
 export {
   e as default,
   l as getTableUtilityClass,

package/build/{index-203f7a6c.js → index-60c3bb23.js}

@@ -1,4 +1,4 @@
-import { r as p, s as b, u as m, v as H, w as C, _ as T, x as r, y as n, z as f, A as h, C as v } from "./index-ce93f3a6.js";
+import { r as p, s as b, u as m, v as H, w as C, _ as T, x as r, y as n, z as f, A as h, C as v } from "./index-6afb67dd.js";
 function x(e) {
   return p("MuiTableHead", e);
 }