@nuitee/booking-widget 1.0.11 → 1.0.13

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 (8) hide show
  1. package/README.md +3 -3
  2. package/dist/booking-widget-standalone.js +22 -2
  3. package/dist/booking-widget.css +12 -12
  4. package/dist/booking-widget.js +22 -2
  5. package/dist/core/styles.css +12 -12
  6. package/dist/react/styles.css +12 -12
  7. package/dist/vue/styles.css +12 -12
  8. package/package.json +1 -1
package/README.md CHANGED
@@ -94,15 +94,15 @@ widget.open();
94
94
  No bundler: load the script and CSS from the CDN, then create the widget.
95
95
 
96
96
  ```html
97
- <link rel="stylesheet" href="https://cdn.thehotelplanet.com/booking-widget/v1.0.11/dist/booking-widget.css">
98
- <script src="https://cdn.thehotelplanet.com/booking-widget/v1.0.11/dist/booking-widget-standalone.js"></script>
97
+ <link rel="stylesheet" href="https://cdn.thehotelplanet.com/booking-widget/v1.0.13/dist/booking-widget.css">
98
+ <script src="https://cdn.thehotelplanet.com/booking-widget/v1.0.13/dist/booking-widget-standalone.js"></script>
99
99
 
100
100
  <div id="booking-widget-container"></div>
101
101
 
102
102
  <script>
103
103
  const widget = new BookingWidget({
104
104
  containerId: 'booking-widget-container',
105
- cssUrl: 'https://cdn.thehotelplanet.com/booking-widget/v1.0.11/dist/booking-widget.css',
105
+ cssUrl: 'https://cdn.thehotelplanet.com/booking-widget/v1.0.13/dist/booking-widget.css',
106
106
  propertyKey: 'your-property-key',
107
107
  onOpen: () => console.log('Opened'),
108
108
  onClose: () => console.log('Closed'),
package/dist/booking-widget-standalone.js CHANGED
@@ -1434,8 +1434,28 @@ if (typeof window !== 'undefined') {
1434
1434
  render() {
1435
1435
  if (!this.widget) return;
1436
1436
  var installerBg = this._rawInstallerColors && this._rawInstallerColors.background != null && String(this._rawInstallerColors.background).trim() !== '';
1437
- if (this._configState !== 'loaded' && !installerBg) this.widget.style.setProperty('--bg', '#222222');
1438
- else this.widget.style.removeProperty('--bg');
1437
+ if (this._configState !== 'loaded' && !installerBg) {
1438
+ var preloadVars = {
1439
+ '--bg': '#222222',
1440
+ '--fg': '#ffffff',
1441
+ '--card': '#222222',
1442
+ '--card-solid': '#222222',
1443
+ '--card-fg': '#ffffff',
1444
+ '--primary': '#AA8453',
1445
+ '--primary-fg': '#ffffff',
1446
+ '--secondary': '#2a2a2a',
1447
+ '--secondary-fg': '#f1f1f1',
1448
+ '--muted': '#b8b8b8',
1449
+ '--border': '#3a3a3a',
1450
+ '--input-bg': '#2a2a2a',
1451
+ };
1452
+ Object.keys(preloadVars).forEach((k) => this.widget.style.setProperty(k, preloadVars[k]));
1453
+ } else {
1454
+ [
1455
+ '--bg', '--fg', '--card', '--card-solid', '--card-fg', '--primary', '--primary-fg',
1456
+ '--secondary', '--secondary-fg', '--muted', '--border', '--input-bg',
1457
+ ].forEach((k) => this.widget.style.removeProperty(k));
1458
+ }
1439
1459
  this.renderStepIndicator();
1440
1460
  this.renderPropertyKeyMessage();
1441
1461
  this.renderStepContent();
package/dist/booking-widget.css CHANGED
@@ -78,18 +78,18 @@
78
78
  /* ===== CSS Variables ===== */
79
79
  .booking-widget-modal {
80
80
  /* Default colors - can be overridden via inline styles */
81
- --bg: hsl(30, 10%, 8%);
82
- --fg: hsl(40, 20%, 90%);
83
- --card: hsl(30, 8%, 12%);
84
- --card-solid: hsl(30, 8%, 12%);
85
- --card-fg: hsl(40, 20%, 90%);
86
- --primary: hsl(38, 60%, 55%);
87
- --primary-fg: hsl(30, 10%, 8%);
88
- --secondary: hsl(30, 6%, 18%);
89
- --secondary-fg: hsl(40, 15%, 80%);
90
- --muted: hsl(30, 10%, 55%);
91
- --border: hsl(30, 8%, 22%);
92
- --input-bg: hsl(30, 8%, 14%);
81
+ --bg: #222222;
82
+ --fg: #ffffff;
83
+ --card: #222222;
84
+ --card-solid: #222222;
85
+ --card-fg: #ffffff;
86
+ --primary: #AA8453;
87
+ --primary-fg: #ffffff;
88
+ --secondary: #2a2a2a;
89
+ --secondary-fg: #f1f1f1;
90
+ --muted: #b8b8b8;
91
+ --border: #3a3a3a;
92
+ --input-bg: #2a2a2a;
93
93
  --font-serif: 'Playfair Display', Georgia, serif;
94
94
  --font-sans: 'Inter', system-ui, sans-serif;
95
95
  --radius: 0.75em;
package/dist/booking-widget.js CHANGED
@@ -648,8 +648,28 @@ class BookingWidget {
648
648
  window.__bookingWidgetRendering = true;
649
649
  try {
650
650
  const installerBg = this._rawInstallerColors && this._rawInstallerColors.background != null && String(this._rawInstallerColors.background).trim() !== '';
651
- if (this._configState !== 'loaded' && !installerBg) this.widget.style.setProperty('--bg', '#222222');
652
- else this.widget.style.removeProperty('--bg');
651
+ if (this._configState !== 'loaded' && !installerBg) {
652
+ const preloadVars = {
653
+ '--bg': '#222222',
654
+ '--fg': '#ffffff',
655
+ '--card': '#222222',
656
+ '--card-solid': '#222222',
657
+ '--card-fg': '#ffffff',
658
+ '--primary': '#AA8453',
659
+ '--primary-fg': '#ffffff',
660
+ '--secondary': '#2a2a2a',
661
+ '--secondary-fg': '#f1f1f1',
662
+ '--muted': '#b8b8b8',
663
+ '--border': '#3a3a3a',
664
+ '--input-bg': '#2a2a2a',
665
+ };
666
+ Object.keys(preloadVars).forEach((k) => this.widget.style.setProperty(k, preloadVars[k]));
667
+ } else {
668
+ [
669
+ '--bg', '--fg', '--card', '--card-solid', '--card-fg', '--primary', '--primary-fg',
670
+ '--secondary', '--secondary-fg', '--muted', '--border', '--input-bg',
671
+ ].forEach((k) => this.widget.style.removeProperty(k));
672
+ }
653
673
  this.renderStepIndicator();
654
674
  this.renderPropertyKeyMessage();
655
675
  this.renderStepContent();
package/dist/core/styles.css CHANGED
@@ -78,18 +78,18 @@
78
78
  /* ===== CSS Variables ===== */
79
79
  .booking-widget-modal {
80
80
  /* Default colors - can be overridden via inline styles */
81
- --bg: hsl(30, 10%, 8%);
82
- --fg: hsl(40, 20%, 90%);
83
- --card: hsl(30, 8%, 12%);
84
- --card-solid: hsl(30, 8%, 12%);
85
- --card-fg: hsl(40, 20%, 90%);
86
- --primary: hsl(38, 60%, 55%);
87
- --primary-fg: hsl(30, 10%, 8%);
88
- --secondary: hsl(30, 6%, 18%);
89
- --secondary-fg: hsl(40, 15%, 80%);
90
- --muted: hsl(30, 10%, 55%);
91
- --border: hsl(30, 8%, 22%);
92
- --input-bg: hsl(30, 8%, 14%);
81
+ --bg: #222222;
82
+ --fg: #ffffff;
83
+ --card: #222222;
84
+ --card-solid: #222222;
85
+ --card-fg: #ffffff;
86
+ --primary: #AA8453;
87
+ --primary-fg: #ffffff;
88
+ --secondary: #2a2a2a;
89
+ --secondary-fg: #f1f1f1;
90
+ --muted: #b8b8b8;
91
+ --border: #3a3a3a;
92
+ --input-bg: #2a2a2a;
93
93
  --font-serif: 'Playfair Display', Georgia, serif;
94
94
  --font-sans: 'Inter', system-ui, sans-serif;
95
95
  --radius: 0.75em;
package/dist/react/styles.css CHANGED
@@ -78,18 +78,18 @@
78
78
  /* ===== CSS Variables ===== */
79
79
  .booking-widget-modal {
80
80
  /* Default colors - can be overridden via inline styles */
81
- --bg: hsl(30, 10%, 8%);
82
- --fg: hsl(40, 20%, 90%);
83
- --card: hsl(30, 8%, 12%);
84
- --card-solid: hsl(30, 8%, 12%);
85
- --card-fg: hsl(40, 20%, 90%);
86
- --primary: hsl(38, 60%, 55%);
87
- --primary-fg: hsl(30, 10%, 8%);
88
- --secondary: hsl(30, 6%, 18%);
89
- --secondary-fg: hsl(40, 15%, 80%);
90
- --muted: hsl(30, 10%, 55%);
91
- --border: hsl(30, 8%, 22%);
92
- --input-bg: hsl(30, 8%, 14%);
81
+ --bg: #222222;
82
+ --fg: #ffffff;
83
+ --card: #222222;
84
+ --card-solid: #222222;
85
+ --card-fg: #ffffff;
86
+ --primary: #AA8453;
87
+ --primary-fg: #ffffff;
88
+ --secondary: #2a2a2a;
89
+ --secondary-fg: #f1f1f1;
90
+ --muted: #b8b8b8;
91
+ --border: #3a3a3a;
92
+ --input-bg: #2a2a2a;
93
93
  --font-serif: 'Playfair Display', Georgia, serif;
94
94
  --font-sans: 'Inter', system-ui, sans-serif;
95
95
  --radius: 0.75em;
package/dist/vue/styles.css CHANGED
@@ -78,18 +78,18 @@
78
78
  /* ===== CSS Variables ===== */
79
79
  .booking-widget-modal {
80
80
  /* Default colors - can be overridden via inline styles */
81
- --bg: hsl(30, 10%, 8%);
82
- --fg: hsl(40, 20%, 90%);
83
- --card: hsl(30, 8%, 12%);
84
- --card-solid: hsl(30, 8%, 12%);
85
- --card-fg: hsl(40, 20%, 90%);
86
- --primary: hsl(38, 60%, 55%);
87
- --primary-fg: hsl(30, 10%, 8%);
88
- --secondary: hsl(30, 6%, 18%);
89
- --secondary-fg: hsl(40, 15%, 80%);
90
- --muted: hsl(30, 10%, 55%);
91
- --border: hsl(30, 8%, 22%);
92
- --input-bg: hsl(30, 8%, 14%);
81
+ --bg: #222222;
82
+ --fg: #ffffff;
83
+ --card: #222222;
84
+ --card-solid: #222222;
85
+ --card-fg: #ffffff;
86
+ --primary: #AA8453;
87
+ --primary-fg: #ffffff;
88
+ --secondary: #2a2a2a;
89
+ --secondary-fg: #f1f1f1;
90
+ --muted: #b8b8b8;
91
+ --border: #3a3a3a;
92
+ --input-bg: #2a2a2a;
93
93
  --font-serif: 'Playfair Display', Georgia, serif;
94
94
  --font-sans: 'Inter', system-ui, sans-serif;
95
95
  --radius: 0.75em;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@nuitee/booking-widget",
3
- "version": "1.0.11",
3
+ "version": "1.0.13",
4
4
  "description": "A beautiful, customizable booking widget modal that can be embedded in any website. Supports vanilla JavaScript, React, and Vue.js.",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.esm.js",