@timum/booking 0.7.0 → 0.7.2

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.
@@ -0,0 +1,113 @@
1
+ <!DOCTYPE html>
2
+ <html>
3
+
4
+ <head>
5
+ <meta charset="UTF-8" />
6
+ <meta name="viewport" content="initial-scale=1, user-scalable=0, maximum-scale=1, minimum-scale=0.6" />
7
+ <title>timum single instance example</title>
8
+ </head>
9
+
10
+ <body>
11
+ <div id="bookingjs"></div>
12
+ <script type="text/javascript" src="../build/timum-booking.umd.cjs"></script>
13
+ <script type="text/javascript">
14
+ timum.init(
15
+ {
16
+ ref: 'booking-widget-demo-resource@timum',
17
+ fields: {
18
+ // set these fields to undefined explicitly in order to remove them
19
+ message: undefined,
20
+ mobile: undefined,
21
+ firstName: {
22
+ // index defines the order in which the fields get displayed
23
+ index: 0,
24
+ title: 'fields.firstName',
25
+ validation: timum.yup.string().required('validation.field_required'), // <- compare with key in localisation
26
+ },
27
+ lastName: {
28
+ index: 1,
29
+ title: 'fields.lastName',
30
+ validation: timum.yup.string().required('validation.field_required'),
31
+ },
32
+ email: {
33
+ index: 2,
34
+ title: 'fields.email',
35
+ format: 'email',
36
+ type: 'text',
37
+ validation: timum.yup
38
+ .string()
39
+ .email('validation.email_field_must_be_valid')
40
+ .required('validation.field_required'),
41
+ },
42
+ gender: {
43
+ index: 3,
44
+ // new language key
45
+ title: 'fields.gender.title',
46
+ // best for a limited number of predefined choices
47
+ type: 'select',
48
+ // could use 'validation.field_required' but
49
+ // for this example let's create a new key
50
+ validation: timum.yup.string().required('validation.gender_field_required'),
51
+ options: [
52
+ { key: 'm', title: 'fields.gender.male' },
53
+ { key: 'w', title: 'fields.gender.female' },
54
+ { key: 'd', title: 'fields.gender.other' },
55
+ ],
56
+ },
57
+ agbs: {
58
+ index: 4,
59
+ title: 'Datenschutzbestimmungen gelesen und akzeptiert.',
60
+ type: 'checkbox',
61
+ validation: timum.yup
62
+ .boolean()
63
+ .required('validation.field_required')
64
+ .test(
65
+ 'privacyAccepted',
66
+ 'validation.privacy_field_required',
67
+ (value) => value === true
68
+ ),
69
+ },
70
+ },
71
+
72
+ // now we need to add the new translation keys and their translations.
73
+
74
+ localization: {
75
+ de: {
76
+ validation: {
77
+ gender_field_required: 'Bitte wählen.'
78
+ },
79
+ fields: {
80
+ gender: {
81
+ title: 'Geschlecht',
82
+ male: 'Männlich',
83
+ female: 'Weiblich',
84
+ other: 'Divers'
85
+ },
86
+ }
87
+ },
88
+ en: {
89
+ validation: {
90
+ gender_field_required: 'Please select an option.'
91
+ },
92
+ fields: {
93
+ gender: {
94
+ title: 'Gender',
95
+ male: 'Male',
96
+ female: 'Female',
97
+ other: 'Others'
98
+ },
99
+ }
100
+ }
101
+ },
102
+
103
+ // the following callback consumes the customers input, allowing you to act on the entered gender value.
104
+ callback: {
105
+ createBookingStarted: ({ data }) => {
106
+ console.log(data.gender);
107
+ }
108
+ }
109
+ });
110
+ </script>
111
+ </body>
112
+
113
+ </html>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@timum/booking",
3
- "version": "0.7.0",
3
+ "version": "0.7.2",
4
4
  "license": "CC-BY-ND-4.0",
5
5
  "type": "module",
6
6
  "main": "build/timum-booking.umd.cjs",
@@ -1,16 +0,0 @@
1
- <!DOCTYPE html>
2
- <html>
3
- <head>
4
- <meta charset="UTF-8" />
5
- <meta
6
- name="viewport"
7
- content="initial-scale=1, user-scalable=0, maximum-scale=1, minimum-scale=0.6"
8
- />
9
- <title>timum single instance example</title>
10
- </head>
11
- <body>
12
- <div id="bookingjs"></div>
13
- <script type="text/javascript" src="../build/timum-booking.umd.js"></script>
14
- <script type="text/javascript"> timum.init({ref: "booking-widget-demo-resource@timum"}); </script>
15
- </body>
16
- </html>